/* 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 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);
  }
}

/* ***************** */
/* BELOW 1200px (Landscpae Tablets) */
/* ***************** */

@media (max-width: 75em) {
  html {
    font-size: 56.25%;
  }
  .box-container {
    margin: 0 3rem;
  }
  .box-containerv2 {
    margin: 0 3rem;
  }
}

@media (max-width: 68em) {
  .price1 {
    grid-column: 1 / -1;
    text-align: center;
  }
}

/* ***************** */
/* 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;
  }
  .footer-table-width-divs {
    width: 90%;
    justify-content: space-evenly;
    flex-direction: column;
  }
  .about-precentv2 {
    width: 70%;
    margin: 8.6rem;
  }

  .details {
    display: block;
  }
  .details-1 {
    width: 100%;
  }
  .details-2 {
    width: 100%;
  }
}
/* ***************** */
/* BELOW 704px (Smaller Tablets) */
/* ***************** */

@media (max-width: 44em) {
  .sixth-section {
    padding: 6.4rem 6.4rem;
  }
  .fifth-section-flex {
    flex-direction: column;
    gap: 9.6rem;
  }
}

/* ***************** */
/* 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%;
  }
  .about-precentv2 {
    width: auto;
    text-align: center;
    margin: 3.2rem;
  }
  .padding-classv2 {
    /* background-image: linear-gradient(
        324deg,
        rgba(0, 0, 0, 0) 0%,
        rgb(0, 0, 0, 0.7) 60%,
        rgb(0, 0, 0, 0.99) 100%
      ),
      url(../../BackgroundPicturesResized/AboutUsBackgroundPicture.jpg); */
    background-image: linear-gradient(
        324deg,
        rgba(0, 0, 0, 0.4) 0%,
        rgb(0, 0, 0, 0.9) 40%,
        rgb(0, 0, 0, 1) 100%
      ),
      url(../../BackgroundPicturesResized/AboutUsBackgroundPicture.jpg);
  }

  .footer-links {
    flex-direction: column;
  }
  .footer-links a {
    width: 100%;
  }

  .boxes p {
    font-size: 1.8rem;
  }
}