#menu_wrap::-webkit-scrollbar { 

	display: none; 

}

#menu_wrap {

	-ms-overflow-style: -ms-autohiding-scrollbar;

}



body {

	overflow-x:hidden;

}

.section_wrap {

	max-width:1200px;

	margin:0 auto;

}

#menu_wrap {

	transition:all 0.4s ease;

	position:fixed;

	top:0;

	left:0;

	background:#eee;
	background:#007db9;
	background: #00608e; /* Old browsers */
	background: -moz-linear-gradient(top,  #00608e 0%, #007fbc 49%, #00608e 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #00608e 0%,#007fbc 49%,#00608e 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #00608e 0%,#007fbc 49%,#00608e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00608e', endColorstr='#00608e',GradientType=0 ); /* IE6-9 */

	min-height:100vh;

	max-height:100vh;

	overflow-y:auto;

	overflow-x:hidden;

	transform: translateX(-400px);

	box-shadow:0 0 0px rgba(0,0,0,0);

	z-index:99;

}



#menu_wrap ul.nav {

	width:400px;
	max-width:80vw;
	margin:0;

}

#content_wrap {

	transition:all 0.4s ease;

	perspective:400px;

	perspective-origin:25% 75%;

	transform:translateX(0px) scale(1);

	transform-style:preserve-3d;

	transform-origin: left;

	background:url(bg.jpg);

	background-size:cover;

	min-height:100vh;

	opacity:1;

	

	overflow-y:hidden;

}



.menu_open #menu_wrap {

	transform: translateX(0px);

	box-shadow:0 0 50px rgba(0,0,0,0.5);

}

.menu_open #content_wrap {

	transform:translateX(400px) ;

	opacity:0.2;

}

#open-menu, #close-menu {

	margin:1em;

	padding:0.5em;

	border:1px solid #000;

	background:#333;

	color:white;

	float:right;

}



#menu_wrap ul {

	list-style:none;

}

#menu_wrap ul.nav > li {

	margin:1em;

}

#menu_wrap ul.nav {
	padding-left:15px;
}
#menu_wrap ul.nav ul {

	padding-left:1em;


}

ul.nav-child {


}

#menu_wrap ul.nav li a {

	color:black;
	color:white;

	text-decoration:none;

	padding:0.3em;
	padding-left:0;

	display:inline-block;

}

#menu_wrap ul.nav li a:hover {

	text-decoration:underline;

}

#menu_wrap li.deeper.parent {



}

#menu_wrap li.deeper.parent {
	cursor:pointer;
}
#menu_wrap li.deeper.parent ul {
	/* hide childen by default */
	max-height:0;
	overflow:hidden;
	transition:all 0.2s ease;
}

#menu_wrap li.deeper.parent.accordion-active > ul {
	max-height:800vh;
	height:auto;
}





#close-menu {

	margin:1em;

	padding:0.5em;

	border:1px solid #000;

	background:rgba(0,0,0,0.5);

	color:white;

	float:right;
	text-decoration:none;

}

#menu_wrap .deeper li {
	padding:0.5em;
	border-top:1px solid rgba(0,0,0,0.2);
}

.chevron::before {
	font-size:1.3em;
	border-style: solid;
	border-width: 0.1em 0.1em 0 0;
	content: '';
	display: inline-block;
	height: 0.45em;
	left: 0.15em;
	position: relative;
	top: 0.25em;
	transform: rotate(-45deg);
	vertical-align: top;
	width: 0.45em;
	left: 0;
	transform: rotate(45deg);
	transition:all 0.3s ease;
	margin-left:1em;
}

#menu_wrap .nav-header {
	color:white;
	display:inline-block;
}
#menu_wrap .nav-header:hover {
	text-decoration:underline;
}
.accordion-active > a > .chevron:before, .accordion-active > .nav-header > .chevron:before {
	top: 0.25em;
	transform: rotate(135deg);
}

#menu_wrap a, #menu_wrap .nav-header {
	transition:all 0.3s ease;
}
.accordion-active > a , .accordion-active > .nav-header {
	transform:scale(1.2);
}