:root {
  --color-almost-black-60: rgba(8, 11, 18, 0.6);
  --color-white-60: #999999;
}

.theme {
  --background-color: #080b12;
  --header-color: #ffffff;
  --text-color: #ffffff;
  --link-color: #fcae00;
  --link-hover: #70F9D2;
  --button-font-size: 16px;
  --button-border-color: #fcae00;
  --button-background-color: #fcae00;
  --button-background-color-hover: #70F9D2;
  --button-text-color: #080b12;
  --control-padding-horizontal: 21px;
  --area-max-width: 1050px;
}

.theme__light {
  --background-color: #ffffff;
  --header-color: #080b12;
  --text-color: #242c40;
  --link-color: #242c40;
  --link-hover: #70F9D2;
  --button-font-size: 18px;
  --button-border-color: #7c00ff;
  --button-background-color: transparent;
  --button-background-color-hover: #70F9D2;
  --button-text-color: #7c00ff;
}

 html {
  box-sizing: border-box;
  background-color: #080b12;
  color: #fff;
  font-family: 'Work Sans', Helvetica, sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.4;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

@font-face {
	font-family: 'vanguardcf';
	src: url('../fonts/vanguardcf-boldoblique.woff2') format('woff2'),
			 url('../fonts/vanguardcf-boldoblique.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	}

	.vanguardcf {
		font-family: 'vanguardcf' !important;
	}

@media screen and (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

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

body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

.no-bg{
  background: none !important;
}

a, a:active, a:link, a:visited,
.sdm_download *, .sdm_download:active *, .sdm_download:link *, .sdm_download:visited * {
  color: var(--link-color);
  transition: .16s ease-out color, .16s ease-out fill, .16s ease-out background-color, .16s ease-out border-color, .16s ease-out box-shadow;
}

.sdm_download:hover *{
  transition: .16s ease-out color, .16s ease-out fill, .16s ease-out background-color, .16s ease-out border-color, .16s ease-out box-shadow;
}

a:hover, a:focus,
.sdm_download:hover, .sdm_download:focus {
  color: var(--link-hover);
  outline: none;
}

.plain-link, .plain-link:active, .plain-link:link, .plain-link:visited {
  color: var(--text-color);
  text-decoration: none;
}

.plain-link:hover, .plain-link:focus {
  color: var(--link-hover);
}

h1, h2, h3, p, ul,
.passster-form h4 {
  margin: 0;
}

h2 {
  margin-bottom: 20px;
  color: var(--header-color);
  font-size: 34px;
  font-size: clamp(34px, 8.21vw, 80px);
  font-weight: 900;
  line-height: 0.875em;
}

.passster-form h4{
    margin-bottom: 20px !important;
    color: var(--header-color) !important;
    font-size: 26px !important;
    font-size: clamp(26px, 6.28vw, 60px) !important;
    font-weight: 900 !important;
    line-height: 0.875em !important;
}

.h2__small {
  font-size: 26px;
  font-size: clamp(26px, 6.28vw, 60px);
}

.h2__intro {
  max-width: 7.75em;
}

ul {
  padding: 0;
}

li {
  list-style: none;
}

.faq-item_answer ul li{
  list-style: initial;
  margin: 5px 15px;
}

ol li{
  list-style: decimal;
}

img {
  max-width: 100%;
}

svg {
  max-width: 100%;
  height: auto;
  fill: currentColor;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/* Components */

.lead {
  font-size: 26px;
  font-size: clamp(22px, 5.31vw, 26px);
  line-height: 1.15;
  font-weight: 400;
}

.lead.skew-up{
  margin-top: -55px;
}

.passster-form p{
  font-size: 18px !important;
  font-size: clamp(14px, 2.31vw, 18px) !important;
  line-height: 1.15 !important;
  font-weight: 400 !important;
  margin-bottom: 20px;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .lead {
    font-weight: 700;
  }
  .passster-form p{
    font-weight: 700 !important;
  }
}

.lead__alt {
  font-weight: 400;
}

.button, .button:active, .button:link, .button:visited,
.sdm_download, .sdm_download:active, .sdm_download:link, .sdm_download:visited {
  display: block;
  height: 50px;
  padding: 0 35px;
  border: none;
  border-radius: 50px;
  background: var(--button-background-color);
  color: var(--button-text-color);
  font-size: var(--button-font-size);
  line-height: 50px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 0 0 0 4px var(--button-border-color) inset;
}

.button__disabled, .button__disabled:active, .button__disabled:link, .button__disabled:visited, .button__disabled:hover, .button__disabled:focus {
  background: var(--color-white-60);
  color: #fff;
  box-shadow: 0 0 0 4px var(--color-white-60) inset;
  pointer-events: none;
}

.passster-form button[type=submit]{
  display: block !important;
  height: 50px !important;
  padding: 0 35px !important;
  border: none !important;
  border-radius: 50px !important;
  background: var(--button-background-color) !important;
  color: var(--button-text-color) !important;
  font-size: var(--button-font-size) !important;
  line-height: 50px !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  box-shadow: 0 0 0 4px var(--button-border-color) inset !important;
}

.button:hover, .button:focus,
.sdm_download:hover, .sdm_download:focus {
  background-color: var(--button-background-color-hover);
  box-shadow: 0 0 0 4px var(--button-background-color-hover) inset;
}

.button__disabled, .button__disabled:active, .button__disabled:link, .button__disabled:visited, .button__disabled:hover, .button__disabled:focus, {
  background: var(--color-white-60);
  color: #fff;
  box-shadow: 0 0 0 4px var(--color-white-60) inset;
}

.button__medium {
  width: 194px;
}

.input,
.passster-form input[type=password] {
  height: 50px;
  padding: 0 var(--control-padding-horizontal);
  border: none;
  border-radius: 25px;
  font-size: 16px;
  background-color: #242c40;
  color: #ffffff;
  outline: none !important;
}

textarea.input {
  height: auto;
  min-height: 50px;
  padding-top: 16px;
  padding-bottom: 16px;
  font-family: 'Work Sans', Helvetica, sans-serif;
}

.input-header-label {
  display: inline-block;
  margin-bottom: 20px;
  font-size: 22px;
  font-weight: 400;
}

.label-input {
  display: flex;
  height: 50px;
  border-radius: 25px;
  background-color: #242c40;
}

.label-input_input-wrap {
  position: relative;
  flex: 1;
}

.label-input_label {
  position: absolute;
  top: 14px;
  left: 0;
  padding: 0 var(--control-padding-horizontal);
  font-size: 16px;
  color: rgba(255, 255, 255, 0.85);
}

.label-input_label.smaller{
  font-size: 14px;
}

.label-input:focus-within .label-input_label {
  opacity: 0;
}

.label-input_input {
  width: 100%;
  outline: none !important;
}

textarea.label-input_input {
  width: 100%;
  height: 100%;
  resize: none;
}

.more-button, .more-button:active, .more-button:link, .more-button:visited {
  padding: 0;
  border: none;
  background: transparent;
  color: var(--link-color);
  font-size: inherit;
  font-weight: 700;
}

.more-button:hover,
.more-button:focus {
  color: var(--link-hover);
}

.more-button__open {
  display: none;
}

.more-button_content {
  display: none;
}

.more-button_content__open {
  display: inline;
}

.main-nav {
  position: absolute;
  right: 20px;
  line-height: 1;
  /* Preload the nav bg */
  background-image: url('/wp-content/themes/electoral-november-2020/assets/img/bg-main-nav.svg');
  background-size: 1px 1px;
  background-position-y: -100px;
  background-repeat: no-repeat;
}

.main-nav_toggle {
  position: relative;
  z-index: 4;
  width: 50px;
  height: 50px;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--link-color);
  transition: .08s ease-out transform;
  cursor: pointer;
}

.main-nav_toggle__active {
  --link-hover: #242c40;
  position: fixed;
  top: 15px;
  right: 20px;
  background-color: #fcae00;
  color: #242c40;
}

.main-nav_toggle:hover, .main-nav_toggle:focus {
  color: var(--link-hover);
  outline: none;
  transform: scale(1.15);
}

.main-nav_toggle__active .main-nav_toggle-open,
.main-nav_toggle-close {
  display: none;
}

.main-nav_toggle__active .main-nav_toggle-close {
  display: block;
}

.main-nav_toggle__active + .main-nav_screen {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  background-color: rgba(8, 11, 18, .2);
}

.main-nav_menu {
  display: none;
  position: fixed;
  z-index: 3;
  top: 0;
  right: 0;
  left: 0;
  padding: 125px 42px;
  background-image: url('/wp-content/themes/electoral-november-2020/assets/img/bg-main-nav.svg');
  background-size: 170% 210%;
  background-position: 90% bottom;
  background-repeat: no-repeat;
}

.main-nav_menu__active {
  display: block;
}

.main-nav_menu-list {
  padding-right: 10px;
}

.main-nav_menu-link, .main-nav_menu-link:active, .main-nav_menu-link:link, .main-nav_menu-link:visited {
  background-color: #fcae00;
  color: #242c40;
  font-size: 34px;
  line-height: 1.7;
  font-weight: 900;
  text-decoration: none;
}

@media screen and (max-width: 520px) {
	.main-nav_menu-link, .main-nav_menu-link:active, .main-nav_menu-link:link, .main-nav_menu-link:visited {
		font-size: 20px;
	}
	.main-nav_menu {
		background-color: #fdae00;
		overflow: scroll;
    height: 100%;
	}
}

.main-nav_menu-link:hover, .main-nav_menu-link:focus {
  color: #242c40;
  text-decoration: underline;
}

@media screen and (min-width: 400px) {
  .main-nav,
  .main-nav_toggle__active {
    right: 42px;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .main-nav,
  .main-nav_toggle__active {
    right: auto;
    left: calc(50% + (var(--area-max-width) / 2) - 50px);
  }

  .main-nav_menu {
    text-align: right;
    padding: 65px 42px 80px;
    padding-right: calc((100% - var(--area-max-width)) / 2);
    background-size: 463px 710px;
		background-position: calc(50% + (var(--area-max-width) / 2) - 80px) bottom;
		min-height: 400px;
  }

  .main-nav_menu-link, .main-nav_menu-link:active, .main-nav_menu-link:link, .main-nav_menu-link:visited {
    font-size: 17px;
    font-weight: 700;
  }
}

@media screen and (min-width: 1300px) {
  .main-nav,
  .main-nav_toggle__active {
    left: calc(50% + (var(--area-max-width) / 2) + 42px);
  }

  .main-nav_menu {
    padding-right: calc((100% - var(--area-max-width)) / 2 - 92px);
    background-position: calc(50% + (var(--area-max-width) / 2) - 12px) bottom;
  }
}

.side-nav {
  display: none;
}

.bnc-guide #side-nav{display: none;}

.side-nav_list {
  display: inline-grid;
  grid-auto-flow: row;
  grid-auto-rows: max-content;
  grid-gap: 20px;
  justify-items: center;
  width: auto;
}

.side-nav_link, .side-nav_link:active, .side-nav_link:link, .side-nav_link:visited {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
  border: 3px solid #242C40;
  border-radius: 50%;
  background-color: transparent;
}

.side-nav_link:hover, .side-nav_link:focus {
  background-color: var(--link-hover);
}

.side-nav_link::before {
  content: "";
  position: absolute;
  top: -13px;
  left: -13px;
  display: block;
  width: 40px;
  height: 40px;
  background-color: transparent;
}

.side-nav_list li + li .side-nav_link::after {
  content: "";
  position: absolute;
  bottom: calc(100% + 3px);
  left: 50%;
  transform: translate(-50%, 0);
  display: block;
  width: 3px;
  height: 20px;
  background-color: #242C40;
}

.side-nav_link.side-nav_link__active {
  background-color: #FCAE00;
}

/* 1218px = 1050px + (42px * 4) */
@media screen and (min-width: 1280px) {
  .side-nav {
    display: block;
    position: fixed;
    top: 50%;
    right: calc(50% + (var(--area-max-width) / 2) + 80px);
    transform: translateY(-50%);
    z-index: 3;
  }
}

.tagline {
  font-size: 22px;
  line-height: 1.15;
}

.year-lockup {
  display: inline-grid;
  font-size: 50px;
  font-size: clamp(50px, 16vw, 110px);
  font-weight: 900;
  line-height: 0.72;
}

.date {
  display: grid;
  grid-auto-columns: max-content;
  grid-gap: 5px;
}

.date_month {
  font-size: 80px;
  font-weight: 900;
  line-height: .7;
  letter-spacing: .06em;
}

.date_days {
  margin-left: -.05em;
  font-size: 110px;
  font-weight: 900;
  line-height: .7;
}

.date__bnc {
  grid-auto-flow: column;
  font-size: 76px;
  font-size: clamp(44px, 13.8vw, 76px);
  font-weight: 900;
  line-height: .7;
}

.day-of-state .date__bnc{
  font-size: clamp(34px, 13.8vw, 65px);  
}

.time {
  display: inline-grid;
  grid-template-areas: "digit period" "digit zone";
  grid-auto-columns: max-content;
  align-items: start;
  font-size: 43px;
  line-height: .74;
  font-weight: 900;
  text-transform: uppercase;
}

.day-of-state .time {
  font-size: 34px;
}

.time_digit {
  grid-area: digit;
  font-size: 90px;
  line-height: .67;
}

.day-of-state .time_digit{
  font-size: 74px;
}

.time_period {
  grid-area: period;
}

.time_zone {
  grid-area: zone;
}

.timer {
  display: flex;
  justify-content: space-between;
  max-width: 6.4ch;
  font-size: 54px;
  font-size: clamp(50px, 19.32vw, 110px);
  font-weight: 900;
  line-height: .72;
  text-align: center;
}

.timer_part {
  display: grid;
  grid-gap: 12px;
}

.timer_label {
  font-size: 13px;
  font-weight: 600;
  text-transform: capitalize;
}

.timer-lockup_header {
  max-width: none;
  margin-bottom: 40px;
  font-size: 26px;
  line-height: 1.15;
}

.playlist {
  display: inline-grid;
}

.playlist, .playlist:active, .playlist:link, .playlist:visited {
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  grid-gap: 14px;
  align-items: center;
  border-radius: 56px;
  color: #fff;
  text-decoration: none;
}

.playlist:focus, .playlist:hover {
  background-color: #70F9D2;
  box-shadow: 0 0 0 4px #70F9D2;
}

.playlist:focus .playlist_header, .playlist:hover .playlist_header {
  color: #080b12;
}

.playlist:focus .playlist_button, .playlist:hover .playlist_button {
  background-color: transparent;
  color: #080b12;
  box-shadow: 0 0 0 1px #080b12;
}

.playlist_cover {
  width: 56px;
  height: 56px;
  border-radius: 100%;
  background-color: #242c40;
  background-image: url('/wp-content/themes/electoral-november-2020/assets/img/playlist-cover.png');
  background-size: cover;
}

.bnc-guide .playlist_cover{
  background-image: url(/wp-content/themes/electoral-november-2020/assets/img/photo-download-music.png);
}

.playlist_header {
  max-width: none;
  margin-bottom: 7px;
  font-size: 16px;
  font-weight: 600;
}

.playlist_button {
  display: inline-flex;
  align-items: center;
  padding: 3px 15px 3px 3px;
  border-radius: 50px;
  background-color: #1ed761;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
  transition: .16s ease-out color, .16s ease-out background-color, .16s ease-out box-shadow;
}

.playlist_logo {
  width: 16px;
  height: auto;
  margin-right: 6px;
}

.streaming {
  display: inline-grid;
  grid-template-areas: ". . watch" "live . stream" ". . on";
  grid-template-columns: max-content 26px;
  grid-auto-columns: max-content;
  grid-row-gap: 4px;
  font-size: 44px;
  font-size: clamp(26px, 8.7vw, 44px);
  line-height: .74;
  font-weight: 900;
  text-transform: uppercase;
}

.day-of-state .streaming{
  margin-bottom: 30px;
  grid-template-columns: initial;
  font-size: clamp(26px, 8.7vw, 38px);
}

@media(max-width: 767px){
  .day-of-state .streaming{
    margin-bottom: 0px;
  }
}

.streaming_live {
  grid-area: live;
}

.streaming_watch-it {
  grid-area: watch;
  font-size: 22px;
  font-weight: 700;
}

.day-of-state .streaming_watch-it{
  font-size: 20px;
}

.streaming_streaming {
  grid-area: stream;
}

.bnc-guide .streaming{
  grid-auto-flow: column;
}

.bnc-guide .streaming .tagline{
  white-space: nowrap;
}

.bnc-guide .streaming .date{
}

.bnc-guide .streaming .tagline .url{
  font-size: clamp(34px, 13.8vw, 44px);
  font-weight: 900;
  line-height: 45px;
}

.ambassador-item {
  display: grid;
  grid-template-areas: "avatar name"
                       "avatar title"
                       ". description";
  grid-template-columns: 58px 1fr;
  grid-column-gap: 20px;
  grid-auto-rows: max-content;
  grid-row-gap: 8px;
}

.ambassador-item_photo {
  grid-area: avatar;
  display: block;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background-color: #242c40;
  background-image: url('/wp-content/themes/electoral-november-2020/assets/img/placeholder-speaker-avatar.svg');
  background-size: cover;
}

.ambassador-item_name {
  grid-area: name;
  font-size: 26px;
  line-height: 1.15;
}

.ambassador-item_title {
  grid-area: title;
  color: var(--color-almost-black-60);
  line-height: 1.15;
  font-weight: 400;
}

.ambassador-item_pronoun {
  display: block;
  margin-top: 5px;
  color: inherit;
  font-size: 13px;
  line-height: 1.15;
}

.ambassador-item_description {
  grid-area: description;
}

.press-item {
  display: grid;
  grid-template-areas: "source" "." "photo" "." "title" "." "link";
  grid-template-rows: max-content 14px max-content 14px max-content 20px max-content;
  justify-items: start;
}

.press-item_source {
  grid-area: source;
  font-size: 18px;
}

.press-item_title {
  grid-area: title;
}

.press-item_photo {
  grid-area: photo;
  display: block;
  width: 100%;
  padding-bottom: 71%;
  background-color: #242c40;
}

.press-item_link {
  grid-area: link;
  font-weight: 700;
}

.copyright {
  color: var(--color-white-60);
  font-size: 18px;
}

.agenda {
  display: none;
}

.agenda__open {
  display: block;
}

.agenda_header {
  display: grid;
  grid-auto-flow: column;
  grid-template-areas: "left . header . right";
  grid-template-columns: 17px 1fr max-content 1fr 17px;
  align-items: baseline;
  max-width: 330px;
  margin-top: 10px;
}

.agenda_header-text {
  grid-area: header;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

.agenda_day-link, .agenda_day-link:active, .agenda_day-link:link, .agenda_day-link:visited {
  --link-color: #ffffff;
  --link-hover: #70F9D2;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--link-color);
  transition: .16s ease-out color, .16s ease-out fill, .16s ease-out background-color, .16s ease-out border-color, .16s ease-out box-shadow;
}

.agenda_day-link:hover, .agenda_day-link:focus {
  color: var(--link-hover);
  outline: none;
}

.agenda_day-link__disabled {
  color: rgba(255, 255, 255, 0.3) !important;
}

.agenda_day-link:first-child {
  grid-area: left;
}

.agenda_day-link:last-child {
  grid-area: right;
}

.agenda-item {
  display: grid;
  grid-template-areas: "avatar et"
                       "avatar pt"
                       "avatar header"
                       ". speaker"
                       ". description";
  grid-template-columns: 58px 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 8px;
  margin-top: 40px;
}

.agenda-item_header {
  grid-area: header;
  font-size: 26px;
  line-height: 1;
  font-weight: 700;
}

.agenda-item_speaker {
  grid-area: speaker;
  font-size: 18px;
}

.agenda-item_speaker-pronoun {
  font-size: 14px;
  font-weight: 600;
}

.agenda-item_speaker-avatar {
  grid-area: avatar;
  display: block;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background-color: #242c40;
  background-image: url('/wp-content/themes/electoral-november-2020/assets/img/placeholder-speaker-avatar.svg');
  background-size: cover;
}

.agenda-item_description {
  grid-area: description;
}

.agenda-item_time {
  grid-area: et;
  font-size: 18px;
  font-weight: 700;
}

.agenda-item_time__pt {
  grid-area: pt;
  margin-top: -8px;
}

.quote {
  max-width: 252px;
  color: var(--text-color);
}

.quote_text {
  font-size: 26px;
  line-height: 1.15;
  font-weight: 900;
}

.quote_author {
  margin-top: 15px;
  color: var(--color-white-60);
  font-size: 18px;
  line-height: 1.2;
  font-weight: 400;
}

.faq-item {
  position: relative;
  border-bottom: 2px solid #080b12;
}

.faq-item_question {
  position: relative;
  display: block;
  width: 100%;
  padding: 12px 12px 12px 25px;
  border: none;
  /* border-top: 2px solid transparent;
  border-bottom: 2px solid #080b12; */
  background: transparent;
  font-size: 16px;
  line-height: 1;
  font-weight: 600;
  text-align: left;
}

.faq-item_question::before {
  content: "+";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: inline-block;
  color: #7c00ff;
  font-size: 28px;
  line-height: 1;
}

.faq-item_question::after {
  content: "";
  position: absolute;
  top: -2px;
  right: 0;
  bottom: -2px;
  left: -20px;
  display: block;
  border: 2px solid transparent;
  border-left-width: 20px;
}

.faq-item_answer {
  display: none;
  padding: 10px 0 34px 25px;
}

.faq-item_question__open {
  border-color: #7c00ff;
  background-color: #7c00ff;
  color: #ffffff;
}

.faq-item_question__open::before {
  content: "-";
  color: #ffffff;
}

.faq-item_question__open::after {
  border-color: #7c00ff;
}

.faq-item_question__open + .faq-item_answer {
  display: block;
}

.social-media-links {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  justify-content: space-around;
  width: 225px;
  padding: 0;
}

.social-media-links li {
  display: block;
  list-style: none;
}

.social-media-links a {
  display: grid;
}

.social-media-links svg {
  width: auto;
  height: 20px;
}

.scroll-ind {
  position: absolute;
  left: 50%;
  top: clamp(0px, 65%, 50vh);
  transform: translateX(-50%);
}

.scroll-ind_bottom {
  stroke-dasharray: 25px;
  stroke-dashoffset: 24px;
  animation: scroll-ind-fade 2s linear 0, scroll-ind-bottom-dash 2s ease-out 0;
  animation-iteration-count: infinite;
}

.scroll-ind_top {
  stroke-dasharray: 25px;
  stroke-dashoffset: 24px;
  animation: scroll-ind-fade 2s linear 0, scroll-ind-top-dash 2s ease-out 0;
  animation-iteration-count: infinite;
}

@media screen and (max-width: 1133px), (prefers-reduced-motion: reduce) {
  .scroll-ind {
    display: none;
  }
}

@keyframes scroll-ind-top-dash {
  0% {
    stroke-dashoffset: 24px;
  }
  70% {
    stroke-dashoffset: 24px;
  }
  100% {
    stroke-dashoffset: -25px;
  }
}

@keyframes scroll-ind-bottom-dash {
  0% {
    stroke-dashoffset: 24px;
  }
  50% {
    stroke-dashoffset: 24px;
  }
  100% {
    stroke-dashoffset: -25px;
  }
}

@keyframes scroll-ind-fade {
  0% {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* Areas and Sections */

.area {
  /* Blob props */
  position: relative;
  z-index: 1;
  /* End blob props */
  display: grid;
  grid-auto-flow: row;
  grid-row-gap: 85px;
  width: 100%;
  padding: 76px 0;
  background-color: var(--background-color);
  color: var(--text-color);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .area {
    grid-row-gap: 140px;
    padding-top: 130px;
    padding-bottom: 130px;
  }
}

.area__first {
  padding-top: 15px;
  padding-bottom: 0;
}

.area__first,
.area__last {
  /*
   * area__first needs to be above all others since it has the menu in it
   * area__last needs to have the same z-index so the social links won't disappear under area__first
   * js will update area__last when the menu opens so the social links won't interfere
   */
  z-index: 2;
}

.has-open-menu .area__last {
  z-index: 1;
}

.area + .area {
  padding-top: 120px;
  background-repeat: no-repeat;
  background-size: 200% 120px;
  background-position: center top;
  background-image: url(/wp-content/themes/electoral-november-2020/assets/img/bg-masthead__light.svg);
}

.area + .area__light {
  padding-top: 144px;
  background-image: url(/wp-content/themes/electoral-november-2020/assets/img/bg-masthead-mobile.svg);
  background-repeat: no-repeat;
  background-size: 150% 160px;
  background-position: center 0;
}

.area + .area__last {
  padding-top: 66px;
  padding-bottom: 66px;
}

@media screen and (min-width: 1134px) {
  .area + .area {
    padding-top: 130px;
    padding-bottom: 0;
    background-repeat: no-repeat;
    background-size: 140% 180px;
    background-position: center top;
    background-image: url(/wp-content/themes/electoral-november-2020/assets/img/bg-masthead__light.svg);
  }
  .area + .area__light {
    padding-top: 290px;
    padding-bottom: 130px;
    background-repeat: no-repeat;
    background-size: 140% 270px;
    background-position: center -60px;
    background-image: url(/wp-content/themes/electoral-november-2020/assets/img/bg-masthead.svg);
  }
  .area + .area__last {
    padding-bottom: 66px;
  }
  .area__first {
    grid-row-gap: 84px;
  }
}

.area_blob-anchor {
  position: relative;
}

.blob {
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.blob > .blob {
  width: 100%;
  max-width: none;
  height: 100%;
}

.section-base {
  display: grid;
  padding-right: 20px;
  padding-left: 20px;
}

.section-base:focus {
  outline: none;
}

@media screen and (min-width: 400px) {
  .section-base {
    padding-right: 42px;
    padding-left: 42px;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-base {
    grid-column-gap: 20px;
    grid-template-columns: 1fr 1fr;
    padding-right: calc((100% - var(--area-max-width)) / 2);
    padding-left: calc((100% - var(--area-max-width)) / 2);
  }

  .section-base_col-2 {
    grid-column: 2;
	}
  .section-base_col-3 {
    grid-column: 1 / 3;
  }
	
}

.section-top-bar {
  display: grid;
  grid-gap: 15px;
  grid-template-areas: "m4bl"
											 "hashtag";
	align-items: start;
}

.donate{
  margin-left: auto;
}

.donate.desktop{
  display: initial;
}

.donate.mobile{
  display: none;
}

@media(max-width: 767px){

  .donate.desktop{
    display: none;
  }

  .donate.mobile{
    display: block;
    grid-area: donate;
    width: 100%;
  }

}

.day-of-state .section-top-bar{
  margin-bottom: -24px;
}

.section-top-bar_m4bl-logo {
  grid-area: m4bl;
  width: 122px;
}

.section-top-bar_m4bl-logo img {
  display: block;
}

.section-top-bar_hashtag {
  grid-area: hashtag;
  font-size: 18px;
  font-weight: 700;
}

.section-top-bar_updates {
  grid-area: updates;
}

.section-masthead {
  grid-template-areas: "logo"
                       "."
                       "tagline"
                       "."
                       "date"
                       "."
                       "timer"
                       "."
                       "updates"
                       "."
                       "playlist";
  grid-template-rows: max-content
                      50px
                      max-content
                      50px
                      max-content
                      44px
                      max-content
                      75px
                      max-content
                      50px
                      max-content;
  grid-gap: 0;
  align-items: start;
  padding-bottom: 20px;
}

.section-masthead__bnc {
  grid-template-areas: "logo"
                       "."
                       "streaming"
                       "."
                       "tagline"
                       "."
                       "date"
                       "."
                       "time"
                       "."
                       "donate"
                       "."
                       "timer"
                       "."
                       "updates"
                       "."
                       "playlist";
  grid-template-rows: max-content
                      50px
                      max-content
                      50px
                      max-content
                      44px
                      max-content
                      28px
                      max-content
                      50px
                      max-content
                      75px
                      max-content
                      50px
                      max-content;
}

.section-masthead__homepage {
  grid-template-areas: 
                       "streaming"
                       "."
                       "tagline"
                       "."
                       "updates"
                       "."
                       "playlist";
  grid-template-rows: max-content
                      50px
                      max-content
                      50px
                      max-content
                      44px
                      max-content;
}
.section-masthead__roadtobn {
	grid-template-rows: none;	
}

.day-of-state .section-masthead__bnc{
  grid-template-areas: "logo"
                       "."
                       "date"
                       "."
                       "."
                       "."
                       "streaming"
                       "."
                       "time"
                       "."
                       "restream"                       
                       "."                       
                       "timer"
                       "."
                       "updates"
                       "."
                       "playlist"
                       "."
                       "donate"
                       ".";
  grid-template-rows: max-content 50px max-content 0px max-content 44px max-content 28px max-content 50px max-content 75px max-content 50px max-content 50px max-content 50px;
  padding-bottom: 50px;
  margin-bottom: initial;
}
.tagline{
  display: none;
}

.section-masthead_logo {
  width: 100%;
  max-width: 512px;
  grid-area: logo;
  line-height: 0;
}

.section-masthead_logo.internal{
  max-width: 194px;
  width: 100%;
}

.section-masthead__bnc .section-masthead_logo {
  padding-right: 0;
}

.bnc-guide .section-masthead__bnc .section-masthead_logo {
  max-width: 345px;
}

.section-masthead_streaming {
  grid-area: streaming;
}

.day-of-state .section-masthead_streaming {
  grid-area: date;
}

.section-masthead_streaming-blob {
  width: clamp(123px, 29.7vw, 138px);
  transform: translate(-20px, -14px);
}

.section-masthead_date {
  grid-area: date;
  max-width: 512px;
}

.day-of-state .section-masthead_date {
  grid-area: streaming;
}

.section-masthead_date {
  justify-content: end;
}

.section-masthead__bnc .section-masthead_date {
  justify-content: start;
}

.section-masthead_time {
  grid-area: time;
}

.day-of-state .section-masthead_time {
  grid-area: streaming;
  transform: translateY(52px);
  margin-left: 40%;
}

.bnc-guide .section-masthead_time {
  width: 100%;
  grid-area: unset;
  margin-top: 10px;
}

.section-masthead_tagline {
  grid-area: tagline;
  max-width: 280px;
}

.bnc-guide .section-masthead_tagline {
  font-size: 76px;
  font-size: clamp(44px, 12.8vw, 76px);
  font-weight: 900;
  line-height: .7;
  margin-left: -55px;
  max-width: 515px;
  width: 90vw;
}

@media(min-width: 768px){
  .bnc-guide .section-masthead_tagline {
    margin-top: -115px;
  }
}

@media(max-width: 767px){
  .bnc-guide .section-masthead_tagline {
    width: initial;
    max-width: 85vw;
    margin: initial;
    font-size: 44px;
    font-size: clamp(44px, 12.8vw, 76px);
  }
  .day-of-state .restream{
    grid-area: restream;
  }
}

.bnc-guide .section-masthead_tagline p:not(.lead){
  font-size: 16px;
  font-weight: normal;
  line-height: 1.6;
}

.bnc-guide .section-masthead_tagline div{
  margin: 5px 0px;
}

.bnc-guide .section-masthead_tagline p{
  margin-top: 20px;
}

.section-masthead_timer-lockup {
  grid-area: timer;
}

.section-masthead_updates {
  grid-area: updates;
}

.section-masthead_playlist {
  grid-area: playlist;
}

.bnc-guide .section-masthead_playlist {
  margin-top: -75px;
}

.section-about {
  grid-template-areas: "header"
                       "lead"
                       "blob"
                       "colorBlob1"
                       "colorBlob2"
                       "text";
  grid-auto-rows: max-content;
}

.section-about_header {
  grid-area: header;
}

.section-about_lead {
  grid-area: lead;
}

.section-about_blob {
  grid-area: blob;
  width: 70%;
  max-width: 450px;
  justify-self: center;
  padding: 30px 0;
}

.section-about_pattern-blob {
  top: 150px;
  left: calc(50% - (var(--area-max-width) / 2));
  transform: translateX(-50%);
}

.bnc-guide .section-about_pattern-blob{
  bottom: -50px;
  left: 115px;
  top: initial;
}

.section-about_text {
  grid-area: text;
	font-size: 18px;
	font-weight: bold;
}

.photo-blob-unprecedented img {
	position: absolute;
	bottom: -13vw;
	left: -15vw;
	max-width: 780px;
	width: 54vw;
}

.homepage .section-agenda_blob-1 {
	top: inherit;
	bottom: -450px;
	width: 620px;
}

@media screen and (max-width: 1133px) {
	.photo-blob-unprecedented img {
		position: relative;
		bottom: inherit;
		left: inherit;
	}
}
.section-unprecedented_text {
	font-size: 18px;
	font-weight: bold;
}

.section-about_color-blob-1 {
  grid-area: colorBlob1;
  right: -20px;
  width: clamp(220px, 37.5vw, 400px);
  height: clamp(220px, 37.5vw, 400px);
  overflow: hidden;
  transform: translateY(-100%);
}

.section-about_color-blob-1 > .blob {
  width: 200%;
}

@media screen and (min-width: 400px) {
  .section-about_color-blob-1 {
    right: -42px;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-about_color-blob-1 {
    top: -100px;
    right: 0;
    left: calc(50% + (var(--area-max-width) / 2) - 50px);
    width: auto;
    height: 750px;
    transform: none;
  }
  .section-about_color-blob-1 > .blob {
    width: 550px;
  }
}

.section-about_color-blob-2 {
  grid-area: colorBlob2;
  left: -42px;
  width: clamp(150px, 37.5vw, 300px);
  height: clamp(150px, 37.5vw, 300px);
  overflow: hidden;
  transform: translateY(-120%);
}

@media(max-width: 767px){
  .bnc-guide .section-about_color-blob-2{
    transform: initial;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-about_color-blob-2 {
    display: none;
  }
}

.section-about_color-blob-2 > .blob {
  right: 0;
  width: 160%;
}

.section-faqs_color-blob-1 {
  display: none;
  bottom: -100px;
  left: 50%;
  width: 450px;
  height: 350px;
  overflow: hidden;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-faqs_color-blob-1 {
    display: block;
  }
}

.section-host_pattern-blob {
  right: 0;
  bottom: -100px;
  width: 400px;
  height: 400px;
  overflow: hidden;
}

.section-host_pattern-blob > .blob {
  left: 60%;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-host_pattern-blob {
    display: none;
  }
}

.section-host_color-blob {
  right: 0;
  top: -120px;
  width: 250px;
  height: 200px;
  overflow: hidden;
}

.section-host_color-blob > .blob {
  left: 60%;
  transform: scaleX(-1);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-host_color-blob {
    right: auto;
    left: calc(50% - (var(--area-max-width) / 2) - 100px);
    top: 50%;
  }
  
  .section-host_color-blob > .blob {
    left: auto;
  }
}

.section-archives_blob {
  position: relative;
  width: 50%;
  min-width: 250px;
  max-width: 500px;
  margin-bottom: 50px;
  justify-self: center;
}

.section-archives_blob-2 {
  position: relative;
  width: 50%;
  max-width: 300px;
  margin-top: 20px;
  margin-bottom: -50px;
  margin-left: -15px;
  transform: scaleX(-1);
}

@media screen and (min-width: 400px) {
  .section-archives_blob-2 {
    margin-left: -30px;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-archives_blob-2 {
    display: none;
  }
}

.section-archives_color-blob-1 {
  right: 0;
  width: clamp(180px, 32.5vw, 400px);
  height: clamp(180px, 32.5vw, 400px);
  overflow: hidden;
}

.section-archives_color-blob-1 > .blob {
  left: 0;
  width: 200%;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-archives_color-blob-1 {
    top: -250px;
    right: 0;
    left: 10%;
    width: auto;
    height: 500%;
    transform: none;
  }
  .section-archives_color-blob-1 > .blob {
    width: 200%;
  }
  .section-archives_color-blob-1 > .blob path {
    fill: #ffedde !important;
  }
}

.section-archives_color-blob-2 {
  left: 0;
  width: clamp(110px, 32.5vw, 300px);
  height: clamp(110px, 32.5vw, 300px);
  overflow: hidden;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-archives_color-blob-2 {
    display: none;
  }
}

.section-archives_color-blob-2 > .blob {
  right: 0;
  width: 160%;
}

.section-archives_color-blob-3 {
  right: 0;
  bottom: 0;
  width: clamp(200px, 60%, 500px);
  height: clamp(150px, 37.5vw, 400px);
  overflow: hidden;
  transform: translateY(40%);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-archives_color-blob-3 {
    display: none;
  }
}

.section-archives_color-blob-3 > .blob {
  left: 0;
  width: 160%;
}

.section-resources_blob {
  position: relative;
  top: -50px;
  left: -100px;
}

.section-resources_form {
  display: grid;
  grid-row-gap: 24px;
}

.section-agenda {
  padding-bottom: 80px;
}

.section-agenda_blob-1 {
  display: none;
  top: 0;
  left: calc(50% + (var(--area-max-width) / 2));
  transform: translateX(-75%);
  width: 369px;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-agenda_blob-1 {
    display: block;
  }
}

.section-agenda_color-blob {
  display: none;
  top: 20%;
  left: calc(50% + (var(--area-max-width) / 2) - 300px);
  width: 300px;
  height: 300px;
  overflow: hidden;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-agenda_color-blob {
    display: block;
  }
}

.section-ambassadors {
  grid-template-areas: "header" "lead" "." "ambassadors";
  grid-template-rows: max-content max-content 50px max-content;
  padding-top: 50px;
}

.section-ambassadors_blob-1 {
  width: 240px;
  transform: translate(-20%, -100%);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_blob-1 {
    width: 405px;
    top: 0;
    left: calc(50% - (var(--area-max-width) / 2));
    transform: translate(-50%, -100%);
  }
}

.section-ambassadors_blob-2 {
  display: none;
  width: 363px;
  top: 50%;
  left: calc(50% + (var(--area-max-width) / 2));
  transform: translateX(-50%);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_blob-2 {
    display: block;
  }
}

.section-ambassadors_blob-3 {
  top: -220px;
  right: 0;
  width: 220px;
  height: 220px;
  overflow: hidden;
}

.section-ambassadors_blob-3 > .blob {
  right: -40px;
  width: 280px;
  height: auto;
  max-width: 100%;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_blob-3 {
    display: none;
  }
}

.section-ambassadors_color-blob-1 {
  display: none;
  top: 50%;
  left: 0;
  right: calc(50% + (var(--area-max-width) / 2) - 220px);
  height: 750px;
  overflow: hidden;
  transform: translateY(-50%);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_color-blob-1 {
    display: block;
  }
}

.section-ambassadors_color-blob-1 > .blob {
  right: 0;
  width: 550px;
}

.section-ambassadors_color-blob-2 {
  top: 0;
  left: 40%;
  width: clamp(150px, 28vw, 350px);
  height: clamp(100px, 28vw, 200px);
  transform: translateY(-75%) skewX(-20deg);
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_color-blob-2 {
    display: none;
  }
}

.section-ambassadors_color-blob-3 {
  display: none;
  top: -200px;
  right: 0;
  left: calc(50% + (var(--area-max-width) / 2) - 400px);
  height: 650px;
  overflow: hidden;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-ambassadors_color-blob-3 {
    display: block;
  }
}

.section-ambassadors_color-blob-3 > .blob {
  width: 700px;
}

.section-ambassadors_header {
  grid-area: header;
}

.section-ambassadors_lead {
  grid-area: lead;
}

.section-ambassadors_ambassadors {
  display: grid;
  grid-area: ambassadors;
  grid-gap: 50px;
}

.section-press {
  grid-template-areas: "header"
                       "lead"
                       "."
                       "button"
                       "."
                       "list"
                       "."
                       "more";
  grid-template-rows: max-content
                      max-content
                      20px
                      max-content
                      50px
                      max-content
                      40px
                      max-content;
}

.section-press_header {
  grid-area: header;
}

.section-press_lead {
  grid-area: lead;
}

.section-press_button {
  grid-area: button;
  align-self: center;
}

.section-press_list {
  display: grid;
  grid-area: list;
  grid-row-gap: 50px;
}

.section-press_more {
  grid-area: more;
  align-self: center;
}

.section-press_more .button {
  width: 100%;
}

.section-accessibility {
  grid-template-areas: "quote"
                       "colorBlob1"
                       "colorBlob2"
                       "colorBlob3"
                       "header"
                       "lead";
  grid-template-rows: max-content 127px max-content max-content;
}

.section-accessibility_header {
  grid-area: header;
}

.section-accessibility_logo {
  display: block;
  width: 87px;
  margin-bottom: 20px;
}

.section-accessibility_lead {
  grid-area: lead;
}

.section-accessibility_quote {
  grid-area: quote;
  background-color: var(--background-color);
}

.section-accessibility_quote-blob {
  width: 360px;
  transform: translate(-20px, -100px) rotate(-80deg);
}

.section-accessibility_blob {
  display: block;
  position: relative;
  margin: 50px 0 0;
  width: 293px;
}

.section-accessibility_color-blob-1 {
  grid-area: colorBlob1;
  right: 0;
  width: clamp(200px, 40vw, 400px);
  height: clamp(170px, 35vw, 350px);
  transform: translateY(40%);
}


.section-policy{
  grid-template-columns:  1fr !important;
}

.section-policy ol ul li{
  list-style-type: disc !important;
}

.section-policy p,
.section-policy ol,
.section-policy ul{
  font-size: clamp(18px,4.31vw,26px);
  font-weight: 700;
}

@media( max-width: 767px ){

  .section-policy p,
  .section-policy ol,
  .section-policy ul{
    font-weight: 400;
  }

}

@media screen and (min-width: 580px) {
  .section-accessibility_color-blob-1 {
    transform: translateY(-40%);
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-accessibility_color-blob-1 {
    right: auto;
    left: calc(50% - (var(--area-max-width) / 2));
    transform: translate(-50%, 0);
    width: 600px;
    height: 600px;
  }

  .section-accessibility_color-blob-1 path {
    fill: #ff4e00 !important;
  }
}

.section-accessibility_color-blob-2 {
  grid-area: colorBlob2;
  right: 0;
  left: 20%;
  height: 400px;
  transform: translateY(60%);
}

.section-accessibility_color-blob-2 > .blob {
  left: 50%;
  width: 400px;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-accessibility_color-blob-2 {
    right: auto;
    left: calc(50% + (var(--area-max-width) / 2));
  }
}

.section-accessibility_color-blob-3 {
  grid-area: colorBlob2;
  left: 60%;
  width: 150px;
  height: 200px;
  transform: translateY(300%);
}


.journal-space-list{

}

.journal-space-list li{
  font-size: 22px;
  font-weight: bold;
  list-style-type: initial;
  margin: 20px 0px;
}


/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-accessibility_color-blob-3 {
    bottom: -570px;
    left: 50%;
    width: 700px;
    height: 600px;
    transform: translateX(-40%) rotate(180deg);
  }

  .section-accessibility_color-blob-3 path {
    fill: #3eb77b !important;
  }
}

.section-contact {
  grid-row-gap: 24px;
}

.section-contact_message {
  height: 317px;
}

.section-footer {
  grid-gap: 50px;
}

.pattern-blob-1 {
  top: -150px;
  left: 50%;
  width: 370px;
  transform: translateX(-50%);
}

.photo-blob-1 {
  top: -10px;
  left: 50%;
  width: 43vw;
  max-width: 200px;
  transform: translateX(-120%);
}

.bnc-guide .photo-blob-1{
  top: 250px;
  left: calc(45% + (var(--area-max-width) / 2) - 100px);
}

.section-masthead__bnc .photo-blob-1 {
  display: none;
}

.photo-blob-2 {
  position: absolute;
  top: -35vw;
  right: -20px;
  width: 50vw;
  max-width: 304px;
  height: 50vw;
  max-height: 304px;
  overflow: hidden;
}

.bnc-guide .photo-blob-2{
  left: calc(53% + (var(--area-max-width) / 2));
}

.photo-blob-2 > .blob {
  width: 100%;
  max-width: 304px;
}

.photo-blob-faq {
  display: none;
  top: 80px;
  left: calc(50% + (var(--area-max-width) / 2) + 50px);
  width: 514px;
  transform: translateX(-100%);
}

.color-blob-1 {
  display: none;
  top: 110px;
  left: calc(50% + (var(--area-max-width) / 2) - 250px);
  width: 33vw;
  max-width: 300px;
  transform: translateX(-100%) rotate(180deg);
}

.section-masthead__bnc .color-blob-1 {
  top: 180px;
  left: calc(50% + (var(--area-max-width) / 2) - 300px);
}

.bnc-guide .section-masthead__bnc .color-blob-1{
  top: 205px;
  left: calc(53% + (var(--area-max-width) / 2) - 300px);
  transform: translateX(-80%) rotate(0deg);
  max-width: 300px;
}

.color-blob-3 {
  position: absolute;
  top: 50%;
  left: 65%;
  width: 44vw;
  max-width: 280px;
  transform: translateY(-50%);
  z-index: -1;
}

@media screen and (min-width: 321px) {
  .color-blob-3 {
    right: 50%;
    left: auto;
    transform: translateY(-68%);
  }
}

@media screen and (min-width: 580px) {
  .timer_part {
    grid-gap: 18px;
  }
  .timer_label {
    font-size: 16px;
  }
  .timer-lockup_header {
    max-width: 35rem;
    margin-bottom: 12px;
    font-size: 20px;
  }
  .input-header-label {
    margin-bottom: 9px;
    margin-left: var(--control-padding-horizontal);
    font-size: 16px;
    font-weight: 700;
  }
  .photo-blob-2 {
    top: -200px;
    right: 0;
  }
}

@media screen and (min-width: 700px) {
  .color-blob-1 {
    display: block;
  }

  .color-blob-3 {
    top: 0;
    right: -170%;
    transform: none;
  }

  .section-masthead__bnc .photo-blob-2 {
    top: 90px;
  }
}

@media screen and (min-width: 780px) {
  .section-ambassadors_ambassadors {
    grid-template-columns: 1fr 1fr;
  }

  .section-press_list {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 50px;
  }

  .section-footer {
    grid-auto-flow: column;
    align-items: center;
  }

  .section-footer_copyright {
    justify-self: end;
  }

  .photo-blob-2 {
    top: -50px;
  }
}

@media screen and (max-width: 1133px) {
  .press-item_source {
    color: var(--color-almost-black-60);
  }
  .press-item_title {
    font-size: 18px;
  }
  .press-item_link, .press-item_link:active, .press-item_link:link, .press-item_link:visited {
    color: #fcae00;
  }
  .press-item_link:hover, .press-item_link:focus {
    color: var(--link-hover);
  }
  .section-top-bar_updates {
    display: none;
  }
  .section-about_pattern-blob {
    display: none;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  /* Base */
  html {
    font-size: 14px;
  }
  /* Components */
  .button, .button:active, .button:link, .button:visited,
  .sdm_download, .sdm_download:active, .sdm_download:link, .sdm_download:visited {
    padding: 0 18px;
  }
  .button__large,
  .sdm_download {
    width: 300px;
  }
  .tagline {
    font-size: 26px;
    font-weight: 700;
  }

  .quote {
    max-width: 220px;
    color: var(--text-color);
  }

  .quote_text {
    font-size: 38px;
    line-height: 1;
  }

  .quote_author {
    color: var(--text-color);
    font-weight: 700;
    text-align: right;
  }

  .agenda {
    width: 70%;
  }
  .agenda_header {
    grid-template-columns: 17px 17px max-content 55px 17px;
    margin-left: -34px;
  }
  .agenda_header-text {
    font-size: 26px;
    font-weight: 700;
  }
  .agenda_header-text-up {
    font-size: 16px;
    line-height: 1.6;
    vertical-align: top;
  }
  .agenda-item {
    position: relative;
    grid-template-areas: "et . header header header"
                         "pt . header header header"
                         ". . avatar . speaker"
                         ". . . . ."
                         ". . . . description";
    grid-template-columns: 184px 30px max-content 10px 1fr;
    grid-template-rows: max-content 1fr max-content 7px max-content;
    grid-column-gap: 0;
    grid-row-gap: 0;
    margin-top: 20px;
    padding-bottom: 23px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
  }
  .agenda-item_header {
    font-size: 38px;
  }
  .agenda-item_header::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    margin-left: -19px;
    background-color: rgba(255, 255, 255, 0.3);
  }
  .agenda-item_speaker {
    align-self: center;
  }
  .agenda-item_speaker-avatar {
    width: 40px;
    height: 40px;
  }
  .agenda-item_time {
    align-self: end;    
    font-size: 16px;
    text-align: right;
  }
  .agenda-item_time__pt {
    align-self: start;
    margin-top: 0;
  }

  .ambassador-item {
    grid-template-areas: "avatar"
                         "name"
                         "title"
                         "description";
    grid-template-columns: 1fr;
    grid-column-gap: 0;
    grid-row-gap: 0;
    width: 193px;
  }

  .ambassador-item_photo {
    width: 193px;
    height: 193px;
  }

  .ambassador-item_name {
    margin-top: 17px;
    margin-bottom: 5px;
    font-size: 18px;
  }

  .ambassador-item_title {
    color: var(--header-color);
    font-weight: 700;
  }

  .ambassador-item_pronoun {
    font-weight: 600;
  }

  .ambassador-item_description {
    margin-top: 10px;
  }

  .press-item {
    grid-template-areas: "source source" ". ." "photo title" "photo ." "photo link";
    grid-template-columns: 200px 1fr;
    grid-template-rows: max-content 10px max-content 20px 1fr;
    grid-column-gap: 12px;
  }

  .press-item_source {
    font-size: 18px;
    font-weight: 700;
  }

  .press-item_title {
    grid-area: title;
  }

  .press-item_photo {
    width: 200px;
    height: 143px;
  }

  .copyright {
    font-size: 13px;
    color: var(--text-color);
  }

  /* Blobs */
  .section-masthead_date.area_blob-anchor {
    position: static;
  }

  .photo-blob-1 {
    top: 250px;
    left: calc(50% + (var(--area-max-width) / 2) - 100px);
  }

  .section-masthead__bnc .photo-blob-1 {
    display: block;
    top: 350px;
  }

  .bnc-guide .section-masthead__bnc .photo-blob-1 {
    top: 315px;
    left: calc(87.5% + (var(--area-max-width) / 2) - 100px);                        
  }

  .photo-blob-2 {
    position: absolute;
    top: -50px;
    left: calc(50% + (var(--area-max-width) / 2));
    transform: translateX(-100%);
  }

  .photo-blob-2 > .blob {
    right: 0;
  }

  .photo-blob-faq {
    display: block;
  }

  /* Layout */
  .section-top-bar {
    grid-template-areas: "m4bl hashtag . updates .";
    /* 50px = menu */
    grid-template-columns: 122px max-content 1fr 410px 50px;
    align-items: start;
	}
	

  .section-masthead {
    grid-template-areas: "logo logo logo logo logo . . . . ." ". . . . . . . . . ." "date . tagline . . . . . . ." ". . . . . . . . . ." "timer timer timer timer . updates updates . playlist playlist";
    grid-template-columns: max-content 18px 225px max-content max-content 66px 160px 1fr max-content max-content;
    grid-template-rows: max-content 92px max-content 124px max-content;
    grid-gap: 0;
    align-items: start;
    padding-bottom: 0;
  }
  .section-masthead__bnc {
    grid-template-areas: "logo logo logo logo logo . . . . ."
                         "logo logo logo logo logo . streaming streaming streaming ."
                         ". . . . . . . . . ."
                         "date date date . . . . . . ."
                         ". . . . . . . . . ."
                         "time . tagline . . . . . . ."
                         ". . . . . . . . . ."
                         "timer timer timer timer . updates updates . playlist playlist";
    grid-template-rows: 13px max-content 92px max-content 28px max-content 124px max-content;
	}

	.section-masthead__homepage {
    grid-template-areas:
		". . . . . . . . . ."
		"restream restream restream restream restream restream restream restream restream restream"
		". . . . . . . . . ."
		". . . . . . . . . ."
		". . . . . . . . . ."
		"tagline . . . . updates updates . playlist playlist";
    grid-template-rows: 13px max-content 30px max-content max-content max-content max-content 60px max-content;
    padding-left: 42px;
    padding-right: 42px;
    max-width: 1220px !important;
    width: 100% !important;
    margin: auto !important;                      
  }

	.section-masthead__roadtobn {
    grid-template-areas:
        "logo"
        "."
        "tagline"
        "."
        "date"
        "."
        "timer"
        "."
        "updates"
        "."
        "playlist";
		grid-template-rows: none;
		grid-template-columns: none;
    grid-gap: 0;
    align-items: start;
    padding-bottom: 20px;
	}	
	
  .day-of-state .section-masthead__bnc {
    grid-template-areas:
      "logo logo logo logo logo . . . . ."
      "logo logo logo logo logo . streaming streaming streaming streaming"
      ". . . . . . . . . ."
      "date date date . . . . . . ."
      "restream restream restream restream restream restream restream restream restream restream"
      "time . . . . . . . . ."
      "tagline . . . . . . . . ."
      ". . . . . . . . . ."
      "timer . . . . updates updates . playlist playlist";
    grid-template-rows: 13px max-content 30px max-content max-content max-content max-content 60px max-content;
    padding-left: 42px;
    padding-right: 42px;
    max-width: 1220px !important;
    width: 100% !important;
    margin: auto !important;                      
  }
  .bnc-guide .section-masthead__bnc{
    grid-template-rows: 13px max-content 92px max-content 28px max-content 0px max-content;
  }
  .section-masthead_logo {
    width: 512px;
    padding-right: 105px;
  }
  .day-of-state .section-masthead_logo{
    padding-right: 275px;
  }
  .section-masthead_logo .lead{
    font-size: 22px;
    margin-top: 20px;
  }
  .section-masthead_tagline {
    max-width: 225px;
  }

  .day-of-state .section-masthead_restream{
    grid-area: restream;
  }
	.section-masthead_restream{
    grid-area: restream;
  }

  .section-about {
    grid-template-areas: "header lead" "header ." "header text";
    grid-template-rows: max-content 20px max-content;
  }
  .section-about_blob {
    display: none;
  }

  .section-faqs_list {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
  }

  .section-resources_blob {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-110%);
  }
  .section-archives_blob {
    position: absolute;
    top: -80px;
    right: calc(50% + (var(--area-max-width) / 2));
    transform: translateX(100%);
    margin-bottom: 0;
  }
  .section-resources_form {
    grid-auto-flow: column;
    grid-column-gap: 17px;
  }
  .section-agenda {
    grid-auto-rows: max-content;
    grid-template-columns: none;
    min-height: 500px;
    padding-bottom: 0;
  }
  .section-ambassadors {
    padding-top: 0;
  }
  .section-ambassadors_ambassadors {
    justify-content: space-between;
    grid-template-columns: repeat(3, 193px);
    grid-column: 1 / 3;
    width: 80%;
  }

  .section-press {
    grid-template-areas: "header ."
                         "lead button"
                         ". ."
                         "list list"
                         ". ."
                         "more more";
    grid-template-rows: max-content
                        max-content
                        50px
                        max-content
                        50px
                        max-content;
  }

  .section-press_list {
    justify-content: space-between;
    grid-template-columns: 1fr 1fr;
    grid-column: 1 / 3;
    grid-column-gap: 20px;
  }

  .section-press_more {
    justify-self: center;
    width: 300px;
  }

  .section-accessibility {
    grid-template-areas: "quote header"
                         "quote lead";
    grid-template-rows: max-content 1fr;
    padding-bottom: 150px;
  }

  .section-accessibility_header {
    position: relative;
    grid-area: header;
  }

  .section-accessibility_logo {
    position: absolute;
    left: -110px;
    width: 87px;
  }

  .section-accessibility_lead {
    grid-area: lead;
  }

  .section-accessibility_quote {
    grid-area: quote;
    margin-left: 63px;
  }

  .section-accessibility_quote-blob {
    width: 502px;
    left: 50%;
    transform: translate(calc(-100% - 100px), -100px);
  }

  .section-accessibility_blob {
    position: absolute;
    margin-top: 20px;
    right: 0;
    left: auto;
  }

  .section-contact {
    grid-template-areas: "header email subject subject" "header message message message" ". . . ."  ". . .  send";
    grid-template-columns: 420px 192px 1fr max-content;
    grid-template-rows: max-content 130px max-content;
    grid-column-gap: 17px;
    grid-row-gap: 21px;
  }

  .section-contact_header {
    grid-area: header;
  }

  .section-contact_email {
    grid-area: email;
  }

  .section-contact_subject {
    grid-area: subject;
  }

  .section-contact_message {
    grid-area: message;
    height: 100%;
  }

  .section-contact_send {
    grid-area: send;
  }
  .section-contact_legal {
    grid-column: 2 / 5;
    grid-row: 3;
  }
}

@media screen and (min-width: 1300px) {
  .section-top-bar {
    grid-template-areas: "m4bl hashtag . updates";
    grid-template-columns: 122px max-content 1fr 410px;
  }
}

/* 1218px = 1050px + (42px * 4) */
@media screen and (min-width: 1220px) {
  .section-footer_social-media-links {
    position: fixed;
    top: 50vh;
    left: calc(50vw + (var(--area-max-width) / 2) + 42px);
    transform: translateY(-50%);
  }
  .social-media-links {
    display: inline-grid;
    grid-auto-flow: row;
    grid-auto-rows: max-content;
    grid-gap: 50px;
    justify-items: center;
    width: auto;
  }
}

/*
 * Hide visually and from screen readers
 */

.u-hidden, [hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.u-sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .sr-only class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.sr-only.focusable:active, .sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

.u-text-color-almost-black {
  color: #080b12;
}

.u-text-color-light-aquamarine {
  color: #70f9d2;
}

.u-text-color-dark {
  color: #242c40;
}

.u-text-color-yellow-orange {
  color: #fcae00;
}

.u-text-color-white {
  color: #ffffff;
}

.u-text-color-peach-cream {
  color: #ffedde;
}

.u-text-color-vivid-purple {
  color: #7c00ff;
}

.u-text-color-strawberry {
  color: #f8274a;
}

.u-text-color-turquoise-blue {
  color: #05bddb;
}

.u-text-color-blood-orange {
  color: #ff4e00;
}

.u-text-color-dark-seafoam-green {
  color: #3eb77b;
}

.u-text-color-algae-green {
  color: #1ed761;
}

.u-font-weight-400 {
  font-weight: 400;
}

.u-font-weight-500 {
  font-weight: 500;
}

.u-font-weight-600 {
  font-weight: 600;
}

.u-font-weight-700 {
  font-weight: 700;
}

.u-font-weight-900 {
  font-weight: 900;
}

/* .blob,
.section-about {
  display: none !important;
} */

main{
  position: relative;
  z-index: 2;
}

.passster-form{
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    height: calc( 100% );
    background: #EEE;
    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-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.passster-form .password-form{
  width: 95% !important;
  max-width: 860px !important;
  margin: auto;
}



.passster-form input[type=password]::-webkit-input-placeholder { /* Edge */
  color: #FFF;
  opacity: 1;
}

.passster-form input[type=password]:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #FFF;
  opacity: 1;
}

.passster-form input[type=password]::placeholder {
  color: #FFF;
  opacity: 1;
}

a.input{
  cursor: pointer;
  text-align: center;
  line-height: 50px;
  color: #FFF;
  text-decoration: none !important;
}

/* Change Press Article Image to Handle Dynamics */
.press-item_photo{
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 100% 15%;
}

/* GTC Gallery Template Styles */

.section-masthead_title {
  grid-area: date;
  max-width: 700px;
}

.title {
  display: grid;
  grid-auto-columns: max-content;
  grid-gap: 5px;
  justify-content: end;
}

.title__small{
  font-size: clamp(14px, 1.5vw, 20px);
}

.title__bnc {
  grid-auto-flow: row;
  font-size: 76px;
  font-size: clamp(44px, 8.8vw, 76px);
  font-weight: 900;
  line-height: .97;
}

.gtc-gallery-content{
  padding-top: 0px !important;
}

@media(max-width: 767px){

  section.page{
    position: relative;
    z-index: 10;
  }

  header.section-masthead__bnc{
    margin-bottom: -90px;
  }

  .gtc-gallery-content{
    padding: 0px 5% 90px 5% !important;
  }

}

.gallery__filter-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 30px;
}

.gallery__filter-select{
    display: block;
    height: 50px;
    padding: 0 35px;
    border: none;
    border-radius: 50px;
    background: var(--button-background-color);
    color: var(--button-text-color);
    font-size: var(--button-font-size);
    line-height: 50px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: 0 0 0 4px var(--button-border-color) inset;
    letter-spacing: 0px;
    background-image: none;
    border-right: 10px solid var(--button-border-color);
    -webkit-appearance: none;
}

@media(max-width: 767px){

  .gallery__filter-select{
    padding: 0px 20px;
  }

}

.gallery__filter{
  cursor: pointer;
  font-weight: 700;
  color: var(--button-text-color);
}

.gtc-gallery{
  color: var(--text-color);
}

.gt3pg-isotope-gallery.gallery-masonry{
  padding-bottom: 30px;
}

.gtc-gallery-content{
  max-width: 1260px;
  margin: auto;
  width: 100%;
  padding: 90px 0px;
}

.gtc-gallery-content .img-wrapper{
  background-color: #242c40;
}

.gt3-photo-gallery-pro--isotope_gallery .hover-default .mfp-iframe .img-wrapper:after{
  opacity: 1;
}

.gt3-photo-gallery-pro--isotope_gallery .youtube .img-wrapper:before{
  opacity: .3;
}

.color-blob-internal{
  right: 0;
}

.photo-blob-internal-1{
  left: 0;
  top: 150%;
  max-width: 340px;
  height: auto;
  width: 100%;
}

/* Share Module */

#social-share-button svg{
  height: 50px;
  margin-bottom: -15px;
}

.social-share-wrapper{
  display: none;
  position: absolute;
  left: -150px;
  padding: 30px;
  background: #FFF;
}

.social-share-wrapper.active{
  display: block;
}

.social-share-wrapper .ssbp-wrap .ssbp-list{
  display: flex;
  flex-direction: column;
}

.blacknovember h2 {
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 60px);
}

.blacknovember .section-fullwidth {
	grid-template-columns: 1fr;
	grid-row-gap: 40px;
}

.blacknovember .area__first {
	grid-row-gap: 0;
}

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

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

.blacknovember .black-november-roundup-wrapper ul {
	padding-left: 40px;
}

.blacknovember {word-break:break-word;hyphens:auto}

.blacknovember .black-november-roundup-wrapper ul,.blacknovember .roundup ul,.blacknovember ul{margin-left:0}.blacknovember .first-list,.blacknovember .roundup ul.first-list{border-right:1px solid #fff}.blacknovember .roundup li{list-style:none;margin-bottom:15px}.blacknovember .black-november-roundup-wrapper ul li{list-style:none;margin-bottom:15px;display:flex;flex-direction:row;align-items:center}.blacknovember .black-november-roundup-wrapper ul li .member-name{margin-right:15px;max-width:80%}.blacknovember .black-november-roundup-wrapper ul li .member-social{display:flex;flex-direction:row;align-items:center;min-width:70px;justify-content:center}.blacknovember .black-november-roundup-wrapper ul li .member-social img{max-width: 20px; margin-right:5px;padding-right:5px;border-right:1px solid #fff}.blacknovember .black-november-roundup-wrapper ul li .member-social a:last-of-type img{border-right:none}@media screen and (max-width:640px){.blacknovember ul li{padding-left:0}.blacknovember .first-list{border-right:0}}


.blacknovember .section-ambassadors_color-blob-1 {
  display: none;
  top: 50%;
  right: 0;
  left: calc(50% + (var(--area-max-width) / 2) - 220px);
  height: 750px;
  overflow: hidden;
  transform: translateY(-50%)  rotate(180deg);
}

.blacknovember .section-about_pattern-blob {
	left: auto;
	right: calc(50% - (var(--area-max-width) / 1));
	top: -70px;
}
.blacknovember .bn-polls-img {
	position: relative;
	left: 0;
	max-width: 100%;
	width: 100%;	
}

.mobile-form .button {
	background: #fff;
	box-shadow: 0 0 0 4px #fff inset;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .blacknovember .section-ambassadors_color-blob-1 {
    display: block;
	}
	.blacknovember .section-about_pattern-blob {
		left: auto;
		right: calc(50% - (var(--area-max-width) / 1));
	}
	.blacknovember .bn-polls-img {
		position: absolute;
		max-width: 600px;
	}
	.mobile-form {
		display: none;
	}
			
}

@media screen and (max-width: 1133px) {
	.mobile-form {
		display: flex;
		margin-bottom: 25px;
	}

	.section-top-bar_updates.mobile-form .label-input_label.smaller {
    font-size: 16px;
		padding-top: 4px;
	}
}



.blacknovember .section-ambassadors_color-blob-1 > .blob {
  right: 0;
  width: 550px;
}

.blacknovember ul.show-list {
	margin-bottom: 20px;
}

.blacknovember ul.show-list li {
	list-style-type: disc;
	margin-left: 30px;
	margin-bottom: 14px;
}

.section-masthead__bnc.area_blob-anchor {
	width: 100%;
	overflow: hidden;
}


.bn-hash {
	margin-top: 25px;
}

.homepage .section-top-bar_hashtag {
	padding-bottom: 20px;
}

.homepage .tagline {
	display: block;
}

.homepage .section-intro h2,
.homepage .section-blm h2,
.homepage .section-end h2 {
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 50px);	
	line-height: 4vw;
}

.homepage .area {
}

.homepage .ylw-txt {
	color: #fcae01;
}


.section-uprecedented_blob2 {
	width: 500px;
	position: relative;
}

.homepage .section-blm {
	display: grid;
}

.section-unprecedented {
	display: grid;
	grid-template-rows: max-content max-content;
}


.section-uprecedented_blob2 img {
	width: 100%;
	top: 0;
	right: -240px;
}

.section-intro_header {
  grid-area: header;
}

.section-intro_header-quote {
  grid-area: quote;
}

.homepage .section-intro .section-intro_header-quote h2 {
	background-color: #fcae01;
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 70px);	
	padding: 15px 30px;
	display: inline-block;
}

.section-intro_header-end {
  grid-area: headerend;
}

.section-intro_lead {
	grid-area: lead;
	margin-top: -60px;
}

.section-intro_blob {
  grid-area: blob;
  width: 70%;
  max-width: 450px;
  justify-self: center;
  padding: 30px 0;
}

.section-intro_pattern-blob {
  top: 150px;
  left: calc(50% - (var(--area-max-width) / 2));
  transform: translateX(-50%);
}


.section-intro_color-blob-1 {
  grid-area: colorBlob1;
  right: -20px;
  width: clamp(220px, 37.5vw, 400px);
  height: clamp(220px, 37.5vw, 400px);
  overflow: hidden;
  transform: translateY(-100%);
}

.section-intro_color-blob-1 > .blob {
  width: 200%;
}

.homepage .section-intro_pattern-blob {
  top: 150px;
  left: calc(50% - (var(--area-max-width) / 1.5));
  transform: translateX(-50%);
}

.homepage .section-intro_pattern-blob-2 {
	top: 0;
	right: calc(50% - (var(--area-max-width) / 1));
	transform: translateX(-50%);
}

.homepage .section-intro_pattern-blob-3 {
	top: 0;
	right: calc(50% - (var(--area-max-width) / 1));
	transform: translateX(-50%);
	max-width: 460px;
}

.homepage .section-intro_color-blob-1 {
	width: clamp(220px, 37.5vw, 400px);
	height: clamp(220px, 37.5vw, 400px);
	overflow: hidden;
	transform: translateY(-100%);
	left: auto;
}




.ylw-bg-txt {
	background-color: #fcae01;
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 70px);
	padding: 15px 30px;
	display: inline-block;	
}


/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-blm_color-blob {
    display: block;
  }
}

.section-blm_blob-1 {
  display: none;
  top: 0;
  left: calc(50% + (var(--area-max-width) / 2));
  transform: translateX(-75%);
  width: 369px;
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-blm_blob-1 {
    display: block;
  }
}


@media screen and (min-width: 400px) {
  .section-intro_color-blob-1 {
    right: -42px;
  }
}

/* 1134px = 1050px + 42px + 42px */
@media screen and (min-width: 1134px) {
  .section-intro_color-blob-1 {
    top: -100px;
    right: 0;
    left: calc(50% + (var(--area-max-width) / 2) - 50px);
    width: auto;
    height: 750px;
    transform: none;
  }
  .section-intro_color-blob-1 > .blob {
    width: 550px;
  }
}


.vision-signup {
	width: 100%;
	background: #262626;
	color: #fff;
	padding: 40px 0;
	position: relative;
	overflow: hidden;
}

.vision-signup .form-bg {
	position: absolute;
	top: 0;
	max-width: 500px;
}
.vision-signup .bg-left {
	bottom: -50px;
	top: auto;
}

.vision-signup .bg-right {
	right: -100px;
}

.vision-signup .vision-title h2 {
	color: #fff;
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 45px);
	text-align: center;
	
}

.vision-signup div.wpforms-container-full .wpforms-form button[type=submit] {
	max-width: 400px;
	display: inherit;
}

.vision-signup .vision-title .ylw-bg-txt {
	color: #000;
	font-size: 21px;
	font-size: clamp(21px, 5.21vw, 45px);
}

.vision-signup .form {
	margin: 25px auto 0;
	width: 100%;
	max-width: 1080px;
	position: relative;
}

@media screen and (max-width: 1134px) {
	.vision-signup .form-bg {
		display: none;
	}
}

@media screen and (max-width: 728px) {
	.blob, .section-intro_lead.lead {
		display: none;
	}
	.homepage .section-intro h2,
	.homepage .section-blm h2,
	.homepage .section-end h2 {
		line-height: 7vw;
		margin-bottom: 0;
	}
	.homepage .section-intro .section-intro_header-quote h2 {
		padding: 2px 10px;
	}
	
}


@media screen and (min-width: 1025px) {
	.section-unprecedented {
		grid-template-areas: "blob1 . . txt-1"
		". . . ."
													". . . blobb2";
		grid-template-columns: 1fr 0 0 1fr;
		grid-template-rows: max-content max-content;
	}
	.photo-blob-unprecedented {
		grid-area: blob1;
		position: relative;
	}
	.section-unprecedented_text {
		grid-area: txt-1;
	}
	.section-uprecedented_blob2 {
		grid-area: blobb2;
		width: 500px;
		position: relative;
	}
	
	.homepage .section-blm {
		grid-template-areas: "header header . . ."
												 ". . . . ."
												 "text . . . lead"
												 "blmblob . . . ."
												 ". . . header2 header2";
		grid-template-rows: max-content max-content max-content 50px max-content;
		grid-template-columns: 0.8fr 0 0 0 0.6fr;
	}
	
	.homepage .section-blm .header-two {
		grid-area: header2;
	}
	
	.homepage .section-blm .section-blm-blob {
		grid-area: blmblob;
		position: relative;
	}
	
	.homepage .section-blm .section-blm-blob img {
		width: 52vw;
		left: -200px;
		top: 0;
	}
	
	.section-blm_color-blob {
		display: none;
		top: 20%;
		left: calc(50% + (var(--area-max-width) / 2) - 300px);
		width: 300px;
		height: 300px;
		overflow: hidden;
	}
	
	.homepage .section-intro {
		grid-template-areas: "header header header header ."
													"quote quote quote quote quote"
												 "headerend headerend headerend headerend ."
												 ". . . . ."
												 "text . . . lead"
												 "colorBlob2 . . . .";
		grid-template-rows: max-content max-content max-content 50px max-content;
		grid-template-columns: 1fr 0 0 0 0.6fr;
	}
	

	} /* end of media */

	.homepage .section-intro { 
		display: grid;
	}
	
	@media screen and (max-width: 1024px) {
		.vision-signup .vision-title h2 {
			line-height: 1.6em;
		}
		.section-unprecedented_text {
			width: 80vw;
		}
		.photo-blob-unprecedented img {
			display: none;
		}
		.homepage .section-intro,
		.section-unprecedented {
			width: 100vw;
		}
		.vision-signup {
			padding: 0 20px;
		}
		.section-about_text,
		.section-intro_header-end,
		.section-intro_header,
		.section-intro_header-quote,
		.section-intro_lead {
			grid-area: inherit;
		}
		.section-intro_lead {
			margin-top: auto;
		}
		.section-uprecedented_blob2 img {
			width: 100%;
			position: relative;
			top: auto;
			right: auto;
		}
		.ylw-bg-txt {
			padding: 0px 10px;
			line-height: 1.2em;
		}
		.homepage .section-intro h2, .homepage .section-blm h2, .homepage .section-end h2 {
			margin-bottom: 0;
		}
	}
	
.election-card button {
	display: block;
    height: 50px;
    padding: 0 35px;
    border: none;
    border-radius: 50px;
    background: var(--button-background-color);
    color: var(--button-text-color);
    font-size: var(--button-font-size);
    line-height: 50px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    box-shadow: 0 0 0 4px var(--button-border-color) inset;
}

.election-card .election-text {
	margin-bottom: 25px;
}

.election-card a {
	text-decoration: none;
	float: right;
}