/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	
	Eric Meyer					:: http://ericmeyer.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
	
-------------------------------------------------------------------------------*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
a{ text-decoration: none;}
del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test 
a:hover, a:active {outline: none;}*/


*:focus {
    /* outline: 2px solid #a9192f; */
	position: relative;
	outline: 2px solid rgba(169,25,47,0.9);
	z-index: 9999;
}
#primary-nav :focus, #section-nav :focus {
    /* outline: 2px solid #a9192f; */
	position: relative;
	outline: 2px solid rgba(255,255,255,0.9);
	z-index: 9999;
}


small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  
.clearleft, .clear-left{
	clear: left;
}


/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}


/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}



/* Skip to main content */
.skip-content {
	display: inline;
}
.skip-content a {
	background: #000;
	color: #fff;
	padding: .5rem .5rem;
	position: absolute;
	left: 0;
	top: -999px;
	z-index: 999
}
.skip-content a:focus {
    top: 0;
}



/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

body {
	font: normal .875em Helvetica, Arial, sans-serif; 
	background: #767676 url(/assets/images/structure/background.jpg) no-repeat top center;
}
body, select, input, textarea {color: #101010;}

a {color: #03f;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Layout
-------------------------------------------------------------------------------*/
#page{
	margin: 0 auto;
	width: 960px;
    position: relative;
    text-align: left;
    
}
	}
#content{
	position: relative;
}
.home #content{ margin-left: 0;} /* Homepage override.*/

aside.side-bar{
	width: 21.229167%; /* 240/960 */
	margin: 0 1.7708333%;
	float: left;
}
/* Display stuff */
.hidden{
	display: none; visibility hidden;
	
}


/* Typography
-------------------------------------------------------------------------------*/
h1, h2, h3, h4, .btn{
	/*font-family: depot-new-condensed-web, Helvetica, Arial, sans-serif;*/
	/*font-family: ff-dagny-web-pro,sans-serif;*/
	font-family: pragmatica-web-condensed, Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: 400;
	display: block;
}
h1 { 
	font-size: 2.92307692em; 
	line-height: 1em; 
	margin-top: 0; margin-bottom: 0em; 
	font-weight: normal; 
}
	.home h1{
		font-size: 2.24285714em;
	}
h2{
	font-size: 1.8333em; 
	line-height: 1em; /*1.6364em; */
	margin-top: 0; 
	margin-bottom: 0.8182em; 
	font-weight: normal;
}
	.home h2{
		font-size: 1.73076923em;
	}
	
h3{
	font-size: 1.28571429em;
	line-height: 1em; 
	margin-top: 0; 
	margin-bottom: 0.5em; 
	font-weight: normal;
}	

h2.cta-title{
	font-size: 1.28571429rem;
	line-height: 1m; 
	margin-top: 0; 
	margin-bottom: 0.5em; 
	font-weight: normal;
}

h4, .apply-now, button.submit { 
	/*font-size: 1.5em; */
	font-size: 1em;
	line-height: 1em; 
	margin-top: 0; 
	margin-bottom: 1em; 
	font-weight: normal;
}
p{
	font-size: 1em;
	line-height: 1.5em;
	margin-bottom: 1.25em;
}
	.home p{
		margin-bottom: 1em;
	}

	#content article p{
		margin-bottom: .96153846em;	
	}
table{
	margin-bottom: 1.25em;
}

nav.site-nav, nav.section-nav{
	font-family: pragmatica-web-condensed, Helvetica, Arial, sans-serif;
	font-size: 1em;
	font-style: normal;
	line-height: 1em;
}

nav.breadcrumb{
	font-size: .76923077em;
}
nav.home-entry a{ 
	font-size: 1.28571426em; 
	font-family: pragmatica-web-condensed, Helvetica, Arial, sans-serif; 
}
small, footer, .gallery-caption, .phone, .email{
	font-size: .85714286em;	
}
.image-caption{
	font-size: .85714286em;	
	line-height: 1.25em;
}
.phone, .email{
	line-height: 1.5em;
}
h1 small{
	text-transform: uppercase;
	display: block;
	font-size: 0.4em;
    line-height: 0.6em;
}
h2 .small{
	font-size: 0.8em;
}
.todo{
	background-color: yellow;
	color: #000;
}


/* Type Color 
-------------------------------------------------------------------------------*/

h1, h2, h3, h4, nav.page-nav li a:hover, nav.site-nav a, footer a, footer a:visited, aside .call-to-action{
	color: #101010;
}

/* Changed from CPF red to darker for accessibility contrast */
nav.breadcrumb a, nav.breadcrumb a, nav.breadcrumb a:visited, aside .call-to-action a:hover, .call-to-action a:focus,  form label, article a, .job-summary strong
{ color: #a9192f !important; }
/* CPF Red - Pantone 186 */
.introduction a{
	color: #e52c37;
}

/* Black */ 
nav.breadcrumb a:hover, article a:hover, aside .call-to-action a{ color: #101010 !important; }

/* White */
h1, .call-to-action .highlight, footer a, footer a:visited, .image-caption, .introduction a:hover, .introduction a:focus, nav.site-nav a:hover, nav.site-nav a:focus, nav.site-nav a:focus, nav.section-nav li a:hover, nav.section-nav li a:focus, a.apply-now, .image-caption { color: #fff !important;  }

/* Light Grey */
nav.section-nav li a, nav.site-nav a, section.home .introduction{ 
	color: #c6c6c6;
}
h2.highlight{
	background-color: #e31837;
}
footer a:hover, footer a:focus{
	color: #000 !important; 

}



/* Site Header
-------------------------------------------------------------------------------*/
header.site-header{
	background: rgb(44, 44, 44)  url(/assets/images/structure/header-bg.jpg) no-repeat; /* fallback for browsers that don't support alpha transparency */
    background: rgba(44, 44, 44, 0.8) url(/assets/images/structure/header-bg.jpg) no-repeat;
    padding-top: 10%; /* 10/960 */
	position: relative;
}
header .company-logo{
	position: absolute;
	top: 14px; 
	left: 52px;
	z-index: 99;
	width: 321px;
	height: 73px;
}
.hiring-header{
	position: absolute;
    top: 1rem;
    right: 1rem;

}
.hiring-header img{
	
}
/* Navigation
-------------------------------------------------------------------------------*/
/* Site Nav */
nav.site-nav {
    display: block;
    background: #000;
    width: 94.25%;
    padding-left: 5.75%;
}
nav.site-nav ul {
    float: left;
    margin: 0;
}
nav.site-nav li {
    display: inline;
    float: left;
    list-style: none outside none;
    margin: 0; padding: 0;
}
	nav.site-nav li.active, nav.site-nav li.active_parent  {
	}
nav.site-nav li.first_child{  }
nav.site-nav a, nav.site-nav a:visited {
    display: block;
    background: #000;
    margin: 0;
    /*padding: 8.333333% 16.666667%;*/ /* 8/960, 16/960 */
    padding: 8px 16px;
}
nav.site-nav li.active a, nav.site-nav li.active_parent a{
	background: url(/assets/images/structure/interface-elements.png) no-repeat 0 -40px;
}

/* Home Entry Nav (in Introduction Box) */
nav.home-entry {
	display: block;
}
nav.home-entry ul {
    margin: 0;
}
nav.home-entry li {
    display: inline;
    float: left;
    list-style: none outside none;
    margin: 0 !important; padding: 0 !important;
}
nav.home-entry a, nav.home-entry a:visited {
    display: block;
    color: #fff;
    background: url(/assets/images/structure/interface-elements.png) no-repeat 0 -97px;
	border-bottom: 1px solid transparent;
    padding: 12px 16px 0 16px;
    text-decoration: none !important;
}
nav.home-entry a:hover, nav.home-entry a:focus{
	color: #fff;
	border-bottom: 1px solid #fff;
	/* position: relative;
	outline: 2px solid rgba(255,255,255,0.9);
	z-index: 9999; */
	/*background-position:  0 -136px;*/
}




/* Side Nav (Section) */
nav.section-nav{
   font-size: 1em;
   line-height: 1em;
   text-align: center;  
}
nav.section-nav ul{
	list-style: none;
	padding: 12px 0;
}
nav.section-nav li{
	display: block;
	margin: 0 0 1.3452915% 0; padding: 0;
}
nav.section-nav li a{
	display: block;
	background: #000;
	padding: 5.811659%;
}
nav.section-nav li a:hover{
	/*color: #e31837;*/
}
nav.section-nav li.active a{
	color: #fff;
	background: #e31837;
}


/* Breadcrumb
-------------------------------------------------------------------------------*/
nav.breadcrumb{
	margin: 0 0 2.7906977% 0;
}
nav.breadcrumb a{
	text-decoration: none !important;
	border-bottom: 1px dotted;
}
nav.breadcrumb a:hover{
	text-decoration: none;
	border-bottom: 1px dotted #000
}

/* Footer
-------------------------------------------------------------------------------*/
footer{
	border-top: 9px solid #4e4e4e;
	clear: both;
	color: #fff;
	font-weight: bold;
	padding: .9375% 2.6041667%; /* 0 9/960, 25/960 */
	}
	footer div {
		width: 33%;
		float: left;
	}
	footer div.site-credits { text-align: right;  }
	footer div.links   { text-align: center; }

/* Content Specific
-------------------------------------------------------------------------------*/
/* Home Page */

section.home{
	width: 47.5%; /* 456/960 */
	position: absolute;
	top: 27.020833%; /* 78/960 */
	left: 5.6%; /* 100/960 */
	color: #fff;
	background: #000;
	z-index: 99;
}
/*.ie section.home{
	top: 50px;
}*/
section.home h1{ background: none !important;}
section.home header{ background: #e31837 url(/assets/images/structure/home-intro1a.jpg) no-repeat;}
section.home header{
	/*padding: 7.0175439% 6.097561% 6.097561% 6.097561%;*/ /* 32/456, 15/456 */
	padding: 4.01754% 6.09756% 4.09756%;
}
 section.home .introduction{ 
 	
 	line-height: 1.4em;
 	padding: 2.5641026% 6.097561% 2.5641026% 6.097561%; /* 32/456, 15/456 */
 	position: relative;
 }
	.introduction a{ text-decoration: none !important; }

.home-image{
	width: 100%;
	height: 539px;
	overflow: hidden;
	background: #000;
}
/* Home slide show tabs */
.slidetabs{
	position: absolute;
	top: 14px;
	right: 8px;
}
.slidetabs a{ width: 10px; height: 10px; color: #000!important; background: #878689;font-size: 18px;  display: block; margin-bottom: 5px; text-indent: -99999px;}
.slidetabs a:hover,.slidetabs a:focus													{ background: #fff; }
.slidetabs a.current{ background: #e31837;}
.forward,.backward{
	color: #000;
}

/* Article */
#content article .copy{
    background: #d1d1d1;
	width: 67.1875%; /* 645/960 */
	padding: 1.25% 2.6041667% 1.25% 5.2083333%;  /* 12/960, 25/960, 645/960, 12/960  */
	margin: 1.25% 0 0 0; /* 12/960 */
	float: left;
}
#content article h2, #content article h3, #content article h4{
	display: block;
	clear: left;
}
#content article a{
	text-decoration: underline;
}
#content article h3 a{ text-decoration: none;}
.sub #content h1{
	padding: 3.125% 5.2083333%;
	background: #e31837;
}
/* Article Images */
	.image-medium-align-right{
		width: 43.410853%; /* 280/645 (width of parent) */
		display: block;
		float: right;
		margin: 0 0 3.875969% 3.875969%; /* 0, 0, 25/645, 25/645 */
		text-align: center;
	}

	.image-medium-align-left{
		width: 43.410853%; /* 280/645 (width of parent) */
		float: left;
		text-align: center;
		display: block;
		margin: 0 3.875969% 3.875969% 0; /* 0, 0, 25/645, 25/645 */
	}
		.image-small-align-left img, .image-medium-align-left img, .image-medium-align-right img{ border: 1px solid #ffffff; }



	.image-small-float-left{
		width: 26.356589%; /* 170/645 (width of parent) */
		float: left;
		text-align: center;
		display: block;
		margin: 0 .3875969% .3875969% 0; /* 0, 25/645, 25/645, 0 */
	}
		.image-small-float-left img{ border: 1px solid #a9a9a9; }
		
	.image-caption{
		background: #000;
		display: block;
		text-align: center;
		border-left: 7px solid #e31837;
		padding: 2.1406728%; /* 14/645 */
	}

/* Article layout */
.three-column-float, .float-third{
	width: 30%;
	margin-right: 3%;
	float: left;
}
.three-column-float-cover-two{
	width: 60%;
	float: left;
	margin-right: 3%;
}		
.two-column-float, .float-half{
	width: 45%;
	float: left;
	margin-right: 5%;
}		
.three-column-float img{
	border: 1px solid #fff;
}
.three-column-float a{
	text-decoration: none !important;
}


#content article ul, #content article ol{ 
	margin-left: 1em;
	margin-bottom: 1.5em;
}
#content article li{
    line-height: 1.5em;
    margin: 0 0 .5em 1.5em;
    padding-left: .5em;
}
#content article ul{ list-style: disc; }
#content article ol{ list-style: decimal; }
.hr{
	background: url(/assets/images/structure/divider.png) no-repeat;
	height: 3px;
	border: 0;
	display: block;
	clear: left;
}
.hr-black{
	background: url(/assets/images/structure/divider-black.png) no-repeat;
	height: 3px;
	border: 0;
	display: block;
	clear: left;
}

/* Sidebar boxes */
.call-to-action a{
	display: block;
	text-align: center;
	background: #c9c9c9 url(/assets/images/structure/glow.png) no-repeat center center;
	padding: 10% 0 5% 0;
	margin: 10% 0;
}

.call-to-action h2.highlight{	
	background: #e31837;
	margin: .5em 0;
	padding: .5em 0;		
	display: block;
	color: #fff !important;
}
.call-to-action:hover .email, .call-to-action:focus .email, .call-to-action:hover .phone, .call-to-action:focus .phone{
	color: #000;
}
.call-to-action:hover .highlight, a.call-to-action:focus .highlight{
	background: #000;
	color: #fff;
}

.call-to-action a:focus{
	position: relative;
	outline: 2px solid rgba(255,255,255,0.9);
	z-index: 9999;
}
.call-to-action a:focus .highlight {
	background-color: #000;
    /* outline: 2px solid #a9192f; */
	
}





/* Data table */
table.data{ width: 100%; padding: 5px; border: 1px solid #a9a9a9; }
table.data th, table.data td{ padding: .93023256%; /* 6/645 (width of parent)*/  }
table.data th{ background-color: #e31837; color: #fff; }
/* table.data td{ } */
table.data .odd td, table.data .odd:nth-child(odd){ background-color: #e5e5e5; }

/* Contact Page */
.contact .address{
	width: 200px; 
	float: left;
}

/* Careers */
.job-summary{
	margin: .25em 0 1.5em 0;
	padding: .5em;
	/*background-color: #e7e7e7;*/
}
a.apply-now{
	background: url(/assets/images/structure/button.png) no-repeat scroll 95% -13px #101010;
	padding: .5em 1.5em .5em .5em;
	display: inline-block;
	text-decoration: none !important;
	text-align: center;
}
a.apply-now:hover{
	background-color: #e31837;
	color: #fff !important;
}

/* Gallery */
.gallery{
	position:relative;
	overflow:hidden;
	width: 600px;
	height: 600px;
	margin-bottom: 50px;
}
.gallery .items{
	width:20000em;
	/*height: 400px;*/
	overflow: hidden;
	position:absolute;
}
	.gallery .items div {
		/*width: 600px;
		height: 400px;*/
		float: left;
	}
	.gallery img { border: 1px solid #fff; display: block;}
a.gallery-nav{
	position: absolute;
	background: #e31837 url(/assets/images/structure/interface-elements.png) 6px -225px ;
	text-indent: -20000em;
	width: 25px;
	height: 25px;
	z-index: 100;
}
a.gallery-nav:hover,a.gallery-nav:focus{
	background-color: #000;
}
a.gallery-nav-left{
	left: -36px;
	top: 250px;
}
a.gallery-nav-right{
	right: 8px;
    top: 250px;
	background-position: 8px -252px;
}
a.gallery-nav.disabled{
	visibility: hidden;
}
.gallery .image-desc{
	display: block;
	padding-top: 200px;

}
/*.gallery .image-caption{
	width: 560px;
	text-align: left;
	border-left: 14px solid #E31837;
	
}*/
.gallery-caption {
  border-left: 14px solid #E31837;
  left: 0;
  position: absolute;
  text-align: left;
  top: 460px;
  width: 558px;
  z-index: 1;
}
.gallery-caption-wrapper{
	position: relative; height: 0;
}
.gallery-count{
	padding: 0 0 6px 0;
	margin-bottom: 18px;
	background: url(/assets/images/structure/divider.png) no-repeat bottom left;
	border: 0;
	width: 600px;
}


.gallery2-caption{
  border-left: 14px solid #E31837;
  left: 0;
  /* position: absolute; */
  margin-top: 9px;
  text-align: left;
  top: 460px;
  width: 558px;
  z-index: 1;
}
.gallery2{
	width: 600px;
}
.gallery2 img{
	border: 1px solid #fff;
}


/* Forms 
-------------------------------------------------------------------------------**/

form select {
	padding: 2px;
}
form input[type="text"].focus, form select.focus, form textarea.focus{
	border: 1px solid #7e7e7e;
	border-left: 5px solid #e31837;
	margin: 0;
}

/* Input field widths */
form .xsmall   { width: 50px;  }
form .small    { width: 100px; }
form .medium   { width: 200px; }
form .large    { width: 300px; }
form .xlarge   { width: 400px; }
form .xxlarge  { width: 500px; }
form .xxxlarge { width: 600px; }
form .full 	   { width: 100%;  }
form input, form select, form textarea, form input[type="file"]{
	padding: 6px 6px 2px 6px;
	border: 1px solid #d4dddd;
	border-left: 5px solid #d4dddd;
}
.border{
	border: 1px solid #D4DDDD;

}


/* Form Button */
	button { 
		position: relative;
		border: 0; 
		padding: 0;
		cursor: pointer;
		overflow: visible; /* removes extra side padding in IE */
	}

	button::-moz-focus-inner {
		border: none;  /* overrides extra padding in Firefox */
	}

	button span { 
		position: relative;
		display: block; 
		white-space: nowrap;	
	}

	@media screen and (-webkit-min-device-pixel-ratio:0) {
		/* Safari and Google Chrome only - fix margins */
		button span {
			margin-top: -1px;
		}
	}
	/* OPTIONAL BUTTON STYLES for applying custom look and feel: */		
	button.submit { 
		padding: 0; margin: 0;
		text-align: center; 
		background: #101010 ;	
	}
	button.submit span {
		padding: .5em 1.5em .5em .5em;
		background: transparent url("/assets/images/structure/button.png") no-repeat scroll 95% -13px;
		color: #fff; 
	}
	button.submit:hover, button.submitHover { /* the redundant class is used to apply the hover state with a script */
		background-color: #e31837;
	}
		
	button.submit:hover span, button.submitHover span {
		
	}



/* Print styles!
-------------------------------------------------------------------------------*/
@media print {



}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}