/* 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;} img{max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast;}


/* FRAMEWORK */

*{box-sizing: border-box;}
html, body{font-family: 'Roboto', sans-serif; font-size: 16px; -webkit-text-size-adjust: none} 
html {scroll-behavior: smooth;}
body {overflow-x: hidden; line-height: 1.8; letter-spacing: .02em;}
::-moz-selection{background: #ff3600; color: #fff; text-shadow: none} ::selection{background: #ff3600; color: #fff; text-shadow: none;}

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;
}
select,
button,
[type="button"],
[type="reset"],
[type="submit"],
[type="date"] {
  -webkit-appearance: button;
}

.pad60 {padding: 60px 5%!important;}
.pad30 {padding: 30px!important;}
.center {text-align: center;}
.orange {color: #ff3600;}
.align-right {text-align: right;}
.dark-pattern {background: #000 url('/siteart/dark-pattern.png'); background-attachment: fixed;}

.content-width {margin: 0 auto; width: 95%; max-width: 1400px;}
.flex-wrapper {display: flex; flex-direction: row!important; flex-wrap: wrap; justify-content: space-between; align-items: center;}

.equipment-wrapper {
	justify-content: flex-start !important;
}
.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0;} .column12{width: 100%; padding: 0; box-sizing: border-box;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%; box-sizing: border-box;} .column7{width: 58.3333%; position: relative; box-sizing: border-box;} .column6{width: 50%; box-sizing: border-box;} .column5{width: 41.6666%; box-sizing: border-box;} .column4{width: 33.3333%; box-sizing: border-box;} .column3{width: 25%; box-sizing: border-box;} .column2{width: 16.6666%; box-sizing: border-box;} .column1{width: 8.3333%;} .last{padding: 0;} .cf{zoom: 1;} .cf:before, .cf:after{content: ""; display: table;} .cf:after{clear: both;} .clear{clear: both;} *{box-sizing: border-box;}


/* LINKS + BTNS */

a{text-decoration: none; color: inherit; transition: all .2s ease-in-out;} a:hover{color: inherit;}
a#cta-btn button {cursor: pointer; display: inline-block; text-align: center; background: transparent; border: 1px solid #555; border-radius: 30px; color: #555!important; font-family: 'Roboto', sans-serif; position: relative; padding: 12px 10%; transition: all .3s ease-in-out; font-size: 14px; line-height: 20px; margin: 3px; font-weight: 700; letter-spacing: 2px;}
a#cta-btn2 button, a.continue-btn {cursor: pointer; display: block; text-align: center; background: transparent; border: 1px solid #e03100; border-radius: 30px; color: #e03100!important; font-family: 'Roboto', sans-serif; position: relative; padding: 12px 10%; transition: all .3s ease-in-out; font-size: 14px; line-height: 20px; font-weight: 700; max-width: 444px; margin: 0 auto; letter-spacing: 2px; width: 100%;}
a#cta-btn button:hover {border: 1px solid #ff3600; color: #ff3600!important; text-decoration: none;}
a#cta-btn2 button:hover, a.continue-btn:hover {border: 1px solid #555; color: #555!important; text-decoration: none;}


/* HEADER */
.header {width: 100%; background: linear-gradient(#ddd, #f0f0f0); padding: 0 5%; box-sizing: border-box; border-bottom: 1px solid #ccc;}
.inv-header {width: 100%; position: relative; background: linear-gradient(#ddd, #f0f0f0); padding: 0 5%; box-sizing: border-box; border-bottom: 1px solid #ccc;}
#menu-button, .mobile-icons {display: none;}
a#main-logo {padding: 2.5em 0; display: block;}
a#main-logo img {width: 100%; height: auto; max-width: 222px; box-sizing: border-box;}

.header.clone {position: fixed; top: -888px; left: 0; right: 0; z-index: 999; transition: 0.4s top cubic-bezier(.3,.73,.3,.74);}
body.down .header.clone {top: 0;}
.clone a#main-logo {padding: 1.5em 0;}
.clone a#main-logo img {display: none;}


/* ALL OTHER STYLES */

.welcome-banner {width: 100%; background: #444; padding: 2em 5%; display: flex; flex-wrap: wrap; align-items: center;}
/* keyword search */
.detailed-search {display: flex; justify-content: flex-end;}
.detailed-search input[type="text"] {background: #333; border: 0; width: 70%; border-radius: 30px 0 0 30px; padding: 20px 30px; color: #aaa; letter-spacing: 1px;}
.detailed-search input[type="text"]::placeholder {color: #aaa; letter-spacing: 1px; font-size: 14px;}
.detailed-search button[type="submit"] {background: #000; border: 0; border-radius: 0 30px 30px 0; padding: 0 25px; cursor: pointer; margin-left: -4px; color: #ff3600; font-weight: 900; font-size: 36px; transition: all .3s ease-in-out;}
.detailed-search button[type="submit"]:hover {background: #222;}


.manu-logos {display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
.manu-logos a {display: flex; justify-content: center; align-items: center; width: calc(50% - 2em); height: 500px; margin: 1em; box-shadow: 0px 5px 5px 0px rgb(0 0 0 / 15%); position: relative; text-align: center;}
.manu-logos img {width: 100%; height: auto; max-width: 300px;}
.manu-logos.full-page a {width: calc(50% - 2em); margin: 1em; height: auto;}
.manu-logos #puthaven-farms {color: #000; font-weight: 900; font-size: 22px; line-height: 26px; letter-spacing: 1px; position: absolute; left: 0; right: 0; margin-top: 25px;}
.manu-logos #puthaven-farms span {display: block; margin-top: 10px; font-style: italic; font-size: 10.5px; line-height: 18px; letter-spacing: 1px;}

/* slick slideshow */
.hero-slider {position: relative;}
.hero-slider img {width: 100%; height: auto;}

.quicklinks-wrapper {padding: 3%;}
.zoom{float: left; width: calc(25% - 2em); position: relative; margin: 1em; height: auto; overflow: hidden;}
.zoom img{display: block;}
.zoom .zoom-caption{position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(255,54,0,.55); transition: all .5s ease; z-index: 2;}
.zoom .zoom-caption .zoom-caption-text{width:100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 5px 10%; font-size: 20px; text-align: center;}
.zoom:hover .zoom-caption{background: transparent;}
.zoom-caption h3 {color: #fff!important; letter-spacing: 1px; font-weight: 700!important; font-size: 24px;}
.zoom-caption i {display: block; font-size: 30px; line-height: 20px;}

.page-hero h1 {color: #ddd;}
.page-hero h1 span {color: #aaa!important;}
.page-hero hr {border: 1px solid #ff3600; width: 100%; display: inline-block; max-width: 20%; margin-bottom: 0!important;}

.content-wrapper hr {border: 1px solid #ff3600; width: 100%; display: inline-block; max-width: 20%; margin-bottom: 20px;}
.content-wrapper h1 {font-weight: 800; font-size: 36px; line-height: 50px;}
.content-wrapper h1 span {font-weight: 400; letter-spacing: 4px; font-size: 30px; line-height: 40px; display: block; color: #444;}
.content-wrapper h2 {font-weight: 900; letter-spacing: 4px; color: #757575;}
.content-wrapper h2 span {font-weight: 400;}
.content-wrapper h3 {font-weight: 900; letter-spacing: 4px; color: #fff;}
.content-wrapper h3 span {font-weight: 400;}
.content-wrapper a {color: #757575; letter-spacing: 2px;}
.content-wrapper a:hover {color: #ff3600; text-decoration: underline;}
.content-wrapper ul#parts-list {column-count: 2; margin: 30px;}
.content-wrapper p strong {color: #444;}


.equipment-wrapper a {width: calc(33.33% - 2em); margin: 1em; color: #000; padding: 1em; box-shadow: 0px 5px 5px 0px rgb(0 0 0 / 15%);}

/* scrolling inventory */
.scrolling-wrap {width:100%; height:90px; overflow:hidden; margin: 30px 0;}
.scrolling {width:100%; height:92px;}


/* form + captcha */
#form {margin: 1em 0;}
#form .form-row {display: block; /*margin: 0 0 5px;*/ text-align: left!important;}
#form .form-row label{font-weight: 600; color: #444;}
#form input[type="text"], #form input[type="email"], #form select, #form textarea, #form input[type="date"] {width: 100%; margin: 5px 0 20px; padding: 10px; border: 1px solid #ddd; background: #f0f0f0; font-weight: 500; color: #000; height: 50px;}
#form textarea {height: 90px;}
#form .checkbox {margin-top: 15px;}
#form input[type="submit"] {cursor: pointer; display: inline-block; text-align: center; background: #333; border: none; border-radius: 30px; color: #fff!important; font-family: 'Roboto', sans-serif; position: relative; padding: 15px 4em; transition: all .3s ease-in-out; font-size: 14px; width: 100%; max-width: 444px; margin: 3px; font-weight: 800; letter-spacing: 1px;}
#form input[type="submit"]:hover {background: #222; color: #fff!important;}


.CaptchaPanel{line-height: normal !important;}
.CaptchaAnswerPanel input{width: 100%; max-width: 350px; padding: 10px; margin: 5px 0; background: #f0f0f0; border: 1px solid #ddd; color: #000;}
.CaptchaMessagePanel{padding: 0 !important; margin: 0 !important; font-weight: normal !important; font-size: 12px; line-height: 50px; color: #444;}
.CaptchaImage {width: auto!important; padding: 0!important;}
.CaptchaAnswerPanel{margin: 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel{line-height: 0; margin: 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a{font-size: 12px; color: #fff;} .CaptchaWhatsThisPanel a:hover{text-decoration: none;}


/* FOOTER */

.footer {display: flex; flex-wrap: wrap; background: linear-gradient(#333, #222); color: #ccc;}
.footer .column4 {padding: 7em 7%; display: inline-flex; justify-content: center; flex-wrap: wrap; flex-direction: column;}
.footer h2 {font-size: 22px; line-height: 30px; font-weight: 700; letter-spacing: 2px; display: block; margin-bottom: 20px; color: #ff3600;}
.footer a {color: #ddd!important;}
.footer a:hover, .site-host a:hover, .social-links i:hover {color: #fff!important;}

/* accordion menu */
#footer-nav {width: 100%; overflow: hidden;}
#footer-nav ul.submenu {list-style: none;}
#footer-nav ul.submenu {padding: 0; background: #555;}
#footer-nav ul.submenu li {border-bottom: 1px solid #000;}
#footer-nav ul.submenu li:last-child {border-bottom: none;}
#footer-nav ul.submenu li a {display: block; font-size: 15px; padding: 5px 30px;}
#footer-nav ul.submenu li a:hover {background: #ff3600; color: #fff;}
details summary::-webkit-details-marker {display: none; transition: max-height 0.2s ease-out;}
.accordion__item {position: relative;}
.accordion__title input:focus, .accordion__title2 input:focus {outline: none;}
.accordion__title, .accordion__title2 {
    font-family: 'Roboto',sans-serif !important;
	padding: 5px 0;
	position: relative;
	z-index: 20;
	display: block;
	cursor: pointer;
}
.accordion__title:hover, .accordion__title2:hover {color: #fff;}
.accordion__title::after {
  display: block;
  content: " + ";
  font-size: 22px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.3s all;
}
.accordion__title:hover::after {color: #ff3600;}
.accordion__item[open] .accordion__title::after {
  transform: translateY(-50%) rotate(180deg);
  content: ' - ';
}

.social-links i {margin-top: 15px; display: block;}
.site-host {margin: 12px 0; font-size: 12px; color: #999; line-height: 20px;}
.site-host a {color: #999!important;}

/* MEDIA QUERIES (RESPONSIVE) */

@media screen and (max-width: 1450px) {
	.zoom {width: calc(50% - 2em); height: 400px;}
	.manu-logos a {height: 400px;}
}
	
@media screen and (max-width: 1111px){		
	.column1, .column2, .column3, .column4, .column5, .column6, .column7, .column8, .column9, .column10, .column11, .column12 {margin: 0 auto; width: 100%; float: none; padding: 0;}
	
	a#main-logo {padding: 1.5em 0 0; text-align: center;}
	
	.manu-logos a {width: calc(50% - 2em);}
	.equipment-wrapper a, .manu-logos.full-page a {width: calc(50% - 2em);}
	.zoom, .manu-logos a {height: auto;}
	
	.welcome-banner h3 {margin-bottom: 20px; font-size: 30px; line-height: 44px; max-width: 90%;}
	.detailed-search {justify-content: center;}
	
	a#cta-btn button {margin: 0 auto; display: block; margin-top: 10px; margin-bottom: 10px; width: 100%;}
	
	.welcome-banner, .quicklinks-wrapper {padding: 3em 5%!important;}
	.hide-mobile, .clone a#main-logo {display: none;}
	
	.pad30 {padding: 20px!important;}
	.pad60 {padding: 50px 7%!important;}
	
	.content-wrapper h1 span {font-size: 24px; line-height: 34px;}
	.content-wrapper h1 {font-size: 30px; line-height: 40px;}
		
	.welcome-banner, .content-wrapper, .page-hero, .footer, .align-right {text-align: center;}
	.footer .column4 {padding: 4em 10%; width: 100%; margin: 0 auto;}
}

@media screen and (max-width: 767px) {
	.manu-logos a, .equipment-wrapper a {width: calc(50% - 1em); margin: .5em;}
}

@media screen and (max-width: 500px) {
	#form {margin: 0;}
	.equipment-wrapper a, .zoom, .manu-logos.full-page a {width: 100%; margin: 0 auto; margin-top: 10px; margin-bottom: 10px;}
	.welcome-banner, .quicklinks-wrapper {padding: 3em 10%!important;}
}