/* @import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}



main {
    min-height:95%;
    min-height: 95svh;
    background-color: #FFFBF1;
    position:relative;
    overflow: hidden;
}
    /* border: 2px solid orange; */

.background {
    display: block;
    width:75%;
    min-height:95%;
    background-image: url("../media/background.jpg");
    background-size:cover;
    background-position: center;
    opacity: 0.5;
    position: relative;
}
        /* border: 2px solid salmon; */
.address{
    font-size: 1.5rem;
    position: absolute;
    left:10%;
    top: 5%;
    font-family: "Manrope", "Antonio", serif;
    color: white;
    letter-spacing: 10px;
}    
       
main img {
    display:block;
    max-height: 100%;
    width:60%;
    position: absolute;
        /* border: 2px solid green; */
    top:40%;
    right:5%;
        /* overflow: hidden; */
}
        
.logo {
    display: block;
    width:95%;
    max-height:100%;
    position: absolute;
    top:80%;
    right:2%;
    z-index: 2;
}



  
.opening_times {
    display: flex;
    gap:50px;
    justify-content: center;
    width: 100%;
    height: auto;
    margin-block:5%;
    /* background-color: bisque; */
    font-size: 1rem;
    font-family: "Antonio", sans-serif;
    letter-spacing: 0.25rem;
    line-height: 1.8rem;
    font-weight: 800;
    position: relative;
    color:#736f6f; 
}

 .times span {
    position: relative;
    left:10px;
}

.times .closed {
    position: relative;
    left:20%;
}
        



.shop_front img {
    
    width: 100%;
}


.social_media {
    display: flex;
    justify-content: center;
   
    gap:80px;
    margin-block: 2%;
    overflow-x: hidden;
}

.social_media a img {
    height:50px;
    width:50px;
}


 .products {
    height:30%;
    width:100%;
    display: flex;
    background-color: salmon;
 }
    /* border:blue 2px solid;; */

 .coffee_image {
     height:100%;
     width:50%;
     background-image: url("../media/DSC_0033.jpg");
     background-size: cover;
     background-position: center;
}

 .coffee_text {
     width:50%;  
     display:flex;
     justify-content: center;
     align-items: center;
 }
            
.coffee_text p {
     font-size: 1.2rem;
     font-family: "Playfair Display", sans-serif;
     font-style: italic;
     color:white;
     letter-spacing: 0.125rem;
     text-align: center;
}
                
 .bakery {
    height:30%;
    width:100%;
    display:flex;
    /* border: red 2px solid; */
    margin-top:0;
    /* margin-bottom: 3rem; */

}

 .bakery_text{
     width:50%;
    /* border:red 2px solid; */
     display: flex;
     justify-content: center;
     align-items: center;
 }

.bakery_text p{
     font-size: 1.2rem;
     font-family: "Playfair Display", sans-serif;
     font-style: italic;
     letter-spacing: 0.125rem;
     line-height: 2.3rem;
     text-align: center;  
     /* border:green 2px solid; */
}
        

 .bakery_image {
    height:100%;
    width:50%;
    /* border: red 2px solid; */
    background-image: url("../media/Artboard\ 4.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.bakery_image::before {
    content:"";
    height:100%;
    width:50%;
    background-color: salmon;

}

.bubble_tea {
    height:30%;
    width:100%;
    display:flex;
    background-color: #FFFBF1;
    /* border: red 2px solid; */
    margin-top:0;
    /* margin-bottom: 3rem; */

}

.bubble_tea_image {
    height:100%;
    width:50%;
    background-image: url("../media/bubble_tea_2.jpg");
    background-size: cover;
    background-position: center;
}

.bubble_tea_text{
    width:50%;
   /* border:red 2px solid; */
    display: flex;
    justify-content: center;
    align-items: center;
}

.bubble_tea_text p{
    font-size: 1.2rem;
    font-family: "Playfair Display", sans-serif;
    font-style: italic;
    letter-spacing: 0.125rem;
    line-height: 2.3rem;
    text-align: center;  
    /* border:green 2px solid; */
}

.food {
    height:30%;
    width:100%;
    display:flex;
    background-color: white;
    
    /* border: red 2px solid; */
    margin-top:0;
    margin-bottom: 3rem;

}

.food_image {
    height:100%;
    width:50%;
    background-image: url("../media/food.jpg");
    background-size: cover;
    background-position: center;
}

.food_text{
    width:50%;
   /* border:red 2px solid; */
    display: flex;
    justify-content: center;
    align-items: center;
}

.food_text p{
    font-size: 1.2rem;
    font-family: "Playfair Display", sans-serif;
    font-style: italic;
    letter-spacing: 0.125rem;
    line-height: 2.3rem;
    text-align: center; 
    
    /* border:green 2px solid; */
}

.food_title, .food_times_days, .food_times_hours{
    display: block;
    text-align: center;
    font-family:"Antonio",sans-serif;
    font-size: 1.2rem; 
    letter-spacing:0.20rem;
    font-weight: 800;
    color:#736f6f;
}

.food_serve_times{
    display:flex;
    gap:50px;
    justify-content: center;  
}

.food_times_days, .food_times_hours{
    font-size:1rem;
}
 

.logo_divider {
    height:3px;
    width:80%;
    background-color: salmon;
    margin: 0 auto;
}

 .map {
    position: absolute;
 }
    /* margin-top: 3rem; */

.map h1 {
    margin-left: auto;
    margin-right: auto;
    margin-top:5%;
    text-align: center;
    color:grey;
    font-family: "Antonio";

    /* font-size: 20%; */
}
    
.map img {
    width:100%;
    margin-top: 5%;       
}

.footer {
    min-height:80px;
    width: 100%;
    background-color: #736f6f;
    position: relative;
    margin-top: 2%;
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 0.5rem;
    /* border: red 2px solid; */
}

.footer p {
    /* border: red 2px solid; */
    display:inline;
    font-size: 0.8rem;
    color:white;
    font-family: "Manrope", sans-serif;
    
}

.footer p:first-child {
    font-size: 1rem;
}

.footer span {
    margin-right: 5px;
    /* border: red 2px solid; */
}