

/* ---- INDEX ------------------------------------------- */
/*                                                        */
/*    Initial                              CODE: kqplc    */
/*    Modular                              CODE: ggjir    */
/*    Form elements                        CODE: ogtzz    */
/*    Quote                                CODE: lmnbd    */
/*    Results                              CODE: uuant    */
/*    Transfer                             CODE: ddfhs    */
/*    Changes to elements in white form    CODE: fmqxp    */
/*    Screen size dependent                CODE: sddfa    */
/*                                                        */
/* ------------------------------------------------------ */


/* ################################################################## */
/* #### Initial - CODE: kqplc ####################################### */
/* ################################################################## */


/* ---- Reset ----------------------------------------------------------------- */

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

body.preload * {
	/* stops transitions on page load */
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-ms-transition: none !important;
	-o-transition: none !important;
}

/* ---- Colours ----------------------------------------------------------------- */

:root {
	/* font */
	--font-family-ash: "HeadingNow75", sans-serif;
	--font-family-oak: "Helvetica Neue", "HelveticaNeue", Helvetica, 'Arimo', Arial, sans-serif;
	/* EVI colours */
	--purple: #674186;
	--pink: #bf4a8e;
	--navy: #003366;
	--white: #ffffff;
	--purple-140: #291046;
	--purple-120: #391c56;
	--purple-80: #85679e;
	--purple-60: #9d84b1;
	--purple-40: #c2b3cf;
	--purple-20: #e0d8e7;
	--purple-10: #eeecf1;
	--purple-5: #f7f5f9;
	--pink-140: #8e164f;
	--pink-120: #9e2e6f;
	--pink-80: #cc6ea4;
	--pink-60: #dfa5c8;
	--pink-40: #eac5db;
	--pink-20: #f2dbe8;
	--pink-10: #f8ebf3;
	--pink-5: #fcf6f9;
	--navy-140: #001438;
	--navy-120: #00254a;
	--navy-80: #335c85;
	--navy-60: #668bae;
	--navy-40: #96b2d0;
	--navy-20: #ccd9e7;
	--navy-10: #e5eaef;
	--navy-5: #f2f5f7;
	--mint: #359791;
	--peach: #e17555;
	--coral: #e3596d;
	--black: #000000;
	--charcoal: #3d403d;
	--charcoal-80: #646664;
	--charcoal-30: #c4c5c4;
	--charcoal-20: #d8d9d8;
	--charcoal-10: #ebebeb;
	--charcoal-5: #f5f5f5;
	--mint-120: #12514d;
	--mint-neon: #30dac6;
	--mint-20: #d5f2eb;
	--mint-5: #eaf8f5;
	--peach-120: #b44626;
	--peach-neon: #ff9f5d;
	--peach-20: #ffe5d4;
	--peach-5: #fcf3ea;
	--coral-120: #c22d42;
	--coral-neon: #ff4f68;
	--coral-20: #ffd8dd;
	--coral-5: #ffedee;
	--purple-neon: #da9efd;
	/* MS7 colours */
	--primary-purple: #590f85;
	--primary-purple-neon: #9237cd;
	--primary-purple-dark: #2b173f;
	--primary-tints-01-purple-tints-purple-80: #7a3f9d;
	--primary-tints-03-purple-neon-tints-purple-neon-80: #a85fd7;
	--primary-tints-02-dark-purple-tints-purple-dark-80: #554565;
	--primary-tints-01-purple-tints-purple-60: #9b6fb6;
	--primary-tints-03-purple-neon-tints-purple-neon-60: #be87e1;
	--primary-tints-02-dark-purple-tints-purple-dark-60: #786987;
	--primary-tints-01-purple-tints-purple-40: #bd9fce;
	--primary-tints-03-purple-neon-tints-purple-neon-40: #d3afeb;
	--primary-tints-02-dark-purple-tints-purple-dark-40: #aaa2b2;
	--primary-tints-01-purple-tints-purple-20: #decfe7;
	--primary-tints-03-purple-neon-tints-purple-neon-20: #e9d7f5;
	--primary-tints-02-dark-purple-tints-purple-dark-20: #d5d1d9;
	--primary-tints-01-purple-tints-purple-5: #f6f3f9;
	--primary-tints-03-purple-neon-tints-purple-neon-5: #f9f5fc;
	--primary-tints-02-dark-purple-tints-purple-dark-5: #f4f3f5;
	--secondary-blue: #2a4787;
	--secondary-blue-dark: #011054;
	--secondary-blue-light: #e9f5fe;
	--secondary-violet: #5b4395;
	--secondary-white: #fff;
	--ui-palette-02-rewards-gold-5: #fff08a;
	--ui-palette-02-rewards-gold-20: #ffdf00;
	--ui-palette-02-rewards-gold: #ffbc00;
	--ui-palette-02-rewards-gold-dark: #e7ac04;
	--ui-palette-01-semantic-mint: #009b91;
	--ui-palette-01-semantic-mint-tints-2-mint-dark: #12514d;
	--ui-palette-01-semantic-mint-tints-3-mint-neon: #42ebd7;
	--ui-palette-01-semantic-mint-tints-4-mint-20: #d6f8f4;
	--ui-palette-01-semantic-mint-tints-5-mint-5: #f4fdfc;
	--ui-palette-01-semantic-orange: #f76900;
	--ui-palette-01-semantic-scarlet: #fe0039;
	--ui-palette-01-semantic-orange-tints-7-orange-dark: #b44626;
	--ui-palette-01-semantic-orange-tints-9-orange-20: #ffecdf;
	--ui-palette-01-semantic-orange-tints-10-orange-5: #fffaf7;
	--ui-palette-01-semantic-scarlet-tints-12-scarlet-dark: #c22d42;
	--ui-palette-01-semantic-scarlet-tints-13-scarlet-neon: #ff86a1;
	--ui-palette-14-scarlet-20: #fad1e0;
	--ui-palette-01-semantic-scarlet-tints-15-scarlet-5: #f9eff2;
	--ui-palette-01-semantic-orange-tints-8-orange-neon: #ffa96d;
	--03-semantic-tint-05-orange-dark: #b1520d;
	--03-semantic-tint-09-scarlet-dark: #9b1d39;
	--01-primary-tints-01-purple-tints-purple-120: #391c56;
	--ui-palette-01-semantic-scarlet-tints-14-scarlet-20: #fad1e0;
	--ms-7-purple: #590f85;
	--form-functional-tag-base: #590f85;
}

/* ---- Fonts ----------------------------------------------------------------- */

@font-face {
	font-family: FilsonSoft;
	src: url("../font/FilsonSoft-Regular.woff2") format("woff2"),
		url("../font/FilsonSoft-Regular.woff") format("woff");
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
}

@font-face {
	font-family: FilsonSoft;
	src: url("../font/FilsonSoft-Bold.woff2") format("woff2"),
		url("../font/FilsonSoft-Bold.woff") format("woff");
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
}

@font-face {
	font-family: HeadingNow35;
	src: url("../font/HeadingNow-35-Medium.woff2") format("woff2");
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
}

@font-face {
	font-family: HeadingNow75;
	src: url("../font/HeadingNow-75-Medium.woff2") format("woff2");
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
}

/* ---- Universal ----------------------------------------------------------------- */

body {
	/*
	background-color: var(--white);
	*/
	background-image: radial-gradient(circle at 63% 68%, var(--primary-tints-01-purple-tints-purple-80), var(--primary-tints-01-purple-tints-purple-80) 28%, var(--secondary-blue) 100%);
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff;
	font-family: var(--font-family-ash);
	font-stretch: normal;
	font-style: normal;
	font-weight: normal;
	overflow-x: hidden;
}

body.disable_scrolling {
	overflow-y: hidden;
}

body#details {
	background-attachment: fixed;
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: cover;
}

body#details.transition {

}

body#results,
body#broken_down,
body#transfer {
	background-color: var(--purple-5);
}


/* ################################################################## */
/* #### Modular - CODE: ggjir ####################################### */
/* ################################################################## */

/* ----- ul ---------------------------------------------------------------- */

ul {
	float: left;
	list-style: none;
	width: 100%;
}

ul li {
	float: left;
	position: relative;
	width: 100%;
}

ul li + li {
	margin-top: 4px;
}

/* ----- ul bullet ---------------------------------------------------------------- */

ul.bullet {
	font-size: 13px;
	line-height: 20px;
}

ul.bullet li {
	padding-left: 12px;
}

ul.bullet li:before {
	background-color: var(--charcoal);
	border-radius: 50%;
	content: '';
	height: 4px;
	position: absolute;
		top: 6px;
		left: 0;
	width: 4px;
}

/* ---- .msm_logo ---------------------------------------------------------------- */

.msm_logo {
	background-image: url(../img/logo.svg?v=8);
	background-position: center left;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 43px;
	position: relative;
	width: 100%;
}

.msm_logo a.link {
	display: block;
	height: 28px;
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
}

/* ---- .provider_logo ---------------------------------------------------------------- */

.provider_logo {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 50px;
	width: 90px;
}

/* ---- .is_mobile ---------------------------------------------------------------- */

.is_mobile {
	display: block;
}

/* ---- defaqto_rating ------------------------------------- */

.defaqto_rating {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	color: #aaa;
	float: left;
	font-size: 10px;
	line-height: 14px;
	height: 24px;
	position: relative;
	text-align: center;
	width: 60px;
}

.defaqto_rating.d0:before {
	content: 'Defaqto rating not available';
}

.defaqto_rating.d1 {
	background-image: url(/static/general/img/defaqto/1_star.png);
}

.defaqto_rating.d2 {
	background-image: url(/static/general/img/defaqto/2_star.png);
}

.defaqto_rating.d3 {
	background-image: url(/static/general/img/defaqto/3_star.png);
}

.defaqto_rating.d4 {
	background-image: url(/static/general/img/defaqto/4_star.png);
}

.defaqto_rating.d5 {
	background-image: url(/static/general/img/defaqto/5_star.png);
}

/* ----- first_name_holder ---------------------------------------------------------------- */

.first_name_holder {
	text-transform: capitalize;
}

/* ---- chevron --------------------------------------------------------------- */

.chevron {
	background-image: url(../img/chevron_primary_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 14px;
	position: relative;
	transform: rotate(180deg);
	width: 14px;
}

/* ----- message ---------------------------------------------------------------- */

.message {
	background-color: rgba(218, 158, 253, 0.2);
	border-left: 2px solid var(--purple-neon);
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	color: var(--white);
	display: none;
	float: left;
	font-family: var(--font-family-oak);
	font-weight: normal;
	max-width: 412px;
	padding: 8px 16px;
	width: 100%;
}

.message.standard {
	padding-bottom: 16px;
}

.message,
.message p,
.message ul.bullet {
	font-size: 14px;
	line-height: 22px;
}

.message p {
	float: left;
	width: 100%;
}

.message p a {
	font-family: var(--font-family-ash);
	font-weight: bold;
}

.message p span.bolden {
	font-weight: bold;
}

.message ul.bullet li {
	padding-left: 18px;
}

.message ul.bullet li:before {
	background-color: var(--white);
	height: 6px;
	top: 8px;
	width: 6px;
}

.message ul.bullet li + li {
	margin-top: 8px;
}

.message p + p,
.message ul.bullet + p,
.message p + ul.bullet,
.message ul.bullet + ul.bullet {
	margin-top: 16px;
}

/* ----- message - warning --------------------------------------------------------------- */

.message.warning {
	background-color: rgba(255, 159, 93, 0.2);
	border-color: var(--peach-neon);
}

/* ----- message - standard --------------------------------------------------------------- */

.message.standard {
	background-color: rgba(218, 158, 253, 0.2);
	border-color: var(--purple-neon);
}

.slide#begin .message.standard {
	display: block;
	margin-top: 40px;
}

.white_form .message.standard_alt {
	margin-top: 20px;
	display: block;
	max-width: 100%;
	background-color: var(--secondary-blue-light);
	border-color: var(--navy);
}

.white_form .message.standard_alt .title {
	font-size: 24px;
	color: var(--charcoal);
}


/* ----- message - error --------------------------------------------------------------- */

.message.error {
	background-color: rgba(227, 89, 109, 0.2);
	border-color: var(--ui-palette-01-semantic-scarlet);
	font-weight: bold;
}

/* ----- sides ---------------------------------------------------------------- */

.sides {
	float: left;
	width: 100%;
}

.sides .side {
	float: left;
}

.sides .side.left {
}

.sides .side.right {
	float: right;
	text-align: right;
}

/* ----- datepicker ---------------------------------------------------------------- */

.ui-datepicker {
	padding: 22px 22px 22px 22px;
}

.ui-widget.ui-widget-content {
	border-color: var(--white);
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
}

.ui-corner-all {
	border-radius: 12px;
}

.ui-widget-header {
	background: var(--white);
	border-color: var(--white);
	color: var(--charcoal);
}

.ui-datepicker .ui-datepicker-title {
	font-family: var(--font-family-oak);
	font-size: 16px;
	line-height: 26px;
}

.ui-datepicker table {
	margin: 0;
	table-layout: fixed;
}

.ui-widget-header .ui-icon {
	background-image: url(../img/icon_arrow_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
}

.ui-icon {
	height: 24px;
	width: 24px;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	margin-left: -12px;
	margin-top: -12px;
}

.ui-datepicker .ui-datepicker-next {
	transform: rotate(180deg);
}

.ui-datepicker th {
	color: var(--charcoal-80);
	font-family: var(--font-family-oak);
	font-size: 14px;
	font-weight: normal;
	line-height: 1.57;
}

.ui-datepicker td {
	padding: 0;
}

.ui-datepicker td span,
.ui-datepicker td a {
	border-radius: 50%;
	font-size: 16px;
	height: 32px;
	line-height: 32px;
	padding: 0;
	text-align: center;
	width: 32px;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	background: var(--white);
	border: 0;
	color: var(--charcoal);
	font-weight: bold;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-content .ui-state-active.ui-state-hover,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	background: var(--primary-purple);
	color: var(--white);
	font-weight: bold;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	background: transparent;
	border: 0;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 2px;
}

.ui-datepicker .ui-datepicker-prev-hover {
	left: 2px;
}

.ui-datepicker .ui-datepicker-next-hover {
	right: 2px;
}

/* ######################################################################## */
/* #### Form elements - CODE: ogtzz ####################################### */
/* ######################################################################## */


/* ---- touch action --------------------------------------------------------------- */

a,
button,
input[type="radio"],
input[type="checkbox"],
.btn,
.filters_bar .block:not(.always_open) .title,
.more_info .panels .panel.right .section.features ul li .sides,
ul.picker li {
	touch-action: manipulation;
}

/* ---- cursor pointer --------------------------------------------------------------- */

a,
button,
select,
input[type="radio"],
input[type="checkbox"],
.btn,
.filters_bar .block:not(.always_open) .title,
.more_info .panels .panel.right .section.features ul li .sides,
ul.picker li {
	cursor: pointer;
}

/* ----- input - text tel number email ----------------------------------------------------------------- */

input[type="text"],
input[type="tel"],
input[type="number"],
input[type="email"] {
	background-color: var(--white);
	border: 1px solid var(--primary-tints-01-purple-tints-purple-60);
	border-radius: 4px;
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-60);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	height: 56px;
	max-width: 416px;
	outline: none;
	padding: 0 16px;
	width: 100%;
}

/* Chrome, Safari, Edge, Opera - fix to remove up and down arrows */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox - fix to remove up and down arrows */
input[type=number] {
	-moz-appearance: textfield;
}

input[type="text"]::placeholder,
input[type="tel"]::placeholder,
input[type="number"]::placeholder,
input[type="email"]::placeholder {
	color: var(--charcoal-80);
	font-weight: normal;
}

input[type="text"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="email"]:focus {
	box-shadow: 0 0 0 3px #323a72, 0 0 0 5px #fff;
}

/* ----- date ----------------------------------------------------------------- */

.date {
	background-color: var(--white);
	border: solid 1px var(--primary-tints-01-purple-tints-purple-60);
	border-radius: 4px;
	float: left;
	position: relative;
	width: 100%;
}

.date .inputs {
	float: left;
	position: relative;
	width: calc(100% - 56px);
}

.question .date .inputs {
	width: 100%;
}

.date .inputs:before,
.date .inputs:after {
	background-color: var(--purple-80);
	content: '';
	height: 24px;
	position: absolute;
		top: calc(50% - 12px);
	width: 1px;
	z-index: 1;
}

.date .inputs:before {
	left: calc(100%/3);
}

.date .inputs:after {
	right: calc(100%/3);
}

.date .inputs input {
	border-color: transparent;
	position: relative;
	text-align: center;
	width: calc(100%/3);
}

.date .inputs input:focus {
	border-color: var(--purple-40);
	z-index: 2;
}

.date .datepicker {
	float: left;
	width: 56px;
}

.question.dob .date .datepicker {
	display: none;
}

.date .datepicker input.hasDatepicker {
	opacity: 0;
	position: absolute;
		top: 0;
		left: 0;
	visibility: hidden;
}

.date .datepicker button {
	background-color: var(--white);
	background-image: url(../img/icon_calendar_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 24px;
	border: 1px solid transparent;
	border-radius: 8px;
	color: transparent;
	float: left;
	height: 56px;
	outline: none;
	position: relative;
	width: 56px;
}

.date .datepicker button:focus {
	background-color: var(--white);
	border-color: var(--purple-40);
	border-width: 1px;
	box-shadow: 0 0 0 3px #323a72, 0 0 0 5px #fff;
}

/* ----- select ----------------------------------------------------------------- */

.select {
	background-color: var(--white);
	border: 1px solid var(--purple-40);
	border-radius: 4px;
	float: left;
	max-width: 416px;
	position: relative;
	transition: border-color .3s ease;
	width: 100%;
}

.select:after {
	background-image: url(../img/chevron_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 14px auto;
	content: '';
	height: 24px;
	margin: auto;
	position: absolute;
		top: calc(50% - 12px);
		right: 16px;
	transform: rotate(180deg);
	width: 24px;
}

.select select {
	appearance: none;
	-webkit-appearance: none;
	background-color: transparent;
	border: 0;
	color: var(--charcoal);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: bold;
	height: 52px;
	outline: none;
	padding-right: 44px;
	padding-left: 14px;
	position: relative;
	text-overflow: ellipsis;
	width: 100%;
	z-index: 1;
}

.select select:focus {
	box-shadow: 0 0 0 3px var(--primary-purple-dark), 0 0 0 5px #fff;
}

.select select option {
	color: #002a6e;
	font-size: 18px;
	font-weight: 700;
}

/* ----- anchor --------------------------------------------------------------- */

a {
	color: var(--white);
}

/* ----- button ---------------------------------------------------------------- */

.btn,
a.btn,
button.btn {
	background-color: transparent;
	border: 0;
	outline: none;
}

/* ----- button - green ---------------------------------------------------------------- */

.btn.green,
a.btn.green,
button.btn.green {
	background-color: #189507;
	background-image: linear-gradient(#31ae20, #006300);
	border-radius: 6px;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), 0 0 0 0 #42bc32, 2px 2px 2px 0 rgba(0, 0, 0, 0.1);
	color: #fff;
	float: left;
	font-family: var(--font-family-ash);
	font-size: 18px;
	font-weight: bold;
	line-height: 24px;
	padding: 12px 16px;
	text-align: center;
	text-decoration: none;
	transition: box-shadow 0.35s;
}

.btn.green:hover,
a.btn.green:hover,
button.btn.green:hover,
.btn.green:focus,
a.btn.green:focus,
button.green:focus {
	background-color: #31ae20;
	background-image: linear-gradient(#4ac739, #007c00);
}

/* ----- button - secondary_cta ---------------------------------------------------------------- */

.btn.secondary_cta,
a.btn.secondary_cta,
button.btn.secondary_cta {
	background-color: #fff;
	/*background-image: linear-gradient(to right, #776fb1 -102%, var(--pink) 92%);*/
	border: 3px solid var(--primary-purple);
	border-radius: 4px;
	color: var(--primary-purple);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: bold;
	line-height: 16px;
	padding: 12px 24px;
	text-align: center;
	text-decoration: none;
	transition: box-shadow 0.2s ease;
}

.btn.secondary_cta:hover,
a.btn.secondary_cta:hover,
button.btn.secondary_cta:hover {
	box-shadow: inset 0 0 0 2px var(--primary-purple);
}

/* ----- button - purple_rounded ---------------------------------------------------------------- */

.btn.purple_rounded,
a.btn.purple_rounded,
button.btn.purple_rounded {
	background-color: var(--primary-purple);
	/*background-image: linear-gradient(to right, #776fb1 -102%, var(--pink) 92%);*/
	border-radius: 4px;
	color: #fff;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: bold;
	line-height: 16px;
	padding: 16px 32px;
	text-align: center;
	text-decoration: none;
	transition: box-shadow 0.2s ease;
}

.btn.purple_rounded:hover,
a.btn.purple_rounded:hover,
button.btn.purple_rounded:hover {
	box-shadow: 0 0 0 2px var(--primary-purple);
}

/* ----- button - white_rounded ---------------------------------------------------------------- */

.btn.white_rounded,
a.btn.white_rounded,
button.btn.white_rounded {
	background-color: #fff;
	border-radius: 4px;
	color: var(--primary-purple);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 16px;
	padding: 16px 32px;
	text-align: center;
	text-decoration: none;
}

/* ----- button - purple_stroke_rounded ---------------------------------------------------------------- */

.btn.purple_stroke_rounded,
a.btn.purple_stroke_rounded,
button.btn.purple_stroke_rounded {
	background-color: #776fb1;
	background-image: linear-gradient(to right, #776fb1 -102%, var(--pink) 92%);
	border-radius: 4px;
	color: var(--pink);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 16px;
	padding: 3px;
	text-align: center;
	text-decoration: none;
}

.btn.purple_stroke_rounded .white,
a.btn.purple_stroke_rounded .white,
button.btn.purple_stroke_rounded .white {
	background-color: #fff;
	border-radius: 4px;
	float: left;
	font-weight: bold;
	line-height: 16px;
	padding: 13px 21px;
	text-align: center;
	text-decoration: none;
	width: 100%;
}

/* ----- button - white_stroke_rounded ---- WHITE ON THE EMOTIONAL JOURNEY / PINK ON THE FUNCTIONAL JOURNEY ----------------------------------------------------------- */

.btn.white_stroke_rounded,
a.btn.white_stroke_rounded,
button.btn.white_stroke_rounded {
	background-color: transparent;
	border: 3px solid var(--white);
	border-radius: 4px;
	color: var(--white);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 18px;
	padding: 12px 20px;
	text-align: center;
	text-decoration: none;
}

/* ----- button - white_text_underline ---------------------------------------------------------------- */

.btn.white_text_underline,
a.btn.white_text_underline,
button.btn.white_text_underline {
	color: var(--white);
	display: flex;
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
	position: relative;
	text-decoration: underline;
}

.btn.white_text_underline.cover_needs {
	padding-left: 24px;
}

.btn.white_text_underline .icon,
a.btn.white_text_underline .icon,
button.btn.white_text_underline .icon {
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 24px;
}

.btn.white_text_underline.cover_needs .icon {
	background-image: url(../img/icon_document_white.svg);
	display: block;
}

.btn.white_text_underline .text {
	float: left;
	text-decoration: underline;
}

.btn.white_text_underline:hover .text,
a.btn.white_text_underline:hover .text,
button.btn.white_text_underline:hover .text {
	text-decoration-thickness: 3px;
}

/* ----- button - pink_txt_underline ---- PINK ON THE EMOTIONAL JOURNEY ---------------------------------------------- */

.btn.pink_text_underline,
a.btn.pink_text_underline,
button.btn.pink_text_underline {
	color: var(--ms-7-purple);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 14px;
	font-weight: normal;
	line-height: 1.57;
	text-decoration: underline;
}

.btn.pink_text_underline:hover,
a.btn.pink_text_underline:hover,
button.btn.pink_text_underline:hover {
	text-decoration-thickness: 3px;
}

.btn.pink_text_underline:focus,
a.btn.pink_text_underline:focus,
button.pink_text_underline:focus {
	background-color: #007A72;
	color: #fff;
	text-decoration-thickness: 3px;
}

/* ----- button - green_text_only ---------------------------------------------------------------- */

.btn.green_text_only,
a.btn.green_text_only,
button.btn.green_text_only {
	background-color: transparent;
	color: #baed87;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 17px;
	line-height: 24px;
	text-align: left;
	text-decoration: none;
}

a.btn.green_text_only:hover,
button.btn.green_text_only:hover {
	text-decoration: underline;
}

/* ----- button - close ---------------------------------------------------------------- */

.btn.close,
a.btn.close,
button.btn.close {
	background-image: url(../img/cross_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 14px auto;
	float: left;
	height: 24px;
	text-decoration: none;
	width: 24px;
}

/* ----- ul selection ------------------------------------------------------------- */

ul.selection {
}

ul.selection li {
}

ul.selection li + li {
	margin-top: 8px;
}

ul.selection li input {
	height: 100%;
	opacity: 0;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
	z-index: 1;
}

/* ----- ul selection - style ------------------------------------------------------------ */

ul.selection li .style {
	background-color: rgba(157, 132, 177, 0.2);
	border: 1px solid var(--purple-40);
	border-radius: 4px;
	float: left;
	font-family: var(--font-family-oak);
	padding: 16px;
	width: calc(100%);
}

ul.selection li input:focus + .style {
	box-shadow: 0 0 0 3px #323a72, 0 0 0 5px #fff;
}

ul.selection li input:hover + .style {
	background-color: rgba(157, 132, 177, 0.4);
}

ul.selection li input:checked + .style {
	background-color: var(--white);
	border-color: var(--white);
	border-width: 2px;
}

ul.selection li input:checked:hover + .style {
	border-color: var(--white);
}

ul.selection li input[type="checkbox"]:checked + .style {
	border-color: var(--purple-40);
}

ul.selection li input:hover + .style,
ul.selection li input:checked:focus + .style {
	border-color: var(--purple-40);
}

ul.selection li input:disabled + .style {
	background-color: rgba(157, 132, 177, 0.2);
	border-color: var(--purple-40);
	border-width: 1px;
	opacity: 0.5;
}

ul.selection li input:disabled:hover + .style {
	border-width: 1px;
}

input[type="radio"]:disabled {
	cursor: default;
	pointer-events: none;
}

/* ----- ul selection - icon ------------------------------------------------------------ */

ul.selection li .style .icon {
	align-items: center;
	background-color: var(--white);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	border: 1px solid var(--purple-40);
	display: flex;
	float: left;
	height: 24px;
	justify-content: center;
	position: relative;
	width: 24px;
}

ul.selection li input[type="radio"] + .style .icon {
	border-radius: 50%;
}

ul.selection li input[type="checkbox"] + .style .icon {
	border-radius: 4px;
}

ul.selection li input:hover + .style .icon {
	border-color: var(--purple-40);
}

ul.selection li input:checked + .style .icon {
	border-color: var(--primary-purple);
}

ul.selection li input[type="checkbox"]:checked + .style .icon {
	border-color: var(--purple-40);
}

ul.selection li input:hover + .style .icon,
ul.selection li input:checked + .style .icon {
	border-width: 2px;
}

ul.selection li input[type="checkbox"]:checked + .style .icon {
	background-image: url(../img/tick_purple_gradient.svg);
	background-size: 14px auto;
}

ul.selection li input[type="radio"]:checked + .style .icon:before {
	background-color: var(--primary-purple-neon);
	border-radius: 50%;
	content: '';
	height: 10px;
	width: 10px;
}

/* ----- ul selection - text ------------------------------------------------------------ */

ul.selection li .style .text {
	color: var(--white);
	float: left;
	font-size: 16px;
	font-weight: bold;
	line-height: 24px;
	padding-left: 16px;
	width: calc(100% - 24px);
}

ul.selection li input:checked + .style .text {
	color: var(--primary-purple);
}

ul.selection li .style .text p {
	font-size: 14px;
	font-weight: normal;
	line-height: 20px;
	margin-top: 0;
}


/* ######################################################################## */
/* #### Quote - CODE: lmnbd ############################################### */
/* ######################################################################## */


/* ----- quote ------------------------------------- */

.container100.quote {
	overflow: hidden;
}

/* ----- wave_bg ------------------------------------- */

.wave_bg {
	background-image: url(../img/wave_emotional_320_bg.svg);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	display: none;
	height: 100vh;
	position: fixed;
		top: 0;
		left: -2px;
	width: calc(100% + 4px);
}

/* ----- .full_popup ------------------------------------- */

.full_popup {
	align-items: end;
	display: flex;
	height: 100%;
	justify-content: center;
	opacity: 0;
	position: fixed;
		top: 0;
		left: 0;
	transition: all .3s ease;
		-webkit-transition: all .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 4;
}

.full_popup.show {
	opacity: 1;
	visibility: visible;
}

.full_popup .bg {
	background-image: radial-gradient(circle at 64% 64%, var(--primary-tints-01-purple-tints-purple-20), var(--primary-tints-01-purple-tints-purple-20) 30%, var(--secondary-blue-light) 100%);
	height: 100%;
	opacity: 0.8;
	position: absolute;
	width: 100%;
}

.full_popup .box {
	background-color: #fff;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
	display: flex;
	max-width: 728px;
	padding: 32px 24px;
	position: relative;
	transition: all .3s ease;
		-webkit-transition: all .3s ease;
	width: 100%;
}

.full_popup .box .text {
	width: 100%;
}

.full_popup .box .text .title {
	color: var(--primary-purple);
	float: left;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.45;
	width: 100%;
}

.full_popup .box .text p {
	color: var(--primary-purple-dark);
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	margin: 20px 0 0 0;
	width: 100%;
}

.full_popup .box button.close {
	align-items: center;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	color: var(--primary-purple);
	cursor: pointer;
	display: flex;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: 500;
	gap: 10px;
	justify-content: center;
	line-height: 1.5;
	position: absolute;
		bottom: calc(100% + 12px);
		right: 0;
	text-align: center;
	touch-action: manipulation;
	width: 100%;
}

.full_popup .box button.close span.c_icon {
	background-image: url(../img/icon_cross_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: flex;
	height: 16px;
	width: 16px;
}

@media (min-width: 768px) {

	.full_popup {
		align-items: center;
	}

	.full_popup .box {
		border-bottom-left-radius: 8px;
		border-bottom-right-radius: 8px;
		padding: 48px 140px 48px 48px;
	}

	.full_popup .box .text .title {
		font-size: 32px;
		font-weight: 600;
		line-height: 1.3;
	}

	.full_popup .box button.close {
		top: 16px;
		bottom: auto;
		right: 16px;
		width: auto;
	}

}

/* ----- summary_container / summary_card ---------------------------------------------------------------- */

.summary_container {
	float: left;
	/*margin-top: 32px;*/
	width: 100%;
}

.summary_container .summary_card {
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
	color: var(--charcoal-80);
	float: left;
	/*margin-top: 16px;*/
	max-width: 416px;
	padding: 16px;
	width: 100%;
}

.summary_container .summary_card .icon {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 24px;
	width: 24px;
}

.summary_container .summary_card.home_icon .icon {
	background-image: url(../img/icon_home_primary_purple.svg);
}

.summary_container .summary_card.vehicle_icon .icon,
.vehicle[data-type="car"] .summary_container .summary_card.vehicle_icon .icon {
	background-image: url(../img/icon_car_primary_purple.svg);
}

.vehicle[data-type="van"] .summary_container .summary_card.vehicle_icon .icon {
	background-image: url(../img/icon_van_primary_purple.svg);
}

.vehicle[data-type="bike"] .summary_container .summary_card.vehicle_icon .icon {
	background-image: url(../img/icon_motorbike_primary_purple.svg);
}

.summary_container .summary_card .info {
	border-radius: 12px;
	float: left;
	font-size: 14px;
	font-weight: normal;
	color: var(--primary-purple-dark);
	line-height: 22px;
	padding-left: 16px;
	width: calc(100% - 24px);
}

.summary_container .summary_card button.change {	
	margin-top: 16px;
}

/* ----- slide ---------------------------------------------------------------- */

.slide {
	float: left;
	position: relative;
	width: 100%;
}

body.slide_cover .slide,
body.slide_personal_details .slide {
	padding-top: 56px;
}

@media (min-width: 620px) {

	body.slide_cover .slide,
	body.slide_personal_details .slide {
		padding-top: 88px;
	}

}

@keyframes slide_fade {
	from {
		opacity: 0;
		top: 40px;
	}
	to {
		opacity: 1;
		top: 0;
	}
}

.slide.current {
	animation: slide_fade 0.8s normal forwards ease;
}

.slide .title {
	color: var(--primary-purple);
	float: left;
	font-size: 32px;
	font-weight: bold;
	line-height: 1.25;
	width: 100%;
}

.slide .subtitle {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 18px;
	font-weight: normal;
	line-height: 1.56;
	margin-top: 16px;
	width: 100%;
}

/* ----- slide - button.btn.next_slide --------------------------------------------------------------- */

.slide button.btn.next_slide {
	clear: both;
	color: var(--white);
	display: none;
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
	margin-top: 24px;
	position: relative;
}

.slide:not(#marketing) .emotional_form button.btn.next_slide {
	margin-top: 56px;
	padding: 0 30px 0 0;
}

body.no_next .slide button.btn.next_slide {
	display: block;
}

.slide button.btn.next_slide span.underline {
	border-bottom: 2px solid var(--white);
}

.slide button.btn.next_slide:hover span.underline {
	border-bottom-style: dashed;
}

.slide button.btn.next_slide svg {
	height: 100%;
	position: absolute;
		top: 0;
		left: calc(100% - 24px);
}

.slide button.btn.next_slide svg path#arrow {
	transition: 0.2s;
}

.slide button.btn.next_slide:hover svg path#arrow {
	transform: translateX(40%);
}

/* ----- slide - form_section --------------------------------------------------------------- */

.slide .form_section {
	float: left;
	margin-top: 0px;
	width: 100%;
}

.slide .title + .form_section,
.slide .form_section + .form_section {
	margin-top: 56px;
}

.slide .form_section .header,
.slide .form_section .subheader {
	color: var(--white);
	float: left;
	max-width: 524px;
	width: 100%;
}

.slide .form_section .header {
	font-size: 32px;
	font-weight: bold;
	line-height: 40px;
}

.slide .form_section .subheader {
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	margin-top: 8px;
}

.slide .form_section .text_block {
	color: var(--white);
	display: flex;
	flex-direction: column;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	gap: 12px;
	line-height: 24px;
	margin-top: 12px;
	width: 100%;
}

.slide .form_section .questions {
	clear: both;
	float: left;
	width: 100%;
}

.slide .form_section .questions .question {
	float: left;
	margin-top: 32px;
	width: 100%;
}

.slide .form_section .questions .question + .question,
.slide .form_section .questions .question.postcode {
	margin-top: 56px;
}

.slide .form_section .header.skip + .questions .question:first-of-type {
	margin-top: 0; /* Remove margin on first question when there is no header */
}

/* ----- .question_group.address_lookup -------------------------------------------------------------- */

.question_group.address_lookup .question {
	display: none;
}

.question_group.address_lookup[data-view="initial"] .question.postcode,
.question_group.address_lookup[data-view="searching"] .question.postcode,
.question_group.address_lookup[data-view="not_found"] .question.postcode {
	display: block;
}

.question_group.address_lookup[data-view="not_found"] .question.house,
.question_group.address_lookup[data-view="not_found"] .question.house_no {
	display: block;
}

.question_group.address_lookup[data-view="not_found"] .question.address_1 {
	display: block;
}

.question_group.address_lookup[data-view="not_found"] .question.address_2 {
	display: block;
}

.question_group.address_lookup[data-view="not_found"] .question.address_3 {
	display: block;
}

.question_group.address_lookup[data-view="not_found"] .question.address_4 {
	display: block;
}

.question_group.address_lookup[data-view="found"] .question.picker {
	display: block;
}

.question_group.address_lookup[data-view="summary"] .question.summary {
	display: block;
}

.question_group.address_lookup button.find-address {
	display: none;
	margin-top: 16px;
}

.question_group.address_lookup[data-view="initial"] button.find-address {
	display: block;
	font-family: var(--font-family-oak);
}

.question_group.address_lookup button.back-to-postcode-search {
	display: none;
	margin-top: 16px;
}

.question_group.address_lookup[data-view="not_found"] button.back-to-postcode-search {
	display: block;
}

.question_group.address_lookup button.manual-entry {
	margin-top: 16px;
	text-align: left;
}

.question_group.address_lookup .or_manual {
	align-items: center;
	clear: both;
	display: none;
	float: left;
	gap: 8px;
	margin-top: 10px;
}

.question_group.address_lookup[data-view="initial"] .or_manual {
	display: flex;
}

.question_group.address_lookup .or_manual span.or {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	font-family: var(--font-family-oak);
	font-size: 14px;
	line-height: 1.57;
}

.question_group.address_lookup .or_manual button.manual-entry {
	margin-top: 0;
	font-family: var(--font-family-oak);
	text-decoration: none;
}

.question_group.address_lookup .or_manual button.manual-entry:focus,
.question_group.address_lookup .or_manual button.manual-entry:hover {
	text-decoration: underline;
}

/* ----- slide - form_section - information -------------------------------------------------------------- */

.slide .form_section .questions .question .information {
	float: left;
	position: relative;
	width: 100%;
}

.slide .form_section .questions .question .information .label {
	color: var(--white);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: bold;
	line-height: 24px;
	position: relative;
	transition: padding-left 0.3s ease;
	width: 100%;
}

.slide .form_section .questions .question.valid:not(.delay_tick) .information .label,
.slide .form_section .questions .question.has_msg_error .information .label {
	padding-left: 40px;
}

.slide .form_section .questions .question.has_help_text .information .label {
	padding-right: 40px;
}

.slide .form_section .questions .question .information .label .state {
	background-color: var(--ui-palette-01-semantic-scarlet);
	background-image: url(../img/icon_tick_navy.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 12px;
	border-radius: 50%;
	color: var(--purple-140);
	display: none;
	font-size: 18px;
	height: 24px;
	line-height: 24px;
	position: absolute;
		top: 0;
		left: 0;
	text-align: center;
	width: 24px;
}

.slide .form_section .questions .question.valid:not(.delay_tick) .information .label .state,
.slide .form_section .questions .question.has_msg_error .information .label .state {
	display: block;
}

.slide .form_section .questions .question.valid:not(.delay_tick) .information .label .state {
	background-color: var(--ui-palette-01-semantic-mint);
	background-image: url(../img/icon_tick_navy.svg);
}

.slide .form_section .questions .question.has_msg_error .information .label .state {
	background-color: var(--ui-palette-01-semantic-scarlet);
	background-image: url(../img/icon_exclamation_navy.svg);
	background-size: auto 14px;
}

.slide .form_section .questions .question .information .subtext {
	color: var(--white);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 14px;
	font-weight: normal;
	line-height: 20px;
	margin-top: 8px;
	width: 100%;
}

.slide .form_section .questions .question .information button.help_icon {
	background-color: transparent;
	border: 0;
	display: none;
	position: absolute;
		top: 0;
		right: 0;
}

.slide .form_section .questions .question.has_help_text .information button.help_icon {
	display: block;
}

.slide .form_section .questions .question .information button.help_icon .circle {
	background-color: transparent;
	background-image: url(../img/icon_i_white.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: auto 12px;
	border: 2px solid var(--white);
	border-radius: 50%;
	color: var(--white);
	float: left;
	height: 24px;
	line-height: 20px;
	text-align: center;
	width: 24px;
}

.slide .form_section .questions .question .information button.help_icon:hover .circle {
	border-width: 3px;
}

.slide .form_section .questions .question .information button.help_icon:focus .circle {
	box-shadow: 0 0 0 3px #323a72, 0 0 0 5px #fff;
}

.slide .form_section .questions .question.show_help_text .information button.help_icon .circle {
	background-color: var(--white);
	background-image: url(../img/icon_i_primary_purple.svg);
	color: var(--primary-purple);
}

.slide .form_section .questions .question .information button.help_icon .text {
	border-bottom: 2px solid var(--white);
	color: var(--white);
	display: none;
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 18px;
	margin-left: 8px;
	margin-top: 2px;
}

.slide .form_section .questions .question .information .help_text {
	background: 
		linear-gradient(var(--white), var(--white)) padding-box,
		linear-gradient(var(--ms-7-purple), var(--primary-purple-neon)) border-box;
  	border: 3px solid transparent;
	background-color: var(--white);
	border-radius: 4px;
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
	color: var(--ms-7-purple);
	display: none;
	float: left;
	font-weight: normal;
	margin-top: 8px;
	padding: 16px;
	width: 100%;
}

.slide .form_section .questions .question.show_help_text .information .help_text {
	display: block;
}

.slide .form_section .questions .question .information .help_text,
.slide .form_section .questions .question .information .help_text h3 {
	font-family: var(--font-family-oak);
	font-size: 14px;
	line-height: 1.5;
}

.slide .form_section .questions .question .information .help_text p {
	float: left;
	width: 100%;
}

.slide .form_section .questions .question .information .help_text p + p {
	margin-top: 14px;
}

.slide .form_section .questions .question .information .help_text p a {
	color: var(--ms-7-purple);
}

/* ----- slide - form_section - answer -------------------------------------------------------------- */

.slide .form_section .questions .question .answer {
	float: left;
	margin-top: 16px;
	max-width: 416px;
	width: 100%;
}

.slide .form_section .questions .question.has_msg_info .answer .message.info,
.slide .form_section .questions .question.has_msg_warning .answer .message.warning,
.slide .form_section .questions .question.has_msg_standard .answer .message.standard,
.slide .form_section .questions .question.has_msg_error .answer .message.error {
	display: block;
}

.slide .form_section .questions .question.has_msg_info.has_msg_info .answer .message.info, 
.slide .form_section .questions .question.has_msg_error.has_msg_warning .answer .message.warning {
	margin-top: 8px;
}

.slide .form_section .questions .question .answer .field {
	float: left;
	width: 100%;
}

.slide .form_section .questions .question.has_msg_info .answer .field,
.slide .form_section .questions .question.has_msg_warning .answer .field,
.slide .form_section .questions .question.has_msg_error .answer .field {
	margin-top: 8px;
}

.slide .form_section .questions .children {
	border-left: 2px solid var(--white);
	float: left;
	margin-top: 16px;
	padding-bottom: 16px;
	padding-left: 16px;
	width: 100%;
}

.slide .form_section .questions .children .question:nth-of-type(1) {
	margin-top: 16px;
}

.slide .form_section .confirmation {
	clear: both;
	color: var(--white);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	line-height: 24px;
	margin-top: 40px;
	max-width: 524px;
	width: 100%;
}

.slide .white_form .form_section .confirmation {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

.slide .form_section .confirmation a {
	color: var(--white);
	font-family: var(--font-family-ash);
	font-weight: bold;
}

.slide .white_form .form_section .confirmation a {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

/* ----- slide - pound_sign --------------------------------------------------------------- */

.question.pound_sign .answer .field:before {
	content: "\00a3";
    font-size: 20px;
    height: 40px;
    line-height: 40px;
    position: absolute;
    top: 7px;
    left: 15px;
    font-family: var(--font-family-oak);
    color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

.question.pound_sign .answer .field input {
	padding: 0 28px;
}

.question.pound_sign .answer .field {
	position: relative;
}

/* ----- slide - error --------------------------------------------------------------- */

.question.has_msg_error .answer .field input[type="text"],
.question.has_msg_error .answer .field input[type="tel"],
.question.has_msg_error .answer .field input[type="number"],
.question.has_msg_error .answer .field input[type="email"],
.question.has_msg_error .answer .field .select,
.question.has_msg_error .answer .field .date {
	border-color: var(--ui-palette-01-semantic-scarlet);
	border-width: 2px;
}

.question.has_msg_error .answer .field .date input[type="text"],
.question.has_msg_error .answer .field .date input[type="number"] {
	border-width: 0;
}

/* ----- slide - picker --------------------------------------------------------------- */

ul.picker {
	background-color: var(--white);
	border-radius: 4px;
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	float: left;
	font-family: var(--font-family-oak);
	font-size: 14px;
	font-weight: normal;
	line-height: 1.57;
	max-height: 232px;
	overflow: auto;
	width: 100%;
}

.slide .form_section .questions .question .answer ul.picker {
	margin-top: 16px;
}



/* width */
ul.picker::-webkit-scrollbar {
	border-bottom: 8px solid #fff;
	border-top: 8px solid #fff;
	width: 16px;
}

/* Track */
ul.picker::-webkit-scrollbar-track {

}
 
/* Handle */
ul.picker::-webkit-scrollbar-thumb {
	background-color: var(--primary-tints-02-dark-purple-tints-purple-dark-60);
	border: 4px solid #fff;
	border-radius: 4px;
	width: 8px;
}


ul.picker li {
	float: left;
	padding: 8px 16px;
	width: 100%;
}

ul.picker li + li {
	border-top: 1px solid var(--primary-tints-01-purple-tints-purple-20);
	margin-top: 0;
}

ul.picker li:hover {
	background-color: var(--primary-tints-01-purple-tints-purple-5);
	color: var(--primary-purple);
}

/* ----- assets --------------------------------------------------------------------------------------------------- */

.assets {
	display: none;
}

/* ----- slide - emotional_form / white_form / wave end --------------------------------------------------------------- */

.slide .emotional_form,
.slide .white_form {
	float: left;
	position: relative;
	width: 100%;
}

.slide .emotional_form {
	padding: 24px 0 calc(104px + 52px) 0;
}

.slide#cover_summary .emotional_form {
	padding-bottom: 48px;
}

.slide .white_form {
	background-color: var(--white);
	padding: 40px 0;
}

@media (min-width: 620px) {

	.slide .white_form {
		padding-bottom: 48px;
		padding-top: 48px;
	}

}

@media (min-width: 768px) {

	.slide .white_form {
		padding-bottom: 64px;
		padding-top: 64px;
	}

}

@keyframes white_form_fade {
	from {
		opacity: 0;
		top: 180px;
	}
	to {
		opacity: 1;
		top: 0;
	}
}

body.transition .slide .white_form {
	animation: white_form_fade 0.8s normal forwards ease;
	display: block;
}

.slide .emotional_form .container,
.slide .white_form .container {
	margin: 0 auto;
	max-width: 376px;
	width: calc(100% - 48px);
}

.slide .white_form:after {
	background-image: url(../img/wave_emotional_320_end.svg);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: contain;
	content: '';
	display: none;
	height: 71px;
	position: absolute;
		top: -20px;
		left: 50%;
	transform: translateX(-50%);
	width: 320px;
}

/* ----- slide - buttons --------------------------------------------------------------- */

.slide .buttons {
	clear: both;
	float: left;
	margin-top: 24px;
}

/* ----- slide - cover_summary --------------------------------------------------------------- */

.slide#cover_summary .cover_header {
	color: var(--white);
	float: left;
	width: 100%;
}

.slide#cover_summary .cover_header .icon {
	background-image: url(../img/icon_breakdown_truck.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 34px;
	width: 100%;
}

.slide#cover_summary .cover_header .big {
	float: left;
	font-size: 32px;
	font-weight: bold;
	line-height: 36px;
	margin-top: 16px;
	text-align: center;
	width: 100%;
}

.slide#cover_summary .cover_header .cover_type {
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: 600;
	line-height: 24px;
	margin-top: 24px;
	text-align: center;
	width: 100%;
}

.slide#cover_summary .cover_header .include_exclude {
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	margin-top: 16px;
	text-align: center;
	width: 100%;
}

.slide#cover_summary .cover_header .include_exclude ul li {
	clear: both;
	left: 50%;
	margin-top: 4px;
	padding-left: 24px;
	transform: translateX(-50%);
	width: auto;
}

.slide#cover_summary .cover_header .include_exclude ul li .icon {
	background-image: url(../img/icon_cross_white.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 14px;
}

.slide#cover_summary .cover_header .include_exclude ul li.o_home .icon,
.slide#cover_summary .cover_header .include_exclude ul li.o_onward .icon {
	background-image: url(../img/icon_tick_white.svg);
}

.slide#cover_summary .extra_info {
	color: #747474;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	max-width: 540px;
	width: 100%;
}

.slide#cover_summary .extra_info ul.bullet {
	font-size: 16px;
	line-height: 24px;
	margin-top: 16px;
}

.slide#cover_summary .extra_info ul.bullet li {
	padding-left: 20px;
}

.slide#cover_summary .extra_info ul.bullet li:before {
	background-color: var(--primary-purple);
	height: 8px;
	top: 8px;
	width: 8px;
}

.slide#cover_summary .extra_info p {
	float: left;
	width: 100%;
}

.slide#cover_summary .extra_info p + p,
.slide#cover_summary .extra_info ul + p {
	margin-top: 16px;
}

.slide#cover_summary .extra_info b {
	color: var(--charcoal);
	font-weight: 600;
}

/* ---- Universal - container100 ---------------------------------------------------------------- */

.container100 {
	float: left;
	position: relative;
	width: 100%;
}

.container100 .container {
	margin: 0 auto;
	position: relative;
	/*width: calc(100% - 48px);*/
	width: 100%;
}

body#results .container100 .container,
body#broken_down .container100 .container,
body#transfer .container100 .container {
	width: calc(100% - 16px);
}

/* ---- Universal - header ---------------------------------------------------------------- */

.container100.header {
	padding: 24px 0;
	z-index: 1;
}

.container100.header .container {
	display: flex;
	justify-content: space-between;
}

body#details .container100.header {
	display: none;
}

@keyframes results_push {
	from {
		opacity: 0;
		margin-top: 500px;
	}
	to {
		opacity: 1;
		margin-top: 0px;
	}
}

body#broken_down[data-view="results"] .container100.header,
body#results[data-view="results"] .container100.header {
	animation: results_push 0.8s normal forwards ease;
}

.container100.header .left {
	align-items: center;
	display: flex;
	float: left;
	gap: 14px;
}

.container100.header .left .msm_logo {
	height: auto;
	width: auto;
}

.container100.header .left .msm_logo a.link {
	height: auto;
	position: relative;
		top: auto;
		left: auto;
	width: auto;
}

.container100.header .left .msm_logo img {
	float: left;
	height: 40px;
	opacity: 0;
}

.container100.header .left .provided_by {
	font-size: 14px;
	line-height: 18px;
}

.container100.header .left .provided_by span {
	clear: both;
	float: left;
}

.container100.header .left .provided_by span.prov {
	color: rgba(255,255,255,0.8);
}

.container100.header .right {
	align-items: center;
	display: none;
}

.container100.header .right .quotes_found {
	color: var(--white);
	float: left;
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
}

/* ---- Universal - next_slide ---------------------------------------------------------------- */

button.btn.next_slide {
	float: left;
	/*font-family: 'HeadingNow75', sans-serif;*/
	font-family: var(--font-family-oak);
}

/*
button.btn.next_slide span.str_start,
body.slide_begin button.btn.next_slide span.str_next {
	display: none;
}

body.slide_begin button.btn.next_slide span.str_start {
	display: inline;
}
*/
body:not(.slide_begin) button.btn.next_slide span.str_start,
body:not(.slide_vehicle.prevent_eu) button.btn.next_slide span.str_ok,
body.slide_begin button.btn.next_slide span.str_next,
body.slide_vehicle.prevent_eu button.btn.next_slide span.str_next {
/*body:not(:not(.slide_begin, .slide_vehicle.prevent_eu)) button.btn.next_slide span.str_next {*/
	display: none;
}

button.btn.next_slide svg path {
	fill: var(--pink);
}

/* ---- Universal - Progress ---------------------------------------------------------------- */

.container100.progress {
	padding: 16px 0;
}

body.slide_cover .container100.progress,
body.slide_personal_details .container100.progress {
	background-image: radial-gradient(circle at 64% 64%, var(--primary-tints-01-purple-tints-purple-80), var(--primary-tints-01-purple-tints-purple-80) 30%, var(--secondary-blue));
	background-position: top center;
	background-repeat: no-repeat;
	min-height: 56px;
	position: fixed;
		top: 0;
		left: 0;
	z-index: 2;
}

.container100.progress .container,
.container100.footer .container {
	max-width: 376px;
	width: calc(100% - 48px);
}

body#broken_down .container100.progress .container,
body#results .container100.progress .container,
body#transfer .container100.progress .container {
	width: calc(100% - 48px);
}

.container100.progress a.btn.prev_slide,
.container100.progress button.btn.prev_slide {
	background-image: url(../img/icon_arrow_white.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px auto;
	display: block;
	float: left;
	height: 24px;
	width: 24px;
}

body.slide_begin .container100.progress a.btn.prev_slide,
body.slide_begin .container100.progress button.btn.prev_slide {
	display: none;
}

.container100.progress button.btn.next_slide {
	background-color: var(--white);
	box-shadow: 0 0 24px rgba(0, 0, 0, 0.15);
	color: var(--pink);
	font-size: 16px;
	font-weight: bold;
	line-height: 64px;
	padding: 0;
	position: fixed;
		bottom: 0;
		left: 0;
	text-align: center;
	width: 100%;
	z-index: 2;
}

body.no_next .container100.progress button.btn.next_slide {
	display: none;
}

.container100.progress .progress_bar {
	background-color: rgba(224, 216, 231, 0.32);
	border-radius: 22px;
	display: none;
	float: right;
	margin: 4px 0;
	padding: 2px;
	width: calc(100% - 24px - 24px);
}

body.slide_cover .container100.progress .progress_bar,
body.slide_personal_details .container100.progress .progress_bar {
	display: block;
}

.container100.progress .progress_bar .bar {
	background-color: var(--mint-neon);
	border-radius: 22px;
	height: 12px;
	transition: width 0.4s ease;
	width: 0;
}

/* ---- quote ---------------------------------------------------------------- */

.container100.quote {
	min-height: calc(100vh - 56px + 52px);
}

/* ---- Universal - footer ---------------------------------------------------------------- */

.container100.footer {
	background-color: var(--primary-purple-dark);
	color: var(--white);
	padding: 40px 0;
	/*
	z-index: 1;
	*/
}

body#details .container100.footer {
	padding-bottom: calc(48px + 52px);
}

.container100.footer .wav {
	display: none;
	height: 92px;
	position: absolute;
		top: -52px;
		left: 0;
	width: 100%;
}

.container100.footer .wav svg {
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
}

.container100.footer .msm_logo {
	background-image: url(../img/logo_white_footer.svg?v=8);
	background-position: top left;
	background-size: auto 28px;
	border-bottom: 1px solid #8f8499;
}

.container100.footer .links {
	float: left;
	width: 100%;
}

.container100.footer .links ul {
	color: var(--white);
	display: flex;
	flex-direction: column;
	font-family: var(--font-family-ash);
	font-size: 14px;
	font-weight: bold;
	gap: 30px;
	line-height: 14px;
	margin-top: 30px;
}

.container100.footer .links ul li a {
	color: var(--white);
}

.container100.footer .links ul li a:hover,
.container100.footer .links ul li a:focus {
	text-decoration-thickness: 3px;
}

.container100.footer .links ul li a:focus {
	background-color: #42EBD7;
	color: var(--primary-purple);
}




.container100.footer .important_text {
	color: #faf9fb;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 11px;
	line-height: 20px;
	margin-top: 28px;
	width: 100%;
}

.container100.footer .important_text p {
	float: left;
	width: 100%;
}

.container100.footer .important_text p + p {
	margin-top: 18px;
}

.container100.footer .important_text p.subtitle {
	font-size: 14px;
	font-weight: bold;
}

.container100.footer .important_text p a {
	font-size: 12px;
	font-weight: bold;
}

.container100.footer .download {
	color: #faf9fb;
	display: none;
	float: left;
	font-family: var(--font-family-oak);
	font-size: 13px;
	line-height: 20px;
	margin-top: 24px;
	width: 100%;
}

.container100.footer .download p {
	float: left;
	line-height: 40px;
	width: 100%;
}

.container100.footer .download p a {
	font-weight: bold;
}

.container100.footer .download ul {
	margin-top: 12px;
}

.container100.footer .download ul li {
	margin-top: 6px;
	width: auto;
}

.container100.footer .download ul li:nth-of-type(1) {
	margin-right: 16px;
}

.container100.footer .download ul li img {
	height: 40px;
}

.container100.footer .social {
	float: left;
	margin-top: 22px;
	width: 100%;
}

.container100.footer .social ul {

}

.container100.footer .social ul li {
	margin-right: 16px;
	margin-top: 16px;
	width: auto;
}


/* ################################################################## */
/* #### Results - CODE: uuant ####################################### */
/* ################################################################## */


/* ----- results_bg ------------------------------------- */

@keyframes results_bg_scroll_search {
	from {
		background-position: center 0px;
	}
	to {
		background-position: center 20%;
	}
}

@keyframes results_bg_scroll_found {
	from {
		background-position: center 20%;
	}
	to {
		background-position: center calc(20% - 500px);
	}
}

.results_bg {
	
	background-image: radial-gradient(circle at 64% 64%, var(--primary-tints-01-purple-tints-purple-80), var(--primary-tints-01-purple-tints-purple-80) 30%, var(--secondary-blue));
	

	height: 100vh;
	position: fixed;
		top: 0;
		left: 0;
	width: calc(100% + 0px);
}

body[data-view="overlay"] .results_bg {
	/*animation: results_bg_scroll_search 12s forwards linear;*/
}

body[data-view="results"] .results_bg {
	/*animation: results_bg_scroll_found 0.8s forwards ease;*/
}

/* ---- Results - results_info ---------------------------------------------------------------- */

.container100.results_info {
	padding-top: 16px;
	padding-bottom: 24px;
}

.container100.results_info .summary {
	color: var(--white);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 32px;
	font-weight: bold;
	line-height: 1.13;
	/*max-width: 740px;*/
	width: 100%;
}

.container100.results_info .summary a.btn.white_text_underline.cover_needs {
	display: none;
	float: none;
	margin-left: 4px;
}

.container100.results_info .buttons {
	display: flex;
	flex-wrap: wrap;
	float: left;
	gap: 16px 24px;
	margin-top: 24px;
	width: 100%;
}

.container100.results_info .buttons button.btn.filter {
	background-color: var(--white);
	border-radius: 4px;
	box-shadow: 0 4px 20px 0 rgba(61, 64, 61, 0.1);
	clear: both;
	color: var(--primary-purple);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 15px;
	font-weight: normal;
	height: 48px;
	line-height: 16px;
	padding: 12px 24px;
}

.container100.results_info .buttons button.btn.filter .icon {
	background-image: url(../img/filter_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 16px;
	margin-right: 10px;
	width: 16px;
}

.container100.results_info .buttons .cover_needs_btn {
	align-items: center;
	display: flex;
	float: left;
}

/* ---- Results page - results_headers ---------------------------------------------------------------- */

.container100.results_headers {
	background-color: var(--primary-purple-dark);
	display: none;
	z-index: 1;
}

.container100.results_headers.sticky {
	position: fixed;
		top: 0;
}

body[data-view="overlay"] .container100.results_headers.sticky {
	opacity: 0;
	visibility: hidden;
}

.container100.results_headers .headers {
	display: grid;
	font-family: var(--font-family-ash);
	gap: 12px;
	padding: 16px;
	width: 100%;
}

.container100.results_headers .headers .header {
	color: var(--white);
	font-size: 13px;
	font-stretch: normal;
	font-style: normal;
	font-weight: normal;
	height: 54px;
	letter-spacing: 0.2px;
	line-height: 1.5;
	margin: 4px 0;
	/*padding: 0 14px;*/
}

.container100.results_headers .headers .header,
.container100.results_table .results .result {
	text-align: center;
}

.container100.results_table .boxes {
	display: grid;
	gap: 12px;
	padding: 16px;
}

.container100.results_headers .headers .header,
.container100.results_table .results .result .card.desktop .box {
	align-items: center;
	display: flex;
	flex-direction: column;
	float: left;
	justify-content: center;
	width: auto;
}

.container100.results_table .results .result .card.desktop .box.more .defaqto_rating {
	height: 28px;
	margin-top: 10px;
	width: 100%;
}

.container100.results_table .results .result .card.desktop .box .center {
	align-items: center;
	display: flex;
	flex-direction: column;
}

/* ---- Results page - results ---------------------------------------------------------------- */

.container100.results_table {
	background-color: var(--purple-5);
	margin-top: 100px;
	padding-bottom: calc(48px + 52px);
}

@keyframes results_fade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

body[data-view="results"] .container100.results_info,
body[data-view="results"] .container100.results_headers,
body[data-view="results"] .container100.results_table {
	animation: results_fade 0.8s normal forwards ease;
}

.container100.results_headers.sticky,
body[data-view="results"] .container100.results_headers.sticky {
	animation: none;
}

.container100.results_table .wav {
	display: none;
	height: 122px;
	position: absolute;
		top: -52px;
		left: 0;
	width: 100%;
}

.container100.results_table .wav svg {
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
}

.container100.results_table .wav svg.w768 {
	opacity: 0;
	visibility: hidden;
}

.container100.results_table .results {
	float: left;
	margin-top: -100px;
	padding-left: 0;
	position: relative;
	width: 100%;
	z-index: 1;
}

.container100.results_table .results .result {
	float: left;
	width: 100%;
}

.container100.results_table .results .result + .result {
	margin-top: 16px;
}

.container100.results_table .results .result .card {
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 4px 20px 0 rgba(61, 64, 61, 0.1);
	color: var(--charcoal);
	float: left;
	padding: 24px;
	width: 100%;
}

.container100.results_headers .headers .separator {
	background-color: var(--purple-80);
}

.container100.results_table .result .separator {
	background-color: var(--purple-20);
}

/* ---- Results - result.sponsored ---------------------------------------------------------------- */

.container100.results_table .results .result.sponsored .card.desktop,
.container100.results_table .results .result.sponsored .card.mobile {
	border: 2px solid var(--mint);
	position: relative;
}

.container100.results_table .results .result.sponsored .card.mobile {
	padding-top: 50px;
}

.container100.results_table .results .result.sponsored .card.desktop {
	padding-top: 28px;
}

.container100.results_table .results .result.sponsored[data-has-info-bar="true"] .card.desktop {
	padding-top: 42px;
}

.container100.results_table .results .result.sponsored .card.mobile .boxes {
	display: grid;
	gap: 16px 12px;
	grid-template-areas:
		'mc_prov mc_price'
		'mc_info mc_info'
		'mc_booleans mc_booleans'
		'mc_defaqto mc_more';
	grid-template-columns: 5fr 8fr;
}

@media (min-width: 992px) {

	.container100.results_table .results .result.sponsored .card.mobile {
		display: none;
	}

}

.container100.results_table .results .result.sponsored .card .banner {
	display: grid;
	grid-template-columns: 160px 10px;
	position: absolute;
		top: -1px;
		left: 0;
	width: 100%;
}

.container100.results_table .results .result.sponsored .card .text_sponsored {
	align-items: center;
	background-color: var(--mint);
	border-radius: 8px 0 0 0;
	/*clip-path: polygon(0 0, 100% 0%, 85% 100%, 0% 100%);*/
	display: flex;
}

.container100.results_table .results .result.sponsored .card .text_sponsored p {
	color: var(--white);
	padding: 10px;
	text-align: left;
}

.container100.results_table .results .result.sponsored .card .text_sponsored .circle {
	background-image: url(../img/icon_i_white.svg);
	background-color: var(--mint);
	background-position: center;
	background-repeat: no-repeat;
	background-size: auto 12px;
	border: 2px solid var(--white);
	border-radius: 50%;
	color: var(--white);
	cursor: pointer;
	float: left;
	height: 24px;
	line-height: 24px;
	position: relative;
	text-align: center;
	width: 24px;
}

.container100.results_table .results .result.sponsored .card .text_sponsored .circle .bubble {
	background-color: #fff;
	border-radius: 4px;
	color: #111;
	font-family: "Helvetica Neue", "HelveticaNeue", Helvetica, 'Arimo', Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.4;
	padding: 8px;
	position: absolute;
		bottom: 26px;
		left: calc(50% - 100px);
	width: 200px;
	z-index: 1;
}

.container100.results_table .results .result.sponsored .card .text_sponsored .circle .bubble:before {
	border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: #ffffff transparent transparent transparent;
	content: "";
	height: 0;
	position: absolute;
		bottom: -8px;
		left: calc(50% - 10px);
	width: 0;
}

.container100.results_table .results .result.sponsored .card .corner {
	align-items: center;
	background-color: var(--mint);
	clip-path: polygon(0 0, 100% 0%, 0% 100%, 0% 100%);
	display: flex;
}

/* ---- Results - results_start ---------------------------------------------------------------- */

fieldset.results_start {
	border: 10px solid transparent;
	border-top-color: var(--01-primary-tints-01-purple-tints-purple-120);
	box-sizing: border-box;
	float: left;
	grid-area: 1 / 1;
	margin-top: 50px;
	padding: 20px;
	text-align: center;
	width: 100%;
}

fieldset.results_start legend {
	color: var(--01-primary-tints-01-purple-tints-purple-120);
	padding: 0 20px;
}

/* ---- Results - results - card - mobile + desktop --------------------------------------------------------------- */

.container100.results_table .results .result .card.mobile .booleans .boolean .circle,
.container100.results_table .results .result .card.desktop .box .boolean .circle {
	background-color: var(--primary-tints-02-dark-purple-tints-purple-dark-40);
	background-image: url(../img/icon_cross_white.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 43% auto;
	border-radius: 50%;
	float: left;
	height: 32px;
	position: relative;
	width: 32px;
}

.container100.results_table .results .result .card.mobile .booleans .boolean.included .circle,
.container100.results_table .results .result .card.desktop .box .boolean.included .circle {
	background-color: var(--ui-palette-01-semantic-mint);
	background-image: url(../img/icon_tick_white.svg);
	background-size: 52% auto;
}

/* ---- .info_bar --------------------------------------------------------------- */

.info_bar {
	background-color: #e9f5fe;
	border-radius: 4px;
	color: #011055;
	display: none;
	font-family: var(--font-family-oak);
	font-size: 13px;
	font-weight: normal;
	gap: 10px;
	grid-template-columns: 1fr 64px;
	padding: 8px;
	position: relative;
	text-align: left;
	width: 100%;
}

.black_friday {
    background-color: #000;
    color: #fff;
    width: fit-content;
    padding: 2px 10px;
    font-size: 12px;
    margin-left: 20px;
}

.result[data-has-info-bar="true"] .info_bar {
	display: grid;
}

.card.mobile .info_bar {
	grid-area: mc_info_bar;
}

.card.mobile .info_bar[data-type="offer"] {
	grid-area: mc_offer_bar;
}

.info_bar__icon {
	background-image: url(../img/icon_triangle_offer_navy.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 40px;
	position: absolute;
		top: 0;
		left: 0;
	width: 40px;
}

.info_bar[data-type="info"] .info_bar__icon {
	background-image: url(../img/icon_triangle_info_navy.svg);
}

/* ---- .info_bar__text --------------------------------------------------------------- */

.info_bar__text {
	font-size: 14px;
	line-height: 1.4;
	padding-left: 40px;
}

.info_bar[data-has-roundel="false"] .info_bar__text {
	grid-column: span 2;
}

/* ---- .info_bar__heading --------------------------------------------------------------- */

.info_bar__heading {
	font-weight: bold;
}

/* ---- .info_bar__paragraph --------------------------------------------------------------- */

.info_bar__paragraph a {
	color: blue;
}

/* ---- .info_bar__roundel --------------------------------------------------------------- */

.info_bar__roundel {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 64px;
	position: absolute;
		top: calc(50% - 32px);
		right: 8px;
	width: 64px;
}

/* ---- Results - results - card mobile --------------------------------------------------------------- */

.container100.results_table .results .result .card.mobile {
	align-items: center;
	display: grid;
	gap: 16px 12px;
	grid-template-areas:
		'mc_offer_bar mc_offer_bar'
		'mc_prov mc_price'
		'mc_info mc_info'
		'mc_booleans mc_booleans'
		'mc_defaqto mc_more'
		'mc_info_bar mc_info_bar';
	grid-template-columns: 5fr 8fr;
	justify-items: center;
	padding: 16px;
}

.container100.results_table .results .result .card.mobile .product_info {
	grid-area: mc_prov;
	justify-self: start;
	text-align: left;
}

.container100.results_table .results .result .card.mobile .product_info .title {
	color: var(--charcoal);
	display: none;
	float: left;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.5;
}

.container100.results_table .results .result .card.mobile .product_info .provider_logo {
	clear: both;
	/*margin-top: 14px;*/
	width: 94px;
}

.container100.results_table .results .result .card.mobile .prices {
	align-items: start;
	display: flex;
	gap: 20px;
	grid-area: mc_price;
	justify-self: end;
	text-align: right;
}

.container100.results_table .results .result .card.mobile .price_info {
	align-items: center;
	display: flex;
	justify-self: end;
	text-align: right;
}

.container100.results_table .results .result .card.mobile .product_info .provider_logo {
	height: 52px;
}

.container100.results_table .results .result .card.mobile .price_info .pricing_title {
	color: var(--charcoal-80);
	font-family: var(--font-family-oak);
	font-size: 13px;
	padding-bottom: 4px;
}

.container100.results_table .results .result .card.mobile .price_info .pricing {
	color: var(--charcoal);
	float: left;
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
}

.container100.results_table .results .result .card.mobile .price_info .pricing span.small {
	font-size: 16px;
}

.container100.results_table .results .result .card.mobile .price_info .frequency {
	clear: both;
	color: var(--charcoal-80);
	float: right;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.57;
	margin-top: 6px;
}

.container100.results_table .results .result .card.mobile .info_boxes {
	clear: both;
	display: grid;
	gap: 4px;
	grid-area: mc_info;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	width: 100%;
}

.container100.results_table .results .result .card.mobile .info_boxes .box {
	background-color: #faf9fb;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	justify-content: center;
	padding: 11px 12px;
}

.container100.results_table .results .result .card.mobile .info_boxes .box .title {
	color: var(--charcoal-80);
	font-family: var(--font-family-oak);
	font-size: 14px;
	line-height: 1.3;
	width: 100%;
}

.container100.results_table .results .result .card.mobile .info_boxes .box .value {
	color: var(--charcoal);
	font-size: 16px;
	font-weight: bold;
	line-height: 1.25;
	width: 100%;
}
  
.container100.results_table .results .result .card.mobile .booleans {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 16px;
	grid-area: mc_booleans;
	width: 100%;
}

.container100.results_table .results .result .card.mobile .booleans .boolean {
	align-items: center;
	display: flex;
	gap: 8px;
}

.container100.results_table .results .result .card.mobile .booleans .boolean .circle {
	background-size: 8px auto;
	height: 16px;
	width: 16px;
}

.container100.results_table .results .result .card.mobile .booleans .boolean .text {
	color: var(--charcoal-80);
	font-size: 13px;
	font-weight: normal;
	line-height: 1.2;
	text-align: left;
}

.container100.results_table .results .result .card.mobile .defaqto_rating {
	align-items: center;
	background-position: center left;
	display: flex;
	height: 40px;
	grid-area: mc_defaqto;
	width: 100%;
}

.container100.results_table .results .result .card.mobile .more_btn_box {
	display: flex;
	grid-area: mc_more;
	justify-self: end;
}

.container100.results_table .results .result .card.mobile .more_btn_box .btn.purple_rounded {
	padding-left: 24px;
	padding-right: 24px;
}

@media (min-width: 576px) {

	/* ---- font size / line height --------------------------------------------------------------- */

	.container100.results_table .results .result .card.mobile .price_info .pricing {
		font-size: 32px;
		line-height: 1.25;
	}

	.container100.results_table .results .result .card.mobile .price_info .frequency {
		font-size: 16px;
		line-height: 1.5;
	}

	/* ---- Results - results - card mobile --------------------------------------------------------------- */

	.container100.results_table .results .result .card.mobile {
		padding: 24px;
	}

	body#broken_down .container100.results_table .results .result .card.mobile .info_boxes {
		width: 100%;
	}

	.container100.results_table .results .result .card.mobile .info_boxes .box {
		padding-bottom: 15px;
		padding-top: 15px;
	}

}

@media (min-width: 768px) {

	.container100.results_table .results .result .card.mobile {
		gap: 16px 12px;
		grid-template-areas:
			'mc_offer_bar mc_offer_bar mc_offer_bar mc_offer_bar'
			'mc_prov mc_price mc_price mc_price'
			'mc_info mc_info mc_defaqto mc_more'
			'mc_booleans mc_booleans mc_booleans mc_booleans'
			'mc_info_bar mc_info_bar mc_info_bar mc_info_bar';
		grid-template-columns: 1fr 1fr 148px 164px;
	}

	.container100.results_table .results .result .card.mobile .product_info {
		justify-self: start;
	}

	.container100.results_table .results .result .card.mobile .price_info {
		justify-self: end;
	}

	.container100.results_table .results .result .card.mobile .price_info .frequency {
		padding-left: 8px;
		padding-top: 14px;
	}

	body#broken_down .container100.results_table .results .result .card.mobile .info_boxes {
		width: 100%;
	}

	.container100.results_table .results .result .card.mobile .defaqto_rating {
		background-position: center;
	}

}

@media (min-width: 992px) {

	.container100.results_table .results .result .card.mobile {
		display: none;
	}

}

/* ---- Results - results - card desktop --------------------------------------------------------------- */

.container100.results_table .results .result .card.desktop {
	display: none;
	flex-direction: column;
	justify-content: center;
	min-height: 140px;
	padding: 6px;
}

.container100.results_table .results .result .card.desktop .box {
	float: left;
	min-height: 60px;
	/*padding-left: 10px;
	padding-right: 10px;*/
}

.container100.results_table .results .result .card.desktop .box.provider .provider_logo {
	height: 52px;
	width: 94px;
}

.container100.results_table .results .result .card.desktop .box.provider .product_name {
	float: left;
	font-family: var(--font-family-oak);
	font-size: 12px;
	line-height: 1.3;
	margin-top: 10px;
	width: 100%;
}

.container100.results_table .results .result .card.desktop .box.price {
	font-size: 32px;
	font-weight: bold;
	line-height: 1.25;
	color: var(--primary-purple-dark);
}

.container100.results_table .results .result .card.desktop .box.price span.small {
	font-size: 22px;
}

.container100.results_table .results .result .card.desktop .box.price .diff {
	font-family: var(--font-family-oak);
	font-size: 12px;
	font-weight: normal;
}

.container100.results_table .results .result .card.desktop .box.defaqto .defaqto_rating {
	height: auto;
	min-height: 48px;
	width: 61px;
}

.container100.results_table .results .result .card.desktop .box .boolean {
	float: left;
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	font-family: var(--font-family-oak);
}

.container100.results_table .results .result .card.desktop .box .boolean .circle {
	height: 32px;
	left: calc(50% - 16px);
	width: 32px;
}

.container100.results_table .results .result .card.desktop .box .boolean.included .circle {

}

.container100.results_table .results .result .card.desktop .box .boolean .text {
	clear: both;
	float: left;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.57;
	margin-top: 6px;
	width: 100%;
}

/* ---- Results - filters_bar ---------------------------------------------------------------- */

.filters_bar {
	background-color: var(--white);
	color: var(--charcoal);
	height: 100vh;
	max-width: 428px;
	opacity: 0;
	overflow: auto;
	overscroll-behavior: contain;
	position: fixed;
		top: 0;
		left: 0;
	transition: opacity .3s ease, left .5s ease, visibility .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 4;
}

.filters_bar.show {
	opacity: 1;
	visibility: visible;
}

.filters_bar .scroll {
	float: left;
	max-height: 100%;
	overflow: auto;
	overscroll-behavior: contain;
	position: relative;
	width: 100%;
}

body[data-view="overlay"] .filters_bar .scroll {
	padding-bottom: 80px;
}

.filters_bar .question .information {
	display: none;
}

.filters_bar .block {
	float: left;
	padding: 20px 16px;
	width: 100%;
}

.filters_bar .block.filter,
.filters_bar .block.bottom {
	border-top: 1px solid var(--purple-10);
}

.filters_bar .block .title {
	display: grid;
	font-weight: normal;
	gap: 16px;
	grid-template-columns: 1fr 72px 14px;
	line-height: 1.2;
	position: relative;
	width: 100%;
}

.filters_bar .block.expand .title {
	grid-template-columns: 1fr 14px;
}

.filters_bar .block .title span.label {
	font-size: 14px;
	letter-spacing: 2.25px;
	text-transform: uppercase;
	font-family: var(--font-family-oak);
	color: var(--ms-7-purple);
}

.filters_bar .block .title .summary {
	color: var(--charcoal-80);
	float: right;
	font-family: var(--font-family-oak);
	font-size: 14px;
	text-align: right;
}

.filters_bar .block.expand .title .summary {
	display: none;
}

.filters_bar .block .title .chevron {
	background-image: url(../img/chevron_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 14px;
	transform: rotate(180deg);
	width: 14px;
}

.filters_bar .block.expand .title .chevron {
	transform: rotate(0deg);
}

.filters_bar .block .hide_show {
	display: none;
	float: left;
	padding-top: 16px;
	width: 100%;
}

.filters_bar .block.expand .hide_show,
.filters_bar .block.always_open .hide_show {
	display: block;
}

.filters_bar ul.selection li .style .text p {
	display: none;
}

.filters_bar .block.top .buttons {
	float: left;
	width: 100%;
}

.filters_bar .block.top .buttons button.btn.close {
	height: 20px;
	width: 20px;
}

.filters_bar .block.top .heading {
	color: var(--charcoal);
	float: left;
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
	margin-top: 24px;
	width: 100%;
}

.filters_bar .block.bottom .btn.pink_text_underline {
	text-align: left;
}

.filters_bar .block.bottom .btn.post_a_copy {
	background-image: url(../img/icon_document_purple.svg);
	background-position: 0 center;
	background-repeat: no-repeat;
	background-size: 16px;
	clear: both;
	margin-top: 16px;
	padding-left: 24px;
}

.filters_bar .block.bottom .btn.back_to_questions {
	background-image: url(../img/icon_arrow_purple.svg);
	background-position: 0 center;
	background-repeat: no-repeat;
	background-size: 16px;
	clear: both;
	margin-top: 16px;
	padding-left: 24px;
}

.filters_bar .mobile_update {
	align-items: center;
	background-color: #fff;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
	display: none;
	justify-content: center;
	padding: 16px;
	position: absolute;
		bottom: 0;
		left: 0;
	width: 100%;
	z-index: 1;
}

body[data-view="overlay"] .filters_bar .mobile_update {
	display: flex;
}

.filters_bar .mobile_update:before {

	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

	content: '';
	height: 16px;
	position: absolute;
		bottom: 100%;
		left: 0;
	width: 100%;
}

/* ---- Results - adjusting_form ---------------------------------------------------------------- */

.adjusting_form {
	display: none;
	position: absolute;
		top: 304px;
		left: calc(50% - 250px);
	width: 500px;
	z-index: 2;
}

body[data-view="overlay"][data-overlay="adjusting"] .adjusting_form {
	display: block;
}

@keyframes results_blur {
	from {
		filter: blur(0px);
		opacity: 1;
	}
	to {
		filter: blur(50px);
		opacity: 0.04;
	}
}

body#results[data-view="overlay"][data-overlay="adjusting"] .container100.header,
body#results[data-view="overlay"][data-overlay="adjusting"] .container100.results_info,
body#results[data-view="overlay"][data-overlay="adjusting"] .container100.results_headers,
body#results[data-view="overlay"][data-overlay="adjusting"] .container100.results_table {
	animation: results_blur 1.2s normal forwards ease;
}

.adjusting_form .header {
	float: left;
	font-size: 40px;
	font-weight: bold;
	line-height: 1.2;
	width: 100%;
}

.adjusting_form .subheader {
	float: left;
	font-family: var(--font-family-oak);
	font-size: 20px;
	line-height: 1.4;
	margin-top: 16px;
	width: 100%;
}

.adjusting_form .message {
	display: block;
	margin-top: 32px;
}

/* ---- Results - results_overlay ---------------------------------------------------------------- */

.container100.results_overlay {
	display: none;
	min-height: calc(100vh + 52px);
	padding: 64px 0 calc(64px + 52px) 0;
}

.container100.results_overlay .container {
	align-items: center;
	display: flex;
	flex-direction: column;
}

/* ---- .searching_box ---------------------------------------------------------------- */

.searching_box {
	align-items: center;
	display: none;
	gap: 16px;
	flex-direction: column;
	width: 100%;
}

.container100.results_overlay .searching_box {
	margin-top: 40px;
}

body[data-view="overlay"][data-overlay="initial"] .searching_box {
	display: flex;
}

.searching_box .icon {
	background-image: url(../img/pulsing_logo.gif);
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 64px;
	width: 64px;
}

.searching_box .text {
	color: var(--white);
	font-size: 16px;
	font-weight: bold;
	line-height: 24px;
}

.searching_box .text span.complete_wording {
	display: none;
}

body[data-overlay="no-results"] .searching_box .text span.complete_wording {
	display: inline;
}

.searching_box .progress_bar {
	background-color: #a782be;
	border-radius: 22px;
	display: flex;
	padding: 1px;
	max-width: 240px;
	width: 100%;
}

@keyframes searching_line_fill {
	from {width: 1%;}
	to {width: 100%;}
}

.searching_box .progress_bar .line {
	animation-duration: 12s;
	animation-fill-mode: forwards;
	animation-name: searching_line_fill;
	animation-timing-function: linear;
	background-color: #30dac6;
	border-radius: 22px;
	display: flex;
	height: 6px;
	width: 1%;
}

@media (min-width: 768px) {

	.searching_box {
		gap: 24px;
	}

	.searching_box .text {
		font-size: 18px;
	}

	.searching_box .progress_bar {
		max-width: 416px;
	}

	.searching_box .progress_bar .line {
		height: 8px;
	}

}

/* ---- .super_save_logo ---------------------------------------------------------------- */

.super_save_logo {
	background-image: url(../img/msm_super_save_logo_four_lines.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: flex;
	height: 120px;
	width: 100%;
}

.container100.results_overlay .super_save_logo {
	display: none;
	height: 120px;
	width: 100%;
}

body[data-overlay="initial"] .container100.results_overlay .super_save_logo,
body[data-overlay="updated"] .container100.results_overlay .super_save_logo {
	display: block;
}

@media (min-width: 768px) {

	.super_save_logo,
	.container100.results_overlay .super_save_logo {
		background-image: url(../img/msm_super_save_logo_two_lines.svg);
		height: 90px;
	}

}

/* ------------------------------------------------------------------------------------------- */

.container100.results_overlay .paragraphs {
	color: var(--white);
	display: none;
	flex-direction: column;
	font-size: 32px;
	line-height: 36px;
	margin: 40px 0 0 0;
	max-width: 562px;
	width: 100%;
}

.container100.results_overlay .paragraphs.initial,
.container100.results_overlay .paragraphs.updated {
	margin: 40px auto;
}

body[data-overlay="initial"] .container100.results_overlay .paragraphs.initial,
body[data-overlay="updated"] .container100.results_overlay .paragraphs.updated,
body[data-view="overlay"][data-overlay="adjusting"] .container100.results_overlay .paragraphs.adjusting,
body[data-overlay="no-results"] .container100.results_overlay .paragraphs.no-results {
	display: flex;
}

.container100.results_overlay .paragraphs h3,
.container100.results_overlay .paragraphs h4,
.container100.results_overlay .paragraphs p,
.container100.results_overlay .paragraphs ul.bullet,
.container100.results_overlay .paragraphs ul.bullet li {
	float: left;
	width: 100%;
}

.container100.results_overlay .paragraphs h3,
.container100.results_overlay .paragraphs h4 {
	font-weight: bold;
}

.container100.results_overlay .paragraphs h3 {
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
}

.container100.results_overlay .paragraphs h3 + h3 {
	margin-top: 32px;
}

.container100.results_overlay .paragraphs h4 {
	font-size: 22px;
	line-height: 30px;
	margin-top: 16px;
}

.container100.results_overlay .paragraphs p {
	margin-top: 16px;
}

.container100.results_overlay .paragraphs ul.bullet,
.container100.results_overlay .paragraphs p {
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
}

.container100.results_overlay .paragraphs ul.bullet {
	margin-top: 8px;
}

.container100.results_overlay .paragraphs ul.bullet li {
	margin-top: 12px;
	padding-left: 18px;
}

.container100.results_overlay .paragraphs ul.bullet li:before {
	background-color: var(--white);
	height: 6px;
	top: 10px;
	width: 6px;
}

.container100.results_overlay .paragraphs .header {
	float: left;
	font-size: 40px;
	font-weight: bold;
	line-height: 1.2;
	width: 100%;
}

.container100.results_overlay .paragraphs .subheader {
	font-size: 20px;
	line-height: 28px;
}

.container100.results_overlay .paragraphs .subheader {
	float: left;
	font-family: var(--font-family-oak);
	margin-top: 16px;
	width: 100%;
}

.container100.results_overlay .message.standard.adjusting_buttons {
	display: block;
	margin-top: 32px;
}

.container100.results_overlay .message.standard.adjusting_buttons.hidden {
	display: none;
}

.container100.results_overlay .message.standard.adjusting_buttons button {
	margin-right: 16px;
	margin-top: 16px;
}

.container100.results_overlay .paragraphs.no-results a {
	margin-top: 32px;
}

.container100.results_overlay .downgrade_warning {
	float: left;
	margin-top: 8px;
	width: 100%;
}

.container100.results_overlay .downgrade_warning .title,
.container100.results_overlay .downgrade_warning .text {
	float: left;
	font-family: var(--font-family-oak);
	font-size: 14px;
	font-weight: 600;
	line-height: 22px;
	width: 100%;
}

.container100.results_overlay .downgrade_warning .title {
	font-weight: 600;
}

.container100.results_overlay .downgrade_warning .text {
	font-weight: normal;
	margin-top: 8px;
}

.container100.results_overlay .button_container {
	float: left;
	width: 100%;
}

.container100.results_overlay .button_container button {
	margin-right: 16px;
	margin-top: 16px;
}

/* ---- Results - getting_prices ---------------------------------------------------------------- */

body[data-view="overlay"] .container100.header,
body[data-view="overlay"] .container100.results_info,
body[data-view="overlay"] .container100.results_headers,
body[data-view="overlay"] .container100.results_table {
	display: none;
}

body[data-view="overlay"] .container100.results_overlay,
body.no-results .container100.results_overlay {
	display: flex;
}

/* ---- Results - blurry_bg ---------------------------------------------------------------- */

.blurry_bg {
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	background-color: rgba(0, 20, 56, 0.5);
	height: 100vh;
	opacity: 0;
	overflow: auto;
	overscroll-behavior: contain;
	padding: 0;
	position: fixed;
		top: 0;
		left: 0;
	transition: -webkit-backdrop-filter .3s ease, backdrop-filter .3s ease, opacity .3s ease, visibility .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 3;
}

.cover_help + .blurry_bg,
.more_info + .blurry_bg {
	z-index: 5;
}

.filters_bar.show + .blurry_bg,
.cover_help.show + .blurry_bg,
.more_info.show + .blurry_bg {
	opacity: 1;
	visibility: visible;
}

.blurry_bg:after {
	content: '';
	height: 101%;
	overflow: hidden;
	padding: 0;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
}

.blurry_bg::-webkit-scrollbar {
	display: none; /* Hide scrollbars - Chrome, Safari and Opera */
}

.blurry_bg {
	-ms-overflow-style: none;  /* Hide scrollbars - IE and Edge */
	scrollbar-width: none;  /* Hide scrollbars - Firefox */
}

/* ---- Results - cover_help ---------------------------------------------------------------- */

.cover_help {
	background-color: var(--white);
	border-radius: 0;
	color: var(--charcoal-80);
	font-family: var(--font-family-oak);
	height: 100vh;
	max-width: 420px;
	overflow: hidden;
	opacity: 0;
	position: fixed;
		top: 0;
		right: 0;
	transition: opacity .3s ease, right .5s ease, visibility .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 6;
}

.cover_help.show {
	opacity: 1;
	right: 0;
	visibility: visible;
}

.cover_help .panel {
	float: left;
	height: 100%;
	overflow: auto;
	padding: 52px 16px 0 16px;
	position: relative;
	width: 100%;
}

.cover_help .panel .main_title {
	-webkit-background-clip: text;
	background-clip: text;
	background-image: linear-gradient(to bottom, var(--primary-purple) 0%, var(--pink));
	float: left;
	font-family: var(--font-family-ash);
	font-size: 18px;
	font-weight: bold;
	line-height: 1.44;
	-webkit-text-fill-color: transparent;
	width: 100%;
}

.cover_help .panel .items {
	float: left;
	margin-top: 12px;
	padding-bottom: 20px;
	width: 100%;
}

.cover_help .panel .items .item {
	float: left;
	width: 100%;
}

.cover_help .panel .items .item + .item {
	margin-top: 12px;
}

.cover_help .panel .items .item h3 {
	color: var(--charcoal);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 1.5;
	width: 100%;
}

.cover_help .panel .items .item p {
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	line-height: 20px;
	margin-top: 10px;
	width: 100%;
}

.cover_help button.close {
	background-color: transparent;
	background-image: url(../img/cross_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px auto;
	border: 0;
	cursor: pointer;
	float: left;
	height: 24px;
	width: 24px;
	z-index: 1;
}

.cover_help .close_section {
	background-color: var(--white);
	padding: 14px 20px;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
	z-index: 1;
}

.cover_help .close_section button.close {
	background-color: transparent;
	background-image: url(../img/cross_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px auto;
	border: 0;
	cursor: pointer;
	float: left;
	height: 24px;
	width: 24px;
	z-index: 1;
}

/* ---- Results - more info ---------------------------------------------------------------- */

.more_info {
	background-color: var(--white);
	border-radius: 0;
	color: var(--charcoal-80);
	font-family: var(--font-family-oak);
	height: 100vh;
	overflow: hidden;
	opacity: 0;
	padding-top: 50px;
	position: fixed;
		top: 0;
		right: 0;
	transition: opacity .3s ease, right .5s ease, visibility .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 6;
}

.more_info.show {
	opacity: 1;
	right: 0;
	visibility: visible;
}

.more_info .close_section {
	background-color: var(--white);
	padding: 14px 20px;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
	z-index: 1;
}

.more_info.show_fixed_action .close_section {
	box-shadow: 0 4px 20px 0 rgb(0 0 0 / 10%);
}

.more_info .close_section button.close {
	background-color: transparent;
	background-image: url(../img/cross_purple.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px auto;
	border: 0;
	cursor: pointer;
	float: left;
	height: 24px;
	width: 24px;
	z-index: 1;
}

.more_info .close_section .mobile_info {
	display: none;
	float: left;
	margin-top: 8px;
	width: 100%;
}

.more_info.show_fixed_action .close_section .mobile_info {
	display: block;
}

.more_info .close_section .mobile_info .price_info {
	float: left;
}

.more_info .close_section .mobile_info .price_info .frequency {
	color: var(--charcoal-80);
	float: left;
	font-size: 14px;
	font-weight: normal;
	line-height: 18px;
}

.more_info .close_section .mobile_info .price_info .amount {
	clear: both;
	color: var(--charcoal);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 22px;
	font-weight: bold;
	line-height: 30px;
}

.more_info .close_section .mobile_info .go_to_site {
	float: right;
}

.more_info .panels {
	float: left;
	height: calc(100%);
	overflow: auto;
	position: relative;
	width: 100%;
}

.more_info .panels .panel {
	float: left;
	/*height: calc(100%);*/
	overscroll-behavior: contain;
	padding: 24px;
	position: relative;
	width: 100%;
}

/* ---- Results - panel - left ---------------------------------------------------------------- */

.more_info .panels .panel.left {
	background-color: var(--white);
}

.more_info .panels .panel.left .provider_logo {
	background-color: var(--white);
	height: 66px;
	position: relative;
		left: calc(50% - 60px);
	width: 120px;
}

.more_info .panels .panel.left .price_info {
	float: left;
	margin-top: 18px;
	width: 100%;
}

.more_info .panels .panel.left .price_info .frequency {
	color: var(--charcoal-80);
	float: left;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .price_info .amount {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 32px;
	font-weight: bold;
	line-height: 1.25;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .price_info .no {
	color: var(--charcoal-80);
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height: 19px;
	margin: 5px 0 0 0;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .price_info .it {
	color: #888;
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	font-style: italic;
	line-height: 19px;
	margin: 5px 0 0 0;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .excesses {
	color: var(--charcoal);
	float: left;
	font-size: 14px;
	line-height: 22px;
	margin-top: 18px;
	width: 100%;
}

.more_info .panels .panel.left .excesses .sides + .sides {
	border-top: 1px solid var(--purple-10);
	margin-top: 6px;
	padding-top: 6px;
}

.more_info .panels .panel.left .excesses .info {
	color: var(--charcoal-80);
	float: left;
	font-size: 13px;
	line-height: 20px;
	margin-top: 18px;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .go_to_site {
	display: flex;
	float: left;
	justify-content: center;
	margin-top: 20px;
	width: 100%;
}

.more_info .panels .panel.left .important_text {
	float: left;
	margin-top: 16px;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .important_text p {
	color: var(--charcoal-80);
	float: left;
	font-size: 12px;
	line-height: 1.67;
	width: 100%;
}

.more_info .panels .panel.left .important_text p.bolded {
	color: var(--charcoal);
	font-weight: 600;
}
  
.more_info .panels .panel.left .important_text p + p {
	margin-top: 8px;
}

.more_info .panels .panel.left .telephone {
	display: flex;
	float: left;
	justify-content: center;
	margin-top: 32px;
	width: 100%;
}

.more_info .panels .panel.left .policy_docs,
.more_info .panels .panel.left .opening_times {
	border-top: 1px solid var(--purple-10);
	float: left;
	margin-top: 24px;
	padding-top: 24px;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .opening_times .title {
	color: var(--charcoal);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 14px;
	font-weight: bold;
	line-height: 1.57;
	width: 100%;
}

.more_info .panels .panel.left .opening_times p {
	color: var(--charcoal-80);
	float: left;
	font-size: 12px;
	line-height: 1.67;
	margin-top: 8px;
	width: 100%;
}

.more_info .panels .panel.left .policy_docs ul {

}

.more_info .panels .panel.left .policy_docs ul li {

}

.more_info .panels .panel.left .policy_docs ul li + li {
	margin-top: 8px;
}

.more_info .panels .panel.left .policy_docs ul li a {
	float: none;
	padding-left: 24px;
	position: relative;
}

.more_info .panels .panel.left .policy_docs ul li a .icon {
	background-image: url(../img/icon_document_purple.svg);
	background-repeat: no-repeat;
	background-size: contain;
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 16px;
}

.more_info .panels .panel.left .awards {
	border-top: 1px solid var(--purple-10);
	float: left;
	margin-top: 24px;
	padding-top: 24px;
	text-align: center;
	width: 100%;
}

.more_info .panels .panel.left .awards {
	float: left;
	width: 100%;
}

.more_info .panels .panel.left .awards .award + .award {
	margin-top: 24px;
}

.more_info .panels .panel.left .awards .award .logo {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 40px;
	width: 100%;
}

.more_info .panels .panel.left .awards .award.which .logo {
	background-image: url(which);
}

.more_info .panels .panel.left .awards .award .title {
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.67;
	margin-top: 8px;
	width: 100%;
}

/* ---- Results - panel - right ---------------------------------------------------------------- */

.more_info .panels .panel.right {

}

.more_info .panels .panel.right .main_title {
	-webkit-background-clip: text;
	background-clip: text;
	background-image: linear-gradient(to bottom, var(--primary-purple) 0%, var(--pink));
	float: left;
	font-family: var(--font-family-ash);
	font-size: 18px;
	font-weight: bold;
	line-height: 1.44;
	-webkit-text-fill-color: transparent;
	width: 100%;
}

.more_info .panels .panel.right .section {
	float: left;
	width: 100%;
}

.more_info .panels .panel.right .section + .section {
	margin-top: 40px;
}

.more_info .panels .panel.right .section.features {
	margin-top: 16px;
}

.more_info .panels .panel.right .section .heading {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
	float: left;
	font-family: var(--font-family-ash);
	font-size: 16px;
	font-weight: bold;
	line-height: 1.5;
	width: 100%;
}

.more_info .panels .panel.right .section .heading span {
	float: right;
}

.more_info .panels .panel.right .section.features .heading span {
	padding-right: 30px;
}

.more_info .panels .panel.right .section.features ul li {
	padding-top: 8px;
}

.more_info .panels .panel.right .section.features ul li + li {
	border-top: 1px solid var(--purple-10);
	margin-top: 8px;
}

.more_info .panels .panel.right .section.features ul li .sides .side.left {
	color: var(--charcoal);
	font-size: 12px;
	line-height: 32px;
}

.more_info .panels .panel.right .section.features ul li .sides .side.right .icon {
	background-color: #c4c5c4;
	background-image: url(../img/icon_cross_white.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 43% auto;
	border-radius: 50%;
	float: left;
	height: 32px;
	width: 32px;
}

.more_info .panels .panel.right .section.features ul li.included .sides .side.right .icon {
	background-color: var(--mint);
	background-image: url(../img/icon_tick_white.svg);
	background-size: 52% auto;
}

.more_info .panels .panel.right .section.features ul li .sides .side.right .chevron {
	height: 32px;
	margin-left: 16px;
	position: relative;
	transform: rotate(0deg);
	width: 14px;
}

.more_info .panels .panel.right .section.features ul li.expanded .sides .side.right .chevron {
	transform: rotate(180deg);
}

.more_info .panels .panel.right .section.features ul li .hide_show {
	background-color: var(--purple-5);
	border-radius: 8px;
	color: var(--charcoal);
	display: none;
	float: left;
	font-size: 12px;
	line-height: 20px;
	margin-top: 8px;
	padding: 14px 16px;
	width: 100%;
}

.more_info .panels .panel.right .section.features ul li.expanded .hide_show {
	display: block;
}

.more_info .panels .panel.right .section.provider_info ul {
	background-color: var(--purple-5);
	border-radius: 8px;
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	line-height: 20px;
	margin-top: 16px;
	padding: 14px 16px;
	width: 100%;
}

.more_info .panels .panel.right .section.provider_info ul li {
	float: left;
	width: 100%;
}

.more_info .panels .panel.right .section.provider_info ul li + li {
	margin-top: 8px;
}

.more_info .panels .panel.right .section.provider_info ul li .sides .side.left {
	width: 110px;
}

.more_info .panels .panel.right .section.provider_info ul li .sides .side.right {
	font-family: var(--font-family-ash);
	font-size: 14px;
	font-weight: bold;
	padding-left: 10px;
	width: calc(100% - 110px);
	word-break: break-word;
}

.more_info .panels .panel.right .section.cancellations .text,
.more_info .panels .panel.right .section.defaqto .text {
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	line-height: 1.67;
	margin-top: 16px;
	width: 100%;
}

.more_info .panels .panel.right .section.defaqto .text .defaqto_rating {
	float: right;
	height: 52px;
	margin-left: 12px;
	width: 110px;
}

.more_info .panels .panel.right .section.benefits ul.bullet,
.more_info .panels .panel.right .section.exclusions ul.bullet,
.more_info .panels .panel.right .section.cancellations ul.bullet {
	font-size: 12px;
	line-height: 20px;
	margin-top: 16px;
}

.more_info .panels .panel.right .section.benefits ul.bullet li:before,
.more_info .panels .panel.right .section.exclusions ul.bullet li:before,
.more_info .panels .panel.right .section.cancellations ul.bullet li:before {
	top: 8px;
}

.more_info .panels .panel.right .section.fca .text {
	background-color: var(--purple-5);
	border-radius: 8px;
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	line-height: 18px;
	margin-top: 16px;
	padding: 16px;
	width: 100%;
}

.more_info .panels .panel.right .section.about p,
.more_info .panels .panel.right .section.about .text {
	color: var(--charcoal);
	float: left;
	font-size: 12px;
	line-height: 20px;
	margin-top: 16px;
	width: 100%;
}

.more_info .panels .panel.right .section.about ul.bullet {
	color: var(--charcoal);
	font-size: 12px;
	margin-top: 16px;
}

.more_info .panels .panel.right .section.about ul.bullet li a {
	color: var(--primary-purple);
}

/* ---- Results - .sort_by ---------------------------------------------------------------- */

.container100.results_info .sort_by {
	float: left;
}

.container100.results_info .sort_by .information {
	margin: 10px 0;
}

@media (min-width: 992px) {

	/* ---- display ------------------------------------------------ */

	.sort_by {
		display: none;
	}

}


/* ############################################################################################ */
/* #### Transfer - CODE: ddfhs ################################################################ */
/* ############################################################################################ */


body#transfer.transfer_debug form#transfer_form {
	background: hsl(270deg 51% 12%);
	overflow: auto;
	padding: 20px;
	position: relative;
	z-index: 2;
	width: 100%;
}

body#transfer.transfer_debug form#transfer_form table {
	width: 480px;
}

body#transfer .container100 .container {
	max-width: 562px;
}
 
body#transfer .container100.results_overlay .paragraphs .header,
body#transfer .container100.results_overlay .paragraphs .subheader {
	display: block;
}

body#transfer .container100.results_overlay .paragraphs .header {
	word-break: break-word;
}


/* ############################################################################################ */
/* #### Changes to elements in white form - CODE: fmqxp ####################################### */
/* ############################################################################################ */


/* ----- input - text tel number email ---------------------------------------------------------------- */

.white_form .date input[type="text"],
.white_form .date input[type="number"] {
	border-width: 2px;
	height: 54px;
}

.white_form input[type="text"]:focus,
.white_form input[type="tel"]:focus,
.white_form input[type="number"]:focus,
.white_form input[type="email"]:focus {
	background-color: var(--primary-tints-01-purple-tints-purple-5);
	border-color: var(--primary-purple);
	border-width: 2px;
	box-shadow: 0 0 0 3px var(--secondary-white), 0 0 0 5px var(--primary-purple-dark);
}

/* ----- button - white_stroke_rounded ---- WHITE ON THE EMOTIONAL JOURNEY / PURPLE ON THE FUNCTIONAL JOURNEY ------------------------ */

.white_form .btn.white_stroke_rounded,
.white_form a.btn.white_stroke_rounded,
.white_form button.btn.white_stroke_rounded {
	border-color: var(--primary-purple);
	color: var(--primary-purple);
	transition: box-shadow 0.2s ease;
}

.white_form .btn.white_stroke_rounded:hover,
.white_form a.btn.white_stroke_rounded:hover,
.white_form button.btn.white_stroke_rounded:hover {
	box-shadow: 0 0 0 2px var(--primary-purple);
}

/* ----- button - white_text_underline ---------------------------------------------------------------- */

.white_form .btn.white_text_underline,
.white_form a.btn.white_text_underline,
.white_form button.btn.white_text_underline {
	border-color: var(--charcoal);
	color: var(--charcoal);
}

/* ----- message - standard --------------------------------------------------------------- */

.white_form .message,
.white_form .message.standard {
	background-color: var(--purple-5);
	border-color: var(--primary-purple);
	color: var(--charcoal);
}

/* ----- message - info --------------------------------------------------------------- */

.white_form .message.info {
	background-color: var(--secondary-blue-light);
	border-color: var(--navy);
}

.white_form .message.info a {
	color: var(--charcoal);
}
/* ----- message - warning --------------------------------------------------------------- */

.white_form .message.warning {
	background-color: var(--peach-5);
	border-color: var(--peach);
}

.white_form .message.warning a {
	color: var(--charcoal);
}

/* ----- message - error --------------------------------------------------------------- */

.white_form .message.error {
	background-color: var(--coral-5);
	border-color: var(--coral);
}

/* ----- ul selection - style ------------------------------------------------------------ */

.white_form ul.selection li .style {
	background-color: var(--white);
	border-color: var(--purple-60);
}

.white_form ul.selection li input:focus + .style {
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px #323a72;
}

.white_form ul.selection li input:hover + .style {
	border-color: var(--purple-60);
}

.white_form ul.selection li input[type="checkbox"]:hover + .style,
.white_form ul.selection li input[type="checkbox"]:checked + .style {
	border-color: var(--primary-purple);
}

.white_form ul.selection li input:checked + .style {
	border-color: var(--primary-purple-dark);
}

.white_form ul.selection li input:hover + .style,
.white_form ul.selection li input[type="checkbox"]:hover + .style,
.white_form ul.selection li input:checked + .style,
.white_form ul.selection li input[type="checkbox"]:checked + .style {
	background-color: var(--purple-10);
}

/*
.white_form ul.selection li input[type="checkbox"]:checked:hover + .style {
	background-color: var(--primary-purple-dark);
}
*/

.white_form ul.selection li input:focus + .style:before {
	border-color: var(--charcoal);
}

.white_form ul.selection li input:disabled + .style {
	background-color: var(--white);
	border-color: var(--purple-60);
	border-width: 1px;
	opacity: 0.5;
}

/* ----- ul selection - icon ------------------------------------------------------------ */

.white_form ul.selection li .style .icon {
	border-color: var(--primary-tints-01-purple-tints-purple-60);
}

.white_form ul.selection li input:hover + .style .icon,
.white_form ul.selection li input[type="checkbox"]:checked + .style .icon {
	border-color: var(--primary-purple);
}

.white_form ul.selection li input[type="checkbox"]:checked + .style .icon {
	background-color: #faf9fb;
}

/* ----- ul selection - text ------------------------------------------------------------ */

.white_form ul.selection li .style .text {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

/* ---- slide - next_slide --------------------------------------------------------------- */

.slide .white_form button.btn.next_slide {
	/*font-family: 'HeadingNow75', sans-serif;*/
	font-family: var(--font-family-oak);
	margin-top: 24px;
}

/* ---- slide - headers --------------------------------------------------------------- */

.slide .white_form .form_section .header {
	color: var(--primary-purple-dark);
	font-size: 22px;
	line-height: 1.36;
}

.slide .form_section .subheader {
	font-family: var(--font-family-oak);
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	margin-top: 8px;
}

.slide .white_form .form_section .subheader {
	color: var(--charcoal-80);
	font-size: 18px;
	line-height: 1.56;
}

/* ---- slide - text_block --------------------------------------------------------------- */

.slide .white_form .form_section .text_block {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

.slide .white_form .form_section .text_block a {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

/* ---- label --------------------------------------------------------------- */

.slide .white_form .form_section .questions .question .information .label,
.slide .white_form .form_section .questions .question .information .subtext {
	color: var(--primary-tints-02-dark-purple-tints-purple-dark-80);
}

/* ---- state --------------------------------------------------------------- */

.slide .white_form .form_section .questions .question .information .label .state {
	color: var(--white);
}

.slide .white_form .form_section .questions .question.has_msg_error .information .label .state {
	background-color: var(--coral);
	background-image: url(../img/icon_exclamation_white.svg);
}

.slide .white_form .form_section .questions .question.valid:not(.delay_tick) .information .label .state {
	background-color: var(--ui-palette-01-semantic-mint);
	background-image: url(../img/icon_tick_white.svg);
}

/* ---- help_text --------------------------------------------------------------- */

.slide .white_form .form_section .questions .question .information .help_text {
	border-color: var(--primary-purple);
}

/* ---- button.help_icon --------------------------------------------------------------- */

.slide .white_form .form_section .questions .question .information button.help_icon .circle {
	background-image: url(../img/icon_i_primary_purple.svg);
	border-color: var(--primary-purple);
	color: var(--primary-purple);
}

.slide .white_form .form_section .questions .question .information button.help_icon:focus .circle {
	box-shadow: 0 0 0 3px var(--white), 0 0 0 5px #323a72;
}

.slide .white_form .form_section .questions .question.show_help_text .information button.help_icon .circle {
	background-color: var(--primary-purple);
	background-image: url(../img/icon_i_white.svg);
	color: var(--white);
}

.slide .white_form .form_section .questions .question .information button.help_icon .text {
	border-color: var(--primary-purple);
	color: var(--primary-purple);
}

/* ----- date ----------------------------------------------------------------- */

.white_form .date .datepicker button:focus {
	background-color: var(--purple-5);
	border-color: var(--primary-purple);
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px #323a72;
}

/* ---- children --------------------------------------------------------------- */

.slide .white_form .form_section .questions .children {
	border-left-color: var(--purple-10);
}

/* ############################################################################################ */
/* #### Screen size dependent - CODE: sddfa ################################################### */
/* ############################################################################################ */


@media (min-width: 321px) {

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_375_end.svg);
		height: 71px;
		top: -20px;
		width: 375px;
	}

	body.slide_cover .container100.progress,
	body.slide_personal_details .container100.progress {
		min-height: 56px;
	}

}

@media (min-width: 340px) {

	/* ---- datepicker width ---------------------------------------------------------------- */

	.ui-datepicker {
		width: 18em;
	}

}

@media (min-width: 360px) {

	/* ---- containers ---------------------------------------------------------------- */

	body#broken_down .container100 .container,
	body#results .container100 .container,
	body#transfer .container100 .container {
		width: calc(100% - 48px);
	}

	/* ---- datepicker width ---------------------------------------------------------------- */

	.ui-datepicker {
		width: 19em;
	}

}

@media (min-width: 375px) {

	/* ---- containers ---------------------------------------------------------------- */

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 416px;
		width: calc(100% - 80px);
	}

	/* ---- datepicker width ---------------------------------------------------------------- */

	.ui-datepicker {
		width: 20em;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_620_end.svg);
		height: 72px;
		top: -20px;
		width: 620px;
	}

	/* ---- Results - filters_bar ---------------------------------------------------------------- */

	.filters_bar {
		border-radius: 12px;
		box-shadow: 0 4px 20px 0 rgb(61 64 61 / 10%);
		height: calc(100% - 32px);
		top: 16px;
		left: -100%;
		width: calc(100% - 32px);
	}

	.filters_bar.show {
		left: 16px;
	}

	/* ---- Results - cover_help + more info ---------------------------------------------------------------- */

	.cover_help,
	.more_info {
		border-radius: 12px;
		box-shadow: 0 4px 20px 0 rgba(61, 64, 61, 0.1);
		height: calc(100vh - 32px);
		top: 16px;
		right: -100%;
		width: calc(100% - 32px);
	}

	.cover_help.show,
	.more_info.show {
		right: 16px;
	}

	.cover_help .close_section,
	.more_info .close_section {
		box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
		height: auto;
		padding: 13px 20px;
		top: 0;
		left: 0;
		width: 100%;
	}

	.cover_help .panel,
	.more_info .panels {
		padding-left: 8%;
		padding-right: 8%;
	}

	.cover_help .panel {
		padding-top: 72px;
	}

	.more_info .panels {
		padding-top: 24px;
	}

	/* ---- Results - more info - panel - left ---------------------------------------------------------------- */

	.more_info .panels .panel.left {
		border-radius: 12px;
		box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);
	}

}

@media (min-width: 450px) {

	/* ---- display ---------------------------------------------------------------- */

	.container100.header .right {
		display: flex;
	}

}

@media (min-width: 576px) {

	/* ---- containers --------------------------------------------------------------- */

	body#broken_down .container100 .container,
	body#results .container100 .container,
	body#transfer .container100 .container {
		width: calc(100% - 64px);
	}

	/* ---- font size / line height --------------------------------------------------------------- */



	/* ---- Results - results_info --------------------------------------------------------------- */

	.container100.results_info .buttons button.btn.filter {
		padding-left: 44px;
		padding-right: 44px;
	}

}

@media (min-width: 620px) {

	/* ---- container100s ---------------------------------------------------------------- */

	.container100.progress {
		padding: 32px 0;
	}

	.container100.quote {
		min-height: calc(100vh - 88px + 52px);
	}

	/* ---- containers ---------------------------------------------------------------- */

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 572px;
		width: calc(100% - 48px);
	}

	/* ---- font size / line height --------------------------------------------------------------- */

	.container100.footer .important_text {
		font-size: 12px;
	}

	.container100.footer .download {
		font-size: 14px;
	}

	.message {
		font-size: 16px;
		line-height: 24px;
	}

	/* ---- MODULAR - message ---------------------------------------------------------------- */

	.message {
		border-left-width: 4px;
	}

	.message,
	.message p,
	.message ul.bullet {
		font-size: 16px;
		line-height: 24px;
	}

	.message ul.bullet li:before {
		height: 8px;
		top: 7px;
		width: 8px;
	}

	/* ---- footer ---------------------------------------------------------------- */

	.container100.footer .msm_logo {
		margin-top: 0;
	}

	.container100.footer .links {
		align-items: center;
		display: flex;
	}

	.container100.footer .links ul {
		gap: 12px 32px;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.container100.footer .links ul li {
		width: auto;
	}

	.container100.footer .links ul li + li {
		margin-top: 0;
	}

	/*
	.container100.footer .links ul li a {
		text-decoration: none;
	}
	*/

	/* ---- Quote - emotional_form / white_form ---------------------------------------------------------------- */

	.slide .emotional_form {
		padding-top: 0;
	}

	.slide .white_form {
		/*
		margin-top: 24px;
		*/
	}

	/* ---- Quote - help_text ---------------------------------------------------------------- */

	.slide .white_form .form_section .questions .question .information button.help_icon {
		clear: both;
		float: left;
		margin-top: 16px;
		position: relative;
			top: auto;
			right: auto;
	}

	.slide .white_form .form_section .questions .question .information button.help_icon .text {
		display: block;
	}

	.slide .emotional_form .form_section .questions .question .information .help_text {
		margin-top: 0;
		position: absolute;
			left: calc(100% + 16px);
		width: 278px;
	}

	.slide .white_form .form_section .questions .question .information .help_text {
		margin-top: 16px;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_768_end.svg);
		height: 77px;
		top: -24px;
		width: 768px;
	}

	body.slide_cover .container100.progress,
	body.slide_personal_details .container100.progress {
		min-height: 88px;
	}

	.wave_bg {
		background-image: url(../img/wave_emotional_620_bg.svg);
	}

	.results_bg {
		/*background-image: url(../img/wave_results_620_bg.svg);*/
	}

	/* ---- MODULAR - slide ---------------------------------------------------------------- */

	.slide .form_section .questions {
		width: 278px;
	}

	.slide .white_form .form_section .questions {
		width: 100%;
	}

	.slide .white_form .form_section .questions .question .information {
		margin-top: 14px;
		width: 278px;
	}

	.slide .white_form .form_section .questions .question .answer {
		margin-left: 16px;
		margin-top: 0;
	}

	.slide#personal_details .white_form .buttons {
		float: right;
	}

	.slide .white_form .form_section .questions .question .answer,
	.slide#personal_details .white_form .buttons {
		width: calc(100% - 278px - 16px);
	}

}

@media (min-width: 768px) {

	/* ---- is_mobile ---------------------------------------------------------------- */

	.is_mobile {
		display: none;
	}

	/* ---- container100s ---------------------------------------------------------------- */

	.container100.footer {
		padding-bottom: 64px;
		padding-top: 64px;
	}

	body[data-view="overlay"] .container100.results_overlay {
		display: flex;
		align-items: center;
	}
	
	.container100.results_overlay .container {
		margin-top: -40px;
	}

	/* ---- containers ---------------------------------------------------------------- */

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 704px;
		width: calc(100% - 64px);
	}

	/* ---- font size / line height --------------------------------------------------------------- */

	.slide .title {
		font-size: 40px;
		line-height: 48px;
	}

	.slide#cover_summary .cover_header .big {
		font-size: 40px;
		line-height: 52px;
	}

	.slide .subtitle,
	.slide .white_form .form_section .subheader,
	.slide#cover_summary .cover_header .cover_type {
		font-size: 18px;
		line-height: 26px;
	}

	.slide .emotional_form .form_section .header {
		font-size: 40px;
		line-height: 52px;
	}
	
	.slide .white_form .form_section .header {
		font-size: 32px;
		line-height: 1.25;
	}

	.slide .form_section .subheader {
		font-size: 18px;
		line-height: 1.56;
	}

	.slide .form_section .questions .question .information .label {
		font-size: 18px;
		line-height: 1.56;
	}

	.container100.results_overlay .paragraphs h3 {
		font-size: 20px;
		line-height: 1.5;
	}

	.container100.results_overlay .paragraphs ul.bullet,
	.container100.results_overlay .paragraphs p {
		font-size: 18px;
		line-height: 26px;
	}

	/* ---- paragraphs.adjusting ---------------------------------------------------------------- */

	.container100.results_overlay .paragraphs.no-results .header {
		text-align: center;
	}

	.container100.results_overlay .paragraphs h4 {
		margin-top: 40px;
	}

	/* ---- next_slide ---------------------------------------------------------------- */

	.container100.progress button.btn.next_slide {
		display: none;
	}

	.slide button.btn.next_slide {
		display: block;
	}

	button.btn.next_slide svg path {
		fill: var(--white);
	}

	/* ---- Quote - emotional_form / white_form ---------------------------------------------------------------- */

	.slide .emotional_form {
		padding-top: 80px;
	}

	.slide .white_form {
		/*
		margin-top: 24px;
		*/
	}

	/* ---- Quote - help_text ---------------------------------------------------------------- */

	.slide .emotional_form .form_section .questions .question .information .help_text {
		left: calc(100% + 76px);
		width: 284px;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_992_end.svg);
		height: 71px;
		top: -24px;
		width: 992px;
	}

	.wave_bg {
		background-image: url(../img/wave_emotional_768_bg.svg);
	}

	.results_bg {
		/*background-image: url(../img/wave_results_768_bg.svg);*/
	}

	.container100.results_table .wav {
		height: 147px;
		top: -62px;
	}

	.container100.results_table .wav svg.w_lowest_res {
		opacity: 0;
		visibility: hidden;
	}

	.container100.results_table .wav svg.w768 {
		opacity: 1;
		visibility: visible;
	}

	/* ---- MODULAR - slide ---------------------------------------------------------------- */

	.slide .form_section .questions,
	.slide .white_form .form_section .questions .question .information {
		width: 344px;
	}

	.slide .white_form .form_section .questions .question .answer,
	.slide#personal_details .white_form .buttons {
		width: calc(100% - 344px - 16px);
	}

	/* ---- Results - cover_help + more info ---------------------------------------------------------------- */

	.cover_help,
	.more_info {
		height: calc(100% - 48px);
		padding-left: 0;
		padding-right: 0;
		padding-top: 0;
		width: 720px;
		top: 24px;
		right: -800px;
	}

	.cover_help .panel {
		padding-left: 24px;
		padding-right: 24px;
	}

	.cover_help.show,
	.more_info.show {
		right: 24px;
	}

	.cover_help .close_section,
	.more_info .close_section {
		height: 24px;
		padding: 0;
		top: 20px;
		left: 20px;
		width: 24px;
	}

	.cover_help .close_section,
	.cover_help.show_fixed_action .close_section,
	.more_info .close_section,
	.more_info.show_fixed_action .close_section {
		box-shadow: none;
		overflow: hidden;
	}

	.more_info .panels {
		overflow: hidden;
		padding-left: 0;
		padding-right: 0;
		padding-top: 0;
	}

	.more_info .panels .panel {
		height: calc(100%);
		overflow: auto;
	}

	.more_info .panels .panel.left,
	.more_info .panels .panel.right {
		/* This is a fix for Firefox to show the correct padding-bottom */
		padding-bottom: 0;
	}
	
	.more_info .panels .panel.left:after,
	.more_info .panels .panel.right:after {
		/* This is a fix for Firefox to show the correct padding-bottom */
		content: '';
		float: left;
		height: 24px;
		width: 100%;
	}

	/* ---- Results - panel - left ---------------------------------------------------------------- */

	.more_info .panels .panel.left {
		border-radius: 0;
		padding-top: 42px;
		width: 340px;
	}

	/* ---- Results - panel - right ---------------------------------------------------------------- */

	.more_info .panels .panel.right {
		width: calc(100% - 340px);
	}

}

@media (min-width: 992px) {

	/* ---- container100s ---------------------------------------------------------------- */

	body.transition .container100.progress {

	}

	.container100.results_headers:not(.sticky),
	.container100.results_headers.sticky.active {
		display: block;
	}

	/* ---- containers ---------------------------------------------------------------- */

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		width: calc(100% - 96px);
	}

	.container100.progress .container,
	.container100.footer .container {
		max-width: calc(100% - 96px);
	}

	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 744px;
	}

	body#broken_down .container100 .container,
	body#results .container100 .container,
	body#transfer .container100 .container {
		width: calc(100% - 96px);
	}

	/* ---- Quote - white_form ---------------------------------------------------------------- */

	.slide .white_form {
		/*
		margin-top: 28px;
		*/
	}

	/* ---- Quote - help_text ---------------------------------------------------------------- */

	.slide .emotional_form .form_section .questions .question .information .help_text {
		left: calc(100% + 92px);
		width: 288px;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_1200_end.svg);
		height: 82px;
		top: -28px;
		width: 1200px;
	}

	/* ---- MODULAR - slide ---------------------------------------------------------------- */

	.slide .form_section .questions {
		width: 364px;
	}

	.slide .white_form .form_section .questions .question .information {
		width: 364px;
	}

	.slide .white_form .form_section .questions .question .answer,
	.slide#personal_details .white_form .buttons {
		width: calc(100% - 364px - 16px);
	}

	/* ---- Quote - cover_header ------------------------------------------------------------- */

	.slide#cover_summary .cover_header .big,
	.slide#cover_summary .cover_header .cover_type,
	.slide#cover_summary .cover_header .include_exclude {
		text-align: left;
	}

	.slide#cover_summary .cover_header .icon {
		background-position: center left;
		height: 42px;
	}

	.slide#cover_summary .cover_header .include_exclude ul li {
		clear: none;
		left: auto;
		margin-right: 24px;
		transform: none;
	}

	/* ---- Results ----------------------------------------------------------------------------------- */

	.container100.results_table {
		margin-top: 70px;
	}
	
	.container100.results_table .results {
		margin-top: calc(-70px + 16px);
	}

	/* ---- Results - show/hide things ---------------------------------------------------------------- */

	.container100.results_table .results .result .card.desktop {
		display: flex;
	}

	/* ---- footer ------------------------------------------------------------------------------- */

	.container100.footer .download p {
		width: auto;
	}

	.container100.footer .download ul {
		margin-left: 16px;
		margin-top: 0;
		width: auto;
	}

	.container100.footer .download ul li {
		margin-top: 0;
	}

}

@media (min-width: 1200px) {

	/* ---- container100s ---------------------------------------------------------------- */

	.container100.progress {
		/*
		padding: 16px 0;
		*/
	}

	.container100.quote {
		min-height: calc(100vh - 56px + 0px);
	}

	/* ---- containers ---------------------------------------------------------------- */

	body#broken_down .container100 .container,
	body#results .container100 .container,
	body#transfer .container100 .container {
		width: calc(100% - 160px);
	}

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		width: calc(100% - 160px);
	}

	.container100.progress .container,
	.container100.footer .container {
		max-width: calc(100% - 160px);
	}

	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 688px;
	}

	/* ---- font size / line height --------------------------------------------------------------- */

	.container100.header .left .provided_by {
		font-size: 15px;
		line-height: 20px;
	}

	.container100.header .right .quotes_found {
		font-size: 20px;
		line-height: 40px;
	}

	.container100.results_info .summary {
		font-size: 40px;
		line-height: 1.2;
	}

	/* ---- Quote - emotional_form / white_form ---------------------------------------------------------------- */

	.slide .emotional_form {
		padding-top: 96px;
	}

	.slide .white_form {
		/*
		margin-top: 36px;
		*/
	}

	/* ---- Quote - help_text ---------------------------------------------------------------- */

	.slide .emotional_form .form_section .questions .question .information .help_text {
		left: calc(100% + 104px);
		width: 336px;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_1440_end.svg);
		height: 98px;
		top: -36px;
		width: 1440px;
	}

	/* ---- MODULAR - slide ---------------------------------------------------------------- */

	.slide .form_section .questions {
		width: 336px;
	}

	.slide .white_form .form_section .questions .question .information {
		width: 336px;
	}

	.slide .white_form .form_section .questions .question .answer,
	.slide#personal_details .white_form .buttons {
		width: calc(100% - 336px - 16px);
	}

	.slide#cover_summary .emotional_form {
		padding-top: 16px;
	}

	/* ---- transfer_form ---------------------------------------------------------------- */

	body#transfer.transfer_debug form#transfer_form {
		height: 100%;
		position: fixed;
			top: 0;
			right: 0;
		width: 540px;
	}

}

@media (min-width: 1320px) {

	/* ---- container100s ---------------------------------------------------------------- */

	.container100.results_info {
		padding-bottom: 52px;
	}

	.container100.results_table {
		min-height: 780px;
	}

	body[data-view="overlay"][data-overlay="adjusting"] .container100.results_overlay {
		display: block;
	}

	/* ---- containers ---------------------------------------------------------------- */

	body#broken_down .container100 .container,
	body#results .container100 .container,
	body#transfer .container100 .container {
		width: 1280px;
	}

	/* ---- font size / line height --------------------------------------------------------------- */

	.filters_bar .block.top .heading {
		font-size: 18px;
		line-height: 1.44;
	}

	/* ---- Results - results_info ---------------------------------------------------------------- */

	.container100.results_info .buttons {
		display: none;
	}

	.container100.results_info .summary a.btn.white_text_underline.cover_needs {
		display: inline-block;
	}

	/* ---- Results - results_headers ---------------------------------------------------------------- */

	body#results .container100.results_headers .headers {
		padding-left: calc(308px + 16px);
	}

	/* ---- Results - results_table ---------------------------------------------------------------- */

	body#results .container100.results_table .results {
		padding-left: 308px;
	}

	/* ---- Results - overlay ---------------------------------------------------------------- */

	.container100.results_overlay .paragraphs.adjusting {
		margin-left: calc(284px + 148px);
		margin-top: 240px;
		min-height: 600px;
	}

	/* ---- Results - blurry_bg ---------------------------------------------------------------- */

	.filters_bar.show + .blurry_bg {
		opacity: 0;
		visibility: hidden;
	}

	/* ---- Results - filters_bar ---------------------------------------------------------------- */

	@keyframes filters_bar_fade {
		from {
			margin-top: 40px;
			opacity: 0;
			visibility: hidden;

		}
		to {
			margin-top: 0px;
			opacity: 1;
			visibility: visible;
		}
	}

	body[data-view="results"] .filters_bar,
	body[data-view="no_results"] .filters_bar,
	body[data-view="overlay"][data-overlay="adjusting"] .filters_bar {
		animation: filters_bar_fade 0.5s normal forwards ease;
		animation-delay: 0.4s;
	}

	.filters_bar {
		border-radius: 12px;
		box-shadow: 0 4px 20px 0 rgba(61, 64, 61, 0.1);
		height: auto;
		opacity: 0;
		position: absolute;
			top: 240px;
		transition: opacity .3s ease, visibility .3s ease;
		visibility: hidden;
		width: 284px;
		z-index: 2;
	}

	.filters_bar,
	.filters_bar.show {
		left: calc(50% - 640px);
	}

	body[data-view="results"] .filters_bar,
	body[data-view="no_results"] .filters_bar {
		display: block;
	}

	.filters_bar .scroll,
	body[data-view="overlay"] .filters_bar .scroll {
		padding-bottom: 0;
	}

	.filters_bar .block.top .buttons {
		display: none;
	}

	.filters_bar .block.top .heading {
		margin-top: 0;
	}

	.filters_bar.show + .blurry_bg {
		opacity: 0;
		visibility: hidden;
	}

	.filters_bar .mobile_update,
	body[data-view="overlay"] .filters_bar .mobile_update {
		display: none;
	}

}

@media (min-width: 1440px) {

	/* ---- container100s ---------------------------------------------------------------- */

	.container100.progress {
		padding: 32px 0;
	}

	body.transition .container100.progress {

	}

	/* ---- containers ---------------------------------------------------------------- */

	.container100.progress .container,
	.container100.footer .container,
	.slide .emotional_form .container,
	.slide .white_form .container {
		width: calc(100% - 160px);
	}

	.container100.progress .container,
	.container100.footer .container {
		max-width: 1280px;
	}

	.slide .emotional_form .container,
	.slide .white_form .container {
		max-width: 848px;
	}

	/* ---- Quote - emotional_form / white_form ---------------------------------------------------------------- */

	.slide .emotional_form {
		padding-top: 80px;
	}

	.slide .white_form {
		/*
		margin-top: 30px;
		padding-top: calc(80px + 32px);
		*/
	}

	/* ---- Quote - help_text ---------------------------------------------------------------- */

	.slide .emotional_form .form_section .questions .question .information .help_text {
		left: calc(100% + 124px);
		width: 416px;
	}

	/* ---- wave img changes ---------------------------------------------------------------- */

	.slide .white_form:after {
		background-image: url(../img/wave_emotional_2000_end.svg);
		height: 111px;
		top: -30px;
		width: 2000px;
	}

	/* ---- MODULAR - slide ---------------------------------------------------------------- */

	.slide .form_section .questions {
		width: 416px;
	}

	.slide .white_form .form_section .questions .question .information {
		width: 416px;
	}

	.slide .white_form .form_section .questions .question .answer,
	.slide#personal_details .white_form .buttons {
		width: calc(100% - 416px - 16px);
	}

}

@media (min-width: 2000px) {

	/* ---- wave img changes ---------------------------------------------------------------- */

	.wave_bg {
		background-image: url(../img/wave_emotional_2000_bg.svg);
	}

	.results_bg {
		/*background-image: url(../img/wave_results_2000_bg.svg);*/
	}

}





hr {
	margin: 50px 0;
}

.slide:not(.current),
.question .error_messages,
.resources,
.hidden,
.skip {
	display: none;
}

.question {
	clear: both;
}

input + label {
	padding: 5px 10px;
	border: 1px solid transparent;
}

input:checked + label {
	border-color: inherit;
}

body.transition {
	background-color: #fff;
	color: #000;
	transition: background-color .35s;
}

.next_slide,
.prev_slide,
.mobile_next_question {
	cursor: pointer;
}

.vehicle:not(.found) .found,
.vehicle.found .initial,
.vehicle.found .subtext,
.vehicle.found .field,
.vehicle:not(.not_right) .manual_trigger,
.vehicle.manual .manual_trigger,
.vehicle.found .find,
.vehicle:not(.found) .summary_container,
.vehicle:not(.not_found) .message.not_found,
.vehicle:not(.incomplete) .message.incomplete,
.vehicle:not(.not_found):not(.incomplete):not(.manual) .manual {
	display: none;
}

.address:not(.found) .found,
.address.incomplete .found,
.address.found:not(.incomplete) .initial,
.address:not(.not_right) .manual_trigger,
.address.manual .manual_trigger,
.address.found .find,
.address.found:not(.incomplete) .question.postcode .field,
.address.show_summary .picker,
.address:not(.found) .picker,
.address.incomplete .picker,
.address:not(.show_summary) .summary_container,
.address:not(.not_found) .message.not_found,
.address:not(.incomplete) .message.incomplete,
.address:not(.not_found):not(.incomplete):not(.manual) .manual {
	display: none;
}

.vehicle .manual_trigger,
.vehicle .find {
	cursor: pointer;
}

.vehicle.searching .find {
	opacity: .5;
}

input.uppercase {
	text-transform: uppercase;
}

.question.dob .answer .field .datepicker {
	display: none;
}

body.slide_national.prevent_eu .header .initial,
body:not(.prevent_eu) .prevent_eu {
	display: none;
}

.adjusting_form p {
	float: left;
	width: 100%;
	margin: 10px 0;
}

.adjusting_form .subheader + p {
	margin-top: 80px;
	font-weight: bold;
}
