@font-face {
	font-family: "NB International";
	src: url('NB International Pro Regular.otf') format('opentype');
	}

@font-face {
	font-family: "NB International";
	src: url('NB International Pro Bold.otf') format('opentype');
	font-weight: bold;
	}

html, body {
	padding:0;
	margin:0;
	border:0;
	}

body {
	font-family: NB International;
	font-size: 1.5vw;
	color: white;
	width: 100vw;
}

.header {
	float: left;
	position:relative;
	left: 1vw;
	top: 1vw;
    line-height: 1.5;
    color: white;
    z-index: 0;
    overscroll-behavior: contain;
	}

a {
  -o-transition:.5s;
  -ms-transition:.5s;
  -moz-transition:.5s;
  -webkit-transition:.5s;
  transition:.5s;
  }

a:link {text-decoration: none; color: #fff;}
a:visited {text-decoration: none; color: #fff;}
a:hover {text-decoration: none; color: #fff; opacity: 0.2;}

.container {
height: 100vh;
width: 100vw;
position: relative;
}

.mini-logo-container {
	display: flex;
	align-items: center;
}

.mini-logo {
	height: 2vw;
	margin: 0vw 0 -.4vw 0;
}

.marquee {
  position: fixed;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  overflow-x: hidden;
  pointer-events: none;
}

.track {
  background-color: black;
  height: 3.2vw;
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: 0;
  position: fixed;
  white-space: nowrap;
  will-change: transform;
  animation: marquee 62s linear infinite;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media screen and (max-width: 800px) {
	.body {overflow: auto;}
	.header {font-size: 5vw; padding: 2.5vw;}
	.marquee {font-size: 7.5vw;}
	.track {height: 9.3vw;}
	.mini-logo {
		height: 5vw;
		margin: 0vw 0 -.8vw 0;
	}
}