@charset "utf-8";
/* CSS Document */
body { margin: 0; }
        canvas { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; position: fixed; top:0; left: 0; }
        #info { position: fixed; top: 10px; left: 10px; color: white; font-family: monospace; z-index: 3; }
		#audios { position: fixed; bottom: 0; left: 0; opacity: 0;}
		#play { -webkit-appearance:none;appearance:none; background: none; background-color: transparent; border:none; width: 10vw; height: 10vw; background-image: url("../img/play.svg"); background-repeat:no-repeat; background-size: contain; background-position: center; cursor: pointer;}
		#start { width: 100%;height: 100svh; position: fixed; top:0; left: 0; display: flex;justify-content: center;align-items: center; z-index: 2; background-color: rgba(0,0,0,.8); display: none;flex-direction: column;}
		.intro #start { display: flex;}
		#close { width: 60px; height: 60px; position: fixed; top:0; right: 0; cursor: pointer; background-image: url("../img/close.svg"); background-position: center; background-repeat: no-repeat; z-index: 2;}
		.intro #close { display: none;}

h1 { font-family: "Bona Nova SC", serif; font-weight: 400; color: #FFF; margin-top:0; font-size: 10vw;}

@media (orientation: landscape) {
h1 { font-size: 5vw;}	
	#play { width: 5vw; height: 5vw;}
}