@font-face {
 font-family: CustomFont;
 src: url("resources/nuku1.eot") /* EOT file for IE */
}
@font-face {
 font-family: CustomFont;
 src: url("resources/nuku1.ttf") /* TTF file for CSS3 browsers */
}

body {
	background-color:#000000;
	margin: 50;	
	font-family: CustomFont, Arial, Helvetica, sans serif;
}
p{
	color: white;
}
h1{
	text-align: center;
	color: red;
}
h2{
	font-size: 20;
	font-weight: 900;
	font-variant: small-caps;
	color: white;
	text-align: left;
}
a{
	color: white;
	font-size: 70%;
}
#wrapper{
	width: 50%
	margin-left: auto;
	margin-right: auto;
}
#canvasTarget{
	background-color: blue;
	height: 480px;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
}
#instructions{
	color: white;
	font-size: 14px;
	width: 800px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
/* for 980px or less */
@media screen and (max-width: 980px) {
	
	h1{
		font-size: 97%
	}
	p,  h2, .title, .date {
		font-size: 82.5%
	}

}

/* for 700px or less */
@media screen and (max-width: 700px) {

	h1{
		font-size: 91%
	}
	p, h2, .title, .date {
		font-size: 75%
	}

}

/* for 480px or less */
@media screen and (max-width: 480px) {
	h1{
		font-size: 80.5%
	}
	p, h2, .title, .date {
		font-size: 65%
	}

}