﻿
/***** BEGIN 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;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 


/*-------- COLORS --------
bright blue: 0041b9
blue: 002b79
gray: 212121
RED: e20000
*/

/***** END RESET *****/

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {
	font-family: 'Barlow', sans-serif !important;
	font-size:16px; 
	line-height: 26px; 
	color: #000; 
	font-weight:400;
	overflow-x:hidden;
	width:100%;
}
h1, h2, h3, h4 {font-family: 'Barlow', sans-serif !important;}

h1 { font-size: 32px; color: #e20000; font-weight: 700; font-style: italic; text-transform:uppercase; letter-spacing: 2px; padding: 10px 0; line-height: 35px;}
h1 span{font-style: normal; font-size: 25px; font-weight: 400;}

h2 { font-size: 26px; color: inherit; font-weight: 400; text-transform:uppercase; letter-spacing: 2px; padding: 5px 0;}
h3 { font-size: 20px; color: inherit; font-weight: 400; text-transform:uppercase; letter-spacing: 2px; padding: 5px 0;  margin-bottom: 5px;}
h4 { font-size: 18px; color: inherit; font-weight: 400; text-transform:uppercase; letter-spacing: 1.5px; padding: 5px 0; }

a:link, a:visited, a:active {text-decoration:none; color:#000;}
a:hover{transition: all .8s ease;}
strong{font-weight:700;}
#underline{text-decoration: underline;}

.fine-print{font-size: 13px;}

#pad{padding:20px 0;}
#l-pad{padding:40px 0;}
#xl-pad{padding:80px 0;}
#space{padding:50px 0;}

.clear{clear: both;}

.small-text {color: #e20000;font-size: 25px;text-transform: uppercase;letter-spacing: 1.5px;padding: 5px 0;line-height:normal;font-style:normal}

/*--- HEADER STYLES --------------------------*/

.header {width:100%; float: left; background: #002b79; padding: 15px 0; color: #fff; display: flex;}

.header .left{display: inline-block; width: 730px;}
.header .left #logo-img{display: inline-block;}
.header .left #mobile-logo{display: none; width: 100%;}

.header .right{display: inline-block;  width: 65%; text-align: right}
.header .right .wrapper-inner{width: auto; margin-right: 60px;}

.header .right p{font-size: 18px; color: #fff; text-align: right; display: inline-block; margin: 0 0 0 30px;}
.header .right p a{color: #fff;}
.header .mobile-icons{display: none;}

/*---BODY--------------------------------*/

.gray-bg{background:#a8a9ad;}
.black-bg{background: #000; color: #fff;}
.blue-bg{background: #002b79; color: #fff;}
.blue-bg h1{color: #fff;}
.gray-stripes{background: url(../siteart/gray-stripes.png) repeat;}

.wrapper-inner {width: 80%; margin: 0 auto;}
.wrapper-center {width: 80%; margin: 0 auto; text-align: center;}

#pageimage{display: block; width: 100%;}

#gray-btn{display: inline-block; background: #212121; color: #fff; padding:10px 25px; margin: 5px 0; letter-spacing: 2px; font-size: 14px; font-weight: 700; font-style: italic; font-family: 'Barlow', sans-serif;}
#gray-btn:hover{background: #fff; color: #212121}

#blue-outline-btn{display: inline-block; border: 1.5px solid #002b79; background: none; color: #002b79; padding:2px 25px; margin: 5px 0; letter-spacing: 2px; font-size: 14px; font-weight: 700; font-style: italic; font-family: 'Barlow', sans-serif; text-transform: uppercase;}
#blue-outline-btn:hover{background: #002b79; color:#fff;}

.red-border{border-top: 2px solid #e20000;}

/*---HOME----------------------------------*/
.welcome{width: 100%; padding: 15px 0 0 0;}
.welcome .left{display: inline-block; width: 45%; text-align: right;padding: 5% 0;}
.welcome .left h1{color: #e20000; font-size: 45px; letter-spacing: 3px;}
.welcome .left h4{color: #e20000; font-size: 25px;}

.welcome .right{display: inline-block; padding:10px 0; right: 0; float: right; width: 50%; vertical-align: middle;}
.welcome .right img{float: right; text-align: right; width: 100%; display: block;}

/*--scrolling inventory--*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}

/*-- def- contact--*/
.def-contact{display: flex; align-items: center; background: #212121;}

.def-contact .left{display: inline-block;  color: #fff; width:50%; border-right:5px solid #e20000; height: 350px;}
.def-contact .left .wrapper-inner{margin-top: 50px;}
.def-contact .left .col-2{display: inline-block; vertical-align: top; width: 45%;}
.def-contact .left .col-2 p, .def-contact .left .col-2 a{color: #fff;}
.def-contact .left .col-2 p{padding-bottom: 10px;}
.def-contact .left .col-2 a:hover{text-decoration: underline;}


.def-contact .right{display: inline-block; width: 50%; border-left:5px solid #0041b9}
.def-contact .right iframe{width: 100%; height: 350px; display: block;}


/*--red contact area--*/
.red-stripes{background: url(../siteart/red-stripes.png) no-repeat; background-size: cover; color: #fff;}

.red-stripes .left{display: inline-block; vertical-align: top; width: 30%;}
.red-stripes .left a{color: #fff;}
.red-stripes .right{display: inline-block; vertical-align: top; width: 50%; float: right;}



/*---CONTACT PAGE------------------------------------*/
.contact-col{display: inline-block; width:45%; vertical-align:top;}
.contact-col h2{color: #e20000}
.contact-col a:hover{text-decoration: underline;}
.contact-col h1 {font-size: 26px;font-weight: 400!important;text-transform: uppercase;letter-spacing: 2px; line-height:normal;font-style:normal}


/*--FOOTER------------------------------*/

a.footerlink:link, a.footerlink:visited, a.footerlink:active{text-decoration:underline; font-family: 'Barlow', sans-serif;font-size:13px; color: #ababaa;}
a.footerlink:hover {text-decoration:none; font-family: 'Barlow', sans-serif;font-size:13px;}

.footertext{font-family: 'Barlow', sans-serif;font-size:13px; color:#ababaa;}

.smallfootertext{font-family: 'Barlow', sans-serif; font-size:12px; color:#ababaa;}

.divfooter {width:100%; text-align:center; margin:0 auto;}



/*---FORM STYLES------------------------*/
#formpage { margin: 0 auto;  font-family: 'Barlow', sans-serif;}
#formpage div {
	vertical-align:top;
	padding:5px 5px 5px 0;
	color: #000;
	font-family: 'Barlow', sans-serif;
	font-weight: 400;
}

#formpage input {
	padding:6px 5px 10px;
	border:1px solid #134773;
	font-size:13px;
	background:#fff;	
	font-family: 'Barlow', sans-serif;
	font-weight: 400;
}

#formpage label {text-transform: uppercase; color: #fff; letter-spacing: 2px; font-size: 14px; font-weight: 700;}

#formpage textarea {
	padding:6px 0px;
	border:1px solid #134773;
	font-weight: 700;
	color:#000;
	font-size:12px;
	background:#fff;
	margin-top: 5px;
	font-family: 'Barlow', sans-serif;
}

/* selects have similar styles to input & textarea fields, but with no padding. Text in a dropdown select is positioned differently */
#formpage select {
	margin-top: 5px;
	border:1px solid #134773;
	vertical-align:middle;
	font-size:12px;
	padding:6px 5px 10px;
	width:100%;
	font-family: 'Barlow', sans-serif;
}

.formfield {
	width:48%; 
	display:inline-block; 
	margin-right: 5px; 
	margin-top: 10px;
	color: #000;
	text-align:left;
	letter-spacing: 1px;
	font-family: 'Barlow', sans-serif;
}
/*.formfield p{text-transform: uppercase; color: #fff; letter-spacing: 2px; font-size: 14px; font-weight: 700;}*/

#formpage input  {
    width:100%;
	margin-top: 5px;
}
 
#formpage input.larger  {
    width:100%;
}

#formpage textarea {
    width:99.8%;
    height:85px;	
	font-family: 'Barlow', sans-serif;
	font-weight: 400;
	padding-left: 5px;
}

#formpage input.radio {
    padding:0; 
    border:0;
    margin:0 5px 0 0;
    width:15px;
    height:15px;
    display:inline;
	
 }
/* focus states of various types of fields */
#formpage input:focus,
#formpage textarea:focus,
#formpage select:focus {
	background:rgba(233,233,233,1.00); 
	color:#000;
	border:1px solid #134773;
	outline-style:none;
}
#formpage input.radio:focus,
#formpage input.checkbox:focus {
	background:none; 
	border:0;
	outline-style:none;
}

#formpage input.button,
#formpage input.button:focus {
    width:160px;
	font-family: 'Barlow', sans-serif;
    margin:0 auto;
    background: #212121; /* For browsers that do not support gradients */
    line-height:18px;
    color:#fff;
	font-size:16px;
	padding: 10px 20px;
	font-weight: 700;
	font-style: italic;
	letter-spacing:1px;
	text-align: center;
	display: block;
	border: none;
}
#formpage input.button:hover {
    margin:0;
    padding:10px 0px;
    background: #fff; /* For browsers that do not support gradients */
    color:#212121;
	margin: 0 auto;
	text-align: center;
	display: block;
}

/* for plain text next to an input field, if not using a table structure */
#formpage label.basic {
    color:#212121;
    font-size:13px;
    text-align:left;
	padding:10px 10px;
} 

.checkbox {text-align: left;}
#formpage input[type="checkbox" ] {
	width:25px; 
	text-align: left;
}

/*control the Captcha */

.CaptchaPanel {margin: 0 auto !important; font-weight: 400 !important; padding:0 0 0 0 !important;line-height:normal !important;color:#fff;width: 70%; text-align:left;}

.CaptchaImagePanel {
font-weight: 400 !important;	
margin-top: 10px;
padding:0 0 0 0;
}

.CaptchaMessagePanel {
padding:0 0 0 0 !important;
margin:0 0 0 0 !important;
font-weight:normal !important;
font-size:12px;
line-height:14px;
text-align: center;
color: #fff !important;font-weight: 400 !important;
}

.CaptchaAnswerPanel {
margin:0 0 0 0;
padding:2px 0px 2px 0px !important;font-weight: 400 !important;
}

.CaptchaWhatsThisPanel {
	line-height:0;
	margin:0 0 10px 0;
	padding:10px 0 10px 0 !important;font-weight: 400 !important;
}
.CaptchaWhatsThisPanel a {color:#fff;font-weight: 400 !important;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 




/*--- RESPONSIVE STYLES ---------------------------------------*/
@media screen and (max-width:1580px){
.formfield{width: 47%;}
#formpage textarea{width: 97%;}



}

@media screen and (max-width:1370px){
	.header{padding: 10px 0;}
	.header .left{vertical-align: middle; width: 40%;}
	.header .left #logo-img{display: none;}
	.header .left #mobile-logo{display: inline-block;}
	
	.header .right{vertical-align: middle; width: 50%; margin-top: 40px;}
	.header .right .wrapper-inner {width: auto; margin-right: 0;}
	
	.welcome .left{width: 100%; float: none; text-align: center; margin:  0 auto; padding: 30px 0;}
	.welcome .left h1{font-size: 35px;}
	.welcome .right{display: none;}
	
	
	.red-stripes .left{width: 100%; display: block; text-align: center;}
	.red-stripes .right{width: 100%; display: block; text-align: center; margin-top: 30px;}
	
}

@media screen and (max-width:1150px){
.wrapper-inner, .wrapper-center{width: 90%;}	
	
	.header{display: block; float: none;}
	.header .left{width: 100%; display: block; text-align: center; margin: 0 auto;}
	.header .right{width: 100%; display: block; text-align: center; margin: 0 auto;}
	.header .right .wrapper-inner {width: 90%; text-align: center; margin: 0 auto !important;}
	.header .right .wrapper-inner br{display:none}
	.header .right p{text-align: center; float: none; margin: 5px auto; display: block; font-size: 15px;}
}

@media screen and (max-width:1024px){
#pad{padding:15px 0;}
#l-pad{padding:40px 0;}
#xl-pad{padding:60px 0;}
#space{padding:40px 0;}	
	
h1{font-size: 30px;}
h1 span{font-size: 22px;}
h2{font-size: 28px;}
	
	
/*-- def- contact--*/
	.def-contact{display: block; }
	.def-contact .left{display: block;  color: #fff; width:100%; padding: 20px 0; border-right:0; height: auto; text-align: center;}
	.def-contact .left .wrapper-inner {margin-top: 0px;}
	.def-contact .left .col-2{width: 100%; text-align: center; font-size: 15px;}
	
	.def-contact .right{display: block; width: 100%; border-left: none;}
	.def-contact .right iframe{height: 280px; }

	
	
.wrapper-inner{text-align: center;}
	
}





@media screen and (max-width:649px){

.formfield{width: 100%; margin-right: 0; margin-top: 5px;}
#formpage div{padding: 5px 0;}
#formpage input{padding: 10px 0 10px 5px;}
#formpage textarea{width: 100%; margin-right: 0; padding: 5px 0 5px 5px;}
	
	.contact-col{display: block; width: 100%; text-align: center; margin-bottom: 20px;}

}

@media screen and (max-width:340px){
	
}
