/*===================== 
	CSS reset/normalize 
=======================*/

/**Correct `block` display not defined in IE 8/9.**/
article,aside,details,figcaption,figure,footer,header,hgroup,
main,nav,section,summary {display: block;}
pre {white-space: pre-wrap;}
small { font-size: 80%;}


/*===================== 
		Fonts
=======================*/



/*===================== 
	base styles 
=======================*/

html {
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
	}

body {
    font-family: 'Roboto', sans-serif;
    margin: 0;
	padding:0;
	background:url(../siteart/p6.png) repeat;
	color:#000;
	}

svg:not(:root) {overflow: hidden;/*reset*/}
	
/* clear floats */ 
.group:before,
.group:after {content: ""; display: table;} 
.group:after {clear: both;}
.group {zoom: 1;}	
.clear { clear: both;}
	
/*image replacement*/
.hide-text {
	text-indent:  100%;
	white-space:  nowrap;
	overflow:  hidden;
	}	

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
	border-style: solid;
    height: 0;
	} 

img { border: 0; max-width:100%;} 
	
/*===================== 
	typography 
=======================*/

h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto', sans-serif;
	margin: 0;
	padding:0 0 2% 0;
	font-weight:900;
	line-height:1.5em;
	}
	h1 {font-size: 36px;}
	h2 {font-size: 30px;}
	h3 {font-size: 24px;}
	h4 {font-size: 20px;}
	h5 {font-size: 18px;}

p {
    font-family: 'Roboto', sans-serif;
	padding: 0 0 2% 0;
	font-size:18px;
	line-height:1.5em;
	margin: 0;
	}
strong{font-family: 'Roboto', sans-serif;font-weight:normal;}

/*===================== 
	link styles 
=======================*/

a.link:focus {outline: thin dotted;/*reset*/
	}
	
a {
    text-decoration:none;
	color:inherit;
}

a:hover  {
	text-decoration: none;
	color: #ed1c23;
	} 
	
	
.appbutton{}
.appbutton a{background:#38b749; padding:5px 10px;color:#fff; border-radius:3px;}
.appbutton a:hover{background:#262626; padding:5px 10px;color:#fff; border-radius:3px;}
 
.credit-btn {
    background: #ed1c23;
    text-align: center;
    padding:30px 20px;
    display: inline-block;
    color:#fff;
    font-size: 20px;
    font-family: 'Roboto', sans-serif;
    box-shadow: 0 2px 2px rgba(0,0,0,0.5);
    font-weight: 700;
    transition:0.3s all ease;
    margin-top:30px;
    margin-bottom:30px;
}
.credit-btn:hover {
    background: #fff;
    color: #ed1c23;
}
 
/*===================== 
	list styles 
=======================*/
ul.list{
	margin:0;
	padding: 0 0 5% 7%;
}
ul.list li{
	font-size:16px;
}

/*===================== 
	header styles 
=======================*/
.topbar{background:#231f20;width:100%;}
.navbar{float:right;border-bottom:8px solid #ed1c23;padding-right:5%;width:75%;text-align:right;}

header{width:100%;}
.headerwrap{position:relative;max-width:1680px;width:96%;margin:0 auto;}
.logo{position:absolute;left:0;top:-32px;z-index:1000;}



/*===================== 
	content styles 
=======================*/
.wrapper{width:96%;max-width:1680px;margin:0 auto;padding:0;}
.container{width:100%;max-width:1720px;margin:0 auto;}

.internal{padding:0 0 2% 0;background:#a7a7a7;}
.pagetitler{margin-top:2%;padding-bottom:1%;}

.flex-cont-1 {
	display: flex;
	flex-wrap: wrap;
}
.col-1-3 {
	width:33.33%;
}
.img-col-1 {
	width:100%;
	height: auto;
	display: block;
	marign:10px auto;
	padding:10px;
	box-sizing: border-box;
}
	
/*===================== 
	hero styles 
=======================*/
.hero{position:relative;-moz-box-shadow:0 5px 2px rgba(0,0,0,0.3);-webkit-box-shadow:0 5px 2px rgba(0,0,0,0.3);box-shadow:0 5px 2px rgba(0,0,0,0.3);}
.hero img{height:100%;display:block;}
.herotext{position:absolute;right:0;bottom:4px;width:30%;padding:2% 5%;background:rgba(237,28,35,0.8);}
.herotext h2{color:#fff;line-height:1.2em;padding:0;}
.herotext p{color:#fff;}
.herobutton{float:left;margin-right:2%;width:40%;background:#fff;padding:8px 0;color:#ed1c23;font-weight:700;text-align:center;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.5);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.5);box-shadow:0 2px 2px rgba(0,0,0,0.5);}
.herobutton:hover{background:#000;color:#fff;-moz-transition:0.3s all ease;-webkit-transition:0.3s all ease;-ms-transition:0.3s all ease;-o-transition:0.3s all ease;transition:0.3s all ease;}

video#background-video{
	width: 100%;
}
/*===================== 
	welcome styles 
=======================*/
.welcome{background:#fff;padding:4% 0;position:relative;}
.welcometext{width:60%;float:left;}
.welcome h3{padding:0;line-height:1em;color:#ed1c23;font-weight:300;}
.welcome h1{color:#ed1c23;line-height:1.2em;}
.welcomehero{position:absolute;right:0;top:60px;max-height:640px;overflow:hidden;}
.welcometext p{
	font-size: 18px;
	
}

.welcomehero{
	border: 7px red solid;
	background-color: red;
}

.welcomehero img{
	width: 100%;
	height: auto;
	object-fit: cover !important;
}

/*===================== 
	contact styles 
=======================*/
.contactblock{background:#a7a7a7;padding:2% 0;}
.contactblock > .wrapper{width:80%;margin:0 auto;}
.contactleft,.contactright{width:48%;margin:0 1%;float:left;}
.half{width:50%;float:left;}
.office{margin-bottom:4%;}
.office h4{text-decoration:underline;padding:0;}
.office p{color:#fff;line-height:1.3em;padding:0;}
.office p a{color:#000;font-weight:700;}
.office p a:hover{color:#fff;}
.contactbutton{width:200px;background:#e6e6e6;padding:5px 0;text-align:center;margin:4px 0 8px 0;color:#000;font-size:14px;font-weight:700;}
.contactbutton:hover{background:#fff;color:#000;-moz-box-shadow:0 2px 5px rgba(0,0,0,0.4);-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.4);box-shadow:0 2px 5px rgba(0,0,0,0.4);-moz-transition:0.3s all ease;-webkit-transition:0.3s all ease;-ms-transition:0.3s all ease;-o-transition:0.3s all ease;transition:0.3s all ease;}
.contactright{text-align:center;}
.contactright iframe{height:350px;}

/*===================== 
	Form styles 
=======================*/
#formpage{padding:0 10px;}

form{
	margin:0 0 0;
}
label{
	display:block;
	font-size:16px;
	padding-top: 4%;
	width:100%;
}
input{
	font-family: 'Open Sans', Arial, sans-serif;
	border: #999999 solid 1px;
	border-radius: 2px;
	padding: 1%;
	font-size:14px;
	width:98%;
	margin-bottom:10px;
}
input:focus{
	border: #2885b3 solid 1px;
}
input.button2{
	display:block;
	width:50%;
	margin:0 auto 5% auto;
	border:#277e32 solid 1px;
	background-color:#38b749;
	color:#fff;
	border-radius: 2px;
}

input.button2:hover{
	background-color:#277e32;
	cursor:pointer;
}

select{
	font-family: 'Open Sans', Arial, sans-serif;
	border: #999999 solid 1px;
	padding: 1%;
	font-size:14px;
	width:98%;
}

textarea{
	font-family: 'Open Sans', Arial, sans-serif;
	border: #999999 solid 1px;
	border-radius: 2px;
	padding: 1%;
	font-size:14px;
	width:98%;
}

input[type='checkbox'],input[type='radio']{width:15px !important;min-width:15px !important;margin-right:2px;}


/*===================== 
	inventory styles 
=======================*/
.scrollinginv{padding:2% 0;background:#4b4b4b;}

.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}

.hosted-content .pagination > .drop-down-form select{width:8% !important;}
.hosted-content h1{font-size:24px !important;line-height:1.3em;}
.hosted-content h2{font-size:22px !important;line-height:1.2em;}
.hosted-content h3{font-size:20px !important;line-height:1.1em;}

.mobilecontainer { 
	overflow:hidden; /* must have this property for mobile phones and tablet display! */
	width:100%; 
	margin:0 auto;
	height:92px; 
	padding:0;
	background:#000;
}
iframe.banner {
	width:100%;
	height:92px;
	background:#000
}


/*===================== 
	footer styles 
=======================*/

.pagebottom{background:#111111;padding:50px 0;border-top:#474747 4px solid;}
.pagebottom p{color:#fff;font-size:14px;}
.pagebottom a{color:#fff;}
.pagebottom a:hover{color:#ffcd07;}

footer {
	margin: 0 auto;
	width: 100%;
	}
	
a.footerlink:link,
a.footerlink:visited, 
a.footerlink:active {
	text-decoration: none; 
	font-size:11px;
	color: #ccc;
	border-bottom:none;
	}
	a.footerlink:hover {
		text-decoration:none; 
		font-size:11px;
		color: #fff;
		}

.footertext {
	font-size:11px; 
	color:#666;
	}

.smallfootertext {
	font-size:11px; 
	color:#666;
	}

.divfooter {
	text-align:center; 
	margin:0 auto;
	}

/*===================== 
	Responsive styles 
=======================*/
@media screen and (max-width: 1700px) {
	.navbar{padding-right:2%;}
	.welcomehero{max-height:600px;}
}

@media screen and (max-width: 1540px) {
	h1 {font-size: 32px;}
	h2 {font-size: 28px;}
	h3 {font-size: 24px;}
	h4 {font-size: 20px;}
	h5 {font-size: 18px;}
	p {font-size: 16px;}
	.logo{width:350px;}
	.herobutton{width:48%;font-size:14px;}
	.welcomehero{max-height:490px;width:35%;}
	.contactblock > .wrapper{width:92%;}
	.contactleft img{max-width:300px;}
	.pagebottom{padding:30px 0;}
}

@media screen and (max-width: 1300px) {
	.logo{width:300px;}
	.herotext{padding:2%;width:40%;}
	.contactleft{width:56%;margin:0 2%;}
	.contactright{width:36%;margin:0 2%;}
}

@media screen and (max-width: 1100px) {
	.logo{width:220px;}
	h1 {font-size: 28px;}
	h2 {font-size: 24px;}
	h3 {font-size: 20px;}
	h4 {font-size: 18px;}
	h5 {font-size: 16px;}
	p {font-size: 16px;}
	.herotext{width:46%;}
	.welcomehero{max-height:none;}
	.col-1-3 {
		width:50%;
	}
}

@media screen and (max-width: 800px) {
	.logo{width:200px;}
	.navbar{padding-right:0;}
	.herotext{position:relative;display:block;width:96%;padding-bottom:4%;text-align:center;background:#ed1c23;}
	.herobutton{/*display:inline-block;zoom: 1;*display: inline;vertical-align:middle;*/margin:0 1%;width:48%;}
	.herotext h2 span{display:block;}
	.contactleft,.contactright{width:100%;display:block;float:none;text-align:center;margin:2% auto;}
	.contactbutton{margin:5px auto;margin-bottom:10px;}
	.fb-page{display:none !important;}
	.pagetitler{text-align:center;}
}

@media screen and (max-width: 650px) {
	.welcometext{width:100%;text-align:center;display:block;float:none;}
	.welcomehero{display:none;}
}

@media screen and (max-width: 480px){
	.wrapper{width:92%;}
	h1 {font-size: 22px;}
	h2 {font-size: 20px;}
	h3 {font-size: 18px;}
	h4 {font-size: 16px;}
	h5 {font-size: 15px;}
	p {font-size: 15px;}	
	.logo{width:180px;}
	.herotext{width:92%;padding:4% 4% 6% 4%;}
	.half{float:none;width:100%;display:block;margin:0 auto;}
	.contactbutton{width:250px;}
	.pagebottom{padding:15px 0;}
	.contactleft img{max-width:100%;}
}

@media screen and (max-width: 360px){
	.herobutton{font-size:12px;}
	.welcome h1{font-size:20px;}
}