/* Image padding for ex display items eg bathrooms */
img.ex-display-item-pic {
    padding: 1em;
}

/* Make onsite intercom links hover as hand */
.open_intercom_from_site:hover {
  cursor: pointer;
}

/* Newsletter forms */
.gdprRequired {
  margin-left: 3rem;
}

.small-print {
  font-size: 0.8em;
  color: #999;
}

.fake-button {
    background: var(--theme-primary);
    padding: 10px 40px;
    color: white;
    font-size: 1.25em;
    height: 46px;
    margin-top: 1em;
    vertical-align: middle;
}

.fake-button:hover {
  background: var(--theme-secondary);
}

.flex-button-parent {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}


/* Product page tweaks */

.social-links {
  display: none;
}

.configurable-product-nudge {
  display: none;
}

.ex-product-configurable {
  .configurable-product-nudge {
    display: block;
  }
  
  .configurable-product-nudge {
  text-align: center;
  font-size: 1.1em;
	}

.configurable-product-nudge i {
  color: var(--theme-primary);
	}
  
  @media only screen and (max-width: 976px){
    .configurable-product-nudge i {
    display: none;}
  }

}
/* Logged in customer cash account header message - Only display for Role 2114 */

.ex-r-1934 {
  .rba-cash-account-hider{
  	display: none;
  }
}

.ex-r-1933 {
  .rba-cash-account-hider{
  	display: none;
  }
}

/* Logged in customer link account form - only display for non-RBA customers */

.ex-r-1934 {
  .rba-ac-hider {
    display: none;
  }
}

.ex-r-2114 {
  .rba-ac-hider {
    display: none;
  }
}

/* Mobile vue typography */

@media only screen and (max-width: 1023px) {
	h1 {
      font-size: 2em;
  }
  h2 {
    font-size: 1em;
  }
  h3 {
    font-size: 1em;
  }
}

/* Mobile vue homepage hiders */
@media only screen and (max-width: 321px) {
	.mobile-hide {
  	display: none;
	}
}

/* Information sheets sidebar */

section.quicklinks.information-sidebar li {
    font-size: 1.2em;
    padding: 5px;
}

/* Branch finder Storepoint outer features */

.branch-finder-filter-remover {
	padding: 2px 5px;
    background: var(--theme-primary);
  	border-radius: 5px;
    margin: 5px;
    height: 100%;
}

.branch-finder-filter-remover h2 {
  color: #fff;
  text-align: center;
  font-size: 2em;
}


.branch-finder-filter-outer {
    padding: 2px 5px;
    background:var(--theme-lightgrey);
    border:1px solid var(--theme-primary);
    border-radius: 5px;
    margin: 5px;
    height: 100%;
}

.branch-finder-filter-outer a:hover {
  color: var(--theme-primary);
}

.branch-finder-filter-outer:hover {
   background:var(--theme-tertiary);
}

.branch-finder-filter-inner .branch-info {
  display: inline-block;
  vertical-align: middle;
}

.branch-finder-filter-inner h3:hover {
    color: var(--theme-primary);
}

.branch-finder-filter-inner h3 {
  margin: 0px;
}

.branch-type-icon {
    max-width: 4em;
    display: inline-flex;
    margin: 3px 1em;
}

/* Branch finder icons mobile adjustments */

@media only screen and (max-width: 1023px) {
  .branch-type-icon {
    max-width: 2em;
    display: inline-flex;
    margin: 3px 1em;
  }  
}

@media only screen and (max-width: 424px) {
  .ex-name-branchfinder {
	body.branch-finder-filter-remover {
      display: none;
  }
  	.branch-finder-filter-outer {
      display: none;
  }
  }
}

/* Process info boxes - blue boxes with font awesome icons */
.process-stage-icon {
    background: var(--theme-secondary);
    border-radius: 0.5em;
    padding: 1em;
    color: #222;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 1em;
}

.process-stage-icon i {
    color: white;
    font-size: 4em;
    margin: 0 auto;
}


/* Mobile vue branch finder */
.countyOX-mobileBaner {
	background-color: var(--theme-primary);
        text-align:center;

}
.countyOX-mobileBaner a {
    color: #fff;
    display: inline-block;
    font-size: 1em;
    padding: 10px 5px 10px;
}

.countyOX-mobileBaner i {
  font-size: 1.5em;
  padding-right: 0.5em;
}

.countyOX-mobileBaner-widget {
	display:none;

}

@media only screen and (max-width: 768px) {

	.countyOX-mobileBaner-widget {
		display:block;

	}
}


/* Mobile vue nav Menu customisation */
#mobileVueNav {
  background: var(--theme-primary);
}

#mobileVueNav a {
  border: none;
}

.header-menu .cd-dropdown-wrapper .cd-dropdown div.dropdown-extras {
  background: var(--theme-tertiary);
}

.cd-dropdown-wrapper div.dropdown-extras a {
    color: var(--theme-primary);
}

/* Desktop menu customisation */
.menu.expanded .catalog li.has-submenu .submenu {
  font-size: 1.25em;
}

.menu.expanded .catalog li.has-submenu .submenu li.has-submenu {
  color: var(--theme-primary);
}


/* Community org box fix */
.community-box .strip-item {
  justify-content: space-around;
}

.community-box .strip-item img {
  width: fit-content;
}

/* Header sales departments menu */
#headermenu_211103 a {
  font-size: 1em;
  font-weight: 400;
}

/* Video auto-sizer */
video {
  width: 100% !important;
  height: auto !important;
}

/* Footer tweaks */
/* Footer icons */

.footer-icon {
  font-size: 1.5em;
  padding-right: 0.5em;
  color: var(--theme-tertiary);
}

.foot-menu ul li a {
  text-decoration: none;
}

/* Banner interactive text */
.service-menu-hover .banner_content {
  background: rgb(0 37 114 / 0.5);
}
.banner_content:hover {
  background: none;
}

.banner_content h2 {
  color: var(--theme-tertiary);
}

.banner_content:hover h2{
  color: var(--theme-primary);
}

.banner_content h3 {
  color: var(--theme-tertiary);
}

.banner_content:hover h3{
  color: var(--theme-primary);
}

/* Clever column list widget */
.clever-col-list {
	column-count: auto;
    column-width: 10rem;
}

/* Branch box widgets */

.branch-box {
  padding: 1em;
  border: 1px solid;
  border-color: var(--theme-primary);
}

.branch-details-icon {
  color: var(--theme-primary);
}

.branch-details>div {
    align-items: baseline;
    display: flex;
    margin-bottom: 5px
}

/* Margin bump for multi-row branch box layouts */

.row-margin-bump {
  margin-bottom: 1em;
}

/* Accordion box widgets on service pages */

.tab input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.tab_content {
  max-height: 0;
  overflow: hidden;
  transition: all 0.35s;
}

.tab input:checked ~ .tab_content {
  max-height: 100rem;
}

/* Accordion box visual stuff */
.accordion_faq {
  color: var(--theme-primary);
  overflow: hidden;
}
.tab_label {
  display: flex;
  color: white;
  background: var(--theme-primary);
  cursor: pointer;
}
.tab_label {
  justify-content: space-between;
  padding: 1rem;
}
.tab_label::after {
  content: "\276F";
  width: 1em;
  height: 1em;
  text-align: center;
  transform: rotate(90deg);
  transition: all 0.35s;
}
.tab input:checked + .tab_label::after {
  transform: rotate(270deg);
}
.tab_content p {
  margin: 0;
  padding: 1rem;
}

/* Start of add Sticky header EvoX */
@media only screen and (min-height: 768px) {
.menubarStick {
  position: fixed !important;
  top: 0;
  width: 100%;
  z-index: 15;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.headersection-1.menubarStick > .row-2 {
    max-width: 1450px;
    margin: 0 auto;
}

/* change me to the height of the sticky row */
.menubarHeader {
    padding-top:40px;
}
}
/* end of add Sticky header EvoX */

/* Header icons swap to Font Awesome icons */

#branch-finder-fa-marker {
  font-size: 4rem;
  color: var(--theme-primary);
}


/* Evo X variable structure */

:root {
  /*** Global ***/
  --theme-primary: #002572; /* royal blue */
  --theme-secondary: #c2d5ff; /* lighter blue */
  --theme-tertiary: #ebff08; /* yellow */
  --theme-text: #000000; /* black */
  --theme-lightgrey: #fbfbfb; /* light grey */

  /* Top Bar */
  --topbar-bg: #ffffff;
  --topbar-icons: #ebff08;
  --topbar-text: #ffffff;
  --topbar-hover: #ebff08;
  
  /* Main Header */
  --header-bg: #fff;
  --header-icons: var(--theme-primary);
  --header-text: var(--theme-text);
  --header-hover: var(--theme-tertiary);
  
  /* Header Search Bar */
  --search-bg: var(--theme-lightgrey);
  --search-icons: var(--theme-primary);
  --search-text: var(--theme-text);
  --search-focus: var(--theme-primary);
  
  /* Main Navigation */
  --nav-bg:#002572;
  --nav-border: #ffffff;
  --nav-icons: #002572;
  --nav-text: #ffffff;
  --nav-hover: #ebff08;
  
  /* USP Strip */
  --strip-bg: #ffffff;
  --strip-icons: #002572;
  --strip-text: #01233b;
  --strip-hover: #0260a1;
  
  /* Footer */
  --footer-bg: #002572;
  --footer-icons: #ffffff;
  --footer-text: #ffffff;
  --footer-hover: #f4ec0a;
  
  /* Footer Newsletter Input*/
  --footnews-bg: #fff;
  --footnews-icons: var(--theme-primary);
  --footnews-text: var(--theme-text);
  --footnews-focus: var(--theme-primary);
  
  /* Footer Social Icons */
  --footsocial-bg: var(--theme-primary);
  --footsocial-icons: #fff;
  --footsocial-bg-hover: var(--theme-tertiary);
  --footsocial-icons-hover: #fff;
  
  /* Title Underline Underline Colour */
  --title-underline:  var(--theme-primary);
  
  /* Simple / Link Boxes */
  --linkbox-bg: var(--theme-primary);
  --linkbox-text: #fff;
  --linkbox-hover-bg: var(--theme-tertiary);
  --linkbox-hover-text: #fff;
}

/* ADDING SOLID BORDER AROUND SEARCH */

.header-full .search_container section.search .search-form .form-group input {
    height: 50px;
    border: 2px solid #01233b !important;
}

/* HOMEPAGE STICKY BANNER */

.homestickybanner {
	display: none;
}

/* 3 Icons Banner */

.strip-img {
    width: 55px !important;
    height: 65px !important;
}

/* Boxes on Get In Touch Page */
.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.contact-box {
    background: var(--theme-secondary);
  	border-radius: 0.5em;
  	padding: 1em;
  	margin: 1rem;
  	color: #222;
  	display: flex;
  	justify-content: center;
  	flex-direction: column;
  	max-width: 300px;
}

.contact-box aside {
	font-size: 0.7rem;
}

label {
    display: inline-block;
    font-weight: 400;
    margin-bottom: 12px;
    margin-top: 12px;
}

/* Horizontal blue menus. Eg, Info above contact form, menu for account dashboard */

.information-menu-rba-credit {
  background: var(--theme-primary);
}

.information-menu-rba-credit h4 {
    color: #fff;
    text-align: center;
    padding: 5px;
    font-size: 1.5em;
}

.information-menu-rba-credit ul {
	display: flex;
    justify-content: space-evenly;
  	flex-wrap:wrap
}

.information-menu-rba-credit li a {
	color: #fff;
    font-size: 1.2rem;
}

.information-menu-rba-credit li a:hover {
	color: var(--theme-tertiary);
}

/* Hide the menu header from duplicating for RBA Credit customers*/

.ex-r-1934 {
  #menulinks_224433 .information-menu-on-contact h4 {
  display: none;
  }
}

/* Hide the invoice and account summary menu items from non RBA Credit customers */

.ex-r-2114 {
  .information-menu-rba-credit {
    display: none;
  }
}

.ex-r-1933 {
  .information-menu-rba-credit {
    display: none;
  }
}

/* Horizontal blue menu - Info above contact form */

.information-menu-on-contact {
  background: var(--theme-primary);
}

.information-menu-on-contact h4 {
    color: #fff;
    text-align: center;
    padding: 5px;
    font-size: 1.5em;
}

.information-menu-on-contact ul {
	display: flex;
    justify-content: space-evenly;
  	flex-wrap:wrap
}

.information-menu-on-contact li a {
	color: #fff;
    font-size: 1.2rem;
}

.information-menu-on-contact li a:hover {
	color: var(--theme-tertiary);
}


/* Current Branch Banner */

.current-branch-banner .container a {
  font-weight: bold;
  color: white;
}
 
.current-branch-banner {
    background: #000000;
    font-size: 14px;
    padding: 9px 0;
  }
 
.current-branch-banner .container {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
  height: 10px;
}

@media only screen and (max-width: 768px) {
   .no-more-tables thead tr {
       left: 0;
       position: relative;
       top: 0;
   }
}

@media only screen and (max-width: 600px) {
  .accountoverview-btn-group {
    flex-direction: column;
  }
}

@media only screen and (max-width: 991px) {
  .filter-container {
    float: unset;
  }
}