.display-flex {
  display: flex; }

.direction-row {
  flex-direction: row; }

.direction-column {
  flex-direction: column; }

.no-wrap {
  flex-wrap: nowrap; }

.wrap {
  flex-wrap: wrap; }

.column-wrap {
  flex-flow: column wrap; }

.justify-content-center {
  justify-content: center; }

.justify-content-flex-start {
  justify-content: flex-start; }

.justify-content-flex-end {
  justify-content: flex-end; }

.justify-content-space-between {
  justify-content: space-between; }

.justify-content-space-around {
  justify-content: space-around; }

@media screen and (min-width: 768px) {
  .justify-content-md-space-between {
    justify-content: space-between; } }

@media screen and (min-width: 768px) {
  .justify-content-md-space-around {
    justify-content: space-around; } }

@media screen and (min-width: 768px) {
  .justify-content-md-start {
    justify-content: start; } }

.align-items-center {
  align-items: center; }

.align-items-flex-start {
  align-items: flex-start; }

.align-items-flex-end {
  align-items: flex-end; }

.align-items-stretch {
  align-items: stretch; }

.align-content-stretch {
  align-content: stretch; }

.align-content-between {
  align-content: space-between; }

.align-self-start {
  align-self: flex-start; }

.align-content-center {
  align-content: center; }

@media screen and (min-width: 768px) {
  .flex-1-md {
    flex: 1; } }

@media screen and (min-width: 768px) {
  .flex-3-md {
    flex: 3; } }

@media screen and (min-width: 768px) {
  .flex-2-md {
    flex: 2; } }

.me-1 {
  margin-right: 1em; }

.me-2 {
  margin-right: 2em; }

.margin-auto {
  margin: 0 auto; }

@media screen and (min-width: 768px) {
  .margin-0-md {
    margin: 0; } }

@media screen and (min-width: 768px) {
  .me-1-md {
    margin-right: 1em; } }

@media screen and (min-width: 768px) {
  .mb-5em-md {
    margin-bottom: 5em; } }

.mt-neg-1 {
  margin-top: -0.2em; }

.mt-2-em {
  margin-top: 2em; }

.mt-3-em {
  margin-top: 3em; }

.mt-4-em {
  margin-top: 4em; }

.mt-5-em {
  margin-top: 5em; }

.mb-5-em {
  margin-bottom: 5em; }

@media screen and (min-width: 768px) {
  .flex-noshrink-md-1 {
    flex-grow: 1;
    flex-shrink: 0; } }

.flex-basis-25 {
  flex-basis: 25%; }

.flex-1 {
  flex: 1; }

.flex-basis-40 {
  flex-basis: 40%; }

.grow-4 {
  flex-grow: 4; }

@media screen and (min-width: 768px) {
  .flex-basis-25-md {
    flex-basis: 25%; } }

@media screen and (min-width: 768px) {
  .flex-basis-80-md {
    flex-basis: 80%; } }

@media screen and (min-width: 768px) {
  .flex-basis-20-md {
    flex-basis: 20%; } }

@media screen and (min-width: 768px) {
  .flex-basis-40-md {
    flex-basis: 40%; } }

@media screen and (min-width: 768px) {
  .flex-basis-60-md {
    flex-basis: 60%; } }

.colRow {
  flex-direction: column; }
  @media screen and (min-width: 768px) {
    .colRow {
      flex-direction: row; } }

.rowCol {
  flex-direction: row; }
  @media screen and (min-width: 768px) {
    .rowCol {
      flex-direction: column; } }

*,
::before,
::after {
  box-sizing: border-box; }

html,
body {
  font-font-size: 1em;
  font-weight: 400;
  font-family: "./fonts/redhattext.ttf", serif; }

.sr-only {
  border: 0 !important;
  clip-path: inset(50%) !important;
  /* 2 */
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 1px !important;
  white-space: nowrap !important;
  /* 3 */ }

.btn {
  width: 200px;
  height: 40px;
  padding: 5px;
  background-color: #fff; }

.fontweight-semi {
  font-weight: 600; }

.fontweight-ultrabold {
  font-weight: 900; }

.white-font {
  color: Snow;
  color: white; }

.grayish-blue-font {
  color: LightSteelBlue;
  color: #8486a9; }

.text-center {
  text-align: center; }

.text-uppercase {
  text-transform: uppercase; }

.letter-spacing2 {
  letter-spacing: 0.2em; }

.img-fluid {
  max-width: 100%;
  height: auto; }

.svg-hills-outer {
  max-width: 100%;
  max-height: 100%; }

.svg-100 {
  width: 100%;
  height: 100%; }

.top-z-index {
  position: relative;
  z-index: 1;
  opacity: 1; }

.black-circle, .circle:before, .circle:after {
  content: '';
  display: inline-block;
  height: 25px;
  width: 25px;
  border-radius: 50%;
  background-color: #191a24;
  position: relative; }

.circle:before {
  bottom: 1vh;
  right: 7vw; }
  @media screen and (min-width: 768px) {
    .circle:before {
      bottom: 2.5vh;
      right: 7vw; } }

.circle:after {
  bottom: 1vh;
  left: 7vw; }
  @media screen and (min-width: 768px) {
    .circle:after {
      bottom: 2.5vh;
      right: 7vw; } }

@media (scripting: enabled) {
  #background {
    background: #1e1f29 url(./images/bg-stars.svg) top left/100% 100%; }

  .red-thick-font {
    color: IndianRed;
    color: #fb6087;
    font-weight: 900;
    font-size: 2em; } }
  @media screen and (scripting: enabled) and (min-width: 768px) {
    .red-thick-font {
      font-size: 5.6em; } }

@media (scripting: enabled) {
  h1 {
    position: relative;
    top: 1em; }

  .flipIn {
    border: 2px solid #343650;
    background-image: linear-gradient(to bottom, #0f0f14, #343650);
    color: #2F2439;
    width: 100%;
    height: 6em;
    text-align: center;
    animation: flipIn 0.5s ease-in; } }
  @media screen and (scripting: enabled) and (min-width: 768px) {
    .flipIn {
      height: 8em; } }

@media (scripting: enabled) {
  .flipOut {
    border-top: none;
    animation: flipOut 0.5s ease-out; }

  @keyframes flipIn {
    0% {
      transform: rotateX(0deg); }
    100% {
      transform: rotateX(180deg); } }
  @keyframes flipOut {
    0% {
      transform: rotateX(-180deg); }
    100% {
      transform: rotate(0deg); } }
  .screen {
    width: 6em;
    height: 6em;
    min-width: 0;
    border-radius: 15px;
    background-color: white;
    background-image: linear-gradient(to bottom, #191a24, #343650);
    line-height: 150px; }
    .screen p {
      position: relative;
      top: -2em; }
    .screen:after {
      content: '';
      border-bottom: 3px solid #191a24;
      transform: translateY(-16.5em);
      width: 100%;
      z-index: 99; } }
  @media screen and (scripting: enabled) and (min-width: 768px) {
    .screen {
      height: 8em; } }

@media (scripting: enabled) {
  div.flip > p {
    position: relative;
    top: -6em; }

  div.flip > div {
    position: relative;
    top: -1.2em; }

  main {
    height: 95vh;
    overflow: hidden; }
    main section {
      padding: 7em 2em; }
      main section div p {
        font-size: 1.2em; }

  #hills {
    position: relative;
    top: calc(100% - 703px); }

  ul {
    list-style-type: none; }

  #ul-nav {
    position: relative;
    top: 2em; }
    #ul-nav svg:hover path {
      fill: #fb6087; } }
  @media screen and (scripting: enabled) and (min-width: 768px) {
    #ul-nav {
      top: 6em; } }

@media (scripting: enabled) {
  #background-color-add-height {
    position: relative;
    top: -4px;
    width: 100vw;
    height: 700px;
    background-color: #2F2439; }

  footer {
    position: relative;
    top: 10em; } }
  @media screen and (scripting: enabled) and (min-width: 768px) {
    footer {
      padding: 4em;
      font-size: 1.2em; } }

@media (scripting: none) {
  /* fallback styles when JS is not supported */
  /*leave carousel collapsed but add some styling */ }

/*# sourceMappingURL=launch-countdown-timer-main.css.map */