/***** 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;}

/* Radial Out */
.hvr-radial-out {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  overflow: hidden;
  background: transparent;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hvr-radial-out:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #000;
  color: #fff;
  border-radius: 100%;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-radial-out:hover, .hvr-radial-out:focus, .hvr-radial-out:active {
  color: white;
}
.hvr-radial-out:hover:before, .hvr-radial-out:focus:before, .hvr-radial-out:active:before {
  -webkit-transform: scale(2);
  transform: scale(2);
}

/*--- HEADER STYLES ---------------------*/
.header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mobileheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
	background: #000;
}
.headerleft {
    background: #000;
    width: 38%;
    border-bottom-right-radius: 60px;
	box-sizing: border-box;
	padding: 10px 50px;
}
.headerleft img{
    width: 280px;
}
.headertop {
    padding: 10px 50px;
    color: #fff;
	display: flex;
    justify-content: flex-end;
}
.headertop a{
    padding: 0px 10px;
    color: #fff;
	font-family: "Karla", sans-serif;
	font-size: 14px;
	display: flex;
}
.headertop i{
	font-size: 14px;
	padding-right: 10px;
}
.herosection{
	background: url("/siteart/zmill-update-hero.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	height: 850px;
	overflow: hidden;
	background-position: bottom;
}
.mobilelocation{display: none!important;}
.headerbottom {
    background: #fff;
    text-align: right;
    padding: 0px 50px;
    margin: 14px 0px;
    border-bottom-left-radius: 30px;
    border-top-left-radius: 30px;
	width: 108%;
    margin-left: -16%;
	height: 42px;
    display: flex;
    align-items: center;
}

.mobileheaderbottom {
    background: #fff;
    text-align: right;
    padding: 0px 50px;
    margin: 14px 0px;
    border-radius: 30px;
	width: 100%;
    margin-left: -5%;
	box-sizing: border-box;
}
.headerright{
	width: 60%;
	text-align: right;
}
.hp-cta-sect {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0px 4%;
	margin-top: -40px;
}
.hp-cta-btn{
	width: 16.5%;
	border-top: #fff solid 5px;
	padding: 20px 0px;
	display: flex;
	background: #000;
	border-left: 1px transparent solid;
    transition-duration: 0.5s;
    color: #fff;
    border-right: 1px transparent solid;
}
.hp-cta-btn:hover{
	background: #fff;
    color: #000;
    border: 1px solid #fff;
}
.inner-cta-btn{
width: 8px;
background: #fff;
border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
}
.cta-text {
    padding: 18px 15px;
}
.cta-header{
	font-family: "IBM Plex Sans", sans-serif;
	font-size: 22px;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 22px;
}
.cta-sm-text{
	font-family: "Karla", sans-serif;
	font-size: 16px;	
}
.logo-sect {
    display: flex;
    
    padding: 3% 0%;
    flex-wrap: wrap;
}
.logo-box {
    border: solid #000 1px;
    padding: 8px 0px;
    display: flex;
    justify-content: center;
    margin: 20px 50px;
    width: 25%;
	height: 140px;
	transition-duration: 0.5s;
}
.hp-logo-sect {
    display: flex;
    justify-content: center;
    padding: 3% 5%;
}
.hp-logo-box {
    border: solid #000 1px;
    padding: 8px 0px;
    display: flex;
    justify-content: space-between;
	margin: 0px 70px;
	width: 24%;
	height: 140px;
	transition-duration: 0.5s;
}
.logo-img{width: 98%; padding: 4px; text-align: center; display: flex; align-items: center; justify-content: center; }
.logo-img img{width: 270px;  transition-duration: 0.5s;}
.logo-img img:hover {
    width: 300px;
}
.inner-logo-btn {
    width: 8px;
    background: #000;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}
.hp-about-left{background: url("/siteart/zmill-about-img.jpg"); background-size: cover; height: 500px; width: 55%; background-position: center;}
.hp-about-right{width: 45%; background: #e8e8e8; box-sizing: border-box; padding: 10px 80px; display: flex; align-items: center; flex-wrap: wrap; align-content: center;}
.hp-about-right h1{width: 100%; line-height: 38px;}
.hp-about-sect{display: flex; align-items: stretch;}
.headertext{font-family: "IBM Plex Sans", sans-serif; font-size: 40px;}
.subtext {
    font-family: "IBM Plex Sans", sans-serif;
    font-size: 20px;
}
.smheadertext {
    font-family: "Karla", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 30px;
    padding: 10px 0px;
	line-height: 25px;
}
.hp-about-right .paratext {
padding: 20px 0px;
}
.paratext {
    font-family: "Karla", sans-serif;
    line-height: 28px;
    font-size: 16px;
}
.outlinebtn {
    font-family: "IBM Plex Sans", sans-serif;
    text-transform: uppercase;
    font-size: 15px;
    font-style: italic;
    font-weight: 900;
    color: #000;
    border: 2px solid #000;
    padding: 10px 20px;
    border-radius: 25px;
}
iframe.scrolling {
    width: 100%;
    margin: 40px 0px;
    height: 90px;
}

.hp-map-sect {
    display: flex;
    width: 100%;
}
.hp-map {
    width: 50%;
}
.white{color: #fff;}
.flex-box{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.flex-box-reverse{
	display: flex;
	flex-wrap: wrap-reverse;
	align-items: center;
}
.hourbox-map {
    width: 36%;
    padding-right: 1%;
}
.hourbox-text {
    width: 23%;
    border: solid 3px;
    box-sizing: border-box;
    padding: 50px 0px;
	display: flex;
}
.hourborder{
	width: 22px;
    background: #000;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px;	
}
.hourbox-inside {
    box-sizing: border-box;
    padding: 5px 20px;
}
.linktext{
	color: #000;
	font-family: "IBM Plex Sans", sans-serif;

}
.whitelinktext{
	color: #fff;
	font-family: "IBM Plex Sans", sans-serif;
}
.bold{font-weight: 700;}
.mobileheaderbottom a{
	color: #000!important;
}
.mobileheaderbottom a:hover{
	color: #fff!important;
}
.mobileheaderbottom ul ul li a{
	color: #fff!important;
}
/*---BODY--------------------------------*/
.inventorypadding{
	padding: 3% 0%;
}
.pageheadersect{
	display: flex;
	align-items: center;
	margin: 3% 4%;
}
.pageheaderblock{
	background: #000;
	height: 90px;
	width: 15px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.pageheader {
    font-family: "IBM Plex Sans", sans-serif;
    font-size: 50px;
    text-transform: uppercase;
    padding-left: 24px;
}
.page-padding{padding: 1% 5% 5% 5%; box-sizing: border-box;}
.about-left {
    width: 50%;
}
.about-right {
    padding-left: 2%;
    width: 48%;
}
.about-right img{width: 100%;}
.textbanner {
    background: #000;
    padding: 18px 12px;
	margin-bottom: 20px;
}
.lgparatext {
    font-family: 'Karla';
    font-size: 19px;
}
.partspage{
	padding: 1% 5% 2% 5%;
}
.service-box-left {
    width: 36%;
    padding-right: 3%;
}
.service-box-left img{
    width: 100%;
}
.stretch-flex-box{
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
}
.service-box-right {
    width: 58%;
    background: #000;
    display: flex;
    align-items: center;
    color: #fff;
    flex-wrap: wrap;
    align-content: center;
    padding: 0px 75px;
    box-sizing: border-box;
}
.service-shop-sect{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding: 4% 0% 0% 0%;
}
.service-shop-text {
    width: 100%;
	text-align: center;
}
.service-shop-image {
    padding: 4% 0px;
    display: flex;
	justify-content: space-between;
}
.service-shop-image img{
 padding: 0px 4px;
 width:48%;
}
.fullblkbox {
    width: 100%;
    text-align: center;
    background: #000;
    padding: 18px;
	text-transform: uppercase;
}
.fullblkbox a:hover{
   text-decoration: underline;
}
.fullblkbox a{
   transition-duration: 0.5s;
}
.fulloutlinebox {
    border: 3px solid #000;
    width: 100%;
    text-align: center;
    padding: 24px;
}
.rentalbox {
    width: 45%;
    margin: 20px;
	display: flex;
	flex-wrap: wrap;
}
.rentalimg{
    width: 100%;
}
.rentalimg img {
    width: 100%;
}
.rentalblk {
    width: 16px;
    height: 100%;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    background: #000;
    margin-right: 15px;
}
.rentaltext {
    display: flex;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    width: 100%;
    background: #fff;
    position: relative;
    top: -15px;
}
.rentalinfo {
    padding: 20px 0px;
	width: 90%;
}
.rentalunit {
    font-family: 'Karla';
    text-transform: uppercase;
    font-weight: 800;
    font-size: 22px;
}
/*--------FORM STYLES--------------------*/
.cpageform {
    padding: 2% 5%;
}
.halfformdrop {
    width: 49%;
    box-sizing: border-box;
    padding: 0px 10px;
    height: 40px;
    font-family: "Karla";
}
.halfformfields {
    width: 49%;
    height: 40px;
    padding: 0px 10px;
    box-sizing: border-box;
	margin-bottom: 10px;
	font-family: "Karla";
}
.fullformfields {
    width: 98.3%;
    height: 40px;
    padding: 0px 10px;
    box-sizing: border-box;
    margin-bottom: 10px;
	font-family: "Karla";
}
.fullformdrop {
    width: 98.3%;
    height: 40px;
    box-sizing: border-box;
    padding: 0px 7px;
	font-family: "Karla";
	margin-bottom: 10px;
}
.message{
	width: 98.3%;
    height: 150px;
    box-sizing: border-box;
    padding: 10px 7px;
	font-family: "Karla";
	margin-bottom: 10px;
}
.checkbox{font-family: "Karla";}
.submit {
    border: solid 2px #000;
    border-radius: 10px;
    padding: 10px 40px;
    background: #fff;
    cursor: pointer;
    font-family: "Karla";
    font-size: 14px;
    font-weight: 700;
}
.CaptchaPanel{
text-align: left!important;
padding: 0px!important;
}
.CaptchaImagePanel {
    padding: 5px 0px 10px 0px!important;
}
.CaptchaMessagePanel {
	padding: 5px 0px 10px 0px!important;
	font-family: "Karla";
	font-size: 14px;
}
.CaptchaAnswerPanel{
	padding: 5px 0px 10px 0px!important;	
}
.CaptchaWhatsThisPanel{
	padding: 5px 0px 10px 0px!important;	
	font-family: "Karla";
}
.CaptchaWhatsThisPanel a{
	color: #000!important;
}
/*-------- FOOTER STYLES ----------------*/
.footer{
	background: #000;
	display: flex;
	padding: 25px 65px;
}

.footerline{
	height: 8px;
	width: 100%;
	background: #fff;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
	margin-bottom: 10px;
}

.footerlogosect .paratext{
width: 100%;
display: block;
}
.footerlogosect{
	width: 20%;
	margin-right: 50px;
}

.footerlogosect img{
	width: 198px;
}
.footerlinksect {
    width: 20%;
    margin: 20px 40px;
	display: flex;
	flex-wrap: wrap;
	    align-items: flex-start;
    align-content: flex-start;
}
.footerlink {
    color: #fff;
    font-family: Karla;
    font-weight: 500;
    width: 100%;
    display: block;
    padding: 5px 0px;
    font-size: 15px;
}
.footersociallink {
    color: #fff;
    font-family: Karla;
    font-weight: 500;
    width: auto;
    display: block;
    padding: 5px 25px 5px 0px;
    font-size: 15px;
}
.footersociallink i{
    color: #fff;

}
.footerrightsect {
    border-left: solid 3px #fff;
    padding: 0px 0px 0px 50px;
}
.footertext {
    font-size: 13px;
    color: #fff;
    text-transform: uppercase;
    font-family: 'Karla';
	padding: 0px 5px;
}
.footerrightsect {
    border-left: solid 3px #fff;
    padding: 0px 0px 0px 50px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    width: 24%;
    color: #fff;
}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.list-content .media-buttons .print-this, .list-content .media-buttons .email-this{
 background: #fff!important;
    color: #000!important;
    border: 1px solid #000!important;	
	padding: 10px 40px!important;
}
a.view-listing-details-link.des-view-listingDetails.template-branded-button {
    background: #fff!important;
    color: #000!important;
    border: 1px solid #000!important;
}
.list-content .list-container .buy-btn, .list-content .list-container .contact-btn, .list-content .list-container .check-availability, .list-content .list-container .email-seller, .list-content .list-container .video-chat, .list-content .list-container .facebook-messenger, .list-content .list-container .whatsapp, .list-content .list-container .text, .list-content .list-container .request-a-quote-btn{
	background: #000!important;
}
.list-content .price-container .price{
	color: #000!important;
}
.list-top-section .list-listings-count{
	color: #000!important;
	
}
.faceted-search-content button.faceted-search{
		background: #000!important;
}
.faceted-search-content .selected-facets-container .selected-facet{
	background: #fff!important;
	color: #000!important;
	border: #000 solid 1px;
}
.list-content .list-error-container .info button:not(.login-button){
	    background-color: #000000!important;
}
/*---------- RESPONSIVE STYLES ----------*/



@media only screen and (max-width: 1545px) {
.hourbox-text {width: 30%;}	
.hp-logo-box{width: 30%; margin: 0px 15px;}	
.about-right {padding-left: 4%; width: 45%;}	
.about-left { width: 50%;}
.hourbox-map { width: 34%;}
}

@media only screen and (max-width: 1455px) {
.headerleft {width: 25%; padding: 10px;}
.headerright {width: 70%;}	
.headerbottom{width: 102%; margin-left: -11%;}
}

@media only screen and (max-width: 1280px) {
.headerright {width: 80%;}	
.headerbottom {width: 91%; margin-left: -2%;}
.headerleft {width: 30%;}	
.hp-cta-btn {width: 32.5%; margin: 5px 0px; height: 100px;}
.logo-box{margin: 20px 25px; width: 28%;}
.about-left {width: 100%; }
.about-right {padding-left: 0%; width: 100%; padding-top: 4%; justify-content: center; display: flex; text-align: center;} 
.about-right img {
    width: 65%;
}
}

@media only screen and (max-width: 1225px) {
.headerleft img {width: 210px;}	
.headerleft {width: 22%; padding: 10px; display: flex; align-items: center;}
.headertop {padding: 10px;}
.mobileheaderbottom{margin-left: -2%; padding: 0px 20px;}
.headerright { width: 77%; }
.headertop i{padding-right: 5px;}
.header {align-items: stretch;}
.headerbottom { width: 93%; margin-left: -3%;}
.logo-img img {width: 260px;}
.logo-img img:hover{width: 285px;}
.hp-logo-box { margin: 0px 5px;}
.hp-logo-sect {padding: 3%;}
.footerlinksect {width: 30%; margin: 20px 5px;}
.footerlogosect {margin-right: 15px;}
}

@media only screen and (max-width: 1150px) {
.hp-about-left{width: 45%; height: 530px;}
.hp-about-right {width: 55%; padding: 10px 30px;}
.footer{padding: 25px 20px;}
.footerrightsect{padding: 0px 0px 0px 15px; width: 35%;}
.service-box-left {width: 37%;}
.service-box-right {width: 60%; padding: 0px 35px;}
.hourbox-map {width: 49%;}
.hourbox-text { width: 99%;}
.herosection{height: 600px;}
}


@media only screen and (max-width: 1023px) {
	.mobilelocation{display:block!important;}
	.desktoplocation{display:none!important;}
	.headertop p{display: none;}
    .headertop {padding: 20px 10px;}
	.headertop i {
        padding-right: 15px;
        font-size: 18px;
    }
    .mobileheaderbottom {
        margin-left: 0%;
        padding: 0px 20px;
		background: transparent;
    }
	.headerbottom {
        width: auto;
        margin-left: 0%;
        background: transparent;
        justify-content: flex-end;
        padding: 0px 20px;
    }
	    .headerright {
        width: 36%;        z-index: 1;
        position: relative;
    }
	.header{background: #000; border-bottom-left-radius: 40px; border-bottom-right-radius: 40px;}
	.headerleft {width: 92%; background: transparent; align-items: flex-end;}
	.mobileheader{border-bottom-left-radius: 40px; border-bottom-right-radius: 40px; align-items: flex-end; overflow: hidden;}
	.herosection {
        background: url("/siteart/zmill-update-hero-mobile.jpg");
        background-position: 20% 90% !important;
        background-size: cover;
        height: 500px;
        background-repeat: no-repeat;
    }
	.logo-img img {width: 190px;}
	.logo-img img:hover{width: 195px;}
	.logo-img {width: 97%;}
	.logo-box {margin: 20px 10px; width: 47%;}
	.headerbottom.animated.bounceInRight{
    animation: none;
	}
	.hp-cta-sect{margin-top: -20px;}
	.rentalunit{font-size: 18px; line-height: 20px;}
}


@media only screen and (max-width: 930px) {
.footer{flex-wrap: wrap;}	
.footerlogosect {width: 100%;}	
.footerlinksect {width: 31%;}	
.footerrightsect{width: 100%;}
.service-box-left img {width: 55%;}
.service-box-left {width: 100%; display: flex; justify-content: center; margin-bottom: 20px; padding-right: 0%; }
.service-box-right {width: 100%; padding: 40px 35px;}
.about-right img {width: 80%; }
.rentalbox {
	width: 100%;
}
}

@media only screen and (max-width: 800px) {
.hp-logo-sect {
padding: 3% 1%;
}	
.logo-box {
margin: 10px 2px;
width: 48%;
}	
.pageheadersect{margin: 10% 10px 3% 10px;}
.pageheader{font-size: 45px; padding-left: 15px;}
.hourbox-map {width: 100%; }
}
@media only screen and (max-width: 680px) {
.hp-cta-btn {width: 49%;}
.hp-logo-box {
        margin: 8px 5px;
        height: 115px;
        width: 95%;
}

.hp-logo-sect{flex-wrap: wrap;}	
.logo-img img {width: auto; height: 88%;}
.logo-img img:hover {width: auto; height: 92%;}
.hp-about-sect{flex-wrap: wrap;}
.hp-about-left {width: 100%; height: 330px;}
.hp-about-right { width: 100%; padding: 40px 30px;}
.hp-map-sect {flex-wrap: wrap;}
.hp-map {width: 100%;}
.logo-box { margin: 10px; width: 100%; }
.pageheader {font-size: 40px; line-height: 40px;}
.lgparatext{font-size: 16px;}
.halfformfields {width: 98%;}
.halfformdrop {width: 98%; margin-bottom: 10px;}
.cpageform {padding: 8% 5%;}
.service-shop-image{flex-wrap: wrap; padding: 20px 0px}
.service-shop-image img {
    width: 100%;
    margin: 12px 0px;
}
.service-shop-sect{padding: 10% 0% 0% 0%;}
}
	
@media only screen and (max-width: 500px) {
    .footerlinksect {
        width: 100%;
        margin: 8px 5px;
    }	
    .footerrightsect {
        width: 100%;
        border: none;
        padding: 0px;
    }
	.smheadertext{font-size: 24px;}
	.subtext{font-size: 18px; padding-bottom: 5px;}
	.service-box-left img {width: 100%;}
	.service-box-right{padding: 40px 15px;}
	.rentalblk {width: 8px; margin-right: 5px;}
	.rentalinfo{    width: 93%;}
}


@media only screen and (max-width: 430px) {
.hp-cta-btn{width: 100%; height: 85px;}	
.hp-about-right {padding: 40px 12px;}
.headertext {font-size: 35px; line-height: 34px;}
.subtext {font-size: 19px; line-height: 18px;}
.paratext{line-height: 25px; font-size: 15px;}
.about-right img {width: 100%; }
.rentalbox {
margin: 20px 0px;
	}
}
@media only screen and (max-width: 340px) {
.header{flex-wrap: wrap;}	
.headerleft { width: 100%; justify-content: center;}	
.headerright {width: 100%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.headerbottom{margin: 0px; padding: 0px;}
.mobileheader{flex-wrap: wrap;}
.mobileheaderbottom {padding: 0px 10px; margin: 0px;}
.logo-img img {width: 95%; height: auto;}
.logo-img img:hover {width: 98%; height: auto;}
.outlinebtn{font-size: 13px; padding: 10px;}
.pageheader {font-size: 32px; line-height: 26px; padding-left: 8px; }
}
@media only screen and (max-width: 300px) {
	.headertop {
    justify-content: center;
    flex-wrap: wrap;
	}}