main {
  background-image: url(/assets/images/coming-soon/coming_soon_background_320.png);
  background-size: cover; /* Scales the image to cover the entire container */
  background-position: top center; /* Centers the image */
  background-repeat: no-repeat; /* Prevents the image from tiling */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 1250px;
  width: 100%;
  margin-bottom: -2px;
}
@media screen and (min-width: 576px) {
  main {
    min-height: 1500px;
    margin-bottom: -4px;
  }
}
.community-black-blur,
.donate-black-blur,
.our-work-black-blur {
  position: relative;
  top: -430px;
  left: 0;
  width: 100%;
  height: 100px;
  mask-image: linear-gradient(
    to bottom,
    rgba(36, 36, 36, 0.65) 55%,
    rgba(0, 0, 0, 0) 100%
  );
  z-index: 2;
  background-color: #323752;
}
@media screen and (min-width: 576px) {
  .community-black-blur,
  .donate-black-blur,
  .our-work-black-blur {
    top: -555px;
    height: 100px;
  }
}
@media screen and (min-width: 768px) {
  .community-black-blur,
  .donate-black-blur,
  .our-work-black-blur {
    top: -520px;
  }
}
@media screen and (min-width: 1200px) {
  .community-black-blur,
  .donate-black-blur,
  .our-work-black-blur {
    top: -490px;
  }
}
@media screen and (min-width: 1920px) {
  .community-black-blur,
  .donate-black-blur,
  .our-work-black-blur {
    top: -415px;
    height: 150px;
  }
}
#coming-soon {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 288px;
  padding: 0 1rem;
  text-align: left; /* Ensure the text inside is centered */
}
h1 {
  color: #fbfbfc;
  text-shadow: 0 2.187px 7.655px rgba(0, 0, 0, 0.25);
  font-family: "Barlow", sans-serif;
  font-size: 43px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 2.15px;
  width: 100%;
}
p {
  color: #fbfbfc;
  font-family: "Montserrat", sans-serif;
  font-size: 25px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: 100%;
}
p span {
  color: #fbfbfc;
  font-family: "Montserrat", sans-serif;
  font-size: 25px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

@media screen and (min-width: 576px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_320.png);
  }
}
@media screen and (min-width: 768px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_768.png);
  }
  #coming-soon {
    width: 338px;
  }
  h1,
  p {
    width: 338px;
  }
  h1 {
    font-size: 50.4px !important;
  }
  p,
  p span {
    font-size: 29.4px !important;
  }
}
@media screen and (min-width: 992px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_992.png);
  }
  h1,
  p {
    width: 338px;
  }
  h1 {
    font-size: 50.4px !important;
  }
  p {
    font-size: 29.4px !important;
  }
}
@media screen and (min-width: 1200px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_1200.png);
  }
  #coming-soon {
    width: 386px;
  }
  h1,
  p {
    width: 386px;
  }
  h1 {
    font-size: 57.6px !important;
  }
  p,
  p span {
    font-size: 33.6px !important;
  }
}
@media screen and (min-width: 1400px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_1400.png);
  }
}
@media screen and (min-width: 1920px) {
  main {
    background-image: url(/assets/images/coming-soon/coming_soon_background_1920.png);
  }
  #coming-soon {
    /* Width for 1920px screens */
    width: 482px;
  }
  h1,
  p {
    width: 482px;
  }
  h1 {
    font-size: 72px !important;
  }
  p,
  p span {
    font-size: 42px !important;
  }
}