
@font-face {
    font-family: "Muli";
    src: url("fonts/Muli-Regular.ttf");
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: "Muli Bold";
    src: url("fonts/Muli-Bold.ttf");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "Muli SemiBold";
    src: url("fonts/Muli-SemiBold.ttf");
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: "Muli SemiBoldItalic";
    src: url("fonts/Muli-SemiBoldItalic.ttf");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "Muli ExtraBold";
    src: url("fonts/Muli-ExtraBold.ttf");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "Grandstander";
    src: url("fonts/Grandstander-clean.ttf");
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: "Granstander Clean"; /* [sic] */
    src: url("fonts/Grandstander-clean.ttf");
    font-style: normal;
    font-weight: 400;
}

body, div {
	margin:0;
	padding:0;
	border:0;
}

#frame {
	
	width:100vw;
}

#content{
	width:100%;
	height:100%;
	position:relative;
}




canvas{
	width:100vw;
	height:100vh;
	display:block;
	margin:0 auto;
}

@media screen and (min-aspect-ratio: 2/1) {
	canvas {
		width:200vh;
		height:100vh;
		margin:0 auto;
	}
}

@media screen and (max-aspect-ratio:4/3) {
	canvas {
		width:100vw;
		height:75vw;
		margin:auto 0;
	}
}

@media screen and (min-width: 500px) and (max-width:800px) {

}


body {
	font-family:"Muli";
}

.fontload {
	position:absolute;
	top:0;
	left:0;
}

.muli {
    font-family:"Muli"
}

.muli-bold {
    font-family:"Muli Bold"
}

.muli-extrabold {
    font-family:"Muli ExtraBold"
}

.muli-semibold {
    font-family:"Muli SemiBold"
}

.muli-semibold-italic {
    font-family:"Muli SemiBoldItalic"
}

.grandstander {
	font-family:"Grandstander"
}
.grandstander2 {
	font-family:"Granstander Clean"
}

#frame{
    max-height: 100vh;
    max-width: 100vw;
    overflow: hidden;
}
*{
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
