@font-face {
  font-family: LatoThin;
  src: url(/resources/fonts/Lato-Thin.ttf);
}
@font-face {
  font-family: LatoRegular;
  src: url(/resources/fonts/Lato-Regular.ttf);
}

h1 {
  font-family: LatoThin;
  margin-top: 10px;
}
h2 {
  font-family: LatoThin;
}
h3 {
  font-family: LatoThin;
}
h4 {
  font-family: LatoThin;
}
h5 {
  font-family: LatoThin;
}
h6 {
  font-family: LatoThin;
}
a {
  font-family: LatoRegular;
}
p {
  font-family: LatoRegular;
}
.vimeo-wrapper {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   pointer-events: none;
   overflow: hidden;
}
.vimeo-wrapper iframe {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
}
.intro-header {
  background-color: transparent;
}
.intro-header > .container {
  width: 100%;
  height: 100vh;
  margin: 0;
  text-align: center;
  -ms-transform: translateY(25%);
  transform: translateY(25%);
}
footer {
  visibility: hidden;
}
.BaseButton {
  padding-top: .7em;
  padding-bottom: .7em;
  background-size: 100% 215%;
  background-position: 0 -1px;
  font-family: LatoRegular, Archivo Narrow, Metropolis, -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 1.5;
  cursor: pointer;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: linear;
  background-image: linear-gradient(180deg, var(--gradient-color-stops));
  --gradient-from-color: transparent 50%;
  --gradient-color-stops: var(--gradient-from-color), var(--gradient-to-color, hsla(0, 0%, 100%, 0));
}
.BaseButton.-secondary {
  padding-left: 3rem;
  padding-right: 3rem;
  background-color: transparent;
  --text-opacity: 1;
  color: #e31937;
  color: rgba(227, 25, 55, var(--text-opacity));
  border-width: 2px;
  --border-opacity: 1;
  border-color: #a31937;
  border-color: rgba(227, 25, 55, var(--border-opacity));
  --gradient-to-color: #c1152e 50%;
}
.BaseButton > .label {
  display: flex;
  align-items: center;
  justify-content: center;
}
.middlesep {
  color: black;
  border-top-width: 1px;
  border-color: black;
  max-width: 120px;
}
.content-text {
  font-color: black;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  padding: 15px 15px;
}
.content-block {
  background-color: #f2f2f2;
  width: 100%;
}

.content-text p {
  font-color: black;
}
.button-row {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  line-height: 60px;
}
.button-row a {
  background-color: white;
  padding: 15px;
  border: 1px solid black;
  white-space: nowrap;
}
.speakers {
  padding: 20px 20px;
}
.speakers td {
  padding: 25px !important;
}
.speakers img {
  max-width: 100%;
}
.supporters {
  padding: 20px 20px;
}
.supporters td {
  padding: 25px !important;
}
.supporters img {
  max-width: 100%;
}

/* 600 */
@media all and (max-width: 37.5em) {
.content-text {
  width: 90%;
  padding: 5px 5px;
}
}

/* Submission buttons should appear in one row in larger screens, and
 * vertically in smaller screens.
 */
@media all and (max-width: 43.75em) {
  .button-row a {
    display: table;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
  }
}
/* We remove the margin on the right when buttons appear all
 * on the same row, so that they are centered.
 */
@media all and (min-width: 43.75em) {
  .button-row a:not(:last-child) {
    margin-right: 15px;
  }
  .button-row  {
    margin-bottom: 30px;
  }
}

/* We make the top welcome message's background full screen on small devices by
 * modifying the height of the injected vimeo video to take the full screen.
 * Otherwise, a white rectangle appears on smaller screens.
 */
@media all and (max-width: 43.75em) {
  .vimeo-wrapper > .embed-responsive {
    padding-bottom: 100vh;
  }
}

/* We completely eliminate the footer in smaller screens.
 *
 * On larger screens, it shows a portion of the background video, but the
 * effect is unnecessary and not showing up on smaller screens anyway).
 */
@media all and (max-width: 43.75em) {
  footer {
    display: none;
  }
}

/* We completely eliminate spacing around the speaker pictures on the front
 * page in smaller screens.
 */
@media all and (max-width: 43.75em) {
  .speakers {
    padding: 0px 0px !important;
  }
  .speakers td {
    padding: 0px !important;
    width: 100% !important;
    margin-top: 30px !important;
  }
  .speakers tr {
    display: inline-grid;
  }
}