/* rem and em do not depend on html font size in media queries!
Instead, 1rem = 1em = 16px
*/

/* @media (max-width: 1920px) {
  html {
    font-size: 65.2%;
  }
}

@media (max-width: 1344px) {
  html {
    font-size: 55%;
  }
}

@media (max-width: 940px) {
  html {
    font-size: 50%;
  }
} */

/* MINE QUERIES */

@media (max-width: 1395px) {
  .box-container {
    margin: 0 6rem;
  }
  .box-containerv2 {
    margin: 0 6rem;
  }
}

@media (max-width: 753px) {
  .box-container {
    flex-direction: column;
    margin: 0;
    align-items: center;
    gap: 9.6rem;
  }
  .box-containerv2 {
    flex-direction: column;
    margin: 0;
    align-items: center;
    gap: 9.6rem;
  }
  .boxes {
  }

  .boxes p {
    font-size: 2.4rem;
  }
  .boxes h1 {
    font-size: 3.6rem;
  }
}

/* ***************** */
/* BELOW 1344px (smaller computers) */
/* ***************** */

@media (max-width: 84em) {
  .hero {
    max-width: 120rem;
  }

  .heading-primary {
    font-size: 4.4rem;
  }

  .gallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .contact-grid {
    /* grid-template-columns: 70fr 30fr; */
  }
}

/* ***************** */
/* BELOW 1200px (Landscpae Tablets) */
/* ***************** */

@media (max-width: 75em) {
  html {
    font-size: 56.25%;
  }
  .box-container {
    margin: 0 3rem;
  }
  .box-containerv2 {
    margin: 0 3rem;
  }

  .contact-grid {
    /* grid-template-columns: 75fr 25fr; */
  }
}

@media (max-width: 68em) {
  .sixth-section {
    /* grid-template-columns: 1fr 1fr; */
    /* grid-template-rows: auto auto; */
  }
  .price1 {
    grid-column: 1 / -1;
    text-align: center;
  }

  .contact-grid {
    /* grid-template-columns: 80fr 20fr; */
  }
  .forth-section {
    margin-bottom: 51rem;
  }

  .fifth-section {
    margin-bottom: 20rem;
  }
}

/* ***************** */
/* BELOW 940px (Tablets) */
/* ***************** */

@media (max-width: 59em) {
  html {
    font-size: 50%;
  }
}

@media (max-width: 56em) {
  html {
    font-size: 50%;
  }

  .price1 {
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  .price2 {
    margin: 0 auto;
  }
  .price3 {
    margin: 0 auto;
  }
  .footer-table-width {
    flex-direction: column;
    padding: 1.4rem 2.4rem;
    margin: 3.2rem 0;
    /* gap: 2.4rem; */
  }
  .footer-table-width-divs {
    width: 90%;
    justify-content: space-evenly;
    flex-direction: column;
  }

  .forth-section {
    margin-bottom: 50rem;
  }

  .fifth-section {
    margin-bottom: 20rem;
  }
}
/* ***************** */
/* BELOW 704px (Smaller Tablets) */
/* ***************** */

@media (max-width: 44em) {
  .sixth-section {
    padding: 6.4rem 6.4rem;
  }
  .fifth-section-flex {
    flex-direction: column;
    gap: 9.6rem;
  }

  .contact-grid {
    /* grid-template-columns: 95fr 5fr; */
  }
  .forth-section {
    margin-bottom: 53rem;
  }

  .fifth-section {
    margin-bottom: 20rem;
  }
}

/* ***************** */
/* BELOW 544px (Phones) */
/* ***************** */

@media (max-width: 34em) {
  .sixth-section {
    padding: 6.4rem 2.8rem;
  }

  .price-card {
    width: 100%;
  }

  .section-contact {
    padding: 4.8rem 2.4rem;
  }

  .price-card-list {
    width: 60%;
  }

  .sixth-section {
    /* grid-template-columns: 1fr; */
  }
  .box-container {
    margin: 0 1.2rem;
  }

  .heading-text1 {
    font-size: 4.4rem;
  }
  .heading-text2 {
    font-size: 2.8rem;
  }
  .main-heading-text {
    line-height: normal;
  }

  .boxes p {
    font-size: 1.8rem;
  }
  .boxes h1 {
    font-size: 2.6rem;
  }
  .footer-links {
    flex-direction: column;
  }
  .footer-links a {
    width: 100%;
  }

  .forth-section {
    margin-bottom: 59rem;
  }

  .fifth-section {
    margin-bottom: 18rem;
  }
}

@media (max-width: 382px) {
  .heading-text1 {
    font-size: 3.8rem;
  }
  .heading-text2 {
    font-size: 2rem;
  }
}

@media (max-width: 358px) {
  .swiper-pagination-bullet {
    margin-top: 4.8rem;
  }

  .card-slider {
    height: 71rem;
  }

  .container_sliders {
    height: 73rem;
  }
  .forth-section {
    margin-bottom: 62rem;
  }

  .fifth-section {
    margin-bottom: 16rem;
  }
}
