@media (max-width: 1570px) {
  h3 {
    font-size: 23px;
  }
  .Title {
    h2 {
      font-size: 50px;
    }
  }
  p {
    font-size: 18px;
  }
  .Feature {
    .Item {
      padding: 0px;
      gap: 13px;
    }
  }
  .Banner-slider {
    .slick-dots {
      left: 130px;
    }
  }
  .ProductGallery {
    & .slider-wrapper {
      .slider-nav {
        height: 100%;
      }
    }
    .ProductMainDetails {
      padding: 0px 0px;
    }
  }
  .ContactInformation {
    h3 {
      font-size: 35px;
    }
  }
  /* GALLERY */
  .ProductGallery {
    & .ProductMainDetails {
      h3 {
        font-size: 30px;
      }
      & .VarientButton {
        & .Color,
        & .Size {
          h5 {
            font-size: 17px;
          }
          span {
            font-size: 17px;
          }
        }
        & .ContactNow {
          a {
            font-size: 16px;
            border: 1px solid var(--secondary-color);
            padding: 8px 40px;
          }
        }
      }
    }
  }
}
@media (max-width: 1333px) {
  p {
    font-size: 16px;
  }
  h3 {
    font-size: 21px;
  }
  h5 {
    font-size: 20px;
  }
  .Feature {
    & .Item {
      flex-flow: row wrap;
      & .Content {
        p {
          font-size: 16px;
        }
      }
      & .Icon {
        i {
          font-size: 43px;
        }
      }
    }
  }
  .Title {
    h2 {
      font-size: 41px;
    }
    p {
      margin: 11px 0;
    }
  }
  .QualityPriority {
    .Bg {
      padding: 40px;
    }
  }
  /* contact us */
  .ContactInformation {
    span {
      font-size: 22px;
      margin: 31px 0;
    }
    h3 {
      font-size: 29px;
    }
    p {
      max-width: 90%;
    }
  }
  .ProductGallery {
    & .ProductMainDetails {
      ul {
        margin-bottom: 7px;
      }
      h3 {
        font-size: 26px;
      }
      .description {
        margin: 10px 0;
      }
      .VarientButton {
        margin-top: 30px;
      }
      .FeatureItem {
        margin-top: 30px;
      }
      & .FeatureItem {
        .Item {
          padding: 11px;
          i {
            font-size: 50px;
          }
        }
      }
    }
  }
}
@media (max-width: 1199px) {
  h3 {
    font-size: 19px;
  }
  a {
    font-size: 14px;
  }
  h6 {
    font-size: 16px;
  }
  .Primary-button {
    a,
    button {
      padding: 5px 4px 5px 15px;
    }
  }
  .Banner-slider {
    .slick-dots {
      left: 83px;
      bottom: 15px;
    }
    .slick-next {
      right: 63px;
    }
    .slick-prev {
      right: 95px;
    }
    .slick-prev,
    .slick-next {
      width: 28px;
      height: 28px;
      bottom: 15px;
    }
  }
  header {
    & .container {
      padding: 0 0;
      .logo {
        width: 150px;
      }
    }
  }
  .Home-About {
    p {
      margin: 14px 0;
    }
  }
  .Title {
    h2 {
      font-size: 38px;
    }
  }
  .Hospitality {
    p {
      width: 100%;
    }
  }
  .faq {
    .faq-content {
      width: 100%;
      padding: 30px;
      .faq-item {
        .faq-answer {
          width: 90%;
        }
      }
    }
  }
  .Explore-Category {
    & .Category-Slider {
      & .Product-Card {
        .Product-Content {
          bottom: 10px;
          padding: 6px 20px;
        }
      }
    }
  }
  footer {
    p {
      width: 100%;
      font-size: 14px;
    }
    h4 {
      font-size: 18px;
    }
    & form {
      button {
        padding: 4px 12px;
        font-size: 13px;
        right: 6px;
      }
      input {
        padding: 7px 100px 7px 12px;
        font-size: 13px;
      }
    }
    .footer-bottom {
      margin-top: 33px;
      padding: 12px 0;
    }
  }
  .HomeProduct {
    & .showmoreFlex {
      p {
        width: 60%;
      }
    }
  }
  .InnerBanner {
    height: 40vh;
    & .BannerCnt {
      h1 {
        font-size: 45px;
      }
    }
  }
  .ContactInformation {
    & .Form {
      h5 {
        margin-bottom: 10px;
      }
    }
    h3 {
      font-size: 25px;
    }
    p {
      max-width: 95%;
    }
    button {
      margin-top: 3px;
    }
  }
  .ProductGallery {
    & .ProductMainDetails {
      h3 {
        font-size: 23px;
      }
      .VarientButton {
        gap: 13px;
      }
      .FeatureItem {
        gap: 10px;
        .Item {
          width: calc(50% - 5px);
        }
      }
    }
  }
  .PeopleAlsoBought {
    padding: 60px 0;
    margin-top: 35px;
    .Title {
      margin-bottom: 40px;
    }
  }
}
@media (max-width: 991px) {
  .Title {
    h2 {
      font-size: 35px;
    }
  }
  h5 {
    font-size: 18px;
  }
  h3 {
    font-size: 17px;
  }
  .row {
    row-gap: 40px;
  }
  .Feature {
    margin: 40px 0;
    & .Item {
      flex-flow: nowrap;
    }
  }
  .Home-About {
    margin: 60px 0;
  }
  .HomeProduct {
    padding: 43px 0;
    .slick-prev,
    .slick-next {
      width: 30px;
      height: 30px;
    }
    .showmoreFlex {
      margin-top: 35px;
      p {
        width: 70%;
      }
    }
  }
  .Hospitality {
    .Content {
      padding-left: 0px;
    }
  }
  .Explore-Category {
    margin: 60px 0;
    & .Title {
      p {
        width: 85%;
      }
    }
  }
  .faq {
    margin: 60px 0;
    .row {
      row-gap: 0;
    }
    & .faq-content {
      & .faq-item {
        i {
          font-size: 14px;
        }
      }
    }
  }
  .slick-prev,
  .slick-next {
    width: 28px;
    height: 28px;
  }
  footer {
    h4 {
      font-size: 17px;
    }
    ul {
      display: flex;
      flex-flow: ROW wrap;
    }
  }
  .Banner-slider {
    .slick-dots {
      left: 70px;
    }
    .slick-dots {
      gap: 3px;
      li button {
        width: 16px;
        height: 16px;
      }
    }
  }
  .About {
    margin: 60px 0;
    .Title {
      h2 {
        margin-bottom: 9px;
      }
    }
  }
  .MiddileAbout {
    .MarginTop {
      margin-top: 50px;
    }
    i {
      font-size: 24px;
      width: 40px;
      height: 40px;
    }
  }
  .QualityPriority {
    margin: 55px 0;
  }
  .InnerBanner {
    height: 35vh;
    & .BannerCnt {
      h1 {
        font-size: 33px;
      }
    }
  }
  .ContactInformation {
    margin: 50px 0px;
    h3 {
      font-size: 21px;
    }
    .Title {
      margin-bottom: 36px;
    }
    .Form {
      background-color: rgba(0, 0, 0, 0.03);
      border-radius: 12px;
      padding: 40px;
      form {
        input,
        select,
        textarea {
          background-color: transparent;
          padding-left: 0 !important;
        }
      }
      .row {
        row-gap: 0px;
      }
    }
    & .Map {
      iframe {
        width: 100%;
        margin-top: 50px;
      }
    }
  }
  .ProductGallery {
    .ContentFlex {
      flex-flow: row wrap;
      & .slider-wrapper {
        width: 100%;
      }
      & .ProductMainDetails {
        width: 100%;
      }
    }
  }
  .ProductGallery {
    & .slider-wrapper {
      margin-bottom: 20px;
    }
  }
  .PeopleAlsoBought {
    padding: 50px 0;
    margin-top: 10px;
  }
}
@media (max-width: 768px) {
  header {
    .top-header {
      position: relative;
      z-index: 9999;
      p {
        font-size: 14px;
        font-weight: 300;
      }
    }
    & .container {
      padding: 8px 0;
      .logo {
        position: relative;
        z-index: 9999;
      }
      .ButtonFlex {
        .Primary-button {
          position: relative;
          z-index: 9999;
        }
      }
      .MobBtn {
        display: block;
        position: relative;
        z-index: 999;
        &.active {
          span:nth-child(1) {
            transform: rotate(45deg) translate(5px, 5px);
          }
          span:nth-child(2) {
            opacity: 0;
          }
          span:nth-child(3) {
            transform: rotate(-45deg) translate(6px, -6px);
          }
        }
      }
      .menu {
        display: none;
        overflow: hidden;
        max-height: 0;
        transition: max-height 1s ease;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        z-index: 99;
        padding: 25px;
        padding: 135px 20px 20px 20px;
        border-top: 1px solid rgba(0, 0, 0, 0);
        ul {
          border-top: 1px solid rgba(0, 0, 0, 0.3);
          flex-flow: column;
          gap: 5px;
          padding-top: 45px;
          li {
            padding: 5px 0;
            a {
              display: flex;
              gap: 20px;
            }
            .dropdown-menu {
              position: unset;
              border: none;
              padding: 10px;
              li {
                a {
                  opacity: 0.5;
                }
              }
            }
          }
        }
        &.active {
          display: block;
          transition: max-height 1s ease;
          max-height: max-content;
          top: 0;
          left: 0;
          z-index: 999;
        }
      }
    }
  }
  .has-dropdown .dropdown-menu {
    display: none !important;
  }

  .has-dropdown.active .dropdown-menu {
    display: block !important;
  }
  .Title {
    h2 {
      font-size: 27px;
    }
  }
  .Home-About {
    margin: 50px 0;
  }
  .Banner-slider {
    .slick-dots {
      left: 47px;
    }
    .slick-next {
      right: 32px;
    }
    .slick-prev {
      right: 62px;
    }
    .slick-prev,
    .slick-next {
      width: 24px;
      height: 24px;
      i {
        font-size: 13px;
      }
    }
  }
  .HomeProduct {
    & .showmoreFlex {
      flex-flow: row wrap;
      gap: 20px;
      p {
        width: 100%;
      }
    }
  }
  .slick-prev,
  .slick-next {
    width: 25px !important;
    height: 25px !important;
    i {
      font-size: 12px;
    }
  }
  .Explore-Category {
    & .Title {
      p {
        width: 100%;
      }
    }
  }
  h6 {
    font-size: 14px;
  }
  footer {
    & form {
      width: 60%;
    }
  }
  .InnerBanner {
    height: 25vh;
  }
  .About {
    margin: 40px 0;
  }
  .Home-About {
    margin: 40px 0;
  }
  .MiddileAbout {
    .MarginTop {
      margin-top: 40px;
      .row {
        row-gap: 5px;
      }
    }
  }
  .ProductGallery {
    padding: 33px 0;
  }
  .ProductGallery {
    & .slider-wrapper {
      margin-bottom: 8px;
    }
  }
}
@media (max-width: 550px) {
  header {
    & .container {
      .menu {
        padding: 99px 20px 20px 20px;
        ul {
          padding-top: 6px;
        }
      }
    }
  }
  h3 {
    font-size: 18px;
  }
  h5 {
    font-size: 17px;
  }

  a {
    text-decoration: none;
    color: var(--secondary-color);
    font-size: 14px;
  }

  .Primary-button {
    & a,
    & button {
      i {
        padding: 3px;
      }
    }
  }
  header {
    & .top-header {
      padding: 8px 0;
      p {
        font-size: 11px;
      }
    }
    & .container {
      .logo {
        width: 120px;
      }
    }
  }
  .Feature {
    .row {
      row-gap: 22px;
    }
    .Item {
      display: unset;
      text-align: center;
      padding: 0px;
      & .Icon {
        margin: 0 auto;
        i {
          font-size: 45px;
        }
      }
      p {
        max-width: 250px;
        margin: 0 auto;
      }
    }
  }
  .Banner-slider {
    .slick-dots {
      left: 31px;
    }
    .slick-dots {
      li button {
        width: 12px;
        height: 12px;
      }
    }
    .slick-dots li.slick-active button {
      border: 2px solid var(--primary-color);
    }
  }
  .faq {
    & .TitleCenter {
      & .Title {
        margin-bottom: 14px;
      }
    }
    & .faq-content {
      padding: 17px;
      & .faq-item {
        & .faq-question {
          h5 {
            width: 85%;
          }
        }
        .faq-answer {
          width: 100%;
        }
      }
    }
  }
  p {
    font-size: 15px;
    opacity: 0.9;
  }
  .InnerBanner {
    height: 17vh;
    .BannerCnt {
      h1 {
        font-size: 28px;
        line-height: 26px;
      }
    }
  }
  footer {
    & form {
      width: 100%;
    }
  }
  .QualityPriority {
    .Bg {
      padding: 44px 25px;
    }
  }
  .ContactInformation {
    p {
      font-size: 14px;
      padding: 13px 0;
    }
    .Title {
      margin-bottom: 20px;
    }
    & .Form {
      padding: 25px;
      margin-top: 25px;
    }
    .Information {
      .row {
        row-gap: 10px;
      }
    }
  }
  .ProductGallery {
    & .slider-wrapper {
      margin-bottom: 8px;
      .slider-nav {
        width: calc(26.6% - 10px);
      }
      .slider-for {
        width: calc(76% - 6px);
      }
    }
    & .ProductMainDetails {
      .VarientButton {
        flex-flow: row wrap;
        & .ContactNow {
          margin-top: 10px;
        }
      }
    }
  }
}