/*
#F28DD7	
#F2BDEF	
#F2DFF2	
#F2F2F2	
#0D0D0D
#E6F2DF
*/

@media screen and (min-width: 1001px) {.small {width:90%; height: 500px; max-width: 1200px; background-color:lightgray;margin: auto; padding :20px;border-radius: 60px ;display: flex;flex-direction: row;align-items: center; box-sizing: border-box}
.small img {;max-width:50%;height: auto; flex:0;margin-right: 20px;border-radius: 20px}
.small p {font-size: 26pt; text-align: left;flex:1
;margin: 0}.homebanner h2 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color:#F28DD7;z-index: 2}}

    @media screen and (max-width:1000px) {.small {width:90%; height: 500px; max-width: 1200px; background-color:lightgray;margin: auto; padding :20px;border-radius: 60px ;display: flex;flex-direction:row;align-items: center; box-sizing: border-box}
.small img {;max-width:50%;height: auto; flex:0;margin-right: 20px; border-radius: 20px}
.small p {font-size: 26pt; text-align: left;flex:1
;margin: 0}.homebanner h2 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color:#F28DD7;z-index: 2}}
    
    @media screen and (max-width:700px) {.small {width:90%; height: 600px; max-width: 1200px; background-color:lightgray;margin: auto; padding :20px;border-radius: 60px ;display: flex;flex-direction:column;align-items:stretch; box-sizing: border-box}
.small img {;max-width:80%;height: auto; flex:0;margin:10%;border-radius: 20px}
.small p {font-size: 26pt; text-align: left;flex:1
    ;margin: 0}.homebanner h2 {position: absolute; top: 10%; left: 50%; transform: translate(-50%, -50%); color:#F28DD7;z-index: 2;font-size: 12pt}}

/*nav*/
nav {margin:20px 0;background-color: #f2f2f2;font-family: "Sour Gummy", sans-serif;font-weight: 400;font-style: normal;font-size: 12pt;z-index: 20;display: flex;align-items:center;justify-content: space-between;padding: 0 30px;box-sizing: border-box;width: 100%}
nav ul {padding-left:0;margin:0;list-style:none;display: flex;flex-flow: nowrap;margin-left: auto}
nav ul li {margin:0px -7px 0 0;display:block;background-color:#f2f2f2;position: relative}
nav a {display:block;padding:0 10px;font-size:10.5px;line-height:60px;text-decoration: none; color:#F28DD7}
nav a:hover {background: #d3d3d3}
nav ul ul {display: none;position: absolute;top: 100%; }
nav ul li:hover > ul {display: inherit;z-index: 10;opacity: .9; }
nav ul ul li {min-width: 100px;display: list-item;position: relative;}
nav img {width: 100%;height: auto;flex-shrink: 0;max-width:100px;min-width: 50px;padding-top:30px}

.homebanner {position: relative;width: 100%;text-align: center;margin-top: 50px}
.homebanner img {width:100%;height: auto;display: block;opacity: .7;z-index: 1;position: relative}


.fs {max-height: 1000px; height: 100%;min-width:300px}
.fs .featured {display: flex; justify-content: space-between;flex-wrap: wrap; max-height: 500px; margin-bottom: 5%;}
.fs .featured div {transition: transform 0.5s;background-color: #F2F2F2; width:30%;height:450;align-items: stretch; border-radius: 25px;margin:20px 0}
.fs .featured img {width:80%;height: auto; margin: 10%;margin-bottom: 2%}
.fs .featured p {text-align:center;height: 7.5% }
.fs .featured h2 {text-align: center;padding: 0} 
.fs .featured div:hover { transform: scale(1.1);}

.seasonal {background-color:#F2f2f2; padding: 20px;border-radius: 20px;margin-top:50px	}
.seasonal h2 {font-size:10pt}

footer {background-color: #f2dff2; padding:1px 10px;margin-top: 75px;border-radius: 20px}
footer img {width:10%;margin: 10px}
footer p {text-align: center}
footer ul {display:inline;float: right; margin-right:40px;  list-style: none;
  padding: 0; }

h1, h2, h3 { font-family: "Delius", cursive; padding-left: 40px;margin-top: 40px}
#welcome h2 {padding: 0px;padding-top:40px}
#welcome p {;width:80%;padding: 15px 0;}
#welcome div h2 {padding-left: 10%}
.many {min-width: 350px;width: 50%;margin: 0 auto ;text-align: center}

.order {width: 90%;margin:20px auto;height: auto;background-color:#d3d3d3; border-radius: 25px;max-width:450px; }
.order img {width:90%;height: auto;margin:10px 5% }
img {border-radius:10px}


.occasions {width:80%;min-width: 300px;margin: 50px 10%;padding-top:40px}
.occasions div {width:30%; height: auto;background-color:#d3d3d3;max-width: 150px;max-height:500px;border-radius:25px;float: left;margin-right: 20px}
.occasions img {height:auto ;width: 80%;margin:10%;}
.occasions p {font-family: "Comic Relief";padding-left:20px;}

.p-body p {font-family: "Comic Relief";padding-left:20px;margin-left: 10%}
.p-body h1 {padding-left:20px;margin-left: 10%}

.split {width:40%;margin:20px 5%; float: left;height: auto }
.split li {margin-bottom:15px;font-family: "Comic Relief"} 
.split lable {width:25px;font-family: "Comic Relief"}
.split input, select {width: calc((100%-25) /2);max-width: 100px;height: auto;  }

.delivery p {font-family: "Comic Relief";padding-left:20px;margin-left: 10%}
.delivery h3, h1 {padding-left:20px;margin-left: 8%}

.timeprice p {font-family: "Comic Relief";padding-left:20px;margin:0 10%;}
.timeprice h2 {padding-left:20px;margin:5px 8%;}

.contact div {width:80%;background-color: #f2f2f2;border-radius: 10px;margin: 10px 8%;padding: 10px 2%}
.contact p {font-family: "Comic Relief";padding-left:20px;margin-left: 10%}
.contact h3 {;padding-left:20px;margin-left: 10%}

footer a {font-family: font-family: "Sour Gummy", sans-serif;color:black;text-decoration: none }
footer a:hover {font-family: font-family: "Sour Gummy", sans-serif;color:black; text-decoration: underline}