/************************************************************************************
GENERAL
*************************************************************************************/
header {
	content: " "; 
	display: table; 
}


/************************************************************************************
STRUCTURE
*************************************************************************************/
#pagewrap {
	width: 960px;
	max-width: 94%;
	margin: 30px auto 0;
}
#content {
	clear: both;
	border-top: solid 1px #ccc;
	padding-top: 20px;
	margin: 20px 0;
}


/************************************************************************************
MOBILE
*************************************************************************************/
ul { 
    list-style-type: none; 
}

	/* nav-wrap */
	#nav-wrap {
		position: relative;
	}

	/* menu icon */
	#menu-icon {
		display: block; /* show menu icon */
	}
	#menu-icon:hover {
		background-color: #E9E9E9;
	}
	#menu-icon.active {
		background-color: #E9E9E9;
	}
	
	/* main nav */
	#nav {
		clear: both;
		position: absolute;
		top: 0px;
		left: -15%;
		width: 160px;
		z-index: 10000;
		padding: 15px;
		background: #E9E9E9;
		border: solid 1px #999;
		box-shadow: 7px 7px 10px #333333;
		display: none; /* visibility will be toggled with jquery */
	}
	#nav li {
		clear: both;
		float: none;
		margin: 1px 1px 1px 1px;
	}
	#nav a, 
	#nav ul a {
		font: inherit;
		font-weight: normal;
		background: none;
		display: inline;
		padding: 0;
		color: #780000;
		border: none;
	}
	#nav a:hover, 
	#nav ul a:hover {
		background: none;
		color: #666666;
	}
	
	/* dropdown */
	#nav ul {
		width: auto;
		position: static;
		display: block;
		border: none;
		background: inherit;
	}
	#nav ul li {
		margin: 30px 30px 30px 30px;
	}