body {
  font-family: Oswald;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

main {
  background-color: black;
}

.checklist-title {
  color: #034565;
  font-weight: 500;
}

.checklist-subtitle {
  font-weight: bold;
}

.flexbox {
  display: flex;
  padding-bottom: 2rem;
}

.flexbox .stretch-img {
  object-fit: contain;
  width: 100%;
  max-width: 449px;
  margin-left: 1px;
}

body .sGrid {
  position: relative;
  background-color: white;
  -ms-grid-column-align: center;
  justify-self: center;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr 2fr 6fr 2fr 2fr;
  grid-template-columns: 2fr 2fr 6fr 2fr 2fr;
  -ms-grid-rows: auto auto 1fr 3fr auto auto;
  grid-template-rows: auto auto 1fr 3fr auto auto;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  grid-template-areas:
    "o-ttl o-ttl o-ttl o-ttl o-ttl"
    ".    .  ttl    .     ."
    "btl  btl  btl   btl   btl"
    "btl  btl  btl   btl   btl"
    ". claim claim claim ."
    "tst tst tst tst tst";
}

.flexbox ul {
  margin: auto;
}
.flexbox ul li {
  margin: 2em 0;
  margin-left: 0em;
  width: 100%;
  max-width: 300px;
  text-align: left;
}

@media (min-width: 768px) {
  body .sGrid {
    -ms-grid-columns: 2fr 3fr 3fr 3fr 1fr;
    grid-template-columns: 2fr 3fr 3fr 3fr 1fr;
    -ms-grid-rows: auto auto 1fr 3fr auto;
    grid-template-rows: auto auto 1fr 2fr;
    grid-template-areas:
      "o-ttl o-ttl  o-ttl o-ttl o-ttl"
      "ttl  ttl  ttl   ttl    ttl"
      ".    btl  claim  claim ."
      ".   btl  tst tst .";
  }
}

body .sGrid .landscape {
  position: relative;
  background-image: url("https://fb-v1.cdn-bio.com/assets/mountain-landscape-7356280748a6efca33c3c89fe395d44c.png");
  -webkit-filter: brightness(50%);
  filter: brightness(50%);
  background-size: cover;
  -ms-grid-column: 1;
  -ms-grid-column-span: 5;
  grid-column: 1/6;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  grid-row: 1/4;
  z-index: 0;
}

body .sGrid .over-title {
  text-align: center;

  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 5;
  grid-area: o-ttl;
  z-index: 5;
  font-family: Open Sans;
  font-style: normal;
  font-weight: 400;
  color: #ffffff;
  margin-bottom: 2vw;
}

@media (min-width: 768px) {
  body .sGrid .over-title {
    font-size: 2vw;
    margin-bottom: 1vw;
  }
}

body .sGrid .title {
  -ms-grid-column-align: center;
  justify-self: center;
  background-color: rgba(41, 89, 127, 0.8);
  background-size: cover;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-transform: uppercase;
  color: #ffffff;
  font-family: Oswald;
  font-size: 10vw;
  padding: 0vw 1vw;
  margin-bottom: 8vh;
  font-style: normal;
  font-weight: 500;
  -ms-grid-row: 2;
  -ms-grid-column: 3;
  grid-area: ttl;
  z-index: 1;
}

@media (min-width: 768px) {
  body .sGrid .title {
    font-size: 4vw;
  }
}

body .sGrid .bottle {
  -ms-grid-row: 3;
  -ms-grid-row-span: 2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 5;
  grid-area: btl;
  -ms-grid-column-align: center;
  justify-self: center;
  margin-bottom: 2vh;
  z-index: 100;
}

@media (min-width: 768px) {
  body .sGrid .bottle img {
    width: 10vw;
  }
}

body .sGrid .claim-bottle {
  -ms-grid-row: 5;
  -ms-grid-column: 2;
  -ms-grid-column-span: 3;
  grid-area: claim;
  text-transform: uppercase;
  color: #c2d500;
  font-weight: 800;
  font-size: 6vw;
  margin-bottom: 2vh;
  text-align: center;
  z-index: 1;
}

@media (min-width: 768px) {
  body .sGrid .claim-bottle {
    text-align: left;
    font-size: 2vw;
    margin-left: 2vw;
  }
}

body .sGrid .test-yourself {
  -ms-grid-row: 6;
  -ms-grid-column: 1;
  -ms-grid-column-span: 5;
  grid-area: tst;
  font-size: 4vw;
  line-height: 5vw;
  text-align: center;
}

@media (min-width: 768px) {
  body .sGrid .test-yourself {
    text-align: left;
    font-size: 1.2vw;
    line-height: 2.2vw;
    margin-left: 2vw;
  }
}

@media (min-width: 768px) {
  body .sGrid {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
  }
}

/*# sourceMappingURL=new-styles.css.map */