/* 	Titan CMS base 6.4 RESPONSIVE DESIGN */

/* breakpoints - use these as class names also
	.phone mobile first
	.tablet starts at 715px (includes browser scrollbar)
	.desktop starts at 980px (includes browser scrollbar) - not really using it's more like 1100
*/
@import 'blocks.css';
@import 'MPSShared.css';
.Button,.Background,.FloatLeft,.FloatRight,.Accordion,.AccordionBold,.BlueBorder,.Connect,.ContactUs,.DepartmentContacts,.DepartmentDivisions,.FloatBlockLeft30,.FloatBlockLeft50,.FloatBlockLeft70,.FloatBlockRight30,.FloatBlockRight50,.FloatBlockRight70,.HalfWidth,.LearnMore,.RedBorder,.Spotlight,.Toolbox,.AZFilter,.NoBackground,.YouTube,.NoDescription{}

/* ========================================================================================== layout === */
	/* logo */
	#pageTopArea  #logoControlContainer{margin-top:7px;width:170px;height:58px;margin-bottom:5px;}
	#pageTopArea  #logoControlContainer a{display:block;}
	#logoControlContainer{float:left;}
	#logoControlContainer img{height:100%;width:100%;max-width:auto;}
	@media screen and (min-width:715px){#pageTopArea  #logoControlContainer{width:244px;height:83px;margin-bottom:7px;}}
	@media screen and (min-width:800px){#pageTopArea  #logoControlContainer{width:283px;height:97px;}}	
		
		/* utility & search */
		#pageTopArea .searchBarContainer{margin-top:4px;margin-right:10px;padding:3px 8px;width:80%}
		.searchBarContainer .search{display:inline-block;height:22px;right:5px;top:9px;width:25px;}
		#pageTopArea .languages ul,
		#pageTopArea .staff ul{margin:0;padding:0;}
		.searchBarContainer input[type="text"]{width:70%}
		@media screen and (min-width:715px){
			#toolWrapper .utilityNavContainer,#toolWrapper .searchBarContainer{clear:both;float:right;}
			#toolWrapper .utilityNavContainer ul{padding-left:25px;}
			#toolWrapper ul,#toolWrapper .languages,#toolWrapper .staff,#toolWrapper li{float:left;}
			#pageTopArea .languages ul{display:none;margin:0;padding:13px;right:0;top:23px;}
			#pageTopArea .staff ul{display:none;margin:0;padding:13px;left:0;top:23px;}
			#toolWrapper .utilityNavContainer ul li{padding:2px 5px 7px 5px}	
			#pageTopArea .languages p,
			#pageTopArea .staff p{margin-left:8px;padding:8px 10px 6px 10px;}
			#toolWrapper .utilityNavContainer .languages ul,
			#toolWrapper .utilityNavContainer .staff ul{margin:6px 2px 0 0;padding:13px;}
			#toolWrapper .utilityNavContainer .languages ul li,
			#toolWrapper .utilityNavContainer .staff ul li{display:block;float:none;margin:0;padding:0;}	
			#toolWrapper .languages ul li a,
			#toolWrapper .languages ul li span,
			#toolWrapper .staff ul li a{display:block;padding:5px 0;}			
			#toolWrapper .searchBarContainer{width:auto;}
			.searchBarContainer .search{right:5px;top:7px;width:20px;}
		}
		@media screen and (min-width:800px){
			#toolWrapper .utilityNavContainer{padding-right:25px;}
			#toolWrapper .searchBarContainer{margin-right:35px;}
		}
		@media screen and (min-width:990px){
			#toolWrapper .utilityNavContainer,
			#toolWrapper .searchBarContainer{clear:none;float:left;}
			#toolWrapper .searchBarContainer{margin-right:0;}
		}
		
	/* top nav desktop */
	@media screen and (min-width:715px)
	{
	    .topNav .dropdown{display:none;left:5px;margin:0;padding:0;width:99%;}
		.topNav .dropdown div,.topNav .dropdown div p{margin:0;padding:0;}
		.topNav .dropdown div{clear:none;float:left;padding:25px 1% 1% 1%;width:48%;}
		.topNav .dropdown div + div + div{clear:left;}
		.topNav .dropdown div + div + div + div{clear:none;}
		.topNav .dropdown strong{display:block;margin:0 0 5px 0;padding-bottom:5px;width:100%;}
		.topNav li .dropdown a{padding:0;}
		.topNav .dropdown .HalfWidth{width:97%}
		.topNav .dropdown .FormEditor div{padding:0;width:100%;}
		.topNav .dropdown ul li{padding:2px 0;}
	}	
	@media screen and (min-width:715px) and (max-width:989px){
		.topNav .dropdown .CenterZone{height:auto!important;}
	}	
	@media screen and (min-width:860px){
		.topNav  .dropdown a{margin:9px 0}	
		.topNav  .dropdown strong a{margin:0}
	}
	@media screen and (min-width:990px){
		.topNav .dropdown .CenterZone{height:225px;}
		.topNav .dropdown div{width:23%;}
		.topNav .dropdown .HalfWidth{width:47%}
		.topNav .dropdown div + div + div{clear:none;}
	}
	
	/* page tools */
	.pageTools{width:132px;}
	@media screen and (min-width:880px){.pageTools{width:120px;}}
	
/* footer */
	#bottomContainer  #emailUs{clear:both;position:static;float:none;}
	#bottomContainer  #address{margin-top:0;}
	#bottomContainerWrapper #connect a{display:inline-block;margin:7px;}
	#emailUs{width:100%;}
	#emailUs input[type="text"]{margin-bottom:20px;padding:5px;}
	@media screen and (min-width:715px){
		#bottomContainer  #address{padding-top:0;width:29%;margin:0 0 20px 0 ;}
		#bottomContainer  #resources{margin:0 0 20px 4%;width:29%;margin-top:0;}	
		#bottomContainer  #connect{float:left;width:29%;margin:0 0 20px 4%;}
		#bottomContainer  #emailUs{width:100%;}
	}
	@media screen and (min-width:870px){
		#bottomContainer  #connect{width:21%;margin-top:0;}
		#bottomContainer  #address{width:21%;margin-top:0;}
		#bottomContainer  #resources{width:21%;margin-top:0;}	
		#bottomContainer  #emailUs{position:absolute;top:-87px;right:1%;width:25%}
	}
	@media screen and (min-width:990px){
		#emailUs a{clear:none;margin-top:9px;}
	}
