@charset "utf-8";
/***** BEGIN RESET *****/
* {background:transparent;border:0;margin:0;padding:0;font-family:'Saira', sans-serif;vertical-align: baseline;}
ol, ul {list-style: none;}
.clear {clear: both; height:0px; margin:0;}

/***** END RESET *****/
a {text-decoration:none;color:#333;-webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;-ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}
p {font-family: 'Saira', sans-serif;font-size:18px;line-height:1.5;margin-bottom: .75rem;}
body{margin:0;padding:0; font-family:'Saira', sans-serif;background: #fff;background-size: cover;overflow-x: hidden;background-color:#fff; color:#252525;font-size:16px;-webkit-text-size-adjust: none;}
img {max-width: 100%; height: auto; border:none;}
h1, h2, h3, h4 {text-transform: uppercase; margin:0 0 15px 0}
h1 {font-size:1.75em; text-transform:Capitalize; font-weight: 400;}
h2{font-size:1.25em; padding: 30px 0;}
h3{font-size:1em;}
.left {float: left;}
.right {float: right;}
.map-wrap{position: relative; max-height: 300px;}
.map {width: 100%; max-height: 300px;}

/*Wrappers*/
.wrapper {max-width: 1200px;margin: 0 auto; }
.wrapped {max-width: 1200px; margin: 0 auto;}

/*Header*/
.location {Float:left; width: 20%;}
.header strong {font-weight: 900; margin-bottom: 5px; display: block;}
.header {position: relative;width: 100%; padding: 20px 0; line-height:1.25; background: url(../siteart/diamond-plating.jpg) repeat-x; color: #192251; font-weight: 600; z-index:9;}
.logo {width: 66.66666667%;display: inline-block;vertical-align: middle;}
.logo img {display: block; max-width: 100%; margin: 0 auto;}
.phone {display: inline-block;}
.phone a {color: #192251;}

/*Main Image*/
.main-image {width: 100%;}

/*Content*/
.main-image {width: 100%; background-color:#ddd;}
.main-image img {width: 100%;float: left;}
.callouts {position: relative;width: 100%;margin: 0 auto; background: url(../siteart/diamond-plating.jpg) repeat; padding: 2% 0; font-size: 0; list-style:none;}
.callout {position: relative;overflow: hidden;display: inline-block; width: calc(20% - 10px); border: solid 3px #192251;margin: 5px; vertical-align:top; box-sizing: border-box;}		
.callout:hover {cursor: pointer; overflow: hidde;}
.callout .zoom-caption {position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 10;-webkit-transition: all .5s ease;-moz-transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;transition: all .5s ease;}
.callout .zoom-caption h3 {display: block;text-align: center;font-weight: 500;font-size: 18px;color: #fff;padding: 5px 0;margin: 0;background-color: rgba(25, 34, 81, .84);bottom: 0;left: 0;right: 0; position: absolute;color: #fff;}
.callout img {display: block; width: 100%;height: auto;-webkit-transition: all .5s ease;-moz-transition: all .5s ease;-ms-transition: all .5s ease; -o-transition: all .5s ease;transition: all .5s ease;}
.callout:hover img {-webkit-transform: scale(1.25);-moz-transform: scale(1.25);-ms-transform: scale(1.25);-o-transform: scale(1.25);transform: scale(1.25);}
.main-text {position: relative; text-align: center; color: #1a2251; font-size: 18px; padding:0 0 40px 0;}
.main-text p {font-weight: 500;}
.main-text strong {text-transform: uppercase;font-weight: 900;line-height: 1.25;}
.btm {background: url(../siteart/btm.jpg) no-repeat; background-size: cover; padding: 40px 0;}
.half {width:50%; float: left;}
.box-btn {float: left; height: 180px; text-align:center; border: 2px solid #1a2251; background-color: #fff; background-position: center center!important; background-size: 80%!important;}
.box-btn:hover {cursor: pointer;}
.box-btn img {-webkit-transition: all .5s ease;-moz-transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;transition: all .5s ease;}
.box-btn:hover img {transform: scale(1.1); }
.box-btn h3 { text-align: center; color: #192251;padding: 15px 5px;line-height: 1;}
.trk { width: calc(72% - 4px); margin: 0 .5%;}
.trl {width: calc(72% - 4px); margin: 0 .5%;}
.shp { width: calc(26% - 4px); margin: 0 .5%;}
.ctct {width: calc(26% - 4px); margin: 0 .5%;}

/*Scrolling banner*/
.scrolling-wrap { max-width: 100%; height: 90px; overflow: hidden;}
.scrolling {width: 100%;height: 90px;}

/* Footer */
.footer {background-color: #192251;color: #fff; font-size: 12px; text-align: center; line-height:1.4; padding: 40px 0;}
.divfooter {max-width:800px; padding: 0 20px; margin: 0 auto;}
a.footerlink {text-decoration: underline; color: #fff;}

/*Facebook*/
.side {width: 300px;height: 460px;position: fixed;z-index: 9990;}
#fbf {top: 275px;left: -300px;z-index: 99999999;}
#facebookTab {display: block;padding: 8px 16px;position: absolute;right: -44px;top: 0px;background-color: #4267b2;border: 1px solid #fff;border-left: none;color: #fff;}
.fb-page {margin:0 auto; }
.fb_iframe_widget {float: right;}
i.fab.fa-facebook-f {font-size: 24px !important; vertical-align:middle !important;}
p.no-margin {font-size: 12px;line-height: 14px;}

/* Forms */
div#formpage {padding: 20px;background-color: #fff;border: 2px solid #1a2251;}
input#submit {width: 100% !important;}
.fourth select { width: 100% !important; border: none}
select#searchselector {width: 100%;padding: 10px; margin: 4px 0; color: #fff;background: #353534;border: 1px solid #fff;-webkit-border-radius: 0;border-radius: 0;}
.form {position:relative; max-width: 75%; margin: 40px auto; padding: 20px; font-family: 'Saira', sans-serif; font-size: .9em;}
input[type="text"] {width: calc(98% - 2px);margin: 0px 0 12px 0;padding: 4px 1%;font-size: .9em;border: 1px solid #bebebe;-webkit-border-radius:0; border-radius:0;}
selec#searchbox {width: calc(100% - 40px);margin: 10px auto;padding: 0 20px;font-size: 2em;color: #fff;background: #353534;border: 1px solid #fff;-webkit-border-radius: 0;border-radius: 0;}
select:focus {outline: none;}
textarea {width: 98%;min-height:80px;margin:2px 0;padding: 4px 1%;font-size: .9em;background-color: #f9f9f9;border: 1px solid #bebebe;-webkit-border-radius:0; border-radius:0;}
input.m-button {background-color: #192251;border: 1px solid #fff;font-weight: 600;text-transform: uppercase;color: #fff;padding: .5em 3em;}
input.m-button:hover {cursor: pointer; background-color: #000;}

/*CAPCHA*/
.CaptchaPanel {margin:0 !important; text-align: -webkit-center; font-size: 12px; font-weight:300;}
.CaptchaImagePanel {padding:0 !important; text-align: -webkit-center !important;}
.CaptchaImage {width:auto !important;}
.CaptchaAnswerPanel { padding:0 !important;}
.CaptchaMessagePanel {font-weight:400 !important;padding:0 !important;}
.CaptchaWhatsThisPanel {padding:0 !important;}
#CaptchaAnswer {border: 1px solid #999; background: #fff; font-weight: bold;}
.cap-sub-group {text-align: center; margin: 20PX auto;}
.form-btns {max-width: 80%; margin: 0 auto; text-align: center;text-align: center;}

/* Inventory styles*/
.container.cf {margin: 20px auto !important;}
.listings-wrapper .listing-thumb .listing-thumb-title a { color: #192251;}
.hosted-content input[type='submit']:hover, .hosted-content button[type='submit']:hover, .hosted-content .btn:hover, .hosted-content .button:hover {background: #192251!important;}

/*Online Shop*/
.hs-btn.hs-highlighted {background-color: #192251;color: #fff!important;}
select.product-add-quantity {padding-left: 10px;}

/* Media queries*/
.show-menu-for-mobile {display:none;} 

@media screen and (max-width: 1200px) {
.wrapper {max-width: 94%;margin: 0 auto;}
}

@media screen and (max-width: 1024px) {
.callout {width: calc(50% - 12px); margin: 6px;}
.text h1 {padding: 10px 0; text-align:center; }
.logo {float: left;}
.phone {float: right;}
.location {display: none;}
.half {width: 80%; margin: 1% 10%;}
.half img {max-width: 90%;}
.trl {float: right;}
}

@media screen and (max-width: 768px) {
h1 {font-size: 1em;line-height: 1;}
.title-bar strong {display: inline-block; width: 100%;}
.title-bar {font-size: 5vw;text-align: center;line-height: 1;}
#facebookTab {display: none;}
}

@media screen and (max-width: 560px) {
.h-b, .c-r { display: inline-block; float: none; width: 100%;}
.callout {width: calc(50% - 12px); margin: 6px;}
.callout .zoom-caption h3 {font-size: 13px; font-weight:500; padding: 0;}
}

@media screen and (max-width: 460px){
.logo {width: 90%; padding: 0 5%;}
.phone {display: none;}
.half {width: 94%; margin: 1% 3%;}
.box-btn h3 {padding: 15px 4px 0;font-size: 14px;font-weight: 700;}
.box-btn {height: 160px;}
}