:root {
   --primary-blue: #0F497B;
   --accent-gold: #CE9730;
   --text-light: #F0F0F0;
   --text-dark: #02090F;
   --bg-light: #F7F7F7;
   --font-heading: 'Playfair Display', serif;
   --font-body: 'Roboto', sans-serif;
 }


 .web-view {
   display: flex;
 }

 .mobile-view {
   display: none !important;
 }



 .mob-view,
 .mobille-view {
   display: none;
 }

 @media (min-width: 1400px) {
   .container {
     max-width: 1400px !important;
   }
 }

 @media (min-width: 1200px) {
   .display-3 {
     font-size: 4.6rem;
   }
 }

 @media only screen and (max-width: 1200px) {
   .add_advisor_wrapper {
     width: 80%;
   }
 }

 @media only screen and (max-width: 991px) {
    
    .service .service-item:hover .service-inner .service-img img {
    transform: scale(1);
}
.service .service-item {
    position: relative;
    overflow: initial;
}
.service-title-name{display:none;}
.service .service-item .service-inner .service-title .service-content {
      position: relative;
    bottom: 0%; 
    margin-left: 0px;
    margin-right: 0px;
    opacity: 1;
    border-radius: 0 0 10px 10px;
}
 .service-content h4{font-size:18px;}
.service .service-item .service-inner .service-img::after {
    content: unset;}
    .service .service-item .service-inner .service-title {
    margin-top:-10px;}
   .web-view {
     display: none !important;
   }

   .mobile-view {
     display: block !important;
   }

   .min-vh-100 {
     min-height: auto !important;
   }

   /*mobile nav*/
   .header-mobile {
     position: -webkit-sticky;
     position: sticky;
     top: 0;
     z-index: 1000;
     /* background-color: #fff; */
     padding: 0;
     background: linear-gradient(rgb(16 121 223 / 70%), rgb(11 109 204 / 70%)),url("../images/header-overlay.png");
    background-size: cover;
    transition: all 0.3s ease;
   }
   
   .header-mobile img{
       max-height: 80px;
   }

   .img-logo-mobile {
     padding-top: 15px;
   }

   .header-mobile .main-menu>li {
     position: relative;
   }

   .side-menu-logo {
     text-align: right;
     padding-right: 15px;
   }

   .header-logo {
     text-align: right;
   }

   .header-mobile .side-menu-close {
     background: transparent;
   }

   .header-mobile .side-menu-close span {
     width: 30px;
   }


   /* side menu */
   .side-menu-wrap {
     display: none !important;
     width: 300px;
     position: fixed;
     right: -110%;
     top: 0;
     background: #fff;
     height: 100%;
     -webkit-box-shadow: 0 1px 5px 0 rgba(83, 83, 83, 0.2);
     box-shadow: 0 1px 5px 0 rgba(83, 83, 83, 0.2);
     overflow-y: auto;
     z-index: 1000;
     transition: 0.4s;
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -ms-transition: 0.4s;
     -o-transition: 0.4s;
   }

   .side-menu-wrap.opened {
     display: block !important;
     left: 0;
     transition: 0.8s;
     -webkit-transition: 0.8s;
     -moz-transition: 0.8s;
     -ms-transition: 0.8s;
     -o-transition: 0.8s;
   }

   .overlay-mobile {
     position: fixed;
     z-index: 1000;
     top: 0;
     left: 0;
     background-color: rgba(0, 0, 0, 0.5);
     opacity: 0;
     visibility: hidden;
     transition: all 0.3s;
   }

   .side-menu-wrap.opened+.overlay-mobile {
     visibility: visible;
     opacity: 1;
   }

   .side-menu-nav .main-menu {
     padding-top: 70px !important;
     width: 100%;
   }

   .side-menu-nav .main-menu>li>a {
     color: #887d74;
     padding: 12px 20px 5px 10px;
     font-size: 14px;
     font-weight: 400;
     display: block;
     transition: 0.4s;
   }

   .side-menu-nav .main-menu>li>a:hover,
   .side-menu-nav .main-menu>li>a.active {
     color: var(--bs-primary);
   }

   .menu-mobile {
     background-color: transparent !important;
     border-radius: 10px !important;
     height: 42px !important;
     width: 49px !important;
   }

   .side-menu-wrap .side-menu-close {
     position: absolute;
     right: 20px;
     top: 20px;
     height: 34px;
     width: 34px;
     background-color: transparent;
     border-radius: 50%;
     -webkit-border-radius: 50%;
   }

   .side-menu-close {
     height: 40px !important;
     width: 40px !important;
     border-radius: 50%;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     -ms-border-radius: 50%;
     -o-border-radius: 50%;
   }

   .side-menu-close span {
     height: 3px;
     width: 20px;
     border-radius: 4px;
     background: #fff;
     position: relative;
     opacity: 1;
     transition: 0.4s;
     -webkit-transition: 0.4s;
     -moz-transition: 0.4s;
     -ms-transition: 0.4s;
     -o-transition: 0.4s;
   }

   .side-menu-close.closed span {
    background: var(--primary-blue);
     height: 2px;
     border-radius: 0;
   }

   .side-menu-close span:nth-child(1) {
     top: -5px;
   }

   .side-menu-close span:nth-child(3) {
     bottom: -5px;
   }

   .side-menu-close.closed span:nth-child(1) {
     transform: translateY(7px) rotate(45deg);
     -webkit-transform: translateY(7px) rotate(45deg);
     -moz-transform: translateY(7px) rotate(45deg);
     -ms-transform: translateY(7px) rotate(45deg);
     -o-transform: translateY(7px) rotate(45deg);
   }

   .side-menu-close.closed span:nth-child(2) {
     opacity: 0;
   }

   .side-menu-close.closed span:nth-child(3) {
     transform: translateY(-7px) rotate(-45deg);
     -webkit-transform: translateY(-7px) rotate(-45deg);
     -moz-transform: translateY(-7px) rotate(-45deg);
     -ms-transform: translateY(-7px) rotate(-45deg);
     -o-transform: translateY(-7px) rotate(-45deg);
   }

   .side-menu-btns {
     font-size: 13px;
     padding-block: 10px;
     border-radius: 25px;
   }

   .side-menu-btns img {
     padding-left: 4px;
   }

  h2 {
     font-size: 24px;
   }
.main-btn{
    color:#fff !important;
}
   .side-card .bold {
     font-size: 14px;
   }

   .side-card h6 {
     font-size: 18px;
   }

   .forgot_link {
     font-size: 16px;
   }

   .address-box input {
     font-size: 14px;
   }
.about-text p
{
  font-size: 16px;
}
.w-65 {
    width: 100%;
}
.cart-img {
    margin-right: 0;
}
.cart-box {
    border-radius: 20px;
    padding: 30px 16px;}
   .address-box {
     border-radius: 12px;
     padding: 0px 14px;
     height: 48px;
     gap: 6px;
   }

   .welcome-heading {
     font-size: 30px;
   }

   .welcome-text {
     font-size: 20px;
     line-height: 140%;
   }

   .w-75 {
     width: 100% !important;
   }

   .account-heading {
     font-size: 30px;
     margin-bottom: 45px;
   }

   .form-control,
   .form-select {
     font-size: 16px;
   }

   .row.h-100 {
     min-height: 100vh;
   }

   .welcome-panel {
     padding: 30px !important;
     height: auto;
   }

   .create-account-panel {
     padding: 20px !important;
     height: auto;
   }

   .about-text p,
   .about-wrap p {

     font-size: 16px;
   }

   .about-text h2,
   .khan_title {
     font-size: 24px;
   }

   .about-wrap p {
     width: 100%;
   }

   .reservation-image {
     border-radius: 20px;
     height: auto;
   }

   .avatars img {
     margin-top: 10px;
   }

   .border-end {
     border-bottom: 1px solid #dee2e6 !important;
     border-right: unset !important;
   }

   .contact-card h6 {
     font-size: 18px;
   }

   .contact-card p {
     font-size: 14px;
   }

   .contact-card {
     padding: 16px;
     background: #fff;
     border-radius: 20px;
   }

   .contact-section {
     margin-top: -80px;
   }

   .contact_title {
     top: 30px;
   }

   .contact-form input,
   .contact-form textarea,
   .contact-form input::placeholder,
   .contact-form textarea::placeholder {
     font-size: 14px;
   }

   .checkout-box {
     max-width: 100%;
   }

   .checkout_input {
     border-radius: 16px;
     padding: 14px;
   }

   .checkout-title {
     font-size: 20px;
   }

   .info-box {
     padding: 16px 14px;
     font-size: 14px;
   }
.meal_title {
    font-size: 24px;
}
.meal_price {
    font-size: 20px;
}
.menu-tabs .nav-link {
    font-size: 16px;}
 }

 @media only screen and (max-width: 768px) {
  .menu-tabs {
    padding: 14px 16px;
    border-radius: 20px;
    display: inline-flex;
    gap: 12px;
}
.item_data{display:block !important ;}
.item_data p{margin-bottom:10px;}
.menu-tabs li {
    width: 45%;
}
.menu-tabs .nav-link {
    border-radius: 30px;
    padding: 8px 6px;
    font-size: 14px;
}
   h2 {
     font-size: 24px;
   }
.meal_price {
    font-size: 18px;
}
.food-title {
    font-size: 18px;
    margin-top: 10px;}
    .food-desc {
    font-size: 16px;
    line-height: 1.5;}
    .food-img {
    width: 150px;
    height: 150px;}
    .add_to_cart {
    margin-top: 0px;}
   .form-card {
     border-radius: 20px;
     padding: 24px 20px;
     margin-top: 30px;
   }

   .btn-submit {
     margin-top: 30px;
     width: 175px;
   }

   .about-wrap {
     padding-block: 40px;
   }

   .booking-title {
     font-size: 24px;
   }

   .footer ul li a {
     font-size: 16px;
   }

   .footer-bottom {
     margin-top: 30px;
     padding-top: 15px;
     font-size: 16px;
   }

   .footer ul li {
     margin-bottom: 8px;
   }

   .footer h6 {
     margin-bottom: 16px;
     font-size: 20px;
   }

   .img-1,
   .img-2,
   .img-3 {
     position: relative;
     transform: none;
     left: 0;
     margin-bottom: 15px;
   }

   .about-img {
     height: 315px;
     top: 0;
     border-radius: 20px;
   }

   .about-images {
     height: auto;
     display: flex;
     flex-direction: column;
     align-items: center;
   }

   section {
     padding-block: 32px;
   }

   .booking-img {
     height: auto;
     margin-top: 25px;
     border-radius: 20px;
   }

 }



 @media only screen and (max-width: 578px) {

   .form-control,
   .form-select {
     font-size: 14px;
   }

   .account-heading {
     font-size: 24px;
     margin-bottom: 45px;
     margin-top: 20px;
   }

   .welcome-heading {
     font-size: 24px;
   }

   .welcome-text {
     font-size: 18px;
   }

   .main-btn {
     font-size: 14px;
     height: 48px;
         width:160px;
   }
.btn-cart {
    height: 38px;
}
 section {
        padding-block: 20px;
    }
 }


 @media only screen and (max-width: 360px) {
   .info-box {
     padding: 14px 12px;
     font-size: 13px;
   }

 }