/******************************************************************
Theme Name: Mediaworks
Description: This theme was built by Mediaworks
Author: Mediaworks
Author URI: http://www.mediaworks.co.uk/
Version: 1.0
******************************************************************/

/*
WordPress
So Theme Check (http://wordpress.org/plugins/theme-check/)
needs these classes in the CSS even though they are in the 
REAL stylesheet in library/scss/style.css.
*/

.sticky {}          /* DO NOT EDIT THIS */
.gallery-caption {} /* THESE ARE NEEDED */
.bypostauthor {}    /* TO KEEP THEME CHECK HAPPY */

.m__textBlock a.button{color:#ffffff;text-decoration:none;}
#product-listing + .m__textBlock{text-align:center;}

/**Motor Listings Build (Toast)**/
.m__productTable__wrapper{overflow:visible;}
.m__productTable{padding:3rem !important;}
.m__productTable h2{margin-bottom:1rem !important;}
.product-listings{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:30px;}
.product-listings .product-listing{padding:2rem 2rem calc(140px);box-shadow:0 0 12px rgba(0,0,0,0.2);position:relative;}
.product-listings .product-listing h3{font-size:1.5rem;margin-bottom:1rem;color:#1e9a39;}
.product-listings .product-listing .product-metas{margin-bottom:2rem;font-size:2.5rem;}
.product-listings .product-listing .product-metas .product-meta{display:inline-block;color:#1e9a39;padding-right:1rem;line-height:1;vertical-align:middle;}
.product-listings .product-listing .product-metas .product-meta strong{color:#000000;}
.product-listings .product-listing .product-image{width:100%;max-width:225px;margin:0 auto;position: relative;}
.product-listings .product-listing .product-image img{max-width:100%;width:100%;position: relative;}
.product-listings .product-listing .product-image .reflection{position:absolute;top:0;left:0;width:100%;transform:translateY(55%) rotatex(180deg);opacity:0.1;mix-blend-mode:multiply;}
.product-listings .product-listing .product-image .reflection:after{content:'';width:100%;height:100%;background:linear-gradient(white, white 35%, transparent, transparent, transparent);position:absolute;top:0;left:0;}
.product-listings .product-listing .product-price{font-size:2.5rem;font-weight:bold;display:inline-block;color:#1e9a39}
.product-listings .product-listing .product-stock{display:inline-block;color:#1e9a39;padding-left:2rem;}
.product-listings .product-listing .product-bottom{position:absolute;bottom:0;left:0;width:100%;padding:2rem;}
.product-listings .product-listing .product-buttons{grid-template-columns:1fr 1fr 1fr;display:grid;grid-gap:20px;margin-top:2rem;}
.product-listings .product-listing .product-buttons .button{padding:1rem;width:auto;min-width:0px;color:#ffffff;text-decoration:none;background:#000000;border-color:#000000;border-radius:10px;background:#1e9a39;border-color:#1e9a39;font-weight:bold;}
.product-listings .product-listing .product-buttons .button.product-order{background:#ffffff;border-color:#1e9a39;color:#1e9a39}
.product-listings .product-listing .product-buttons .button.product-order:after{content:'';width:15px;height:15px;background-image:url('/wp-content/themes/mw-quantum-controls/assets/src/images/icons/arrow.svg');display:inline-block;vertical-align:middle;margin-left:1rem;background-size:cover;background-position:center;margin-top:-.2rem;}

.product-listings .no-results-notice{display:none;grid-column:span 3;}
.product-listings .no-results-notice.active{display:block;}
.product-listings .no-results-notice .no-results-notice-content{padding:3rem;background:#efefef;max-width:768px;text-align:center;margin:0 auto;}
.product-listings .no-results-notice .no-results-notice-content .button{color:#ffffff;text-decoration:none;}

.m__Tablefilters{background:#1e9a39 !important;color:#ffffff !important;}
.m__Tablefilters h3{color:inherit !important;}
.m__Tablefilters .btn{background:#000000 !important;}

/**Three Columns Banner**/
.three-columns-banner{padding:3rem 0;background:#2c2c32;color:#ffffff;}
.three-columns-banner h1{text-align:center;font-weight:bold;margin-bottom:2.5rem;font-size:4.5rem;line-height:1;letter-spacing:1.5px;}
.three-columns-banner .three-columns-banner-grid{grid-template-columns:1fr 1fr 1fr;display:grid;grid-gap:30px;}
.three-columns-banner .three-columns-banner-grid .toast-col{display:grid;grid-template-columns:80px 1fr;grid-gap:18px;font-size:1.75rem;}
.three-columns-banner .three-columns-banner-grid .toast-col .icon{background:#ffffff;border-radius:100px;width:100%;padding-top:100%;position: relative;}
.three-columns-banner .three-columns-banner-grid .toast-col .icon img{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:40%;}
.three-columns-banner .three-columns-banner-grid a:hover{color:inherit !important;text-decoration:none !important;opacity:1 !important;}

/**Product Info Banner**/
.m__productInfoBanner .m__productDetails{padding:3rem 0;}
.m__productInfoBanner .m__productDetails h2, .m__productInfoBanner .m__productDetails__usefulLinks h4{margin-bottom:1rem;}
.m__productInfoBanner .m__productDetails__usefulLinks ul{margin:0;}

@media(max-width:1024px){
   .product-listings{grid-template-columns:1fr 1fr;grid-gap:10px;}
}

@media(max-width:768px){
   .product-listings .product-listing .product-metas .product-meta{display:block;padding:.25rem 0;border:none;}
   .product-listings .product-listing .product-bottom{position:static;padding:0}
   .product-listings .product-listing .product-buttons{grid-template-columns:1fr;grid-gap:10px;}
   .product-listings .product-listing{padding-bottom:2rem;}
}

@media(max-width:550px){
   .product-listings{grid-template-columns:1fr;}
}

/**Motor Delivery Form**/
.product-enquire-form{background:#ffffff;color:#000000;padding:2em;}
.product-enquire-form .product-enquire-container{max-width:768px;}
.product-enquire-form input, .product-enquire-form textarea, .product-enquire-form select{background:#efefef;}
.product-enquire-form  .gfield--type-product .ginput_container label{display:none !important;}
.product-enquire-form .ginput_product_price, .product-enquire-form .ginput_total{display: inline-block;font-weight: bold;background: transparent;width: auto !important;height: auto !important;padding: 0 !important;line-height: 1 !important;min-height: 0 !important;box-shadow:none !important;}

.product-enquire-form .gfield--type-checkbox{margin-bottom:2em !important;}

.product-enquire-form  .gfield--type-product label, .product-enquire-form  .gfield--type-total label, .product-enquire-form .please-call-for-delivery label{margin-bottom:0 !important;}
.product-enquire-form .gfield--type-product, .product-enquire-form .gfield--type-total, .product-enquire-form .totals-title, .product-enquire-form .please-call-for-delivery{margin-left:-1em !important;width:calc(100% + 2em) !important;background:#efefef;margin-bottom:0 !important;padding:0 2em 1em !important}
.product-enquire-form  .totals-title{padding-top:1.5em !important;}
.product-enquire-form  .totals-title h3{margin:0 !important;}
.product-enquire-form .gfield--type-total{padding-bottom:1.5em !important;}
.product-enquire-form  .how-to-pay, .product-enquire-form .gfield--type-stripe_creditcard, #field_15_18{padding-top:3em !important;}
.product-enquire-form  .gform_footer{padding:3em 0 !important;float:none !important;}
.product-enquire-form  .gform_footer input[type=submit]{width:100%;padding: 1.25em !important;border: none;}

/**Toast Styles**/
.content-hero{padding-bottom:1rem !important;}
.content-hero #breadcrumbs{margin-bottom:15px;}
.content-hero .l__row .l__col__span6{width:60% !important;}

.hire-listings-wrapper{padding:50px 0 90px 0;}
.hire-listings{grid-template-columns:1fr 1fr 1fr 1fr;display:grid;grid-gap:70px 30px;}
.hire-listing, .hire-listing:hover{text-decoration:none !important;color:inherit !important;opacity:1 !important;display:block;text-align:center;box-shadow:0 5px 10px rgba(0,0,0,0.15);display:grid;justify-content:center;align-items:center;}
.hire-listing img{max-width:100%;}
.hire-listing:after{content:'';width:100%;height:100%;background:#bbbcc3;position:absolute;top:0;left:0;opacity:0;transition:.5s;}
.hire-listing:hover:after{opacity:0.45;}
.hire-listing h3{margin:0;position:absolute;bottom:-20px;left:50%;transform:translate(-50%, 100%);width:100%;}

.hire-listings .contact-box{grid-column:span 2;box-shadow:0 5px 10px rgba(0,0,0,0.15);padding:30px;color:#329A39;}
.hire-listings .contact-box h2{font-weight:bold;margin-bottom:.75vw;font-size:clamp(10px, 2.5vw, 40px);line-height:1;}
.hire-listings .contact-box h4{font-size:1.5vw;font-weight:400;margin-bottom:.5vw;line-height:1;}
.hire-listings .contact-box .phone-number, .hire-listings .contact-box .phone-number:hover{display:block;font-size:clamp(10px, 4.5vw, 70px);line-height:1;color:#010101;margin-bottom:1vw;opacity:1;text-decoration:none;line-height:1;}
.hire-listings .contact-box .button{display:block;font-size:clamp(10px, 1.75vw, 23px);text-align:center;line-height:1;}

@media(max-width:1024px){
   .hire-listings{grid-template-columns:1fr 1fr} 
   .hire-listings .contact-box h2{font-size:25px;}
   .hire-listings .contact-box h4{font-size:20px;}
   .hire-listings .contact-box .phone-number, .hire-listings .contact-box .phone-number:hover{font-size:35px;}
   .hire-listings .contact-box .button{font-size:20px;}
}

@media(max-width:400px){
   .hire-listings{grid-template-columns:1fr} 
   .hire-listings .contact-box{grid-column:span 1;}
}