@font-face {
	  font-family: 'Moontype';
	    src: url('webfont/Moontype-Bold.otf'); /* all */
	  src: url('webfont/Moontype-Bold.eot'); /* IE9 Compat Modes */
	  src: url('webfont/Moontype-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	       url('webfont/Moontype-Bold.woff') format('woff'), /* Modern Browsers */
		   url('webfont/Moontype-Bold.ttf')  format('truetype'); /* Safari, Android, iOS */

	  font-style:   normal;
	  font-weight:  700;
	  text-rendering: geometricPrecision;
	  display: inline-block;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		line-height: 1;
		text-decoration: inherit;
	
	}

	@font-face {
	  font-family: 'Moontype';
		src: url('webfont/Moontype-BoldItalic.otf'); /* all */
	   src: url('webfont/Moontype-BoldItalic.eot'); /* IE9 Compat Modes */
	   src: url('webfont/Moontype-BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	        url('webfont/Moontype-BoldItalic.woff') format('woff'), /* Modern Browsers */
			url('webfont/Moontype-BoldItalic.ttf')  format('truetype'); /* Safari, Android, iOS */

       
	  font-style:   italic;
	  font-weight:  700;
	  text-rendering: geometricPrecision;
	  display: inline-block;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		line-height: 1;
		text-decoration: inherit;
	
	}


body {
	font-family: 'Moontype', sans-serif; 
	font-size: 12px; 
	padding:20px;
	text-transform: uppercase; 
	background: #f6f6f6;
	margin: 0;
}

#bu { 
	letter-spacing: 0.2em;
	z-index:99;
	position:fixed;
    bottom:20px;
	left:20px;
	background: #f6f6f6; 
}

#left { 
	z-index:99;
	position:fixed;
    top:20px;
	background: #f6f6f6; 
}

#box {
	font-family: 'Moontype', sans-serif;
	font-size: 10em;
	z-index:1;
	margin: -20px;
	border: none;
	text-align: center;
	background: none;
	width: 100vw;
    height: 100vh;
}
#tyyyyypo {
	font-family: 'Moontype', sans-serif;
	font-size: 10em;
	z-index:1;
	margin: -20px;
	border: none;
	text-align: center;
	background: none;
	width: 100vw;
    height: 100vh;
}

#tyyyyypo_italic {
	font-family: 'Moontype', sans-serif;
	font-style:italic;
	font-size: 10em;
	z-index:1;
	margin: -20px;
	border: none;
	text-align: center;
	background: none;
	width: 100vw;
    height: 100vh;
}



h1 {
	font-size: 8em; 
}

h2 {
	font-size: 6em; 
}

h3 {
	font-size: 4em; 
}

h4 {
	font-size: 2em; 
}



a:link { color: black; text-decoration:none; }
a:visited { color: #000; }
a:hover { color: #000; border-bottom: 4px solid black; }
a:active { color: #000;}
a:focus { color: #000;  }

hr {
	background-color:trensparent; 
	height:50px; 
	border: 0px;
}


@media screen and (max-width:1110px) {
	
	#box {font-size: 10em;}
	h1 {font-size: 6em;}
	h2 {font-size: 4em; }
	
}

@media screen and (max-width:780px) {
	
#box {font-size: 6em;}
h1 {font-size: 4em;}
h2 {font-size: 2em;}
		
}

@media screen and (max-width:500px) {
	
#box {font-size: 5em;}
h1 {font-size: 2em;}
h2 {font-size: 2em;}

}