﻿/***** 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;}

h1 { font-family: 'Rubik', sans-serif; font-size: 50px; }
h2 { font-family: 'Rubik', sans-serif; font-size: 40px; line-height: 1.3; }
h3 { font-family: 'Rubik', sans-serif; font-size: 26px; font-weight: 500; }
h4 { font-family: 'Rubik', sans-serif; font-size: 18px; }
p { font-family: 'Rubik', sans-serif; font-size: 16px; line-height: 1.5; }

/*--- HEADER STYLES ---------------------*/
header {}

.shiloh-header { width: 100%; margin: 0 auto; position: relative; z-index: 10; box-shadow: 0 0 12px rgba(0, 0,0, .8); }
.shiloh-header-wrap { 
	width: 100%; height: 110px; margin: 0 auto; display: flex; justify-content: center; position: relative; z-index: 2; box-shadow: 0 0 10px rgba(0, 0, 0, .8); }
.header-logo {
	background: #fff; display: flex; justify-content: center; align-items: center; width: 30%; height: 100%; box-shadow: 0 0 12px rgba(0, 0, 0, .8); position: relative; z-index: 3; box-sizing: border-box; }
.header-logo a img { height: 110px; padding: 10px 0; box-sizing: border-box; }
.header-right { display: flex; flex-direction: column; justify-content: flex-start; width: 70%; height: 100%; }
.topheader {
	width: 100%; height: calc(100% - 42px); /* 100% - height of .nav-div */ display: flex; justify-content: flex-start; align-items: center; background: #ddd; position: relative; overflow: hidden; }
.topheader > div {
	width: 100%; max-width: 1500px; padding: 0 36px 0 50px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; }
.topheader > div a img { width: 180px; }
.topheader > div a img.versatile-logo { margin: 12px 0 0 0; }
.topheader a.listed { color: #595959; /* med gray */ font-size: 14px; transition: .2s ease all; }
.topheader a.listed:before { background: #000; top: calc(100% + 30px); bottom: -30px; right: -16px; }
.topheader a.listed:hover { color: #fff; transition: .2s ease all; }
.topheader a.listed:hover:before { top: -30px; }
.nav-div {
	width: 100%; height: 42px; display: flex; justify-content: flex-start; align-items: center; padding: 0 48px 0 60px; box-sizing: border-box; background-image: linear-gradient(#71d620, #64a42c); position: relative; }

/*---BODY--------------------------------*/
.underline { position: relative; z-index: 1; }
h1.underline:before { bottom: 6px; }
h2 span.underline { font-size: 32px; }
.underline:before { 
	position: absolute; z-index: -1; content: ""; bottom: 1px; left: -4px; right: -20px; height: 12px; background: #78c036; }
.content-sect { 
	display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 40px 5%; box-sizing: border-box; }
.content-sect p { margin: 20px 0; }
.content-sect .btnclass { margin: 12px 0; }
.content-sect a.listed { margin: 12px 0; }

.btnclass { 
	background: #000; color: #fff; font-family: 'Rubik', sans-serif; font-size: 20px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; text-align: center; display: flex; justify-content: center; align-items: center; position: relative; z-index: 1; padding: 12px 36px; box-sizing: border-box; transition: .25s ease all; }
.btnclass:before { 
	position: absolute; z-index: -1; content: ""; top: 0; bottom: 0; left: 0; right: calc(100% - 6px); background: #5b9324; /* DARK GREEN */ transition: .25s ease all; }
.btnclass:after { 
	position: absolute; z-index: -1; content: ""; top: 0; bottom: 0; left: calc(100% - 6px); right: 0; background: #5b9324; /* DARK GREEN */ transition: .25s ease all; }
.btnclass:hover { color: #000; text-shadow: 0 0 14px #78c036; transition: .25s ease all; }
.btnclass:hover:before { right: 40%; transition: .25s ease all; }
.btnclass:hover:after { left: 40%; transition: .25s ease all; }
.listed { 
	font-family: 'Rubik', sans-serif; font-size: 18px; line-height: 1.7; color: #000; display: flex; justify-content: flex-start; align-items: center; position: relative; z-index: 1; transition: .25s ease all; }
.listed i { font-size: 16px; width: 20px; text-align: center; margin: 0 16px 0 0; }
.listed:before { 
	position: absolute; z-index: -1; content: ""; top: -10px; bottom: -10px; left: -14px; right: calc(100% + 14px); background: #5b9324; /* DARK GREEN */ transition: .25s ease all; }
.listed:hover { color: #000; transition: .25s ease all; }
.listed:hover:before { right: -16px; transition: .25s ease all; }
.invisilink { color: #000; font-weight: 600; }
.invisilink:hover { text-decoration: underline; }

.shop-by-cat { width: 50%; }
.inv-btns { width: 100%; height: 500px; display: flex; flex-wrap: wrap; }
.inv-btns a {
	background: #222; display: flex; justify-content: center; align-items: center; width: 33.333333%; height: 250px; position: relative; transition: .15s ease all; }
.inv-btns a div.inv-img { 
	background: #222; background-size: 184%; background-position: center; background-repeat: no-repeat; position: absolute; z-index: 1; content: ""; top: 0; bottom: 0; left: 0; right: 0; filter: brightness(.6); transition: .15s ease all; }
.inv-btns a.deutz-fahr-inv div.inv-img { background-size: 178%; background-position: 47% center; }
.inv-btns a.versatile-inv div.inv-img { background-size: 290%; background-position: 68% 45%; }
.inv-btns a div:not(.inv-img) { display: flex; flex-wrap: wrap; justify-content: center; position: relative; z-index: 2; }
.inv-btns a.half { width: 50%; }
.inv-btns a span { 
	color: #fff; font-family: 'Rubik', sans-serif; text-transform: uppercase; text-align: center; text-shadow: 0 0 10px #000; }
.inv-btns a span.cta-sm { font-size: 20px; font-weight: 300;  font-style: italic; flex-basis: 100%; }
.inv-btns a span.cta-big { font-size: 24px; font-weight: 700; align-self: center; position: relative; z-index: 1; }
.inv-btns a span.cta-big.underline-c:before { 
	position: absolute; z-index: -1; content: ""; left: -4px; right: -4px; bottom: 0; height: 12px; background: #78c036; /* LIGHT GREEN */}
.inv-btns a:hover div.inv-img { background-size: 214%; filter: brightness(.9); transition: .5s ease all; }
.inv-btns a.deutz-fahr-inv:hover div.inv-img { background-size: 208%; }
.inv-btns a.versatile-inv:hover div.inv-img { background-size: 336%; }

/* default.htm - Homepage */
.hero { 
	width: 100%; max-width: 3500px; height: 700px; margin: 0 auto; background: #595959; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; }
.hero-overlay { 
	position: relative; z-index: 2; width: 100%; max-width: 1900px; height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 0 0 0 5%; box-sizing: border-box; margin: 0 auto; }
.hero-overlay h1 { color: #fff; position: relative; z-index: 2; width: 100%; text-shadow: 0 0 12px #000; }
.hero-overlay h2 { 
	font-size: 26px; font-weight: 500; color: #fff; position: relative; z-index: 2; width: 350px; margin: 30px 0 60px 0; text-shadow: 0 0 12px #000; }
.hero-overlay a { position: relative; z-index: 2;  }
.hero-shader { position: absolute; top: 0; bottom: 0; left: 0; right: 50%; background: rgba(0, 0, 0, .6); clip-path: polygon(100% 100%, 60% 0, 0 0, 0 100%); display: flex; align-items: flex-end; }
.shop-by-cat-title { 
	background: #000; width: 100%; height: 100px; padding: 32px 0 36px 10%; box-sizing: border-box; display: flex; justify-content: flex-end; }
.shop-by-cat-title h3 {
	width: 100%; max-width: 830px; font-size: 32px; font-weight: 800; letter-spacing: 2.5px; color: #fff; text-transform: uppercase; }
.shop-by-cat-title h3:before { background: #5b9324; /* DARK GREEN */ bottom: -4px; left: -12px; }

.homepage.cats-mission { display: flex; align-items: center; max-width: 3000px; margin: 0 auto; }
.homepage .content-sect { width: 50%; max-width: 1000px; padding: 20px 40px; }
.homepage.auction-sect { 
	width: 100%; max-width: 2000px; margin: 40px auto; padding: 0 5% 0 0; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; }
.homepage.auction-sect .auctionimg { 
	width: 44%; height: 100%; min-height: 400px; background: #5b9324; background-size: cover; background-position: 38% 85%; background-repeat: no-repeat; }

/* about-us.htm */
.aboutpage { display: flex; justify-content: center; width: 100%; max-width: 2500px; margin: 0 auto; }
.aboutpage .content-sect { width: 100%; }

/* contact-us.htm */
.contactpage { 
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width: 100%; max-width: 2500px; margin: 0 auto; }
.contactpage .content-sect { width: 50%; }
.contactpage .fullmap { width: 50%; height: 100%; min-height: 500px; margin: 0 0 -4px 0; }
.contactpage .fullmap iframe { width: 100%; height: 100%; min-height: 500px; }

/* thank-you.htm */
.thankyoupage { 
	display: flex; justify-content: space-between; align-items: center; width: 100%; max-width: 2500px; margin: 0 auto; }
.thankyoupage .content-sect { width: 50%; }
.thankyoupage.fullmap { width: 100%; max-width: 3000px; height: 500px; margin: 0 auto -4px auto; }
.thankyoupage.fullmap iframe { width: 100%; max-width: 3000px; height: 500px; margin: 0 auto; }

/*--------FORM STYLES--------------------*/
.form-div { 
	display: flex; flex-direction: column; align-items: center; padding: 40px 0; overflow: hidden; background: #ddd; width: 100%; margin: 0 auto; }
.form-div h3 { font-weight: 700; margin: 10px 0; }
.form-div p { margin: 10px 0 20px 0; }
.form-div form { display: flex; flex-wrap: wrap; justify-content: center; width: 90%; max-width: 1000px; margin: 0 auto; }
.formrow { display: flex; justify-content: center; width: 100%; }
.formrow-lefty { display: flex; flex-direction: column; align-items: flex-start; width: 94%; }
.formrow-captcha { display: flex; flex-direction: column; align-items: center; width: 100%; margin: 0 5%; }
.form-div form label { 
	font-family: 'Rubik', sans-serif; font-size: 18px; font-weight: 500; color: #000; width: 100%; box-sizing: border-box; margin: 20px 0 6px 0; padding: 0 0 0 36px; }
.form-div form input[type="text"] { 
	width: 94%; margin: 4px 0; padding: 6px 8px; box-sizing: border-box; color: #000; font-family: 'Rubik', sans-serif; font-size: 16px; font-weight: 500; border: none; }
.form-div form input[type="email"] { 
	width: 94%; margin: 4px 0; padding: 6px 8px; box-sizing: border-box; color: #000; font-family: 'Rubik', sans-serif; font-size: 16px; font-weight: 500; border: none; }
.form-div form textarea { 
	width: 94%; height: 160px; margin: 4px 0; padding: 6px 8px; box-sizing: border-box; color: #000; font-family: 'Rubik', sans-serif; font-size: 16px; font-weight: 500; border: none; }
.form-div form a { margin: 20px 0 0 0; }
.form-div form .CaptchaMessagePanel { font-family: 'Rubik', sans-serif!important; }
.form-div form #CaptchaAnswer { 
	padding: 6px 8px; box-sizing: border-box; color: #000; font-family: 'Rubik', sans-serif; font-size: 16px; font-weight: 500; }
.form-div form div.CaptchaWhatsThisPanel a { font-family: 'Rubik', sans-serif!important; }
.form-div form .btnclass { border: none; }

/*-------- FOOTER STYLES ----------------*/
footer{}

.footer { 
	background: #000; width: 100%; padding: 40px 5%; box-sizing: border-box; display: flex; justify-content: center; align-items: center; }
.foot-logos { 
	background: #fff; display: flex; flex-direction: column; align-items: center; padding: 20px 12px 8px 12px; box-sizing: border-box; }
.foot-logos .shiloh img { width: 260px; margin: 0 0 12px 0; }
.foot-logos > div { display: flex; flex-direction: column; align-items: center; }
.foot-logos img { width: 170px; margin: 16px 0; }
.foot-nav { display: flex; justify-content: center; align-items: center; width: 33.333333%; }
.foot-nav > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.foot-nav a { 
	font-family: 'Rubik', sans-serif; font-size: 17px; color: #fff; line-height: 2; font-weight: 500; position: relative; z-index: 1; transition: .25s ease all; }
.foot-nav a:before { 
	position: absolute; z-index: -1; content: ""; top: 0; bottom: 0; left: -14px; right: calc(100% + 14px); background: #78c036; /* LIGHT GREEN */ transition: .25s ease all; }
.foot-nav a:hover { color: #000; transition: .25s ease all; }
.foot-nav a:hover:before { right: -16px; transition: .25s ease all; }
.foot-soc { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.foot-soc a.listed { color: #fff; margin: 20px 0; }
.foot-soc a.listed:before { background: #78c036; /* LIGHT GREEN */ }
.foot-soc a.listed:hover { color: #000; }
.foot-soc a.listed span.listed-sm { font-size: 16px; }

div.inv-foot-spacer { width: 100%; height: 80px; background: #000; }

/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

#inv button.faceted-search { color: #000!important; font-weight: 600; }
#inv button.faceted-show-all-btn { color: #000!important; font-weight: 600; }
#inv button.selected-facet { color: #000!important; font-weight: 600; }
#inv a.view-listing-details-link { color: #000!important; font-weight: 600; }
#inv a.collapsible-contact-list-item { color: #000!important; font-weight: 600; }
#inv button.faceted-search:hover { background: #000!important; color: #fff!important; }
#inv button.faceted-show-all-btn:hover { background: #000!important; color: #fff!important; }
#inv button.selected-facet:hover { background: #000!important; color: #fff!important; }
#inv a.view-listing-details-link:hover { background: #000!important; color: #fff!important; }
#inv a.collapsible-contact-list-item:hover { background: #000!important; color: #fff!important; }
#inv a.breadcrumbs__link { color: #000!important; }
#inv button.detail__search-results { color: #000!important; }
#inv h2.no-listings-found span { color: #000; }
#inv h1.list-title span { color: #000!important; }

/*---------- RESPONSIVE STYLES ----------*/

@media only screen and (max-width: 2000px) {
	.footer { justify-content: space-between; }
}

@media only screen and (min-width: 2000px) {
	.header-logo { justify-content: flex-end; padding: 0 120px 0 0; }
}

@media only screen and (min-width: 1400px) {
	.topheader > div { justify-content: flex-end; padding: 0; }
	.topheader a { margin: 0 36px; }
}

@media only screen and (min-width: 1201px) and (max-width: 1400px) {
	.inv-btns a div.inv-img { background-size: 212%; }
	.inv-btns a:hover div.inv-img { background-size: 245%; }
	.inv-btns a.deutz-fahr-inv div.inv-img { background-size: 212%; }
	.inv-btns a.deutz-fahr-inv:hover div.inv-img { background-size: 240%; }
}

@media only screen and (min-width: 1001px) and (max-width: 1200px) {
	.inv-btns a div.inv-img { background-size: 255%; }
	.inv-btns a:hover div.inv-img { background-size: 290%; }
	.inv-btns a.deutz-fahr-inv div.inv-img { background-size: 238%; }
	.inv-btns a.deutz-fahr-inv:hover div.inv-img { background-size: 272%; }
}

@media only screen and (max-width: 1200px) {
	.topheader > div { padding: 0 16px 0 32px; }
	.topheader > div a img { width: 124px; }
	.homepage.auction-sect .auctionimg { background-size: 150%; }
}

@media only screen and (max-width: 1150px) {
	.shop-by-cat .inv-btns a span.cta-big { font-size: 21px; }
}

@media only screen and (max-width: 1120px) {
	.header-logo a img { object-fit: contain; width: 100%; height: unset; padding: 8px 5px; }
	.nav-div { padding: 0 32px 0 48px; }
}

@media only screen and (max-width: 1000px) {
	h1 { font-size: 42px; }
	h3 { font-size: 23px; }
	.shiloh-header-wrap { height: 80px; }
	.header-logo { width: 340px; justify-content: center; padding: 0; }
	.header-logo a img { height: 84px; padding: 8px 5px 0px 5px; }
	.header-right { width: calc(100% - 230px); flex-direction: row; }
	.topheader { width: calc(100% - 80px); height: 100%; }
	.topheader > div { padding: 0 32px; }
	.topheader a.listed i { font-size: 20px; margin: 0; padding: 42px 16px; width: unset; }
	.topheader a.listed span { display: none; }
	.nav-div { width: 80px; height: 100%; padding: 0; }
	.hero { height: 600px; }
	.hero-overlay { padding: 0 5% 60px 5%; }
	.hero-overlay h3 { width: 300px; }
	.hero-shader { right: 0; clip-path: polygon(66.666666% 100%, 300px 0, 0 0, 0 100%); overflow: hidden; }
	.homepage.cats-mission { flex-direction: column; }
	.homepage.cats-mission > .content-sect { width: 100%; }
	.homepage.auction-sect .content-sect { width: 56%; }
	.homepage.auction-sect .auctionimg { background-size: 170%; }
	.shop-by-cat { width: 100%; }
	.shop-by-cat .inv-btns a span.cta-big { font-size: 24px; }
	.thankyoupage { flex-direction: column; }
	.thankyoupage .content-sect { width: 100%; }
	.thankyoupage.fullmap { height: 400px; }
}

@media only screen and (max-width: 900px) {
	.homepage.auction-sect { flex-direction: column; padding: 0; margin: 20px auto; }
	.homepage.auction-sect .content-sect { width: 100%; order: 2; }
	.homepage.auction-sect .auctionimg { width: 100%; order: 1; background-size: cover; }
	.contactpage .content-sect { width: 100%; }
	.contactpage .fullmap { width: 100%; height: 450px; min-height: unset; }
	.contactpage .fullmap iframe { width: 100%; height: 450px; min-height: unset; }
	.footer { flex-wrap: wrap; }
	.foot-logos { width: 100%; flex-direction: row; justify-content: space-between; margin: 0 0 20px 0; padding: 12px 10px 12px 8px; }
	.foot-logos a.shiloh img { margin: 12px 0 0 12px; }
	.foot-logos > div { flex-direction: row; justify-content: flex-end; }
	.foot-logos a:not(.shiloh) img { margin: -12px 20px; }
	.foot-nav { justify-content: flex-start; padding: 0 0 0 36px; box-sizing: border-box; width: unset; }
	.foot-soc { padding: 0 36px 0 0; box-sizing: border-box; }
}

@media only screen and (max-width: 850px) {
	.topheader > div { justify-content: flex-end; padding: 0 8px; }
	.topheader a { margin: 0 20px; }
	.topheader a img { display: none; }
	.foot-logos > div { flex-direction: column; }
	.foot-logos a:not(.shiloh) img { margin: 12px 24px; }
}

@media only screen and (max-width: 800px) {
	h1 { font-size: 38px; }
	h3 { font-size: 22px; }
	.hero-overlay h3 { width: 280px; }
	.thankyoupage.fullmap { height: 350px; }
}

@media only screen and (max-width: 750px) {
	.hero-shader { clip-path: polygon(100% 100%, 100% 0, 0 0, 0 100%); background: rgba(0, 0, 0, .3); }
}

@media only screen and (max-width: 700px) {
	.inv-btns a div.inv-img { background-size: 198%; }
	.inv-btns a:hover div.inv-img { background-size: 220%; }
	.inv-btns a.deutz-fahr-inv div.inv-img { background-size: 198%; }
	.inv-btns a.deutz-fahr-inv:hover div.inv-img { background-size: 225%; }
	.homepage.auction-sect .auctionimg { min-height: 320px; }
}

@media only screen and (max-width: 650px) {
	.btnclass { width: 100%; padding: 12px 0; }
	.inv-btns { height: unset; }
	.inv-btns a { width: 100%!important; height: 160px; }
	.inv-btns a div.inv-img { background-size: 100%; }
	.inv-btns a:hover div.inv-img { background-size: 120%; }
	.inv-btns a.deutz-fahr-inv div.inv-img { background-size: 110%; }
	.inv-btns a.deutz-fahr-inv:hover div.inv-img { background-size: 135%; }
	.inv-btns a.versatile-inv div.inv-img { background-size: 160%; background-position: 80% 45%; }
	.inv-btns a.versatile-inv:hover div.inv-img { background-size: 190%; }
	.hero { height: 500px; }
	.shop-by-cat-title { height: 90px; }
	.shop-by-cat-title h3 { font-size: 24px; line-height: 22px; }
	.foot-nav { padding: 0; justify-content: center; width: 100%; margin: 12px 0 20px 0; }
	.foot-nav > div { align-items: center; }
	.foot-soc { padding: 0; align-items: center; width: 100%; }
}

@media only screen and (max-width: 600px) {
	.topheader a { margin: 0 6px; }
	.homepage.auction-sect .auctionimg { min-height: 300px; }
	.footer { flex-direction: column; }
	.foot-logos { flex-direction: column; width: unset; }
	.foot-logos a.shiloh img { margin: 0 0 12px 0; }
}

@media only screen and (max-width: 450px) {
	h1 { font-size: 36px; }
	h2 { font-size: 30px; }
	h2 span.underline { font-size: 24px; }
	h3 { font-size: 20px; }
	.topheader a { display: none; }
	.hero-overlay h3 { width: 260px; }
	.btnclass { font-size: 16px; }
	.inv-btns a { height: 120px; }
	.inv-btns a span.cta-sm { font-size: 17px; }
	.inv-btns a span.cta-big { font-size: 22px; }
	.thankyoupage.fullmap { height: 300px; }
}

@media only screen and (max-width: 400px) {
	.header-logo { width: calc(100% - 80px); }
	.header-right { width: 80px; }
}

@media only screen and (max-width: 350px) {
	.shop-by-cat-title h3:before { background: #000; }
}






