@font-face {
    font-family: 'Neue Haas Unica';
    src: url('NeueHaasUnica-Medium.eot');
    src: local('Neue Haas Unica Medium'), local('NeueHaasUnica-Medium'),
        url('NeueHaasUnica-Medium.eot?#iefix') format('embedded-opentype'),
        url('NeueHaasUnica-Medium.woff2') format('woff2'),
        url('NeueHaasUnica-Medium.woff') format('woff'),
        url('NeueHaasUnica-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neue Haas Unica';
    src: url('NeueHaasUnica-Regular.eot');
    src: local('Neue Haas Unica Regular'), local('NeueHaasUnica-Regular'),
        url('NeueHaasUnica-Regular.eot?#iefix') format('embedded-opentype'),
        url('NeueHaasUnica-Regular.woff2') format('woff2'),
        url('NeueHaasUnica-Regular.woff') format('woff'),
        url('NeueHaasUnica-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PPEditorial';
    src: local('PPEditorialNew Thin'), local('PPEditorialNew-Thin'),
        url('PPEditorialNew-Thin.woff2') format('woff2'),
        url('PPEditorialNew-Thin.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}


PPEditorialNew-Thin.woff

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{ margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { margin: 0; padding: 0; display: block; }
img { vertical-align: text-bottom; }
input[type="text"], input[type="tel"], input[type="email"], input[type="search"], input[type="submit"], textarea { -webkit-appearance: none; border-radius: 0; outline: none; }
html, body { width: 100%; }


html {
  	-ms-overflow-style: scrollbar;
	--rise-neon: #DCFF00;
	--rise-black: #161E1A;
}


ul, ol { list-style: none; }

*, *:before, *:after { 
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

img { 
	max-width: 100%; 
	height: auto; 
}
a { 
	color: inherit;
	text-decoration: none;
}
a > img { 
	display: inline-block;
}

.group:before, .group:after { display: table; content: ""; }
.group:after { clear: both; }

body {
	font-family: 'Neue Haas Unica', sans-serif;
	font-weight: 500;
	font-size: 10px;
	text-transform: uppercase;
	color: #DCFF00;
	background-color: #161E1A;
	overflow-x: hidden;
}
h1,
h2,
h3,
h4 {
	font-family: 'PPEditorial', serif;
	font-weight: 200;
	line-height: 1.2;
}
h1 {
	font-size: 40px;
	line-height: 40px;
}
h2 {
	font-size: 22px;
	line-height: 22px;
}
h2 span {
	display: inline-block;
	font-family: 'Neue Haas Unica', sans-serif;
	font-weight: 500;
	font-size: 9px;
	transform: translateY(-5px);
}

.main {
	position: relative;
	width: 100vw;
	height: 100vh;
	padding-left: 38px;
	padding-right: 38px;
	overflow-x: hidden;
}

.top {
	position: relative;
	height: 38px;
	padding-bottom: 3px;
}
.top__wrap {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	height: 100%;
}
.logo {
	width: 57px;
}

.frame {
	position: relative;
	z-index: 0;
	width: 100%;
	height: calc(100vh - 115px);
	overflow:  hidden;
}
.frame .frame__content {
	position: absolute;
	z-index: 2;
	bottom: 180px;
	left: 50%;
	transform: translateX(-50%);
	width: 50vw;
	max-width: 90%;
	text-align: center;
}
.frame .frame__content h2 {
	margin-top: 30px;
}
.frame .frame__bg {
   width: 100%;
   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;
   z-index: -1;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.marquee {
	position: absolute;
	z-index: 3;
	bottom: 77px;
	left: 0;
	width: 3000px;
	padding-top: 12px;
	padding-bottom: 12px;
	font-weight: 400;
	font-size: 16px;
	border-top: 1px solid var(--rise-neon);
	border-bottom: 1px solid var(--rise-neon);
	
}
.marquee__wrap {

}
.marquee .dot {
	margin: 0 35px;
	width: 11px;
	height: 9px;
	vertical-align: baseline;
}
.marquee a {
	border-bottom: 0.5px solid var(--rise-neon);
}
.marquee a:hover {
	border-bottom: none;
}

.bottom {
	position: absolute;
	z-index: 3;
	bottom: 0;
	left: 0;
	padding-left: 38px;
	padding-right: 38px;
	width: 100%;
	height: 77px;
}
.bottom__wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}

@media (max-width: 575px) {

.main {
	padding-left: 30px;
	padding-right: 30px;
}

h1 {
	font-size: 26px;
	line-height: 26px;
}
h2 {
	font-size: 17px;
	line-height: 17px;
}
h2 span {
    font-size: 8px;
    transform: translateY(-4px);
}

.top {
	height: 30px;
}
.logo {
	width: 50px;
}
.frame {
	height: calc(100vh - 95px);
}
.frame .frame__content {
	bottom: 110px;
	width: 96vw;
	max-width: 96%;
}
.frame .frame__content h2 {
	margin-top: 15px;
}
.marquee {
	bottom: 65px;
	font-size: 12px;
}
.marquee .dot {
    margin: 0 20px;
}
.bottom {
	height: 65px;
}

}