html {min-width: 320px;}

.tab a {
	font-size: 1em;
	padding: 15px;
	}
	
@media screen and (max-width: 1199px) { 

	.tab a {
		font-size: .85em;
		padding: 15px 10px;
		}
	
}
	
@media screen and (max-width: 975px) { 

	.logo .btn	{
		padding: 12px 16px;
		font-size: .9em;
		}

	.toggleMenu	{display: block;}
	.toggleMenu span	{position: relative;}

	.toggleMenu span:before	{
		content: "";
		position: absolute;
		top: 37%;
		left: 50%;
		margin-left: -55px;
		width: 16px;
		height: 2px;
		border-top: 6px double #fff;
		border-bottom: 2px solid #fff;
		}
	
	.nav	{
		background: #444; 
		text-align: center;
		padding: 0;
		}

	.tab 	{width: 100%;}

	.tab a {
		font-size: 1em;
		padding: 12px 15px;
		/* disable desktop current tab styles */
		color: #fff !important;
		background: none !important;
		}
	
	.tab a:hover, .nav > li.hover > a, .tab a:active 	{
		color: #fff !important;
		background: #666 !important;
		}
	
	.nav > li.hover > ul {
		width: 100%;
		position: static;
		}

	.sub	{
		position: relative;
		width: 100%;
		background: #e5e5e5;
		padding: 0;
		}
	
	.sub li a {
		color: #002f6c !important;	
		background: none !important;
		font-size: 1em;
		text-align: center;
		}
		
	.sub li a:hover	{
		color: #002f6c !important;	
		background: #fff !important;
		}

	.about .sub	{left: 0;}
	
	.section	{display: none;}
	
	.header h2	{font-size: 4em;}
	
	.info	{padding: 75px 25px;}

	.info .vp div	{width: 49%;}
	
}

@media screen and (max-width: 900px) { 

	.logo	{text-align: center;}

	.logo h1 a	{margin: 0 auto;}

	#social	{padding: 30px 20px;}

	.logo h1, .tagline, .logo p	{width: auto;}
	
	.logo p	{
		padding: 0 15px;
		margin: 0;
		text-align: center;
		}

	.header h2	{font-size: 3.5em;}

	.gallery_item	{
		width: 49%;
		transform: none;
		}
	
}

@media screen and (max-width: 775px) { 

	h3	{
		padding: 20px;
		font-size: 1.5em;
		}
	
	#social, .logo h1, .logo p	{display: block;}

	#social	{padding: 15px 20px 0 20px;}

	.logo h1	{padding: 0;}
	
	.logo p	{padding: 15px;}

	.header	{
		height: auto;
	    padding-bottom: 0;
		}

	.header h2	{
		position: relative;
		top: auto;
		transform: none;
		padding: 100px 50px;
		font-size: 3em;
		}
	
	.ext	{
		height: 0;
		padding-bottom: 50%;
		}

	.pane1, .pane2	{width: 100%;}
	
	.logos .gallery_item	{width: 32%;}

	.text	{
		padding: 25px;
		max-width: none;
		}
	
	.info	{padding: 50px 25px;}

	.info .vp div	{
		display: block;
		width: 100%;
		}
	
	.footer p	{
		padding: 0 40px;
		font-size: .8em;
		}
	
	#jump2top	{right: 0;}
	
}

@media screen and (max-width: 550px) { 
	
	h3	{
		padding: 15px;
		font-size: 1.25em;
		}
	
	.header h2	{
		padding: 50px 30px;
		font-size: 2.5em;
		}

	.copy .vp	{padding: 20px;}

	.gallery_item	{
		display: block;
		width: 100%;
		}
	
	.logos .gallery_item	{display: inline-block;}

}

@media screen and (max-width: 500px) { 
	
	.ext	{padding-bottom: 80%;}

}

@media screen and (max-width: 468px) { 
	
	.logos .gallery_item	{width: 48%;}

}