/*===================== 
	Color information
	
	-
	-
	-
	-
		 
=======================*/
/*===================== 
	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%;}


/*===================== 
	@Font-Face 
=======================*/


/*===================== 
	base styles 
=======================*/
.row-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}
.row-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

html {
    font-family: Arial, sans-serif; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
	}

body {
    margin: 0;
    font-family: 'Heebo', sans-serif!important;
	}

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;} 
	
/*===================== 
	typography 
=======================*/
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	}
	h1 {font-size: 2em;}

p {
	margin: 0;
	}
	
h1 {
}
		

h2 {
}

	
h3 {
}


h4 {
}


h5 {
}


h6 {
}

/*===================== 
	link styles 
=======================*/
a:focus {outline: thin dotted;/*reset*/
	}
a {color: #e71e26; transition:.5s;}
a:hover {color: #b91319;}

a,
a:link, 
a:visited, 
a:active {
	outline: 0;/*reset*/ 
    text-decoration:none;
	}
	a:hover  {
		outline: 0;/*reset*/
		text-decoration: none;
		}  

/*===================== 
	header styles 
=======================*/
header {
	margin: 0 auto;
	width: 100%;
    background-image: url("/siteart/fancy_deboss.png");
	}

.header-wrap {padding:0px 50px;}
.header-padding{ padding: 20px 0px!important;}
.header-padding-short {padding:35px 0px!important;} 

.header-juk-logo {
    max-width: 370px;
    width: 95%;
    margin-top:8px;
}

.header-hino-logo {
    max-width:180px;
    width: 50%;
    display: inline-block;
}

.header-fuso-logo {
    max-width: 85px;
    width:45%;
    display:inline-block;
    margin-left:4%;
}

.header-contact-link, .header-contact-link:hover, .header-contact-link:active, .header-contact-link:focus {
    font-weight: 700;
    font-size:18px;
    color:#000!important;
}

.md-location {display:none;}
/*===================== 
	nav styles 
=======================*/
nav.primary {
	padding:0;
	display:block;
	margin:0 auto;
	position:relative;
	text-align: left;
    background-color: #000;
    width: 100%;
	}

nav ul {
	padding:0 50px;
	margin:0;
}

nav > ul > li {
	display:inline-block;
	list-style-type:none; 
}

nav ul li a {
	font-size: 19px;
    color: #fff!important;
    display: block;
    font-weight: 700;
    padding: 10px 20px;
    transition: .5s;
}	

nav ul li a:hover,
nav ul li a:focus,
nav ul li a:active{
	color: #fff!important;
    background-color:#e71e26;
}

.fb-nav {float:right;}


/* This controls the Primary nav dropdowns for sublinks. Should not have to edit this too much */
nav.primary ul ul {
	display: none;
    position: absolute; 
}

nav.primary ul ul ul {
    position: absolute; 
    left: 100%;
    top:0; 
}

nav.primary ul li:hover > ul {  
    display: block;
    z-index: 2000 !important;
}

nav.primary ul ul li {
    float: none; 
    position: relative;
	display:block;
    margin:0;
	width:100%;
}

.dropdown_arrow {
	display: inline-block !important;
}
/******** End of primary Nav ***************/


/*===================== 
	mobile nav
=======================*/
.mobile-fb {display:inline-block; float:left; margin-left:15px;}
.mobile-fb-link {color:#fff!important;}

#menu-button{ /* initially will need to be hidden */
	display: block;
	font-size: 32px;
	width:100%;
	position: relative;
	z-index: 400;/* needs to be lower than nav.mobile, adjust as needed */
	background-color: #e71e26;
	text-align: right;
	min-height: 0 !important;
	}
	#menu-button a{
		 color: white;
		 text-decoration: none;
		 text-align: right !important;
         padding-right: 15px;
	  }

nav.mobile {
	display:block;
	position: fixed;
	top: 0;
	left: -250px;
	width: 250px;
	height: 100%;
	background: #e71e26;
	z-index: 500; /* needs to be higher than #menu-button, adjust as needed */
	overflow:auto;
}

nav.mobile .menu-toggle { /* Menu close button */
	position: absolute;
	top: 12px;
	right: 10px;
	display: inline-block;
	padding: 6px 9px 5px;
    font-family: 'Heebo', sans-serif;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	vertical-align: top;
}

a.close_mobile {
	font-size: 26px !important;
	font-weight: 900;
	text-align: right;
    padding-right: 10px;
    float: right;
}

nav.mobile .menu-toggle:hover { /* Menu close button on hover */
	color: #fff;
}

nav.mobile ul {
	list-style: none;
	font-weight: 300;
	margin:0;
	padding:0;
}

nav.mobile ul li a {
	position: relative;
	display: block;
	padding-left: 20px;
	color: white;
	text-decoration: none;
	font-size: 16px;
    clear: both;
}

nav.mobile ul li a:hover {
	background: ;
	color: #b91319;
}

nav.mobile ul li li a { /* appearance of the sub-level links */
	position: relative;
	display: block;
	padding: 0px 10px 0px 35px;
	color: white;
	text-decoration: none;
	text-transform: none !important;
}

nav.mobile ul li li li a { /* appearance of third level sub-level links if needed */
	background: #666;
	position: relative;
	display: block;
	padding: 10px 10px 10px 45px;
	color: #000;
	text-decoration: none;
}

nav.mobile ul li span.click{/* dropdown menu idicator arrow be sure to include this image with your image files */ 
	background:url(../siteart/menu-dropdown-arrow.png) 10px 12px no-repeat;
	background-size:55%;
	position:relative;
	display:block;
	float:right;
	margin:-44px 0 0 0;
	cursor:pointer;
	z-index: 12399994;
	width:44px;
	height:44px;
	-webkit-transition:background-size .3s ease-in-out;
	-moz-transition:background-size .3s ease-in-out;
	transition:background-size .3s ease-in-out;
}

nav.mobile ul li span.click:hover{
	background-size:60%;
}

/*===================== 
	General styles 
=======================*/
.container-fluid {padding: 0px;}
.row-juk {padding: 0px; margin: 0px;}
.div-juk {padding: 0px;}

.center {text-align: center;}

.page-title {font-size:36px; font-weight:700; padding-top:35px; color:#e71e26;}
.page-subtitle {font-size: 30px; font-weight: 700; padding-top: 15px;}
.page-text {font-size:16px; padding-bottom:10px;}
.p-bottom {padding-bottom:35px!important;}

.page-wrap {padding:0px 10%;}
.bknd-texture {background-image: url("/siteart/fancy_deboss.png");}
/*===================== 
	content styles 
=======================*/
.hero-img {max-width:100%; width:100%;}

.hero-overlay {
    padding: 50px;
    position: absolute;
    left:0px;
    top: 200px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));
}

.hero-text {
    color: #fff;
    font-size: 50px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.hero-btn-link, .hero-btn-link:hover, .hero-btn-link:active, .hero-btn-link:focus {
    color:#fff;
    text-align: center;
    font-weight: 600;
    font-size: 20px;
}

.hero-btn {
    border: 0px;
    background-color:#e71e26;
    width:100%;
    padding: 7px 10px;
    margin-top: 10px;
    transition: .5s;
    text-transform: uppercase;
}

.hero-btn:hover, .hero-btn:active, .hero-btn:focus {
    background-color: #b91319;
}

.home-wrap {padding: 0px 50px;}
.home-text-padding {padding: 50px 0px!important;}
.home-ul {margin-bottom:0px;}
.home-search-padding {padding: 50px 0px!important;}

.home-title {
    font-size: 36px;
    color: #e71e26;
    text-transform: uppercase;
    font-weight: 700;
    padding: 0px 15px 0px 0px;
}

.home-text-link {color:#000; font-weight: 500;}
.home-text-link:hover, .home-text-link:active, .home-text-link:focus {color:#e71e26;}


.deal-bknd {background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("/siteart/deals-bknd.jpg"); background-position:center; background-size:cover;}
.deal-div {margin-top:18%;}

.dot-bknd {background-image:url("/siteart/carbon_fibre_v2.png");}
.hours-div {margin-top:5%;}

.loan-bknd {background: linear-gradient(0deg, rgba(0,0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("/siteart/loan-bknd.jpg"); background-position:center; background-size:cover;}
.loan-div {margin-top: 20%;}

.home-div {padding:35px!important; min-height:400px;}

.home-section-title {
    color:#fff;
    text-transform:uppercase;
    text-shadow: 2px 2px #000;
    font-size:32px;
    padding-bottom:10px;
}

.home-section-subtitle {
    color:#fff;
    text-transform: uppercase;
    text-shadow: 2px 2px #000;
    font-size:20px;
    padding-bottom:10px;
}

.home-btn-link {
    color:#fff;
    font-size: 18px;
    font-weight:700;
}

.home-btn-link:hover, .home-btn-link:active, .home-btn-link:focus {color:#fff;}

.home-btn {
    width:80%;
    border:none;
    background-color: #e71e26;
    transition: .5s;
    text-transform: uppercase;
    padding: 7px 10px;
}

.home-btn:hover, .home-btn:active, .home-btn:focus {background-color:#b91319;}
.homepage-hours {color:white;}
.homepage-loc-link, .homepage-loc-link:hover, .homepage-loc-link:active, .homepage-loc-link:focus {color:#fff;}

/*===================== 
	Inventory styles 
=======================*/

.detail__breadcrumbs nav ul li a {color:#000 !important; font-size:16px;}

.detail__breadcrumbs nav ul li a:hover {color: #fff !important; transition: none}

.fa, .far, .fas {font-family: "Font Awesome 5 Free"!important;}

/*===================== 
	Service styles 
=======================*/
.service-info {padding-bottom:35px; font-size: 18px;}
.service-img {display: block; margin:auto; margin-bottom:35px; padding-left:15px;}

/*===================== 
	Fabrication styles 
=======================*/
.fab-info {padding-bottom:15px; font-size: 18px;}
.fab-li {font-size:16px;}
.fab-img {display:block; margin:auto; margin-bottom:10px; padding-left:15px; max-width:100%;}
.fab-img:last-child {margin-bottom:35px;}

.fab-work-img {max-width:400px; width:95%; margin-bottom: 10px;}
.fab-work-img:last-child {margin-bottom:35px;}

/*===================== 
	footer styles 
=======================*/
.footer-wrap {padding:0px 50px;}

.footer-ul {padding:34px 0px 25px 0px; list-style:none;}
.footer-li {padding:0px 10px; border-right: 1px solid #fff; display:inline-block;}
.footer-li:last-child {border-right:none;}
.footer-quick-link {color:#fff!important; font-size:16px; transition:.5s;}
.footer-quick-link:hover, .footer-quick-link:active, .footer-quick-link:focus {color:#e71e26!important;}

.copyright-info {
    text-align: right;
    color: #9a9a9a;
    font-size: 14px;
    padding: 15px 0px;
}

.copyright-link {color:#9a9a9a!important;}
.copyright-link:hover, .copyright-link:active, .copyright-link:focus {color:#fff!important; text-decoration:underline!important;}

footer {
	margin: 0;
	width: 100%;
    background-color:#000;
    border-top: 1px solid #fff;
	}
	
a.footerlink:link,
a.footerlink:visited, 
a.footerlink:active {
	text-decoration: none; 
	font-size:13px;
	color: #222;
	}
	a.footerlink:hover {
		text-decoration:none; 
		font-size:13px;
		color: #fff;
		}

.footertext {font-size:13px; color:#666;}
.smallfootertext {font-size:10px; color:#666;}

.divfooter {
	max-width:1200px; 
	text-align:center; 
	margin:0 auto;
	}

/*===================== 
	form styles 
=======================*/
.contactpage-info {padding: 20px 0px;}

.contactpage-link {color:#000; font-size:18px;}
.contactpage-link:hover {color:#e71e26}
.contactpage-icon {color:#e71e26!important;}

.map-wrap {padding:20px 0 0 0; background-color:#000;}
.map-title {color:#f1f1f1; font-size:30px; text-align:center; padding-bottom:15px;}

.contact_form {
    margin: 5px auto;
    padding: 10px 10px 3px 10px;
    border: none;
    border-bottom: 1px solid #333;
    background: transparent;
    width: 100%;
    color: #777777;
    border-radius:0px;
}

.submit-button, .thanks-button {
    background-color: #e71e26;
    color: white;
    font-size: 18px;
    padding: 5px 15px; 
    border: 2px solid #e71e26;
    margin-top: 10px;
    margin-bottom: 30px;
    transition: .5s;
    width: 45%;
    border-radius: 0px;
}

.submit-button:hover, .thanks-button:hover{
    border: 2px solid #b91319;
    color: #fff;;
    background-color: #b91319;
}

.thanks-text {
    font-size: 18px;
    text-align: center;
}

/*===================== 
	captcha styles 
=======================*/
/*control the Captcha */
.CaptchaPanel {
    margin:0 0 0 0 !important;
    padding:0 0 0 0 !important;
    text-align: center;
    line-height:normal !important;
    }

.CaptchaImagePanel {
    margin:0 0 0 0;
    padding:0 0 0 0;
    }

.CaptchaMessagePanel {
    padding:0 0 0 0 !important;
    margin:0 0 0 0 !important;
    font-weight:normal !important;
    font-size:13px;
    line-height:20px;
    }

input#CaptchaAnswer {
    margin: 5px auto;
    padding: 10px 10px 3px 10px;
    border: none;
    border-bottom: 1px solid #333;
    background: transparent;
    width: 45%;
    border-radius:0px;
}

.CaptchaAnswerPanel {
    margin:0 0 0 0;
    padding:2px 0px 2px 0px !important;
    }

.CaptchaWhatsThisPanel {
        line-height:0;
        margin:0 0 0 0;
        padding:11px 0 8px 0 !important;
    }
.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 

/*===================== 
   search styles
=======================*/
.home-search {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    font-size: 24px;
    padding: 0px 15px 0px 15px;
}

.inv-search {padding:0px 15px;}

.formfield {padding: 5px;}
 
.formfield input {
	width: 100%;
	border: none;
    border-bottom: 1px solid #333;
    padding: 10px 10px 1px 10px;
    background-color: transparent;
    font-size: 16px;
}

.submit-wrap input {
	background-color: #e71e26; 
	font-size: 16px; 
	text-transform: uppercase;
    color: #fff;
    text-align: center;
    transition: all .5s;
	padding: 10px 20px;
    border: none;
    font-weight: 700;
}

.submit-wrap input:hover {
	background-color: #b91319; 
	color: #fff;
}





/*========================= 
	 Responsive styles 
===========================*/
/*==========  Non-Mobile First Method  ==========*/

@media only screen and (max-width : 1600px) {
/*========================= 
	 Content styles 
===========================*/
    .hero-overlay {top:17%;} 
    
}


@media only screen and (max-width : 1400px) {
/*========================= 
	 Content styles 
===========================*/
    .hero-overlay {padding:40px;}
    .hero-text {font-size:42px;}
}

@media only screen and (max-width : 1199px) {
/*========================= 
	 Header styles 
===========================*/
    .header-wrap {padding:0px 25px;}
    .md-location {display:inherit;}

/*========================= 
	 Nav styles 
===========================*/
    nav ul {padding:0px 8px;} 
    
/*========================= 
	 General styles 
===========================*/
    .page-wrap {padding:0px 25px;}

/*========================= 
	 Content styles 
===========================*/
    .home-wrap {padding:0px 25px;}
    
    .loan-div {margin-top:30%;} 
/*========================= 
	 Footer styles 
===========================*/
    .footer-wrap {padding:0px 25px;}
    
    
}    

@media only screen and (max-width: 1045px) {
	nav ul li a {
		font-size: 17px;
	}

}

@media only screen and (max-width : 991px) {
/*========================= 
	 Header styles 
===========================*/
    .header-phone-info {text-align:center; padding-bottom:15px;}
    
/*========================= 
	 Content styles 
===========================*/ 
    .hero-overlay {padding:30px;}
    .hero-text {font-size:35px;}
    
    .home-text-padding {padding:35px 0px!important;}
    .home-search-padding {padding: 0px!important;}
    
    .home-div {min-height:0px; padding:35px 15px!important;}
    .deal-div, .hours-div, .loan-div {margin-top:0px; padding:25px 0px;}
    .hours-div {padding:0px;}
    
/*========================= 
	 Footer styles 
===========================*/
    .footer-ul {text-align:center; padding:25px 0px 10px 0px;}
    .copyright-info {font-size:12px; text-align:center; padding:0px 15px 15px 15px;}
    
/*========================= 
	 Search styles 
===========================*/    
    .submit-wrap input {margin-bottom:35px;}      
}

@media only screen and (max-width : 767px) {
/*========================= 
	 Header styles 
===========================*/ 
    .header-wrap {padding:0px 15px;}
    
/*========================= 
	 General styles 
===========================*/
    .page-title {text-align:center;}
    
    .page-wrap {padding:0px 15px;}

/*========================= 
	 Content styles 
===========================*/
    .hero-overlay {position:relative; padding:25px; text-align:center; background:linear-gradient(0deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 1))}
    .hero-text {font-size:28px;}
    .hero-btn-link, .hero-btn-link:hover, .hero-btn-link:active, .hero-btn-link:focus {font-size:18px;}
    
    .home-wrap {padding:0px 15px;}    
    .home-title {font-size: 28px;}
/*========================= 
	 Fabriction styles 
===========================*/
    .fab-work-img {width:98%;}
    
/*========================= 
	 Contact styles 
===========================*/    
    .contactpage-info {text-align:center;}
    
/*========================= 
	 Footer styles 
===========================*/    
    .footer-wrap {padding:0px 15px;}
    .footer-li {border-right:none; display:block; padding:5px;}
    
}
 
@media only screen and (max-width : 450px) {
 
 
}

@media only screen and (max-width : 320px) {


}