/*Stop the menu from getting hidden after opening/closing it in portrait, then switching to full width*/
@media screen and (min-width: 986px) {
	
	#mainNav .menu-pulldown {
		display: block !important;
	}
	#mainNav #menu-icon {
		display: none !important;
	}
}	
@media screen and (max-width: 985px) {

	/*Basic stuff for any mobile device*/
	
	* {
		max-width: 100% !important;
		min-width: 0px !important;
		position: static;
	}
	
	body {
		background-size: contain;
		min-width: 0px;
		max-width: 100%;
	}
	/*center div, remove float*/
	#links #social, #searchForm, #main #lefttext, #banner_shadow, #wrapper .searchformbox, #wrapper a.login, #links a.login, #newsRow, #content {
		float: none;
		clear: both;
		margin-left: auto;
		margin-right: auto;
		position: static !important;
	}
	
	#masthead {
		height: auto;
	}
	#masthead #logoimg {
		padding: 3px 0 0px 10px;
	}
	#masthead #text {
		position: static;
		float: right;
		padding: 35px 25px 0;
		margin: 0;
	}
	#social{ width: 60px; }
	#searchForm { width: 200px; }
	#links .searchformbox { position: static; float: left;}
	#main { width: 100%; }

	header { 
		background-image: none; 
		background-color: #003399; 
		height: auto; 
		padding-top: 25px;}
	#wrapper, #news {
		position: static;
		height: auto;
	}
	#newsRow { width: 800px; margin: 20px auto 0;}
	#wrapper { 
		width: 500px; 
		margin-top: 25px; 
		margin-left: 15px;}
	#wrapper #searchbox { 
		width: 500px; 
		height: auto; }
	#wrapper .imagetiles {
	    width: 360px;
		padding: 1% 14% 10%;
	}
	#wrapper a.login, #links a.login { 
		display: block; 
		width: 150px; 
		text-align: center;
		margin-top: 10px;}
	
	#main #lefttext {
		position: relative !important;
		top: -30px;
		width: 581px;
	}
	#content {
		width: auto;
		margin: 0 10%;
	}
	/*slidedown navigation, for any width under desktop size*/

	#mainNav {
		padding: 0;
		height: auto;
		background: url('/images/bac_dark_purple_blue.png') top left repeat-x;
	}
	#mainNav .menu-pulldown {
		background: #333;
		height: auto;/*allow to expand*/
		width: 100%;
		float: none;
		margin: 0px auto;
		padding: 0px !important;
		display: none;
		overflow: hidden;
	}
	#mainNav .menu-pulldown {padding-left: 0;}
	#mainNav .cmsRegion {
		width: 100%;
	}
	/*button for toggling navigation*/	
	#menu-icon {
		height: 35px;
		width: 100%;
		display: block !important;
		zoom: 1;
		padding: 4px 0;
	}
	#menu-icon:after {
		float: left;
		clear: both;
		display: table;
		content: " ";
	}
	#menu-icon .centertext {
		display: block;
		width: 120px;
		margin: 0px auto;
		padding: 0;
		margin-top: -1px;
		height: 35px;
		float: none;
		clear: both;
		
		text-transform: uppercase;
		text-align: left;
		color: #ffffff;
	}
	#menu-icon img {
		vertical-align: middle;
		padding-right: 5px;
	}

	#mainNav ul { width: 100%; }

	#mainNav .menu-pulldown > ul {
		padding-bottom: 15px;
	}
	
	#mainNav ul.level2, #mainNav ul.level3, #mainNav ul.level4 {
		/*height: auto !important;*/
		position: static !important;
		float: none;
		clear: both;
		margin: 0px auto!important;
		padding: 0px !important;
		width: auto;
		
		background: none transparent;
	  box-shadow: none;
	  border: none;
	}
	#mainNav li li {
		background-color: transparent;
		border: 0px;
		float: none;
		clear: both;
	}
	#mainNav li {
		background: url('/images/bac_dark_gray.png') top left repeat black;
	}
	#mainNav li li {
		background: url('/images/bac_navy_blue.png') top left repeat #8e1e16;
	}
	#mainNav li a {
		width: 200px;
		float: none;
		clear: both;
		margin: 0px auto;
		height: 25px;
		padding: 10px 0px 5px 10px;
		position: relative;
	}
	.expand-icon {
		background: url("/images/icon_mobile_nav_arrow.png") no-repeat scroll right center transparent;
		position: absolute;
		top: 5px;
		right: 0px;
		display: block;
		width: 16px;
		height: 30px;
	}
	#mainNav a.activeLink {
		color: #fff !important;
	}
	#mainNav ul.level2 > li > a {
		padding-left: 35px;
	}
	#mainNav ul.level3 li a {
		padding-left: 48px;
	}
	#mainNav ul.level4 li a {
		padding-left: 55px;
	}
	#mainNav li a:hover {
		text-decoration: underline;
		color: #ffffff !important;
	}
	#mainNav li li a {
		padding-left: 18px; !important
	}
	#mainNav li, #mainNav a {
		background-color: transparent !important;
		border: none !important;
		display: block;
		float: none;
		clear: both;
		padding: 0px;
		height: auto;
		text-align: left;
		width: auto;
	}	
	#mainNav .cmsRegion > div { width: 100% !important; }/*Prevents width value in CMS settings from overriding*/
	
	/*double lines in link - pad differently*/
	#mainNav li.link4 li.link10 a {
		padding-top: 8px;
		padding-bottom: 11px;
	}
	
	/*Footer navigation*/
	#submenu .menu_block {
	    width: 19%;
	    padding: 0px 0px 0px 5px;
	}

}
@media screen and (max-width: 767px) { 	
	#mainNav {background: #333;}
	#wrapper, #news, #masthead #text, #masthead #logoimg {
		float: none;
		clear: both;
		margin: 0 auto;
		width: auto;
	}
	#masthead {
		background: #121245;
		height: auto;
	}
	#masthead #logoimg {
		width: 300px;
		padding: 15px 0 0;
	}
	#masthead #text {
		position: static;
		width: 300px;
		padding: 15px 5px;
	}
	#wrapper {
		background: #121245;
		margin-top: 10px;
	}
	#news .newsstory {
	    width: auto;
	    padding: 1% 0;
	    margin: 0 5%;
	    float: none;
    }
	#wrapper #searchbox {
		background: none transparent;
		width: 100%;
		border-radius: 0;
		padding-top: 20px;
	}
	#wrapper .imagetiles {
		background: none transparent;
		width: 530px;
		padding: 0px;
		margin: 0px auto;
		float: none;
		clear: both;
		overflow: hidden;
		padding-bottom: 30px;/*So it doesn't cut off the images*/
	}
	
	
	#content {
		width: auto;
		padding: 0;
		margin: 5%;
	}
	
	#footerbac { display: none; }
	#copyright {
		border-top: 15px solid #000033;
		padding-top: 31px;}
	#copyright img, #copyright span.text {
		display: block;
		float: none;
		clear: both;
		margin: 0 auto;
		text-align: center;
	}
}
@media screen and (max-width: 550px) {
	#wrapper .imagetiles {
		width: 349px;
	}
}
@media screen and (max-width: 640px) { 
	#main header #lefttext {
		position: static !important;
		width: 400px;
		padding: 0 0 25px 0;
	}
	#banner_shadow {
		background-image: none;
		height: auto;
	}
	#main #banner {
		background: none transparent;
		border-radius: 0;
		border-width: 0;
		float: none;
		clear: both;
		margin: 0 auto;
		min-height: 0;
		width: 400px;
		padding: 0;
	}
	#banner .slideshowzone {
		height: 205px !important;
	}
	#banner img, #banner .slideshowzone a {
		width: 100% !important;
		height: auto !important;
	}
}
@media screen and (max-width: 415px) {
	#main #banner {
		width: 350px !important;
	}
	#banner .slideshowzone {
		height: 155px !important;
	}
	#main header #lefttext {width: 350px;}
}
@media screen and (max-width: 370px) {
	#main #banner {
		width: 300px !important;
	}
	#banner .slideshowzone {
		height: 135px !important;
	}
	#main header #lefttext {
		width: auto;
		margin: 5%;}
}
@media screen and (min-width: 641px) {
	#banner .slideshowzone {
		width: 566px;
		height: 234px;
	}
}
@media screen and (max-width: 480px) {/**/

}
@media screen and (max-width: 420px) {/**/
	#wrapper .imagetiles {
		width: 360px;
	}
	div.imagetiles div.icon_block {
	    margin: 5px;
	}
}
@media screen and (max-width: 365px) {
	#wrapper .imagetiles {
		width: 300px;
	}
	div.imagetiles div.icon_block {
		width: 130px;
		height: 125px;
	}
	div.imagetiles .icon_block p {
		height: 30px;/*Style for two-line so all icon blocks are same height*/
	}
	div.imagetiles img {
		width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 300px) {
	#wrapper .imagetiles {
		width: 178px;
	}
	div.imagetiles div.icon_block {
		width: 165px;
		height: 135px;
		float: none;
		clear: both;
	}
	div.imagetiles .icon_block p {
		height: 30px;/*Style for two-line so all icon blocks are same height*/
	}
	div.imagetiles img {
		width: 100%;
		height: auto;
	}
}