/*
* Color Variable Styles
*/

/* Header Background Colour */
.not-front .l-header__bottom,
.l-header__bottom.stickytop,
.main-menu.accordion-menu,
.top-bar .main-menu>li .submenu {
  background: #000000;
}
.l-header__top {
  background: #000000E6;
}
@media screen and (max-width: 65em) {
  .front .l-header__bottom {
    background: #000000;
  }
}


/* Header Text Colour */
.l-header .header-email,
.social.header i,
.block-phone-numbers .header-phone,
.button.block-phone-numbers__mobile-button,
.button.block-phone-numbers__mobile-button:active,
.button.block-phone-numbers__mobile-button:focus,
.button.block-phone-numbers__mobile-button:hover,
.top-bar .main-menu a,
.top-bar .main-menu>li.active>a,
.top-bar .main-menu>li.is-active>a,
.title-bar-title,
.title-bar .menu-icon.active:after {
  color: #ffffff;
}
@media screen and (min-width: 65em) {
  .top-bar .main-menu>li a span:before,
  .top-bar .main-menu>li a span:after {
    background: #ffffff;
  }
}
.menu-icon::after {
  color: #ffffff;
  background: #ffffff;
  box-shadow: 0 7px 0 #ffffff, 0 14px 0 #ffffff;
}

/* Primary Colour */
button,
.button,
input[type="submit"],
.button.success, .button.success:hover, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus,
#saved-vehicles,
.button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus,
.node-used-vehicle.view-mode-search_result .footer-button .button:hover,
.node-used-vehicle.view-mode-search_result .footer-button.field-name-more-information .button,
.node-used-vehicle.view-mode-search_result .field-name-field-sash,
.node-used-vehicle.view-mode-full .field-name-field-sash,
.part-exchange-form-container #partex-tabs .tabs-title span,
.block-search-block #used-search-block .used-search-block-facets__vehicle-status .form-radios input[type="radio"]:checked+label,
.node-frontpage .finance-block .finance-slider-form .submit-button input[type="submit"],
.node-frontpage .finance-block .finance-slider-form .slider,
.node-branch .field-name-opening-hours .opening-day,
.additional-style.additional-style-2,
.additional-style.additional-style-3 .additional-style-inner .additional-style-text:after,
.additional-style.additional-style-6 .additional-style-inner .additional-style-review-icon:after,
.additional-style.additional-style-7,
.additional-style.additional-style-7 .additional-style-inner .additional-style-review-icon img,
.additional-style.additional-style-18 .additional-style-inner .additional-style-reviews .additional-style-review .additional-style-review-icon:after,
.additional-style .additional-style-cargurus-top, 
.additional-style .additional-style-cargurus-bottom,
.finance-slider-form .noUi-connect,
.block-search-block #used-search-block .used-search-block-facets__finance-radio .form-radios input[type="radio"]:checked + label,
.l-node-used-vehicle--latest-vehicles__monthly-price,
.additional-style.additional-style-23 .additional-style-inner .additional-style-reviews .additional-style-review:after,
.node-used-vehicle.view-mode-search_result .field-name-branch i,
.node-used-vehicle.view-mode-full .field-name-branch i,
.primary-colour-background,
.l-booking-tool--outer.half-width .l-booking-tool--inner,
.block-search-block #used-search-block .used-search-block-facets__vehicle-type .form-radios input[type="radio"]:checked + label {
  background-color: #009ee5;
}
button,
.button,
input[type="submit"],
.additional-style.additional-style-8 .additional-style-inner,
.block-logo-search li a:hover, .block-body-type-search li a:hover,
.used-vehicles-compare .field-results .details-button a,
.l-node-used-vehicle--full__other-cta {
  border-color: #009ee5;
}
.node-used-vehicle.view-mode-search_result .footer-button .button {
  color: #009ee5;
  background: transparent;
}
.additional-style.additional-style-2 .button,
.additional-style.additional-style-7 .button,
.additional-style.additional-style-11 .additional-style-inner h3,
.additional-style .additional-style-cargurus-bottom .button,
.used-vehicles-compare .field-results .details-button a,
.used-vehicles-compare .field-results .remove-button a,
.node-used-vehicle .field-name-fmg-quoteware-api-payment .monthlyPaymentAmount,
.additional-style.additional-style-20 .additional-style-inner .additional-style-20__title h2:after,
.primary-colour-text,
.node-frontpage .l-node-frontpage--full__body .fr-view .read-more-link  {
  color: #009ee5;
}

/* Text on Primary Colour */
button,
.button,
input[type="submit"],
.button.success, .button.success:hover, .button.success.disabled, .button.success[disabled], .button.success.disabled:hover, .button.success[disabled]:hover, .button.success.disabled:focus, .button.success[disabled]:focus,
#saved-vehicles,
.button, .button.disabled, .button[disabled], .button.disabled:hover, .button[disabled]:hover, .button.disabled:focus, .button[disabled]:focus,
.node-used-vehicle.view-mode-search_result .footer-button .button:hover,
.node-used-vehicle.view-mode-search_result .footer-button.field-name-more-information .button,
.node-used-vehicle.view-mode-search_result .field-name-field-sash,
.node-used-vehicle.view-mode-full .field-name-field-sash,
.part-exchange-form-container #partex-tabs .tabs-title span,
.block-search-block #used-search-block .used-search-block-facets__vehicle-status .form-radios input[type="radio"]:checked+label,
.node-frontpage .finance-block .finance-slider-form .submit-button input[type="submit"],
.node-branch .field-name-opening-hours .opening-day,
.additional-style.additional-style-2 h2,
.additional-style.additional-style-2 p,
.additional-style.additional-style-7 h2,
.additional-style.additional-style-7 p,
.additional-style .additional-style-cargurus-top p, 
.additional-style .additional-style-cargurus-bottom h3,
.additional-style .additional-style-cargurus-bottom p,
.block-search-block #used-search-block .used-search-block-facets__finance-radio .form-radios input[type="radio"]:checked + label,
.l-node-used-vehicle--latest-vehicles .field-name-field-vehicle-monthly-price,
.additional-style.additional-style-23 .additional-style-inner .additional-style-reviews .additional-style-review:after,
.node-used-vehicle.view-mode-search_result .field-name-branch i,
.node-used-vehicle.view-mode-full .field-name-branch i,
.l-booking-tool--outer.half-width .contact-form.service-booking-form h2,
.l-booking-tool--outer.full-width .contact-form.service-booking-form h2,
.l-booking-tool--outer.half-width .contact-form.service-booking-form .button, 
.l-booking-tool--outer.half-width .contact-form.service-booking-form button,
.block-search-block #used-search-block .used-search-block-facets__vehicle-type .form-radios input[type="radio"]:checked + label {
  color: #ffffff;
}
.node-frontpage .finance-block .finance-slider-form .slider::-webkit-slider-thumb,
.additional-style.additional-style-2 .button,
.additional-style.additional-style-7 .button,
.additional-style.additional-style-7 .additional-style-inner .additional-style-review-icon:after,
.additional-style .additional-style-cargurus-bottom .button {
  background-color: #ffffff;
}
.l-booking-tool--outer.half-width .contact-form.service-booking-form .button, 
.l-booking-tool--outer.half-width .contact-form.service-booking-form button {
  border-color: #ffffff;
}


/* Secondary Colour */
button:hover,
.button:hover,
input[type="submit"]:hover,
button:focus,
.button:focus,
input[type="submit"]:focus,
button:active,
.button:active,
input[type="submit"]:active,
.l-featured__outer,
.tabs-title>a:focus, .tabs-title>a[aria-selected='true'],
.tabs-title>a:hover,
.slick--vehicle-gallery-thumbs .slick-prev, 
.slick--vehicle-gallery-thumbs .slick-next,
.l-node-used-vehicle--full__tabscontent-outer,
.node-used-vehicle.view-mode-full .compare-button:hover,
.vehicle-running-cost-calcuator,
.contact-form form, 
.vehicle-enquiry-form form,
.l-node-page--full__formrow--outer,
.l-node-used-vehicle--latest-vehicles__price,
.l-footer__images,
.sticky-mobile-cta.tab-text-and-icon .sticky-mobile-cta-tab, 
.sticky-mobile-cta.tab-icon-only .sticky-mobile-cta-tab,
.sticky-mobile-cta.bar-text-and-icon, .sticky-mobile-cta.bar-icon-only {
  background-color: #4b4b4b;
}
@media screen and (max-width: 65em) { 
  .l-node-frontpage--full__search {
    background-color: #4b4b4b;
  }
}
.node-used-vehicle.view-mode-search_result .specs-list li .spec,
.node-used-vehicle.view-mode-full .specs-list li .spec {
  border-color: #4b4b4b;
}

/* Alternate Secondary Colour */
.tabs-title {
  background-color: #5f5f5f;
}


/* Text on Secondary Colour */
button:hover,
.button:hover,
input[type="submit"]:hover,
button:focus,
.button:focus,
input[type="submit"]:focus,
button:active,
.button:active,
input[type="submit"]:active,
.block-search-block #used-search-block .used-search-block-heading .used-search-block-title h2,
.block-search-block #used-search-block .used-search-block-heading .used-search-block-count,
.block-search-block #used-search-block label,
.tabs-title>a,
.tabs-title>a:hover,
.tabs-title>a:focus, .tabs-title>a[aria-selected='true'],
.slick--vehicle-gallery-thumbs .slick-prev:before, 
.slick--vehicle-gallery-thumbs .slick-next:before,
.l-node-used-vehicle--full__tabscontent,
.l-node-used-vehicle--full__tabscontent p,
.l-node-used-vehicle--full__tabscontent h2,
.l-node-used-vehicle--full__tabscontent h3,
.l-node-used-vehicle--full__tabscontent label,
.l-node-used-vehicle--full__tabscontent .tabs-content,
.node-used-vehicle.view-mode-full .compare-button:hover,
.vehicle-running-cost-calcuator,
.vehicle-running-cost-calcuator label,
.l-node-page--full__formrow--outer h2,
.l-node-page--full__formrow--outer h3,
.l-node-page--full__form .part-exchange-form-container .form-item label,
.l-node-page--full__form .part-exchange-form-container #partex-tabs .tabs-title a,
.l-node-page--full__form .part-exchange-form-container .form-item .form-radio, 
.l-node-page--full__form .part-exchange-form-container .form-item .result,
.l-node-page--full__form .part-exchange-form-container .edit,
.l-node-page--full__form .dropzone .dz-message .dz-button,
.not-front .block-search-block #used-search-block .advanced-search-button,
.contact-form label, .vehicle-enquiry-form label,
.home .menu-icon::after,
.not-front #used-search-block .used-search-block-facet.used-search-block-facets__finance-radio .form-radios-total label, 
.not-front #used-search-block .used-search-block-facet.used-search-block-facets__finance-radio .form-radios-monthly label,
.l-node-used-vehicle--latest-vehicles .field-name-field-vehicle-price,
.l-node-used-vehicle--latest-vehicles .field-name-field-vehicle-vat,
.sticky-mobile-cta a {
  color: #ffffff;
}
button:hover,
.button:hover,
input[type="submit"]:hover,
.node-used-vehicle.view-mode-full .compare-button:hover {
  border-color: #ffffff;
}
.part-exchange-form-container #partex-tabs:before {
  background-color: #ffffff;
}

/* Highlight Colour */
.l-node-frontpage--full__testimonials,
.l-node-frontpage--full__testimonials:after {
  background-color: #ffffff;
}

/* Text on Highlight Colour */
.node-testimonial.view-mode-teaser .testimonial-body,
.node-testimonial.view-mode-teaser .testimonial-title,
.node-testimonial.view-mode-teaser .testimonial-body p,
.node-testimonial.view-mode-teaser .testimonial-body h3,
.node-testimonial.view-mode-teaser .testimonial-title h2,
.slick--testimonials-slideshow .slick-prev i::before, 
.slick--testimonials-slideshow .slick-next i::before,
.home-testimonials h2 {
  color: #000000;
}
.l-node-frontpage--full__testimonials .testimonial-stars #fill-color {
  fill: #000000;
}

/* Body Background Colour */
body,
#testDriveModal,
#partExPopup {
  background-color: #ffffff;
}
.node-frontpage .l-node-frontpage--full__body .fr-view.more-hidden:before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
}

/* Body Text Colour */
body,
label,
.pagination a, .pagination button,
#testDriveModal .close-button,
#partExPopup .part-exchange-form-container #partex-tabs .tabs-title a,
#partExPopup .part-exchange-form-container label,
#partExPopup .part-exchange-form-container .tabs-content,
.fmgauto-finance-plugins--finance-parameters--representative-example .tabs-content,
.node-used-vehicle.view-mode-search_result .field-name-save-vehicle .button,
.slick--logo-search .slick-prev::before, 
.slick--logo-search .slick-next::before,
.slick--body-search .slick-prev::before, 
.slick--body-search .slick-next::before {
  color: #000000;
}
#testDriveModal input[type="date"] {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='141' height='146'%3E%3Cpath id='calendarIcon' fill='%23000000' d='M13.3,126.4V37.4c0-2.4,.9-4.5,2.6-6.3c1.7-1.8,3.8-2.6 6.2-2.6h8.8v-6.7c0-3.1,1.1-5.7,3.2-7.9c2.2-2.2,4.7-3.3,7.8-3.3h4.4c3,0 5.6,1.1,7.8,3.3c2.2,2.2,3.2,4.8,3.2,7.9v6.7h26.4v-6.7c0-3.1,1.1-5.7 3.2-7.9c2.2-2.2,4.7-3.3,7.8-3.3h4.4c3,0,5.6,1.1,7.8,3.3c2.2,2.2,3.2 4.8,3.2,7.9v6.7h8.8c2.4,0,4.4,.9,6.2,2.6c1.7,1.8,2.6,3.8,2.6,6.3v88.9c0 2.4-.9,4.5-2.6,6.3c-1.7,1.8-3.8,2.6-6.2,2.6H22.1c-2.4,0-4.4-.9-6.2-2.6C14.2,130.8 13.3,128.8,13.3,126.4z M22.1,126.4h96.8V55.2H22.1V126.4z M39.7,41.9c0,.6,.2,1.2 .6,1.6c.4,.4,.9,.6,1.6,.6h4.4c.6,0,1.2-.2,1.6-.6c.4-.4 .6-.9,.6-1.6v-20c0-.6-.2-1.2-.6-1.6c-.4-.4-.9-.6-1.6-.6h-4.4c-.6,0-1.2,.2-1.6 .6c-.4,.4-.6,1-.6,1.6V41.9z M92.5,41.9c0,.6,.2,1.2,.6,1.6c.4,.4,.9,.6 1.6,.6h4.4c.6,0,1.2-.2,1.6-.6c.4-.4 .6-.9,.6-1.6v-20c0-.6-.2-1.2-.6-1.6c-.4-.4-.9-.6-1.6-.6h-4.4c-.6 0-1.2,.2-1.6,.6c-.4,.4-.6,1-.6,1.6V41.9z'/%3E%3C/svg%3E");
}
#fmgauto-finance-plugins--finance-parameters--representative-example .tabs .tabs-title a {
  border-color: #000000;
}
#at-fill {
  fill: #000000;
}
#partExPopup .part-exchange-form-container #partex-tabs:before {
  background-color: #000000;
}


/* Alternate Body Background Colour */
.l-breadcrumb-outer,
.pagination a:hover, .pagination button:hover {
  background-color: #9c9c9c;
}

/* Text on Alternate Body Background Colour */
.breadcrumbs li,
.breadcrumbs a,
.breadcrumbs li:not(:last-child)::after,
.pagination a:hover, .pagination button:hover {
  color: #ffffff;
}



/* Title Text Colour */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  color: #000000;
}

/* Footer Background Colour */
.l-footer {
  background-color: #000000;
}


/* Footer Text Colour */
.l-footer a, 
.l-footer p,
.social.footer i {
  color: #ffffff;
}