﻿/***** 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 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.headerinfo a .mobileheader{
	display: none
}
.topheader {
    width: 72%;
    display: flex;
    justify-content: flex-end;
    padding: 10px 3%;
    background: #367c2b;
    clip-path: polygon(2% 0%, 100% 0, 100% 100%, 0% 100%);
}
.headerinfo i{
    padding: 0px 5px;
	color: #214d2f;
	font-size: 12px;
}
.headerinfo a{
    padding-right: 5px;
	color: #fff;
	text-transform: uppercase;
	font-family: "Georama", sans-serif;
	font-weight: 600;
	font-size: 14px;
}
.headerinfo{
	padding: 0px 10px;
}
.middleheader {
    display: flex;
    align-items: center;
    width: 100%;
	box-sizing: border-box;
	padding: 0px 3%;
    justify-content: space-between;
}
.headerlogo {
    width: 20%;
    box-sizing: border-box;
    padding: 20px 0px;
}
.headerlogo img {
    width: 100%;
    max-width: 160px;
    position: absolute;
    z-index: 1;
    top: 8px;
}
.bottomheader{
	width: 20%;
	clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
	background: #367c2b;
	height: 25px;
}
.heroslide{
	height: 700px;
}
/*---HEROSECTION--------------------------------*/
.herooverlay {
    width: 100%;
    position: absolute;
    display: flex;
    justify-content: end;
    top: 575px;
}
.herocontainbox {
    width: 42%;
    justify-content: space-between;
    display: flex;
    align-items: center;
    height: 270px;
}

.herogreendeco {
    width: 20px;
    background: #214d2f;
    height: 100%;
    clip-path: polygon(0 4%, 100% 0, 100% 100%, 0% 100%);
}
.herotextbox {
    background: #274d2e;
    display: flex;
    flex-wrap: wrap;
    width: calc(99% - 20px);
    height: 100%;
    align-items: center;
    align-content: center;
    box-sizing: border-box;
    padding: 40px;
	text-align: right;
}
.heroheader {
    font-family: "Catamaran", sans-serif;
    color: #fff;
    line-height: 42px;
    font-size: 48px;
    text-transform: uppercase;
    font-weight: 900;
	width: 100%;
    text-align: right;
	
}
.heroheader span {
    font-size: 30px;
    font-style: italic;
    line-height: 30px;
	font-weight:800;
	width: 100%;
	display: block;
}
.heropara{
   color: #fff;
	width: 100%;
	text-transform: uppercase;
	font-weight: 300;
	font-family: "Catamaran", sans-serif;
	text-align: right;
	font-size: 18px;
}
.halfgreenbtn {
    width: 48%;
    background: #3f7c25;
    text-align: center;
    margin: 2% 1%;
    color: #fff;
    font-family: "Catamaran", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 14px;
    transform: skewX(350deg);
    padding: 8px 10px;
    box-sizing: border-box;
	display: block;
	transition-duration: 0.3s;
}
.halfgreenbtn:hover {
    transform: skewX(360deg);
	background: #397121;
}
.greenbtn {
    width: 350px;
    background: #3f7c25;
    text-align: center;
    margin: 2% 0%;
    color: #fff;
    font-family: "Catamaran", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    font-size: 14px;
    transform: skewX(350deg);
    padding: 8px 10px;
    box-sizing: border-box;
	display: block;
	transition-duration: 0.3s;

}
.greenbtn:hover {
  transform: skewX(360deg);
		background: #397121;

}
.lgheadertext {
	font-family: "Georama", sans-serif;
	width: 100%;
    font-size: 42px;
    text-transform: uppercase;
    font-weight: 900;
    font-style: italic;
    line-height: 42px;
}
.lgheadertext span {
    font-weight: 100;
    font-style: normal;
    font-family: "Catamaran", sans-serif;
    width: 100%;
    display: block;
    line-height: 28px;
    font-size: 28px;
}
.subtext{
	font-family: "Georama", sans-serif;
	font-size: 20px;	
	margin-bottom: 10px;
	font-weight: 800;
	font-style: italic;
}
.paratext{
    font-family: "Catamaran", sans-serif;
	font-size: 18px;
}
.paratext a{
	color: #274d2e;
	font-weight: 700;
	transition-duration: 0.3s;
}
.paratext a:hover{
	font-weight: 800;
}
.ltgreen{
	color: #3f7c25;
}
.dkgreen{
	color: #274d2e;
}
.white{
	color: #fff;
}
.hpaboutsect {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    align-items: stretch;
}
.hpaboutline {
    width: 500px;
    height: 50px;
    background: #467c1d;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 5% 100%);
}

.hpabouttext {
    padding: 5% 15%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
	text-align: center;
}

.hp-inv-box {
    height: 450px;
    width: 23%;
    border-top: solid 10px #4c7c12;
    display: flex;
    align-items: flex-end;
	transition-duration: 0.3s;
}

.hp-inv-box:hover {
    width: 24%;
}
.hp-inv-sect {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    padding: 2% 5%;
}
.hp-inv-text-sect {
    background: url(/siteart/inv-cat-title-bkgd.png);
    height: 72px;
    width: 100%;
    background-size: cover;
    display: flex;
    align-items: center;
    padding: 0px 10px;
    box-sizing: border-box;
	transition-duration: 0.3s;
}
.hp-inv-text-sect:hover {
    height: 80px;
  
}
.hpinvtext {
    font-family: "Georama", sans-serif;
    font-size: 24px;
    text-transform: uppercase;
    font-weight: 800;
    color: #fff;
	line-height: 24px;
}

.hpinvtext span {
    font-family: "Catamaran", sans-serif;
    width: 100%;
    display: block;
    font-size: 18px;
    line-height: 18px;
    font-weight: 300;
}
.hp-upcoming-auction {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5%;
    flex-wrap: wrap;
}
.hp-auction-left{
	background: url("/siteart/hp-auction-yard.JPG");
	width:50%;
	height: 480px;
	background-size: cover;		
}
.hp-auction-right {
    width: 45%;
    border-left: solid 6px #274d2e;
    padding: 60px 40px;
    box-sizing: border-box;
}
.hpauctiondate {
    color: #274d2e;
    font-family: "Catamaran", sans-serif;
    font-size: 20px;
	font-weight: 300;
	text-transform: uppercase;
	padding: 5px 20px 10px 20px;
}
.hpauctiondate i{
    padding-right: 10px;
	color: #3f7c25;
}
.leftgreenanglebrk {
    background: #3f7c25;
    height: 60px;
    width: 35%;
    clip-path: polygon(0 0, 95% 0%, 100% 100%, 0% 100%);
    position: relative;
    z-index: 1;
}
.hp-register-bid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #274d2e;
    border-top: solid 28px #2f5039;
    padding: 5% 20%;
    position: relative;
    top: -28px;
}
.hp-reg-title {
    width: 100%;
    text-align: center;
	padding-bottom: 40px;
}
.halfsect {
    width: 48%;
}
.hpregstep {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    padding: 10px 0px;
}
.hpregicon{
	color: #fff;
	padding-right: 10px;
	padding-top: 5px;
}
.hp-choose-right {
    background: url(/siteart/hp-custom-review.jpg);
    width: 50%;
    background-size: cover;
}
.hp-why-choose-sect {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    padding: 5%;
}
.hp-choose-left {
    width: 50%;
}
.reviewslider {
 width: 80%;
}
.reviewslide {
    background: #f6f8f7;
    padding: 40px 20px;
    box-sizing: border-box;
}
.starreview{
	color: #214d2f;
	font-size: 14px;
	margin: 10px 0px 5px 0px;
}
.mobileappsect {
    display: flex;
    align-items: center;
    width: 106%;
    background: #467c1d;
    clip-path: polygon(0 0, 97% 0%, 100% 100%, 0% 100%);
	margin-top: 40px;
}
.mobileappicon {
    background: #2c4d2d;
    color: #fff;
    height: 175px;
    width: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: stretch;
    flex-wrap: wrap;
    font-size: 24px;
}
.mobileapptext {
    box-sizing: border-box;
    padding: 20px;
}
.mobileapptext h6 {
   margin-bottom: 0px;
}
.mobileapplink {
    font-family: "Catamaran", sans-serif;
    color: #fff;
    padding-right: 20px;
    text-transform: uppercase;
    font-weight: 800;
	transition-duration: 0.2s;
}
.mobileapplink:hover {
    letter-spacing: 0.5px;
}
.mobileapplink i{
    font-size: 12px;
}
.shipslide.slick-slide {
    height: 600px;
}
/*--------SECONDARY STYLES--------------------*/
.pagetitlesect {
    padding: 3% 10% 0% 10%;
}
.pagetitle {
    font-family: "Georama", sans-serif;
    color: #274d2e;
    text-transform: uppercase;
    font-size: 55px;
    font-weight: 800;
    font-style: italic;
}
.pagetitlegreenangle {
    width: 350px;
    height: 30px;
    background: #274d2e;
    clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%);
    margin-top: 10px;
}
.pagesection {
    padding: 2% 10%;
}
.pagesection p{
    padding: 10px 0%;
}
.flexbox{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.smheadertext {
    font-family: "Georama", sans-serif;
    width: 100%;
    font-size: 35px;
    text-transform: uppercase;
    font-weight: 900;
    font-style: italic;
    line-height: 32px;
}
.iconsect {
    width: 48%;
}
.iconbox {
    background: #467c1d;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    transform: skewX(-2deg);
    font-size: 14px;
}
.icontext strong {
    width: 100%;
    display: block;
    font-size: 20px;
    line-height: 20px;
    font-weight: 800;
}
.cpinfo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
	margin: 30px 0px;
}
.cpinfotext {
    color: #2c4d2d;
    font-family: "Georama", sans-serif;
    font-size: 18px;
	transition-duration: 0.3s;
}
.cpinfotext:hover {
    font-weight: 500;
}
.cpicon {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #3f7c25;
    color: #fff;
    transform: skewX(358deg);
	margin-right: 10px;
}
.shipsect{
	background: url(/siteart/transport-nates-tractor.jpg); 
	background-size: cover; 
	background-position: center; 
	transform: skewX(359deg); 
	border-radius: 5px; 
}
.fullformfields {
    width: 100%;
    padding: 10px 5px;
    box-sizing: border-box;
    font-family: "Georama", sans-serif;
    margin: 5px 0px;
}
.message {
    width: 100%;
    padding: 10px 5px;
    box-sizing: border-box;
    font-family: "Georama", sans-serif;
    margin: 5px 0px;
	height: 100px;
}
.CaptchaMessagePanel{
    font-family: "Georama", sans-serif;
    font-size: 14px;	
}
input#CaptchaAnswer {
    height: 25px;
	font-family: "Georama", sans-serif;
}
.CaptchaWhatsThisPanel a{
		font-family: "Georama", sans-serif;
    color: #2c4d2d;

}
.width-100 {
    width: 100%;
    display: flex;
    justify-content: center;
}
.submit {
    background: #467c1d;
    border: none !important;
    color: #fff;
    font-family: "Georama", sans-serif;
    height: 35px;
    width: 230px;
    font-weight: 700;
	transition-duration: 0.3s;
}
.submit:hover {
    background:#2c4d2d;
}
/*-------- FOOTER STYLES ----------------*/
footer{}
iframe.scrolling {
    width: 100%;
    height: 80px;
}
.footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: flex-start;
    padding-top: 30px;
	
}
.footerthird {
    width: 33%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0px 3%;
	box-sizing: border-box;
}
.footerheader {
    font-family: "Georama", sans-serif;
    font-size: 16px;
    padding-bottom: 8px;
    color: #304d2c;
	width: 100%;
}
.footerlinks {
    width: 33%;
    font-family: "Catamaran", sans-serif;
    font-size: 16px;
    color: #304d2c;
    font-weight: 500;
}
.footergreenangle {
    width: 400px;
    height: 25px;
    background: #4c7c12;
    clip-path: polygon(2% 0, 100% 0, 100% 100%, 0% 100%);
}
.footerinfo {
    color: #4c7c12;
    font-family: "Catamaran", sans-serif;
    width: 100%;
}
.footerinfo i{
    color: #304d2c;
	padding-right: 5px;
 
}
.footerthird img {
    width: 100%;
	max-width: 350px;
}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.faceted-search-content .selected-facets-container .selected-facet{
    background: #285331!important;	
}
.list-top-section .list-title .list-title-text{
	color:#285331!important; 
	font-family: "Catamaran", sans-serif!important;
}
.list-top-section .list-listings-count{
	color: #367c2b!important;
}
.list-content .list-error-container .info button:not(.login-button){
	background: #285331!important;
	
}
.grouped-faceted-header{
	background: #285331!important;
}
.list-container-flexrow .view-listing-details-link, .list-container-flexrow .dealer-phone-call, .list-container-flexrow .dealer-phone-text{
	    background-color: #3f7c25!important;
}
.faceted-search-content button.faceted-search{
	    background-color: #3f7c25!important;	
}
.faceted-search-content .mobile-done-button-container .mobile-done-button{
	    background-color: #3f7c25!important;		
}
.view-listing-details-link{
	    background-color: #3f7c25!important;	
	
}
.list-content .price-container .price{
	color:#285331!important; 
	
}
/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1690px) {
	.herocontainbox {height: 260px;}
	
}
@media only screen and (max-width: 1590px) {
.headerlogo {
    width: 15%;
}
.herocontainbox {
    width: 52%;
    height: 248px;
}	
}
@media only screen and (max-width: 1295px) {
	.mobileappsect{    width: 140%;}
	.hp-choose-right{
		background-position: center;
	}
	    .herocontainbox {
        width: 65%;
        height: 248px;
    }
}
@media only screen and (max-width: 1195px) {
.headerlogo {
    width: 30%;
}	
	.halfsect {
    width: 100%;
		padding-bottom: 20px;
}
	.hp-register-bid {
		    padding: 2% 5%;
	}
    .headerlogo img {
        width: 100%;
        max-width: 150px;
        position: relative;
    }
	.shipsect{
		height: 200px;
	}
	.herocontainbox{
        width: 75%;
        height: 265px;
    }
}
@media only screen and (max-width: 1140px) {
	.footerthird{
	padding: 0px 1%;	
	}	
	    .herocontainbox {
        width: 85%;
        height: 260px;
    }
	.footerlinks {
		width: 50%;}
	.hp-inv-box {
    height: 250px;
	width: 48%;
	margin: 5px 0px;
	}
	.hp-inv-box:hover {
	width: 49%;
	}
	.hp-auction-left{
		    width: 100%;
    height: 300px;
		background-position: center;
	}
	.hp-auction-right {
		width: 100%;}
}
@media only screen and (max-width: 1000px) {
	.pagetitle{font-size: 40px; line-height: 40px;}
	.pagetitlegreenangle {
    width: 250px;
    height: 18px;
    background: #274d2e;
    clip-path: polygon(0 0, 100% 0%, 98% 100%, 0% 100%);
    margin-top: 10px;
	}
	.hp-choose-left {
    width: 100%;
}
	.mobileappsect {
        width: 100%;
        clip-path: none;
    }
	.reviewslider {
    width: 95%;
}
	    .hp-choose-right {
        background-position: center;
        width: 100%;
        height: 350px;
        margin-top: 40px;
    }
	    .herocontainbox {
        width: 85%;
        height: 252px;
    }
}
@media only screen and (max-width: 950px) {
	.headerdesktop{
		display: none;
	}
	    .herocontainbox {
        width: 98%;
        height: 270px;
    }
	.headerinfo a .mobileheader{
		display: block;
	}
	.headerinfo{
	display: flex;
    justify-content: center;
    align-items: center;	
	}
	.headerinfo i {
    padding: 8px;
    color: #fdfdfd;
    font-size: 12px;
    background: #2c4d2d;
    margin-right: 5px;
}
	.headerlogo {
        width: 45%;
    }

	.footerlinks {
		width: 100%;}
	.shipslide.slick-slide {
    height: 350px;
}
}

@media only screen and (max-width: 700px) {
	.heroslide {
    height: 400px;
}
	.herooverlay {
    position: relative;
    top: 0px;
}
	.herogreendeco{
		display: none;
	}
	.herotextbox{
		width: 100%;
	}
	    .herocontainbox {
			width: 100%;}
	.footerthird {width: 100%; margin-bottom: 10px;}
    .footerlinks {
        width: 50%;
    }
	.footerthird img {
    max-width: 300px;
}
	.iconsect {
    width: 100%;
}
	.hpabouttext {
		padding: 10% 5%;}
	.lgheadertext span{
	    line-height: 20px;
    font-size: 20px;	
	}
	.lgheadertext{
	font-size: 34px;	
    line-height: 28px;
	}
	.subtext{
	font-size: 18px;	
	}
	.mobileappicon{
	    height: 180px;	
	}
}
@media only screen and (max-width: 670px) {
	.halfgreenbtn {width: 100%;padding: 15px 10px;margin: 1%;}
	.herocontainbox{height: auto;}
	.herotextbox{height: auto;}
	.heroslide {
        height: 260px;
    }
    .mobileapplink {
        width: 100%;
        display: block;
        line-height: 15px;
        margin-bottom: 12px;
    }
	.mobileappicon {
        height: 250px;
    }
}
@media only screen and (max-width: 580px) {
	.topheader {
		width: 100%; clip-path: none; padding: 10px 1%;}
	.headerinfo {
    padding: 0px;
}
	.paratext {
		font-size: 16px;
	}
	.smheadertext{
	    font-size: 22px;
		line-height: 22px;
	}
	.hp-auction-right
 {
    padding: 40px 10px;	 
	}
	
}

@media only screen and (max-width: 520px) {
    .headerlogo {
        width: 80%;
    }
	.middleheader{
	    padding: 0px 1%;	
	}
	.pagesection {
    padding: 2% 3%;
}
	.pagetitlesect {
    padding: 3% 3% 0% 3%;
}
    .pagetitle {
        font-size: 30px;
        line-height: 30px;
    }	
.hp-inv-box {
    height: 200px;
	width: 95%;
	margin: 5px 0px;
	}
	.hp-inv-box:hover {
	width: 97%;
	}
	.hp-inv-sect{
		justify-content: center;
	}
	.hp-auction-left{
		height: 200px;
	}
	.heroheader{ line-height: 30px; font-size: 35px;}
	.heroheader span {font-size: 25px;}
	.heropara{
	    font-size: 18px;
    line-height: 20px;	
	}
	.herotextbox{padding: 20px;}
}
@media only screen and (max-width: 410px) {
    .headerinfo i {
        padding: 8px;
		font-size: 12px;	
	}
	.headerinfo{
		flex-wrap: wrap;
		text-align: center;
	}
	.mobileapptext {
    box-sizing: border-box;
    padding: 20px 10px;
    width: calc(100% - 50px);
}
	.mobileappicon {
        height: 320px;
        width: 38px;
        font-size: 18px;
    }
	.greenbtn {
		width: 92%;}
	.icontext strong{
	font-size: 18px;
    line-height: 18px;	
	}
	.hp-choose-right{
	        height: 250px;	
	}
	.cpinfotext {
		font-size: 16px;
	}
	.cpicon {
    width: 30px;
	height: 30px;    
	font-size: 12px;
	}
	.hpauctiondate{
		font-size: 18px;    
		padding: 5px 10px 10px 10px;
	}
	.hp-register-bid {
		    padding: 5%;
	}
	.leftgreenanglebrk{
	    height: 42px;	
	}
	    .halfgreenbtn {
        width: 100%;
        padding: 10px;
        margin: 1% 0%;
    }
	    .heroslide {
        height: 200px;
    }
}

@media only screen and (max-width: 330px) {
	    .footerlinks {
        width: 100%;
    }
	.pagetitlegreenangle {
	width: 80%;
	}
	.iconbox{
	width: 30px;
    height: 30px;	
	font-size: 14px;
	}
}
@media only screen and (max-width: 310px) {
	.mobileappicon{
		display: none;
	}
}