/*
    Theme Name: Bobcat Theme 4
    Author: CJ Lupori
    Description: Bobcat Theme Option 4 of 5
    Version: 1.00
*/

/* start added styles */

/* update hero so dealer can update the image */
.hero{background: #000 url("../images/bg-hero.jpg") top center no-repeat; background-size: cover; width: 100%; padding-bottom: 50px; position: relative; }

.hero #heroimgID, .hero #heroimgID div.widgetContainer {
	position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; 
}
.highlightSidebars .hero #heroimgID {
	position: relative; z-index: 3; margin: 200px 0 0 0;
}
.hero .container { position: relative; z-index: 3; }

.hero .hero-text{max-width: 650px; /*padding: 400px 0 250px;*/ padding: 0!important; color: #fff;}
.hero .hero-text h1{margin-bottom: 25px; font-size: 72px; text-transform: uppercase; line-height: 1; text-shadow: 0px 4px 3px rgba(0,0,0,0.1), 0px 8px 13px rgba(0,0,0,0.05), 0px 18px 23px rgba(0,0,0,0.05);}
.hero .hero-text a{padding: 18px 35px;}

.hero .hero-search{background: #fff; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);}
.hero .hero-search form{display: flex; align-items: center; flex-wrap: wrap; height: 100%;}
.hero .hero-search .search-fields{display: flex; align-items: center; flex-wrap: wrap; width: calc(100% - 100px); padding: 50px;}
.hero .hero-search .search-fields input[type="text"], .hero .hero-search .search-fields select{display: block; flex: 1; height: 56px; margin: 2px; padding: 15px; border: 1px #ddd solid;}
.hero .hero-search .search-fields h3{flex: none; width: 100%;}
.hero .hero-search .search-fields .full{flex: none !important; width: calc(100% - 4px);}
.hero .hero-search .search-btn{display: flex; width: 100px; height: 100%; border-left: 1px #ddd solid;}
.hero .hero-search .search-btn button{display: block; width: 100%; background: none; text-align: center; color: #FF3600; border: none; outline: none; transition: all .2s ease-in-out;}
.hero .hero-search .search-btn button:hover{background: #f5f5f5;}

@media screen and (max-width: 1024px){
    .hero{padding-bottom: 0;}
	.hero .hero-text{padding: 0!important;}
    /*.hero .hero-text{padding: 250px 0 50px;}*/
    .hero .hero-text h1{font-size: 48px;}
    .hero .hero-search{position: relative; top: 35px;}
    .hero .hero-search form{display: block; height: auto;}
    .hero .hero-search .search-fields{width: 100%; padding: 25px;}
    .hero .hero-search .search-btn{width: 100%; height: auto; border-top: 1px #ddd solid; border-left: none;}
    .hero .hero-search .search-btn button{padding: 25px;}
}

/* Needed to match demo site: */

/* equipment category / brand slider (mobile)

Reason: cutting off bottom-half of slides
*/
#categoriesID .slick-slider { min-height: 445px!important; }
.post-container-products, #categoriesID .slick-list, 
.post-container-our-brands, #manufacturersID .slick-list { 
	overflow-y: visible!important; 
}
.categories .slick-list.draggable {
    height: auto !important;
}
#manufacturersID .slick-slider { min-height: 442.73px!important; }
.imageSlider, .slick-list { height: 100%; }

.row > * {
    padding-left: calc(var(--bs-gutter-x) * 0.0);
    padding-right: calc(var(--bs-gutter-x) * 0.0);
}
a {
    text-decoration: none;
}

/* equipment category / brand slider arrows 

Reason: not declared or were being overwritten 
*/
button.slick-arrow { width: 50%!important; }
button.slick-arrow:before, .categories .slick-prev:before, .categories .slick-next:before { 
	font-size: 24px!important; 
}
button.slick-arrow i:before { display: none!important; }

/* form labels 

Reason: wasn't accounting enough for the width of the asterisk 
*/
.contactForm .has-feedback .contactFormLabel { 
	margin-left: 30px!important; 
}

/* inventory page > top/bottom div.entry-meta

Reason: Do not want that visible
*/
.invpage .entry-meta, .invpage .entry-meta span, .invpage-page .entry-meta, .invpage-page .entry-meta span { 
	color: #fff!important; opacity: 0!important; 
}

/* inventory page > footer > mailing list & facebook buttons

Reason: hover state being overridden by /listings.css:9
*/
.footer .button:hover { background: #992100!important; }

/* Site-specific changes: */

/* /about-us/ page > listed Locations (CPT) 

Reasons: 
	- not responding to widget/breakpoint changes in the editor 
	- phone numbers wrapping 
*/
@media only screen and (min-width: 901px) {
	#aboutlocationsID .column-padding-locations.item, 
	#aboutlocationsID .column-padding-locations.item.col-lg-6.col-md-6.col-sm-12.col-xs-12 { 
		flex: unset!important;
		width: calc(50% - 10px)!important; 
		margin: 5px!important; 
	}
}
@media only screen and (max-width: 900px) {
	#aboutlocationsID .column-padding-locations.item, 
	#aboutlocationsID .column-padding-locations.item.col-lg-6.col-md-6.col-sm-12.col-xs-12 { 
		flex: unset!important;
		width: 100%!important; 
		margin: 5px 0!important; 
	}
}

/* Service Managers CPT */
.border-service-managers, .border-service-managers:hover { border: 1px solid #ddd!important; }
.single-service-manager {
	display: flex; flex-direction: column; align-items: flex-start; 
	padding: 16px 20px; box-sizing: border-box; 
}
.single-service-manager * { text-align: left; }
.single-service-manager p { margin: 16px 0 10px 0; }

/* Service Areas CPT */
.single-service-area { 
	display: flex; flex-wrap: wrap; align-items: stretch; border: 1px solid #ccc; margin-bottom: 60px; 
}
.single-service-area * { text-align: left; }
.single-service-area h2, .single-service-area h3 { 
	width: 100%; box-sizing: border-box; 
	text-align: left; border-bottom: 1px solid #ccc; 
}
.single-service-area h2 { padding: 24px max(min(30px, 3vw), 12px); }
.single-service-area h3 { padding: 30px 0 12px 0; }
.single-service-area .map-col, .single-service-area .info-col {
	display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; 
	padding: 0 max(min(30px, 3vw), 12px); box-sizing: border-box; 
}
.single-service-area .map-col { 
	width: min(40%, 550px); 
}
.single-service-area .info-col { 
	width: max(60%, calc(100% - 550px)); border-left: 1px solid #ccc; padding-bottom: 30px; 
}
.single-service-area img { 
	object-fit: contain; object-position: 0% 0%; 
	width: 100%; max-height: 550px; 
	padding: 30px 0; box-sizing: border-box; 
}
.single-service-area .info-div { 
	width: 100%; padding: 30px 0; box-sizing: border-box; text-align: left; 
}

@media only screen and (max-width: 1050px) {
	.single-service-area .map-col { width: 400px; }
	.single-service-area .info-col { width: calc(100% - 400px); }
}

@media only screen and (max-width: 800px) {
	.single-service-area .map-col, .single-service-area .info-col { width: 100%; }
	.single-service-area .info-col { border-left: none; border-top: 1px solid #ccc; }
	.single-service-area img { object-position: 50% 0%; }
}

/* other */
.search-content input[type="text"] { border-radius: 0!important; }