
/* =Layout
-----------------------------------------------------------------------------*/
.wrapper {
	background-color: #d6d000;
	margin: auto; 
	max-width: 960px;
	padding: 36px 10px;
	_width: 940px;		
}
#main aside {
	background-color: #d1552f;
}
#blocks li {
	background-color: #d1552f;
	height: 100px;
}

/* =Header
-----------------------------------------------------------------------------*/
#header {
	background-color: #000000;
	overflow: hidden;
	padding-bottom: 1.5em;
	margin-bottom: 1.5em;
	border-bottom: 1px solid #eee;
}
#header h1 {
	float: left;
	margin: 0;	
}

/* =Nav
-----------------------------------------------------------------------------*/
#nav {
	background-color: #000000;
	padding-top: 1.1em;
	float: left;	
}
#nav ul, #navside ul {
	margin: 0;
	list-style: none;	
}
#nav ul li {
	color: #999;
	float: left;
	margin-left: 1.5em;	
}
#navside ul li {
	padding: 2px 0;
}

/* =Footer
-----------------------------------------------------------------------------*/
#footer {
	background-color: #d6d000;
	border-top: 1px solid #eee;
	padding-top: 1.5em;
	margin: 1.5em 0;
	font-size: .85em;
	color: #d1552f;
}



/* =Tablet (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .wrapper { width: 748px; }
}


/* =Mobile (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
	.wrapper { width: 300px; }
	#nav, #header h1 { float: none; }
	#header h1 { margin-bottom: .5em; }
	#nav ul li { margin: 0; float: none; margin-bottom: 1px; background-color: #000000; }
	#nav ul li a, #nav ul li span { display: block; padding: 2px 5px; }
}

/* =Mobile (Landscape)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.wrapper { width: 420px; }
}