/* 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;}

@font-face {
    font-family: 'icon-worksregular';
    src:url(../fonts/icon-works-webfont.eot);
    src: url(../fonts/icon-works-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/icon-works-webfont.woff) format('woff'),
         url(../fonts/icon-works-webfont.ttf) format('truetype'),
         url(../fonts/icon-works-webfont.svg#icon-worksregular) format('svg');
    font-weight: normal;
    font-style: normal;

}

ol, ul{list-style: none;}
img{max-width: 100%; height: auto; image-rendering: -webkit-optimize-contrast;}
.center{text-align: center;}

/* TYPOGRAPHY */

::-moz-selection{background: #b81218; color: #fff; text-shadow: none} ::selection{background: #b81218; color: #fff; text-shadow: none}
h1, h2, h3, h4, h5, h6{text-transform: uppercase;}
h1{font-size: 24px; color: #b81218;}
h2{font-size: 22px; color: #555;}
h3{font-size: 20px; color: #333; line-height: 28px;}
h4{font-size: 18px; color: #b81218;}
p{font-size: 14px; line-height: 24px;}
a{color: inherit; text-decoration: underline; transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out}
a:hover{color: #b81218;}
a.button{display: inline-block; margin: 10px 0; background: #b81218; padding: 20px 50px; font-weight: 700; text-transform: uppercase; text-align: center; text-decoration: none; box-sizing: border-box; color: #fff;}
a.button:hover{background: #A7090E; color: #fff;}

/* FRAMEWORK */

html, body{font-family: 'Roboto Condensed', sans-serif !important; font-size: 14px; -webkit-text-size-adjust: none}
.main{padding: 50px 0;}
.grey-bg{background: #f5f5f5; padding: 25px; box-sizing: border-box;}
.container{max-width: 1200px; margin: 0 auto; padding: 0 20px;}
.column12, .column11, .column10, .column9, .column8, .column7, .column6, .column5, .column4, .column3, .column2, .column1{float: left; padding: 0 25px 0 0; box-sizing: border-box;}
.column12{width: 100%;} .column11{width: 91.6666%;} .column10{width: 83.3333%;} .column9{width: 75%;} .column8{width: 66.6666%;} .column7{width: 58.3333%;} .column6{width: 50%;} .column5{width: 41.6666%;} .column4{width: 33.3333%;} .column3{width: 25%;} .column2{width: 16.6666%;} .column1{width: 8.3333%;} 
.last{padding: 0;} .clear{clear: both;}
hr{border: 0; height: 1px; background: #aaa; background-image: linear-gradient(to right, #ccc, #aaa, #ccc); margin: 25px 0;}
.flexbox{display: flex;}
.flex{flex: 1;} .flex img{width: 100%; height: auto;}

.font-red {
    color:#b81218;
}


/*---POP-UP -----------------------------------*/

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.popup-box {
	width: 50%;
	margin: 0 auto;
	background: rgba(0,0,0,0.2);
	padding: 35px;
	border-radius: 20px/50px;
	background-clip: padding-box;
	text-align: center;
}
.popup .close {
    position: absolute;
    top: 10px;
    right: 15px;
	transition: all 0.2s;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	border: 1px solid #fff;
	padding:0 10px 5px 10px; 
	background: none
}
.popup .close:hover {
  background: #DC4C16; color: #fff;}
.popup .content {
  max-height: 60%;
  overflow: auto;
}

/*Let's make it appear when the page loads*/
.overlay:target:before {
    display: none;
}
.overlay:before {
	content:"";
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: block;
	background: rgba(0, 0, 0, 0.85);
	position: fixed;
	z-index: 99999;
}
.popup {
	background: url(/siteart/slides/orange-trailers.jpg) no-repeat center;
	background-blend-mode: overlay; background-color: rgba(0,0,0,.6) !important; background-size: cover;
	color:#fff;
	font-size: 16px;
	font-weight: 300;
	border:2px solid #fff;
	border-radius: 5px;
	width: 95%;
	max-width: 1200px;
	position: absolute;
	top: 3.5vw;
	left: 0;
	right: 0;
	float:none;
	padding: 7% 0;
	margin: 0 auto;
	text-align:center;
	z-index: 99999999;
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}
.overlay:target .popup {
    top: -280%;
    left: -100%;
}

.popup .wrapper-center{width:80%; text-align: center !important; margin: 0 auto}
.popup a, .popup h1{text-align: center !important; color: #fff; margin-bottom: 10px; line-height: 45px; font-weight: 600; letter-spacing: .5px; font-size: 40px;}

.popup #orange-btn{background: #DC4C16; color: #fff; padding: 12px 20px; text-align: center; font-weight: 700; text-decoration: none; font-size: 20px !important;}
.popup a#orange-btn:hover{text-decoration: none; background: #000; color: #fff}


.promo-banner {
	width:100%;
	display: flex;
	justify-content: center;
	gap:20px 40px;
	padding:20px 40px;
	box-sizing: border-box;
	background:#333;
	border-top:5px solid #b81218;
	border-bottom:5px solid #b81218;
}
.promo-banner h2 {
	font-size:50px;
	color:#fff;
	font-weight:700;
	padding-right:20px;
	border-right:2px solid #fff;
	display: flex;
	align-items: center;
}
.promo-banner a {
	padding:20px;
	background:#fff;
	box-sizing: border-box;
	width:100%;
	max-width:300px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	text-decoration: none;
}
.promo-banner a h3 {
	text-decoration: none;
	color:#b81218;
	text-align: center;
	font-size: 20px;
}
.promo-banner a img {
	max-width: 85px;
	width:100%;
	height: auto;
	margin:0 auto;
}
.promo-banner a:hover {
	background:#B4B4B4;
}
.promo-banner a:hover h3 {
	color:#fff;
}


/* HEADER */
#COVID{display: block; margin:0 auto 10px auto; background: #b81218; padding: 12px 0; width: 90%;  max-width: 300px; font-weight: 700; text-transform: uppercase; text-align: center; text-decoration: none; box-sizing: border-box; color: #fff;}
#COVID:hover{background: #A7090E; color: #fff;}

.header{background: #333 url(../siteart/header.jpg) top center fixed; display: block; width: 100%; border-bottom: 1px #ccc solid;padding:0px!important;}
.top-header{background: #b81218; font-weight: 700; text-align: center; color: #fff !important; padding: 5px 0; border-bottom: 1px #ccc solid;display: block!important;}
.top-header span a{color: #fff !important;} .top-header a:hover{color: #fff;}

.spacer{margin: 0 10px;}
.header #logo{float: left; width: 50%; padding: 15px 0; text-align: right;background:none!important;margin:0!important;height: auto!important;position: static;}
.header #logo img{display: inline-block;}
#dealer-logos{float: left; width: 50%; padding: 35px 25px 0; box-sizing: border-box;}
#dealer-logos img{padding: 12px 10px;display: inline-block;}
.header-container{z-index: 9999999999; top: -100px; transition: all .5s linear}
.stick{position: fixed; top: 0; width: 100%}
.stick .top-header{display: none!important;}
.stick #dealer-logos{display: none;}
.stick  #logo{display: none;}
.push{height: 226px;}

.top-header .container{max-width: 95%; margin: 0 auto; padding: 5px 0}

.top-header .left{display: inline-block; text-align:left; width: 50%; margin-top: 10px;font-size: 14px!important;}
.top-header .right{display: inline-block; width: 45%; float: right; font-size: 14px!important;text-align: right;}
.top-header a {
    color:#fff;
    text-decoration: underline;
}
.left .hide-mobile{display: inline-block;}

#map-icon{text-align: right; display: inline-block; float: left}
#map-icon img{display: inline-block; vertical-align: middle; max-width: 20px; background: #fff; padding: 5px; margin-right: 10px;}

/*--header search--*/
.header-search{display: inline-block; float: right}
.header-search form{display: inline-block;  vertical-align: middle;}

.header-search #search{
	display:inline-block; 
	zoom: 1; 
	vertical-align:middle; 
	width:60%; 
	color:#969696; 
	font-family: 'Roboto Condensed', sans-serif !important; 
	background: #fff; 
	height: 40px !important;
	padding:0 15px !important; 
	border: none;
	-moz-border-radius:0; 
	-webkit-border-radius:0; 
	border-radius:0; 
}

.header-search #submit{
	display:inline-block; 
	zoom: 1; 
	vertical-align:middle;
	border:none; 
	-moz-border-radius:0; 
	-webkit-border-radius:0;
	border-radius:0;
	width:50px;
	height: 40px !important;
	margin-left:2px; 
	background:#000!important; 
	padding:0 15px !important;; 
	font-family: 'icon-worksregular'; 
	color: #fff; 
	font-size: 15px; 
	font-weight: bold;
}
.header-search #submit:hover{background: #fff!important; color: #A7090E!important;}




/* SIDE TABS */	

.side {
    background: #fff;
    width: 300px;
    height: 500px;
    position: fixed;
    z-index: 100;
}


#commodity {
     top: 250px; 
    height: auto;
    z-index: 99999;
	right: -410px;
	width:410px;
}

#commodityTab {
    display: block;
	height: 45px;
	width: 50px; 
	background:url(../siteart/commodity-icon.png);
    position: absolute;
    left: -50px;
    top: 0px;
}

#weather {
     top: 290px; 
    height: auto;
    z-index: 998;
	right: -300px;
	width:300px
}

#weatherTab {
    display: block;
	height: 45px;
	width: 50px; 
	background:url(../siteart/weather-icon.png);
    position: absolute;
    left: -50px;
    top: 0px;
}

#facebook {
     top: 340px; 
    height: auto;
    z-index: 998;
	right: -340px;
	width:340px
}

#facebookTab {
    display: block;
	height: 45px;
	width: 50px; 
	background:url(../siteart/facebook.jpg);
    position: absolute;
    left: -50px;
    top: 0px;
}

/*===================== 
	nav styles 
=======================*/

.nav-cont-1 {
    background: #b81218;
    border-top: 1px #ccc solid;
    width:100%;
}

#menu-button{display: none;}
nav.mobile, .mobile-nav-cont-1 { display:none;} /* New class to help control screen width visability */

nav.primary {
	padding:0;
	display:block;
	position:relative;
    width: 100%;
	}
	nav.primary ul {
        width:100%;
		margin:0 auto; 
		padding:0;
        display: flex;
        justify-content: center;
		}
		nav.primary ul li {
			margin:0;
			list-style-type:none; 
			}
			nav.primary ul li a {
                display: flex;
                align-items: center;
                font-size: 14px;
                font-weight: 700;
                text-decoration: none;
                text-transform: uppercase;
                color: #fff;
                padding: 18px;
                box-sizing: border-box;
                font-family: 'Roboto Condensed', sans-serif !important;
				margin: 0;
				text-align: center;
				-webkit-transition: .1s ease-in;
				-moz-transition: .1s ease-in;
				-o-transition: .1s ease-in;
				transition: .1s ease-in;
				}	
            nav.primary ul li a i {
                margin-left: 4px;
                font-size: 8px;
            }
            nav.primary ul li:hover > a {
				background: #9B0909;
				}
			nav.primary ul li a:hover {
				background: #9B0909;
				}
			/* Appearance of the sub-level links */
			nav.primary ul li li a { 
				font-size:12px;
				padding:15px 20px;
				color:#fff;
				background: #333;
				display: flex;
				text-align:left;
                justify-content: space-between;
                align-items: center;
				border: #fff solid 1px;
                border-bottom: #fff solid 0px;
			}
            nav.primary ul li li:last-of-type a { 
                border-bottom: #fff solid 1px;
            }
			/* Appearance of the sub-level links on hover */
            nav.primary ul li li:hover > a { 
                background: #555;
			}
			nav.primary ul li li a:hover { 
                background: #555;
			}
/* This controls the Primary nav dropdowns for sublinks. Should not have to edit this too muuch */
nav.primary ul ul {
    display: none;
    position: absolute; 
}
nav.primary ul ul ul {
    position: absolute; 
    left: 100%;
    top:0; 
}
nav.primary ul li:hover > ul {  
    display: block;
    line-height:18px; 
    z-index: 500;
}
nav.primary ul ul li {
	display: block;
    float: none; 
	width: 250px;
    position: relative;
    margin:0;
}


/* SLIDESHOW */

.cycle-slideshow {width: 100%; line-height: 0; z-index: 10; position: relative;height: auto; background-color:#000;}
.cycle-slideshow img{width: 100%; z-index: 5 !important; position: relative;height: auto;}
.cycle-slideshow .cycle-pager {text-align: center; width: 100%; z-index: 25 !important; position: absolute; bottom: 10px; overflow: hidden;}
.cycle-slideshow .cycle-pager span {margin: 0; padding: 0; font-family: arial; font-size: 30px; line-height: 30px; width: 16px; height: 16px; display: inline-block; color: #fff; cursor: pointer;text-shadow:0 0 5px rgba(0,0,0,0.2);}
.cycle-slideshow .cycle-pager span.cycle-pager-active {color: #E15358;}
.cycle-slideshow .cycle-pager > * {cursor: pointer;}
.slide {width: 100%; z-index: 5 !important;}
.slide img {width: 100%; z-index: 5 !important; background-color:#000;}
.slide .slide-link{position: absolute; width: 100%; max-width: 500px; background: rgba(0, 0, 0, 0.7); padding: 25px; box-sizing: border-box; color: #fff; bottom: 30px; z-index: 30; line-height: normal;}
.slide .slide-link .link-text h2{text-transform: uppercase; margin: 0 0 10px; color: #fff;}
.slide .button-link a{display: block; margin: 10px 0; background: #b81218; padding: 15px; font-weight: 700; text-transform: uppercase; text-align: center; text-decoration: none; box-sizing: border-box; color: #fff; max-width: 250px;}
.slide .button-link a:hover{background: #A7090E; color: #fff;}


.slide .gradient{position:absolute; width:100%; z-index:200; bottom:0; top:0; background:linear-gradient(to right, rgba(0,0,0,.7), transparent); height:100%;}
.slide .promo-text{position:absolute; left:12%; z-index:250; top:20%;}
.promo-text h2{font-size:65px; max-width:1400px; line-height:60px!important; color:#fff; text-shadow:2px 2px 2px rgba(0,0,0,.8); font-weight:800; padding-bottom:10px;}
.promo-text p{font-size:30px; font-weight:400; color:#fff; padding-top:20px; }
.promo-text a{background:#d73d09; transition:.3s ease; font-size:26px; text-decoration:none; display:block; height:55px; text-align:center; font-weight:400; text-transform:uppercase; color:#fff; padding:15px; box-sizing:border-box; width:260px; margin-top:80px;}
.promo-text a p{padding-top:2px;}
.promo-text a:hover{background:#B53307;}
/* HOME */

.icon-bar{background: #333; color: #fff; border-top: 1px #fff solid; border-bottom: 1px #fff solid; font-size: 0;}
.icon-bar ul li{display: inline-block; width: 24%; position: relative; text-align: center; box-sizing: border-box;}
.icon-bar ul li img{position: relative; top: 10px; right: 10px;}
.icon-bar ul li a{display: block; font-weight: 700; font-size: 18px; text-decoration: none; text-transform: uppercase;  padding: 8px 0 25px; box-sizing: border-box;}
.icon-bar ul li a:hover{background: #555; color: #fff;}

.error{font-size: 32px; font-weight: 700; text-align: center; color: #777; margin: 0 0 25px;}
.error a{display: block; max-width: 450px; background: #b81218 url(../siteart/tool.png) right no-repeat; padding: 20px 25px; margin: 10px auto; font-size: 18px; font-weight: 700; text-align: left; text-transform: uppercase; text-decoration: none; color: #fff; border-radius: 5px;}
.error a:hover{background: #A7090E url(../siteart/tool.png) right no-repeat; padding: 20px 30px;}

.home-quicklinks{margin-bottom: 20px;}
.home-quicklinks a{width: 100%; display: inline-block; background: #b81218; padding: 20px 0; font-size: 20px;  font-weight: 700; text-transform: uppercase; text-align: center; text-decoration: none; box-sizing: border-box; color: #fff;}
.home-quicklinks a#black{background: #000;}
.home-quicklinks a:hover, .home-quicklinks a#black:hover{background: #A7090E; color: #fff;} 


.orange-border{background:#DC4405 ; color: #fff !important; text-align: center; width: 100%; padding: 10px 0}
.orange-border h3{color: #fff !important;}
.orange-border:hover{background: #000}

.brands{padding: 35px 0; text-align: center;}
.brands img{padding: 0 10px;}


/* kubota cards */
.card-slider-section {
    padding: 40px 20px 50px;
    overflow: visible;
}

.section-heading {
    text-align: center;
    margin-bottom: 20px;
	color: #f3662f;
	font-size: 40px;
}

.card-slider-wrapper {
    overflow-x: hidden;
    padding-bottom: 10px;
}

.card-track {
    display: flex;
    gap: 20px;
    transition: transform 0.4s ease;
    will-change: transform;
}

.card {
    flex: 0 0 calc(25% - 15px);
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.card-image {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.card-body {
    padding: 16px;
}

.card-heading {
    font-size: 20px!important;
    font-weight: 700;
    margin: 0 0 6px 0;
    color: #222;
	margin-bottom: 0px!important;
}

.card-subheading{
    font-size: 15px!important;
    font-weight: 400;
    color: #666;
    margin: 0 0 16px 0;
}

.card-btn {
    display: inline-block;
    border: 1px solid #f3662f;
    color: #C54715;
    padding: 9px 22px;
    border-radius: 27px;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
    transition: background 0.2s ease;
	margin-top: 10px;
}

.card-btn:hover {
    background: #f3662f;
    text-decoration: none;
    color: #fff;
}

.slider-controls {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
}

.slider-btn {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 50%;
    width: 42px;
    height: 42px;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.07);
    transition: background 0.2s ease, box-shadow 0.2s ease;
    color: #333;
}

.slider-btn:hover {
    background: #e87722;
    color: #fff;
    border-color: #e87722;
}
.card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-expiry {
    font-size: 11px;
    color: #999;
}

.logo-finance {display:flex; justify-content: center; flex-direction: column; align-items: center;}

/* Responsive */
@media (max-width: 1024px) {
    .card {
        flex: 0 0 calc(33.333% - 14px);
    }
}

@media (max-width: 768px) {
    .card {
        flex: 0 0 calc(50% - 10px);
    }
}

@media (max-width: 480px) {
    .card {
        flex: 0 0 100%;
    }
}

/* ZOOM */

.zoom-container{float: left; width: 25%; position: relative; overflow: hidden; display: inline-block; border: 1px solid #fff; box-sizing: border-box; text-align: center; margin: 10px 0;}
.zoom-container img{display: block; width: 100%}
.zoom-container .zoom-caption{position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 15px; box-sizing: border-box; z-index: 10; background: rgba(0,0,0,.6); text-transform: uppercase; transition: all .5s ease}
.zoom-container .zoom-caption h4{font-size: 20px; font-weight: 700; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.zoom-container .zoom-caption img{display: inline; position: relative; top: 3px; left: 6px}
.zoom-container:hover .zoom-caption{background: 0 0}

/* INVENTORY */

.advanced-search{position: fixed; bottom: 0; left: 35px; background: #b81218; padding: 15px 35px; box-sizing: border-box; font-weight: 700; text-transform: uppercase; text-align: center; color: #fff; cursor: pointer; box-shadow: 0 0 10px 0 rgba(0,0,0,.25); z-index: 9999}
.advanced-search:hover{background: #9E121E;}
.show-search{display: none; width: 100%; background: #b81218; font-size: 16px; font-weight: 700; text-align: center; color: #fff; padding: 15px; box-sizing: border-box; cursor: pointer;}
.show-search:hover{background: #9B0909;}
.search{background: #f5f5f5; padding: 15px; box-sizing: border-box; border: 1px #ccc solid; font-size: 12px; font-weight: 700;}
.search .column6{padding: 0 10px 0 0;} .search .last{padding: 0;}
.search h3{font-weight: 400; color: #555;}
.search input, .search select{width: 100%; padding: 6px 10px; font-size: 12px; background: #fff; color: #555; margin: 5px 0 10px; box-sizing: border-box; border: 1px #ccc solid;}
.search input[type=submit]{font-family: 'Roboto Condensed', sans-serif; font-size: 12px; font-weight: 700; text-transform: uppercase; color: #fff; display: block; background: #b81218; width: 100%; transition: all .2s ease-in-out; cursor: pointer; position: relative; padding: 10px 8px; border: 1px solid #ccc;}
.search input[type=submit]:hover{background: #9B0909}
.search a.button{display: block}

#inv .column3{padding-right: 0;}
.inv-request{border: 1px solid #ccc; font-family: 'Roboto Condensed', sans-serif; float: right; width: 90%;}
.inv-request h3{background: #b81218; color: #fff; text-align: left; padding: 10px 0 10px 10px; font-family: 'Roboto Condensed', sans-serif; }
.inv-request .fa{margin-right: 20px;}

.request-button{padding: 20px 0 20px 10px; border-top: 1px solid #ccc; font-size: 17px; text-decoration: none; display: block;}
.request-button:hover{background: #f5f5f5}

.mobile-inv-request{display: none; border: 1px solid #ccc; font-family: 'Roboto Condensed', sans-serif; float: none; width: 90%; margin: 0 auto;}
.mobile-inv-request h3{background: #b81218; color: #fff; text-align: left; padding: 10px 0 10px 10px; font-family: 'Roboto Condensed', sans-serif; }
.mobile-inv-request .fa{margin-right: 20px;}
.mobile-inv-request .request-button{padding: 10px 0 10px 10px; border-top: 1px solid #ccc; font-size: 15px; text-decoration: none; display: block;}
.mobile-inv-request .request-button:hover{background: #f5f5f5}


.inv-cont-1 {
    display: flex;
    justify-content: center;
    gap:40px;
}
.inv-cont-left {
    padding:0px 20px;
}
.inv-cont-right {
    width:100%;
    max-width:270px;
    padding:0px 20px;
    box-sizing: border-box;
}

/* VIDEO */

.video-cont-1 {
    width:100%;
    background:#333;
    padding:20px 10px;
    box-sizing: border-box;
}
.video-cont-1 video {
    display: block;
    width:100%;
    max-width: 600px;
    height: auto;
    margin:0 auto;
    
}

/* PARTS */

.parts{text-align: center;}
.parts .column6 img{display: block; max-height: 80px; margin: 10px auto;}
.parts .column6 a{font-weight: 700; text-decoration: none}
.parts iframe{border: 1px #ccc solid;}
.staff-row{display: flex;}
.staff{flex: 1; border: 1px #ccc solid; margin: 5px; padding: 10px; box-sizing: border-box; font-size: 15px; text-align: center; line-height: 22px;}

/* FINANCING */
#financing img{border: 1px solid #ccc; text-align: center; width: 100%;}
#financing .button{width: 100%; padding: 15px 0px;}

.finance-options-container{
	display: flex;
	flex-direction: column;
}

.finance-options-row{
	display: flex;
	flex-direction: row;
}

/* kubota specials */
.image-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 20px;
}

.image-grid img {
    width: 100%;
    height: auto;
    display: block;
}

/* Mobile: stack 1×4 */
@media (max-width: 768px) {
    .image-grid {
        grid-template-columns: 1fr;
    }
}

/*  COLLAPSIBLE ON SERVICE PAGE */

button.collap {
	border: none;
	cursor: pointer;
	width: 100%;
	outline: none;
	padding: 15px;
	text-align: left;
	align-items: center;
	gap: 10px;
	background-color: #b81218;
	font-family: 'Roboto Condensed', sans-serif !important;
}

button.collap:hover {
	background: #A7090E;
	color: #000;
}

button.collap .whitetext {
	width: 100%;
	color: #fff;
}

.service-collapse img {
	padding: 15px;
	display: block;
	margin: 0 auto;
	max-width: 100%;
}

.flex {
	display: flex;
}

.flex.all-qrs {
	align-items: center;
	gap: 20px 40px;
	flex-wrap: wrap;
}

.flex.qrs {
	text-align: center;
	gap: 20px 40px;
	flex-wrap: wrap;
}

.flex.qrs img {
	max-width: 200px;
}

.flex.qrs a {text-decoration: none;}

.qr-container {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.2s ease-out;
	border: 1px solid #ccc;
	border-top: none;
}

.collap::before {
    content: '+';
    color: #fff;
	width: 30px;
	height: 30px;
    float: right;
    margin-left: 5px;
	font-size: 24px;
	font-family: "Montseratt", sans-serif;
	font-weight: 700;
	line-height: 0.9;
	display: flex;
	justify-content: center;
	align-items: center;
	-webkit-transition:.4s ease-in;  
	-moz-transition:.2s ease-in;  
	-o-transition:.2s ease-in;  
	transition:.2s ease-in;
}

.collap.active::before {
  content: "-"; /* Unicode character for "minus" sign (-) */
}

.collap:hover::before {
	color: #eee;
}






/*-- promotions --*/

.column6#promo{margin: 10px 0;}
#promo img{border: 1px solid #ccc; text-align: center; width: 100%;}
#promo .button{width: 100%; padding: 15px 0px;}

/* FORM */

#form{background: #fafafa; padding: 25px; box-sizing: border-box; border: 1px #ccc solid;}
#form input, #form select, #form textarea{width: 100%; padding: 10px 5px; border: 1px solid #ccc; margin: 5px 0 15px; box-sizing: border-box;}
#form textarea{height: 80px;}
#form label{cursor: pointer;}
#form input.button, #form input.button:focus{padding: 10px 0; max-width: 250px; background: #b81218; font-family: 'Roboto Condensed', sans-serif; font-size: 14px; font-weight: 700; text-transform: uppercase; color: #fff; cursor: pointer;}
#form input.button:hover{background: #A00A0F;}
.CaptchaPanel{margin: 0 0 0 0 !important; padding: 0 0 0 0 !important; text-align: left !important; line-height: normal !important;}
.CaptchaAnswerPanel input{width: 200px !important;}
.CaptchaImagePanel{margin: 0 0 0 0; padding: 0 0 0 0;}
.CaptchaMessagePanel{padding: 0 0 0 0 !important; margin: 0 0 0 0 !important; font-weight: normal !important; font-size: 12px; line-height: 14px;}
.CaptchaAnswerPanel{margin: 0 0 0 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel{line-height: 0; margin: 0 0 0 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a{color: #000;}
.CaptchaWhatsThisPanel a:hover{text-decoration: none;} 

/* FOOTER */

.scrolling-wrap{width: 100%; height: 90px; overflow: hidden;}
.scrolling{width: 100%; height: 92px;}


.NEscrollToTop{display: none; position: fixed; bottom: 25px; right: 25px; background: #b81218; padding: 12px 15px; font-size: 18px; color: #fff; border-radius: 3px; z-index: 99999; box-shadow: 0 0 10px 0 rgba(0,0,0,.2); cursor: pointer;}
.NEscrollToTop:hover{background: #9E121E; color: #fff;}

.footer{background: #333; color: #ccc; line-height: 26px;}
.footer strong{display: block; font-size: 16px; color: #fff; margin-bottom: 10px;}
.footer a{display: block; font-weight: 700; text-decoration: none; color: #ccc !important;}
.footer .column3 a{color: #ccc !important;} .footer a:hover{color: #fff;}
.top-footer{padding: 50px 0;}
.bottom-footer{border-top: 1px #777 solid; padding: 10px 0; font-weight: 700; color: #777}
.host{float: left;} .copyright{float: right;}

/* RESPONSIVE */

.show{display: block;}
@media screen and (max-width: 1550px){
.slide .promo-text{left:6%!important; top:5%;}
.promo-text h2{font-size:50px; padding-right:100px; box-sizing:border-box;}
.promo-text p{font-size:25px; padding-top:15px;}
.promo-text a{ font-size:20px; padding:10px;  height:50px;width:240px; margin-top:80px;}
.promo-text a p{padding-top:0px;}

}

@media screen and (max-width: 1350px){
.promo-text h2{font-size:45px; line-height:45px!important;}
.promo-text p{font-size:25px; padding-top:5px;}
.promo-text a{margin-top:60px;}
.promo-text a p{padding-top:0px;}

}
@media screen and (max-width: 1120px) {	
	.promo-banner {
		flex-wrap: wrap;
	}
	.promo-banner h2 {
		width:100%;
		box-sizing: border-box;
	  padding-right: 0px;
	  border-right: 0px solid #fff;
	  padding-bottom: 20px;
	  border-bottom: 2px solid #fff;
		justify-content: center;
		text-align: center;
	}
}
@media screen and (max-width: 1120px){
    
    nav.primary ul li a {
        padding: 18px 10px; font-size: 13px;
    }
    
	#inv .column9{width: 90%; margin: 0 auto; float: none; display: block;}
	#inv .column3{display: none;}
    .inv-cont-1 {
         margin-top: 20px;   
    }
    .inv-cont-right {
        display: none;
    }
	.mobile-inv-request{display: block;}
	.slide .promo-text{left:2%;}
.promo-text h2{font-size:35px; line-height:35px!important; padding-bottom:5px;}
.promo-text p{font-size:20px; padding-top:0px;}
.promo-text a{ font-size:18px;  height:45px;width:220px; margin-top:30px;}
.promo-text a p{padding-bottom:3px;}
}

@media screen and (max-width: 1024px){
    .main{padding: 30px 0;}
    .header-container{position: relative; top: 0; z-index: 99999;}
    .header{border-bottom: none;}
    .push{height: 112px;}
    .stick .header{display: block;}
    .stick{position: relative;}
    .show-search{display: block;}
    .inventory-container .column3, .inventory-container .column9{float: none; width: 100%; padding: 0; margin: 15px 0;}
    .inventory-container .column3{display: none;}
    .link-text p{display: none;}
    .icon-bar ul li{width: 50%; border: 1px #999 solid;}
	.cycle-slideshow{height:250px!important;}
	.slide {height:100%;}
	.slide img{height:100%; object-fit:cover;}
	
}
@media screen and (max-width: 985px)  {
    
	/*==============================
		Mobile Nav Styles			
	================================*/	
	nav.primary{display:none;}
    .mobile-nav-cont-1 { display:block;} /* New class to help control screen width visability */
    
	#menu-button { 
		width: 100%;
        padding:20px;
		display: block;
		position: relative;
        box-sizing: border-box;
		z-index: 400; /* needs to be lower than nav.mobile, adjust as needed */
	}
	
    .menu-toggle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-decoration: none;
    }
    .menu-toggle span {
        font-size: 12px;
        font-weight: 700;
        color:#fff;
        font-family: 'Roboto Condensed', sans-serif !important;
    }
    
     .menu-hamburger {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width:18px;
        height: 16px;
        position: relative;
    }
    .menu-hamburger-bar-1 {
       display: block;
       background:#fff;
        height: 2px;
        width:100%;
        transition: .2s ease-in;
    }
    .menu-hamburger-bar-2 {
       display: block;
       background:#fff;
        height: 2px;
        width:100%;
        transition: .2s ease-in;
    }
    .menu-hamburger-bar-3 {
       display: block;
       background:#fff;
        height: 2px;
        width:100%;
        transition: .2s ease-in;
    }

    .clickopen .menu-hamburger-bar-2 {
        display: none;
    }
    .clickopen .menu-hamburger-bar-1 {
        position: absolute;
        top:10px;
        transform: rotate(45deg);
        width:25px;
    }
    .clickopen .menu-hamburger-bar-3 {
        position: absolute;
        top:10px;
        transform: rotate(-45deg);
        width:25px;
    }
    
	nav.mobile { /* this section is new updated position width and positioning*/
		display:none;
		position: absolute;
		left: 0px;
		width: 100%;
		height: auto;
		background: #b81218;
		z-index: 500; 
		overflow:auto;
	}

	/* MENU LIST STYLE */
	nav.mobile ul {
		list-style: none;
		font-weight: 300;
		margin:0;
		padding:0;
	}
	nav.mobile ul li {
		border-bottom: 1px solid #fff;
		position:relative;
	}
    nav.mobile ul li:first-child {
		border-top: 1px solid #fff;
	}

	/* FIRST LEVEL */
	nav.mobile ul li a {
        font-weight: 700;
        font-size: 12px;
        padding: 20px;
        width: 100%;
        font-family: 'Roboto Condensed', sans-serif !important;
		position: relative;
		display: block;
		color: #fff!important;
		text-decoration: none;
        text-align: left;
	}
    nav.mobile ul li a:hover {
        color: #fff!important;
    }
    nav.mobile ul li a.click:after {
        content:"";
        position: absolute;
        right:20px;
        transition: .2s ease-in;
        background: #fff;
        height: 12px;
        width: 2px;
        z-index: 1;
    }
    nav.mobile ul li a.click:before {
        content: "";
        position: absolute;
        right: 15px;
        transition: .2s ease-in;
        background: #fff;
        height: 2px;
        width: 12px;
        z-index: 1;
        top: 25px;
    }
    nav.mobile ul li a.click.clickopen:after {
        transform: rotate(90deg);
    }
	

	/* SECOND LEVEL */
	nav.mobile ul li li:last-child {border:none;}
	nav.mobile ul li li a {
		background:#333;
	}
	nav.mobile ul li li a:hover {background:rgba(65,65,65,0.5);}

	/* THIRD LEVEL */
	nav.mobile ul li li li:last-child {border:none;}
	nav.mobile ul li li li a {
		padding: 20px 40px;
        background: #555;
	}
	nav.mobile ul li li li a:hover {background:rgba(85,85,85,0.5);}

    
  
    
}
@media screen and (max-width: 768px){
    .cycle-pager{display: none;}
    .slide .slide-link{position: relative; background: #333; max-width: 100%; bottom: 0; border-bottom: 1px #ccc solid; padding: 15px 25px; clear: both;}
    .slide .link-text{float: left; width: calc(100% - 120px); padding-right: 15px; box-sizing: border-box;}
    .slide .slide-link .link-text h2{font-size: 16px; text-transform: uppercase; margin: 8px 0; color: #fff;}
    .slide .button-link a{float: left; width: 120px; margin: 0; padding: 10px;}
    .icon-bar{background: none; padding: 10px 0;}
    .icon-bar ul li a{background: #333;}
    .staff-row{display: block;}
    .staff{flex: none; float: left; width: calc(50% - 10px);}
    .flexbox{display: block;}
    .flex{flex: none; width: 100%;}
	
	.covid-overlay .covid-popup {width: 90%;}
	
	.top-header .left{display: block; float: none; text-align: center; width: 100%; margin-top: 0;}
	.top-header .right{display: block; float: none; text-align: center; width: 100%; margin-top: 20px;}
	.promo-text h2{font-size:25px; padding-right:50px!important; line-height:25px!important; max-width:calc(100% 0 100px); padding-bottom:15px;}
	.promo-text p{font-size:16px;}
	.promo-text a{width:130px; font-size:16px; padding:10px; height:45px;}
	
}
@media screen and (max-width: 580px){
	.promo-banner h2 {
		font-size: 30px;
	}
    .hide-mobile{display: none!important;}
    input, select{-webkit-appearance: none;}
    .column6, .column3{width: 100%; padding: 0; margin: 10px 0;}
    .search .column6{width: 50%; padding: 0 10px 0 0; margin: 0;} .search .last{padding: 0;}
    .button{display: block; width: 100%;}
    .top-header{font-size: 12px;}
    .spacer{margin: 0 5px;}
    .error{font-size: 24px; margin: 0 0 25px;}
    .error a{background: #b81218; text-align: center}
	
	.header{text-align: center; margin: 0 auto;}
    #logo{float: none; width: auto; vertical-align: middle; display: inline-block; padding: 10px; text-align: left; box-sizing: border-box;} #logo img{width: 100%; max-width: 150px;}
 	#dealer-logos{float: none; padding: 0; width: auto; vertical-align: middle; display: inline-block;} #dealer-logos img{display: inline-block; max-height: 70px;}
	
    .icon-bar ul li, .zoom-container{width: 100%;}
    .zoom-container img{margin: 0 auto;}
    .NEscrollToTop{display: none;}
    .advanced-search{width: 100%; left: 0;}
    .top-footer{padding: 20px 0; text-align: center;}
    .host, .copyright{float: none; width: 100%; text-align: center; margin: 5px 0;}
	
	.finance-options-row{
		flex-direction: column;
	}
		
}