@font-face {
  font-family: 'basis_grotesque_regular';
  src: url('../fonts/basis-grotesque-regular.woff2') format('woff2'), url('../fonts/basis-grotesque-regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'basis_grotesque_medium';
  src: url('../fonts/basis-grotesque-medium.woff2') format('woff2'), url('../fonts/basis-grotesque-medium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
html {
  background-color: #F7F7F1;
  font-family: 'basis_grotesque_regular', Helvetica, sans-serif;
  color: #000;
  font-size: 9px;
  line-height: 1.4;
}
@media (min-width: 768px) {
  html {
    font-size: 18px;
  }
}
html body {
  background-color: #F7F7F1;
  position: relative;
}
html a {
  text-decoration: none;
}
#Site {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  position: relative;
}
#Site .wrapper {
  position: relative;
  margin-top: 24px;
  padding: 0 24px;
}
@media (min-width: 768px) {
  #Site .wrapper {
    padding-left: 40px;
    padding-right: 40px;
  }
}
#Site .section {
  position: relative;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  #Site .section {
    margin-left: 0;
    margin-right: 0;
  }
}
#Site header {
  position: absolute;
  z-index: 10;
  width: 100%;
  padding: 0 24px;
}
@media (min-width: 768px) {
  #Site header {
    padding: 0 40px;
  }
}
#Site header .logo-small {
  width: 100%;
}
@media (min-width: 768px) {
  #Site header .logo-small {
    display: none;
  }
}
#Site header .logo-large {
  display: none;
  width: 100%;
}
@media (min-width: 768px) {
  #Site header .logo-large {
    display: block;
  }
}
#Site main {
  position: relative;
  z-index: 100;
  top: 24vw;
}
@media (min-width: 768px) {
  #Site main {
    top: 14vw;
  }
}
@media (min-width: 1141px) {
  #Site main {
    top: 160px;
  }
}
#Video_2022 {
  position: absolute;
  width: calc(100vw - 48px);
  height: calc(100vw - 48px);
  z-index: 100;
  top: 12vw;
  left: 24px;
}
@media (min-width: 768px) {
  #Video_2022 {
    width: 60%;
    padding-bottom: 60%;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    height: 0;
    top: 2.85vw;
    left: 20%;
  }
}
@media (min-width: 1141px) {
  #Video_2022 {
    top: 32px;
  }
}
#Video_2022 video,
#Video_2022 img {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  -webkit-mask-image: url("../img/mask.png");
  mask-image: url("../img/mask.png");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
.section h1 {
  font-size: 100%;
  font-family: 'basis_grotesque_medium';
}
.section p span {
  margin-right: 1rem;
  white-space: nowrap;
}
.section p sup {
  font-size: 60%;
  font-style: normal;
  position: relative;
}
@media (min-width: 768px) {
  .section.line-up {
    width: 90%;
  }
}



#Site .section-1 {
    font-size:1.5rem;
    top:40vh;
    text-align:center;
    font-family: basis_grotesque_regular;
}
#Site .section-1 strong {
    font-family: basis_grotesque_medium;
}



@media (min-width: 768px) {
  #Site .section-1 {
    max-width:40%;
    margin-left:auto;
    margin-right:auto;
    font-size:1rem;
    text-align:Center;
    position:relative;
    top:4rem;
  }
}

 .section.section-2 {
     margin-top:50vh;
 }
@media (min-width: 768px) {
  .section.section-2 {
    margin-top:20vh;
  }
}







@media (min-width: 768px) {
  .section.section-5 {
    font-size: 0.9rem;
    position:relative;
    top:5rem;
  }
}




.section.section-2 .brand {
  width: 100px;
  margin-top: .5rem;
}
@media (min-width: 768px) {
  .section.section-2 .brand {
    width: 150px;
  }
}
.section-2 .c2 {
  font-size:1.2rem;
}
@media (min-width: 768px) {
  .section-2 .c2 {
    font-size:1.0rem;
  }
}

.row {
  display: flex;
  margin-top: 1rem;
}
.row.collapse {
  display: block;
}
.row .col-split {
  flex: 50%;
}
.text-right {
  text-align: right;
}
.text-right p {
  text-align: inherit;
}
.text-right p span {
  margin-left: 1rem;
  margin-right: 0;
}
.button {
  background-color: #000;
  border: 0;
  border-radius: 16px;
  color: #F9FAF2;
  line-height: 24px;
  padding: 4px 12px;
}
.signup-form {
  margin-top: 2rem;
}
.signup-form .field:first-child {
  margin-bottom: 1rem;
}
.signup-form input {
  font-size: 1rem;
  font-family: 'basis_grotesque_regular', Helvetica, sans-serif;
}
.signup-form input.email {
  border:0;
  border-bottom: 1px solid #ccc;
  background: transparent;
  outline-color: #e2e2dc;
  border-radius:0;
  font-size:20px;
  height:40px;
  line-height:40px;
  width: 70%;
  margin:0 auto 1rem auto;
  text-align:Center;
  max-width:300px;
}
@media (min-width: 768px) {
.signup-form input.email {
  border: 0;
  border-bottom: 1px solid #80807c;
  background: #fff;
  outline-color: #e2e2dc;
  border-radius:20px;
  font-size:20px;
  height:40px;
  line-height:40px;
  width: 70%;
  margin:0 auto 1rem auto;
  text-align:Center;
  max-width:300px;
}
}

.signup-form input.email::placeholder {
  color:#ccc;
}
.mc_embed_signup_scroll {
  text-align:Center;
}
}
.signup-form input.button {
  background-color: #000;
  border: 0;
  border-radius: 16px;
  color: #F9FAF2;
  line-height: 24px;
  padding: 4px 22px;
  font-size: 24px;
  margin-top: 1rem;
}
.signup-form #mce-responses {
  margin-top: 1rem;
  font-size: 1rem;
  max-width: 300px;
}
.signup-form #mce-responses a {
  color: #ECC2D2;
  display: inline-block;
}
