*{
    text-transform: capitalize;
}
/*start nav*/
nav{
    background: #fff;
    padding: 10px;
    height: 100px;
}
nav img{
    width: 50%;
    height: 90px;
}
nav .nav-link {
    margin-right:  30px;
    text-transform: capitalize;
    font-size: 20px;
    color: #000;
    font-family: 'Courgette', cursive;
}
.navbar-nav .active{
    color: #98033c;
}
.navbar-toggler .fa {
    display: inline-block;
    font-size: 30px;
}
.navbar-toggler{
    margin-left: 100px;
}
/*end nav*/

/*start home*/
.home{
    margin-top: 110px;
}
.home .row {
    --bs-gutter-x: 0;
}
.home .carousel{
   overflow: hidden;
}
.home .text-center{
    background:rgba(152, 3, 60, 0.94); 
    width: 100%;
    height: 500px;
    font-family: 'Courgette', cursive;
    text-transform: capitalize;
    color: #fff;
}
.home .title .btn{
    color: #98033c; 
}
.home .title h3{
    padding-top: 200px;
    font-size: 30px;
}
.home img{
    width: 100%;
    height: 500px;
}
/*end home*/

/*start about*/
.about .ab-image{
    padding: 10px;
}
.about .ab-image img{
    width: 100%;
    height: 100px;
}
.about .vd-image{
    text-align: center;
    position: relative;
}
.about .vd-image img{
   
    width: 100%;
    height: 100%;
}
.about .vd-btn{
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgba(152, 3, 60, 0.79);
    top: 170px;
    left: 290px;
}
.about .vd-btn:after{
    position: absolute;
    content: "";
    top: 35%;
    left: 40%;
    border-left: 25px solid #fff;
    border-bottom: 15px solid transparent;
    border-top: 10px solid transparent;
}
@media(max-width:500px){
    .about .vd-btn{
        width: 80px;
        height: 80px;
        top: 70px;
        left: 145px;
    }
}
/*end about*/

/*start menu*/

.menu .box{
    position: relative;
    overflow: hidden;
}
.menu .box img{
    width: 100%;
    height: 250px;
}
.menu .box .overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color:#98033c;
    text-align: center;
    transform: translateY(230px);
    color: white;
    transition: .5s;
}
.menu .box .overlay h2{
    padding-top: 30px;
    padding-bottom: 10px;
}
.menu .box:hover .overlay{
    transform: translateY(60px);
}
.menu .owl-nav{
    font-size: 50px;
    text-align: center;
}
.menu .owl-nav span{
    padding: 5px;
    color: #98033c;
}
/*end menu*/
/*start chefs*/
.chefs .box{
    border: 1px solid #000;
}
.chefs .image img{
    width: 100%;
    height: 100%;
}
.chefs .title{
    margin-top: 30px;
    text-align: center;
}
.chefs .title h3{
    color: #98033c;
}
.chefs .title p{
    font-size: 20px;
}
.chefs .box .image{
    position: relative;
}
.chefs .overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:70%;
    background: rgba(0,0,0,.8);
    opacity: 0;
    transition: .3s;
    transform: scale(.7);
}
.chefs .overlay i{
padding: 8px;
color: #98033c;
}
.chefs .overlay > div{
    border: 2px solid #98033c ;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 38px;
    color: aliceblue;
}
.chefs .box:hover .overlay{
opacity: 1;
transform: scale(.9);
}
/*end chefs*/
/*start contact*/
.contact{
    background-image: url(../Imgs/contact2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}
.contact .boxs{
    padding: 10px;
}
.contact .box{
    margin-top: 20px;
    background-color: #fff;
    height: 230px;
    width: 250px;
    color: #000;
    text-align: center;
}
.contact .info{
    padding-top: 35px;
}
.contact .info h2{
    padding: 5px;
}
.contact .info p{
    padding-top: 5px;
    margin-left: 40px;
    font-size: 20px;
}
.contact .icon{
    position:absolute ;
    background-color: #98033c;
    color: #fff;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -9px;
    left: 105px;
    font-size: 35px;
    z-index: 1;
}
.contact .card{
    margin-left: 50px;
     background: #fff;
     padding: 60px;
     color: #98033c;
     margin-top: 20px;
 }
 .contact .card h2{
     font-size: 40px;
     font-weight: 800;
     margin-bottom: 30px;
     color: #000;
 }
 .contact .card .form-control{
     background: none;
     border: 0;
     border-bottom: 1px solid #444;
     margin-bottom: 40px;
 }
 .contact .card textarea{
     height: 100px;
 }
/* end contact*/
/*start week offer*/
.offer .content{
    padding: 45px;
}
.offer .btns{
    text-align: center;
}
.offer .btns .btn{
    padding: 25px;
    text-decoration: none;
    display: inline-block;
}
.offer .btns .active{
    color: #98033c;
}
.offer .btns .btn img{
width: 35px;
height: 30px;
}
.offer .btn h4{
    margin-top: 10px;
}
.offer .breakfast img{
    width: 100%;
    height: 100%;
}
.offer .breakfast .price{
    width: 70%;
    height: 80%;
    background-color: #98033c;
    color: #fff;
    text-align: center;
}
.offer .breakfast .price p{
    font-size: 30px;
}
.offer .breakfast{
    display: none;
}
.offer .active{
    display: block;
}
/* end week offer*/

/*start footer*/
footer{
    background-color: #98033c;
    padding: 0 0 10px;
    margin-top: 30px;
}
footer .brand img{
    width: 100%;
    height: 200px;
}
footer .social{
    margin-left: 20px;
}
footer .social a{
    text-align: center;
}
footer .social i{
    height: 50px;
    width: 50px;
    color: #98033c;
    font-size: 30px;
    margin: 60px 10px;
    background-color: #fff;
    border-radius: 50%;
    padding-top: 10px;
}
footer .copyright{
    color: #999;
    font-size: 15px;
    font-weight: 600;
    margin-top: 30px;
}
/*end footer*/

/*main styel*/
.heading h1{
    font-weight: 800;
    padding:  20px 0 20px 10px;
}
.heading .min-link{
    position: relative;
    padding-left: 80px;
    text-decoration: none;
    color:#98033c;
    font-weight: 500;
    font-size: 25px;
    transition: .3s;
}
.heading .min-link:before{
    position: absolute;
    content: "";
    width: 60px;
    height: 4px;
    background: #98033c;
    bottom:10px;
    left: 0;
    margin-left: 10px;
    transition: .3s;
}
.heading .min-link:hover{
    color:#000;
}
.heading .min-link:hover::before{
    margin-left: 5px;
    background: #000;
}