

/*

Color:
Background:
Header:
Text:
Page: 
Links: 
border: 
Gradient:

*/

/*************************
reset
*************************/

h1, h2, h3, h4, h5, h6, p, dl, dt, dd {margin:0;padding:0; }
ul, ol, dl {padding:0 0 20px 40px;margin:0;list-style:none; }


/*************************
HTML selectors
*************************/

body {width:100%;height:100%;background-color: #fff;text-align:center;margin:0 auto; }
header, #page-header, #call-outs, #main, #social, footer {width:100%;height:auto;float:left;clear:both;text-align:center; }
#page-header {background: #edd774 url(../images/background-stripes.png) repeat-x left top; }
a[ href] {text-decoration:none; color: #000; }
a[ href]:hover {color: #ff6300; }
p {padding:0 0 20px 0; }
h1 + ul, h2 + ul, h3 + ul, h4 + ul,
h1 + ol, h2 + ol, h3 + ol, h4 + ol {padding: 0;margin:0; }
ul, ol {padding:0 0 0 0;margin:0; }
ol {list-style:decimal;margin-left:15px; }


/*************************
containers
*************************/

body {width:100%;height:100%;text-align:center;margin:0 auto; background-color: #323232;}
header, #main, #call-outs, footer {width:100%;height:auto;float:left;clear:both;text-align:center; }
.main-wrapper {width:96%;max-width:1080px;height:auto;margin:0 auto;padding:0;text-align:left;position:relative; }
#main-content {padding-top:40px; }
#main {min-height:300px; padding-bottom:20px; padding-top: 100px; /*margin-top:100px; */}

/* clearfix of main-wrapper */
.main-wrapper:before, .main-wrapper:after { content: ""; display: table; }
.main-wrapper:after { clear: both; }
.main-wrapper { *zoom: 1; }

/* IE fixes */
.lt-ie8 .main-wrapper, .lt-ie9 .main-wrapper {width: 960px; max-width: none; }


/*************************
type

vertical rhythm:
target rhythm number (22) / font size = line height

*************************/

body { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; color: #3c2b1a;}


/* font size and line height */

body				{ font-size: 13px; line-height:1.7; }
h1, .header-1		{ font-size: 36px; line-height: 1; }
h2, .header-2		{ font-size: 20px; line-height: 1.25; }
h3, .header-3		{ font-size: 16px; line-height: 1.25; }
h4, .header-4		{ font-size: 14px; line-height: 1.42; }
h5, .header-5		{ font-size: 12px; line-height: 1.66; }
#footer dt			{ font-size: 12px; line-height: 1.66; }


/* padding */

h1, .header-1		{ padding: 0 0 20px 0; }
h2, .header-2		{ padding: 0 0 20px 0; }
h3, .header-3		{ padding: 0 0 20px 0; }
h4, .header-4		{ padding: 0; }
h5, .header-5		{ padding: 0; }
#footer dt			{ padding: 0; }
h2 ~ h2 			{ padding-top: 20px; }


/* weight */

h1, .header-1		{ font-weight: normal; }
h2, .header-2		{ font-weight: normal; }
h3, .header-3		{ font-weight: bold; }
h4, .header-4		{ font-weight: bold; }
h5, .header-5		{ font-weight: normal; }
#footer dt			{ font-weight: normal; }


/* typekit */
.wf-loading h1, .wf-loading h2, .wf-loading h3, .wf-loading h4, .wf-loading h5, .wf-loading .primary-type {visibility:  hidden; }
.wf-active h1, .wf-active h2, .wf-active h3, .wf-active h4, .wf-active h5, .wf-active .primary-type {visibility: visible; }
.wf-inactive h1, .wf-inactive h2, .wf-inactive h3, .wf-inactive h4, .wf-inactive h5, .wf-inactive .primary-type {visibility: visible; }



/*************************
960 12 column grid
*************************/

.test {outline: 1px solid red; }

.grid-1,
.grid-2,
.grid-fifth,
.grid-3,
.grid-4,
.grid-5,
.grid-6,
.grid-7,
.grid-8,
.grid-9,
.grid-10,
.grid-11,
.grid-12,
.grid-half,
.grid-full {

	float:left;
	margin:20px 2.0833%/* 20/960 */;
	height:auto;
	
}

.grid-1 				{width:4.16666%; }		/* 40/960 */
.grid-2 				{width:12.5%; }			/* 120/960 */
.grid-fifth				{width:15.83333%; }		/* 152/960 */
.grid-3 				{width:20.83333%; }		/* 200/960 */
.grid-4 				{width:29.16666%; }		/* 280/960 */
.grid-5 				{width:37.5%; }			/* 360/960 */
.grid-6, .grid-half 	{width:45.83333%; }		/* 440/960 */
.grid-7 				{width:54.16666%; }		/* 520/960 */
.grid-8 				{width:62.5%; }			/* 600/960 */
.grid-9 				{width:70.83333%; }		/* 680/960 */
.grid-10 				{width:79.16666%; }		/* 760/960 */
.grid-11 				{width:87.5%; }			/* 840/960 */
.grid-12, .grid-full 	{width:95.83333%; }		/* 920/960 */

.wrapper 				{padding:0;margin:0; }
.grid-1.wrapper 		{width:8.333333%; }		/* 80/960 */
.grid-2.wrapper 		{width:16.666667%; }	/* 160/960 */
.grid-3.wrapper 		{width:25%; }			/* 240/960 */
.grid-4.wrapper 		{width:33.33333%; }		/* 320/960 */
.grid-5.wrapper 		{width:41.666667%; }	/* 400/960 */
.grid-6.wrapper 		{width:50%; }			/* 480/960 */
.grid-7.wrapper 		{width:52.083333%; }	/* 560/960 */
.grid-8.wrapper 		{width:66.666667%; }	/* 640/960 */
.grid-9.wrapper 		{width:75%; }			/* 720/960 */
.grid-10.wrapper 		{width:83.333333%; }	/* 800/960 */
.grid-11.wrapper 		{width:97.666667%; }	/* 880/960 */
.grid-12.wrapper 		{width:100%; }			/* 960/960 */
.grid-full.wrapper 		{width:100%; }			/* 960/960 */

.pull-left {float: left; }
.pull-right {float: right; }

.push.grid-5 { margin-left: 11.458333%/* 110/960 */; }



/*************************
shared
*************************/

.padding-wrapper { display: block; padding: 20px; }
.no-pad { padding: 0; }
.pad-top { margin-top: 20px; }
.pad-bottom {margin-bottom: 20px;}
.content-row { width: 100%; float: left; clear: both; margin: 20px 0; background-color: #ebebeb;}
.no-fill { background: transparent;}

.block-wrapper { display: block; padding: 20px;}
.block-wrapper ul { list-style: disc; padding-left: 15px; }

#video-wrapper {text-align: center;}
#video-wrapper img {width: 90%; max-width: 700px; position: relative; padding: 20px 5% 20px 5%;}

.top-lead-generator { text-align: right; display: block; }
.top-lead-generator h3 { font-weight: normal; padding: 0;}

#page-name, #page-copy, #publications, #awards { padding-top: 40px; }
#page-name h1, #page-name h2{ padding: 0; }

a.selected { color: #ffa21d!important; }

.selected-project { filter: alpha(opacity=40); -moz-opacity:0.4; -khtml-opacity: 0.4; opacity: 0.4; }


/*************************
header
*************************/

/*header {background-color: rgba(0,0,0,.8);}
header a[ href] {color: #8d8d8d; }
header .main-wrapper { background-color: #383838; }
header a[ href]:hover {color: #dbdbdb; }
header .grid-3, header .grid-9, header .grid-12 { background-color: transparent; }

#logo { font-size: 16px; font-weight: bold; line-height: 40px; }
#logo .grid-12 { margin-bottom: 0; margin-top: 10px; }
#logo a {color: #fff!important;}

#large-screen-nav { display: block; text-transform: uppercase; font-size: 11px; font-weight: bold; }

#primary-navigation { float: left; list-style: none; padding: 0 10px 0 20px; }
#primary-navigation li { float: left; position: relative; }
#primary-navigation a { display: inline-block; padding-right: 15px; padding-bottom: 20px; }

#small-screen-nav { display: none; text-align: right; }
#small-screen-nav.grid-4 { margin-top: 10px; margin-bottom: 0; }
#small-screen-nav .button { height:auto; line-height: 40px; padding: 10px 10px; margin: 0px 5px 0px 5px; font-size: 11px; }

#utility { float: right; list-style: none; padding: 0 20px 0 0; font-weight: normal; }
#utility li { display: inline-block; padding: 0 0; position: relative; }
#utility a { display: inline-block; padding-right: 15px; padding-bottom: 20px; }

#utility li:hover ul { display: block; }
#utility li ul { display: none; width: 175px; position: absolute; left: -10px; top: 100%; background-color: rgba(0,0,0,.8); z-index: 9999; padding: 0 10px 20px 10px;}
#utility li li { float: left; clear: both; width: 100%; }
#utility li li a { display: inline-block; height:auto; line-height: 1.6; padding: 10px 0 0 0; }

.page-header {background-color: transparent; margin-bottom: 0; margin-top: 40px; }*/


#logo { font-size: 16px; font-weight: bold; line-height: 40px; height:40px; float: left; vertical-align: center; padding-left: 20px; }
#logo a {color: #fff!important;}

header {background-color: transparent; }
header a[ href] {color: #fff; }
header .main-wrapper { background-color: rgba(0,0,0,.8); padding-top: 40px; padding-bottom: 20px; }
header a[ href]:hover {color: #dbdbdb; }
header .grid-3, header .grid-9, header .grid-12 { background-color: transparent; }

#large-screen-nav { display: block; text-transform: uppercase; font-size: 10px; font-weight: bold; }

#primary-navigation { float: right; list-style: none; padding: 0 10px 0 20px; line-height: 40px; height:40px; letter-spacing: 1;}
#primary-navigation li { float: left; position: relative; }
#primary-navigation a { display: inline-block; padding-right: 15px; padding-bottom: 0; }

.utility { font-weight: normal; }
.utility a[ href] {color: #8d8d8d; }

#small-screen-nav { display: none; text-align: right; float: right;}
#small-screen-nav.grid-4 { margin-top: 10px; margin-bottom: 0; }
#small-screen-nav .button { height:auto; line-height: 40px; padding: 10px 10px; margin: 0px 5px 0px 5px; font-size: 11px; }

#primary-navigation li:hover ul { display: block; }
#primary-navigation li ul { display: none; width: 143px; position: absolute; left: -10px; top: 100%; background-color: rgba(0,0,0,.8); z-index: 9999; padding: 0 10px 20px 10px; line-height: 1.7; height:auto; }
#primary-navigation li li { float: left; clear: both; width: 100%; }
#primary-navigation li li a { display: inline-block; height:auto; line-height: 1.6; padding: 10px 0 0 0; }

.page-header {background-color: transparent; margin-bottom: 0; margin-top: 40px; }


/*************************
homepage
*************************/

.homepage header, .detail header .main-wrapper { background-color: rgba(0,0,0,.8); /*position: fixed; top: 0; left: 0; z-index: 100;*/}
.homepage #main, .detail #main { padding: 0; }
.homepage header .main-wrapper { background-color: transparent; }
#home-photo { width: 100%; float: left; clear: both; text-align: center; position: relative; }
#home-photo img { width: 100%; height: auto; float: left;}
#home-copy { font-size: 40px; line-height: 40px; color:#fff; float: left; text-align: center; width: 80%; padding: 0 10%; font-weight: normal; position: absolute; top: 50%; left: 0;}

/*************************
detail
*************************/

#detail-photo { float: left; width: 100%; position: relative; }
#detail-photo img { width: 100%; height: auto; }
.page-info { padding-bottom: 100px; background-color: #fff;}

#detail-thumbs { position: absolute; bottom: -1px; right: 0; padding: 1px 0 1px 1px; background-color: #fff; }
#detail-thumbs img { width: 87px; padding-right: 1px; float: left; }

/*************************
News
*************************/

.team #page-copy h2, .team #page-copy h3 { padding: 0; font-weight: normal; }

/*************************
News
*************************/

.news { padding-bottom: 40px;}

/*************************
secondary navigation
*************************/

#mobile-secondary-navigation { display: none; margin-top: 0;}
#mobile-secondary-navigation .grid-12 { margin-top: 0; margin-bottom: 0;}
#mobile-secondary-navigation select { width: 100%; float: left; }
#mobile-breadcrumb { padding: 0px 20px 5px 20px; font-weight: bold; }

.cta { border-top: 1px solid #949494; padding-top: 20px; }

/* fixed position */
header { position: fixed; top: 0; left: 0; z-index: 100;}	
.with-secondary #secondary-navigation { background-color: #fff; border-bottom: 1px solid #000; position: fixed; top: 105px; left: 0; z-index: 100; }
.with-secondary #main { margin-top: 160px; }


/*************************
gallery
*************************/

.items {margin:0; width:100%; height: auto; padding-top: 6px;}
.grid-4.item-block {width: 33.333333%; /* 310/960 */ margin: 0;/* 5/960 */; position: relative; outline: 2px solid #323232;}
.item-block img { width: 100%; height: auto; padding: 0; }

#mobile-product-sort {  background-color: #d2d2d2; display: none; padding: 20px 20px; }
#mobile-product-sort .header-3, #mobile-product-sort select { float: left; padding: 0 10px 0 0; }

.item-block a:hover .thumb-info { display: block; }
.item-block a:hover img { filter: alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity: 0.6; opacity: 0.6;}
.thumb-info { display: none; float: left; width: 90%; padding: 20px 10%; position: absolute; top: 0; left: 0;}
.thumb-info h2, .thumb-info h3, .thumb-info h4 { padding: 0; color: #fff; background-color: #000; float: left; clear: both; }
.thumb-info h2 { font-size: 11px; font-family: Georgia; font-style: italic; font-weight: normal; padding: 5px; }
.thumb-info h3 { font-size: 18px; font-weight: bold; }
.thumb-info h4 { font-size: 14px; font-weight: bold; }

.gallery #main .main-wrapper { background: transparent; }

/*#pageContent {display:none;}*/


/**** Isotope Filtering ****/
.isotope-item {  z-index: 2; }
.isotope-hidden.isotope-item {  pointer-events: none; z-index: 1; }

/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {  -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; }
.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: top, left, opacity; transition-property: transform, opacity; }

/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s;-ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }   



/*************************
footer
*************************/

footer { color: #5a5a5a; padding-top: 20px; padding-bottom: 60px;}
footer .main-wrapper { background-color: transparent!important; }
#footer-copy { float: right; }
#footer-navigation {margin-top: 0;}
footer a[ href] { color: #5a5a5a; }
footer a[ href]:hover { color: #fff; }
#footer-navigation .primary { font-size: 16px; font-weight: bold; }
#footer-navigation .grid-3, footer .grid-6 { background-color: transparent; }
#footer-navigation ul { list-style: none; font-size: 12px; padding: 0; margin: 0; float: left; clear: both;}
#footer-navigation ul:last-child { border-top: 1px solid #5a5a5a; padding-top: 10px; margin-top: 10px;}
#footer-navigation li { float: left; }
#footer-navigation a { float: left; padding: 0 10px; }
#footer-navigation #top-link { display: none!important; }
#footer-navigation #top-link a { text-align: right; font-size: 11px; }
footer .phone-number { font-size: 20px; }
.quick-links dt { text-transform: uppercase; font-weight: bold;}


/*************************
buttons
*************************/

input[type="submit"], .button {
font-size: 11px;
color: #fff!important;
font-weight: bold;
text-decoration:none;
text-align: center;
line-height:1.2;
width:auto;
height: auto;
display:inline-block;
text-transform: uppercase;
background:#333333;
background: -webkit-gradient(linear, left top, left bottom, from(#5a5a5a), to(#333333)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #5a5a5a,  #333333); /* for firefox 3.6+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5a5a5a', endColorstr='#333333');  /* for IE */
padding: 10px 20px;
}

a.button-large {padding:10px 20px; font-size: 16px; }
a.button-small {padding:10px 20px; font-size: 12px; }

/* brown gradient */
#fp-form input[type="submit"], a.button-secondary {
color: #fff;
background: #7e7e7e; /* for non-css3 browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#b3b3b3), to(#7e7e7e)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #b3b3b3,  #7e7e7e); /* for firefox 3.6+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#7e7e7e');  /* for IE */
}

#fp-form input[type="submit"]:hover, a.button:hover {background: #d18000; /* for non-css3 browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#f4a11d), to(#d18000)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #f4a11d,  #d18000); /* for firefox 3.6+ */
text-decoration:none;
color:#fff;
border: none;
text-decoration: none;
cursor: pointer;

}

/*************************
CSS 3
*************************/

/* rounded small */
.button, #secondary-message a[ href], .rounded, #fp-form input, #fp-form select, #fp-form textarea {-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px; }

/* rounded large */
.footer-links, .pagination {-moz-border-radius: 7px;-webkit-border-radius: 7px;border-radius: 7px; }

/* transitions */
.button,
.nav a[ href],
#secondary-message a[ href],
#home .intro li a,
#home #banner { 
	
	-webkit-transition: 	all .2s ease-in-out;
	-moz-transition: 		all .2s ease-in-out;
	-o-transition: 			all .2s ease-in-out;
	transition: 			all .2s ease-in-out;
	
 }

.mobileNav {
background: #c0b86e; /* for non-css3 browsers */
background: -webkit-gradient(linear, left top, left bottom, from(#dad188), to(#c0b86e)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #dad188,  #c0b86e); /* for firefox 3.6+ */
}

/* end custom author styles */


	
/* ==|== media queries ======================================================
   EXAMPLE Media Query for Responsive Design.
   This example overrides the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

   

@media only screen and (max-width: 1169px) {
	.info-link.button, .video-link.button, .download-link.button{width:100%; min-width:100%; font-size:9px; padding:10px 0;}
}

@media only screen and (max-width: 890px) {

	/*#page-copy.grid-6 { width:66.666667%; }*/

}

@media only screen and (max-width: 768px) {

	/* fixed position */
	header { position: static; }
	#main { padding-top: 0; }
	.homepage #main { padding-top: 0; }

	/*.grid-6, .grid-4, .grid-3 {width: 95.83333%; }*/
	#large-screen-nav { display: none; }
	#small-screen-nav { display: block; }
	.grid-9.wrapper {width: 100%; }
	#secondary-navigation, #secondary-navigation-sticky-wrapper { display: none; }
	#mobile-secondary-navigation { display: block; }
	#utility { display: none;}
	.no-mobile { display: none; }
	
	.grid-5.push { margin:20px 2.0833%/* 20/960 */; }
	
	.break-half { width:45.83333%; }	
	.break-full { width: 95.83333%; }
	
	.gallery-thumb { width:45.83333%; }
	#detail-thumbs { display: none; }
	
	#footer-navigation ul:last-child { border: none; padding-top: 0; margin-top: 0;}
	#footer-navigation {display: block; float: left; width: 100%; padding: 0; margin: 0;}
	#footer-navigation ul {padding: 0; margin-top: 0; margin-bottom: 0; width: 100%;}
	#footer-navigation li, #footer-navigation dt, #footer-navigation dd { float: left; width: 100%; clear: both; }
	#footer-navigation a { float: left; width: 90%; border-bottom: 1px solid #515151; padding: 10px 5%;}
	#footer-navigation #top-link { display: block!important; }
	#footer-navigation .grid-3 {margin-bottom: 0; margin-top: 0;}
	#footer-copy { float: left; }
	
}

@media only screen and (max-width: 600px) {

	#home-photo img { width: 140%; height: auto; float: left;}

	#logo { font-size: 12px; }

	.grid-4.item-block { width: 50%; }

}

@media only screen and (max-width: 400px) {

	.grid-4.item-block { width: 100%; }

}

/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


   
