*{
    margin: 0px;
    box-sizing: border-box;
    scroll-behavior: smooth;

}

/*  start Font style */
.amatic-sc-bold {
    font-family: "Amatic SC", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  

  /* // <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 300 to 800 */

.open-sans-btns {
    font-family: "Open Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
    font-variation-settings:
        "wdth" 100;
        
  }

.inter-chefs {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 100;
    font-style: normal;
  }
  
/*  End Font style */



                                /* start code css web  */


                                








/* start Home */
.home{
    width: 100%;
    background-color: #EEEEEE;
    height: 100vh;
    margin: auto;
    position: relative;
}


/* start Navbar */
.navbar{
    background-color: #FFFFFF;
    position: fixed;
    z-index: 50;
    width: 100%;
    height: 8%;
    filter: drop-shadow(1px 3px 2px #878282);
    display: flex;
    flex-wrap: wrap;
    /* justify-items: center; */
    align-items: center;
    justify-content: space-evenly;
}
/* start bar-left */
.bar-left{
    width: 25%;
    margin-left: 10%;
    /* background-color: gray; */
}
.bar-left a{
    color: RGB(33, 37, 41);
    font-weight: 700;
    font-size: 30px;
    font-weight: 700;
    text-decoration: none;
}
.bar-left a span{
    color: #E61414;
}

/* End bar-left */

/* start bar-center */
.bar-center{
    width: 50%;
    /* background-color: orange; */
    
    
}

.bar-center li{
    list-style: none;
    
    
    display: inline-block;
    margin-left: 20px;
    
}
.bar-center a{
    text-decoration: none;
    color: black ;
    font-size: 17px;
    font-weight: 600;
    border-bottom: #E61414 solid 0px;
    transition: all 1s .2s ;
    

}


.bar-center a:hover { 
    
    border-bottom-width: 3px; 
    
} 
/* End bar-center */

/* start bar-Right */




/* End bar-Right */


/* End Navbar */



/* start Home-content */
.home-content{
    width: 70%;
    height: 100%;
    margin:auto;
    display: flex;
    flex-wrap: wrap;
    padding-top: 5%;
    justify-content:space-between;
    align-items: center;
    /* align-content: center; */
    
    /* justify-items: center; */
    /* padding: 40px 5px; */
}
/* End Home-content */

/* start left-side */
.home-content .left-side{
    width: 40%;
    
    
}

.left-side h2{
    color: #37373F ;
    font-size: 65px;
    font-weight: 700;
    

}
.left-side p{
    color: RGB(79, 79, 90);
    font-size: 16px;
    font-weight: 400;
    /* width: 80%; */
    margin: 5% 0%;
    
}
.left-side .btns{
    margin: 20px 0px;
}
.left-side .btns .btn1{
    
    font-size: 15px;
    font-weight: 400;
}
.left-side .btns .btn1 a{
    text-decoration: none;
    border: #ce1212 solid .5px ;
    border-radius: 20px;
    border-top-left-radius: 0px;
    border-width: 10px 20px;    
    color: white;
    background-color: #ce1212;
    
}
.left-side .btns .btn1 a:hover{
    background-color: #E61414;
    border-color: #E61414; 
}
/* End left-side */




/* start right-side */
.right-side{
    width: 40%;
   
}
.right-side img{
    width: 100%;
    filter: drop-shadow(6px 4px 12px #000000);
}
.right-side:hover{
    animation:desh infinite alternate 2s ease;

    
}
@keyframes desh{
    
    25% {transform: translateX(3%) rotate(15deg);}
    100% {transform: translateX(0%) rotate(0deg);}
    
}
/* End right-side */


/* End Home */





/* start chefs */
.chefs{
    background-color: #FFFFFF;
    margin: 3% 0%;
    padding: 50px;
    overflow: auto;
    

/* start profile-title */
.profile-title{
    margin: 3% 0%;
    text-align: center;
    
}
}
.profile-title h2{
    color: RGB(127, 127, 144);
    font-size: 14px;
    font-weight: 400;
}
.profile-title p{
    color: RGB(33, 37, 41);
    font-size: 50px;
    font-weight: 400;
}
.profile-title p span{
    color: RGB(206, 18, 18) ;
}
/* End profile-title */



/* start chefs-profile */
.chefs-profile{
    margin: auto;
    width: 95%;
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-between;
}



/* start chefs-section1 */
.chefs-section{
    width: 30%;
    
    background-color:#FFFFFF;
    /* background-color: blueviolet; */
    /* margin:1% 1.5%; */
    text-align: center;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    filter: drop-shadow(2px 6px 3px #878282);
    transition: all .5s;
}


.chefs-section:hover {
    transform: scale(110%);
}

/* start chef-box */
.chef-box{
    width: 15%;
    height: 30%;
    background-color:rgb(209, 207, 207) ;
    border: rgb(92, 92, 92) solid 0.5px;
    border-radius: 10px;
    position: fixed;
    right: 20px;
    top: 40px;
    z-index: 20;
    opacity: 50%;
    transition: all .5s 1s;
    transform: translatex(155%);   
    
}
.chef-box .box-logo{
    height: 100%;
    background-color: white;
    display: flex;
    opacity: 40%;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
    align-content: center ;
   
  
}
.box-logo i{
    color: gray;
    width: 100%;
}

.chefs-section:hover .chef-box{
    transform: translate(0%);
}
/* End chef-box */

/* start chef-img */
.chef-img{
    width: 100%;
    
    position: relative;
}
.chef-img img{
    width: 100%;
    border-radius: 10px;
    
}
.chef-img .bar-img img{
    width: 100%;
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

/* End chef-img */


/* start chefs-content */
.chef-content{
    width: 100%;
    /* margin: 10px auto; */
    padding: 20px;
    text-align: center;
}


.chef-content h3{
    color: RGB(33, 37, 41);
    font-size: 19px;
    font-weight: 700;
    margin-bottom: 10px;

}
.chef-content h5{
    color: RGB(127, 127, 144);
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 10px;
}

.chef-content  p{
    
    color: RGB(127, 127, 144);
    font-size: 15px;
    font-weight: 400;
}
/* End chefs-content */

/* End chefs-section1 2 3 */

/* End chefs-profile */

/* End chefs */



/* Start Gallery  */
.gallery{
    height: 150vh;
    background-color: #EEEEEE;
    overflow:hidden;
    padding: 50px;
    
    
}



/* start profile-title */
.profile-title{
    text-align: center;
    margin-top: 40px;
    margin-bottom: 20px ;
}
/* End profile-title */

/* start profile-album */
.galler-album{
    width: 90%;
    height: 100%;
    overflow: hidden;
    text-align: center;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-content:center;
    
}

/* start photo-left-up */
.photo-left-up{
    width: 25%;
    height: 30%;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;   
    margin-right: 20px;  
    
}


.photo-left-up img{
    width: 100%;
    height: 100%;   
   
    
}
.photo-left-up:hover img{
    transform: scale(105%);
}

/* start one layer  cover at all photos */
.layer{
    background-color: #ce1212;
    position: absolute;
    bottom: -100%;
    background-color: rgba(0 , 0, 0, .5);
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: all 1s;
}
.layer h3{
    width: 80%;
    color: RGB(255, 255, 255);
    font-size: 24px;
    font-weight: 700;
}
.layer p{
    width: 80%;
    color:RGB(221, 221, 221) ;
    font-size: 16px;
    font-weight: 400;
}
.photo-left-up:hover .layer {
    inset: 0;
}
/* End  layer */
/* End photo-left-up */

/* start photo-left-down */
.photo-left-down{
    width: 25%;
    height: 50%;
    overflow: hidden;
    position: relative;
    /* margin-bottom: 20px; */
}
.photo-left-down img{
    width: 100%;
    height: 100%;
}
.photo-left-down:hover img{
    transform: scale(105%);
}
.photo-left-down:hover .layer{
    inset: 0;
}
/* End photo-left-down */

/* start photo-center-up */
.photo-center-up{
    width: 25%;
    height: 60%;
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
    
}
.photo-center-up img{
    width: 100%;
    height: 100%;
}
.photo-center-up:hover img{
    transform: scale(105%);
}
.photo-center-up:hover .layer{
    inset: 0;
}
/* End photo-center-up */

/* start photo-center-down */
.photo-center-down{
    width: 25%;
    height: 30%;
    overflow: hidden;
    position: relative;
    
}
.photo-center-down img{
    width: 100%;
    height: 100%;
}
.photo-center-down:hover img{
    transform: scale(105%);
}
.photo-center-down:hover .layer{
    inset: 0;
}
/* End photo-center-down */

/* start photo-right-up */
.photo-right-up{
    width: 25%;
    height: 25%;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    margin-left: 20px;
}
.photo-right-up img{
    width: 100%;
    height: 100%;
}
.photo-right-up:hover img{
    transform: scale(105%);
}
.photo-right-up:hover .layer{
    inset: 0;
}
/* End photo-right-up */

/* start photo-right-center */
.photo-right-center{
    width: 25%;
    height: 25%;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    margin-left: 20px;
}
.photo-right-center img{
    width: 100%;
    height: 100%;
}
.photo-right-center:hover img{
    transform: scale(105%);
}
.photo-right-center:hover .layer{
    inset: 0;
}
/* End photo-right-center */

/* start photo-right-down */
.photo-right-down{
    width: 25%;
    height: 25%;
    overflow: hidden;
    position: relative;
    margin-left: 20px;
}
.photo-right-down img{
    width: 100%;
    height: 100%;
}
.photo-right-down:hover img{
    transform: scale(105%);
}
.photo-right-down:hover .layer{
    inset: 0;
}

/* End photo-right-down */

/* End profile-album */

/* end gallery-content */

/* End Gallery  */

/* start contact  */
.contact{
    padding: 50px;
    background-color: #FFFFFF;
}

/* start contact-us  */
.contact-us{
    width: 80%;
    margin: auto;
}
/* End contact-us  */

/* start google-map */
.google-map{
    background-color: #878282;
    width: 90%;
    margin: auto;
    padding-bottom: 25% ;
    position: relative;
}

.google-map iframe{
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    position: absolute;
}
/* End google-map */

/* start contact-section */
.contact-section{
    width: 90%;
    margin:2% auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

/* start section 1-4 */
.section{
    width: 49%;
    height: 80px;
    /* height: 10px; */
    background-color: #F5F5F5;
    padding: 3px;
    margin: .5%;
    display: flex;
    justify-items: flex-start;
    align-items: center;
}
.section .con-icon{
    border:#CE1212 solid 1px;
    background-color: #CE1212;
    border-radius: 25px;
    height: 50px;
    width: 50px;
    text-align: center;
    margin-left: 3%;
}
.con-icon i{
    color: #FFFFFF;
    margin-top: 30%;
    width: 50px;
    /* transform: translateY(60%); */
}
.con-content{
    margin-left: 2%;
    
}
.con-content h3 {
    font-size: 20px;
    font-weight: 700;
    color:RGB(125, 125, 125) ;
}
.con-content p {
    font-size: 16px;
    font-weight: 400;
    color: RGB(33, 37, 41);
}




/* start contact-input */
.contact-input{
    width: 90%;
    background-color: #FFFFFF;
    margin: auto ;
    text-align: center;
    filter: drop-shadow(1px -1px 7px #dedede);
}
.contact-input #name{
    width: 44%;
    height: 50px;
    margin: 1%;
    border: #E8E3E3 solid 2px;
}

.contact-input #email{
    width: 44%;
    height: 50px;
    margin: 1%;
    border: #E8E3E3 solid 2px;
}

.contact-input #sub{
    width: 90%;
    height: 50px;
    margin: 1%;
    border: #E8E3E3 solid 2px;
}

.contact-input #message{
    width: 90%;
    height: 150px;
    margin: 1%;
    border: #E8E3E3 solid 2px;
    
}


.contact-input button{
    background-color: #E61414;
    color: #FFFFFF;
    border: #E51414 2px;
    border-radius: 25px;
    width: 15%;
    height: 50px;
    margin:  2%;
}

/* End contact-input */
/* End section 1-4 */
/* start contact-section */

/* End contact  */



/* start footer */
.footer{
background-color: #000000;
overflow: auto;
padding: 2%;
width: 100%;
display: flex;
justify-content: center;
/* align-content: center; */
}

/* start f-left */
.footer-left{
   width: 25%;
   margin-left: 4%;
   margin-top: 1%;
}
/* End f-left */

/* start f-left-up */
.f-left-up{
    width: 70%;
    display: flex;
    flex-wrap: wrap;
    
}
.f-left-up img{
    width: 10%;
    height: 50%;
    
}

.f-left-up a{
    color:#FFFFFF;
    font-weight: 700;
    font-size: 30px;
    font-weight: 700;
    text-decoration: none;
    margin-left: 5px;
    
    width: 10%;
    
}
.f-left-up a span{
    color: #E61414;
}

.f-left-up p{
    color: white;
    font-size: 16px;
    font-weight: 400;
    width: 100%;
    margin-top: 3px;
}

/* End f-left-up */

/* start f-left-down */
.f-left-down{
    /* background-color: #CE1212; */
    text-align: center;
    width: 70%;
    
}
.f-left-down h3{
    border-bottom: #ffffff solid 1px;
    font-size: 19;
    font-weight: 700;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #FFFFFF;
    width: 100%;
}
.f-left-down .box-logo{
    width: 100%;
    height: 50px;
    display: flex;
    flex-wrap: nowrap;
       
}


/* End f-left-down */

/* start f-center-up */
.f-center-up{
    width: 40%;
    /* background-color: #525252; */
    margin: 1%;    
    
}

.f-center-up h3{
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 700;
}
.f-center-up p{
    color: #FFFFFF;
    font-size: 16;
    font-weight: 400;
    width: 85%;
    margin: 2% 0%;
}
.f-center-up button{
    background-color: #E61414;
    color: #FFFFFF;
    border: #E51414 2px;
    width: 20%;
    height: 35px;
    
    
}
.f-center-up input{
    width: 70%;
    height: 40px;
    
    border: #000000 solid 2px;
}

/* End f-center-up */


/* start f-center-down */
.f-center-down{
    /* background-color: orange; */
    display: flex;
    flex-direction: column;
    
}
.f-center-down h3{
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 700;
    margin: 10px 0px;
}
.f-center-list{
    /* background-color: orange; */
    width: 100%;
    transform: translatex(-15%);
    /* margin-right: 10%; */
    display: flex;
    justify-content: space-evenly;
}
.f-center-list1{
    width: 35%;
}
.f-center-list2{
    width: 35%;
}
.f-center-list li{
    list-style: none;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 400;
    transition: all .5s;
    margin-bottom: 5px;
    
}
.f-center-list li:hover{
    transform: translateX(10%);
}
.f-center-list a{
    text-decoration: none;
    font-size: 16px;
    font-weight: 400;
    color: #FFFFFF;
    margin-left: 5px;
}

/* End f-center-down */




/* start f-right */
.f-right{
    /* background-color: blueviolet; */
    width: 30%;
    margin: 1% 0%;
}
.f-right h3{
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 700;
}
.f-right p{
    color: #FFFFFF;
    font-size: 16;
    font-weight: 400;
    width: 85%;
    margin: 2% 0%;
}
.f-right i{
    color: #CE1212;
    margin-right: 2%;
   
}
/* End f-right */
/* End footer */