﻿/***** 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 {
    text-align: right;
    width: 100%;
    background: #000000c4;
    display: flex;
    align-items: stretch;
    align-content: space-between;
    flex-wrap: wrap;
}
.headerleft {
    width: 25%;
}
.headerleft img {
    width: 100%;
	max-width: 400px;
}
.headerright {
    width: 75%;
    display: flex;
    flex-wrap: wrap;
    justify-content: right;
    align-items: stretch;
}
.heroimagesect {
    width: 100%;
    height: 810px;
    background-size: cover;
    background-repeat: no-repeat;
	animation: heroimagesect 38s ease-in-out infinite;
	background-position: center;
}
@keyframes heroimagesect{
0% { background-image: url("/siteart/slides/mntractor-slide-05-22-01.jpg"); }
14% { background-image: url("/siteart/slides/mntractor-slide6.jpg");} 
32% { background-image: url("/siteart/slides/mntractor-slide-05-22-02.jpg"); }
58% { background-image: url("/siteart/slides/mntractor-slide5.jpg"); }
70% { background-image: url("/siteart/slides/mntractor-slide-05-22-03.jpg");}
90% { background-image: url("/siteart/slides/mntractor-slide9.jpg"); }
100% { background-image: url("/siteart/slides/mntractor-slide-05-22-01.jpg"); }
}
.headerinfosect {
    color: #fff;
    font-size: 15px;
    padding: 30px 5% 0px 5%;
    font-weight: 500;
}
.headerinfo {
    color: #fff;
    padding: 0px 15px;
    font-family: 'Poppins', sans-serif;
}
.herotextsect {
    font-family: 'Poppins', sans-serif;
    text-align: center;
    height: 630px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    background: #0000001c;
}
.blacksubhead{
color: #000; font-size: 38px;	
}
.whitesubhead {
    color: #fff;
    font-size: 38px;
    font-weight: 500;
    line-height: 100px;
    text-shadow: 0px 10px 18px #000000c4;
}
.herotext {
    color: #b2b2b2;
    font-size: 80px;
    margin-top: -28px;
    text-transform: uppercase;
    width: 100%;
    line-height: 64px;
    text-shadow: 0px 10px 16px #000000c4;
}
.buttonsection{
	display: flex;
	width: 100%;
	font-family: 'Poppins', sans-serif;
	font-size: 18px;

}
.heroblackbtn{
	background: #000;
    padding: 17px 2px;
	width: 38%;
	color: #fff;
	text-align: center;
    font-size: 20px;
	    border: #fff solid 1px;
}
.herogreybtn strong {
    background: #b2b2b2;
    padding: 4px 15px;
    border-radius: 10px;
    color: #000;
}
.herogreybtn {
    background: #333333;
    padding: 17px 2px;
    width: 25%;
    color: #fff;
    text-align: center;
    font-size: 20px;
	    border: #fff solid 3px;
	box-sizing: border-box;
}
.herogreenbtn{
    background: #d6d6d6;
    padding: 17px 2px;
	width: 25%;
	color: #fff;
	text-align: center;
	font-size: 20px;
	    border: #fff solid 1px;
}
.herogreenbtn strong{
  background: #b2b2b2;
    padding: 4px 15px;
    border-radius: 10px;
    color: #000;
}

/*---BODY--------------------------------*/
.hpaboutright{
	background: url("/siteart/angled_bkg_green.png");
	background-position: left;
	background-repeat: no-repeat;
	background-size: cover;
	width: 50%;
}
.hpaboutsect {
    display: flex;
    padding: 1% 0% 0% 5%;
    font-family: 'Poppins', sans-serif;
}
.hpabouttext {
    width: 50%;
    padding: 10% 2% 10% 0%;
}
.greenheader{
	color: #333333;
	font-size: 36px;
	font-family: 'Poppins', sans-serif; 
	
}
.blackheader{
	color: #000;
	font-size: 36px;
	font-family: 'Poppins', sans-serif; 
	
}
.whiteheader{
	color: #fff;
	font-size: 36px;
	font-family: 'Poppins', sans-serif; 
	
}
.hplocationsect{
	display: flex;
	background: url("/siteart/angled_line_green.png");
	background-repeat: no-repeat;
	background-size: cover;
	align-items: center;
	background-color:#333333ed;
}
.hpmapsect{
	width: 45%;
	padding: 2% 9% 2% 5%;
}
.hpmap{
	width: 800px;
	height: 400px;
}
.locationinfosect{
		padding: 2% 5%;
	font-family: 'Poppins', sans-serif; 
}
.boldsubhead{
	font-weight: 700;
	color: #333333;
}
.greenbtn{
background: #333333;
padding: 8px 55px;
color: #fff;
font-size: 14px;
}
.backgroundtexture{
	background: url("/siteart/backgroundtexture.png");background-attachment: fixed;
}
.blackbtn{
background: #000;
padding: 8px 55px;
color: #fff;
font-size: 14px;
    margin: 12px;
}
.whitepara{
	color: #fff;
}
.scrollingwrap{
	width: 100%;
}
.scrolling{
	width: 100%;    height: 88px;
}

/* Sweep To Top */
.hvr-sweep-to-top {
  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;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-sweep-to-top-black:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #1e1e1e;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-top-grey:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #5b5b5b;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-top-green:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #8b8b8b;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active {
  color: #eee;
}
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}


/*--------CONTACT STYLES--------------------*/
.secondpagebackground{
	background: #000;
}
.contactpage {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.formfields {
    width: 45%;
    margin: 10px 5px 10px 0px;
    padding: 8px;
	font-family: 'Poppins', sans-serif; 

}
.lgformfields {
    width: 92%;
    margin: 5px 5px 5px 0px;
    padding: 8px 10px;
	font-family: 'Poppins', sans-serif; 

}
.comments {
    width: 92%;
    margin: 5px 5px 5px 0px;
    padding: 8px 11px;
    height: 100px;
	font-family: 'Poppins', sans-serif; 

}
.formsection{
	width: 80%;
	padding-bottom: 5%;
	
}
.contactpage .greenheader{
	width: 100%;
}
.CaptchaMessagePanel{
		font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600!important;
}
.blackpara{
		font-family: 'Poppins', sans-serif; 
	width: 100%;
	padding-bottom: 25px;
}
.CaptchaWhatsThisPanel a{
			font-family: 'Poppins', sans-serif; font-size: 12px; color: #000;

}
.center{
	text-align: center;
}
.submit{
background: #333333;
border: none;
padding: 12px 55px;
color: #fff;
font-size: 14px;
text-transform: uppercase;
cursor: pointer!important;
}
.cpcontactinfo {
    width: 100%;
    display: flex;
    padding: 3% 0% 2% 0%;
    background: url(/siteart/angled_line_green.png);
    background-color: #333;
}
.cpcontact{
	width: 30%;
	padding: 0% 5%;
	color: #fff;
}
.cpmapsect{
	width: 100%;
}
.cpmap{
	width: 100%;
	height: 350px;
}
.cpheader{
	padding: 2% 5% 0% 5%;
	width: 100%;
}
.inventorypadding{
	padding: 5% 0% 10% 0%;
}
/*--------FORM STYLES--------------------*/




/*--------THANK YOU PAGE STYLES--------------------*/
.thankyoudeco{
     width: 100%;
    display: flex;
    padding: 1% 0% 2% 0%;
    background: url(/siteart/angled_line_green.png);
    background-color: #333;
    height: 0px;
    background-size: 70%;
    background-repeat: no-repeat;

}
.thankyoupadding{
	padding: 12% 5%;
	font-family: 'Poppins', sans-serif;
}


/*-------- FOOTER STYLES ----------------*/
.footer{
	background: #242425;  padding: 2% 5%; font-family: 'Poppins', sans-serif; display: flex; border-bottom: #a8a8a8 2px solid;

}
.footerinfo{
	width: 30%;
}
.whiteboldpara{
	color: #fff;
	font-weight: 800;
	font-size: 15px;
}
.greypara{
	color:#a8a8a8;
	font-size: 13px;
}

.divfooter{
	background: #242425;  padding: 2% 5%; font-family: 'Poppins', sans-serif;
}
.smallfootertext{
	color:#a8a8a8;
	font-size: 11px;
}

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.list-top-section .list-title .list-listings-count{
color: #333333!important;
	
}
.list-content .price-container .price{
	color: #333333!important;

}
.list-top-section .list-listings-count{
    color: #333333!important;	
}
.view-listing-details-link{
		background-color: #333333!important;
}

.list-content .media-buttons .print-this, .list-content .media-buttons .email-this{
	background: #000!important;
	color: #fff!important;
	border: none!important;
	border-radius: 0px!important;
	font-size: 13px!important;
}
.faceted-search-content .selected-facets-container .selected-facet{
		background-color: #333333!important;
	
}
.list-top-section .sticky-top-menu .listing-option-bar-content .list-listings-count{
	color: #333333!important;
	
}
.mobile-option-bar .mobile-option-bar-filter{
	color: #000!important;
}
.faceted-search-content .mobile-done-button-container .mobile-done-button{
			background-color: #333333!important;

}
.bottom-bar .listing-control-bar .nav-sort .sort-option-container .sort-option, .bottom-bar .mobile-listing-control-bar .nav-sort .sort-option-container .sort-option{
	color: #000!important;
}
/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1575px) {
.thankyoupadding {
padding: 18% 5%;
}	
	
}
@media only screen and (max-width: 1445px) {
.hpmapsect {
    width: 50%;
    padding: 2% 6% 2% 3%;
}
	.hpmap {
    width: 100%;
    height: 400px;
}
	.locationinfosect {
    padding: 2% 1%;
    width: 35%;
}
	.formfields {
    width: 45%;
		margin: 10px 0px 10px 0px;}
}
@media only screen and (max-width: 1120px) {
    .hpaboutright {
        background: url(/siteart/angled_bkg_green.png);
        background-position: 25%;
        background-repeat: no-repeat;
        background-size: cover;
        width: 60%;
    }
	.hpabouttext {
    width: 42%;
    padding: 14% 0% 8% 0%;
}
	.hpaboutsect {
	padding: 0% 0% 0% 3%;}
	.thankyoupadding {
		padding: 26% 5%;}
}
@media only screen and (max-width: 1060px) {
.locationinfosect {
    padding: 2% 1%;
    width: 48%;
}	
	.hpmapsect {
    width: 50%;
    padding: 2% 3%;
}
	
}
@media only screen and (max-width: 1024px) {
	.headerinfosect{
	font-size: 15px;
    padding: 12px 5% 10px 5%;	
		text-align: center;
	}
	.heroimagesect{
	height: 500px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;	
	}	
	.herotextsect {
    font-family: 'Poppins', sans-serif;
    text-align: center;
    padding: 0px;
	height: 700px;
	text-shadow: 0px 17px 18px #000000db;
}
	.buttonsection {
    display: flex;
    width: 100%;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    margin: 0px;
}
	.heroblackbtn{
	font-size: 18px;
	}
	.herogreybtn{
	font-size: 16px;
		padding: 12px 2px;
	}
	.herogreenbtn{
		padding: 12px 2px;
	font-size: 16px;
	}
	.whitesubhead{
		line-height: 52px;
	}
	.herotext {

    font-size: 66px;
    margin-top: 0px;
    line-height: 58px;
}
	
	.heroimagesect {
		height: 750px;}
}
@media only screen and (max-width: 1000px) {

		.herogreybtn{
		width: 100%;        padding: 12px 2px;
	}

	.herogreenbtn{
		width: 100%;        padding:12px 2px;
	}
	    .herotextsect {
	height: 700px;		
	}
}
@media only screen and (max-width: 940px) {
	.header {
    text-align: right;
    width: 100%;
    background: #00000080;
    display: flex;
    align-items: stretch;
        align-content: flex-start;
		flex-wrap: wrap;
}
	.buttonsection{
		flex-wrap: wrap;
	}.hpaboutsect {
        padding: 30% 0% 0% 3%;
		flex-wrap: wrap;
    }
.headerleft {
    width: 100%;
    text-align: center;
}
	.headerleft img {
    width: 100%;
    max-width: 300px;
}
	.headerright {
    width: 100%;
    display: flex
;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
	.footerinfo {
    width: 34%;
}
	.buttonsection{
		font-size: 17px;
	}
}
@media only screen and (max-width: 845px) {
.heroimagesect {
        height: 600px;
    }
	
	
	.herotextsect{height:590px;}
	
		.hpabouttext {
    width: 90%;
    padding: 5% 0% 8% 0%;
}
	.hpaboutright {
    background-position: right;
	    background-size: cover;
    width: 100%;
    height: 85px;
}
}
@media only screen and (max-width: 825px) {


	.hpmap {
    width: 100%;
    height: 250px;
}
	.hpmapsect {
    width: 100%;
    padding: 2% 3%;
}
	.hplocationsect{
		flex-wrap: wrap-reverse;padding: 5% 4%; background-image: none; width: 92%;
	}
	.locationinfosect{
		width: 100%;
	}
	.footer{
		flex-wrap: wrap;
	}
	.footerinfo{
	width: 50%;
    padding-bottom: 28px;
	}


	.formfields {
    width: 44%;
    margin: 10px 2px 10px 0px;
}
}

@media only screen and (max-width: 665px) {
.herotext {
    font-size: 76px;
    margin-top: 0px;
    line-height: 70px;
}	
.herotextsect {
        padding: 10px 0px 15px 0px;
        height: 460px;
}	
.heroimagesect {
        height: 507px;
    }	
	.whitesubhead {
        line-height: 42px;
        font-size: 30px;
    }
	.herotext {
        font-size: 54px;
        margin-top: 0px;
        line-height: 48px;
        padding: 0px 10px;
    }
	.hpaboutsect {
		padding: 35% 0% 0% 3%;}
}

@media only screen and (max-width: 520px) {
.formsection {
    width: 85%;
    padding-bottom: 5%;
}	
.comments {
    width: 100%;
    margin: 5px 5px 5px 0px;
	padding: 8px;}
.formfields {
    width: 100%;
    margin: 10px 2px 10px 0px;
	padding: 8px;
}	
	.lgformfields {
    width: 100%;
    margin: 5px 0px 5px 0px;
		padding: 8px;}
	.greenheader{
		line-height: 30px;
	}
	.formsection form{
    width: 92%;
		
	}
	.greenheader {
        line-height: 40px;
    }
	.hpabouttext {
        width: 90%;
        padding: 5% 0% 10% 0%;
    }
	.hpaboutsect {
        padding: 45% 0% 0% 3%;
    }
	.formsection {
    width: 80%;
    padding-bottom: 5%;
}
	.contactpage {
		padding-top: 10%;
	}
}
@media only screen and (max-width: 480px) {
.herotext {
        font-size: 50px;
        line-height: 42px;
        text-shadow: -1px 8px 12px #000000;
    }
	    .whitesubhead {
        line-height: 38px;
        font-size: 26px;
    }
.blacksubhead{
		font-size: 32px;
	}	
.herotextsect {
	height: 560px;
}
.heroimagesect {
        height: 645px;
    }
}
@media only screen and (max-width: 424px) {
.hpaboutright {
    background-position: right;
    background-size: cover;
    width: 100%;
    height: 94px;
}	
	.hpabouttext {
    width: 100%;
    padding: 33% 0% 10% 0%;
}
.hpaboutsect {
    flex-wrap: wrap;
}
.hpmapsect {
    padding: 5% 0%;
}	
	.greenbtn{
	width: 100%;
    padding: 12px 0px; text-align: center;}
	.blackbtn {
    width: 100%;
    padding: 12px 0px;text-align: center;margin: 12px 0px;
	}
.footerinfo {
	width: 100%;}	
	.herotext {
    font-size: 54px;
    line-height: 47px;
}
	.blacksubhead {
    font-size: 28px;
}

}
@media only screen and (max-width: 342px) {
.herotext {
    font-size: 45px;
    line-height: 38px;
}	
.heroimagesect {
        height: 680px;
}	
    .hpaboutsect {
        padding: 15% 0% 0% 3%;
    }
}
@media only screen and (max-width: 304px) {
.herotext {
    font-size: 15vw;
    line-height: 35px;
}	
.blacksubhead {
    font-size: 8vw;
}
    .herotextsect {
        padding: 12vw 0px 0vw 0px;
    }

.heroimagesect {
        height: 680px;
    background-repeat: no-repeat;
}
	.headerinfosect i{
	padding: 0px 10px;
	}
	.headerinfosect {
    color: #fff;
    font-size: 18px;
    padding: 30px 5% 0px 5%;
}
	.headerinfo{
		display: none;
	}
}
@media only screen and (max-width: 255px) {
	.heroimagesect {
		height: 450px;}
	    .herotextsect {
        height: 450px;
        box-sizing: border-box;
    }
    .buttonsection {
        flex-wrap: wrap;
        position: relative;
        top: -90px;
    }
	    .hpaboutsect {
        padding: 40% 0% 0% 0%;
    }
}

@media only screen and (max-width: 215px) {
	.whiteheader{
	    font-size: 30px; line-height: 32px;	
	}	
}
