@import 'normalize.css';
@import 'typography.css';

body {
	padding: 10px;
}

blockquote {
	padding: 1em 0;
	margin: 1em 0;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-style: solid;
	border-color: #333;
}

th, td {
	padding: 0 10px 0 0;
}

ul {
	list-style-position: inside;
	list-style-type: disc;
}

.wrapper {
	width: 740px;
	margin: 30px auto;
	overflow: hidden;
}

.header {
	overflow: hidden;
}

.logo {
	position: absolute;
	width: 222px;
	height: 81px;
	background: transparent url(/images/style-logo.png) no-repeat left top;
	text-indent: -9999em;
	margin-top: -17px;
	z-index: 1000;
}
	
	.logo a {
		display: block;
		width: 222px;
		height: 81px;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1500;
	}

.nav-primary {
	text-transform: uppercase;
	float: right;
	width: 520px;
	position: relative;
}

	.nav-primary li {
		display: inline;
	}

	.nav-primary li a {
		float: left;
		margin-left: 10px;
		padding: 5px 10px 4px;
		background-image: url(/images/style-bg-nav-shadow.png);
		background-position: left bottom;
		background-repeat: repeat-x;
	}
	
	.nav-primary li span {
		display: block;
		position: absolute;
		z-index: 1000;
	}
	
.content {
	margin-top: -15px;
}

	.entry-content {
		overflow: hidden;
	}
	
.footer {
	padding: 10px;
	background-image: url(/images/style-bg-footer-shadow.png);
	background-position: left top;
	background-repeat: repeat-x;
	color: #fefefe;
}

.image-inline-right {
	float: right;
	padding-bottom: 10px;
	padding-left: 10px;
}

.image-inline-left {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
}

#default {
	background-color: #5a7d39;
}

	#default a {
		color: #244860;
	}

	#default .nav-primary li a {
		background-color: #f3e275;
	}

	#default .content {
		background: url(/images/style-bg-content-default.jpg) no-repeat left top;
		height: 327px;
		position: relative;
	}
	
	#default .section {
		position: absolute;
		left: 325px;
		top: 100px;
		width: 385px;
	}
	
	#default .footer {
		background-color: #7b9761;
	}

#human {
	background-color: #e1b52b;
}

	#human .nav-primary li a {
		background-color: #f3e275;
	}

	#human .nav-primary li a.nav-active {
		background-color: #e7c455;
	}
	
	#human .nav-primary li a.nav-active.js-activated {
		background-color: #f3e275;
		color: #f3e275;
	}
	
	#human .nav-primary li span {
		background: url(/images/style-nav-human.png) no-repeat center center;
		width: 28px;
		height: 43px;
		margin-left: 10px;
		top: -10px;
	}
	
	#human .content {
		background: url(/images/style-bg-content-human.jpg) no-repeat left top;
		height: 327px;
		position: relative;
	}
	
	#human .section {
		position: absolute;
		left: 345px;
		top: 80px;
		width: 320px;
	}
	
	#human h1 {
		position: absolute;
		top: -20px;
		left: 90px;
	}
	
	#human .footer {
		background-color: #e7c455;
	}

#animal {
	background-color: #9c1c1f;
}

	#animal a {
		color: #101229;
	}

	#animal .nav-primary li a {
		background-color: #6d818d;
	}

	#animal .nav-primary li a.nav-active {
		background-color: #b0494c;
	}
	
	#animal .nav-primary li a.nav-active.js-activated {
		background-color: #6d818d;
		color: #6d818d;
	}
	
	#animal .nav-primary li span {
		background: url(/images/style-nav-animal.png) no-repeat center center;
		width: 53px;
		height: 35px;
		top: -3px;
	}
	
	#animal .content {
		background: url(/images/style-bg-content-animal.jpg) no-repeat left top;
		height: 327px;
		position: relative;
	}
	
	#animal .section {
		position: absolute;
		left: 365px;
		top: 110px;
		width: 320px;
	}

	#animal h1 {
		position: absolute;
		top: -30px;
		left: -20px;
		color: #fefefe;
	}

	#animal .footer {
		background-color: #b0494c;
	}

#environment {
	background-color: #5e5272;
}

	#environment a {
		color: #332c4c;
	}

	#environment .nav-primary li a {
		background-color: #efdbad;
	}
	
	#environment .nav-primary li a.nav-active {
		background-color: #7e758e;
	}

	#environment .nav-primary li a.nav-active.js-activated {
		background-color: #efdbad;
		color: #efdbad;
	}
	
	#environment .nav-primary li span {
		background: url(/images/style-nav-environment.png) no-repeat center center;
		width: 40px;
		height: 37px;
		top: -3px;
		margin-left: 25px;
	}

	#environment .content {
		background: url(/images/style-bg-content-environment.jpg) no-repeat left top;
		height: 327px;
		position: relative;
	}
	
	#environment .section {
		position: absolute;
		left: 335px;
		top: 80px;
		width: 380px;
	}
	
	#environment h1 {
		position: absolute;
		left: -100px;
		top: -10px;
		color: #fefefe;
	}
	
	#environment .footer {
		background-color: #7e758e;
	}

#classes {
	background-color: #d96827;
}

	#classes a {
		color: #324c96;
	}

	#classes .nav-primary li a {
		background-color: #e7ddd8;
	}

	#classes .nav-primary li a.nav-active {
		background-color: #e18652;
	}
	
	#classes .nav-primary li a.nav-active.js-activated {
		background-color: #e7ddd8;
		color: #e7ddd8;
	}
	
	#classes .nav-primary li span {
		background: url(/images/style-nav-classes.png) no-repeat center center;
		width: 43px;
		height: 43px;
		top: -10px;
		margin-left: 3px;
	}
	
	#classes .content {
		background: #ebe0de url(/images/style-bg-content-classes.jpg) no-repeat left top;
		padding: 100px 50px 50px;
	}
	
	#classes .footer {
		background-color: #e18652;
	}

#store {
	background-color: #dc4b4f;
}

	#store a {
		color: #324c96;
	}

	#store .nav-primary li a {
		background-color: #e7ddd8;
	}

	#store .nav-primary li a.nav-active {
		background-color: #e36f72;
	}
	
	#store .nav-primary li a.nav-active.js-activated {
		background-color: #e7ddd8;
		color: #e7ddd8;
	}
	
	#store .nav-primary li span {
		background: url(/images/style-nav-store.png) no-repeat center center;
		width: 41px;
		height: 43px;
		top: -5px;
		margin-left: 3px;
	}
	
	#store .content {
		background: #eeeee4 url(/images/style-bg-content-store.jpg) no-repeat left top;
		padding: 100px 50px 50px;
	}
	
	#store .footer {
		background-color: #e36f72;
	}

#about {
	background-color: #408a9a;
}

	#about a {
		color: #244860;
	}

	#about .nav-primary li a {
		background-color: #9ed0e9;
	}

	#about .nav-primary li a.nav-active {
		background-color: #66a1ae;
	}

	#about .nav-primary li a.nav-active.js-activated {
		background-color: #9ed0e9;
		color: #9ed0e9;
	}
	
	#about .nav-primary li span {
		background: url(/images/style-nav-about.png) no-repeat center center;
		width: 41px;
		height: 43px;
		top: -5px;
		margin-left: 3px;
	}
	
	#about .content {
		background: #9ed0e9;
		padding: 50px;
	}
	
	#about h1 {
		margin-left: auto;
		margin-right: auto;
		width: 380px;
	}
	
	#about .footer {
		background-color: #66a1ae;
	}