/* Desktop layout changes  */
#contentRightInner { padding: 0 7px 7px 7px; overflow: hidden; }
#headerCart { float: right; width: 30px; padding: 0 !important; height: 22px; text-align: right; margin-top: 2px; }
#headerCart a { display: block; width: 23px; height: 22px; position: relative; }
#headerCart img { display: block; width: 23px; height: 22px; position: relative; }
#headerQuickLinks { margin-top: 2px; }
#headerBookStore { margin-top: 3px; width: 60%; float: right; }

/* SharePoint Welcome Drop Down Fix */
.ms-MenuUIPopupBody {
	z-index:999;
}

/* RESPONSIVE DESIGN STYLES =============================================================== */

/* @media screen and (max-width: 768px),
screen and (max-height: 480px) {
	body { background-image: none; background-color: #fff; }
	#contentLayout a{ word-break: break-all;}
	#pageLayout { width: 100%; margin: 0; }
	#headerLayout {  }
	#headerLogo { top: 10px; }
	#headerQuickLinks h3, #headerQuickLinks select { display: none; }
}
@media screen and (max-width: 640px),
screen and (max-height: 480px) { 
	#share { display: none; }
	.globalNavItem td a { font-size: .9em !important; padding-left: 3px !important; padding-right: 3px !important; }
	.ui-select .ui-btn select{ font-size: 50px; }	
}
*/

@media screen and (max-width: 480px),
screen and (max-height: 480px) {
	body { background-image: none; background-color: #fff; }
	#contentLayout a{ word-break: break-all;}
	#pageLayout { width: 100%; margin: 0; }
	#headerLayout {  }
	#headerLogo { top: 10px; }
	#headerQuickLinks h3, #headerQuickLinks select { display: none; }
	
	#share { display: none; }
	.globalNavItem td a { font-size: .9em !important; padding-left: 3px !important; padding-right: 3px !important; }

	/* remove zoom from drop down menu select */
	.ui-select .ui-btn select{ font-size: 50px; }
	
	#headerQuickLinks h3, #headerQuickLinks select, #pageConsole, #headerMenu, #share { display: none; }
		
	#pageAreaLayout { padding: 5px; }
	td#pageLeft { display: none; }
	td#pageRight { padding-left: 0; width: 100%; }

	#contentLayoutLeft, #contentLayoutRight { display: block; width: 100%; float: none; min-width:0px; }
	#contentLayoutRight { min-height: 0; background-image: none; border-radius: 5px; }
	#contentRightTop { background-image: none; }
	
	#headerLayout { width: 100%; height: 134px; position: relative; margin-bottom:0; z-index: 200; }
	#headerLogo { top: 20px; left: 5px; }
	#headerLogo img { height: 55px; }
	#headerBar { z-index: 500; background-image: none; background-color: transparent; position: absolute; top: 5px; right: 5px; }
	#headerSearch { float: none; position: absolute; top: 0; right: 40px; z-index: 200; }
	#headerSearch input { margin-right: 5px; }
	#headerSearch .ms-sbgo { background: #fff; border-radius: 15px; }
	#headerCart { position: absolute; padding: 0; top: 0; right: 5px; z-index: 200; width: 23px; height: 22px; }
	#headerLinks, #headerHatch { background-image: none; background-color: transparent; }
	#headerLinks { 
		position: absolute;
		top: 35px; right: 0px;
		width: 230px;
		font-weight: bold; 
		font-size: .95em; 
	}
	#headerLinks table { width: auto; margin: 0 0 0 auto; z-index: 500; }
	#headerLinks td { text-align: right; }
	#headerHome { width: 45px; }
	#headerWelcome { width: auto; }
	#headerMenu table.ms-siteaction { z-index: 500; }
	#footerPipe { display: none; }
	#footerLinks { display: block; }

	.homeIntro { padding: 5px; }
	#contentLayoutLeft img { max-width: 100% !important; }
	
	/* mobile only menu styles */
	#headerNavigation { 
		position: absolute; 
		top: 90px; left: 0; right: 0; 
		padding-top: 5px;
		height: 25px; 
		background: #046a45; 
		z-index: 200; 
		border-top: 1px solid #fff;
	}
	#mobileMenuToggle { 
		height:35px;
		line-height:35px;
		width:75px; 
		display:block;
		overflow:hidden; 
		margin-left:8px;
		padding-left: 24px;
		background:url('/Style Library/APS/i/icon-menu.png') left center no-repeat;
		z-index: 200;
	}
	#mobileMenuToggle:hover { background-color:rgba(0,0,0,.5);}
	#mobileMenu{ display:none; margin:0; padding:0; background: #046a45;}
	#mobileMenu li { list-style:none;display:block;padding:0;}
	#mobileMenu li a {
		color:#fff;
		font-weight:bold;
		display:block;
		line-height:30px;
		margin: 0;
		padding: 3px 10px;
		background:rgba(0,0,0,0.30);
		border-top: 1px solid #88b2a3;
		border-bottom: 1px solid black;
	}
	#mobileMenu li a:hover {
		background:rgba(255,255,255,0.35);
	}
	
	/* LOCAL NAVIGATION */
	#pageAreaLayout { position: relative; padding: 0 !important; margin: 0; }
	#pageTable td { display: inline-block; width: 100%; }
	#pageLeft { padding: 0; margin: 0; }
	#pageRight { padding: 0; margin: 0; }
	#currentNavLayout { margin: 0; max-width: 320px; overflow: hidden }
	#breadcrumbLayout, #contentLayout { padding: 5px; width: 96%; }
	.currentNavHeader a { color: #333; padding: 5px; font-size: 90% !important; border-bottom: 1px solid #ccc !important; }
	#mobileMenuCurrent {
		padding:4px;
		text-align:center;
	}
	#mobileMenuCurrent > span {
		font-size: 11px;
		font-weight:bold;
		text-transform:uppercase;
		margin-right:4px;
	}
	#mobileMenuCurrent select {
		max-width: 300px;
		overflow: hidden;
	}
	#mobileMenuCurrent option {
	}
}

@media screen and (max-width: 320px),
screen and (max-height: 480px) { 
	#bodyContent ul { margin-left: 10px; padding-left: 12px; }
	#bodyContent ul li { }
	#headerWelcome { width: auto; }
	#contentLayoutLeft{
				
}
}

/* BOOKSTORE responsive design styles ==============================================================  */

@media screen and (max-width: 768px),
screen and (max-height: 480px) {  
	#headerBookStore {  }
	#headerBookStore h3 { font-size: 1em; }
}
@media screen and (max-width: 640px),
screen and (max-height: 480px) {
	#headerBookStore { display: none; }
}
@media screen and (max-width: 480px),
screen and (max-height: 480px) {
	#headerLinksBookStore, #headerHatchBookStore { background-image: none; background-color: transparent; }
	#headerLinksBookStore { 
		position: absolute;
		top: 35px; right: 0px;
		width: 230px;
		z-index: 200; 
		font-weight: bold; 
		font-size: .95em; 
	}

	#headerLinksBookStore table { width: auto; margin: 0 0 0 auto; }
	#headerLinksBookStore td { text-align: right; }

	/* the entire zone */
	.ui-accordion { margin: 10px 0; padding: 3px 5px; border: 1px solid #869E03; border-radius: 5px; }
	
	/* all accordion headers */
	.ui-accordion-header { margin: 2px 0; background: #e8eec8; padding: 5px 10px; }
	
	/* active accordion header */
	.ui-accordion-header.ui-state-active { }
	
	/* accordion content area */
	.ui-accordion-content {}
	
	/* Hide PREVIEW tab to prevent style conflicts */
	#tabContent4, a#tabLink4 { display: none; }
}

@media screen and (max-width: 320px),
screen and (max-height: 480px) {
	.productTable { margin: 0; max-width: 320px; }
	td.productLeft { display: inline-block; width: 100%; padding: 0 !important; }
	td.productLeft .productImage { padding: 0 10px; }
	td.productRight { display: inline-block; width: 100%; padding: 0 !important; padding-left: 0 !important; }
	td.productRight table { max-width: 300px; margin: 0; }
	.ms-WPBody #column td { border-bottom: 1px solid #ddd; padding-bottom: 10px; }
	.ms-WPBody #column td table td { border-bottom-style: none; padding-bottom: 0px; }
}	

/* MEETINGS responsive design styles ==============================================================  */

@media screen and (max-width: 768px),
screen and (max-height: 480px) { 
	#meetingBanner { padding-left: 0; padding-right: 0; } 
	#meetingBanner img { max-width: 100%;  }
}
	
@media screen and (max-width: 480px),
screen and (max-height: 480px) {
	#meetingBanner { padding: 0; overflow: hidden; } 
	#meetingBanner img { max-width: inherit; }
	.ms-rteCustom-AutoSchedule { width: 100%; }
	.ms-rteCustom-AutoSchedule td { display: inline-block; width: 100%; height: auto !important; padding: 3px 5px; }
	.ms-rteCustom-AutoSchedule td:first-child { font-weight: bold; border-top: 1px solid #ccc; }
	.ms-rteCustom-AutoSchedule td h2 { font-weight: bold; text-transform: uppercase; margin: 5px 0; padding: 0; }
	.ms-rteCustom-AutoIndex td { display: inline-block; width: 100%; padding:0; height: auto !important; background: #e8eec8; border-bottom: 1px solid #fff; }
	.ms-rteCustom-AutoIndex td h2 { font-size: 1em; margin: 0; padding: 3px 10px; }
}

@media screen and (max-width: 320px),
screen and (max-height: 480px) {
	.calendar-layout { width: 320px !important; }
	.calendar-layout td.calendar-item { width: 320px !important; overflow: hidden; }
	.calendar-layout td.calendar-item a {  }
}