/* CSS Document */
/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (min-width: 960px) {
		
		}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 0) and (max-width: 959px) {
		header{ padding: 0;}
		#hd-logo{ display:block;}
		body#inner nav,nav{ width:auto;float:none; margin:0; padding:0; max-width:100% !important;}
		nav ul li{ vertical-align: middle; line-height:15px; width:16%;}
		body#inner nav ul li a,nav ul li a{ margin: 0 12%; padding:55px 0 20px !important;}
		#header-right{display:none;}
		#social-media a{display: inline-block;float: none;padding: 10px 25px 10px 0;width: 30px;}
		#banner { width:100%; float:none;}
		#banner img{ width:100%; height: auto;}
		#main{ background:none;}
		aside#sidebar2{margin: 0;}
		aside#sidebar2 .vv{display:none;}
		aside#sidebar2 .log{display:none;}
		aside#sidebar2{float:none; width: auto;}
		#social-media{ border-radius: 0; padding: 0;margin:0; text-align:center;}
		aside{ width: auto; margin:0; padding:0 10px; float:none;}
		#content {margin:0; padding:5px 0; min-height:100px; width:auto !important; float:none !important;}
		.map{ margin:0 auto; padding:0; display:block;}
		aside #side2{ min-height:50px;}
		#content article dl.strlc dd.leftcontent { max-width: 25%;}
		#content article dl.strlc dd.rightcontent { max-width: 75%;}
		#content .announce p span{ display: inline;}
		#content .location-box dl{min-width: 270px;}
		#content h1{ text-align:center;}
		#social-media{background:#DFDFDF; border: 1px solid #000;}
		#content-top .caption{margin: 0 10px;}
		}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 480px) {
			
		/* contact form */
		.contactBox { width:90% !important; text-align:center !important; padding:0 !important;}
		.contactBox-left,.contactBox-right { float:none !important; width:100% !important; padding:15px 0 0 0 !important;}
		.contactForm { width:90% !important;}
		.contactForm label { padding-left:15px !important;}
		.contactForm input[type=text] { width:90% !important;}
		.contactForm textarea { width:90% !important;}
		
		article .boxes{ width: 80%;}
		.cntcleft, .cntcright{ float:none; max-width:100%; width:auto; padding:0 20px;}
		
		#banner .caption{ display: none;}
		}

	
	@media only screen and (min-width:0) and (max-width:640px){
		nav { width:100% !important; max-width:100% !important; margin:0 auto !important; height:auto !important; background:none !important; min-height:20px !important;}
  		nav ul { width: 100%; display: none;}
  		nav ul li { width:auto !important; display:block; float:none !important; border:0 !important;line-height:120% !important;height:auto !important;padding:0 !important;margin:0 !important;}
		nav ul li a {background:#222222 !important;margin:0 !important;border-bottom:1px solid #283744; height:28px !important;color:#fff;padding-top:13px !important;}
		nav a {text-align: left !important; height:auto; width: 100%; text-indent: 25px !important;background:#283744;}
		nav a#pull {display: block !important;width: 100% !important;position: relative !important; height:40px; line-height: 40px; color:#fff !important; border-top: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF;}
		nav a#pull:after {content:"";	background: url('../images/nav-icon.png') no-repeat;width: 30px;height: 30px;display: inline-block;
		position: absolute;	right: 15px;top: 10px;	}	
		#content article dl.strlc dd{ display:block; max-width:100% !important ; width:auto; float:none !important;}
		#content article dl.strlc dd.leftcontent p, #content article dl.strlc dd.rightcontent p span{ display:block; text-align:center;}
	}	





