*
                      {
                        box-sizing: border-box;
                      }
@font-face
                      {
                        font-family: inter-semibold; src: url(fonts/Inter-SemiBold.ttf);
                      }  
@font-face 
                      {
                        font-family: inter-thin; src: url(fonts/Inter-Thin.ttf);
                      }   
@font-face 
                      {
                        font-family: vidaloka-regular; src: url(fonts/Vidaloka-Regular.ttf);
                      }                       

header 
                      {
                        margin: 0;
                        justify-content: center;

                      }  
header ul
                      {
                        list-style-type: none;
                        display: grid;
                        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
                        width: 80%;
                        justify-content: space-around;
                        margin-left: auto;
                        margin-right: auto;
                      }   
header li
                      {
                        justify-content: space-evenly;
                        font-family: inter-semibold, sans-serif;
                      }  
header a
                      {
                        text-decoration: none;
                        color: #a1bd2e;
                      } 
#logo            
                      {
                        position: relative;
                        bottom: 0;
                      }                                                                                         
nav
                      {
                        display: flex;
                        flex-wrap: wrap;
                      }          
nav ul
                      {
                        list-style-type: none;
                        display: inline-flex;
                        background-color: #c900ae;
                        width: 100%;
                        justify-content: space-around;
                        padding-left: 20vw;
                        padding-right: 20vw; 
                        margin-bottom: 0%;   
                        font-family: inter-semibold, sans-serif;

                      }  
                        
nav li
                      {
                        padding: 15px;
                        margin-bottom: 0%;
                      }   
nav a 
                      {
                        text-decoration: none;
                        margin-bottom: 0%;
                        color: white;

                      }  
#main
                      {
                        background-image: url(images/Hero_ice_cream.jpg);
                        background-size: 100%;
                        background-repeat: no-repeat;
                        background-origin: border-box;
                        height: 660px;
                        
                      }       
main h1
                      {
                        margin-top: 0%;
                        text-align: left;
                        padding-top: 10px;
                        font-size: 300%;
                        font-family: vidaloka-regular;
                        font-weight: lighter;
                      }  
.button
                      {
                        background-color: #c900ae;
                        padding: 1% 3% 1% 3%;
                        text-decoration: none;
                        font-family: vidaloka-regular;
                        color: white;

                      }                         
main a
                      {
                        background-color: #a1bd2e;
                        text-decoration: none;
                        padding: 3% 8% 3% 8%;

                      }   
#hero
                      {
                        margin-left: 10%;
                        padding-top: 15%;
                        position: relative;
                        left: 2vw;
                      }   
#pinkstripe
                      {
                        background-color: #c900ae;
                        display: flex;
                        width: 100%;
                        padding: 2%;
                        margin-left: auto;
                        margin-right: auto;
                        justify-content: center;
                        justify-content: space-around;
                      }    
#pinkstripe div
                       {
                        width: 20%;
                        text-align: left;
                        color: white;
                        font-family: inter-thin;
                        font-weight: bold;
                       }     
#ourstory
                        {
                         justify-content: center;
                        }                                        
#ourstory h4
                        {
                         font-family: inter-thin;
                         color: #c900ae;
                         text-align: right;
                         width: 15%;
                         position: relative;
                         left: 34%;
                         margin-bottom: 0%;



                        }    
#ourstory div
                        {
                          display: grid;
                          grid-template-columns: 1fr 1fr;
                          padding-left: 8%;
                          padding-right: 8%;
                          gap: 20px;
                          margin: 0%;

                          
                        }                                                          
#ourstory h1
                        {
                          font-family: vidaloka-regular;
                          color: #c900ae;
                          text-align: right;
                          

                        }
#ourstory p
                        {
                          font-family: inter-thin;
                          color: #c900ae;
                          font-weight: 600;
                          padding-top: 1vw;

                        }   
.flavor 
                        {
                          color: #a1bd2e;
                          font-family: inter-semibold;
                          margin-left: 10%;
                        }
.flavortext
                        {
                          margin-left: 10%;
                        }  
.flavorgallery
                        {
                          display: flex;
                          justify-content: center;
                        }  
.flavorgallery img
                        {
                          width: 15%;
                          flex-wrap: wrap;
                        }
#flavoroftheday
                        {
                          background-color: #ff9f40;
                          width: 100%;
                          display: flex;
                        }  
#flavoroftheday div
                        {
                          text-align: left;
                          padding-left: 10%;
                          color: white;
                          font-family: inter-thin;
                          font-weight: 600;                          
                        }      
#flavoroftheday img
                        {
                          height: 20%;
                          width: 20vw;
                          margin-left: 20%;
                          overflow: hidden;
                        }
.specialty h2
                        {
                          color: #c900ae;
                          text-align: center;
                          font-family: inter-thin;
                          font-weight: 700;
                          padding-top: 4vh;
                          margin-top: 0%;

                          
                        }                 
.specialty h1
                        {
                          color: #c900ae;
                          text-align: center;
                          font-family: vidaloka-regular;
                          margin: 0%;
                        }
#cakes
                        {
                          background-color: #eef3da;
                          margin-top: 0;
                          padding-bottom: 4vh;
                        }                                              
.cakegallery
                        {
                          display: flex;
                          gap: 15px;
                          justify-content: center;
                          margin: 4vh;
                        }            
.cakegallery img
                        {
                          width: 25%;
                          border: 5px #ff9f40 ridge;
                          height: 25%; 
                          margin-bottom: 0%;     
                        }
.caketext
                        {
                          display: flex;
                          justify-content: center;
                        }    
.caketext div
                        {
                          width: 25%;
                          text-align: center;
                          padding-left: 2%;
                          padding-right: 2%;
                          margin-top: 0%;
                          font-family: inter-thin;
                          font-weight: 600;
                        }                  
.caketext p
                        {
                          font-size: 80%;
                        }  
.caketext a
                        {
                          margin-top: 3%;
                          color: white;
                        }
.greenstripe 
                         {
                          background-color:  #e3eac4;
                          display: flex;
                          padding: 8vh;
                          justify-content: center;
                          gap: 5%;
                          width: 100%;
                         }    
.greenstripe div
                         {
                          width: 25%;
                          text-align: center;
                          font-family: inter-semibold;
                          color: #c900ae;
                          font-size: 110%;
                         } 
#balloons
                         {
                          background-image: url(images/Balloon-bouquet-11_-pastels.jpg);
                          background-repeat: no-repeat;
                          background-clip: content-box;
                         }                        
#topsection
                         {
                          display: flex;
                          margin-top: 10vh;
                         }
#topsection img
                         {
                          width: 50%;
                         }    
#topsection span
                         {
                          text-align: right;
                          font-family: inter-thin;
                          color: #c900ae;
                         }                                                                            
#topsection h1
                         {
                          color: #c900ae;
                          text-align: right;
                          padding-right: 4vw;
                         }
#middlesection
                         {
                          display: flex;
                          justify-content: center;
                          margin-top: 8vh;
                         }        
#middlesection img
                         {
                          height: auto;
                          padding-left: 8vw;
                          width: 30%;
                         }    
#middlesection p
                         {
                          width: 50%;
                          padding-left: 8vw;
                          font-family: inter-thin;
                          font-weight: 600;
                          padding-top: 10vh;
                         }  
footer
                         {
                          background-color: #c900ae;
                          text-align: center;
                         } 
footer h1 
                         {
                          color: #eb9ee0;
                          text-align: center;
                          font-family: inter-semibold;
                          margin-bottom: 1%;
                         }   
footer h3
                         {
                          color: white;
                          font-family: inter-thin;
                          font-weight: 600;
                          margin-top: 0%;
                          text-align: left;
                          padding-left: 45%;
                         }                         
#address
                         {
                          display: flex;
                          justify-content: space-around;
                          flex-wrap: wrap;
                          padding-bottom: 4vh;
                          font-family: inter-thin;
                         }                   
#address p
                         {
                          color: #ff9f40;
                         }     
#address a
                         {
                          color: white;
                          font-weight: 700;
                         }
#footernav
                         {
                          display: flex;
                          justify-content: space-around;
                          flex-wrap: wrap;
                          background-color: white;
                         }
#footernav div
                         {
                          width: 20%;
                          padding-top: 7vh;
                         }           
#footernav img
                         {
                          width: 20%;
                         }    
#footernav ul
                         {
                          display: inline-flex;
                          width: 60%;
                          list-style-type: none;
                          padding-top: 8vh;
                         }                                                                             
#footernav li
                         {
                          color: #c900ae;
                          font-family: inter-semibold;
                          padding-left: 3vw;
                          padding-right: 3vw;

                         }

