* {
  box-sizing: border-box;
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, "Helvetica Neue",  Arial, sans-serif;
  margin: 0;
  padding:0;
}

html, body {
  position: absolute;
  top:0;left:0;bottom:0;right:0;
  background: #000;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

/* MailChimp Form Embed Code - Classic - 12/17/2015 v10.7 */
#mc_embed_signup form {
    display: block;
    position: relative;
    text-align: left;
    padding: 10px 0 10px 3%
}

#mc_embed_signup h2 {
    font-weight: bold;
    padding: 0;
    margin: 15px 0;
    font-size: 1.4em;
}

#mc_embed_signup input {
    border: 1px solid #ABB0B2;
}

#mc_embed_signup input[type=checkbox] {
    -webkit-appearance: checkbox;
}

#mc_embed_signup input[type=radio] {
    -webkit-appearance: radio;
}

#mc_embed_signup input:focus {
    border-color: #333;
}

#mc_embed_signup .button {
    clear: both;
    background-color: #aaa;
    border: 0 none;
    transition: all 0.23s ease-in-out 0s;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 15px;
    font-weight: normal;
    height: 32px;
    line-height: 32px;
    margin: 0 5px 10px 0;
    padding: 0 22px;
    text-align: center;
    text-decoration: none;
    vertical-align: top;
    white-space: nowrap;
    width: fit-content;
    width: -moz-fit-content;
}

#mc_embed_signup .button:hover {
    background-color: #777;
}

#mc_embed_signup .small-meta {
    font-size: 11px;
}

#mc_embed_signup .nowrap {
    white-space: nowrap;
}

#mc_embed_signup .mc-field-group {
    clear: left;
    position: relative;
    width: 96%;
    padding-bottom: 3%;
    min-height: 50px;
}

#mc_embed_signup .size1of2 {
    clear: none;
    float: left;
    display: inline-block;
    width: 46%;
    margin-right: 4%;
}

* html #mc_embed_signup .size1of2 {
    margin-right: 2%;
    /* Fix for IE6 double margins. */
}

#mc_embed_signup .mc-field-group label {
    display: block;
    margin-bottom: 3px;
}

#mc_embed_signup .mc-field-group input {
    display: block;
    width: 100%;
    padding: 8px 0;
    text-indent: 2%;
}

#mc_embed_signup .mc-field-group select {
    display: inline-block;
    width: 99%;
    padding: 5px 0;
    margin-bottom: 2px;
}

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us {
    padding: 5px 0;
}

#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input {
    display: inline;
    width: 60px;
    margin: 0 2px;
    letter-spacing: 1px;
    text-align: center;
    padding: 5px 0 2px 0;
}

#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input {
    width: 40px;
}

#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input {
    width: 30px;
}

#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label {
    display: none;
}

#mc_embed_signup .indicates-required {
    text-align: right;
    font-size: 11px;
    margin-right: 4%;
}

#mc_embed_signup .asterisk {
    color: #e85c41;
    font-size: 150%;
    font-weight: normal;
    position: relative;
    top: 5px;
}

#mc_embed_signup .clear {
    clear: both;
}

#mc_embed_signup .foot {
    display: grid;
    grid-template-columns: 3fr 1fr;
    align-items: center;
}

@media screen and (max-width: 400px) {
    #mc_embed_signup .foot {
        display: grid;
        grid-template-columns: 1fr;
        align-items: center;
    }
}

@media screen and (max-width: 400px) {
    #mc_embed_signup .referralBadge {
        width: 50%;
    }
}

#mc_embed_signup .brandingLogo {
    justify-self: right;
}

@media screen and (max-width: 400px) {
    #mc_embed_signup .brandingLogo {
        justify-self: left;
    }
}

#mc_embed_signup .mc-field-group.input-group ul {
    margin: 0;
    padding: 5px 0;
    list-style: none;
}

#mc_embed_signup .mc-field-group.input-group ul li {
    display: block;
    padding: 3px 0;
    margin: 0;
}

#mc_embed_signup .mc-field-group.input-group label {
    display: inline;
}

#mc_embed_signup .mc-field-group.input-group input {
    display: inline;
    width: auto;
    border: none;
}

#mc_embed_signup div#mce-responses {
    float: left;
    top: -1.4em;
    padding: 0em .5em 0em .5em;
    overflow: hidden;
    width: 90%;
    margin: 0 5%;
    clear: both;
}

#mc_embed_signup div.response {
    margin: 1em 0;
    padding: 1em .5em .5em 0;
    font-weight: bold;
    float: left;
    top: -1.5em;
    z-index: 1;
    width: 80%;
}

#mc_embed_signup #mce-error-response {
    display: none;
}

#mc_embed_signup #mce-success-response {
    color: #529214;
    display: none;
}

#mc_embed_signup label.error {
    display: block;
    float: none;
    width: auto;
    margin-left: 1.05em;
    text-align: left;
    padding: .5em 0;
}

#mc-embedded-subscribe {
    clear: both;
    width: auto;
    display: block;
    margin: 1em 0 1em 5%;
    -webkit-appearance: none;
}

#mc_embed_signup #num-subscribers {
    font-size: 1.1em;
}

#mc_embed_signup #num-subscribers span {
    padding: .5em;
    border: 1px solid #ccc;
    margin-right: .5em;
    font-weight: bold;
}

#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {
    display: inline-block;
    margin: 0 0 1em 0;
    padding: 0 3px;
    background: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 14px;
    font-weight: normal;
    z-index: 1;
    color: #e85c41;
}

#mc_embed_signup #mc-embedded-subscribe-form input.mce_inline_error {
    border: 2px solid #e85c41;
}



#logo {
  width: 1175px;
}
#mc_embed_signup {
  width: 100%;
}

::-webkit-input-placeholder { /* Edge */
  color: #000A;
  font-style: italic;
  font-size: 14px;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #000A;
  font-style: italic;
  font-size: 14px;
}

::placeholder {
  color: #000A;
  font-style: italic;
  font-size: 14px;
}

#mc_embed_signup_scroll {
  display: flex;
  position: relative;
}


#mc-embedded-subscribe {
  margin-left: 8px !important;
    background: black !important;
    -webkit-appearance: none;
}
input {
  width: 300px;
  height: 32px;
  border: 1px solid #0004;
  border-radius: 0px !important;
  padding:0 16px;
  background: none;
}

.socials {
  display: flex;
}
.social img {
  height: 32px;
  opacity: 75%;
  margin-right:8px;
}

@media (max-width:1300px) {
  #logo {
    width: 1000px;
  }
}

@media (max-width:1000px) {
  #logo {
    width: 700px;
  }
}

@media (max-width:800px) {
  #logo {
    width: 600px;
  }

  ::-webkit-input-placeholder { /* Edge */
    color: #000A;
    font-style: italic;
    font-size: 12px;
  }

  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #000A;
    font-style: italic;
    font-size: 12px;
  }

  ::placeholder {
    color: #000A;
    font-style: italic;
    font-size: 12px;
  }
}

@media (max-width:620px) {
  #logo {
    width: 350px;
  }
  .socials {
    margin-bottom: 16px;
    align-items: stretch;
    max-width: 96%;
  }
  .socials a {
    flex: 1;
    height: 44px;
    border: 1px solid #0004;
    border-radius: 0px;
    display: flex;
    align-items: center;
    align-content: center;
  }
  .social img {
    margin: auto;
  }
  .socials a:first-of-type {
    margin-right: 8px;
  }

    ::-webkit-input-placeholder { /* Edge */
      color: #000A;
      font-style: italic;
      font-size: 12px;
        text-align: center;
    }

    :-ms-input-placeholder { /* Internet Explorer 10-11 */
      color: #000A;
      font-style: italic;
      font-size: 12px;
        text-align: center;
    }

    ::placeholder {
      color: #000A;
      font-style: italic;
      font-size: 12px;
        text-align: center;
    }

    #mc_embed_signup_scroll {
      display: flex;
      flex-direction: column;
      position: relative;
    }

    #mc-embedded-subscribe {
      margin-left: 0 !important;
      align-self: stretch !important;
      width: 100% !important;
      margin-right: 0 !important;
    -webkit-appearance: none;
    }
    .clear.foot {
      display: flex !important;
    }

    .mobile-only-spacer {
      flex: 1;
    }

    input {
      height: 44px;
    }
    #mc_embed_signup .button {
        width: 96% !important;
    }
}


form {
  display: flex;
  flex-direction: row;
}
button {
  padding:0 8px;
  height: 32px;
  border: 1px solid #0004;
  border-radius: 0px !important;
  background: none;
  color: #000A;
  font-weight: 600;
  font-style: oblique;
  margin-left: 8px;
}
.send {
  height: 16px;
}

#mce-responses {
  position: absolute;
  top:120%;
  left:0;
  width: 100%;

}

body {
    background: black;
}

#main-wrapper {
    display: grid;
    position: absolute;
    background: white;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    grid-template-columns: 34vw 1fr 19vw 19vw;
    grid-template-rows: 1fr 8vw 19vw 7vw 12vw;
    border: 2px solid black;
}

#main-wrapper > div {
    border: 1px solid black;
    position: relative;
}

#header {
    grid-column: 1 / 5;
}
#header img {
    object-fit: fill;
    padding: 4px;
}

#subtitle {
    grid-column: 3 / 5;
}
#subtitle img {
    object-fit: fill;
    padding: 5px 8px;
}

#stayinformed {
    grid-column: 2;
    grid-row: 2 / 6;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding-bottom:4px;
}
#stayinformed > div {
    flex: 1;
    position: relative;
}
#stayinformed img {
    padding: 0 2px;
    
}

#latenights {
    grid-column: 1;
    grid-row: 2 / 5;
}

#stuck {
    grid-column: 4;
    grid-row: 3;
}

#join-email {
    grid-column: 1;
    grid-row: 5;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding:1.2vw 0.4vw;
}

#sleepwalk {
    grid-column: 3;
    grid-row: 4 / 6;
}

#tiktok {
    grid-row: 3;
    grid-column: 3;
}

#instag {
    grid-row: 4 / 6;
    grid-column: 4;
}

img {
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
}

svg {
    position: absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
}
.st0{
    fill:#231F20;
  stroke-width: 0;
    stroke: black;
}

@keyframes a2 {
    5% { stroke-width: 0; }
    10% { stroke-width: 0.5; }
    79% { stroke-width: 0.5; }
    86% { stroke-width: 0; }
}
#stayinformed > div:nth-child(2) .st0 {
  animation: a2 10s ease infinite;
}
@keyframes a3 {
    7% { stroke-width: 0; }
    12% { stroke-width: 1; }
    80% { stroke-width: 1; }
    85% { stroke-width: 0; }
}
#stayinformed > div:nth-child(3) .st0 {
  animation: a3 10s ease infinite;
}
@keyframes a4 {
    9% { stroke-width: 0; }
    14% { stroke-width: 1.5; }
    81% { stroke-width: 1.5; }
    86% { stroke-width: 0; }
}
#stayinformed > div:nth-child(4) .st0 {
  animation: a4 10s ease infinite;
}
@keyframes a5 {
    11% { stroke-width: 0; }
    16% { stroke-width: 2; }
    82% { stroke-width: 2; }
    87% { stroke-width: 0; }
}
#stayinformed > div:nth-child(5) .st0 {
  animation: a5 10s ease infinite;
}

@keyframes a6 {
    13% { stroke-width: 0; }
    18% { stroke-width: 2.5; }
    83% { stroke-width: 2.5; }
    88% { stroke-width: 0; }
}
#stayinformed > div:nth-child(6) .st0 {
  animation: a6 10s ease infinite;
}
@keyframes a7 {
    15% { stroke-width: 0; }
    20% { stroke-width: 3; }
    84% { stroke-width: 3; }
    89% { stroke-width: 0; }
}
#stayinformed > div:nth-child(7) .st0 {
  animation: a7 10s ease infinite;
}
@keyframes a8 {
    17% { stroke-width: 0; }
    22% { stroke-width: 3.5; }
    85% { stroke-width: 3.5; }
    90% { stroke-width: 0; }
}
#stayinformed > div:nth-child(8) .st0 {
  animation: a8 10s ease infinite;
}
@keyframes a9 {
    19% { stroke-width: 0; }
    24% { stroke-width: 4; }
    86% { stroke-width: 4; }
    91% { stroke-width: 0; }
}
#stayinformed > div:nth-child(9) .st0 {
  animation: a9 10s ease infinite;
}
@keyframes a10 {
    21% { stroke-width: 0; }
    26% { stroke-width: 4.5; }
    87% { stroke-width: 4.5; }
    92% { stroke-width: 0; }
}
#stayinformed > div:nth-child(10) .st0 {
  animation: a10 10s ease infinite;
}
@keyframes a11 {
    23% { stroke-width: 0; }
    28% { stroke-width: 5; }
    88% { stroke-width: 5; }
    93% { stroke-width: 0; }
}
#stayinformed > div:nth-child(11) .st0 {
  animation: a11 10s ease infinite;
}
@keyframes a12 {
    25% { stroke-width: 0; }
    30% { stroke-width: 5.5; }
    89% { stroke-width: 5.5; }
    94% { stroke-width: 0; }
}
#stayinformed > div:nth-child(12) .st0 {
  animation: a12 10s ease infinite;
}
@keyframes a13 {
    27% { stroke-width: 0; }
    32% { stroke-width: 6; }
    90% { stroke-width: 6; }
    95% { stroke-width: 0; }
}
#stayinformed > div:nth-child(13) .st0 {
  animation: a13 10s ease infinite;
}

#join {
    flex: 1;
    position: relative;
    margin: 0.5vw 4% 0 4%;
}
#signup {
}

.mc-field-group {
    padding: 0 !important;
    min-height: unset !important;
}
#mc_embed_signup .button {
    margin-bottom: 0 !important;
    border-radius: 0 !important;
}
#mc_embed_signup form {
    padding: 0 0 10px 3% !important;
}

div.mce_inline_error {
    position: absolute;
    width: 100%;
    text-align: center;
    background: none;
}

@media (max-width:1000px) {
    body {
        display: flex;
        overflow: auto;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
    }
    #main-wrapper {
        display: grid;
        position: relative;
        right:unset;
        bottom:unset;
        top:unset;
        left:unset;
        width:100%;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 15vw 8vw 50vw 20vw 50vw 50vw;
    }
    #stayinformed > div:nth-child(11) {
        display: none;
        visibility: hidden;
    }
    #stayinformed > div:nth-child(12) {
        display: none;
        visibility: hidden;
    }
    #stayinformed > div:nth-child(13) {
        display: none;
        visibility: hidden;
    }

    #header {
        grid-column: 1 / 3;
    }

    #subtitle {
        grid-row: 2;
        grid-column: 2;
    }

    #stayinformed {
        grid-column: 1;
        grid-row: 2 / 4;
        padding-bottom:8px;
    }

    #latenights {
        grid-column: 1;
        grid-row: 5;
    }

    #stuck {
        grid-column: 2;
        grid-row: 3;
    }

    #join-email {
        grid-column: 1 / 3;
        grid-row: 4;
    }

    #sleepwalk {
        grid-column: 2;
        grid-row: 6;
    }

    #tiktok {
        grid-row: 6;
        grid-column: 1;
        visibility: visible;
        display: inherit;
    }

    #instag {
        grid-row: 5;
        grid-column: 2;
        visibility: visible;
        display: inherit;
    }
}

@media (max-width:620px) {
    body {
        display: flex;
        overflow: auto;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
    }
    #main-wrapper {
        display: grid;
        position: relative;
        right:unset;
        bottom:unset;
        top:unset;
        left:unset;
        width:100%;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 20vw 13vw 50vw 50vw calc(30vw + 44px) 100vw 50vw;
    }
    #stayinformed > div:nth-child(11) {
        display: initial;
        visibility: initial;
    }
    #stayinformed > div:nth-child(12) {
        display: initial;
        visibility: initial;
    }
    #stayinformed > div:nth-child(13) {
        display: initial;
        visibility: initial;
    }
    
    
    #subtitle {
        grid-row: 2;
        grid-column: 1 / 3;
    }

    #stayinformed {
        grid-column: 1;
        grid-row: 3 / 5;
        padding-top:8px;
        padding-bottom:2px;
    }

    #latenights {
        grid-column: 2;
        grid-row: 3;
    }

    #stuck {
        grid-column: 2;
        grid-row: 4;
    }

    #join-email {
        grid-column: 1 / 3;
        grid-row: 5;
    }

    #sleepwalk {
        grid-column: 1 / 3;
        grid-row: 6;
    }

    #tiktok {
        grid-row: 7;
        grid-column: 1;
        visibility: visible;
        display: inherit;
    }

    #instag {
        grid-row: 7;
        grid-column: 2;
        visibility: visible;
        display: inherit;
    }
    
    div.mce_inline_error {
        position: relative;
        width: 100%;
        text-align: center;
        background: none;
        margin: 0 !important;
    }
}


#tiktok img {
    margin: 40%;
    width:20%;
    height:20%;
}

#instag img {
    margin: 30%;
    width:40%;
    height:40%;
}

#tiktok a, #instag a {
    width: 100%;
    height:100%;
    position:absolute;
}