/***** BEGIN RESET *****/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,600i,700,700i&display=swap');

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 {
font-family: 'Open Sans', sans-serif;
	font-size: 17px;
	line-height: 26px;
}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HEADER STYLES ---------------------*/
header { border-top:5px solid #517033; border-bottom:1px solid #ddd;}
.top-bar .fas {color:#517033; margin: 0 5px; transition: .2s ease; font-size: 22px;}
.top-bar .fas:hover {color:#000; margin: 0 5px;}
.width60 {width: 60%; margin: 0 auto;}
.width80 {width: 80%; margin: 0 auto;}
.width85 {width:85%; margin: 0 auto;}
.header-right {width: 70%; display: inline-block; vertical-align: middle; text-align: right;}
.logo {width: 28%; display: inline-block; vertical-align: middle; }
.logo img {max-width: 200px; width: 100%;}
.header-right a {color:#517033; letter-spacing: 1px;font-weight: 700; }
.header-right a:hover {color:#000;  }



/*---BODY--------------------------------*/
.hero img {width: 100%;}
.hero-overlay {position: absolute; top: 10vw; left:5%; }
.hero-overlay h1 {color:#fff; font-weight: 700; font-style: italic; font-size: 55px; letter-spacing: 1px; line-height: 60px; text-shadow: 3px 3px 5px #000;}

.green-banner {background: #527034; width: 100%; display: flex; flex-direction: row; align-items: center;}
.green-banner h2 {justify-content: flex-start; width: 50%;align-items: center; text-align: center; color:#fff; letter-spacing: 1px; font-weight: 700; font-style: italic; }
.drk-green-right {justify-content: flex-start;align-items: center; width: 50%; background: #445C2A;padding:20px 0; text-align: center; margin: 0 auto;}
.white-btn {background:#fff; padding: 15px 25px; margin: 0 5px; text-align: center; color:#000; font-style: italic;width: 250px; display: inline-block; font-weight: 700; transition: .2s ease; font-size: 20px;}
.white-btn:hover {background: #000; color:#fff;}

.hp-container {align-items: center; background: #fff; width: 100%; display: flex; flex-direction: row;}
.hp-container .hp-left {width: 50%; justify-content: flex-start; align-items: center;}
.hp-left p {color:#000;}
.hp-left .border-btn {border: 1px solid #000; width: 250px; text-align: center; padding:10px 0; color:#000; font-style: italic; font-weight: 700; letter-spacing: 1px; transition: .2s ease;  background: rgba(243,243,243,1.00)}
.hp-left .border-btn:hover {background:#000; color:#fff;}
.blk-contact-form{width: 50%; background:#000;justify-content: flex-start; align-items: center; padding:20px 0;}
.blk-contact-form h2 {display: inline-block; width: 40%; vertical-align: middle; font-weight: 700; font-style: italic; letter-spacing: 1px; color:#fff;}
.blk-contact-form p {display: inline-block; width: 58%; vertical-align: middle; color:#fff; font-style: italic; letter-spacing: 1px}
.blk-contact-form h2, p {padding:15px 0;}
.blk-contact-form form a {color:#527034; font-weight: bold; font-style: italic;}

.about {display: flex; flex-direction: row; align-items: center;background: #517033}
.sprayer-bg {width: 30%; align-items: center; justify-content: flex-start;}
.sprayer-bg img {width: 100%;}
.sprayer-bg-2 {width: 50%; align-items: center; justify-content: flex-start;}
.sprayer-bg-2 img {width: 100%;}
.about-body  {width: 70%; align-items: center; justify-content: flex-start;}
.about-body p {color:#fff;}
.sprayer-bg-form {background: url(/siteart/sprayer-bg.jpg) no-repeat; width: 100%; padding: 50px 0;}
.sprayer-bg-form h2, p {color:#fff;}

.flex-two {display: flex; flex-direction: row; align-items:center;}
.iframe-2 {width: 50%; align-items: center;}

/*--------FORM STYLES--------------------*/
#footmedia {margin: 0 10px 40px 30px;}
.column3 .submit-btn {text-align: center !important;}
.CaptchaPanel {text-align: left;}
#formpage {float: none;}
form a:hover {cursor: pointer}
#formpage label {display:block;}
.CaptchaMessagePanel {color:#fff; font-size: 12px; line-height: 18px;}
.CaptchaMessagePanel a{color:#fff; font-size: 12px; line-height: 18px;}
/*** form styles ***/
.blk-contact-form .enquiryform {width: 100%; max-width: 500px;  margin: 0 auto;}
.blk-contact-form .CaptchaAnswerPanel {padding:0;}
.blk-contact-form .CaptchaImagePanel {float: left;}
.blk-contact-form .CaptchaPanel {padding:0; margin: 0 auto;}
#formpage input {
	width:100%;
	width:calc(100% - 12px);
	padding:5.5px 5px;
	border:1px solid #000;
	color:#000;
	background:#fff;
	font-size:14px;
	margin:10px 0;
	text-align: left;
}
#formpage .column3 input{
	background: #527034;
	color: #FFFFFF;
	text-align: center;
	padding:10px 0;
	font-style: italic;
	font-weight: bold; letter-spacing: 1px;
	font-size: 18px;
}

#formpage input::-webkit-input-placeholder {
   color: #8e8d8d;
   font-weight: 200;
}

#formpage input:-moz-placeholder { /* Firefox 18- */
   color:#8e8d8d;
   font-weight: 200;
}
 
#formpage input::-moz-placeholder {  /* Firefox 19+ */
  color: #8e8d8d; 
  font-weight: 200;
}
 
#formpage input:-ms-input-placeholder {  
   color: #8e8d8d;
   font-weight: 200;
}

#formpage textarea::-webkit-input-placeholder {
   color: #8e8d8d;
   font-weight: 200;
}

#formpage textarea:-moz-placeholder { /* Firefox 18- */
   color:#8e8d8d;
   font-weight: 200;
}
 
#formpage textarea::-moz-placeholder {  /* Firefox 19+ */
  color: #8e8d8d; 
  font-weight: 200;
}
 
#formpage textarea:-ms-input-placeholder {  
   color: #8e8d8d;
   font-weight: 200;
}
#formpage .column3 input:hover{
	cursor: pointer;
	background: #FFFFFF;
	color: #000000;
}
#formpage textarea {
	padding:6px 5px;
	width:100%;
	width:calc(100% - 7px);
	border:1px solid #000;
	color:#000;
	font-size:14px;
	background:#fff;
	height:120px;
	margin-right: 0;
	padding-right: 0;
	margin:10px 0;
}

 
/* selects have similar 0styles to input & textarea fields, but with no padding. Text in a dropdown select is positioned differently */
#formpage select {
	width:100%;
	border:1px solid #000;
	color:#fff;
	vertical-align:middle;
	font-size:12px;
	margin-bottom:5px;
	background:#fff;
	line-height:normal;
	padding:5px;
}

#formpage input.checkbox {
    padding:0; 
    border:0;
    margin:0 5px 0 0;
    width:13px;
    height:13px;
    display:inline;
    background-color:#fff;
 }

#formpage input.radio {
    padding:0; 
    border:0;
    margin:0 5px 0 0;
    width:15px;
    height:15px;
    display:inline;
 }




/* focus states of various types of fields */

#formpage input:focus,
#formpage textarea:focus,
#formpage select:focus {
	color: #E4E4E4;
	border:1px solid #000;
	outline-style:none;
	width:100%;
	width:calc(100% - 12px);
}
#formpage input.radio:focus,
#formpage input.checkbox:focus {
	background:none; 
	border:0;
	outline-style:none;
}
 


#formpage input.button,
#formpage input.button:focus {
	width:100%;
	width:calc(100% - 12px);
	border:1px solid #000;
    margin:0;
    padding:7px 0;
    background:#fff;
    border:0;
    font-size:14px;
	margin-top:10px;
	line-height:14px;
	font-weight:bold;
    color:#E4E4E4;
}
#formpage input.button:hover {
	background:#FF8B1E;
	color:#E4E4E4;
}
 
.column3 {
	margin-bottom: 30px;
}



/*-------- FOOTER STYLES ----------------*/
footer{ background: #527034;width: 100%;}
footer p {color:#445C2A; font-style: italic; letter-spacing: 1px; text-align: center; padding:10px 0; font-weight: 700;} 







/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .buy-now-link,
.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .check-availability-link,
.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .email-seller-link,
.body-wrapper>div:not(.detail-wrapper) .faceted-section-box .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .apply-button,
.body-wrapper>div:not(.detail-wrapper) .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .apply-button,
.body-wrapper>div:not(.detail-wrapper) button.page-nav {
    background: #527034 !important;
    color: #000 !important;
}

.body-wrapper>div:not(.detail-wrapper) .view-listing-details-link,
.body-wrapper>div:not(.detail-wrapper) .contact-options a,
.body-wrapper>div:not(.detail-wrapper) .fin-calc-mobile>a,
.body-wrapper>div:not(.detail-wrapper) button.g-recaptcha.button,
.body-wrapper>div:not(.detail-wrapper) .show-all-modal .apply-button,
.body-wrapper>div:not(.detail-wrapper) .show-all-modal .nuf-button,
.body-wrapper>div:not(.detail-wrapper) .list-error-container .info button,
.body-wrapper>div:not(.detail-wrapper) .mobile-done-button-container .mobile-done-button,
.body-wrapper>div:not(.detail-wrapper) a.buy-btn.gtm-buynow.des-buy-now,
.body-wrapper>div:not(.detail-wrapper) a.buy-btn.des-buy-now,
.body-wrapper>div:not(.detail-wrapper) button.selected-facet.ts-button,
.body-wrapper>div:not(.detail-wrapper) .detail-contact-bar .contact-bar-btn {
    background: #527034 !important;
    color: #fff !important;
}

.body-wrapper>div:not(.detail-wrapper) .view-listing-details-link:hover,
.body-wrapper>div:not(.detail-wrapper) .contact-options a:hover,
.body-wrapper>div:not(.detail-wrapper) .fin-calc-mobile>a:hover,
.body-wrapper>div:not(.detail-wrapper) button.g-recaptcha.button:hover,
.body-wrapper>div:not(.detail-wrapper) .email-seller-link:hover,
.body-wrapper>div:not(.detail-wrapper) .mc-nav-controls .mc-icon-navarrow span,
.body-wrapper>div:not(.detail-wrapper) a.buy-btn.gtm-buynow.des-buy-now:hover,
.body-wrapper>div:not(.detail-wrapper) a.buy-btn.des-buy-now:hover,
.body-wrapper>div:not(.detail-wrapper) .detail-contact-bar .contact-bar-btn:hover {
    background: #445c2a !important;
    color: #fff !important;
    /*----Border----*/
}

.body-wrapper>div:not(.detail-wrapper) .faceted-section-box .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .back-button,
.body-wrapper>div:not(.detail-wrapper) .show-all-modal .show-all-modal-content-container .show-all-modal-content .title-close-row .back-button,
.body-wrapper>div:not(.detail-wrapper) .show-all-modal .back-button,
.body-wrapper>div:not(.detail-wrapper) .parts-listing-container .mobile-parts-detail-container .dealer-phone-container a {
    color: #000 !important;
    border: 1px solid #000 !important;
    /*-----------------------OTHER TEXT STYLES-----------------------*/
    /*----Page Title----*/
}

.body-wrapper>div:not(.detail-wrapper) .list-title .list-title-text,
.body-wrapper>div:not(.detail-wrapper) .parts-top-section .parts-title-and-breadcrumbs .parts-title .parts-title-text span,
.body-wrapper>div:not(.detail-wrapper) .title-media-buttons-heading h1 {
    color: #000 !important;
    line-height: 28px !important;
}

.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .list-listing .listing-top-right .listing-dealer-info .dealer-name,
.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .fin-calc,
.body-wrapper>div:not(.detail-wrapper) .list-listing-mobile .listing-dealer-info .spec-value,
.body-wrapper>div:not(.detail-wrapper) .fin-calc,
.body-wrapper>div:not(.detail-wrapper) .fin-calc p,
.body-wrapper>div:not(.detail-wrapper) .list-main-section .list-container .list-error .info,
.body-wrapper>div:not(.detail-wrapper) .parts-bottom-section .parts-list-view .parts-list-content .error-message,
.body-wrapper>div:not(.detail-wrapper) .info,
.body-wrapper>div:not(.detail-wrapper) .list-title .list-listings-count,
.body-wrapper>div:not(.detail-wrapper) .parts-top-section .parts-title-and-breadcrumbs .parts-title .parts-listings-count,
.body-wrapper>div:not(.detail-wrapper) .list-top-section .listing-option-bar .list-listings-count,
.body-wrapper>div:not(.detail-wrapper) span.part-list-price.bold,
.body-wrapper>div:not(.detail-wrapper) .dealer-company-header,
.body-wrapper>div:not(.detail-wrapper) .dealer-info h3,
.body-wrapper>div:not(.detail-wrapper) .listing-description-text,
.body-wrapper>div:not(.detail-wrapper) .paging-container .list-page-number,
.body-wrapper>div:not(.detail-wrapper) .paging-container .page-number,
.body-wrapper>div:not(.detail-wrapper) .listing-main-stats .price,
.body-wrapper>div:not(.detail-wrapper) .list-container-flexrow .price-container .price,
.body-wrapper>div:not(.detail-wrapper) h2.listing-portion-title,
.body-wrapper>div:not(.detail-wrapper) .list-listing-mobile .price-container .price,
.body-wrapper>div:not(.detail-wrapper) .compare-listings-container .compare-container .comp-header-img .comp-title-close-cont .compare-title,
.body-wrapper>div:not(.detail-wrapper) .compare-listings-container .compare-container .compare-price,
.body-wrapper>div:not(.detail-wrapper) .rent-title,
.body-wrapper>div:not(.detail-wrapper) .rent-title-details,
.body-wrapper>div:not(.detail-wrapper) span.list-title-text,
.body-wrapper>div:not(.detail-wrapper) a.search-results-link,
.body-wrapper>div:not(.detail-wrapper) h3.listing-portion-title {
    color: #000 !important;
}

.body-wrapper>div:not(.detail-wrapper) .mobile-option-bar .mobile-option-bar-filter,
.body-wrapper>div:not(.detail-wrapper) span.listing-prices__retail-price,
.body-wrapper>div:not(.detail-wrapper) span.parts-listings-count {
    color: #000 !important;
    /*-----------------------MEDIA QUERIES-----------------------*/
}





/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1450px) {
	.about-body .width80 p {font-size: 15px; line-height: 22px;}	
	.about-body .width80 h1 {font-size: 30px; line-height: 40px;}

}
@media only screen and (max-width: 1300px) {
	.hero-overlay {top:15vw;}
	.green-banner h2 {font-size: 20px;}
	.white-btn {padding:10px 0; width: 175px; margin: 5px 0; font-size: 18px;}
}

@media only screen and (max-width: 1100px) {
	.hp-container {display: block; width: 100%;}	
	.hp-container .hp-left {width: 100%; padding:2% 0;}
	.blk-contact-form {width: 100%;}
	.hero-overlay {display: none;}
	#menu-button {text-align: right;}
	.about {display: block;}
	.sprayer-bg-2 {width: 100%;max-width: 500px; text-align: center; margin: 0 auto; padding:15px 0;}
	.about-body {width: 100%; padding:50px 0;}


}

@media only screen and (max-width: 900px) {
	.green-banner {display: block; width: 100%;}
	.green-banner h2 {width: 100%; padding:10px 0;}
	.drk-green-right {width: 100%;}
	.logo {width: 100%; text-align: center; margin: 0 auto;}
	.header-right {width: 100%; text-align: center; margin: 0 auto;}
	#menu-button {text-align: center;}
	.flex-two {display: block;}
	.iframe-2 {width: 100%; align-items: center;}

}


@media only screen and (max-width: 767px) {
		.green-banner h2 {width: 100%; padding:10px 0; font-size: 16px;}
		.white-btn {padding:10px 0; width: 90%; margin: 5px 0; font-size: 18px;}
	.footer p {font-size: 14px;}

}