/* 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;}
.clear{clear: both;}	

/* TEXT/LINK FORMATTING */

h1,strong{font-family: montserratbold; font-weight: 400}
h1,h2{text-shadow: 2px 4px 3px rgba(0,0,0,.3)}
a,p{color: #333}
@font-face{font-family: montserratlight; src: url(/fonts/montserrat-light-webfont.eot); src: url(/fonts/montserrat-light-webfont.eot?#iefix) format('embedded-opentype'),url(/fonts/montserrat-light-webfont.woff2) format('woff2'),url(/fonts/montserrat-light-webfont.woff) format('woff'),url(/fonts/montserrat-light-webfont.ttf) format('truetype'),url(/fonts/montserrat-light-webfont.svg#montserratlight) format('svg'); font-weight: 400; font-style: normal}
@font-face{font-family: montserratregular; src: url(/fonts/montserrat-regular-webfont.eot); src: url(/fonts/montserrat-regular-webfont.eot?#iefix) format('embedded-opentype'),url(/fonts/montserrat-regular-webfont.woff2) format('woff2'),url(/fonts/montserrat-regular-webfont.woff) format('woff'),url(/fonts/montserrat-regular-webfont.ttf) format('truetype'),url(/fonts/montserrat-regular-webfont.svg#montserratregular) format('svg'); font-weight: 400; font-style: normal}
@font-face{font-family: montserratbold; src: url(/fonts/montserrat-bold-webfont.eot); src: url(/fonts/montserrat-bold-webfont.eot?#iefix) format('embedded-opentype'),url(/fonts/montserrat-bold-webfont.woff2) format('woff2'),url(/fonts/montserrat-bold-webfont.woff) format('woff'),url(/fonts/montserrat-bold-webfont.ttf) format('truetype'),url(/fonts/montserrat-bold-webfont.svg#montserratbold) format('svg'); font-weight: 400; font-style: normal}
::-moz-selection{background: #e0b055; color: #fff; text-shadow: none}
::selection{background: #e0b055; color: #fff; text-shadow: none}
h1{color: #6dbfaf; font-size: 72px; text-transform: uppercase}
h2, h3{font-size: 24px}
h2{font-family: montserratlight; font-weight: 400; color: #fff; text-transform: uppercase}
h3, h4{font-family: montserratbold; font-weight: 400; text-transform: uppercase; color: #e0b055}
h3{padding-bottom: 25px}
h4{font-size: 16px; padding-bottom: 10px}
p{font-family: montserratlight; font-size: 14px; line-height: 28px}
a{text-decoration: none; transition: color .2s ease-in-out; -moz-transition: color .2s ease-in-out; -webkit-transition: color .2s ease-in-out}
a:hover{color: #e0b055}
.bold{font-weight: bold;}

/* SITE FRAMEWORK */

.header, .home-header{padding: 15px 0; border-bottom: 1px #f06927 solid; width: 100%}
.column1, .header{width: 100%}
html{font-family: montserratlight}
img{max-width: 100%; height: auto}
.header{background: url(../siteart/bg.jpg) top center no-repeat fixed; background-color:#000;}
.home-header{background: #000; overflow: hidden}
.column2, .column3, .column4, .column5, .column6{float: left; padding-right: 20px; box-sizing: border-box}
.fadein{position: relative; top: -50px; z-index: 0}
.fadein img{position: absolute; opacity: 0; animation-name: fade; animation-duration: 20s; animation-iteration-count: infinite}
.fadein img:nth-child(1){animation-delay: 0s}
.fadein img:nth-child(2){animation-delay: 10s}
.wrapper{max-width: 1150px; margin: 0 auto}
.column2{width: 50%}
.column3{width: 33.33333%}
.column4{width: 25%}
.column5{width: 20%}
.column6{width: 16.66666%; margin: 0 0 20px}
.scrolling-wrap{width: 100%; height: 90px; overflow: hidden}
.scrolling{width: 100%; height: 92px}

@keyframes fade{
	0%{opacity: 0}
	11.11%,33.33%{opacity: 1}
	100%,44.44%{opacity: 0}
}
/*---POP-UP -----------------------------------*/

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.box {
	width: 50%;
	margin: 0 auto;
	background: rgba(0,0,0,0.2);
	padding: 35px;
	border-radius: 20px/50px;
	background-clip: padding-box;
	text-align: center;
}
.popup .close {
    position: absolute;
    top: 10px;
    right: 15px;
	transition: all 0.2s;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #000;
	border: 1px solid #000;
	padding:0 8px 0px 8px;
}
.popup .close:hover {
    background: #000;
	color:#fff;
}
.popup .content {
  max-height: 60%;
  overflow: auto;
}
.popup p{
	font-size: 18px;
	padding: 1% 2%;
	box-sizing: border-box;
	text-align: center;
}
.popup p a{
	text-decoration: underline;
}
.popup p a:hover{
	color:#000;
	text-decoration: none;
}
/*Let's make it appear when the page loads*/
.overlay:target:before {
    display: none;
}
.overlay:before {
	content:"";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: block;
	background: rgba(0, 0, 0, 0.7);
	position: fixed;
	z-index: 99999;
}
.overlay .popup {
	background: #e0b055;
	border:3px solid #ffffff;
	border-radius: 5px;
	width: 100%;
	max-width: 1300px;
	position: absolute;
	top: 6vw;
	left: 0;
	right: 0;
	float:none;
	padding: 40px 0;
	margin: 0 auto;
	text-align:left;
	z-index: 99999999;
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
	color:#000;
	font-size: 16px;font-weight: 400;
}
.overlay:target .popup {
    top: -180%;
    left: -100%;
}
/* ---------------------------------------------*/


/* NAV */

.nav-wrapper #nav ul, .nav-wrapper #nav ul li, #navicon{position: relative; float: left}
.nav-wrapper #nav ul li a, .nav-wrapper #nav ul li:hover>ul{display: block}
#navicon{font-size: 20px; text-decoration: none; z-index: 99999999999999999; color: #fff; background: #6dbfaf; padding: 5px 10px; border-radius: 5px}
.nav-wrapper #nav{float: right; padding-top: 5px}
.nav-wrapper #nav ul{list-style: none; margin: 0; padding: 0; width: 100%; z-index: 9999}
.nav-wrapper #nav ul li a{font-family: montserratbold; color: #6dbfaf; text-decoration: none; text-transform: uppercase; font-size: 12px; padding: 0 10px 10px; transition: none;}
.nav-wrapper #nav li:hover>a{padding: 0 10px 8px; border-bottom: 2px #6dbfaf solid}
.nav-wrapper #nav ul li{zoom: 1;}

/* STYLES */
.header-banner-top {background: #AF0C2F; width: 100%;}
.header-banner-top div {width: 90%; margin: 0 auto; padding: 10px 0;}
.header-banner-top div p {color: #fff; text-align: center; font-size: 16px; line-height: 26px;}

.yellow {
    color: #f4dd4d;
}
#header-phone,#hero-message,#logo{position: relative; z-index: 1}
#logo{float: left; width: 220px}
#header-phone{float: right; text-align: right; font-family: montserratlight; font-size: 12px; padding: 10px 0 0; color: #fff}
#hero-message, #message,.applications a, .category{text-align: center}
.spacer{display: inline; padding: 0 10px}
#hero-message{padding: 10% 0; color: #fff}
#message{font-family: montserratbold; font-weight: 400; color: #e0b055; font-size: 24px; line-height: 36px; padding: 20px; background:rgba(0,0,0,.6);}
.applications,.category a{font-size: 16px; font-family: montserratbold}
.main{background: #fff; padding: 50px 0}
.category{width: 25%; float: left; padding: 50px 20px; box-sizing: border-box}
.category a{transition: none;}
.category img:hover{opacity: .5}
.applications a{display: inline-block; margin: 15px 0; padding: 15px 35px; font-family: montserratbold; color: #fff; background: #6dbfaf; background: -moz-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: -webkit-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: linear-gradient(to bottom,#6dbfaf 0,#00a584 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#6dbfaf', endColorstr='#00a584', GradientType=0 ); border-radius: 5px}
.applications a:hover{background: #6dbfaf}
.applications img{display: block; max-height: 100px}
a.underline{display: block; text-decoration: underline; font-size: 14px; margin-top: 5px}
a.underline:hover{text-decoration: none}

.announce{
	font-family: montserratbold;
	font-size: 21px;
	color: red;
}

.finance-cards { display:flex; gap:20px; }
    .finance-card { flex:1; min-width:0; background:#fff; border:1px solid #ddd; border-radius:8px; padding:30px; box-shadow:0 2px 8px rgba(0,0,0,0.1); }

/* BUTTON STYLES */

a.inventory-button{display: block; float: left; width: 100%; padding: 15px 0; font-family: montserratbold; color: #fff; text-align: center; background: #6dbfaf; background: -moz-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: -webkit-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: linear-gradient(to bottom,#6dbfaf 0,#00a584 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#6dbfaf', endColorstr='#00a584', GradientType=0 ); border-radius: 5px}
a.inventory-button:hover{background: #6dbfaf}

/*FORM*/

#form input, #form select, #form textarea{width: 100%; padding: 5px 10px; margin: 5px 0 15px; box-sizing: border-box}
#form input, #form select{border: 1px solid #DFDFDF; height: 30px; border-radius: 5px}
#form textarea{border: 1px solid #DFDFDF; height: 90px; border-radius: 5px}
#form input[type="checkbox"]{margin: 5px 10px 0 0; width: 13px; height: 13px; display: inline}
#form input[type="radio"]{margin: 5px 10px 0 0; width: 15px; height: 15px; display: inline}
#form input.button, #form input.button:focus{display: inline-block; float: left; width: auto; height: auto; padding: 15px 75px; font-family: montserratbold; color: #fff; text-align: center; background: #6dbfaf; background: -moz-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: -webkit-linear-gradient(top,#6dbfaf 0,#00a584 100%); background: linear-gradient(to bottom,#6dbfaf 0,#00a584 100%); filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#6dbfaf', endColorstr='#00a584', GradientType=0 ); border-radius: 5px; cursor: pointer}
#form input.button:hover{background: #6dbfaf}
.CaptchaPanel{line-height: normal!important; padding: 25px 0 0!important}
.CaptchaImagePanel{width: 183px; padding: 0 10px!important}
.CaptchaMessagePanel{width: 183px; font-weight: 400!important; font-size: 12px; line-height: 14px; padding: 0!important}
.CaptchaAnswerPanel, .CaptchaWhatsThisPanel{width: 200px; padding: 0!important}
.CaptchaWhatsThisPanel{line-height: 0}
.CaptchaWhatsThisPanel a{color: #000; text-align: left}
.CaptchaWhatsThisPanel a:hover{text-decoration: none}

/* FOOTER STYLES */

.footer,.footer a{font-family: montserratregular; color: #aaa; font-size: 11px; line-height: 24px}
.footer{width: 100%; background: #333; border-top: 1px #e0b055 solid; border-bottom: 1px #e0b055 solid; padding: 50px 0}
.footer a:hover{color: #e0b055}
.bottom-footer{background: #333; padding: 20px 0}
.footer-logo{float: right; max-width: 150px; text-align: right; padding-top: 15px}
a.fb,a.twitter{position: relative; top: 25px; font-size: 40px; margin: 0 10px 0 0}
a.fb:hover{color: #3765A3}
a.twitter:hover{color: #55ACEE}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-family: 'montserratregular'; color: #aaa; font-size: 10px; line-height: 14px;}
a.footerlink:hover{font-family: 'montserratbold'; color: #f06927; text-decoration: none; font-size: 10px;}
.footertext{font-family: 'montserratregular'; font-size: 10px; color: #aaa; line-height: 14px;}
.smallfootertext{font-family: 'montserratlight'; font-size: 10px; color: #aaa; line-height: 14px;}
.divfooter{float: left; width: 65%; line-height: 14px;}

/* RESPONSIVE STYLES */

.show-menu-for-mobile{display: none;} 

@media screen and (max-width: 1280px){
    .show-menu-for-mobile{display: none;}
    .wrapper{padding: 0 25px;}
}
@media screen and (max-width: 1150px){
    .show-menu-for-mobile{display: none;}
    .wrapper{padding: 0 25px;}
    .fadein{position: relative; top: -50px; z-index: 0;}
    .nav-wrapper #nav ul li a{font-size: 10px; padding: 0 5px 10px;}
    .nav-wrapper #nav li:hover > a{padding: 0 5px 8px;}
    h1{font-size: 48px; line-height: 50px;}
}
@media screen and (max-width: 958px) {
    .show-menu-for-mobile{display: block;}
    .hide-for-mobile{display: none;}
    .hide{display: none;}
    .nav-wrapper #nav{display: none;}
    .wrapper{padding: 0 25px;}
    .fadein{position: relative; top: -50px; z-index: 0;}
    #logo{float: none; margin: 0 auto;}
    #header-phone{float: none; text-align: center;}
    h1{font-size: 48px; line-height: 50px;}
    h2{font-size: 20px;}
    a.inventory-button{font-size: 14px;}
	.header-banner-top div p {font-size: 14px; line-height: 24px;}
}
@media screen and (max-width: 1040px) {
    .show-menu-for-mobile{display: block;}
    .hide-for-mobile{display: none;}
    .hide{display: none;}
    .nav-wrapper #nav{display: none;}
    .wrapper{padding: 0 25px;}
    .column2{float: none; width: 100%; padding: 0;}
    .column3{float: none; width: 100%; padding: 0;}
    .column4{float: left; width: 50%; text-align: center; margin-bottom: 15px;}
    .category{float: left; width: 50%; text-align: center; margin-bottom: 15px; padding: 10px 20px;}
    .fadein{position: relative; top: -15px; z-index: 0;}
    #logo{float: none; margin: 0 auto;}
    #header-phone{display: none;}
    h1{font-size: 36px; line-height: 40px;}
    h2{font-size: 20px;}
    .divfooter{float: none; width: 100%; text-align: center;}
    .footer-logo{float: none; margin: 0 auto; text-align: center; padding: 0 0 15px;}
    a.inventory-button{font-size: 12px; margin-bottom: 10px;}
    .applications{margin-bottom: 15px;}
	.overlay .popup {top: 20vw;}
}
 @media screen and (max-width: 840px) {
        .finance-cards { flex-direction:column; }
    }
@media screen and (max-width: 614px){
    .show-menu-for-mobile{display: block;}
    .hide-for-mobile{display: none;}
    .hide{display: none;}
    .nav-wrapper #nav{display: none;}
    .wrapper{padding: 0 25px;}
    .column2{float: none; width: 100%; padding: 0;}
    .column3{float: none; width: 100%; padding: 0;}
    .column4{float: left; width: 50%; text-align: center; margin-bottom: 15px;}
    .category{float: left; width: 50%; text-align: center; margin-bottom: 15px; padding: 10px 20px;}
    .fadein{position: relative; top: 80px; z-index: 0;}
    #logo{float: none; margin: 0 auto;}
    #header-phone{display: none;}
    h1{font-size: 36px; line-height: 40px;}
    h2{font-size: 20px;}
    .divfooter{float: none; width: 100%; text-align: center;}
    .footer-logo{float: none; margin: 0 auto; text-align: center; padding: 0 0 15px;}
    a.inventory-button{font-size: 12px; margin-bottom: 10px;}
    .home-header{padding: 15px 0 0;}
    .applications{margin-bottom: 15px;}
}
@media screen and (max-width: 400px){
    .show-menu-for-mobile{display: block;}
    .hide-for-mobile{display: none;}
    .hide{display: none;}
    .nav-wrapper #nav{display: none;}
    .wrapper{padding: 0 25px;}
    .column2{float: none; width: 100%; padding: 0;}
    .column3{float: none; width: 100%; padding: 0;}
    .column4{float: none; width: 100%; text-align: center; margin-bottom: 15px; padding: 0;}
    .category{float: none; width: 100%; text-align: center; margin-bottom: 15px; padding: 10px 20px;}
    .fadein{position: relative; top: 80px; z-index: 0;}
    #logo{float: none; width: 160px; margin: 0 auto; padding-left: 15px;}
    #header-phone{display: none;}
    h1{font-size: 30px; line-height: 30px;}
    h2{font-size: 16px;}
    .divfooter{float: none; width: 100%; text-align: center;}
    .footer-logo{float: none; margin: 0 auto; text-align: center; padding: 0 0 15px;}
    a.inventory-button{font-size: 12px; margin-bottom: 10px;}
    .applications{margin-bottom: 15px;}
	.header-banner-top div p {font-size: 13px; line-height: 22px;}
}