
/* RESET */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{background: transparent; border: 0; margin: 0; padding: 0;} ol, ul{list-style: none;} img{max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast;}

@font-face {
    font-family: 'EurostileBold';
    src: url('/fonts/eurostile/EurostileBold.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}

/* FRAMEWORK */

*{box-sizing: border-box;}
html, body{font-family: 'Roboto', sans-serif; font-size: 16px; -webkit-text-size-adjust: none} body {overflow-x: hidden; line-height: 1.8; /*letter-spacing: .02em;*/}
::-moz-selection{background: #189ad6; color: #fff; text-shadow: none} ::selection{background: #189ad6; color: #fff; text-shadow: none}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
button,
input { /* 1 */
  overflow: visible;
}
button,
select { /* 1 */
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

.main{padding: 75px 25px; display: flex; flex-direction: row!important; flex-wrap: wrap; justify-content: space-between;}
.main img {margin: 0 auto; display: block; width: 100%; height: auto; max-width: 450px; padding: 25px;}

.pad90 {padding: 90px 15px!important;}
.pad50 {padding: 50px!important;}
.pad30 {padding: 30px!important;}

.content-width{margin: 0 auto; width: 93%; max-width: 1750px;}
.content-width-xs{margin: 0 auto; width: 93%; max-width: 1250px;}
.content-width-xs p {max-width: none!important;}

.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0;} .column12{width: 100%;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%;} .column7{width: 58.3333%;} .column6{width: 50%; box-sizing: border-box;} .column5{width: 41.6666%;} .column4{width: 33.3333%;} .column3{width: 25%; box-sizing: border-box;} .column2{width: 16.6666%;} .column1{width: 8.3333%;} .last{padding: 0;} .cf{zoom: 1;} .cf:before, .cf:after{content: ""; display: table;} .cf:after{clear: both;} .clear{clear: both;} *{box-sizing: border-box;}

img.pull-left {float: left;} 
img.pull-right {float: right;}

/* TYPOGRAPHY */

a{text-decoration: none; color: inherit; transition: all .2s ease-in-out;} a:hover{color: inherit;}
a#cta-btn, #form input[type="submit"] {cursor: pointer; display: inline-block; text-align: center;  color: #000; font-family: 'EurostileBold', 'Industry', sans-serif; background: #d3daf3; margin: 0 auto; box-sizing: border-box; font-weight: 600;  position: relative; padding: 1.1em 1.837em; font-size: calc((1.2 - 1) * 1.2vw + 1rem); border: none;}
a#cta-btn2 {cursor: pointer; display: inline-block; text-align: center;  color: #fff; font-family: 'EurostileBold', 'Industry', sans-serif; background: #000; margin: 0 auto; box-sizing: border-box; font-weight: 600;  position: relative; padding: 1.1em 1.837em; font-size: calc((1.2 - 1) * 1.2vw + 1rem);}
a#cta-btn:hover, a#cta-btn2:hover, #form input[type="submit"]:hover {opacity: .75; transition: all .2s ease-in-out;}

.center {text-align: center;}

h1.contact {padding: 2em 0 1em 0!important;}


/* HEADER */

.header {width: 100%; position: absolute;}
.mobile-display {display: none;}
.top-nav {display: flex; flex-wrap: wrap; box-sizing: border-box; margin-top: 22px; padding: 0;}
img.main-logo {width: 100%; max-width: 275px!important; height: auto; padding: 2em 0!important; box-sizing: border-box; position: relative; z-index: 999;}

.mobile-display .column9 {float: left; width: 75%!important;}
.mobile-display .column3 {float: left; width: 25%!important;}


/* ALL OTHER STYLES */

.content-wrapper {display: flex; flex-direction: row!important; flex-wrap: wrap; justify-content: space-between;}
.content-wrapper img {width: 100%; height: auto; max-width: 275px; padding: 3%;}
.content-wrapper h1 {font-size: 48px; font-family: 'EurostileBold', 'Industry', sans-serif; font-weight: 900; position: relative; line-height: 1.1472; max-width: 80%; margin: 0 auto;}
.content-wrapper h2 {font-size: 48px; font-family: 'EurostileBold', 'Industry', sans-serif; font-weight: 900; position: relative; line-height: 1.1472; max-width: 80%; margin: 0 auto;}
.content-wrapper h3 {font-size: 32px; font-family: 'EurostileBold', 'Industry', sans-serif; font-weight: 900; position: relative; line-height: 1.1472; z-index: 2;}
.content-wrapper h3 span {font-weight: 400; font-style: italic; font-size: 20px; display: block; color: #d3daf3;}
.content-wrapper h4 {font-size: 22px; font-family: 'EurostileBold', 'Industry', sans-serif; font-weight: 400; position: relative; line-height: 1.1472; margin-bottom: 15px;}
.content-wrapper p {position: relative; margin: 30px auto; max-width: 80%; font-size: 18px; font-family: 'Roboto', sans-serif; font-weight: 300;}
.content-wrapper p a {text-decoration: underline;}
.content-wrapper p a:hover {text-decoration: none;}
.content-wrapper ul, .content-wrapper h4 {font-family: 'Roboto', sans-serif;}
.content-wrapper ul li {padding: 20px 0; line-height: 1.8; list-style-image: url('/siteart/M-icon.png'); font-size: 18px; position: relative;}
.content-wrapper ul li span {font-weight: 400;}

/* hero/cat slider */
.catslide{position:relative; background-color: black;}
.catslide img {width: 100%; height: 100vh;}
.history-slider img {width: 100%; height: auto;}
.cattitler{
	position: absolute;
    left: 0;
	right: 0;
	top: 45%;
	width: 100%;
	max-width: 85%;
	padding: 0 5%;
    z-index: 2;
    display: inline-block;
    margin: 0 auto;
    color: #fff;
	box-sizing: border-box;
}
.titleblock {max-width:100%; left:0; right:0; position:relative;width:100%;-moz-transform:none;-webkit-transform:none;-ms-transform:none;-o-transform:none;transform:none;padding: 0; display: block; text-align: center;}
.titleblock h1 {text-transform: uppercase; font-weight: 900; font-size: 48px; line-height: 42px; text-shadow: 0px 0px 7px #000; font-family: 'EurostileBold', 'Industry', sans-serif; letter-spacing: 1px;}

/* form + captcha */
#form{background: #fff; padding: 25px; border: 1px transparent solid;}
#form .form-row{display: block; /*margin: 0 0 5px;*/ text-align: left!important;}
#form input[type="text"], #form input[type="email"], #form select, #form textarea, #form input[type="date"]{width: 100%; margin: 5px 0 20px; padding: 10px 5px; border: 1px solid transparent; background: #f6f6f6;}
#form textarea{height: 90px;}

.CaptchaPanel{margin: 0 !important; padding: 0 !important; line-height: normal !important;}
.CaptchaAnswerPanel input{width: 250px; max-width: 100%; padding: 5px; margin: 5px 0; background: #f6f6f6; border: 1px solid #ccc;}
.CaptchaMessagePanel{padding: 0 !important; margin: 0 !important; font-weight: normal !important; font-size: 12px; line-height: 14px;}
.CaptchaImage {width: auto!important; padding: 0!important;}
.CaptchaAnswerPanel{margin: 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel{line-height: 0; margin: 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a{font-size: 12px; color: #000;} .CaptchaWhatsThisPanel a:hover{text-decoration: none;}

.overlay {position: absolute; background: rgba(0,0,0,.75); width: 100%; height: 100%; left: 0; right: 0; top: 0;}
.overlay-light {position: absolute; background: rgba(0,0,0,.25); width: 100%; height: 100%; left: 0; right: 0; top: 0;}

.page-title {width: 100%; text-align: center; padding: 11em 3%; background: url('/siteart/slides/slide6.jpg'); background-size: cover; background-position: center; position: relative;}
.page-title.history {width: 100%; text-align: center; padding: 11em 3%; background: url('/siteart/history/history-hero.jpg'); background-size: cover; background-position: center;}
.page-title.about {width: 100%; text-align: center; padding: 22vh 3% 12vh 3%; background: url('/siteart/about/about-hero.jpg'); background-size: cover; background-position: center;}
.page-title.about2 {width: 100%; text-align: center; padding: 22vh 3%; background: url('/siteart/about/about-hero2.jpg'); background-size: cover; background-position: center;}
.page-title.core-values {width: 100%; text-align: center; padding: 11em 3%; background: url('/siteart/core-values-hero.jpg'); background-size: cover; background-position: center;}
.page-title.accomplishments {width: 100%; text-align: center; padding: 11em 3%; background: url('/siteart/accomplishments-hero.jpg'); background-size: cover; background-position: center;}
.page-title.equipment {width: 100%; text-align: center; padding: 11em 3%; background: url('/siteart/equipment-hero2.jpg'); background-size: cover; background-position: top;}
.page-title h2 {color: #fff; font-size: 48px; text-shadow: 2px 2px 2px #000; -webkit-text-shadow: 2px 2px 2px #000; font-family: 'EurostileBold', 'Industry', sans-serif; font-weight: 900; position: relative; line-height: 1.1472; margin: 0 auto; max-width: 80%;}
.page-title p {position: relative; color: #eee; margin: 30px auto; max-width: 80%; font-size: 18px; font-family: 'Roboto', sans-serif; font-weight: 300;}


/* FOOTER */

.footer {background:#38383b; display: flex; flex-direction: row; flex-wrap: wrap; align-content: space-between; padding: 7em 0; color: #ddd; font-size: 12px; letter-spacing: 1px; line-height: 16px;}
.footer a {color: #ddd!important; display: inline-block; margin: 0 auto;}
.footer a:hover {color: #fff!important;}
.social-links {text-align: right;}
.social-links a {font-size: 18px; margin: 0 0 0 12px;}


/* MEDIA QUERIES (RESPONSIVE) */

@media screen and (max-width: 1390px) {
	.titleblock h1 {font-size: 44px;}
	.cattitler {max-width: 850px; top: 43%;}
}

@media screen and (max-width: 1090px){
	.header .column6 {width: 50%!important; float: left;}
	img.main-logo {max-width: 230px!important;}
	
	.main {flex-direction: column; flex-wrap: wrap; align-items: stretch; justify-content: space-between;}
	
	.content-wrapper h1 span {font-size: 36px; line-height: 30px;}
	.content-wrapper h1 {font-size: 22px; line-height: 24px;}
	h2.contact {padding: 2.5em 0 1.5em 0!important;}

	.titleblock h1 {font-size: 40px; line-height: 40px; padding: 0 1em;}

	.column1, .column2, .column3, .column4, .column5, .column6, .column7, .column8, .column9, .column10, .column11, .column12 {margin: 0 auto!important; width: 100%!important; float: none; padding: 0;}

	.menu-main-container ul, .footer, .social-links {text-align: center;}
	.social-links {margin-top: 30px!important;}
	.footer {padding: 6em 0;}
}

@media screen and (max-width: 890px) {
	.mobile-display {display: block;}
	img.main-logo {padding: 1em 0!important; display: block;}
	.header .column6 {width: 100%!important; float: none;}
	
	.pad30 {padding: 15px!important;}
	.pad50 {padding: 30px!important;}	
	.pad90 {padding: 50px 15px!important;}
	
	.titleblock h1 {font-size: 36px; line-height: 36px;}
	
	.content-wrapper h2, .page-title h2 {font-size: 32px; max-width: none;}
	.content-wrapper h3 {font-size: 28px;}
	.content-wrapper h4 {font-size: 20px;}
	.content-wrapper img {max-width: 200px;}
	.page-title p, .content-wrapper p, .content-wrapper ul li {font-size: 16px;}
}

@media screen and (max-width: 490px) {	
	img.main-logo {max-width: 185px!important;}
	.titleblock h1 {font-size: 28px; line-height: 28px;}
	.content-wrapper img {max-width: none; display: block; float: none; padding: 0; padding-bottom: 30px;}
}
