body {background:#08F8C5;
	font-family: 'vt323', monospace;}


h1 {font-family: 'Press Start 2P', cursive;}

div#header {
	width:45%;
	background:#e6005c;
	float: left;
	padding-left:5%;
}

div#nav {
	width:45%;
	background:#ff3399;
	float: left;
	padding-right:5%;
	text-align:right;
	line-height:600%;
}

/*header and nav*/

div#box {
	display: flex;
	width:100%;
	background:#c44dff;
}

div#content{
	background-color:#000000;
	color:#00ffcc;
	width:90%;
	margin: 0 auto;
	padding-top:1%;
	padding-bottom:1%;
	padding-left:1%;
	padding-right:1%;
	text-align: center;
}

div#footer{
	background-color:#d5ff80;
	width:90%;
	margin: 0 auto;
	padding-top:1%;
	padding-bottom:1%;
	padding-left:1%;
	padding-right:1%;
	text-align: center;
	font-size: small;
}

/* unvisited link */
a:link {
    color: #d5ff80;
}

/* visited link */
a:visited {
    color: #00ffcc;
}

/* mouse over link */
a:hover {
    color: #000000;
}

/* selected link */
a:active {
    color: #00ffcc;
}

/* unvisited link in content div */
div#content a:link {
    color: #e6005c;
}

div#gallery {
height:900px;
overflow-y:scroll;
}


img {max-width: 65%;
	height: auto;
}

@media screen and (max-width: 640px) and (min-width: 300px){

div#box {
	display: inline-block;
	width: 100%;
	background:#c44dff;
	}
	
	div#header {
	width:100%;
	background:#e6005c;
	float: left;
	padding-left:2%;
	padding-right:1%;
	padding-bottom:1%;
	padding-top:1%;
	height:7%;
	line-height:50%;
	}
	
	div#nav {
	width:100%;
	background:#ff3399;
	float: left;
	padding-left:1%;
	padding-right:1%;
	padding-bottom:1%;
	padding-top:1%;
	text-align:left;
	line-height:50%;
	}
	
}