/*
 background: url(../image/);
*/
@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400;500;600;700;800;900&family=Cormorant+Garamond:wght@300;400;500;600;700&family=Cormorant+SC:wght@300;400;500;600;700&family=Crimson+Pro:wght@200;300;400;500;600;700;800;900&family=El+Messiri:wght@400;500;600;700&family=Elsie:wght@400;900&family=Fauna+One&family=Fondamento&family=Grenze+Gotisch:wght@100;200;300;400;500;600;700&family=Ibarra+Real+Nova:wght@400;500;600;700&family=Noto+Serif+Display:wght@100;200;300;400;500;600;700;800;900&family=Philosopher:wght@400;700&family=Playfair+Display+SC:wght@400;700;900&family=Playfair+Display:wght@400;500;600;700;800;900&family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Spectral+SC:wght@200;300;400;500;600;700;800&family=Tangerine:wght@400;700&family=UnifrakturMaguntia&family=ZCOOL+XiaoWei&display=swap');

::-webkit-scrollbar{
    display: none;/*This will hide the scrollbar on the web site on chrome*/
}

:root{
    /*Those are some CSS properties stored in CSS variables. You may change their values if you want*/
    --dark:#130f40;
    --mainColor: yellow;/*Here you have the mainColor of the website(yellow). You can change it*/
    --mainFontFamily: 'Cinzel Decorative', cursive;/*You have also here, the main font Family of the web site. You can also change it*/
    --light-color: #666;
    --box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1);
    --border: .2rem solid rgba(0,0,0,.1);
    --outline:.1rem solid rgba(0,0,0,.1);
    --outline-hover:.2rem solid var(--dark);
    --mainfontweight: bold;
    --primaryFontFamily: 'Poppins', sans-serif;/*Here you have the primary font family of the website*/
    --secondaryFontFamily:'Philosopher', sans-serif;
    --thirdFontFamily: var(--primaryFontFamily);
    --textShadow: 1px 1px 1px var(--dark);
}

body{
    /*With this we'll hide the body's horizontal Overflow*/
        overflow-x: hidden;
}
section{
    /*This is the padding define on the section elements in general*/
    padding:2rem 9%;
}

*{
    /*Here we define the properties common to all the elements of the page*/
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    outline: none;
    border: none;
    text-decoration: none;
    -webkit-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
    font-family: var(--primaryFontFamily);
}
.Heading {
    font-size:2rem;
    line-height:1.5em; 
    padding-bottom:45px; 
    font-family: var(--mainFontFamily);
    text-shadow: var(--textShadow);
    letter-spacing: 2px; 
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    width: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align:center;
    position: relative;
}
  
.Heading::before {
    position: absolute;
    left: 0;
    bottom: 20px;
    width: 60%;
    left:50%; 
    margin-left:-30%;
    height: 5px;
    content: "";
    background-color: transparent; 
    border-top: 1px solid var(--dark);
    border-bottom: 1px solid var(--dark);
    z-index: 4;
    display: block;
}
.Heading::after {
    position:absolute;
    width:40px;
    height:40px; 
    left:50%; 
    margin-left:-20px; 
    bottom:0px;
    content: '\00a7'; 
    font-size:30px; 
    line-height:40px; 
    color: var(--mainColor);
    font-weight: bolder; 
    z-index: 5;
    display:block;
    background-color:#ffffff;
    display: block;
    border: none;
}
html{
    /*Thoses are the properties defined for the html doc in general */
    font-size: 62.5%;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scroll-padding-top: 7rem;
}
/*Start of The overlay's properties*/
.overlay_page{
    position: absolute;
    top: 100%;
    right: -110%;
}
.overlay_page.active{
    /*Those are the overlay's Properties when it is actived*/
    right: 0;
    -webkit-transition: .4s linear;
    -o-transition: .4s linear;
    transition: .4s linear;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
    background: var(--dark);
}
/*End of The overlay's properties*/

/*Start of the ShoppingCart's CSS properties*/
.header .ShoppingCart{
    position: absolute;
    top: 100%;
    right: -110%;
    width: 35rem;
    height: 100vh;
    background: #ffffff;
    border-radius: 0 0 .5rem .5rem ;
    overflow-y: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow)
    }
    .header .ShoppingCart .ShoppingCart_Container{
        width: 100%;
        height: 90%;
        overflow-y: scroll;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    .header .ShoppingCart .Checkout_ShoppingCart_Button.hidden{
        display: none;
    }
    .header .ShoppingCart.show{
        right: 0;
        bottom: 0;
        -webkit-transition: .4s linear;
        -o-transition: .4s linear;
        transition: .4s linear;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    .header .ShoppingCart .top{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center; 
        width: 100%;
        height: 5rem;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background: #eee;
    }
    .header .ShoppingCart .top span{
        font-size: 1.5rem;
        color: var(--dark);
        font-weight: bold;
        font-family: var(--mainFontFamily);
    }
    .header .ShoppingCart .EmptyIndication{
        font-size: 1.5rem;
        color: var(--dark);
    }
    .header .ShoppingCart .Checkout_button{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center; 
        width: 35rem;
        height: 10%;
        position: fixed;
        bottom: 0;
        background: #ffffff;
    
    }
    .header .ShoppingCart .Checkout_ShoppingCart_Button{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center; 
        width: 60%;
        height: 5rem;
        font-size: 1.4rem;
        background: var(--mainColor);
        font-family: var(--mainFontFamily);
        font-weight: bold;
        -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
                box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
    }
    .header .ShoppingCart .top button{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center; 
        background: #eee;
    }
    .header .ShoppingCart .top button i{
        font-size: 2.5rem;
        text-shadow: var(--textShadow);
        color: var(--mainColor);
        margin-right: 1rem;
    }
    
    /**/
    .ShoppingCart ul {
        text-align: left;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 100%;
        height: auto;
        position: absolute;
        top: 5rem;
        overflow-y: scroll;
        margin-bottom: 0;
        padding-left: 0;
        padding-bottom: 20rem;
    }
    
    .ShoppingCart .ProductBought {
        border-bottom: #aaa 1px solid;
        width: 90%;
        padding: 10px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    
    .ShoppingCart img {
        width: 90px;
    }
    
    .ShoppingCart ul li .ProductBoughtDetails{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    
    .ShoppingCart ul li .ProductBoughtDetails h5{
        font-size: 1.5rem;
        color: var(--mainColor);
        text-shadow: var(--textShadow);
        font-family: var(--mainFontFamily);
    }
    .ShoppingCart ul li .ProductBoughtDetails h6{
        color: var(--dark);
        font-size: 1.2rem;
    }
    .ShoppingCart ul li .ItemsPurchasedNumber{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        padding: 0;
    }
    .ShoppingCart ul li .ItemsPurchasedNumber button{
        font-size: 1rem;
        color: var(--dark);
        font-weight: bold;
    }
    .ShoppingCart ul li .ItemsPurchasedNumber span{
        font-size: 1.3rem;
        color: var(--dark);
        font-weight: bold;
    }
    .ProductBought h6 {
        margin-bottom: 10px;
    }
    
    .ProductBought button {
        background: transparent;
        color: black;
        cursor: pointer;
        font-weight: 900;
        font-size: 1.2rem;
        padding: 0 6px;
        border: none;
    }
    
    .ProductBaught button:active {
        color: #96c8cc;
    }
    
    .ProductBaught > div {
        padding: 0 20px;
    }
    
    .ShoppingCart .EmptyIndication {
        -ms-grid-column-align: center;
            justify-self: center;
        margin: 150px auto;
    }
    /**/
    .Purchase_Form_Container{
        position: absolute;
        top: 110%;
        right: -110%;
        width: 35rem;
        height: 35rem;
        -webkit-box-shadow: var(--box-shadow);
                box-shadow: var(--box-shadow);
        border-radius: .5rem;
        background: #ffffff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        outline: var(--outline);
    }
    .Purchase_Form_Container .Close_Purchase_Form_Container{
        width: 100%;
        height: 5rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    .Purchase_Form_Container .Close_Purchase_Form_Container i{
        width: 45px;
        height: 45px;
        line-height: 45px;
        color: var(--mainColor);
        text-shadow: var(--textShadow);
        font-size: 2rem;
    }
    .Purchase_Form_Container  button{
        width: 10rem;
        height: 5rem;
        font-size: 1.7rem;
        background: var(--rose);
        text-align: center;
        border: 1px solid var(--black);
        margin-top: 3px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        background: var(--mainColor);
        -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
                box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
    }
    
    .Purchase_Form_Container.montrer{
        right: 2rem;
        -webkit-transition: .4s linear;
        -o-transition: .4s linear;
        transition: .4s linear;
    }
    .Purchase_Form_Container .Instruction{
        font-size: 1.7rem;
        width: 80%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    .Purchase_Form_Container form{
        width: 80%;
        height: auto;
        margin-top: 2rem;
    }
    .Purchase_Form_Container form #User_Email_Error,
    .Purchase_Form_Container form #User_Name_Error{
        font-size: 1.2rem;
    }
    .Purchase_Form_Container form input{
        width: 100%;
        height: 5rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        font-size: 1.5rem;
        border-radius: .5rem;
        outline: var(--outline);
        margin-bottom: 1rem;
    }
    .Confirmation{
        text-align: center;
        position: absolute;
        top: 110%;
        right: -110%;
        width: 35rem;
        height: 55rem;
        overflow-y: scroll;
        -webkit-box-shadow: var(--box-shadow);
                box-shadow: var(--box-shadow);
        border-radius: .5rem;
        background: #ffffff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        outline: var(--outline);
        font-size: 1.7rem;
        -webkit-transition: .4s linear;
        -o-transition: .4s linear;
        transition: .4s linear;
    }
    .Confirmation.active{
        right: 2rem;
        -webkit-transition: .4s linear;
        -o-transition: .4s linear;
        transition: .4s linear;
    }
    .Confirmation span{
        text-transform: none;
    }
    .Confirmation .goup_button{
        margin-top: 1rem;
    }
    .Confirmation button{
        font-size: 1.7rem;
    }
    .Confirmation #The_Person_Name{
        color: var(--mainColor);
        text-shadow: var(--textShadow);
        font-weight: bold;
        font-family: var(--mainFontFamily);
    }
    .Confirmation .Confirmation_Message_Contents{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        width: 90%;
        height: auto;
        padding-top: 2rem;
        padding-bottom: 2rem;
        overflow-y: scroll;
        outline: var(--outline);
        position: absolute;
        top: 2rem;
    }
/*End of the ShoppingCart's CSS properties*/


/*Start of the Header element's CSS properties*/
.header{
    /*Here you'll define the CSS properties you want on your header element */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 2rem 9%;
    background: #fff;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
}
.header .Logo{
    /*These are the CSS properties defined on the Logo. Here the logo is a text. If you use a picture you'll have to change those properties.*/
    font-size: 2.5rem;
    font-weight: bolder;
    color: var(--mainColor);
    text-decoration: none;
    text-shadow: var(--textShadow);
    font-family: var(--mainFontFamily);
}
.header #Horizontal_navbar a{
    /*Here are the CSS properties defined on the links in the horizontal navbar*/
    font-size: 1.7rem;
    margin: 0 1rem;
    color: var(--dark);
    text-decoration: none;

} 
.header #Horizontal_navbar a:hover{
     /*And these are the properties defined when on take hover the links in the horizontal navbar */
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}

body > header > div.icons > a.gallery_link{
    text-decoration: none;
}
.header .icons .div #Items_Added_Number,
.header .icons .div,
.header .icons{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    position: relative;
}

.header .icons .div #Items_Added_Number{
    position: absolute;
    top: -10px;
    right: 0;
    background: var(--mainColor);
    height: 25px;
    width: 25px;
    line-height: 25px;
    border-radius: 50%;
    font-size: 10px;
    outline: 0.5px solid #ffffff;
}


.header .icons div{
    /*The hover properties on icons in the horizontal navbar*/
    height: 4.5rem;
    width: 4.5rem;
    line-height: 4.5rem;
    border-radius: .5rem;
    background: #eee;
    color: var(--dark);
    font-size: 2rem;
    text-align: center;
    margin-right: .3rem;
}


.header .icons div:hover{
    /*The hover properties on icons in the horizontal navbar*/
    background: var(--mainColor);
    color: #fff;
    text-shadow: var(--textShadow);
}

body > header > div.icons > div:nth-child(3),
.header .icons #Home_Button{
/*Here we're going to hide the buttons above on the desktop*/
    display: none;
}

/*Start of the  Vertical navbar's CSS properties*/
.header #Vertical_navbar{
    /*With this we are going to hide the vertical navbar for a while*/
    display: none;
}

.header #Vertical_navbar{
    /*Propriétés définies pour la barre de navigation verticale en soit*/
    position: absolute;
    top: 100%;
    left: -110%;
    width: 35rem;
    height: 80vh;
    background: #ffffff;
    border-radius: 0 0 .5rem .5rem ;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow)
    }
    
    .header #Vertical_navbar.active{
        /*Propriétés définies pour la barre de navigation verticale lorsqu'elle est active*/
        left: 0;
        -webkit-transition: .4s linear;
        -o-transition: .4s linear;
        transition: .4s linear;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    
    .header #Vertical_navbar a,
    .header #Vertical_navbar.active a{
         /*Propriétés définies pour les liens de la barre de navigation verticale lorsqu'elle est active*/
        height: 50px;
        width: 80%;
        background: whitesmoke;
        color: var(--dark);
        margin-top: 10px;
        border-radius: .5rem;
        font-size: 1.7rem;
        font-weight: bold;
        text-decoration: none;
        font-family: var(--primaryFontFamily);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    .header #Vertical_navbar.active a:hover{
         /*Propriétés définies pour le passage au dessus des liens de la barre de navigation verticale lorsqu'elle est active*/
        background: var(--mainColor);
        color: #ffffff;
        font-weight: bold;
        text-shadow: var(--textShadow);
    }
/*End of the Vertical navbar's CSS properties*/

/*End of the Header element's CSS properties*/


/*Start of the Home section's CSS properties*/

.Home_Section{
    width: 100vw;
    height: auto;
    padding-bottom: 0;
    margin-bottom: 0;
    position: relative;
    top: 50px;
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.Home_Section .Header_social_icons{
    position: absolute;
    width: 50px;
    height: auto;
    top: 50%;
    right: .5rem;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    z-index: 10;
}
.Home_Section .Header_social_icons a{
    height: 4.5rem;
    width: 4.5rem;
    line-height: 4.5rem;
    border-radius: .5rem;
    background: whitesmoke;
    color: var(--dark);
    font-size: 2rem;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    margin-top: .2rem;
    -webkit-box-shadow: -3px 10px 10px rgba(0, 0, 0, 0.3);
    box-shadow: -3px 10px 10px rgba(0, 0, 0, 0.3);
}
.Home_Section .Header_social_icons a:hover{
    background: var(--mainColor);
    color: #ffffff;
    text-shadow: var(--textShadow);
}

.Home_Section .Home_Section_Main_Container{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 45%;
    height: auto;
    background: transparent;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container{
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
    width: 45%;
    height: auto;
    position: relative;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container img{
    width: 100%;
    height: auto;
}

.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System{
    position: absolute;
    z-index: 20;
    right: 5px;
    bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System .Share_The_Page{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: auto;
    height: auto;
    line-height: 45px;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System .Share_The_Page i{
    font-size: 3rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    margin-right: 3px;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System  #Sharing_System_Container{
    position: absolute;
    top: -100px;
    right:5px;
    z-index: 10;
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%);
    width: 155px;
    height: 155px;
    background: #eee;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
    display: none;
    padding: 1.5rem;
    border-radius: 1rem;
    padding-top: 0;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System  #Sharing_System_Container.appear{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System .Share_The_Page span{
    font-size: 1.7rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: auto;
    background: transparent;
    position: relative;
    top: 6rem;
}

.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text p{
    text-align: center;
    font-size: 1.5rem;
    margin-top: 1rem;
}

.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Carousel_Container{
    width: 100%;
    height: 15rem;
    background: transparent;
    position: relative;
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Carousel_Container .item img{
    width: 100%;
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Carousel_Container .item{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    outline: var(--outline);
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    border: 1px solid var(--dark);
    -webkit-box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
            box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
    box-shadow: var(--box-shadow);
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title{
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title h1 {
    position: relative;
    padding: 0;
    margin: 0;
    font-family: "Raleway", sans-serif;
    font-weight: 300;
    font-size: 40px;
    color: #080808;
    -webkit-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    width: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-family: var(--mainFontFamily);
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}

.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title h1 div{
    font-size: 0.5em;
    line-height: 1.3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    position: relative;
    font-family: var(--mainFontFamily);
    text-shadow: var(--textShadow);
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title h1 div::before{
    position: relative;
    left: 0px;
    content: " ";
    display: block;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    height: 5px;
    width: 50px;
}
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title h1 div::after{
    position: relative;
    right: 0px;
    content: " ";
    display: block;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    height: 5px;
    width: 50px;
}
.owl-item > div {
  cursor: pointer;
  margin: 6% 8%;
  -webkit-transition: margin 0.4s ease;
  -o-transition: margin 0.4s ease;
  transition: margin 0.4s ease;
}
.owl-item.center > div {
  cursor: auto;
  margin: 0;
}
.owl-item:not(.center) > div:hover {
  opacity: .75;
}
.owl-stage{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  overflow-x: hidden;
}
.owl-stage-outer{
  width: 100%;
  overflow-x: hidden;
}
.owl-dot{
  display: none;
}
.owl-prev{
  position: absolute;
  left: 0;
  top: 50%;
  background-color: var(--dark);
  border: 1px solid var(--dark);
  width: 30px;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
.owl-next{
  position: absolute;
  right: 0;
  top: 50%;
  background-color: var(--dark);
  border: 1px solid var(--dark);
  width: 30px;
  height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
.owl-next span,
.owl-prev span{
 font-size: 1.5rem;
 font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  color: var(--mainColor);
}
.owl-carousel{
 width: 100%;
}
.Carousel_Container{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}


/*End of the Home section's CSS properties*/

/*Start of the About section's CSS properties*/
.About_Section{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    height: auto;
    position: relative;
    top: 100px;
}

.About_Section .About_Contents{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 95%;
    height: auto;
    position: relative;
}

.About_Section .About_Contents .About_Images{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 50%;
    height: 40rem;
    position: relative;
}
.About_Section .About_Contents .About_Images .img1{
    width: 80%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
}
.About_Section .About_Contents .About_Images .img2{
    width: 50%;
    height: auto;
    position: absolute;
    bottom: 0;
    right: 10%;
}
.About_Section .About_Contents .Box_Text{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 50%;
    -webkit-box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
            box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
    padding: 5rem;
}
.About_Section .About_Contents .Box_Text .About_Text{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 100%;
}


.About_Section .About_Contents  .Box_Text .About_Text p{
    font-size: 1.5rem;
    margin-top: 2rem;
}

/*End of the About section's CSS properties*/

/*Start of the Menu section's CSS properties*/
.Menu_Section{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    height: auto;
    position: relative;
    top: 100px;
}

.Menu_Section .Formulas{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: auto;
}

.Under_Title{
    width: 100%;
    height: 10%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    padding-top: 10px;
    font-size: 1.7rem;
    font-family: var(--mainFontFamily);
    letter-spacing: 2px;
    margin-top: 10px;
}
.Under_Title span{
    padding: 1rem 3rem;
    font-family: var(--mainFontFamily);
    font-weight: bold;
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
    background: var(--mainColor);
    margin-left: 1rem;
    letter-spacing: 2px;
}
.Menu_Section .Formulas .container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.Menu_Section .Formulas .item h2{
    font-size: 1.5rem;
    width: 100%;
}
.Menu_Section .Formulas .item{
    width: 250px;
    height: 450px;
    border-radius: 20px;
    background: #ffffff;
    border-radius: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    overflow-y: scroll;
    position: relative;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
    margin: 3rem;
}
.Menu_Section .Formulas .item .Food_Container{
    width: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    top:36rem;
}
.Menu_Section .Formulas .item .Food{
    width: 100%;
    height: 7rem;
    margin-bottom: 1rem;
    background: #eee;
    border-radius: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px rgba(255,255,255,0.7), -0.5px -0.5px 0px rgba(255,255,255,1), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px rgba(255,255,255,0.7), -0.5px -0.5px 0px rgba(255,255,255,1), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
}
.Menu_Section .Formulas .item .Food:hover{
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px rgba(255,255,255,0.7), -0.5px -0.5px 0px rgba(255,255,255,1), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px rgba(255,255,255,0.7), -0.5px -0.5px 0px rgba(255,255,255,1), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
}
.Menu_Section .Formulas .item .Food .Food_Image{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 80%;
    height: 100%;
    background: transparent;
}
.Menu_Section .Formulas .item .Food .Food_Image .img_Meal{
    width: 40%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Menu_Section .Formulas .item .Food .Food_Image .img_Meal img{
   width: 100%;
   height: auto;
}
.Menu_Section .Formulas .item .Food .Food_Image .Meal_Name{
    width: 60%;
    height: 100%;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 600;
    font-family: var(--primaryFontFamily);
}
.Menu_Section .Formulas .item .Food .Meal_Price{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 20%;
    height: 100%;
    background: transparent;
    font-size: 1.3rem;
    font-weight: bolder;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    font-family: 'Quattrocento', serif;
}
.Menu_Section .Formulas .item .Formulas_Button{
    width: 75%;
    height: 5rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    position: absolute;
    top: 27rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-bottom: 3rem;
}
.Menu_Section .Formulas .item .Formulas_Button .Ordered_Button{
    width: 100%;
    height: 5rem;
    border-radius: 1rem;
    background: var(--mainColor);
    font-size: 1.5rem;
    font-weight: bold;
    font-family: var(--primaryFontFamily);
    -ms-flex-negative: 0;
        flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    -webkit-box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15), -6px -6px 10px -1px rgba(255,255,255,0.7);
            box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15), -6px -6px 10px -1px rgba(255,255,255,0.7);
}
.Menu_Section .Formulas .item .Formulas_Button .Ordered_Button:hover{
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
}
.Menu_Section .Formulas .item .Picture_Previwer{
    width: 80%;
    height: 25rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    position: absolute;
    top: 8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    overflow-y: hidden;
    border-radius: 10px;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
}
.Menu_Section .Formulas .item .Picture_Previwer .desc{
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    background: transparent;
    width: 70%;
    height: 100px;
    z-index: 25;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Menu_Section .Formulas .item .Picture_Previwer .desc span{
    color: #eee;
    font-weight: bolder;
    text-shadow: var(--textShadow);
    font-size: 1.7rem;
    font-family: var(--mainFontFamily);
    z-index: 25;
}
.Menu_Section .Formulas .item .Picture_Previwer img{
    width: 100%;
    height: auto;
    max-height: 100%;
    overflow-y: hidden;
}

/**/
.Menu_Section .Formulas .item h4 {
    border-radius: 0 0 5px 5px;
    border-width: 0 1px 1px 1px;
    border-color: rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.3);
            box-shadow: 0 0 4px rgba(0,0,0,0.3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    padding: 1.5rem 7rem;
    position: absolute;
    top: 0;
    z-index: 30;
    background: var(--mainColor);
}

.Menu_Section .categories{
    width: 100vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    overflow-y: hidden;
}
.Menu_Section .categories .categorie_container{
    width: 100vw;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    overflow-y: hidden;
}
.Menu_Section .categories .carousel{
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.Menu_Section .categories .carousel .Product_Card{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 400px;
    margin: 3rem;
    position: relative;
    text-align: center;
    width: 300px;
   /* box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);*/
    -webkit-box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
            box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
    position: relative;
}
.Menu_Section .carousel .owl-stage-outer{
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    overflow-x: hidden;
}
.Menu_Section .carousel .owl-stage-outer .owl-stage{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
}
.Menu_Section .carousel .owl-stage-outer .owl-stage .owl-item{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
}
.Menu_Section .carousel .owl-stage-outer .owl-stage .owl-item:not(.center) > div {
    opacity: .5;
    transform: scale(0.9);
}
.Menu_Section .carousel .owl-prev,
.Menu_Section .carousel .owl-next{
    display: none;
}
.Menu_Section  .carousel .Product_Card .Stars_icons{
    background: var(--mainColor);
    border: 0 solid rgba(0,0,0,0.2);
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    position: relative;
    text-shadow: var(--textShadow);
}

/*.Menu_Section  .carousel .owl-item:not(.center){
    opacity: 0.1;
}*/

.Menu_Section .categories .carousel .Product_Card .Under_Product{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: auto;
}
.Menu_Section .categories .carousel .Product_Card .Stars_icons{
    border-width: 1px 1px 2px;
    -webkit-box-shadow: inset 4px 4px 6px -1px transparent, inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px transparent, inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
    /*box-shadow: 0 2px 6px rgba(0,0,0,0.5);*/
    margin: 0;
    padding: 1.5rem 4rem;
    position: absolute;
    right: -14px;
    top: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    background: var(--mainColor);
    color: #ffffff;
    text-shadow: var(--textShadow);
}
.Menu_Section .categories .carousel .Product_Card .Stars_icons:after {
    border-width: 7px;
    border-style: solid;
    border-color: #134 transparent transparent #134;
    bottom: -15px;
    content: "";
    position: absolute;
    right: -1px;
}
/**/

.Menu_Section .categories .carousel .Product_Card .Product_Picture{
    width: 70%;
    height: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Menu_Section .categories .carousel .Product_Card .Product_Picture img{
    width: 100%;
    height: auto;
}
.Menu_Section .categories .carousel .Product_Card .Book_Button{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 80%;
    height: 5rem;
    position: absolute;
    top: 80%;
}
.Menu_Section .categories .carousel .Product_Card .Booking_Button{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 100%;
    height: 100%;
    background: var(--mainColor);
    font-size: 1.3rem;
    font-weight: bold;
    text-transform: capitalize;
    -webkit-box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15), -6px -6px 10px -1px rgba(255,255,255,0.7);
            box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15), -6px -6px 10px -1px rgba(255,255,255,0.7);
    -webkit-transition: all .5s linear;
    -o-transition: all .5s linear;
    transition: all .5s linear;
}
.Menu_Section .categories .carousel .Product_Card .Booking_Button:hover{
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
}
.Menu_Section .categories .carousel .Product_Card .Booking_Button i{
    font-size: 1.6rem;
    margin-right: 10px;
}

.Menu_Section .categories .carousel .Product_Card .Product_Description{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}

.Menu_Section .categories .carousel .Product_Card .Product_Description .Product_Name{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-family: var(--mainFontFamily);
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    font-size: 1.3rem;
}
.Menu_Section .categories .carousel .Product_Card .Product_Description .Product_Price_Container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Menu_Section .categories .carousel .Product_Card .Product_Description .Product_Price_Container span{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-family: var(--mainFontFamily);
    color: var(--dark);
    font-weight: bold;
    font-size: 1.3rem;
    margin-left: .5rem;
}

/*End of the Menu section's CSS properties*/


/*Start of the Staff section's CSS properties*/
.Staff_Section{
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
    top: 100px;
}
.Staff_Section .Staff_Container{
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.Staff_Section .Staff_Container .Staff_Card{
    width: 300px;
    height: auto;
    min-height: 370px;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    margin: 3rem;
}
.Staff_Section .Staff_Container .Staff_Card .Staff_Picture{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin-top: 15px;
    margin-bottom: 20px;
}

.Staff_Section .Staff_Container  #director{
    background: url(../image/avisrestaurant/Directeur.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.Staff_Section .Staff_Container  #Chef{
    background: url(../image/avisrestaurant/chefcuisinier.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.Staff_Section .Staff_Container  #Assistant_Chef{
    background: url(../image/avisrestaurant/cuisinier3.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details  .Staff_Name{
    font-size: 1.7rem;
    font-weight: bold;
    color: var(--dark);
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details .Staff_function{
    font-size: 1.4rem;
    font-weight: bold;
    color: var(--light-color);
    margin: 10px 0;
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details .Staff_Contact{
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--dark);
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details .Staff_Contact i{
    font-size: 2rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    margin-right: .5rem;
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details .Staff_Email{
   margin: 5px 0;
   margin-bottom: 15px;
}
.Staff_Section  .Staff_Container .Staff_Card  .Staff_Details .Staff_NumberPhone{
   margin-bottom: 35px;
}
/*End of the Staff section's CSS properties*/

/*Start of the Reviews section's CSS properties*/
.Reviews_Section{
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
    top: 100px;
}
.Reviews_Section .Reviews_Container{
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.Reviews_Section .Reviews_Container .review{
    width: 300px;
    height: auto;
    min-height: 370px;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    margin: 3rem;
    overflow: hidden;
    position: relative;
    padding: 0 1rem;
}

.Reviews_Section .Reviews_Container .review .stars {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
       -ms-flex-pack: center;
           justify-content: center;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
   text-align: center;
}
.Reviews_Section .Reviews_Container .review .stars i{
    font-size: 1.5rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    /*text-shadow: var(--textShadow);*/
}
.Reviews_Section .Reviews_Container .review .review-profil{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin-top: 55px;
    margin-bottom: 10px;
}
.Reviews_Section .Reviews_Container .review #Client1{
    background: url( ../image/avisrestaurant/client1.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.Reviews_Section .Reviews_Container .review #Client2{
    background: url(../image/avisrestaurant/Charbel_4.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.Reviews_Section .Reviews_Container .review #Client3{
    background: url(../image/avisrestaurant/client3.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
/**/
.Reviews_Section .Reviews_Container .review .name{
    font-size: 1.7rem;
    font-weight: bold;
}
.Reviews_Section .Reviews_Container  .review p{
    font-size: 1.5rem;
    text-transform: none;
}
.Reviews_Section .Reviews_Container  .review p .left{
    font-size: 30px;
    display: block;
    text-align: left;
    position: relative;
    left: 1rem;
    color: var(--mainColor);
    text-shadow:  var(--textShadow);
}
.Reviews_Section .Reviews_Container  .review p .right{
    font-size: 30px;
    display: block;
    text-align: right;
    color: var(--mainColor);
    position: relative;
    right: 1rem;
    text-shadow:  var(--textShadow);
}

/*End of the Reviews section's CSS properties*/


/*Start of the Features section's CSS properties*/
.Features_Section{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: auto;
    padding: 0;
    position: relative;
    top: 100px;
}
.Features_Section .Features_Container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 90%;
    height: auto;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
}
.Features_Section .Features_Container .Feature{
    width: 350px;
    margin: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Features_Section .Features_Container .Feature .Feature_Picture{
    width: 70%;
    height: auto;
    margin-top: 15px;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.Features_Section .Features_Container .Feature .Feature_Number{
    width: 50px;
    height: 50px;
    border: 1px solid var(--mainColor);
    background: var(--mainColor);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-size: 2rem;
    font-weight: bold;
    margin: 8px 0;
    margin-bottom: 15px;
    -webkit-clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
            clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
    text-shadow: var(--textShadow);
    color: #ffffff;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
}

.Features_Section .Features_Container .Feature .Feature_Title{
    font-size: 1.7rem;
    font-family: var(--mainFontFamily);
    font-weight: 600;
}
.Features_Section .Features_Container .Feature .Feature_description{
    font-size: 1.2rem;
    text-transform: none;
}
.Features_Section .Features_Container .Feature .Feature_description span{
    color: var(--mainColor);
    font-family: var(--mainFontFamily);
    font-size: 1.5rem;
    text-shadow: var(--textShadow);
}
/*End of the Features section's CSS properties*/

/*Start of the Gallery section's CSS properties*/
.Gallery_Section{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    height: auto;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    top: 100px;
}
.Gallery_Section .Heading{
    margin-top: 3rem;
}
.Gallery_Section .Gallery_Row .box{
    margin-bottom: 10px;
    margin-top: 10px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    width: 300px;
    height: auto;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}

.Gallery_Section .Gallery_Row .box img{
    width: 100%;
    height: auto;
}
.Gallery_Section .Gallery_Row .box .overlay{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
    -webkit-transition:  .5s ease-in-out;
    -o-transition:  .5s ease-in-out;
    transition:  .5s ease-in-out;
    background: var(--dark);
}
.Gallery_Section .Gallery_Row .box:hover .overlay{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.Gallery_Section .Gallery_Row .box .overlay i{
    font-size: 5rem;
    color: var(--mainColor);
}
/*End of the Gallery section's CSS properties*/


/*End of the Sharing section's CSS properties*/
.Sharing_Section{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    top: 50px;
    margin-bottom: 30px;
    margin-top: 20px;
}
.Sharing_Section .Share_Page{
    width: auto;
    height: 45px;
    line-height: 45px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.Sharing_Section .Share_Page i{
    font-size: 3rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
    margin-right: 3px;
}
.Sharing_Section #Sharing_Container{
    position: absolute;
    top: -130px;
    z-index: 10;
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%);
    width: 155px;
    height: 155px;
    background: #eee;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    outline: var(--outline);
    display: none;
    padding: 1.5rem;
    border-radius: 1rem;
    padding-top: 0;
}
.Sharing_Section #Sharing_Container.appear{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
}
.Sharing_Section span{
    font-size: 1.7rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}
/*End of the Sharing section's CSS properties*/


/*Start of the Footer section's CSS properties*/
.footer{
    background: #ffffff;
    text-transform: none;
    width: 100vw;
    outline: var(--outline);
    -webkit-transition: all 0.4s cubic-bezier(0.68,-0.55,0.265,1.55);
    -o-transition: all 0.4s cubic-bezier(0.68,-0.55,0.265,1.55);
    transition: all 0.4s cubic-bezier(0.68,-0.55,0.265,1.55);
    position: relative;
    top: 100px;
}

.footer .box-container{
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    gap : 1.5rem;
    width: 100%;
}
.footer .box-container .box h3{
    font-size: 2rem;
    color: var(--dark);
    padding: 1rem 0;
    font-weight: bold;
    font-family: var(--mainFontFamily);
}
.footer .box-container .box h3.Restaurant_Name{
    color: var(--mainColor);
    font-family: var(--mainFontFamily);
    text-shadow: var(--textShadow);
}
.footer .box-container .box.follow p{
    font-weight: 400px;
    color: var(--dark);
    margin-top: -1.2rem;
    margin-bottom: -1.2rem;
    text-transform: none;
}
.footer .box-container .box h4{
    font-size: 2rem;
    color: var(--dark);
    padding: 1rem 0;
    font-weight: 500;
    text-transform: uppercase;
}
.footer .box-container .box .lincks{
    display: block;
    font-size: 1.7rem;
    color: var(--dark);
    padding: 1rem 0;
    text-decoration: none;
    text-transform: none;
}
.footer .box-container .box .lincks i{
   color: var(--mainColor);
   padding-right: .5rem;
   text-shadow: var(--textShadow);
}
.footer .box-container .box .lincks i.far{
    font-size: 2.5rem;
    margin-right: 1rem;
}
.footer .box-container .box .lincks:hover i{
   padding-right: 2rem;
}
.footer .box-container .box p{
    line-height: 1.8rem;
    font-size: 1.5rem;
    color: var(--light-color);
    padding: 1rem 0;
}
.footer .box-container .box .SHARE a{
    height: 4rem;
    width: 4rem;
    line-height: 4rem;
    border-radius: .5rem;
    font-size: 2rem;
    color: var(--dark);
    margin-right: .2rem;
    text-decoration: none;
    background: #eee;
    text-align: center;
}
.footer .box-container .box .SHARE a:hover{
    background: var(--mainColor);
    color: #ffffff;
    text-shadow: var(--textShadow);
}
.footer .End_line{
    text-align: center;
    margin-top: 2rem;
    padding: 1rem;
    padding-top: 2.5rem;
    font-size: 2rem;
    color: var(--dark);
    border-top: 1px solid var(--dark);
    font-family: 'Playfair Display', serif;
    font-weight: 500;
}
.footer .End_line span{
    color: var(--mainColor);
    font-family: 'Quattrocento', serif;
    font-weight: 800;
    text-shadow: var(--textShadow);
    font-size: 2rem;
}
.particular{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.particular p{
    font-size: 1.7rem;
    color: var(--dark);
    font-weight: 500;
    font-family: var(--primaryFontFamily);
}
.particular .Newsletter_Form_Container{
    width: 100%;
    height: 5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.particular .Newsletter_Form_Container #Newletters_Container{
    width: 100%;
    height: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 0!important;
}
.particular .Newsletter_Form_Container #Newsletter_Field_Error{
    width: 100%;
    height: 10%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
}
.particular .Newsletter_Form_Container #Newletters_Container input{
    width: 80%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    font-size: 1.5rem;
}
.particular .Newsletter_Form_Container #Newletters_Container .input-group-btn{
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 20%;
}
.particular .Newsletter_Form_Container #Newletters_Container .btn{
    font-size: 1.5rem;
    width: 100%;
    height: 100%;
    background: var(--mainColor);
    border: 2px solid var(--dark);
    border-radius: .5rem;
    font-weight: 900px;
    color: #ffffff;
    text-shadow: var(--textShadow);
}
.Payement_Containeur{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}
.Payement_Containeur h5{
    font-weight: 700px;
    text-transform: uppercase;
}
.Payement_Containeur .Pictures_Payement_Container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}
.Payement_Containeur .Pictures_Payement_Container img{
    width: 80%;
    height: 3rem;
    background: #ffffff;
}
#Recovery_Form{
    position: absolute;
    top: 110%;
    right: -110%;
    width: 30rem;
    height: 30rem;
    -webkit-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
    border-radius: .5rem;
    background: #ffffff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    outline: var(--outline);
    
}

#Recovery_Form .Close_Form_Icon{
    width: 100%;
    height: 15%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
#Recovery_Form .Close_Form_Icon i{
    font-size: 3rem;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}
#Recovery_Form .form_container{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    width: 90%;
    height: 85%;
    outline: var(--outline);
    margin-bottom: 20px;
}
#Recovery_Form .Close_Form_Icon #Close_Form{
    margin-right: 15px;
}
#Recovery_Form.active{
    right: 2rem;
    -webkit-transition: .4s linear;
    -o-transition: .4s linear;
    transition: .4s linear;
}

#Recovery_Form #Client_Name{
    width: 100%;
    height: 5rem;
    font-size: 1.7rem;
    text-transform: none;
}
#Recovery_Form label{
    font-weight: 700;
    font-size: 1.7rem;
    color: var(--light-color);
}
#Recovery_Form button{
    width: 10rem;
    height: 5rem;
    font-size: 1.7rem;
    background: var(--rose);
    text-align: center;
    border: 1px solid var(--black);
    margin-top: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    background: var(--mainColor);
    -webkit-box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
            box-shadow: inset 4px 4px 6px -1px rgba(0,0,0, 0.2), inset -4px -4px 6px -1px var(--mainColor), -0.5px -0.5px 0px var(--mainColor), 0.5px 0.5px 0px rgba(0,0,0,0.15), 0px 12px 10px -10px rgba(0,0,0, 0.5);
}
.Developer{
    padding-top: 20px !important;
}
.Developer a{
    text-decoration: none;
    color: var(--mainColor);
    text-shadow: var(--textShadow);
}
/*End of the Footer section's CSS properties*/



/*Start of media queries */
@media (max-width: 1175px){
    /*Début des propriétés généraux pour ce format*/
     html{
        font-size: 55%;
    }

    .header{
        padding:2rem;
    }

    section{
        padding:2rem;
    }
    /*fin des propriétés généraux pour ce format*/

}

@media screen and (max-width: 880px){
    .About_Section .About_Contents .About_Images .img2{
        display: none;
    }
    .About_Section .About_Contents .About_Images .img1{
        width: 90%;
        position: initial;
    }
}
@media screen and (max-width: 815px){
    .About_Section .About_Contents{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    .About_Section .About_Contents .About_Images,
    .About_Section .About_Contents .Box_Text{
        width: 80%;
    }
    .About_Section .About_Contents .About_Images{
        margin-top: 1.5rem;
    }
    .About_Section .About_Contents .About_Images{
        height: auto;
    }
}

@media screen and (max-width: 875px){
    .header #Staff_button,
    .header #Horizontal_navbar{
        /*On enlève ses quelques boutons pour ce format*/
         display: none;
    }
    body > header > div.icons > div:nth-child(3){
        display: flex;
    }
    body > header > div.icons > div:nth-child(3){
        /*Mise en place du bouton menu pour la mise en place de la barre de navigation verticale*/
        display: inline-block;
    }
}

@media screen and (max-width: 768px){
    .Home_Section .Home_Section_Main_Container{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        height: auto;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        position: relative;
        top: 0;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text{
        padding-top: 2rem;
    }
   .Home_Section .Home_Section_Main_Container .Presentation_Text_Container{
        width: 90%;
    }

    .Features_Section,
    .Reviews_Section,
    .Staff_Section,
    .Menu_Section,
    .About_Section,
    .Gallery_Section,
    .footer{
        position: relative;
        top: 15px;
    }

    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System{
        display: flex;
        right: -100px;
    }
    .Sharing_Section{
        display: none;
    }
}


@media screen and (max-width: 767px){
    .Menu_Section  .carousel .owl-nav{
        display: none;
    }
}

@media screen and (max-width: 625px){
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container{
        width: 100%;
        height: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container img{
        width: 80%;
        height: auto;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Text_Container{
        width: 100%;
    }
    .Home_Section .Header_social_icons{
     display: none;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System{
        right: 5px;
    }
}

@media screen and (max-width:500px){
    .About_Section .About_Contents .Box_Text p{
        text-align:justify;
    }
}

@media (max-width:450px){
    /*Début des propriétés généraux pour ce format*/
    html{
        font-size: 50%;
    }

    .Heading{
        font-size: 2.5rem;
    }

    .footer{
        text-align: center;
    }

    /*.footer .box-container .box .payment-img{
        margin: 2rem auto;
    }*/
    .footer .box-container .Payement_Containeur{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .footer .box-container .Payement_Containeur .Pictures_Payement_Container{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    /*fin des propriétés généraux pour ce format*/
  
}

@media screen and (max-width: 455px){
    .About_Section .About_Contents .About_Images,
    .About_Section .About_Contents .Box_Text{
        width: 100%;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container img{
        width: 100%;
        height: auto;
    }
}

@media screen and (max-width: 345px){
    .header .icons #Gallery_button{
        /*On enlève le bouton-icone de la galerie à partie de ce format*/
        display: none;
    }
}

@media screen and (max-width: 310px){
 
    .About_Section .About_Contents .Box_Text{
      padding: 2rem 0;
      -webkit-box-shadow: none;
              box-shadow: none;
  }
 
}

@media screen and (max-width: 300px){
    section#Menu {
        margin-top: 1rem;
    }
    .About_Section .Heading{
        margin-top: 1rem;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Text p{
        text-align: justify;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Text{
        width: 100%;
    }
}

@media screen and (max-width: 350px){
.header #Vertical_navbar{
    width: 100vw;
    max-width: 100vw;
}
.header #Recovery_Form,
.header .Confirmation{
    top: 100%;
}
.header #Recovery_Form,
.header .Purchase_Form_Container,
.header .Confirmation{
    display: none;
}
.header .ShoppingCart .Checkout_button{
    width: 100vw;
    max-width: 100vw;
}

.header #formulaire_recuperation.active,
.header .Purchase_Form_Container.montrer,
.Confirmation.active{
    width: 100vw;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.Confirmation.active{
    height: 80vh;
    top: 100%;
}
.header .ShoppingCart{
    width: 100vw;
}
.Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System{
    right: 0px;
}
}
@media screen and (max-width: 370px){
    .critique .conteneur_critique  .reviews{
         margin: 3rem .5rem;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System .Share_The_Page span{
        display: none;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System  #Sharing_System_Container{
        top: -150px;
        right: -10px;
    }
}
  
@media screen and (max-width: 300px){
    .header .Logo{
        font-size: 1.5rem;
    }
}
  
  
@media screen and (max-width: 310px){
    header #Vertical_navbar{
        width: 100vw;
    }
}

@media screen and (max-width : 340px){
    .Menu_Section .categories .carousel .Product_Card{
        height: 300px;
    }
   
    .Staff_Section .Staff_Container .Staff_Card{
        margin: .5rem;
    }
    .Menu_Section .categories .carousel .Product_Card .Product_Picture{
        height: auto;
    }
}
@media screen and (max-width: 975px){
    .About_Section .About_Contents .About_Images .img2{
        bottom: 10%;
    }
}
@media screen and (max-width: 880px){
    .About_Section .About_Contents .About_Images .img2{
        display: none;
    }
    .About_Section .About_Contents .About_Images .img1{
        width: 90%;
        position: initial;
    }
}

@media screen and (max-width: 320px){
    .Menu .categories .carousel .carte_produit .image_produit{
        width: 90%;
    }
    .Menu .categories .carousel .carte_produit{
        margin-bottom: 10px;
    }
    .Menu .categories .carousel .carte_produit .bouton_reserver{
        margin-top: 1rem;
    }
    .Reviews_Section .Reviews_Container .review{
        margin: 3rem 0.1rem;
    }
    .Home_Section .Home_Section_Main_Container .Presentation_Image_Container .Sharing_System  #Sharing_System_Container{
        top: -130px;
    }
}
@media screen and (max-width: 365px){
    .Menu_Section .Formulas .item{
        margin: 3rem 0;
    }
    
}
@media screen and (max-width: 285px){
    .Gallery_Section .Gallery_Row .box{
        width: 200px;
        height: auto;
    } 
}
@media screen and (max-width: 200px){
    .Gallery_Section .Gallery_Row .box{
        width: 150px;
        height: auto;
    } 
}

@media screen and (max-width: 219px){
    body > header > div.icons > div:nth-child(3){
        position: absolute;
        right: 1rem;
        top: 0;
        height: 4rem;
        width: 4rem;
        line-height: 4rem;
    }
    .header .icons #bouton-panier{
        position: absolute;
        right: 1rem;
        bottom: 0;
        height: 4rem;
        width: 4rem;
        line-height: 4rem;
    }
}
@media screen and (max-width: 400px){
.Home_Section .Home_Section_Main_Container .Presentation_Text_Container .Presentation_Text .Text .Title h1{
    font-size: 25px;
}
}
/*End  of media queries */