/* body */
body {
	font-family: Inter, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	background: #fff;
	color: #112717;
	margin: 0;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
body.noscroll {
	overflow: hidden;
}

/* general */
a {
	color: #0c51c1;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
}
strong {
    font-weight: 600;
}
img {
	max-width: 100%;
	height: auto;
}
figcaption strong {
	font-weight: 500;
}

/*p,
summary,
ul {
	line-height: 1.75;
}*/

.text-center {
	text-align: center;
}

/* breadcrumbs */
nav.breadcrumbs {
	max-width: 1200px;
	width: calc(100% - 1rem);
	margin: auto;
	padding: 0 .5rem;
}

nav.breadcrumbs ol {
    list-style: none;
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

nav.breadcrumbs>ol li {
    display: inline;
    font-size: .85rem;
    margin: 0
}

nav.breadcrumbs ol li:before {
    color: #e3ddd8
}

nav.breadcrumbs>ol li+li:before {
    content: "\203A";
    padding: 0 .25rem;
    color: #555
}

nav.breadcrumbs>ol li a {
    color: #555;
    text-decoration: none
}

nav.breadcrumbs>.active a {
    color: initial
}

nav.breadcrumbs img,nav.breadcrumbs svg {
    max-width: 12px;
    margin-top: -2.5px
}

/* hbtn */
a.btn,
a.button.btn {
	text-decoration: none;
}
.btn,
button.btn {
    border: 0;
    outline: 0;
	height: 46px;
	border-radius: .125rem;
    padding: 0 1.25rem;
    cursor: pointer;
	font-size: .85rem;
	font-weight: 400;
	background: #f0f0f0;
	box-shadow: 0 2px #d6d6d6;
	color: #112717;
	
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	
	position: relative;
}
.no-touch .btn:hover,
.no-touch button.btn:hover {
	background: #e0e0e0;
}
.btn.small,
button.btn.small {
	height: 36px;
	border-radius: 18px;
	font-size: .85rem;
}
.btn.arrow,
button.btn.arrow {
	padding: 0 1.5rem 0 1rem;
}
.btn.arrow:after,
button.btn.arrow:after {
	content: '\276F';
	position: absolute;
	right: .65rem;
	font-weight: 500;
}
.btn.themed,
button.btn.themed {
	background: var(--color-button);
	box-shadow: 0 2px var(--color-button-shadow);
	color: var(--color-button-txt);
}
.no-touch .btn.themed:hover,
.no-touch button.btn.themed:hover {
	background: var(--color-button-hover);
}
.btn.product1,
button.btn.product1 {
	background: #e6deff;
}
.btn.product2,
button.btn.product2 {
	background: #d1ffe3;
}
.btn.btn_guide,
button.btn_guide {
	background-color: #8266d3;
	box-shadow: 0 2px #654ea3;
	color: #fff;
	font-weight: initial;
	min-width: 50px;
}
.no-touch .btn.btn_guide:hover,
.no-touch button.btn_guide:hover {
	background-color: #745ac1;
}
.btn.link,
button.link {
	background: none;
	padding: 0;
	box-shadow: none;
	border: 0;
}
.btn.color_button,
button.color_button {
	background: var(--color-button);
	color: var(--color-button-txt);
}
.no-touch .btn.color_button:hover,
.no-touch buton.color_button:hover {
	background: var(--color-button-hover);
}
.no-touch .btn.link:hover,
.no-touch button.link:hover {
	text-decoration: underline;
	box-shadow: none;
	background: none;
}
.btn.disabled,
button.disabled {
	cursor: initial;
	color: rgba(0,0,0,.75);
}
.no-touch .btn.disabled:hover,
.no-touch button.disabled:hover {
	text-decoration: none;
	box-shadow: none;
}

/* nav */
nav.main {
	
}
nav.main .inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .75rem .5rem;
	max-width: 1200px;
	margin: auto;
	position: relative;
}
nav.main .inner a.logo,
.logo {
	font-size: 1.75rem;
	font-weight: 900;
	text-decoration: none;
	color: var(--color-theme);
}
.logo.light {
	color: #fff;
}

/* main */
main {
	display: flex;
	flex-direction: column;
}

/* h,strong */
h1, h2, h3, h4 {
	margin: 0;
	line-height: normal;
}
h1 {
	font-size: 2.25rem;
	font-weight: 800;
}

/* article */
article {
	display: flex;
	flex-direction: column;
}

/* article */
.article {
	padding: 1rem 0;
}

/* columns */
.columns {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}
.comparison_media .columns {
	flex-direction: row;
}
.spotlight .columns {
	flex-direction: row;
	justify-content: space-between;
}
.columns .column {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	position: relative;
	flex: 1;
	width: 100%;
}
/*.columns .column.half {
	flex: 0 0 50%;
}*/
.columns .column.small {
	flex: 0 0 35%;
}
.columns .column.smaller {
	flex: 0 0 25%;
}
.columns .column.vs {
	flex: 0;
}
.columns .column.full {
	flex: 0 0 100%;
}

/* hero */
.hero {
	display: flex;
	padding: 1rem 0;
}

.hero.index {
    display: flex;
	background: var(--color-theme);
    color: #fff;
    padding: 1.5rem 0;
    min-height: 25vh;
	/*background: var(--color-theme) url("../media/texture.png") 0 0/300px;*/
	background-image: radial-gradient(circle, var(--color-theme) 25%, rgba(255,255,255,.15) 100%);
	background-color: var(--color-theme);
}

.hero summary {
	line-height: 1.75;
	font-size: 1.15rem;
	max-width: 840px;
}

/* comparison */
.comparison a {
	text-decoration: none;
}

/* comparison_media - media */
.comparison .comparison_media {
	padding: 1rem 0 2rem;
}
.comparison .comparison_media .media {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	height: 250px;
	color: initial;
}
.comparison .comparison_media .media figure {
	margin: 0;
    display: flex;
    flex-flow: column;
	align-items: center;
    width: 100%;
    height: 100%;
	gap: .75rem;
}
.comparison .comparison_media .media figure figcaption {
	color: #555;
	font-size: .85rem;
	line-height: 1.25;
	padding: 0 .5rem;
}
.comparison .comparison_media .media figure img {
    object-fit: contain;
    height: 100%;
    overflow: hidden;
	transition: .3s all;
}
.no-touch .comparison .comparison_media a:hover .media:hover figure img {
	opacity: .85;
}
.comparison .comparison_media .media span.placeholder {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #f4f5f9;
	width: 100%;
	height: 100%;
	border-radius: .5rem;
	font-style: italic;
}
.comparison .comparison_media button {
	margin: 0 auto;
}
.comparison .comparison_media .cta {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

/* comparison_media - compare_placeholder */
.comparison .comparison_media .compare_placeholder {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	/*background-color: #e7e8e7;*/
	background-image: radial-gradient(circle, var(--color-theme) 25%, rgba(255,255,255,.15) 100%);
	background-color: var(--color-theme);
	color: #fff;
	border-radius: .5rem;
	padding: 1.5rem 1rem;
}

/* comparison_media - dropdown */
.comparison .comparison_media .dropdown {
	position: relative;
	width: 100%;
	z-index: 1;
}
.comparison .comparison_media .dropdown .dropdown_search {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: .75rem;							
}
.comparison .comparison_media .dropdown .dropdown_search label {
	font-weight: 600;
	font-size: 1.15rem;
}
.comparison .comparison_media .dropdown .dropdown_search input {
	height: 48px;
	padding: 0 1rem;
	border: 0;
	outline: 0;
	border-radius: 24px;
	font-size: .875rem;
	z-index: 2;
	border-bottom: 1px solid transparent;
}
.comparison .comparison_media .dropdown.active .dropdown_search input {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom: 1px solid #bebebe;
}

/* search */
.search {
	flex: 1 0 auto;
	position: relative;
	max-width: 650px;
	z-index: 10;
	font-size: .85rem;
}
.search .search_input_box {
	display: flex;
	align-items: center;
	gap: .5rem;
	height: 48px;
	border-radius: 24px;
	background: #f4f5f9;
	padding: 0 1rem;
}
.search .search_input_box .search_icon {
	height: 20px;
	fill: initial;
}
.search .search_input_box .search_input {
	height: 38px;
	width: calc(100% - 1rem);
	background: none;
	padding: 0 .5rem;
	border: 0;
	outline: 0;
	font-size: .925rem;
}
.search.active .search_input_box {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	background: #fff;
}
.search.active .search_input_box:after {
    content: '';
    display: block;
    position: absolute;
	left: 1rem;
	right: 1rem;
    bottom: 0;
    height: 1px;
    width: 100%;
	max-width: calc(100% - 2rem);
    background: #bebebe;
}
.search .search_placeholder {
	padding: 1rem;
	text-align: center;
	border-left-radius
}

/* shadow */
.shadow {
	background-color: rgba(52, 52, 52, 0.7);
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	overflow: hidden;
	position: fixed;
	transition: visibility 0ms linear .2s, opacity .2s ease;
	visibility: hidden;
	z-index: 9;
}
.shadow.active {
	opacity: 1;
	visibility: visible;
}

/* result_list */
.result_list {
	position: absolute;
	max-height: 500px;
	overflow-y: auto;
	left: 0;
	right: 0;
	background: #fff;
	border-bottom-left-radius: 24px;
	border-bottom-right-radius: 24px;
}
.result_list ul {
	list-style: none;
	padding: 0 0 1rem 0;
	margin: 0;
}
.result_list ul li {
	padding: .25rem .25rem .25rem 1rem;
}
.result_list ul li:last-of-type {
	border-bottom: 1px solid transparent;
}
.no-touch .result_list ul li:hover {
	background: #f4f5f9;
}
.result_list ul li a {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	text-decoration: none;
	color: initial;
	font-size: .85rem;
}
.result_list ul li a .list_media {
	flex: 1 0 50px;
	height: 50px;
	width: 50px;
	border-radius: .25rem;
}
.result_list ul li a .list_media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}
.result_list ul li .list_info {
	flex: 1 1 100%;
	display: flex;
	flex-direction: column;
	font-size: .75rem;
}
.result_list ul li a .list_info .list_attributes {
	color: #747a84;
	
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* vs_line */
.vs_line {
	background: #bebebe;
    width: 1px;
    bottom: 0;
    height: 100%;
    left: 50%;
    position: absolute;
}
.vs_line span {
	background-color: #fff;
	border: 1px solid #bebebe;
	box-shadow: 0 0 10px #bebebe;
	border-radius: 50%;
	color: #616161;
	font-weight: 700;
	font-size: 1.15rem;
	top: calc(50% - 26px);
	left: -26px;
	position: absolute;
	text-align: center;
	width: 50px;
	height: 50px;
	line-height: 50px;
	z-index: 2;
}
.vs_line.small span {
	border: 0;
	top: calc(50% - 15px);
	left: -15px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	font-size: .75rem;
}

/* comparison_summary */
.comparison .comparison_summary {
	padding: 2rem 0;
}
.comparison .comparison_summary h3 {
	font-size: initial;
}
.comparison .comparison_summary ul.winner {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.comparison .comparison_summary ul.winner li {
	margin-bottom: .75rem;
	padding-left: 1rem;
	position: relative;
	/*color: #616161;*/
}
.comparison .comparison_summary ul.winner li:before {
	content: "\2713";
	font-weight: 100;
	left: 0;
	position: absolute;
	color: #3c59fc;
}
.comparison .comparison_summary ul.winner li em {
	font-size: .85rem;
}
.comparison .comparison_summary ul.winner li em.winner_value {
	font-weight: 700;
}
.comparison .comparison_summary ul.winner li span.vs {
	font-size: .85rem;
	padding: 0 .15rem 0 .2rem;
}

/* price_comparison */
/*
.price_comparison {
	display: flex;
	padding: 2rem 0;
}
.price_comparison .offer {
	cursor: pointer;
	margin: 0 .25rem;
}
.price_comparison .offer a {
	text-decoration: none;
}
.price_comparison .offer:nth-of-type(2n+1) {
	background-color: #f4f5f9;
}
.price_comparison .offer.bestoffer {
	font-weight: bold;
	margin: 0;
	box-shadow: 0 0 .75rem rgba(0,0,0,.125);
}
.no-touch .price_comparison .offer:hover .title {
	text-decoration: underline;
}
.price_comparison .offer .inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem .75rem;
	gap: 0.75rem;
	color: initial;
	font-size: .85rem;
}
.price_comparison .offer .inner .title {
	flex: 1 1 100%;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.price_comparison .offer .inner .logo {
	flex: 1 0 100px;
	display: flex;
	align-items: center;
}
.price_comparison .offer .inner .logo img {
	height: 22px;
	max-width: 100px;
	width: auto;
	object-fit: contain;
}
.price_comparison .offer .inner .price {
	flex: 1 0 150px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
}
.price_comparison .offer.best .inner .price {
	font-weight: bold;
	font-size: .925rem;
}
*/
/*
.price_comparison .offers-section {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
.price_comparison .offer {
	display: flex;
	flex-direction: column;
	border: 1px solid #ebeff5;
	border-radius: .5rem;
	box-shadow: 0 2px 6px 0 rgba(32, 76, 136, 0.15);
}
.no-touch .price_comparison .offer:hover {
	box-shadow: 0 4px 8px 0 rgba(32, 76, 136, 0.15),0 0 1px 0 rgba(32, 76, 136, 0.15);
}
.price_comparison .offer .top {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #ebeff5;
	padding: .75rem 1.25rem;
}
.price_comparison .offer .top .logo {
	display: flex;
	height: 22px;
	max-width: 100px;
}
.price_comparison .offer .top .logo img {
	object-fit: contain;
	height: 100%;
	width: 100%;
}
.price_comparison .offer .bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .5rem 1.25rem;
	font-size: .85rem;
}
.price_comparison .offer .bottom .title {
	flex: 1 1 0;
	font-weight: 500;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.no-touch .price_comparison .offer:hover a .bottom .title {
	text-decoration: underline;
}
.price_comparison .offer .bottom .details {
	flex: 0 1 auto;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.price_comparison .offer .bottom .details .shipping {
	color: #747a84;
	font-weight: 500;
	line-height: normal;
	padding-right: .5rem;
}
.price_comparison .offer .bottom .details .price {
	min-width: 75px;
	text-align: right;
	font-weight: 700;
	font-size: 1.15rem;
	color: initial;
}
.price_comparison .offer .bottom .details .cta {
	display: flex;
	align-items: center;
}
.price_comparison .offer .bottom .details .cta svg {
	height: 24px;
	width: 24px;
	fill: #0c51c1;
}


/* variant_selector - price_comparison
.price_comparison .variant_selector {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
}
.price_comparison .variant_selector input {
	display: none;
}
.price_comparison .variant_selector label {
	padding: .5rem .75rem;
	box-shadow: 0 0 0 1px inset #d1d8e3;
	border-radius: .5rem;
	cursor: pointer;
	font-size: .875rem;
	text-transform: capitalize;
	transition: all 0.3s ease;
}
.no-touch .price_comparison .variant_selector label:hover {
	background-size: 100%;
	transition: background 0s ease 0s, transform 300ms ease 0s;
	transform: scale(0.95);
	box-shadow: 0 0 0 1px inset #0e0e0f;
}
.price_comparison .variant_selector label.active {
	box-shadow: 0 0 0 2px inset #0e0e0f;
}
*/

/* offers_today */
.offers_today.sticky {
	position: sticky;
	top: 1rem;
}

/* price_comparison */
.price_comparison {
	padding: 2rem 0;
}

/* offers_list */
.offers_list {
	display: flex;
	flex-direction: column;
	padding-top: 1rem;
	gap: 1rem;
}
.offers_list .variant_selector {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}
.offers_list .variant_selector input {
	display: none;
}
.offers_list .variant_selector label {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-direction: column;
	gap: .5rem;
	box-shadow: 0 0 0 1px inset #d1d8e3;
	border-radius: .25rem;
	cursor: pointer;
	font-size: .825rem;
	transition: all .3s ease;
	/* height: 70px;
	width: 70px;*/
	width: 85px;
	padding: .5rem;
}
.no-touch .offers_list .variant_selector label:hover {
	background-size: 100%;
	transition: background 0s ease 0s, transform 300ms ease 0s;
	transform: scale(0.95);
	box-shadow: 0 0 0 1px inset #0e0e0f;
}
.offers_list .variant_selector label.active {
	box-shadow: 0 0 0 2px inset #0e0e0f;
}
.offers_list .variant_selector label .media {
	width: 45px;
	height: 45px;
}
.offers_list .variant_selector label .media img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}
.offers_list .offers-section {
	border-top: 1px solid #bebebe;
	border-bottom: 1px solid #bebebe;
}
.offers_list .offers-section a.offer {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: .5rem 0;
	border-bottom: 1px dotted #bebebe;
	color: initial;
	text-decoration: none;
	color: initial;
}
.no-touch .offers_list .offers-section a.offer:hover {
	background: rgba(40,63,75,.025);
}
.offers_list .offers-section a.offer:last-of-type {
	border: 0;
}
.offers_list .offers-section a.offer .media {
	flex: 0 0 40px;
	height: 40px;
	width: 40px;
	text-align: center;
}
.offers_list .offers-section a.offer .media img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}
.offers_list .offers-section a.offer .partner_logo {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	background: rgba(51, 53, 54, 0.05);
}
.offers_list .offers-section a.offer .partner_logo img {
	object-fit: contain;
	height: 100%;
	width: 100%;
	border-radius: 50%;
}
.offers_list .offers-section a.offer .title_offer {
	flex: 1;
	font-size: .925rem;
	color: #0c51c1;

	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.no-touch .offers_list .offers-section a.offer:hover .title_offer {
	text-decoration: underline;
}
.offers_list .offers-section a.offer .shipping {
	color: #747a84;
	font-size: .825rem;
}
.offers_list .offers-section a.offer .final_price {
	font-weight: 600;
}


/* trending_comparisons */
.trending_comparisons {
	display: flex;
	padding: 2rem 0;
}
.trending_comparisons .trending_comparison {
	position: relative;
}
.trending_comparisons .trending_comparison:after {
    content: '';
    display: block;
    position: absolute;
    width: 1px;
    /*background: #bebebe;
    height: 40px;
    top: calc(50% - 20px);*/
	background: #e7e8e7;
	height: 100%;
	top: 0;
    right: -.5rem;
}
.trending_comparisons .trending_comparison:last-of-type:after {
    content: unset;
}
.trending_comparisons .trending_comparison .media {
	position: relative;
}
.trending_comparisons .trending_comparison .media figure {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0;
}
.trending_comparisons .trending_comparison .media figure img {
	object-fit: contain;
	max-width: 50%;
	height: 50px;
}
.trending_comparisons .trending_comparison .media figure figcaption {
	width: 100%;
	text-align: center;
	margin-top: .25rem;
	font-size: .825rem;
	line-height: initial;
	color: #616161;
}
.trending_comparisons .trending_comparison .media .vs {
	position: absolute;
	top: 25px;
	left: calc(50% - 12.5px);
	width: 25px;
	height: 25px;
	background: #fff;
	font-size: .875rem;
	font-weight: bold;
	border-radius: 50%;
	line-height: 25px;
	text-align: center;
}

/* comparison_attributes  */
.comparison_attributes {
	padding: 2rem 0;
}
.comparison_attributes .attributes {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}
.comparison_attributes .attributes .attribute {
	display: flex;
	flex-direction: column;
	border: 1px solid #e7e8e7;
	border-radius: .5rem;
	padding: 1rem;
	font-size: .85rem;
	line-height: 1.5rem;
	background-color: #fff;
}
.comparison_attributes .attributes .attribute .attribute_title {
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: .7px;
	margin-bottom: .75rem;
}
.comparison_attributes .attributes .attribute ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.comparison_attributes .attributes .attribute ul li {
	padding: .5rem 0;
	color: #616161;
}
.comparison_attributes .attributes .attribute ul li .label {
	padding-bottom: .5rem;
}
.comparison_attributes .attributes .attribute ul li .result {
	display: flex;
	align-items: center;
	height: 32px;
}
.comparison_attributes .attributes .attribute ul li .result span {
	height: 32px;
	line-height: 32px;
	padding: 0 .5rem;
	border-radius: .25rem;
}
.comparison_attributes .attributes .attribute ul li .result.product1 span {
	background: var(--color-product1);
}
.comparison_attributes .attributes .attribute ul li .result.product2 span {
	background: var(--color-product2);
}
.comparison_attributes .attributes .attribute ul li .result span span.icon {
	padding: 0 .25rem 0 0;
}
.comparison_attributes .attributes .attribute ul li span {
	margin-right: .25rem;
}
.comparison_attributes .attributes .attribute ul li span.no {
	color: #ff5631;
}
.comparison_attributes .attributes .attribute ul li span.yes {
	color: #26de88;
}
.comparison_attributes .attributes .attribute ul li .unknown {
	line-height: 32px;
	font-style: italic;
}
/*.comparison_attributes .attributes .attribute ul li .unknown,
.comparison_attributes .attributes .attribute ul li .unknown a {
	border-bottom: 1px dotted #161616;
	color: inherit;
	font-style: italic;
}
.comparison_attributes .attributes .attribute ul li .unknown a span.icon svg {
	width: 14px;
	height: 14px;
	fill: #616161;
}*/
.comparison_attributes .attributes .attribute .facts {
	margin-top: 1rem;
	background: #f4f5f9;
	padding: .5rem;
	border-radius: .25rem;
}
.comparison_attributes .attributes .attribute .attribute_description {
	max-height: 40px;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	margin-top: 1rem;
}
.comparison_attributes .attributes .attribute .attribute_description::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 20px;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
	display: block;
	opacity: 1;
}
.comparison_attributes .attributes .attribute .attribute_description.expanded {
	max-height: 500px;
}
.comparison_attributes .attributes .attribute .attribute_description.expanded::after {
	opacity: 0;
}

/* spotlight */
.spotlight {
	position: fixed;
	z-index: 9;
	top: 0;
	right: 0;
	left: 0;
	max-width: 100vw;
	padding: .25rem 0;
	background-color: #fff;
	box-shadow: 0 0 1.5rem rgba(0,0,0,.125);
	transition: transform 0.5s cubic-bezier(.19,1,.22,1);
	transform: translateY(-100%);
}
.spotlight.show { 
	transform: translateY(0);
}
.spotlight.hide {
	transform: translateY(-100%);
}
.spotlight .container {
	padding: 0;
	width: 100%;
}
.spotlight .spot {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .5rem;
	line-height: normal;
}
.spotlight.sidebyside .column:nth-of-type(1) .spot {
	padding: .5rem 25px .5rem 0;
}
.spotlight.sidebyside .column:nth-of-type(2) .spot {
	padding: .5rem 0 .5rem 25px;
}
.spotlight .spot .media {
	flex: 0 0 50px;
	height: 50px;
	width: 50px;
}
.spotlight .spot .media img {
	object-fit: contain;
	height: 100%;
	width: 100%;
}
.spotlight .spot .title {
	flex: 1 1 auto;
	font-size: .95rem;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.spotlight .spot .offer {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .75rem;
}
.spotlight.sidebyside .spot .offer {
	flex-direction: column;
	gap: 0;
}
.spotlight .spot .offer .best_offer {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .25rem;
	width: 100%;
}
.spotlight .spot .offer .best_offer span.best_final_price {
	font-weight: 700;
	font-size: 1.5rem;
}
.spotlight .spot .offer .best_offer span.saving {
	font-size: .725rem;
	background: #fd0;
	font-weight: 700;
	padding: .2rem .35rem .1rem;
	text-transform: uppercase;
}
/*
.spotlight .spot .offer .offer_discount {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .25rem;
	width: 100%;
	font-size: .725rem;
}
.spotlight .spot .offer .offer_discount span.saving {
	background: #fd0;
	font-weight: 700;
	padding: .2rem .15rem .1rem;
	width: 100%;
	text-align: center;
	text-transform: uppercase;
}
.spotlight .spot .offer .offer_discount span.highest {
	text-align: center;
}
.spotlight.sidebyside .spot .offer .offer_discount span.highest {
	display: none;
}
*/
.spotlight .spot .cta a {
	text-decoration: none;
}

/* content */
.content {
	line-height: 1.75rem
}
.content .chart_responsive {
	margin: 1rem 0;
}
.content .table_responsive {
	margin: 1rem 0;
}
.content figure {
	display: flex;
	flex-flow: column;
	width: 100%;
	margin: 1rem 0;
	aspect-ratio: 16/9;
	position: relative;
}
.content figure figcaption,
.figcaption {
	color: #666;
	font-size: .85rem;
	line-height: 1.25;
	/*padding: .5rem .5rem 0;*/
	padding-top: .5rem;
	position: relative;
}
/*
.content figure figcaption:before {
	content: '';
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggc3Ryb2tlPSIjMzM1YWI5IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0ibTE4IDE1LTUuOC01Ljh2MGEuMy4zIDAgMCAwLS40IDB2MEw2IDE1Ii8+PC9zdmc+);
	background-repeat: no-repeat;
	background-color: #fff;
	background-position: top;
	position: absolute;
	top: -14px;
	width: 30px;
	height: 15px;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
}
*/
.content figure img,
.content figure video {
	height: 100%;
	width: 100%;
	/*border-radius: .5rem;*/
}

/* figure image */
.content figure.image img {
	object-fit: cover;
}
.content figure.contain img {
	object-fit: contain;
}
/* figure video */
.content figure.video video {
	object-fit: contain;
	cursor: pointer;
}
.content figure.video:after {
    content: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0MDguMjIxIDQwOC4yMjEnPjxwYXRoIGZpbGw9JyNmZmZmZmYnIGQ9J00yMDQuMTEgMEM5MS4zODggMCAwIDkxLjM4OCAwIDIwNC4xMTFjMCAxMTIuNzI1IDkxLjM4OCAyMDQuMTEgMjA0LjExIDIwNC4xMSAxMTIuNzI5IDAgMjA0LjExLTkxLjM4NSAyMDQuMTEtMjA0LjExQzQwOC4yMjEgOTEuMzg4IDMxNi44MzkgMCAyMDQuMTEgMHptODIuNDM3IDIyOS45NzEtMTI2LjM2OCA3Mi40NzFjLTE3LjAwMyA5Ljc1LTMwLjc4MSAxLjc2My0zMC43ODEtMTcuODM0VjE0MC4wMTJjMC0xOS42MDIgMTMuNzc3LTI3LjU3NSAzMC43ODEtMTcuODI3bDEyNi4zNjggNzIuNDY2YzE3LjAwNCA5Ljc1MiAxNy4wMDQgMjUuNTY2IDAgMzUuMzJ6Jy8+PC9zdmc+);
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    height: 125px;
    width: 125px;
    transform: translate(-50%,-50%);
    opacity: .85;
    pointer-events: none;
}
.no-touch .content figure.video:hover:after {
    opacity: .95;
    pointer-events: none;
}
.content figure.video.playing:after {
    content: none;
}

/* Youtube container + embed */
.youtube {
	margin: 1rem 0;
}
.youtube .youtube-container {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%; /* 16:9 aspect ratio */
	height: 0;
	overflow: hidden;
}
.youtube .youtube-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* figure widget */
.content figure.widget {
	float: right;
	display: table;
	height: 200px;
	max-width: 300px;
	margin: 0 0 0 1rem;
}
.content figure.widget a {
	text-decoration: none;
}
.content figure.widget img {
	height: 200px;
	width: 100%;
	object-fit: contain;
}
.no-touch .content figure.widget:hover img {
	opacity: .85;
}
.content figure.widget figcaption {
	text-align: center;
}


/* chart_responsive */
.chart_responsive {
	position: relative;
	height: 350px;
	max-width: 840px;
}

/* section */
section {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
section.ghost {
	background-color: #f4f5f9;
}
section.ghost:before {
	content: "";
	box-shadow: inset 15px 45px 15px -45px rgba(32,76,136,.15);
	height: 100%;
	left: 0;
	right: 0;
	margin-top: -2rem;
	position: absolute;
}

/* container */
.container {
	max-width: 1200px;
	width: calc(100% - 1rem);
	margin: auto;
	padding: 0 .5rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.container.row {
	flex-direction: row;
	align-items: center;
}

/*table */
.table_responsive {
	display: block;
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
table {
	width: 100%;
	border-collapse: collapse;
}
table caption {
	caption-side:bottom;
	text-align: right;
	font-size: .85rem;
	padding: .25rem .25rem 0;
	font-style: italic;
}
table tbody {
	border-top: 1px solid rgb(21,22,24);
	border-bottom: 1px solid rgb(21,22,24);
}
table thead tr th,
table tbody tr td {
	text-align: right;
	padding: .25rem;
}
table thead tr th.title,
table tbody tr td.title {
	text-align: left;
	min-width: 40%;
}
table tbody tr td.title span {
	color: #0c51c1; 
	text-decoration: underline;
	
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
table tbody tr.clickable {
	cursor: pointer;
}
.no-touch table tbody tr.clickable:hover .media img {
	opacity: .85;
}
.no-touch table tbody tr.clickable:hover .title span {
	text-decoration: none;
}
table tbody tr td.media {
	width: 50px;
	height: 40px;
}
table tbody tr td.media img {
	object-fit: contain;
	height: 100%;
	width: 100%;
}

/* footer */
footer {
	
}
footer a {
	color: inherit;
}
footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
footer .top {
	padding: 1.5rem calc(50% - 37.5rem);
	background: #00040b;
	color: #fff;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	text-align: center;
}
footer .top .logo {
	flex: 1 0 100%;
}
footer .top .contacts {
	flex: 1 0 100%;
	/*padding: 1.5rem 0;*/
}
footer .top .copyright {
	flex: 1 0 100%;
	color: #d3d3d3;
	font-size: .85rem;
}

footer .bottom {
    padding: 1.5rem calc(50% - 37.5rem);
    font-size: .85rem;
    font-weight: 400;
    display: flex;
    align-items: center;
	line-height: initial;
}
footer .bottom img {
    height: 25px;
    width: auto;
}

/* pbar */
.pbar {
	width: 100%;
	min-width: 100px;
	height: 32px;
	line-height: 32px;
	box-shadow: inset 0 2px 4px 0 rgba(0,0,0,.06);
	border-radius: .25rem;
	overflow: hidden;
	background-color: #f4f5f9;
	position: relative;
}
.pbar .label {
	display:none;
	
	line-height: inherit;
	padding-left: .35rem;
	font-size: .75rem;
}
.pbar .value_pct {
	height: 100%;
	/*background-color: #288356;*/
	background-color: var(--color-theme);
}
.pbar .value_pct.product1 {
	background-color: var(--color-product1);
}
.pbar .value_pct.product2 {
	background-color: var(--color-product2);
}
.pbar .avg_value {
	position: absolute;
	top: 0;
	height: 100%;
	max-width: 100%;
}
.pbar .avg_value .bar {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 2px;
	background-color: #005393;
	border-radius: 50%;
}

/* modal */
/*
.modal {
    display: none;
	position: fixed;
	justify-content: center;
	align-items: center;
    z-index: 9;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,.5);
}
.modal .modal_content {
    background-color: #fefefe;
    padding: 3rem 2rem;
    border: 1px solid #888;
	width: 100%;
	max-width: 650px;
	border-radius: .5rem;
	position: relative;
}
.modal .modal_content.narrow {
	max-width: 350px;
}
.modal .close {
    position: absolute;
	top: .5rem;
	right: 1rem;
    font-size: 2rem;
    font-weight: 900;
}
.modal .close:hover,
.modal .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}
.modal_content .top {
	text-align: center;
	padding-bottom: 2rem;
}
.modal_content .top h2 {
	padding-bottom: 1rem;
}
.modal_content form {
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: 1rem;
}
.modal .modal_content .change {
	text-align: center;
	padding-top: 1rem;
	border-top: 1px solid #ccc;
}
.modal .modal_content .change a {
	text-decoration: underline;
}
*/

/* grid */
.grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}
.grid.col5 {
	grid-template-columns: repeat(5, 1fr);
}
.grid a {
	color: initial;
	text-decoration: none;
}

/* grid reviews */
.grid.reviews {
	padding-bottom: 1rem;
}
.grid.reviews .card {
	display: flex;
	flex-direction: column;
	text-align: center;
	gap: .5rem;
}
.grid.reviews .card .media img {
	border-radius: .5rem;
}

/* grid products */
.grid.products .card .inner {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	height: 100%;
	background: #fefefe;
	border-radius: .5rem;
	box-shadow: 0 2px 6px 0 rgba(32, 76, 136, 0.15);
}
.grid.products .card .inner .media {
	padding: .5rem .75rem 0;
	display: flex;
	align-items: center;
	height: 150px;
	position: relative;
}
.no-touch .grid.products .card .inner .media {

}
.grid.products .card .inner .media img {
	object-fit: contain;
	width: 100%;
	height: 140px;
	transition: transform 300ms,opacity 200ms ease-in-out;
}
.no-touch .grid.products .card a.product_link:hover .media img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}
.grid.products .card .inner .data {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	padding: 0 .5rem 0;
}
.grid.products .card .inner .data .title {
	font-size: .875rem;
	font-weight: 700;
	
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.grid.products .card .inner .data .type {
	font-size: .85rem;
	color: #4a5568;
	font-weight: 300;
	text-transform: capitalize;
}
.grid.products .card .inner .data .attributes {
	font-size: .825rem;
	color: #747a84;
	height: 40px;
	
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.grid.products .card .inner .data .attributes ul {
	list-style: none;
	padding: 0;
	margin: .5rem 0 0;
}
.grid.products .card .inner .data .attributes li {
	margin-bottom: .25rem;
}
.grid.products .card .inner .data .attributes li:before {
	content: '\2713';
	color: #009e11;
	margin-right: .25rem;
}
.grid.products .card .inner .best_offer {
	display: flex;
	flex-direction: column;
	padding: 0 .5rem .5rem;
	margin-top: auto;
}
.grid.products .card .inner .best_offer .pricing {	
	padding-bottom: .25rem;
}
.grid.products .card .inner .best_offer .pricing span {
	font-size: 1.15rem;
	font-weight: 700;
}
.grid.products .card .inner .best_offer .pricing small {
	color: #747a84;
}

/* grid guide */
.grid.products .card.guide_link {
    grid-column: 2 / 4;
    grid-row: 3;
}
.grid.products .card.guide_link .inner a {
	display: flex;
	justify-content: center;
	background: #f0ebff;
	color: #8d79c6;
	font-size: 1.05rem;
	height: 100%;
	margin: .5rem;
	padding: 1rem .5rem;
	border-radius: .25rem;
}
.grid.products .card.guide_link .inner a .view_guide {
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: .25rem;
	text-align: center;
}
.grid.products .card.guide_link .inner a .view_guide span {
	display: block;
	font-size: 1.25rem;
	color: #4f4178;
}
.grid.products .card.guide_link .inner a .view_guide .btn {
	margin-top: 1rem;
}

/* metas */
.metas {
	display: flex;
	gap: .5rem;
	align-items: center;
	font-size: .85rem;
}
.metas a {
	text-decoration: underline;
}
.no-touch .metas a:hover {
	text-decoration: none;
}
.metas .creator_image {
	height: 50px;
	width: 50px;
	border-radius: 50%;
	overflow: hidden;
}
.metas .creator_image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.metas .info {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	height: 100%;
}

/* guide */
.guide {
	background-color: #f0ebff;
	border-radius: .5rem;
	padding: 1.5rem;
	margin-top: 1rem;
	position: relative;
}
.guide h2 {
	font-size: initial;
	font-weight: initial;
	color: #8d79c6;
	margin-bottom: .25rem;
}
.guide .skipit {
	margin-top: .5rem;
	font-size: .875rem;
}
.guide .progress {
	color: #8d79c6;
}
.guide .question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}
.guide .question .question_title {
	flex: 0 1 auto;
	color: #4f4178;
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.5rem;
}
.guide .question .options {
	flex: 1 0 auto;
	
}
.guide .question .options form {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
}
.guide .question .options form .option input {
	display: none;
}

/* guidance */
.guidance {
	background-color: #f0ebff;
	border-radius: .5rem;
	padding: .75rem 1.5rem;
	color: #4f4178;
	font-size: .925rem;
}

/* product_grid */
section.product_grid {
	padding: 2rem 0;
}

/* badge_product_ranking */
.badge_product_ranking {
	position: absolute;
	right: .5rem;
	top: .5rem;
	display: flex;	
	background: #fff;
	border-radius: 50%;
	cursor: pointer;
}
.comparison .badge_product_ranking {
	top: 2rem;
}
.comparison .badge_product_ranking.left {
	right: unset;
	left: 1rem;
}
.badge_product_ranking .circular_progress {
	--size: 60px;
	--half-size: calc(var(--size) / 2);
	--stroke-width: 6px;
	--radius: calc((var(--size) - var(--stroke-width)) / 2);
	--circumference: calc(var(--radius) * pi * 2);
	--dash: calc((var(--progress) * var(--circumference)) / 100);
	border: 2px solid #fff;
	border-radius: 50%;
}
.badge_product_ranking .circular_progress circle {
	cx: var(--half-size);
	cy: var(--half-size);
	r: var(--radius);
	stroke-width: var(--stroke-width);
	fill: none;
	stroke-linecap: round;
}
.badge_product_ranking .circular_progress circle.bg {
	stroke: #e7e8e7;
}
.badge_product_ranking .circular_progress circle.fg {
	transform: rotate(-90deg);
	transform-origin: var(--half-size) var(--half-size);
	stroke-dasharray: var(--dash) calc(var(--circumference) - var(--dash));
	transition: stroke-dasharray 0.3s linear 0s;
	stroke: var(--color-theme);
}
.badge_product_ranking .circular_progress .score_lbl {
	fill: #616161;
	font-weight: bold;
}
.badge_product_ranking .circular_progress .score_lbl.small {
	font-size: .65rem;
	font-weight: 600;
}

.badge_product_ranking .tooltip {
	display: none;
	z-index: 8;
	position: absolute;
	top: 100%;
	left: 50%;
	width: 250px;
	transform: translateX(-50%);
	background-color: #fff;
	padding: .5rem;
	font-size: .725rem;
	border-radius: .25rem;
	box-shadow: 0 0 25px 0 #bebebe;
}
.no-touch .badge_product_ranking:hover .tooltip {
	display: block;
}

/* fieldset */
.filters {
	height: 100vh;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 1;
}
.filters form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-right: .5rem;
	height: 100%;
	overflow-y: scroll;
	scrollbar-color: transparent transparent;
	scrollbar-width: thin;
}
.filters form:hover {
	scrollbar-color: #d1d8e3 transparent;
}
.filters form fieldset {
    border: 0;
    padding: 0;
    margin: 0;
    font-size: .85rem;
	position: relative;
}
.filters form fieldset legend {
    font-weight: 600;
	padding: 0 0 .25rem 0;
}
.filters form fieldset .options {
    display: flex;
    flex-direction: column;
	gap: .5rem;
	transition: max-height 0.2s ease;
}
.filters form fieldset .options input {
	position: absolute;
	opacity: 0;
	z-index: -1;
}
.filters form fieldset .options label {
	display: flex;
	align-items: center;
	cursor: pointer;
	gap: .5rem;
}
.filters form fieldset .options label.disabled {
	color: #b2b9c3;
	cursor: not-allowed;
}
.filters form fieldset .options label span.round {
	border: 1px solid #d1d8e3;
	border-radius: 50%;
	height: 20px;
	width: 20px;
	transition: background-color 0.2s, border-color 0.2s;
}
.filters form fieldset .options label input[type="checkbox"]:disabled + span.round {
	background: #b2b9c3;
	border-color: #b2b9c3;
}
.filters form fieldset .options label input[type="radio"]:checked + span.round,
.filters form fieldset .options label input[type="checkbox"]:checked + span.round {
	border: 8px solid #112717;
	height: 6px;
	width: 6px;
}
.no-touch .filters form fieldset .options label:hover span.round {
	border: 1px solid #0e0e0f;
}
.filters form fieldset .options label span.label {
	display: flex;
	justify-content: space-between;
}
.filters form fieldset .options label span.count {
	color: #b2b9c3;
	font-size: .825rem;
	margin-left: auto;
}

/* poll */
.poll {
	background: var(--color-theme);
	padding: 1.5rem 1rem;
	border-radius: .5rem;
}
.poll h3 {
	font-size: .85rem;
	color: #fff;
	padding-bottom: .25rem;
	margin-bottom: 1rem;
	border-bottom: 1px solid #fff;
}
.poll .poll-container {
	display: flex;
	gap: .75rem;
	flex-direction: column;
}
.poll .poll-container .poll-question {
	flex-direction: column;
	gap: .75rem;
}
.poll .poll-container .poll-question .poll_title {
	font-size: 1rem;
	color: #fff;
	font-weight: 500;
}
.poll .poll-container .poll-question .option {
	
}
.poll .poll-container .poll-question .option input {
	display: none;
}
.poll .poll-container .poll-question .option label {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .95rem;
	background: #fff;
	border-radius: .5rem;
	padding: .75rem 1rem;
	cursor: pointer;
}
.poll .poll-container .poll-question .option label span {
	display: inline-block;
	height: 16px;
	width: 16px;
	border: 1px solid var(--color-theme);
	border-radius: 50%;
}
.no-touch .poll .poll-container .poll-question .option label:hover span {
	border: 6px solid var(--color-theme);
	width: 6px;
	height: 6px;
}
.poll .poll-container .poll_success {
	color: #fff;
}