﻿/***** 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 --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

/*-------- BODY STYLES --------*/

body {

}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HEADER STYLES ---------------------*/
header {}

.header{
	font-family: proxima-nova, helvetica, sans-serif;
	
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    text-transform: none;
    white-space: normal;
	display: flex;
	align-items: center;
	gap: 10px;
	
	padding: 10px 12% 4px;
	box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
}

.header .btn-blue{
    padding: 12px 24px;
	border-radius: 2px;
}

.header .col17 a{
	color: #000;
}
.header .col17 a:hover{
	color: #f47b20;
}
/*---BODY--------------------------------*/

.flex{display: flex;}
.flex-wrap{flex-wrap: wrap;}
.justify-between{justify-content: space-between;}

.center{text-align: center;}
.col12{
	width: 12%;
}
.col13{
	width: 13.333%;
}
.col17{
	width: 17%;
}
.col20{
	width: 20%;
}
.col30{
	width: 33%;
}
.col40{
	width: 40%;
}
.heading-sm{
	
    font-family: "ebony", Sans-serif;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    font-style: italic;
}

/*--------FORM STYLES--------------------*/




/*-------- FOOTER STYLES ----------------*/
footer{}

.footer{
	background-color: #333333;
	color: #fff;
    padding: 3% 3% 30px 3%;
	font-family: proxima-nova, helvetica, sans-serif;
	
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    text-transform: none;
    white-space: normal;
}
.footertext{
	background-color: #333333;
	color: #fff;
    padding: 0 3% 30px 3%;
	font-family: proxima-nova, helvetica, sans-serif;
	
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    text-transform: none;
    white-space: normal;
}
.footer a{
	color: #ccc;
}
.footertext a{
	color: #fff;
}
.footer a:hover, .footertext a:hover{
	color: #f47b20;
}
.footer .col40 .flex{align-items: flex-start;}
.footer .col40 > div{
	height: 60px;
}
.footer .col40 > div img{
	max-width: 100%;
	box-sizing: border-box;
    padding: 10px;
}

.btn-blue{
	display: block;
	text-align: center;
    padding: 24px 24px;
	background:#3a829d;
	border: solid 3px #3a829d;
	color: #fff !important;
	
    font-family: "ebony", Sans-serif;
    font-size: 16px;
    font-weight: 400;
    border-radius: 0px 0px 0px 0px;
	
	transition: all 0.3s;
}
.btn-blue:hover{
	background: transparent;
	color: #3a829d !important;
}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/




form#inv-search{
	position: relative;
	margin: 0 !important;
    padding-bottom: 10px;
}
form#inv-search input{
	display: block;
	background: #fff;
	width: 100%;
	padding: 8px 10px !important;
	border: solid 1px #f47b20 !important;
    line-height: 24px !important;
    font-size: 16px !important;
	height: unset !important;
	
	
	font-family: proxima-nova, helvetica, sans-serif !important;
	
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    text-transform: none !important;
    white-space: normal !important;
	box-sizing: border-box;
	
}
form#inv-search button{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 8px 15px 8px 10px !important;
	background: none !important;
	border: none !important;
	outline: none !important;
    line-height: 24px !important;
    font-size: 16px !important;
	color: #f47b20 !important;
	box-sizing: border-box;
    height: 42px;
	cursor: pointer;
}



/*---------- RESPONSIVE STYLES ----------*/



@media (max-width: 1200px){
	.header{
		padding: 10px 10px 4px;
	}

}


@media (max-width: 1024px){
	.hide-mobile{display: none !important;}
	.header{
		flex-wrap: wrap;
		gap: 0;
		padding: 10px 30px 14px !important;
	}
	
	.header .col20{
		width: calc(100% - 42px);
		text-align: left !important;
		box-sizing: border-box;
	}
	.header .col20 img{
		max-width: 207px !important;
		width: 70%;
	}
	
	.header .col30{width: 100%; box-sizing: border-box; padding: 0 !important;}
	.header .col30 form{padding-bottom: 0 !important;}
	
	.footer > .flex{justify-content: center;}
	.footer .col40{
		width: 100%;
	}
	.footer .col13{
		width: 33.333333%;
		margin-bottom: 40px;
	}
	.footer .col20{
		width: 80%;
		padding: 30px;
	}
	.footertext{text-align: center !important; justify-content: center; padding-bottom: 150px; padding-top: 50px;}
}
@media (max-width: 770px){
	
	.footer .col13{
		width: 100%;
		margin-bottom: 40px;
	}
	.footer .col40 > div{
		height: unset !important;
	}
	.footer .col40 .flex{flex-wrap: wrap;justify-content: center;}
	.footertext{padding-bottom: 200px;}
	
}


