/* =================================== Max width 1199px =================================== */
@media (max-width: 1199px) {
  /* ===== Our Location =====  */
  .location-box {
    width: unset;
    height: 35rem;
  }
}
/* =================================== max width 1122px ====================================== */
@media (max-width: 1122px) {
  /* ===== upper strip =====  */
  .upper-right::before {
    position: absolute;
    content: "";
    top: 0;
    left: -31px;
    width: 32px;
    height: 100%;
    background-color: #3e2111;
    transform: skew(1deg);
  }
  .upper-right {
    padding-left: 0;
  }
  .upper-right-i {
    padding-left: 0;
    text-wrap: nowrap;
  }
  .upper-right-ii {
    padding-left: 0;
    text-wrap: nowrap;
  }
  .upper-right-i a {
    padding-left: 0;
  }
  .upper-right-ii a {
    padding-left: 0;
  }
}

/* =================================== max width 991px ====================================== */
@media (max-width: 991px) {
  /* ===== upper strip =====  */
  .upper-right::before {
    display: none;
  }
  .upper-right-i a i {
    padding-right: 0;
  }
  .upper-right-container {
    background-color: #3e2111;
  }
  .navbar-brand-i {
    display: block;
  }
  .navbar-nav {
    margin-top: 3rem;
  }
  .navbar .nav-item {
    flex-direction: row;
    justify-content: flex-start;
    margin: 1rem 0;
  }
  .navbar-brand-ii {
    display: none;
  }
  /* ===== hero banner video =====  */
  header {
    max-width: 100%;
    height: 85vh;
  }
  /* ===== About Us section =====  */
  .about-image {
    margin-bottom: 2.4rem;
  }
}
/* ===================================== max width 768 px ===================================== */
@media (max-width: 768px) {
  /* ============== upper strip ===============  */
  .upper-left-container {
    text-align: center;
  }
  .upper-left {
    padding: 0.8rem 0 0 0rem;
  }
  .upper-right {
    padding: 0.8rem 0;
  }
  section {
    padding: 6rem 1.5rem;
  }
  .title {
    font-size: 3.2rem;
  }
  /* ===== hero banner video =====  */
  header {
    max-width: 100%;
    height: 67vh;
    max-height: 100%;
  }
  .pr_img {
    height: 52vh;
    background-position: center;
  }
  /* ===== Our Location =====  */
  .location-box {
    max-width: 100%;
    width: 39rem;
    height: 39rem;
    margin: 1rem auto;
  }
  /* ===== About us =====  */
  .aboutus .title {
    margin-bottom: 1.5rem;
  }
  .about-desc p {
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
  /* ===== Why us section =====  */
  .why-us-box {
    padding: 4rem 3.5rem;
  }
  .why-us-desc h3 {
    font-size: 2.4rem;
  }
  /* ===== Carousel section =====  */
  .carousel .carousel-inner .carousel-item .carousel-desc p {
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
  .carousel-control-prev-icon,.carousel-control-next-icon {
    background-image: none;
  }
  .carousel-indicators [data-bs-target] {
    width: 1rem;
    height: 1rem;
  }
  .carousel .carousel-inner .carousel-item .carousel-desc {
    padding: 7rem 3rem;
    width: 95%;
  }
  /* ===== Filter  Gallery =====  */
  .filter_images img {
    max-width: 14rem;
  }
  /* ===== footer =====  */
  footer {
    padding: 0 1.5rem 0rem 1.5rem;
  }
  .footer-logo {
    width: 70%;
  }
}
/* ================================  Max Width 576px ======================== */
@media (max-width: 576px) {
  /* ===== hero banner video =====  */
  header {
    max-width: 100%;
    height: 52vh;
    max-height: 100%;
  }
  /* ===== Our Products =====  */
  .menu-box .menu-img img {
    width: 100%;
    max-width: 64%;
  }
  .menu-title h3 {
    font-size: 3rem;
  }
  .contact-form{
    width: 85%;
  }
  .contact-form h1 {
    font-size: 2.2rem;
  }
  .contact-form form button {
    padding: 0.6rem 0;
  }
   /* ===== Why Us =====  */
   .why-us-box {
    padding: 3.5rem 2rem;
  }
  .client_review {
    background-position: 40%;
  }
  .buttons {
    padding: 2rem 0 2rem 0;
  }
  .footer-logo{
    width: 90%;
    padding: 3rem 2rem 3.5rem 2rem;
}
.footer-nav {
    padding: 2rem 0 1rem 0;
}
.footer-nav-item{
    width: 50%;
    text-align: center;
    margin: 0 auto;
}
.footer-nav-item .footer-nav-link{
    font-size: 1.6rem;
    line-height: 3.8rem;
    margin: 0 1.6rem;
}
.footer-icons ul li a {
    width: 3.5rem;
    height: 3.5rem;
    margin: 2rem;
}
.footer-icons ul li a i {
    font-size: 2.2rem;
}
.ft__strip {
    padding-top: 1.5rem;
    padding-bottom: 0rem;
}
}
/* =============================== Max width 401px ========================== */
@media (max-width: 401px) {
  /* ===== Our location =====  */
  .location-box h3 {
    font-size: 2.4rem;
  }
  .location-box {
    width: 30rem;
    height: 33rem;
  }
}
/* =============================== Max width 425 px ========================== */
@media (max-width:425px) {
  .carousel .carousel-inner .carousel-item .carousel-desc {
    padding: 4rem 3rem;
    width: 95%;
}
.carousel .carousel-inner .carousel-item .carousel-desc h3 {
  font-size: 2.2rem;
  }
}
/* ============================== max width 320px to 375px ========================= */
@media only screen and (min-width: 320px) and (max-width: 375px) {
  .upper-right-i a,
  .upper-right-ii a {
    font-size: 1.4rem;
  }
  /* ===== Our location =====  */
  .location-box {
    width: 31rem;
    height: 31rem;
  }
  /* ===== Why us section =====  */
  .why-us-desc h3 {
    font-size: 1.8rem;
}
}