body{
    margin:0;
    overflow: hidden;
}

@font-face {
	font-family: 'KomikaTitle';
	src: url('/assets/fonts/komika_title/komikatitle-webfont.eot');
	src: url('/assets/fonts/komika_title/komikatitle-webfont.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/komika_title/komikatitle-webfont.ttf') format('truetype'), url('/assets/fonts/komika_title/komikatitle-webfont.svg#komikatitle-webfont') format('svg'), url('/assets/fonts/komika_title/komikatitle-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OpenSansLight';
	src: url('/assets/fonts/opensans_light_macroman/OpenSans-Light-webfont.eot');
	src: url('/assets/fonts/opensans_light_macroman/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/opensans_light_macroman/OpenSans-Light-webfont.ttf') format('truetype'), url('/assets/fonts/opensans_light_macroman/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
	font-weight: normal;
	font-style: normal;
}



#app{
    background-color: white;
    height:100vh;
    width:100vw;

    position: fixed;
    top:0;
    left:0;
	
    overflow: hidden;
}

video{
    position: fixed;
    top: 0;
	left: 0;
	right: 0;
    bottom: 0;
	
	min-width:100%;
	min-height:100%;
}

.container{
    width: 80%;
    max-width: 500px;

    position: absolute;
    top:45%;
    left:50%;

    transform: translate(-50%, -50%);
}

.text{
    width: 300px;
    margin-left: auto;
    color: white;

    position: absolute;

    left:345px;
}

.text h3{
    font-family: 'KomikaTitle', Helvetica, sans-serif;
	font-size: 36px !important;
	font-style: normal;
	font-weight: normal;

    font-size: 20px;
    margin-top:20px;
    margin-bottom: 30px;
}

.text a{
    font-family: 'OpenSansLight', Helvetica, sans-serif;
	font-size: 20px;
	font-weight: 200;

    color: white;

    text-decoration: none;
}

.text a:hover{
    cursor: pointer;
    color: white;

    opacity: 0.8;
}


.text p{
    font-family: 'OpenSansLight', Helvetica, sans-serif;
	font-size: 20px;
	font-weight: 200;
	
	margin-top:8px;
}

video.low-power-fix{
	top:100vh;
	animation:all 0.5s;
}


@media (max-width: 780px) {
    .container{
        top: 40%;
        max-width: 400px;
    }
}

@media (max-width: 780px) {
    .text{
        left: 10px;
        width: unset;
        /* transform: translateX(-50%); */
    }

    .text h3{
        margin-top:50px;
    }
}

@media (max-width: 380px) {
    .container{
        top: 45%;
    }
    .text{
        position: relative;
        max-width: 230px;
        margin-left:unset;
    }
}