/* ========================================================================================================================== */
/* ============================================ ALL SCREEN RESPONSIVE CSS START HERE... ===================================== */
/* ========================================================================================================================== */
/* ================================================================ */
/* ======== @media screen min-width="1199x" start here... ======== */
/* ================================================================ */

@media screen and (min-width: 1199px) {
  body {
    overflow: hidden;
  }
}

/* ================================================================ */
/* ======== @media screen min-width="1199x" end here... ======== */
/* ================================================================ */

/* ================================================================ */
/* ======== @media screen max-width="1699x" start here... ======== */
/* ================================================================ */

@media screen and (max-width: 1699px) {
  html {
    font-size: 47.5%;
  }

  .coming-content .actions {
    margin-bottom: 12.4rem;
  }
}

/* ================================================================ */
/* ======== @media screen max-width="1699x" end here... ======== */
/* ================================================================ */

/* ================================================================ */
/* ======== @media screen max-width="1199x" start here... ======== */
/* ================================================================ */

@media screen and (max-width: 1199px) {
  html {
    font-size: 37.5%;
  }
}

/* ================================================================ */
/* ======== @media screen max-width="1199x" end here... ======== */
/* ================================================================ */

/* ================================================================ */
/* ======== @media screen max-width="991px" start here... ======== */
/* ================================================================ */

@media screen and (max-width: 991px) {
  .coming-content .brand-img {
    margin-bottom: 3.8rem;
  }

  .coming-content .brand-img img {
    width: 14.1903rem;
  }

  .side-banner {
    margin: 0 auto;
    width: fit-content;
    height: auto;
    transform: translate(0%, 0%);
    -webkit-transform: translate(0%, 0%);
    -moz-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -o-transform: translate(0%, 0%);
    padding: 5rem;
    justify-content: center;
  }

  .side-banner img {
    max-width: 68.77rem;
    transform: translateX(0%);
  }

  .coming-soon {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 6rem 0rem;
  }

  .coming-content p {
    margin-bottom: 6.6rem;
  }

  .coming-soon .row {
    gap: 6rem;
  }

  .coming-content .actions {
    margin-bottom: 3.4rem;
  }
}

/* ================================================================ */
/* ======== @media screen max-width="991px" end here... ======== */
/* ================================================================ */

/* ================================================================ */
/* ======== @media screen max-width="490px" start here... ======== */
/* ================================================================ */

@media screen and (max-width: 576px) {
  .coming-content .brand-img {
    margin-bottom: 3.8rem;
  }

  .coming-content .brand-img img {
    width: 14.1903rem;
  }

  .coming-content .title {
    font-size: 3.9rem;
  }

  .coming-content p {
    font-size: 2.2rem;
    max-width: 100%;
    margin-bottom: 5.6rem;
  }

  .side-banner {
    width: auto;
    height: auto;
    transform: translate(0%, 0%);
    -webkit-transform: translate(0%, 0%);
    -moz-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -o-transform: translate(0%, 0%);
    padding: 5rem;
    max-width: 90%;
    justify-content: center;
  }

  .side-banner img {
    max-width: 46.77rem;
    transform: translateX(0%);
  }

  .coming-content .actions {
    column-gap: 2.6rem;
  }

  .coming-content .actions a svg {
    width: 1.8rem;
    height: 1.8rem;
  }

  .coming-soon {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
}

/* ================================================================ */
/* ======== @media screen max-width="490px" start here... ======== */
/* ================================================================ */

/* ========================================================================================================================== */
/* ============================================ ALL SCREEN RESPONSIVE CSS END HERE... ===================================== */
/* ========================================================================================================================== */