.overlay.active {z-index: 10;}

.navbar-default {
	background-color: transparent;
	border-color: transparent;
}

.navbar .container .navbar-header {background-color:transparent;}

.navbar-wrapper ul.navbar-nav { 
	margin-left: 0px;
	margin-top: 40px;
	border-radius: 3px;
	background-color: rgba(0, 0, 0, 0.19); }

.navbar-wrapper ul.navbar-nav>li>a {
	color: #FFF;
	font-family: 'Khand', sans-serif;
	font-weight: 500;
	text-transform: none;
	font-size: 16px;
 }

.navbar-toggle {
	margin-top: 25px;
	border-color: #fff;
	border-radius: 0px;
}
.navbar-toggle .icon-bar { background-color: #fff; }

.navbar-wrapper .navbar-default .navbar-nav>li>a { color: #FFF; }
.navbar-brand {
	width: 200px;
	height: 80px;
	padding: 0;
}
h1.nav-logo {
	background: url('http://www.protogen.com.au/Portals/0/Images/PGN-Logo-White.svg');
	background-repeat: no-repeat;
	background-size: 100% auto;
	height: inherit;
	padding: 0;
	margin: 20px 0 0 0;
}

.navbar-wrapper ul.navbar-nav>.active>a,
.navbar-wrapper ul.navbar-nav>.active>a:focus,
.navbar-wrapper ul.navbar-nav>.active>a:hover {
	background-color: transparent;
	color: #F44336;
}
.navbar-wrapper ul.navbar-nav>li>a:focus,
.navbar-wrapper ul.navbar-nav>li>a:hover {
	background-color: transparent;
	color: #F44336;
}


.navbar .container>.navbar-collapse {z-index: 200;}


@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
.navbar .container>.navbar-collapse {width: 70%; left: -70%; background-color: #F44336; }
.navbar-wrapper ul.navbar-nav { margin-top: 0;}
.navbar-wrapper ul.navbar-nav {background-color: transparent;}
.navbar-wrapper ul.navbar-nav>li>a {color: #000;border-bottom: 1px solid #c3362b;}
.navbar-wrapper ul.navbar-nav>.active>a,
.navbar-wrapper ul.navbar-nav>.active>a:focus,
.navbar-wrapper ul.navbar-nav>.active>a:hover {color: #fff; background-color: #c3362b;}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
#heroImage {height: 550px;}
.heroText {top: 160px; bottom: 0;}
.navbar-wrapper ul.navbar-nav {background-color: #F44336;}
.navbar-wrapper ul.navbar-nav>li>a {color: #fff;border-bottom: 1px solid #c3362b;}
.navbar-wrapper ul.navbar-nav>.active>a,
.navbar-wrapper ul.navbar-nav>.active>a:focus,
.navbar-wrapper ul.navbar-nav>.active>a:hover {color: #fff; background-color: #c3362b;}
.nav>li>a { padding: 10px;}


}