/* Large screen displays & iPad in Landscape */
@media screen and (max-width: 1030px) {
	#topEC, #pageWrapper, #footer {width: 86%;margin-left: 7%;}
	.imageStyle, video, object, embed { max-width: 100%; height: auto; }
}

/* Medium screen displays & iPad in Portrait */
@media screen and (max-width: 770px) {
	#topEC, #pageWrapper, #footer {width: 92%;margin-left: 4%;}
	.imageStyle, video, object, embed { max-width: 100%; height: auto; }
}

/* Small screen Styles */
@media screen and (max-width: 480px), (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
	html {-webkit-text-size-adjust:none;}

	.imageStyle {max-width: 100%;height: auto;}

	#topEC, #pageWrapper, #footer, #contentContainer {width: auto !important;margin-left: 0 !important;}

	#shadowWrapper {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}

	#sidebarContainer, #subMenu, #sub2Menu, #topECWrapper, #extraContainer3 {display: none;}

	#pageWrapper {padding-top: 15px;min-height: 0;}
	#logoTitle {margin-bottom: 10px;padding-top: 10px;}
	.titleSlogan {padding: 0 5px;}

	#mobileTabWrapper {display: block;position: absolute;top: 0;right: 0;z-index: 1000;}
	#mobileMenuTab, #mobileSidebarTab {float: right;margin-right: 5px;padding: 5px 7px;-webkit-border-radius: 0 0 3px 3px;-moz-border-radius: 0 0 3px 3px;border-radius: 0 0 3px 3px;-webkit-box-shadow: 0 0 5px black;-moz-box-shadow: 0 0 5px black;box-shadow: 0 0 5px black;font-size: 1.1em;}
	#mobileMenuTabBottom { max-width: 280px; margin: 0 auto; padding: 5px 7px; text-align: center; position: relative; bottom: -10px; -webkit-border-radius: 3px 3px 0 0;-moz-border-radius: 3px 3px 0 0;border-radius: 3px 3px 0 0; -webkit-box-shadow: 0 0 5px black; -moz-box-shadow: 0 0 5px black; box-shadow: 0 0 5px black; font-size: 1.1em; }

	#contentContainer, #sidebarContainer {float: none;}

	/* Reset menu styles from desktop version */
	#menuContainer {display: none;text-align:left;height: auto;background-image: url(../images/menuShadow.png);}

	#menu {height: auto;padding: 5px;}
	#menu, #menu[style] { float: none !important; width: auto !important; }

	#menu ul {margin: 0;padding: 0;}

	#menu ul li {float: none;display:block;background-image: none;line-height: 30px;}

	#menu ul li a {line-height: 30px;}
	#menu ul li a:hover {}

	#menu ul ul {display: block;margin-left: 15px;}

	#menu .current, #menu .currentAncestor {background-image: none;border-bottom: 1px solid black;line-height: 30px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
	#menu .current:hover, #menu .currentAncestor:hover {background-image: none;}

	#contentWrapper {padding: 10px;}

	#contentContainer {margin-top: 0;}

	#sidebarContainer {float: none;position: absolute;width: 94%;top: 10%;left: 3%;z-index: 100;-webkit-box-shadow: 0 0 10px black;-moz-box-shadow: 0 0 10px black;box-shadow: 0 0 10px black;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}

	/* Possible Fix for iPhone - This will prevent content overflow 
 	* when there are a large number of categories assigned to a single blog post,
	* but doesn't look as nice as the default behavior.
	*.blog-entry-date {clear: both;overflow: auto;}
	*.blog-entry-category {float: right;}
	*/
}