@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");

#root {
  overflow-x: hidden;
}

.poster-heading {
  font-family: "Manrope", sans-serif;
  color: #5d5d5d;
  margin: 2rem 0px;
  font-weight: bold;
  max-width: 600px;
}

#navContainer {
  padding: 0rem 10rem;
}
.poster-description {
  font-family: "Manrope", sans-serif;
  color: #868686;
  font-size: 1.2rem;
  max-width: 600px;

  margin-bottom: 2rem;
}

.counterFont span {
  font-size: 3rem;
  font-weight: bold;
}
.counterTitle {
  font-size: 1.7rem;
  font-weight: bold;
}

.descriptiveVideo {
  width: 70%;
}

#blockImage {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.adimages {
  max-height: 70%;
}

.subscribeDiv {
  width: 75%;
}

.attandance-pointers {
  color: #868686;
  max-width: 600px;
  text-align: left;
  margin-bottom: 2rem;
}
#userQRscanImage {
  height: 70vh;
}
#userQRscanImage_2 {
  height: 90vh;
}

.attendanceIcons {
  margin-bottom: 2rem;
}

.attendanceBox {
  max-width: 60%;
}
.nav-bar-bg {
  background-color: rgba(0, 0, 0, 0.11);
}

.navLink {
  font-size: 1rem;
  font-weight: bold;
  text-decoration: none;
  color: white;
}

.navLinkBlack {
  font-size: 1rem;
  font-weight: bold;
  text-decoration: none;
  color: black;
}

.navLink:hover {
  text-decoration: none;
  color: rgba(229, 61, 84, 1);
}

.navLinkBlack:hover {
  text-decoration: none;
  color: rgba(229, 61, 84, 1);
}

.navLink.active-white {
  color: #ffffff;
}

.navLink.active {
  color: rgba(229, 61, 84, 1);
}

.navLinkBlack.active {
  color: rgba(229, 61, 84, 1);
}

.navLinkBlack.active-white {
  color: #ffffff;
}
.appsRow {
  padding: 0rem 15rem;
}

.imgCover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bottomrow {
  height: 50vh;
}

.subscribe-div {
  height: 70px;
}

@media (min-width: 768.1px) {
  .imgCoverScan {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 991px) {
  .imgCoverScan {
    position: relative;
    /* object-fit: cover; */
    left: -26%;
  }
  .nav-bar-bg {
    background-color: rgba(255, 255, 255, 1);
  }

  #navContainer {
    padding: 0rem 0rem;
  }
}

@media (max-width: 768px) {
  .reverseOnMobile {
    display: flex;
    flex-direction: column-reverse;
  }
  #userQRscanImage {
    width: 100%;
    height: auto;
  }

  .subscribe-div {
    height: 50px;
  }
  .bottomrow {
    height: auto;
    padding: 2rem 2rem;
  }

  .mobilePadding {
    padding: 1rem 1rem;
  }

  .descriptiveVideo {
    display: none;
  }
  .attendanceBox {
    max-width: 100%;
  }
  .gradintcontentbox {
    padding: 4rem 2rem;
  }
  #blockImage {
    width: 100%;
    object-fit: contain;
  }

  .attandance-pointers {
    color: #868686;
    max-width: 600px;
    text-align: center;
    margin-bottom: 2rem;
  }
  .attendancePointers {
    justify-content: center;
  }

  .subscribeDiv {
    width: 100%;
  }
}

@media (max-width: 1500px) {
  .appsRow {
    padding: 0rem 7rem;
  }
}

@media (max-width: 1300px) {
  .adimages {
    max-height: 100%;
    max-width: 100%;
  }
}

@media (max-width: 1200px) {
  .appsRow {
    padding: 0rem 1rem;
  }
}

@media (max-width: 1000px) {
  .appsRow {
    padding: 0rem 6rem;
  }
}