/*
* Color Variable Styles
*/

/* Header Background Colour */
.l-header {
  background: #475782;
}

/* Header Text Colour */
.l-header .header-phone {
  color: #632da8;
}

/* Menu Background Colour */
.top-bar, .top-bar ul,
.main-menu.drilldown,
.title-bar,
.drilldown a {
  background: #0074ff;
}


/* Menu Text Colour */
.top-bar .main-menu a, 
.title-bar-title {
  color: #ff00a8;
}
.menu-icon::after {
  background: #ff00a8;
  box-shadow: 0 7px 0 #ff00a8, 0 14px 0 #ff00a8;
}


/* Primary Colour */
button,
.button,
input[type="submit"],
#saved-vehicles,
.node-used-vehicle.view-mode-search_result .field-name-field-sash,
.node-used-vehicle.view-mode-full .field-name-field-sash,
.menu.dropdown .active>a,
.top-bar .main-menu.dropdown a:hover,
.top-bar .main-menu>li.is-active>a,
.is-dropdown-submenu-parent.is-active a,
.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-cargurus-top, 
.additional-style .additional-style-cargurus-bottom {
  background-color: #4bb848;
}
@media screen and (min-width: 65em) {
  .top-bar .main-menu>li a.active:not(.has-form)>a:not(.button), .top-bar .main-menu>li a:hover,
  .top-bar .menu .active>a {
    background-color: #4bb848;
  }
}
.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 {
  color: #4bb848;
}
.l-node-used-vehicle--search,
.additional-style.additional-style-8 .additional-style-inner {
  border-color: #4bb848;
}

/* Text on Primary Colour */
button,
.button,
input[type="submit"],
#saved-vehicles,
.node-used-vehicle.view-mode-search_result .field-name-field-sash,
.node-used-vehicle.view-mode-full .field-name-field-sash,
.menu .active>a,
.top-bar .main-menu a:hover,
.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  {
  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;
}


/* Secondary Colour */
button:hover,
.button:hover,
button:focus,
.button:focus,
input[type="submit"]:hover,
.tabs-title>a:focus, .tabs-title>a[aria-selected='true'],
.tabs-title>a:hover,
.vehicle-running-cost-calcuator,
.social i,
.button.success, 
.button.success:hover,
.part-exchange-form-container #partex-tabs .tabs-title span,
.part-exchange-form-container #partex-tabs:before {
  background-color: #0f3460;
}


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


/* Text on Secondary Colour */
button:hover,
.button:hover,
button:focus,
.button:focus,
.tabs-title>a,
.tabs-title>a:hover,
.tabs-title>a:focus, .tabs-title>a[aria-selected='true'],
.vehicle-running-cost-calcuator,
.vehicle-running-cost-calcuator label,
.social i,
.button.success, 
.button.success:hover,
.part-exchange-form-container #partex-tabs .tabs-title span {
  color: #ff0000;
}


/* Body Background Colour */
body,
#testDriveModal {
  background-color: #000000;
}

/* Body Text Colour */
body,
label,
.pagination a,
.slick--vehicle-gallery-thumbs .slick-prev:before, 
.slick--vehicle-gallery-thumbs .slick-next:before,
.block-promotional-block.home-slider .field-name-content p,
.block-search-block #used-search-block .advanced-search-button,
#testDriveModal .close-button {
  color: #808080;
}
#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='%23808080' 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");
}



/* Alternate Body Background Colour */
.pagination a:hover, .pagination button:hover,
.node-used-vehicle.view-mode-search_result .specs-list li .spec,
.node-used-vehicle.view-mode-full .specs-list li .spec {
  background-color: #e36d00;
}

/* Text on Alternate Body Background Colour */
.pagination a:hover, .pagination button:hover,
.node-used-vehicle.view-mode-search_result .specs-list li .spec,
.node-used-vehicle.view-mode-full .specs-list li .spec {
  color: #a63131;
}



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

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


/* Footer Text Colour */
.l-footer,
.l-footer a, 
.l-footer p,
.l-footer h2 {
  color: #00ffe0;
}
.l-footer__fourth-outer {
  border-color: #00ffe0;
}