
/* ---- ALL PAGES --------------------------------------- */
/*                                                        */
/*    .container100.header                  CODE: mdfha   */
/*        |-- button.burger                 CODE: burga   */
/*        |-- .powered_by                   CODE: powby   */
/*        |-- .nav                          CODE: navcd   */
/*    .container100.footer                  CODE: foidf   */
/*                                                        */
/* ---- MODULAR ----------------------------------------- */
/*                                                        */
/*    .questions                            CODE: qusss   */
/*        |-- .question                     CODE: queon   */
/*        |-- .panel                        CODE: paneu   */
/*    .topper                               CODE: topdw   */
/*                                                        */
/* ---- QUOTE PAGE -------------------------------------- */
/*                                                        */
/*    ul.progress                           CODE: ulpro   */
/*    .form_introduction                    CODE: intra   */
/*    .decline_popup                        CODE: decpo   */
/*                                                        */
/* ---- RESULTS PAGE ------------------------------------ */
/*                                                        */
/*    .results_table                        CODE: retab   */
/*        |-- .result                       CODE: resul   */
/*            |-- .box                      CODE: boxsd   */
/*    .progress_popup                       CODE: calpo   */
/*    .compare_popup                        CODE: calmm   */
/*    .sliding_bar                          CODE: slidi   */
/*        |-- .demands_lists                CODE: demli   */
/*            |-- .demands_list             CODE: demwq   */
/*    .floating_bg                          CODE: flobg   */
/*    .offline_panel_table                  CODE: offpt   */
/*                                                        */
/* ---- UPGRADE PAGE ------------------------------------- */
/*                                                        */
/*    .upgrade_table                         CODE: upsev   */
/*                                                        */
/* ---- LINKED COMPONENTS ------------------------------- */
/*                                                        */
/*    Linked Values                         CODE: linkl   */
/*                                                        */
/* ------------------------------------------------------ */


/* ################################################# */
/* #### .container100.Header - CODE: mdfha ######### */
/* ################################################# */


/* ---- main ------------------------ */

.container100.header {
	background-color: var(--white);
	border-bottom: 1px solid #E3E4E8;
}

body.nav_open .container100.header {
	position: fixed;
		top: 0;
	z-index: 1;
}

.container100.header .container {
	align-items: center;
	display: flex;
	height: 60px;
	justify-content: space-between;
}

.container100.header .left_side {
	align-items: center;
	display: flex;
}

.container100.header .left_side .pyf_logo {
	height: auto;
	width: auto;
}

.container100.header .left_side .pyf_logo img {
	height: 28px;
	opacity: 0;
}

.container100.header .right_side {
	display: grid;
}

.container100.header .right_side .login {
	display: none;
	float: left;
	margin-left: 30px;
	margin-top: 17px;
}

.container100.header .buttons {
	float: left;
	margin: 1px 0 1px 15px;
}

.container100.header .buttons a.edit_quote {
	background-color: var(--baby-blue);
	border: 0;
	border-bottom: 5px solid #3c87ba;
	border-radius: 5px;
	color: var(--white);
	cursor: pointer;
	float: left;
	font-size: 20px;
	line-height: 42px;
	outline: none;
	padding: 0 20px;
	text-decoration: none;
}

@media (min-width: 1270px) {

	.container100.header .container {
		height: 80px;
		width: calc(100% - 160px);
	}

	.container100.header .left_side .pyf_logo img {
		height: 34px;
	}

	body[data-page-type="quote"] .container100.header .right_side,
	body[data-page-type="results"] .container100.header .right_side,
	body[data-page-type="upgrade"] .container100.header .right_side,
	body[data-page-type="transfer"] .container100.header .right_side {
		display: none;
	}

}


/* ##################################### */
/* #### button.burger - CODE: burga #### */
/* ##################################### */


button.burger {
	background: transparent;
	border: 0;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 7px;
	grid-column: 2 / span 1;
	height: 32px;
	justify-content: center;
	padding: 0;
	touch-action: manipulation;
	width: 32px;
}

body[data-page-type="quote"] button.burger,
body[data-page-type="results"] button.burger,
body[data-page-type="upgrade"] button.burger {
	display: none;
}

button.burger .stroke {
	background: #FE6E80;
	height: 3px;
	position: relative;
	width: 100%;
}

body.nav_open button.burger .stroke.one {
	top: 5px;
	transform: rotate(45deg);
}

body.nav_open button.burger .stroke.two {
	top: -5px;
	transform: rotate(-45deg);
}

body.nav_open button.burger .stroke.three {
	display: none;
}

@media (min-width: 1270px) {

	.container100.header .right_side button.burger {
		display: none;
	}

}

/* ##################################### */
/* #### .powered_by - CODE: powby ###### */
/* ##################################### */


.powered_by {
	align-items: center;
	border-left: 1px solid rgba(87, 87, 86,0.33);
	display: flex;
	flex-direction: column;
	float: left;
	gap: 4px;
	margin: 0 0 0 15px;
	padding: 0 0 0 15px;
	position: relative;
}

.powered_by.powered_by_ {
	display: none;
}

.powered_by .text {
	float: left;
	font-size: 12px;
	line-height: 1.3;
	opacity: 0.85;
}

.powered_by_mse .text,
.powered_by_MSE .text {
		/*background-image: url(../img/other_pcw/mse_logo.svg);*/
		display: none;
}

.powered_by .mse_text {
	display: none;
	float: left;
	font-size: 12px;
	line-height: 1.3;
	opacity: 0.85;
}

.powered_by_mse .mse_text,
.powered_by_MSE .mse_text {
		/*background-image: url(../img/other_pcw/mse_logo.svg);*/
		display: block;
}

.powered_by_newsuk .pb_logo {
	background-image: url(../img/other_pcw/NewsUK-Logo.png);
}

.powered_by .pb_logo {
	background-position: center left;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 20px;
	width: 100%;
}

.powered_by_APS .pb_logo {
	background-image: url(../img/other_pcw/aps-header-logo-v2.png);
	width: 300px;
}

.powered_by_ecoeus .pb_logo,
.powered_by_ECOEUS .pb_logo,
.powered_by_mymovebuddy .pb_logo {
	background-image: url(../img/other_pcw/my_move_buddy_logo.png);
	width: 128px;
}

.powered_by_ETEACH .pb_logo {
        background-image: url(../img/other_pcw/eteach.jpg);
        width: 128px;
}
.powered_by_PBRICKS .pb_logo {
        background-image: url(../img/other_pcw/pb-logo-dark.svg);
        width: 128px;
}

.powered_by_forbes .pb_logo,
.powered_by_FORBES .pb_logo {
	background-image: url(../img/other_pcw/forbes_logo.png);
	width: 128px;
}

.powered_by_gocompare .pb_logo,
.powered_by_GoCompare .pb_logo {
	background-image: url(../img/other_pcw/gocompare_logo.png);
}

.powered_by_money .pb_logo,
.powered_by_MONEY .pb_logo {
	background-image: url(../img/other_pcw/money_logo.svg);
}

.powered_by_mse .pb_logo,
.powered_by_MSE .pb_logo {
	/*background-image: url(../img/other_pcw/mse_logo.svg);*/
	width: 128px;
}

.powered_by_msm .pb_logo,
.powered_by_MSM .pb_logo,
.powered_by_moneysupermarket .pb_logo {
	background-image: url(../img/other_pcw/msm_logo.svg);
	width: 128px;
}

.powered_by_motokiki .pb_logo {
	background-image: url(../img/other_pcw/motokiki_logo.png);
	width: 210px;
}

.powered_by_tim .pb_logo,
.powered_by_TIM .pb_logo,
.powered_by_TIM1 .pb_logo,
.powered_by_TIM2 .pb_logo {
	background-image: url(../img/other_pcw/cyclingweekly_logo.svg);
	width: 100px;
}

.powered_by_snoop .pb_logo,
.powered_by_SNOOP .pb_logo {
	background-image: url(../img/other_pcw/snoop_logo.svg);
	width: 100px;
}

.powered_by_yopa .pb_logo,
.powered_by_YOPA .pb_logo {
	background-image: url(../img/other_pcw/yopa_logo.png);
	width: 100px;
}

.powered_by_drivescore .pb_logo,
.powered_by_DRIVESCORE .pb_logo {
	background-image: url('../img/other_pcw/drivescore-logo.png');
	background-size: auto calc(100% - 15px);
	background-position: center;
	width: 100px;
	background-color: #1a256c;
	border-radius: 2px;
}

.container100.header .left_side div[class*="powered_by_trufl"] .pb_logo {
	background-image: url(../img/other_pcw/trufl_logo.png);
	width: 100px;
}

@media (min-width: 460px) {

	.powered_by {
		flex-direction: row;
		gap: 12px;
	}

	.powered_by .pb_logo {
		height: 38px;
		width: 140px;
	}

}

@media (min-width: 540px) {

	.powered_by .pb_logo {
		width: 200px;
	}

}


/* ############################## */
/* #### .nav - CODE: navcd ###### */
/* ############################## */


.nav {
	background-color: #fff;
	display: none;
	height: calc(100% - 61px);
	overflow: auto;
	overscroll-behavior: contain;
	position: fixed;
		top: 61px;
		left: 0;
	width: 100%;
}

body.nav_open .nav {
	display: flex;
	flex-direction: column;
}

.nav .link {
	border-top: 1px solid #E3E4E8;
	color: var(--navy);
	display: grid;
	font-weight: 600;
	gap: 10px;
	position: relative;
	text-align: left;
}

.nav .link .center {
	display: grid;
	gap: 0;
	grid-template-columns: 1fr 0;
	padding-top: 16px;
}

.nav .link.dropdown .center {
	gap: 16px;
	grid-template-columns: 1fr 24px;
}

.nav .link[data-expanded="true"] .center {
	padding-bottom: 6px;
}

.nav .link .center .text {

}

.nav .link.dropdown .center .icon {
	background-image: url(../img/icon_chevron_red.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 20px;
}

.nav .link.dropdown[data-expanded="true"] .center .icon {
	transform: rotate(180deg);
}

.nav .link .center,
.nav .link ul.inside {
	padding-bottom: 16px;
	padding-left: 20px;
	padding-right: 20px;
}

.nav .link ul.inside {
	display: none;
	flex-direction: column;
	font-size: 16px;
	gap: 12px;
	line-height: 24px;
	list-style: none;
}

.nav .link[data-expanded="true"] ul.inside {
	display: flex;
}

.nav .link ul.inside li {
	float: left;
	font-weight: 400;
	width: 100%;
}

.nav .link ul.inside li a {
	color: var(--navy);
	text-decoration: none;
}

.nav .link ul.inside li a:hover {
	color: var(--red-cta);
}

@media (min-width: 1270px) {

	.nav,
	body.nav_open .nav {
		display: flex;
		flex-direction: row;
		gap: 0;
		height: auto;
		overflow: visible;
		position: relative;
			top: auto;
		width: auto;
	}

	.nav .link {
		align-items: center;
		border-left: 1px solid #E3E4E8;
		border-bottom: 2px solid #fff;
		border-top: 0;
		height: 80px;
	}

	.nav .link .center,
	.nav .link ul.inside {
		padding-left: 30px;
		padding-right: 30px;
	}

	.nav .link .center,
	.nav .link[data-expanded="false"] .center,
	.nav .link[data-expanded="true"] .center {
		padding-top: 0;
		padding-bottom: 0;
	}

	.nav .link.dropdown[data-expanded="true"] .center .icon {
		transform: none;
	}

	.nav .link.dropdown[data-expanded="false"]:hover .center .icon,
	.nav .link.dropdown[data-expanded="true"]:hover .center .icon {
		transform: rotate(180deg);
	}

	.nav .link:hover {
		border-bottom-color: var(--red-cta);
	}

	.nav .link ul.inside {
		background-color: #fff;
		border: 1px solid #E3E4E8;
		display: none;
		padding: 26px 30px;
		position: absolute;
			top: calc(100% + 2px);
			left: -1px;
		width: 240px;
		z-index: 1;
	}

	.nav .link[data-expanded="true"] ul.inside {
		display: none;
	}

	.nav .link:hover ul.inside,
	.nav .link[data-expanded="false"]:hover ul.inside,
	.nav .link[data-expanded="true"]:hover ul.inside {
		display: flex;
	}

}


/* ####################################################################### */
/* #### container100 footer - CODE: foidf #### USED ON EVERY PAGE ######## */
/* ####################################################################### */


.container100.footer {
	/*background-color: #515151;*/
	background-color: #323A3E;
	color: var(--white);
	font-size: 14px;
	line-height: 14px;
	padding-bottom: 50px;
	padding-top: 30px;
}

.container100.footer .pyf_logo {
	background-image: url(../img/site_logo_white.svg);
	height: 38px;
	width: 100%;
}

.container100.footer ul.links {
	float: left;
	font-size: 16px;
	line-height: 24px;
	list-style: none;
	margin-top: 30px;
	width: 100%;
}

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

.container100.footer ul.links li + li {
	margin-top: 10px;
}

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

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

.container100.footer .copy {
	color: #C5C5C5;
	float: left;
	font-size: 13px;
	line-height: 19px;
	margin-top: 30px;
	width: 100%;
}

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

.container100.footer .copy p + p {
	margin-top: 19px;
}

.container100.footer .copy a,
.container100.footer .copy a:hover {
	color: rgba(255,255,255,0.66);
}

@media (min-width: 920px) {

	.container100.footer {
		padding-top: 40px;
	}

	.container100.footer .pyf_logo {
		height: 50px;
		width: 214px;
	}

	.container100.footer .copy {
		font-size: 14px;
		line-height: 20px;
		margin-left: 80px;
		margin-top: 0;
		width: calc(100% - 214px - 80px - 220px - 80px);
	}

	.container100.footer .copy p + p {
		margin-top: 20px;
	}

	.container100.footer ul.links {
		margin-left: 80px;
		margin-top: 0;
		width: 220px;
	}

}


/* ########################################### */
/* #### .questions - CODE: qusss ############# */
/* ########################################### */


.questions {
	clear: both;
	display: grid;
	float: left;
	gap: 26px;
	grid-template-columns: 1fr;
	margin-top: 26px;
	width: 100%;
}

.container100.home_generic#contact .left_side form .questions {
	gap: 38px 20px;
	margin-top: 0;
}

.questions .name_block {
	float: left;
	width: 100%;
}

.questions .conditional_block {
	border-left: 12px solid #b0b6bf;
	float: left;
	margin: 5px 0 0 0;
	padding: 0 0 0 24px;
	width: 100%;
}

.questions .conditional_block .guidance {
	color: #5b697c;
	float: left;
	font-size: 20px;
	letter-spacing: 0;
	line-height: 26px;
	margin: 26px 0 0 0;
	max-width: 100%;
	padding: 0 28px 0 0;
	position: relative;
}

.questions .address_wrapper {
	float: left;
	width: 100%;
}

.questions .address_wrapper .address-manual {
	display: none;
	float: left;
	width: 100%;
}

.questions .address_wrapper.not-found .address-manual {
	display: block;
}

/* ---- Questions ----------------------------------- */

.questions .question-group.hide {
	display: none;
}

form:not(.for_self) .questions .for_self,
form:not(.for_other) .questions .for_other {
	display: none;
}

@media (min-width: 920px) {

	.questions {
		gap: 38px;
		margin-top: 38px;
	}

}


/* ########################################### */
/* #### .question - CODE: queon ############## */
/* ########################################### */


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

.question.hide {
	display: none;
}

body[data-page-type="contact"] .question.product,
body[data-page-type="contact"] .question.subject {
	grid-column: span 1;
}

.question .information {
	align-items: center;
	color: var(--navy);
	display: flex;
	float: left;
	font-size: 16px;
	font-weight: 500;
	line-height: 22px;
	width: 100%;
}

.question .information .label {
	color: var(--navy);
	float: left;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
	max-width: calc(100% - 22px);
}

.question .information .state {
	background-color: #bbb;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 60%;
	border-radius: 50%;
	display: none;
	float: left;
	height: 22px;
	width: 22px;
}

.question .sub_label {
	color: var(--navy);
	float: left;
	font-size: 13px;
	letter-spacing: 0;
	line-height: 18px;
	margin-top: 4px;
	width: 100%;
}

.question .sub_label:empty {
	display: none;
}

/* ---- Question - help_section ---------------------------------------------------------- */

.question .help_section {
	float: left;
	margin-top: 6px;
	width: 100%;
}

.question .help_section button .text:before {
	content: 'Need help?';
	font-weight: bold;
}

.question .help_section .help_text {
	background-color: var(--white);
	border: 2px solid var(--baby-blue);
	border-radius: 8px;
	clear: both;
	color: var(--navy);
	display: none;
	float: left;
	font-size: 13px;
	line-height: 18px;
	margin-top: 16px;
	max-width: 100%;
	padding: 18px 22px;
}

.question .help_section .help_text h3,
.question .help_section .help_text p {
	float: left;
	width: 100%;
}

.question .help_section .help_text p + h3 {
	margin-top: 10px;
}

.question .help_section .help_text h3 + p,
.question .help_section .help_text p + p {
	margin-top: 6px;
}

.question .help_section .help_text h3 {
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
}

.question .help_section .help_text p {
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
}

.question .answer {
	float: left;
	margin-top: 16px;
	position: relative;
	width: 100%;
}

/* ---- Question - ul.bullet ---------------------------------------------------------- */

.question ul.bullet.error_messages,
.question ul.bullet.advisory_messages {
	display: none;
	float: left;
	font-size: 14px;
	line-height: 22px;
	margin-top: 16px;
	width: 100%;
}

.question ul.bullet.error_messages {
	color: #C3223F;
}

.question ul.bullet.advisory_messages {
	color: #dd8a3c;
}

.question ul.bullet.error_messages li,
.question ul.bullet.advisory_messages li {
	float: left;
	padding-left: 20px;
	position: relative;
	width: 100%;
}

.question ul.bullet.error_messages li:before,
.question ul.bullet.advisory_messages li:before {
	top: 7px;
}

.question ul.bullet.error_messages li:before {
	background-color: #C3223F;
}

.question ul.bullet.advisory_messages li:before {
	background-color: #dd8a3c;
}

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

.question div.label a {
	color: var(--baby-blue);
}

.question div.label ul {
	clear: both;
	float: left;
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	list-style: none;
	margin-top: 8px;
}

.question div.label ul li {
	clear: both;
	float: left;
	padding: 0 0 0 22px;
	position: relative;
}

.question div.label ul li + li {
	margin: 8px 0 0 0;
}

.question div.label ul li:before {
	background-color: hsl(204, 14%, 32%);
	border-radius: 50%;
	content: '';
	float: left;
	height: 4px;
	position: absolute;
		top: calc(13px - 2px);
		left: 8px;
	width: 4px;
}

.question div.label p {
	clear: both;
	float: left;
	margin: 18px 0 0 0;
}

.question div.label p:first-of-type {
	margin: 0;
}

.question .mobile_help_text {
	display: none;
}

.question .label_extra {
	color: #aaa;
	float: left;
	font-size: 14px;
	line-height: 18px;
	padding: 4px 0 3px 0;
	width: 100%;
}

.question .label_extra.urgent {
	color: #ea5770;
}

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

.question .answer ul li .radio_image_button,
.question .answer ul li label {
	/*background-color: #dce8ed;*/
	background-color: hsl(216, 94%, 95%);
	border-radius: 5px;
	color: hsl(203, 14%, 32%);
	float: left;
	font-size: 20px;
	letter-spacing: -0.2px;
	line-height: 20px;
	padding: 11px 18px;
	width: auto;
}

.question .answer ul li .radio_image_button {
	display: flex;
	align-items: center;
}

.question .answer ul li input:checked + .radio_image_button,
.question .answer ul li input:checked + label {
	background-color: hsl(204, 14%, 32%);
	color: var(--white);
}

.question .answer ul li input:focus + .radio_image_button,
.question .answer ul li input:focus + label {
	outline: #449ad5 solid 2px;
}

.question .answer ul li .radio_image_button .option_label {
	float: left;
}

.question .answer ul li .radio_image_button .option_subtext {
	clear: both;
	float: left;
	font-size: 13px;
}

/* ---- question - Checkboxes ------------------------------------- */

.question .answer ul.checkbox3 li .checkbox label {
	padding: 14px 50px 14px 18px;
}

.question .answer ul.checkbox3 li .checkbox label span.illustration {
	border: 2px solid #5b697c;
	border-radius: 2px;
	color: var(--white);
	float: right;
	font-family: foundation-icons;
	font-size: 26px;
	height: 20px;
	position: absolute;
		top: calc(50% - 10px);
		right: 18px;
	width: 20px;
}

.question .answer ul.checkbox3 li .checkbox input:checked + label span.illustration {
	background-color: #5b697c;
	border-color: var(--white);
}

.question .answer ul.checkbox3 li .checkbox input:checked + label span.illustration:before {
	content: "\f126";
	position: absolute;
		top: -2px;
		left: 2px;
}

/* ---- question - Inputs ------------------------------------- */

.address_wrapper.found .question .answer input#id_postcode {
	display: none;
}

/* ---- question - Value Slider ------------------------------------- */

.question .answer .value_slider {
	background-color: #e6f0fe;
	border-radius: 5px;
	float: left;
	max-width: 100%;
	min-width: 280px;
	padding: 20px;
	position: relative;
}

.question .answer .value_slider .slider_amount {
	color: hsl(203, 14%, 32%);
	float: left;
	font-size: 20px;
	letter-spacing: -0.2px;
	line-height: 26px;
	width: 100%;
}

.question .answer .value_slider .slider_element {
	background-color: #cbdbf1;
	border-color: transparent;
	cursor: pointer;
	float: left;
	margin: 12px 0 0 0;
	width: 100%;
}

.question .answer .value_slider .slider_element .ui-widget-header {
	background: var(--baby-blue);
}

.question .answer .value_slider .slider_element.ui-slider .ui-slider-handle {
	background: var(--white);
	border-color: transparent;
	box-shadow: 0 0 2px rgba(0,0,0,0.2);
	cursor: pointer;
}

/* ---- Question - States ---------------------------------------------------------- */

.question[data-help-text-open="true"] .help_section button .text:before {
	content: 'Close help';
}

.question[data-help-text-open="true"] .help_section .help_text {
	display: block;
}

.question[data-state="valid"] .information .label,
.question[data-state="advisory"] .information .label,
.question[data-state="error"] .information .label,
.question[data-state="searching"] .information .label {
	padding-right: 14px;
}

.question[data-state="valid"] .information .state,
.question[data-state="advisory"] .information .state,
.question[data-state="error"] .information .state,
.question[data-state="searching"] .information .state {
	display: block;
}

.question[data-state="valid"] .information .state,
.question[data-state="advisory"] .information .state {
	background-color: #2FB072;
	background-image: url(../img/icon_tick_white.svg);
}

.question[data-state="error"] .information .state {
	background-color: #C3223F;
	background-image: url(../img/icon_cross_white.svg);
	background-size: 44%;
}

.question[data-state="searching"] .information .state {
	background-color: transparent;
	background-image: url(../img/ajax_loader_grey.svg);
	background-size: contain;
}

.question[data-state="error"] ul.error_messages,
.question[data-state="advisory"] ul.advisory_messages {
	display: block;
}

/* ---- Question - Answer prefixes and suffixes ------------------------------------ */

.question[data-icon="pound"] .answer:before,
.question[data-icon="percent"] .answer:after,
.question[data-icon="calendar"] .answer:after {
	color: var(--navy);
	font-size: 20px;
	height: 40px;
	line-height: 40px;
	position: absolute;
		top: 7px;
}

.question[data-icon="pound"] .answer:before {
	content: "\00a3";
	left: 20px;
}

.question[data-icon="percent"] .answer:after,
.question[data-icon="calendar"] .answer:after {
	right: 20px;
}

.question[data-icon="percent"] .answer:after {
	content: '%';
}

.question[data-icon="calendar"] .answer:after {
	background-image: url(../img/icon_calendar_blue.svg);
	background-position: center right;
	background-repeat: no-repeat;
	background-size: contain;
	content: '';
	width: 28px;
}

.question[data-icon="pound"] .answer input[type="text"],
.question[data-icon="pound"] .answer input[type="email"],
.question[data-icon="pound"] .answer input[type="number"],
.question[data-icon="pound"] .answer input[type="tel"] {
	padding-left: 52px;
}

.question[data-icon="calendar"] .answer input[type="text"],
.question[data-icon="calendar"] .answer input[type="email"],
.question[data-icon="calendar"] .answer input[type="number"],
.question[data-icon="calendar"] .answer input[type="tel"],
.question[data-icon="percent"] .answer input[type="text"],
.question[data-icon="percent"] .answer input[type="email"],
.question[data-icon="percent"] .answer input[type="number"],
.question[data-icon="percent"] .answer input[type="tel"] {
	padding-right: 52px;
}

/* ---- Question - DELETE (for Form Sections eg. Gadget, Appliance) ------------------------- */

.question.DELETE {
	display: none;
}

/*
.question.DELETE {
	height: 30px;
	margin-top: 0;
	position: absolute;
		top: 40px;
		right: 0;
	width: 30px;
}

.form_section.undeletable .question.DELETE {
	display: none;
}

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

.question.DELETE .answer {
	background-image: url(../img/icon_trash_red.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 30px;
	margin-top: 0;
	position: relative;
	width: 30px;
}

.question.DELETE .answer input {
	height: 100%;
	opacity: 0;
	position: absolute;
		top: 0;
		left: 0;
	width: 100%;
}
*/

/* ---- Question - contact ------------------------- */

.container100.home_generic#contact .left_side form .questions .question {
	margin-top: 0;
}

/* ---- question - states - error ------------------------------------ */

.question[data-state="error"] ul.selection li .option,
.question[data-state="error"] input[type="text"],
.question[data-state="error"] input[type="email"],
.question[data-state="error"] input[type="number"],
.question[data-state="error"] input[type="tel"],
.question[data-state="error"] .select select {
	/*background-color: #FFF6F6;*/
	border-color: #C3223F;
}

/* ---- question - states - valid and advisory ------------------------------------ */

.question[data-state="valid"] input[type="text"],
.question[data-state="valid"] input[type="email"],
.question[data-state="valid"] input[type="number"],
.question[data-state="valid"] input[type="tel"],
.question[data-state="valid"] .select select,
.question[data-state="advisory"] input[type="text"],
.question[data-state="advisory"] input[type="email"],
.question[data-state="advisory"] input[type="number"],
.question[data-state="advisory"] input[type="tel"],
.question[data-state="advisory"] .select select {
	background-color: #F3FFF9;
	border-color: #2FB072;
}

/* ---- question - Date Boxes ---- 3 boxes indicating DD MM YYYY ------------------------------------ */

.question .answer div.date {
	display: flex;
	flex-wrap: wrap;
	float: left;
	gap: 10px 7px;
	max-width: 100%;
}

.question .answer div.date span {
	float: left;
	line-height: 54px;
}

.question .answer div.date input.day,
.question .answer div.date input.month {
	width: 76px;
}

.question .answer div.date input.year {
	width: 84px;
}

/* ---- question - Calendar Button ------------------------------------- */

.question .answer a.calendar-button {
	background-image: url(../img/blue_calendar.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 40px;
	margin: 0 0 0 -37px;
	width: 28px;
}

.question .answer img.ui-datepicker-trigger {
	cursor: pointer;
	float: left;
	height: 28px;
	margin: 6px 0 6px -37px;
}

/* ---- Question - Address n Vehicle Reg ------------------------------------- */

.question .answer .grey-container,
.question .answer .address-container {
	background-color: var(--white);
	/*border: 1px solid #2FB072;*/
	border-radius: 8px;
	box-shadow: 0 4px 8px rgb(0 0 0 / 6%);
	color: var(--navy);
	float: left;
	font-size: 16px;
	line-height: 24px;
	max-width: 100%;
	min-width: 240px;
	padding: 18px 22px;
}

@media (min-width: 440px) {

	.question.first_name,
	.question.surname {
		grid-column: span 1;
	}

}

@media (min-width: 920px) {

	.question.DELETE {
		top: 60px;
	}

}


/* ####################################################### */
/* #### .panel - CODE: paneu ############################# */
/* ####################################################### */


.panel {
	background-color: hsl(204deg 50% 98%);
	border-left: 10px solid var(--baby-blue);
	border-radius: 8px;
	box-shadow: 0 4px 8px rgb(0 0 0 / 6%);
	display: flex;
	flex-direction: column;
	float: left;
	gap: 12px;
	margin-top: 26px;
	max-width: 100%;
	min-width: 240px;
	padding: 18px 22px;
}

.panel .paragraphs {
	margin-top: 0;
}

.panel,
.panel .title,
.panel .paragraphs p {
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

.panel .title {
	color: var(--baby-blue);
	font-weight: 600;
}

@media (min-width: 920px) {

	.questions {
		margin-top: 38px;
	}

}


/* ####################################################### */
/* #### ul.progress - CODE: ulpro ######################## */
/* ####################################################### */


ul.progress {
	clear: both;
	display: flex;
	float: left;
	gap: 28px;
	justify-content: center;
	list-style: none;
	width: 100%;
}

ul.progress li,
ul.progress li a {
	align-items: center;
	display: flex;
}

ul.progress li {
	float: left;
}

ul.progress li .circle {
	background-color: #ccc;
	border-radius: 50%;
	color: var(--white);
	float: left;
	font-size: 22px;
	height: 48px;
	line-height: 48px;
	text-align: center;
	width: 48px;
}

ul.progress li.active .circle {
	background-color: #2FB072;
}

ul.progress li.completed .circle {
	background-color: #014A66;
}

ul.progress li .text {
	color: var(--navy);
	display: none;
	float: left;
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	max-width: calc(100% - 64px);
	padding-left: 18px;
	text-align: left;
}

@media (min-width: 920px) {

	ul.progress {
		justify-content: space-evenly;
	}

	ul.progress li {
		margin-left: 0;
		margin-right: 0;
	}

	ul.progress[data-no-of-steps="2"] li {
		max-width: calc(100%/2 - 8px);
	}

	ul.progress[data-no-of-steps="3"] li {
		max-width: calc(100%/3 - 8px);
	}

	ul.progress[data-no-of-steps="4"] li {
		max-width: calc(100%/4 - 8px);
	}

	ul.progress[data-no-of-steps="5"] li {
		max-width: calc(100%/5 - 8px);
	}

	ul.progress[data-no-of-steps="6"] li {
		max-width: calc(100%/6 - 8px);
	}

	ul.progress li .circle {
		font-size: 28px;
		height: 64px;
		line-height: 64px;
		width: 64px;
	}

	ul.progress li .text {
		display: block;
	}

}


/* ####################################################################### */
/* #### form_introduction - CODE: intra #### USED ON QUOTE PAGES ######### */
/* ####################################################################### */


.form_introduction {
	float: left;
	margin-top: 30px;
	width: 100%;
}

.form_introduction h1,
.form_introduction h3,
.form_introduction p {
	color: var(--navy);
	float: left;
	width: 100%;
}

.form_introduction h1 {
	font-size: 30px;
	font-weight: 600;
	line-height: 36px;
}

.form_introduction h3,
.form_introduction p {
	margin-top: 14px;
}

.form_introduction h3 {
	font-size: 18px;
	font-weight: 500;
	line-height: 26px;
}

.form_introduction p {
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

@media (min-width: 920px) {

	.form_introduction {
		margin-top: 60px;
	}

	.form_introduction h1 {
		font-size: 36px;
		line-height: 46px;
	}

}


/* ############################################################## */
/* #### .decline_popup - CODE: decpo ############################ */
/* ############################################################## */


.decline_popup {
	align-items: center;
	background-color: hsla(204, 14%, 32%, 0.5);
	display: flex;
	height: 100%;
	justify-content: center;
	opacity: 0;
	padding: 20px;
	position: fixed;
		top: 0;
		left: 0;
	transition: all .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 2;
}

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

.decline_popup .area {
	background-color: var(--white);
	border-radius: 8px;
	color: hsla(204, 14%, 32%, 0.8);
	max-width: 800px;
	padding: 40px;
	position: relative;
	transition: all .3s ease;
	width: 100%;
}

.decline_popup .area .title {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 40px;
	font-weight: 500;
	line-height: 42px;
	width: 100%;
}

.decline_popup .area .subtitle {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 20px;
	letter-spacing: -0.5px;
	line-height: 24px;
	margin: 10px 0 0 0;
	width: 100%;
}

.decline_popup.offline_panel .area .provider {
	border-top: 0;
	float: left;
	margin: 12px 0 0 0;
	padding: 12px 0 0 110px;
	position: relative;
	width: 100%;
}

.decline_popup.offline_panel .area .provider + .provider {
	border-top: 1px solid #ddd;
}

.decline_popup.offline_panel .area .provider .image {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 100%;
	position: absolute;
		top: 0;
		left: 0;
	width: 90px;
}

.decline_popup.offline_panel .area .provider .text {
	color: hsla(204, 14%, 32%, 0.8);
	float: left;
	font-size: 15px;
	letter-spacing: 0;
	line-height: 20px;
	padding: 0 20px 0 0;
	width: calc(100% - 180px);
}

.decline_popup.offline_panel .area .provider .right {
	float: left;
	width: 180px;
}

.decline_popup.offline_panel .area .provider .right a {
	background-color: hsl(26, 82%, 60%);
	border: 0;
	border-bottom: 5px solid hsl(25, 74%, 54%);
	border-radius: 5px;
	color: var(--white);
	cursor: pointer;
	float: left;
	font-size: 20px;
	line-height: 42px;
	outline: none;
	padding: 0 20px;
	text-align: center;
	text-decoration: none;
	width: 180px;
}

.decline_popup.offline_panel .area .provider .right p {
	color: #5b697c;
	float: left;
	font-size: 14px;
	line-height: 17px;
	padding: 6px 0 0 0;
	text-align: center;
	width: 100%;
}

.decline_popup .area .close {
	background-color: hsl(204, 14%, 32%);
	border-radius: 50%;
	color: var(--white);
	cursor: pointer;
	height: 32px;
	font-family: foundation-icons;
	font-size: 16px;
	line-height: 32px;
	position: absolute;
		top: -12px;
		right: -12px;
	text-align: center;
	width: 32px;
}

.decline_popup .area .close:before {
	content: "\f217";
}


/* ############################################################## */
/* #### .topper - CODE: topdw ################################### */
/* ############################################################## */


.topper {
	display: grid;
	gap: 20px;
}

.topper .quotes_header {
	color: hsl(207, 23%, 30%);
	float: left;
	font-size: 32px;
	font-weight: normal;
	line-height: 38px;
}

.topper .quotes_header span.count {
	color: var(--baby-blue);
	font-size: 40px;
	letter-spacing: -1.5px;
	padding: 0 4px;
}

.topper .extra_text {
	font-size: 14px;
	line-height: 22px;
}

.topper .btn.tailor_your_cover,
.topper .btn.cover_needs {
	justify-self: start;
}

@media (min-width: 1024px) {

	.topper .quotes_header {
		font-size: 42px;
		line-height: 46px;
	}

	.topper .quotes_header span.count {
		font-size: 50px;
	}

	.topper .extra_text {
		font-size: 16px;
		line-height: 24px;
	}

}


/* ############################################################## */
/* #### .results_table - CODE: retab ############################ */
/* ############################################################## */


.results_table {
	float: left;
	margin-top: 40px;
	width: 100%;
}

body[data-state="no_results"] .results_table {
	display: none;
}

.results_table .headers {
	background-color: #014A66;
	display: none;
	width: 100%;
}

.results_table .headers.sticky {
	display: none;
	position: fixed;
		top: 0;
		right: 40px;
	width: calc(100% - 80px);
	z-index: 2;
}

.results_table .headers.sticky.active {
	display: none;
}

.results_table .headers .group {
	display: grid;
}

.results_table .headers .header {
	align-items: stretch;
	background-color: #014A66;
	border-left-color: var(--grey-1);
	color: var(--white);
	display: grid;
	font-size: 15px;
	font-weight: 500;
	line-height: 20px;
	min-height: 90px;
	padding: 0;
	position: relative;
	text-align: center;
	width: 100%;
}

.results_table .headers .header.insurer {
	border-left: 0;
}

.results_table .headers .header.sortable {
	cursor: pointer;
}

.results_table .headers .header.sortable:hover {
	background-color: #27657d;
}

.results_table .headers .header.sortable.asc,
.results_table .headers .header.sortable.asc:hover,
.results_table .headers .header.sortable.desc,
.results_table .headers .header.sortable.desc:hover {
	background-color: var(--baby-blue);
}

.results_table .headers .header.sortable:before,
.results_table .headers .header.sortable:after {
	position: absolute;
		top: 50%;
		right: 7px;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	opacity: .3;
	content: '';
}

.results_table .headers .header.sortable:before {
	margin-top: -12px;
	border-bottom-color: var(--white);
}

.results_table .headers .header.sortable:after {
	margin-top: 2px;
	border-top-color: var(--white);
}

.results_table .headers .header.sortable.asc:before,
.results_table .headers .header.sortable.desc:after {
	opacity: 1;
}



.results_table .headers .header .center {
	align-items: center;
	display: flex;
	padding: 8px;
	position: relative;
}

.results_table .headers .header.sortable .center {
	padding-right: 20px;
}

.results_table .results {
	display: flex;
	flex-direction: column;
	float: left;
	width: 100%;
}

.results_table .results .result_group {
	display: flex;
	flex-direction: column;
	float: left;
	gap: 6px;
	margin-top: 0;
	width: 100%;
}

.results_table .results .result_group .group_info {
	background-color: hsl(207, 12%, 30%);
	color: var(--white);
	display: flex;
	flex-direction: column;
	float: left;
	gap: 6px 16px;
	padding: 16px 18px;
	width: 100%;
}

.results_table .results .result_group .group_info .group_name {
	float: left;
	font-size: 20px;
	line-height: 20px;
}

.results_table .results .result_group .group_info .group_desc {
	color: rgba(255,255,255,0.65);
	cursor: pointer;
	float: left;
	font-size: 13px;
	line-height: 15px;
	text-decoration: underline;
}

.results_table .results .result_group .group_info .group_desc:hover {
	color: rgba(255,255,255,1);
}

.results_table .results .result_group .results_set {
	display: grid;
	width: 100%;
}

.results_table .headers .header .help_circle {
	background-color: transparent;
	border: 1px solid #fff;
	display: none;
	height: 18px;
	line-height: 17px;
	margin: 0;
	position: absolute;
		top: 4px;
		right: 4px;
	width: 18px;
}

.results_table .headers .header[data-has-info="true"] .help_circle {
	display: block;
}

.results_table .headers .header .help_circle:hover {
	background-color: #fff;
	color: var(--baby-blue);
}

.results_table .headers .header .help_button {
	margin: 0;
	position: absolute;
		top: 4px;
		right: 4px;
}

@media (min-width: 640px) {

	.results_table .results .result_group .group_info {
		align-items: end;
		flex-direction: row;
	}

}

@media (min-width: 1024px) {

	.results_table .headers,
	.results_table .headers.sticky.active {
		display: grid;
	}

	.results_table .headers {
		grid-template-columns: 120px auto 130px;
	}

	.results_table .headers .header {
		justify-content: center;
	}

	.results_table .results {
		margin-top: 14px;
	}

}

@media (min-width: 1520px) {

	.results_table {
		margin-top: 40px;
		margin-left: 30px;
		width: calc(100% - 260px - 30px);
	}

	.results_table .headers.sticky {
		left: calc(50% - 430px);
		width: 1150px;
	}

}


/* ############################################################## */
/* #### .result - CODE: resul ################################### */
/* ############################################################## */


.result {
	color: hsl(204, 16%, 34%);
	display: grid;
	float: left;
	font-size: 18px;
	gap: 6px;
	line-height: 20px;
	width: 100%;
}

.result .card,
.result .card.desktop {
	background-color: var(--white);
	border-radius: 4px;
	box-shadow: 0 0px 6px 0px rgba(0,0,0,0.05);
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding: 18px;
	width: 100%;
}

.result[data-comparing="true"] .card,
.result[data-comparing="true"] .card.desktop {
	box-shadow: 0px 0px 0px 4px #449ad5;
}

.result .group {
	align-items: center;
	display: grid;
	gap: 12px;
	grid-column: span 2;
}

.result .group.prices {
	background-color: hsl(-500deg 100% 96%);
	border-radius: 4px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding: 16px 18px;
}

.result .group.bools {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.result .tagline {
	background: hsl(-316deg 100% 96%);
	border-radius: 4px;
	display: none;
	font-size: 13px;
	line-height: 20px;
	padding: 12px 16px;
	width: 100%;
}

.result[data-show-tagline="true"] .tagline {
	display: block;
}

.result .tagline a {
	color: var(--baby-blue);
}

@media (min-width: 700px) {

	.result .group.main,
	.result .group.prices {
		grid-column: span 1;
	}

}

@media (min-width: 1024px) {

	.result .card,
	.result .card.desktop {
		gap: 0;
		grid-template-columns: 120px auto 130px;
		padding: 0;
	}

	.result .group,
	.result .group.main,
	.result .group.prices,
	.result .group.texts,
	.result .group.bools {
		gap: 0;
		grid-column: span 1;
		padding: 0;
	}

	.result .group.prices {
		background-color: transparent;
		padding: 0;
	}

}

/* ---- .result__offerline --------------------------------- */

.result__offerline {
	background: hsl(-316deg 100% 96%);
	border-radius: 4px;
	color: hsl(204, 16%, 34%);
	font-size: 13px;
	line-height: 1.4;
	padding: 12px 16px;
	width: 100%;
}

/* ---- .result__infoline --------------------------------- */

.result__infoline {
	background: hsl(-316deg 100% 96%);
	border-radius: 4px;
	color: hsl(204, 16%, 34%);
	font-size: 13px;
	line-height: 1.4;
	padding: 12px 16px;
	width: 100%;
}

/* #################################### */
/* #### box - CODE: boxsd ############# */
/* #################################### */


.box {
	align-items: center;
	display: flex;
	flex-direction: column;
	font-size: 16px;
	gap: 8px;
	line-height: 21px;
	position: relative;
	text-align: center;
	width: 100%;
}

.box[data-type="provider"] {
	display: grid;
	gap: 8px;
	justify-items: center;
}

.result[data-product-names="true"] .box[data-type="provider"] {

}

.box.annual_premium,
.box.monthly_premium {
	align-self: center;
}

.box[data-type="defaqto"] {
	display: none;
}

.box .mobile_name {
	color: #aaa;
	font-size: 12px;
	letter-spacing: 0.2px;
	line-height: 16px;
}

.box[data-type="provider"] .provider_logo {
	background-color: #fff;
	height: 50px;
	grid-row: span 2;
	width: 90px;
}

.box[data-type="provider"] .provider_logo,
.box[data-type="defaqto"] .defaqto_product_rating {
	max-width: 100%;
}

.box[data-type="defaqto"] .defaqto_product_rating {
	width: 72px;
}

.box[data-type="more"] button.btn.red_rounded {
	max-width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	width: 200px;
}

.box[data-type="text"] span.text {
	align-items: center;
	display: flex;
	/*min-height: 44px;*/
}

.box .bool {
	align-items: center;
	display: flex;
	gap: 8px;
	justify-content: center;
	max-width: 100%;
	width: 100%;
}

.box .bool .icon {
	height: 18px;
	width: 18px;
}

.box .bool .text:empty {
	display: none;
}

.box .bool .icon + .text {
	margin-top: 0;
}

.box .bool .text {
	width: auto;
}

.box span.price {
	font-size: 25px;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 26px;
}

.box span.price sup {
	font-size: 14px;
	letter-spacing: 0;
}

.box .difference {
	font-size: 12px;
	line-height: 16px;
}

.box .bool .text {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 16px;
}

.box[data-type="instalments"] .instalments {
	display: grid;
	font-size: 14px;
	gap: 0 10px;
	grid-template-columns: repeat(2, auto);
}

.box[data-type="instalments"] .instalments .left {
	text-align: right;
}

.box[data-type="instalments"] .instalments .right {
	text-align: left;
}

.box[data-type="instalments"] .instalments .total {
	font-weight: 700;
}

.box[data-type="provider"] .product_name {
	display: none;
	float: left;
	font-size: 13px;
	grid-column: 2;
	grid-row: 2;
	line-height: 16px;
	overflow: hidden;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
}

.result[data-product-names="true"] .box[data-type="provider"] .product_name {
	display: block;
}

.box[data-type="provider"] .defaqto_product_rating {
	grid-column: 2;
	grid-row: 1;
	height: 24px;
	/*width: 100%;*/
}

.box[data-type="provider"] .defaqto_product_rating.d0_star {
	height: auto;
}

.box[data-type="provider"] .defaqto_product_rating.d0_star:before {
	content: 'Defaqto not available';
}

.box[data-type="provider"] .defaqto_product_rating .tooltip {
	background-color: #dd6a78;
	border-radius: 3px;
	color: var(--white);
	opacity: 0;
	padding: 18px 20px;
	position: absolute;
		bottom: calc(100% + 22px);
		left: 0;
	transition: all .2s ease;
	visibility: hidden;
	width: 430px;
	z-index: 2;
}

.box[data-type="provider"] .defaqto_product_rating:hover .tooltip {
	bottom: calc(100% + 12px);
	opacity: 1;
	visibility: visible;
}

.box[data-type="provider"] .defaqto_product_rating .tooltip h3 {
	float: left;
	font-size: 18px;
	font-weight: 400;
	line-height: 18px;
}

.box[data-type="provider"] .defaqto_product_rating .tooltip p {
	clear: both;
	color: var(--white);
	float: left;
	font-size: 15px;
	line-height: 20px;
	margin: 20px 0 0 0;
	text-align: left;
}

.box[data-type="provider"] .defaqto_product_rating .tooltip p img {
	border-radius: 6px;
	float: right;
	height: 75px;
	margin: 0 0 2px 10px;
	width: auto;
}

.box[data-type="provider"] .defaqto_product_rating .tooltip:after {
	content: '';
	position: absolute;
		top: calc(100% - 1px);
		left: 42px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8px 5px 0;
	border-color: #dd6a78 transparent transparent;
}

.box .help_circle {
	margin: 0;
	position: absolute;
		top: 4px;
		right: 4px;
}


.box .help_button {
	margin: 0;
	position: absolute;
		top: 4px;
		right: 4px;
}

@media (min-width: 1024px) {

	.box {
		border-left: 1px solid var(--grey-1);
		justify-content: center;
		min-height: 130px;
		padding: 8px;
	}

	.box[data-type="provider"] {
		margin-top: 0;
	}

	.box[data-type="provider"],
	.box[data-type="defaqto"] {
		display: flex;
	}

	.box .bool {
		flex-direction: column;
	}

	.box .bool .icon {
		width: 100%;
	}

	.box .mobile_name,
	.box[data-type="provider"] .product_name,
	.box[data-type="provider"] .defaqto_product_rating {
		display: none;
	}

	.box[data-type="provider"] .product_name {
		font-size: 12px;
		white-space: initial;
	}

}


/* ################################################### */
/* #### .progress_popup - CODE: calpo ############# */
/* ################################################### */


.progress_popup {
	background-color: var(--white);
	border-radius: 5px;
	color: hsla(204, 14%, 32%, 0.8);
	padding: 40px;
	position: fixed;
		top: 50%;
		left: 50%;
	transform: translate(-50%, -50%);
	transition: all .3s ease;
	width: calc(100% - 40px);
	z-index: 4;
}

.progress_popup.calculating {
	opacity: 0;
	visibility: hidden;
}

body[data-state="getting_results"] .progress_popup.calculating {
	opacity: 1;
	visibility: visible;
}

.progress_popup .ajax_loading {
	background-image: url(../img/ajax_loader_grey.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 48px;
	width: 100%;
}

.progress_popup .progress_bar {
	background-color: #e4ecf2;
	border-radius: 8px;
	float: left;
	margin-top: 40px;
	width: 100%;
}

@keyframes progress_bar {
	from { width: 0%; }
	to { width: 100%; }
}

.progress_popup .progress_bar .bar {
	animation-duration: 11s;
	animation-fill-mode: forwards;
	animation-name: progress_bar;
	animation-timing-function: linear;
	background-color: var(--baby-blue);
	border-radius: 8px;
	float: left;
	height: 16px;
	width: 1%;
}

.progress_popup.calculating .progress_bar .bar {
	animation-duration: 11s;
}

.progress_popup.transferring .progress_bar .bar {
	animation-duration: 4s;
}

.progress_popup .title {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 24px;
	letter-spacing: -0.5px;
	line-height: 30px;
	text-align: center;
	width: 100%;
}

.progress_popup .subtitle {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 20px;
	letter-spacing: -0.5px;
	line-height: 24px;
	margin-top: 10px;
	width: 100%;
}

.progress_popup .providers {
	float: left;
	height: 50px;
	margin-top: 40px;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.progress_popup .providers:before,
.progress_popup .providers:after {
	content: '';
	height: 100%;
	position: absolute;
		top: 0;
	width: 50px;
	z-index: 1;
}

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

	left: 0;
}

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

	right: 0;
}

@keyframes move_providers {
	from { left: 0; }
	to { left: -8300px; }
}

.progress_popup .providers ul {
	animation-duration: 45s;
	animation-name: move_providers;
	animation-timing-function: linear;
	float: left;
	gap: 30px;
	list-style-type: none;
	position: absolute;
		top: 0;
		left: 0;
	white-space: nowrap;
	width: 9000px;
}

.progress_popup .providers ul li {
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	/*float: left;*/
	height: 50px;
}

.progress_popup .providers ul li img {
	float: left;
	height: 50px;
	width: 100px;
	opacity: 0;
}


@media (min-width: 600px) {

	.progress_popup .title {
		font-size: 40px;
		line-height: 42px;
		padding-left: 50px;
		padding-right: 50px;
	}

}

@media (min-width: 740px) {

	.progress_popup {
		width: 700px;
	}

}

/* ################################################### */
/* #### .compare_popup - CODE: calmm ################# */
/* ################################################### */

.compare_popup {
	background-color: var(--white);
	color: hsla(204, 14%, 32%, 0.8);
	height: 100%;
	max-width: 1000px;
	opacity: 0;
	padding: 10px;
	position: fixed;
		top: 0;
		left: 0;
	transition: all .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 4;
}

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

.compare_popup__inner {
	display: flex;
	flex-direction: column;
}

.compare_popup__table {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.compare_popup__header {
	display: grid;
	font-weight: bold;
}

.compare_popup__rows {
	max-height: 340px;
	overflow: auto;
}

.compare_popup__rows::-webkit-scrollbar {
	display: none;
}

.compare_popup__rowvalues {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.compare_popup__row {
	display: grid;
}

.compare_popup__rowtitle {
	background-color: #deedf7;
	font-size: 13px;
	padding: 6px 10px;
}

.compare_popup__cell {
	display: flex;
	flex-direction: column;
	gap: 6px;
	justify-content: end;
	padding: 6px 10px;
}

.compare_popup__cell_logo {
	aspect-ratio: 9 / 5;
	background-repeat: no-repeat;
	background-position: left;
	background-size: contain;
	border-radius: 3px;
	height: 40px;
}

@media (min-width: 600px) {
	.compare_popup__row {
		grid-template-columns: 200px 1fr;
	}
}
@media (min-width: 1000px) {
	.compare_popup {
		border-radius: 5px;
		max-height: calc(100vh - 40px);
		max-width: 1000px;
		padding: 40px;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: calc(100% - 40px);
	}
}

/* ################################################### */
/* #### .compare_tracker - CODE: ciqmm ############### */
/* ################################################### */

.compare_tracker {
	background-color: #495965;
	border-radius: 10px;
	box-shadow: 0 0 20px rgb(103 116 125 / 14%);
	color: #fff;
	display: flex;
	gap: 10px;
	opacity: 0;
	padding: 20px 30px;
	position: fixed;
		bottom: -50px;
		left: 50%;
	transition: all .3s ease;
	translate: -50% 0;
	visibility: hidden;
	z-index: 4;
}

.compare_tracker[data-show="true"] {
	opacity: 1;
	bottom: 30px;
	visibility: visible;
}

/* ################################################### */
/* #### .sliding_bar - CODE: slidi ################### */
/* ################################################### */

:root {
	--fixed-price-and-cta-height: 106px;
}

.sliding_bar {
	background-color: var(--white);
	box-shadow: 0 0 20px rgba(103, 116, 125, 0.14);
	height: 100%;
	position: fixed;
		top: 0;
	width: 100%;
	z-index: 4;
}

.sliding_bar.filtering {
	border-top: 2px solid var(--red-cta);
	clear: both;
	color: #5b697c;
	display: none;
	float: left;
	font-size: 16px;
	height: 100%;
	line-height: 22px;
	padding-bottom: 16px;
	padding-top: 16px;
	position: fixed;
		top: 0;
		left: 0;
	width: 100%;
	z-index: 4;
}

.sliding_bar.filtering.show {
	display: block;
}

.sliding_bar[data-side="left"] {
	left: -110%;
	transition: left 0.3s ease;
}

.sliding_bar,
.sliding_bar[data-side="right"] {
	right: -110%;
	transition: right 0.3s ease;
}

.sliding_bar.show[data-side="left"] {
	left: 0;
}

.sliding_bar.show[data-side="right"] {
	right: 0;
}

.sliding_bar .scroll {
	display: grid;
	max-height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
}

.sliding_bar.more_info .scroll {
	padding-bottom: calc(var(--fixed-price-and-cta-height) - 20px);
}

.sliding_bar h2 {
	background: hsl(15, 80%, 60%);
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	color: var(--white);
	float: left;
	font-size: 26px;
	font-weight: normal;
	line-height: 32px;
	max-width: calc(100% - 20px);
	padding: 9px 22px 9px 40px;
	position: relative;
		left: 0px;
}

.sliding_bar .segment {
	float: left;
	padding: 30px;
	width: 100%;
}

.sliding_bar .segment.blue {
	background-color: #014A66;
	color: var(--white);
	display: grid;
	gap: 10px;
	justify-items: center;
}

.sliding_bar.more_info .segment.blue {
	gap: 20px;
}

.sliding_bar .segment.blue h3 {
	float: left;
	font-size: 28px;
	font-weight: 500;
	line-height: 36px;
	width: 100%;
}

.sliding_bar .segment.tagline {
	background-color: hsl(-316deg 100% 96%);
	display: none;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.4;
}

.sliding_bar .segment.tagline[data-visible="true"] {
	display: block;
}

.sliding_bar .segment.white .section {
	float: left;
	width: 100%;
}

.sliding_bar .segment.white .section + .section {
	margin-top: 30px;
}

.sliding_bar .segment.white .section .title {
	color: var(--navy);
	font-size: 16px;
	font-weight: 500;
	line-height: 20px;
}

.sliding_bar .segment.white .section p,
.sliding_bar .segment.white .section ul {
	font-size: 14px;
	font-weight: 300;
	line-height: 22px;
}

.sliding_bar .segment.white .section * + p,
.sliding_bar .segment.white .section * + ul {
	margin-top: 14px;
}

.sliding_bar .segment.white .section p {
	float: left;
	width: 100%;
}

.sliding_bar .segment.white .section ul {
	gap: 6px;
}

.sliding_bar .segment.white .section ul.bullet li {
	padding-left: 16px;
}

.sliding_bar .segment.white .section ul.bullet li:before {
	height: 4px;
	top: 8px;
	width: 4px;
}

.sliding_bar .segment.white .section ul.flex {
	gap: 6px 16px;
}

.sliding_bar .segment.white .section ul.features {
	gap: 0;
}

/* ---- sliding bar - Filtering ------------------------------------ */

.sliding_bar.filtering .corner_close {
	display: none;
}

.sliding_bar.filtering .heading {
	float: left;
	font-size: 20px;
	font-weight: 500;
	line-height: 32px;
	width: 100%;
}

.sliding_bar.filtering .buttons,
.sliding_bar.filtering .questions {
	margin-top: 6px;
}

.sliding_bar.filtering .questions {
	gap: 0;
}

.sliding_bar.filtering .heading,
.sliding_bar.filtering .buttons,
.sliding_bar.filtering .questions .question,
.sliding_bar.filtering .update {
	padding-left: 20px;
	padding-right: 20px;
}

.sliding_bar.filtering .buttons {
	display: grid;
	float: left;
	gap: 8px;
	justify-items: start;
	width: 100%;
}

.sliding_bar.filtering .buttons .btn {

}

.sliding_bar.filtering .questions {
	float: left;
	width: 100%;
}

.sliding_bar.filtering .questions .question,
.sliding_bar.filtering .questions .question + .question {
	margin-top: 0;
}

.sliding_bar.filtering .questions .question {
	padding-bottom: 16px;
	padding-top: 16px;
}

.sliding_bar.filtering .questions .question + .question {
	border-top: 1px solid var(--grey-1);
}

.sliding_bar.filtering .questions .question .label {
	font-size: 15px;
	line-height: 18px;
}

.sliding_bar.filtering .questions .question .help_section {
	display: none;
}
	
.sliding_bar.filtering .questions .question .answer {
	margin-top: 10px;
}

.sliding_bar.filtering .questions .question .answer .select {

}

.sliding_bar.filtering .questions .question .answer .select select {
	height: 46px;
}

.sliding_bar.filtering .questions .question .answer ul.selection li {
	width: 100%;
}

.sliding_bar.filtering .update {
	display: none;
}

.sliding_bar.filtering[data-state="changed"] .update {
	display: block;
}

/* ---- sliding bar - more_info ------------------------------------ */

.sliding_bar.more_info .segment.blue .product {
	align-items: center;
	display: grid;
	gap: 20px;
	grid-template-columns: 1fr;
	justify-items: center;
	width: 100%;
}

.sliding_bar.more_info .segment.blue .provider {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 12px;
	text-align: center;
}

.sliding_bar.more_info .segment.blue .provider .provider_logo {
	background-color: #fff;
	border: 3px solid #fff;
	border-radius: 3px;
	height: 64px;
	padding: 10px;
	width: 110px;
}

.sliding_bar.more_info .segment.blue .provider .product_name {
	font-size: 14px;
}

.sliding_bar.more_info .segment.blue .prices {
	display: grid;
	gap: 20px;
	grid-template-columns: minmax(0, 1fr);
	text-align: center;
	width: 100%;
}

.sliding_bar.more_info .segment.blue .prices .price_info {
	display: grid;
	gap: 12px;
	grid-template-rows: 1fr auto;
}

.sliding_bar.more_info .segment.blue .prices .price_info .frequency,
.sliding_bar.more_info .segment.blue .prices .price_info .price {
	width: 100%;
}

.sliding_bar.more_info .segment.blue .prices .price_info .frequency {
	color: rgba(255,255,255,0.7);
	font-size: 13px;
	grid-row: 2;
	line-height: 20px;
}

.sliding_bar.more_info .segment.blue .prices .price_info .display {
	align-items: center;
	display: grid;
	gap: 4px;
	justify-content: center;
}

.sliding_bar.more_info .segment.blue .prices .price_info .display .price {
	font-size: 28px;
	font-weight: 700;
	letter-spacing: 0.5px;
	line-height: 24px;
}

.sliding_bar.more_info .segment.blue .prices .price_info .display .price sup {
	font-size: 18px;
}

.sliding_bar.more_info .segment.blue .prices .price_info .display .ddd {
	font-size: 13px;
}

.sliding_bar.more_info .segment.blue .prices .price_info .instalments {
	font-size: 15px;
	gap: 2px 10px;
}

.sliding_bar.more_info .segment.blue .ipt_wording {
	color: rgba(255,255,255,0.6);
	margin-top: 0;
}

.sliding_bar.more_info .segment.white .section.about p img,
.sliding_bar.more_info .segment.white .section.defaqto p img {
	float: right;
	margin-bottom: 6px;
	margin-left: 6px;
	width: 130px;
}

.sliding_bar.more_info .segment.white .section ul.included_excluded {
	float: left;
	width: 100%;
}

.sliding_bar.more_info .fixed_price_and_cta {
	background: rgba(255,255,255,0.86);
	display: grid;
	height: var(--fixed-price-and-cta-height);
	justify-content: center;
	padding: 30px;
	position: absolute;
		bottom: calc(-4px - var(--fixed-price-and-cta-height));
		left: 0;
	transition: bottom .3s ease;
	width: calc(100% - var(--scrollbar-width));
}

.sliding_bar.more_info[data-show-fixed-bar="true"] .fixed_price_and_cta {
	bottom: 0;
}

/* ---- sliding bar - demands_n_needs ------------------------------------ */

.sliding_bar.demands_n_needs .btn.red_text.download .icon {
	background-image: url(../img/icon_wrench.svg);
}

/* ---- sliding bar - coronavirus ------------------------------------ */

.sliding_bar.coronavirus .item + .item {
	border-top: 1px solid #ddd;
	padding-top: 20px;
}

.sliding_bar.coronavirus .item .provider_highlight {
	float: left;
	margin-top: 12px;
	width: 100%;
}

.sliding_bar.coronavirus .item .provider_highlight .provider {
	float: left;
	position: relative;
	width: calc(100%/3 - 12px);
}

.sliding_bar.coronavirus .item .provider_highlight .provider + .provider {
	margin-left: 18px;
}

.sliding_bar.coronavirus .item .provider_highlight .provider .img {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 28px;
	width: 100%;
}

.sliding_bar.coronavirus .item .provider_highlight .provider.fade .img {
	filter: grayscale(0.95);
	opacity: 0.09;
}

.sliding_bar.coronavirus .item .provider_highlight .provider .icon {
	background-color: hsl(140, 80%, 34%);
	border: 2px solid var(--white);
	border-radius: 50%;
	color: var(--white);
	font-family: foundation-icons;
	font-size: 10px;
	height: 18px;
	line-height: 14px;
	position: absolute;
		bottom: -6px;
		right: -8px;
	text-align: center;
	width: 18px;
}

.sliding_bar.coronavirus .item .provider_highlight .provider .icon:before {
	content: "\f126";
}

.sliding_bar.coronavirus .item .provider_highlight .provider.fade .icon {
	background-color: hsl(364, 72%, 65%);
}

.sliding_bar.coronavirus .item .provider_highlight .provider.fade .icon:before {
	content: "\f217";
}

@media (min-width: 400px) {

	.sliding_bar.more_info .segment.blue .prices {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sliding_bar.more_info .segment.blue .prices .price_info .frequency {
		grid-row: auto;
	}

}

@media (min-width: 440px) {

	.sliding_bar .segment {
		padding-bottom: 40px;
		padding-top: 40px;
	}

	.sliding_bar .segment.tagline {
		padding-bottom: 20px;
		padding-top: 20px;
	}
	
	.sliding_bar .segment,
	.sliding_bar.more_info .fixed_price_and_cta {
		padding-left: 50px;
		padding-right: 50px;
	}

	.sliding_bar.filtering {
		width: 260px;
	}

	.sliding_bar.filtering ul.selection {
		grid-template-columns: minmax(0, 1fr);
	}

	.sliding_bar.more_info .fixed_price_and_cta {
		justify-content: left;
	}

}

@media (min-width: 570px) {

	.sliding_bar.more_info .segment.blue .product {
		grid-template-columns: 110px 1fr;
	}

}

@media (min-width: 600px) {

	.sliding_bar {
		width: 600px;
	}

	.sliding_bar.more_info .segment.blue .price_info .frequency,
	.sliding_bar.more_info .segment.blue .price_info .price {
		text-align: center;
	}

	.sliding_bar.more_info .segment.blue .go_to_site_contain {
		width: auto;
	}

}

@media (min-width: 1520px) {

	.sliding_bar.filtering {
		display: block;
		left: 0;
		margin-top: 40px;
		position: relative;
		z-index: 3;
	}

	.sliding_bar.filtering button.btn.floating_close {
		display: none;
	}

}


/* ################################################### */
/* #### .demands_lists - CODE: demli ################# */
/* ################################################### */


.demands_lists {
	display: grid;
	gap: 10px;
}


/* ################################################### */
/* #### .demands_list - CODE: demwq ################## */
/* ################################################### */


.demands_list {
	background-color: #f4f4f4;
	border-radius: 6px;
	display: grid;
	padding: 20px;
}

.demands_list .title {

}

.demands_list ul {
	display: grid;
	gap: 6px;
}

.demands_list ul li {
	display: flex;
	justify-content: space-between;
}

.demands_list ul li + li {
	border-top: 1px solid #d9d9d9;
	padding-top: 6px;
}

.demands_list ul li .key {
}

.demands_list ul li .value {
	font-weight: bold;
	text-align: right;
}


/* ################################################### */
/* #### .floating_bg - CODE: flobg ################### */
/* ################################################### */


.floating_bg {
	background-color: rgba(59, 78, 95, 0.6);
	height: 100%;
	opacity: 0;
	position: fixed;
		top: 0;
		left: 0;
	transition: all .3s ease;
	visibility: hidden;
	width: 100%;
	z-index: 3;
}

.sliding_bar.filtering.show + .floating_bg,
.compare_popup.show + .floating_bg,
.float_popup.show + .floating_bg,
.sliding_bar.show + .floating_bg,
body[data-state="getting_results"] .progress_popup.calculating + .floating_bg,
.progress_popup.transferring + .floating_bg {
	opacity: 1;
	visibility: visible;
}

@media (min-width: 1520px) {

	.sliding_bar.filtering.show + .floating_bg {
		opacity: 0;
		visibility: hidden;
	}

}


/* ################################################### */
/* #### .offline_panel_table - CODE: offpt ########### */
/* ################################################### */

.offline_panel_table {
	color: hsla(204, 14%, 32%, 0.8);
	display: none;
	float: left;
	margin: 40px 0 0 0;
	width: 100%;
}

body[data-state="no_results"] .offline_panel_table {
	display: block;
}

.offline_panel_table .title {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 40px;
	letter-spacing: -0.5px;
	line-height: 42px;
	width: 100%;
}

.offline_panel_table .subtitle {
	color: hsl(204, 14%, 32%);
	float: left;
	font-size: 20px;
	letter-spacing: -0.5px;
	line-height: 24px;
	width: 100%;
}

.offline_panel_table .provider {
	border-top: 0;
	float: left;
	margin-top: 40px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
	padding: 0;
	position: relative;
	width: calc(100%/3 - 0px);
}

.offline_panel_table .provider .image {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	float: left;
	height: 60px;
	width: 70%;
}

.offline_panel_table .provider .provider_name {
	color: hsla(204, 14%, 32%, 0.8);
	float: left;
	font-size: 15px;
	letter-spacing: 0;
	line-height: 20px;
	margin: 20px 0 0 0;
	text-align: center;
	width: calc(100% - 0px);
}

.offline_panel_table .provider .right {
	float: left;
	margin-top: 20px;
	position: relative;
		left: calc(50% - 90px);
	width: 180px;
}

.offline_panel_table .provider .right p {
	color: #5b697c;
	float: left;
	font-size: 14px;
	line-height: 17px;
	padding: 6px 0 0 0;
	text-align: center;
	width: 100%;
}

.offline_panel_table a {
	float: none;
}

@media(min-width: 1520px) {

	.offline_panel_table {
		margin-top: 40px;
		margin-left: 30px;
		width: calc(100% - 260px - 30px);
	}

}

/* ################################################# */
/* #### .upgrade_table - CODE: upsev ################ */
/* ################################################# */


.upgrade_table {
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 0px 6px 0px rgb(0 0 0 / 5%);
	display: grid;
	line-height: 1.5;
	margin-top: 40px;
	overflow-x: auto;
	width: calc(100% + 20px);
}

.upgrade_table .row {
	display: grid;
}

.upgrade_table .row.item {
	border-top: 1px solid var(--grey-d);
}

.upgrade_table[data-no-of-columns="3"] .row {
	grid-template-columns: 5fr repeat(2, minmax(0, 7fr));
	width: 700px;
}

.upgrade_table[data-no-of-columns="4"] .row {
	grid-template-columns: 5fr repeat(3, minmax(0, 7fr));
	width: 930px;
}

.upgrade_table[data-no-of-columns="5"] .row {
	grid-template-columns: 5fr repeat(4, minmax(0, 7fr));
	width: 1170px;
}

.upgrade_table .row .column,
.upgrade_table .row .column.product .title,
.upgrade_table .row .column.product .pricing {
	display: grid;
	padding: 20px;
}

.upgrade_table .row .column.product {
	font-size: 16px;
}

.upgrade_table .row.main .column.product {
	grid-template-rows: 54px auto;
	padding: 0;
}

.upgrade_table .row .column.product .title {
	font-weight: 600;
}

.upgrade_table .row .column.product .title,
.upgrade_table .row .column.product .pricing {
	align-items: center;
	justify-content: center;
	padding-bottom: 14px;
	padding-top: 14px;
}

.upgrade_table .row.main .column.info {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 20px;
	justify-content: center;
}

.upgrade_table .row .column.info details {
	font-size: 14px;
}

.upgrade_table .row .column.info details summary {
	color: #324451;
	cursor: pointer;
	font-weight: 600;
	margin-bottom: 6px;
}

.upgrade_table .row .column.product {
	border-left: 1px solid var(--grey-d);
}

.upgrade_table .row .column.product,
.upgrade_table .row .column.product .title,
.upgrade_table .row .column.product .pricing {
	justify-content: center;
	text-align: center;
}

.upgrade_table .row .column.product .pricing  {
	gap: 8px;
}

.upgrade_table .row .column.product .pricing .product_name {
	color: #324451;
	font-size: 18px;
	font-weight: bold;
}

.upgrade_table .row .column.product .pricing .price_text {
	font-size: 14px;
}

.upgrade_table .row .column.product .pricing strong {
	font-weight: 500;
}

.upgrade_table .row.main .column.product {
	justify-content: initial;
}

.upgrade_table .row .column.product.p1 {
	background-color: #fff5f7;
}

.upgrade_table .row .column.product .title {
	border-bottom: 1px solid var(--grey-d);
}

.upgrade_table .row .column.product.p1 .title {
	background-color: #FE6E80;
	color: #fff;
}

@media (min-width: 600px) {

	.upgrade_table {
		width: calc(100% + 30px);
	}

}

@media (min-width: 760px) {

	.upgrade_table[data-no-of-columns="3"] .row {
		width: 100%;
	}

}

@media (min-width: 990px) {

	.upgrade_table[data-no-of-columns="4"] .row {
		width: 100%;
	}

}

@media (min-width: 1230px) {

	.upgrade_table[data-no-of-columns="5"] .row {
		width: 100%;
	}

}


/* ################################################# */
/* #### Linked Values - CODE: linkl ################ */
/* ################################################# */


.results_table .results,
.results_table .results .result_group .results_set {
	gap: 20px;
}

@media (min-width: 440px) {

	.questions .question-group,
	.question,
	.panel {
		grid-column: 1 / span 2;
	}

	.questions,
	.questions .question-group {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}
