/** * Theme Name: Ecosave365 * Description: Ecosave365 * Author: Mike Salkeld * Author URI: https://ecosave365.co.uk/ * Version: 2.0 **/ :root { --pale: #FFFFFF; --greenyellow: #BAFF29; --green: #14DC8C; --turquoise: #009696; --blue: #141E64; --dark: #000000; --heading: var(--green); --heading-sub: var(--blue); --pale-grey: rgb(241, 241, 241); --pale-blue: rgb(173, 243, 215); --pale-green: rgb(227, 255, 169); --section-1: var(--turquoise); --section-2: var(--green); --section-3: var(--blue); --link-bg: linear-gradient(45deg, var(--turquoise), var(--green)); --over-bg: linear-gradient(45deg, var(--green), var(--greenyellow)); --button: transparent linear-gradient(45deg, var(--turquoise), var(--green) 51%, var(--greenyellow)) var(--x,0) / 200%; --notice: #FAD20A; --link: var(--blue); --over: var(--turquoise); --orange: #F09400; --pink: #B4005A; --red: #D40000; --field: var(--pale); --alert: crimson; --invalid: crimson; --valid: green; --prefix: gainsboro; --suffix: silver; --panel: whitesmoke; --form: honeydew; --repeater: rgba(0,0,0,0.05); --inner: 43.5rem; --indent: 1rem; --nav: 10rem; --nav-shadow: 8rem; --nav-cta: 4rem; --nav-logo: 6rem; --gap: 1rem; --gap-text: 0.3rem; --margin: 1rem; --padding: 1rem; --pad: calc(var(--padding) / 2); --space: 1rem; --radius: 0.5rem; --radius-half: 0.25rem; --radius-full: 3rem; --border: gainsboro solid thin; --outline: gainsboro solid thin; --shadow: 0 0 1rem 0 rgba(0,0,0,0.15); --overlay: rgba(20,30,100,0.9); --overlay-over: rgba(0,150,150,0.9); --ipad-portrait: 1640px; --ipad-landscape: 2360px; } @keyframes buttons { from {background-color: #BAFF29;} to {background-color: #14DC8C;} } @keyframes pulsate { from {background-color: #14DC8C;} to {background-color: #FFFFFF;} } * {box-sizing: border-box; font: 1rem/1.5rem 'Inter Tight', sans-serif; font-weight: 400; margin: 0; padding: 0; text-wrap: balance;} html {scroll-behavior: smooth; scroll-padding-top: 10rem;} body {background-color: var(--pale); color: var(--dark); display: flex; flex-direction: column; font-weight: 400; height: 100%; min-height: 100vh; overflow-x: hidden; overflow-y: visible; position: relative; width: 100%;} body.shadow {scroll-padding-top: 8rem;} abbr {font-size: inherit;} pre {background-color: var(--pale); color: var(--dark); height: fit-content; inset: 0 auto auto 0; max-height: 100dvh; padding: var(--padding); outline: var(--alert) solid medium; overflow: auto; white-space: pre; width: fit-content;} pre hr {display: block;} input#menu_toggle {left: -100% !important; position: absolute !important;} p#skip {left: 100vw; position: absolute;} .hide {height: 0; left: -100vw; margin: 0; overflow: hidden; padding: 0; position: absolute; visibility: hidden; width: 0;} h1 {color: var(--heading); font-size: 3.0rem; font-weight: 900; line-height: 3.0rem; position: relative; width: 100%;} h2 {color: var(--heading-sub); font-size: 2.2rem; font-weight: 900; line-height: 2.6rem; position: relative; width: 100%; z-index: 9;} h3 {color: var(--heading-sub); font-size: 1.6rem; font-weight: 600; line-height: 2.2rem; position: relative; width: 100%;} h4 {color: var(--heading-sub); font-size: 1.4rem; font-weight: 600; line-height: 2.0rem; position: relative; width: 100%;} h5 {color: var(--heading-sub); font-size: 1.2rem; font-weight: 600; line-height: 2.0rem; position: relative; width: 100%;} h6 {color: var(--heading-sub); font-size: 1.1rem; font-weight: 600; line-height: 2.0rem; position: relative; width: 100%;} p {font-size: 1.1rem; width: 100%;} br, hr {display: none;} q {font-size: inherit; font-style: inherit;} a {font-size: inherit; text-decoration: none;} fieldset[id^='fieldset_'] {display: flex; padding: var(--padding);} fieldset[id^='fieldset_']:valid {background-color: var(--valid);} fieldset[id^='fieldset_']:invalid {background-color: var(--invalid);} .button a, button, input.wpcf7-submit, summary {background: transparent linear-gradient(45deg, var(--button-start), var(--button-middle) 51%, var(--button-end)) var(--x,0) / 200%; transition: background 0.5s ease-in-out;} .button a:focus, .button a:hover, button:focus, button:hover, input.wpcf7-submit:focus, input.wpcf7-submit:hover, summary:focus, summary:hover {--x: 100%;} img, picture {display: block; height: 100%; min-height: 2rem; min-width: 2rem; object-fit: cover; width: 100%;} svg {display: block; height: 100%; min-height: 2rem; min-width: 2rem; width: 100%;} strong {font-weight: 600;} small {font-size: small;} form {background-color: var(--panel); border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); margin: 0 auto; max-width: var(--limit); padding: var(--padding);} form:has(> label) {gap: var(--gap);} fieldset {border: var(--border); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding); position: relative;} label {color: var(--dark); display: flex; flex-direction: column-reverse;} fieldset#finance label span.wpcf7-form-control-wrap {display: flex; flex-direction: row;} fieldset#finance label.price span.wpcf7-form-control-wrap::before {background-color: var(--dark); color: var(--pale); content: '£'; display: block; text-align: center; width: 2rem;} p.inner {align-items: center; display: flex; gap: var(--gap); justify-content: space-between;} p.inner span:not([class]) {flex: 1;} p.inner span.wpcf7-form-control-wrap {flex: 1;} p.inner span.wpcf7-form-control-wrap span.wpcf7-radio {display: flex; gap: var(--gap); justify-content: space-between;} span.wpcf7-list-item-label {align-items: center; display: flex; user-select: none; white-space: nowrap;} .scroll {border-radius: var(--radius); display: block; height: 100%; overflow-x: auto; overflow-y: visible;} table {border-collapse: collapse; background-color: var(--panel); border-radius: var(--radius); border-spacing: var(--gap); overflow: hidden;} table caption {display: none; margin: 0 0 var(--margin) 0; text-align: left;} table th, table td {text-align: left; vertical-align: top; width: 1%;} table thead th {font-weight: 600; padding: var(--padding);} table thead td {padding: var(--padding);} table tbody th {font-weight: 600; padding: var(--padding);} table tbody td {padding: var(--padding);} table tbody tr:nth-child(odd) {background-color: var(--repeater);} table label {flex-direction: column;} table span.wpcf7-radio {display: flex; flex-direction: row; gap: var(--gap);} input[name='toughened[]'] + span.wpcf7-list-item-label {display: none;} .forminator-col.units > label {left: -100vw; position: absolute;} .forminator-all-group-copies {counter-reset: indexer; display: flex; flex-direction: column; gap: var(--gap);} .forminator-grouped-fields {align-items: end; counter-increment: indexer; display: flex; gap: var(--gap); width: 100%;} label span {display: flex; flex: 1;} label span:has(> sup) {gap: 0;} label span a {margin: 0 var(--gap-text);} label span small {display: flex; font-size: small; line-height: inherit; opacity: 0.5;} input {accent-color: var(--link); background-color: var(--field); border: var(--border); border-radius: var(--radius-half); display: block; height: 3rem; padding: var(--pad) var(--padding); width: 100%;} input:focus, textarea:focus {border: var(--link) solid thin; outline: none;} select {appearance: none; background: var(--field) url('svg/components/select.svg') right var(--pad) center no-repeat; border: var(--border); border-radius: var(--radius-half); color: var(--dark); display: block; height: 3rem; line-height: 1.5rem; padding: var(--pad) var(--padding); width: 100%;} option {color: var(--dark);} button, input:hover {accent-color: var(--over);} input[type='date'] {padding: var(--pad);} input[type='file'] {cursor: pointer; height: 3rem; padding: var(--pad);} input[type='checkbox'], input[type='radio'] {height: 1.5rem; width: 1.5rem;} label.gbp span.wpcf7-form-control-wrap {display: flex; flex-direction: row;} label.gbp span.wpcf7-form-control-wrap::before {background-color: gainsboro; border-radius: var(--radius-half) 0 0 var(--radius-half); color: var(--dark); content: '£'; font-size: 0.8rem; height: 100%; text-align: center; width: 3rem;} label.gbp span.wpcf7-form-control-wrap input {border-radius: 0 var(--radius-half) var(--radius-half) 0;} label.qty span.wpcf7-form-control-wrap {display: flex; flex-direction: row;} label.qty span.wpcf7-form-control-wrap::before {background-color: gainsboro; border-radius: var(--radius-half) 0 0 var(--radius-half); color: var(--dark); content: 'QTY'; font-size: 0.8rem; height: 100%; text-align: center; width: 3rem;} label.qty span.wpcf7-form-control-wrap input {border-radius: 0 var(--radius-half) var(--radius-half) 0;} label.mm span.wpcf7-form-control-wrap {display: flex; flex-direction: row;} label.mm span.wpcf7-form-control-wrap::after {background-color: gainsboro; border-radius: 0 var(--radius-half) var(--radius-half) 0; color: var(--dark); content: 'MM'; font-size: 0.8rem; height: 100%; text-align: center; width: 3rem;} label.mm span.wpcf7-form-control-wrap input {border-radius: var(--radius-half) 0 0 var(--radius-half);} body.page-complaint form.wpcf7-form {display: flex; flex-direction: column; gap: var(--gap);} body.page-complaint form.wpcf7-form fieldset {display: flex; flex-direction: column; gap: var(--gap);} body.page-complaint form.wpcf7-form fieldset ~ fieldset {margin: var(--margin) 0 0 0;} body.page-complaint form.wpcf7-form fieldset legend {font-size: 1.2rem; margin: 0 0 var(--margin) 0;} body.page-complaint form.wpcf7-form fieldset label {flex-direction: column-reverse; gap: 0;} label span.wpcf7-form-control-wrap {gap: 0;} span.wpcf7-checkbox label, span.wpcf7-radio label {cursor: pointer;} span.wpcf7-checkbox label span, span.wpcf7-radio label span {align-items: center; display: flex;} textarea {background-color: var(--field); border: var(--border); border-radius: var(--radius-half); display: block; height: 12rem; padding: var(--pad) var(--padding); resize: vertical; width: 100%;} button, input[type='submit'] {background-color: var(--link); filter: grayscale(0); opacity: 1; transition: background-color 0.3s ease-in-out, filter 0.3s ease-in-out, opacity 0.3s ease-in-out;} button:disabled, input[type='submit']:disabled {cursor: not-allowed; filter: grayscale(1); opacity: 0.25;} button, input[type='submit'], li#menu_toggle label {border: 0 none; border-radius: var(--radius-half); color: var(--pale); cursor: pointer; display: block; height: 3rem; padding: var(--pad); text-align: center; transition: background-color 0.3s ease-in-out; width: 100%;} button:focus, button:hover, input[type='submit']:not([disabled]):focus, input[type='submit']:not([disabled]):hover {transition: background-color 0.3s ease-in-out;} sup {font-size: small;} ul.asterisk {display: flex; gap: var(--gap); flex-direction: row; list-style: none; margin: 0;} ul.asterisk li {font-size: small;} nav#nav_primary {align-items: center; background-color: var(--pale); box-shadow: none; display: grid; gap: 0; height: var(--nav-shadow); justify-content: space-between; min-height: 8rem; position: sticky; top: 0; /* transition: box-shadow 0.5s ease-in-out, height 0.3s ease-in-out; */ width: 100%; z-index: 999;} nav#nav_primary ul {list-style: none;} nav#nav_primary ul#cta {align-items: center; background-color: var(--section-3); display: flex; gap: var(--gap); grid-area: cta; justify-content: space-between; min-height: 4rem; padding: var(--pad) var(--padding); width: 100%;} nav#nav_primary ul#cta li {color: var(--pale);} nav#nav_primary ul#cta a {align-items: center; border-radius: var(--radius); color: var(--pale); display: inline-flex; font-size: 1.2rem; font-weight: 600; gap: var(--gap); transition: color 0.3s ease-in-out;} nav#nav_primary ul#cta a:focus, nav#nav_primary ul#cta a:hover {--x: 100%; color: var(--greenyellow);} nav#nav_primary ul#cta a span {font-size: inherit;} nav#nav_primary ul#cta svg {height: 2rem; width: 2rem;} nav#nav_primary ul#cta li.cta a {background-color: var(--greenyellow); border-radius: 2rem; color: var(--section-3); display: block; font-size: 1.25rem; font-weight: 900; line-height: 1rem; min-height: 2rem; padding: var(--pad) var(--padding); text-align: center;} nav#nav_primary ul#cta li.cta a:focus, nav#nav_primary ul#cta li.cta a:hover {color: var(--turquoise);} nav#nav_primary a#logo {align-items: center; display: flex; grid-area: logo; height: 4rem; padding: var(--pad) var(--padding); transition: height 0.3s ease-in-out, width 0.3s ease-in-out; width: 11rem;} nav#nav_primary a#logo svg {aspect-ratio: 512/176; display: block; height: 3rem; transition: height 0.3s ease-in-out, width 0.3s ease-in-out; transform-origin: center left; width: 9rem;} nav#nav_primary a#logo svg g#dyk {opacity: 1; transition: opacity 0.3s ease-in-out;} nav#nav_primary.shadow {box-shadow: var(--shadow); height: var(--nav-shadow);} nav#nav_primary.shadow a#logo {height: 4rem; width: 11rem;} nav#nav_primary.shadow a#logo svg {height: 3rem; width: 9rem;} nav#nav_primary .nav-primary {display: none; flex-direction: column; gap: var(--gap); grid-area: nav; min-height: 4rem;} nav#nav_primary .nav-primary ul {display: flex; flex-direction: column; gap: var(--gap);} nav#nav_primary .nav-primary li.current-menu-item a, nav#nav_primary .nav-primary li.current_page_item a {--x: 100%; color: var(--over);} nav#nav_primary .nav-primary a {display: block; border-radius: 1rem; color: var(--link); font-weight: 700; line-height: 2rem; min-height: 2rem; padding: 0 var(--padding); text-align: center; transition: color 0.3s ease-in-out;} nav#nav_primary .nav-primary a:focus, nav#nav_primary .nav-primary a:hover {color: var(--over);} form#searchform {display: flex; flex-direction: row; gap: 0; padding: 0;} form#searchform input {border-radius: var(--radius) 0 0 var(--radius); flex: 1;} form#searchform button {border-radius: 0 var(--radius) var(--radius) 0; max-width: 4rem; padding: var(--pad) var(--padding); width: 100%;} input#menu_toggle ~ nav#nav_primary {grid-template-areas: 'cta cta' 'logo toggle'; grid-template-columns: 1fr 4rem; grid-template-rows: 4rem 4rem;} input#menu_toggle ~ nav#nav_primary.shadow {grid-template-rows: var(--nav-cta) 4rem;} input#menu_toggle ~ nav#nav_primary .nav-primary {/* display: none; */ height: 0; overflow: hidden;} input#menu_toggle ~ nav#nav_primary label {align-items: center; cursor: pointer; display: flex; grid-area: toggle; height: 4rem; justify-content: center; padding: var(--padding); width: 4rem;} /* input#menu_toggle ~ nav#nav_primary.shadow label {height: 4rem;} */ input#menu_toggle ~ nav#nav_primary label svg {display: block; height: 2rem; max-height: 2rem; max-width: 2rem; width: 2rem;} input#menu_toggle:checked ~ nav#nav_primary {gap: 0; grid-template-areas: 'cta cta' 'logo toggle' 'nav nav'; grid-template-rows: 4rem 4rem auto; height: 100dvh; width: 100%;} input#menu_toggle:checked ~ nav#nav_primary .nav-primary {align-items: center; background-color: var(--pale); display: flex; height: calc(100dvh - 8rem); justify-content: center; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--padding) var(--padding) var(--padding);} input#menu_toggle:checked ~ nav#nav_primary label {background: transparent url('svg/components/close.svg') center center no-repeat; background-size: 2rem; content: ''; display: block; height: 4rem; position: absolute; top: 0; width: 4rem;} input#menu_toggle:checked ~ nav#nav_primary.shadow label {height: 4rem;} input#menu_toggle:checked ~ nav#nav_primary label svg {display: none; visibility: hidden;} blockquote#notice {background-color: var(--notice) !important; grid-column: 1/-1; padding: var(--padding); text-align: center; width: 100%;} blockquote#notice * {font-size: 1rem; text-wrap: auto;} blockquote#notice details[open] summary {margin: 0 0 var(--margin) 0;} blockquote#notice a {color: var(--over); font-size: inherit;} blockquote#notice a:focus, blockquote#notice a:hover {color: var(--over); text-decoration: underline;} .cols {display: flex; flex-direction: column; gap: calc(var(--gap) * 2); width: 100%;} .cols > * {flex: 1;} .cols label {gap: 0;} .text_left {display: flex; flex-direction: column; gap: var(--gap);} .text_right {display: flex; flex-direction: column; gap: var(--gap);} #didyouknow {align-items: center; background-color: var(--blue); border: 0 none; color: var(--pale); display: flex; flex-direction: column; gap: var(--space); height: 0; min-height: 0; overflow: hidden; transition: min-height 0.3s ease-in-out; width: 100%; z-index: 9999;} #didyouknow.target, #didyouknow:target {height: fit-content; min-height: 100dvh; scroll-padding-top: 10rem;} #didyouknow span {background-color: var(--pale); border-radius: 0 0 var(--radius) var(--radius); padding: var(--padding);} #didyouknow span svg {margin: 0 var(--margin); max-height: 4rem; max-width: 12rem;} #didyouknow > div {align-items: center; display: flex; flex: 1; flex-direction: column; gap: calc(var(--space) * 2); justify-content: center; max-width: var(--limit); padding: 0 var(--space); width: 100%;} #didyouknow h2 {color: var(--greenyellow); font-size: 4rem; line-height: 4rem; text-align: center;} #didyouknow h3 {color: var(--pale); text-align: center; width: fit-content;} #didyouknow p {color: var(--green); text-align: center; width: fit-content;} #didyouknow em::before, #didyouknow em::after {background-color: var(--green) !important; color: var(--green);} #didyouknow ol {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fit,minmax(12rem,1fr)); list-style: none; width: 100%;} #didyouknow li {border-radius: var(--radius); border: var(--greenyellow) solid medium; display: flex; flex-direction: column; gap: var(--gap); justify-content: flex-start; padding: var(--padding);} #didyouknow li img, #didyouknow li svg {color: var(--greenyellow); object-fit: contain; height: 4rem; width: 4rem;} #didyouknow strong {color: var(--pale); font-size: 1.5rem; line-height: 2rem;} #didyouknow > img {display: block; height: 100%; min-height: 100dvh; object-fit: cover; object-position: center; position: absolute; width: 100%; z-index: -1;} #didyouknow a {color: var(--green); display: block; margin: 0 auto; padding: var(--space) 0; transition: color 0.3s ease-in-out;} #didyouknow a:focus, #didyouknow a:hover {color: var(--pale);} #didyouknow div + svg, #didyouknow a svg {color: inherit; max-width: 4rem;} main {background-color: var(--turquoise); display: flex; flex-direction: column; flex: 1; gap: var(--gap); margin: 0 auto; width: 100%;} article {display: flex; flex-direction: column; grid-area: article; height: 100%; overflow: hidden;} header {background-color: var(--section-2); background-position: top center; background-repeat: no-repeat; background-size: cover; display: none; flex-direction: column; gap: var(--gap); min-height: 50dvh; overflow: hidden; padding: 8rem var(--padding) 12rem var(--padding); position: relative;} header:has(> *) {display: flex;} header .trustpilot-widget {background-color: var(--pale); border-radius: var(--radius-half); display: flex; flex-direction: column; margin: var(--margin); padding: var(--padding) var(--pad) var(--pad) var(--pad);} header h1 {color: var(--pale); text-align: center;} header > img, header > picture {height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; z-index: 0;} header:has(figure#header_cta) > img, header:has(figure#header_cta) > picture {filter: brightness(0.60);} header svg {display: block; height: 100%; margin: 0 auto; width: 100%;} header figure {padding: var(--padding); position: relative;} header figure img {display: block; height: 100%; max-height: 10rem; max-width: 10rem; object-fit: cover; object-position: center; width: 100%;} header figure#header_feature {backdrop-filter: opacity(50%); margin: var(--space); max-width: 12rem; position: absolute; z-index: 9;} header figure#header_feature figcaption {display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding); z-index: 99;} header figure#header_feature figcaption a {background-color: var(--greenyellow); border-radius: 2rem; color: var(--section-2); display: block; font-size: 2rem; font-weight: 600; height: 4rem; line-height: 2rem; padding: var(--padding);} header figure#header_cta {display: flex; flex-direction: column; gap: var(--space); margin: 0 auto; max-width: 24rem; position: relative; width: fit-content !important; z-index: 99;} header figure#header_cta img, header figure#header_cta svg {margin: 0 auto; max-width: 16rem; width: 100%;} header figure#header_cta figcaption {display: flex; flex-direction: column; gap: var(--space); text-align: center;} header figure#header_cta figcaption a {background-color: var(--greenyellow); border-radius: 2rem; color: var(--blue); display: block; font-size: 1.6rem; font-weight: 900; min-height: 4rem; line-height: 2rem; margin: 0 auto; padding: var(--padding); transition: color 0.3s ease-in-out; width: fit-content;} header figure#header_cta figcaption a:focus, header figure#header_cta figcaption a:hover {color: var(--turquoise);} header figure#header_cta figcaption h2 {color: var(--pale);} article h1 {margin: 0 auto var(--margin) auto; max-width: var(--limit); text-align: center; width: 100%;} article ol {display: flex; flex-direction: column; gap: var(--gap); margin: 0 0 0 var(--margin); padding: 0 0 0 var(--indent); width: 100%;} article ul {display: flex; flex-direction: column; gap: var(--gap); margin: 0 0 0 var(--margin); padding: 0 0 0 var(--indent); width: 100%;} article ol ol, article ol ul {list-style-type: disc; margin: var(--margin) 0 0 var(--margin); width: auto;} article ol a:focus, article ol a:hover, article ul a:focus, article ul a:hover {text-decoration: underline;} ol#policy {gap: var(--gap);} ol#policy ol, ol#policy ul {margin: var(--margin) 0 0 var(--margin);} section {align-items: center; display: flex; flex-direction: column; gap: 0; justify-content: center; max-width: 100vw; padding: var(--space); position: relative; width: 100%;} section:has(h1:empty), section:empty {display: none;} a.button {animation: 2s buttons infinite alternate; position: relative;} p a.button.arrows-left, p a.button.arrows-right {margin-block: var(--space) !important;} .arrows-right::after, .arrows-left::before {animation: 1s pulsate infinite alternate;} .arrows-right::after {content: ''; display: block; height: 4rem; mask-image: url('https://ecosave365.co.uk/wp-content/uploads/2024/02/arrows_right.svg'); mask-repeat: no-repeat; mask-size: contain; position: absolute; right: -5rem; top: -1rem; width: 4rem;} .arrows-left::before {content: ''; display: block; height: 7rem; left: -5rem; mask-image: url('https://ecosave365.co.uk/wp-content/uploads/2024/02/arrows_left.svg'); mask-repeat: no-repeat; mask-size: contain; position: absolute; top: -2rem; width: 4rem;} body.error404 h1 {color: var(--pale);} section .tab {align-items: center; display: flex; height: 7rem; overflow: hidden; position: absolute; top: -7rem; transition: height 0.3s ease-in-out, top 0.3s ease-in-out;} section .tab svg {display: block; height: 7rem; object-fit: cover; object-position: bottom center; transition: height 0.3s ease-in-out, margin 0.3s ease-in-out; width: 160rem;} section .tab.left svg {margin: 1rem auto 0 -9rem;} section .tab.right svg {margin: 1rem auto 0 9rem;} section .tab svg path {fill: currentColor;} section:has(> .tab) {padding-top: 0;} section:has(+ section > .tab) {padding-bottom: 8rem; transition: padding-bottom 0.3s ease-in-out;} section > *:not(.tab) {margin: var(--margin); max-width: var(--inner); width: 100%;} .tiles {align-items: center; display: flex; flex-direction: column; justify-content: center; margin: -6rem 0 0 0; padding: var(--padding); position: relative; width: 100%;} .tiles ul {align-items: center; aspect-ratio: 43.5/23; border-radius: var(--radius); display: flex; flex-direction: column; gap: 0; height: 23rem; justify-content: space-between; list-style: none; padding: 0; position: relative; transition: margin 0.3s ease-in-out; z-index: 99; width: var(--inner);} section .tab.left + .tiles ul:has(li.left.large) {margin: -6rem 0 0 -9rem;} section .tab.left + .tiles ul:has(li.right.large) {margin: -6rem 0 0 9rem;} .tab.right + .tiles ul:has(li.right.large) {margin: 0 0 0 10rem;} .tiles li {align-items: center; background-repeat: no-repeat; background-size: cover; display: flex; mask-position: center; mask-repeat: no-repeat; padding: 0 !important; position: absolute;} .tiles li:first-child {position: absolute; top: 0;} .tiles li:last-child {position: absolute; bottom: 0;} .tiles li img {display: block; height: auto; mask-repeat: no-repeat; mask-size: auto auto; object-fit: cover; transition: object-position 0.3s ease-in-out; width: 100%;} .tiles li.left.large img {mask-image: url('svg/tiles/tile-left-large.svg');} .tiles li.left.small img {mask-image: url('svg/tiles/tile-left-small.svg');} .tiles li.right.large img {mask-image: url('svg/tiles/tile-right-large.svg');} .tiles li.right.small img {mask-image: url('svg/tiles/tile-right-small.svg');} .tiles li.left {align-items: flex-end; background-position: right; left: 0;} .tiles li.left img {object-position: left;} .tiles li.right {align-items: flex-start; background-position: left; right: 0;} .tiles li.right img {object-position: right;} .tiles li.large, .tiles li.large img {aspect-ratio: 32.5/23; max-height: 23rem; max-width: 32.5rem; width: 100%;} .tiles li.small, .tiles li.small img {aspect-ratio: 31/22; max-height: 11rem; max-width: 15.5rem; width: 100%;} section.code {padding: var(--space);} section#trustpilot {background-color: #edfbdd; min-height: auto; padding: var(--space);} section#trustpilot h2 {display: none;} section.content {background-color: var(--section-1); flex-direction: column !important; gap: var(--gap); padding: var(--space);} section.content h2 {color: var(--greenyellow);} section.content h3 {color: var(--section-1);} section.content ol, section.content ul, section.content p {color: var(--pale);} section.content a {color: var(--over);} section.content a:focus, section.content a:hover {text-decoration: underline;} section.content details p {color: var(--dark);} section.definitions {padding: var(--space);} section.prompts {flex-direction: column !important; padding: 0 !important;} section.prompts:has(h2) {padding: var(--space) 0 0 0 !important;} section.prompts > * {max-width: 100%;} section.prompts > h2 {margin: 0 auto; max-width: var(--limit); width: 100%;} section.prompts > p {margin: 0 auto; max-width: var(--limit); width: 100%;} section.prompts ol {align-items: center; display: flex; gap: var(--gap); height: 100%; justify-content: center; list-style: none; margin: 0; padding: 0; width: 100%;} section.prompts ol li {align-items: center; flex: 1; justify-content: center; width: 100%;} section.prompts ol a {align-items: center; background-color: var(--greenyellow); display: block; justify-content: center; padding: var(--space); width: 100%;} section.prompts ol a:focus, section.prompts ol a:hover {text-decoration: none;} section.prompts ol figure {align-items: center; border-radius: var(--radius-half); display: flex; flex-direction: column; gap: var(--gap); justify-content: center; margin: 0 auto; max-width: var(--limit); overflow: hidden; position: relative;} section.prompts ol img {height: calc(100% + 6rem); inset: -3rem -3rem; min-height: 50dvh; object-fit: contain;} section.prompts ol svg {height: 100%; max-height: 18rem; max-width: 18rem; min-height: 10rem; width: 100%;} section.prompts ol figure.column {flex-direction: column;} section.prompts ol figure.column-reverse {flex-direction: column-reverse;} section.prompts ol figure.row {flex-direction: column;} section.prompts ol figure.row-reverse {flex-direction: column-reverse;} section.prompts ol figure.solid {background-color: var(--turquoise);} section.prompts ol figure.solid img, section.prompts ol figure.solid svg {margin: var(--space); max-width: 15rem; min-height: fit-content;} section.prompts ol figure.solid figcaption {background-color: var(--pale); height: 100%; padding: var(--space);} section.prompts ol figure.solid figcaption h3 {font-size: 2.5rem; font-weight: 700; line-height: 2.5rem;} section.prompts ol figure.solid figcaption h4 {color: var(--turquoise); font-size: 2rem; line-height: 2.5rem;} section.prompts ol figure.solid figcaption p {background-color: transparent; line-height: 1rem; padding: 0;} section.prompts ol figure.solid figcaption p small {color: grey; font-size: small;} section.prompts ol figcaption {align-items: center; display: flex; flex-direction: column; gap: var(--gap); inset: 0; justify-content: center; z-index: 9;} section.prompts ol h2 {background-color: var(--dark); border-radius: var(--radius-half); color: var(--pale); font-size: 3rem; line-height: 3rem; padding: var(--padding);} section.prompts ol p {border-radius: var(--radius-half); color: var(--pale); font-size: 1.5rem; line-height: 2rem; padding: var(--padding);} section.prompts ol br {display: block;} section.steps {padding: var(--space);} section.steps ol {border: var(--border); border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); list-style: none; margin: 0; padding: var(--padding);} section.steps ol li {background-color: var(--panel); border-radius: var(--radius-half); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding);} section.features {padding: var(--space);} section.features .flexible ul {display: flex; gap: var(--gap); flex-direction: column; list-style: none; margin: 0; padding: 0; width: 100%;} section.features .flexible ul li {display: flex; gap: var(--gap);} section.features .flexible ul img {aspect-ratio: 3/2; border-radius: var(--radius-half); max-height: 50dvh; width: 100%;} section.features .flexible ul svg {color: var(--section-2); max-height: 4rem; max-width: 3rem;} section.features .flexible ul div {display: flex; flex: 1; flex-direction: column;} section.features .flexible ul h3 {font-size: 1.6rem;} section.features .flexible ul p {align-items: center; color: var(--pale); display: flex; flex-wrap: wrap; gap: var(--gap);} section.features .flexible ul p a {background-color: var(--link); border-radius: var(--radius-half); color: var(--pale); flex: 1; padding: var(--pad) var(--padding); text-align: center; text-decoration: none; transition: background-color 0.3s ease-in-out; white-space: nowrap; width: 100%;} section.features .flexible ul p a:focus, section.features .flexible ul p a:hover {background-color: var(--over);} section.finance {display: flex; flex-direction: column; gap: var(--gap);} section.finance ol.examples {display: flex; gap: var(--gap); list-style: none; margin: 0; padding: 0; width: 100%;} section.finance ol.examples li {background-color: var(--pale); border-radius: var(--radius); display: flex; flex: 1; flex-direction: column; gap: var(--gap); justify-content: center; padding: var(--padding)} section.finance ol.examples a {align-items: center; background-color: var(--pale); border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); justify-content: center; padding: var(--padding); text-decoration: none; transition: background-color 0.3s ease-in-out;} section.finance ol.examples a:focus, section.finance ol.examples a:hover {background-color: var(--greenyellow);} section.finance ol.examples strong {color: var(--green); font-size: 1.2rem; font-weight: bold; text-align: center;} section.finance ol.examples h3 {border-top: var(--greenyellow) solid medium; color: var(--blue); font-size: 3rem; padding: 2rem 0 0 0; text-align: center;} section.finance ol.examples h4 {color: var(--green); font-size: 2.2rem; text-align: center;} section.finance ol.examples small {display: block; text-transform: uppercase;} section.finance ol.examples {} section.finance ol.examples img, section.finance ol.examples svg {border-top: var(--greenyellow) solid medium; max-height: 6rem; max-width: 10rem; object-fit: contain;} section.finance small {font-size: small !important; text-wrap: auto;} section.finance small * {font-size: inherit;} section.finance small a:focus, section.finance small a:hover {text-decoration: underline;} section.finance small br {display: block;} section.logos {background-color: var(--pale) !important; padding: var(--space);} section.logos h2 {color: var(--heading-sub);} section.logos ol {align-items: center; display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: space-around; list-style: none; width: 100%;} section.logos ol a {display: block;} section.logos ol img, section.logos ol svg {max-height: 8rem; max-width: 8rem;} a[title='Instagram' i] svg {filter: invert(1);} body.page-contact section.logos ol {justify-content: space-between;} body.page-contact section.logos img, body.page-contact section.logos svg {max-height: 2rem; max-width: 2rem;} section.page .flexible p a:focus, section.page .flexible p a:hover {text-decoration: underline;} section.page .flexible p a.button {background-color: var(--greenyellow); border-radius: var(--radius-full); color: var(--link); display: flex; font-size: 1.5rem; font-weight: 900; margin-inline: auto; padding: var(--padding); transition: color 0.3s ease-in-out; width: fit-content;} section.page .flexible p a.button:focus, section.page .flexible p a.button:hover {color: var(--turquoise); text-decoration: none !important;} body:not(.error404, .page-customer-charter, .page-complaint, .page-privacy-policy, .page-terms-and-conditions, .page-vulnerable-persons) section.page {display: flex; gap: var(--gap); text-align: center;} body:not(.error404, .page-customer-charter, .page-complaint, .page-privacy-policy, .page-terms-and-conditions, .page-vulnerable-persons) section.page .flexible > h2 {font-weight: 600; text-wrap: balance;} section.selectable {padding: var(--space);} section.selectable figure img {border-radius: var(--radius);} section.selectable figure figcaption {display: none;} section.selectable .shortcode_left, section.selectable .shortcode_right {display: flex; flex-direction: column; gap: var(--gap); } section.shortcode {padding: 0} section.shortcode > div {width: 100%} section.vacancies {padding: var(--space);} section.vacancies ol {display: flex; flex-direction: column; gap: var(--gap); list-style: none; margin: 0; padding: 0;} section.vacancies dl.vacancy {background-color: var(--panel); border-radius: var(--radius); display: flex; flex-direction: column; padding: var(--padding); width: 100%;} section.vacancies dl.vacancy dt ~ dt {margin: var(--margin) 0 0 0;} section.definitions dl {background-color: var(--panel); border-radius: var(--radius); display: flex; flex-direction: column; padding: var(--padding); width: 100%;} section.definitions dl dt ~ dt {margin: var(--margin) 0 0 0;} section:has(+ section.tiles) {padding-bottom: 10rem;} section > .flexible:first-child {max-width: var(--limit) !important;} .flexible {align-items: center; display: flex; flex-direction: column; gap: var(--gap); margin: 0 auto; padding: var(--padding); width: 100%;} em[class] {color: inherit; display: inline-block; font-size: inherit; font-style: inherit; font-weight: inherit; height: 100%; line-height: inherit; width: fit-content;} article > section:nth-of-type(3n + 1) {background-color: var(--turquoise); color: var(--pale);} article > section:nth-of-type(3n + 1) h2 {color: var(--pale);} article > section:nth-of-type(3n + 1) h2 em::before, article > section:nth-of-type(3n + 1) h2 em::after {background-color: var(--greenyellow) !important; color: var(--greenyellow);} article > section:nth-of-type(3n + 1) h3 {color: var(--green);} article > section:nth-of-type(3n + 1) p {color: var(--pale);} article > section:nth-of-type(3n + 1) a {color: var(--greenyellow);} article > section:nth-of-type(3n + 1) .tab svg {color: var(--turquoise);} article > section:nth-of-type(3n + 1) .tiles img {background-color: var(--green);} article > section:nth-of-type(3n + 1) blockquote {color: var(--green);} article > section:nth-of-type(3n + 1).features .flexible ul svg {color: var(--pale);} article > section:nth-of-type(3n + 2) {background-color: var(--green); color: var(--blue);} article > section:nth-of-type(3n + 2) h2 {color: var(--pale);} article > section:nth-of-type(3n + 2) h2 em::before, article > section:nth-of-type(3n + 2) h2 em::after {background-color: var(--turquoise) !important; color: var(--pale);} article > section:nth-of-type(3n + 2) h3 {color: var(--blue);} article > section:nth-of-type(3n + 2) p {color: var(--pale);} article > section:nth-of-type(3n + 2) .tab svg {color: var(--green);} article > section:nth-of-type(3n + 2) .tiles img {background-color: var(--blue);} article > section:nth-of-type(3n + 1) blockquote {color: var(--green);} article > section:nth-of-type(3n + 2).features .flexible ul svg {color: var(--blue);} article > section:nth-of-type(3n + 3) {background-color: var(--blue); color: var(--pale);} article > section:nth-of-type(3n + 3) h2 {color: var(--greenyellow);} article > section:nth-of-type(3n + 3) h2 em::before, article > section:nth-of-type(3n + 3) h2 em::after {background-color: var(--section-1) !important; color: var(--pale);} article > section:nth-of-type(3n + 3) h3 {color: var(--pale);} article > section:nth-of-type(3n + 3) p {color: var(--greenyellow);} article > section:nth-of-type(3n + 3) .tab svg {color: var(--blue);} article > section:nth-of-type(3n + 3) .tiles img {background-color: var(--green);} article > section:nth-of-type(3n + 1) blockquote {color: var(--green);} article > section:nth-of-type(3n + 3).features .flexible ul svg {color: var(--pale);} section.quote {padding: var(--space);} section.quote blockquote {background-color: var(--panel); border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding);} section.quote blockquote q {background-color: var(--pale); border-radius: var(--radius-half) var(--radius-half) var(--radius-half) 0; color: inherit; padding: var(--padding); position: relative;} section.quote blockquote q::after {border-color: var(--pale) transparent transparent transparent; border-style: solid; border-width: 1rem 1rem 0 0; bottom: -1rem; content: ''; height: 0; left: 0; position: absolute; width: 0;} section.quote blockquote span {color: inherit;} section.quote blockquote cite {color: inherit; font-size: inherit;} section#banners {width: 100vw;} .glide {box-sizing: border-box; position: relative; width: 100%;} .glide * {box-sizing: inherit;} .glide__track {overflow: hidden;} ol.glide__slides {backface-visibility: hidden; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 0; position: relative; list-style: none; margin: 0; padding: 0; touch-action: pan-Y; transform-style: preserve-3d; white-space: nowrap; width: 100vw; will-change: transform;} .glide__slides--dragging {user-select: none;} li.glide__slide {align-items: stretch; background-color: var(--panel); border-radius: var(--radius); flex-shrink: 0; user-select: none; white-space: normal; width: 100vw; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent;} li.glide__slide a {display: block; padding: var(--padding); transition: background-color 0.3s ease-in-out; user-select: none; width: 100%; -webkit-user-drag: none; width: 100vw;} li.glide__slide figure {align-items: center; flex-direction: initial; height: 100%; justify-content: center; min-height: 50dvh; padding: var(--padding); position: relative;} li.glide__slide img {height: 100%; max-height: 100%; max-width: 100vw; object-fit: cover; object-position: center; position: absolute; width: 100%;} li.glide__slide figcaption {background-color: var(--overlay); border-radius: var(--radius); display: flex; flex-direction: column; gap: calc(var(--gap) * 2); margin: calc(var(--margin) * 2); max-width: 30rem; padding: calc(var(--padding) * 2) calc(var(--padding) * 2) calc(var(--padding) * 8) calc(var(--padding) * 2); position: relative; transition: background-color 0.3s ease-in-out; z-index: 9;} li.glide__slide figcaption:has(strong) h2 {max-width: calc(100% - 4rem);} li.glide__slide figcaption:has(p) {padding: calc(var(--padding) * 2) calc(var(--padding) * 2) calc(var(--padding) * 8) calc(var(--padding) * 2);} li.glide__slide h2 {color: var(--greenyellow); font-weight: 900;} li.glide__slide strong {align-items: center; aspect-ratio: 1/1; background-color: var(--red); border-radius: 50%; color: var(--pale); display: flex; inset: -2rem -2rem auto auto; justify-content: center; padding: var(--padding); position: absolute; text-align: center; text-transform: uppercase; width: min-content; z-index: 99;} li.glide__slide span {display: block; font-weight: 900; font-size: xx-large;} li.glide__slide span::first-line {font-size: large; font-weight: 600;} li.glide__slide p {color: var(--pale); font-size: larger; margin: 0; max-width: 100%;} li.glide__slide svg {inset: auto auto -2rem -2rem; max-height: 8rem; max-width: 8rem; position: absolute; z-index: 99;} li.glide__slide a:focus figcaption, li.glide__slide a:hover figcaption {background-color: var(--overlay-over);} .glide__arrows {user-select: none; -webkit-touch-callout: none;} .glide__bullets {user-select: none; -webkit-touch-callout: none;} .glide--rtl {direction: rtl;} .glide__arrow {background-color: transparent; border: 2px solid rgba(255, 255, 255, 0.5); border-radius: 4px; box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1); color: white; cursor: pointer; display: block; line-height: 1; opacity: 1; padding: 9px 12px; position: absolute; text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1); text-transform: uppercase; transform: translateY(-50%); top: 50%; transition: opacity 0.3s ease, border 0.3s ease-in-out; z-index: 2;} .glide__arrow:focus {outline: none;} .glide__arrow:hover {border-color: white;} .glide__arrow--left {left: 2rem;} .glide__arrow--right {right: 2rem;} .glide__arrow--disabled {opacity: 0.5;} .glide__bullets {bottom: 2rem; display: inline-flex; left: 50%; list-style: none; position: absolute; transform: translateX(-50%); z-index: 2;} .glide__bullet {background-color: rgba(255, 255, 255, 0.5); border: 2px solid transparent; border-radius: 50%; box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1); cursor: pointer; height: 9px; line-height: 0; margin: 0 0.25em; padding: 0; transition: all 300ms ease-in-out; width: 9px;} .glide__bullet:focus {outline: none;} .glide__bullet:hover, .glide__bullet:focus {background-color: rgba(255, 255, 255, 0.5); border: 2px solid var(--pale);} .glide__bullet--active {background-color: white;} .glide--swipeable {cursor: grab;} .glide--dragging {cursor: grabbing;} ol.lower-alpha {counter-reset: policy; list-style: none; margin: 0;} ol.lower-alpha > li::before {content: counter(policy,lower-alpha) '. '; color: var(--pale); counter-increment: policy;} canvas {background: transparent url('svg/components/grid-tile.svg') top left repeat; border: var(--border); display: block;} aside {background-color: var(--panel); display: flex; flex-direction: column; gap: var(--gap); grid-area: aside; min-width: 20rem; padding: var(--padding); width: 100%;} nav#nav_secondary {border: var(--border); display: none; gap: var(--gap); justify-content: center; padding: var(--padding);} footer {background-color: var(--section-3); color: var(--pale); display: flex; flex-direction: column; gap: var(--gap); justify-content: space-between; padding: var(--padding);} footer > * {flex: 1;} footer ul {display: flex; flex-direction: column; gap: 0 var(--gap); list-style: none;} footer li {font-size: small;} footer li.current-menu-item a, footer li.current_page_item a {color: var(--over);} footer a {color: var(--pale); font-size: inherit; transition: color 0.3s ease-in-out;} footer a:focus, footer a:hover {text-decoration: underline;} footer ul#menu-tertiary {display: flex; flex-direction: column;} footer ul#menu-tertiary li a {align-items: center; display: flex; font-size: inherit; gap: var(--gap-text);} footer ul#menu-tertiary li span {font-size: inherit;} footer ul#menu-tertiary li a img, footer ul#menu-tertiary li a svg {display: block; height: 1rem; max-height: 1rem; max-width: 1rem; min-height: 1rem; min-width: 1rem; width: 1rem;} #cmplz-document {color: var(--pale); margin: 0 auto; max-width: var(--limit); text-align: left; width: 100%;} #cmplz-document > h2 {line-break: auto;} #cmplz-document > h2, #cmplz-document > p {color: inherit; font-size: 2.2rem;} #cmplz-document > p a {background-color: transparent; color: var(--greenyellow); display: inline-block; font-size: initial; font-weight: inherit; padding: 0;} #cmplz-document details {color: var(--dark);} #cmplz-document details p {color: var(--dark);} #cmplz-document summary span, #cmplz-document summary p {color: var(--pale);} #cmplz-document summary p a {color: var(--link);} .acf-field {display: flex; flex-direction: row;} .acf-field-flexible-content {display: none;} #cmplz-document br {display: block;} #cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode {display: flex; flex-direction: column; gap: var(--gap);} #cmplz-cookies-overview {display: flex; flex-direction: column; gap: var(--gap);} #cmplz-cookies-overview label {display: none;} #cmplz-cookies-overview .cmplz-dropdown, #cmplz-document .cmplz-dropdown, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown {background-color: var(--panel); border: 0 none; border-radius: var(--radius); overflow: hidden;} #cmplz-cookies-overview .cmplz-dropdown[open], #cmplz-document .cmplz-dropdown[open], .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown[open] {border-radius: var(--radius); padding: 0;} #cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary {background-color: var(--link); color: var(--pale); margin: 0; padding: var(--pad) var(--pad) var(--pad) var(--padding);} #cmplz-cookies-overview .cmplz-dropdown summary div, #cmplz-document .cmplz-dropdown summary div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary div {background: transparent url('svg/components/more.svg') center right no-repeat; background-size: 2rem;} #cmplz-cookies-overview .cmplz-dropdown[open] summary div, #cmplz-document .cmplz-dropdown[open] summary div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown[open] summary div {background-image: url('svg/components/less.svg');} #cmplz-cookies-overview .cmplz-dropdown summary div::after, #cmplz-document .cmplz-dropdown summary div::after, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary div::after {display: none !important;} #cmplz-cookies-overview .cmplz-dropdown .cmplz-service-description, #cmplz-document .cmplz-dropdown .cmplz-service-description, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cmplz-service-description, #cmplz-cookies-overview .cmplz-dropdown .cmplz-sharing-data, #cmplz-document .cmplz-dropdown .cmplz-sharing-data, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cmplz-sharing-data {padding: 0 0 var(--padding) 0;} #cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose, #cmplz-document .cmplz-dropdown .cookies-per-purpose, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose {border: 0 none; background-color: transparent; margin: 0; padding: 0 var(--padding) var(--padding) var(--padding);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories {display: flex; flex-direction: column; gap: var(--gap); margin: 0;} #cmplz-cookies-overview .cmplz-dropdown .cmplz-service-description h4, #cmplz-cookies-overview .cmplz-dropdown .cmplz-sharing-data h4 {padding: var(--pad) var(--padding);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {background-color: transparent; color: var(--pale); gap: var(--gap); line-height: 2rem; min-height: 2rem; padding: 0;} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {color: var(--pale);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-banner-checkbox {gap: var(--gap);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category {background-color: var(--panel); border-radius: var(--radius); overflow: hidden;} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category:not(:last-child) {margin: 0;} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories summary {background-color: var(--link);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open {display: none;} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category summary { padding: var(--pad) var(--pad) var(--pad) var(--padding);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category summary span.cmplz-category-header {background: transparent url('svg/components/more.svg') center right no-repeat; background-size: 2rem;} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category[open] summary span.cmplz-category-header {background-image: url('svg/components/less.svg');} #cmplz-cookies-overview .cmplz-dropdown summary h3, #cmplz-document .cmplz-dropdown summary h3, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary h3 {padding: 0;} #cmplz-document p, .editor-styles-wrapper .cmplz-unlinked-mode p, #cmplz-document li, .editor-styles-wrapper .cmplz-unlinked-mode li, #cmplz-document td, .editor-styles-wrapper .cmplz-unlinked-mode td {font-size: 1rem;} #cmplz-document h2, .editor-styles-wrapper .cmplz-unlinked-mode h2, #cmplz-document h3, .editor-styles-wrapper .cmplz-unlinked-mode h3 {margin: 0; padding: 0;} #cmplz-cookies-overview .cmplz-dropdown h4, #cmplz-document .cmplz-dropdown h4, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown h4 {font-size: 1rem; margin: 0; padding: 0;} #cmplz-document h5, .editor-styles-wrapper .cmplz-unlinked-mode h5 {font-size: 1rem;} #cmplz-document .cmplz-subtitle, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-subtitle {margin: 0;} #cmplz-document ul {margin: 0 0 0 var(--margin);} #cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div, #cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown.cmplz-dropdown-cookiepolicy summary div {grid-template-columns: 1fr 1fr; } #cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div, #cmplz-document .cmplz-dropdown .cookies-per-purpose div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose div {padding: var(--pad) var(--padding);} #cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open {background: transparent url('svg/components/less.svg') center right no-repeat; background-size: 2rem;} span.cmplz-icon {background: transparent url('svg/components/more.svg') center right no-repeat; background-size: 2rem; height: 2rem; width: 2rem;} span.cmplz-icon svg {display: none;} #cmplz-cookiebanner-container details {border-radius: var(--radius-half); overflow: hidden;} #cmplz-cookiebanner-container span.cmplz-category-header {padding: var(--pad);} #cmplz-cookiebanner-container span.cmplz-category-title {color: var(--pale);} #cmplz-cookiebanner-container a.cmplz-link {color: var(--link); text-decoration: none; transition: color 0.3s ease-in-out;} #cmplz-cookiebanner-container a.cmplz-link:focus, #cmplz-cookiebanner-container a.cmplz-link:hover {color: var(--over);} .cmplz-description span {font-size: small;} #cmplz-document .cmplz-subtitle, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-subtitle {font-weight: 600;} details summary {font-weight: bolder;} details summary h3 {color: var(--pale) !important;} form.wpcf7-form fieldset {border: 0 none; display: flex; flex-direction: column; gap: var(--gap); padding: 0; position: relative;} form.wpcf7-form fieldset:has(> span.wpcf7-form-control-wrap > span.wpcf7-checkbox) legend, form.wpcf7-form fieldset:has(> span.wpcf7-form-control-wrap > span.wpcf7-radio) legend {color: var(--dark); font-size: 1rem; font-weight: normal;} form.wpcf7-form fieldset.full {display: flex; flex-direction: column; padding: 2rem 0 0 0;} form.wpcf7-form fieldset.full .dscf7_signature {flex-direction: row-reverse; max-width: 100%;} form.wpcf7-form fieldset legend {color: var(--heading-sub); font-size: 2rem; font-weight: 600; line-height: 2rem; margin: 0 0 var(--margin) 0; padding: 0; text-transform: capitalize;} form.wpcf7-form fieldset p {color: var(--dark) !important;} form.wpcf7-form fieldset span.wpcf7-form-control-wrap {flex-direction: column; width: 100%;} form.wpcf7-form fieldset span.wpcf7-radio {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap);} body.page-careers form.wpcf7-form fieldset span.wpcf7-radio span.wpcf7-list-item {width: 100%;} form.wpcf7-form fieldset span.wpcf7-checkbox span.wpcf7-list-item label, form.wpcf7-form fieldset span.wpcf7-radio span.wpcf7-list-item label {flex-direction: row; gap: var(--gap-text);} form.wpcf7-form fieldset .dscf7_signature > span {display: none;} body.page-survey form.wpcf7-form > details {margin: 0 auto !important; max-width: var(--ipad-portrait); width: 100%;} form.wpcf7-form details {display: flex; flex-direction: column; gap: var(--gap);} form.wpcf7-form details > fieldset {display: none; flex-direction: column;} form.wpcf7-form details > fieldset[disabled] fieldset {display: none;} form.wpcf7-form details > fieldset > legend {display: none;} form.wpcf7-form details > fieldset fieldset, form.wpcf7-form details > fieldset label {flex-direction: row-reverse;} form.wpcf7-form details[open] > fieldset {display: flex;} form.wpcf7-form details summary {appearance: none; background: var(--link) url('svg/components/more.svg') top right no-repeat; color: var(--pale); cursor: pointer; display: flex; list-style: none; padding: var(--pad) var(--padding); position: sticky; top: 5rem; user-select: none; z-index: 9;} form.wpcf7-form details:has(.wpcf7-not-valid, .wpcf7-not-valid-tip) summary {background-color: var(--alert) !important;} form.wpcf7-form details summary::-webkit-details-marker {display:none;} form.wpcf7-form details summary:focus, form.wpcf7-form details summary:hover {background-color: var(--over); transition: background-color 0.3s ease-in-out;} form.wpcf7-form details:first-of-type summary {border-radius: var(--radius) var(--radius) 0 0;} form.wpcf7-form details:last-of-type summary {border-radius: 0 0 var(--radius) var(--radius);} form.wpcf7-form details:last-of-type[open] {padding: 0;} form.wpcf7-form details:last-of-type[open] summary {border-radius: 0;} form.wpcf7-form details[open] summary {background: var(--dark) url('svg/components/less.svg') top right no-repeat;} form.wpcf7-form details summary small {font-size: small; margin: 0 0 0 var(--margin); text-transform: uppercase;} form.wpcf7-form details summary small::before {content: '[';} form.wpcf7-form details summary small::after {content: ']';} form.wpcf7-form details > fieldset { padding: 0 var(--padding);} form.wpcf7-form details[open] > fieldset {border: var(--border); padding: var(--padding);} .wpcf7-field-groups {counter-reset: indexer; display: flex; flex-direction: column; gap: var(--gap);} .wpcf7-field-groups .wpcf7-field-group {border: var(--border); border-radius: var(--radius); counter-increment: indexer; display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding) var(--padding) 5rem var(--padding); position: relative;} .wpcf7-field-groups .wpcf7-field-group::before {content: '#' counter(indexer);} body.page-survey form.wpcf7-form {padding: 0;} body.page-survey form.wpcf7-form > .wpcf7-form-control-wrap {position: sticky; top: 5rem; z-index: 99;} body.page-survey form.wpcf7-form fieldset {display: flex; flex-direction: column;} body.page-survey form.wpcf7-form fieldset.sig {flex-direction: column; gap: var(--gap); padding: 2rem 0 0 0;} body.page-survey form.wpcf7-form fieldset.sig legend {left: 0; margin: 0 0 0.5rem 0; position: absolute; top: 0;} body.page-survey form.wpcf7-form fieldset.sig fieldset {flex-direction: column; gap: var(--gap); padding: 2rem 0 0 0; position: relative; width: calc((100% - var(--gap)) / 2);} body.page-survey form.wpcf7-form fieldset.sig fieldset legend {left: 0; position: absolute; top: 0;} body.page-survey form.wpcf7-form span.wpcf7-checkbox {display: flex; flex-direction: column;} body.page-survey form.wpcf7-form span.wpcf7-radio {display: flex; flex-direction: column;} body.page-survey .wpcf7-field-groups .wpcf7-field-group label {display: flex; flex-direction: column-reverse; gap: 0;} body.page-survey form.wpcf7-form [data-name^='checkbox-'] label:focus span, body.page-survey form.wpcf7-form [data-name^='checkbox-'] label:hover span {background-color: var(--dark);} body.page-survey form.wpcf7-form [data-id^='group-'] {margin: var(--margin) 0; padding: 0 var(--padding); z-index: 9;} body.page-survey form.wpcf7-form [data-id^='group-']:last-of-type {margin: var(--margin) 0 0 0;} body.page-survey form.wpcf7-form [data-id^='group-'].wpcf7cf-hidden {margin: 0;} body.page-survey form.wpcf7-form [data-id^='group-'] span.wpcf7-list-item {display: block; margin: 0; max-width: calc((100% - var(--gap)) / 2); width: 100%;} body.page-survey form.wpcf7-form [data-name^='checkbox-'] {width: 100%;} body.page-survey form.wpcf7-form span.wpcf7-checkbox {width: 100%;} body.page-survey form.wpcf7-form input[name^='checkbox-'] + span {background: var(--link) url('svg/components/more.svg') top right no-repeat; color: var(--pale); display: flex; line-height: 1.5rem; padding: var(--pad) var(--padding); width: 100%;} body.page-survey form.wpcf7-form input[name^='checkbox-'] + span::before {content: none;} body.page-survey form.wpcf7-form input[name^='checkbox-']:checked + span {background: var(--dark) url('svg/components/less.svg') top right no-repeat;} body.page-survey form.wpcf7-form h3:not(:first-child) {border-top: var(--border); margin: var(--margin) 0 0 0 !important; padding: var(--padding) 0 0 0;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > * ~ * {margin: var(--margin) 0 0 0;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > *:first-child {border: 0 none; margin: 0; padding: 0;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > label ~ label, body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset ~ fieldset:not(:has(fieldset)) { margin: var(--margin) 0;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset {border: 0 none; display: flex; flex-direction: column; margin: var(--margin) 0 0 0; position: relative;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset > legend {display: flex; flex-direction: column; left: 0; width: 100%;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset > legend small {font-size: small;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset:has(legend small) {min-height: 3rem;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset > span {display: flex; gap: var(--gap); width: 100%;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset > span label {cursor: pointer; display: flex; gap: var(--gap-text); flex: 1;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset > span label input {vertical-align: middle;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] ul {border: 0 none; margin: var(--margin) 0 0 0; padding: 0 0 0 var(--padding);} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] p {border: 0 none;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > fieldset.sketch {border-top: var(--border);} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > table {margin: 0;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > table th {white-space: nowrap;} body.page-survey form.wpcf7-form [data-class='wpcf7cf_group'] > table select {width: initial;} .wpcf7cf_repeater {display: flex; flex-direction: column; gap: var(--gap-text);} .wpcf7cf_repeater_sub { display: flex; gap: var(--gap-text); margin: 0 !important; width: 100%;} .wpcf7cf_repeater_sub > label {display: flex; flex: 1; flex-direction: column-reverse;} .wpcf7cf_repeater_sub > label span:not([class]) {font-size: smaller; white-space: nowrap;} .wpcf7cf_repeater_sub ~ .wpcf7cf_repeater_sub > label span:not([class]) {display: none;} .wpcf7cf_repeater_sub > fieldset {border: 0 none; display: flex; flex-direction: column; margin: var(--margin) 0 0 0; position: relative;} .wpcf7cf_repeater_sub > fieldset legend {display: flex; flex-direction: column; left: 0; width: 100%;} .wpcf7cf_repeater[data-id='repeat_glass'] {flex-direction: row; flex-wrap: wrap; gap: var(--gap-text);} .wpcf7cf_repeater[data-id='repeat_glass'] > .wpcf7cf_repeater_sub label {gap: 0;} .wpcf7cf_repeater[data-id='repeat_window'] { flex-direction: row; flex-wrap: wrap; gap: var(--gap);} .wpcf7cf_repeater[data-id='repeat_window'] > .wpcf7cf_repeater_sub {background-color: var(--repeater); border-radius: var(--radius-half); flex-direction: column; max-width: calc((100% - var(--gap)) / 2); padding: var(--padding);} .wpcf7cf_repeater[data-id='repeat_window'] > .wpcf7cf_repeater_sub fieldset {margin: 0;} .wpcf7cf_repeater[data-id='repeat_window'] > .wpcf7cf_repeater_sub fieldset legend small {display: block; margin: 0 0 var(--gap-text) 0;} .wpcf7cf_repeater[data-id='repeat_window'] > .wpcf7cf_repeater_sub label {flex-direction: row-reverse;} .wpcf7cf_repeater[data-id='repeat_window'] > .wpcf7cf_repeater_sub span.wpcf7-checkbox {gap: var(--gap-text);} .wpcf7cf_repeater[data-id='group_order_16mm'] > .wpcf7cf_repeater_sub {flex-direction: column;} .wpcf7cf_repeater[data-id='group_order_9mm'] > .wpcf7cf_repeater_sub {flex-direction: column;} .wpcf7cf_repeater[data-id='group_ancillary_materials'] > .wpcf7cf_repeater_sub {flex-direction: column;} p.wpcf7cf_repeater_controls {flex-direction: row-reverse; margin: var(--margin) 0 0 0; width: 100%;} body.page-survey form.wpcf7-form .cols > fieldset {flex-direction: column !important; gap: var(--gap); padding: 0; width: 100%;} body.page-survey form.wpcf7-form .cols > fieldset legend {position: relative !important;} body.page-survey form.wpcf7-form .cols > fieldset span.wpcf7-form-control-wrap {width: 100%;} body.page-survey form.wpcf7-form label, body.page-survey form.wpcf7-form input, body.page-survey form.wpcf7-form datalist, body.page-survey form.wpcf7-form select, body.page-survey form.wpcf7-form option, body.page-survey form.wpcf7-form textarea {font-size: 0.9rem;} .wpcf7-field-groups .wpcf7-field-group button {margin: 0 auto; max-width: calc((100% - (var(--gap) + (var(--padding) * 2)))/ 2);} .wpcf7-field-groups .wpcf7-field-group button.wpcf7-field-group-remove {inset: auto auto var(--padding) var(--padding); min-width: 3rem; position: absolute;} .wpcf7-field-groups .wpcf7-field-group button.wpcf7-field-group-add {inset: auto var(--padding) var(--padding) auto; min-width: 3rem; position: absolute;} .wpcf7-form-control.wpcf7-checkbox {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill,minmax(15rem,1fr)); list-style: none;} .wpcf7-form-control.wpcf7-checkbox label {flex-direction: row; gap: var(--gap);} .wpcf7-form-control.wpcf7-acceptance label {align-items: center; cursor: pointer; flex-direction: row; gap: var(--gap-text);} .wpcf7-list-item {display: block; margin: 0;} .screen-reader-response {position: absolute; left: -999vw;} .wpcf7 {width: 100%;} form.wpcf7-form a {color: var(--turquoise) !important;} form.wpcf7-form a:focus, form.wpcf7-form a:hover {text-decoration: underline;} form.wpcf7-form input.wpcf7-not-valid {border: var(--alert) solid thin;} form.wpcf7-form span.wpcf7-not-valid-tip {color: var(--alert);} form.wpcf7-form .wpcf7-response-output:empty {display: none;} form.wpcf7-form .wpcf7-response-output:not(:empty) {align-items: center; background-color: var(--notice); border-radius: var(--radius-half); color: var(--dark); display: flex; margin: 0 !important; min-height: 3rem; padding: var(--pad) var(--padding) !important;} form.wpcf7-form .wpcf7-response-output {background-color: var(--notice); border: 0 none;} form.wpcf7-form.sent .wpcf7-response-output {background-color: var(--greenyellow); color: var(--link);} form.wpcf7-form.invalid .wpcf7-response-output {background-color: var(--alert); color: var(--pale);} form.wpcf7-form > span.wpcf7-form-control-wrap > span.wpcf7-form-control.wpcf7-not-valid span.wpcf7-list-item-label {background-color: var(--alert) !important;} form.wpcf7-form > span.wpcf7-form-control-wrap > span.wpcf7-not-valid-tip {display: none;} .wpcf7 input[type='submit']:focus, .wpcf7 input[type='submit']:hover {border: 0 none !important;} .wpcf7 input[type='submit']:not([disabled]):focus, .wpcf7 input[type='submit']:not([disabled]):hover {background-color: var(--over) !important; border: 0 none !important;} body.page-survey form.wpcf7-form > .wpcf7-response-output { margin: var(--margin) auto 0 auto;} body.page-survey form.wpcf7-form > :last-child.wpcf7-response-output {margin: 0 var(--margin) var(--margin) var(--margin) !important;} .wpcf7-spinner {display: none; margin: 0;} body.page-contact form.wpcf7-form, body.page-quote form.wpcf7-form, body.page-find-out-more form.wpcf7-form {gap: var(--gap);} input.wpcf7-not-valid, [aria-invalid='true'] {border: var(--alert) solid thin;} button.wpcf7cf_add, button.wpcf7cf_remove {min-width: 3rem;} .dscf7_signature input.clearButton {align-items: center; background-color: var(--link); border: 0 none; border-radius: 100%; color: var(--pale); cursor: pointer; display: inline-flex; height: 1.5rem; justify-content: center; line-height: 1; margin: 0; padding: 0; position: absolute; right: 0.5rem; top: 0.5rem; transition: background-color 0.3s ease-in-out; width: 1.5rem;} .dscf7_signature input.clearButton:hover {background-color: var(--dark);} .dscf7_signature_inner {position: relative;} .wpcf7cf_repeater_controls, .wpcf7cf_step_controls {margin-top: var(--margin);} form > span.wpcf7-form-control-wrap:has( + [data-class='wpcf7cf_group'] .wpcf7-not-valid) span.wpcf7-list-item-label, form > span.wpcf7-form-control-wrap:has( + [data-class='wpcf7cf_group'] .wpcf7-not-valid-tip) span.wpcf7-list-item-label {background-color: var(--alert) !important;} form#surveyor_login {display: flex; flex-direction: column; gap: var(--gap); margin: 0 auto; max-width: 48rem; width: 100%;} form#surveyor_login p {display: flex; flex-direction: column;} form#surveyor_login p label {flex: 1; flex-direction: row; line-height: 2rem; text-align: left;} form#surveyor_login p input {flex: 1;} form.wpcf7-form > span.wpcf7-form-control-wrap:has(+ [data-class='wpcf7cf_group']):first-of-type {border-radius: var(--radius) var(--radius) 0 0 !important; overflow: hidden;} form.wpcf7-form > span.wpcf7-form-control-wrap:has(+ [data-class='wpcf7cf_group'].wpcf7cf-hidden):last-of-type {border-radius: 0 0 var(--radius) var(--radius) !important; overflow: hidden;} #wpadminbar {display: none;} #cmplz-manage-consent button.cmplz-manage-consent {color: var(--pale); width: auto;} .cmplz-cookiebanner .cmplz-message {margin: 0;} .cmplz-cookiebanner .cmplz-message .cli-bar-message {font-size: small;} #cmplz-document a, .editor-styles-wrapper .cmplz-unlinked-mode a {color: var(--green); text-decoration: none;} #cmplz-document a:focus, .editor-styles-wrapper .cmplz-unlinked-mode a:focus, #cmplz-document a:hover, .editor-styles-wrapper .cmplz-unlinked-mode a:hover {text-decoration: underline;} body:is(.page-customer-charter, .page-privacy-policy, .page-terms-and-conditions, .page-vulnerable-persons) article section .flexible a {color: var(--greenyellow);} body:is(.page-customer-charter, .page-privacy-policy, .page-terms-and-conditions, .page-vulnerable-persons) article section .flexible a:focus, body:is(.page-customer-charter, .page-privacy-policy, .page-terms-and-conditions, .page-vulnerable-persons) article section .flexible a:hover {color: var(--greenyellow); text-decoration: underline;} summary {cursor: pointer;} .cmplz-body {display: flex; flex-direction: column; gap: var(--gap);} .cmplz-cookiebanner .cmplz-categories {display: flex !important; flex-direction: column; gap: var(--gap);} .cmplz-cookiebanner .cmplz-categories details.cmplz-category {margin: 0 !important;} .cmplz-cookiebanner .cmplz-categories details.cmplz-category summary {background-color: var(--link);} .cmplz-cookiebanner .cmplz-categories details.cmplz-category summary:focus, .cmplz-cookiebanner .cmplz-categories details.cmplz-category summary:hover, .cmplz-cookiebanner .cmplz-categories details.cmplz-category[open] summary {background-color: var(--over);} .cmplz-cookiebanner .cmplz-categories details.cmplz-category span.cmplz-category-header span.cmplz-always-active {color: var(--pale);} #cmplz-manage-consent button.cmplz-manage-consent {color: var(--link);} #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons button {background-color: var(--link);} #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons button:focus, #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons button:hover {background-color: var(--over);} .grecaptcha-badge {z-index: 9999;} fieldset#statements {display: flex; flex-wrap: wrap;} fieldset#statements > div {display: flex; flex-direction: column; gap: var(--gap);} fieldset#statements label {border: var(--border); border-radius: var(--radius); padding: var(--padding);} fieldset#statements label span {padding: 0;} fieldset#statements > div label {display: flex; flex: 1; flex-direction: column; gap: var(--gap);} fieldset#statements > div ul {gap: 0; margin: 0;} iframe {display: block;} form.forminator-ui label span {display: inline-flex;} /* span.select2-container--open, span.select2-results {background-color: #E6E6E6; display: block;} span.select2-results ul.select2-results__options {background-color: #E6E6E6; border: var(--border); display: block; list-style: none;} span.select2-results ul.select2-results__options li {background-color: #FFFFFF; color: black; outline: solid black thin; padding: 1rem;} span.select2-results ul.select2-results__options li + li {background-color: #E6E6E6; border-top: var(--border);} */ /* form.forminator-ui span.select2 {display: none !important;} form.forminator-custom-form {background-color: var(--panel); border: 0 none; height: 100%; margin: 0 !important; padding: var(--padding);} form.forminator-ui .forminator-field select {clip: unset !important; clip-path: unset !important; display: block !important; height: 2rem !important; overflow: visible !important; padding: var(--pad) var(--padding); position: relative !important; width: 100% !important;} form.forminator-custom-form .forminator-field, form.forminator-custom-form .forminator-progress-label {color: var(--dark) !important;} form.forminator-custom-form span.forminator-required {display: inline;} form.forminator-custom-form span.forminator-select, form.forminator-custom-form input.forminator-input {border: var(--border) !important; border-radius: var(--radius-half) !important; overflow: hidden;} form.forminator-custom-form .forminator-has_error input {border-color: var(--invalid);} form.forminator-custom-form button {border-radius: var(--radius-half) !important;} form.forminator-custom-form button:focus, form.forminator-custom-form button:hover {border-radius: var(--radius-half) !important; box-shadow: none !important; -webkit-box-shadow: none !important;} article > section form.forminator-custom-form p {color: var(--dark) !important;} form.forminator-custom-form ~ .forminator-edit-module {display: none !important;} span.select2-results {display: none !important;} form.forminator-custom-form select.forminator-select--field {background-color: var(--pale); clip: unset !important; clip-path: unset !important; cursor: pointer; height: auto !important; overflow: visible !important; padding: var(--pad) !important; position: relative !important; width: 100% !important;} form.forminator-custom-form .forminator-is_active span.select2.select2-container.forminator-select {display: none !important;} */ .forminator-select.forminator-select-dropdown-container--open .forminator-select-dropdown.forminator-dropdown--flat {padding: 0 !important;} form.forminator-custom-form {margin: 0 !important;} form.forminator-custom-form p {color: var(--dark) !important;} .forminator-edit-module {display: none;} @media (min-width: 30rem){ header {padding: 8rem var(--space);} section:has(> .tab) {padding-top: var(--space);} section:has(+ section > .tab) {padding-bottom: var(--space);} section .tab {height: 0; top: 0;} section .tab svg {height: 0; margin: 0 auto !important;} section .tiles ul {margin: 0 !important;} body.page-careers form.wpcf7-form fieldset span.wpcf7-checkbox span.wpcf7-list-item {width: calc((100% - var(--gap)) / 2);} body.page-careers form.wpcf7-form fieldset span.wpcf7-radio span.wpcf7-list-item {width: calc((100% - var(--gap)) / 2);} } @media (min-width: 40rem){ .tab.right + .tiles ul:has(li.right.large) {margin: 0 -9rem 0 0;} .tiles li.left img {object-position: right;} .tiles li.right img {object-position: left;} } @media (min-width: 48rem){ :root { --space: 2rem; } .cols {flex-direction: row;} label {flex-direction: row-reverse; gap: var(--gap);} section:not(.logos, .page, .prompts, .vacancies, #trustpilot) {padding-bottom: var(--space) !important; min-height: calc(80dvh - var(--nav));} section:has(> .tab) {padding-top: var(--space);} section:has(+ section > .tab) {padding-bottom: var(--space);} section .tab {height: 0; top: 0;} section .tab svg {height: 0; margin: 0 auto;} section .tiles ul {margin: 0;} section.features ul li {flex-direction: row;} section.finance ol.examples {flex-direction: row;} section.vacancies dl.vacancy {flex-direction: row; flex-wrap: wrap;} section.vacancies dl.vacancy dt {width: 25%;} section.vacancies dl.vacancy dt ~ dt {margin: 0;} section.vacancies dl.vacancy dd {width: 75%;} section.definitions dl {flex-direction: row; flex-wrap: wrap;} section.definitions dl dt {width: 25%;} section.definitions dl dt ~ dt {margin: 0;} section.definitions dl dd {width: 75%;} section.prompts ol {flex-direction: row;} .tiles, .flexible {width: 100%;} .flexible {max-width: var(--inner) !important;} .tiles > *, .flexible > *:not(h1, .cmplz-document, .wpcf7) {width: 100%;} fieldset#statements > div {flex-direction: row;} section.prompts ol figure.row {flex-direction: row;} section.prompts ol figure.row-reverse {flex-direction: row-reverse;} body.page-careers form.wpcf7-form fieldset span.wpcf7-checkbox span.wpcf7-list-item {width: calc((100% - (var(--gap) * 2)) / 3);} body.page-careers form.wpcf7-form fieldset span.wpcf7-radio span.wpcf7-list-item {width: calc((100% - (var(--gap) * 2)) / 3);} .glide__slide figcaption:has(p) {padding: calc(var(--padding) * 2) calc(var(--padding) * 2) calc(var(--padding) * 2) calc(var(--padding) * 2);} .glide__slide p {color: var(--pale); font-size: larger; margin: 0 0 0 6rem; max-width: calc(100% - 6rem);} .glide__slide svg {inset: auto auto -2rem -2rem;} label span:not([class]) {padding: 0.75rem 0;} form.wpcf7-form table * {font-size: small;} form.wpcf7-form fieldset fieldset { gap: var(--gap); padding: calc(var(--padding) * 3) 0 0 0;} body.page-careers form.wpcf7-form fieldset fieldset:has(span.wpcf7-checkbox) {flex-direction: row; justify-content: flex-end; padding: 0;} body.page-careers form.wpcf7-form fieldset fieldset:has(span.wpcf7-checkbox) legend {max-width: calc((100% - var(--gap)) / 2);} body.page-careers form.wpcf7-form fieldset fieldset:has(span.wpcf7-radio) {flex-direction: row; justify-content: flex-end; padding: 0;} body.page-careers form.wpcf7-form fieldset fieldset:has(span.wpcf7-radio) legend {max-width: calc((100% - var(--gap)) / 2);} form.wpcf7-form fieldset fieldset legend {display: flex; flex-direction: column; inset: 0 auto auto 0; margin: 0; max-width: calc((100% - var(--gap)) / 2);position: absolute;} form.wpcf7-form fieldset fieldset span.wpcf7-form-control-wrap {display: flex; max-width: calc((100% - var(--gap)) / 2);} form.wpcf7-form fieldset fieldset span.wpcf7-checkbox {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap);} form.wpcf7-form fieldset fieldset span.wpcf7-checkbox span.wpcf7-list-item {max-width: calc((100% - var(--gap)) / 2); min-width: fit-content;} form.wpcf7-form fieldset fieldset.full {flex-direction: row-reverse;} form.wpcf7-form fieldset fieldset.full .dscf7_signature {max-width: calc((100% - var(--gap)) / 2); width: 100%;} form.wpcf7-form details summary {top: var(--nav);} form#surveyor_login p {align-items: center; flex-direction: row; gap: var(--gap);} body.page-contact form.wpcf7-form > fieldset legend {float: left; max-width: calc((100% - var(--gap)) / 2);} body.page-contact form.wpcf7-form > fieldset span.wpcf7-form-control-wrap {float: right; max-width: calc((100% - var(--gap)) / 2);} .wpcf7-field-groups .wpcf7-field-group label {flex-direction: row-reverse; gap: var(--gap);} body.page-survey form.wpcf7-form fieldset:not(.full, .sketch) {flex-direction: row; justify-content: end;} body.page-survey form.wpcf7-form fieldset:not(.full, .sketch) legend {max-width: calc((100% - var(--gap)) / 2);} body.page-survey form.wpcf7-form fieldset:not(.full, .sketch) > span {max-width: calc((100% - var(--gap)) / 2);} body.page-complaint form.wpcf7-form fieldset label {flex-direction: row-reverse; gap: var(--gap);} [data-class='wpcf7cf_group'] fieldset {align-items: flex-start; flex-direction: row; gap: var(--gap); justify-content: flex-end;} [data-class='wpcf7cf_group'] fieldset:not(.sketch) > legend {max-width: calc((100% - var(--gap)) / 2); position: absolute;} [data-class='wpcf7cf_group'] fieldset > span {max-width: calc((100% - var(--gap)) / 2);} /* form.wpcf7-form fieldset legend {position: absolute; inset: 0 auto auto 0;} form.wpcf7-form fieldset span.wpcf7-form-control-wrap {padding: 0 0 0 calc(((100% - var(--gap)) / 2) + var(--gap));} */ footer {flex-direction: row;} footer ul {width: 50%;} } @media (min-width: 60rem){ ul#cta a {font-size: 1.5rem;} ul#cta span {display: block !important;} article {min-width: 20rem;} section.prompts ol h2 {font-size: 4rem; line-height: 4rem;} section.prompts ol p {font-size: 2rem; line-height: 2rem;} form.wpcf7-form .cols {flex-direction: row;} form.wpcf7-form .cols > div {display: flex; flex-direction: column !important; gap: var(--gap); width: 100%;} form.wpcf7-form .cols > div fieldset legend {position: relative;} form.wpcf7-form .cols > div fieldset .dscf7_signature {flex-direction: column !important; max-width: 100% !important;} form.wpcf7-form .cols > div fieldset .dscf7_signature span.wpcf7-form-control-wrap {display: none;} } @media (min-width: 74rem){ section {gap: var(--gap);} section, section .tab {flex-direction: row;} section:not(.logos, .page, .prompts) {padding: var(--space);} section:nth-child(odd) {flex-direction: row;} section:nth-child(even) {flex-direction: row-reverse;} .tiles ul {margin: 0;} } @media (min-width: 82rem){ a#logo {height: var(--nav);} nav#nav_primary {height: var(--nav);} input#menu_toggle ~ nav#nav_primary {grid-template-rows: 4rem 6rem;} nav#nav_primary a#logo {height: 6rem; width: 17rem;} nav#nav_primary a#logo svg {height: 5rem; width: 17rem;} nav#nav_primary.shadow {height: var(--nav-shadow);} nav#nav_primary label {display: none !important;} input#menu_toggle ~ nav#nav_primary, input#menu_toggle:checked ~ nav#nav_primary {grid-template-areas: 'cta cta' 'logo nav'; grid-template-columns: auto;} input#menu_toggle ~ nav#nav_primary .nav-primary, input#menu_toggle:checked ~ nav#nav_primary .nav-primary {align-items: center; display: flex; flex-direction: row-reverse; height: var(--nav); max-height: 6rem; padding: var(--padding);} input#menu_toggle ~ nav#nav_primary .nav-primary ul, input#menu_toggle:checked ~ nav#nav_primary .nav-primary ul {flex-direction: row;} nav#nav_primary .nav-primary ul {display: flex;} body.page-survey form.wpcf7-form .wpcf7-form-control-wrap:has(+ [data-class='wpcf7cf_group']:not(.wpcf7cf-hidden)) {position: sticky; top: 7rem; z-index: 99;} body.page-survey form.wpcf7-form [data-id^='group-'] span.wpcf7-checkbox, body.page-survey form.wpcf7-form [data-id^='group-'] span.wpcf7-radio {flex-direction: row; flex-wrap: wrap; width: 100%;} } @media (min-width: 100rem){ section.features .flexible ul {flex-direction: row; flex-wrap: wrap;} section.features .flexible ul li {max-width: calc((100% - var(--space)) / 2);} } @media print { ::placeholder {color: transparent;} nav#nav_primary {box-shadow: none;} summary {color: var(--dark);} #cmplz-manage-consent {display: none;} span.wpcf7-form-control-wrap {max-width: 75%;} }