/***** menu *****/
#drawer-toggle {
	display: none;
	}
nav {
	width: 100%;
	max-width: 1150px;
	margin-top: -1em;
	margin-right: auto;
	margin-left: auto;
	background: none;
	}

#drawer {
	width: 100%;
	height: 60px;
	text-align: center;
	position: relative;
	top: 0;
	/* background: linear-gradient(0deg, #4f1115 0%, #ac2c30 100%); */
	background: #c41c1c; /* red */
	}
#drawer ul {
	width: 90%;
	margin-top: -5em;
	margin-top: 0;
	margin-top: 1em;
	margin-left: 5%;
	}
#drawer ul li {
	display: inline;
	}
#drawer ul li:first-child {
	}
#drawer ul li a {
	color: #fff;
	font-size: 175%;
	text-decoration: none;
	margin: 0 10px;
	padding: 7px 20px;
	border-bottom: 0;
	background: none;
	}
#drawer li a:hover {
	color: #000;
	}
.home #nHome {
	display: none;
	}
.our-moves #nOur-moves, .video #nVideo, .news #nNews, .programs #nPrograms, .contact #nContact {
	text-transform: uppercase;
	font-weight: bold;
	border-radius: 8px;
	padding: 10px;
	padding: 25px 10px 20px 10px;
	background: #000;
	}
.our-moves #nOur-moves a:hover, .video #nVideo a:hover, .news #nNews a:hover, .programs #nPrograms a:hover, .contact #nContact a:hover {
	color: #fff;
	opacity: 1;
	}
#nFB {
	position: relative;
	top: 1em;
	}
#nFB a {
	border-bottom: 0;
	}

@media screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  #drawer ul {
	  margin-top: -6em;
	  }
}

@media screen 
and (min-width :768px) 
and (max-width : 990px) {
	#drawer-toggle {
		display: none;
	}
	nav {
		width: 100%;
		max-width: 1150px;
		margin-top: 0;
		margin-right: auto;
		margin-left: auto;
		background: none;
		}
	
	#drawer {
		width: 100%;
		height: 50px;
		text-align: center;
		position: relative;
		top: 0em;
		background: #c41c1c; /* red */
		}
	#drawer ul {
		width: 100%;
		height: 50px;
		/*margin-top: -7em;*/
		margin-top: -6em;
		margin-left: 0;
		background: none;
		}
	.video #drawer ul {
		margin-top: 0;
		background: none;
		}
	#drawer ul li {
		display: inline;
		background: none;
		}
	#drawer ul li a {
		color: #fff;
		font-size: 150%;
		text-decoration: none;
		margin: 0 10px;
		padding: 7px;
		background: none;
		}
	#drawer li a:hover {
		color: #000;
		}
	#nFB {
		position: relative;
		top: 1em;
		}
	}


@media screen 
and (min-width : 526px) 
and (max-width : 767px) {
		/***** menu *****/
		/* Makes sure that everything is 100% height */ 
		/*html,body { 
		height: 100%; 
		overflow: hidden; 
		}  */
		
		/* gets \ actual input out of the way; 
		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; 
			top: 15px;
			left: 15px; 
			height: 50px; 
			width: 50px; 
			display: block; 
			position: fixed; 
			background: rgba(255,255,255,.0);
			z-index: 1; 
			} 
		
		/* menu icon */ 
		#drawer-toggle-label:before { 
			content: ''; 
			display: block; 
			position: absolute; 
			height: 3px; 
			width: 20px; 
			background: #ccc; 
			left: 10px; 
			top: 10px; 
			box-shadow: 0 6px 0 #ccc, 0 12px 0 #ccc; 
			}  
		
		header { 
			width: 100%;
			background: #fff;
			background-image: url(img/bnnr-mobile.jpg);
			background-repeat: no-repeat;
			background-size: 100%;
			background-position: 0 28px;
			z-index: 0;
			}
		
		/* drawer menu pane - note the 0px width */ 
		#drawer { 
			position: fixed; 
			top: 0; 
			left: -300px; 
			height: 100%; 
			width: 300px; 
			background: #c41c1c; 
			overflow-x: hidden; 
			overflow-y: scroll; 
			padding: 20px; 
			-webkit-overflow-scrolling: touch; 
			} 
		
		/* actual page content pane */ 
		#page-content, #contact #page-content { 
			margin-left: auto;
			margin-right: auto;
			width: 100%; 
			height: calc(100% - 50px); 
			overflow-x: hidden; 
			overflow-y: scroll; 
			-webkit-overflow-scrolling: touch; 
			}
		
		/* checked styles (menu open state) */ 
		#drawer-toggle:checked ~ #drawer-toggle-label { 
			height: 100%; 
			width: calc(100% - 300px); 
			background: rgba(255,255,255,.8);
			} 
		
		#drawer-toggle:checked ~ #drawer-toggle-label, 
		#drawer-toggle:checked ~ header { 
			left: 300px; 
			} 
		
		#drawer-toggle:checked ~ #drawer { 
			left: 0px; 
			} 
		
		#drawer-toggle:checked ~ #page-content { 
			margin-left: 300px; 
			}
		
		/* Menu item styles */ 
		#drawer ul { 
			margin-top: 0;
			list-style-type: none; 
			} 
		#drawer ul li {
			border-bottom: 1px dotted black;
			} 
		
		#drawer ul a {
			display: block; 
			font-size: 250%;
			color: #fff; 
			text-decoration: none; 
			font-weight: bold;
			padding: 20px; 
			} 
		
		#drawer ul a:hover { 
			color: #000; 
			}
		.video #nVideo {
			color: #ccc;
			text-transform: none;
			font-weight: normal;
			border-radius: 0;
			padding: 0;
			background: none;
			}
		.video #nVideo a:hover {
			}
		}
	
	
@media screen 
and (min-width : 240px) 
and (max-width : 525px) {
			#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; 
				top: 15px;
				left: 10px; 
				height: 50px; 
				width: 50px; 
				display: block; 
				position: fixed; 
				background: rgba(255,255,255,.0);
				z-index: 1; 
				} 
			
			/* menu icon */ 
			#drawer-toggle-label:before { 
				content: ''; 
				display: block; 
				position: absolute; 
				height: 3px; 
				width: 20px; 
				background: #ccc; 
				left: 10px; 
				top: 10px; 
				box-shadow: 0 6px 0 #ccc, 0 12px 0 #ccc; 
				}  
			
			header { 
				width: 100%;
				background: #fff;
				background-image: url(img/bnnr-mobile.jpg);
				background-repeat: no-repeat;
				background-size: 100%;
				background-position: 0 28px;
				z-index: 0; 
				}
			
			/* drawer menu pane - note the 0px width */ 
			#drawer { 
				position: fixed; 
				top: 0; 
				left: -300px; 
				height: 100%; 
				width: 300px; 
				background: #c41c1c; 
				overflow-x: hidden; 
				overflow-y: scroll; 
				padding: 20px; 
				-webkit-overflow-scrolling: touch; 
				} 
			
			/* actual page content pane */ 
			#page-content, #contact #page-content { 
				margin-left: auto;
				margin-right: auto;
				width: 100%; 
				height: calc(100% - 50px); 
				overflow-x: hidden; 
				overflow-y: scroll; 
				-webkit-overflow-scrolling: touch; 
				}
			
			/* checked styles (menu open state) */ 
			#drawer-toggle:checked ~ #drawer-toggle-label { 
				height: 100%; 
				width: calc(100% - 300px); 
				background: rgba(255,255,255,.8);
				} 
			
			#drawer-toggle:checked ~ #drawer-toggle-label, 
			#drawer-toggle:checked ~ header { 
				left: 300px; 
				} 
			
			#drawer-toggle:checked ~ #drawer { 
				left: 0px; 
				} 
			
			#drawer-toggle:checked ~ #page-content { 
				margin-left: 300px; 
				}
			
			/* Menu item styles */ 
			#drawer ul { 
				margin-top: 0;
				list-style-type: none; 
				} 
			#drawer ul li {
				border-bottom: 1px dotted black;
				} 
			
			#drawer ul a {
				display: block; 
				font-size: 250%;
				color: #fff; 
				text-decoration: none; 
				font-weight: bold;
				padding: 20px; 
				} 
			
			#drawer ul a:hover { 
				color: #000; 
				}
			.video #nVideo {
				color: #ccc;
				text-transform: none;
				font-weight: normal;
				border-radius: 0;
				padding: 0;
				background: none;
				}
			}