* { padding: 0; margin: 0; box-sizing: border-box; }

/*GLOBAL VARS*/
:root{
--font-sans-serif: basic-sans, system-ui, sans-serif;
--font-serif: "Roboto Slab", serif;
--font-monospace: Menlo, "Courier New", monospace;
--font-display: system-ui;
--color1: #000000;
--color1rgb: 0,0,0;
--color2: #525B52; /*dark grey*/
--color2rgb: 82,81,82;
--color3: #282828; /*pale black*/ 
--color3rgb: 40,40,40;
--color4: #BABABA; /*light grey*/
--color4rgb: 1186,186,186; 
--color5: #EDECEA; /*lighter grey*/ 
--color5rgb: 237,236,234; 
--color6: #990622; /*dark red*/ 
--color6rgb: 153,6,34;
--color7: #C31230; /*bright red*/
--color7rgb: 195,18,48; 
--color8: #FFFFFF;
--color8rgb: 255,255,255;
 
--width-full: 100%;
--width-normal: 1280px;
--width-medium: 960px;
--width-narrow: 640px;
--gap-xs: 5px;
--gap-s: 10px;
--gap-m: 15px;
--gap-l: 20px;
--gap-xl: 30px;
--gap-2xl: 40px;
--gap-3xl: 50px;
--gap-4xl: 60px;
--gap-5xl: 80px;

--test-xxs: 12px;
--text-xs: 12px;
--text-sm: 13px;
--text-base: 14px;
--text-lg: 15px;
--text-xl: 16px;
--text-xxl: 17px;
--text-xxxl: 17px;
--text-xxxxl: 22px;

}
@media only screen and (min-width: 768px) {
:root{
--test-xxs: 13px;
--text-xs: 14px;
--text-sm: 15px;
--text-base: 16px;
--text-lg: 17px;
--text-xl: 18px;
--text-xxl: 20px;
--text-xxxl: 20px;
--text-xxxxl: 30px;	
}
}

@media only screen and (min-width: 1024px) {
:root{
--test-xxs: 14px;
--text-xs: 14px;
--text-sm: 15px;
--text-base: 16px;
--text-lg: 17px;
--text-xl: 18px;
--text-xxl: 25px;
--text-xxxl: 29px;
--text-xxxxl: 40px;	
}
}

/* DEFAULTS */
html,body { max-width: 100%; overflow-x: hidden; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; background: var(--color1); }
body { font-family: var(--font-sans-serif); font-weight: normal; color: var(--color8); line-height: 1.4; padding: 100px 0 0 0; background-color: var(--color1); margin: 0; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img { max-width: 100%; height: auto; }	
h1,h2,h3,h4,h5,h6 { font-family: var(--font-serif); font-weight: 400; line-height: 1.2;  margin: 0 0 var(--gap-s) 0; }
h1 { font-size: var(--text-xxxxl); }
h2 { font-size: var(--text-xxl); }
h3 { font-size: var(--text-xl); }
h4,h5,h6 { font-size: var(--text-lg); }
p,ul,ol,dl,table,figure,figcaption { font-size: var(--text-base); }
p { margin: 0 0 var(--gap-l) 0; }
ul { margin: 0 0 var(--gap-l) var(--gap-l); }
ul ul { margin-top: 0; margin-bottom: 0; }
ol { margin: 0 0 var(--gap-l) var(--gap-l); }
dl { margin: 0 0 var(--gap-l) 0; }
dt { font-weight: 700; }
hr { margin: 45px 0 30px 0; height: 5px; background: var(--color4); border: 0; }
small { font-family: var(--font-sans-serif); font-size: var(--text-sm); }
blockquote { position: relative; font-family: sans-serif; font-size: var(--text-lg); color: var(--color2); padding: 30px 30px 30px 60px; margin: 0 0 var(--gap-l) 0; opacity: 0.75; border-top: 1px solid var(--color2); border-bottom: 1px solid var(--color2); }
blockquote::before { content: "\275D"; position: absolute; left: 0; font-size: var(--text-xxl); color: var(--color2); line-height: 1; }
blockquote p { margin: 0; }
blockquote cite { font-size: var(--text-sm); }
figure { text-align: center; margin: 0 0 var(--gap-l) 0; }
figure img { display: block; width: 100%; }
figcaption { font-family: var(--font-sans-serif); font-size: var(--text-sm); color: var(--color3); text-align: center; padding-top: 5px; }
table { width: 100%; border-collapse: collapse; margin: var(--gap-l) 0; }
th { text-align: left; padding: 0 0 10px 0; border-bottom: 2px solid silver; }
td { padding: 10px 0; border-bottom: 1px dotted silver; }
code { font-family: var(--font-monospace); font-size: var(--text-sm); color: var(--color8); padding: 3px 5px; background: rgba(var(--color1rgb),0.5); }
pre { white-space: pre-wrap; margin: 0 0 30px 0; }
xpre::before { content: "CODE"; display: block; width: 50px; font-size: var(--text-sm); padding: 5px 15px 0 15px; background: var(--color7); clear; right; border-radius: 7px 7px 0 0; }
pre code { display: block; padding: 30px; border-radius: 12px; }
audio { width: 100%; background: #555; }
time { font-weight: var(--text-sm); }
a { color: var(--color5); text-decoration: underline; text-underline-offset: 5px; }
a:hover,a:focus { color: var(--color7); }

/* FORMS  */
fieldset { border: 0; }
legend { margin-bottom: var(--gap-l); }
.form-item { margin-bottom: var(--gap-l); }
form ul { list-style: none; margin: 0; }
form ul li { margin-bottom: var(--gap-s); }
input[type='text'],input[type='search'],input[type='email'] { width: 100%; height: 40px; font-family: var(--font-sans-serif); font-size: var(--text-base); text-indent: 5px; background: var(--color8); border: 2px solid var(--color4); }
input[type=number] { width: 60px; height: 40px; font-size: var(--text-base); text-indent: 5px; background: var(--color8); border: 2px solid var(--color4); }
input[type='radio'],input[type='checkbox'] { zoom: 150%; }
select { width: 100%; height: 40px; font-size: var(--text-base); background: var(--color7); border: 2px solid var(--color4); }
textarea { width: 100%; min-height: 140px; font-size: var(--text-base); padding: 5px; border: 2px solid var(--color4); }
button { height: 40px; font-size: var(--text-base); font-weight: 700; color: var(--color8); padding: 0 var(--gap-m); background: var(--color3); border: 0; }
input::placeholder { color: var(--color4); }

.main {  }
.row { }
.row-nav { position: fixed; top: 0; right: 0; left: 0; width: 100%; padding: 20px var(--gap-l) 20px var(--gap-l); background: var(--color1); z-index: 888; } /*hard coded top bottom padding to match fixed height nav */
.row-hero { padding: 0; background: var(--color1); }
.row-header { padding: var(--gap-xl) var(--gap-l); background: var(--color1); }
.row-body { padding: var(--gap-xl) var(--gap-l); background: var(--color1); }
.row-also { padding: var(--gap-xl) var(--gap-l); background: var(--color3); }
.row-related { padding: var(--gap-xl) var(--gap-l); background: var(--color5); }
.row-about { padding: var(--gap-xl) var(--gap-l); background: var(--color1); }
.row-about:nth-of-type(odd) { background: var(--color3); }
.row-footer { padding: var(--gap-3xl) var(--gap-l); background: var(--color1); }
.content { width: 100%; max-width: var(--width-normal); margin: 0 auto; }
.content.header.about { padding-bottom: var(--gap-m); }
.content.hero {  }
.content.home {  }
.content.category {  }
.content.article {  }
.content.about-clients { padding-top: 0;  }

@media only screen and (min-width: 576px) {
.row-nav { padding: 20px var(--gap-2xl) 20px var(--gap-2xl); }
.row-hero { padding: 0 var(--gap-2xl); }
.row-header { padding: var(--gap-xl) var(--gap-2xl); }
.row-body { padding: var(--gap-xl) var(--gap-2xl); }
.row-also { padding: var(--gap-xl) var(--gap-2xl); }
.row-related { padding: var(--gap-xl) var(--gap-2xl); }
.row-about { padding: var(--gap-xl) var(--gap-2xl); }
.row-footer { padding: var(--gap-3xl) var(--gap-2xl); }
}
@media only screen and (min-width: 1024px) {
.row-nav { padding: 20px var(--gap-3xl) 20px var(--gap-3xl); }
.row-hero { padding: 0 var(--gap-3xl); }
.row-header { padding: var(--gap-xl) var(--gap-3xl); }
.row-body { padding: var(--gap-xl) var(--gap-3xl); }
.row-also { padding: var(--gap-xl) var(--gap-3xl); }
.row-related { padding: var(--gap-xl) var(--gap-3xl); }
.row-about { padding: var(--gap-xl) var(--gap-3xl); }
.row-footer { padding: var(--gap-3xl) var(--gap-3xl); }
}

/*SHOW/HIDE NAV MOBILE VS DESKTOP*/
@media only screen and (max-width: 575px) {
.row-nav-mobile { display: block; }
.row-nav-desktop { display: none; }
}
@media only screen and (min-width: 576px) {
.row-nav-mobile { display: none; }
.row-nav-desktop { display: block; }
}


/*GRIDS UNUSED*/
.grid { display: grid; gap: 30px; grid-template-columns: 1fr; margin: 30px 0 30px 0; }
.grid-flexi { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.grid-flexi .item { padding: 10px; background: blue; }
@media only screen and (min-width: 768px) {
.grid2 { grid-template-columns: 1fr 1fr; }
.grid-entries { grid-template-columns: 1fr 1fr 1fr; }
}

/*PRIMARY NAV*/
.nav { display: flex; align-items: center; justify-content: space-between; align-items: flex-end; }
.logo { font-size: var(--text-sm); font-weight: 700; color: var(--color7); margin-right: var(--gap-3xl); }
.logo svg { display: block; width: 60px; height: 60px; fill: var(--color8); transition: 0.5s; }
.logo svg:hover { fill: var(--color7); }
.logo a { color: var(--color7); text-decoration: none; }
.logo a:hover svg, .logo a:focus svg { fill: var(--color7); }

.menu-toggle-container { height: 30px; margin-left: auto; }
.search-toggle { display: inline-block; width: 30px; height: 30px; line-height: 1; padding: 0; background: transparent; border: 0; margin-left: var(--gap-m); cursor: pointer; }
.menu-toggle { display: inline-block; width: 30px; height: 30px; line-height: 1; padding: 0; background: transparent; border: 0; margin-left: var(--gap-m); cursor: pointer; transition: 0.5s; }
.search-toggle svg { display: block; }
.search-toggle:hover svg g { fill: var(--color7); }
.search-toggle.active svg g { fill: var(--color7); }
.rotated { transform: rotate(90deg); }
input.search-keywords { height: 40px; font-size: var(--text-xl); color: var(--color4); background: var(--color1); border: 0; }
input.search-keywords:focus { outline:none; }
button.mobile-search-close { height: 40px; font-size: var(--text-l); color: var(--color4); background: var(--color1); cursor: pointer; }
button.desktop-search-close { background: var(--color1); cursor: pointer; }

@media only screen and (max-width: 576px) {
#mobile-menu-container { display: none; position: absolute; top: 100px; right: 0; left: 0; width: 100%; z-index:999; padding: 0 var(--gap-l); background: rgba(var(--color6rgb),0.75); }
#desktop-subnav-sectors-container, #desktop-subnav-services-container { display: none !important; }
.mobile-menu { position: relative; max-width: var(--width-normal); font-family: var(--font-sans-serif); list-style: none; padding: 0; margin: 0 auto; }
.mobile-menu li { border-bottom: 1px solid var(--color2); }
.mobile-menu li:last-of-type { border: 0; }
.mobile-menu a { display: block; color: var(--color8); text-decoration: none; padding: var(--gap-m) 0; }
.mobile-menu a:hover,.menu a:focus { color: var(--color7); background: transparent; text-decoration: none; }
.mobile-menu a.level1 { font-family: var(--font-serif); color: var(--color8); font-weight: 700; }
.mobile-menu a.level1:hover, .mobile-menu a.level1:focus { color: var(--color8);}
.mobile-menu a.level1-sectors::after { position: absolute; right: 0; content: "\276F"; color: var(--color8); }
.mobile-menu a.level1-services::after { position: absolute; right: 0; content: "\276F"; color: var(--color8); }
.mobile-menu a.level1-sectors.active::after { position: absolute; right: 0; content: "\276F"; color: var(--color8); transform: rotate(90deg); }
.mobile-menu a.level1-services.active::after { position: absolute; right: 0; content: "\276F"; color: var(--color8);  transform: rotate(90deg); }
.subnav { display: none; }
.submenu { display: grid; grid-template-columns: 1fr 1fr; list-style: none; padding: 0; margin: 0; }
.submenu li { padding: var(--gap-m) 0; border-top: 1px solid var(--color2); border-bottom: 0; }
.submenu li:last-of-type { border-top: 1px solid var(--color2); border-bottom: 0; }
.submenu li:nth-of-type(odd) a { border-right: 1px solid var(--color2); }
.submenu li:nth-of-type(even) { padding-left: var(--gap-m); }
.submenu a { font-weight: 700; line-height: 1; padding: var(--gap-xs) 0; }

#mobile-search { display: none; position: absolute; top: 100px; right: 0; left: 0; width: 100%; padding: var(--gap-s) var(--gap-l); background: var(--color1); z-index:999; }
.form-search { display: flex; font-family: var(--font-sans-serif); font-weight: 700; list-style: none; border-bottom: 2px solid var(--color4); margin: 0; }
}

@media only screen and (min-width: 576px) {
.nav { position: relative; justify-content: initial; }
.menu-toggle-container { height: 16px; margin-left: 0; }
.search-toggle { width: 14px; height: 14px; margin-left: var(--gap-xs); }
.menu-toggle { display: none; }
#desktop-menu-container { display: block; position: relative; top: 0; left: 0; width: auto; background: transparent; }	
.desktop-menu { display: flex; gap: var(--gap-d); list-style: none; width: auto; margin: 0; }
.desktop-menu li { position: relative; padding-right: var(--gap-m); margin-right: var(--gap-m); border-right: 1px solid var(--color2); }
.desktop-menu a { display: block; font-weight: 700; color: var(--color8); text-decoration: none; padding: 0; }
.desktop-menu a:hover,.menu a:focus { color: var(--color7); background: transparent; text-decoration: none; }
.desktop-menu a.level1 { font-family: var(--font-serif); font-weight: 700; line-height: 1; border: 0; }
.desktop-menu a.level1-services::after { content: ""; }
.desktop-menu a.level1-sectors::after { content: ""; }
.desktop-menu a.level1-sectors.active::after { content: ""; }
.desktop-menu a.level1-services.active::after { content: ""; }
.desktop-menu a.level1-sectors.active { color: var(--color7); }
.desktop-menu a.level1-services.active { color: var(--color7); }
#desktop-subnav-sectors-container, #desktop-subnav-services-container { display: none; position: fixed; top: 100px; width: 100%; padding: 0 0 0 40px; background: rgba(var(--color7rgb),0.5); z-index: 9999; }
.desktop-submenu-container { max-width: var(--width-normal); margin: 0 auto; }
.desktop-submenu { display: flex; list-style: none; line-height: 1; padding: 15px 0 15px 110px; margin: 0; }
.desktop-submenu li { padding-right: var(--gap-l); border-right: 1px solid var(--color2); margin-right: var(--gap-l); }
.desktop-submenu li:last-of-type { border-right: 0; }
.desktop-submenu a { font-weight: 700; text-decoration: none; }
.desktop-submenu a:hover, .desktop-submenu a:focus { color: var(--color4); }

#desktop-search { display: none; position: absolute; top: 10px; right: 0; left: 0; width: 100%; height: 80px; padding-right: 0; z-index: 999; background: transparent; }
.form-search { display: flex; height: 50px; border-bottom: 2px solid var(--color4); margin-left: 80px; background: var(--color1); }
}

@media only screen and (min-width: 1024px) {
#desktop-subnav-sectors-container, #desktop-subnav-services-container { padding: 0 50px; }
}

/*HERO*/
.hero picture { width: 100%; margin: 0; }
.hero picture img { width: 100%; }
.hero video { width: 100%; height: auto; padding: 0; border: 0; margin: 0; object-fit: fill; }
.hero-video-mobile { display: block; }
.hero-video-desktop { display: none; }
@media only screen and (min-width: 800px) {
.hero-video-mobile { display: none; }
.hero-video-desktop { display: block; }
}
.hero-slider-wrapper { position: relative; }

/*HEADER*/
.header-text { padding: 0; margin: 0 auto; }
.header-text p { font-size: var(--text-xl); }
p.header-tagline { font-size: var(--text-xxl); line-height: 1.2; margin-bottom: var(--gap-m); }
p.header-tags { margin-top: var(--gap-m); margin-bottom: 0; }
@media only screen and (min-width: 600px) {
.Xheader-text { padding: 0 calc( var(--gap-5xl) * 1 ); }
.header-text { max-width: 588px; }
}
@media only screen and (min-width: 1024px) {
.Xheader-text { padding: 0 calc( var(--gap-5xl) * 3 ); }
.header-text { max-width: 800px; }
}

/*HOME*/
.home { display: grid; column-gap: var(--gap-3xl); grid-template-columns: 1fr; margin-bottom: var(--gap-l); }
.home-heading { font-family: var(--font-sans-serif); font-size: var(--text-xxxl); font-weight: 400; margin-bottom: var(--gap-xl); }
@media only screen and (min-width: 768px) {
.home-heading { max-width: 60%; }
}
@media only screen and (min-width: 1024px) {
.home-heading { max-width: 100%; }
}
.home-sectors-services { display: grid; column-gap: var(--gap-xl); grid-template-columns: 1fr 1fr; }
.home-sectors-services a { text-decoration: none; }
.home-sectors-services a:hover, .home-sectors-services a:focus { text-decoration: none; }
@media only screen and (min-width: 1024px) {
.home { grid-template-columns: 1fr 1fr; }
.home-sectors-container, .home-services-container { display: flex; gap: var(--gap-xl); flex-wrap: nowrap; }
}
.home-sectors-heading, .home-services-heading { font-size: var(--text-sm); font-weight: 700; line-height: 1.2; }
.home-sectors-list, .home-services-list { font-size: 16px; list-style: none; padding-left: var(--gap-s); border-left: 2px solid var(--color2); margin: 0; white-space: nowrap; }
.home-sectors-list li, .home-services-list li { margin-bottom: var(--gap-xs); }

/*ARTICLES*/
.articles-grid { display: grid; gap: var(--gap-m); grid-template-columns: 1fr; }
@media only screen and (min-width: 576px) {
.articles-grid { gap: var(--gap-l); grid-template-columns: 1fr 1fr; }
}
@media only screen and (min-width: 1024px) {
.articles-grid { gap: var(--gap-2xl); grid-template-columns: 1fr 1fr; }
}
.articles.item { position: relative; margin-bottom: 20px; }
.articles.item h2 { position: absolute; bottom: var(--gap-m); left: 0; max-width: 420px; color: var(--color1); text-decoration: none; padding: var(--gap-s); background: rgba(var(--color8rgb),0.75); }
.articles.item:hover h2 { color: var(--color7); }

/*ARTICLE*/
.masonry-item { margin-bottom: var(--gap-l); }
@media only screen and (min-width: 576px) {
.article-grid { position: relative; max-width: 100%; margin-bottom: var(--gap-xl); margin-left: 0; }
.masonry-sizer, .masonry-item { width: calc( 50% - 10px ); }
.masonry-item { float: left; height: auto; }
}

.article-item-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.article-item-video-wrapper { position: relative; width: 100%; height: 100%; padding-bottom: 56.25%; /* 16:9 */ height: 0; }
.article-item-video-wrapper iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.article-item-text { color: var(--color1); padding: var(--gap-m); background: var(--color8); }
.article-item-text h2 { font-family: var(--font-sans-serif); font-size: var(--text-xxl); font-weight: 600; color: var(--color2); }
.article-item-text a { color: var(--color-7); }
.article-item-text a:hover, .article-item-text a:focus { color: var(--color4); }
.article-cats, .article-tags { display: flex; flex-wrap: wrap; column-gap: var(--gap-s); margin-bottom: var(--gap-s); }
.article-cats dt, .article-tags dt { min-width: 100px; flex-basis: 100%; margin-bottom: var(--gap-xs); }

/*ARTICLE ALSO*/
.also {  }
.also-heading { font-family: var(--font-sans-serif); font-size: var(--text-xxxxl); text-align: center; margin-bottom: var(--gap-l); }
.also-item { display: grid; grid-template-columns: 1fr; margin-bottom: var(--gap-l); }
.also-item-text a { color: var(--color-7); text-decoration: none; }
.also-item-text a:hover, .also-item-text a:focus { color: var(--color7); }
@media only screen and (min-width: 576px) {
.also-item { grid-template-columns: 1fr 1fr; }
}
.also-item-text { color: var(--color1); padding: var(--gap-m) var(--gap-m) 0 var(--gap-m); background: var(--color8); }
.also-item-image img { display: block; object-fit: fill; }

/*ARTICLE RELATED*/
.related { color: var(--color1); }
.related a { color: var(--color1); }
.related a:hover, .related a:focus { color: var(--color7); }
.related-heading { font-family: var(--font-sans-serif); font-size: var(--text-xxxxl); text-align: center; margin-bottom: var(--gap-l); }
.related-grid { display: grid; gap: var(--gap-l); grid-template-columns: 1fr; }
@media only screen and (min-width: 576px) {
.related-grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
@media only screen and (min-width: 768px) {
.related-grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

/*ABOUT*/
.about-grid {display: grid; gap: var(--gap-l) var(--gap-xl); grid-template-columns: 1fr; }
.about-item-image { text-align: center; }
.about-item-image img { max-width: 270px; }
.about-item-text h2 { font-family: var(--font-sans-serif); font-size: var(--text-xxl); font-weight: 600; }
.about-item-text h3, .about-item-text h4 { font-family: var(--font-sans-serif); font-size: var(--text-xl); font-weight: 700; }

@media only screen and (min-width: 768px) {
.about-grid { grid-template-columns: 1fr 2fr; }
.about-item-image img { max-width: 320px; }
}
@media only screen and (min-width: 1024px) {
.about-grid { grid-template-columns: 1fr 1fr; }
.about-item-image img { max-width: 420px; }
}

.about-slider-wrapper { position: relative; padding: 0 0; margin: 0 auto; }
.about-slider { margin: 0 auto; }
@media only screen and (min-width: 600px) {
.about-slider { max-width: 588px; }
}

@media only screen and (min-width: 1024px) {
.about-slider { max-width: 800px; }
}

.client-item-image { height: 80px; text-align: center; margin-bottom: var(--gap-l); }
.client-item-image img { height: 80px; }
.client-item-image svg { width: auto; height: 80px; }
.client-item-image svg:hover .st0 { fill: red; }
.client-item-text p { margin-bottom: var(--gap-s); }

/*PAGINATION*/
.pagination { padding: var(--gap-l); }
.pagination-links { display: flex; align-content; center; justify-content: center; gap: var(--gap-l); font-family: var(--font-serif); font-weight: 500; list-style: none; margin: 0; }
.pagination-links a { color: var(--color8); }
.pagination-links a:hover { color: var(--color4); }
.previous::before { content: "< "; }
.next::after { content: " >"; }
.previous:hover, .next:hover { color: var(--color4); }

/*CONTACT PAGE*/
.findus-address { margin-bottom: var(--gap-s); }
.findus-phone { margin-bottom: var(--gap-s); }
.findus-phone::before { content: "T: "; }
.findus-email { margin-bottom: var(--gap-s); }
.findus-email::before { content: "E: "; }

/*FOOTER*/
.footer { color: var(--color8); }
.footer a { color: var(--color8); text-decoration: none; }
.footer a:hover, .footer a:focus { color: var(--color7); }
.footer-logos { display: flex; gap: var(--gap-m); align-items: flex-end; list-style: none; margin-left: 0; }
.footer-logo-fit svg { display: block; width: 60px; height: 60px; transition: 0.5s; fill: var(--color8); }
.footer-logo-fit svg:hover { fill: var(--color7); }
.footer-logo-living-wage svg {display: block; height: 60px; transition: 0.5s; }
.path1, .path2, .path3, .path4, .path5 { transition: 0.5s; }
.footer-logo-living-wage svg:hover .path3 { fill: #C31230; }
.footer-logo-living-wage svg:hover .path1 { fill: #C31230; }
.footer-logo-living-wage svg:hover .path2 { fill: #C31230; }
.footer-logo-living-wage svg:hover .path3 { fill: #990622; }
.footer-logo-living-wage svg:hover .path4 { fill: #990622; }
.footer-logo-living-wage svg:hover .path5 { fill: #990622; }
.footer-logo-social svg { display: block; width: 30px; height: 30px; fill: var(--color2); transition: 0.5s; }
.footer-logo-social svg:hover .path1 { fill: #C31230; }
.footer-links { display: flex; list-style: none; font-size: var(--text-sm); line-height: 1; margin-left: 0; }
@media only screen and (min-width: 768px) {
.footer-links { font-size: var(--text-base); }
}
.footer-links li { padding-right: var(--gap-s); border-right: 1px solid var(--color8); margin-right: var(--gap-s); }
.footer-links li:last-of-type { border: 0; }
.footer-credit { font-size: var(--text-xs); color: var(--color4);}
@media only screen and (min-width: 768px) {
.footer-credit { font-size: var(--text-sm); }
}
.footer-credit-link { display: inline-block; line-height: 1; padding-left: var(--gap-s); margin-left: var(--gap-s); border-left: 1px solid var(--color4);  } 

/*LINKS*/
.link { display: inline-block; font-weight: 700; text-decoration: none; border-radius: 60px; }
.link:hover, .link-focus { text-decoration: none; }
.link-pri { color: var(--color1); background: var(--color5); }
.link-pri:hover, .link-pri:focus { color: var(--color8); background: var(--color7); }
.link-sec { color: var(--color8); background: var(--color9); }
.link-sec:hover, .link-sec:focus { color: var(--color8); background: var(--color10); }
.link-l { height: 50px; font-size: 1rem; line-height: 50px; padding: 0 50px; }
.link-m { height: 40px; font-size: 0.925rem; line-height: 40px; padding: 0 1.5rem; }
.link-s { height: 30px; font-size: 0.85rem; line-height: 30px; padding: 0 1.5rem; }

/*ALERTS*/
.alert { padding: var(--gap-s); margin-bottom: var(--gap-l); }
.alert-success { background: #FFFF00; }

/*UTILITIES*/
.search-results-heading { font-family: var(--font-sans-serif); font-size: var(--text-base); font-weight: 400; }
.text-right { text-align: right; }
.skiplink { position: absolute; top:-999em; }
.capitalise { letter-spacing: 1px; text-transform: uppercase; }
a[href=""] { text-decoration: line-through; }

/*SLIDER*/
.hero-slider div { width: 100%; height: auto; }
.about-slider { overflow: hidden; }
.about-slider div { width: 100%; height: auto; }
X.button[data-controls=prev],button[data-controls=next] { font-family: var(--font-serif); font-weight: 500; color: var(--color8); letter-spacing: 1px; text-transform: uppercase; background: transparent; }
X.button[data-controls=prev]:hover,button[data-controls=next]:hover { color: var(--color4); }
X.button[data-controls=prev]::before { content: "< "; }
X.button[data-controls=next]::after { content: " >"; }
/*hero slider prev next*/
button.hero-slider-button { position: absolute; top: 0; width: 60px; height: 100%; background: transparent; transition: 0.25s; z-index: 9999; }
button.hero-slider-button span { position: absolute; left: 999em; }
button.hero-slider-button:hover { background: rgba(0,0,0,0.5); }
button.hero-slider-prev { left: 0; color: transparent; }
button.hero-slider-prev::before { content: "\276C"; font-size: 50px; }
button.hero-slider-prev:hover { color: white; }
button.hero-slider-next { right: 0; color: transparent; }
button.hero-slider-next::after { content: "\276D"; font-size: 50px; }
button.hero-slider-next:hover { color: white; }

/*about slider prev next*/
button.about-slider-button { position: absolute; top: 0; width: 60px; height: 100%; background: transparent; transition: 0.25s; z-index: 9999; }
button.about-slider-button span { position: absolute; left: 999em; }
button.about-slider-button:hover { background: rgba(0,0,0,0.5); }
button.about-slider-prev { left: 0; color: transparent; }
button.about-slider-prev::before { content: "\276C"; font-size: 50px; }
button.about-slider-prev:hover { color: white; }
button.about-slider-next { right: 0; color: transparent; }
button.about-slider-next::after { content: "\276D"; font-size: 50px; }
button.about-slider-next:hover { color: white; }

.about-slider-wrapper:hover button.about-slider-button { color: white; background: rgba(0,0,0,0.5); }

@media only screen and (max-width: 1024px) {
button.about-slider-button { display: none; background: rgba(0,0,0,0.5); }
button.about-slider-prev { color: white; }
button.about-slider-next { color: white; }
}