/*----- Default CSS -----*/
  :root {
    --dark-bg: #31312f;
    --main: #C39B3B;
    --light-text: #ffffff;
  }


  .web-view {
    display: flex;
  }

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


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

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

  .mobile-toggle,
  .mobile-close,
  .nav-wrapper {
    display: none;
  }


@media (max-width: 1400px) {
  
.thumb-img img {
    width: 120px;
    height: 100px;}
}


  @media only screen and (max-width: 991px) {
 #thatiModal .btn{min-width: 110px;}
  .thumb-wrap {
    overflow: auto;
    max-height: auto;
    display: flex;
}
    .mobile-view {
      display: block !important;
    }
.web-view{ display: none !important;}
    .promo-box {
      width: 130px;
    }

    #sidebar,
    #content .nav-bottom {
      display: none;
    }

    #content {
      width: 100%;
    }

    .search-wrap {
      margin-top: 16px;
    }

    .brand-logo img {
      width: 100px;
    }

    .search-bar {
      height: 48px;
    }

    .heart-wrap {
      width: 40px;
      height: 40px;
      border: 2px solid #C39B3B;
      font-size: 16px;
    }

    .btn-search {
      width: 35px;
      height: 35px;
      right: 10px;
      top: 5px;
    }

    .mobile-toggle {
      display: block;
      background-color: transparent;
      border: none;
      width: auto;
      cursor: pointer;
      color: #fff;
      font-size: 28px;
      margin-top: 8px;
    }

    .nav-wrapper {
      display: block;
      position: fixed;
      top: 0;
      left: -100%;
      width: 75%;
      height: 100vh;
      background: #fff;
      transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);

      flex-direction: column;
      padding: 20px;
      box-shadow: 10px 0 20px rgba(0, 0, 0, 0.1);
      display: flex;
      flex-direction: column;

      background: #2e2e2e;
      color: #fff;
      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
      padding: 30px 8px 20px;

      z-index: 100;
      height: 100%;
    }

    .nav-wrapper.active {
      left: 0;
    }

    .mobile-close {
      display: block;
      background-color: transparent;
      box-shadow: none;
      border: none;
      font-size: 30px;
      color: #fff;
      position: absolute;
      top: 16px;
      right: 16px;
    }

    .main-nav {
      flex-direction: column;
      width: 100%;
    }

    .nav-wrapper .hide_space {
      border-top: 1px solid #FFFFFF80;
      padding-top: 16px
    }



    .nav-wrapper ul li {
      font-size: 16px;
    }

    .nav-wrapper ul li>ul {
      margin-left: 10px;
    }

    .nav-wrapper ul li>ul li {
      font-size: 14px;
    }

    .nav-wrapper ul li a {
      font-size: 16px;
      font-weight: 700;
      line-height: 24px;
      padding: 10px 16px;
      display: flex;
      align-items: center;
      color: #fff;
    }

    .nav-wrapper ul.components li a:hover {
      color: #fff;
    }

    .nav-wrapper ul li a img {
      margin-right: 15px;
      width: 45px;
    }


    .nav-wrapper ul li.active a {
      color: var(--m-main);
    }

    .section-title {
      font-size: 24px;

    }

    .logo-box {
      margin-bottom: 20px;
    }

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

    .category-wrap {
      width: 125px;
      height: 125px;
    }

    .category-text {
      margin-top: 10px;
      font-size: 16px;
    }

    .owl-dots .owl-dot {
      width: 10px;
      height: 10px;
    }

    .product-image {
      height: 200px;
    }

    .success-box,
    .header-title {
      padding: 30px 16px;
      font-size: 24px;
    }

    .static-page {
      padding: 40px 16px 100px;
    }

    .static-page-title {
      font-size: 20px;
    }

    .static-page p {
      color: #070707;
      font-size: 16px;
    }

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

    .subtitle {
      font-size: 16px !important;
      line-height: 1.5;
    }

    .contact-page .form-control,
    .profile-card .form-control {
      font-size: 14px;
      height: 45px;
    }

    .contact-page label,
    .profile-card label {
      font-size: 14px;
    }

   .main-btn ,.main-outline-btn  {
      font-size: 14px;
      padding: 8px 16px;
      border-radius: 14px;
      height: 45px;
    }

    .info-card {
      padding: 20px 16px;
    }

    .icon-circle {
      width: 75px;
      height: 75px;
      font-size: 25px;
    }

    .info-title {
      font-size: 16px;
    }

    .info-text {
      font-size: 14px;
    }

    .typed-search-box {
      width: 88%;
      left: 6%;
    }

    .qty-box {
      margin-top: 16px;
      width: 110px;
    }

    .cart-title {
      font-size: 20px;

    }
  }

  @media only screen and (max-width: 768px) {
    .cart-card {
      display: block;
    }
.product-details-title {
    font-size: 20px;
   }
  }


  @media only screen and (max-width: 578px) {
    .promo-box {
        width: 100px;
    }
    .cart-item-image {

      margin-top: 30px;
      margin-bottom: 10px;
    }

    .success-box,
    .header-title {
      padding: 26px 16px;
      font-size: 20px;
    }

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

    .footer_title {
      font-size: 18px;
    }

    footer a {
      font-size: 14px;
    }
  }


  @media only screen and (max-width: 440px) {
    .cart-item img {
      width: 100%;
      height: 150px;
      /*object-fit: cover;*/
    }

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

    .static-page p {
      font-size: 14px;
    }

    .subtitle {
      font-size: 14px !important;
    }
  }