/* Responsive styles */

.navbar-toggle { position: relative; float: right; padding: 6px 8px; margin-right: 15px;   margin-bottom: 8px; border: 1px solid transparent; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; cursor:pointer; }
.navbar-inverse .navbar-toggle { margin-top: -33px; margin-bottom:0; background: #0A1C32; }
.navbar-inverse .navbar-toggle:hover .icon-bar{ background-color:#D6791A; }
.navbar-inverse .navbar-toggle .icon-bar { background-color: #FFF; }
.navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; }
.navbar-toggle .icon-bar + .icon-bar { margin-top: 4px; }

.navbar-toggle { display: none; }

.collapse.in{display:block}
.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition:height .35s ease;transition:height .35s ease}

@media screen and (max-width: 800px) {
	body{overflow-x: hidden}
	#content_wrap, #footer, #subfooter{ width: 98%; padding-left:1%; padding-right:1%; }
	#nav{ width:100% !important; }
	.pgheader{ width:100% !important; }
	.pgcontent{ width:65%; display:table-cell; vertical-align:top; }
	.pgleft{ width:25%; display:table-cell; }
	#nav{ display:table; }
	#nav a{ display:table-cell; text-align:center; }
}

@media screen and (max-width: 700px) {
	.pgcontent, .pgleft{ width:99%; display:block; float:none; padding-top: 10px; padding-bottom: 10px; padding-left:0.5%; padding-right:0.5%; }
	.pgcontent{ border-left:0; }
}

@media screen and (max-width: 640px) {
	#nav{ padding-top: 35px; }
	#nav_wrap{ height:auto; }
	.navbar-toggle{ display:block; }
	.collapse { display: none; }
	#nav .nav-container { display: block !important; width: 100% !important; padding-bottom:10px; margin-top:0; } 
	.navbar-inverse{ background-color:rgba(10, 28, 50, 0.6); position:relative; }
	#nav .nav-container a { display: block !important; text-align:center; padding:0; }
	#nav .nav-container a:hover{ background-color:rgba(10, 28, 50, 0.4); }
	.pgheader h3{ width: 50%; }
}

@media screen and (max-width: 480px) {
	#header{ width:100%; padding-top: 25px; }
	#header h1{ float: none; width: 100%; background-position: center center; margin-top:0; }
	#subfooter{ text-align:center; }
	.pgheader{ height:auto !important; text-align:center; }
	.pgheader a.crumb{ display:block; float:none; }
	.pgheader a.learnmore{ display:inline-block; float:none; margin: 5px 0; }
	.pgheader h3{ float: none; height: auto; width: 100%; }
	.contact-form table{ width:98%; }
	.contact-form textarea{ width:100%; }
	.contact-form input[type="text"]{ width:100%; }
}

@media screen and (max-width: 320px) {
	#header h1{ background-size: 94%; }
}