@charset "UTF-8";
/* CSS Document */



/*		Styles
------------------------------------- */

/* Target & override inline Left Nav and Mobile Nav styles to Roboto */
.search-facets ul li .target .content .link-list ul li.link-list-item a.bLink{font-family: 'Roboto', sans-serif!important;}
li.link-list-item div a, li.link-list-item div.trigger a span{font-size:13px; color:#006072; font-family: 'Roboto', sans-serif!important;}
	
/* Banners */	
.desktop-banner{max-width:100%;height:auto;}
.mobile-banner{display: none;max-width:100%;height:auto;}
@media(max-width:600px){.desktop-banner{display: none;}}				
@media(max-width:600px){.mobile-banner{display: block;}}

	
/* MOBILE MAIN (TOP) NAV BAR */	
.mobile-nav-bar {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	width: 100%;
	padding: 5px;
	background: #217d8e; /* Old browsers */
	background: -moz-linear-gradient(top,  #217d8e 0%, #016173 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #217d8e 0%,#016173 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #217d8e 0%,#016173 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#217d8e', endColorstr='#016173',GradientType=0 ); /* IE6-9 */
}


.mobile-nav-bar ul {
	overflow: hidden;
}


.mobile-nav-bar li {
	float: left;
	list-style-type: none !important;
}


.mobile-nav-bar li a {
	color: white;
	text-align: center;
	text-decoration: none;
}


/* link hover style */
.mobile-nav-bar li a:hover {
	color: #d5ecf0;
}

		



/* 			MOBILE (INDIVIDUAL PAGE) MENU
--------------------------------------------- */

/* Mobile Menu */
	.mobile-menu {
		display: none;
		}

	.mobile-menu a {
		color: #FFF !important;
	}


	.toggle,
	[id^=drop] {
		display: none;
	}


/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

	.mobile-menu nav:after {
		content:"";
		display:table;
		clear:both;
	}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
	.mobile-menu nav ul {
		float: left ;
		padding:0 !important;
		margin:0 !important;
		list-style: none;
		position: relative;
		width: 100%;
	}
	
	
/* Positioning the navigation items inline */
	.mobile-menu nav ul li {
		margin: 0px !important;
		display:inline-block;
		float: left;
		background-color: #d6edef;
	}

	
/* Styling the links */
	.mobile-menu nav a {
		display:block;
		padding:5px 20px !important;	
		color:#666 !important;
		font-size:12px;
		text-decoration:none;
	}


/* Hide Dropdowns by Default
 * and giving it a position of absolute */
	.mobile-menu nav ul ul {
		display: none;
		position: absolute; 
		/* has to be the same number as the "line-height" of "nav a" */
		top: 60px; 
	}
	
	
/* Fisrt Tier Dropdown */
	.mobile-menu nav ul ul li {
		width:170px;
		float:none;
		display:list-item;
		position: relative;
	}

/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
	.mobile-menu nav ul ul ul li {
		position: relative;
		top:-60px;
		/* has to be the same number as the "width" of "nav ul ul li" */ 
		left:170px; 
	}

	
/* Change ' >' in order to change the Dropdown symbol */
	.mobile-menu li > a:after { content:  ' >'; }
	.mobile-menu li > a:only-child:after { content: ''; }



	/* Hide the navigation menu by default */
	/* Also hide the  */
	.mobile-menu .toggle + a, .mobile-menu .menu {
		display: none;
	}
	
	
	/* Stylinf the toggle lable */
	.mobile-menu .toggle {
		display: block;
		background-color: #d6edef;
		padding:5px 20px !important;	
		color:#666 !important;
		font-size:14px;
		text-decoration:none;
		border:none;
	}

	.mobile-menu .toggle:hover {
		background-color: #d2d2d2;
	}

	/* Display Dropdown when clicked on Parent Lable */
	.mobile-menu [id^=drop]:checked + ul {
		display: block;
	}
	
	#burger:target .mobile-menu [id^=drop]:checked + ul {
		display: block;
	}

	/* Change menu item's width to 100% */
	.mobile-menu nav ul li {
		display: block;
		width: 100%;
	}

	.mobile-menu nav ul ul .toggle, .mobile-menu nav ul ul a {
		padding: 0 40px !important;
	}

	.mobile-menu nav ul ul ul a {
		padding: 0 80px !important;
	}

	.mobile-menu nav a:hover, .mobile-menu nav ul ul ul a {
		background-color: #d2d2d2;
		text-decoration: underline;
	}
  
	.mobile-menu nav ul li ul li .toggle, .mobile-menu nav ul ul a, .mobile-menu nav ul ul ul a {
		padding:5px 40px !important;	
		color:#666 !important;
		font-size:12px; 
	}
  
	.mobile-menu nav ul li ul li .toggle, .mobile-menu nav ul ul a {
		background-color: #F4F4F4; 
	}

	/* Hide Dropdowns by Default */
	.mobile-menu nav ul ul {
		float: none;
		position: static;
		color: #ffffff;
		/* has to be the same number as the "line-height" of "nav a" */
	}		
		
	/* Fisrt Tier Dropdown */
	.mobile-menu nav ul ul li {
		display: block;
		width: 100%;
	}

	.mobile-menu nav ul ul ul li {
		position: static;
		/* has to be the same number as the "width" of "nav ul ul li" */ 
	}


	
	
/* Mobile banner (ID) hidden on large screen */
	#mobile-banner{
		display: none;
	}






/* 				Media Queries
--------------------------------------------- */


	@media all and (max-width : 768px) {
		.mobile-menu nav {
			margin: 0 !important;
		}
	}			
	
		
/* Hide global nav bar */	
	@media (max-width: 768px) {
		.navigation-primary { 
			display: none !important;
		}
	}
		
/* Adjust secondary navigation */	
	@media (max-width: 768px) {
		.navigation-secondary ul a, .account-utilities {
			font-size: 10px !important;
			margin: -15px 0 0px -5px !important;
		}
	}

/* mobile NAV size adjust */
	@media (max-width: 768px) {
		.nav-link {
			font-size:12px !important;
			padding:10px !important;
			height:auto !important;
		}
	}	
		
/* SHOW mobile NAV */	
	@media (max-width: 768px) {
		.mobile-nav-bar {
			display:block !important;
		}
	}	
		
		
/* Push Header down for tablet */	
	@media (max-width: 768px) {
		.container header {
			margin-top: 10px !important;
		}
	}
						
		
/* Push Header down for mobile */	
	@media (max-width: 600px) {
		.container header {
			margin-top: 30px !important;
		}
	}


/* Show mobile MENU */	
	@media (max-width: 600px) {
		.mobile-menu {
			display: block;
		}
	}			

		
/* Hide left rail */
	@media (max-width: 600px) {
		.search-facets {
			display: none !important;
		}
	}


/* Make main column width go full screen */
	@media (max-width: 600px) {
		.col-xs-4 {
			width:100%;	
  		}
	}		


/* Show shadow on mobile */	
	@media (max-width: 600px) {
		.shadow-large,.shadow-medium,.shadow-small {
			display: none;
		}
	}

		
		
/* Hide intro - desktop */	
	@media (max-width: 768px) {
		#intro-desktop {
			display:none;
		}
	}
		

		
/* Show intro - mobile/tablet */	
	@media (max-width: 768px) {
		#intro-mobile {
			display:block;
		}
	}	
		
		
/* Push Header down for mobile */	
	@media (max-width: 600px) {
		.container header {
			margin-top: 30px !important;
		}
	}		
		
		
/* Hide desktop banner */	
	@media (max-width: 600px) {
		#desktop-banner {
			display: none;
		}
	}	
		
		
/* Show mobile banner */	
	@media (max-width: 600px) {
		#mobile-banner {
			display: block;
		}
	}