:root {
      min-height: 100vh;
      font-size: calc( 16px + (24 - 16) * (100vw - 340px) / (1240 - 340) );
      scroll-behavior: smooth;
}

html {
    box-sizing: border-box;
}

body {
  background-color: #111;
}

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

.section {
    width: 100%;
    height: 100vh;

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

.box {
  width: 70vw;

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

.box--content {
  width: 100%;
}

.footer {
    bottom: 1em;
    right: 2em;
    color: white;
    position: fixed;
}


@font-face {
	font-family: SourceSansPro;
	src: local('SourceSansPro-Regular'), url('../fonts/SourceSansPro-Regular.woff2') format('woff2'), url('../fonts/SourceSansPro-Regular.woff') format('woff'), url('../fonts/SourceSansPro-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
	font-family: ZillaSlab;
	src: local('ZillaSlab'), url('../fonts/ZillaSlab-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}


.header-logo {
    width: 70vw;
}

.header-logo--small {
  width: 20vw;
}

.video-bg {
    position: fixed;
    z-index: -100;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 100vh;
    object-fit: cover;
    object-position: center;
    transition: 0.6s opacity;
}

.transparent {
    opacity: 0.4;
}

.snappy {
  scroll-behavior: smooth;

  overflow-y: scroll;
  width: 100%;
  height: 100vh;
/*  scroll-snap-points-y: repeat(100vh);
  scroll-snap-type: mandatory; */
}

a, p, h1, h2, h3, h4, li, address {
  color: white;
  font-family: SourceSansPro;
  line-height: 130%;
}

a {
  text-decoration: none;
  font-size: .4em;
}

p {
  font-size: .8em;
}

.bg-color {
  background-color: #111111;
}

.headline, .contact {
  font-family: ZillaSlab;
  text-transform: uppercase;
  color: white;
}

.scroll-button {
 padding-top: 4rem;
}



/* animation */

/* Float */
.hvr-float {
  display: inline-block;
  vertical-align: middle;
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  transition-duration: 0.6s;
  transition-property: transform;
  transition-timing-function: ease-out;
}
.hvr-float:hover, .hvr-float:focus, .hvr-float:active {
  transform: translateY(-20px);
}

/* Sink */
.hvr-sink {
  display: inline-block;
  vertical-align: middle;
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  transition-duration: 0.6s;
  transition-property: transform;
  transition-timing-function: ease-out;
}
.hvr-sink:hover, .hvr-sink:focus, .hvr-sink:active {
  transform: translateY(20px);
}