body {
  font-family: "Montserrat", sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f4f4f4;
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #ffffff;
  color: white;
  padding: 8px 16px;
  text-align: center;
}
@media (min-width: 767px) {
  header {
    padding: 16px 36px;
  }
}
@media (min-width: 1500px) {
  header {
    padding: 38px 48px 16px;
  }
}

.background {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: url("./img/pink_circle.svg") no-repeat center center;
  background-size: 460px;
  overflow: hidden;
}
@media (min-width: 992px) {
  .background {
    background: url("./img/logo_icon.svg") no-repeat center calc(50% + 80px);
    background-size: 2050px;
  }
}
@media (min-width: 1500px) {
  .background {
    background-size: 127%;
  }
}

main {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  visibility: visible;
  -webkit-transition: none;
  transition: none;
}
main .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  max-width: 390px;
  color: #ffffff;
}
@media (min-width: 1600px) {
  main .content {
    max-width: 423px;
  }
}
main .content h2 {
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  margin: 0;
}
@media (min-width: 1600px) {
  main .content h2 {
    font-size: 35.389px;
  }
}
main .content p {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 160%; /* 17.6px */
  margin: 0;
}
main .content p.lead {
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 136%; /* 24.064px */
  letter-spacing: 1.7px;
  text-transform: capitalize;
}
@media (min-width: 1600px) {
  main .content p.lead {
    font-size: 17.694px;
    letter-spacing: 1.769px;
  }
}
main .content .btn {
  margin: 16px 0;
}
main iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.btn {
  font-size: 18px;
  padding: 8px 16px;
  margin-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 8px;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
.btn:focus, .btn:active:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn:hover, .btn:focus {
  text-decoration: none;
}
.btn:active {
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn.btn-primary {
  background: #2eade3;
  color: #ffffff;
}
.btn.btn-primary:hover, .btn.btn-primary:focus {
  color: #2eade3;
  background: #ffffff;
  border-color: #2eade3;
  text-decoration: none;
}

footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 16px 24px;
  background-color: #ffffff;
  color: #000000;
}
@media (min-width: 992px) {
  footer {
    padding: 16px 48px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 58px;
  }
}
footer img {
  margin-bottom: 20px;
}
@media (min-width: 992px) {
  footer img {
    margin-bottom: 0;
  }
}
footer p {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 136%; /* 19.04px */
  letter-spacing: 1.4px;
  opacity: 0.5;
}
footer .footer-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  position: relative;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  color: #000000;
  text-decoration: none;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
  padding: 8px 0;
}
@media (min-width: 992px) {
  footer .footer-link {
    font-size: 18px;
  }
}
footer .footer-link:after {
  position: relative;
  content: "\f135";
  font-family: "bootstrap-icons";
  font-size: 22px;
  left: 8px;
  -webkit-transition: left 0.35s ease-in-out;
  transition: left 0.35s ease-in-out;
}
footer .footer-link:hover, footer .footer-link:focus {
  opacity: 0.8;
}
footer .footer-link:hover:after, footer .footer-link:focus:after {
  left: 12px;
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff url("./img/logo_icon.svg") no-repeat center center;
  background-size: 330px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 9999;
  -webkit-transition: background-size 1.5s ease-in-out, opacity 0.75s ease;
  transition: background-size 1.5s ease-in-out, opacity 0.75s ease;
}
#preloader.background-grow {
  -webkit-animation: growBackground 1.5s ease-in-out forwards;
          animation: growBackground 1.5s ease-in-out forwards;
}
@media (max-width: 991px) {
  @-webkit-keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 35px);
      background-size: 2000px;
    }
  }
  @keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 35px);
      background-size: 2000px;
    }
  }
}
@media (min-width: 992px) {
  @-webkit-keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 80px);
      background-size: 2050px;
    }
  }
  @keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 80px);
      background-size: 2050px;
    }
  }
}
@media (min-width: 1500px) {
  @-webkit-keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 90px);
      background-size: 127%;
    }
  }
  @keyframes growBackground {
    0% {
      background-position: center center;
      background-size: 330px;
    }
    100% {
      background-position: center calc(50% + 90px);
      background-size: 127%;
    }
  }
}