
body{
    width:1180px;
    height:100vh;
    margin:10px auto;
    background-color:rgb(255, 255, 255);
}

/* Header */

#header{
    display:flex;
    justify-content:space-between;
    align-items:center;
}
#head-left img{
    width:130px;
    height:auto;
}
#head-right ul{
    display:flex;
    justify-content:center;
    align-items:space-between;
    gap:70px;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    font-size:1.2rem;
    font-weight:600;
    color:gray;
}
li{
    list-style:none;
}
a{
    text-decoration:none;
    color:rgb(100, 100, 100)
}


.menu-items img{
width:26px;
height:auto;
position:relative;
top:3px;
}

#top-container{
    width:1150px;
    height:auto;
    display:flex;
    justify-content:flex-start;
    flex-direction:column;
    gap:5px;
    padding:10px;
    border-bottom:10px solid rgb(170, 170, 170,0.6);
    border-left: 7px solid rgb(170, 170, 170);
    border-style:outset;
    padding:15px;
    border-radius:16px;
    background-color:white;
    margin-bottom:40px;
}

#head-name{
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-weight:600;
    font-size:1.1rem;
    margin-top:5px;
  margin-bottom:10px;
  color:rgb(101, 35, 27);
}


#rating-cont{
    width:100%;
    height:30px;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:30px;
}


#rating-cont span:nth-child(1){
    display:flex;
    gap:5px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size:1.4rem;
    font-weight:500;
}

#rating-cont span:nth-child(1) img{
    width:20px;
    height:auto;
}

#rating-cont span:nth-child(2){
    display:flex;
    gap:5px;
    font-family: Verdana, sans-serif;
    font-size:1.2rem;
    font-weight:500;
    color:rgb(26, 26, 26);
}
#free{
    color:brown;
    font-weight:bold;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
}

#rest-loc-cont{
    width:100%;
    height:40px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    gap:10px;
}

#loc-top{
    display:flex;
    justify-content:flex-start;
    gap:20px;
}

#loc-top span{
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size:1.3rem;
    font-weight:500;
}
#loc-top span:nth-child(2){
    color:rgb(100, 100, 100);
    font-family:'Courier New', Courier, monospace;
    font-weight:600;
    
}

#loc-bottom span{
     font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size:1.3rem;
    font-weight:500;
}

/* Deal section */
#deal-parent{
    display:flex;
    justify-content:space-between;
}

#deals{
    display:flex;
    justify-content:center;
    padding:15px;
    border:2px solid green;
    border-radius:18px;
    width:45%;
    height:auto;
}

#deal-content{
    display:flex;
    gap:7px;
}


#deal-content img{
   width:50px;
   height:auto;
}
#deal-cont span:nth-child(1){
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight:800;
    font-size:1.6rem;
}
#deal-cont span:nth-child(2){
    font-family:Arial, Helvetica, sans-serif;
    color:grey;
    font-size:1rem;
}
#deal-cont{
    display:flex;
    flex-direction:column;
    margin-top:1px;
}
#deals{
    display:flex;
    flex-direction:column;
    gap:0;
}

/* banner scetion */
#banner-parent{
    margin-block:20px;
    position:relative;
    border-radius:20px;
}
#banner-parent img{
    width:100%;
    height:350px;
    object-fit:stretch;
    border-radius:20px;
}

.slider-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:45px;
    border-radius:10px;
    font-size:2rem;
    font-weight:bold;
    background-color:chartreuse;
}
.slider-btn.left{
    position:absolute;
    top:42%;
    left:1px;
}
.slider-btn.right{
    position:absolute;
    top:42%;
    right:1px;
}
.slide{
    display:none;
}
.slide.active{
    display:block;
    width:100%;
    height:300px;
    overflow:hidden;
}
#dots{
    text-align: center;
    position: absolute;
    bottom: 10px;
    width: 100%;
}
.dot{
    height: 10px;
    width: 10px;
    background-color: #7d7d7d;
    border-radius: 50%;
    display: inline-block;
    margin: 0 4px;
    cursor: pointer;
}
.dot.active{
    background-color:white;
    height:10px;
    width:20px;
    border-radius:10px;
}
/* items */
#item-top{
    display:flex;
    justify-content:space-between;
   margin-inline:5px;
   margin-top:40px;
}

#item-top span{
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-weight:600;
    font-size:2rem;
}
#str-sm{
    font-size:18px;
    color:brown;
    position:relative;
    bottom:12px;

}
.items{
    display:flex;
    justify-content:space-between;
    margin-top:20px;
    gap:65px;
}
.items:nth-child(1){
    margin-top:10px;
}
.item-card{
    position:relative;
  padding-block:10px;
}

.left-cont{
    display:flex;
    gap:15px;
    flex-direction:column;
    width:50%;
    height:auto;
}
.left-cont span{
    font-family:Tahoma, Geneva, Verdana, sans-serif;
    font-size:1.3rem;
}
.left-cont span:nth-child(1){
font-family: serif;
font-size:1.3rem;
font-weight:600;
color:rgb(49, 49, 49);
margin-top:30px;
font-family:Verdana, Geneva, Tahoma, sans-serif;
}

.left-cont span small:nth-child(1){
    color:rgb(66, 1, 14);
    font-family:cursive;
    font-size:1rem;
}

.left-cont span:nth-child(2){
font-family:'Times New Roman', Times, serif;
font-size:1.3rem;
font-weight:600;
}
.left-cont span:nth-child(3){
    color:green;
    font-size:1.4rem;
}
.left-cont span:nth-child(4){
    font-size:1.2rem;

}

.items img{
    width:270px;
    max-height:180px;
    height:stretch;
    margin-top:20px;
    border-radius:12px;
    object-fit:cover;
}

/* Add to cart btn */
.add-btn{
    width:120px;
    height:37px;
    border-radius:12px;
    background-color:rgb(17, 72, 106);
    color:white;
    font-family:Calibri, 'Trebuchet MS', sans-serif;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:1.1rem;
    font-weight:600;
    cursor:pointer;
    position:absolute;
    right:70px;
    bottom:0;
    overflow:hidden;
}

.quantity-selector{
      width:120px;
    height:37px;
    border-radius:12px;
    background-color:rgb(255, 255, 255);
    color:white;
    font-family:Calibri, 'Trebuchet MS', sans-serif;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:1.1rem;
    font-weight:600;
    cursor:pointer;
    position:absolute;
    right:70px;
    bottom:0;
    overflow:hidden;
}

.decrease{
    width:60px;
    height:35px;
    border-radius:10px;
    color:rgb(0, 0, 0);
    font-weight:800;
    font-size:1.26rem;
    border:none;
    outline:none;
}

.increase{
     width:60px;
    height:35px;
    border-radius:10px;
    color:rgb(0, 0, 0);
    font-weight:800;
    border:none;
    outline:none;
    font-size:1.26rem;
}
.quantity-input{
     width:30px;
    height:28px;
    border-radius:5px;
    color:rgb(0, 0, 0);
    text-align:center;
    font-weight:600;
    border:none;
    outline:none;
     font-size:1rem;
}
/* cart section */
.cart-Container.hidden{
    display:none;
}

.cart-Container{
    width:70%;
    height:40px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background-color:darkgreen;
    padding:20px;
    border-radius:20px;
    position:fixed;
    bottom:5px;
    right:250px;
    margin-top:200px;
}

#left-cart span{
    font-family:Arial, Helvetica, sans-serif;
    font-size:1.3rem;
    font-weight:600;
    color:white;
}
#right-cart button{
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
     font-size:1.3rem;
    font-weight:600;
    width:120px;
    height:55px;
    border-radius:15px;
}

