/* ==========================================================================
   Media Queries 768
   ========================================================================== */
@media only screen and (max-width: 768px) {

	/* ============= Nav ===============*/
	#nav{ 
		display: none; 
	}
	
	#nav-wrap {
		position: relative;
	}
	#nav li.nav-parent{
		padding-bottom: 0;
	}
	#menu-icon {
		display: inline-block;
		cursor: pointer;
		padding: 10px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
	}
	div.header-container nav{
		margin-top: 0;
	}
	#nav {
		clear: both;
		position: absolute;
		top: 40px;
		min-width: 160px;
		z-index: 10000;
		padding: 5px;
		display: none; 
		right: 0px;
		background: #646d72;
		-webkit-border-radius: 3px 0px 3px 3px;
		border-radius: 3px 0px 3px 3px;
	}
	#nav li {
		clear: both;
		float: none;
	}
	#nav a, #nav ul a {
		font: inherit;
		background: none;
		display: inline;
		padding: 0;
		border: none;
		color: #fff;
	}
	#nav a:hover, #nav ul a:hover{
		color: #ffc000;
	}
	#nav ul {
		width: auto;
		position: static;
		display: block;
		border: none;
		background: inherit;
	}
	#nav ul li a{
		padding-left: 0;
	}
	#nav ul.sub-menu li a:before{
		content: "g";
		font-family: 'bulletsregular';
		position: relative;
		top: 0px;
		left: 0em;
	}
	#nav ul.sub-menu ul.sub-menu li a:before{
		left: 0;
	}
	/* ============= header ===============*/	
	#masthead{
		display: block;
		height: auto;
	}
	.cta h1{
		font-size: 72px;
	}
	.cta h3{
		font-size: 22px;
	}
	
	/* ============= Main Container General Layout Styles===============*/
	div.header-container header{
		padding: 30px 0 25px;
	} 
	.main-content, .right-aside{
		width: 100%;
		float: none;
		border: none;
		padding-left: 0;
		padding-right: 0;
	}
	.main-container{
		padding: 25px 0 50px;
	}
	.right-aside{
		border-top: 1px solid #cad2d7;
		margin-top: 25px; 
	}
	/* ============= Columns ===============*/ 
	.third, .half, .fourth, .two-thirds, ol.icon-lists li, ul.flag-lists li, .three-fourths, .foot.left, .foot.right, input.half, input.full{
		width: 100%;
		margin-right: 0%;
		float: none;
	}
	.third, .half, .fourth, .two-thirds, .three-fourths{
		margin-bottom: 30px;
	}
	blockquote.third, blockquote.half, blockquote.fourth, blockquote.two-thirds{
		width: 100%;
	}
	blockquote, blockquote.right, blockquote.left{
		margin: 0;
	}
	ul.archive li{
		min-width: 28%;
	}
	.foot.left, .foot.right{
		display: block;
		text-align: center;
		margin-bottom: 20px;
	}
	h6.tags.right, h6.date.left{
		float: none!important;
	}
	ul.filters li{
		display: block;
		border: none;
		border-bottom: 1px solid #CAD2D7;
		text-align: left;
		margin-right: 0;
	}
	ul.filters li a{
		display: block;
	}
	footer .wrapper .mosaic-block{
			border-width: 5px;
			margin-top: 1em;
			margin-bottom: 1em;
		}
		footer .wrapper .third .third, footer .wrapper .third .third.last{
			width: 45%;
			float: left;
			margin-right: 0%;
		}
	
		footer .wrapper .third .third:nth-child(2n+1){
			margin-right: 5%!important;
		}
	
 }
 
 
 /* ==========================================================================
    Media Queries 600
    ========================================================================== */
 @media only screen and (max-width: 600px) { 
 
 	.logo{
 		padding-bottom: 20px;
 	}
 	.main-content img{
 		width: 100%;
 	}
 	.backstretch{
 		opacity: 0.2;
 	}
 	.cta.two-thirds{
 		width: 100%;
 		margin-right: 0%;
 		float: none;
 	}
 	.cta h1{
 		font-size: 62px;
 	}
 	.cta h3{
 		font-size: 18px;
 	}
 
 	
 	/* ============= Tables ===============*/
 		.main table{ 
 			border-left: 1px solid #cad2d7;
 			border-right: 1px solid #cad2d7;
 			border-top: none;
 			border-bottom: none;
 		}	
 }
 
 

/* ==========================================================================
   Media Queries 480
   ========================================================================== */
@media only screen and (max-width: 480px) { 
	 input[type=text],  input[type=email], input[type=password], textarea, a.btn, input[type=button], input[type=submit]{
		padding: 10px 2%;
		width: 96%;
	}
	a.btn, input[type=button]{
		text-align: center;
	}
	a.small-btn{
		font-size: 14px;
		padding: .4em 2%;
	}
	a.xsmall-btn{
		font-size: 12px;
		padding: .2em 2%;
	}
	iframe{
		max-height: 320px;
	}
	#menu-icon{
		display: block!important;
		padding-left: 3%!important;
		padding-right: 3%!important;
		width: 94%!important;
	}
	.header-container header{
		text-align: center;
	}
	.logo{
		float: none;
	}
	#header_logo{
		float: none;
	}
	div.header-container nav{
		float: none;
		margin-top: 0em;
	}
	#nav{
		padding-left: 3%!important;
		padding-right: 3%!important;
		width: 94%!important;
		left: 0;
	}
	#nav li{
		padding: 0;
	}
	.hide-480{
		display: none;
	}
	#nav ul.sub-menu ul.sub-menu li{
		padding-left: 0;
	}
	#nav ul li a:before{
		display: none;
	}
	.statistics{
		text-align: center;
		display: block;
	}
	.statistics ul{
		display: inline;
	} 
	.statistics ul li, .statistics ul li:last-child{
		display: block;
		border-top: 1px solid #cad2d7;
		border-right: none;
	}
	.statistics ul li{
		margin-bottom: 2em;
	}
	.statistics ul li:last-child{
		margin-bottom: 0;
	}
	.cta h1{
		font-size: 42px;
	}
	.cta h3{
		font-size: 18px;
	}
	.cta h5, .cta p{
		display: none;
	}
	/* ==========================================================================
	   TABS
	   ========================================================================== */
	.tab-nav {display: none;}
			
	h4.v_nav {
		font: 20px 'robotobold';
		margin: 0;
		background: #EDEDED;
		text-align:center;
		margin-top: 0px;
		display: block;
		cursor: pointer;
			-webkit-touch-callout: none;
			-webkit-user-select: none;
			 -khtml-user-select: none;
			   -moz-user-select: none;
				-ms-user-select: none;
					user-select: none;
			border-bottom-style: solid;
			border-bottom-width: 1px;
			padding: .5em 0;
		}
		.tab-content-block {
			clear:both;
			position:relative;
			width: 100%;
			background: #fff;
			border: 1px solid #D9D6CF;
		}
		h4.v_nav:first-child {
			margin-top: 0;
		}
		h4.v_active {
			z-index:50;
		}
}



 
/* ==========================================================================
   Media Queries 1140
   ========================================================================== */  
@media only screen and (max-width: 1140px) { 
	.wrapper, #content.widecolumn { width: 92%; margin: 0 4%; }
}



/* ==========================================================================
   Media Queries Min 768
   ========================================================================== */ 
@media screen and (min-width: 768px) {
#nav {
	/*display: block !important;*/
}
}