#Main {
	position: relative;
}

.slideout-menu, .slideout-close {
	color: white;
	font-weight: bold;
}

.slideout-menu {
	display: none;
	padding: 9px;
	font-size: 200%;
	cursor: pointer;
}

.slideout-close {
	display: block;
	font-size: 150%;
	text-align: right;
}

.slideout-close a {
	display: inline-block;
	padding: 5px;
	margin: 5px;
	color: white;
	cursor: pointer;
}

.slideout-panel {
	position: fixed;
	overflow: auto;
	background: #3E3E3E;
	text-align: center;
	z-index: 99;
}

.slideout-panel.hidden {
	visibility: hidden;
}

.slideout-panel.right, .slideout-panel.left {
	top: 0;
	bottom: 0;
	max-width: 100%;
}

.slideout-panel.top, .slideout-panel.bottom {
	left: 0;
	right: 0;
	max-height: 100%;
}

.slideout-panel.left { left: 0px; }
.slideout-panel.right {	right: 0px; }
.slideout-panel.top { top: 0px; }
.slideout-panel.bottom { bottom: 0px; }

.slideout-panel ul {
	display: inline-block;
	padding: 10px 0 20px 0;
	list-style-type: none;
	text-align: left;
}

.slideout-panel ul ul, .slideout-panel ul ul {
	padding: 0 0 0 20px;
}

.slideout-panel ul.folding {
	transition: max-height 300ms ease;
	overflow: hidden;
}

.slideout-panel li a {
	display: block;
	padding: 5px 25px;
	color: white;
	font-weight: bold;
	text-transform: uppercase;
}

@media screen and ( max-width: 767px ) {
	#PrimaryNavigation .slideout-menu + .primarynav { display: none; }
	#PrimaryNavigation .slideout-menu { display: block; float: right; }
}