/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* SET GLOBAL VALUES - Required_field is in main_top.css */

html, body { font: normal normal 300 16px/28px "Roboto", Arial, Helvetica, sans-serif; color: #424242; font-size: 18px; line-height: 30px; } /* Padding/margin resets and width/height 100% are in main_top.css */
.main_wrapper { background-color: transparent; } /* Everything but footer. Put background here if need full-height background. Min-height and position in main_top.css */

a:link { color: #d2252c; text-decoration: underline; }
a:visited { text-decoration: none; }
a:link, a:hover, a:active, a:visited { __text-decoration: none !important; }

.errmsg { color: #F00; font-size: 11px; line-height: 11px; font-style: italic; font-weight: bold; padding-top: .6em; } /* "IS REQUIRED" type of form messages */
.invalid { outline: 2px solid #F00; font-weight: bold; } /* Regex fail form messages */

p { padding: 0px; margin-top: 1em; }
h1,h2,h3,h4,h5,h6 { font-family: "Roboto Slab",Arial,Helvetica,sans-serif; font-weight: 400; margin: 0px; padding: 0px; font-feature-settings: "kern"; text-rendering: optimizelegibility; }
h1 { font-size: 2.625em; line-height: .95em; }
h2 { font-size: 2.0625em; line-height: 1em; }
h3 { font-size: 1.5em; line-height: 1.25em; }
h4 { font-size: 1.333em; line-height: 1.1em; }
h5 { font-size: 1em; line-height: 1.3em; }

img { max-width: 100%; }

/* NOTE - CONTENT and CONTENT_WRAPPER below are simply for microdata and adding a pad for sticky footer. SECTION will be used for most segments/areas */
.masthead, .banner, .content, .section, .footer { width: 320px; margin: 0px auto; position: relative; }
.masthead_wrapper, .banner_wrapper, .content_wrapper, .section_wrapper, .footer_wrapper { position: relative; clear: both; }

/* MASTHEAD */

.masthead_wrapper, .masthead { overflow: visible; height: 150px; }
.masthead_wrapper { 
	background-color: #FFF;  
	z-index: 9998; /* Not necessary, but makes certain modifications easier */
	/* INSET BANNER WITH DROP SHADOW */
	-moz-box-shadow: 0px 2px 8px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px 2px 8px rgba(0,0,0,0.6);
	box-shadow: 0px 2px 8px rgba(0,0,0,0.6);
	}
.masthead {  }

/* INSET BANNER WITH DROP SHADOW */
.section_first {
	-moz-box-shadow: 0px -2px 8px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px -2px 8px rgba(0,0,0,0.6);
	box-shadow: 0px -2px 8px rgba(0,0,0,0.6);
	}
.nobanner {
	-moz-box-shadow: 0px 0px 0px transparent !important;
	-webkit-box-shadow: 0px 0px 0px transparent !important;
	box-shadow: 0px 0px 0px transparent !important;
	}

.masthead_logo {
	width: 140px;
	height: 130px;
	position: absolute;
	top: 0px;
	left: 90px;
	background: transparent url("/css/images/sprites.png") no-repeat 0px -300px;
	z-index: 9999; /* Not necessary, but makes certain modifications easier */
	}
.masthead_logo h2 { display: none; }

/* MENU */

.mobile_icon { 
	position: absolute; 
	top: 70px; 
	right: 0px; 
	width: 80px; 
	height: 60px; 
	background: transparent url("/css/images/sprites.png") no-repeat 0px -180px; 
	cursor: pointer;
	z-index: 9999; /* Not necessary, but makes certain modifications easier */
	}
.mobile_menu_icon {  }

.sitenav { display: none; }

	/* DROP-DOWN */
	
	.sitelinks {
		margin: 0px;
		padding: 0px 0px 0px 0px;
		list-style: none;
		position: absolute; 
		left: 0px; 
		top: 150px;
		width: 100%;
		z-index: 9000;
		}
	.sitelinks li { 
		display: block; 
		margin: 0px;
		padding: 0px; 
		position: relative;
		}
	.sitelinks li a { 
		background-color: rgba(255,255,255,0.8); /* Sets the color for the entire menu when it first drops down */
		border-bottom: 1px solid rgba(255,255,255,0.3);
		font-weight: 700;
		font-size: 28px;
		line-height: 28px;
		color: #FFF;
		text-align: center;
		text-decoration: none; 
		color: #4c4d4f; /* Sets the font color for the menu items. Inherit to use base font color for the site. */
		display: block;  /* This (and the two below it) makes the whole thing clickable ... who knew?!? */ 
		padding: 13px 0px 17px 0px;
		width: 100%; 
		}
	.sitelinks li a:hover { color: #FFF; background-color: #afbd21; } /* Sets the highlight color for the menu items */
	.sitelinks li.menu_last a { border-bottom: none; }
	
	/* DROP-DOWN SUB-MENUS */
		
		.m_expand { 
			position: absolute; 
			top: 5px; 
			right: 0px; 
			cursor: pointer; 
			width: 52px; 
			height: 45px; 
			background: transparent url("/css/images/sprites.png") no-repeat 0px -240px; 
			}
		.services_subnav, .sitelinks .divider { display: none; }
		.sitesublinks {
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			}
		.sitesublinks li {
			margin: 0px;
			}
		.sitesublinks li a { 
			background-color: #FFF; /* Sets the color for the entire SUB-menu when it first drops down */
			border-bottom: 1px solid rgba(255,255,255,0.3);
			font-weight: 300;
			font-size: 18px;
			line-height: 18px;
			text-decoration: none; 
			__color: #FFF; /* Sets the font color for the sub-menu items. Inherit to use base font color for the site. */
			display: block;  /* This (and the two below it) makes the whole thing clickable ... who knew?!? */ 
			padding: 12px 0px 13px 0px;
			width: 100%; 
			}
		.sitesublinks li a:hover { background-color: #7a7c80; }
		.sitesublinks li.first { __border-top: 1px solid rgba(255,255,255,0.3); }
		.sitesublinks li.last a { border-bottom: none; }

/* SOCIAL ICONS - 30px */

.social_icons { position: absolute; top: 57px; right: 0px; width: auto; display: none; }
.social_icon { 
	width: 30px; 
	height: 30px; 
	float: left; 
	margin: 0px 10px 0px 5px; 
	background: transparent url("/css/images/sprites.png") no-repeat 0px -149px;
	}
.facebook { background-position: 0px -149px; }
.facebook:hover { background-position: 0px -119px; }
.twitter { background-position: -30px -149px; }
.twitter:hover { background-position: -30px -119px; }
.pinterest { background-position: -60px -149px; }
.pinterest:hover { background-position: -60px -119px; }
.instagram { background-position: -90px -149px; }
.instagram:hover { background-position: -90px -119px; }
.googleplus { background-position: -120px -149px; }
.googleplus:hover { background-position: -120px -119px; }
.tumblr { background-position: -150px -149px; }
.tumblr:hover { background-position: -150px -119px; }
.youtube { background-position: -180px -149px; }
.youtube:hover { background-position: -180px -119px; }
.vimeo { background-position: -210px -149px; }
.vimeo:hover { background-position: -210px -119px; }
.linkedin { background-position: -240px -149px; }
.linkedin:hover { background-position: -240px -119px; }
.snapchat { background-position: -270px -149px; }
.snapchat:hover { background-position: -270px -119px; }

/* SOCIAL ICONS - 23px */
/*
.social_icons { position: absolute; top: 64px; right: 0px; width: auto; }
.social_icon { 
	width: 23px; 
	height: 23px; 
	float: left; 
	margin: 0px 10px 0px 5px; 
	background: transparent url("/css/images/sprites.png") no-repeat 0px -73px;
	}
.facebook { background-position: 0px -73px; }
.facebook:hover { background-position: 0px -96px; }
.twitter { background-position: -23px -73px; }
.twitter:hover { background-position: -23px -96px; }
.pinterest { background-position: -46px -73px; }
.pinterest:hover { background-position: -46px -96px; }
.instagram { background-position: -69px -73px; }
.instagram:hover { background-position: -69px -96px; }
.googleplus { background-position: -92px -73px; }
.googleplus:hover { background-position: -92px -96px; }
.tumblr { background-position: -115px -73px; }
.tumblr:hover { background-position: -115px -96px; }
.youtube { background-position: -138px -73px; }
.youtube:hover { background-position: -138px -96px; }
.vimeo { background-position: -161px -73px; }
.vimeo:hover { background-position: -161px -96px; }
.linkedin { background-position: -184px -73px; }
.linkedin:hover { background-position: -184px -96px; }
.snapchat { background-position: -207px -73px; }
.snapchat:hover { background-position: -207px -96px; }
*/

/* BANNER */

.banner_wrapper, .banner { overflow: visible; background-size: cover; background-position: center center; height: 180px; /* 16:9 - height: 169px; if width is standard 300px */ }
.banner_wrapper { background-color: #EEE; }
.banner {  }
.banner a { text-color: inherit !important; text-decoration: none !important; } /* Prevent some browsers from underlining the NBSP placeholder */

.bx-wrapper, .bxslider {  }
.bxslider { }
.bx-wrapper, .bxslider, .bxslider li {
	margin: 0px;
	padding: 0px;
	list-style: none;
	width: 100%; 
	height: 180px; 
	}

.banner_overlay {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 180px;
	display: flex;
	align-items: center;
	__background-color: rgba(255,255,255,0.5);
	}
.banner_overlay_text {
	text-align: center;
	width: 100%;
	color: #FFF;
	font-weight: 700;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
	font-size: 1.5em;
	}

/* CONTENT */

.col { display: block; margin: 0px 10px; __background-color: #EEE; }
.nomargin { margin: 0px; }
.col_full, .col_half, .col_third, .col_twothirds, .col_quarter, .col_threequarters { width: 300px; }
.col_full.nomargin, .col_half.nomargin, .col_third.nomargin, .col_twothirds.nomargin, .col_quarter.nomargin, .col_threequarters.nomargin { width: 320px; }
.content, .sidebar { padding-bottom: 30px; }

/* OVERVIEW */

.overview {  } /* in case we need to clear something or add a margin */
.title { font-size: 3.157em; line-height: .9em; margin-top: 19px; font-weight: 700; }
.subtitle { font-size: 1.777em; font-size: 1.333em; line-height: 1.1em; margin-top: .4em; }
.description {  }
.description h1, .description h2, .description h3, .description h4, .description h5, .description h6 { margin-top: .85em; }
.pic_full, .pic_half { display: block; width: 100%; clear: both; }
.pic_full { margin: 10px 0px; }

/* OVERVIEW PICS */

.pic_box {
	width: 300px;
	display: block;
	margin: 10px 0px 0px 0px;
	overflow: hidden;
	position: relative;
	}
.youtube {
	width: 300px;
	height: 169px;
	}
.pic {
	max-width: 100%;
	}
.caption {
	text-align: center;
	padding: 8px 0px 4px 0px;
	font-style: italic;
	color: #a0a0a0;
	}
	
.pic_multi_box {  }
.pic_multi {
	float: left;
	width: 145px;
	height: 97px;
	background-color: #CCC;
	margin: 10px 10px 0px 0px;
	background-size: cover; 
	background-position: center center;
	position: relative;
	overflow: hidden;
	}
.pic_multi:nth-child(2n) { margin-right: 0px; }
.pic_multi_spacer { width: 145px; height: 97px; position: absolute; top: 0px; left: 0px; overflow: hidden; }
.pic_multi_spacer img { display: none; }

/* OVERVIEW MULTI-PIC GALLERY */

.gallery {
	margin: 15px 15px 15px 15px;
	overflow: auto;
	}
.gallery_main {
	width: 270px;
	height: 180px;
	background-size: cover;
	background-position: center center;
	background-color: #CCC;
	}
.gallery_thumb {
	width: 135px;
	height: 90px;
	background-size: cover;
	background-position: center center;
	float: left;
	background-color: #EEE;
	position: relative;
	}
.gallery_main img, .gallery_thumb img { display: none; }
.gallery_count {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: rgba(35,144,159,0.75);
	font: normal normal 700 28px/28px "Roboto Slab", "Courier New", Courier, monospace;
	color: #FFF;
	padding-top: 30px;
	}

/* DOWNLOADS */

.downloads { /* container */
	width: 300px;
	display: block;
	margin: 10px 0px 0px 0px;
	}
.downloads_header {
	box-sizing: border-box;
	border: 1px solid #a0a0a0;
	}
.downloads_header_text {
	font-weight: 700;
	text-transform: uppercase;
	color: #a0a0a0;
	padding: 12px 15px 11px 15px;
	float: left;
	line-height: 28px;
	}
.downloads_header_icon {
	width: 51px;
	height: 51px;
	background: #cfcfcf url("/css/images/bkg_downloads_icon.png") no-repeat center center;
	border-right: 1px solid #a0a0a0;
	float: left;
	}
.downloads ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
	}
.downloads ul li {
	margin: 1em 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style: none;
	}
.downloads a { text-decoration: none !important; color: inherit !important; }
.dl_item {  
	font-size: 16px;
	line-height: 18px;
	font-weight: 700; 
	padding: 3px 0px 5px 53px;
	padding-left: 35px;
	background: transparent url("/css/images/icon_pdf.png") no-repeat 13px 0px;
	background-position: 0px 0px;
	}
.dl_item.pdf { background-image: url("/css/images/icon_pdf.png"); }
.dl_item.doc, .dl_item.docx { background-image: url("/css/images/icon_doc.png"); }
.dl_item.xls, .dl_item.xlsx { background-image: url("/css/images/icon_xls.png"); }
.dl_item.ppt, .dl_item.pptx { background-image: url("/css/images/icon_ppt.png"); }
.dl_item.txt { background-image: url("/css/images/icon_txt.png"); }
.dl_item.jpg, .dl_item.jpeg, .dl_item.png, .dl_item.tif, .dl_item.gif { background-image: url("/css/images/icon_jpg.png"); }
.dl_item.web { background-image: url("/css/images/icon_web.png"); }

/* BROWSE */

.browse {  } /* in case we need to clear something or add a margin */
.browse_record {
	margin: 20px 0px 0px 0px;
	padding: 0px 0px 30px 0px;
	border-bottom: 1px solid rgba(0,0,0,0.2);
	}
.browse_record.last { padding-bottom: 0px; border-bottom: 0px none transparent; }
.browse_title { margin-top: 0px; font-size: 1.5em; line-height: 1.25em; font-weight: 700; }
.browse_subtitle { font-size: 1em; line-height: 1.1em; margin-top: .4em; }
.browse_description { margin-top: .5em; }
.browse_more {
	margin-top: .85em;
	}
.browse_more a {
	display: block;
	padding: 10px 5px;
	text-align: center;
	font-size: 1.4em;
	font-weight: 700;
	background-color: rgba(0,0,0,0);
	border: 1px solid rgba(0,0,0,0.1);
	color: #999 !important;
	text-decoration: none !important;
	}
.browse_more a:hover {
	color: #000 !important;
	background-color: rgba(0,0,0,0.1);
	}

/* FOOTER */

.content_wrapper { padding-bottom: 250px; } /* Padding matches footer height. This container JUST makes room for footer. Add about 20px to footer height to ensure bottom content pad */
.footer_wrapper, .footer { height: 250px; } 
.footer_wrapper { margin-top: -250px; background: #424242 url("/css/images/bkg_footer.jpg") repeat center top; z-index: 9999; }
.footer {  }
.footer .divider {
	color: rgba(255,255,255,0.25);
	padding: 0px 10px;
	}

.footer_text { 
	text-align: center;
	font-size: 14px;
	line-height: 20px;
	padding-top: 20px;
	color: #FFF; 
	}
.footer_companylogo {
	width: 115px;
	height: 44px;
	margin: 0px auto;
	background: transparent url("/css/images/sprites.png") no-repeat -140px -300px;
	display: block;
	}
.footer_companylogo:hover { background-position: -140px -344px; }
.company_name { padding-top: 5px; }
.company { 
	font-family: "Roboto Slab",Arial,Helvetica,sans-serif; 
	font-size: 20px;
	line-height: 26px; 
	font-weight: 700;
	}
.tagline { 
	display: block; 
	font-size: 14px;
	line-height: 14px;
	font-weight: 300;
	font-style: italic;
	padding-top: 0px;
	}
.address {
	padding-top: 9px;
	}
.contact_numbers { display: block; }
.fineprint {
	font: normal normal 300 9px/14px Roboto, Arial, Helvetica, sans-serif;
	padding-top: 8px;
	text-align: center;
	color: #FFF;
	}
.fineprint a, .credits a, .footer_text a { color: #FFF !important; }
.fineprint a:hover, .credits a:hover, .footer_text a:hover { text-decoration: underline !important; }

.footer_logos { width: 142px; height: 24px; position: absolute; bottom: 20px; left: 50%; margin-left: -71px; }
.footer_logo { height: 24px; background: transparent url("/css/images/sprites.png") no-repeat 0px 0px; float: left; }
	.beansprout { width: 67px; background-position: 0px 0px; } .beansprout:hover { background-position: 0px -25px; }
	.coloredbean { width: 63px; background-position: -68px 0px; margin-left: 12px; } .coloredbean:hover { background-position: -68px -25px; }

/* GLOBAL OVERRIDES */

.nobreak { white-space: nowrap; }
.hideme { visibility: hidden; display: none; }
.tp { padding-top: 10px; }
.tm { margin-top: 10px; }

/* HIDE ON MOBILE @ 719px OR LESS */

@media only screen and (max-width: 719px) { .m_hide { display: none !important; visibility: hidden !important; } }