@charset "utf-8";
/* CSS Document */

/***** 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;}
.clear {clear: both; height:0px; margin:0;}
/***** END RESET *****/

* {
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	overflow-x: hidden;
	font-family: 'Montserrat', sans-serif;
	line-height: 1.42857;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
button,
input { /* 1 */
  overflow: visible;
}
button,
select { /* 1 */
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

.width {width: 1400px; margin: 0 auto; max-width: 100%;}
.wrapper-width {width: 1200px; margin: 0 auto; max-width: 90%;}
.inventory-width {width: 90%; margin: 0 auto; max-width: 1400px; padding-bottom: 10px; padding-top: 50px; background: #fff; margin-top: 180px;}
.cf {max-width: 90%!important; box-sizing: border-box!important; margin: 0 auto!important;}

/**SCROLL UP BUTTON**/
.cd-top {
  display: inline-block;
  outline: none; /* Remove outline */
  border: none; /* Remove borders */
  height: 50px;
  width: 50px;
  position: fixed;
  bottom: 20px;
  right: 30px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  color: #fff;
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: #2a2a2a /*black*/ url(../siteart/scroll-to-top.svg) no-repeat center 50%;
  visibility: hidden;
  border-radius: 100px;
  opacity: 0;
  padding:5px; /* Some padding */
  cursor: pointer; /* Add a mouse pointer on hover */
  border-radius:5px;
  border: .5px solid rgba(255, 255, 255, 0.1);
  -webkit-transition: opacity .3s 0s, visibility 0s .5s;
  -moz-transition: opacity .3s 0s, visibility 0s .5s;
  transition: opacity .3s 0s, visibility 0s .5s;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .5s 0s, visibility 0s 0s;
  -moz-transition: opacity .5s 0s, visibility 0s 0s;
  transition: opacity .5s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: 1;
}
.no-touch .cd-top:hover {
  background-color: #000;
  opacity: 1;
}
.cd-top:hover {
  background-color: #000;
}

/***************************  HEADER  ******************************************/
header {
	width: 100%;
	padding: 20px 0 0 0;
	display: inline-block;
	background: #000 url("https://www.dillmantrucks.com/siteart/header-bg2.png");
	box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out ;
    z-index: 1;
    position: relative;
}
header p {
	color: #fff;
	letter-spacing: .5px;
}
.hdr-left, .hdr-right {
	margin-top: 60px;
	display: inline-block;
	font-family: 'Montserrat', sans-serif!important;
}
.hdr-left {
	float: left;
	width: 33.33%;
}
.hdr-left p a, .hdr-right p a {
	text-decoration: none;
	color: #fff;
	font-size: 18px;
	font-weight: 600;
}
.hdr-left p a:hover, .hdr-right p a:hover {
	letter-spacing: 1px;
}
.logo {
	float: left;
	display: inline-block!important;
	width: 33.33%;
	padding-bottom: 10px;
	text-align: center;
}
img#logo {
	width: 245px;
	max-width: 100%;
	height: auto;
}
.hdr-right {
	float: right;
	width: 33.33%;
	text-align: right;
}


/*********************  STORE STYLES **************************************/
.hs-btn.hs-highlighted {background: #03438e!important; color: #fff!important; letter-spacing: 1px!important; 
	-webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;}

.hs-btn.hs-highlighted:hover {background: #00195c!important;}

.product .product-controls select {padding-left: 5px!important;}

.product .product-in-cart {background: #a01e1e!important;}


/*********************  FOOTER STYLES **************************************/
footer {
	width: 100%;
	display: inline-block;
	background: #000 url("https://www.dillmantrucks.com/siteart/header-bg2.png");
	position: relative;
	margin-top: -3px;
}
.footer-links {
	width: 100%;
	display: inline-block;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	padding: 50px 10%;
	letter-spacing: 1px;
}
.footer-links h2 {
	margin-bottom: 40px;
	letter-spacing: 3px;
}
.footer-links ul li {
	display: inline;
	margin-right: 30px;
}
.footer-links ul li:last-child {
	margin-right: 0px;
}
.footer-links ul li a {
	text-decoration: none;
	color: #fff;
	letter-spacing: .5px;
	line-height: 26px;
	font-size: 13px;
	-webkit-transition: .4s ease-in;
    -moz-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    transition: .2s ease-in;
	padding-bottom: 10px;
	border-bottom: 2px solid transparent;
}
.footer-links ul li a:hover {
	border-bottom: 2px solid #f1f1f1;
}
.site-host {
	width: 100%;
	display: inline-block;
	margin: 0 auto;
	background: #666;
	padding: 20px 0;
}
.site-host p {
	text-transform: uppercase;
	color: #eee;
	font-size: 11px; 
	line-height: 14px;
	box-sizing: border-box;
	padding: 0 25px;
	text-align: center;
	display: inline-block;
	width: 100%;
	font-weight: 600;
	letter-spacing: .5px;
}


/**********************  MEDIA QUERIES (RWD) ***************************************/
@media screen and (max-width: 1350px) {
/* CONTACT PAGE */
	.contact-info .box {margin: 15px;}
}

@media screen and (max-width: 1290px) {
/* HEADER */
	header p {font-size: 14px;}
	.hdr-left p a, .hdr-right p a {font-size: 15px;}
	
/* LOGO BANNER */
	a#manu-logo1 {width: 80px; height: 70px;}
	a#manu-logo2 {height: 70px;}
	a#manu-logo3 {height: 70px; width: 100px;}
	a#manu-logo4 {height: 70px;}
	a#manu-logo5 {height: 70px; width: 95px;}
	a#manu-logo6 {height: 70px; width: 120px;}
	a#manu-logo7 {height: 70px; width: 85px;}
	a#manu-logo8 {height: 70px; width: 95px;}
	
/* HOMEPAGE */
	.hero-wrapper .title {width: 600px; padding: 20px 40px 20px 0;}
	.hero-wrapper .title h1 {font-size: 28px;}
	.about-wrapper .txt-60 {width: 54%;}
	.about-wrapper .img-40 {width: 42%;}
	.hero-wrapper {height: 380px; padding: 180px 0 90px 0;}
	.map-source {margin-top: 75px;}
}

@media screen and (max-width: 1190px) {
/* HEADER */
	header p {font-size: 11px; margin-bottom: 5px;}
	.hdr-left p a, .hdr-right p a {font-size: 14px;}
	img#logo {width: 220px;}
	header {padding: 20px 0 0 0;}
	
/* HOMEPAGE */
	.about-wrapper .txt-60, .about-wrapper .img-40 {width: 100%; text-align: center;}
	.about-wrapper .txt-60 {margin-bottom: 60px;}
	.about-wrapper .img-40 img {display: inline-block;}
	
/* CONTACT + THANK YOU PAGE */
	.contactpage-wrapper .wrapper-width {max-width: 100%;}
	.contact-form h2 {font-size: 24px; padding-bottom: 10px;}
	.contact-form p {font-size: 14px; padding: 1rem;}
	#formpage select {font-size: 14px;}
	.box h2, .box p {font-size: 14px;}
	p#thankyou span {font-size: 24px!important;}
	p#thankyou {font-size: 14px;}
	
/* FOOTER */
	.footer-links h2 {font-size: 18px;}
	.footer-links ul li {margin-right: 15px;}
	.footer-links ul li a {font-size: 12px;}
}

@media screen and (max-width: 1000px) {
/* HOMEPAGE */
	.hero-wrapper .title {line-height: 22px; width: 500px;}
	.hero-wrapper .title h1 {font-size: 24px;}
	.hero-wrapper .title p {font-size: 14px;}
	.map-source p {font-size: 10px;}
	
/* CONTACT PAGE */
	.contact-info .box {margin: 10px;}
}

@media screen and (max-width: 880px) {	
/* HEADER */
	.logo {float: none; margin: 0 auto; width: 100%; text-align: center;}
	.hdr-left, .hdr-right {display: none;}
	img#logo {width: 185px;}
	
/* HOMEPAGE */
	.hero-wrapper {height: 300px; padding: 140px 0 60px 0; margin-top: 160px;}
	.hero-wrapper .title {line-height: 18px; width: 370px; padding: 15px 20px 15px 0;}
	.hero-wrapper .title h1 {margin-bottom: 10px; font-size: 18px;}
	.hero-wrapper .title p {font-size: 12px;}
	.map-source p {padding-top: 60px;}
	
/* CONTACT PAGE */
	.formfield, #formpage .textbox {width: 100%; font-size: 14px;}
	#formpage {padding: 20px;}
	.contact-info .box {float: none; width: 100%; display: block; margin: 0 auto; max-width: 400px; margin-top: 40px;}
	p#thankyou {margin: 40px;}
	.contactpage-wrapper {margin-top: 175px;}
}

@media screen and (max-width: 750px) {	
/* HOMEPAGE */
	.hero-wrapper #mobile-hero {display: inline-block; width: 100%; height: auto; position: relative; z-index: 2; max-height: 290px;}
	.hero-wrapper  {background: none; padding: 0; height: auto;}
	.map-source {position: absolute; z-index: 3; bottom: 0;}
	.hero-wrapper .title {display: none;}
	.map-source {display: none;}
	
/* FOOTER */
	.footer-links h2 {margin-bottom: 20px;}
	.footer-links ul li {display: block; margin-right: 0;}
	.footer-links ul li a:hover {border-bottom: 2px solid transparent;}
}


@media screen and (max-width: 500px) {
	.inventory-width {margin-top: 145px;}
	.hosted-content #listings-title {font-size: 20px;}
	
/* HEADER */
	img#logo {width: 150px;}
	
/* HOMEPAGE */
	.about-wrapper .img-40 img {width: 100%;}
	.hero-wrapper {margin-top: 155px;}
	
/* LOGO BANNER */
	a#manu-logo1 {width: 75px; height: 65px;}
	a#manu-logo2 {height: 60px; width: 60px;}
	a#manu-logo3 {height: 65px; width: 90px;}
	a#manu-logo4 {height: 40px; width: 125px;}
	a#manu-logo5 {height: 40px; width: 90px;}
	a#manu-logo6 {height: 40px; width: 110px;}
	a#manu-logo7 {height: 55px; width: 85px;}
	a#manu-logo8 {height: 58px; width: 85px;}
	
/* CONTACT PAGE */
	.contact-form {padding: 15px;}
	.contact-form h2 {font-size: 20px; padding-bottom: 0;}
	.CaptchaPanel {width: 100%;}
	
/* FOOTER */
	.footer-links h2 {font-size: 18px;}
}