/*
font-family: baskerville-display-pt,serif;
font-weight: 400;
font-style: normal;

font-family: 'montserrat' ,sans-serif;
font-weight: 400;
font-style: normal;

font-family: 'brush-script-std',sans-serif;
font-weight: 400;
font-style: normal;

font-family: playfair-display,serif;
font-weight: 900;
font-style: normal;

font-family: baskerville-urw,serif;
font-weight: 400;
font-style: italic;
*/

*{  
    
    box-sizing: border-box;
}
body{font-size: 100%;}
img{max-width: 100%;}

a[href^=tel]{ color:#000; text-decoration:none;}

.addressbar {
    width: 100%;
    height: 40px;
    background-color: #FBF5DB;
}

.addressbar p {
    font-size: 14pt;
    font-family: 'baskerville-display-pt', serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    padding-top: 10px;
}

header {
    width: 100%;
    height: auto;
    overflow: hidden;
}

video {
    width: 100%;
    position: relative;
}

.mobilelogo {
    display: none;
}

.desktopnav {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width:100%;
    position:absolute;
    text-align: center;
    z-index:0;
    top:50px;
    align-items: top;
}

.navone {
   display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 40%;
    margin-top: 30px;
}

.logo {
    padding-top: 10px;
    width: 20%;
}

.navtwo {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 40%;
    margin-top: 30px;
}

.desktopnav a {
    text-decoration: none;
    font-family: 'montserrat' ,sans-serif;
    font-weight: 400;
    font-style: normal;
    color: black;
    font-size: 26px;
}

.desktopnav a:hover {
    color: #ff7d7d;
    cursor: pointer;
    font-size: 28px;
    font-size-adjust: 60px;
    transition: all .3s ease-in;
}

.desktopnav a img:hover {
    opacity: 60%;
}

.ones {
    animation-delay: 1s;
}

.greetings {
    font-family: 'brush-script-std',sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #191B4C;
    font-size: 70px;
    margin-top: 50px;
    padding-left: 30px;
    transform: rotate(-5deg);
}

.cafename {
    width: 90%;
    margin: auto;
    margin-top: -30px;
}

.pcb {
    font-family: 'brush-script-std',sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #191B4C;
    font-size: 60px;
    text-align: right;
    padding-right: 30px;
    margin-top: -50px;
}

.sunlineone {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
}

.lineone {
    width: 50%;
}

.sunone {
    width: 10%;
}

.sunone img {
    -moz-animation: 15.0s rotateRight infinite linear; 
    -webkit-animation: 15.0s rotateRight infinite linear; 
}

img {}

@-moz-keyframes rotateRight{
    0% { -moz-transform: rotate(0deg); -moz-transform-origin: 50% 50%; }
    100% { -moz-transform: rotate(360deg); }
}

@-webkit-keyframes rotateRight{
    0% { -webkit-transform: rotate(0deg); -webkit-transform-origin: 50% 50%; }
    100%{ -webkit-transform: rotate(360deg); }
}

.linetwo {
    width: 40%;
}

.menusection {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.sectionimage {
    width: 50%;
    margin: auto;
    padding-left: 90px;
}

.sectiontext {
    width: 50%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: auto;
}

.sectiontext p {
    font-family: 'montserrat',sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 23px;
    width: 80%;
    margin-top: 80px;
    line-height: 35px;
    margin-bottom: 20px;
}

.outer {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
}
  
.outer__button { 
    height: 70px;
    width: 240px;
    margin: 10px 7px;
    padding: 5px 5px;
    font-size: 27px;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    color: #000;
    text-transform: uppercase;
    border-radius: 20px;
    text-align: center;
}

.button__bottom-top {
    border: 2px solid #97D5D5;
    background: linear-gradient(to top, #97D5D5 50%, #fff 50%);
    color: #1B7570;
    background-size: 100% 200%;
    background-position: top;
    transition: all .30s ease-out;
    margin-left: 150px;
}
  
.button__bottom-top:hover {
    border: 2px solid #97D5D5;
    background-position: bottom;
    color: #fff;
    cursor: pointer;
}

.bakerysection {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: #ffeee6;
    width: 98%;
    margin: auto;
    height: 620px;
    align-items: center;
    margin-top: 50px;
}

.sectiontexttwo {
    width: 50%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: auto;
    padding-left: 80px;
}

.sectiontexttwo p {
    font-family: 'montserrat',sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 23px;
    width: 90%;
    margin-top: 80px;
    line-height: 35px;
    margin-bottom: 20px;
}

.outertwo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: auto;
}

.outertwo__buttontwo { 
    height: 70px;
    width: 240px;
    margin: 10px 7px;
    padding: 5px 5px;
    font-size: 27px;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    color: #f58d8d;
    text-transform: uppercase;
    border-radius: 20px;
    text-align: center;
}

.buttontwo__bottomtwo-toptwo {
    border: 2px solid #f58d8d;
    background: linear-gradient(to top, #f58d8d 50%, #ffeee6 50%);
    color: #de5f5f;
    background-size: 100% 200%;
    background-position: top;
    transition: all .30s ease-in;
    margin-left: 180px;
}
  
.buttontwo__bottomtwo-toptwo:hover {
    border: 2px solid #f58d8d ;
    background-position: bottom;
    color: #fff;
    cursor: pointer;
}

.sectionimagetwo {
    width: 50%;
}

.aboutsection {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 50px;
}

.outerthree {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
}

.outerthree__buttonthree { 
    height: 70px;
    width: 240px;
    margin: 10px 7px;
    padding: 5px 5px;
    font-size: 27px;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    color: #f58d8d;
    text-transform: uppercase;
    border-radius: 20px;
    text-align: center;
}
  
.buttonthree__bottomthree-topthree {
    border: 2px solid #539b9a;
    background: linear-gradient(to top, #539b9a 50%, #fff 50%);
    color: #043530;
    background-size: 100% 200%;
    background-position: top;
    transition: all .30s ease-in;
    margin-left: 150px;
}
  
.buttonthree__bottomthree-topthree:hover {
    border: 2px solid #539b9a;
    background-position: bottom;
    color: #fff;
    cursor: pointer;
}

.text {
    padding-top: 15px;
}
.text a {
    text-decoration: none;
    color: #1b7570;
    transition: all .3s ease-in; 
}

.text a:hover {
    color: white;
}

.textt {
    padding-top: 15px;
}
.textt a {
    text-decoration: none;
    color: #de5f5f;
    transition: all .3s ease-in; 
}

.textt a:hover {
    color: white;
}

.texttt {
    padding-top: 15px;
}
.texttt a {
    text-decoration: none;
    color: #043530;
    transition: all .3s ease-in; 
}

.texttt a:hover {
    color: white;
}

.sunlinetwo {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-top: 20px;
}

.linethree {
    width: 45%;
}

.suntwo {
    width: 10%;
}

.suntwo img {
    -moz-animation: 15.0s rotateRight infinite linear; 
    -webkit-animation: 15.0s rotateRight infinite linear; 
}

img {}

@-moz-keyframes rotateRight{
    0% { -moz-transform: rotate(0deg); -moz-transform-origin: 50% 50%; }
    100% { -moz-transform: rotate(360deg); }
}

@-webkit-keyframes rotateRight{
    0% { -webkit-transform: rotate(0deg); -webkit-transform-origin: 50% 50%; }
    100%{ -webkit-transform: rotate(360deg); }
}

.carousel-cell {
    width: 32%;
    height: 400px;
    align-items: center;
    border-style: solid;
    border-color: black;
    border-width: 0 1px 0 0;
}

.slider {
    width: 100%;
    margin-top: 20px;
}

.carousel {
    width: 100%;
    margin: auto;
}

.review {
    font-family: 'montserrat' ,sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    text-align: center;
    margin: auto;
    line-height: 30px;
    width: 380px;
    margin-top: 40px;
}

.quote {
    font-family: 'playfair-display',serif;
    font-weight: 900;
    font-style: normal;
    font-size: 90px;
    color: #191B4C;
    position: absolute;
    left: 0;
    text-align: left;
    padding-left: 20px;
    
}
    
.quotetwo {
    font-family: 'playfair-display',serif;
    font-weight: 900;
    font-style: normal;
    font-size: 90px;
    color: #191B4C;
    position: absolute;
    right: 0;
    text-align: right;
    padding-right: 30px;
}

.reviewname {
    font-family: 'baskerville-display-pt', serif;
    font-weight: 700;
    font-style: normal;
    font-size: 31px;
    text-align: center;
    margin-top: 10px;
}

.reviewstars {
    text-align: center;
    margin-bottom: 40px;
}

footer {
    width: 100%;
    max-width: 100%;
    height: 350px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 80px;
    background: linear-gradient(-45deg, #fff6ce, #FBF5DB, #ffc9af, #97D5D5, #FBF5DB, #fff6ce) ;
    background-size: 400% 400%;
    animation: gradient 13s ease infinite;
    }
    
 @keyframes gradient {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        } 
}


.footerlogo {
    margin-top: 40px;
}

.footerinfo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 50%;
    margin-top: 60px;
}

.footertext {
    font-size: 16pt;
    font-family: 'baskerville-display-pt', serif;
    font-weight: 700;
    font-style: normal;
    text-align: right;
}

.address {
    text-align: right;
    padding-left: 160px;
}

.hours {
    text-align: right;
}

.socials {
    text-align: right;
    margin-top: -30px;
}

.socials img {
    margin-left: 40px;
}

.socials img:hover {
    opacity: 60%;
    transition: all .2s ease-in;
}

footer p {
    text-align: center;
    margin-top: 35px;
}

footer a {
    text-decoration: none;
}

/* BAKERY PAGE */

 .bakeryhero {
    background-image: url(images/bakeryhero-100.jpg);
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    height: 700px;
}

h2 {
    font-family: 'brush-script-std',sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 120px;
    margin-top: 50px;
    color: #191b4c;
    text-align: center;

}

.pasterysection {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 95%;
    background-color: #fbf5db;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 50px;
}

.cake {
    margin-top: 40px;
}

.sideone {
    width: 45%;
    margin-top: 10px;
}

.sidetwo {
    width: 45%;
    margin-top: 10px;
}

.menu-item {
    margin: 35px 0;
    font-size: 24px;
  }
  
  .menu-item-name{
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    border-bottom: 2px dotted rgb(0, 0, 0);
  }
  
  .menu-item-description {
    font-style: italic;
    font-size: .9em;
    line-height: 1.5em;
  }
  
  .menu-item-price{
    float: right;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    margin-top: -22px;
  }

  .cakes p {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    font-size: 22px;
    padding-left: 40px;
    margin-bottom: 50px;
  }

  .cakeone {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
  }

  .caketwo {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
  }

  .bakerycake {
    width: 19%;
    padding:  5px 0 5px 0;
  }

  /* MENU PAGE */

  .menuhero {
    background-image: url(images/menuhero-100.jpg);
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    height: 700px;
}

h3 {
    font-family: 'baskerville-urw',serif;
    font-weight: 400;
    font-style: italic; 
    text-align: center;
    font-size: 40px;
}

.outerfour {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
}

.outerfour__buttonfour { 
    height: 70px;
    width: 240px;
    margin: 10px 7px;
    padding: 5px 5px;
    font-size: 27px;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    color: #f58d8d;
    text-transform: uppercase;
    border-radius: 20px;
    text-align: center;
}
  
.buttonfour__bottomfour-topfour {
    border: 2px solid #f58d8d;
    background: linear-gradient(to top, #f58d8d 50%, white 50%);
    color: #de5f5f;
    background-size: 100% 200%;
    background-position: top;
    transition: all .30s ease-in;
    margin: auto;
    margin-top: 30px;
}
  
.buttonfour__bottomfour-topfour:hover {
    border: 2px solid #f58d8d ;
    background-position: bottom;
    color: #fff;
    cursor: pointer;
}

.textttt {
    padding-top: 15px;
}
.textttt a {
    text-decoration: none;
    color: #de5f5f;
    transition: all .3s ease-in; 
}

.textttt a:hover {
    color: white;
}

.menusun {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 40px;
    max-width: 100%;
}

.menulineone {
    width: 65%;
}

.menulinetwo {
    width: 25%;
}

.menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around; 

}

.menuleft {
width: 45%;
}

.menuright {
    width: 45%;
}

.menuleft p {
    font-size: 30px;
}

.menuright p {
    font-size: 30px;
}

.menucaption {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    margin-top: 10px;
    padding-left: 10px;
}

/* ABOUT PAGE */

.abouthero {
    background-image: url(images/abouthero-100.jpg);
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    height: 700px;
}

.aboutsunline {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 40px;
}
    
.aboutlineone {
    width: 15%;
}
    
.aboutlinetwo {
    width: 75%;
}


.mainabout {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 98%;
    margin: auto;
    margin-top: 20px;
}

.aboutimage {
    width: 32%;
}

.abouttext {
    width: 60%;
    padding-left: 10px;
}

.abouttext p {
    font-family: 'montserrat' ,sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 26px;
    line-height: 40px;
}

.secondhalf {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: #D8F0F7;
    margin-top: 60px;
}

.aboutfoodpics {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 40px;
}

.aboutfood {
    width: 30%;
}

.outerfive {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
}

.outerfive__buttonfive { 
    height: 70px;
    width: 280px;
    margin: 10px 7px;
    padding: 5px 5px;
    font-size: 27px;
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    color: #00B1DD;
    text-transform: uppercase;
    border-radius: 20px;
    text-align: center;
}
  
.buttonfive__bottomfive-topfive {
    border: 2px solid #00B1DD;
    background: linear-gradient(to top, #00B1DD 50%, #D8F0F7 50%);
    color: #0093B5;
    background-size: 100% 200%;
    background-position: top;
    transition: all .30s ease-in;
    margin: auto;
    margin-top: 60px;
    margin-bottom: 40px;
}
  
.buttonfive__bottomfive-topfive:hover {
    border: 2px solid #00B1DD ;
    background-position: bottom;
    color: #fff;
    cursor: pointer;
}

.texttttt {
    padding-top: 15px;
}
.texttttt a {
    text-decoration: none;
    color: #0093B5;
    transition: all .3s ease-in; 
}

.texttttt a:hover {
    color: white;
}

/* CONTACT PAGE */

.contacthero {
    background-image: url(images/contacthero-100.jpg);
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    height: 700px;
}

.contactinfo {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 100px;
    align-items: center;
}

.addressinfo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: rgb(250, 232, 237);
    height: 300px;
    width: 31%;
}

.addressicon {
    margin-top: -100px;
    text-align: center;
}

.addresstext {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-size: 32px;
    padding-bottom: 80px;
}

.contactlinetwo {
    display: none;
}

.contacthours {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: rgb(255, 255, 228);
    height: 410px;
    width: 31%;
}

.hoursicon {
    margin-top: -110px;
    text-align: center;
}

.hoursinfo {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: italic;
    text-align: center;
    font-size: 28px;
    padding-bottom: 50px;
}

.other {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    font-size: 32px;
}

.contactphone {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    background-color: rgb(227, 249, 255);
    height: 300px;
    width: 31%;
}

.phoneicon {
    margin-top: -100px;
    text-align: center;
}

.contactnumber {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-size: 32px;
    padding-bottom: 110px;
}

.contactsun {
    margin-bottom: 40px;
}

.contactmap p {
    text-align: center;
}

iframe {
    width: 90%;
    height: 700px;
    text-align: center;
    padding-top: 30px;
}





/* Inbetween Tablet and Desktop
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (min-width: 901px) and (max-width: 1260px)
{ body {background-color: white;}

.greetings {
    font-size: 60px;
    margin-top: 50px;
    padding-left: 20px;
    transform: rotate(-5deg);
}

.pcb {
    font-size: 50px;
    text-align: right;
    padding-right: 20px;
    margin-top: -40px;
}
   
.carousel {
    width: 100%;
    margin: auto;
}
    
.review {
    font-size: 20px;
    text-align: center;
    margin: auto;
    line-height: 30px;
    width: 280px;
    margin-top: 40px;
}
    
.quote {
    font-size: 70px;
    position: absolute;
    left: 0;
    text-align: left;
    padding-left: 0px;
}
        
.quotetwo {
    font-size: 70px;
    position: absolute;
    right: 0;
    text-align: right;
    padding-right: 0px;
}
    
.reviewname {
    font-size: 26px;
}
    
.reviewstars {
    text-align: center;
    margin-bottom: 60px;
    width: 40%;
    margin: auto;
}

.footerlogo {
    margin-top: 40px;
    width: 40%;
    text-align: center;
}
    
.footerinfo {
    width: 50%;
    margin-top: 60px;
}
    
.footertext {
    font-size: 14pt;
    font-family: 'baskerville-display-pt', serif;
    font-weight: 700;
    font-style: normal;
    text-align: right;
}
    
.address {
    text-align: right;
    padding-left: 0px;
}
    
.hours {
    text-align: right;
}
    
.socials {
    text-align: right;
    margin-top: -30px;
}



}




/* Tablet
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (min-width: 501px) and (max-width: 900px)
{
body {background-color: white;}

.addressbar p { font-size: 12pt;}

header {
     height: 500px;
}

.mobilelogo {
    display: block;
    max-width: 130px;
    width:100%;
    position:absolute;
    text-align: center;
    z-index:0;
    top:40px;
}

.mobilelogo:hover {
    opacity: 60%;
}

.desktopnav {display: none;}

.greetings {
    font-size: 37px;
    padding-left: 10px;
    margin-top: -60px;
}

.cafename {
    width: 95%;
    margin: auto;
    margin-top: -10px;
}

.pcb {
   font-size: 28px;
    text-align: right;
    padding-right: 10px;
    margin-top: -30px;
}

.text {
    padding-top: 10px;
}

.textt {
    padding-top: 10px;
}

.texttt {
    padding-top: 10px;
}

.menusection {
    width: 100%;
}

.sectionimage {
 width: 45%;
 margin: auto;
 padding-left: 30px;
}

.sectiontext {
    margin-left: 30px;
}

.sectiontext p {
    font-size: 18px;
    width: 90%;
    margin-top: 60px;
    line-height: 25px;
}

.bakerysection {
    width: 98%;
    height: 360px;
}

.sectionimagetwo {
    width: 45%;
    margin: auto;
    padding-left: 30px;
}

.sectiontexttwo {
    margin-left: 30px;
    width: 50%;
    padding-left: 10px;
}

.sectiontexttwo p {
    font-size: 18px;
    width: 100%;
    margin-top: 60px;
    line-height: 25px;
}

.outer__button { 
    height: 50px;
    width: 170px;
    font-size: 19px;
}

.outertwo__buttontwo { 
    height: 50px;
    width: 170px;
    font-size: 19px;
}

.outerthree__buttonthree { 
    height: 50px;
    width: 170px;
    font-size: 18px;  
}

.button__bottom-top {
    margin-left: 70px;
    margin-top: -5px;
}

.buttontwo__bottomtwo-toptwo {
    margin-left: 80px;
    margin-top: -15px;
}

.buttonthree__bottomthree-topthree {
    margin-left: 70px;
    margin-top: -5px;
}

.linethree {
    width: 45%;
}

.suntwo {
    width: 10%;
}

.carousel-cell {
    height: 450px;
    border-width: 0 0.5px 0 0;
}

.slider {
    margin-top: 10px;
}

.carousel {
    width: 100%;
    margin: auto;
}

.review {
    font-size: 17px;
    line-height: 25px;
    width: 180px;
    text-align: center;
    margin-top: 15px;
}

.quote {
    font-size: 60px;
    position: absolute;
    left: 0;
    text-align: left;
    padding-left: 5px;
    
}
    
.quotetwo {
    font-size: 60px;
    position: absolute;
    right: 0;
    text-align: right;
    padding-right: 10px;
}

.reviewname {
    font-size: 22px;
    margin-top: 5px;
}

.reviewstars {
    width: 50%;
    margin: auto;
    padding-top: 5px;

}

footer {
    height: 650px;
    }
    
.footerlogo {
    margin-top: 40px;
    width: 50%;
}

.footerinfo {
    width: 100%;
    margin-top: 0px;
    text-align: center;
}

.footertext {
    font-size: 16pt;
    text-align: center;
    width: 100%;
}

.address {
    padding-left: 00px;
    text-align: center;
}

.hours {
    text-align: center;
}

.socials {
    text-align: center;
    margin-top: 20px;
    padding: 10px;
}

footer p {
    margin-top: 70px;
    font-size: 15px;
}

/* BAKERY PAGE */

.bakeryhero {
    height: 500px;
}

h2 {
    font-size: 90px;
    margin-top: 50px;
}

.pasterysection {
    margin-top: 40px;
    margin-bottom: 30px;
}

.sideone {
    width: 45%;
    margin-top: 10px;
}

.sidetwo {
    width: 45%;
    margin-top: 10px;
}

.menu-item {
    margin: 35px 0;
    font-size: 20px;
}

.cakes p {
    font-size: 22px;
    padding-left: 40px;
    margin-bottom: 50px;
}

.cake {
    margin-top: 30px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    text-align: center;
}

.cakeone {
    flex-direction: column;
    width: 50%;
}

.caketwo {
    flex-direction: column;
    width: 50%;
}

.bakerycake {
    width: 100%;
    padding: 10px 0 10px 0;
}

/* MENU PAGE */

.menuhero {
    height: 500px;
}

h3 {
    text-align: center;
    font-size: 40px;
}

main {
    margin-top: 40px;
}

.menuleft {
    width: 47%;
}

.menuright {
    width: 47%;
}

.menuleft p {
    font-size: 25px;
}

.menuright p {
    font-size: 25px;
}

.menucaption {
    font-size: 17px;
    margin-top: 10px;
    padding-left: 10px;
}

/* ABOUT PAGE */

.abouthero {
    height: 500px;
}

.aboutsunline {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 40px;
}
    
.aboutlineone {
    width: 13%;
}
    
.aboutlinetwo {
    width: 73%;
}

.mainabout {
    width: 98%;
    margin: auto;
    margin-top: 20px;
}

.aboutimage {
    width: 40%;
}

.abouttext {
    width: 55%;
    padding-left: 10px;
}

.abouttext p {
    font-size: 18px;
    line-height: 23px;
}

.secondhalf {
    margin-top: 40px;
}

.aboutfoodpics {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 40px;
}

.aboutfood {
    width: 30%;
}

.outerfive__buttonfive { 
    height: 60px;
    width: 270px;
    font-size: 22px;
}
  
.buttonfive__bottomfive-topfive {
    margin-top: 40px;
    margin-bottom: 40px;
}

.texttttt {
    padding-top: 13px;
}

/* CONTACT PAGE */

.contacthero {
    background-position: bottom right;
    height: 400px;
}

.contactinfo {
    margin-top: 50px;
}

.addressinfo {
    height: 210px;
    margin-left: 5px;
}

.addressicon {
    margin-top: -60px;
    width: 45%;
    margin-left: 55px;
}

.addresstext {
    font-size: 18px;
    padding-bottom: 80px;
}

.contactline {
    display: none;
}

.contactlinetwo {
 display: block;
}

.contacthours {
    height: 300px;
    width: 31%;
}

.hoursicon {
    margin-top: -70px;
    text-align: center;
    width: 45%;
    margin-left: 70px;
}

.hoursinfo {
    font-size: 18px;
    padding-bottom: 50px;
}

.other {
    font-size: 20px;
}

.contactphone {
    height: 210px;
    margin-right: 5px;
}

.phoneicon {
    margin-top: -60px;
    text-align: center;
    width: 40%;
    margin-left: 65px;
}

.contactnumber {
    font-size: 20px;
    padding-bottom: 110px;
}

.contactsun {
    margin-top: 30px;
    margin-bottom: 30px;
}

iframe {
    height: 500px;
}  
    
}





/* Mobile
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 500px)
{
body {background-color: white;}

.addressbar {display: none;}
    
header {
    height: 300px;
    background-image: url(images/mobile-hero-100.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
}

video  {
    display: none;
}

.mobilelogo {
    display: block;
    max-width: 100px;
    width:100%;
    position:absolute;
    text-align: center;
    z-index:0;
    top:0px;
}

.mobilelogo:hover {
    opacity: 60%;
}

.desktopnav {display: none;}

.greetings {
    font-size: 24px;
    padding-left: 5px;
    margin-top: -30px;
}

.cafename {
    width: 95%;
    margin: auto;
    margin-top: -5px;
}

.pcb {
   font-size: 18px;
    text-align: right;
    padding-right: 5px;
    margin-top: -10px;
}

.sunlineone {
    margin-top: 10px;
}

.lineone {
    width: 48%;
    margin-top: -15px;
}

.sunone {
    width: 11%;
}

.linetwo {
    width: 39%;
    margin-top: -15px;
}
 
.text {
    padding-top: 7px;
}
.textt {
    padding-top: 7px;
}
.texttt {
    padding-top: 7px;
}

.menusection {
    width: 100%;
    flex-direction: column;
    margin-top: 20px;
}

.sectionimage {
    width: 85%;
    margin: auto;
    padding-left: 0;
}

.sectiontext {
    width: 75%;
    margin-top: -20px;
}

.sectiontext p {
    font-size: 15px;
    width: 100%;
    margin-top: 40px;
    line-height: 22px;
    text-align: center;
}

.bakerysection {
    width: 95%;
    flex-direction: column-reverse;
    margin-top: 40px;
    height: 580px;
}

.sectionimagetwo {
    width: 85%;
    margin: auto;
    padding-right: 0;
    margin-top: 40px;
}

.sectiontexttwo {
    width: 75%;
    padding-left: 0px;
    margin-top: -90px;
    
}

.sectiontexttwo p {
    font-size: 15px;
    width: 100%;
    margin-top: 60px;
    line-height: 23px;
    text-align: center;
    padding: 0;
}

.outer__button { 
    height: 45px;
    width: 160px;
    font-size: 17px;
}

.outertwo__buttontwo { 
    height: 45px;
    width: 160px;
    font-size: 17px;
}

.outerthree__buttonthree { 
    height: 45px;
    width: 160px;
    font-size: 17px;
}

.button__bottom-top {
    margin-left: 75px;
    margin-top: -5px;
}

.buttontwo__bottomtwo-toptwo {
    margin-left: 70px;
    margin-top: -5px;
}

.buttonthree__bottomthree-topthree {
    margin-left: 75px;
    margin-top: -5px;
}

.linethree {
    width: 41%;
}

.suntwo {
    width: 15%;
}

.carousel-cell {
    width: 100%;
    height: 310px;
    border-width: 0 0.5px 0 0;
}

.slider {
    margin-top: 20px;
}

.carousel {
    width: 100%;
    margin: auto;
}

.review {
    font-size: 16px;
    line-height: 23px;
    width: 68%;
}

.quote {
    font-size: 60px;
    position: absolute;
    left: 0;
    text-align: left;
    padding-left: 40px;
    
}
    
.quotetwo {
    font-size: 60px;
    position: absolute;
    right: 0;
    text-align: right;
    padding-right: 40px;
    padding-top: 5px;
}

.reviewname {
    font-size: 18px;
    margin-top: 10px;
}

.reviewstars {
    width: 35%;
    margin: auto;
    padding-top: 10px;
}

footer {
    height: 500px;
}
    
.footerlogo {
    margin-top: 40px;
    width: 60%;
}

.footerinfo {
    width: 100%;
    margin-top: 20px;
    text-align: center;
}

.footertext {
    font-size: 16px;
    text-align: center;
    width: 95%;
    margin: auto;
}

.address {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    text-align: center;
    padding-left: 0px;
}

.hours {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-top: -20px;
    text-align: center;
}

.hourstwo {
    width: 100%;
    text-align: center;
    margin-top: 20px;
}

.footline {
    display: none;
}

.socials {
    margin: auto;
    margin-top: 30px;
}

footer p {
    margin-top: 60px;
    font-size: 10px;
}

/* BAKERY PAGE */

.bakeryhero {
    background-image: url(images/bakeryhero-100.jpg);
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    height: 250px;
}

h2 {
    font-size: 60px;
    margin-top: 30px;
}

.pasterysection {
    margin-top: 20px;
    flex-direction: column;
    margin-bottom: 20px;
}

.sideone {
    width: 90%;
    margin-top: 10px;
    margin: auto;
}

.sidetwo {
    width: 90%;
    margin: auto;
}

.menu-item {
    margin: 35px 0;
    font-size: 16px;
  }

.cakes {
    width: 94%;
    margin: auto;
}

.cakes p {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    padding-left: 10px;
    margin-bottom: 50px;
}

.cake {
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
}

.cakeone {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 50%;
}

.caketwo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 50%;
}

.bakerycake {
    width: 100%;
    padding:  10px;
}

 /* MENU PAGE */

.menuhero {
    width: 100%;
    height: 250px;
}

 h3 {
    text-align: center;
    font-size: 25px;
}

.outerfour__buttonfour { 
    height: 45px;
    width: 160px;
    font-size: 16px;
}

.buttonfour__bottomfour-topfour {
    margin-left: 120px;
    margin-top: 15px;
}

.textttt {
    padding-top: 8px;
}

.menusun {
    margin-top: 10px;
    margin-bottom: 20px;
    max-width: 100%;
}

.menulineone {
    width: 65%;
}

.menulinetwo {
    width: 24%;
}
    
main {
    margin-top: 20px;
}

.menu {
    flex-direction: column;
}
    
.menuleft {
    width: 90%;
    
}
    
.menuright {
    width: 90%;
}
    
.menuleft p {
    font-size: 18px;
}
    
.menuright p {
        font-size: 18px;
}
    
.menucaption {
        font-size: 17px;
        margin-top: 10px;
        padding-left: 10px;
}

/* ABOUT PAGE */

.abouthero {
    height: 250px;
}

.aboutsunline {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 20px;
}
    
.aboutlineone {
    width: 10%;
}
    
.aboutlinetwo {
    width: 75%;
}

.mainabout {
    flex-direction: column;
    width: 95%;
    margin: auto;
    margin-top: 10px;
}

.aboutimage {
    width: 98%;
}

.abouttext {
    width: 95%;
    padding-left: 10px;
    margin-top: 30px
}

.abouttext p {
    font-size: 16px;
    line-height: 23px;
    text-align: center;
}

.secondhalf {
    margin-top: 30px;
}

.aboutfoodpics {
    flex-direction: column;
    margin-top: 40px;
}

.aboutfood {
    width: 90%;
    margin: auto;
    padding: 15px 0px;
}

.outerfive__buttonfive { 
    height: 60px;
    width: 260px;
    font-size: 20px;
}
  
.buttonfive__bottomfive-topfive {
    margin-top: 20px;
    margin-bottom: 40px;
}

/* CONTACT PAGE */

.contacthero {
    background-position: bottom right;
    height: 210px;
}

.contactinfo {
    flex-direction: column;
    margin-top: 50px;
}

.addressinfo {
    flex-direction: column;
    flex-wrap: wrap;
    height: 160px;
    width: 90%;
    margin-bottom: 60px;
}

.addressicon {
    margin-top: -50px;
    width: 30%;
    margin-left: 130px;
}

.addresstext {
    font-size: 20px;
    padding-bottom: 40px;
}

.contactline {
    display: none;
}

.contacthours {
    flex-direction: column;
    height: 290px;
    width: 90%;
    margin-bottom: 60px;
}

.hoursicon {
    margin-top: -60px;
    text-align: center;
    width: 30%;
    margin-left: 130px;
}

.hoursinfo {
    font-size: 20px;
    padding-bottom: 50px;
}

.other {
    font-size: 18px;
}

.contactphone {
    flex-direction: column;
    height: 130px;
    width: 90%;
}

.phoneicon {
    margin-top: -50px;
    text-align: center;
    width: 25%;
    margin-left: 140px;
}

.contactnumber {
    font-family: 'baskerville-display-pt',serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-size: 20px;
    padding-bottom: 40px;
}

iframe {
    width: 90%;
    height: 300px;
    margin: auto;
    padding-top: 30px;
}






    

 
    
    
    
    
}