/* ==========================================================================
CORE
This file is used to aid in post-processing by creating a single file
ensuring that the css variables that are required are included before
the site css so they can then be successfully replaced by the post
processor
========================================================================== */
/* ==========================================================================
FONTS
========================================================================== */
@font-face {
font-family: 'source_sans_probold';
font-style: normal;
font-weight: bold;
src: url('../fonts/sourcesanspro-bold-webfont.woff2') format('woff2'),
url('../fonts/sourcesanspro-bold-webfont.woff') format('woff');
}
@font-face {
font-family: 'source_sans_prosemibold';
font-style: normal;
font-weight: bold;
src: url('../fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'),
url('../fonts/sourcesanspro-semibold-webfont.woff') format('woff');
}
@font-face {
font-family: 'source_sans_proregular';
font-style: normal;
font-weight: normal;
src: url('../fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
url('../fonts/sourcesanspro-regular-webfont.woff') format('woff');
}
@font-face {
font-family: 'source_sans_prolight';
font-style: normal;
font-weight: normal;
src: url('../fonts/sourcesanspro-light-webfont.woff2') format('woff2'),
url('../fonts/sourcesanspro-light-webfont.woff') format('woff');
}
/* ==========================================================================
VARIABLES
========================================================================== */
:root {
/* Colours
========================================================================== */
/* Aviva yellow */
/* Aviva yellow shade */
/* Aviva yellow border colour */
/* Aviva yellow -25% */
/* Aviva yellow +25% */
/* Aviva yellow hover (as per .com) */
/* Aviva blue */
/* Aviva blue -20% */
/* Aviva blue +25% */
/* Guide blue */
/* Guide blue tint */
/* Country selector blue tint */
/* Country selector blue tint */
/* Dark blue */
/* Dark blue -25% */
/* Dark blue -50% */
/* Dark blue +25% */
/* Form hover blue */
/* Light blue */
/* Light blue used on card in masthead nav */
/* Light blue -25% */
/* Light blue -50 */
/* Light blue +25% */
/* Positive form green */
/* Positive form green dark tint */
/* Positive green */
/* Positive green tint */
/* Positive green dark tint */
/* Dark green */
/* Dark green -25% */
/* Dark green -50% */
/* Dark green +25% */
/* Teal */
/* Teal -25% */
/* Teal +25% */
/* Teal -50% */
/* Teal tint +20% - background colour */
/* Teal tint - background colour -25% */
/* Teal tint - background colour +25% */
/* Teal tint - accent colour -50% */
/* Teal tint - accent colour +50% */
/* Teal tint +40% */
/* Error red */
/* Error red 30% */
/* Warning orange */
/* Pink */
/* Pink -25% */
/* Pink -55% */
/* Pink +25% */
/* Pink dark tint +20% */
/* Light Purple */
/* Light Purple -25% */
/* Light Purple -50% */
/* Light Purple +25% */
/* Dark Purple */
/* Dark Purple -25% */
/* Dark Purple -50% */
/* Dark Purple +25% */
/* Body copy grey */
/* Heading grey */
/* Defining grey */
/* Defining grey tint (disabled state) */
/* Light grey */
/* Masthead support bar border grey */
/* Masthead support bar grey */
/* Masthead background black */
/* Masthead selected background grey */
/* Footer background grey */
/* Form border grey */
/* Form background grey (light) */
/* Form background hover grey (dark) */
/* Form placeholder grey */
/* Form datepicker disabled grey */
/* Form drop shadow */
/* Form drop shadow - on dark accent colour */
/* Overlay background grey */
/* White */
/* Fonts
========================================================================== */
/* Logos
========================================================================== */
/* Arrow icons
========================================================================== */
/* General icons
========================================================================== */
/* loaded
========================================================================== */
/* Notification icons
========================================================================== */
/* Navigation icons
========================================================================== */
/* Form icons
========================================================================== */
/* Media player icons
========================================================================== */
/* Product icons
========================================================================== */
/* Social icons
========================================================================== */
/* Specialities
========================================================================== */
/* Flags
========================================================================== */
}
/* ==========================================================================
--- BREAKPOINTS
Tablet - 35em
Desktop - 60em
========================================================================== */
/* Global
========================================================================== */
* {
box-sizing: border-box;
-webkit-tap-highlight-color: rgba(0, 79, 182, .2);
}
:focus {
outline: none;
}
/* Text Selection
========================================================================== */
::-moz-selection {
background: rgba(0, 79, 182, .2);
text-shadow: none;
}
::selection {
background: rgba(0, 79, 182, .2);
text-shadow: none;
}
/* HTML / Body
========================================================================== */
html,
body {
color: #444;
margin: 0;
padding: 0;
}
html {
min-height: 100%;
overflow-y: scroll;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}
body,
input,
select {
font: normal 1em/1.5 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 16px/24px / 16px */
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
letter-spacing: 0;
}
.fonts-loaded body,
.fonts-loaded input,
.fonts-loaded select {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
fieldset {
border: 0;
margin: 0;
padding: 0;
}
legend {
left: -9999em;
position: absolute;
}
/* ==========================================================================
ACCENT COLOURS
========================================================================== */
/* Light accent colours
========================================================================== */
.t-accent-light,
.t-card-accent-light .m-card,
.t-card-accent-light .m-card.t-accent-light,
.t-card-accent-dark .m-card.t-accent-light {
background-color: #fff;
color: #444;
transition: background .35s, color .35s;
}
.t-accent-light .a-progress-bar:before,
.t-accent-light .a-progress-bar:after,
.t-accent-light .a-progress-bar__step:before,
.t-accent-light .a-progress-bar__step:after,
.t-accent-light .a-progress-bar__step strong:before,
.t-accent-light .a-progress-bar__step strong:after,
.t-accent-light .a-progress-bar__ui:before,
.t-accent-light .a-progress-bar__ui:after,
.t-accent-light .a-progress-bar__ui div:before,
.t-accent-light .a-progress-bar__ui div:after,
.t-card-accent-light .m-card .a-progress-bar:before,
.t-card-accent-light .m-card .a-progress-bar:after,
.t-card-accent-light .m-card .a-progress-bar__step:before,
.t-card-accent-light .m-card .a-progress-bar__step:after,
.t-card-accent-light .m-card .a-progress-bar__step strong:before,
.t-card-accent-light .m-card .a-progress-bar__step strong:after,
.t-card-accent-light .m-card .a-progress-bar__ui:before,
.t-card-accent-light .m-card .a-progress-bar__ui:after,
.t-card-accent-light .m-card .a-progress-bar__ui div:before,
.t-card-accent-light .m-card .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-light .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-light .a-progress-bar__ui div:after {
background: #fff;
}
.t-accent-light--grey,
.pod.t-accent-light,
.pod.t-accent-light--grey,
.t-card-accent-light--grey .m-card,
.t-card-accent-light .m-card.t-accent-light--grey,
.t-card-accent-dark .m-card.t-accent-light--grey,
.t-accent-light--grey .a-progress-bar:before,
.t-accent-light--grey .a-progress-bar:after,
.t-accent-light--grey .a-progress-bar__step:before,
.t-accent-light--grey .a-progress-bar__step:after,
.t-accent-light--grey .a-progress-bar__step strong:before,
.t-accent-light--grey .a-progress-bar__step strong:after,
.t-accent-light--grey .a-progress-bar__ui:before,
.t-accent-light--grey .a-progress-bar__ui:after,
.t-accent-light--grey .a-progress-bar__ui div:before,
.t-accent-light--grey .a-progress-bar__ui div:after,
.t-card-accent-light--grey .m-card .a-progress-bar:before,
.t-card-accent-light--grey .m-card .a-progress-bar:after,
.t-card-accent-light--grey .m-card .a-progress-bar__step:before,
.t-card-accent-light--grey .m-card .a-progress-bar__step:after,
.t-card-accent-light--grey .m-card .a-progress-bar__step strong:before,
.t-card-accent-light--grey .m-card .a-progress-bar__step strong:after,
.t-card-accent-light--grey .m-card .a-progress-bar__ui:before,
.t-card-accent-light--grey .m-card .a-progress-bar__ui:after,
.t-card-accent-light--grey .m-card .a-progress-bar__ui div:before,
.t-card-accent-light--grey .m-card .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-light--grey .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-light--grey .a-progress-bar__ui div:after {
background-color: #eee;
}
.t-accent-light--white,
.pod.t-accent-light--white,
.pod--bordered.t-accent-light,
.t-card-accent-light--white .m-card,
.m-card.t-accent-light--white,
.t-card-accent-light .m-card.t-accent-light--white,
.t-card-accent-dark .m-card.t-accent-light--white,
.t-accent-light--white .a-progress-bar:before,
.t-accent-light--white .a-progress-bar:after,
.t-accent-light--white .a-progress-bar__step:before,
.t-accent-light--white .a-progress-bar__step:after,
.t-accent-light--white .a-progress-bar__step strong:before,
.t-accent-light--white .a-progress-bar__step strong:after,
.t-accent-light--white .a-progress-bar__ui:before,
.t-accent-light--white .a-progress-bar__ui:after,
.t-accent-light--white .a-progress-bar__ui div:before,
.t-accent-light--white .a-progress-bar__ui div:after,
.t-card-accent-light--white .m-card .a-progress-bar:before,
.t-card-accent-light--white .m-card .a-progress-bar:after,
.t-card-accent-light--white .m-card .a-progress-bar__step:before,
.t-card-accent-light--white .m-card .a-progress-bar__step:after,
.t-card-accent-light--white .m-card .a-progress-bar__step strong:before,
.t-card-accent-light--white .m-card .a-progress-bar__step strong:after,
.t-card-accent-light--white .m-card .a-progress-bar__ui:before,
.t-card-accent-light--white .m-card .a-progress-bar__ui:after,
.t-card-accent-light--white .m-card .a-progress-bar__ui div:before,
.t-card-accent-light--white .m-card .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-light--white .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-light--white .a-progress-bar__ui div:after {
background-color: #fff;
}
.t-accent-light--yellow,
.pod.t-accent-light--yellow,
.t-card-accent-light--yellow .m-card,
.t-card-accent-light .m-card.t-accent-light--yellow,
.t-card-accent-dark .m-card.t-accent-light--yellow,
.t-accent-light--yellow .a-progress-bar:before,
.t-accent-light--yellow .a-progress-bar:after,
.t-accent-light--yellow .a-progress-bar__step:before,
.t-accent-light--yellow .a-progress-bar__step:after,
.t-accent-light--yellow .a-progress-bar__step strong:before,
.t-accent-light--yellow .a-progress-bar__step strong:after,
.t-accent-light--yellow .a-progress-bar__ui:before,
.t-accent-light--yellow .a-progress-bar__ui:after,
.t-accent-light--yellow .a-progress-bar__ui div:before,
.t-accent-light--yellow .a-progress-bar__ui div:after,
.t-card-accent-light--yellow .m-card .a-progress-bar:before,
.t-card-accent-light--yellow .m-card .a-progress-bar:after,
.t-card-accent-light--yellow .m-card .a-progress-bar__step:before,
.t-card-accent-light--yellow .m-card .a-progress-bar__step:after,
.t-card-accent-light--yellow .m-card .a-progress-bar__step strong:before,
.t-card-accent-light--yellow .m-card .a-progress-bar__step strong:after,
.t-card-accent-light--yellow .m-card .a-progress-bar__ui:before,
.t-card-accent-light--yellow .m-card .a-progress-bar__ui:after,
.t-card-accent-light--yellow .m-card .a-progress-bar__ui div:before,
.t-card-accent-light--yellow .m-card .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-light--yellow .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-light--yellow .a-progress-bar__ui div:after {
background-color: #ffd900;
}
/* Dark accent colours
========================================================================== */
.t-accent-dark,
.t-card-accent-dark .m-card,
.m-card.t-accent-dark,
.t-card-accent-light .m-card.t-accent-dark,
.t-card-accent-light .m-card.t-accent-dark,
.t-card-accent-dark .m-card.t-accent-dark {
background-color: #001e60;
border: 0;
color: #fff;
transition: background .35s, color .35s;
}
.t-accent-dark .a-progress-bar:before,
.t-accent-dark .a-progress-bar:after,
.t-accent-dark .a-progress-bar__step:before,
.t-accent-dark .a-progress-bar__step:after,
.t-accent-dark .a-progress-bar__step strong:before,
.t-accent-dark .a-progress-bar__step strong:after,
.t-accent-dark .a-progress-bar__ui:before,
.t-accent-dark .a-progress-bar__ui:after,
.t-accent-dark .a-progress-bar__ui div:before,
.t-accent-dark .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card .a-progress-bar:before,
.t-card-accent-dark .m-card .a-progress-bar:after,
.t-card-accent-dark .m-card .a-progress-bar__step:before,
.t-card-accent-dark .m-card .a-progress-bar__step:after,
.t-card-accent-dark .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card .a-progress-bar__ui:before,
.t-card-accent-dark .m-card .a-progress-bar__ui:after,
.t-card-accent-dark .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark .a-progress-bar__ui div:after {
background-color: #001e60;
}
.t-accent-dark--dark-blue,
.pod.t-accent-dark--dark-blue,
.t-card-accent-dark--dark-blue .m-card,
.m-card.t-accent-dark--dark-blue,
.t-card-accent-light .m-card.t-accent-dark--dark-blue,
.t-card-accent-light .m-card.t-accent-dark--dark-blue,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue,
.t-accent-dark--dark-blue .a-progress-bar:before,
.t-accent-dark--dark-blue .a-progress-bar:after,
.t-accent-dark--dark-blue .a-progress-bar__step:before,
.t-accent-dark--dark-blue .a-progress-bar__step:after,
.t-accent-dark--dark-blue .a-progress-bar__step strong:before,
.t-accent-dark--dark-blue .a-progress-bar__step strong:after,
.t-accent-dark--dark-blue .a-progress-bar__ui:before,
.t-accent-dark--dark-blue .a-progress-bar__ui:after,
.t-accent-dark--dark-blue .a-progress-bar__ui div:before,
.t-accent-dark--dark-blue .a-progress-bar__ui div:after,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar:before,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar:after,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__step:before,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__step:after,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--dark-blue .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--dark-blue .a-progress-bar:before,
.m-card.t-accent-dark--dark-blue .a-progress-bar:after,
.m-card.t-accent-dark--dark-blue .a-progress-bar__step:before,
.m-card.t-accent-dark--dark-blue .a-progress-bar__step:after,
.m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:before,
.m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:after,
.m-card.t-accent-dark--dark-blue .a-progress-bar__ui:before,
.m-card.t-accent-dark--dark-blue .a-progress-bar__ui:after,
.m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:before,
.m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-blue .a-progress-bar__ui div:after {
background-color: #001e60;
}
.t-accent-dark--light-blue,
.pod.t-accent-dark--light-blue,
.t-card-accent-dark--light-blue .m-card,
.m-card.t-accent-dark--light-blue,
.t-card-accent-light .m-card.t-accent-dark--light-blue,
.t-card-accent-light .m-card.t-accent-dark--light-blue,
.t-card-accent-dark .m-card.t-accent-dark--light-blue,
.t-accent-dark--light-blue .a-progress-bar:before,
.t-accent-dark--light-blue .a-progress-bar:after,
.t-accent-dark--light-blue .a-progress-bar__step:before,
.t-accent-dark--light-blue .a-progress-bar__step:after,
.t-accent-dark--light-blue .a-progress-bar__step strong:before,
.t-accent-dark--light-blue .a-progress-bar__step strong:after,
.t-accent-dark--light-blue .a-progress-bar__ui:before,
.t-accent-dark--light-blue .a-progress-bar__ui:after,
.t-accent-dark--light-blue .a-progress-bar__ui div:before,
.t-accent-dark--light-blue .a-progress-bar__ui div:after,
.t-card-accent-dark--light-blue .m-card .a-progress-bar:before,
.t-card-accent-dark--light-blue .m-card .a-progress-bar:after,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__step:before,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__step:after,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--light-blue .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--light-blue .a-progress-bar:before,
.m-card.t-accent-dark--light-blue .a-progress-bar:after,
.m-card.t-accent-dark--light-blue .a-progress-bar__step:before,
.m-card.t-accent-dark--light-blue .a-progress-bar__step:after,
.m-card.t-accent-dark--light-blue .a-progress-bar__step strong:before,
.m-card.t-accent-dark--light-blue .a-progress-bar__step strong:after,
.m-card.t-accent-dark--light-blue .a-progress-bar__ui:before,
.m-card.t-accent-dark--light-blue .a-progress-bar__ui:after,
.m-card.t-accent-dark--light-blue .a-progress-bar__ui div:before,
.m-card.t-accent-dark--light-blue .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--light-blue .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--light-blue .a-progress-bar__ui div:after {
background-color: #1a61bd;
}
.t-accent-dark--dark-green,
.pod.t-accent-dark--dark-green,
.t-card-accent-dark--dark-green .m-card,
.m-card.t-accent-dark--dark-green,
.t-card-accent-light .m-card.t-accent-dark--dark-green,
.t-card-accent-light .m-card.t-accent-dark--dark-green,
.t-card-accent-dark .m-card.t-accent-dark--dark-green,
.t-accent-dark--dark-green .a-progress-bar:before,
.t-accent-dark--dark-green .a-progress-bar:after,
.t-accent-dark--dark-green .a-progress-bar__step:before,
.t-accent-dark--dark-green .a-progress-bar__step:after,
.t-accent-dark--dark-green .a-progress-bar__step strong:before,
.t-accent-dark--dark-green .a-progress-bar__step strong:after,
.t-accent-dark--dark-green .a-progress-bar__ui:before,
.t-accent-dark--dark-green .a-progress-bar__ui:after,
.t-accent-dark--dark-green .a-progress-bar__ui div:before,
.t-accent-dark--dark-green .a-progress-bar__ui div:after,
.t-card-accent-dark--dark-green .m-card .a-progress-bar:before,
.t-card-accent-dark--dark-green .m-card .a-progress-bar:after,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__step:before,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__step:after,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--dark-green .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--dark-green .a-progress-bar:before,
.m-card.t-accent-dark--dark-green .a-progress-bar:after,
.m-card.t-accent-dark--dark-green .a-progress-bar__step:before,
.m-card.t-accent-dark--dark-green .a-progress-bar__step:after,
.m-card.t-accent-dark--dark-green .a-progress-bar__step strong:before,
.m-card.t-accent-dark--dark-green .a-progress-bar__step strong:after,
.m-card.t-accent-dark--dark-green .a-progress-bar__ui:before,
.m-card.t-accent-dark--dark-green .a-progress-bar__ui:after,
.m-card.t-accent-dark--dark-green .a-progress-bar__ui div:before,
.m-card.t-accent-dark--dark-green .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--dark-green .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-green .a-progress-bar__ui div:after {
background-color: #0e573f;
}
.t-accent-dark--dark-purple,
.pod.t-accent-dark--dark-purple,
.t-card-accent-dark--dark-purple .m-card,
.m-card.t-accent-dark--dark-purple,
.t-card-accent-light .m-card.t-accent-dark--dark-purple,
.t-card-accent-light .m-card.t-accent-dark--dark-purple,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple,
.t-accent-dark--dark-purple .a-progress-bar:before,
.t-accent-dark--dark-purple .a-progress-bar:after,
.t-accent-dark--dark-purple .a-progress-bar__step:before,
.t-accent-dark--dark-purple .a-progress-bar__step:after,
.t-accent-dark--dark-purple .a-progress-bar__step strong:before,
.t-accent-dark--dark-purple .a-progress-bar__step strong:after,
.t-accent-dark--dark-purple .a-progress-bar__ui:before,
.t-accent-dark--dark-purple .a-progress-bar__ui:after,
.t-accent-dark--dark-purple .a-progress-bar__ui div:before,
.t-accent-dark--dark-purple .a-progress-bar__ui div:after,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar:before,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar:after,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__step:before,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__step:after,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--dark-purple .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--dark-purple .a-progress-bar:before,
.m-card.t-accent-dark--dark-purple .a-progress-bar:after,
.m-card.t-accent-dark--dark-purple .a-progress-bar__step:before,
.m-card.t-accent-dark--dark-purple .a-progress-bar__step:after,
.m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:before,
.m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:after,
.m-card.t-accent-dark--dark-purple .a-progress-bar__ui:before,
.m-card.t-accent-dark--dark-purple .a-progress-bar__ui:after,
.m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:before,
.m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--dark-purple .a-progress-bar__ui div:after {
background-color: #421b67;
}
.t-accent-dark--light-purple,
.pod.t-accent-dark--light-purple,
.t-card-accent-dark--light-purple .m-card,
.m-card.t-accent-dark--light-purple,
.t-card-accent-light .m-card.t-accent-dark--light-purple,
.t-card-accent-light .m-card.t-accent-dark--light-purple,
.t-card-accent-dark .m-card.t-accent-dark--light-purple,
.t-accent-dark--light-purple .a-progress-bar:before,
.t-accent-dark--light-purple .a-progress-bar:after,
.t-accent-dark--light-purple .a-progress-bar__step:before,
.t-accent-dark--light-purple .a-progress-bar__step:after,
.t-accent-dark--light-purple .a-progress-bar__step strong:before,
.t-accent-dark--light-purple .a-progress-bar__step strong:after,
.t-accent-dark--light-purple .a-progress-bar__ui:before,
.t-accent-dark--light-purple .a-progress-bar__ui:after,
.t-accent-dark--light-purple .a-progress-bar__ui div:before,
.t-accent-dark--light-purple .a-progress-bar__ui div:after,
.t-card-accent-dark--light-purple .m-card .a-progress-bar:before,
.t-card-accent-dark--light-purple .m-card .a-progress-bar:after,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__step:before,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__step:after,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--light-purple .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--light-purple .a-progress-bar:before,
.m-card.t-accent-dark--light-purple .a-progress-bar:after,
.m-card.t-accent-dark--light-purple .a-progress-bar__step:before,
.m-card.t-accent-dark--light-purple .a-progress-bar__step:after,
.m-card.t-accent-dark--light-purple .a-progress-bar__step strong:before,
.m-card.t-accent-dark--light-purple .a-progress-bar__step strong:after,
.m-card.t-accent-dark--light-purple .a-progress-bar__ui:before,
.m-card.t-accent-dark--light-purple .a-progress-bar__ui:after,
.m-card.t-accent-dark--light-purple .a-progress-bar__ui div:before,
.m-card.t-accent-dark--light-purple .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--light-purple .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--light-purple .a-progress-bar__ui div:after {
background-color: #87378e;
}
.t-accent-dark--pink,
.pod.t-accent-dark--pink,
.t-card-accent-dark--pink .m-card,
.m-card.t-accent-dark--pink,
.t-card-accent-light .m-card.t-accent-dark--pink,
.t-card-accent-light .m-card.t-accent-dark--pink,
.t-card-accent-dark .m-card.t-accent-dark--pink,
.t-accent-dark--pink .a-progress-bar:before,
.t-accent-dark--pink .a-progress-bar:after,
.t-accent-dark--pink .a-progress-bar__step:before,
.t-accent-dark--pink .a-progress-bar__step:after,
.t-accent-dark--pink .a-progress-bar__step strong:before,
.t-accent-dark--pink .a-progress-bar__step strong:after,
.t-accent-dark--pink .a-progress-bar__ui:before,
.t-accent-dark--pink .a-progress-bar__ui:after,
.t-accent-dark--pink .a-progress-bar__ui div:before,
.t-accent-dark--pink .a-progress-bar__ui div:after,
.t-card-accent-dark--pink .m-card .a-progress-bar:before,
.t-card-accent-dark--pink .m-card .a-progress-bar:after,
.t-card-accent-dark--pink .m-card .a-progress-bar__step:before,
.t-card-accent-dark--pink .m-card .a-progress-bar__step:after,
.t-card-accent-dark--pink .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--pink .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--pink .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--pink .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--pink .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--pink .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--pink .a-progress-bar:before,
.m-card.t-accent-dark--pink .a-progress-bar:after,
.m-card.t-accent-dark--pink .a-progress-bar__step:before,
.m-card.t-accent-dark--pink .a-progress-bar__step:after,
.m-card.t-accent-dark--pink .a-progress-bar__step strong:before,
.m-card.t-accent-dark--pink .a-progress-bar__step strong:after,
.m-card.t-accent-dark--pink .a-progress-bar__ui:before,
.m-card.t-accent-dark--pink .a-progress-bar__ui:after,
.m-card.t-accent-dark--pink .a-progress-bar__ui div:before,
.m-card.t-accent-dark--pink .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--pink .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--pink .a-progress-bar__ui div:after {
background-color: #c01b83;
}
.t-accent-dark--teal,
.pod.t-accent-dark--teal,
.t-card-accent-dark--teal .m-card,
.m-card.t-accent-dark--teal,
.t-card-accent-light .m-card.t-accent-dark--teal,
.t-card-accent-light .m-card.t-accent-dark--teal,
.t-card-accent-dark .m-card.t-accent-dark--teal,
.t-accent-dark--teal .a-progress-bar:before,
.t-accent-dark--teal .a-progress-bar:after,
.t-accent-dark--teal .a-progress-bar__step:before,
.t-accent-dark--teal .a-progress-bar__step:after,
.t-accent-dark--teal .a-progress-bar__step strong:before,
.t-accent-dark--teal .a-progress-bar__step strong:after,
.t-accent-dark--teal .a-progress-bar__ui:before,
.t-accent-dark--teal .a-progress-bar__ui:after,
.t-accent-dark--teal .a-progress-bar__ui div:before,
.t-accent-dark--teal .a-progress-bar__ui div:after,
.t-card-accent-dark--teal .m-card .a-progress-bar:before,
.t-card-accent-dark--teal .m-card .a-progress-bar:after,
.t-card-accent-dark--teal .m-card .a-progress-bar__step:before,
.t-card-accent-dark--teal .m-card .a-progress-bar__step:after,
.t-card-accent-dark--teal .m-card .a-progress-bar__step strong:before,
.t-card-accent-dark--teal .m-card .a-progress-bar__step strong:after,
.t-card-accent-dark--teal .m-card .a-progress-bar__ui:before,
.t-card-accent-dark--teal .m-card .a-progress-bar__ui:after,
.t-card-accent-dark--teal .m-card .a-progress-bar__ui div:before,
.t-card-accent-dark--teal .m-card .a-progress-bar__ui div:after,
.m-card.t-accent-dark--teal .a-progress-bar:before,
.m-card.t-accent-dark--teal .a-progress-bar:after,
.m-card.t-accent-dark--teal .a-progress-bar__step:before,
.m-card.t-accent-dark--teal .a-progress-bar__step:after,
.m-card.t-accent-dark--teal .a-progress-bar__step strong:before,
.m-card.t-accent-dark--teal .a-progress-bar__step strong:after,
.m-card.t-accent-dark--teal .a-progress-bar__ui:before,
.m-card.t-accent-dark--teal .a-progress-bar__ui:after,
.m-card.t-accent-dark--teal .a-progress-bar__ui div:before,
.m-card.t-accent-dark--teal .a-progress-bar__ui div:after,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar:before,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar:after,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__step:before,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__step:after,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__step strong:before,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__step strong:after,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__ui:before,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__ui:after,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__ui div:before,
.t-card-accent-light .m-card.t-accent-dark--teal .a-progress-bar__ui div:after,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar:before,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar:after,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__step:before,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__step:after,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__step strong:before,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__step strong:after,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__ui:before,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__ui:after,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__ui div:before,
.t-card-accent-dark .m-card.t-accent-dark--teal .a-progress-bar__ui div:after {
background-color: #00788a;
}
/* ==========================================================================
ACCENT COLOUR TINTS
========================================================================== */
/* Light accent colours
========================================================================== */
a.t-accent-light:hover,
a.t-accent-light:focus,
a.pod.t-accent-light:hover,
a.pod.t-accent-light:focus,
a.t-accent-light--white:hover,
a.t-accent-light--white:focus,
a.pod.t-accent-light--white:hover,
a.pod.t-accent-light--white:focus,
a.pod--bordered.t-accent-light:hover,
a.pod--bordered.t-accent-light:focus,
.t-card-accent-light a.m-card:hover,
.t-card-accent-light a.m-card:focus,
.t-card-accent-light--white a.m-card:hover,
.t-card-accent-light--white a.m-card:focus,
.t-card-accent-light a.m-card.t-accent-light:hover,
.t-card-accent-light a.m-card.t-accent-light:focus,
.t-card-accent-dark a.m-card.t-accent-light:hover,
.t-card-accent-dark a.m-card.t-accent-light:focus,
.t-card-accent-light a.m-card.t-accent-light--white:hover,
.t-card-accent-light a.m-card.t-accent-light--white:focus,
.t-card-accent-dark a.m-card.t-accent-light--white:hover,
.t-card-accent-dark a.m-card.t-accent-light--white:focus {
background-color: #ccc;
color: #444;
}
a.t-accent-light--grey:hover,
a.t-accent-light--grey:focus,
a.pod.t-accent-light--grey:hover,
a.pod.t-accent-light--grey:focus,
.t-card-accent-light--grey a.m-card:hover,
.t-card-accent-light--grey a.m-card:focus,
.t-card-accent-light a.m-card.t-accent-light--grey:hover,
.t-card-accent-light a.m-card.t-accent-light--grey:focus,
.t-card-accent-dark a.m-card.t-accent-light--grey:hover,
.t-card-accent-dark a.m-card.t-accent-light--grey:focus {
background-color: #ccc;
color: #444;
}
a.t-accent-light--yellow:hover,
a.t-accent-light--yellow:focus,
a.pod.t-accent-light--yellow:hover,
a.pod.t-accent-light--yellow:focus,
.t-card-accent-light--yellow a.m-card:hover,
.t-card-accent-light--yellow a.m-card:focus,
.t-card-accent-light a.m-card.t-accent-light--yellow:hover,
.t-card-accent-light a.m-card.t-accent-light--yellow:focus,
.t-card-accent-dark a.m-card.t-accent-light--yellow:hover,
.t-card-accent-dark a.m-card.t-accent-light--yellow:focus {
background-color: #e5c200;
color: #444;
}
/* Dark accent colours
========================================================================== */
a.t-accent-dark:hover,
a.t-accent-dark:focus,
a.pod.t-accent-dark:hover,
a.pod.t-accent-dark:focus,
.t-card-accent-dark a.m-card:hover,
.t-card-accent-dark a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark:hover,
a.m-card.t-accent-dark.t-accent-dark:focus,
.t-card-accent-light a.m-card.t-accent-dark:hover,
.t-card-accent-light a.m-card.t-accent-dark:focus,
.t-card-accent-dark a.m-card.t-accent-dark:hover,
.t-card-accent-dark a.m-card.t-accent-dark:focus,
a.t-accent-dark--dark-blue:hover,
a.t-accent-dark--dark-blue:focus,
a.pod.t-accent-dark--dark-blue:hover,
a.pod.t-accent-dark--dark-blue:focus,
.t-card-accent-dark--dark-blue a.m-card:hover,
.t-card-accent-dark--dark-blue a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--dark-blue:hover,
a.m-card.t-accent-dark.t-accent-dark--dark-blue:focus,
.t-card-accent-light a.m-card.t-accent-dark--dark-blue:hover,
.t-card-accent-light a.m-card.t-accent-dark--dark-blue:focus,
.t-card-accent-dark a.m-card.t-accent-dark--dark-blue:hover,
.t-card-accent-dark a.m-card.t-accent-dark--dark-blue:focus {
background-color: #001647;
color: #fff;
}
a.t-accent-dark--light-blue:hover,
a.t-accent-dark--light-blue:focus,
a.pod.t-accent-dark--light-blue:hover,
a.pod.t-accent-dark--light-blue:focus,
.t-card-accent-dark--light-blue a.m-card:hover,
.t-card-accent-dark--light-blue a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--light-blue:hover,
a.m-card.t-accent-dark.t-accent-dark--light-blue:focus,
.t-card-accent-light a.m-card.t-accent-dark--light-blue:hover,
.t-card-accent-light a.m-card.t-accent-dark--light-blue:focus,
.t-card-accent-dark a.m-card.t-accent-dark--light-blue:hover,
.t-card-accent-dark a.m-card.t-accent-dark--light-blue:focus {
background-color: #13488d;
color: #fff;
}
a.t-accent-dark--dark-green:hover,
a.t-accent-dark--dark-green:focus,
a.pod.t-accent-dark--dark-green:hover,
a.pod.t-accent-dark--dark-green:focus,
.t-card-accent-dark--dark-green a.m-card:hover,
.t-card-accent-dark--dark-green a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--dark-green:hover,
a.m-card.t-accent-dark.t-accent-dark--dark-green:focus,
.t-card-accent-light a.m-card.t-accent-dark--dark-green:hover,
.t-card-accent-light a.m-card.t-accent-dark--dark-green:focus,
.t-card-accent-dark a.m-card.t-accent-dark--dark-green:hover,
.t-card-accent-dark a.m-card.t-accent-dark--dark-green:focus {
background-color: #0e412f;
color: #fff;
}
a.t-accent-dark--dark-purple:hover,
a.t-accent-dark--dark-purple:focus,
a.pod.t-accent-dark--dark-purple:hover,
a.pod.t-accent-dark--dark-purple:focus,
.t-card-accent-dark--dark-purple a.m-card:hover,
.t-card-accent-dark--dark-purple a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--dark-purple:hover,
a.m-card.t-accent-dark.t-accent-dark--dark-purple:focus,
.t-card-accent-light a.m-card.t-accent-dark--dark-purple:hover,
.t-card-accent-light a.m-card.t-accent-dark--dark-purple:focus,
.t-card-accent-dark a.m-card.t-accent-dark--dark-purple:hover,
.t-card-accent-dark a.m-card.t-accent-dark--dark-purple:focus {
background-color: #31144d;
color: #fff;
}
a.t-accent-dark--light-purple:hover,
a.t-accent-dark--light-purple:focus,
a.pod.t-accent-dark--light-purple:hover,
a.pod.t-accent-dark--light-purple:focus,
.t-card-accent-dark--light-purple a.m-card:hover,
.t-card-accent-dark--light-purple a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--light-purple:hover,
a.m-card.t-accent-dark.t-accent-dark--light-purple:focus,
.t-card-accent-light a.m-card.t-accent-dark--light-purple:hover,
.t-card-accent-light a.m-card.t-accent-dark--light-purple:focus,
.t-card-accent-dark a.m-card.t-accent-dark--light-purple:hover,
.t-card-accent-dark a.m-card.t-accent-dark--light-purple:focus {
background-color: #65296a;
color: #fff;
}
a.t-accent-dark--pink:hover,
a.t-accent-dark--pink:focus,
a.pod.t-accent-dark--pink:hover,
a.pod.t-accent-dark--pink:focus,
.t-card-accent-dark--pink a.m-card:hover,
.t-card-accent-dark--pink a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--pink:hover,
a.m-card.t-accent-dark.t-accent-dark--pink:focus,
.t-card-accent-light a.m-card.t-accent-dark--pink:hover,
.t-card-accent-light a.m-card.t-accent-dark--pink:focus,
.t-card-accent-dark a.m-card.t-accent-dark--pink:hover,
.t-card-accent-dark a.m-card.t-accent-dark--pink:focus {
background-color: #aa1772;
color: #fff;
}
a.t-accent-dark--teal:hover,
a.t-accent-dark--teal:focus,
a.pod.t-accent-dark--teal:hover,
a.pod.t-accent-dark--teal:focus,
.t-card-accent-dark--teal a.m-card:hover,
.t-card-accent-dark--teal a.m-card:focus,
a.m-card.t-accent-dark.t-accent-dark--teal:hover,
a.m-card.t-accent-dark.t-accent-dark--teal:focus,
.t-card-accent-light a.m-card.t-accent-dark--teal:hover,
.t-card-accent-light a.m-card.t-accent-dark--teal:focus,
.t-card-accent-dark a.m-card.t-accent-dark--teal:hover,
.t-card-accent-dark a.m-card.t-accent-dark--teal:focus {
background-color: #005a67;
color: #fff;
}
/* Applied card borders
========================================================================== */
.t-accent-light--white.t-card-accent-light--white .m-card,
.t-accent-light--white .m-card.t-accent-light--white,
.t-accent-light--white.t-card-accent-dark .m-card.t-accent-light--white,
.t-accent-light--grey.t-card-accent-light--white .m-card,
.t-accent-light--grey .m-card.t-accent-light--white,
.t-accent-light--grey.t-card-accent-dark .m-card.t-accent-light--white,
.t-accent-light--white.t-card-accent-light--white a.m-card:hover,
.t-accent-light--white a.m-card.t-accent-light--white:hover,
.t-accent-light--white.t-card-accent-dark a.m-card.t-accent-light--white:hover,
.t-accent-light--grey.t-card-accent-light--white a.m-card:hover,
.t-accent-light--grey a.m-card.t-accent-light--white:hover,
.t-accent-light--grey.t-card-accent-dark a.m-card.t-accent-light--white:hover,
.t-accent-light--white.t-card-accent-light--white a.m-card:active,
.t-accent-light--white a.m-card.t-accent-light--white:active,
.t-accent-light--white.t-card-accent-dark a.m-card.t-accent-light--white:active,
.t-accent-light--grey.t-card-accent-light--white a.m-card:active,
.t-accent-light--grey .m-card.t-accent-light--white:active,
.t-accent-light--grey.t-card-accent-dark a.m-card.t-accent-light--white:active,
.t-accent-light--white.t-card-accent-light--white a.m-card:focus,
.t-accent-light--white a.m-card.t-accent-light--white:focus,
.t-accent-light--white.t-card-accent-dark a.m-card.t-accent-light--white:focus,
.t-accent-light--grey.t-card-accent-light--white a.m-card:focus,
.t-accent-light--grey a.m-card.t-accent-light--white:focus,
.t-accent-light--grey.t-card-accent-dark a.m-card.t-accent-light--white:focus {
border-bottom: 2px solid #ccc;
}
/* ==========================================================================
SECTIONS
========================================================================== */
.l-section,
.l-section--highlight {
padding-bottom: 1.875em;
/* 30px / 16px */
padding-top: 1.875em;
/* 30px / 16px */
}
.l-section--primary {
padding-bottom: 1.875em;
/* 30px / 16px */
padding-top: 1.25em;
/* 20px / 16px */
}
.l-section--secondary {
padding-bottom: 1.5625em;
/* 25px / 16px */
padding-top: .9375em;
/* 15px / 16px */
}
.l-section:before,
.l-section:after {
content: '';
display: table;
}
.l-section:after {
clear: both;
}
@media (min-width: 35em) {
.l-section--highlight {
padding-bottom: 1.375em;
/* 22px / 16px */
padding-top: 2.675em;
/* 42px / 16px */
}
.l-section--primary {
padding-bottom: 3.75em;
/* 60px / 16px */
padding-top: 2.5em;
/* 40px / 16px */
}
}
@media (min-width: 60em) {
.l-section--highlight {
padding-bottom: 3.875em;
/* 62px / 16px */
padding-top: 5.125em;
/* 82px / 16px */
}
}
/* ==========================================================================
HEADINGS
All headings should have a space of 55px top and 40px bottom - from baseline to top of ascender.
This spacing will be impacted by the headings line height.
========================================================================== */
h1,
h2,
h3,
h4,
h5,
h6,
.heading {
color: #5c596d;
display: block;
font-style: normal;
font-weight: bold;
margin: 0;
padding: 0;
}
.t-accent-light h1,
.t-accent-light h2,
.t-accent-light h3,
.t-accent-light h4,
.t-accent-light h5,
.t-accent-light h6,
.t-accent-light .heading,
.t-accent-dark .t-accent-light h1,
.t-accent-dark .t-accent-light h2,
.t-accent-dark .t-accent-light h3,
.t-accent-dark .t-accent-light h4,
.t-accent-dark .t-accent-light h5,
.t-accent-dark .t-accent-light h6,
.t-accent-dark .t-accent-light .heading,
.t-card-accent-light .m-card h1,
.t-card-accent-light .m-card h2,
.t-card-accent-light .m-card h3,
.t-card-accent-light .m-card h4,
.t-card-accent-light .m-card h5,
.t-card-accent-light .m-card h6,
.t-card-accent-light .m-card .heading,
.t-card-accent-light .m-card.t-accent-light h1,
.t-card-accent-dark .m-card.t-accent-light h1,
.t-card-accent-light .m-card.t-accent-light h2,
.t-card-accent-dark .m-card.t-accent-light h2,
.t-card-accent-light .m-card.t-accent-light h3,
.t-card-accent-dark .m-card.t-accent-light h3,
.t-card-accent-light .m-card.t-accent-light h4,
.t-card-accent-dark .m-card.t-accent-light h4,
.t-card-accent-light .m-card.t-accent-light h5,
.t-card-accent-dark .m-card.t-accent-light h5,
.t-card-accent-light .m-card.t-accent-light h6,
.t-card-accent-dark .m-card.t-accent-light h6,
.t-card-accent-light .m-card.t-accent-light .heading,
.t-card-accent-dark .m-card.t-accent-light .heading {
color: #5c596d;
}
.t-accent-dark h1,
.t-accent-dark h2,
.t-accent-dark h3,
.t-accent-dark h4,
.t-accent-dark h5,
.t-accent-dark h6,
.t-accent-dark .heading,
.t-card-accent-dark .m-card h1,
.t-card-accent-dark .m-card h2,
.t-card-accent-dark .m-card h3,
.t-card-accent-dark .m-card h4,
.t-card-accent-dark .m-card h5,
.t-card-accent-dark .m-card h6,
.t-card-accent-dark .m-card .heading,
.t-card-accent-light .m-card.t-accent-dark h1,
.t-card-accent-dark .m-card.t-accent-dark h1,
.t-card-accent-light .m-card.t-accent-dark h2,
.t-card-accent-dark .m-card.t-accent-dark h2,
.t-card-accent-light .m-card.t-accent-dark h3,
.t-card-accent-dark .m-card.t-accent-dark h3,
.t-card-accent-light .m-card.t-accent-dark h4,
.t-card-accent-dark .m-card.t-accent-dark h4,
.t-card-accent-light .m-card.t-accent-dark h5,
.t-card-accent-dark .m-card.t-accent-dark h5,
.t-card-accent-light .m-card.t-accent-dark h6,
.t-card-accent-dark .m-card.t-accent-dark h6,
.t-card-accent-light .m-card.t-accent-dark .heading,
.t-card-accent-dark .m-card.t-accent-dark .heading {
color: #fff;
}
.heading--0 {
font-size: 2.625em;
/* 42px / 16px */
font-weight: normal;
letter-spacing: -.004em;
/* 0.2px / 42px */
line-height: 1.1905em;
/* 50px / 42px */
margin-bottom: .3809em;
/* 15px / 42px */
margin-top: .7142em;
/* 30px / 42px */
}
.fonts-loaded .heading--0 {
font-family: 'source_sans_prolight', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.heading--0 strong {
font-weight: bold;
}
.fonts-loaded .heading--0 strong {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
h1,
.heading--1 {
font-size: 2em;
/* 32px / 16px */
font-weight: normal;
letter-spacing: -.003em;
/* -0.1px / 32px */
line-height: 1.25em;
/* 40px / 32px */
margin-bottom: .4688em;
/* 15px / 32px */
margin-top: .9375em;
/* 30px / 32px */
}
.fonts-loaded h1,
.fonts-loaded .heading--1 {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.fonts-loaded h1 strong,
.fonts-loaded .heading--1 strong {
font-family: 'source_sans_prosemibold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
h2,
.heading--2 {
font-size: 1.5em;
/* 24px / 16px */
font-weight: normal;
letter-spacing: -.004em;
/* -0.1px / 24px */
line-height: 1.4167;
/* 34px / 24px */
margin-bottom: .625em;
/* 15px / 24px */
margin-top: 1.25em;
/* 30px / 24px */
}
.fonts-loaded h2,
.fonts-loaded .heading--2 {
font-family: 'source_sans_prolight', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.h2 strong,
.heading--2 strong {
font-weight: bold;
}
.fonts-loaded h2 strong,
.fonts-loaded .heading--2 strong {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
h3,
.heading--3 {
font-size: 1.25em;
/* 20px / 16px */
font-weight: normal;
letter-spacing: -.005em;
/* -0.1px / 16px */
line-height: 1.4em;
/* 28px / 16px */
margin-bottom: .5em;
/* 10px / 20px */
margin-top: 1em;
/* 30px / 20px */
}
.fonts-loaded h3,
.fonts-loaded .heading--3 {
font-family: 'source_sans_prolight', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.h3 strong,
.heading--3 strong {
font-weight: bold;
}
.fonts-loaded h3 strong,
.fonts-loaded .heading--3 strong {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
h4,
.heading--4,
h5,
.heading--5 {
font-size: 1em;
/* 16px / 16px */
font-weight: bold;
letter-spacing: -.00625em;
/* -0.1px / 16px */
line-height: 1.5em;
/* 24px / 16px */
margin-bottom: .625em;
/* 10px / 16px */
margin-top: 1.25em;
/* 20px / 16px */
}
.heading--heavy {
font-weight: bold;
}
.fonts-loaded .heading--heavy {
font-family: 'source_sans_prosemibold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.heading--heavy strong {
font-weight: bold;
}
.fonts-loaded .heading--heavy strong {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.fonts-loaded h4,
.fonts-loaded .heading--4,
.fonts-loaded h5,
.fonts-loaded .heading--5 {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.fonts-loaded h4 strong,
.fonts-loaded .heading--4 strong,
.fonts-loaded h4 strong,
.fonts-loaded .heading--4 strong {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.heading--0.heading--first,
h1 + .heading--0,
h2 + .heading--0,
h3 + .heading--0,
h4 + .heading--0,
h5 + .heading--0,
.heading + .heading--0 {
margin-top: .3571em;
/* 15px / 42px */
}
.heading--1.heading--first,
h1 + h1,
.heading + h1,
h1 + .heading--1,
h2 + .heading--1,
h3 + .heading--1,
h4 + .heading--1,
h5 + .heading--1,
.heading + .heading--1 {
margin-top: .4688em;
/* 15px / 32px */
}
.heading--2.heading--first,
h1 + h2,
h2 + h2,
.heading + h2,
h1 + .heading--2,
h2 + .heading--2,
h3 + .heading--2,
h4 + .heading--2,
h5 + .heading--2,
.heading + .heading--2 {
margin-top: .625em;
/* 15px / 24px */
}
.heading--3.heading--first,
h2 + h3,
h3 + h3,
.heading + h3,
h1 + .heading--3,
h2 + .heading--3,
h3 + .heading--3,
h4 + .heading--3,
h5 + .heading--3,
.heading + .heading--3 {
margin-top: .5em;
/* 10px / 20px */
}
.heading--4.heading--first,
h3 + h4,
h4 + h4,
.heading + h4,
h1 + .heading--4,
h2 + .heading--4,
h3 + .heading--4,
h4 + .heading--4,
h5 + .heading--4,
.heading + .heading--4,
.heading--5.heading--first,
h4 + h5,
h5 + h5,
.heading + h5,
h1 + .heading--5,
h2 + .heading--5,
h3 + .heading--5,
h4 + .heading--5,
h5 + .heading--5,
.heading + .heading--5 {
margin-top: .625em;
/* 10px / 16px */
}
@media (min-width: 35em) {
.heading--0 {
font-size: 4.25em;
/* 68px / 16px */
line-height: 1.1176em;
/* 76px / 68px */
margin-bottom: .2205em;
/* 15px / 68px */
margin-top: .4411em;
/* 30px / 68px */
}
h1,
.heading--1 {
font-size: 2em;
/* 32px / 16px */
line-height: 1.3125em;
/* 42px / 32px */
margin-bottom: .46875em;
/* 15px / 32px */
margin-top: .9375em;
/* 30px / 32px */
}
h2,
.heading--2 {
font-size: 1.625em;
/* 26px / 16px */
line-height: 1.3076em;
/* 34px / 26px */
margin-bottom: .5769em;
/* 15px / 26px */
margin-top: 1.154em;
/* 30px / 26px */
}
.heading--0.heading--first,
h1 + .heading--0,
h2 + .heading--0,
h3 + .heading--0,
h4 + .heading--0,
h5 + .heading--0,
.heading + .heading--0 {
margin-top: .2205em;
/* 16px / 68px */
}
.heading--0.heading--first,
.heading + h1,
h1 + .heading--1,
h2 + .heading--1,
h3 + .heading--1,
h4 + .heading--1,
h5 + .heading--1,
.heading + .heading--1 {
margin-top: .4688em;
/* 16px / 32px */
}
.heading--2.heading--first,
h1 + h2,
.heading + h2,
h1 + .heading--2,
h2 + .heading--2,
h3 + .heading--2,
h4 + .heading--2,
h5 + .heading--2,
.heading + .heading--2 {
margin-top: .6154em;
/* -16px / 26px */
}
}
@media (min-width: 60em) {
.heading--0 {
font-size: 4.375em;
/* 70px / 16px */
line-height: 1.057em;
/* 74px / 70px */
margin-bottom: .2142em;
/* 15px / 70px */
margin-top: .4285em;
/* 30px / 70px */
}
h1,
.heading--1 {
font-size: 2.625em;
/* 42px / 16px */
line-height: 1.1905;
/* 50px / 42px */
margin-bottom: .3571em;
/* 15px / 42px */
margin-top: .7142em;
/* 30px / 42px */
}
h2,
.heading--2 {
font-size: 1.75em;
/* 28px / 16px */
line-height: 1.2857;
/* 36px / 28px */
margin-bottom: .5357em;
/* 15px / 28px */
margin-top: 1.0714em;
/* 30px / 28px */
}
.heading--0.heading--first,
h1 + .heading--0,
h2 + .heading--0,
h3 + .heading--0,
h4 + .heading--0,
h5 + .heading--0,
.heading + .heading--0 {
margin-top: .2142em;
/* 15px / 70px */
}
.heading--1.heading--first,
.heading + h1,
h1 + .heading--1,
h2 + .heading--1,
h3 + .heading--1,
h4 + .heading--1,
h5 + .heading--1,
.heading + .heading--1 {
margin-top: .3571em;
/* 15px / 42px */
}
.heading--2.heading--first,
h1 + h2,
.heading + h2,
h1 + .heading--2,
h2 + .heading--2,
h3 + .heading--2,
h4 + .heading--2,
h5 + .heading--2,
.heading + .heading--2 {
margin-top: .5375em;
/* 16px / 28px */
}
}
/* heading icon
========================================================================== */
.heading-icon {
text-align: center;
}
.heading-icon:before {
background-position: center center;
background-repeat: no-repeat;
content: '';
display: block;
height: 100px;
margin: 0 auto;
width: 100px;
}
.heading-icon--health:before,
.t-accent-light .heading-icon--health:before,
.t-accent-dark .t-accent-light .heading-icon--health:before {
background-image: url('../images/icons/products/health.png');
}
.svg .heading-icon--health:before,
.svg .t-accent-light .heading-icon--health:before,
.svg .t-accent-dark .t-accent-light .heading-icon--health:before {
background-image: url('../images/icons/products/health.svg');
}
.t-accent-dark .heading-icon--health:before {
background-image: url('../images/icons/products/health-white.png');
}
.svg .t-accent-dark .heading-icon--health:before {
background-image: url('../images/icons/products/health-white.svg');
}
.heading-icon--home:before,
.t-accent-light .heading-icon--home:before,
.t-accent-dark .t-accent-light .heading-icon--home:before {
background-image: url('../images/icons/products/home.png');
}
.svg .heading-icon--home:before,
.svg .t-accent-light .heading-icon--home:before,
.svg .t-accent-dark .t-accent-light .heading-icon--home:before {
background-image: url('../images/icons/products/home.svg');
}
.t-accent-dark .heading-icon--home:before {
background-image: url('../images/icons/products/home-white.png');
}
.svg .t-accent-dark .heading-icon--home:before {
background-image: url('../images/icons/products/home-white.svg');
}
.heading-icon--life:before,
.t-accent-light .heading-icon--life:before,
.t-accent-dark .t-accent-light .heading-icon--life:before {
background-image: url('../images/icons/products/life.png');
}
.svg .heading-icon--life:before,
.svg .t-accent-light .heading-icon--life:before,
.svg .t-accent-dark .t-accent-light .heading-icon--life:before {
background-image: url('../images/icons/products/life.svg');
}
.t-accent-dark .heading-icon--life:before {
background-image: url('../images/icons/products/life-white.png');
}
.svg .t-accent-dark .heading-icon--life:before {
background-image: url('../images/icons/products/life-white.svg');
}
.heading-icon--motor:before,
.t-accent-light .heading-icon--motor:before,
.t-accent-dark .t-accent-light .heading-icon--motor:before {
background-image: url('../images/icons/products/motor.png');
}
.svg .heading-icon--motor:before,
.svg .t-accent-light .heading-icon--motor:before,
.svg .t-accent-dark .t-accent-light .heading-icon--motor:before {
background-image: url('../images/icons/products/motor.svg');
}
.t-accent-dark .heading-icon--motor:before {
background-image: url('../images/icons/products/motor-white.png');
}
.svg .t-accent-dark .heading-icon--motor:before {
background-image: url('../images/icons/products/motor-white.svg');
}
.heading-icon--pensions:before,
.t-accent-light .heading-icon--pensions:before,
.t-accent-dark .t-accent-light .heading-icon--pensions:before {
background-image: url('../images/icons/products/pensions.png');
}
.svg .heading-icon--pensions:before,
.svg .t-accent-light .heading-icon--pensions:before,
.svg .t-accent-dark .t-accent-light .heading-icon--pensions:before {
background-image: url('../images/icons/products/pensions.svg');
}
.t-accent-dark .heading-icon--pensions:before {
background-image: url('../images/icons/products/pensions-white.png');
}
.svg .t-accent-dark .heading-icon--pensions:before {
background-image: url('../images/icons/products/pensions-white.svg');
}
.heading-icon--pet:before,
.t-accent-light .heading-icon--pet:before,
.t-accent-dark .t-accent-light .heading-icon--pet:before {
background-image: url('../images/icons/products/pet.png');
}
.svg .heading-icon--pet:before,
.svg .t-accent-light .heading-icon--pet:before,
.svg .t-accent-dark .t-accent-light .heading-icon--pet:before {
background-image: url('../images/icons/products/pet.svg');
}
.t-accent-dark .heading-icon--pet:before {
background-image: url('../images/icons/products/pet-white.png');
}
.svg .t-accent-dark .heading-icon--pet:before {
background-image: url('../images/icons/products/pet-white.svg');
}
.heading-icon--savings:before,
.t-accent-light .heading-icon--savings:before,
.t-accent-dark .t-accent-light .heading-icon--savings:before {
background-image: url('../images/icons/products/savings.png');
}
.svg .heading-icon--savings:before,
.svg .t-accent-light .heading-icon--savings:before,
.svg .t-accent-dark .t-accent-light .heading-icon--savings:before {
background-image: url('../images/icons/products/savings.svg');
}
.t-accent-dark .heading-icon--savings:before {
background-image: url('../images/icons/products/savings-white.png');
}
.svg .t-accent-dark .heading-icon--savings:before {
background-image: url('../images/icons/products/savings-white.svg');
}
.heading-icon--travel:before,
.t-accent-light .heading-icon--travel:before,
.t-accent-dark .t-accent-light .heading-icon--travel:before {
background-image: url('../images/icons/products/travel.png');
}
.svg .heading-icon--travel:before,
.svg .t-accent-light .heading-icon--travel:before,
.svg .t-accent-dark .t-accent-light .heading-icon--travel:before {
background-image: url('../images/icons/products/travel.svg');
}
.t-accent-dark .heading-icon--travel:before {
background-image: url('../images/icons/products/travel-white.png');
}
.svg .t-accent-dark .heading-icon--travel:before {
background-image: url('../images/icons/products/travel-white.svg');
}
/* ==========================================================================
BASE MISC
========================================================================== */
p {
margin: .625em 0;
/* 10px / 16px */
}
small {
font-size: .875em;
/* 14px / 16px */
line-height: 1.5714em;
/* 22px / 14px */
}
strong {
font-weight: bold;
}
.fonts-loaded strong {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
abbr[title] {
cursor: help;
text-decoration: none;
}
dt,
dd {
margin: 0;
}
.text-highlight,
.heading--0.text-highlight,
.heading--1.text-highlight,
.heading--2.text-highlight,
.heading--3.text-highlight {
color: #c01b83;
}
.heading--1.text-highlight {
font-weight: bold;
}
.fonts-loaded .heading--1.text-highlight {
font-family: 'source_sans_prosemibold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.text-highlight--warning {
color: #bd2624;
}
.text-highlight--warning:before {
background: #bd2624;
border-radius: 50%;
content: '';
display: inline-block;
height: .6875em;
/* 11px / 16px */
margin-right: .5em;
/* 8px / 16px */
width: .6875em;
/* 11px / 16px */
}
/* Media
========================================================================== */
img {
max-width: 100%;
}
video,
audio {
display: block;
margin: 0 auto;
max-width: 50em;
/* 800px / 16px */
width: 100%;
}
/* Dividing text
========================================================================== */
.dividing-text {
background: #eee;
margin-bottom: 1.875em;
/* 30px / 16px */
padding: .3125em .625em;
/* 5px 10px / 16px*/
}
/* Text icons
========================================================================== */
.text-icon {
background-position: left 0;
/* 4px / 16px */
background-repeat: no-repeat;
min-height: 1.625em;
/* 26px / 16px */
padding-left: 1.875em;
/* 30px /16px */
}
.text-icon--address,
.t-accent-light .text-icon--address,
.t-accent-dark .t-accent-light .text-icon--address {
background-image: url('../images/icons/address-dark-grey.png');
}
.svg .text-icon--address,
.svg .t-accent-light .text-icon--address,
.svg .t-accent-dark .t-accent-light .text-icon--address {
background-image: url('../images/icons/address-dark-grey.svg');
}
.t-accent-dark .text-icon--address {
background-image: url('../images/icons/address-white.png');
}
.svg .t-accent-dark .text-icon--address {
background-image: url('../images/icons/address-white.svg');
}
.text-icon--tel {
background-position: left .25em;
/* 4px / 16px */
}
.text-icon--tel,
.t-accent-light .text-icon--tel,
.t-accent-dark .t-accent-light .text-icon--tel {
background-image: url('../images/icons/phone-dark-grey.png');
}
.svg .text-icon--tel,
.svg .t-accent-light .text-icon--tel,
.svg .t-accent-dark.t-accent-light .text-icon--tel {
background-image: url('../images/icons/phone-dark-grey.svg');
}
.t-accent-dark .text-icon--tel {
background-image: url('../images/icons/phone-white.png');
}
.svg .t-accent-dark .text-icon--tel {
background-image: url('../images/icons/phone-white.svg');
}
.text-icon--email {
background-position: left .375em;
/* 6px / 16px */
word-wrap: break-word;
}
.text-icon--email,
.t-accent-light .text-icon--email,
.t-accent-dark .t-accent-light .text-icon--email {
background-image: url('../images/icons/email-dark-grey.png');
}
.svg .text-icon--email,
.svg .t-accent-light .text-icon--email,
.svg .t-accent-dark .t-accent-light .text-icon--email {
background-image: url('../images/icons/email-dark-grey.svg');
}
.t-accent-dark .text-icon--email {
background-image: url('../images/icons/email-white.png');
}
.svg .t-accent-dark .text-icon--email {
background-image: url('../images/icons/email-white.svg');
}
/* ==========================================================================
HELPERS
========================================================================== */
.u-align--left,
html .u-align--left {
float: left;
}
.u-align--center,
html .u-align--center {
margin-left: auto;
margin-right: auto;
}
.u-align--right,
html .u-align--right {
float: right;
}
.u-clear--both,
html .u-clear--both {
clear: both;
}
.u-clear--left,
html .u-clear--left {
clear: left;
}
.u-clear--right,
html .u-clear--right {
clear: right;
}
.u-clear--inner:before,
.u-clear--inner:after,
html .u-clear--inner:before,
html .u-clear--inner:after {
content: '';
display: table;
}
.u-clear--inner:after,
html .u-clear--inner:after {
clear: both;
}
.u-text--left,
html .u-text--left {
text-align: left;
}
.u-text--center,
html .u-text--center {
text-align: center;
}
.u-text--right,
html .u-text--right {
text-align: right;
}
.u-hidden,
html .u-hidden {
display: none;
}
.u-hidden--visually,
html .u-hidden--visually {
left: -9999em;
opacity: 0;
position: absolute;
}
.u-hidden--no-js,
html .u-hidden--no-js {
display: none;
}
.js .u-hidden--no-js,
html .js .u-hidden--no-js {
display: block;
}
.js .u-hidden--js,
html.js .u-hidden--js {
display: none;
}
.u-margin--bottom-none,
html .u-margin--bottom-none {
margin-bottom: 0;
}
.u-margin--top-none,
html .u-margin--top-none {
margin-top: 0;
}
/* ==========================================================================
LINKS
========================================================================== */
a {
border-bottom: 1px solid #ccc;
color: #004fb6;
font-weight: bold;
padding-bottom: 1px;
text-decoration: none;
transition: border-bottom-color .25s;
}
.t-accent-light a,
.t-card-accent-light .m-card a,
.t-accent-dark .t-accent-light a,
.t-card-accent-dark .m-card.t-accent-light a,
.t-card-accent-dark .m-card.t-accent-light a {
border-bottom-color: #ccc;
border-bottom-style: solid;
color: #004fb6;
}
.t-accent-light--yellow a,
.t-card-accent-light--yellow .m-card a,
.t-accent-dark .t-accent-light--yellow a,
.t-card-accent-dark .m-card.t-accent-light--yellow a {
border-bottom-color: #999;
}
.t-accent-dark a,
.t-card-accent-dark .m-card a,
.t-card-accent-light .m-card.t-accent-dark a {
border-bottom-color: #ccc;
border-bottom-style: dotted;
color: #fff;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
.heading a,
.t-accent-light h1 a,
.t-accent-light h2 a,
.t-accent-light h3 a,
.t-accent-light h4 a,
.t-accent-light h5 a,
.t-accent-light .heading a,
.t-accent-dark .t-accent-light h1 a,
.t-accent-dark .t-accent-light h2 a,
.t-accent-dark .t-accent-light h3 a,
.t-accent-dark .t-accent-light h4 a,
.t-accent-dark .t-accent-light h5 a,
.t-accent-dark .t-accent-light .heading a,
.t-accent-dark h1 a,
.t-accent-dark h2 a,
.t-accent-dark h3 a,
.t-accent-dark h4 a,
.t-accent-dark h5 a,
.t-accent-dark .heading a {
border-bottom-color: transparent;
}
.fonts-loaded a {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
a:visited,
.t-accent-light a:visited,
.t-card-accent-light .m-card a:visited,
.t-accent-dark .t-accent-light a:visited,
.t-card-accent-dark .m-card.t-accent-light a:visited {
color: #87378e;
}
.t-accent-dark a:visited,
.t-card-accent-dark .m-card a:visited,
.t-card-accent-light .m-card.t-accent-dark a:visited {
color: #fff;
}
h1 a:visited,
h2 a:visited,
h3 a:visited,
h4 a:visited,
h5 a:visited,
.heading a:visited,
.t-accent-light h1 a:visited,
.t-accent-light h2 a:visited,
.t-accent-light h3 a:visited,
.t-accent-light h4 a:visited,
.t-accent-light h5 a:visited,
.t-accent-light .heading a:visited,
.t-accent-dark .t-accent-light h1 a:visited,
.t-accent-dark .t-accent-light h2 a:visited,
.t-accent-dark .t-accent-light h3 a:visited,
.t-accent-dark .t-accent-light h4 a:visited,
.t-accent-dark .t-accent-light h5 a:visited,
.t-accent-dark .t-accent-light .heading a:visited {
color: #004fb6;
}
.t-accent-dark h1 a:visited,
.t-accent-dark h2 a:visited,
.t-accent-dark h3 a:visited,
.t-accent-dark h4 a:visited,
.t-accent-dark h5 a:visited,
.t-accent-dark .heading a:visited {
color: #fff;
}
a:hover,
a:focus,
a:active,
.t-accent-light a:hover,
.t-accent-light a:focus,
.t-accent-light a:active,
.t-card-accent-light .m-card a:hover,
.t-card-accent-light .m-card a:focus,
.t-card-accent-light .m-card a:active,
.t-accent-dark .t-accent-light a:hover,
.t-accent-dark .t-accent-light a:focus,
.t-accent-dark .t-accent-light a:active,
.t-card-accent-dark .m-card.t-accent-light a:hover,
.t-card-accent-dark .m-card.t-accent-light a:focus,
.t-card-accent-dark .m-card.t-accent-light a:active {
border-bottom-color: #004fb6;
border-bottom-style: solid;
}
.t-accent-dark a:hover,
.t-accent-dark a:focus,
.t-accent-dark a:active,
.t-card-accent-dark .m-card a:hover,
.t-card-accent-dark .m-card a:focus,
.t-card-accent-dark .m-card a:active,
.t-card-accent-light .m-card.t-accent-dark a:hover,
.t-card-accent-light .m-card.t-accent-dark a:focus,
.t-card-accent-light .m-card.t-accent-dark a:active {
border-bottom-color: #fff;
border-bottom-style: solid;
}
.heading--0 a,
.fonts-loaded .heading--0 a,
h1 a,
.heading--1 a,
.fonts-loaded h1 a,
h2 a,
.heading--2 a,
.fonts-loaded h2 a,
h3 a,
.heading--3 a,
.fonts-loaded h3 a,
h4 a,
.heading--4 a,
.fonts-loaded h4 a,
h5 a,
.heading--5 a,
.fonts-loaded h5 a,
h6 a,
.heading--6 a,
.fonts-loaded h6 a {
font-family: inherit;
font-weight: inherit;
}
/* Link icons - Core styles
==========================================================================
Example
*/
.link-icon {
border-bottom: 0;
display: inline;
padding-bottom: 0;
position: relative;
}
.link-icon__inner {
border-bottom: 1px solid #ccc;
display: inline;
padding-bottom: .1em;
transition: border-bottom-color .25s;
}
.link-icon .link-icon__inner,
.t-accent-light .link-icon .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon .link-icon__inner {
border-bottom-color: #ccc;
border-bottom-style: solid;
}
.link-icon:hover .link-icon__inner,
.link-icon:focus .link-icon__inner,
.link-icon:active .link-icon__inner,
.t-accent-light .link-icon:hover .link-icon__inner,
.t-accent-light .link-icon:focus .link-icon__inner,
.t-accent-light .link-icon:active .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon:hover .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon:focus .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon:active .link-icon__inner {
border-bottom-color: #004fb6;
border-bottom-style: solid;
}
.t-accent-dark .link-icon .link-icon__inner {
border-bottom-color: #ccc;
border-bottom-style: dotted;
}
.t-accent-dark .link-icon:hover .link-icon__inner,
.t-accent-dark .link-icon:focus .link-icon__inner,
.t-accent-dark .link-icon:active .link-icon__inner {
border-bottom-color: #fff;
border-bottom-style: solid;
}
.link-icon:before {
background-position: center center;
background-repeat: no-repeat;
content: '';
display: inline-block;
height: 1.5em;
/* 24px / 16px */
margin-bottom: -.375em;
/* -6px / 16px */
margin-right: .5em;
/* 8px / 16px */
width: 1.5em;
/* 24px / 16px */
}
.link-icon--external:before,
.link-icon--info:before {
display: none;
}
.link-icon--external:after,
.link-icon--info:after {
background-position: center center;
background-repeat: no-repeat;
content: '';
display: inline-block;
height: 1.5em;
/* 24px / 16px */
margin-bottom: -.375em;
/* -6px / 16px */
margin-left: .5em;
/* 8px / 16px */
width: 1.5em;
/* 24px / 16px */
}
.link-icon--info:after {
height: 1.75em;
/* 28px / 16px */
width: 1.75em;
/* 28px / 16px */
}
.link-icon--info:after,
.t-accent-light .link-icon--info:after,
.t-accent-dark .t-accent-light .link-icon--info:after {
background-image: url('../images/icons/info.png');
}
.svg .link-icon--info:after,
.svg .t-accent-light .link-icon--info:after,
.svg .t-accent-dark .t-accent-light .link-icon--info:after {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOCI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiNmZmY7c3Ryb2tlOiMwMDRmYjY7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fS5jbHMtMntmaWxsOiMwMDRmYjY7fTwvc3R5bGU+PC9kZWZzPjx0aXRsZT5pbmZvPC90aXRsZT48Y2lyY2xlIGN4PSIxNCIgY3k9IjE0IiByPSIxMy41IiBjbGFzcz0iY2xzLTEiLz48cGF0aCBkPSJNMTQgOS41NGExLjQ3IDEuNDcgMCAwIDEtMS0uMzYgMS4yIDEuMiAwIDAgMS0uNC0uOTQgMS4yNCAxLjI0IDAgMCAxIC40LTEgMS42IDEuNiAwIDAgMSAyIDAgMS4yNCAxLjI0IDAgMCAxIC40IDEgMS4yIDEuMiAwIDAgMS0uNC45NCAxLjQ3IDEuNDcgMCAwIDEtMSAuMzZ6bS0xLjE2IDEuNzJoMi4zdjkuODJoLTIuM3YtOS44MnoiIGNsYXNzPSJjbHMtMiIvPjwvc3ZnPg==');
}
.t-accent-dark .link-icon--info:after {
background-image: url('../images/icons/info-white.png');
}
.svg .t-accent-dark .link-icon--info:after {
background-image: url('../images/icons/info-white.svg');
}
.link-icon--external:after {
margin-left: 0;
}
.link-icon--external:after,
.t-accent-light .link-icon--external:after,
.t-accent-dark .t-accent-light .link-icon--external:after {
background-image: url('../images/icons/external.png');
}
.svg .link-icon--external:after,
.svg .t-accent-light .link-icon--external:after,
.svg .t-accent-dark .t-accent-light .link-icon--external:after {
background-image: url('../images/icons/external.svg');
}
.t-accent-dark .link-icon--external:after {
background-image: url('../images/icons/external-white.png');
}
.svg .t-accent-dark .link-icon--external:after {
background-image: url('../images/icons/external-white.svg');
}
.link-icon--download:before,
.t-accent-light .link-icon--download:before,
.t-accent-dark .t-accent-light .link-icon--download:before {
background-image: url('../images/icons/download.png');
}
.svg .link-icon--download:before,
.svg .t-accent-light .link-icon--download:before,
.svg .t-accent-dark .t-accent-light .link-icon--download:before {
background-image: url('../images/icons/download.svg');
}
.t-accent-dark .link-icon--download:before {
background-image: url('../images/icons/download-white.png');
}
.svg .t-accent-dark .link-icon--download:before {
background-image: url('../images/icons/download-white.svg');
}
.link-icon--edit:before,
.t-accent-light .link-icon--edit:before,
.t-accent-dark .t-accent-light .link-icon--edit:before {
background-image: url('../images/icons/edit.png');
}
.svg .link-icon--edit:before,
.svg .t-accent-light .link-icon--edit:before,
.svg .t-accent-dark .t-accent-light .link-icon--edit:before {
background-image: url('../images/icons/edit.svg');
}
.t-accent-dark .link-icon--edit:before {
background-image: url('../images/icons/edit-white.png');
}
.svg .t-accent-dark .link-icon--edit:before {
background-image: url('../images/icons/edit-white.svg');
}
.link-icon--delete:before,
.t-accent-light .link-icon--delete:before,
.t-accent-dark .t-accent-light .link-icon--delete:before {
background-image: url('../images/icons/delete.png');
}
.svg .link-icon--delete:before,
.svg .t-accent-light .link-icon--delete:before,
.svg .t-accent-dark .t-accent-light .link-icon--delete:before {
background-image: url('../images/icons/delete.svg');
}
.t-accent-dark .link-icon--delete:before {
background-image: url('../images/icons/delete-white.png');
}
.svg .t-accent-dark .link-icon--delete:before {
background-image: url('../images/icons/delete-white.svg');
}
.link-icon--back:before,
.t-accent-light .link-icon--back:before,
.t-accent-dark .t-accent-light .link-icon--back:before {
background-image: url('../images/icons/reply.png');
}
.svg .link-icon--back:before,
.svg .t-accent-light .link-icon--back:before,
.svg .t-accent-dark .t-accent-light .link-icon--back:before {
background-image: url('../images/icons/reply.svg');
}
.t-accent-dark .link-icon--back:before {
background-image: url('../images/icons/reply-white.png');
}
.svg .t-accent-dark .link-icon--back:before {
background-image: url('../images/icons/reply-white.svg');
}
.link-icon--message:before,
.t-accent-light .link-icon--message:before,
.t-accent-dark .t-accent-light .link-icon--message:before {
background-image: url('../images/icons/email.png');
}
.svg .link-icon--message:before,
.svg .t-accent-light .link-icon--message:before,
.svg .t-accent-dark .t-accent-light .link-icon--message:before {
background-image: url('../images/icons/email.svg');
}
.t-accent-dark .link-icon--message:before {
background-image: url('../images/icons/email-white.png');
}
.svg .t-accent-dark .link-icon--message:before {
background-image: url('../images/icons/email-white.svg');
}
.link-icon--document:before,
.t-accent-light .link-icon--document:before,
.t-accent-dark .t-accent-light .link-icon--document:before {
background-image: url('../images/icons/document.png');
}
.svg .link-icon--document:before,
.svg .t-accent-light .link-icon--document:before,
.svg .t-accent-dark .t-accent-light .link-icon--document:before {
background-image: url('../images/icons/document.svg');
}
.t-accent-dark .link-icon--document:before {
background-image: url('../images/icons/document-white.png');
}
.svg .t-accent-dark .link-icon--document:before {
background-image: url('../images/icons/document-white.svg');
}
.link-icon--edit.link-icon--edit-no-onward:visited,
.t-accent-light .link-icon--edit.link-icon--edit-no-onward:visited,
.t-accent-dark .t-accent-light .link-icon--edit.link-icon--edit-no-onward:visited {
color: #004fb6;
}
.t-accent-dark .link-icon--edit.link-icon--edit-no-onward:visited {
color: #fff;
}
.link-icon--edit.link-icon--edit-no-onward .link-icon__inner,
.t-accent-light .link-icon--edit.link-icon--edit-no-onward .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon--edit.link-icon--edit-no-onward .link-icon__inner,
.t-accent-dark .link-icon--edit.link-icon--edit-no-onward .link-icon__inner {
border-bottom-color: transparent;
}
.link-icon--edit.link-icon--edit-no-onward:hover .link-icon__inner,
.link-icon--edit.link-icon--edit-no-onward:focus .link-icon__inner,
.t-accent-light .link-icon--edit.link-icon--edit-no-onward:hover .link-icon__inner,
.t-accent-light .link-icon--edit.link-icon--edit-no-onward:focus .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon--edit.link-icon--edit-no-onward:hover .link-icon__inner,
.t-accent-dark .t-accent-light .link-icon--edit.link-icon--edit-no-onward:focus .link-icon__inner {
border-bottom-color: #004fb6;
}
.t-accent-dark .link-icon--edit.link-icon--edit-no-onward:hover .link-icon__inner,
.t-accent-dark .link-icon--edit.link-icon--edit-no-onward:focus .link-icon__inner {
border-bottom-color: #fff;
}
.link-icon--specialism:before {
background-color: #eee;
background-position: center center;
background-repeat: no-repeat;
border-radius: 50%;
content: '\00a0';
display: inline-block;
height: 2.8125em;
/* 45px / 16px */
line-height: 2.8125em;
/* 45px / 16px */
margin-bottom: .25em;
/* 4px / 16px */
width: 2.8125em;
/* 45px / 16px */
}
.link-icon--specialism.link-icon--agricultural-professionals-insurance:before {
background-image: url('../images/icons/specialities/agricultural-professionals-insurance.png');
}
.svg .link-icon--specialism.link-icon--agricultural-professionals-insurance:before {
background-image: url('../images/icons/specialities/agricultural-professionals-insurance.svg');
}
.link-icon--specialism.link-icon--artisan-shopkeepers-insurance:before {
background-image: url('../images/icons/specialities/artisan-shopkeepers-insurance.png');
}
.svg .link-icon--specialism.link-icon--artisan-shopkeepers-insurance:before {
background-image: url('../images/icons/specialities/artisan-shopkeepers-insurance.svg');
}
.link-icon--specialism.link-icon--association-organization-insurance:before {
background-image: url('../images/icons/specialities/association-organization-insurance.png');
}
.svg .link-icon--specialism.link-icon--association-organization-insurance:before {
background-image: url('../images/icons/specialities/association-organization-insurance.svg');
}
.link-icon--specialism.link-icon--breakdown:before {
background-image: url('../images/icons/specialities/breakdown.png');
}
.svg .link-icon--specialism.link-icon--breakdown:before {
background-image: url('../images/icons/specialities/breakdown.svg');
}
.link-icon--specialism.link-icon--business-insurance:before {
background-image: url('../images/icons/specialities/business-insurance-self-employed.png');
}
.svg .link-icon--specialism.link-icon--business-insurance:before {
background-image: url('../images/icons/specialities/business-insurance-self-employed.svg');
}
.link-icon--specialism.link-icon--company-insurance:before {
background-image: url('../images/icons/specialities/company-insurance-public-sector.png');
}
.svg .link-icon--specialism.link-icon--company-insurance:before {
background-image: url('../images/icons/specialities/company-insurance-public-sector.svg');
}
.link-icon--specialism.link-icon--construction-workers-insurance:before {
background-image: url('../images/icons/specialities/construction-workers-insurance.png');
}
.svg .link-icon--specialism.link-icon--construction-workers-insurance:before {
background-image: url('../images/icons/specialities/construction-workers-insurance.svg');
}
.link-icon--specialism.link-icon--critical-illness:before {
background-image: url('../images/icons/specialities/critical-illness-personal-accident.png');
}
.svg .link-icon--specialism.link-icon--critical-illness:before {
background-image: url('../images/icons/specialities/critical-illness-personal-accident.svg');
}
.link-icon--specialism.link-icon--equity-release:before {
background-image: url('../images/icons/specialities/equity-release.png');
}
.svg .link-icon--specialism.link-icon--equity-release:before {
background-image: url('../images/icons/specialities/equity-release.svg');
}
.link-icon--specialism.link-icon--goods-equipment-insurance:before {
background-image: url('../images/icons/specialities/goods-equipment-insurance.png');
}
.svg .link-icon--specialism.link-icon--goods-equipment-insurance:before {
background-image: url('../images/icons/specialities/goods-equipment-insurance.svg');
}
.link-icon--specialism.link-icon--health:before {
background-image: url('../images/icons/specialities/health.png');
}
.svg .link-icon--specialism.link-icon--health:before {
background-image: url('../images/icons/specialities/health.svg');
}
.link-icon--specialism.link-icon--health-cash-plan:before {
background-image: url('../images/icons/specialities/health-cash-plan.png');
}
.svg .link-icon--specialism.link-icon--health-cash-plan:before {
background-image: url('../images/icons/specialities/health-cash-plan.svg');
}
.link-icon--specialism.link-icon--health-professionals-insurance:before {
background-image: url('../images/icons/specialities/health-professionals-insurance.png');
}
.svg .link-icon--specialism.link-icon--health-professionals-insurance:before {
background-image: url('../images/icons/specialities/health-professionals-insurance.svg');
}
.link-icon--specialism.link-icon--home:before {
background-image: url('../images/icons/specialities/home.png');
}
.svg .link-icon--specialism.link-icon--home:before {
background-image: url('../images/icons/specialities/home.svg');
}
.link-icon--specialism.link-icon--investment-account:before {
background-image: url('../images/icons/specialities/investment-account.png');
}
.svg .link-icon--specialism.link-icon--investment-account:before {
background-image: url('../images/icons/specialities/investment-account.svg');
}
.link-icon--specialism.link-icon--isa:before {
background-image: url('../images/icons/specialities/isa.png');
}
.svg .link-icon--specialism.link-icon--isa:before {
background-image: url('../images/icons/specialities/isa.svg');
}
.link-icon--specialism.link-icon--it-professionals-insurance:before {
background-image: url('../images/icons/specialities/it-professionals-insurance.png');
}
.svg .link-icon--specialism.link-icon--it-professionals-insurance:before {
background-image: url('../images/icons/specialities/it-professionals-insurance.svg');
}
.link-icon--specialism.link-icon--legal-protection:before {
background-image: url('../images/icons/specialities/legal-protection.png');
}
.svg .link-icon--specialism.link-icon--legal-protection:before {
background-image: url('../images/icons/specialities/legal-protection.svg');
}
.link-icon--specialism.link-icon--life:before {
background-image: url('../images/icons/specialities/life.png');
}
.svg .link-icon--specialism.link-icon--life:before {
background-image: url('../images/icons/specialities/life.svg');
}
.link-icon--specialism.link-icon--motor:before {
background-image: url('../images/icons/specialities/motor.png');
}
.svg .link-icon--specialism.link-icon--motor:before {
background-image: url('../images/icons/specialities/motor.svg');
}
.link-icon--specialism.link-icon--motor-professional-insurance:before {
background-image: url('../images/icons/specialities/motor-professional-insurance.png');
}
.svg .link-icon--specialism.link-icon--motor-professional-insurance:before {
background-image: url('../images/icons/specialities/motor-professional-insurance.svg');
}
.link-icon--specialism.link-icon--multi-vehicle:before {
background-image: url('../images/icons/specialities/multi-vehicle.png');
}
.svg .link-icon--specialism.link-icon--multi-vehicle:before {
background-image: url('../images/icons/specialities/multi-vehicle.svg');
}
.link-icon--specialism.link-icon--office-shop-insurance:before {
background-image: url('../images/icons/specialities/office-shop-insurance.png');
}
.svg .link-icon--specialism.link-icon--office-shop-insurance:before {
background-image: url('../images/icons/specialities/office-shop-insurance.svg');
}
.link-icon--specialism.link-icon--payment-insurance:before {
background-image: url('../images/icons/specialities/payment-insurance.png');
}
.svg .link-icon--specialism.link-icon--payment-insurance:before {
background-image: url('../images/icons/specialities/payment-insurance.svg');
}
.link-icon--specialism.link-icon--pensions:before {
background-image: url('../images/icons/specialities/pensions.png');
}
.svg .link-icon--specialism.link-icon--pensions:before {
background-image: url('../images/icons/specialities/pensions.svg');
}
.link-icon--specialism.link-icon--personal-accident-insurance:before {
background-image: url('../images/icons/specialities/critical-illness-personal-accident.png');
}
.svg .link-icon--specialism.link-icon--personal-accident-insurance:before {
background-image: url('../images/icons/specialities/critical-illness-personal-accident.svg');
}
.link-icon--specialism.link-icon--pet:before {
background-image: url('../images/icons/specialities/pet.png');
}
.svg .link-icon--specialism.link-icon--pet:before {
background-image: url('../images/icons/specialities/pet.svg');
}
.link-icon--specialism.link-icon--public-liability-insurance:before {
background-image: url('../images/icons/specialities/public-liability-insurance.png');
}
.svg .link-icon--specialism.link-icon--public-liability-insurance:before {
background-image: url('../images/icons/specialities/public-liability-insurance.svg');
}
.link-icon--specialism.link-icon--public-sector-professionals-insurance:before {
background-image: url('../images/icons/specialities/company-insurance-public-sector.png');
}
.svg .link-icon--specialism.link-icon--public-sector-professionals-insurance:before {
background-image: url('../images/icons/specialities/company-insurance-public-sector.svg');
}
.link-icon--specialism.link-icon--retirement-income:before {
background-image: url('../images/icons/specialities/retirement-income.png');
}
.svg .link-icon--specialism.link-icon--retirement-income:before {
background-image: url('../images/icons/specialities/retirement-income.svg');
}
.link-icon--specialism.link-icon--savings-and-investment:before {
background-image: url('../images/icons/specialities/savings-and-investment.png');
}
.svg .link-icon--specialism.link-icon--savings-and-investment:before {
background-image: url('../images/icons/specialities/savings-and-investment.svg');
}
.link-icon--specialism.link-icon--school-family-protection-insurance:before {
background-image: url('../images/icons/specialities/school-family-protection-insurance.png');
}
.svg .link-icon--specialism.link-icon--school-family-protection-insurance:before {
background-image: url('../images/icons/specialities/school-family-protection-insurance.svg');
}
.link-icon--specialism.link-icon--self-employed-professionals-insurance:before {
background-image: url('../images/icons/specialities/business-insurance-self-employed.png');
}
.svg .link-icon--specialism.link-icon--self-employed-professionals-insurance:before {
background-image: url('../images/icons/specialities/business-insurance-self-employed.svg');
}
.link-icon--specialism.link-icon--service-providers-insurance:before {
background-image: url('../images/icons/specialities/tertiary-sector-service-provider.png');
}
.svg .link-icon--specialism.link-icon--service-providers-insurance:before {
background-image: url('../images/icons/specialities/tertiary-sector-service-provider.svg');
}
.link-icon--specialism.link-icon--tertiary-sector:before {
background-image: url('../images/icons/specialities/tertiary-sector-service-provider.png');
}
.svg .link-icon--specialism.link-icon--tertiary-sector:before {
background-image: url('../images/icons/specialities/tertiary-sector-service-provider.svg');
}
.link-icon--specialism.link-icon--travel:before {
background-image: url('../images/icons/specialities/travel.png');
}
.svg .link-icon--specialism.link-icon--travel:before {
background-image: url('../images/icons/specialities/travel.svg');
}
/* ==========================================================================
BREADCRUMB
========================================================================== */
.breadcrumb {
font-size: .875em;
/* 14px / 16px */
line-height: 1.286em;
/* 18px / 14px */
}
.breadcrumb__link {
font-weight: normal;
}
.fonts-loaded .breadcrumb__link {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.breadcrumb__current {
border-bottom: 2px solid #4f9f31;
font-weight: bold;
}
.fonts-loaded .breadcrumb__current {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.breadcrumb__current,
.breadcrumb__link {
display: inline-block;
padding-bottom: .3571em;
/* 5px / 14px */
}
.t-accent-light .breadcrumb__current,
.t-accent-dark .t-accent-light .breadcrumb__current {
border-bottom-color: #4f9f31;
}
.t-accent-dark .breadcrumb__current {
border-bottom-color: #fff;
}
.breadcrumb__link,
.breadcrumb__link:visited {
border-bottom: 2px solid transparent;
color: #444;
}
.t-accent-light .breadcrumb__link,
.t-accent-light .breadcrumb__link:visited,
.t-accent-dark .t-accent-light .breadcrumb__link,
.t-accent-dark .t-accent-light .breadcrumb__link:visited,
.t-accent-dark .breadcrumb__link,
.t-accent-dark .breadcrumb__link:visited {
border-bottom-color: transparent;
border-bottom-style: solid;
color: #444;
}
.t-accent-dark .breadcrumb__link,
.t-accent-dark .breadcrumb__link:visited {
color: #fff;
}
.breadcrumb__link:focus,
.breadcrumb__link:hover,
.t-accent-light .breadcrumb__link:focus,
.t-accent-light .breadcrumb__link:hover,
.t-accent-dark .t-accent-light .breadcrumb__link:focus,
.t-accent-dark .t-accent-light .breadcrumb__link:hover {
border-bottom-color: #004fb6;
color: #004fb6;
}
.t-accent-dark .breadcrumb__link:focus,
.t-accent-dark .breadcrumb__link:hover {
border-bottom-color: #fff;
color: #fff;
}
.breadcrumb__gt {
background: url('../images/icons/arrow-right-grey.png') no-repeat center center;
display: inline-block;
padding: 0 .7143em;
/* 10px / 14px */
text-align: left;
text-indent: -9999em;
width: 1em;
/* 14px / 14px */
}
.t-accent-light .breadcrumb__gt,
.t-accent-dark .t-accent-light .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-grey.png');
}
.svg .breadcrumb__gt,
.svg .t-accent-light .breadcrumb__gt,
.svg .t-accent-dark .t-accent-light .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-grey.svg');
}
.t-accent-light.t-accent-light--yellow .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-dark-grey.png');
}
.svg .t-accent-light.t-accent-light--yellow .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-dark-grey.svg');
}
.t-accent-dark .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-white.png');
}
.svg .t-accent-dark .breadcrumb__gt {
background-image: url('../images/icons/arrow-right-white.svg');
}
/* ==========================================================================
BUTTONS
========================================================================== */
/* Button - Core styles
==========================================================================
Example
*/
.btn,
.btn--input .btn--input__inner {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: #fff;
border: 1px solid #ccc;
border-radius: .25em;
/* 4px / 16px */
color: #004fb6;
cursor: pointer;
display: block;
font: bold 1em/1.5 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 16px/24px / 16px */
line-height: 1.5625em;
/* 25px / 16px */
margin: 0;
min-width: 6.25em;
/* 100px / 16px */
padding: .875em 1.875em;
/* 14px 30px / 16px */
position: relative;
text-align: center;
text-decoration: none;
transition: background-color .35s, border-color .35s, color .35s;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
vertical-align: middle;
/* Fix for FF not aligning different button types vertically */
width: 100%;
}
.btn,
.t-accent-light .btn,
.t-card-accent-light .m-card .btn,
.t-accent-dark .t-accent-light .btn,
.t-card-accent-dark .m-card.t-accent-light .btn,
.t-accent-dark .btn,
.t-card-accent-dark .m-card .btn,
.t-card-accent-light .m-card.t-accent-dark .btn,
.btn--input .btn--input__inner,
.t-accent-light .btn--input .btn--input__inner,
.t-card-accent-light .m-card .btn--input .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input .btn--input__inner,
.t-card-accent-light .m-card .btn--input .btn--input__inner,
.t-card-accent-dark .m-card.t-accent-light .btn--input .btn--input__inner,
.t-accent-dark .btn--input .btn--input__inner,
.t-card-accent-dark .m-card .btn--input .btn--input__inner,
.t-card-accent-light .m-card.t-accent-dark .btn--input .btn--input__inner {
border-bottom-style: solid;
border-color: #ccc;
color: #004fb6;
}
.btn:visited,
.t-accent-light .btn:visited,
.t-card-accent-light .m-card .btn:visited,
.t-accent-dark .t-accent-light .btn:visited,
.t-card-accent-light .m-card .btn:visited,
.t-card-accent-light .btn:visited,
.t-card-accent-dark .m-card.t-accent-light .btn:visited,
.t-accent-dark .btn:visited,
.t-card-accent-dark .m-card .btn:visited,
.t-card-accent-light .m-card.t-accent-dark .btn:visited {
color: #004fb6;
}
.fonts-loaded .btn,
.fonts-loaded .btn--input .btn--input__inner {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.btn--input {
padding: 0;
}
.btn--input .btn--input__inner {
background: none;
border: 0;
margin: 0;
white-space: normal;
}
.btn:hover,
.t-accent-light .btn:hover,
.t-card-accent-light .m-card .btn:hover,
.t-accent-dark .t-accent-light .btn:hover,
.t-card-accent-light .m-card .btn:hover,
.t-card-accent-dark .m-card.t-accent-light .btn:hover,
.t-accent-dark .btn:hover,
.t-card-accent-dark .m-card .btn:hover,
.t-card-accent-light .m-card.t-accent-dark .btn:hover,
.btn:focus,
.t-accent-light .btn:focus,
.t-card-accent-light .m-card .btn:focus,
.t-accent-dark .t-accent-light .btn:focus,
.t-card-accent-light .m-card .btn:focus,
.t-card-accent-dark .m-card.t-accent-light .btn:focus,
.t-accent-dark .btn:focus,
.t-card-accent-dark .m-card .btn:focus,
.t-card-accent-light .m-card.t-accent-dark .btn:focus {
background-color: #004fb6;
border-color: #004fb6;
color: #fff;
}
.btn--input:hover .btn--input__inner,
.t-accent-light .btn--input:hover .btn--input__inner,
.t-card-accent-light .m-card .btn--input:hover .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input:hover .btn--input__inner,
.t-card-accent-light .m-card .btn--input:hover .btn--input__inner,
.t-card-accent-dark .m-card.t-accent-light .btn--input:hover .btn--input__inner,
.t-accent-dark .btn--input:hover .btn--input__inner,
.t-card-accent-dark .m-card .btn--input:hover .btn--input__inner,
.t-card-accent-light .m-card.t-accent-dark .btn--input:hover .btn--input__inner,
.btn--input:focus .btn--input__inner,
.t-accent-light .btn--input:focus .btn--input__inner,
.t-card-accent-light .m-card .btn--input:focus .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input:focus .btn--input__inner,
.t-card-accent-light .m-card .btn--input:focus .btn--input__inner,
.t-card-accent-dark .m-card.t-accent-light .btn--input:focus .btn--input__inner,
.t-accent-dark .btn--input:focus .btn--input__inner,
.t-card-accent-dark .m-card .btn--input:focus .btn--input__inner,
.t-card-accent-light .m-card.t-accent-dark .btn--input:focus .btn--input__inner {
color: #fff;
}
.btn:active,
.t-accent-light .btn:active,
.t-card-accent-light .m-card .btn:active,
.t-accent-dark .t-accent-light .btn:active,
.t-card-accent-light .m-card .btn:active,
.t-card-accent-dark .m-card.t-accent-light .btn:active,
.t-accent-dark .btn:active,
.t-card-accent-dark .m-card .btn:active,
.t-card-accent-light .m-card.t-accent-dark .btn:active {
background-color: #003b88;
border-color: #003b88;
color: #fff;
}
@media (min-width: 35em) {
.btn {
display: inline-block;
width: auto;
}
}
/* Button - Full width type modifier
==========================================================================
Example:
*/
@media (min-width: 35em) {
.btn--full-width {
display: block;
width: 100%;
}
}
/* Button - Primary type modifier
==========================================================================
Example:;
*/
.btn--primary,
.t-accent-light .btn--primary,
.t-card-accent-light .m-card .btn--primary,
.t-accent-dark .t-accent-light .btn--primary,
.t-card-accent-light .m-card .btn--primary,
.t-card-accent-dark .m-card.t-accent-light .btn--primary,
.t-accent-dark .btn--primary,
.t-card-accent-dark .m-card .btn--primary,
.t-card-accent-light .m-card.t-accent-dark .btn--primary {
background: #ffd900;
border-color: #ffd900;
border-style: solid;
color: #004fb6;
}
.btn--primary:visited,
.t-accent-light .btn--primary:visited,
.t-card-accent-light .m-card .btn--primary:visited,
.t-accent-dark .t-accent-light .btn--primary:visited,
.t-card-accent-light .m-card .btn--primary:visited,
.t-card-accent-dark .m-card.t-accent-light .btn--primary:visited,
.t-accent-dark .btn--primary:visited,
.t-card-accent-dark .m-card .btn--primary:visited,
.t-card-accent-light .m-card.t-accent-dark .btn--primary:visited {
color: #004fb6;
}
.btn--primary:hover,
.t-accent-light .btn--primary:hover,
.t-card-accent-light .m-card .btn--primary:hover,
.t-accent-dark .t-accent-light .btn--primary:hover,
.t-card-accent-light .m-card .btn--primary:hover,
.t-card-accent-dark .m-card.t-accent-light .btn--primary:hover,
.t-accent-dark .btn--primary:hover,
.t-card-accent-dark .m-card .btn--primary:hover,
.t-card-accent-light .m-card.t-accent-dark .btn--primary:hover,
.btn--primary:focus,
.t-accent-light .btn--primary:focus,
.t-card-accent-light .m-card .btn--primary:focus,
.t-accent-dark .t-accent-light .btn--primary:focus,
.t-card-accent-light .m-card .btn--primary:focus,
.t-card-accent-dark .m-card.t-accent-light .btn--primary:focus,
.t-accent-dark .btn--primary:focus,
.t-card-accent-dark .m-card .btn--primary:focus,
.t-card-accent-light .m-card.t-accent-dark .btn--primary:focus {
background: #004fb6;
border-color: #004fb6;
color: #fff;
}
.btn--primary:active,
.t-accent-light .btn--primary:active,
.t-card-accent-light .m-card .btn--primary:active,
.t-accent-dark .t-accent-light .btn--primary:active,
.t-card-accent-light .m-card .btn--primary:active,
.t-card-accent-dark .m-card.t-accent-light .btn--primary:active,
.t-accent-dark .btn--primary:active,
.t-card-accent-dark .m-card .btn--primary:active,
.t-card-accent-light .m-card.t-accent-dark .btn--primary:active {
background-color: #003b88;
border-color: #003b88;
color: #fff;
}
/* Button - Transparent type modifier
==========================================================================
Example:
Override rules for light accent colours - will display transparent button as standard secondary button
if case accidentally placed on white / light grey / yellow backgrounds
*/
.btn--transparent,
.t-accent-light .btn--transparent,
.t-accent-dark .t-accent-light .btn--transparent,
.t-card-accent-light .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-light .btn--transparent,
.t-accent-light .m-card.t-accent-light .btn--transparent {
background: #fff;
border: 1px solid #ccc;
color: #004fb6;
}
.t-accent-light .btn--transparent:hover,
.t-accent-light .btn--transparent:hover .btn--input__inner,
.t-accent-light .btn--transparent:focus,
.t-accent-light .btn--transparent:focus .btn--input__inner,
.t-accent-dark .t-accent-light .btn--transparent:hover,
.t-accent-dark .t-accent-light .btn--transparent:hover .btn--input__inner,
.t-accent-dark .t-accent-light .btn--transparent:focus,
.t-accent-dark .t-accent-light .btn--transparent:focus .btn--input__inner,
.t-card-accent-light .m-card .btn--transparent:hover,
.t-card-accent-light .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-light .m-card .btn--transparent:focus,
.t-card-accent-light .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-light .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-light .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-light .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-light .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-light .btn--transparent:hover,
.t-accent-light .m-card.t-accent-light .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-light .btn--transparent:focus,
.t-accent-light .m-card.t-accent-light .btn--transparent:focus .btn--input__inner {
background: #004fb6;
border-color: #004fb6;
color: #fff;
}
.t-accent-light .btn--transparent:active,
.t-accent-dark .t-accent-light .btn--transparent:active,
.t-card-accent-light .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-light .btn--transparent:active,
.t-accent-light .m-card.t-accent-light .btn--transparent:active {
background: #003b88;
}
.t-accent-dark .btn--transparent,
.t-card-accent-dark .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark .btn--transparent,
.t-accent-light .m-card.t-accent-dark .btn--transparent {
background: none;
border: 2px solid #fff;
}
.t-accent-dark .btn--transparent,
.t-accent-dark .btn--transparent .btn--input__inner,
.t-card-accent-dark .m-card .btn--transparent,
.t-card-accent-dark .m-card .btn--transparent .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark .btn--transparent,
.t-accent-dark .m-card.t-accent-dark .btn--transparent .btn--input__inner,
.t-accent-light .m-card.t-accent-dark .btn--transparent,
.t-accent-light .m-card.t-accent-dark .btn--transparent .btn--input__inner {
padding: .8125em 1.875em;
/* 13px 30px / 16px */
}
.t-accent-dark .btn--transparent,
.t-accent-dark .btn--transparent:visited,
.t-accent-dark .btn--transparent .btn--input__inner,
.t-card-accent-dark .m-card .btn--transparent,
.t-card-accent-dark .m-card .btn--transparent:visited,
.t-card-accent-dark .m-card .btn--transparent .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark .btn--transparent,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:visited,
.t-accent-dark .m-card.t-accent-dark .btn--transparent .btn--input__inner,
.t-accent-light .m-card.t-accent-dark .btn--transparent,
.t-accent-light .m-card.t-accent-dark .btn--transparent:visited,
.t-accent-light .m-card.t-accent-dark .btn--transparent .btn--input__inner {
color: #fff;
}
.t-accent-dark .btn--transparent .btn--input__inner,
.t-card-accent-dark .m-card .btn--transparent .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark .btn--transparent .btn--input__inner,
.t-accent-light .m-card.t-accent-dark .btn--transparent .btn--input__inner {
padding: 0;
}
.t-accent-dark .btn--transparent,
.t-card-accent-dark .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark .btn--transparent,
.t-accent-light .m-card.t-accent-dark .btn--transparent,
.t-accent-dark--dark-blue .btn--transparent,
.t-card-accent-dark--dark-blue .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent {
border-color: #808fb0;
}
.t-accent-dark--light-blue .btn--transparent,
.t-card-accent-dark--light-blue .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent {
border-color: #8bd0de;
}
.t-accent-dark--dark-green .btn--transparent,
.t-card-accent-dark--dark-green .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent {
border-color: #87ab9f;
}
.t-accent-dark--dark-purple .btn--transparent,
.t-card-accent-dark--dark-purple .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent {
border-color: #a18db3;
}
.t-accent-dark--light-purple .btn--transparent,
.t-card-accent-dark--light-purple .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent {
border-color: #c39bc7;
}
.t-accent-dark--pink .btn--transparent,
.t-card-accent-dark--pink .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent {
border-color: #e08dc1;
}
.t-accent-dark--teal .btn--transparent,
.t-card-accent-dark--teal .m-card .btn--transparent,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent {
border-color: #80ccd8;
}
.t-accent-dark .btn--transparent:hover,
.t-accent-dark .btn--transparent:focus,
.t-card-accent-dark .m-card .btn--transparent:hover,
.t-card-accent-dark .m-card .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark .btn--transparent:focus {
background: #fff;
border-color: #fff;
}
.t-accent-dark .btn--transparent:hover,
.t-accent-dark .btn--transparent:hover .btn--input__inner,
.t-accent-dark .btn--transparent:focus,
.t-accent-dark .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark .m-card .btn--transparent:hover,
.t-card-accent-dark .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark .m-card .btn--transparent:focus,
.t-card-accent-dark .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark .btn--transparent:focus .btn--input__inner,
.t-accent-dark--dark-blue .btn--transparent:hover,
.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner,
.t-accent-dark--dark-blue .btn--transparent:focus,
.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:hover,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:focus,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner {
color: #001e60;
}
.t-accent-dark--light-blue .btn--transparent:hover,
.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner,
.t-accent-dark--light-blue .btn--transparent:focus,
.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--light-blue .m-card .btn--transparent:hover,
.t-card-accent-dark--light-blue .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--light-blue .m-card .btn--transparent:focus,
.t-card-accent-dark--light-blue .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner {
color: #1a61bd;
}
.t-accent-dark--dark-green .btn--transparent:hover,
.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner,
.t-accent-dark--dark-green .btn--transparent:focus,
.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--dark-green .m-card .btn--transparent:hover,
.t-card-accent-dark--dark-green .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--dark-green .m-card .btn--transparent:focus,
.t-card-accent-dark--dark-green .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner {
color: #0e573f;
}
.t-accent-dark--dark-purple .btn--transparent:hover,
.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner,
.t-accent-dark--dark-purple .btn--transparent:focus,
.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:hover,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:focus,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner {
color: #421b67;
}
.t-accent-dark--light-purple .btn--transparent:hover,
.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner,
.t-accent-dark--light-purple .btn--transparent:focus,
.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--light-purple .m-card .btn--transparent:hover,
.t-card-accent-dark--light-purple .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--light-purple .m-card .btn--transparent:focus,
.t-card-accent-dark--light-purple .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner {
color: #87378e;
}
.t-accent-dark--pink .btn--transparent:hover,
.t-accent-dark--pink .btn--transparent:hover .btn--input__inner,
.t-accent-dark--pink .btn--transparent:focus,
.t-accent-dark--pink .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--pink .m-card .btn--transparent:hover,
.t-card-accent-dark--pink .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--pink .m-card .btn--transparent:focus,
.t-card-accent-dark--pink .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:focus .btn--input__inner {
color: #c01b83;
}
.t-accent-dark--teal .btn--transparent:hover,
.t-accent-dark--teal .btn--transparent:hover .btn--input__inner,
.t-accent-dark--teal .btn--transparent:focus,
.t-accent-dark--teal .btn--transparent:focus .btn--input__inner,
.t-card-accent-dark--teal .m-card .btn--transparent:hover,
.t-card-accent-dark--teal .m-card .btn--transparent:hover .btn--input__inner,
.t-card-accent-dark--teal .m-card .btn--transparent:focus,
.t-card-accent-dark--teal .m-card .btn--transparent:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:hover,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:focus,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:hover,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:focus,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:focus .btn--input__inner {
color: #009ab1;
}
.t-accent-dark .btn--transparent:active,
.t-card-accent-dark .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark .btn--transparent:active,
.t-accent-dark--dark-blue .btn--transparent:active,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:active {
background-color: #001647;
border-color: #001647;
}
.t-accent-dark--light-blue .btn--transparent:active,
.t-card-accent-dark--light-blue .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:active {
background-color: #13488d;
border-color: #13488d;
}
.t-accent-dark--dark-green .btn--transparent:active,
.t-card-accent-dark--dark-green .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:active {
background-color: #0e412f;
border-color: #0e412f;
}
.t-accent-dark--dark-purple .btn--transparent:active,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:active {
background-color: #31144d;
border-color: #31144d;
}
.t-accent-dark--light-purple .btn--transparent:active,
.t-card-accent-dark--light-purple .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:active {
background-color: #65296a;
border-color: #65296a;
}
.t-accent-dark--pink .btn--transparent:active,
.t-card-accent-dark--pink .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:active {
background-color: #aa1772;
border-color: #aa1772;
}
.t-accent-dark--teal .btn--transparent:active,
.t-card-accent-dark--teal .m-card .btn--transparent:active,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:active,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:active {
background-color: #005a67;
border-color: #005a67;
}
/* Button - Top / next / previous / download / print type modifiers
==========================================================================
Examples
*/
.btn--top {
padding-right: 3.5625em;
/* 45px padding + 12px button / 16px */
}
.btn--next {
padding-right: 3.1875em;
/* 45px padding + 6px button / 16px */
}
.btn--previous {
padding-left: 3.1875em;
/* 45px padding + 6px button / 16px */
}
.btn--download {
padding-right: 4.0625em;
/* 45px padding + 20px button / 16px */
}
.btn--print {
padding-right: 3.9375em;
/* 45px padding + 18px button / 16px */
}
.btn--top .btn--input__inner,
.btn--next .btn--input__inner,
.btn--download .btn--input__inner,
.btn--print .btn--input__inner {
min-width: 0;
padding-right: 0;
}
.btn--previous .btn--input__inner {
min-width: 0;
padding-left: 0;
}
.btn--top:after,
.btn--next:after,
.btn--previous:before,
.btn--download:after,
.btn--print:after {
background-position: center right;
background-repeat: no-repeat;
bottom: 0;
content: '';
display: block;
position: absolute;
right: 1.875em;
/* 30px / 16px */
top: 0;
}
.btn--top:after {
background-image: url('../images/icons/arrow-up.png');
top: 3px;
width: 14px;
}
.svg .btn--top:after {
background-image: url('../images/icons/arrow-up.svg');
}
.btn--top:hover:after,
.btn--top:focus:after,
.btn--top:active:after {
background-image: url('../images/icons/arrow-up-white.png');
}
.svg .btn--top:hover:after,
.svg .btn--top:focus:after,
.svg .btn--top:active:after {
background-image: url('../images/icons/arrow-up-white.svg');
}
.btn--next:after {
background-image: url('../images/icons/arrow-right.png');
width: 9px;
}
.svg .btn--next:after {
background-image: url('../images/icons/arrow-right.svg');
}
.btn--next:hover:after,
.btn--next:focus:after,
.btn--next:active:after {
background-image: url('../images/icons/arrow-right-white.png');
}
.svg .btn--next:hover:after,
.svg .btn--next:focus:after,
.svg .btn--next:active:after {
background-image: url('../images/icons/arrow-right-white.svg');
}
.btn--previous:before {
background-image: url('../images/icons/arrow-left.png');
left: 1.875em;
/* 30px / 16px */
right: 0;
width: 9px;
}
.svg .btn--previous:before {
background-image: url('../images/icons/arrow-left.svg');
}
.btn--previous:hover:before,
.btn--previous:focus:before,
.btn--previous:active:before {
background-image: url('../images/icons/arrow-left-white.png');
}
.svg .btn--previous:hover:before,
.svg .btn--previous:focus:before,
.svg .btn--previous:active:before {
background-image: url('../images/icons/arrow-left-white.svg');
}
.btn--download:after {
background-image: url('../images/icons/download.png');
width: 20px;
}
.svg .btn--download:after {
background-image: url('../images/icons/download.svg');
}
.btn--download:hover:after,
.btn--download:focus:after,
.btn--download:active:after {
background-image: url('../images/icons/download-white.png');
}
.svg .btn--download:hover:after,
.svg .btn--download:focus:after,
.svg .btn--download:active:after {
background-image: url('../images/icons/download-white.svg');
}
.btn--print:after {
background-image: url('../images/icons/print.png');
width: 18px;
}
.svg .btn--print:after {
background-image: url('../images/icons/print.svg');
}
.btn--print:hover:after,
.btn--print:focus:after,
.btn--print:active:after {
background-image: url('../images/icons/print-white.png');
}
.svg .btn--print:hover:after,
.svg .btn--print:focus:after,
.svg .btn--print:active:after {
background-image: url('../images/icons/print-white.svg');
}
/* ==========================================================================
BUTTONS - DISABLED
========================================================================== */
/* Button - Disabled state modifier Core styles
==========================================================================
Adds Core styles for disabled buttons. A further modifier is required to add
branding colours i.e. btn_type_primary
Example:
*/
.btn.is-disabled,
.btn[disabled],
.btn.is-disabled:active,
.btn.is-disabled:hover,
.btn.is-disabled:focus,
.btn[disabled]:active,
.btn[disabled]:hover,
.btn[disabled]:focus,
.t-accent-light .btn.is-disabled,
.t-accent-light .btn[disabled],
.t-accent-light .btn.is-disabled:active,
.t-accent-light .btn.is-disabled:hover,
.t-accent-light .btn.is-disabled:focus,
.t-accent-light .btn[disabled]:active,
.t-accent-light .btn[disabled]:hover,
.t-accent-light .btn[disabled]:focus,
.t-accent-dark .t-accent-light .btn.is-disabled,
.t-accent-dark .t-accent-light .btn[disabled],
.t-accent-dark .t-accent-light .btn.is-disabled:active,
.t-accent-dark .t-accent-light .btn.is-disabled:hover,
.t-accent-dark .t-accent-light .btn.is-disabled:focus,
.t-accent-dark .t-accent-light .btn[disabled]:active,
.t-accent-dark .t-accent-light .btn[disabled]:hover,
.t-accent-dark .t-accent-light .btn[disabled]:focus,
.t-accent-dark .btn.is-disabled,
.t-accent-dark .btn[disabled],
.t-accent-dark .btn.is-disabled:active,
.t-accent-dark .btn.is-disabled:hover,
.t-accent-dark .btn.is-disabled:focus,
.t-accent-dark .btn[disabled]:active,
.t-accent-dark .btn[disabled]:hover,
.t-accent-dark .btn[disabled]:focus {
cursor: default;
pointer-events: none;
transition: none;
}
.btn.is-disabled,
.btn[disabled],
.btn.is-disabled:active,
.btn.is-disabled:hover,
.btn.is-disabled:focus,
.btn[disabled]:active,
.btn[disabled]:hover,
.btn[disabled]:focus,
.t-accent-light .btn.is-disabled,
.t-accent-light .btn[disabled],
.t-accent-light .btn.is-disabled:active,
.t-accent-light .btn.is-disabled:hover,
.t-accent-light .btn.is-disabled:focus,
.t-accent-light .btn[disabled]:active,
.t-accent-light .btn[disabled]:hover,
.t-accent-light .btn[disabled]:focus,
.t-accent-dark .t-accent-light .btn.is-disabled,
.t-accent-dark .t-accent-light .btn[disabled],
.t-accent-dark .t-accent-light .btn.is-disabled:active,
.t-accent-dark .t-accent-light .btn.is-disabled:hover,
.t-accent-dark .t-accent-light .btn.is-disabled:focus,
.t-accent-dark .t-accent-light .btn[disabled]:active,
.t-accent-dark .t-accent-light .btn[disabled]:hover,
.t-accent-dark .t-accent-light .btn[disabled]:focus,
.t-accent-dark .btn.is-disabled,
.t-accent-dark .btn[disabled],
.t-accent-dark .btn.is-disabled:active,
.t-accent-dark .btn.is-disabled:hover,
.t-accent-dark .btn.is-disabled:focus,
.t-accent-dark .btn[disabled]:active,
.t-accent-dark .btn[disabled]:hover,
.t-accent-dark .btn[disabled]:focus,
.t-card-accent-light .m-card .btn.is-disabled,
.t-card-accent-light .m-card .btn[disabled],
.t-card-accent-light .m-card .btn.is-disabled:active,
.t-card-accent-light .m-card .btn.is-disabled:hover,
.t-card-accent-light .m-card .btn.is-disabled:focus,
.t-card-accent-light .m-card .btn[disabled]:active,
.t-card-accent-light .m-card .btn[disabled]:hover,
.t-card-accent-light .m-card .btn[disabled]:focus,
.t-accent-light .m-card.t-accent-light .btn.is-disabled,
.t-accent-light .m-card.t-accent-light .btn[disabled],
.t-accent-light .m-card.t-accent-light .btn.is-disabled:active,
.t-accent-light .m-card.t-accent-light .btn.is-disabled:hover,
.t-accent-light .m-card.t-accent-light .btn.is-disabled:focus,
.t-accent-light .m-card.t-accent-light .btn[disabled]:active,
.t-accent-light .m-card.t-accent-light .btn[disabled]:hover,
.t-accent-light .m-card.t-accent-light .btn[disabled]:focus,
.t-accent-dark .m-card.t-accent-light .btn.is-disabled,
.t-accent-dark .m-card.t-accent-light .btn[disabled],
.t-accent-dark .m-card.t-accent-light .btn.is-disabled:active,
.t-accent-dark .m-card.t-accent-light .btn.is-disabled:hover,
.t-accent-dark .m-card.t-accent-light .btn.is-disabled:focus,
.t-accent-dark .m-card.t-accent-light .btn[disabled]:active,
.t-accent-dark .m-card.t-accent-light .btn[disabled]:hover,
.t-accent-dark .m-card.t-accent-light .btn[disabled]:focus {
background-color: #fff;
border-color: #ccc;
color: #5c596d;
}
.btn--input.is-disabled .btn--input__inner,
.btn--input.is-disabled:hover .btn--input__inner,
.btn--input.is-disabled:focus .btn--input__inner,
.btn--input .btn--input__inner[disabled],
.btn--input:hover .btn--input__inner[disabled],
.btn--input:focus .btn--input__inner[disabled],
.t-accent-light .btn--input.is-disabled .btn--input__inner,
.t-accent-light .btn--input.is-disabled:hover .btn--input__inner,
.t-accent-light .btn--input.is-disabled:focus .btn--input__inner,
.t-accent-light .btn--input .btn--input__inner[disabled],
.t-accent-light .btn--input:hover .btn--input__inner[disabled],
.t-accent-light .btn--input:focus .btn--input__inner[disabled],
.t-accent-dark .t-accent-light .btn--input.is-disabled .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input.is-disabled:hover .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input.is-disabled:focus .btn--input__inner,
.t-accent-dark .t-accent-light .btn--input .btn--input__inner[disabled],
.t-accent-dark .t-accent-light .btn--input:hover .btn--input__inner[disabled],
.t-accent-dark .t-accent-light .btn--input:focus .btn--input__inner[disabled],
.t-accent-dark .btn--input.is-disabled .btn--input__inner,
.t-accent-dark .btn--input.is-disabled:hover .btn--input__inner,
.t-accent-dark .btn--input.is-disabled:focus .btn--input__inner,
.t-accent-dark .btn--input .btn--input__inner[disabled],
.t-accent-dark .btn--input:hover .btn--input__inner[disabled],
.t-accent-dark .btn--input:focus .btn--input__inner[disabled],
.t-card-accent-light .m-card .btn.is-disabled .btn--input__inner,
.t-card-accent-light .m-card .btn .btn--input__inner[disabled],
.t-card-accent-light .m-card .btn.is-disabled:hover .btn--input__inner,
.t-card-accent-light .m-card .btn.is-disabled:focus .btn--input__inner,
.t-card-accent-light .m-card .btn:hover .btn--input__inner[disabled],
.t-card-accent-light .m-card .btn:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-light .btn.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-light .btn .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-light .btn.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-light .btn.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-light .btn:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-light .btn:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-light .btn.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-light .btn .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-light .btn.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-light .btn.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-light .btn:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-light .btn:focus .btn--input__inner[disabled] {
color: #5c596d;
}
.btn--top.is-disabled:after,
.btn--top.is-disabled:hover:after,
.btn--top.is-disabled:focus:after,
.btn--top.is-disabled:active:after,
.btn--top[disabled]:after,
.btn--top[disabled]:hover:after,
.btn--top[disabled]:focus:after,
.btn--top[disabled]:active:after {
background-image: url('../images/icons/arrow-up-dark-grey.png');
}
.svg .btn--top.is-disabled:after,
.svg .btn--top.is-disabled:hover:after,
.svg .btn--top.is-disabled:focus:after,
.svg .btn--top.is-disabled:active:after,
.svg .btn--top[disabled]:after,
.svg .btn--top[disabled]:hover:after,
.svg .btn--top[disabled]:focus:after,
.svg .btn--top[disabled]:active:after {
background-image: url('../images/icons/arrow-up-dark-grey.svg');
}
.btn--next.is-disabled:after,
.btn--next.is-disabled:hover:after,
.btn--next.is-disabled:focus:after,
.btn--next.is-disabled:active:after,
.btn--next[disabled]:after,
.btn--next[disabled]:hover:after,
.btn--next[disabled]:focus:after,
.btn--next[disabled]:active:after {
background-image: url('../images/icons/arrow-right-dark-grey.png');
}
.svg .btn--next.is-disabled:after,
.svg .btn--next.is-disabled:hover:after,
.svg .btn--next.is-disabled:focus:after,
.svg .btn--next.is-disabled:active:after,
.svg .btn--next[disabled]:after,
.svg .btn--next[disabled]:hover:after,
.svg .btn--next[disabled]:focus:after,
.svg .btn--next[disabled]:active:after {
background-image: url('../images/icons/arrow-right-dark-grey.svg');
}
.btn--previous.is-disabled:before,
.btn--previous.is-disabled:hover:before,
.btn--previous.is-disabled:focus:before,
.btn--previous.is-disabled:active:before,
.btn--previous[disabled]:before,
.btn--previous[disabled]:hover:before,
.btn--previous[disabled]:focus:before,
.btn--previous[disabled]:active:before {
background-image: url('../images/icons/arrow-left-dark-grey.png');
}
.svg .btn--previous.is-disabled:before,
.svg .btn--previous.is-disabled:hover:before,
.svg .btn--previous.is-disabled:focus:before,
.svg .btn--previous.is-disabled:active:before,
.svg .btn--previous[disabled]:before,
.svg .btn--previous[disabled]:hover:before,
.svg .btn--previous[disabled]:focus:before,
.svg .btn--previous[disabled]:active:before {
background-image: url('../images/icons/arrow-left-dark-grey.svg');
}
.btn--print.is-disabled:after,
.btn--print.is-disabled:hover:after,
.btn--print.is-disabled:focus:after,
.btn--print.is-disabled:active:after,
.btn--print[disabled]:after,
.btn--print[disabled]:hover:after,
.btn--print[disabled]:focus:after,
.btn--print[disabled]:active:after {
background-image: url('../images/icons/print-dark-grey.png');
}
.svg .btn--print.is-disabled:after,
.svg .btn--print.is-disabled:hover:after,
.svg .btn--print.is-disabled:focus:after,
.svg .btn--print.is-disabled:active:after,
.svg .btn--print[disabled]:after,
.svg .btn--print[disabled]:hover:after,
.svg .btn--print[disabled]:focus:after,
.svg .btn--print[disabled]:active:after {
background-image: url('../images/icons/print-dark-grey.svg');
}
.btn--download.is-disabled:after,
.btn--download.is-disabled:hover:after,
.btn--download.is-disabled:focus:after,
.btn--download.is-disabled:active:after,
.btn--download[disabled]:after,
.btn--download[disabled]:hover:after,
.btn--download[disabled]:focus:after,
.btn--download[disabled]:active:after {
background-image: url('../images/icons/download-dark-grey.png');
}
.svg .btn--download.is-disabled:after,
.svg .btn--download.is-disabled:hover:after,
.svg .btn--download.is-disabled:focus:after,
.svg .btn--download.is-disabled:active:after,
.svg .btn--download[disabled]:after,
.svg .btn--download[disabled]:hover:after,
.svg .btn--download[disabled]:focus:after,
.svg .btn--download[disabled]:active:after {
background-image: url('../images/icons/download-dark-grey.svg');
}
.btn--primary.is-disabled,
.btn--primary[disabled],
.btn--primary.is-disabled:active,
.btn--primary.is-disabled:hover,
.btn--primary.is-disabled:focus,
.btn--primary[disabled]:active,
.btn--primary[disabled]:hover,
.btn--primary[disabled]:focus,
.t-accent-light .btn--primary.is-disabled,
.t-accent-light .btn--primary[disabled],
.t-accent-light .btn--primary.is-disabled:active,
.t-accent-light .btn--primary.is-disabled:hover,
.t-accent-light .btn--primary.is-disabled:focus,
.t-accent-light .btn--primary[disabled]:active,
.t-accent-light .btn--primary[disabled]:hover,
.t-accent-light .btn--primary[disabled]:focus,
.t-accent-dark .t-accent-light .btn--primary.is-disabled,
.t-accent-dark .t-accent-light .btn--primary[disabled],
.t-accent-dark .t-accent-light .btn--primary.is-disabled:active,
.t-accent-dark .t-accent-light .btn--primary.is-disabled:hover,
.t-accent-dark .t-accent-light .btn--primary.is-disabled:focus,
.t-accent-dark .t-accent-light .btn--primary[disabled]:active,
.t-accent-dark .t-accent-light .btn--primary[disabled]:hover,
.t-accent-dark .t-accent-light .btn--primary[disabled]:focus,
.t-accent-dark .btn--primary.is-disabled,
.t-accent-dark .btn--primary[disabled],
.t-accent-dark .btn--primary.is-disabled:active,
.t-accent-dark .btn--primary.is-disabled:hover,
.t-accent-dark .btn--primary.is-disabled:focus,
.t-accent-dark .btn--primary[disabled]:active,
.t-accent-dark .btn--primary[disabled]:hover,
.t-accent-dark .btn--primary[disabled]:focus,
.t-card-accent-light .m-card .btn--primary.is-disabled,
.t-card-accent-light .m-card .btn--primary[disabled],
.t-card-accent-light .m-card .btn--primary.is-disabled:active,
.t-card-accent-light .m-card .btn--primary.is-disabled:hover,
.t-card-accent-light .m-card .btn--primary.is-disabled:focus,
.t-card-accent-light .m-card .btn--primary[disabled]:active,
.t-card-accent-light .m-card .btn--primary[disabled]:hover,
.t-card-accent-light .m-card .btn--primary[disabled]:focus,
.t-accent-light .m-card.t-accent-light .btn--primary.is-disabled,
.t-accent-light .m-card.t-accent-light .btn--primary[disabled],
.t-accent-light .m-card.t-accent-light .btn--primary.is-disabled:active,
.t-accent-light .m-card.t-accent-light .btn--primary.is-disabled:hover,
.t-accent-light .m-card.t-accent-light .btn--primary.is-disabled:focus,
.t-accent-light .m-card.t-accent-light .btn--primary[disabled]:active,
.t-accent-light .m-card.t-accent-light .btn--primary[disabled]:hover,
.t-accent-light .m-card.t-accent-light .btn--primary[disabled]:focus,
.t-accent-dark .m-card.t-accent-light .btn--primary.is-disabled,
.t-accent-dark .m-card.t-accent-light .btn--primary[disabled],
.t-accent-dark .m-card.t-accent-light .btn--primary.is-disabled:active,
.t-accent-dark .m-card.t-accent-light .btn--primary.is-disabled:hover,
.t-accent-dark .m-card.t-accent-light .btn--primary.is-disabled:focus,
.t-accent-dark .m-card.t-accent-light .btn--primary[disabled]:active,
.t-accent-dark .m-card.t-accent-light .btn--primary[disabled]:hover,
.t-accent-dark .m-card.t-accent-light .btn--primary[disabled]:focus {
background-color: #ccc;
border-color: #ccc;
}
.t-accent-dark .btn--transparent.is-disabled,
.t-accent-dark .btn--transparent[disabled],
.t-accent-dark .btn--transparent.is-disabled:active,
.t-accent-dark .btn--transparent.is-disabled:hover,
.t-accent-dark .btn--transparent.is-disabled:focus,
.t-accent-dark .btn--transparent[disabled]:active,
.t-accent-dark .btn--transparent[disabled]:hover,
.t-accent-dark .btn--transparent[disabled]:focus,
.t-card-accent-dark .m-card .btn--transparent.is-disabled,
.t-card-accent-dark .m-card .btn--transparent[disabled],
.t-card-accent-dark .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark .btn--transparent[disabled]:focus {
background: none;
}
.t-accent-dark--light-blue .btn--transparent.is-disabled,
.t-accent-dark--light-blue .btn--transparent[disabled],
.t-accent-dark--light-blue .btn--transparent.is-disabled:active,
.t-accent-dark--light-blue .btn--transparent.is-disabled:hover,
.t-accent-dark--light-blue .btn--transparent.is-disabled:focus,
.t-accent-dark--light-blue .btn--transparent[disabled]:active,
.t-accent-dark--light-blue .btn--transparent[disabled]:hover,
.t-accent-dark--light-blue .btn--transparent[disabled]:focus,
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--light-blue .m-card .btn--transparent[disabled],
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--light-blue .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--light-blue .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--light-blue .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent[disabled]:focus,
.t-accent-dark--light-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--light-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--light-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--light-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--light-blue .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--light-blue .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--light-blue .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--light-blue .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-blue .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #8bd0de;
color: #8bd0de;
}
.t-accent-dark--dark-blue .btn--transparent.is-disabled,
.t-accent-dark--dark-blue .btn--transparent[disabled],
.t-accent-dark--dark-blue .btn--transparent.is-disabled:active,
.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover,
.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus,
.t-accent-dark--dark-blue .btn--transparent[disabled]:active,
.t-accent-dark--dark-blue .btn--transparent[disabled]:hover,
.t-accent-dark--dark-blue .btn--transparent[disabled]:focus,
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--dark-blue .m-card .btn--transparent[disabled],
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--dark-blue .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--dark-blue .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--dark-blue .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent[disabled]:focus,
.t-accent-dark--dark-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--dark-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--dark-blue .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--dark-blue .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--dark-blue .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--dark-blue .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-blue .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #808fb0;
color: #808fb0;
}
.t-accent-dark--dark-green .btn--transparent.is-disabled,
.t-accent-dark--dark-green .btn--transparent[disabled],
.t-accent-dark--dark-green .btn--transparent.is-disabled:active,
.t-accent-dark--dark-green .btn--transparent.is-disabled:hover,
.t-accent-dark--dark-green .btn--transparent.is-disabled:focus,
.t-accent-dark--dark-green .btn--transparent[disabled]:active,
.t-accent-dark--dark-green .btn--transparent[disabled]:hover,
.t-accent-dark--dark-green .btn--transparent[disabled]:focus,
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--dark-green .m-card .btn--transparent[disabled],
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--dark-green .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--dark-green .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--dark-green .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent[disabled]:focus,
.t-accent-dark--dark-green .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--dark-green .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--dark-green .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--dark-green .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--dark-green .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--dark-green .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--dark-green .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--dark-green .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-green .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #87ab9f;
color: #87ab9f;
}
.t-accent-dark--dark-purple .btn--transparent.is-disabled,
.t-accent-dark--dark-purple .btn--transparent[disabled],
.t-accent-dark--dark-purple .btn--transparent.is-disabled:active,
.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover,
.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus,
.t-accent-dark--dark-purple .btn--transparent[disabled]:active,
.t-accent-dark--dark-purple .btn--transparent[disabled]:hover,
.t-accent-dark--dark-purple .btn--transparent[disabled]:focus,
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--dark-purple .m-card .btn--transparent[disabled],
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--dark-purple .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--dark-purple .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--dark-purple .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent[disabled]:focus,
.t-accent-dark--dark-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--dark-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--dark-purple .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--dark-purple .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--dark-purple .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--dark-purple .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--dark-purple .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #a18db3;
color: #a18db3;
}
.t-accent-dark--light-purple .btn--transparent.is-disabled,
.t-accent-dark--light-purple .btn--transparent[disabled],
.t-accent-dark--light-purple .btn--transparent.is-disabled:active,
.t-accent-dark--light-purple .btn--transparent.is-disabled:hover,
.t-accent-dark--light-purple .btn--transparent.is-disabled:focus,
.t-accent-dark--light-purple .btn--transparent[disabled]:active,
.t-accent-dark--light-purple .btn--transparent[disabled]:hover,
.t-accent-dark--light-purple .btn--transparent[disabled]:focus,
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--light-purple .m-card .btn--transparent[disabled],
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--light-purple .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--light-purple .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--light-purple .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent[disabled]:focus,
.t-accent-dark--light-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--light-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--light-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--light-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--light-purple .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--light-purple .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--light-purple .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--light-purple .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--light-purple .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #c39bc7;
color: #c39bc7;
}
.t-accent-dark--pink .btn--transparent.is-disabled,
.t-accent-dark--pink .btn--transparent[disabled],
.t-accent-dark--pink .btn--transparent.is-disabled:active,
.t-accent-dark--pink .btn--transparent.is-disabled:hover,
.t-accent-dark--pink .btn--transparent.is-disabled:focus,
.t-accent-dark--pink .btn--transparent[disabled]:active,
.t-accent-dark--pink .btn--transparent[disabled]:hover,
.t-accent-dark--pink .btn--transparent[disabled]:focus,
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--pink .m-card .btn--transparent[disabled],
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--pink .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--pink .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--pink .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent[disabled]:focus,
.t-accent-dark--pink .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--pink .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--pink .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--pink .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--pink .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--pink .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--pink .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--pink .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--pink .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--pink .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--pink .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--pink .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #e08dc1;
color: #e08dc1;
}
.t-accent-dark--teal .btn--transparent.is-disabled,
.t-accent-dark--teal .btn--transparent[disabled],
.t-accent-dark--teal .btn--transparent.is-disabled:active,
.t-accent-dark--teal .btn--transparent.is-disabled:hover,
.t-accent-dark--teal .btn--transparent.is-disabled:focus,
.t-accent-dark--teal .btn--transparent[disabled]:active,
.t-accent-dark--teal .btn--transparent[disabled]:hover,
.t-accent-dark--teal .btn--transparent[disabled]:focus,
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled,
.t-card-accent-dark--teal .m-card .btn--transparent[disabled],
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled:active,
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled:hover,
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled:focus,
.t-card-accent-dark--teal .m-card .btn--transparent[disabled]:active,
.t-card-accent-dark--teal .m-card .btn--transparent[disabled]:hover,
.t-card-accent-dark--teal .m-card .btn--transparent[disabled]:focus,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent[disabled],
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled:active,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled:hover,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled:focus,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent[disabled]:active,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent[disabled]:hover,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent[disabled]:focus,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent[disabled],
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled:active,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled:hover,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled:focus,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent[disabled]:active,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent[disabled]:hover,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent[disabled]:focus,
.t-accent-dark--teal .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark--teal .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark--teal .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark--teal .btn--transparent .btn--input__inner[disabled],
.t-accent-dark--teal .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark--teal .btn--transparent:focus .btn--input__inner[disabled],
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled .btn--input__inner,
.t-card-accent-dark--teal .m-card .btn--transparent .btn--input__inner[disabled],
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled:hover .btn--input__inner,
.t-card-accent-dark--teal .m-card .btn--transparent.is-disabled:focus .btn--input__inner,
.t-card-accent-dark--teal .m-card .btn--transparent:hover .btn--input__inner[disabled],
.t-card-accent-dark--teal .m-card .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-light .m-card.t-accent-dark--teal .btn--transparent:focus .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled:hover .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent.is-disabled:focus .btn--input__inner,
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:hover .btn--input__inner[disabled],
.t-accent-dark .m-card.t-accent-dark--teal .btn--transparent:focus .btn--input__inner[disabled] {
border-color: #80bcc7;
color: #80bcc7;
}
/* ==========================================================================
BUTTON GROUP
========================================================================== */
/* Button group - Core styles
==========================================================================
Example:
*/
.btn-group {
margin: 1.25em 0;
/* 20px / 0.1px */
padding: 0;
}
.btn-group__item {
list-style-type: none;
margin: 0 0 1.25em;
/* 20px / 16px */
padding: 0;
}
.btn-group__item:last-child {
margin-bottom: 0;
}
@media (min-width: 35em) {
.btn-group {
display: block;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 0;
}
.btn-group__item {
display: inline-block;
padding-right: 1.25em;
/* 20px / 16px */
}
.btn-group__item:last-child {
margin-bottom: 1.25em;
/* 20px / 16px */
padding-right: 0;
}
}
/* Feature group of three buttons - Modifier styles
==========================================================================
Example:
*/
@media (max-width: 35em) {
.btn-group--feature-three {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
overflow: auto;
}
.btn-group--feature-three .btn-group__item {
float: left;
padding: 0;
width: 50%;
}
.btn-group--feature-three .btn-group__item:first-child {
float: none;
width: 100%;
}
.btn-group--feature-three .btn-group__item:last-child {
margin-bottom: 1.25em;
/* 20px / 16px */
}
.btn-group--feature-three .btn {
border-radius: .25em 0 0 .25em;
/* 4px / 16px */
display: table;
height: 100%;
width: 100%;
}
.btn-group--feature-three .btn-group__item:first-child .btn {
border-radius: .25em;
/* 4px / 16px */
}
.btn-group--feature-three .btn-group__item:last-child .btn {
border-left-width: 0;
border-radius: 0 .25em .25em 0;
/* 4px / 16px */
}
}
/* Button Group - Groups next and previous buttons
==========================================================================
Example:
*/
.btn-group--pagination {
display: block;
}
@media (min-width: 35em) {
.btn-group--pagination {
margin-bottom: 1.25em;
/* 20px / 16px */
overflow: auto;
}
.btn-group--pagination .btn-group__item {
display: block;
float: right;
margin-bottom: 0;
padding-left: .625em;
/* 10px / 16px */
padding-right: 0;
width: 50%;
}
.btn-group--pagination .btn-group__item--prev {
padding-left: 0;
padding-right: .625em;
/* 10px / 16px */
text-align: right;
}
}
/* ==========================================================================
LISTS
========================================================================== */
/* Unordered list - Core styles
==========================================================================
Example
*/
.unordered-list {
list-style-type: none;
margin: 1.25em 0;
/* 20px 0 / 16px */
padding: 0;
}
.unordered-list > li {
margin-bottom: .3125em;
/* 5px / 16px */
padding: 0 0 0 1.6875em;
/* 27px / 16px */
position: relative;
}
@media (min-width: 35em) {
.unordered-list > li {
margin-bottom: .625em;
/* 10px / 16px */
}
.unordered-list--narrow > li {
margin-bottom: .3125em;
/* 5px / 16px */
}
}
.unordered-list > li:last-child {
margin-bottom: 0;
}
.unordered-list > li:before {
background: url('../images/icons/bullet.png') no-repeat center center;
content: '';
display: block;
font-size: 16px;
height: .625em;
/* 10px / 16px */
left: 0;
position: absolute;
top: .4375em;
/* 7px / 16px */
width: .625em;
/* 10px / 16px */
}
.unordered-list > li:before,
.t-accent-light .unordered-list > li:before,
.t-accent-dark .t-accent-light .unordered-list > li:before,
.t-card-accent-light .m-card .unordered-list > li:before,
.t-card-accent-dark .m-card.t-accent-light .unordered-list > li:before {
background-image: url('../images/icons/bullet.png');
}
.svg .unordered-list > li:before,
.svg .t-accent-light .unordered-list > li:before,
.svg .t-accent-dark .t-accent-light .unordered-list > li:before,
.svg .t-card-accent-light .m-card .unordered-list > li:before,
.svg .t-card-accent-dark .m-card.t-accent-light .unordered-list > li:before {
background-image: url('../images/icons/bullet.svg');
}
.t-accent-dark .unordered-list > li:before,
.t-card-accent-dark .m-card .unordered-list > li:before,
.t-card-accent-light .m-card.t-accent-dark .unordered-list > li:before {
background-image: url('../images/icons/bullet-white.png');
}
.svg .t-accent-dark .unordered-list > li:before,
.svg .t-card-accent-dark .m-card .unordered-list > li:before,
.svg .t-card-accent-light .m-card.t-accent-dark .unordered-list > li:before {
background-image: url('../images/icons/bullet-white.svg');
}
li.unordered-list__item--tick:before {
height: 1em;
/* 16px / 16px */
top: .3125em;
/* 5px / 16px */
width: 1.0625em;
/* 17px / 16px */
}
li.unordered-list__item--tick:before,
.t-accent-light li.unordered-list__item--tick:before,
.t-accent-dark .t-accent-light li.unordered-list__item--tick:before,
.t-card-accent-light .m-card li.unordered-list__item--tick:before,
.t-card-accent-dark .m-card.t-accent-light li.unordered-list__item--tick:before,
.t-card-accent-light .m-card.t-accent-light li.unordered-list__item--tick:before {
background-image: url('../images/icons/tick.png');
}
.svg li.unordered-list__item--tick:before,
.svg .t-accent-light li.unordered-list__item--tick:before,
.svg .t-accent-dark .t-accent-light li.unordered-list__item--tick:before,
.svg .t-card-accent-light .m-card li.unordered-list__item--tick:before,
.svg .t-card-accent-dark .m-card.t-accent-light li.unordered-list__item--tick:before,
.svg .t-card-accent-light .m-card.t-accent-light li.unordered-list__item--tick:before {
background-image: url('../images/icons/tick.svg');
}
.t-accent-dark li.unordered-list__item--tick:before,
.t-card-accent-dark .m-card li.unordered-list__item--tick:before,
.t-card-accent-light .m-card.t-accent-dark li.unordered-list__item--tick:before,
.t-card-accent-dark .m-card.t-accent-dark li.unordered-list__item--tick:before {
background-image: url('../images/icons/tick-white.png');
}
.svg .t-accent-dark li.unordered-list__item--tick:before,
.svg .t-card-accent-dark .m-card li.unordered-list__item--tick:before,
.svg .t-card-accent-light .m-card.t-accent-dark li.unordered-list__item--tick:before,
.svg .t-card-accent-dark .m-card.t-accent-dark li.unordered-list__item--tick:before {
background-image: url('../images/icons/tick-white.svg');
}
li.unordered-list__item--cross:before {
height: .9375em;
/* 15px / 16px */
top: .3125em;
/* 5px / 16px */
width: .9375em;
/* 15px / 16px */
}
li.unordered-list__item--cross:before,
.t-accent-light li.unordered-list__item--cross:before,
.t-accent-dark .t-accent-light li.unordered-list__item--cross:before,
.t-card-accent-light .m-card li.unordered-list__item--cross:before,
.t-card-accent-dark .m-card.t-accent-light li.unordered-list__item--cross:before,
.t-card-accent-light .m-card.t-accent-light li.unordered-list__item--cross:before {
background-image: url('../images/icons/cross-red.png');
}
.svg li.unordered-list__item--cross:before,
.svg .t-accent-light li.unordered-list__item--cross:before,
.svg .t-accent-dark .t-accent-light li.unordered-list__item--cross:before,
.svg .t-card-accent-light .m-card li.unordered-list__item--cross:before,
.svg .t-card-accent-dark .m-card.t-accent-light li.unordered-list__item--cross:before,
.svg .t-card-accent-light .m-card.t-accent-light li.unordered-list__item--cross:before {
background-image: url('../images/icons/cross-red.svg');
}
.t-accent-dark li.unordered-list__item--cross:before,
.t-card-accent-dark .m-card li.unordered-list__item--cross:before,
.t-card-accent-light .m-card.t-accent-dark li.unordered-list__item--cross:before,
.t-card-accent-dark .m-card.t-accent-dark li.unordered-list__item--cross:before {
background-image: url('../images/icons/cross-white.png');
}
.svg .t-accent-dark li.unordered-list__item--cross:before,
.svg .t-card-accent-dark .m-card li.unordered-list__item--cross:before,
.svg .t-card-accent-light .m-card.t-accent-dark li.unordered-list__item--cross:before,
.svg .t-card-accent-dark .m-card.t-accent-dark li.unordered-list__item--cross:before {
background-image: url('../images/icons/cross-white.svg');
}
.unordered-list > li > :first-child {
margin-top: 0;
}
.unordered-list > li > :last-child {
margin-bottom: 0;
}
/* Ordered list - Core styles
==========================================================================
Example
*/
.ordered-list {
counter-reset: section;
list-style-type: none;
margin: 1.25em 0;
/* 20px 0 / 16px */
padding: 0;
}
.ordered-list > li {
border-bottom: 2px solid #ccc;
counter-increment: section;
margin-top: 1.25em;
/* 20px / 16px */
padding: 0 0 1.25em 4.375em;
/* 0 0 20px 70px / 16px */
position: relative;
}
.ordered-list > li:last-child {
border-bottom: 0;
padding-bottom: 0;
}
.ordered-list > li:before {
content: counter(section, decimal) '.';
display: block;
font-size: 2em;
/* 32px / 16px */
font-size: 2rem;
/* Fix for IE not overriding the font size correctly */
font-weight: normal;
left: 0;
line-height: 1.25em;
/* 40px / 32px */
min-width: 2em;
position: absolute;
text-align: center;
top: -.3125em;
/* -10px / 32px */
}
@media (min-width: 35em) {
.ordered-list > li {
margin-top: 1.25em;
/* 20px / 16px */
padding: 0 0 1.25em 5em;
/* 0 0 20px 80px / 16px */
}
.ordered-list > li:before {
font-size: 2.625em;
/* 42px / 16px */
font-size: 2.625rem;
/* Fix for IE not overriding the font size correctly */
line-height: 1.1905em;
/* 50px / 42px */
top: -.381em;
/* -16px / 42px */
}
}
.ordered-list > li:before,
.t-accent-light .ordered-list > li:before,
.t-accent-dark .t-accent-light .ordered-list > li:before,
.t-card-accent-light .m-card .ordered-list > li:before,
.t-card-accent-dark .m-card.t-accent-light .ordered-list > li:before {
color: #5c596d;
}
.t-accent-dark .ordered-list > li:before,
.t-card-accent-dark .m-card .ordered-list > li:before,
.t-card-accent-light .m-card.t-accent-dark .ordered-list > li:before {
color: #fff;
}
.fonts-loaded .ordered-list > li:before {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.ordered-list > li > :first-child {
margin-top: 0;
}
.ordered-list > li > :last-child {
margin-bottom: 0;
}
.ordered-list .ordered-list > li {
border-bottom: 0;
font-size: 1em;
margin-top: 1.25em;
/* 20px / 16px */
padding-bottom: 0;
padding-left: 3.125em;
/* 50px / 16px */
}
.ordered-list .ordered-list > li:before {
font-size: 1.5em;
/* 24px / 16px */
font-size: 1.5rem;
/* Fix for IE not overriding the font size correctly */
left: 0;
line-height: 1.5em;
/* 36px / 24px */
top: -.375em;
/* 9px / 24px */
}
.ordered-list--roman > li:before {
content: counter(section, upper-roman);
}
.ordered-list .ordered-list--roman > li:before {
content: counter(section, lower-roman);
}
.ordered-list--alpha > li:before {
content: counter(section, upper-alpha) '.';
}
.ordered-list .ordered-list--alpha > li:before {
content: counter(section, lower-alpha) '.';
}
.ordered-list[start='1'] {
counter-reset: section 0;
}
.ordered-list[start='2'] {
counter-reset: section 1;
}
.ordered-list[start='3'] {
counter-reset: section 2;
}
.ordered-list[start='4'] {
counter-reset: section 3;
}
.ordered-list[start='5'] {
counter-reset: section 4;
}
.ordered-list[start='6'] {
counter-reset: section 5;
}
.ordered-list[start='7'] {
counter-reset: section 6;
}
.ordered-list[start='8'] {
counter-reset: section 7;
}
.ordered-list[start='9'] {
counter-reset: section 8;
}
.ordered-list[start='10'] {
counter-reset: section 9;
}
.ordered-list[start='11'] {
counter-reset: section 10;
}
.ordered-list[start='12'] {
counter-reset: section 11;
}
.ordered-list[start='13'] {
counter-reset: section 12;
}
.ordered-list[start='14'] {
counter-reset: section 13;
}
.ordered-list[start='15'] {
counter-reset: section 14;
}
.ordered-list[start='16'] {
counter-reset: section 15;
}
.ordered-list[start='17'] {
counter-reset: section 16;
}
.ordered-list[start='18'] {
counter-reset: section 17;
}
.ordered-list[start='19'] {
counter-reset: section 18;
}
.ordered-list[start='20'] {
counter-reset: section 19;
}
.ordered-list[start='21'] {
counter-reset: section 20;
}
.ordered-list[start='22'] {
counter-reset: section 21;
}
.ordered-list[start='23'] {
counter-reset: section 22;
}
.ordered-list[start='24'] {
counter-reset: section 23;
}
.ordered-list[start='25'] {
counter-reset: section 24;
}
.ordered-list[start='26'] {
counter-reset: section 25;
}
.ordered-list[start='27'] {
counter-reset: section 26;
}
.ordered-list[start='28'] {
counter-reset: section 27;
}
.ordered-list[start='29'] {
counter-reset: section 28;
}
.ordered-list[start='30'] {
counter-reset: section 29;
}
.ordered-list[start='31'] {
counter-reset: section 30;
}
.ordered-list[start='32'] {
counter-reset: section 31;
}
.ordered-list[start='33'] {
counter-reset: section 32;
}
.ordered-list[start='34'] {
counter-reset: section 33;
}
.ordered-list[start='35'] {
counter-reset: section 34;
}
.ordered-list[start='36'] {
counter-reset: section 35;
}
.ordered-list[start='37'] {
counter-reset: section 36;
}
.ordered-list[start='38'] {
counter-reset: section 37;
}
.ordered-list[start='39'] {
counter-reset: section 38;
}
.ordered-list[start='40'] {
counter-reset: section 39;
}
.ordered-list[start='41'] {
counter-reset: section 40;
}
.ordered-list[start='42'] {
counter-reset: section 41;
}
.ordered-list[start='43'] {
counter-reset: section 42;
}
.ordered-list[start='44'] {
counter-reset: section 43;
}
.ordered-list[start='45'] {
counter-reset: section 44;
}
.ordered-list[start='46'] {
counter-reset: section 45;
}
.ordered-list[start='47'] {
counter-reset: section 46;
}
.ordered-list[start='48'] {
counter-reset: section 47;
}
.ordered-list[start='49'] {
counter-reset: section 48;
}
.ordered-list[start='50'] {
counter-reset: section 49;
}
.ordered-list[start='51'] {
counter-reset: section 50;
}
.ordered-list[start='52'] {
counter-reset: section 51;
}
.ordered-list[start='53'] {
counter-reset: section 52;
}
.ordered-list[start='54'] {
counter-reset: section 53;
}
.ordered-list[start='55'] {
counter-reset: section 54;
}
.ordered-list[start='56'] {
counter-reset: section 55;
}
.ordered-list[start='57'] {
counter-reset: section 56;
}
.ordered-list[start='58'] {
counter-reset: section 57;
}
.ordered-list[start='59'] {
counter-reset: section 58;
}
.ordered-list[start='60'] {
counter-reset: section 59;
}
.ordered-list[start='61'] {
counter-reset: section 60;
}
.ordered-list[start='62'] {
counter-reset: section 61;
}
.ordered-list[start='63'] {
counter-reset: section 62;
}
.ordered-list[start='64'] {
counter-reset: section 63;
}
.ordered-list[start='65'] {
counter-reset: section 64;
}
.ordered-list[start='66'] {
counter-reset: section 65;
}
.ordered-list[start='67'] {
counter-reset: section 66;
}
.ordered-list[start='68'] {
counter-reset: section 67;
}
.ordered-list[start='69'] {
counter-reset: section 68;
}
.ordered-list[start='70'] {
counter-reset: section 69;
}
.ordered-list[start='71'] {
counter-reset: section 70;
}
.ordered-list[start='72'] {
counter-reset: section 71;
}
.ordered-list[start='73'] {
counter-reset: section 72;
}
.ordered-list[start='74'] {
counter-reset: section 73;
}
.ordered-list[start='75'] {
counter-reset: section 74;
}
.ordered-list[start='76'] {
counter-reset: section 75;
}
.ordered-list[start='77'] {
counter-reset: section 76;
}
.ordered-list[start='78'] {
counter-reset: section 77;
}
.ordered-list[start='79'] {
counter-reset: section 78;
}
.ordered-list[start='80'] {
counter-reset: section 79;
}
.ordered-list[start='81'] {
counter-reset: section 80;
}
.ordered-list[start='82'] {
counter-reset: section 81;
}
.ordered-list[start='83'] {
counter-reset: section 82;
}
.ordered-list[start='84'] {
counter-reset: section 83;
}
.ordered-list[start='85'] {
counter-reset: section 84;
}
.ordered-list[start='86'] {
counter-reset: section 85;
}
.ordered-list[start='87'] {
counter-reset: section 86;
}
.ordered-list[start='88'] {
counter-reset: section 87;
}
.ordered-list[start='89'] {
counter-reset: section 88;
}
.ordered-list[start='90'] {
counter-reset: section 89;
}
.ordered-list[start='91'] {
counter-reset: section 90;
}
.ordered-list[start='92'] {
counter-reset: section 91;
}
.ordered-list[start='93'] {
counter-reset: section 92;
}
.ordered-list[start='94'] {
counter-reset: section 93;
}
.ordered-list[start='95'] {
counter-reset: section 94;
}
.ordered-list[start='96'] {
counter-reset: section 95;
}
.ordered-list[start='97'] {
counter-reset: section 96;
}
.ordered-list[start='98'] {
counter-reset: section 97;
}
.ordered-list[start='99'] {
counter-reset: section 98;
}
.ordered-list[start='100'] {
counter-reset: section 99;
}
.ordered-list[start='101'] {
counter-reset: section 100;
}
.ordered-list[start='102'] {
counter-reset: section 101;
}
.ordered-list[start='103'] {
counter-reset: section 102;
}
.ordered-list[start='104'] {
counter-reset: section 103;
}
.ordered-list[start='105'] {
counter-reset: section 104;
}
.ordered-list[start='106'] {
counter-reset: section 105;
}
.ordered-list[start='107'] {
counter-reset: section 106;
}
.ordered-list[start='108'] {
counter-reset: section 107;
}
.ordered-list[start='109'] {
counter-reset: section 108;
}
.ordered-list[start='110'] {
counter-reset: section 109;
}
.ordered-list[start='111'] {
counter-reset: section 110;
}
.ordered-list[start='112'] {
counter-reset: section 111;
}
.ordered-list[start='113'] {
counter-reset: section 112;
}
.ordered-list[start='114'] {
counter-reset: section 113;
}
.ordered-list[start='115'] {
counter-reset: section 114;
}
.ordered-list[start='116'] {
counter-reset: section 115;
}
.ordered-list[start='117'] {
counter-reset: section 116;
}
.ordered-list[start='118'] {
counter-reset: section 117;
}
.ordered-list[start='119'] {
counter-reset: section 118;
}
.ordered-list[start='120'] {
counter-reset: section 119;
}
.ordered-list[start='121'] {
counter-reset: section 120;
}
.ordered-list[start='122'] {
counter-reset: section 121;
}
.ordered-list[start='123'] {
counter-reset: section 122;
}
.ordered-list[start='124'] {
counter-reset: section 123;
}
.ordered-list[start='125'] {
counter-reset: section 124;
}
.ordered-list[start='126'] {
counter-reset: section 125;
}
.ordered-list[start='127'] {
counter-reset: section 126;
}
.ordered-list[start='128'] {
counter-reset: section 127;
}
.ordered-list[start='129'] {
counter-reset: section 128;
}
.ordered-list[start='130'] {
counter-reset: section 129;
}
.ordered-list[start='131'] {
counter-reset: section 130;
}
.ordered-list[start='132'] {
counter-reset: section 131;
}
.ordered-list[start='133'] {
counter-reset: section 132;
}
.ordered-list[start='134'] {
counter-reset: section 133;
}
.ordered-list[start='135'] {
counter-reset: section 134;
}
.ordered-list[start='136'] {
counter-reset: section 135;
}
.ordered-list[start='137'] {
counter-reset: section 136;
}
.ordered-list[start='138'] {
counter-reset: section 137;
}
.ordered-list[start='139'] {
counter-reset: section 138;
}
.ordered-list[start='140'] {
counter-reset: section 139;
}
.ordered-list[start='141'] {
counter-reset: section 140;
}
.ordered-list[start='142'] {
counter-reset: section 141;
}
.ordered-list[start='143'] {
counter-reset: section 142;
}
.ordered-list[start='144'] {
counter-reset: section 143;
}
.ordered-list[start='145'] {
counter-reset: section 144;
}
.ordered-list[start='146'] {
counter-reset: section 145;
}
.ordered-list[start='147'] {
counter-reset: section 146;
}
.ordered-list[start='148'] {
counter-reset: section 147;
}
.ordered-list[start='149'] {
counter-reset: section 148;
}
.ordered-list[start='150'] {
counter-reset: section 149;
}
.ordered-list[start='151'] {
counter-reset: section 150;
}
.ordered-list[start='152'] {
counter-reset: section 151;
}
.ordered-list[start='153'] {
counter-reset: section 152;
}
.ordered-list[start='154'] {
counter-reset: section 153;
}
.ordered-list[start='155'] {
counter-reset: section 154;
}
.ordered-list[start='156'] {
counter-reset: section 155;
}
.ordered-list[start='157'] {
counter-reset: section 156;
}
.ordered-list[start='158'] {
counter-reset: section 157;
}
.ordered-list[start='159'] {
counter-reset: section 158;
}
.ordered-list[start='160'] {
counter-reset: section 159;
}
/* Plain list - Core styles
==========================================================================
Example
*/
.plain-list {
list-style-type: none;
margin: 1.25em 0;
/* 20px / 16px */
padding: 0;
}
.plain-list > li {
margin-bottom: .625em;
/* 10px / 16px */
padding: 0;
}
.plain-list > li:last-child {
margin-bottom: 0;
}
.plain-list > li > :first-child {
margin-top: 0;
}
.plain-list > li > :last-child {
margin-bottom: 0;
}
/* Definition list - Core styles
==========================================================================
Example
*/
.definition-list > dt {
font: bold 1em/1.5 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 16px/24px / 16px */
margin-top: 1em;
/* 16px / 16px */
}
.definition-list > dt,
.t-accent-light .definition-list > dt,
.t-accent-dark .t-accent-light .definition-list > dt {
color: #5c596d;
}
.t-accent-dark .definition-list > dt {
color: #fff;
}
.fonts-loaded .definition-list > dt {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.definition-list > dt:first-child,
.definition-list > dt > :first-child,
.definition-list > dd > :first-child {
margin-top: 0;
}
/* Opening times - Core styles
==========================================================================
Example
*/
.opening-times {
margin-bottom: 1em;
}
.opening-times__days {
font-weight: bold;
}
.fonts-loaded .opening-times__days {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.opening-times__hours {
margin-bottom: .9375em;
/* 15px / 16px */
}
@media (min-width: 20em) {
.opening-times {
margin-bottom: 1em;
max-width: 25em;
/* 400px / 16px */
overflow: hidden;
}
.opening-times__days {
clear: both;
float: left;
padding-right: 1.25em;
/* 20px / 16px */
width: 60%;
}
.opening-times__hours {
float: right;
margin-bottom: 0;
text-align: right;
width: 40%;
}
}
/* Social list - Core styles
==========================================================================
Example
*/
.social-list > li {
display: inline-block;
margin: 0;
padding-left: 0;
padding-right: .625em;
/* 10px / 16px */
}
.social-list__icon {
background-position: center center;
background-repeat: no-repeat;
border: 0;
display: block;
height: 1.25em;
/* 20px / 16px */
text-align: left;
text-indent: -9999em;
width: 1.25em;
/* 20px / 16px */
}
.social-list__icon--facebook,
.t-accent-light .social-list__icon--facebook,
.t-accent-dark .t-accent-light .social-list__icon--facebook {
background-image: url('../images/icons/social/facebook.png');
}
.svg .social-list__icon--facebook,
.svg .t-accent-light .social-list__icon--facebook,
.svg .t-accent-dark .t-accent-light .social-list__icon--facebook {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PHRpdGxlPmljLWZhY2ViPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjMDA0ZmI2Ij48Zz48cGF0aCBkPSJNMTguOSAwSDEuMUMuNSAwIDAgLjUgMCAxLjF2MTcuOGMwIC42LjUgMS4xIDEuMSAxLjFoOS41OHYtNy43NGgtMi42VjkuMjRoMi42VjdjLS4xLTEuMDYuMjYtMi4xMiAxLTIuOS43Ni0uNzYgMS44LTEuMTYgMi44OC0xLjA4Ljc4IDAgMS41Ni4wNCAyLjMzLjEydjIuN2gtMS42Yy0uNC0uMS0uODUuMDMtMS4xNS4zMy0uMy4zLS40My43Mi0uMzUgMS4xNHYxLjk0aDNsLS40IDMuMDJoLTIuNlYyMGg1LjFjLjYgMCAxLjEtLjUgMS4xLTEuMVYxLjFjMC0uNi0uNS0xLjEtMS4xLTEuMXoiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.t-accent-dark .social-list__icon--facebook {
background-image: url('../images/icons/social/facebook-white.png');
}
.svg .t-accent-dark .social-list__icon--facebook {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PHRpdGxlPmljLWZhY2ViPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjZmZmIj48Zz48cGF0aCBkPSJNMTguOSAwSDEuMUMuNSAwIDAgLjUgMCAxLjF2MTcuOGMwIC42LjUgMS4xIDEuMSAxLjFoOS41OHYtNy43NGgtMi42VjkuMjRoMi42VjdjLS4xLTEuMDYuMjYtMi4xMiAxLTIuOS43Ni0uNzYgMS44LTEuMTYgMi44OC0xLjA4Ljc4IDAgMS41Ni4wNCAyLjMzLjEydjIuN2gtMS42Yy0uNC0uMS0uODUuMDMtMS4xNS4zMy0uMy4zLS40My43Mi0uMzUgMS4xNHYxLjk0aDNsLS40IDMuMDJoLTIuNlYyMGg1LjFjLjYgMCAxLjEtLjUgMS4xLTEuMVYxLjFjMC0uNi0uNS0xLjEtMS4xLTEuMXoiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--facebook:focus,
.t-accent-light .social-list__icon--facebook:focus,
.t-accent-dark .t-accent-light .social-list__icon--facebook:focus,
.t-accent-dark .social-list__icon--facebook:focus,
.social-list__icon--facebook:hover,
.t-accent-light .social-list__icon--facebook:hover,
.t-accent-dark .t-accent-light .social-list__icon--facebook:hover,
.t-accent-dark .social-list__icon--facebook:hover {
background-image: url('../images/icons/social/facebook-hover.png');
}
.svg .social-list__icon--facebook:focus,
.svg .t-accent-light .social-list__icon--facebook:focus,
.svg .t-accent-dark .t-accent-light .social-list__icon--facebook:focus,
.svg .t-accent-dark .social-list__icon--facebook:focus,
.svg .social-list__icon--facebook:hover,
.svg .t-accent-light .social-list__icon--facebook:hover,
.svg .t-accent-dark .t-accent-light .social-list__icon--facebook:hover,
.svg .t-accent-dark .social-list__icon--facebook:hover {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PHRpdGxlPmljLWZhY2ViPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjM2I1OTk4Ij48Zz48cGF0aCBkPSJNMTguOSAwSDEuMUMuNSAwIDAgLjUgMCAxLjF2MTcuOGMwIC42LjUgMS4xIDEuMSAxLjFoOS41OHYtNy43NGgtMi42VjkuMjRoMi42VjdjLS4xLTEuMDYuMjYtMi4xMiAxLTIuOS43Ni0uNzYgMS44LTEuMTYgMi44OC0xLjA4Ljc4IDAgMS41Ni4wNCAyLjMzLjEydjIuN2gtMS42Yy0uNC0uMS0uODUuMDMtMS4xNS4zMy0uMy4zLS40My43Mi0uMzUgMS4xNHYxLjk0aDNsLS40IDMuMDJoLTIuNlYyMGg1LjFjLjYgMCAxLjEtLjUgMS4xLTEuMVYxLjFjMC0uNi0uNS0xLjEtMS4xLTEuMXoiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--twitter {
width: 1.5em;
/* 24px / 16px */
}
.social-list__icon--twitter,
.t-accent-light .social-list__icon--twitter,
.t-accent-dark .t-accent-light .social-list__icon--twitter {
background-image: url('../images/icons/social/twitter.png');
}
.svg .social-list__icon--twitter,
.svg .t-accent-light .social-list__icon--twitter,
.svg .t-accent-dark .t-accent-light .social-list__icon--twitter {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLXR3aXR0ZXI8L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGZpbGw9Im5vbmUiPjxnIGZpbGw9IiMwMDRmYjYiPjxnPjxwYXRoIGQ9Ik0yMy4xNiAyLjNjLS44Ny4zOC0xLjguNjQtMi43My43NSAxLS42IDEuNzQtMS41NCAyLjEtMi42NS0uOTQuNTYtMS45Ni45NS0zLjAyIDEuMTZDMTguMTguMTMgMTYuMS0uMzQgMTQuMy40Yy0xLjgyLjctMyAyLjQ4LTMgNC40MyAwIC4zNy4wNC43NC4xMiAxLjEtMy44My0uMi03LjQtMi4wMi05LjgtNUMuMzYgMy4xIDEgNS45IDMuMSA3LjNjLS43NSAwLTEuNS0uMjItMi4xNS0uNnYuMDdjMCAyLjI3IDEuNTggNC4yMyAzLjggNC43LS40LjEtLjgyLjE2LTEuMjUuMTYtLjMgMC0uNi0uMDMtLjg4LS4wOC42IDEuOTQgMi40IDMuMjcgNC40MyAzLjMyLTIgMS41Ny00LjUyIDIuMjgtNy4wMyAxLjk4IDQuMTcgMi42OCA5LjQ4IDIuODcgMTMuODIuNDcgNC4zNC0yLjQgNy4wMi02Ljk3IDYuOTgtMTEuOTMgMC0uMjIgMC0uNDMgMC0uNjMuOTItLjY4IDEuNzItMS41IDIuMzYtMi40N3oiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.t-accent-dark .social-list__icon--twitter {
background-image: url('../images/icons/social/twitter-white.png');
}
.svg .t-accent-dark .social-list__icon--twitter {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLXR3aXR0ZXI8L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGZpbGw9Im5vbmUiPjxnIGZpbGw9IiNmZmYiPjxnPjxwYXRoIGQ9Ik0yMy4xNiAyLjNjLS44Ny4zOC0xLjguNjQtMi43My43NSAxLS42IDEuNzQtMS41NCAyLjEtMi42NS0uOTQuNTYtMS45Ni45NS0zLjAyIDEuMTZDMTguMTguMTMgMTYuMS0uMzQgMTQuMy40Yy0xLjgyLjctMyAyLjQ4LTMgNC40MyAwIC4zNy4wNC43NC4xMiAxLjEtMy44My0uMi03LjQtMi4wMi05LjgtNUMuMzYgMy4xIDEgNS45IDMuMSA3LjNjLS43NSAwLTEuNS0uMjItMi4xNS0uNnYuMDdjMCAyLjI3IDEuNTggNC4yMyAzLjggNC43LS40LjEtLjgyLjE2LTEuMjUuMTYtLjMgMC0uNi0uMDMtLjg4LS4wOC42IDEuOTQgMi40IDMuMjcgNC40MyAzLjMyLTIgMS41Ny00LjUyIDIuMjgtNy4wMyAxLjk4IDQuMTcgMi42OCA5LjQ4IDIuODcgMTMuODIuNDcgNC4zNC0yLjQgNy4wMi02Ljk3IDYuOTgtMTEuOTMgMC0uMjIgMC0uNDMgMC0uNjMuOTItLjY4IDEuNzItMS41IDIuMzYtMi40N3oiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--twitter:focus,
.t-accent-light .social-list__icon--twitter:focus,
.t-accent-dark .t-accent-light .social-list__icon--twitter:focus,
.t-accent-dark .social-list__icon--twitter:focus,
.social-list__icon--twitter:hover,
.t-accent-light .social-list__icon--twitter:hover,
.t-accent-dark .t-accent-light .social-list__icon--twitter:hover,
.t-accent-dark .social-list__icon--twitter:hover {
background-image: url('../images/icons/social/twitter-hover.png');
}
.svg .social-list__icon--twitter:focus,
.svg .t-accent-light .social-list__icon--twitter:focus,
.svg .t-accent-dark .t-accent-light .social-list__icon--twitter:focus,
.svg .t-accent-dark .social-list__icon--twitter:focus,
.svg .social-list__icon--twitter:hover,
.svg .t-accent-light .social-list__icon--twitter:hover,
.svg .t-accent-dark .t-accent-light .social-list__icon--twitter:hover,
.svg .t-accent-dark .social-list__icon--twitter:hover {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLXR3aXR0ZXI8L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGZpbGw9Im5vbmUiPjxnIGZpbGw9IiMxZGExZjIiPjxnPjxwYXRoIGQ9Ik0yMy4xNiAyLjNjLS44Ny4zOC0xLjguNjQtMi43My43NSAxLS42IDEuNzQtMS41NCAyLjEtMi42NS0uOTQuNTYtMS45Ni45NS0zLjAyIDEuMTZDMTguMTguMTMgMTYuMS0uMzQgMTQuMy40Yy0xLjgyLjctMyAyLjQ4LTMgNC40MyAwIC4zNy4wNC43NC4xMiAxLjEtMy44My0uMi03LjQtMi4wMi05LjgtNUMuMzYgMy4xIDEgNS45IDMuMSA3LjNjLS43NSAwLTEuNS0uMjItMi4xNS0uNnYuMDdjMCAyLjI3IDEuNTggNC4yMyAzLjggNC43LS40LjEtLjgyLjE2LTEuMjUuMTYtLjMgMC0uNi0uMDMtLjg4LS4wOC42IDEuOTQgMi40IDMuMjcgNC40MyAzLjMyLTIgMS41Ny00LjUyIDIuMjgtNy4wMyAxLjk4IDQuMTcgMi42OCA5LjQ4IDIuODcgMTMuODIuNDcgNC4zNC0yLjQgNy4wMi02Ljk3IDYuOTgtMTEuOTMgMC0uMjIgMC0uNDMgMC0uNjMuOTItLjY4IDEuNzItMS41IDIuMzYtMi40N3oiLz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--google {
width: 1.875em;
/* 30px / 16px */
}
.social-list__icon--google,
.t-accent-light .social-list__icon--google,
.t-accent-dark .t-accent-light .social-list__icon--google {
background-image: url('../images/icons/social/google.png');
}
.svg .social-list__icon--google,
.svg .t-accent-light .social-list__icon--google,
.svg .t-accent-dark .t-accent-light .social-list__icon--google {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLWcrPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjMDA0ZmI2Ij48Zz48Zz48cGF0aCBkPSJNOS4zMy4zM0M0LjE4LjMzIDAgNC41IDAgOS42NyAwIDE0LjgyIDQuMTggMTkgOS4zMyAxOWMyLjY3LS4wMiA1LjItMS4yMyA2LjktMy4yOCAxLjctMi4wNiAyLjQtNC43NiAxLjkyLTcuNEg5LjMzdjMuMmg1LjNjLS41IDIuNS0yLjc3IDQuMjItNS4zIDQuMDQtMy4yLS4wNy01Ljc3LTIuNy01Ljc3LTUuOXMyLjU3LTUuODIgNS43Ny01LjljMS4zOCAwIDIuNzIuNSAzLjcyIDEuNDVsMi41NC0yLjQzQzEzLjkgMS4xNyAxMS42NS4zIDkuMzIuMzNtMTcuMzQgNS4zNEgyNHYyLjY2aC0yLjY3VjExSDI0djIuNjdoMi42N1YxMWgyLjY2VjguMzNoLTIuNjZWNS42NyIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.t-accent-dark .social-list__icon--google {
background-image: url('../images/icons/social/google-white.png');
}
.svg .t-accent-dark .social-list__icon--google {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLWcrPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjZmZmIj48Zz48Zz48cGF0aCBkPSJNOS4zMy4zM0M0LjE4LjMzIDAgNC41IDAgOS42NyAwIDE0LjgyIDQuMTggMTkgOS4zMyAxOWMyLjY3LS4wMiA1LjItMS4yMyA2LjktMy4yOCAxLjctMi4wNiAyLjQtNC43NiAxLjkyLTcuNEg5LjMzdjMuMmg1LjNjLS41IDIuNS0yLjc3IDQuMjItNS4zIDQuMDQtMy4yLS4wNy01Ljc3LTIuNy01Ljc3LTUuOXMyLjU3LTUuODIgNS43Ny01LjljMS4zOCAwIDIuNzIuNSAzLjcyIDEuNDVsMi41NC0yLjQzQzEzLjkgMS4xNyAxMS42NS4zIDkuMzIuMzNtMTcuMzQgNS4zNEgyNHYyLjY2aC0yLjY3VjExSDI0djIuNjdoMi42N1YxMWgyLjY2VjguMzNoLTIuNjZWNS42NyIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--google:focus,
.t-accent-light .social-list__icon--google:focus,
.t-accent-dark .t-accent-light .social-list__icon--google:focus,
.t-accent-dark .social-list__icon--google:focus,
.social-list__icon--google:hover,
.t-accent-light .social-list__icon--google:hover,
.t-accent-dark .t-accent-light .social-list__icon--google:hover,
.t-accent-dark .social-list__icon--google:hover {
background-image: url('../images/icons/social/google-hover.png');
}
.svg .social-list__icon--google:focus,
.svg .t-accent-dark .social-list__icon--google:focus,
.svg .t-accent-light .social-list__icon--google:focus,
.svg .social-list__icon--google:hover,
.svg .t-accent-dark .social-list__icon--google:hover,
.svg .t-accent-light .social-list__icon--google:hover {
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIxOSI+PHRpdGxlPmljLWcrPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBmaWxsPSJub25lIj48ZyBmaWxsPSIjZWQ0MTJkIj48Zz48Zz48cGF0aCBkPSJNOS4zMy4zM0M0LjE4LjMzIDAgNC41IDAgOS42NyAwIDE0LjgyIDQuMTggMTkgOS4zMyAxOWMyLjY3LS4wMiA1LjItMS4yMyA2LjktMy4yOCAxLjctMi4wNiAyLjQtNC43NiAxLjkyLTcuNEg5LjMzdjMuMmg1LjNjLS41IDIuNS0yLjc3IDQuMjItNS4zIDQuMDQtMy4yLS4wNy01Ljc3LTIuNy01Ljc3LTUuOXMyLjU3LTUuODIgNS43Ny01LjljMS4zOCAwIDIuNzIuNSAzLjcyIDEuNDVsMi41NC0yLjQzQzEzLjkgMS4xNyAxMS42NS4zIDkuMzIuMzNtMTcuMzQgNS4zNEgyNHYyLjY2aC0yLjY3VjExSDI0djIuNjdoMi42N1YxMWgyLjY2VjguMzNoLTIuNjZWNS42NyIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=');
}
.social-list__icon--youtube {
width: 1.75em;
/* 28px / 16px */
}
.social-list__icon--youtube,
.t-accent-light .social-list__icon--youtube,
.t-accent-dark .t-accent-light .social-list__icon--youtube {
background-image: url('../images/icons/social/youtube.png');
}
.svg .social-list__icon--youtube,
.svg .t-accent-light .social-list__icon--youtube,
.svg .t-accent-dark .t-accent-light .social-list__icon--youtube {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjhweCIgaGVpZ2h0PSIxOXB4IiB2aWV3Qm94PSIwIDAgMjggMTkiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDIgKDM2NzgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4gICAgPHRpdGxlPmljLXlvdXR1YmU8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iRm9vdGVyIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJGb290ZXItRGVza3RvcC0xLjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTYxLjAwMDAwMCwgLTQwLjAwMDAwMCkiIGZpbGw9IiMwMDRmYjYiPiAgICAgICAgICAgIDxnIGlkPSJTb2NpYWwtaWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwNjAuMDAwMDAwLCAzOS4wMDAwMDApIj4gICAgICAgICAgICAgICAgPGcgaWQ9ImljLXlvdXR1YmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMS4wMDAwMDAsIDEuMDAwMDAwKSI+ICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTMuNjg0MjEwNSwwIEwxMy42NzM2ODQyLDAgQzEzLjY3MzY4NDIsMCA3LjkyNjMxNTc5LDAgNC4xMDUyNjMxNiwwLjI3MjYzMTU3OSBDMy4wNzYwMDM3MSwwLjI4MTU3NzQwOSAyLjA5MDY0NjI0LDAuNjkwODIxNjU5IDEuMzU3ODk0NzQsMS40MTM2ODQyMSBDMC43NzQ5NTE4OTgsMi4xOTg1NzY4MyAwLjQwMTc5MTUyNSwzLjExOTE1OTg1IDAuMjczNjg0MjExLDQuMDg4NDIxMDUgQzAuMTAzMzI5NTUsNS41MzU3MDQzOCAwLjAxMTk2NjAzNjksNi45OTExOTU0MiAwLDguNDQ4NDIxMDUgTDAsMTAuNDkyNjMxNiBDMC4wMTE5NjYwMzY5LDExLjk0OTg1NzIgMC4xMDMzMjk1NSwxMy40MDUzNDgzIDAuMjczNjg0MjExLDE0Ljg1MjYzMTYgQzAuNDAxNzkxNTI1LDE1LjgyMTg5MjggMC43NzQ5NTE4OTgsMTYuNzQyNDc1OCAxLjM1Nzg5NDc0LDE3LjUyNzM2ODQgQzIuMTk2ODA2NzEsMTguMjU2ODA1NiAzLjI2NzM0NzYxLDE4LjY2NDg3OTQgNC4zNzg5NDczNywxOC42Nzg5NDc0IEM2LjU2ODQyMTA1LDE4Ljg4OTQ3MzcgMTMuNjg0MjEwNSwxOC45NDk0NzM3IDEzLjY4NDIxMDUsMTguOTQ5NDczNyBMMTMuNjg0MjEwNSwxOC45NDk0NzM3IEMxMy42ODQyMTA1LDE4Ljk0OTQ3MzcgMTkuNDMxNTc4OSwxOC45NDEwNTI2IDIzLjI1MjYzMTYsMTguNjY4NDIxMSBDMjQuMjgxODkxLDE4LjY1OTQ3NTIgMjUuMjY3MjQ4NSwxOC4yNTAyMzEgMjYsMTcuNTI3MzY4NCBDMjYuNTgyOTQyOCwxNi43NDI0NzU4IDI2Ljk1NjEwMzIsMTUuODIxODkyOCAyNy4wODQyMTA1LDE0Ljg1MjYzMTYgQzI3LjI1NDU2NTIsMTMuNDA1MzQ4MyAyNy4zNDU5Mjg3LDExLjk0OTg1NzIgMjcuMzU3ODk0NywxMC40OTI2MzE2IEwyNy4zNTc4OTQ3LDguNDQ4NDIxMDUgQzI3LjM0NTkyODcsNi45OTExOTU0MiAyNy4yNTQ1NjUyLDUuNTM1NzA0MzggMjcuMDg0MjEwNSw0LjA4ODQyMTA1IEMyNi45NTYxMDMyLDMuMTE5MTU5ODUgMjYuNTgyOTQyOCwyLjE5ODU3NjgzIDI2LDEuNDEzNjg0MjEgQzI1LjI2NzI0ODUsMC42OTA4MjE2NTkgMjQuMjgxODkxLDAuMjgxNTc3NDA5IDIzLjI1MjYzMTYsMC4yNzI2MzE1NzkgQzE5LjQzMTU3ODksMCAxMy42ODQyMTA1LDAgMTMuNjg0MjEwNSwwIEwxMy42ODQyMTA1LDAgWiBNMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxOC43MTU3ODk1LDkuMTk3ODk0NzQgTDExLjMyNjMxNTgsNS4zOTg5NDczNyBMMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxMS4zMjYzMTU4LDEyLjk2OTQ3MzcgWiI+PC9wYXRoPiAgICAgICAgICAgICAgICA8L2c+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+');
}
.t-accent-dark .social-list__icon--youtube {
background-image: url('../images/icons/social/youtube-white.png');
}
.svg .t-accent-dark .social-list__icon--youtube {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjhweCIgaGVpZ2h0PSIxOXB4IiB2aWV3Qm94PSIwIDAgMjggMTkiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDIgKDM2NzgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4gICAgPHRpdGxlPmljLXlvdXR1YmU8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iRm9vdGVyIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJGb290ZXItRGVza3RvcC0xLjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTYxLjAwMDAwMCwgLTQwLjAwMDAwMCkiIGZpbGw9IiNGRkZGRkYiPiAgICAgICAgICAgIDxnIGlkPSJTb2NpYWwtaWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwNjAuMDAwMDAwLCAzOS4wMDAwMDApIj4gICAgICAgICAgICAgICAgPGcgaWQ9ImljLXlvdXR1YmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMS4wMDAwMDAsIDEuMDAwMDAwKSI+ICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTMuNjg0MjEwNSwwIEwxMy42NzM2ODQyLDAgQzEzLjY3MzY4NDIsMCA3LjkyNjMxNTc5LDAgNC4xMDUyNjMxNiwwLjI3MjYzMTU3OSBDMy4wNzYwMDM3MSwwLjI4MTU3NzQwOSAyLjA5MDY0NjI0LDAuNjkwODIxNjU5IDEuMzU3ODk0NzQsMS40MTM2ODQyMSBDMC43NzQ5NTE4OTgsMi4xOTg1NzY4MyAwLjQwMTc5MTUyNSwzLjExOTE1OTg1IDAuMjczNjg0MjExLDQuMDg4NDIxMDUgQzAuMTAzMzI5NTUsNS41MzU3MDQzOCAwLjAxMTk2NjAzNjksNi45OTExOTU0MiAwLDguNDQ4NDIxMDUgTDAsMTAuNDkyNjMxNiBDMC4wMTE5NjYwMzY5LDExLjk0OTg1NzIgMC4xMDMzMjk1NSwxMy40MDUzNDgzIDAuMjczNjg0MjExLDE0Ljg1MjYzMTYgQzAuNDAxNzkxNTI1LDE1LjgyMTg5MjggMC43NzQ5NTE4OTgsMTYuNzQyNDc1OCAxLjM1Nzg5NDc0LDE3LjUyNzM2ODQgQzIuMTk2ODA2NzEsMTguMjU2ODA1NiAzLjI2NzM0NzYxLDE4LjY2NDg3OTQgNC4zNzg5NDczNywxOC42Nzg5NDc0IEM2LjU2ODQyMTA1LDE4Ljg4OTQ3MzcgMTMuNjg0MjEwNSwxOC45NDk0NzM3IDEzLjY4NDIxMDUsMTguOTQ5NDczNyBMMTMuNjg0MjEwNSwxOC45NDk0NzM3IEMxMy42ODQyMTA1LDE4Ljk0OTQ3MzcgMTkuNDMxNTc4OSwxOC45NDEwNTI2IDIzLjI1MjYzMTYsMTguNjY4NDIxMSBDMjQuMjgxODkxLDE4LjY1OTQ3NTIgMjUuMjY3MjQ4NSwxOC4yNTAyMzEgMjYsMTcuNTI3MzY4NCBDMjYuNTgyOTQyOCwxNi43NDI0NzU4IDI2Ljk1NjEwMzIsMTUuODIxODkyOCAyNy4wODQyMTA1LDE0Ljg1MjYzMTYgQzI3LjI1NDU2NTIsMTMuNDA1MzQ4MyAyNy4zNDU5Mjg3LDExLjk0OTg1NzIgMjcuMzU3ODk0NywxMC40OTI2MzE2IEwyNy4zNTc4OTQ3LDguNDQ4NDIxMDUgQzI3LjM0NTkyODcsNi45OTExOTU0MiAyNy4yNTQ1NjUyLDUuNTM1NzA0MzggMjcuMDg0MjEwNSw0LjA4ODQyMTA1IEMyNi45NTYxMDMyLDMuMTE5MTU5ODUgMjYuNTgyOTQyOCwyLjE5ODU3NjgzIDI2LDEuNDEzNjg0MjEgQzI1LjI2NzI0ODUsMC42OTA4MjE2NTkgMjQuMjgxODkxLDAuMjgxNTc3NDA5IDIzLjI1MjYzMTYsMC4yNzI2MzE1NzkgQzE5LjQzMTU3ODksMCAxMy42ODQyMTA1LDAgMTMuNjg0MjEwNSwwIEwxMy42ODQyMTA1LDAgWiBNMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxOC43MTU3ODk1LDkuMTk3ODk0NzQgTDExLjMyNjMxNTgsNS4zOTg5NDczNyBMMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxMS4zMjYzMTU4LDEyLjk2OTQ3MzcgWiI+PC9wYXRoPiAgICAgICAgICAgICAgICA8L2c+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+');
}
.social-list__icon--youtube:focus,
.t-accent-light .social-list__icon--youtube:focus,
.t-accent-dark .t-accent-light .social-list__icon--youtube:focus,
.t-accent-dark .social-list__icon--youtube:focus,
.social-list__icon--youtube:hover,
.t-accent-light .social-list__icon--youtube:hover,
.t-accent-dark .t-accent-light .social-list__icon--youtube:hover,
.t-accent-dark .social-list__icon--youtube:hover {
background-image: url('../images/icons/social/youtube-hover.png');
}
.svg .social-list__icon--youtube:focus,
.svg .t-accent-light .social-list__icon--youtube:focus,
.svg .t-accent-dark .t-accent-light .social-list__icon--youtube:focus,
.svg .t-accent-dark .social-list__icon--youtube:focus,
.svg .social-list__icon--youtube:hover,
.svg .t-accent-light .social-list__icon--youtube:hover,
.svg .t-accent-dark .t-accent-light .social-list__icon--youtube:hover,
.svg .t-accent-dark .social-list__icon--youtube:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjhweCIgaGVpZ2h0PSIxOXB4IiB2aWV3Qm94PSIwIDAgMjggMTkiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDIgKDM2NzgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4gICAgPHRpdGxlPmljLXlvdXR1YmU8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iRm9vdGVyIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJGb290ZXItRGVza3RvcC0xLjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTYxLjAwMDAwMCwgLTQwLjAwMDAwMCkiIGZpbGw9IiNlNDJjMjciPiAgICAgICAgICAgIDxnIGlkPSJTb2NpYWwtaWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwNjAuMDAwMDAwLCAzOS4wMDAwMDApIj4gICAgICAgICAgICAgICAgPGcgaWQ9ImljLXlvdXR1YmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMS4wMDAwMDAsIDEuMDAwMDAwKSI+ICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTMuNjg0MjEwNSwwIEwxMy42NzM2ODQyLDAgQzEzLjY3MzY4NDIsMCA3LjkyNjMxNTc5LDAgNC4xMDUyNjMxNiwwLjI3MjYzMTU3OSBDMy4wNzYwMDM3MSwwLjI4MTU3NzQwOSAyLjA5MDY0NjI0LDAuNjkwODIxNjU5IDEuMzU3ODk0NzQsMS40MTM2ODQyMSBDMC43NzQ5NTE4OTgsMi4xOTg1NzY4MyAwLjQwMTc5MTUyNSwzLjExOTE1OTg1IDAuMjczNjg0MjExLDQuMDg4NDIxMDUgQzAuMTAzMzI5NTUsNS41MzU3MDQzOCAwLjAxMTk2NjAzNjksNi45OTExOTU0MiAwLDguNDQ4NDIxMDUgTDAsMTAuNDkyNjMxNiBDMC4wMTE5NjYwMzY5LDExLjk0OTg1NzIgMC4xMDMzMjk1NSwxMy40MDUzNDgzIDAuMjczNjg0MjExLDE0Ljg1MjYzMTYgQzAuNDAxNzkxNTI1LDE1LjgyMTg5MjggMC43NzQ5NTE4OTgsMTYuNzQyNDc1OCAxLjM1Nzg5NDc0LDE3LjUyNzM2ODQgQzIuMTk2ODA2NzEsMTguMjU2ODA1NiAzLjI2NzM0NzYxLDE4LjY2NDg3OTQgNC4zNzg5NDczNywxOC42Nzg5NDc0IEM2LjU2ODQyMTA1LDE4Ljg4OTQ3MzcgMTMuNjg0MjEwNSwxOC45NDk0NzM3IDEzLjY4NDIxMDUsMTguOTQ5NDczNyBMMTMuNjg0MjEwNSwxOC45NDk0NzM3IEMxMy42ODQyMTA1LDE4Ljk0OTQ3MzcgMTkuNDMxNTc4OSwxOC45NDEwNTI2IDIzLjI1MjYzMTYsMTguNjY4NDIxMSBDMjQuMjgxODkxLDE4LjY1OTQ3NTIgMjUuMjY3MjQ4NSwxOC4yNTAyMzEgMjYsMTcuNTI3MzY4NCBDMjYuNTgyOTQyOCwxNi43NDI0NzU4IDI2Ljk1NjEwMzIsMTUuODIxODkyOCAyNy4wODQyMTA1LDE0Ljg1MjYzMTYgQzI3LjI1NDU2NTIsMTMuNDA1MzQ4MyAyNy4zNDU5Mjg3LDExLjk0OTg1NzIgMjcuMzU3ODk0NywxMC40OTI2MzE2IEwyNy4zNTc4OTQ3LDguNDQ4NDIxMDUgQzI3LjM0NTkyODcsNi45OTExOTU0MiAyNy4yNTQ1NjUyLDUuNTM1NzA0MzggMjcuMDg0MjEwNSw0LjA4ODQyMTA1IEMyNi45NTYxMDMyLDMuMTE5MTU5ODUgMjYuNTgyOTQyOCwyLjE5ODU3NjgzIDI2LDEuNDEzNjg0MjEgQzI1LjI2NzI0ODUsMC42OTA4MjE2NTkgMjQuMjgxODkxLDAuMjgxNTc3NDA5IDIzLjI1MjYzMTYsMC4yNzI2MzE1NzkgQzE5LjQzMTU3ODksMCAxMy42ODQyMTA1LDAgMTMuNjg0MjEwNSwwIEwxMy42ODQyMTA1LDAgWiBNMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxOC43MTU3ODk1LDkuMTk3ODk0NzQgTDExLjMyNjMxNTgsNS4zOTg5NDczNyBMMTEuMzI2MzE1OCwxMi45Njk0NzM3IEwxMS4zMjYzMTU4LDEyLjk2OTQ3MzcgWiI+PC9wYXRoPiAgICAgICAgICAgICAgICA8L2c+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+');
}
/* ==========================================================================
QUOTES
========================================================================== */
/* Inline quotes - Core styles
========================================================================== */
q {
font: bold 1.25em/1.4 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 20px/28px / 16px */
}
.fonts-loaded q {
font-family: 'source_sans_prosemibold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
q:before,
q:after {
content: '\201C';
display: inline-block;
font: bold 1.4em/.714 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 28px/20px / 20px */
}
q:before,
q:after,
.t-accent-light q:before,
.t-accent-light q:after,
.t-accent-dark .t-accent-light q:before,
.t-accent-dark .t-accent-light q:after {
color: #c01b83;
}
.t-accent-dark q:before,
.t-accent-dark q:after {
color: #ccc;
}
.fonts-loaded q:before,
.fonts-loaded q:after {
font-family: 'source_sans_prosemibold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
q:after {
content: '\201D';
}
/* Block quotes - Core styles
========================================================================== */
.blockquote {
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
margin: 1em 0;
/* 16px / 16px */
padding: .9375em 0;
/*15px 0 / 16px */
}
.blockquote p {
font: normal 1.5em/1.4167 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 24px/34px / 16px */
margin-bottom: .625em;
/* 15px / 24px */
margin-top: .9167em;
/* 22px / 24px */
}
.blockquote p,
.t-accent-light .blockquote p,
.t-accent-dark .t-accent-light .blockquote p {
color: #5c596d;
}
.t-accent-dark .blockquote p {
color: #fff;
}
.fonts-loaded .blockquote p {
font-family: 'source_sans_prolight', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.blockquote p:first-child {
margin-top: 0;
}
.blockquote p:first-child:before,
.blockquote p:last-of-type:after {
background: url('../images/icons/quote-open.png') no-repeat center bottom;
content: '\201C';
display: inline-block;
font-size: 72px;
/* fix font size due to IE11 */
height: .38889em;
/* 28px / 72px */
line-height: .38889em;
/* 28px / 72px */
margin-right: .06944em;
/* 5px / 72px */
overflow: hidden;
position: relative;
text-indent: -9999em;
width: .375em;
/* 27px / 72px */
}
.blockquote p:first-child:before,
.blockquote p:last-of-type:after {
top: .027778em;
/* 2px / 72px */
}
.blockquote p:first-child:before,
.t-accent-light .blockquote p:first-child:before,
.t-accent-dark .t-accent-light .blockquote p:first-child:before,
.blockquote p:last-of-type:after,
.t-accent-light .blockquote p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote p:last-of-type:after {
color: #c01b83;
}
.t-accent-dark .blockquote p:first-child:before,
.t-accent-dark .blockquote p:last-of-type:after {
color: #fff;
}
.blockquote p:first-child:before,
.t-accent-light .blockquote p:first-child:before,
.t-accent-dark .t-accent-light .blockquote p:first-child:before {
background-image: url('../images/icons/quote-open.png');
}
.svg .blockquote p:first-child:before,
.svg .t-accent-light .blockquote p:first-child:before,
.svg .t-accent-dark .t-accent-light .blockquote p:first-child:before {
background-image: url('../images/icons/quote-open.svg');
}
.t-accent-dark .blockquote p:first-child:before {
background-image: url('../images/icons/quote-open-white.png');
}
.svg .t-accent-dark .blockquote p:first-child:before {
background-image: url('../images/icons/quote-open-white.svg');
}
.blockquote p:last-of-type:after,
.t-accent-light .blockquote p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close.png');
}
.svg .blockquote p:last-of-type:after,
.svg .t-accent-light .blockquote p:last-of-type:after,
.svg .t-accent-dark .t-accent-light .blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close.svg');
}
.t-accent-dark .blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close-white.png');
}
.svg .t-accent-dark .blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close-white.svg');
}
.blockquote p:last-child {
margin-bottom: 0;
}
.blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close.png');
content: '\201E';
margin-left: .06944em;
/* 5px / 72px */
margin-right: 0;
}
.svg .blockquote p:first-child:before {
background-image: url('../images/icons/quote-open.svg');
}
.svg .blockquote p:last-of-type:after {
background-image: url('../images/icons/quote-close.svg');
}
.blockquote__cite {
font-style: normal;
font-weight: bold;
}
.fonts-loaded .blockquote__cite {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
@media (min-width: 35em) {
.blockquote p {
font-size: 1.625em;
/* 26px / 16px */
line-height: 1.3846em;
/* 36px / 26px */
margin-bottom: .57692em;
/* 15px / 26px */
margin-top: .8462em;
/* 22px / 26px */
}
.blockquote p:first-child:before,
.blockquote p:last-of-type:after {
font-size: 72px;
/* fix font size due to IE11 */
}
.blockquote p:first-child:before {
top: 0;
}
}
@media (min-width: 60em) {
.blockquote {
padding: .625em 0 .9375em;
/* 10px 0 15px 0 / 16px */
}
.blockquote p {
font-size: 1.75em;
/* 28px / 16px */
line-height: 1.2857;
/* 36px / 16px */
margin-bottom: .5357em;
/* 15px / 28px */
margin-top: .7857em;
/* 22px / 28px */
}
.blockquote p:first-child:before,
.blockquote p:last-of-type:after {
font-size: 72px;
/* fix font size due to IE11 */
}
}
/* Block quotes - Highlight/pullout modifiers
========================================================================== */
.blockquote--pullout,
.blockquote--highlight {
background: #eee;
border: 0;
padding-left: 1.25em;
/* 20px / 16px */
padding-right: 1.25em;
/* 20px / 16px */
}
.blockquote--highlight {
background: #c01b83;
}
.blockquote--pullout,
.t-accent-light .blockquote--pullout,
.t-accent-dark .t-accent-light .blockquote--pullout,
.t-accent-dark .blockquote--pullout {
color: #444;
}
.blockquote--pullout p,
.t-accent-light .blockquote--pullout p,
.t-accent-dark .t-accent-light .blockquote--pullout p,
.t-accent-dark .blockquote--pullout p,
.blockquote__cite,
.t-accent-light .blockquote__cite,
.t-accent-dark .t-accent-light .blockquote__cite,
.t-accent-dark .blockquote__cite {
color: #5c596d;
}
.blockquote--highlight,
.t-accent-light .blockquote--highlight,
.t-accent-dark .t-accent-light .blockquote--highlight,
.t-accent-dark .blockquote--highlight,
.blockquote--highlight p,
.t-accent-light .blockquote--highlight p,
.t-accent-dark .t-accent-light .blockquote--highlight p,
.t-accent-dark .blockquote--highlight p,
.blockquote--highlight .blockquote__cite,
.t-accent-dark .t-accent-light .blockquote--highlight .blockquote__cite,
.t-accent-dark .blockquote--highlight .blockquote__cite {
color: #fff;
}
.blockquote--pullout p:first-child:before,
.t-accent-light .blockquote--pullout p:first-child:before,
.t-accent-dark .t-accent-light .blockquote--pullout p:first-child:before,
.t-accent-dark .blockquote--pullout p:first-child:before,
.blockquote--pullout p:last-of-type:after,
.t-accent-light .blockquote--pullout p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote--pullout p:last-of-type:after,
.t-accent-dark .blockquote--pullout p:last-of-type:after {
color: #c01b83;
}
.blockquote--highlight p:first-child:before,
.t-accent-light .blockquote--highlight p:first-child:before,
.t-accent-dark .t-accent-light .blockquote--highlight p:first-child:before,
.t-accent-dark .blockquote--highlight p:first-child:before,
.blockquote--highlight p:last-of-type:after,
.t-accent-light .blockquote--highlight p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote--highlight p:last-of-type:after,
.t-accent-dark .blockquote--highlight p:last-of-type:after {
color: #fff;
}
.blockquote--pullout p:first-child:before,
.t-accent-light .blockquote--pullout p:first-child:before,
.t-accent-dark .t-accent-light .blockquote--pullout p:first-child:before,
.t-accent-dark .blockquote--pullout p:first-child:before {
background-image: url('../images/icons/quote-open.png');
}
.svg .blockquote--pullout p:first-child:before,
.svg .t-accent-light .blockquote--pullout p:first-child:before,
.svg .t-accent-dark .t-accent-light .blockquote--pullout p:first-child:before,
.svg .t-accent-dark .blockquote--pullout p:first-child:before {
background-image: url('../images/icons/quote-open.svg');
}
.blockquote--highlight p:first-child:before,
.t-accent-light .blockquote--highlight p:first-child:before,
.t-accent-dark .t-accent-light .blockquote--highlight p:first-child:before,
.t-accent-dark .blockquote--highlight p:first-child:before {
background-image: url('../images/icons/quote-open-white.png');
}
.svg .blockquote--highlight p:first-child:before,
.svg .t-accent-light .blockquote--highlight p:first-child:before,
.svg .t-accent-dark .t-accent-light .blockquote--highlight p:first-child:before,
.svg .t-accent-dark .blockquote--highlight p:first-child:before {
background-image: url('../images/icons/quote-open-white.svg');
}
.blockquote--pullout p:last-of-type:after,
.t-accent-light .blockquote--pullout p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote--pullout p:last-of-type:after,
.t-accent-dark .blockquote--pullout p:last-of-type:after {
background-image: url('../images/icons/quote-close.png');
}
.svg .blockquote--pullout p:last-of-type:after,
.svg .t-accent-light .blockquote--pullout p:last-of-type:after,
.svg .t-accent-dark .t-accent-light .blockquote--pullout p:last-of-type:after,
.svg .t-accent-dark .blockquote--pullout p:last-of-type:after {
background-image: url('../images/icons/quote-close.svg');
}
.blockquote--highlight p:last-of-type:after,
.t-accent-light .blockquote--highlight p:last-of-type:after,
.t-accent-dark .t-accent-light .blockquote--highlight p:last-of-type:after,
.t-accent-dark .blockquote--highlight p:last-of-type:after {
background-image: url('../images/icons/quote-close-white.png');
}
.svg .blockquote--highlight p:last-of-type:after,
.svg .t-accent-light .blockquote--highlight p:last-of-type:after,
.svg .t-accent-dark .t-accent-light .blockquote--highlight p:last-of-type:after,
.svg .t-accent-dark .blockquote--highlight p:last-of-type:after {
background-image: url('../images/icons/quote-close-white.svg');
}
/* ==========================================================================
TABLES
========================================================================== */
/* Table icons - Core styles
========================================================================== */
.icon {
background-position: center center;
background-repeat: no-repeat;
display: block;
height: 1.5em;
/* 24px / 16px */
margin: 0 auto;
text-indent: -9999em;
width: 1.5em;
/* 24px / 16px */
}
.icon--tick {
background-image: url('../images/icons/tick.png');
}
.svg .icon--tick {
background-image: url('../images/icons/tick.svg');
}
.icon--cross {
background-image: url('../images/icons/cross-red.png');
}
.svg .icon--cross {
background-image: url('../images/icons/cross-red.svg');
}
/* Tables - Core styles
========================================================================== */
.table {
margin: 1.25em 0;
/* 20px / 16px */
max-width: 100%;
overflow: auto;
position: relative;
}
.table table {
margin: 0;
width: 99.9%;
}
.table thead > tr > th,
.table thead > tr > td,
.table tbody > tr > th,
.table tbody > tr > td {
background-color: #fff;
padding: .9375em .625em;
/* 15px 10px / 16px */
}
.table th > :first-child,
.table td > :first-child {
margin-top: 0;
}
.table th > :last-child,
.table td > :last-child {
margin-bottom: 0;
}
.table thead > tr > th {
font-weight: bold;
text-align: center;
}
.fonts-loaded .table thead > tr > th {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.table thead > tr > th,
.table tbody > tr > th,
.table thead > tr > td,
.table tbody > tr > td {
padding: .625em .625em .6875em;
/* 10px 15px / 16px */
vertical-align: top;
}
.table tbody > tr > th,
.table tbody > tr > td {
border-right: 1px solid #ccc;
font-weight: normal;
padding: .625em .625em .6875em;
/* 10px 15px / 16px */
text-align: left;
}
@media (min-width: 35em) {
.table tbody > tr > th,
.table tbody > tr > td {
padding: .9375em .625em;
/* 15px 10px / 16px */
}
}
.table tbody > tr > th {
min-width: 10em;
}
.table tbody > tr > th.u-text--center,
.table tbody > tr > td.u-text--center {
text-align: center;
}
.table tbody > tr > th.u-text--right,
.table tbody > tr > td.u-text--right {
text-align: right;
}
.table tbody > tr > th:last-child,
.table tbody > tr > td:last-child {
border-right: 0;
}
.table tbody > tr:nth-child(odd) > th,
.table tbody > tr:nth-child(odd) > td {
background-color: #eee;
}
@media (min-width: 35em) {
.table thead > tr > th,
.table tbody > tr > th,
.table thead > tr > td,
.table tbody > tr > td {
padding-bottom: 1em;
/* 16px / 16px */
padding-left: 1.25em;
/* 20px / 16px */
padding-right: 1.25em;
/* 20px / 16px */
}
}
/* Tables - Comparison table modifer
========================================================================== */
.table--comparison thead {
display: none;
}
.table--comparison tbody > tr {
display: block;
margin: 1.25em 0;
/* 20px / 16p */
}
.table--comparison tbody > tr:first-child {
margin-top: 0;
}
.table--comparison tbody > tr:last-child {
margin-bottom: 0;
}
.table--comparison tbody > tr > th {
background: #fff;
border: 0;
display: block;
font-weight: bold;
padding-left: 0;
padding-right: 0;
}
.fonts-loaded .table--comparison tbody > tr > th {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.table--comparison tbody > tr > td {
background: #fff;
border-right: 0;
display: block;
overflow: hidden;
}
.table--comparison tbody > tr:nth-child(odd) > th,
.table--comparison tbody > tr:nth-child(odd) > td {
background-color: #fff;
}
.table--comparison tbody > tr > td:nth-child(even),
.table--comparison tbody > tr:nth-child(odd) > td:nth-child(even) {
background-color: #eee;
}
.table--comparison tbody > tr:nth-child(odd) > th {
background-color: #fff;
}
.table--comparison tbody > tr > td:before {
content: attr(data-th);
display: block;
float: left;
max-width: 80%;
}
.table--comparison tbody > tr > td > .icon {
float: right;
max-width: 20%;
}
@media (min-width: 35em) {
.table--comparison thead {
display: table-header-group;
}
.table--comparison tbody > tr {
border: 0;
display: table-row;
}
.table--comparison tbody > tr > th {
display: table-cell;
font-weight: normal;
padding-left: .625em;
/* 10px / 16px */
padding-right: .625em;
/* 10px / 16px */
}
.fonts-loaded .table--comparison tbody > tr > th {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.table--comparison tbody > tr > td {
display: table-cell;
}
.table--comparison tbody > tr > td:nth-child(even) {
background-color: #fff;
}
.table--comparison tbody > tr > th,
.table--comparison tbody > tr > td {
border-right: 1px solid #ccc;
}
.table--comparison tbody > tr:nth-child(odd) > th,
.table--comparison tbody > tr:nth-child(odd) > td,
.table--comparison tbody > tr:nth-child(odd) > td:nth-child(even) {
background-color: #eee;
}
.table--comparison tbody > tr > td:last-child {
border-right: 0;
}
.table--comparison tbody > tr > td:before {
content: '';
display: none;
}
.table--comparison tbody > tr > td > .icon {
float: none;
max-width: none;
}
}
/* Tables - Fixed column/scrollable comparison table
========================================================================== */
.table .table--fixed-column {
left: 0;
position: absolute;
top: 0;
width: auto;
}
.table .table--fixed-column > tbody > tr > th,
.table .table--fixed-column > tbody > tr > td {
border-right: 1px solid #ccc;
}
/* ==========================================================================
FORM LABEL
========================================================================== */
.a-label {
color: #5c596d;
display: block;
font-size: 1.375em;
/* 22px / 16px */
font-style: normal;
letter-spacing: -.0045em;
/* -0.1px / 22px */
line-height: 1.363em;
/* 30px / 22px */
margin: 0 0 .4545em;
/* 10px / 24px */
padding: 0;
}
.t-accent-light .a-label,
.t-card-accent-light .m-card .a-label,
.t-card-accent-light .m-card.t-accent-light .a-label,
.t-card-accent-dark .m-card.t-accent-light .a-label {
color: #5c596d;
}
.t-accent-dark .a-label,
.t-card-accent-dark .m-card .a-label,
.m-card.t-accent-dark .a-label,
.t-card-accent-light .m-card.t-accent-dark .a-label,
.t-card-accent-dark .m-card.t-accent-dark .a-label {
color: #fff;
}
.m-form-row--has-help-text .a-label {
padding-right: 1.5em;
/* 36px / 24px */
}
.m-form-row--has-explanatory-text-link .a-label {
float: left;
margin-bottom: 0;
}
.a-label__desc {
display: block;
font-weight: normal;
}
.fonts-loaded .a-label__desc {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.fonts-loaded .a-label {
font-family: 'source_sans_prolight', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.m-form-row > .a-label legend {
display: block;
left: auto;
margin-bottom: 0;
margin-top: 0;
padding-right: 0;
position: static;
width: 100%;
}
/* ==========================================================================
FORM DROPDOWN
========================================================================== */
.a-dropdown {
display: block;
position: relative;
z-index: 2;
}
.a-dropdown__select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #5c596d;
border: 1px solid #5c596d;
border-radius: .25em;
/* 4px / 16px */
color: #fff;
display: block;
line-height: 1.5em;
/* 24px / 16px */
max-width: 100%;
min-height: 3.125em;
/* 50px / 16px */
padding: .75em 1.25em;
/* 12px 20px / 16px */
position: relative;
transition: background-color .35s, border-color .35s, box-shadow .35s;
width: 100%;
}
.a-dropdown__select,
.t-accent-light .a-dropdown__select,
.t-card-accent-light .m-card .a-dropdown__select,
.t-card-accent-light .m-card.t-accent-light .a-dropdown__select,
.t-card-accent-dark .m-card.t-accent-light .a-dropdown__select {
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5);
}
.t-accent-dark .a-dropdown__select,
.t-card-accent-dark .m-card .a-dropdown__select,
.m-card.t-accent-dark .a-dropdown__select,
.t-card-accent-light .m-card.t-accent-dark .a-dropdown__select,
.t-card-accent-dark .m-card.t-accent-dark .a-dropdown__select {
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .15);
}
.is-disabled .a-dropdown__select::-ms-value,
.a-dropdown__select:disabled::-ms-value {
color: #fff;
}
_:-ms-fullscreen,
:root .a-dropdown__select {
padding-right: 1.8125em;
/* 29px / 16px - HACK: for IE11 that does not render right padding on select element correctly */
}
.a-dropdown__select:-webkit-autofill {
box-shadow: 0 0 0 1000px #5c596d inset;
-webkit-text-fill-color: #fff;
transition: all .35s;
}
.a-dropdown__select:hover,
.a-dropdown__select:focus {
background-color: #413e51;
border-color: #413e51;
}
.is-disabled .a-dropdown__select,
.a-dropdown__select:disabled {
background-color: #5c596d;
color: #fff;
pointer-events: none;
}
.a-dropdown__ui {
background: #5c596d url('../images/icons/arrow-down-white.png') no-repeat .75em center;
/* center 12px / 16px */
border-radius: 0 .3125em .3125em 0;
bottom: .1875em;
/* 3px / 16px */
content: ' ';
display: block;
pointer-events: none;
position: absolute;
right: .125em;
/* 2px / 16px */
top: .1875em;
/* 3px / 16px */
transition: background-color .35s;
width: 3.125em;
/* 50px / 16px */
}
.svg .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-white.svg');
}
.a-dropdown__select:hover ~ .a-dropdown__ui,
.a-dropdown__select:focus ~ .a-dropdown__ui {
background-color: #413e51;
}
.is-disabled .a-dropdown__select ~ .a-dropdown__ui,
.a-dropdown__select:disabled ~ .a-dropdown__ui {
background-color: #5c596d;
}
.is-error .a-dropdown__select {
border-color: #bd2624;
}
.is-valid .a-dropdown__select {
border-color: #4f9f31;
}
.a-dropdown__select:focus,
.is-error .a-dropdown__select:focus,
.is-valid .a-dropdown__select:focus {
box-shadow: none;
outline: none;
}
.m-form-row--light .a-dropdown__select {
background-color: #f9f9f9;
border-color: #aaa;
color: #444;
}
.m-form-row--light.is-disabled .a-dropdown__select::-ms-value,
.m-form-row--light .a-dropdown__select:disabled::-ms-value {
color: #444;
}
.m-form-row--light .a-dropdown__select:-webkit-autofill {
box-shadow: 0 0 0 1000px #f9f9f9 inset;
-webkit-text-fill-color: #444;
}
.m-form-row--light .a-dropdown__select:hover {
background-color: #f9f9f9;
border-color: #444;
}
.m-form-row--light.is-disabled .a-dropdown__select,
.m-form-row--light .a-dropdown__select:disabled {
background-color: #f9f9f9;
border-color: #aaa;
}
.m-form-row--light .a-dropdown__ui {
background-color: #f9f9f9;
background-image: url('../images/icons/arrow-down-form-grey.png');
}
.svg .m-form-row--light .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-form-grey.svg');
}
.m-form-row--light .a-dropdown__select:hover ~ .a-dropdown__ui,
.m-form-row--light .a-dropdown__select:focus ~ .a-dropdown__ui {
background-color: #f9f9f9;
background-image: url('../images/icons/arrow-down-dark-grey.png');
}
.svg .m-form-row--light .a-dropdown__select:hover ~ .a-dropdown__ui,
.svg .m-form-row--light .a-dropdown__select:focus ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-dark-grey.svg');
}
.m-form-row--light.is-disabled .a-dropdown__select ~ .a-dropdown__ui,
.m-form-row--light .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-color: #f9f9f9;
background-image: url('../images/icons/arrow-down-form-grey.png');
}
.svg .m-form-row--light.is-disabled .a-dropdown__select ~ .a-dropdown__ui,
.svg .m-form-row--light .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-form-grey.png');
}
.m-form-row--light.is-error .a-dropdown__select {
border-color: #bd2624;
}
.m-form-row--light.is-error .a-dropdown__ui,
.m-form-row--light.is-error .a-dropdown__select:hover ~ .a-dropdown__ui,
.m-form-row--light.is-error .a-dropdown__select:focus ~ .a-dropdown__ui,
.m-form-row--light.is-error .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-error-red.png');
}
.svg .m-form-row--light.is-error .a-dropdown__ui,
.svg .m-form-row--light.is-error .a-dropdown__select:hover ~ .a-dropdown__ui,
.svg .m-form-row--light.is-error .a-dropdown__select:focus ~ .a-dropdown__ui,
.svg .m-form-row--light.is-error .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-error-red.svg');
}
.m-form-row--light.is-valid .a-dropdown__select {
border-color: #4ca02b;
}
.m-form-row--light.is-valid .a-dropdown__ui,
.m-form-row--light.is-valid .a-dropdown__select:hover ~ .a-dropdown__ui,
.m-form-row--light.is-valid .a-dropdown__select:focus ~ .a-dropdown__ui,
.m-form-row--light.is-valid .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-form-green.png');
}
.svg .m-form-row--light.is-valid .a-dropdown__ui,
.svg .m-form-row--light.is-valid .a-dropdown__select:hover ~ .a-dropdown__ui,
.svg .m-form-row--light.is-valid .a-dropdown__select:focus ~ .a-dropdown__ui,
.svg .m-form-row--light.is-valid .a-dropdown__select:disabled ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-form-green.svg');
}
.m-form-row--light.is-valid .a-dropdown__select:hover,
.m-form-row--light.is-valid .a-dropdown__select:focus {
border-color: #4f9f31;
}
.m-form-row--light .a-dropdown__select:focus,
.m-form-row--light.is-error .a-dropdown__select:focus,
.m-form-row--light.is-valid .a-dropdown__select:focus {
border-color: #44c0ff;
}
.m-form-row--light .a-dropdown__select:focus ~ .a-dropdown__ui,
.m-form-row--light.is-error .a-dropdown__select:focus ~ .a-dropdown__ui,
.m-form-row--light.is-valid .a-dropdown__select:focus ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-guide-blue.png');
}
.svg .m-form-row--light .a-dropdown__select:focus ~ .a-dropdown__ui,
.svg .m-form-row--light.is-error .a-dropdown__select:focus ~ .a-dropdown__ui,
.svg .m-form-row--light.is-valid .a-dropdown__select:focus ~ .a-dropdown__ui {
background-image: url('../images/icons/arrow-down-guide-blue.svg');
}
/* ==========================================================================
FORM TEXTBOX
========================================================================== */
.a-textbox,
.a-textarea,
.a-date {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #fff;
border: 1px solid #aaa;
border-radius: .25em;
/* 4px / 16px */
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5) inset;
color: #444;
display: block;
height: 3.125em;
/* 50px / 16px */
line-height: 1.5em;
/* 24px / 16px */
max-width: 100%;
padding: .75em 1.25em;
/* 12px 20px / 16px */
position: relative;
transition: background-color .35s, border-color .35s, box-shadow .35s;
width: 100%;
z-index: 2;
}
.a-textarea {
height: auto;
}
input[type='search'],
.a-textbox[type='search'] {
-webkit-appearance: none;
box-sizing: border-box;
}
.a-textbox::-webkit-input-placeholder,
.a-textarea::-webkit-input-placeholder,
.a-date::-webkit-input-placeholder {
color: #777;
opacity: 1;
}
.a-textbox:-ms-input-placeholder,
.a-textarea:-ms-input-placeholder,
.a-date:-ms-input-placeholder {
color: #777;
opacity: 1;
}
.a-textbox::placeholder,
.a-textarea::placeholder,
.a-date::placeholder {
color: #777;
opacity: 1;
}
.a-textbox::-webkit-input-placeholder,
.a-textarea::-webkit-input-placeholder,
.a-date::-webkit-input-placeholder {
color: #777;
opacity: 1;
}
.a-textbox::-moz-placeholder,
.a-textarea::-moz-placeholder,
.a-date::-moz-placeholder {
color: #777;
opacity: 1;
}
.a-textbox:-ms-input-placeholder,
.a-textarea:-ms-input-placeholder,
.a-date:-ms-input-placeholder {
color: #777;
opacity: 1;
}
.a-textbox:-moz-placeholder,
.a-textarea:-moz-placeholder,
.a-date:-moz-placeholder {
color: #777;
opacity: 1;
}
.a-textbox:-webkit-autofill,
.a-textarea:-webkit-autofill,
.a-date:-webkit-autofill {
box-shadow: 0 0 0 1000px #fff inset;
-webkit-text-fill-color: #444;
transition: all .35s;
}
.is-error .a-textbox,
.is-error .a-textarea,
.is-error .a-date {
border-color: #bd2624;
}
.is-valid .a-textbox,
.is-valid .a-textarea,
.is-valid .a-date {
border-color: #4f9f31;
}
.a-textbox:hover,
.is-error .a-textbox:hover,
.is-valid .a-textbox:hover,
.a-textarea:hover,
.is-error .a-textarea:hover,
.is-valid .a-textarea:hover,
.a-date:hover,
.is-error .a-date:hover,
.is-valid .a-date:hover {
border-color: #444;
}
.is-error .a-textbox:hover,
.is-error .a-textarea:hover,
.is-error .a-date:hover {
border-color: #bd2624;
}
.is-valid .a-textbox:hover,
.is-valid .a-textarea:hover,
.is-valid .a-date:hover {
border-color: #4f9f31;
}
.a-textbox:focus,
.is-error .a-textbox:focus,
.is-valid .a-textbox:focus,
.a-textarea:focus,
.is-error .a-textarea:focus,
.is-valid .a-textarea:focus,
.a-date:focus,
.is-error .a-date:focus,
.is-valid .a-date:focus {
border-color: #44c0ff;
box-shadow: none;
}
/* Hide spinners in firefox */
.a-textbox[type='number'] {
-moz-appearance: textfield;
}
/* Hide the magnifying glass */
.a-textbox::-webkit-search-results-button,
.a-textbox::-webkit-outer-spin-button,
.a-textbox::-webkit-inner-spin-button {
-webkit-appearance: none;
}
.a-date {
background: #fff url('../images/icons/calendar.png') no-repeat 95% center;
/* 20px / 16px */
background-position: right 1.25em center;
/* 20px / 16px */
padding-right: 3.75em;
/* 60px / 16px */
position: relative;
}
.svg .a-date {
background-image: url('../images/icons/calendar.svg');
}
.a-date::-webkit-inner-spin-button,
.a-date::-webkit-clear-button {
-webkit-appearance: none;
display: none;
}
.a-date::-webkit-calendar-picker-indicator {
-webkit-appearance: none;
background: none;
border: 0;
content: '';
display: block;
height: 1.5em;
/* 24px / 16px */
opacity: 1;
padding: 0;
position: absolute;
right: 1.25em;
/* 20px / 16px */
top: .75em;
/* 12px / 16px */
width: 1.25em;
/* 20px / 16px */
}
.a-date:after {
background: #fff url('../images/icons/calendar.png') no-repeat center center;
/* 12px / 16px */
bottom: 2px;
content: '';
display: block;
pointer-events: none;
position: absolute;
right: 1.25em;
/* 20px / 16px */
top: 2px;
transition: background .35s;
width: 1.25em;
/* 20px / 16px */
}
.svg .a-date:after {
background-image: url('../images/icons/calendar.svg');
}
@media (min-width: 60em) {
.js-a-date.a-date::-webkit-calendar-picker-indicator,
.js-m-date-range .a-date::-webkit-calendar-picker-indicator {
display: none;
}
.js-a-date.a-date::-webkit-input-placeholder,
.js-m-date-range .a-date::-webkit-input-placeholder {
display: none;
}
}
/* Input - Prefix symbol modifier
========================================================================== */
.a-textbox--plus,
.a-textbox--pound,
.a-textbox--euro,
.a-textbox--dollar {
background-position: 1.25em center;
/* 20px / 16px */
background-repeat: no-repeat;
padding-left: 2.1875em;
/* 35px / 16px */
}
.a-textbox--plus {
background-image: url('../images/icons/forms/icon-plus.png');
}
.svg .a-textbox--plus {
background-image: url('../images/icons/forms/icon-plus.svg');
}
.a-textbox--pound {
background-image: url('../images/icons/forms/icon-pound.png');
}
.svg .a-textbox--pound {
background-image: url('../images/icons/forms/icon-pound.svg');
}
.a-textbox--euro {
background-image: url('../images/icons/forms/icon-euro.png');
}
.svg .a-textbox--euro {
background-image: url('../images/icons/forms/icon-euro.svg');
}
.a-textbox--dollar {
background-image: url('../images/icons/forms/icon-dollar.png');
}
.svg .a-textbox--dollar {
background-image: url('../images/icons/forms/icon-dollar.png');
}
/* Input - Suffix symbol modifier
========================================================================== */
.a-textbox--percent,
.a-textbox--pence {
background-position: 95% center;
/* 13.5px / 16px */
background-position: right 1.25em center;
/* 20px / 16px */
background-repeat: no-repeat;
padding-right: 2.1875em;
/* 35px / 16px */
}
.a-textbox--percent {
background-image: url('../images/icons/forms/icon-percent.png');
}
.svg .a-textbox--percent {
background-image: url('../images/icons/forms/icon-percent.svg');
}
.a-textbox--pence {
background-image: url('../images/icons/forms/icon-pence.png');
}
.svg .a-textbox--pence {
background-image: url('../images/icons/forms/icon-pence.svg');
}
/* Input - Sizing
========================================================================== */
.a-textbox--1-character,
.a-textbox--2-character,
.a-textbox--3-character,
.a-textbox--4-character,
.a-textbox--5-character,
.a-textbox--6-character,
.a-textbox--7-character,
.a-textbox--8-character,
.a-textbox--9-character,
.a-textbox--10-character,
.a-textbox--11-character {
text-align: center;
}
.a-textbox--1-character {
width: 3.6em;
}
.a-textbox--2-character {
width: 4.6em;
}
.a-textbox--3-character {
width: 5.6em;
}
.a-textbox--4-character {
width: 6.4em;
}
.a-textbox--5-character {
width: 7.4em;
}
.a-textbox--6-character {
width: 8.4em;
}
.a-textbox--7-character {
width: 9.2em;
}
.a-textbox--8-character {
width: 10.1em;
}
.a-textbox--9-character {
width: 11em;
}
.a-textbox--10-character {
width: 11.8em;
}
.a-textbox--11-character {
width: 12.8em;
}
.fonts-loaded .a-textbox--1-character {
width: 3.6em;
}
.fonts-loaded .a-textbox--2-character {
width: 4.3em;
}
.fonts-loaded .a-textbox--3-character {
width: 5em;
}
.fonts-loaded .a-textbox--4-character {
width: 5.8em;
}
.fonts-loaded .a-textbox--5-character {
width: 6.5em;
}
.fonts-loaded .a-textbox--6-character {
width: 7.1em;
}
.fonts-loaded .a-textbox--7-character {
width: 8em;
}
.fonts-loaded .a-textbox--8-character {
width: 8.6em;
}
.fonts-loaded .a-textbox--9-character {
width: 9.4em;
}
.fonts-loaded .a-textbox--10-character {
width: 10.2em;
}
.fonts-loaded .a-textbox--11-character {
width: 10.9em;
}
.a-textbox--plus.a-textbox--1-character,
.a-textbox--pound.a-textbox--1-character,
.a-textbox--euro.a-textbox--1-character,
.a-textbox--dollar.a-textbox--1-character,
.a-textbox--percent.a-textbox--1-character,
.a-textbox--pence.a-textbox--1-character {
width: 4.6em;
}
.a-textbox--plus.a-textbox--2-character,
.a-textbox--pound.a-textbox--2-character,
.a-textbox--euro.a-textbox--2-character,
.a-textbox--dollar.a-textbox--2-character,
.a-textbox--percent.a-textbox--2-character,
.a-textbox--pence.a-textbox--2-character {
width: 5.6em;
}
.a-textbox--plus.a-textbox--3-character,
.a-textbox--pound.a-textbox--3-character,
.a-textbox--euro.a-textbox--3-character,
.a-textbox--dollar.a-textbox--3-character,
.a-textbox--percent.a-textbox--3-character,
.a-textbox--pence.a-textbox--3-character {
width: 6.6em;
}
.a-textbox--plus.a-textbox--4-character,
.a-textbox--pound.a-textbox--4-character,
.a-textbox--euro.a-textbox--4-character,
.a-textbox--dollar.a-textbox--4-character,
.a-textbox--percent.a-textbox--4-character,
.a-textbox--pence.a-textbox--4-character {
width: 7.4em;
}
.a-textbox--plus.a-textbox--5-character,
.a-textbox--pound.a-textbox--5-character,
.a-textbox--euro.a-textbox--5-character,
.a-textbox--dollar.a-textbox--5-character,
.a-textbox--percent.a-textbox--5-character,
.a-textbox--pence.a-textbox--5-character {
width: 8.4em;
}
.a-textbox--plus.a-textbox--6-character,
.a-textbox--pound.a-textbox--6-character,
.a-textbox--euro.a-textbox--6-character,
.a-textbox--dollar.a-textbox--6-character,
.a-textbox--percent.a-textbox--6-character,
.a-textbox--pence.a-textbox--6-character {
width: 9.4em;
}
.a-textbox--plus.a-textbox--7-character,
.a-textbox--pound.a-textbox--7-character,
.a-textbox--euro.a-textbox--7-character,
.a-textbox--dollar.a-textbox--7-character,
.a-textbox--percent.a-textbox--7-character,
.a-textbox--pence.a-textbox--7-character {
width: 10.2em;
}
.a-textbox--plus.a-textbox--8-character,
.a-textbox--pound.a-textbox--8-character,
.a-textbox--euro.a-textbox--8-character,
.a-textbox--dollar.a-textbox--8-character,
.a-textbox--percent.a-textbox--8-character,
.a-textbox--pence.a-textbox--8-character {
width: 11.1em;
}
.a-textbox--plus.a-textbox--9-character,
.a-textbox--pound.a-textbox--9-character,
.a-textbox--euro.a-textbox--9-character,
.a-textbox--dollar.a-textbox--9-character,
.a-textbox--percent.a-textbox--9-character,
.a-textbox--pence.a-textbox--9-character {
width: 12em;
}
.a-textbox--plus.a-textbox--10-character,
.a-textbox--pound.a-textbox--10-character,
.a-textbox--euro.a-textbox--10-character,
.a-textbox--dollar.a-textbox--10-character,
.a-textbox--percent.a-textbox--10-character,
.a-textbox--pence.a-textbox--10-character {
width: 12.8em;
}
.a-textbox--plus.a-textbox--11-character,
.a-textbox--pound.a-textbox--11-character,
.a-textbox--euro.a-textbox--11-character,
.a-textbox--dollar.a-textbox--11-character,
.a-textbox--percent.a-textbox--11-character,
.a-textbox--pence.a-textbox--11-character {
width: 13.8em;
}
.fonts-loaded .a-textbox--plus.a-textbox--1-character,
.fonts-loaded .a-textbox--pound.a-textbox--1-character,
.fonts-loaded .a-textbox--euro.a-textbox--1-character,
.fonts-loaded .a-textbox--dollar.a-textbox--1-character,
.fonts-loaded .a-textbox--percent.a-textbox--1-character,
.fonts-loaded .a-textbox--pence.a-textbox--1-character {
width: 4.6em;
}
.fonts-loaded .a-textbox--plus.a-textbox--2-character,
.fonts-loaded .a-textbox--pound.a-textbox--2-character,
.fonts-loaded .a-textbox--euro.a-textbox--2-character,
.fonts-loaded .a-textbox--dollar.a-textbox--2-character,
.fonts-loaded .a-textbox--percent.a-textbox--2-character,
.fonts-loaded .a-textbox--pence.a-textbox--2-character {
width: 5.3em;
}
.fonts-loaded .a-textbox--plus.a-textbox--3-character,
.fonts-loaded .a-textbox--pound.a-textbox--3-character,
.fonts-loaded .a-textbox--euro.a-textbox--3-character,
.fonts-loaded .a-textbox--dollar.a-textbox--3-character,
.fonts-loaded .a-textbox--percent.a-textbox--3-character,
.fonts-loaded .a-textbox--pence.a-textbox--3-character {
width: 6em;
}
.fonts-loaded .a-textbox--plus.a-textbox--4-character,
.fonts-loaded .a-textbox--pound.a-textbox--4-character,
.fonts-loaded .a-textbox--euro.a-textbox--4-character,
.fonts-loaded .a-textbox--dollar.a-textbox--4-character,
.fonts-loaded .a-textbox--percent.a-textbox--4-character,
.fonts-loaded .a-textbox--pence.a-textbox--4-character {
width: 6.8em;
}
.fonts-loaded .a-textbox--plus.a-textbox--5-character,
.fonts-loaded .a-textbox--pound.a-textbox--5-character,
.fonts-loaded .a-textbox--euro.a-textbox--5-character,
.fonts-loaded .a-textbox--dollar.a-textbox--5-character,
.fonts-loaded .a-textbox--percent.a-textbox--5-character,
.fonts-loaded .a-textbox--pence.a-textbox--5-character {
width: 7.5em;
}
.fonts-loaded .a-textbox--plus.a-textbox--6-character,
.fonts-loaded .a-textbox--pound.a-textbox--6-character,
.fonts-loaded .a-textbox--euro.a-textbox--6-character,
.fonts-loaded .a-textbox--dollar.a-textbox--6-character,
.fonts-loaded .a-textbox--percent.a-textbox--6-character,
.fonts-loaded .a-textbox--pence.a-textbox--6-character {
width: 8.1em;
}
.fonts-loaded .a-textbox--plus.a-textbox--7-character,
.fonts-loaded .a-textbox--pound.a-textbox--7-character,
.fonts-loaded .a-textbox--euro.a-textbox--7-character,
.fonts-loaded .a-textbox--dollar.a-textbox--7-character,
.fonts-loaded .a-textbox--percent.a-textbox--7-character,
.fonts-loaded .a-textbox--pence.a-textbox--7-character {
width: 9em;
}
.fonts-loaded .a-textbox--plus.a-textbox--8-character,
.fonts-loaded .a-textbox--pound.a-textbox--8-character,
.fonts-loaded .a-textbox--euro.a-textbox--8-character,
.fonts-loaded .a-textbox--dollar.a-textbox--8-character,
.fonts-loaded .a-textbox--percent.a-textbox--8-character,
.fonts-loaded .a-textbox--pence.a-textbox--8-character {
width: 9.6em;
}
.fonts-loaded .a-textbox--plus.a-textbox--9-character,
.fonts-loaded .a-textbox--pound.a-textbox--9-character,
.fonts-loaded .a-textbox--euro.a-textbox--9-character,
.fonts-loaded .a-textbox--dollar.a-textbox--9-character,
.fonts-loaded .a-textbox--percent.a-textbox--9-character,
.fonts-loaded .a-textbox--pence.a-textbox--9-character {
width: 10.4em;
}
.fonts-loaded .a-textbox--plus.a-textbox--10-character,
.fonts-loaded .a-textbox--pound.a-textbox--10-character,
.fonts-loaded .a-textbox--euro.a-textbox--10-character,
.fonts-loaded .a-textbox--dollar.a-textbox--10-character,
.fonts-loaded .a-textbox--percent.a-textbox--10-character,
.fonts-loaded .a-textbox--pence.a-textbox--10-character {
width: 11.2em;
}
.fonts-loaded .a-textbox--plus.a-textbox--11-character,
.fonts-loaded .a-textbox--pound.a-textbox--11-character,
.fonts-loaded .a-textbox--euro.a-textbox--11-character,
.fonts-loaded .a-textbox--dollar.a-textbox--11-character,
.fonts-loaded .a-textbox--percent.a-textbox--11-character,
.fonts-loaded .a-textbox--pence.a-textbox--11-character {
width: 11.9em;
}
/* In-browser validation styles for text inputs and dropdowns
========================================================================== */
/*
.a-textbox--valid {
border-color: var(--color-positive-green);
}
*/
.a-textbox:invalid,
.a-dropdown__select:invalid {
border-color: #bd2624;
}
.a-textbox:-moz-submit-invalid,
.a-dropdown__select:-moz-submit-invalid {
border-color: #bd2624;
}
.a-textbox:-moz-ui-invalid,
.a-dropdown__select:-moz-ui-invalid {
border-color: #bd2624;
}
/* Textbox groups
========================================================================== */
.m-textbox-group {
margin: -.625em 0 0 0;
padding: 0;
}
.m-textbox-group__item {
display: inline-block;
list-style-type: none;
margin-right: .625em;
/* 10px / 16px */
margin-top: .625em;
/* 10px / 16px */
padding: 0;
text-align: center;
}
.m-textbox-group__item:last-child {
margin-right: 0;
}
.m-textbox-group__item-label {
left: -9999em;
position: absolute;
}
.m-textbox-group--visible-label .m-textbox-group__item-label {
display: block;
margin-bottom: .625em;
/* 10px / 16px */
position: static;
}
.m-textbox-group--visible-label .m-textbox-group__item-label,
.t-accent-light .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-light .m-card .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-light .m-card.t-accent-light .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-dark .m-card.t-accent-light .m-textbox-group--visible-label .m-textbox-group__item-label {
color: #777;
}
.t-accent-dark .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-dark .m-card .m-textbox-group--visible-label .m-textbox-group__item-label,
.m-card.t-accent-dark .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-light .m-card.t-accent-dark .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-light .m-card.t-accent-dark .m-textbox-group--visible-label .m-textbox-group__item-label,
.t-card-accent-dark .m-card.t-accent-dark .m-textbox-group--visible-label .m-textbox-group__item-label {
color: #fff;
}
.m-textbox-group__item input[type='password'].a-textbox--1-character {
padding-left: .3125em;
/* 5px / 16px */
padding-right: .3125em;
/* 5px / 16px */
width: 3.125em;
}
/* ==========================================================================
FORM DATE RANGE
========================================================================== */
.m-date-range {
list-style: none;
margin: 0;
padding: 0;
}
@media (max-width: 40em) {
.m-date-range .a-label {
font-size: 1em;
font-weight: bold;
line-height: 1.5em;
/* 24px / 16px */
}
.fonts-loaded .m-date-range .a-label {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.m-date-range__item--start {
margin-bottom: 1.25em;
/* 20px / 16px */
}
.m-form-row__content .m-date-range {
margin-top: 1.25em;
/* 20px / 16px */
}
.m-form-row__content .m-date-range:first-child {
margin-top: .625em;
/* 10px / 16px */
}
}
@media (min-width: 40em) {
.m-date-range {
background: #5c596d url('../images/icons/forms/date-range-arrow-white.png') no-repeat center center;
border: 1px solid #5c596d;
border-radius: .25em;
/* 4px / 16px */
color: #fff;
display: block;
line-height: 1.5em;
/* 24px / 16px */
max-width: 100%;
min-height: 3.125em;
/* 50px / 16px */
position: relative;
width: 100%;
}
.m-date-range,
.t-accent-light .m-date-range,
.t-card-accent-light .m-card .m-date-range,
.t-card-accent-light .m-card.t-accent-light .m-date-range,
.t-card-accent-dark .m-card.t-accent-light .m-date-range {
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5);
}
.t-accent-dark .m-date-range,
.t-card-accent-dark .m-card .m-date-range,
.m-card.t-accent-dark .m-date-range,
.t-card-accent-light .m-card.t-accent-dark .m-date-range,
.t-card-accent-light .m-card.t-accent-dark .m-date-range,
.t-card-accent-dark .m-card.t-accent-dark .m-date-range {
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .15);
}
.svg .m-date-range {
background-image: url('../images/icons/forms/date-range-arrow-white.svg');
}
.m-date-range .a-label {
left: -9999em;
position: absolute;
}
.m-date-range__item {
position: absolute;
top: -1px;
width: 45%;
}
.csscalc .m-date-range__item {
width: calc(50% - .9375em);
/* 15px / 16px */
}
.m-date-range__item .a-date {
background-color: #5c596d;
border: 1px solid #5c596d;
box-shadow: none;
color: #fff;
}
.m-date-range__item .a-date::-webkit-input-placeholder {
color: #fff;
}
.m-date-range__item .a-date:-ms-input-placeholder {
color: #fff;
}
.m-date-range__item .a-date::placeholder {
color: #fff;
}
.m-date-range__item .a-date::-webkit-input-placeholder {
color: #fff;
}
.m-date-range__item .a-date::-moz-placeholder {
color: #fff;
}
.m-date-range__item .a-date:-ms-input-placeholder {
color: #fff;
}
.m-date-range__item .a-date:-moz-placeholder {
color: #fff;
}
.m-date-range__item .a-date:-webkit-autofill {
box-shadow: 0 0 0 1000px #5c596d inset;
-webkit-text-fill-color: #fff;
}
.m-date-range__item .a-date {
background-image: url('../images/icons/calendar-white.png');
}
.svg .m-date-range__item .a-date {
background-image: url('../images/icons/calendar-white.svg');
}
.m-date-range__item .a-date:after {
background-color: #5c596d;
background-image: url('../images/icons/calendar-white.png');
}
.svg .m-date-range__item .a-date:after {
background-image: url('../images/icons/calendar-white.svg');
}
.m-date-range__item .a-date:focus {
background-color: #f9f9f9;
border-color: #44c0ff;
color: #444;
}
.m-date-range__item .a-date:focus::-webkit-input-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus:-ms-input-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus::placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus::-webkit-input-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus::-moz-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus:-ms-input-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus:-moz-placeholder {
color: #777;
font-weight: bold;
}
.m-date-range__item .a-date:focus:-webkit-autofill {
box-shadow: 0 0 0 1000px #fff inset;
-webkit-text-fill-color: #444;
}
.m-date-range__item .a-date:focus {
background-color: #f9f9f9;
background-image: url('../images/icons/calendar.png');
}
.svg .m-date-range__item .a-date:focus {
background-image: url('../images/icons/calendar.svg');
}
.m-date-range__item .a-date:focus:after {
background-color: #f9f9f9;
background-image: url('../images/icons/calendar.png');
}
.svg .m-date-range__item .a-date:focus:after {
background-image: url('../images/icons/calendar.svg');
}
.is-valid .m-date-range,
.is-valid .m-date-range__item .a-date {
border-color: #4f9f31;
}
.is-error .m-date-range,
.is-error .m-date-range__item .a-date {
border-color: #bd2624;
}
.m-date-range__item--start {
left: -1px;
}
.m-date-range__item--start .a-date {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.m-date-range__item--start .a-date,
.is-valid .m-date-range__item--start .a-date,
.is-error .m-date-range__item--start .a-date {
border-right-color: transparent;
}
.m-date-range__item--end {
right: -1px;
}
.m-date-range__item--end .a-date {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.m-date-range__item--end .a-date,
.is-valid .m-date-range__item--end .a-date,
.is-error .m-date-range__item--end .a-date {
border-left-color: transparent;
}
.m-date-range__item--start .a-date:focus,
.is-valid .m-date-range__item--start .a-date:focus,
.is-error .m-date-range__item--start .a-date:focus,
.m-date-range__item--end .a-date:focus,
.is-valid .m-date-range__item--end .a-date:focus,
.is-error .m-date-range__item--end .a-date:focus {
border-color: #44c0ff;
}
.m-date-range__ui {
background: url('../images/icons/forms/dotted-line-white.png') no-repeat center center;
content: '';
display: block;
height: 1.25em;
/* 20px / 16px */
opacity: 1;
position: absolute;
right: 0;
top: .875em;
/* 14px / 16px */
transition: opacity .25s;
width: 2px;
z-index: 2;
}
.svg .m-date-range__ui {
background-image: url('../images/icons/forms/dotted-line-white.svg');
}
.m-date-range__item--end .m-date-range__ui {
left: 0;
right: auto;
}
.m-date-range .a-date:focus + .m-date-range__ui {
opacity: 0;
}
.m-form-row--light .m-date-range {
background-image: url('../images/icons/forms/date-range-arrow.png');
}
.svg .m-form-row--light .m-date-range {
background-image: url('../images/icons/forms/date-range-arrow.svg');
}
.m-form-row--light .m-date-range,
.m-form-row--light .m-date-range__item .a-date {
background-color: #f9f9f9;
border-color: #aaa;
color: #444;
}
.m-form-row--light.is-valid .m-date-range,
.m-form-row--light.is-valid .m-date-range__item .a-date {
border-color: #4f9f31;
}
.m-form-row--light.is-error .m-date-range,
.m-form-row--light.is-error .m-date-range__item .a-date {
border-color: #bd2624;
}
.m-form-row--light .m-date-range__item .a-date::-webkit-input-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date:-ms-input-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date::placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date::-webkit-input-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date::-moz-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date:-ms-input-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date:-moz-placeholder {
color: #444;
}
.m-form-row--light .m-date-range__item .a-date:-webkit-autofill {
box-shadow: 0 0 0 1000px #f9f9f9 inset;
-webkit-text-fill-color: #444;
}
.m-form-row--light .m-date-range__item .a-date {
background-image: url('../images/icons/calendar.png');
}
.m-form-row--light .svg .m-date-range__item .a-date {
background-image: url('../images/icons/calendar.svg');
}
.m-form-row--light .m-date-range__item .a-date:after {
background-color: #f9f9f9;
background-image: url('../images/icons/calendar.png');
}
.svg .m-form-row--light .m-date-range__item .a-date:after {
background-image: url('../images/icons/calendar.svg');
}
.m-form-row--light .m-date-range__item--start .a-date,
.m-form-row--light.is-valid .m-date-range__item--start .a-date,
.m-form-row--light.is-error .m-date-range__item--start .a-date {
border-right-color: transparent;
}
.m-form-row--light .m-date-range__item--end .a-date,
.m-form-row--light.is-valid .m-date-range__item--end .a-date,
.m-form-row--light.is-error .m-date-range__item--end .a-date {
border-left-color: transparent;
}
.m-form-row--light .m-date-range__item--start .a-date:focus,
.m-form-row--light.is-valid .m-date-range__item--start .a-date:focus,
.m-form-row--light.is-error .m-date-range__item--start .a-date:focus,
.m-form-row--light .m-date-range__item--end .a-date:focus,
.m-form-row--light.is-valid .m-date-range__item--end .a-date:focus,
.m-form-row--light.is-error .m-date-range__item--end .a-date:focus {
border-color: #44c0ff;
}
.m-form-row--light .m-date-range__ui {
background-image: url('../images/icons/forms/dotted-line.png');
}
.svg .m-form-row--light .m-date-range__ui {
background-image: url('../images/icons/forms/dotted-line.svg');
}
}
/* ==========================================================================
FORM CHECKBOX
========================================================================== */
.a-checkbox {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
cursor: pointer;
display: block;
position: relative;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.a-checkbox__input {
height: 1px;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 1px;
z-index: 1;
}
.a-checkbox__label {
background: #5c596d;
border: 1px solid #5c596d;
border-radius: .25em;
/* 4px / 16px */
color: #fff;
display: block;
opacity: 1;
padding: .75em 1.25em .75em 3.4375em;
/* 12px 20px 12px 55px / 16px */
transition: background-color .35s box-shadow .35s;
}
.a-checkbox__label,
.t-accent-light .a-checkbox__label,
.t-card-accent-light .m-card .a-checkbox__label,
.t-card-accent-light .m-card.t-accent-light .a-checkbox__label,
.t-card-accent-dark .m-card.t-accent-light .a-checkbox__label {
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5);
}
.t-accent-dark .a-checkbox__label,
.t-card-accent-dark .m-card .a-checkbox__label,
.m-card.t-accent-dark .a-checkbox__label,
.t-card-accent-light .m-card.t-accent-dark .a-checkbox__label,
.t-card-accent-dark .m-card.t-accent-dark .a-checkbox__label {
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .15);
}
.m-form-row--light .a-checkbox__label {
background: #f9f9f9;
border-color: #aaa;
color: #444;
}
.fonts-loaded .a-checkbox__label {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
opacity: 1;
}
.a-checkbox__label-inner {
display: block;
}
.a-checkbox__label:before,
.a-checkbox__label:after {
background: #fff;
bottom: .46875em;
/* 7.5px / 16px */
content: ' ';
display: block;
height: 2em;
/* 32px / 16px */
left: .625em;
/* 10px / 16px */
margin-top: .5625em;
/* 9px / 16px */
position: absolute;
top: 0;
transition: background-color .35s, border-color .35s;
width: 2em;
/* 32px / 16px */
z-index: 2;
}
.a-checkbox .a-checkbox__label:before,
.a-checkbox .a-checkbox__label:after {
border-radius: .25em;
/* 4px / 16px */
}
.a-checkbox__label:before {
border: 1px solid #fff;
height: 1.8125em;
/* 28px / 16px */
width: 1.8125em;
/* 28px / 16px */
}
.m-form-row--light .a-checkbox__label:before {
border-color: #aaa;
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5) inset;
transition: box-shadow .35s;
}
.a-checkbox__label:after {
background-color: transparent;
background-position: center center;
background-repeat: no-repeat;
border: 0;
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
z-index: 3;
}
.a-checkbox:hover .a-checkbox__label,
.a-checkbox__input:focus ~ .a-checkbox__label {
background-color: #413e51;
border-color: #413e51;
}
.m-form-row--light .a-checkbox:hover .a-checkbox__label,
.m-form-row--light .a-checkbox__input:focus ~ .a-checkbox__label {
background-color: #eee;
border-color: #aaa;
}
.a-checkbox .a-checkbox__label:after {
height: 2em;
/* 32px / 16px */
transition: -webkit-transform ease-out .35s;
transition: transform ease-out .35s;
transition: transform ease-out .35s, -webkit-transform ease-out .35s;
width: 2em;
/* 32px / 16px */
}
.a-checkbox__input:checked ~ .a-checkbox__label {
background-color: #4ca02b;
border-color: #4ca02b;
box-shadow: none;
color: #fff;
font-weight: bold;
}
.fonts-loaded .a-checkbox__input:checked ~ .a-checkbox__label {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
opacity: 1;
}
.a-checkbox__input:checked ~ .a-checkbox__label:before,
.m-form-row--light .a-checkbox__input:checked ~ .a-checkbox__label:before {
border-color: #fff;
}
.m-form-row--light .a-checkbox__input:checked ~ .a-checkbox__label:before {
box-shadow: none;
}
.a-checkbox__input:checked ~ .a-checkbox__label:after {
background-image: url('../images/icons/forms/tick.png');
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
.svg .a-checkbox__input:checked ~ .a-checkbox__label:after {
background-image: url('../images/icons/forms/tick.svg');
}
.a-checkbox__input:checked:focus ~ .a-checkbox__label {
background-color: #3c8022;
border-color: #3c8022;
}
.m-form-row--light .a-checkbox__input:checked:focus ~ .a-checkbox__label:before {
border-color: #fff;
}
.m-form-row__content > .m-checkbox-group,
.m-form-row__content > .m-checkbox-group:first-child {
margin: -.9375em 0 0;
/* -15px / 16px */
padding: 0;
}
.m-form-row__content > .m-checkbox-group:after {
clear: both;
content: '';
display: block;
}
.m-checkbox-group__item {
display: block;
list-style-type: none;
margin-top: .9375em;
/* 15px / 16px */
padding: 0;
}
.m-checkbox-group__item:last-child {
margin-right: 0;
}
.is-error .m-form-row__content .a-checkbox__label {
border-color: #bd2624;
}
.is-error .m-form-row__content .a-checkbox__label:focus {
box-shadow: none;
}
@media (min-width: 35em) {
.m-form-row__content > .m-checkbox-group--2,
.m-form-row__content > .m-checkbox-group--2:first-child {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-left: -2.5%;
/* -2.5% / 16px */
}
.csscalc .m-form-row__content > .m-checkbox-group--2,
.csscalc .m-form-row__content > .m-checkbox-group--2:first-child {
margin-left: -2.5%;
/* -2.5% / 16px */
}
.m-checkbox-group--2 > .m-checkbox-group__item {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row;
-ms-flex-flow: row;
flex-flow: row;
float: left;
margin-left: 2.5%;
/* 2.5% / 16px */
width: 47.5%;
}
.csscalc .m-checkbox-group--2 > .m-checkbox-group__item {
margin-left: 1.25em;
/* 20px / 16px */
width: calc(50% - 1.25em);
/* 20px / 16px */
}
.m-checkbox-group--2 .a-checkbox {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row;
-ms-flex-flow: row;
flex-flow: row;
width: 100%;
}
.m-checkbox-group--2 .a-checkbox__label {
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
display: block;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
overflow-wrap: break-word;
width: 100%;
}
}
@media (min-width: 60em) {
.m-form-row__content > .m-checkbox-group--3,
.m-form-row__content > .m-checkbox-group--3:first-child {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-left: -2.5%;
/* -2.5% / 16px */
}
.m-checkbox-group--3 > .m-checkbox-group__item {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row;
-ms-flex-flow: row;
flex-flow: row;
float: left;
margin-left: 2.5%;
/* 2.4% / 16px */
width: 30.83%;
}
.m-checkbox-group--3 .a-checkbox {
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row;
-ms-flex-flow: row;
flex-flow: row;
width: 100%;
}
.m-checkbox-group--3 .a-checkbox__label {
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
display: block;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
overflow-wrap: break-word;
width: 100%;
}
.csscalc .m-form-row__content > .m-checkbox-group--2,
.csscalc .m-form-row__content > .m-checkbox-group--2:first-child,
.csscalc .m-form-row__content > .m-checkbox-group--3,
.csscalc .m-form-row__content > .m-checkbox-group--3:first-child {
margin-left: -1.875em;
/* 30px / 16px */
}
.csscalc .m-checkbox-group--2 > .m-checkbox-group__item,
.csscalc .m-checkbox-group--3 > .m-checkbox-group__item {
margin-left: 1.875em;
/* 30px / 16px */
width: calc(50% - 1.875em);
/* 30px / 16px */
}
.csscalc .m-checkbox-group--3 > .m-checkbox-group__item {
width: calc(33.33% - 1.875em);
/* 30px / 16px */
}
}
.csstransforms .a-checkbox {
background: #5c596d;
border-radius: .25em;
/* 4px / 16px */
}
.csstransforms .a-checkbox__label {
position: relative;
z-index: 3;
}
.csstransforms .a-checkbox__label,
.csstransforms .a-checkbox:hover .a-checkbox__label,
.csstransforms .a-checkbox__input:checked ~ .a-checkbox__label,
.csstransforms .a-checkbox__input:checked:focus ~ .a-checkbox__label {
background-color: transparent;
border-color: transparent;
}
.csstransforms .a-checkbox__ui {
border-radius: .25em;
/* 4px / 16px */
bottom: 0;
display: block;
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
.csstransforms .a-checkbox__ui:before {
background: #5c596d;
border: 1px solid #5c596d;
border-radius: .25em;
/* 4px / 16px */
bottom: 0;
content: '';
display: block;
left: 0;
position: absolute;
right: 0;
top: 0;
transition: background-color .35s, border-color .35s;
z-index: 1;
}
.csstransforms .a-checkbox:hover .a-checkbox__ui:before,
.csstransforms .a-radio:hover .a-checkbox__ui:before,
.csstransforms .a-checkbox__input:focus ~ .a-checkbox__ui:before,
.csstransforms .a-radio__input:focus ~ .a-checkbox__ui:before {
background-color: #413e51;
border-color: #413e51;
}
.csstransforms .m-form-row--light .a-checkbox__ui:before {
background: #f9f9f9;
border-color: #aaa;
}
.csstransforms .m-form-row--light .a-checkbox:hover .a-checkbox__ui:before,
.csstransforms .m-form-row--light .a-radio:hover .a-checkbox__ui:before,
.csstransforms .m-form-row--light .a-checkbox__input:focus ~ .a-checkbox__ui:before,
.csstransforms .m-form-row--light .a-checkbox__input:focus ~ .a-checkbox__ui:before {
background-color: #eee;
border-color: #aaa;
}
.csstransforms .a-checkbox__ui:after {
background: #4ca02b;
bottom: 0;
content: '';
display: block;
left: -40px;
position: absolute;
right: -40px;
top: 0;
-webkit-transform: scaleX(0) skew(-20deg);
-ms-transform: scaleX(0) skew(-20deg);
transform: scaleX(0) skew(-20deg);
-webkit-transform-origin: 0 50%;
-ms-transform-origin: 0 50%;
transform-origin: 0 50%;
transition: background-color .35s, -webkit-transform ease-out .35s;
transition: background-color .35s, transform ease-out .35s;
transition: background-color .35s, transform ease-out .35s, -webkit-transform ease-out .35s;
z-index: 1;
}
.csstransforms .a-checkbox__label {
position: relative;
z-index: 5;
}
.csstransforms .a-checkbox__input:checked ~ .a-checkbox__ui:after {
-webkit-transform: scaleX(1) skew(-20deg);
-ms-transform: scaleX(1) skew(-20deg);
transform: scaleX(1) skew(-20deg);
}
.csstransforms .a-checkbox:hover .a-checkbox__input:checked ~ .a-checkbox__ui:after,
.csstransforms .a-checkbox__input:checked:focus ~ .a-checkbox__ui:after {
background-color: #3c8022;
}
/* ==========================================================================
FORM ELEMENTS
========================================================================== */
/* Plus/Minus textbox
========================================================================== */
.a-plusminus {
background-color: #eee;
border-radius: .3125em;
/* 5px / 16px */
min-height: 1.5em;
overflow: hidden;
position: relative;
}
.a-plusminus__input {
padding-left: 4.4375em;
/* 71px / 16px */
padding-right: 4.4375em;
/* 71px / 16px */
text-align: center;
}
.a-plusminus .a-dropdown__ui {
background-image: none;
padding: .8438em 4.4375em;
/* 13.5px 71px / 16px */
text-align: center;
top: .1875em;
/* 3px / 16px */
width: 100%;
}
.svg .a-plusminus .a-dropdown__ui {
background-image: none;
}
.a-plusminus__minus,
.a-plusminus__plus {
background: #fff;
background-position: 50% 50%;
background-repeat: no-repeat;
border: 1px solid #ccc;
box-shadow: none;
color: #ccc;
height: 3.125em;
/* 50px / 16px */
left: 0;
padding: 0;
position: absolute;
top: 0;
width: 3.125em;
/* 50px / 16px */
z-index: 3;
}
.a-plusminus__minus {
background-image: url('../images/icons/minus.png');
}
.svg .a-plusminus__minus {
background-image: url('../images/icons/minus.svg');
}
.a-plusminus__plus {
background-image: url('../images/icons/plus.png');
}
.svg .a-plusminus__plus {
background-image: url('../images/icons/plus.svg');
}
.a-plusminus__plus {
left: auto;
right: 0;
}
.is-valid .a-plusminus__minus {
border: 1px solid #4f9f31;
border-right: 1px solid #ccc;
}
.is-valid .a-plusminus__plus {
border: 1px solid #4f9f31;
border-left: 1px solid #ccc;
}
.is-error .a-plusminus__minus {
border: 1px solid #bd2624;
border-right: 1px solid #ccc;
}
.is-error .a-plusminus__plus {
border: 1px solid #bd2624;
border-left: 1px solid #ccc;
}
.a-plusminus__minus:focus,
.a-plusminus__minus:hover,
.is-valid .a-plusminus__minus:focus,
.is-valid .a-plusminus__minus:hover,
.is-error .a-plusminus__minus:focus,
.is-error .a-plusminus__minus:hover,
.a-plusminus__plus:focus,
.a-plusminus__plus:hover,
.is-valid .a-plusminus__plus:focus,
.is-valid .a-plusminus__plus:hover,
.is-error .a-plusminus__plus:focus,
.is-error .a-plusminus__plus:hover {
background-color: #4f9f31;
border-color: #4f9f31;
}
.a-plusminus__minus:focus,
.a-plusminus__minus:hover {
background-image: url('../images/icons/minus-white.png');
}
.svg .a-plusminus__minus:focus,
.svg .a-plusminus__minus:hover {
background-image: url('../images/icons/minus-white.svg');
}
.a-plusminus__plus:focus,
.a-plusminus__plus:hover {
background-image: url('../images/icons/plus-white.png');
}
.svg .a-plusminus__plus:focus,
.svg .a-plusminus__plus:hover {
background-image: url('../images/icons/plus-white.svg');
}
.is-error .a-plusminus__minus:focus,
.is-error .a-plusminus__minus:hover {
background-color: #4f9f31;
border-color: #bd2624;
border-right-color: #4f9f31;
}
.is-error .a-plusminus__plus:focus,
.is-error .a-plusminus__plus:hover {
background-color: #4f9f31;
border-color: #bd2624;
border-left-color: #4f9f31;
}
.a-plusminus__minus:active,
.is-valid .a-plusminus__minus:active,
.is-error .a-plusminus__minus:active,
.a-plusminus__plus:active,
.is-valid .a-plusminus__plus:active,
.is-error .a-plusminus__plus:active {
background-color: #30850c;
background-image: url('../images/icons/minus-white.png');
}
.svg .a-plusminus__minus:active,
.svg .is-valid .a-plusminus__minus:active,
.svg .is-error .a-plusminus__minus:active {
background-image: url('../images/icons/minus-white.png');
}
.a-plusminus__plus:active,
.is-valid .a-plusminus__plus:active,
.is-error .a-plusminus__plus:active {
background-image: url('../images/icons/plus-white.png');
}
.svg .a-plusminus__plus:active,
.svg .is-valid .a-plusminus__plus:active,
.svg .is-error .a-plusminus__plus:active {
background-image: url('../images/icons/plus-white.png');
}
.js-plusminus-text-test {
bottom: 0;
display: inline-block;
position: absolute;
visibility: hidden;
}
/* ==========================================================================
FORM LAYOUTS
========================================================================== */
.m-form-row {
border-bottom: 1px dashed #ccc;
display: block;
margin: 1.875em 0;
/* 30px / 16px */
padding: .0625em 0 1.875em;
/* 1px 30px / 16px */
position: relative;
}
.m-form-row--last {
border: 0;
}
.m-form-row__content {
border-top: 1px solid transparent;
/* fixes help icon jump when help textbox is opened */
position: relative;
}
.m-form-row__content > :first-child {
margin-top: 0;
}
.m-form-row__content > :last-child {
margin-bottom: 0;
}
.m-form-row--has-explanatory-text-link .m-form-row__content {
clear: both;
}
.m-form-row__error-message,
.m-form-row__validation-message {
display: block;
font-weight: bold;
margin: 0 0 .625em 2.1875em;
/* 10px 35px / 16px */
}
.fonts-loaded .m-form-row__error-message,
.fonts-loaded .m-form-row__validation-message {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.m-form-row__error-message,
.t-accent-light .m-form-row__error-message,
.t-card-accent-light .m-card .m-form-row__error-message,
.t-card-accent-light .m-card.t-accent-light .m-form-row__error-message,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message {
color: #bd2624;
}
.m-form-row__validation-message,
.t-accent-light .m-form-row__validation-message,
.t-card-accent-light .m-card .m-form-row__validation-message,
.t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message {
color: #4ca02b;
}
.t-accent-dark .m-form-row__error-message,
.t-card-accent-dark .m-card .m-form-row__error-message,
.m-card.t-accent-dark .m-form-row__error-message,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message,
.t-accent-dark .m-form-row__validation-message,
.t-card-accent-dark .m-card .m-form-row__validation-message,
.m-card.t-accent-dark .m-form-row__validation-message,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message {
color: #fff;
}
.m-form-row__error-message:before,
.m-form-row__validation-message:before {
background-image: url('../images/icons/forms/error.png') no-repeat center center;
content: '';
display: block;
font-size: 16px;
height: 25px;
/* 10px / 16px */
left: 0;
position: absolute;
width: 25px;
/* 10px / 16px */
}
.m-form-row__error-message:before,
.t-accent-light .m-form-row__error-message:before,
.t-card-accent-light .m-card .m-form-row__error-message:before,
.t-card-accent-light .m-card.t-accent-light .m-form-row__error-message:before,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message:before {
background-image: url('../images/icons/forms/error.png');
}
.t-accent-dark .m-form-row__error-message:before,
.t-card-accent-dark .m-card .m-form-row__error-message:before,
.m-card.t-accent-dark .m-form-row__error-message:before,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message:before,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message:before {
background-image: url('../images/icons/forms/error-white.png');
}
.svg .m-form-row__error-message:before,
.svg .t-accent-light .m-form-row__error-message:before,
.svg .t-card-accent-light .m-card .m-form-row__error-message:before,
.svg .t-card-accent-light .m-card.t-accent-light .m-form-row__error-message:before,
.svg .t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message:before {
background-image: url('../images/icons/forms/error.svg');
}
.svg .t-accent-dark .m-form-row__error-message:before,
.svg .t-card-accent-dark .m-card .m-form-row__error-message:before,
.svg .m-card.t-accent-dark .m-form-row__error-message:before,
.svg .t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message:before,
.svg .t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message:before {
background-image: url('../images/icons/forms/error-white.svg');
}
.m-form-row__validation-message:before,
.t-accent-light .m-form-row__validation-message:before,
.t-card-accent-light .m-card .m-form-row__validation-message:before,
.t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message:before,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message:before {
background-image: url('../images/icons/forms/valid.png');
}
.t-accent-dark .m-form-row__validation-message:before,
.t-card-accent-dark .m-card .m-form-row__validation-message:before,
.m-card.t-accent-dark .m-form-row__validation-message:before,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message:before,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message:before {
background-image: url('../images/icons/forms/valid-white.png');
}
.svg .m-form-row__validation-message:before,
.svg .t-accent-light .m-form-row__validation-message:before,
.svg .t-card-accent-light .m-card .m-form-row__validation-message:before,
.svg .t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message:before,
.svg .t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message:before {
background-image: url('../images/icons/forms/valid.svg');
}
.svg .t-accent-dark .m-form-row__validation-message:before,
.svg .t-card-accent-dark .m-card .m-form-row__validation-message:before,
.svg .m-card.t-accent-dark .m-form-row__validation-message:before,
.svg .t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message:before,
.svg .t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message:before {
background-image: url('../images/icons/forms/valid-white.svg');
}
.m-form-row__error-message a,
.m-form-row__validation-message a {
border-bottom-color: #ccc;
border-bottom-style: solid;
}
.m-form-row__error-message a,
.t-accent-light .m-form-row__error-message a,
.t-card-accent-light .m-card .m-form-row__error-message a,
.t-card-accent-light .m-card.t-accent-light .m-form-row__error-message a,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message a {
color: #bd2624;
}
.m-form-row__validation-message a,
.t-accent-light .m-form-row__validation-message a,
.t-card-accent-light .m-card .m-form-row__validation-message a,
.t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message a,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message a {
color: #4ca02b;
}
.t-accent-dark .m-form-row__error-message a,
.t-card-accent-dark .m-card .m-form-row__error-message a,
.m-card.t-accent-dark .m-form-row__error-message a,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message a,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message a,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message a,
.t-accent-dark .m-form-row__validation-message a,
.t-card-accent-dark .m-card .m-form-row__validation-message a,
.m-card.t-accent-dark .m-form-row__validation-message a,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message a,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message a,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message a {
border-bottom-style: dotted;
color: #fff;
}
.m-form-row__error-message a:hover,
.m-form-row__error-message a:focus,
.m-form-row__validation-message a:hover,
.m-form-row__validation-message a:focus {
border-bottom-style: solid;
}
.m-form-row__error-message a:hover,
.m-form-row__error-message a:focus,
.t-accent-light .m-form-row__error-message a:hover,
.t-accent-light .m-form-row__error-message a:focus,
.t-card-accent-light .m-card .m-form-row__error-message a:hover,
.t-card-accent-light .m-card .m-form-row__error-message a:focus,
.t-card-accent-light .m-card.t-accent-light .m-form-row__error-message a:hover,
.t-card-accent-light .m-card.t-accent-light .m-form-row__error-message a:focus,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message a:hover,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__error-message a:focus {
border-bottom-color: #bd2624;
}
.m-form-row__validation-message a:hover,
.m-form-row__validation-message a:focus,
.t-accent-light .m-form-row__validation-message a:hover,
.t-accent-light .m-form-row__validation-message a:focus,
.t-card-accent-light .m-card .m-form-row__validation-message a:hover,
.t-card-accent-light .m-card .m-form-row__validation-message a:focus,
.t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message a:hover,
.t-card-accent-light .m-card.t-accent-light .m-form-row__validation-message a:focus,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message a:hover,
.t-card-accent-dark .m-card.t-accent-light .m-form-row__validation-message a:focus {
border-bottom-color: #4ca02b;
}
.t-accent-dark .m-form-row__error-message a:hover,
.t-accent-dark .m-form-row__error-message a:focus,
.t-card-accent-dark .m-card .m-form-row__error-message a:hover,
.t-card-accent-dark .m-card .m-form-row__error-message a:focus,
.m-card.t-accent-dark .m-form-row__error-message a:hover,
.m-card.t-accent-dark .m-form-row__error-message a:focus,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message a:hover,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__error-message a:focus,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message a:hover,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__error-message a:focus,
.t-accent-dark .m-form-row__validation-message a:hover,
.t-accent-dark .m-form-row__validation-message a:focus,
.t-card-accent-dark .m-card .m-form-row__validation-message a:hover,
.t-card-accent-dark .m-card .m-form-row__validation-message a:focus,
.m-card.t-accent-dark .m-form-row__validation-message a:hover,
.m-card.t-accent-dark .m-form-row__validation-message a:focus,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message a:hover,
.t-card-accent-light .m-card.t-accent-dark .m-form-row__validation-message a:focus,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message a:hover,
.t-card-accent-dark .m-card.t-accent-dark .m-form-row__validation-message a:focus {
border-bottom-color: #fff;
}
.m-form-row__error-message > :first-child,
.m-form-row__validation-message > :first-child {
margin-top: 0;
}
.m-form-row__error-message > :last-child,
.m-form-row__validation-message > :last-child {
margin-bottom: 0;
}
.is-disabled.form-row__content select,
.is-disabled.form-row__content textarea,
.is-disabled.form-row__content input {
pointer-events: none;
}
.m-form-row.is-disabled {
opacity: .3;
pointer-events: none;
}
@media (min-width: 35em) {
.m-form-row {
margin-left: auto;
margin-right: auto;
width: 73.75%;
}
.csscalc .m-form-row {
width: calc(75% - 1.25em);
/* 20px / 16px */
}
}
@media (min-width: 60em) {
.m-form-row {
width: 48.75%;
}
.csscalc .m-form-row {
width: calc(50% - 1.875em);
/* 30px / 16px */
}
}
@media (min-width: 35em) {
.m-form-row--full-width,
.csscalc .m-form-row--full-width {
width: 100%;
}
}
/* Form row help text */
.m-form-row__help {
margin-bottom: .9375em;
/* 15px / 16px */
position: relative;
}
.m-form-row__help.is-animating {
overflow: hidden;
}
.m-form-row__help-intro {
margin: 0;
opacity: 1;
transition: opacity .35s;
}
.m-form-row__help-all {
opacity: 0;
transition: opacity .35s;
}
.m-form-row__help.is-animating .m-form-row__help-intro {
position: relative;
width: 100%;
z-index: 2;
}
.m-form-row__help.is-open .m-form-row__help-intro {
opacity: 0;
}
.m-form-row__help.is-animating .m-form-row__help-all {
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 1;
}
.m-form-row__help.is-open .m-form-row__help-all {
opacity: 1;
}
.m-form-row__help .show-more,
.m-form-row__help .show-less {
display: inline-block;
margin-left: .15em;
/* 2.5px / 16px */
padding-left: 1.5em;
/* 24px / 16px */
position: relative;
white-space: nowrap;
}
.m-form-row__help .show-more:before,
.m-form-row__help .show-less:before {
background-image: url('../images/icons/arrow-down.png');
background-repeat: no-repeat;
content: '';
display: block;
height: 11px;
left: 0;
position: absolute;
top: .25em;
/* 4px / 16px */
width: 15px;
}
.svg .m-form-row__help .show-more:before {
background-image: url('../images/icons/arrow-down.svg');
}
.m-form-row__help .show-less:before {
background-image: url('../images/icons/arrow-up.png');
top: .4375em;
/* 7px / 16px */
}
.svg .m-form-row__help .show-less:before {
background-image: url('../images/icons/arrow-up.svg');
}
.t-accent-dark .m-form-row__help .show-more:before {
background-image: url('../images/icons/arrow-down-white.png');
}
.t-accent-dark .m-form-row__help .show-less:before {
background-image: url('../images/icons/arrow-up-white.png');
}
.svg .t-accent-dark .m-form-row__help .show-more:before {
background-image: url('../images/icons/arrow-down-white.svg');
}
.svg .t-accent-dark .m-form-row__help .show-less:before {
background-image: url('../images/icons/arrow-up-white.svg');
}
.m-form-row__help-all > :first-child {
margin-top: 0;
}
.m-form-row__help-all > :last-child {
margin-bottom: 0;
}
.m-form-row__explanatory-text {
clear: both;
margin-bottom: .9375em;
/* 15px / 16px */
margin-top: 0;
}
.m-form-row--has-help-text .m-form-row__explanatory-text {
padding-right: 2.25em;
/* 36px / 16px */
}
.m-form-row__explanatory-text-link {
display: block;
float: right;
margin-bottom: .9375em;
/* 15px / 16px */
margin-left: 1.25em;
/* 20px / 16px */
margin-top: .3125em;
/* 5px / 16px */
}
/* ==========================================================================
FORM FILE UPLOAD
========================================================================== */
.a-form-file-upload__input {
height: 1px;
left: -9999em;
opacity: 0;
overflow: hidden;
position: absolute;
width: 1px;
z-index: -1;
}
.a-form-file-upload__ui {
border: none;
color: #444;
display: none;
min-height: 3em;
/* 48px / 16px */
overflow: hidden;
padding: .75em 1em;
/* 12px 16px / 16px */
text-overflow: ellipsis;
transition: background-color .35s, border-color .35s, box-shadow .35s, color .35s;
white-space: nowrap;
width: 100%;
}
.a-form-file-upload__label {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: #fff;
border: 1px solid #ccc;
border-radius: .25em;
/* 4px / 16px */
color: #004fb6;
cursor: pointer;
display: block;
font: bold 1em/1.5 blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
/* 16px/24px / 16px */
margin: 0;
padding: .75em 1.5625em;
/* 12px 25px / 16px */
position: relative;
text-align: center;
text-decoration: none;
transition: background-color .35s, border-color .35s, color .35s, padding .35s;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
}
.fonts-loaded .a-form-file-upload__label {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
font-weight: normal;
}
.a-form-file-upload:hover .a-form-file-upload__label,
.a-form-file-upload:focus .a-form-file-upload__label,
.a-form-file-upload__input:focus ~ .a-form-file-upload__label,
.a-form-file-upload__input.has-focus ~ .a-form-file-upload__label {
background-color: #004fb6;
border-color: #004fb6;
color: #fff;
}
.a-form-file-upload__label:active {
background-color: #004fb6;
border-color: #004fb6;
color: #fff;
}
.a-form-file-upload__ui {
background: #fff;
border: 1px solid #ccc;
border-radius: .25em 0 0 .25em;
/* 4px / 16px */
border-right: 0;
box-shadow: 0 2px 2px 0 rgba(204, 204, 204, .5) inset;
color: #444;
display: none;
min-height: 3em;
/* 48px / 16px */
overflow: hidden;
padding: .75em 1em;
/* 12px 16px / 16px */
text-overflow: ellipsis;
transition: background-color .35s, border-color .35s, box-shadow .35s, color .35s;
white-space: nowrap;
width: 100%;
}
.a-form-file-upload:hover .a-form-file-upload__ui {
border-color: #444;
}
.js-a-file-upload {
display: table;
position: relative;
width: 100%;
z-index: 2;
}
.js-a-file-upload .a-form-file-upload__ui {
display: table-cell;
}
.js-a-file-upload .a-form-file-upload__label {
border-radius: 0 .25em .25em 0;
/* 4px / 16px */
display: table-cell;
min-width: 9.6875em;
/* 155px / 16px */
white-space: nowrap;
}
.a-form-file-upload__input:focus + .a-form-file-upload__ui,
.a-form-file-upload__input.has-focus + .a-form-file-upload__ui {
border-color: #44c0ff;
box-shadow: none;
}
.is-error .a-form-file-upload__ui,
.is-error .a-form-file-upload__label {
border-color: #bd2624;
}
.is-valid .a-form-file-upload__ui,
.is-valid .a-form-file-upload__label {
border-color: #4f9f31;
}
.is-error .js-a-file-upload .a-form-file-upload__label,
.is-valid .js-a-file-upload .a-form-file-upload__label {
border-left-color: #ccc;
}
.is-disabled .a-form-file-upload__ui,
.is-disabled .a-form-file-upload__label {
cursor: default;
pointer-events: none;
transition: none;
}
@media (min-width: 35em) {
.a-form-file-upload__label {
display: inline-block;
width: auto;
}
}
/* ==========================================================================
FORM ELEMENTS - DEPRICATED
========================================================================== */
/* Label - Core styles
==========================================================================
Example
*/
.form-label {
color: #5c596d;
display: block;
margin-bottom: .1875em;
/* 3px / 16px */
min-height: 1.6875em;
/* 27px / 16px */
padding-right: 2.9375em;
/* 47px / 16px */
}
.fonts-loaded .form-label {
font-family: 'source_sans_probold', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
.is-disabled .form-label {
color: #ccc;
text-decoration: line-through;
}
.form-label legend {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
display: inline;
left: auto;
position: static;
}
.form-label__desc {
display: block;
font-weight: normal;
}
.fonts-loaded .form-label__desc {
font-family: 'source_sans_proregular', -apple-system, blinkmacsystemfont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'arial', 'helvetica', sans-serif;
}
@media (min-width: 35em) {
.form-label {
margin-bottom: .375em;
/* 6px / 16px */
}
}
/* Label - Modifer when link is included in the label
==========================================================================
Example
*/
.form-label--inc-link > label {
display: block;
}
.form-label__link {
display: block;
margin: 0;
padding-bottom: 2px;
/* fix for link border being cropped */
}
/* Input - Core styles
==========================================================================
Example
*/
.form-input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: #fff;
border: 1px solid #ccc;
border-radius: .25em;
/* 4px / 16px */
color: #444;
display: block;
max-width: 100%;
min-height: 3em;
/* 48px / 16px */
padding: .75em 1em;
/* 12px 16px / 16px */
position: relative;
transition: background-color .35s, border-color .35s, box-shadow .35s, color .35s;
width: 100%;
z-index: 2;
}
.form-input[type='search'] {
-webkit-appearance: none;
box-sizing: border-box;
}
.form-input:focus {
border-color: #44c0ff;
box-shadow: 0 0 0 1px #44c0ff;
}
.is-error .form-input {
border-color: #bd2624;
}
.is-error .form-input:focus {
border-color: #bd2624;
box-shadow: 0 0 0 1px #bd2624;
}
.is-disabled .form-input {
background-color: #eee;
border-color: #ccc;
color: #5c596d;
pointer-events: none;
}
/* Hide spinners in firefox */
.form-input[type='number'] {
-moz-appearance: textfield;
}
/* Hide the magnifying glass */
.form-input::-webkit-search-results-button,
.form-input::-webkit-outer-spin-button,
.form-input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
/* In browser validation styling */
.form-input:invalid {
border-color: #bd2624;
box-shadow: none;
}
.form-input:-moz-submit-invalid {
border-color: #bd2624;
box-shadow: none;
}
.form-input:-moz-ui-invalid {
border-color: #bd2624;
box-shadow: none;
}
@media (min-width: 35em) {
.form-input {
padding-left: 1.25em;
/* 20px / 16px */
padding-right: 1.25em;
/* 20px / 16px */
}
}
/* Input - range input modifier
==========================================================================
Example
*/
.form-input[type='range'] {
-webkit-appearance: none;
background: none;
border: 0;
height: 4em;
/* 60px / 16px */
padding: .625em 0 1em;
/* 10px 0 16px / 16px */
}
.form-input[type='range']:focus {
box-shadow: none;
outline: none;
}