main.css

body {
	background-color: #efefef;
	font-family: verdana;
	font-size: 12pt;
	color: #363636;
	margin: 0;
	padding: 0;
}
a:link, a:visited, a:active {
	text-decoration: underline;
	font-weight: bold;
	color: #363636;
}
a:hover {
	text-decoration: none;
	color: #646464;
}
.collapsed {
	position: relative;
	margin-left: 20px;
	margin-top: 20px;
	width: 130px;
	height: 130px;
	z-index: 1;
}
.collapsed:hover {
	cursor: pointer;
}
.collapsed:hover .name {
	opacity: .5;
}
.expanded .name {
	display: none;
}
.collapsed .name {
	display: inline;
}
.name {
	top: 30%;
	position:absolute;
	color: white;
	font-size: 30pt;
	text-align: center;
	width: 100%;
}
.projects {
	position: relative;
	top: 10%;
	left: 10%;
	width: 80%;
	height: 80%;
	border: none;
	background: none;
}
.projInfo img {
	padding: 10px;
	background: url("https://s3.amazonaws.com/neopets_pictures/Layouts/Tiles/40w.png");
	width: 400px;
}
.gallery td .reg {
	padding: 5px;
	background: url("https://s3.amazonaws.com/neopets_pictures/Layouts/Tiles/40w.png");
	width: 75px;
	height: 75px;
}
.gallery td .hoverDiv {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 1000;
}
.gallery td .hoverDiv .hoverImg {
	top: 50%;
	left: 50%;
	background: url("https://s3.amazonaws.com/neopets_pictures/Layouts/Tiles/40b.png");
	padding: 10px;
}
.box {
	padding: 100px 50px 100px 50px;
	position: relative;
	width: auto;
	height: auto;
}
.box h1 {
	font-size: 40pt;
}
h3 {
	font-size: 20pt;
	padding: 10px;
}
#about {
	background: #4cc8de;
}
#art {
	background: #e04fed;
}
#contact {
	background: #4cc8de;
}