/***** 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;}
img{max-width: 100%; height: auto;}

@font-face {
    font-family: 'icon-worksregular';
    src:url(../fonts/icon-works-webfont.eot);
    src: url(../fonts/icon-works-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/icon-works-webfont.woff) format('woff'),
         url(../fonts/icon-works-webfont.ttf) format('truetype'),
         url(../fonts/icon-works-webfont.ttf) format('truetype'),
         url(../fonts/icon-works-webfont.svg#icon-worksregular) format('svg');
    font-weight: normal;
    font-style: normal;

}
/*-- colors - fonts
red: a20000
light gray: eee
dark gray: 212221

font-family: 'Montserrat', sans-serif;
font-family: 'Roboto Condensed', sans-serif
*/
/***** END RESET *****/

/*--- shop -----*/

.top-header .svg-inline--fa{ font-size: 25px !important; color: #fff !important; display: inline-block !important; padding: 5px 18px !important;}
.top-header .svg-inline--fa:hover{color: #a20000 !important}

.hs-btn.hs-highlighted{background-color: #a20000 !important; color: #fff !important}
.hs-btn.hs-highlighted:hover{background-color: #000 !important; color: #fff !important}

body{
	font-family: 'Montserrat', sans-serif !important;
	font-size: 16px;
	line-height: 26px;
	color: #000;
	font-weight: 400;
	overflow-x: hidden;
	width: 100%;
}

::-moz-selection {
    background: #eee; 
    color: #fff;
    text-shadow: none;
}

::selection {
    background: #eee;
    color: #fff;
    text-shadow: none;
}

a{
	color: inherit;
	transition: all .6s ease-in-out; 
	-moz-transition: all .6s ease-in-out; 
	-webkit-transition: all .6s ease-in-out;
	text-decoration: none;
}
a:hover, :hover{	transition: all .6s ease-in-out; 
	-moz-transition: all .6s ease-in-out; 
	-webkit-transition: all .6s ease-in-out;}

.clear{clear:both;}	


.shadow{box-shadow: 0px 6px 14px -7px rgba(0,0,0,.25);}

h1{font-size: 36px; color: inherit; font-weight: 700; line-height: 42px; font-family: 'Roboto Condensed', sans-serif; font-style: italic; text-transform: uppercase}
h1 span{font-size: 22px; color: inherit; font-weight: 700; line-height: 30px; letter-spacing: .25px;}

h2{font-size: 28px; color: inherit; font-weight: 700; line-height: 30px; font-family: 'Roboto Condensed', sans-serif;  font-style: italic; text-transform: uppercase; letter-spacing:.25px;}
h3{font-size: 22px; color: inherit; letter-spacing: 1px; font-weight: 700; line-height: 30px;}
h4{font-size: 16px; color: inherit; letter-spacing: 1.5px; font-weight: 700; line-height: 30px;}
h5{font-size: 18px; color: inherit;  font-weight: 700; line-height: 30px; font-family: 'Roboto Condensed', sans-serif;  font-style: italic; text-transform: uppercase; letter-spacing: .25px}

h1#large{color: #404040; font-size: 45px; line-height: 55px; letter-spacing: 3px; margin-bottom: 8px;}

.gray-text{color: #ccc;}
.red-text{color: #a20000;}

/*---BASIC STYLES -----------------------------------*/
#pad{padding: 25px 0;}
#l-pad{padding: 50px 0;}
#xl-pad{padding: 80px 0;}

.dark-gray-bg{background: #212221; color: #fff}
.lightgray-bg{background: #eee;}
.black-bg{background: #000}


.wrapper-inner{width: 80%; margin: 0 auto;}
.wrapper-center{width: 80%; margin: 0 auto; text-align: center;}


/*---HEADER-----------------------------------*/
.header{width:100%; background: #a20000; position: relative; z-index: 999;}
.header .wrapper-inner{width: 95%; display: flex; align-items: center}

.header-left{justify-content: flex-start; text-align: left; width:30%} 
.header-left img{width: 100%; max-width: 420px; position: relative; margin-top: -40px}

.header-right{justify-content: flex-start; text-align: right; width: 70%;} 

.top-header{background: #212121; color: #fff; text-align: right;}
.top-header .black-bg{width: auto; right: 0; padding: 10px 10px; text-align: center; display: inline-block;}

#top-contact{display: inline-block;}
#top-contact .fa, #top-contact .fab{font-size: 25px; color: #fff; display: inline-block; padding: 5px 18px;}
#top-contact .fa:hover, #top-contact .fab:hover{color: #a20000}



/*---scrolling inventory---*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}



/*-- FOOTER ------------------------------------*/

.footer{display: flex; margin: 0 auto; align-items: center; width: 80%;padding-bottom: 30px; color: #fff}

.footer .left{justify-content: flex-start; width: 50%;}
.footer .left .foot-col{display: inline-block; vertical-align: top; width: 45%;}
.footer .left .foot-col p{margin-bottom: 10px;}
.footer .right{justify-content: flex-start; width: 50%; text-align: right}

.foot-logo img{ text-align: right;}

.footer p a{color: #fff}
.footer a:hover{text-decoration: underline}
.footer ul li a{color: #fff}


/*---RESPONSIVE STYLES ------------------------------*/

@media screen and (max-width: 1200px){
.wrapper-inner, .wrapper-center{width: 92%;}	
	
.header-left{width: 50%} 
.header-right{width: 50%;} 

}


@media screen and (max-width: 900px) {	
#pad{padding: 20px 0;}
#l-pad{padding: 35px 0;}
#xl-pad{padding: 50px 0;}

.header h2{font-size: 20px;}	
	

/*-- FOOTER ------------------------------------*/

.footer{display: block; margin: 0 auto; align-items: center; width: 92%; padding-bottom: 40px; text-align: center}

.footer .left{justify-content: flex-end; width: 100%; margin-bottom: 15px;}
.footer .left .foot-col{display: block; vertical-align: top; width: 100%; margin-bottom: 30px}
.footer .right{justify-content: flex-end; width: 100%; text-align: center}
	
.foot-logo img{ text-align: center; max-width: 100px}	
	
}


@media screen and (max-width: 700px) {
	
.header-left img{ margin-top: 0px}
	
	
}

@media screen and (max-width: 480px) {
.top-header .svg-inline--fa{font-size: 18px !important;}
}


