@charset "UTF-8"
/*
* { 
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
-o-box-sizing: border-box; 
box-sizing: border-box; 
/* adds animation for all transitions  
-webkit-transition: 2.25s ease-in-out; 
-moz-transition: 2.25s ease-in-out; 
-o-transition: 2.25s ease-in-out; 
transition: 2.25s ease-in-out; 
margin: 0; 
padding: 0; 
-webkit-text-size-adjust: none; 
} 
*/ 

/* Makes sure that everything is 100% height */ 

html,body { 
	height: 100%; 
	overflow: hidden; 
} 

/* gets the actual input out of the way; 
we're going to style the label instead */ 

#drawer-toggle { 
	position: absolute; 
	opacity:0; 
}



#drawer-toggle-label { 
	-webkit-touch-callout: none; 
	-webkit-user-select: none; 
	-khtml-user-select: none; 
	-moz-user-select: none; 
	-ms-user-select: none; 
	user-select: none; 
	left: 5px; 
	top:5px;
	height:50px; 
	width: 50px; 
	display: block; 
	position: fixed; 
	background: rgba(255,255,255,.0); 
	z-index: 91;
	transition: left 0.3s;
} 

/* adds our "hamburger" menu icon */ 

#drawer-toggle-label:before { 
	content: ''; 
	display: block; 
	position: absolute; 
	height: 50px; 
	width: 50px; 
	background: url(/images/iconList.png) no-repeat; 
	background-size: 50px 50px;
} 

header { 
	width: 100%; 
	position: fixed; 
	left: 0px; 
	background: #efefef; 
	padding: 0px 0px 0px 0px; 
	font-size: 30px; 
	line-height: 30px; 
	z-index: 90;
	transition: left 0.3s;
}

/* drawer menu pane - note the 0px width */ 

#drawer { 
	position: fixed; 
	top: 0px; 
	left:-280px; 
	height: 100%; 
	width: 280px; 
	background: #2f2f2f; 
	overflow-x: hidden; 
	overflow-y: scroll; 
	padding: 0px; 
	-webkit-overflow-scrolling: touch; 
	transition: left 0.3s;
	z-index:200;
} 

/* actual page content pane */ 

#page-content { 
	margin-left: 0px; 
	margin-top: 0px; 
	width: 100%; 
	height: calc(100% - 50px); 
	overflow-x:hidden; 
	overflow-y:scroll; 
	-webkit-overflow-scrolling: touch; 
	padding: 50px 0 0 0; 
	transition: margin-left 0.3s;
}


/* checked styles (menu open state) */ 

#drawer-toggle:checked ~ #drawer-toggle-label { 
	height: 100%; 
	width: 100%; 
	background: rgba(255,255,255,.8); 
} 

#drawer-toggle:checked ~ #drawer-toggle-label, 
#drawer-toggle:checked ~ header { 
	left: 280px;
	transition: left 0.3s;
} 

#drawer-toggle:checked ~ #drawer { 
	left: 0px; 
} 

#drawer-toggle:checked ~ #page-content { 
	margin-left: 280px; 
	z-index:1;
	position:fixed;
}

/* Menu item styles */ 

#drawer ul { 
	list-style-type:none; 
} 

#drawer ul a { 
	display:block; 
	padding:10px; 
	color:#c7c7c7; 
	text-decoration:none; 
} 

#drawer ul a:hover { 
	color:white; 
} 

/* Responsive MQ */ 



@media only screen and (min-width: 769px) {

#page-content {  
	padding:0px;
	height:100%;
}
#drawer-toggle-label {
	display:none;
}

}