/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%
}

body {
	margin: 0
}

main {
	display: block
}

h1 {
	font-size: 2em;
	margin: 0.67em 0
}

hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible
}

pre {
	font-family: monospace, monospace;
	font-size: 1em
}

a {
	background-color: transparent
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted
}

b,
strong {
	font-weight: bolder
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em
}

small {
	font-size: 80%
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sub {
	bottom: -0.25em
}

sup {
	top: -0.5em
}

img {
	border-style: none
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0
}

button,
input {
	overflow: visible
}

button,
select {
	text-transform: none
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText
}

legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal
}

progress {
	vertical-align: baseline
}

textarea {
	overflow: auto
}

[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto
}

[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit
}

details {
	display: block
}

summary {
	display: list-item
}

template {
	display: none
}

[hidden] {
	display: none
}

@font-face {
	font-family: 'AdelleRg';
	src: url("../fonts/adelle-regular.woff2") format("woff2"), url("../fonts/adelle-regular.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleLt';
	src: url("../fonts/adelle-lightitalic.woff2") format("woff2"), url("../fonts/adelle-lightitalic.woff") format("woff");
	font-weight: 300;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'AdelleLt';
	src: url("../fonts/adelle-light.woff2") format("woff2"), url("../fonts/adelle-light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleHv';
	src: url("../fonts/adelle-heavyitalic.woff2") format("woff2"), url("../fonts/adelle-heavyitalic.woff") format("woff");
	font-weight: 900;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'AdelleRg';
	src: url("../fonts/adelle-italic.woff2") format("woff2"), url("../fonts/adelle-italic.woff") format("woff");
	font-weight: normal;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'AdelleSB';
	src: url("../fonts/adelle-semibold.woff2") format("woff2"), url("../fonts/adelle-semibold.woff") format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleHv';
	src: url("../fonts/adelle-heavy.woff2") format("woff2"), url("../fonts/adelle-heavy.woff") format("woff");
	font-weight: 900;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleRg';
	src: url("../fonts/adelle-bold.woff2") format("woff2"), url("../fonts/adelle-bold.woff") format("woff");
	font-weight: bold;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleEB';
	src: url("../fonts/adelle-extrabolditalic.woff2") format("woff2"), url("../fonts/adelle-extrabolditalic.woff") format("woff");
	font-weight: bold;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'Adelle Rg';
	src: url("../fonts/adelle-bolditalic.woff2") format("woff2"), url("../fonts/adelle-bolditalic.woff") format("woff");
	font-weight: bold;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'AdelleEB';
	src: url("../fonts/adelle-extrabold.woff2") format("woff2"), url("../fonts/adelle-extrabold.woff") format("woff");
	font-weight: bold;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleSB';
	src: url("../fonts/adelle-semibolditalic.woff2") format("woff2"), url("../fonts/adelle-semibolditalic.woff") format("woff");
	font-weight: 600;
	font-style: italic;
	font-display: swap
}

@font-face {
	font-family: 'AdelleSans';
	src: url("../fonts/adellesans.woff2") format("woff2"), url("../fonts/adellesans.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: 'AdelleSansLight';
	src: url("../fonts/adellesans-light.woff2") format("woff2"), url("../fonts/adellesans-light.woff") format("woff");
	font-weight: 100;
	font-style: normal;
	font-display: swap
}

:root {
	--layoutMode: Mobile;
	--logoWith: 137px;
	--logoHeight: 29px;
	--headerHeight: calc(var(--logoHeight) * 3);
	--headerHeightHidden: 50px;
	--widthMin: 320px;
	--widthMax: 1920px;
	--widthInnerMax: 1140px;
	--pageMarginTop: 90px;
	--padding: 20px;
	--gutter: 30px;
	--colorRGB0: 250, 250, 250;
	--colorRGB1: 25, 25, 25;
	--colorRGB2: 40, 49, 62;
	--colorRGB3: 56, 178, 187;
	--colorRGB4: 238, 238, 238;
	--colorRGB5: 128, 128, 128;
	--colorRGB6: 64, 64, 64;
	--colorRGB7: 200, 64, 64;
	--colorRGB8: 0, 0, 0;
	--colorRGB9: 255, 255, 255;
	--colorRGB10: 196, 0, 0;
	--colorRGB11: 160, 255, 82;
	--color0: rgba(var(--colorRGB0));
	--color1: rgba(var(--colorRGB1));
	--color2: rgba(var(--colorRGB2));
	--color3: rgba(var(--colorRGB3));
	--color4: rgba(var(--colorRGB4));
	--color5: rgba(var(--colorRGB5));
	--color6: rgba(var(--colorRGB6));
	--color7: rgba(var(--colorRGB7));
	--color8: rgba(var(--colorRGB8));
	--color9: rgba(var(--colorRGB9));
	--color10: rgba(var(--colorRGB10));
	--color11: rgba(var(--colorRGB11));
	--textSize10: 10px;
	--textSize12: 12px;
	--textSize16: 16px;
	--textSize18: 18px;
	--textSize20: 20px;
	--textSize30: 30px;
	--textSize42: 42px;
	--textSize75: 75px;
	--textSizeBase: var(--textSize16);
	--fontNormal: AdelleLt;
	--fontBold: Bold;
	--fontLight: Light;
	--fontSans: AdelleSans;
	--fontSansLight: AdelleSansLight;
	--animF: .15s;
	--animN: .5s;
	--animS: 1.25s;
	--animXS: 2.5s;
	--timingBezier: cubic-bezier(0.785, 0.135, 0.15, 0.86);
	--colorRGBBg: var(--colorRGB0);
	--colorRGBFore: var(--colorRGB8);
	--colorBg: rgba(var(--colorRGBBg));
	--colorFore: rgba(var(--colorRGBFore))
}

@media all and (min-width: 768px) {
	:root {
		--layoutMode: Desktop;
		--pageMarginTop: 180px
	}
}

* {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent
}

.sr-only {
	position: absolute;
	overflow: hidden;
	padding: 0;
	margin: -0.0625rem;
	width: 0.0625rem;
	height: 0.0625rem;
	clip: rect(0, 0, 0, 0);
	border: 0
}

html {
	min-width: var(--widthMin);
	overflow-y: auto;
	overflow-x: hidden
}

html.fullscreen {
	height: 100vh;
	overflow: hidden
}

html.black {
	--colorRGBBg: var(--colorRGB8);
	--colorRGBFore: var(--colorRGB0);
	--colorBg: rgba(var(--colorRGBBg));
	--colorFore: rgba(var(--colorRGBFore))
}

ul.a1 {
  display: flex;
    list-style-type: none;
    justify-content: space-between;
}
ul.a1 li {
    text-align: center;
}

ul.a1 li h4 {
    font-size: 20px;
}
ul.a1 li p {
    font-size: 25px;
}
ul.a1 li span {
    font-size: 1rem;
}

body {
	background-color: var(--colorBg);
	font-family: var(--fontNormal);
	font-size: var(--textSizeBase);
	color: var(--colorFore);
	overflow-x: hidden;
	transition: background-color var(--animN) ease, color var(--animN) ease
}

:-ms-input-placeholder {
	color: var(--color6);
	opacity: 1
}

::placeholder,
::-ms-input-placeholder {
	color: var(--color6);
	opacity: 1
}

.scrollbar::-webkit-scrollbar {
	width: 8px !important;
	height: 8px !important
}

.scrollbar::-webkit-scrollbar-track {
	background-color: transparent !important;
	border-radius: 4px !important
}

.scrollbar::-webkit-scrollbar-thumb {
	background-color: var(--color5) !important;
	border-radius: 4px !important;
	outline: none !important
}

.text-negative {
	color: var(--colorBg)
}

main {
	min-height: 75vh;
	margin: 0 auto
}

a {
	color: inherit
}

.product-thumb {
	width: 100%;
	aspect-ratio: 360 / 340;
	display: flex;
	justify-content: center
}

.product-thumb img {
	width: 100%;
	height: auto
}

@-webkit-keyframes pulse {
	0% {
		background-color: transparent;
		transform: scale(1)
	}

	10% {
		background-color: var(--color0);
		transform: scale(1.1)
	}

	100% {
		background-color: transparent;
		transform: scale(1)
	}
}

@keyframes pulse {
	0% {
		background-color: transparent;
		transform: scale(1)
	}

	10% {
		background-color: var(--color0);
		transform: scale(1.1)
	}

	100% {
		background-color: transparent;
		transform: scale(1)
	}
}

.background-container {
	background-size: cover
}

.background-container img.background-image {
	display: none
}

.upper {
	display: flex;
	padding: 0 var(--padding);
	flex-direction: row;
	align-items: baseline;
	justify-content: center
}

.upper .left a {
	padding: 15px
}

.upper .left a::before {
	margin-right: 0
}

.upper .left a span {
	display: none
}

.upper .left,
.upper .right {
	width: 55px;
	flex-shrink: 0
}

.upper .center {
	max-width: 500px;
	text-align: center
}

.upper:has(.left) {
	justify-content: space-between
}

.title {
	font-size: var(--textSize20);
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: calc(var(--padding) * 3)
}

.subtitle {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	margin-bottom: calc(var(--padding) * 3)
}

@media all and (min-width: 768px) {
	.upper {
		max-width: var(--widthInnerMax);
		margin: 0 auto
	}

	.upper .left a {
		padding-right: 30px
	}

	.upper .left a span {
		display: block;
		margin-left: 18px
	}

	.upper .left,
	.upper .right {
		width: 150px
	}
}

.link {
	font-size: var(--textSize12);
	text-decoration: none;
	font-weight: 400;
	display: flex;
	align-items: center
}

.link:after {
	content: "";
	display: block;
	width: 24px;
	height: 24px;
	background-image: url(../images/hp-arrow.svg);
	background-repeat: no-repeat;
	background-size: center;
	margin-left: 6px;
	transition: transform var(--animN) ease
}

.link:hover:after {
	transform: translateX(6px)
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: var(--textSize12);
	font-weight: 400;
	text-decoration: none;
	border-radius: 27px;
	color: var(--colorFore);
	background: var(--colorBg);
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGBFore), 0.25);
	padding: 15px 30px;
	transition: background-color var(--animN) ease, color var(--animN) ease
}
.button1 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--textSize12);
    font-weight: 400;
    text-decoration: none;
    border-radius: 27px;
    color: var(--colorBg);
    background: var(--colorFore);
    box-shadow: 0px 0px 6px 0px rgba(var(--colorRGBFore), 0.25);
    padding: 15px 30px;
    transition: background-color var(--animN) ease, color var(--animN) ease;
}
.button.arrow-back {
	text-transform: uppercase;
	padding-left: 15px
}

.button.arrow-back:before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 18px;
	background-image: url(../fonts/arrow-back.svg);
	transition: filter var(--animN) ease
}

.button.selected,
.button:hover {
	color: var(--colorBg);
	background: var(--colorFore)
}
.button.selected,
.button1:hover {
	color: var(--colorFore);
	background: var(--colorBg)
}
.button.selected:before,
.button:hover:before {
	filter: invert(100%)
}
.button.selected:before,
.button1:hover:before {
	filter: invert(100%)
}
html.black .button.arrow-back:before {
	filter: invert(100%)
}

html.black .button.selected:before,
html.black .button:hover:before {
	filter: invert(0%)
}

*[data-component="header"] {
	--iconSize: 30px;
	--hamburgerInnerSize: calc(var(--iconSize) - 6px);
	--languagesWidth: 50px;
	--menuItemsHeight: 36px;
	--headerOpacity: .97;
	color: var(--color8);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	font-size: var(--textSize20);
	position: fixed;
	z-index: 11;
	width: 100%;
	min-width: var(--widthMin);
	top: 0;
	transition: top var(--animN) var(--timingBezier), background-color var(--animN) var(--timingBezier), color var(--animN) ease
}

*[data-component="header"] .inner,
*[data-component="header"] nav {
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="header"] a {
	text-decoration: none
}

*[data-component="header"] .hamburger {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 20px
}

*[data-component="header"] .hamburger .hamburger-inner {
	width: var(--hamburgerInnerSize);
	height: var(--hamburgerInnerSize);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	padding: 2px 0;
	cursor: pointer
}

*[data-component="header"] .hamburger .hamburger-inner div {
	width: 100%;
	height: 2px;
	border-radius: 2px;
	transition: width var(--animF) var(--timingBezier), background-color var(--animN) ease;
	background-color: var(--color1)
}

*[data-component="header"].open .hamburger .hamburger-inner div {
	width: 2px
}

*[data-component="header"] .serp-mobile li {
	display: flex;
	align-items: center;
	justify-content: center
}

*[data-component="header"] ul[data-id="main-menu"]>li>.level1-item {
	text-transform: uppercase
}

*[data-component="header"] ul[data-id="main-menu"] .level1-item span,
*[data-component="header"] ul[data-id="main-menu"] .level2-item span,
*[data-component="header"] ul[data-id="main-menu"] .level2-container li span,
*[data-component="header"] ul[data-id="service-menu"] .level1-item span,
*[data-component="header"] ul[data-id="service-menu"] .level2-container li span {
	display: block;
	padding: 8px 0
}

*[data-component="header"] ul[data-id="service-menu"]>li[data-idnode="4719"] {
	order: 5;
	margin-top: -5px
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages {
	order: 4;
	display: flex;
	flex-direction: row;
	margin-top: -8px
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages .level2-container ul {
	display: flex;
	flex-direction: row
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages .level2-container ul li {
	display: flex;
	align-items: center
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages .level2-container ul li:before {
	content: "|";
	opacity: .5;
	display: block;
	padding: 0 7px
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages .level2-container ul li a {
	display: block;
	opacity: .5
}

*[data-component="header"] ul[data-id="service-menu"]>li#languages span {
	text-align: center;
	color: #fff;
}

*[data-component="header"] ul[data-id="main-menu"],
*[data-component="header"] ul[data-id="service-menu"],
*[data-component="header"] ul.serp-mobile {
	list-style: none
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon,
*[data-component="header"] ul.serp-mobile>li .mm-icon {
	width: var(--iconSize);
	height: var(--iconSize);
	display: block;
	transition: filter var(--animN) ease
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon:before,
*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon:after {
	content: "";
	display: block;
	width: var(--iconSize);
	height: var(--iconSize);
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
	transition: opacity var(--animN) ease;
	background-size: 65%
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon:after {
	opacity: 0
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.magnifier:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.magnifier:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon.magnifier:before {
	background-image: url(../images/magnifier-lo.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.magnifier:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.magnifier:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon.magnifier:after {
	background-image: url(../images/magnifier-hi.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.download:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.download:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon.download:before {
	background-image: url(../images/download-lo.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.download:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.download:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon.download:after {
	background-image: url(../images/download-hi.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.dealers:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.dealers:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon.dealers:before {
	background-image: url(../images/dealers-lo.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.dealers:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.dealers:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon.dealers:after {
	background-image: url(../images/dealers-hi.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.profile:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.profile:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon.profile:before {
	background-image: url(../images/profile-lo.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.profile:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.profile:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon.profile:after {
	background-image: url(../images/profile-hi.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.shaping-surfaces,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.shaping-surfaces,
*[data-component="header"] ul.serp-mobile>li .mm-icon.shaping-surfaces {
	--iconSize: 35px
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.shaping-surfaces:before,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.shaping-surfaces:before,
*[data-component="header"] ul.serp-mobile>li .mm-icon.shaping-surfaces:before {
	background-image: url(../images/shaping-surfaces.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li .mm-icon.shaping-surfaces:after,
*[data-component="header"] ul[data-id="service-menu"]>li .mm-icon.shaping-surfaces:after,
*[data-component="header"] ul.serp-mobile>li .mm-icon.shaping-surfaces:after {
	background-image: url(../images/shaping-surfaces.svg)
}

*[data-component="header"] ul[data-id="main-menu"]>li.selected .mm-icon:before,
*[data-component="header"] ul[data-id="main-menu"]>li:hover .mm-icon:before,
*[data-component="header"] ul[data-id="service-menu"]>li.selected .mm-icon:before,
*[data-component="header"] ul[data-id="service-menu"]>li:hover .mm-icon:before,
*[data-component="header"] ul.serp-mobile>li.selected .mm-icon:before,
*[data-component="header"] ul.serp-mobile>li:hover .mm-icon:before {
	opacity: 0
}

*[data-component="header"] ul[data-id="main-menu"]>li.selected .mm-icon:after,
*[data-component="header"] ul[data-id="main-menu"]>li:hover .mm-icon:after,
*[data-component="header"] ul[data-id="service-menu"]>li.selected .mm-icon:after,
*[data-component="header"] ul[data-id="service-menu"]>li:hover .mm-icon:after,
*[data-component="header"] ul.serp-mobile>li.selected .mm-icon:after,
*[data-component="header"] ul.serp-mobile>li:hover .mm-icon:after {
	opacity: 1
}

*[data-component="header"] ul[data-id="main-menu"]>li>.level1-item span,
*[data-component="header"] ul[data-id="main-menu"]>li>div>ul>li>a span,
*[data-component="header"] ul[data-id="service-menu"]>li>.level1-item span,
*[data-component="header"] ul[data-id="service-menu"]>li>div>ul>li>a span,
*[data-component="header"] ul.serp-mobile>li>.level1-item span,
*[data-component="header"] ul.serp-mobile>li>div>ul>li>a span {
	transition: opacity var(--animN) ease;

}

*[data-component="header"] ul[data-id="main-menu"]>li>.level1-item span.off,
*[data-component="header"] ul[data-id="main-menu"]>li>div>ul>li>a span.off,
*[data-component="header"] ul[data-id="service-menu"]>li>.level1-item span.off,
*[data-component="header"] ul[data-id="service-menu"]>li>div>ul>li>a span.off,
*[data-component="header"] ul.serp-mobile>li>.level1-item span.off,
*[data-component="header"] ul.serp-mobile>li>div>ul>li>a span.off {
	display: block;
	height: var(--menuItemsHeight);
		
}


*[data-component="header"] ul[data-id="main-menu"]>li>.level1-item span.on,
*[data-component="header"] ul[data-id="main-menu"]>li>div>ul>li>a span.on,
*[data-component="header"] ul[data-id="service-menu"]>li>.level1-item span.on,
*[data-component="header"] ul[data-id="service-menu"]>li>div>ul>li>a span.on,
*[data-component="header"] ul.serp-mobile>li>.level1-item span.on,
*[data-component="header"] ul.serp-mobile>li>div>ul>li>a span.on {
	display: block;
	height: var(--menuItemsHeight);
	opacity: 0;
	margin-top: calc(var(--menuItemsHeight) * -1);
	font-weight: 700
}

*[data-component="header"] ul[data-id="main-menu"]>li.selected>a span.off,
*[data-component="header"] ul[data-id="main-menu"]>li.selected>.level1-item span.off,
*[data-component="header"] ul[data-id="main-menu"]>li.selected>.level2-container>ul>li.selected>a span.off,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>a span.off,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>.level1-item span.off,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>.level2-container>ul>li:hover>a span.off,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>a span.off,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>.level1-item span.off,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>.level2-container>ul>li.selected>a span.off,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>a span.off,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>.level1-item span.off,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>.level2-container>ul>li:hover>a span.off,
*[data-component="header"] ul.serp-mobile>li.selected>a span.off,
*[data-component="header"] ul.serp-mobile>li.selected>.level1-item span.off,
*[data-component="header"] ul.serp-mobile>li.selected>.level2-container>ul>li.selected>a span.off,
*[data-component="header"] ul.serp-mobile>li:hover>a span.off,
*[data-component="header"] ul.serp-mobile>li:hover>.level1-item span.off,
*[data-component="header"] ul.serp-mobile>li:hover>.level2-container>ul>li:hover>a span.off {
	opacity: 0
}

*[data-component="header"] ul[data-id="main-menu"]>li.selected>a span.on,
*[data-component="header"] ul[data-id="main-menu"]>li.selected>.level1-item span.on,
*[data-component="header"] ul[data-id="main-menu"]>li.selected>.level2-container>ul>li.selected>a span.on,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>a span.on,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>.level1-item span.on,
*[data-component="header"] ul[data-id="main-menu"]>li:hover>.level2-container>ul>li:hover>a span.on,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>a span.on,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>.level1-item span.on,
*[data-component="header"] ul[data-id="service-menu"]>li.selected>.level2-container>ul>li.selected>a span.on,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>a span.on,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>.level1-item span.on,
*[data-component="header"] ul[data-id="service-menu"]>li:hover>.level2-container>ul>li:hover>a span.on,
*[data-component="header"] ul.serp-mobile>li.selected>a span.on,
*[data-component="header"] ul.serp-mobile>li.selected>.level1-item span.on,
*[data-component="header"] ul.serp-mobile>li.selected>.level2-container>ul>li.selected>a span.on,
*[data-component="header"] ul.serp-mobile>li:hover>a span.on,
*[data-component="header"] ul.serp-mobile>li:hover>.level1-item span.on,
*[data-component="header"] ul.serp-mobile>li:hover>.level2-container>ul>li:hover>a span.on {
	opacity: 1
}

*[data-component="header"] ul[data-id="main-menu"] li .level2-container,
*[data-component="header"] ul[data-id="service-menu"] li .level2-container {
	overflow: hidden;
	transition: height var(--animN) var(--timingBezier), opacity var(--animN) var(--timingBezier)
}

*[data-component="header"] ul[data-id="main-menu"] li .level2-container ul,
*[data-component="header"] ul[data-id="service-menu"] li .level2-container ul {
	list-style: none
}

*[data-component="header"] ul[data-id="main-menu"] li.open .level2-container,
*[data-component="header"] ul[data-id="service-menu"] li.open .level2-container {
	height: var(--height);
	opacity: 1
}

*[data-component="header"] ul[data-id="main-menu"] li .level2-container {
	margin-left: 20px
}

*[data-component="header"] .inner {
	width: 100%;
	display: flex;
	align-items: center;
	width: 100%;
	height: var(--headerHeight);
	overflow: hidden;
	transition: height var(--animN) ease
}

*[data-component="header"] .inner .hamburger,
*[data-component="header"] .inner .serp-mobile {
	width: calc((100% - var(--logoWith)) / 2);
	z-index: 11
}

*[data-component="header"] .inner .serp-mobile {
	display: flex;
	flex-direction: row-reverse;
	padding-right: 20px
}

*[data-component="header"] .inner .logo {
	z-index: 11;
	transition: filter var(--animN) ease, transform var(--animF) ease
}

*[data-component="header"] .inner .logo a {
	display: block;
	height: var(--logoHeight)
}

*[data-component="header"] .inner .logo a img {
	transition: transform var(--animN) ease
}

*[data-component="header"] .inner nav {
	position: fixed;
	z-index: 10;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	opacity: 0;
	pointer-events: none;
	background-color: var(--colorBg);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding-top: var(--headerHeight);
	overflow-x: hidden;
	overflow-y: auto
}

*[data-component="header"] .inner nav>div[data-id="main-menu-container"] {
	padding: 0 20px;
	margin-bottom: 40px
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"] {
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	padding: 0 20px
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul {
	display: flex;
	flex-direction: column;
	align-items: flex-start
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul>li {
	padding: 6px;
	padding-left: 0;
	font-size: var(--textSize18)
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul>li a.graphic {
	display: none
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul>li a.textual {
	text-transform: uppercase;
	color: var(--color4);
	opacity: .5;
	transition: opacity var(--animN) ease
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul>li[data-idnode="4719"] a.textual {
	color: var(--color11);
	opacity: .5
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"]>ul>li a.textual:hover {
	opacity: 1
}

*[data-component="header"] .inner nav>div[data-id="service-menu-container"] ul li[data-idnode="4711"] {
	display: none
}

*[data-component="header"].animated .inner nav {
	transition: background-color var(--animN) ease, opacity var(--animN) ease
}

*[data-component="header"].hidden {
	--headerHeight: var(--headerHeightHidden)
}

*[data-component="header"].hidden .logo a img {
	transform: scale(90%)
}

*[data-component="header"].open .inner nav {
	opacity: 1;
	pointer-events: all
}

*[data-component="header"].menu-bg-white {
	background-color: var(--color0)
}

*[data-component="header"].menu-bg-white nav {
	background-color: var(--color0)
}

*[data-component="header"].menu-bg-black {
	background-color: var(--color8)
}

*[data-component="header"].menu-bg-black nav {
	background-color: var(--color8)
}

*[data-component="header"].menu-text-white {
	color: var(--color9)
}

*[data-component="header"].menu-text-white .hamburger .hamburger-inner div {
	background-color: var(--color9)
}

*[data-component="header"].menu-text-white .logo,
*[data-component="header"].menu-text-white .mm-icon:not(.shaping-surfaces) {
	filter: invert(100%);
	-webkit-filter: invert(100%)
}

    *[data-component="header"].top {
        background-color: #00000070 !important
    }

*[data-component="header"].top .level2-container {
	background-color: transparent !important
}

@media all and (min-width: 1024px) {
	*[data-component="header"] {
		--menuItemsHeight: 30px;
		--languagesWidth: 40px;
		font-size: 14px
	}

	*[data-component="header"] .inner {
		justify-content: center
	}

	*[data-component="header"] .inner .hamburger,
	*[data-component="header"] .inner .serp-mobile {
		display: none
	}

	*[data-component="header"] .inner .logo {
		transform: scale(110%)
	}
.logo img {
    object-fit: contain;
    height: 35px;
}
	*[data-component="header"] .inner nav {
		position: absolute;
		width: 100%;
		height: var(--headerHeight);
		opacity: 1;
		top: 0;
		left: auto;
		justify-content: space-between;
		align-items: center;
		pointer-events: all;
		background-color: transparent;
		padding-top: 0;
		flex-direction: row;
		overflow-x: visible;
		overflow-y: visible
	}

	*[data-component="header"] .inner nav>div:nth-child(1),
	*[data-component="header"] .inner nav>div:nth-child(2) {
		display: flex;
		justify-content: center;
		width: calc((100% - var(--logoWith)) / 2);
		padding: 0 4%
	}

	*[data-component="header"] .inner nav>div:nth-child(1)[data-id="main-menu-container"],
	*[data-component="header"] .inner nav>div:nth-child(2)[data-id="main-menu-container"] {
		padding: 0;
		margin-bottom: 0;
		justify-content: flex-start;
		padding-left: 20px
	}

	*[data-component="header"] .inner nav>div:nth-child(1)[data-id="service-menu-container"],
	*[data-component="header"] .inner nav>div:nth-child(2)[data-id="service-menu-container"] {
		padding: 0;
		justify-content: center;
		width: calc((100% - var(--logoWith)) / 2);
		justify-content: flex-end;
		padding-right: 20px
	}

	*[data-component="header"] .inner nav>div:nth-child(1)[data-id="service-menu-container"]>ul>li,
	*[data-component="header"] .inner nav>div:nth-child(2)[data-id="service-menu-container"]>ul>li {
		padding-left: 6px;
		font-size: var(--textSize14)
	}

	*[data-component="header"] .inner nav>div:nth-child(1)[data-id="service-menu-container"]>ul>li a.graphic,
	*[data-component="header"] .inner nav>div:nth-child(2)[data-id="service-menu-container"]>ul>li a.graphic {
		display: block
	}

	*[data-component="header"] .inner nav>div:nth-child(1)[data-id="service-menu-container"]>ul>li a.textual,
	*[data-component="header"] .inner nav>div:nth-child(2)[data-id="service-menu-container"]>ul>li a.textual {
		display: none
	}

	*[data-component="header"] .inner nav>div:nth-child(2) {
		padding: 0 10%
	}

	*[data-component="header"] .inner nav ul[data-id="main-menu"],
	*[data-component="header"] .inner nav ul[data-id="service-menu"] {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center
	}

	*[data-component="header"] .inner nav ul[data-id="main-menu"] {
		max-width: 350px
	}

	*[data-component="header"] .inner nav>div>ul[data-id="service-menu"] {
		max-width: 250px;
		width: 100%;
		flex-direction: row;
		align-items: center
	}

	*[data-component="header"] .inner nav>div>ul[data-id="service-menu"] li[data-idnode="4711"] {
		display: block
	}

	*[data-component="header"] .inner nav>div>ul[data-id="service-menu"] li[data-idnode="4711"] div {
		cursor: pointer
	}

        *[data-component="header"] .inner nav ul[data-id="main-menu"] > li > .level2-container,
        *[data-component="header"] .inner nav ul[data-id="service-menu"] > li > .level2-container,
        *[data-component="header"] .inner nav ul.serp-mobile > li > .level2-container {
            position: absolute;
            margin-left: 0;
            opacity: 0;
            background-color: #00000038 !important;
            pointer-events: none;
            height: auto;
            transform: translateX(calc(var(--padding) * -1));
            padding: 0 var(--padding) calc(var(--padding) / 2)
        }

	*[data-component="header"] .inner nav ul[data-id="main-menu"]>li:hover>.level2-container,
	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li:hover>.level2-container,
	*[data-component="header"] .inner nav ul.serp-mobile>li:hover>.level2-container {
		opacity: 1;
		pointer-events: all
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages {
		flex-direction: column;
		width: var(--languagesWidth);
		margin-top: 0
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages .level1-item {
		width: var(--languagesWidth)
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages .level2-container {
		margin-top: 30px
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages .level2-container ul {
		flex-direction: column
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages .level2-container ul li:before {
		content: none
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li#languages .level2-container ul li a {
		opacity: 1;
		width: var(--languagesWidth)
	}

	*[data-component="header"] .inner nav ul[data-id="service-menu"]>li[data-idnode="4719"] {
		margin-top: 0
	}

	*[data-component="header"].menu-bg-white {
		background-color: rgba(var(--colorRGB0), var(--headerOpacity))
	}

	*[data-component="header"].menu-bg-white nav {
		background-color: transparent
	}

	*[data-component="header"].menu-bg-white .level2-container {
		background-color: rgba(var(--colorRGB0), var(--headerOpacity))
	}

	*[data-component="header"].menu-bg-white:hover {
		background-color: var(--color0)
	}

	*[data-component="header"].menu-bg-white:hover .level2-container {
		background-color: var(--color0)
	}

	*[data-component="header"].menu-bg-black {
		background-color: rgba(var(--colorRGB8), var(--headerOpacity))
	}

	*[data-component="header"].menu-bg-black nav {
		background-color: transparent
	}

	*[data-component="header"].menu-bg-black .level2-container {
		background-color: rgba(var(--colorRGB8), var(--headerOpacity))
	}

	*[data-component="header"].menu-bg-black:hover {
		background-color: var(--color8)
	}

	*[data-component="header"].menu-bg-black:hover .level2-container {
		background-color: var(--color8)
	}
}

*[data-component="footer"] {
	background-color: var(--color1);
	color: var(--color0);
	font-size: var(--textSize12);
	font-weight: 400;
	line-height: 17px
}

*[data-component="footer"] h2,
*[data-component="footer"] h3 {
	font-size: var(--textSize12);
	font-weight: 400;
	text-transform: uppercase
}

*[data-component="footer"] h2 {
	margin-bottom: 20px;
	transition: border-color var(--animN) ease
}

*[data-component="footer"] .inner {
	max-width: var(--widthInnerMax);
	margin: 0 auto 30px;
	padding: 20px
}

*[data-component="footer"] .inner .element {
	display: flex;
	width: 100%;
	border-bottom: solid 1px var(--color5);
	font-size: var(--textSize12);
	font-weight: 400;
	text-transform: uppercase;
	padding: 12px 0 10px;
	margin: 0
}

*[data-component="footer"] .inner .element.arrow {
	cursor: pointer;
	justify-content: space-between
}

*[data-component="footer"] .inner .element.arrow::after {
	content: "";
	width: 15px;
	height: 15px;
	background-image: url(../images/arrow.svg);
	background-position: center;
	background-repeat: no-repeat
}

*[data-component="footer"] .inner .menu {
	margin-top: 80px;
	border-top: solid 1px var(--color5)
}

*[data-component="footer"] .inner .menu ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	text-transform: uppercase;
	margin-bottom: 20px
}

*[data-component="footer"] .inner .menu ul li.main {
	height: 0;
	overflow: hidden;
	transition: height var(--animN) var(--timingBezier)
}

*[data-component="footer"] .inner .menu ul li.main a {
	border-bottom: none
}

*[data-component="footer"] .inner .menu ul li a {
	display: block
}

*[data-component="footer"] .inner .menu ul li a:hover {
	text-decoration: none
}

*[data-component="footer"] .inner .menu.open h2 {
	border-bottom-color: transparent
}

*[data-component="footer"] .inner .menu.open .element.arrow:after {
	transform: rotate(180deg)
}

*[data-component="footer"] .inner .menu.open ul li.main {
	height: 40px
}

*[data-component="footer"] .inner .cols {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin-top: -20px
}

*[data-component="footer"] .inner .cols .contacts-element {
	order: 1
}

*[data-component="footer"] .inner .cols .contacts-element.open:after {
	transform: rotate(180deg)
}

*[data-component="footer"] .inner .cols .col.contacts {
	order: 2;
	margin-bottom: 30px;
	display: none;
	width: calc((100% - 20px) / 2);
	margin-top: 12px
}

*[data-component="footer"] .inner .cols .col.contacts.visible {
	display: block
}

*[data-component="footer"] .inner .cols .col.factories {
	order: 3;
	margin-bottom: 30px;
	display: none;
	width: calc((100% - 20px) / 2);
	margin-left: 20px;
	margin-top: 12px
}

*[data-component="footer"] .inner .cols .col.factories.visible {
	display: block
}

*[data-component="footer"] .inner .cols .col.factories ul {
	list-style: none;
	display: flex;
	flex-direction: column
}

*[data-component="footer"] .inner .cols .col.factories ul li:not(:first-child) {
	margin-top: 10px
}

*[data-component="footer"] .inner .cols .col.newsletter {
	order: 4;
	margin-bottom: 30px;
	width: 100%
}

*[data-component="footer"] .inner .cols .col.newsletter h2 {
	cursor: pointer
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter {
	margin-bottom: 30px;
	display: flex;
	border-radius: 32px;
	box-shadow: 5px 5px 5px 0px rgba(var(--colorRGB8), 0.25), -2px -2px 4px 0px rgba(var(--colorRGB9), 0.2);
	margin-bottom: 30px;
	text-decoration: none;
	transition: background-color var(--animN) ease, color var(--animN) ease, box-shadow var(--animN) ease;
	display: none
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter div {
	background-color: transparent;
	padding: 15px;
	color: var(--color9);
	flex-grow: 1;
	border-radius: 22px;
	height: 44px
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter span {
	width: 44px;
	flex-grow: 0;
	background-color: transparent;
	background-image: url(../images/arrow-back.svg);
	background-repeat: no-repeat;
	background-position: center;
	transform: rotate(180deg);
	filter: invert(100%);
	-webkit-filter: invert(100%);
	border-radius: 50%;
	transition: filter var(--animN) ease
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter:hover {
	background-color: var(--color9);
	box-shadow: 5px 5px 5px 0px rgba(var(--colorRGB9), 0.25), -2px -2px 4px 0px rgba(var(--colorRGB8), 0.2)
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter:hover div {
	color: var(--color8)
}

*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter:hover span {
	filter: invert(0%);
	-webkit-filter: invert(0%)
}

*[data-component="footer"] .inner .cols .col.newsletter ul.social-networks {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 60px 0 30px
}

*[data-component="footer"] .inner .cols .col.newsletter ul.social-networks li a {
	display: block
}

*[data-component="footer"] .inner .cols .col.newsletter ul.social-networks li a img {
	transform: scale(90%)
}

*[data-component="footer"] .inner .menu a,
*[data-component="footer"] .inner .cols a,
*[data-component="footer"] .inner .legal a {
	text-decoration: none
}

*[data-component="footer"] .inner .menu a:hover,
*[data-component="footer"] .inner .cols a:hover,
*[data-component="footer"] .inner .legal a:hover {
	text-decoration: underline
}

*[data-component="footer"] .inner .menu ul,
*[data-component="footer"] .inner .cols ul,
*[data-component="footer"] .inner .legal ul {
	list-style: none;
	display: flex
}

*[data-component="footer"] .inner .menu ul li span,
*[data-component="footer"] .inner .cols ul li span,
*[data-component="footer"] .inner .legal ul li span {
	margin-left: 3px
}

*[data-component="footer"] .inner .menu ul li:first-of-type span,
*[data-component="footer"] .inner .cols ul li:first-of-type span,
*[data-component="footer"] .inner .legal ul li:first-of-type span {
	display: none
}

*[data-component="footer"] .inner .legal {
	display: flex;
	justify-content: space-between
}

*[data-component="footer"] .inner .legal .copyright {
	width: 50%;
	min-width: 135px
}

*[data-component="footer"] .inner .legal ul {
	width: 50%;
	flex-direction: column;
	justify-content: flex-end
}

*[data-component="footer"] .inner .legal ul span {
	display: none
}

*[data-component="footer"] .logo-container .logo-inner {
	width: 100%;
	margin: 0 auto;
	background-image: url(../images/cleaf.svg);
	background-size: 104%;
	background-position: 30% 0;
	background-repeat: no-repeat;
	aspect-ratio: 180 / 39
}

@media all and (min-width: 768px) {
	*[data-component="footer"] .inner .mobile {
		display: none
	}

	*[data-component="footer"] .inner .element {
		width: auto;
		border: 0
	}

	*[data-component="footer"] .inner .element.arrow::after {
		content: none
	}

	*[data-component="footer"] .inner .menu {
		margin-top: 0;
		border: 0
	}

	*[data-component="footer"] .inner .menu ul {
		justify-content: center;
		flex-direction: row;
		margin: 60px 0
	}

	*[data-component="footer"] .inner .menu ul li {
		width: auto
	}

	*[data-component="footer"] .inner .menu ul li.main {
		display: block;
		height: auto
	}

	*[data-component="footer"] .inner .menu ul li a {
		padding: 0 10px
	}

	*[data-component="footer"] .inner .cols {
		flex-wrap: nowrap;
		margin-top: 0
	}

	*[data-component="footer"] .inner .cols .col.contacts {
		width: 200px;
		flex-grow: 0;
		display: block;
		margin-top: 0
	}

	*[data-component="footer"] .inner .cols .col.factories {
		order: 4;
		width: 330px;
		flex-grow: 2;
		display: block;
		margin-left: 0;
		margin-top: 0
	}

	*[data-component="footer"] .inner .cols .col.factories ul {
		flex-direction: row;
		flex-wrap: wrap;
		max-width: 360px
	}

	*[data-component="footer"] .inner .cols .col.factories ul li {
		width: calc((100% - 20px) / 2);
		max-width: 180px;
		margin-top: 0 !important;
		margin-bottom: 10px
	}

	*[data-component="footer"] .inner .cols .col.newsletter {
		order: 4;
		flex-grow: 1;
		max-width: 270px
	}

	*[data-component="footer"] .inner .cols .col.newsletter h2 {
		cursor: default;
		pointer-events: none
	}

	*[data-component="footer"] .inner .cols .col.newsletter a.button-newsletter {
		display: block
	}

	*[data-component="footer"] .inner .cols .col.newsletter ul.social-networks {
		margin-top: 0
	}

	*[data-component="footer"] .inner .legal .copyright {
		width: auto
	}

	*[data-component="footer"] .inner .legal ul {
		width: auto;
		flex-direction: row
	}

	*[data-component="footer"] .inner .legal ul span {
		display: inline
	}
}

.tooltip-element {
	position: absolute;
	z-index: 12;
	top: -2750px;
	left: 0;
	color: var(--color6);
	font-size: var(--textSize12);
	font-family: var(--fontSans);
	background-color: var(--color4);
	padding: 7px 10px 5px;
	border-radius: 4px;
	pointer-events: none;
	box-shadow: 1px 2px 1px 1px rgba(0, 0, 0, 0.1);
	opacity: 0;
	transform: translateY(3px);
	transition: transform var(--animN) ease, opacity var(--animN) ease;
	text-align: center;
	max-width: 150px
}

.tooltip-element.visible {
	opacity: 1;
	transform: translateY(0)
}

.serp-shield {
	position: fixed;
	z-index: 9;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(var(--colorRGB8), 0.9);
	opacity: 0;
	transition: opacity var(--animN) ease;
	display: none;
}

.serp-shield.visible {
	opacity: 1;
	pointer-events: none;
	display: block;
}

.serp-shield .inner {
	max-width: var(--widthInnerMax);
	pointer-events: all;
	padding: var(--headerHeight) 20px 20px;
	margin: 0 auto
}

.serp-shield .inner .bar {
	display: flex;
	opacity: 1;
	transition: opacity var(--animN) ease;
	border-bottom: solid 1px var(--color9)
}

.serp-shield .inner .bar.disabled {
	opacity: .5
}

.serp-shield .inner .bar input {
	flex-shrink: 1;
	flex-grow: 1;
	background-color: transparent;
	color: var(--color9);
	outline: 0
}

.serp-shield .inner .bar .clear {
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	flex-grow: 0;
	background-image: url(../images/clear.svg);
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer
}

.serp-shield .inner .results {
	--itemsPerRow: 2;
	color: var(--color9);
	font-size: var(--textSize12);
	display: flex;
	flex-wrap: wrap;
	min-height: 80px;
	max-height: calc(100vh - var(--headerHeight) - 49px - 60px);
	overflow-x: hidden;
	overflow-y: auto
}

.serp-shield .inner .results .loading {
	width: 100%;
	display: flex;
	align-items: center;
	margin-top: 30px;
	transition: opacity var(--animN) ease
}

.serp-shield .inner .results .loading.remove {
	opacity: 0
}

.serp-shield .inner .results .loading svg {
	transform-origin: center center;
	width: 32px;
	height: 32px;
	margin: auto;
	-webkit-animation: loading-rotate 2s linear infinite;
	animation: loading-rotate 2s linear infinite
}

.serp-shield .inner .results .loading svg circle {
	fill: none;
	stroke: var(--color9);
	stroke-width: 3.5;
	stroke-dasharray: 1, 200;
	stroke-dashoffset: 0;
	stroke-linecap: round;
	stroke-miterlimit: 10;
	-webkit-animation: loading-dash 1.5s ease-in-out infinite;
	animation: loading-dash 1.5s ease-in-out infinite
}

@-webkit-keyframes loading-rotate {
	100% {
		transform: rotate(360deg)
	}
}

@keyframes loading-rotate {
	100% {
		transform: rotate(360deg)
	}
}

@-webkit-keyframes loading-dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0
	}

	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px
	}

	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -124px
	}
}

@keyframes loading-dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0
	}

	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px
	}

	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -124px
	}
}

.serp-shield .inner .results .item {
	display: block;
	width: calc((100% - (var(--gutter) * (var(--itemsPerRow) - 1))) / var(--itemsPerRow));
	margin-top: 30px;
	text-decoration: none;
	text-transform: uppercase;
	transition: filter var(--animN) ease
}

.serp-shield .inner .results .item .labels {
	height: 0;
	overflow: visible;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start
}

.serp-shield .inner .results .item .labels>li {
	margin-top: 10px;
	font-family: var(--fontSans);
	font-size: var(--textSize10);
	text-transform: uppercase;
	height: 26px;
	background-color: var(--color9);
	color: var(--color8);
	padding: 8px 15px 10px 10px;
	border-top-right-radius: 13px;
	border-bottom-right-radius: 13px;
	opacity: .75;
	transition: opacity var(--animN) ease
}

.serp-shield .inner .results .item .labels>li.link:hover {
	opacity: 1
}

.serp-shield .inner .results .item .labels>li:first-child {
	margin-top: 20px
}

.serp-shield .inner .results .item:hover {
	filter: brightness(75%);
	-webkit-filter: brightness(75%)
}

.serp-shield .inner .results .item .image {
	aspect-ratio: 1;
	display: flex;
	background-color: var(--color8)
}

.serp-shield .inner .results .item .image img {
	width: 100%;
	height: auto
}

.serp-shield .inner .results .item .name {
	padding: 10px 0;
	text-align: center
}

.serp-shield .inner .results .item:nth-child(2n+1) {
	margin-right: var(--gutter)
}

@media all and (min-width: 640px) {
	.serp-shield .inner .results {
		--itemsPerRow: 3
	}

	.serp-shield .inner .results .item:nth-child(2n+1) {
		margin-right: 0
	}

	.serp-shield .inner .results .item:nth-child(3n+1),
	.serp-shield .inner .results .item:nth-child(3n+2) {
		margin-right: var(--gutter)
	}
}

@media all and (min-width: 768px) {
	.serp-shield .inner .results {
		--itemsPerRow: 4
	}

	.serp-shield .inner .results .item:nth-child(3n+1),
	.serp-shield .inner .results .item:nth-child(3n+2) {
		margin-right: 0
	}

	.serp-shield .inner .results .item:nth-child(4n+1),
	.serp-shield .inner .results .item:nth-child(4n+2),
	.serp-shield .inner .results .item:nth-child(4n+3) {
		margin-right: var(--gutter)
	}
}

@media all and (min-width: 1024px) {
	.serp-shield .inner {
		margin-top: 15px
	}
}

*[data-component="standard-contents"] section .link {
	margin-top: 40px
}

*[data-component="standard-contents"] section[data-type="block-video"] {
	overflow: hidden;
	position: relative;
	height: 100vh;
	background-color: var(--color8);
	display: flex;
	align-items: center;
	justify-content: center
}

*[data-component="standard-contents"] section[data-type="block-video"] video {
	width: calc(100vw + 2px);
	height: calc(100vh + 2px);
	-o-object-fit: cover;
	object-fit: cover;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 0
}

*[data-component="standard-contents"] section[data-type="block-video"] .contents {
	position: absolute;
	z-index: 1;
	color: var(--color0);
	width: 80%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: calc(var(--logoHeight) * 4) 10%
}

*[data-component="standard-contents"] section[data-type="block-video"] .contents .eyelet {
	/*text-transform: uppercase;*/
	font-size: var(--textSize20);
	font-weight: 600;
	text-align: center;
	padding-top: 80px
}

*[data-component="standard-contents"] section[data-type="block-video"] .contents h1 {
	text-transform: uppercase;
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	text-align: center;
	word-break: normal
}

*[data-component="standard-contents"] section[data-type="text-stripe"] {
	max-width: var(--widthMax);
	margin: 0 auto;
	font-size: var(--textSize20);
	font-weight: 600;
	padding: 120px 60px;
	width: 80%;
	text-align: center
}

*[data-component="standard-contents"] section[data-type="text-wide"] .inner {
	color: var(--color9);
	font-weight: 600;
	padding: 120px 0px;
	max-width: 800px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 auto
}

*[data-component="standard-contents"] section[data-type="text-wide"] .inner .abst {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px
}

*[data-component="standard-contents"] section[data-type="text-wide"] .inner a {
	margin-top: 50px
}

*[data-component="standard-contents"] section[data-type="text-wide"] .inner.text-dark {
	color: var(--color8)
}

*[data-component="standard-contents"] section[data-type="text-wide"] .inner.text-dark a:after {
	filter: invert(100%)
}

*[data-component="standard-contents"] section[data-type="box-text-image"] {
	color: var(--color0);
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: var(--widthMax);
	margin: 0 auto;
	font-family: var(--fontSansLight)
}

*[data-component="standard-contents"] section[data-type="box-text-image"] img {
	width: 100%;
	height: auto
}

*[data-component="standard-contents"] section[data-type="box-text-image"] .cont {
	padding: 20px;
	min-height: 100vw;
	display: flex;
	flex-direction: column;
	justify-content: center
}

*[data-component="standard-contents"] section[data-type="box-text-image"] .cont .abst {
	font-weight: bold;
	font-size: var(--textSize30);
	line-height: 32px
}

*[data-component="standard-contents"] section[data-type="box-text-image"] .cont.text-dark {
	color: var(--color1)
}

*[data-component="standard-contents"] section[data-type="box-text-image"] .cont.text-dark a:after {
	filter: invert(100%);
	-webkit-filter: invert(100%)
}

*[data-component="standard-contents"] section[data-type="box-text-image-2"] {
	display: flex;
	flex-direction: column;
	padding: calc(2 * var(--padding)) var(--padding);
	max-width: var(--widthMax);
	margin: 0 auto
}

*[data-component="standard-contents"] section[data-type="box-text-image-2"] img {
	width: 100%;
	max-width: 555px;
	height: auto
}

*[data-component="standard-contents"] section[data-type="box-text-image-2"] .abst {
	max-width: 415px;
	padding: calc(4 * var(--padding)) 0
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] {
	max-width: var(--widthInnerMax);
	margin: 0 auto;
	padding: 0 var(--padding);
	line-height: 24px
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .date {
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming {
	display: flex;
	flex-direction: column;
	padding: 120px 0 30px 0
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .left {
	display: none
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .center {
	margin-bottom: 30px
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .center img {
	width: 100%;
	height: auto
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .right h3 {
	font-size: var(--textSize20);
	margin-bottom: 10px
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others {
	    padding-top: 80px;padding-bottom: 80px
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others h3 {
	text-transform: uppercase;
	margin: 30px 0;
	font-size: var(--textSize20);
	font-weight: 600;
	text-align: center
}
.others ul li img {
    width: 100%;
    height: 80px;
    object-fit: contain;
}
.others ul li {
    text-align: center;
}
*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-top: 30px
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others ul li {
	width: calc((100% - 30px) / 2);
	margin-bottom: calc(30px + 10px)
}

*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others ul li h4 {
	font-weight: 700;
	margin-bottom: 30px;
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="products"] {
	--productThumbWidthMax: 360px;
	text-align: center;
	padding: 120px 20px
}

*[data-component="standard-contents"] section[data-type="products"] h2 {
	font-size: var(--textSize20);
	font-weight: 600;
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="products"] ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	justify-content: space-between;
	max-width: calc((var(--productThumbWidthMax) * 3) + var(--gutter));
	margin: 0 auto
}

*[data-component="standard-contents"] section[data-type="products"] ul li {
	width: calc((100% - var(--gutter)) / 2);
	max-width: 360px;
	margin-top: calc(var(--gutter) * 2)
}

*[data-component="standard-contents"] section[data-type="products"] ul li a {
	display: block;
	text-decoration: none
}

*[data-component="standard-contents"] section[data-type="products"] ul li a figure div {
	width: 100%
}

*[data-component="standard-contents"] section[data-type="products"] ul li a figure figcaption {
	    margin-top: 8px;
    text-transform: uppercase;
    font-family: var(--fontSansLight);
    font-size: 18px;
    font-weight: bold;
}

*[data-component="standard-contents"] section[data-type="box-text-full-image"] {
	color: var(--color0);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60px;
	background-color: #bcaa96;
	height: 100vh
}

*[data-component="standard-contents"] section[data-type="box-text-full-image"] h2 {
	font-size: var(--textSize20);
	font-weight: 600;
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="box-text-full-image"] .abst {
	font-family: var(--fontSansLight);
	font-weight: 250;
	font-size: var(--textSize42);
	line-height: 48px;
	text-align: center;
	padding: 60px 0
}

*[data-component="standard-contents"] section[data-type="projects"] {
	--productThumbWidthMax: 360px;
	text-align: center;
	padding: 120px var(--padding) 80px;
	background-color: var(--color8);
	color: var(--color0)
}

*[data-component="standard-contents"] section[data-type="projects"] h2 {
	font-size: var(--textSize20);
	font-weight: 600;
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="projects"] ul {
	display: flex;
	flex-direction: column;
	list-style: none
}

*[data-component="standard-contents"] section[data-type="projects"] ul li {
	margin-top: calc(var(--gutter) * 2)
}

*[data-component="standard-contents"] section[data-type="projects"] ul li a {
	display: block;
	text-decoration: none
}

*[data-component="standard-contents"] section[data-type="projects"] ul li a figure img {
	width: 100%;
    object-fit: cover;
	/*height: auto*/
}

*[data-component="standard-contents"] section[data-type="projects"] ul li a figure figcaption {
	    margin-top: 8px;
    font-family: var(--fontSansLight);
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 24px;
}

*[data-component="standard-contents"] section[data-type="projects"] ul li a figure figcaption .name {
	text-transform: uppercase
}

*[data-component="standard-contents"] section[data-type="company-block"] {
	display: flex;
	flex-direction: column;
	max-width: var(--widthInnerMax);
	margin: 0 auto;
	padding: 0 20px;
	padding-top: 90px
}

*[data-component="standard-contents"] section[data-type="company-block"]>div .name {
	font-size: var(--textSize20);
	font-weight: 600;
	line-height: normal;
	letter-spacing: 1px
}

*[data-component="standard-contents"] section[data-type="company-block"]>div .big {
	margin-top: 15px;
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px
}

*[data-component="standard-contents"] section[data-type="company-block"]>div .cont {
	margin-top: 15px;
	font-size: var(--textSize16);
	font-style: normal;
	font-weight: bold;
	line-height: 24px
}

*[data-component="standard-contents"] section[data-type="company-block"]>div img {
	width: 100%;
	height: auto;
	margin-top: 30px
}

@media all and (min-width: 768px) {
	*[data-component="standard-contents"] section[data-type="block-video"] .contents h1 {
		font-size: var(--textSize75)
	}

	*[data-component="standard-contents"] section[data-type="block-video"] .contents .eyelet {
		padding-top: 0
	}

	*[data-component="standard-contents"] section[data-type="text-stripe"] {
		width: 50%
	}

	*[data-component="standard-contents"] section[data-type="box-text-image"] {
		flex-direction: row-reverse
	}

	*[data-component="standard-contents"] section[data-type="box-text-image"] img {
		width: 50%;
		height: auto
	}

	*[data-component="standard-contents"] section[data-type="box-text-image"] .cont {
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		padding: 10% 30px 5% 10%;
		min-height: auto
	}

	*[data-component="standard-contents"] section[data-type="box-text-image"] .cont .abst {
		font-size: var(--textSize42);
		line-height: 48px
	}

	*[data-component="standard-contents"] section[data-type="box-text-image"] .cont a {
		margin-top: 40px
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"] {
		flex-direction: row;
		justify-content: space-between;
		line-height: 25px
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"] .first,
	*[data-component="standard-contents"] section[data-type="box-text-image-2"] .second {
		width: calc((100% - 30px) / 2)
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"] .first {
		text-align: right
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"]+*[data-type="box-text-image-2"] {
		flex-direction: row-reverse
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"]+*[data-type="box-text-image-2"] .first {
		text-align: left
	}

	*[data-component="standard-contents"] section[data-type="box-text-image-2"]+*[data-type="box-text-image-2"] .second {
		display: flex;
		justify-content: flex-end
	}

	*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming {
		flex-direction: row;
		align-items: center;
		align-items: center;
		max-width: var(--widthInnerMax)
	}

	*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .left,
	*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .right {
		display: block;
		width: 30%;
		padding: 30px
	}

	*[data-component="standard-contents"] section[data-type="fairs-to-come"] .upcoming .center {
		width: 40%
	}

	*[data-component="standard-contents"] section[data-type="fairs-to-come"] .others ul li {
		width: calc((100% - (30px * 3)) /5)
	}

	*[data-component="standard-contents"] section[data-type="box-text-full-image"] {
		aspect-ratio: 1440 / 800;
		width: 100%;
		height: auto
	}

	*[data-component="standard-contents"] section[data-type="projects"] ul {
		flex-direction: row;
		justify-content: space-between;
		max-width: var(--widthInnerMax);
		margin: 0 auto
	}

	*[data-component="standard-contents"] section[data-type="projects"] ul li {
		width: calc((100% - var(--gutter)) / 2)
	}

	*[data-component="standard-contents"] section[data-type="company-block"] {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		padding-top: 30px
	}

	*[data-component="standard-contents"] section[data-type="company-block"]>div {
		width: calc((100% - 30px) / 2)
	}

	*[data-component="standard-contents"] section[data-type="company-block"]:nth-child(2n+1)>div:nth-child(1) {
		order: 2
	}

	*[data-component="standard-contents"] section[data-type="company-block"]:nth-child(2n+1)>div:nth-child(2) {
		order: 1
	}
}

*[data-component="products-top"] {
	margin: var(--pageMarginTop) auto 30px;
	max-width: var(--widthMax);
	text-align: center
}

*[data-component="products-top"] .upper .left {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-bottom: calc(var(--padding) * 3)
}

*[data-component="products-top"] .upper .left,
*[data-component="products-top"] .upper .right {
	width: 55px;
	flex-shrink: 0
}

*[data-component="products-top"] ul {
	padding: 0;
	display: flex;
	justify-content: space-between;
	list-style: none;
	max-width: 480px;
	margin: 0 auto;
	margin-bottom: calc(var(--padding) * 3)
}

*[data-component="products-top"] ul li {
	width: calc(100% / 3);
	padding: 0 5px;
	max-width: 130px
}

*[data-component="products-top"] ul li a {
	display: inline-block;
	white-space: nowrap;
	display: block;
	padding-left: 0;
	padding-right: 0
}

@media all and (min-width: 768px) {
	*[data-component="products-top"] .upper {
		flex-direction: row;
		align-items: baseline;
		justify-content: space-between
	}

	*[data-component="products-top"] .upper .left {
		margin-top: -9px
	}

	*[data-component="products-top"] .upper .left a {
		padding-right: 30px
	}

	*[data-component="products-top"] .upper .left a span {
		display: block;
		margin-left: 18px
	}

	*[data-component="products-top"] .upper .left,
	*[data-component="products-top"] .upper .right {
		width: 150px
	}
}

*[data-component="products-list"] ul {
	    padding: 0 var(--padding);
    list-style: none;
    display: flex;
    font-family: var(--fontSansLight);
    font-size: var(--textSize42);
    text-transform: uppercase;
    font-weight: 250;
    padding: calc(var(--padding)* 3) 0 120px;
    min-height: 70vh;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

*[data-component="products-list"] ul li {
       --new_color: inherit;
    margin-bottom: 2%;
    text-align: center;
    display: flex;
    width: 30%;
    flex-direction: column;
    align-items: center;
}
*[data-component="products-list"] ul li img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}
    *[data-component="products-list"] ul li a {
         --offsetX: 0;
    --slideX: 5px;
    text-align: center;
		    margin-top: 35px;
    text-decoration: none;
    display: inline-flex;    font-weight: bold;
    font-size: 20px;
    justify-content: center;
    align-items: center;
  
    transition: opacity var(--animN) ease;
    flex-direction: column;
    }

*[data-component="products-list"] ul li a:hover {
	opacity: .50
}

*[data-component="products-list"] ul li a .new {
	color: var(--colorFore);
	font-size: var(--textSize12);
	font-family: var(--fontNormal);
	font-weight: 400;
	width: 0;
	overflow: visible;
	margin-top: 5px;
	margin-left: 10px
}

*[data-component="products-list"] ul li a .img-container {
	position: absolute;
	pointer-events: none;
	-webkit-animation-name: enter;
	animation-name: enter;
	-webkit-animation-duration: var(--animN);
	animation-duration: var(--animN);
	-webkit-animation-timing-function: var(--timingBezier);
	animation-timing-function: var(--timingBezier);
	transform: translateX(var(--offsetX))
}

*[data-component="products-list"] ul li a .img-container img {
	width: 200px;
	height: 120px;
	background-color: var(--color4)
}

*[data-component="products-list"] ul li a .img-container.exit {
	-webkit-animation-name: exit;
	animation-name: exit;
	-webkit-animation-duration: var(--animF);
	animation-duration: var(--animF)
}

@-webkit-keyframes enter {
	0% {
		opacity: 0;
		transform: translateX(calc((var(--slideX) * -1) + var(--offsetX)))
	}

	100% {
		opacity: 1;
		transform: translateX(calc(var(--offsetX)))
	}
}

@keyframes enter {
	0% {
		opacity: 0;
		transform: translateX(calc((var(--slideX) * -1) + var(--offsetX)))
	}

	100% {
		opacity: 1;
		transform: translateX(calc(var(--offsetX)))
	}
}

@-webkit-keyframes exit {
	0% {
		opacity: 1;
		transform: translateX(calc(var(--offsetX)))
	}

	100% {
		opacity: 0;
		transform: translateX(calc(var(--slideX) + var(--offsetX)))
	}
}

@keyframes exit {
	0% {
		opacity: 1;
		transform: translateX(calc(var(--offsetX)))
	}

	100% {
		opacity: 0;
		transform: translateX(calc(var(--slideX) + var(--offsetX)))
	}
}

@media all and (min-width: 768px) {
	*[data-component="products-list"] ul {
		font-size: var(--textSize75)
	}

	*[data-component="products-list"] ul li a .new {
		margin-top: 12px
	}
}

*[data-component="product-collections-root"] .intro {
	font-family: var(--fontSansLight);
	line-height: 24px;
	padding: var(--padding);
	max-width: 660px;
	margin: 0 auto;
	text-align: center
}

*[data-component="products-cover"] {
	max-width: var(--widthMax);
	margin: 0 auto
}

*[data-component="products-cover"] h1 {
	text-align: center;
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	text-transform: uppercase;
	font-weight: 300;
	margin: 0;
	padding: calc(var(--padding) * 3) var(--padding)
}

*[data-component="products-cover"] img {
	width: 100%;
	height: auto;
	background-color: var(--color4)
}

*[data-component="products-filters"] {
	text-align: center;
	padding: calc(3 * var(--padding)) 0
}

*[data-component="products-filters"] h2 {
	font-size: var(--textSize16);
	text-transform: uppercase
}

*[data-component="products-filters"] .filters {
	display: flex;
	justify-content: center
}

*[data-component="products-filters"] .filters .filter {
	margin: calc(2 * var(--padding)) var(--padding);
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
	padding-right: 5px;
	border-radius: 21px;
	background-color: var(--color0);
	overflow: hidden
}

*[data-component="products-filters"] .filters .filter select {
	padding: 10px 20px;
	background-color: var(--color0);
	color: var(--color8);
	outline: 0;
	width: 130px
}

*[data-component="finish"] .desc {
	max-width: var(--widthMax);
	margin: 0 auto;
	font-family: var(--fontSansLight);
	font-size: var(--textSize20);
	font-weight: 250;
	padding: 60px 0;
	width: 80%;
	text-align: center
}

*[data-component="finish"] .projects {
	padding: 60px var(--padding);
	text-align: center
}

*[data-component="finish"] .projects h2 {
	margin-bottom: calc(3 * var(--padding))
}

*[data-component="finish"] .projects .gallery {
	--itemsNum: 1;
	--current: 0;
	position: relative;
	display: flex;
	justify-content: center
}

*[data-component="finish"] .projects .gallery .tools {
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 100%;
	max-width: 1024px;
	display: flex;
	justify-content: space-between;
	pointer-events: none
}

*[data-component="finish"] .projects .gallery .tools .prev,
*[data-component="finish"] .projects .gallery .tools .next {
	width: 50px;
	height: 100%;
	background-image: url(../images/arrow-back.svg);
	background-repeat: no-repeat;
	background-position: center center;
	opacity: 0;
	transition: opacity var(--animN) var(--timingBezier);
	pointer-events: all;
	cursor: pointer
}

*[data-component="finish"] .projects .gallery .tools .prev.visible,
*[data-component="finish"] .projects .gallery .tools .next.visible {
	opacity: 1
}

*[data-component="finish"] .projects .gallery .tools .next {
	transform: rotate(180deg)
}

*[data-component="finish"] .projects .gallery .viewport {
	position: relative;
	overflow: hidden;
	max-width: 750px;
	margin: 0 auto
}

*[data-component="finish"] .projects .gallery .viewport .mover {
	position: relative;
	width: calc(100% * var(--itemsNum));
	display: flex;
	margin-left: calc(100% * (-1 * var(--current)));
	transition: margin-left var(--animN) var(--timingBezier)
}

*[data-component="finish"] .projects .gallery .viewport .mover .item {
	display: block;
	width: calc(100% / var(--itemsNum));
	text-decoration: none
}

*[data-component="finish"] .projects .gallery .viewport .mover .item .image {
	width: 100%;
	height: auto
}

*[data-component="finish"] .projects .gallery .viewport .mover .item .image img {
	width: 100%;
	height: auto
}

*[data-component="finish"] .projects .gallery .viewport .mover .item .name {
	text-transform: uppercase;
	padding: 6px 0;
	font-weight: 300
}

@media all and (min-width: 768px) {
	*[data-component="finish"] .desc {
		width: 50%;
		font-size: var(--textSize42)
	}
}

@media all and (min-width: 1024px) {
	*[data-component="finish"] .desc {
		width: 50%;
		font-size: var(--textSize42)
	}
}

*[data-component="product-collection"] *[data-component="standard-contents"] {
	margin-top: calc(4 * var(--padding))
}

*[data-component="products-grid"] {
	--itemsPerRow: 2;
	--gutter: 20px;
	--itemWidth: calc((100% - ((var(--itemsPerRow) - 1) * var(--gutter))) / var(--itemsPerRow));
	max-width: var(--widthInnerMax);
	margin-left: auto;
	margin-right: auto
}

*[data-component="products-grid"] h2 {
	text-align: center;
	font-size: var(--textSize20);
	font-weight: 600;
	text-transform: uppercase;
	padding: calc(var(--padding) * 2) 0;
	margin-top: calc(var(--padding) * 2)
}

*[data-component="products-grid"] ul.grid {
	list-style: none;
	padding: calc(var(--padding) * 3) var(--padding);
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	max-width: var(--widthInnerMax);
	margin: 0 auto;
	font-family: var(--fontSansLight);
	font-weight: 400;
	line-height: 24px;
	text-transform: uppercase
}

*[data-component="products-grid"] ul.grid>li {
	width: var(--itemWidth);
	margin-bottom: calc(2 * var(--padding))
}

*[data-component="products-grid"] ul.grid>li.hidden {
	display: none
}

*[data-component="products-grid"] ul.grid>li.fadein {
	-webkit-animation-name: fadein;
	animation-name: fadein;
	-webkit-animation-duration: var(--animN);
	animation-duration: var(--animN);
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease
}

@-webkit-keyframes fadein {
	0% {
		opacity: 0
	}

	100% {
		opacity: 100%
	}
}

@keyframes fadein {
	0% {
		opacity: 0
	}

	100% {
		opacity: 100%
	}
}

*[data-component="products-grid"] ul.grid>li a {
    text-decoration: none;
    font-size: 18px;
    text-align: center;
    padding: 10px 25px;    font-weight: bold;
    margin-top: 10px;
}

*[data-component="products-grid"] ul.grid>li a figure div.product-thumb::before {
	content: "";
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: var(--color0);
	align-self: center;
	justify-self: center;
	position: absolute;
	z-index: 1;
	-webkit-animation: pulse 1.5s ease-in-out infinite;
	animation: pulse 1.5s ease-in-out infinite;
	border: solid 1px rgba(var(--colorRGB4), 0.25)
}

    *[data-component="products-grid"] ul.grid > li a figure div.product-thumb img {
        width: 100%;
        transition: opacity var(--animN) ease;
        position: relative;
        z-index: 2;
        object-fit: cover;
        /*opacity: 0*/
    }

*[data-component="products-grid"] ul.grid>li a figure div.product-thumb.loaded img {
	opacity: 1
}

*[data-component="products-grid"] ul.grid>li a figure figcaption {
	text-align: center;
	padding: 6px 0
}

*[data-component="products-grid"] ul.grid>li:nth-child(2n+1) {
	margin-right: var(--gutter)
}

*[data-component="products-grid"].one-liner {
	position: relative
}

*[data-component="products-grid"].one-liner .one-liner-viewport {
	max-width: none;
	width: 100%;
	position: relative;
	max-width: var(--widthInnerMax);
	margin-left: auto;
	margin-right: auto;
	overflow-x: scroll;
	overflow-y: hidden;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth
}

*[data-component="products-grid"].one-liner .one-liner-viewport ul.grid {
	position: relative;
	z-index: 1;
	flex-wrap: nowrap;
	margin-left: 0;
	max-width: none;
	padding-left: 0;
	padding-right: 0
}

*[data-component="products-grid"].one-liner .one-liner-viewport ul.grid>li {
	margin-right: var(--gutter);
	width: var(--itemWidth);
	flex-grow: 0;
	flex-shrink: 0
}

*[data-component="products-grid"].one-liner .one-liner-viewport ul.grid>li:first-child {
	margin-left: var(--padding)
}

*[data-component="products-grid"].one-liner .one-liner-viewport ul.grid>li:last-child {
	margin-right: var(--gutter)
}

*[data-component="products-grid"].one-liner .arrow {
	position: absolute;
	z-index: 2;
	width: 40px;
	height: 100%;
	display: block;
	cursor: pointer;
	background-image: url(../images/arrow-right.svg);
	background-repeat: no-repeat;
	background-position: center;
	opacity: .5;
	transition: opacity var(--animN) ease
}

*[data-component="products-grid"].one-liner .arrow.hidden {
	opacity: 0;
	pointer-events: none
}

*[data-component="products-grid"].one-liner .arrow.left {
	background-image: url(../images/arrow-left.svg)
}

*[data-component="products-grid"].one-liner .arrow:hover {
	opacity: 1
}

@media all and (min-width: 768px) {
	*[data-component="products-grid"] {
		--itemsPerRow: 3
	}

	*[data-component="products-grid"] ul.grid>li:nth-child(2n+1) {
		margin-right: 0
	}

	*[data-component="products-grid"] ul.grid>li:nth-child(3n+1),
	*[data-component="products-grid"] ul.grid>li:nth-child(3n+2) {
		margin-right: var(--gutter)
	}
}

@media all and (min-width: 1024px) {
	*[data-component="products-grid"] {
		--itemsPerRow: 4;
		--gutter: 40px
	}

	*[data-component="products-grid"] ul.grid>li:nth-child(3n+1),
	*[data-component="products-grid"] ul.grid>li:nth-child(3n+2) {
		margin-right: 0
	}

	*[data-component="products-grid"] ul.grid>li:nth-child(4n+1),
	*[data-component="products-grid"] ul.grid>li:nth-child(4n+2),
	*[data-component="products-grid"] ul.grid>li:nth-child(4n+3) {
		margin-right: var(--gutter)
	}
}

*[data-component="under-development"] {
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--textSize20);
	font-weight: 600
}

*[data-component="projects-root"] {
	margin: var(--pageMarginTop) 0
}

*[data-component="projects-root"] .filters-container {
	text-align: center
}

*[data-component="projects-root"] .filters-container .filter-title {
	font-size: var(--textSize16);
	text-transform: uppercase
}

*[data-component="projects-root"] .filters-container .filters {
	display: flex;
	justify-content: center
}

*[data-component="projects-root"] .filters-container .filters .filter {
	margin: calc(2 * var(--padding)) var(--padding);
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGB0), 0.25);
	padding-right: 5px;
	border-radius: 21px;
	background-color: var(--color0);
	overflow: hidden;
	background-color: var(--color8)
}

*[data-component="projects-root"] .filters-container .filters .filter select {
	padding: 10px 20px;
	background-color: var(--color8);
	color: var(--color0);
	outline: 0
}

*[data-component="projects-root"] .items {
	list-style: none;
	display: flex;
	flex-direction: column;
	padding: 0 var(--padding);
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="projects-root"] .items li {
	margin-top: calc(var(--padding) * 3)
}

*[data-component="projects-root"] .items li.hidden {
	display: none
}

*[data-component="projects-root"] .items li.fadein {
	-webkit-animation-name: fadein;
	animation-name: fadein;
	-webkit-animation-duration: var(--animN);
	animation-duration: var(--animN);
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease
}

@-webkit-keyframes fadein {
	0% {
		opacity: 0
	}

	100% {
		opacity: 100%
	}
}

@keyframes fadein {
	0% {
		opacity: 0
	}

	100% {
		opacity: 100%
	}
}

*[data-component="projects-root"] .items li a {
	text-decoration: none
}

*[data-component="projects-root"] .items li a figure img {
	width: 100%;
	/*height: auto*/
    object-fit:cover;   
}

*[data-component="projects-root"] .items li a figcaption {
	margin-top: 8px;
	font-family: var(--fontSansLight);
	font-size: var(--textSizeBase);
	text-align: left;
	line-height: 24px
}

*[data-component="projects-root"] .items li a figcaption .name {
	text-transform: uppercase
}

@media all and (min-width: 768px) {
	*[data-component="projects-root"] .items {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between
	}

	*[data-component="projects-root"] .items li {
		width: calc((100% - 30px) / 2)
	}
}

*[data-component="project"] {
	margin: calc(var(--pageMarginTop) + 73px) 0
}

*[data-component="project"] .block-top,
*[data-component="project"] .block-bottom {
	padding: 0 var(--padding);
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="project"] .block-top>div,
*[data-component="project"] .block-bottom>div {
	margin-bottom: 30px;
	display: flex;
	flex-direction: column
}

*[data-component="project"] .block-top>div img,
*[data-component="project"] .block-bottom>div img {
	/*width: 100%;
	height: auto*/
	    width: 100%;
    height: 350px;
    object-fit: cover;
}

*[data-component="project"] .block-top>div .title,
*[data-component="project"] .block-bottom>div .title {
	margin-bottom: 0
}

*[data-component="project"] .block-top>div .cont,
*[data-component="project"] .block-bottom>div .cont {
	line-height: 24px
}

*[data-component="project"] div[data-component="standard-contents"]:has(section) {
	margin-top: 90px;
	margin-bottom: 120px
}

@media all and (min-width: 768px) {
	*[data-component="project"] {
		margin: calc(var(--pageMarginTop) + 13px) 0
	}

	*[data-component="project"] .block-top,
	*[data-component="project"] .block-bottom {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between
	}

	*[data-component="project"] .block-top>div,
	*[data-component="project"] .block-bottom>div {
		width: calc((100% - 30px) / 2)
	}

	*[data-component="project"] .block-top>div:nth-child(1),
	*[data-component="project"] .block-bottom>div:nth-child(1) {
		order: 2;
		margin-bottom: 90px
	}

	*[data-component="project"] .block-top>div:nth-child(2),
	*[data-component="project"] .block-bottom>div:nth-child(2) {
		order: 1;
		margin-bottom: 90px
	}

	*[data-component="project"] .block-top>div:nth-child(3),
	*[data-component="project"] .block-bottom>div:nth-child(3) {
		order: 3
	}

	*[data-component="project"] .block-top>div:nth-child(4),
	*[data-component="project"] .block-bottom>div:nth-child(4) {
		order: 4
	}
}

*[data-component="fairs-root"] {
	margin: var(--pageMarginTop) 0
}

*[data-component="fairs-root"] .no-items {
	text-align: center;
	padding: var(--padding)
}

*[data-component="news-year"] {
	margin: calc(var(--pageMarginTop) + 60px) auto;
	padding: 0 20px;
	max-width: var(--widthInnerMax)
}

*[data-component="news-year"] .date {
	font-size: var(--textSize16);
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase
}

*[data-component="news-year"] .highlighted {
	margin-bottom: 60px
}

*[data-component="news-year"] .highlighted a {
	text-decoration: none;
	margin-bottom: 15px
}

*[data-component="news-year"] .highlighted a img {
	width: 100%;
	height: auto;
	margin-bottom: 15px
}

*[data-component="news-year"] .highlighted a .name {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px;
	margin-top: 10px;
	margin-bottom: 15px
}

*[data-component="news-year"] .buttons {
	display: flex;
	align-items: center;
	margin-bottom: 30px
}

*[data-component="news-year"] .buttons .filter {
	margin: var(--padding);
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGB9), 0.25);
	padding-right: 5px;
	border-radius: 21px;
	background-color: var(--color8);
	overflow: hidden
}

*[data-component="news-year"] .buttons .filter select,
*[data-component="news-year"] .buttons .filter a {
	display: block;
	background-color: transparent;
	padding: 10px 20px;
	outline: 0;
	color: var(--color9);
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--animN) ease, color var(--animN) ease
}

*[data-component="news-year"] .buttons .filter a:hover {
	background-color: var(--color9);
	color: var(--color8)
}

*[data-component="news-year"] .buttons .filter:first-child {
	margin-left: 0
}

*[data-component="news-year"] .items {
	list-style: none;
	display: flex;
	flex-direction: column
}

*[data-component="news-year"] .items li a {
	display: flex;
	flex-direction: column;
	margin-bottom: 15px;
	text-decoration: none
}

*[data-component="news-year"] .items li a .image,
*[data-component="news-year"] .items li a .text {
	margin-bottom: 60px
}

*[data-component="news-year"] .items li a .image {
	width: 100%;
	margin-bottom: 15px
}

*[data-component="news-year"] .items li a .image img {
	width: 100%;
	height: auto
}

*[data-component="news-year"] .items li a .text h3 {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 100;
	line-height: 48px;
	margin-top: 10px
}

*[data-component="news-year"] .items li a .text .abst {
	margin-top: 20px;
	margin-bottom: 20px
}

*[data-component="news-year"] .items li a .text .link {
	margin-top: 15px
}

@media all and (min-width: 768px) {
	*[data-component="news-year"] {
		margin-top: var(--pageMarginTop)
	}

	*[data-component="news-year"] .items {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between
	}

	*[data-component="news-year"] .items li {
		width: 44.5%;
		margin-bottom: 60px
	}

	*[data-component="news-year"] .items li a .image {
		margin-bottom: 60px
	}

	*[data-component="news-year"] .items li:first-child {
		width: 100%
	}

	*[data-component="news-year"] .items li:first-child a {
		flex-direction: row;
		align-items: center;
		justify-content: space-between
	}

	*[data-component="news-year"] .items li:first-child a .image,
	*[data-component="news-year"] .items li:first-child a .text {
		width: 44.5%
	}

	*[data-component="news-year"] .items li:first-child a .image {
		order: 2
	}

	*[data-component="news-year"] .items li:first-child a .text {
		order: 1
	}

	*[data-component="news-year"] .items li:nth-child(2n) {
		transform: translateY(-25%)
	}
}

*[data-component="product"] .product-image {
	width: calc(100% - 40px);
	height: auto;
	max-width: var(--widthInnerMax);
	margin: 60px auto 0 auto;
	overflow: hidden;
	padding: 0
}

*[data-component="product"] .product-image ul {
	height: 0;
	overflow: visible;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start
}

*[data-component="product"] .product-image ul li {
	display: inline-block;
	margin-top: 15px
}

*[data-component="product"] .product-image ul li:first-child {
	margin-top: 30px
}

*[data-component="product"] .product-image ul li a,
*[data-component="product"] .product-image ul li span {
	display: block;
	background-color: var(--color9);
	padding: 14px 15px 13px 15px;
	border-top-right-radius: 18px;
	border-bottom-right-radius: 18px;
	font-family: var(--fontSansLight);
	font-size: var(--textSize12);
	font-weight: 400;
	line-height: 12px;
	text-transform: uppercase;
	text-decoration: none;
	transition: opacity var(--animN) ease;
	opacity: .75
}

*[data-component="product"] .product-image ul li a:hover {
	opacity: 1
}

*[data-component="product"] .product-image ul li span {
	cursor: default;
	pointer-events: none
}

*[data-component="product"] .product-image img {
	width: 100%;
	height: auto;
	vertical-align: middle
}

*[data-component="product"] .product-image img.desktop {
	display: none
}

*[data-component="product"] .supports {
	display: flex;
	flex-direction: column;
	padding: 0 20px;
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="product"] .supports .support {
	padding-top: 90px;
	font-size: var(--textSize20);
	font-weight: 400;
	line-height: 30px
}

*[data-component="product"] .supports .support .top .support-type {
	font-size: var(--textSize20);
	font-weight: 600;
	text-transform: uppercase
}

*[data-component="product"] .supports .support .top .product-name {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 45px;
	text-transform: uppercase;
	margin: 25px 0
}

*[data-component="product"] .supports .support .top .material {
	font-family: var(--fontSansLight);
	font-size: var(--textSize16)
}

*[data-component="product"] .supports .support .top .material ul {
	list-style: none
}

*[data-component="product"] .supports .support .top .material a {
	text-decoration: none
}

*[data-component="product"] .supports .support .top .material a:hover {
	text-decoration: underline
}

*[data-component="product"] .supports .support .collection {
	padding-top: 30px
}

*[data-component="product"] .supports .support .collection .collection-title {
	font-size: var(--textSize20);
	line-height: normal;
	font-weight: 400;
	text-transform: uppercase
}

*[data-component="product"] .supports .support .collection ul {
	list-style: none;
	padding: 0
}

*[data-component="product"] .supports .support .collection ul li {
	padding: 0
}

*[data-component="product"] .supports .support .collection ul li .collection-name {
	text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
	font-size: var(--textSize20);
	line-height: normal
}

*[data-component="product"] .supports .support .collection ul li .measures {
	margin-top: 10px;
	font-family: var(--fontSansLight);
	font-size: var(--textSize16)
}

*[data-component="product"] .links {
	list-style: none;
	max-width: var(--widthInnerMax);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	padding: 20px 20px 0
}

*[data-component="product"] .links li {
	margin-right: 25px;
	margin-top: 20px
}

*[data-component="product"] .links li a {
	display: block;
	width: 48px;
	height: 48px;
	border-radius: 32px;
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGB8), 0.25);
	background-color: var(--color9);
	background-image: url(../images/document.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 42%;
	transition: filter var(--animN) ease, opacity var(--animN) ease
}

*[data-component="product"] .links li a svg path {
	transition: fill var(--animN) ease
}

*[data-component="product"] .links li a span {
	display: none
}

*[data-component="product"] .links li a.supports {
	background-image: url(../images/download.svg);
	background-size: 60%
}

*[data-component="product"] .links li a.image {
	background-image: url(../images/image.svg)
}

*[data-component="product"] .links li a.favorite {
	background-image: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center
}

*[data-component="product"] .links li a.disabled {
	pointer-events: none;
	opacity: .25
}

*[data-component="product"] .links li a.disabled svg path {
	fill: var(--color5)
}

*[data-component="product"] .links li a:hover,
*[data-component="product"] .links li a.selected {
	filter: invert(100%)
}

*[data-component="product"] .links li a.favorite.selected {
	filter: invert(0)
}

*[data-component="product"] .links li a.favorite.selected svg path {
	fill: var(--color1)
}

*[data-component="product"] .links li a.pulse svg {
	-webkit-animation-name: pulse;
	animation-name: pulse;
	-webkit-animation-duration: var(--animS);
	animation-duration: var(--animS)
}

@-webkit-keyframes pulse {
	0% {
		transform: scale(100%)
	}

	5% {
		transform: scale(115%)
	}

	100% {
		transform: scale(100%)
	}
}

@keyframes pulse {
	0% {
		transform: scale(100%)
	}

	5% {
		transform: scale(115%)
	}

	100% {
		transform: scale(100%)
	}
}

*[data-component="product"] .links li.favorites-limit-reached {
	display: block;
	height: 48px;
	border-radius: 32px;
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGB8), 0.25);
	display: flex;
	align-items: center;
	padding: 0 20px;
	opacity: 0;
	transition: opacity var(--animN) ease
}

*[data-component="product"] .links li.favorites-limit-reached.visible {
	opacity: 1
}

*[data-component="product"] .video {
	width: 100%;
	height: auto;
	max-width: var(--widthInnerMax);
	margin: 60px auto 0 auto
}

*[data-component="product"] .video video {
	width: 100%;
	height: 100%;
	background-color: var(--color8);
	cursor: pointer
}

*[data-component="product"] .video.embed-youtube iframe {
	width: 100%;
	height: 100%
}

*[data-component="product"] .products-grid {
	margin-top: 30px
}

*[data-component="product"] *[data-component="products-grid"] h2 {
	padding-bottom: 40px
}

*[data-component="product"] *[data-component="products-grid"].effects h2 {
	margin-top: 0;
	padding-top: 0
}

*[data-component="product"] .disclaimer {
	padding: 40px 20px 100px;
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="product"] .context-menu-custom {
	opacity: 0;
	transition: opacity var(--animN) ease;
	pointer-events: none;
	padding: 6px;
	position: absolute;
	background-color: var(--color1);
	color: var(--color0);
	z-index: 12;
	color: var(--color6);
	font-size: var(--textSize12);
	font-family: var(--fontSans);
	background-color: var(--color4);
	padding: 7px 10px 5px;
	border-radius: 4px;
	box-shadow: 1px 2px 1px 1px rgba(0, 0, 0, 0.1);
	transform: translateY(3px);
	transition: transform var(--animN) ease, opacity var(--animN) ease, background-color var(--animN) ease, color var(--animN) ease;
	text-align: center
}

*[data-component="product"] .context-menu-custom:hover {
	background-color: var(--color0);
	color: var(--color1)
}

*[data-component="product"] .context-menu-custom.visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: all
}

@media all and (min-width: 1024px) {
	*[data-component="product"] .product-image {
		margin-top: 120px
	}

	*[data-component="product"] .supports {
		flex-direction: row
	}

	*[data-component="product"] .supports .support {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width: calc((100% - 20px) / 3)
	}

	*[data-component="product"] .supports .support .collection {
		min-height: 190px
	}
}

@media all and (min-width: 640px) {
	*[data-component="product"] .product-image img.mobile {
		display: none
	}

	*[data-component="product"] .product-image img.desktop {
		display: block
	}
}

*[data-component="company-root"] {
	padding-bottom: 100px
}

*[data-component="company-root"] .cover {
	overflow: hidden;
	position: relative;
	height: 100vh;
	background-color: var(--color8);
	display: flex;
	align-items: center;
	justify-content: center
}

*[data-component="company-root"] .cover video,
*[data-component="company-root"] .cover img {
	width: calc(100vw + 2px);
	height: calc(100vh + 2px);
	-o-object-fit: cover;
	object-fit: cover;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 0
}

*[data-component="company-root"] .awards {
	max-width: var(--widthInnerMax);
	margin: 60px auto 30px;
	padding: 20px
}

*[data-component="company-root"] .awards ul {
	display: flex;
	flex-direction: column;
	margin-top: 40px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.8px
}

*[data-component="company-root"] .awards ul li {
	display: flex;
	margin-bottom: 30px
}

*[data-component="company-root"] .awards ul li>div:first-child {
	width: 100px
}

*[data-component="company-root"] .awards ul li .name {
	text-transform: uppercase
}

*[data-component="company-root"] .awards ul li a {
	text-transform: uppercase
}

*[data-component="company-root"] .awards ul li>div:nth-child(2) {
	padding: 0 0 20px 20px
}

@media all and (min-width: 768px) {
	*[data-component="company-root"] .awards ul {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between
	}

	*[data-component="company-root"] .awards ul li {
		width: calc((100% - 30px) / 2)
	}
}

@media all and (min-width: 1024px) {
	*[data-component="company-root"] .awards ul {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start
	}

	*[data-component="company-root"] .awards ul li {
		width: calc((100% - 40px) / 3)
	}

	*[data-component="company-root"] .awards ul li:nth-child(3n+1),
	*[data-component="company-root"] .awards ul li:nth-child(3n+2) {
		margin-right: 20px
	}
}

*[data-component="legal-info-article"] {
	margin: var(--pageMarginTop) 0
}

*[data-component="legal-info-article"] .paragraph {
	padding: 30px 20px;
	display: flex;
	flex-direction: column;
	align-items: center
}

*[data-component="legal-info-article"] .paragraph h2 {
	padding: 30px 0;
	text-align: center;
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px;
	max-width: 650px
}

*[data-component="legal-info-article"] .paragraph div {
	line-height: 24px;
	letter-spacing: 0.8px;
	max-width: 560px
}

*[data-component="legal-info-article"] .paragraph .resources {
	width: 100%;
	max-width: 560px;
	padding: 20px 0;
	padding-left: 20px
}

*[data-component="legal-info-article"] .paragraph .resources li {
	margin: 10px 0
}

*[data-component="legal-info-article"] .paragraph .resources li a {
	text-decoration: none
}

*[data-component="legal-info-article"] .paragraph .resources li a:hover {
	text-decoration: underline
}

*[data-component="dealers-root"] {
	margin: var(--pageMarginTop) auto 0;
	padding: 0 20px;
	max-width: var(--widthMax)
}

*[data-component="dealers-root"] .upper .tools {
	display: flex;
	height: 48px;
	max-width: 498px;
	border-radius: 24px;
	box-shadow: 0 0 2px 2px rgba(var(--colorRGB9), 0.5);
	overflow: hidden;
	margin-bottom: 60px
}

*[data-component="dealers-root"] .upper .tools .button-geolocation,
*[data-component="dealers-root"] .upper .tools .button-clear {
	background-position: center;
	background-repeat: no-repeat;
	width: 58px;
	flex-grow: 0;
	flex-shrink: 0;
	cursor: pointer;
	opacity: .75;
	transition: opacity var(--animN) ease
}

*[data-component="dealers-root"] .upper .tools .button-geolocation:hover,
*[data-component="dealers-root"] .upper .tools .button-clear:hover {
	opacity: 1
}

*[data-component="dealers-root"] .upper .tools .button-geolocation {
	background-image: url(../images/geolocation.svg);
	border-top-right-radius: 24px;
	border-bottom-right-radius: 24px
}

*[data-component="dealers-root"] .upper .tools .button-clear {
	background-image: url(../images/clear.svg);
	border-top-left-radius: 24px;
	border-bottom-left-radius: 24px
}

*[data-component="dealers-root"] .upper .tools input {
	background-color: transparent;
	color: var(--color9);
	outline: 0;
	flex-grow: 1;
	flex-shrink: 1
}

*[data-component="dealers-root"] .upper .mode-selector {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	margin-bottom: 60px
}

*[data-component="dealers-root"] .upper .mode-selector div:not([data-component="switch"]) {
	padding: 0 10px
}

*[data-component="dealers-root"] .upper .mode-selector .label-by-name,
*[data-component="dealers-root"] .upper .mode-selector .label-by-location {
	transition: color var(--animN) ease
}

*[data-component="dealers-root"] .upper.by-name input[data-id="by-location"] {
	display: none
}

*[data-component="dealers-root"] .upper.by-name .label-by-location {
	color: var(--color5)
}

*[data-component="dealers-root"] .upper.by-location input[data-id="by-name"] {
	display: none
}

*[data-component="dealers-root"] .upper.by-location .label-by-name {
	color: var(--color5)
}

*[data-component="dealers-root"] .map-container .map {
	background-color: #F5F5F5;
	width: 100%;
	height: 100vw
}

*[data-component="dealers-root"] .map-container .map.visible {
	opacity: 1
}

*[data-component="dealers-root"] .map-container .map.static-image {
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain
}

*[data-component="dealers-root"] .map-container .map .temp-markers-container .temp_marker {
	position: absolute;
	cursor: pointer
}

*[data-component="dealers-root"] .map-container .map .temp-markers-container .temp_marker.selected {
	-webkit-animation-name: invert;
	animation-name: invert;
	-webkit-animation-duration: var(--animN);
	animation-duration: var(--animN)
}

@-webkit-keyframes invert {
	0% {
		filter: invert(0%)
	}

	20% {
		filter: invert(100%)
	}

	100% {
		filter: invert(0%)
	}
}

@keyframes invert {
	0% {
		filter: invert(0%)
	}

	20% {
		filter: invert(100%)
	}

	100% {
		filter: invert(0%)
	}
}

*[data-component="dealers-root"] .dealers-container {
	pointer-events: none
}

*[data-component="dealers-root"] .dealers-container .dealers {
	pointer-events: all;
	background-color: rgba(var(--colorRGB0), 0.85);
	padding: 20px;
	color: var(--color8);
	overflow-x: hidden;
	overflow-y: auto;
	list-style: none;
	display: flex;
	flex-direction: column;
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
	letter-spacing: 0.8px
}

*[data-component="dealers-root"] .dealers-container .dealers li {
	padding: 20px;
	cursor: pointer
}

*[data-component="dealers-root"] .dealers-container .dealers li pre {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	white-space: normal
}

*[data-component="dealers-root"] .dealers-container .dealers li pre a {
	text-decoration: none
}

*[data-component="dealers-root"] .dealers-container .dealers li pre a:hover {
	text-decoration: underline
}

*[data-component="dealers-root"] .dealers-container .dealers li.hidden {
	display: none
}

*[data-component="dealers-root"] .dealers-container .dealers li.fadein {
	-webkit-animation-name: fadein;
	animation-name: fadein;
	-webkit-animation-duration: var(--animN);
	animation-duration: var(--animN);
	-webkit-animation-timing-function: ease;
	animation-timing-function: ease
}

*[data-component="dealers-root"] .spacer {
	height: 120px
}

@media all and (min-width: 768px) {
	*[data-component="dealers-root"] .map-container {
		height: 0;
		overflow: visible;
		background-color: var(--color0)
	}

	*[data-component="dealers-root"] .map-container .map {
		position: relative;
		z-index: 1;
		opacity: 0;
		transition: opacity var(--animN) ease;
		height: auto;
		aspect-ratio: 1232 / 925;
		max-height: 80vh
	}

	*[data-component="dealers-root"] .dealers-container {
		position: relative;
		z-index: 2;
		width: 100%;
		aspect-ratio: 1232 / 925;
		overflow: hidden;
		max-height: 80vh
	}

	*[data-component="dealers-root"] .dealers-container .dealers {
		max-width: calc(100% / 3);
		height: 100%;
		max-height: 100%;
		padding-bottom: 0;
		transition: transform var(--animN) var(--timingBezier);
		padding-bottom: 640px
	}

	*[data-component="dealers-root"] .dealers-container .dealers.hidden {
		transform: translateX(calc(-100% - 2px))
	}
}

*[data-component="news"] {
	margin: var(--pageMarginTop) auto;
	padding: 0 20px;
	max-width: var(--widthInnerMax)
}

*[data-component="news"] .upper {
	padding: 0
}

*[data-component="news"] .upper .left {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-bottom: calc(var(--padding) * 3)
}

*[data-component="news"] .video video {
	width: 100%;
	height: auto;
	margin-bottom: 60px
}

*[data-component="news"] .images {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-between
}

*[data-component="news"] .images figure {
	width: 100%;
	height: auto;
	margin-bottom: 60px
}

*[data-component="news"] .images figure img {
	width: 100%;
	height: auto
}

*[data-component="news"] .content {
	display: flex;
	flex-direction: column
}

*[data-component="news"] .content .text,
*[data-component="news"] .content .image {
	margin-bottom: 60px
}

*[data-component="news"] .content .text h1,
*[data-component="news"] .content .image h1 {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-style: normal;
	font-weight: 250;
	line-height: 48px
}

*[data-component="news"] .content .text .link,
*[data-component="news"] .content .image .link {
	margin-top: 60px
}

*[data-component="news"] .content .text .cont,
*[data-component="news"] .content .image .cont {
	font-weight: 300;
	line-height: 24px;
	letter-spacing: 0.8px
}

*[data-component="news"] .content .text img,
*[data-component="news"] .content .image img {
	width: 100%;
	height: auto
}

*[data-component="news"] .images figcaption,
*[data-component="news"] .content figcaption {
	padding: 6px 0;
	font-family: var(--fontSans);
	font-size: var(--textSize12);
	color: var(--color5)
}

*[data-component="news"] *[data-component="standard-contents"] {
	margin-bottom: 15px
}

@media all and (min-width: 768px) {
	*[data-component="news"] .upper {
		flex-direction: row;
		align-items: baseline;
		justify-content: space-between
	}

	*[data-component="news"] .upper .left {
		margin-top: -9px
	}

	*[data-component="news"] .upper .left,
	*[data-component="news"] .upper .right {
		width: 150px;
		flex-shrink: 0
	}

	*[data-component="news"] .images.grid {
		flex-direction: row
	}

	*[data-component="news"] .images.grid figure {
		width: calc((100% - 30px) / 2);
		margin-bottom: 120px
	}

	*[data-component="news"] .content {
		flex-direction: row;
		justify-content: space-between;
		margin-bottom: 60px
	}

	*[data-component="news"] .content .text,
	*[data-component="news"] .content .image {
		width: calc((100% - 30px) / 2)
	}

	*[data-component="news"] *[data-component="standard-contents"] {
		margin-bottom: 120px
	}
}

*[data-component="downloads"] {
	--itemsPerRow: 2;
	margin: var(--pageMarginTop) 0;
	padding: 0 20px
}

*[data-component="downloads"] .blocks {
	max-width: var(--widthInnerMax);
	margin: 0 auto
}

*[data-component="downloads"] .blocks .block {
	margin-bottom: 120px
}

*[data-component="downloads"] .blocks .block h2 {
	text-align: center
}

*[data-component="downloads"] .blocks .block ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap
}

*[data-component="downloads"] .blocks .block ul li {
	width: calc((100% - ((var(--itemsPerRow) - 1) * var(--gutter))) / var(--itemsPerRow));
	margin-bottom: 40px
}

*[data-component="downloads"] .blocks .block ul li a {
	display: block;
	text-decoration: none;
	transition: opacity var(--animN) ease
}

*[data-component="downloads"] .blocks .block ul li a figure img {
	width: 100%;
	height: auto;
	background-color: rgba(var(--colorRGB0), 0.03)
}

*[data-component="downloads"] .blocks .block ul li a figure figcaption {
	text-align: center;
	font-family: var(--fontSans);
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.8px;
	padding-top: 8px
}

*[data-component="downloads"] .blocks .block ul li a:hover {
	opacity: .75
}

*[data-component="downloads"] .blocks .block ul li:nth-child(2n+1) {
	margin-right: var(--gutter)
}

@media all and (min-width: 480px) {
	*[data-component="downloads"] .blocks .block ul li:nth-child(2n+1) {
		margin-right: var(--gutter)
	}
}

@media all and (min-width: 640px) {
	*[data-component="downloads"] {
		--itemsPerRow: 3
	}

	*[data-component="downloads"] .blocks .block ul li:nth-child(2n+1) {
		margin-right: 0
	}

	*[data-component="downloads"] .blocks .block ul li:nth-child(3n+1),
	*[data-component="downloads"] .blocks .block ul li:nth-child(3n+2) {
		margin-right: var(--gutter)
	}
}

@media all and (min-width: 768px) {
	*[data-component="downloads"] {
		margin: var(--pageMarginTop) 0
	}
}

@media all and (min-width: 1024px) {
	*[data-component="downloads"] {
		--itemsPerRow: 4
	}

	*[data-component="downloads"] .blocks .block ul li:nth-child(3n+1),
	*[data-component="downloads"] .blocks .block ul li:nth-child(3n+2) {
		margin-right: 0
	}

	*[data-component="downloads"] .blocks .block ul li:nth-child(4n+1),
	*[data-component="downloads"] .blocks .block ul li:nth-child(4n+2),
	*[data-component="downloads"] .blocks .block ul li:nth-child(4n+3) {
		margin-right: var(--gutter)
	}
}

*[data-component="careers-root"] {
	margin: var(--pageMarginTop) 0
}

*[data-component="careers-root"] .upper .center .subtitle2 {
	font-weight: 300;
	line-height: 24px
}

*[data-component="careers-root"] .cover {
	margin-top: 40px
}

*[data-component="careers-root"] .cover img {
	width: 100%;
	height: auto
}

*[data-component="careers-root"] .cont {
	padding: 0 20px;
	margin: 50px auto 0;
	max-width: 631px;
	font-weight: 300;
	line-height: 24px
}

*[data-component="careers-root"] .items {
	margin: 79px auto 0 auto;
	padding: 0 20px;
	max-width: var(--widthInnerMax);
	list-style: none
}

*[data-component="careers-root"] .items li {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-top: 80px
}

*[data-component="careers-root"] .items li:first-child {
	margin-top: 0
}

*[data-component="careers-root"] .items li .eyelet {
	font-size: var(--textSize20);
	font-weight: 600;
	line-height: normal;
	letter-spacing: 1px;
	text-transform: uppercase
}

*[data-component="careers-root"] .items li h2 {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px
}

*[data-component="careers-root"] .items li a {
	display: inline-flex;
	height: 48px;
	padding: 0px 64px;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 24px;
	background-color: var(--color8);
	box-shadow: 0px 0px 6px 0px rgba(var(--colorRGB9), 0.5);
	font-size: 12px;
	font-weight: 400;
	line-height: 12px;
	letter-spacing: 0.6px;
	margin-top: 20px;
	transition: background-color var(--animN) ease, color var(--animN) ease;
	align-self: center
}

*[data-component="careers-root"] .items li a:hover {
	background-color: var(--color9);
	color: var(--color8)
}

@media all and (min-width: 768px) {
	*[data-component="careers-root"] {
		margin-top: var(--pageMarginTop)
	}

	*[data-component="careers-root"] .items li {
		flex-direction: row;
		justify-content: space-between
	}

	*[data-component="careers-root"] .items li a {
		margin-top: 25px
	}
}

*[data-component="career"] {
	margin: calc(var(--pageMarginTop) + 73px) 0 0
}

*[data-component="career"] .body {
	padding: 0 20px;
	margin: 50px auto 120px;
	max-width: 631px;
	font-weight: 300;
	line-height: 24px
}

*[data-component="career"] .body form {
	margin-top: 30px;
	transition: opacity var(--animS) ease
}

*[data-component="career"] .body form fieldset .field {
	display: flex;
	align-items: center;
	margin-top: 20px;
	border: solid 1px var(--color8);
	height: 48px;
	border-radius: 24px;
	overflow: hidden;
	background-color: var(--color9);
	transition: background-color var(--animN) ease
}

*[data-component="career"] .body form fieldset .field.error {
	background-color: rgba(var(--colorRGB10), 0.25)
}

*[data-component="career"] .body form fieldset .field input,
*[data-component="career"] .body form fieldset .field select,
*[data-component="career"] .body form fieldset .field div {
	width: 100%;
	height: 100%;
	padding: 0 24px;
	outline: 0;
	background-color: transparent;
	color: var(--color8)
}

*[data-component="career"] .body form fieldset .field select {
	width: calc(100% - 15px)
}

*[data-component="career"] .body form fieldset .field.file {
	padding-left: 24px;
	cursor: pointer
}

*[data-component="career"] .body form fieldset .field.file input[type="file"] {
	display: none
}

*[data-component="career"] .body form fieldset .field.file span {
	flex-shrink: 1;
	flex-grow: 1;
	line-height: 16px
}

*[data-component="career"] .body form fieldset .field.file div {
	background-color: var(--color8);
	color: var(--color9);
	border-radius: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30%;
	min-width: 150px;
	flex-shrink: 0;
	flex-grow: 0;
	font-size: var(--textSize12);
	text-transform: uppercase;
	text-align: center;
	line-height: normal
}

*[data-component="career"] .body form fieldset .file-error {
	padding: 10px 24px 0;
	color: var(--color10);
	font-size: var(--textSize12)
}

*[data-component="career"] .body form fieldset .disclaimer {
	margin-top: 48px;
	font-family: var(--fontSans);
	font-size: var(--textSize12);
	font-weight: 400;
	line-height: 16px
}

*[data-component="career"] .body form fieldset .button-submit {
	margin-top: 30px;
	text-align: center
}

*[data-component="career"] .body form fieldset .button-submit button {
	background-color: var(--color8);
	color: var(--color9);
	cursor: pointer;
	transition: background-color var(--animN) ease, color var(--animN) ease;
	text-transform: uppercase
}

*[data-component="career"] .body form fieldset .button-submit button:hover {
	background-color: var(--color9);
	color: var(--color8)
}

*[data-component="career"] .body form.hidden {
	opacity: .25
}

*[data-component="career"] .body .response {
	margin-top: 20px;
	text-align: center
}

*[data-component="career"] .body .response.error {
	color: var(--color10)
}

@media all and (min-width: 768px) {
	*[data-component="career"] {
		margin-top: calc(var(--pageMarginTop) + 13px)
	}
}

*[data-component="product-solid-colour"] .product-image {
	width: calc(100% - 40px);
	height: auto;
	max-width: var(--widthInnerMax);
	margin: 60px auto 0 auto;
	overflow: hidden;
	padding: 0
}

*[data-component="product-solid-colour"] .product-image ul {
	height: 0;
	overflow: visible;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start
}

*[data-component="product-solid-colour"] .product-image ul li {
	display: inline-block;
	margin-top: 15px
}

*[data-component="product-solid-colour"] .product-image ul li:first-child {
	margin-top: 30px
}

*[data-component="product-solid-colour"] .product-image ul li a,
*[data-component="product-solid-colour"] .product-image ul li span {
	display: block;
	background-color: var(--color9);
	padding: 14px 15px 13px 25px;
	border-top-right-radius: 18px;
	border-bottom-right-radius: 18px;
	font-family: var(--fontSansLight);
	font-size: var(--textSize12);
	font-weight: 400;
	line-height: 12px;
	text-transform: uppercase;
	text-decoration: none;
	transition: opacity var(--animN) ease;
	opacity: .75
}

*[data-component="product-solid-colour"] .product-image ul li a:hover {
	opacity: 1
}

*[data-component="product-solid-colour"] .product-image ul li span {
	cursor: default;
	pointer-events: none
}

*[data-component="product-solid-colour"] .product-image img {
	width: 100%;
	height: auto
}

*[data-component="product-solid-colour"] .product-image img.desktop {
	display: none
}

*[data-component="product-solid-colour"] .content {
	margin: 60px auto 0;
	padding: 0 20px;
	max-width: 650px;
	text-align: center;
	margin-bottom: 90px
}

*[data-component="product-solid-colour"] .content .text {
	font-family: var(--fontSansLight);
	font-size: var(--textSize42);
	font-weight: 250;
	line-height: 48px
}

*[data-component="product-solid-colour"] .content .cont {
	margin-top: 20px;
	font-weight: 300;
	line-height: 24px;
	letter-spacing: 0.8px
}

@media all and (min-width: 640px) {
	*[data-component="product-solid-colour"] .product-image img.mobile {
		display: none
	}

	*[data-component="product-solid-colour"] .product-image img.desktop {
		display: block
	}
}

*[data-component="newsletter-root"] {
	margin: calc(var(--pageMarginTop) + 73px) 0 0
}

*[data-component="newsletter-root"] .body {
	padding: 0 20px;
	margin: 50px auto 120px;
	max-width: 631px;
	font-weight: 300;
	line-height: 24px
}

*[data-component="newsletter-root"] .body form {
	margin-top: 30px;
	transition: opacity var(--animS) ease
}

*[data-component="newsletter-root"] .body form fieldset .field {
	display: flex;
	align-items: center;
	margin-top: 20px;
	border: solid 1px var(--color9);
	height: 48px;
	border-radius: 24px;
	overflow: hidden;
	background-color: var(--color8);
	color: var(--color9);
	transition: background-color var(--animN) ease
}

*[data-component="newsletter-root"] .body form fieldset .field.error {
	background-color: rgba(var(--colorRGB10), 0.25)
}

*[data-component="newsletter-root"] .body form fieldset .field.error input,
*[data-component="newsletter-root"] .body form fieldset .field.error select {
	background-color: rgba(var(--colorRGB10), 0.25)
}

*[data-component="newsletter-root"] .body form fieldset .field input,
*[data-component="newsletter-root"] .body form fieldset .field select,
*[data-component="newsletter-root"] .body form fieldset .field div {
	color: var(--color9);
	width: 100%;
	height: 100%;
	padding: 0 24px;
	outline: 0;
	background-color: var(--color8);
	transition: background-color var(--animN) ease
}

*[data-component="newsletter-root"] .body form fieldset .field select {
	width: calc(100% - 15px)
}

*[data-component="newsletter-root"] .body form fieldset .disclaimer {
	margin-top: 48px;
	font-family: var(--fontSans);
	font-size: var(--textSize12);
	font-weight: 400;
	line-height: 16px
}

*[data-component="newsletter-root"] .body form fieldset .button-submit {
	margin-top: 30px;
	text-align: center
}

*[data-component="newsletter-root"] .body form fieldset .button-submit button {
	background-color: var(--color9);
	color: var(--color8);
	cursor: pointer;
	transition: background-color var(--animN) ease, color var(--animN) ease;
	text-transform: uppercase
}

*[data-component="newsletter-root"] .body form fieldset .button-submit button:hover {
	background-color: var(--color8);
	color: var(--color9)
}

*[data-component="newsletter-root"] .body form.hidden {
	opacity: .25
}

*[data-component="newsletter-root"] .body .response {
	margin-top: 20px;
	text-align: center
}

*[data-component="newsletter-root"] .body .response.error {
	color: var(--color10)
}

@media all and (min-width: 768px) {
	*[data-component="newsletter-root"] {
		margin-top: calc(var(--pageMarginTop) + 13px)
	}
}

*[data-component="error-page"] {
	margin: var(--pageMarginTop) 0
}

*[data-component="product-collections-manage"] ul.grid>li>ul.collections {
	list-style: none;
	height: 0;
	overflow: visible;
	position: relative;
	z-index: 3;
	padding: 0;
	font-size: var(--textSize10);
	font-family: var(--fontSans);
	text-transform: uppercase;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: flex-start
}

*[data-component="product-collections-manage"] ul.grid>li>ul.collections>li {
	width: auto;
	margin: 10px 0 0
}

*[data-component="product-collections-manage"] ul.grid>li>ul.collections>li:first-child {
	margin-top: 20px
}

*[data-component="product-collections-manage"] ul.grid>li>ul.collections>li a,
*[data-component="product-collections-manage"] ul.grid>li>ul.collections>li span {
	height: 26px;
	background-color: var(--color9);
	padding: 2px 15px 0 10px;
	border-top-right-radius: 13px;
	border-bottom-right-radius: 13px;
	opacity: .75;
	transition: opacity var(--animN) ease;
	display: flex;
	align-items: center
}

*[data-component="product-collections-manage"] ul.grid>li>ul.collections>li a:hover {
	opacity: 1
}

.favorites-panel-container {
	width: 100%;
	height: 0;
	position: fixed;
	z-index: 9;
	bottom: 0;
	left: 0;
	display: flex;
	justify-content: center
}

.favorites-panel-container .favorites-panel-container-inner {
	width: 100%;
	max-width: var(--widthMax);
	display: flex;
	justify-content: flex-end;
	align-items: flex-end
}

.favorites-panel {
	--sizeClosed: 57px;
	--widthOpen: 345px;
	--heightOpen: 286px;
	--topHeight: 50px;
	--bottomHeight: 71px;
	--moduleA: 20px;
	--moduleB: 20px;
	--itemHeight: 55px;
	--iconSize: 37px;
	--buttonsWidth: 40px;
	position: relative;
	bottom: 20px;
	right: 20px;
	width: var(--sizeClosed);
	height: var(--sizeClosed);
	display: block;
	background-color: var(--color8);
	color: var(--color9);
	border-radius: calc(var(--sizeClosed) / 2);
	transition: opacity var(--animN) ease;
	overflow: hidden;
	font-family: var(--fontNormal);
	font-size: 15px;
	box-sizing: border-box
}

.favorites-panel .inner {
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--animN) ease;
	position: relative
}

.favorites-panel .inner .top {
	height: var(--topHeight);
	display: flex;
	flex-direction: row;
	align-items: center;
	border-bottom: solid 1px var(--color0);
	margin: calc(var(--moduleA) / 2) var(--moduleA) 0
}

.favorites-panel .inner .top .icon-heart {
	width: 20px;
	height: 17px;
	background-image: url(../images/heart.svg);
	background-size: contain;
	background-repeat: no-repeat;
	filter: invert(100%);
	margin-right: calc(var(--iconSize) + var(--moduleB) - 20px)
}

.favorites-panel .inner .top .info {
	width: calc(100% - var(--iconSize) - var(--moduleB) - var(--buttonsWidth))
}

.favorites-panel .inner .top .info .selected-counter {
	font-size: 13px;
	color: var(--color5)
}

.favorites-panel .inner .top .button-close {
	width: var(--buttonsWidth);
	height: 100%;
	cursor: pointer;
	background-image: url(../images/close.svg);
	background-repeat: no-repeat;
	background-position: right center;
	opacity: .75;
	transition: opacity var(--animN) ease
}

.favorites-panel .inner .top .button-close:hover {
	opacity: 1
}

.favorites-panel .inner .items {
	height: calc(var(--heightOpen) - var(--topHeight) - var(--bottomHeight));
	overflow: auto;
	font-family: var(--fontSans);
	text-transform: uppercase;
	font-size: 14px
}

.favorites-panel .inner .items::-webkit-scrollbar {
	width: 0 !important;
	height: 0 !important
}

.favorites-panel .inner .items .item {
	overflow: hidden;
	transition: height var(--animN) ease, opacity var(--animN) ease, background-color var(--animN) ease;
	opacity: 0;
	height: 0;
	cursor: pointer
}

.favorites-panel .inner .items .item .inner {
	height: var(--itemHeight);
	margin: 0 var(--moduleA);
	display: flex;
	align-items: center
}

.favorites-panel .inner .items .item .inner .icon {
	width: var(--iconSize);
	height: var(--iconSize);
	margin-right: var(--moduleB);
	background-color: rgba(var(--colorRGB0), 0.1)
}

.favorites-panel .inner .items .item .inner .name {
	width: calc(100% - var(--iconSize) - var(--moduleB) - var(--buttonsWidth))
}

.favorites-panel .inner .items .item .inner .button-item-remove {
	width: var(--buttonsWidth);
	height: 100%;
	cursor: pointer;
	background-image: url(../images/remove.svg);
	background-repeat: no-repeat;
	background-position: right center;
	opacity: .75;
	transition: opacity var(--animN) ease
}

.favorites-panel .inner .items .item .inner .button-item-remove:hover {
	opacity: 1
}

.favorites-panel .inner .items .item:not(:first-child) .inner {
	border-top: solid 1px var(--color0)
}

.favorites-panel .inner .items .item.added {
	opacity: 1;
	height: var(--itemHeight)
}

.favorites-panel .inner .items .item.hard {
	transition: none
}

.favorites-panel .inner .items .item.removing {
	height: 0;
	opacity: 0
}

.favorites-panel .inner .items .item:hover {
	background-color: rgba(var(--colorRGB6), 0.25)
}

.favorites-panel .inner .bottom {
	height: var(--bottomHeight);
	margin: 0 var(--moduleA) var(--moduleA)
}

.favorites-panel .inner .bottom .row-remove-all {
	text-align: right;
	border-top: solid 1px var(--color0)
}

.favorites-panel .inner .bottom .row-remove-all .button-remove-all {
	cursor: pointer;
	padding: 10px 0
}

.favorites-panel .inner .bottom .row-download-pdf {
	display: flex;
	justify-content: flex-end;
	border-top: solid 1px var(--color0)
}

.favorites-panel .inner .bottom .row-download-pdf .button-download-pdf {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: calc(100% - var(--iconSize) - var(--moduleB));
	padding: 7px 0;
	cursor: pointer
}

.favorites-panel .inner .bottom .row-download-pdf .button-download-pdf .icon-pdf {
	width: 25px;
	height: 31px;
	background-image: url(../images/document-pdf.svg);
	background-repeat: no-repeat;
	background-size: contain
}

.favorites-panel .heart {
	position: absolute;
	width: var(--sizeClosed);
	height: var(--sizeClosed);
	background-image: url(../images/heart.svg);
	background-position: center;
	background-repeat: no-repeat;
	filter: invert(100%);
	opacity: 1;
	transition: filter var(--animN) ease, opacity var(--animN) ease;
	cursor: pointer;
	margin-left: calc(100% - var(--sizeClosed))
}

.favorites-panel .heart:hover {
	filter: invert(0%)
}

.favorites-panel.hidden {
	opacity: 0;
	pointer-events: none
}

.favorites-panel.open {
	width: var(--widthOpen);
	height: var(--heightOpen)
}

.favorites-panel.open .heart {
	opacity: 0;
	pointer-events: none
}

.favorites-panel.open .inner {
	opacity: 1;
	pointer-events: all
}

.favorites-panel.opening {
	-webkit-animation-name: favorites-panel-open;
	animation-name: favorites-panel-open;
	-webkit-animation-duration: var(--animS);
	animation-duration: var(--animS);
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards
}

.favorites-panel.opening .heart {
	opacity: 0;
	pointer-events: none
}

.favorites-panel.closing {
	-webkit-animation-name: favorites-panel-close;
	animation-name: favorites-panel-close;
	-webkit-animation-duration: var(--animS);
	animation-duration: var(--animS);
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards
}

.favorites-panel.closing .heart {
	opacity: 0;
	pointer-events: none
}

@-webkit-keyframes favorites-panel-open {
	0% {
		width: var(--sizeClosed);
		height: var(--sizeClosed)
	}

	50% {
		width: var(--widthOpen);
		height: var(--sizeClosed)
	}

	100% {
		width: var(--widthOpen);
		height: var(--heightOpen)
	}
}

@keyframes favorites-panel-open {
	0% {
		width: var(--sizeClosed);
		height: var(--sizeClosed)
	}

	50% {
		width: var(--widthOpen);
		height: var(--sizeClosed)
	}

	100% {
		width: var(--widthOpen);
		height: var(--heightOpen)
	}
}

@-webkit-keyframes favorites-panel-close {
	0% {
		width: var(--widthOpen);
		height: var(--heightOpen)
	}

	50% {
		width: var(--widthOpen);
		height: var(--sizeClosed)
	}

	100% {
		width: var(--sizeClosed);
		height: var(--sizeClosed)
	}
}

@keyframes favorites-panel-close {
	0% {
		width: var(--widthOpen);
		height: var(--heightOpen)
	}

	50% {
		width: var(--widthOpen);
		height: var(--sizeClosed)
	}

	100% {
		width: var(--sizeClosed);
		height: var(--sizeClosed)
	}
}

*[data-component="switch"] {
	width: 48px;
	height: 24px;
	border: solid 1px #999;
	border-radius: 12.5px;
	transition: all 250ms ease;
	cursor: pointer;
	padding: 0
}

*[data-component="switch"].disabled {
	cursor: not-allowed;
	opacity: 0.5
}

*[data-component="switch"]:before {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: solid 1px #999;
	background-color: #FFF;
	margin: 1px 0 0 1px;
	transition: all 250ms ease
}

*[data-component="switch"].on:before {
	margin-left: 25px
}

*[data-component="switch"]:hover:before {
	background-color: #999
}