.mobile-menu {
	display: none;
}

/* #Media Queries
================================================== */

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		.mobile-menu {
			display: block;
			background: #76151c;
			width: 100%;
			z-index: 101;
		}
		.mobile-menu .content {
			display: none;
		}
		.mobile-menu ul { 
			padding: 0;
			margin: 0;
		}
		.mobile-menu ul ul {
			display: none;
			background: #a51e27;
		}
		.mobile-menu ul li {
			margin: 0;
			padding: 0;
			list-style: none;
			border-top: 1px solid #a51e27;
		}
		.mobile-menu ul li > a, 
		.mobile-menu ul li.expanded > span { 
			padding: 15px 0;	
			display: block;
			text-decoration: none;
			color: #fff;
			background: url(../images/nav-arrow-down.png) no-repeat right center;
		}
		.mobile-menu ul li.active > a, 
		.mobile-menu ul li.active.expanded > span { 
			background: url(../images/nav-arrow-up.png) no-repeat right center;
		}
		.mobile-menu ul li.expanded span {
			position: relative;
			cursor: pointer;
		}
		.mobile-menu li.expanded.first {
			border: 0;
		}
		.mobile-menu ul ul > li a, 
		.mobile-menu ul ul > li.active a {
			padding: 10px 10px 10px 21px;	
			color: #fff;
			font-size: 1em;
			background: url(../images/nav-arrow.png) no-repeat left center;
		}
		.mobile-menu .content ul ul li, 
		.mobile-menu ul li a, 
		.mobile-menu ul li.expanded span {
			margin: 0 auto;
			width: 420px;
		}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		.mobile-menu .content ul ul li, 
		.mobile-menu ul li a, 
		.mobile-menu ul li.expanded span {
			width: 300px;
		}
	}
