@charset "UTF-8";

:root {
	--color-black: 0,0,0;
	--color-aqua: 120,205,212; /* #78CDD4 */
	--color-blue-dark: 0,37,64; /* #002540 */
	--color-grey-53: 129,131,134; /* #818386 */
	--color-grey-80: 199,201,203; /* #C7C9CB */
	--color-grey-96: 239,243,245; /* #EFF3F5 */
	
	/*--color-blue: 23,43,68; /* #172B44 */
	/*--color-grey: 227,227,229; /* #E3E3E5 */
	--color-white: 255,255,255;
	
	--color-blue: 0,36,76;
    --color-dark-grey: 35, 31, 32;
	--color-grey-93: 238,238,238;
	--color-grey-warm: 101,92,86;
	--color-unit-floor: 255, 255, 255;
    --color-unit-floor-stroke: 35, 31, 32;
    --color-unit-others: 255, 255, 255;
    --color-unit-others-stroke: 35, 31, 32;
    --color-unit-unavailable: 178, 178, 178;
    --color-unit-unavailable-stroke: 35, 31, 32;
    --color-unit-match: 120,205,212;
    --color-unit-match-stroke: 35, 31, 32;
    --color-unit-match-active: 62, 165, 175;
    --color-unit-other: 161, 227, 229;
    --color-unit-other-stroke: 35, 31, 32;
	
	--transition-timing-ease-in-out: cubic-bezier(0.6,0,0.4,1);

	--base-w: 1920;
	--base-w-mobile: 414;
	--page-margin: min(54px, (54 / var(--base-w)) * 100vw);
	--page-margin-neg: calc(var(--page-margin) * -1);
	--page-gap: var(--page-margin);
	--page-gap-neg: var(--page-margin-neg);
	--grid-column-gap: min(36px, (36 / var(--base-w)) * 100vw);
	--grid-column-w: calc((min(var(--base-w) * 1px, 100vw) - (var(--page-margin) * 2) - (11 * var(--grid-column-gap))) / 12);
	--grid-row-gap: clamp(0px, (56 / var(--base-w)) * 100vw, 56px);
	/*--header-img-h: min(100vh, (1080 / 1920) * 100vw);*/
	--header-img-h: min(100vh, (9 / 16) * 100vw);
	--header-logo-w: clamp((16 / 20) * 72px, (72 / var(--base-w)) * 100vw, 72px);
	--header-logo-h: clamp((16 / 20) * 108px, (108 / var(--base-w)) * 100vw, 108px);
	--header-ico-h: clamp((16 / 20) * 22px, (22 / var(--base-w)) * 100vw, 22px);
}

html {
	height: 100%;
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

body {
	width: 100%;
	height: 100%;
	background-color: rgb(var(--color-white));
	overflow-x: hidden;
	overflow-y: scroll;
}

body.noscroll {
	overflow: hidden;
}

/*body.loading:after {
    content: "";
    display: block;
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    background: rgb(var(--color-black)) url("../images/) center center no-repeat;
    background-size: clamp(200px, (400 / 1920) * 100vw, 400px) auto;
    pointer-events: none;
    z-index: 10000;
}

body.loading.loaded:after {
    opacity: 0;
    transform: scale(1.2);
    transition: opacity 0.4s 0.8s linear, transform 1s 0.4s cubic-bezier(0.25,0.25,0.25,1);
}*/

.notransition {
	transition: none !important;
}

* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
}

img, iframe, video {
	display: block;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figure, figcaption, hgroup, menu, footer, header, nav, button, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: none;
}

ul, li {
	list-style: none;
}

a {
	color: inherit;
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
	font-size: inherit;
	font-weight: inherit;
	margin: 0;
}

button {
	background: none;
	border-radius: 0;
	cursor: pointer;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

*:focus {
    outline: 0;
}


/*************************************
	Header
 *************************************/


.ticker {
	position: relative;
	color: rgb(var(--color-white));
	height: 2.3em;
	font-size: clamp(16px, (20 / var(--base-w)) * 100vw, 20px);
	line-height: 1.2em;
	text-align: center;
	margin-bottom: calc(var(--ticker-mb) * -1px);
	z-index: -1;
}

.ticker > div {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	background: rgb(var(--color-blue));
	margin-top: calc(var(--ticker-mb) * -1px);
}

header {
    display: block;
    position: absolute;
	width: 100%;
	left: 0;
    top: 0;
	margin: 0;
    padding: 0;
	pointer-events: none;
	transform: translateY(0);
    z-index: 200;
}

body.top header {
    position: fixed;
}

header.fixed {
    position: fixed;
	/*mix-blend-mode: difference;*/
	transition: transform 0.6s;
}

header:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 200%;
	left: 0;
	top: 0;
	/*background-image: linear-gradient(rgba(var(--color-grey-53),1) 25%, rgba(var(--color-grey-53),0));*/
	/*background-image: linear-gradient(rgba(var(--color-grey-53),1), rgba(var(--color-grey-53),0));*/
	background-image: linear-gradient(rgba(var(--color-blue-dark),1), rgba(var(--color-blue-dark),0));
	mask-image: linear-gradient(rgba(var(--color-blue-dark),1), rgba(var(--color-blue-dark),0));
	/*-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);*/
	opacity: 0;
	transition: opacity 0.4s linear;
	z-index: -1;
}

header.fixed:not(.hide):before {
	opacity: 0.75;
}

header.hide {
	transform: translateY(-100%);
}

header nav {
	display: inline-block;
	pointer-events: auto;
	z-index: 10;
}

header nav ul,
footer nav ul {
	display: flex;
	color: rgb(var(--color-grey-53));
}
	
header nav ul.main {
	flex-direction: column;
	align-items: flex-start;
	row-gap: var(--page-margin);
	display: inline-flex;
	padding: var(--page-margin);
	z-index: 20;
}

header nav ul.main li.home a,
header nav ul.main li.home svg {
	width: var(--header-logo-w);
	height: var(--header-logo-h);
}

header nav ul.main li.home a,
footer div.logo a {
	display: block;
	position: absolute;
}

header nav ul.main li.home svg,
footer div.logo svg {
	pointer-events: none;
}

header nav ul.main li.home svg g > * {
	fill: rgb(var(--color-white));
	transition: fill 0.4s;
}

header nav ul.expand,
footer nav ul {
	min-height: 0vh;
	flex-direction: column;
	justify-content: space-between;
	row-gap: calc((18 / 20) * 1em);
	/*position: absolute;
	width: calc(var(--header-logo-w) + (var(--page-margin) * 2));
	height: 100vh;
	left: 0;
	top: 0;*/
	/*background: rgba(var(--color-white),1);*/
	font-weight: 300;
	font-size: clamp(16px, (20 / var(--base-w)) * 100vw, 20px);
	line-height: calc((24 / 20) * 1em);
	/*padding-top: calc(var(--header-logo-h) + var(--header-ico-h) + (var(--page-margin) * 3));
	padding-bottom: calc(var(--page-margin) * 2);
	padding-left: var(--page-margin);
	transform: translateX(-100%);
	transition: transform 0.6s cubic-bezier(0.25,0.25,0.25,1);
	z-index: 10;*/
}

header nav ul.expand {
	position: absolute;
	width: calc(var(--header-logo-w) + (var(--page-margin) * 2));
	height: 100vh;
	left: 0;
	top: 0;
	box-shadow: 0 0 0 rgba(var(--color-blue-dark),0.25);
	background: rgba(var(--color-white),1);
	padding-top: calc(var(--header-logo-h) + var(--header-ico-h) + (var(--page-margin) * 3));
	padding-bottom: calc(var(--page-margin) * 2);
	padding-left: var(--page-margin);
	transform: translateX(-100%);
	transition: box-shadow 0.4s linear, transform 0.6s cubic-bezier(0.25,0.25,0.25,1);
	z-index: 10;
}

/*header nav ul.expand:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(var(--color-grey-53),1);
	transform-origin: left top;
	transition: opacity 0s linear, transform 0s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: 0.6s;
	z-index: -1;
}*/

header nav ul.expand li {
	opacity: 0;
	transform: translateX(-50%);
	transition: opacity 0s linear, transform 0s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: 0.6s;
}

header nav ul.expand li a,
footer nav ul li a {
	display: inline-block;
	position: relative;
	transition: border-color 0.4s linear, color 0.4s linear;
}

header nav ul.expand li.active a,
header nav ul.expand li a:hover,
footer nav ul li.active a,
footer nav ul li a:hover {
	color: rgb(var(--color-aqua));
}

header nav ul.expand li.home,
footer nav ul li.home {
	display: none;
}

header nav ul.expand li.lang,
header nav ul.expand li.social-networks {
	transform: translateX(0);
}

header nav ul.expand li.lang,
footer nav ul li.lang {
	flex-grow: 1;
	padding-top: calc((40 / 20) * 1em);
}

header nav ul.expand li.lang > a,
footer nav ul li.lang > a {
	border-color: rgb(var(--color-grey-53));
}

header nav ul.expand li.lang > a:hover,
footer nav ul li.lang > a:hover {
	border-color: rgb(var(--color-aqua));
}

header nav ul.expand li.social-networks,
footer nav ul li.social-networks {
	display: flex;
	column-gap: clamp(10px, (20 / var(--base-w)) * 100vw, 20px);
	font-size: 1.5em;
}

footer nav ul li.social-networks {
	margin-top: calc((40 / 20) * 1em);
}


/*--  nav-open  --*/

body.nav-open {
	overflow: hidden;
}

body.nav-open header {
	position: fixed;
}

body.nav-open header nav ul.main {
	position: fixed;
	width: 100vw;
	left: 0;
	top: 0;
}

body.nav-open header nav ul.main li.home svg g > * {
	fill: rgb(var(--color-grey-53));
	transition-delay: 0.6s;
}

body.nav-open header nav ul.expand {
	box-shadow: 0 0 20px rgba(var(--color-blue-dark),0.25);
	transform: translateX(0);
}

/*body.nav-open header nav ul.expand:before {
	transform: scaleX(0);
	transition-duration: 0.2s, 0.6s;
	transition-delay: 0.4s;
}*/

body.nav-open header nav ul.expand li {
	opacity: 1;
	transform: translateX(0);
	transition-duration: 0.2s, 0.4s;
	transition-delay: calc((var(--transition-delay) * 0.1s) + 0.4s);
}


/*--  nav ico  --*/

header .ico {
	display: block;
	cursor: pointer;
	pointer-events: auto;
	transition: background-color 0.2s linear;
	/*z-index: 20;*/
}

header .ico > div {
	display: block;
	position: relative;
	width: clamp((16 / 20) * 38px, (38 / var(--base-w)) * 100vw, 38px);
	height: var(--header-ico-h);
}

header .ico span {
	display: block;
	position: absolute;
	width: 100%;
	height: 2px;
	background: rgb(var(--color-grey-96));
	border-radius: 9999px;
	transition: width 0s 0.3s, background 0.3s 0.3s, opacity 0.3s 0.3s, top 0.3s 0.3s, transform 0.3s;
}

body.nav-open header .ico span {
	background-color: rgb(var(--color-grey-53));
	transition: width 0s 0.3s, background 0.3s, opacity 0.3s, top 0.3s, transform 0.3s 0.3s;
}

header .ico span:nth-child(1) {
	top: 0px;
}

header .ico span:nth-child(2) {
	top: calc(50% - 1px);
}

header .ico span:nth-child(3) {
	top: calc(100% - 2px);
	right: 0;
}

body.nav-open header .ico span:nth-child(1) {
	top: calc(50% - 1px);
	transform: rotate(45deg);
}

body.nav-open header .ico span:nth-child(2) {
	opacity: 0;
}

body.nav-open header .ico span:nth-child(3) {
	top: calc(50% - 1px);
	width: 100%;
	transform: rotate(-45deg);
}

.bt {
	display: inline-block;
	position: relative;
	border-style: solid;
	border-width: 1px;
	border-radius: calc((10 / 20) * 1em);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: calc((6 / 20) * 1em) calc((12 / 20) * 1em);
	padding-left: calc(((12 / 20) * 1em) + 0.1em);
	transition: border-color 0.4s linear, color 0.4s linear;
}

.bt:has(img) {
	border: none;
	padding: 0;
}

.bt img {
	width: min(var(--w) * 1px, (var(--w) / var(--base-w)) * 100vw);
	height: auto;
}

	
/*************************************
	Sections
 *************************************/


.container {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 100%;
}

main {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
	position: relative;
}

section {
    display: block;
    position: relative;
}

section > div {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-column-gap: var(--grid-column-gap);
	max-width: calc(var(--base-w) * 1px);
	position: relative;
    margin: 0 auto;
	padding: 0 var(--page-margin);
}

ol.ordered-list {
    counter-reset: count-ordered-list;
}

ol.ordered-list li,
ul.unordered-list li {
	position: relative;
	padding-left: 1rem;
}

ol.ordered-list li:before {
    content: counter(count-ordered-list)".";
	counter-increment: count-ordered-list;
    display: inline-block;
    position: absolute;
    left: 0;
}

ul.unordered-list li:before {
    content: "•";
    display: inline-block;
    position: absolute;
    left: 0;
}

ul.list {
	min-height: 0vh;
	font-size: clamp(25px, (65 / var(--base-w)) * 100vw, 65px);
}

ul.list li {
	position: relative;
}

ul.list li.expandable-list {
	min-height: 0vh;
	font-size: clamp(25px, (30 / var(--base-w)) * 100vw, 30px);
	line-height: 1.2em;
	border-top: solid 1px rgb(var(--color-black));
	padding: 1em;
    transition: padding 0.6s cubic-bezier(0.25,0.25,0.25,1);
}

ul.list li.expandable-list ul {
	padding: 0 4em 0 0;
}

ul.list li.expandable-list ul > li:first-of-type {
	padding: 1em 0 0 0;
}

.expandable-list > button {
	display: inline-block;
	position: relative;
	cursor: pointer;
	font-family: inherit;
	font-size: inherit;
	text-align: left;
	margin: 0;
	padding-right: 2em;
    transition: color 0.2s linear;
}

.expandable-list > button:hover,
.expandable-list.active > button {
	color: rgb(var(--color-black));
}

.expandable-list > button:after {
	content: "";
	display: block;
	position: absolute;
	width: 0.8571em;
	height: 1em;
	right: 1em;
	top: calc(50% - 0.35em);
	font-size: 0.7em;
	background: url("../upload/images/ico-chevron.svg") center center no-repeat;
	background-size: contain;
	transition: transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
}

.expandable-list.active > button:after {
	transform: rotate(90deg);
}

.expandable-list ol,
.expandable-list ul {
    height: 0;
    overflow: hidden;
    transition: height 0.6s cubic-bezier(0.25,0.25,0.25,1);
}

strong {
    font-weight: 500;
}

sup {
	display: inline-block;
	position: relative;
	font-size: 0.6em;
	vertical-align: top;
	margin-top: -0.3em;
}

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

.justify-content-center {
	justify-content: center;
}

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

.align-self-end {
	align-self: end;	
}

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

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

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

.text-decoration-underline {
	text-decoration: underline !important;
}

.text-transform-none {
	text-transform: none !important;
}

.text-transform-uppercase {
	text-transform: uppercase !important;
}

.white-space-nowrap {
	white-space: nowrap;
}

.img-fit-auto,
.img-fit-contain,
.img-fit-cover {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.img-fit-auto {
	position: relative;
	height: auto;
}

.img-fit-contain {
	object-fit: contain;
}

.img-fit-cover {
	object-fit: cover;
}

picture.parallax {
	display: block;
	position: relative;
	height: min(var(--h) * 1px, (var(--h) / var(--base-w)) * 100vw);
}

picture.parallax img {
	object-fit: cover;
}

.grecaptcha-badge { 
    visibility: hidden;
}


/*************************************
	Section header
 *************************************/


section.header > div {
	display: block;
	max-width: none;
	padding: 0;
	padding-top: var(--header-img-h);
}

section.header > div:has(div.slider) {
	padding: 0;
}

section.header:has(div.bckg-video) > div > div,
section.header div.bckg-video {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

section.header div.bckg-video {
	overflow: hidden;
}

/*section.header div.bckg-video:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(var(--color-aqua),0.4);
	mix-blend-mode: multiply;
}*/

section.header div.bckg-video iframe {
    display: block;
    position: absolute;
	width: 100%;
	height: 100%;
    left: 50%;
    top: 50%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
    transform: translate(-50%, -50%);
}

@media (min-aspect-ratio: 16/9) {
	section.header div.bckg-video iframe {
        width: 100vw;
        height: calc((9 / 16) * 100vw);
    }
}

section.header h2 {
	display: flex;
	flex-direction: column;
	row-gap: calc((20 / 50) * 1em);
	position: absolute;
	left: 50%;
	top: 50%;
	color: rgb(var(--color-white));
	font-size: clamp(40px, (50 / var(--base-w)) * 100vw, 50px);
	line-height: calc((60 / 50) * 1em);
	text-align: center;
	text-transform: uppercase;
	transform: translate(-50%, -50%);
	filter: drop-shadow(0 0 0.3em rgba(var(--color-blue-dark), 1));
}

section.header h2 > span {
	--dly: 1s;
	--h: calc((80 / 50) * 1em);
	
	position: relative;
	mask-image: linear-gradient(rgba(255,0,0,0) 20%, rgba(255,0,0,1) 40%, rgba(255,0,0,1) 60%, rgba(255,0,0,0) 80%);
	mask-position: 0 bottom;
	mask-size: 100% calc(var(--h) * 5);
	animation: kf-header-h2 12s linear both infinite;
	animation-delay: calc(var(--n) * var(--dly));
}

section.header h2 > span:nth-child(1) {
	--n: 0;
}
section.header h2 > span:nth-child(2) {
	--n: 1;
}
section.header h2 > span:nth-child(3) {
	--n: 2;
}
section.header h2 > span:nth-child(4) {
	--n: 3;
}
section.header h2 > span:nth-child(5) {
	--n: 4;
}
section.header h2 > span:nth-child(6) {
	--n: 5;
}

@keyframes kf-header-h2 {
	0% {
		mask-position: 0 bottom;
	}
    20%, 100% {
		mask-position: 0 top;
	}
}

section.full-width > div {
	padding: 0;
}

section.grid-layout > div > * {
	grid-column-start: var(--grid-column-start);
	grid-column-end: var(--grid-column-end);
	grid-row-start: var(--grid-row-start);
	grid-row-end: var(--grid-row-end);
}

section.grid-layout:has(+ section:not(.two-cols)) > div {
	padding-bottom: min(125px, (125 / var(--base-w)) * 100vw);
}

section.two-cols,
section.grid-layout,
section.privacy {
	color: rgb(var(--color-grey-53));
}

section.two-cols > div,
section.privacy > div {
	grid-row-gap: min(33px, (33 / var(--base-w)) * 100vw);
	padding-top: min(125px, (125 / var(--base-w)) * 100vw);
	padding-bottom: min(125px, (125 / var(--base-w)) * 100vw);
}

section.two-cols > div > div:nth-child(1) {
	grid-column-end: span 6;
}

section.two-cols > div > div:nth-child(1):has(h3) {
	grid-column-end: span 4;
}

section.two-cols > div > div:nth-child(2) {
	grid-column: 7 / span 5;
}

section.two-cols > div > div:nth-child(3) {
	grid-column: 1 / -1;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	column-gap: min(60px, (60 / var(--base-w)) * 100vw);
}

section.privacy > div > div {
	grid-column: 2 / span 10;
}

section.two-cols h2,
section.masonry h2,
section.privacy h1 {
	font-size: clamp(24px, (30 / var(--base-w)) * 100vw, 30px);
	font-weight: 500;
	line-height: calc((37 / 30) * 1em);
}

section.two-cols h2,
section.privacy h1 {
	text-transform: uppercase;
}

section.two-cols p,
section.two-cols li,
section.masonry p,
section.grid-layout p,
section.grid-layout h3,
section.privacy p,
section.privacy ul,
.map-nav .bt,
.poi,
form#form-contact button[type="submit"],
footer h2,
footer p,
footer button[type="submit"] {
	font-size: clamp(16px, (20 / var(--base-w)) * 100vw, 20px);
	line-height: calc((24 / 20) * 1em);
}

section.two-cols p,
section.two-cols li,
section.masonry p,
section.grid-layout p,
section.privacy p,
section.privacy ul,
footer h2,
footer p {
	font-weight: 300;
}

section.grid-layout h3,
section.privacy h2 {
	font-weight: 500;
	text-transform: uppercase;
}

section.grid-layout h3 + p {
	margin-top: calc((18 / 20) * 1em);
}

section.two-cols p + p,
section.two-cols p + ul,
section.two-cols ul + p,
section.grid-layout h3 + p,
section.masonry p + p,
section.grid-layout p + p,
section.privacy p + p,
section.privacy p + ul,
section.privacy ul + p {
	margin-top: calc((24 / 20) * 1em);
}

section.grid-layout p + h3,
section.privacy p + h2,
section.privacy ul + h2 {
	margin-top: calc((54 / 20) * 1em);
}

section.two-cols li,
section.privacy li {
	padding-left: 1em;
}

section.two-cols li:before,
section.privacy li:before {
	content: "-";
	display: inline-block;
	margin: 0 0.6em 0 -1em;
}

section.two-cols li + li,
section.privacy li + li {
	/*margin-top: calc((30 / 20) * 1em);*/
	margin-top: calc((18 / 20) * 1em);
}





section.masonry > div {
	grid-gap: min(10px, (10 / var(--base-w)) * 100vw);
	padding: 0;
}

section.masonry > div > div {
	grid-column-start: var(--grid-column-start);
	grid-column-end: var(--grid-column-end);
	position: relative;
	background: rgb(var(--color-grey-96));
	overflow: hidden;
}

section.masonry div.bckg {
	clip-path: inset(0 0 100% 0);
	opacity: 0;
}

section.masonry > div > div.show div.bckg {
	clip-path: inset(0);
	opacity: 1;
	transition: clip-path 1.2s cubic-bezier(0.25,0.25,0.25,1), opacity 0.8s linear;
	transition-delay: calc(var(--transition-delay) * 0.2s);
}

section.masonry div.bckg picture {
	display: block;
	position: relative;
}

section.masonry > div > div[style*="--grid-column-end: span 12"] div.bckg picture {
	height: min(1350px, (1350 / var(--base-w)) * 100vw);
}

section.masonry > div > div[style*="--grid-column-end: span 6"] div.bckg picture {
	height: min(1080px, (1080 / var(--base-w)) * 100vw);
}

section.masonry div.bckg picture img {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

section.masonry div.text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	padding: 0 25%;
	text-align: center;
}

section.masonry.accueil div.text {
	-webkit-backdrop-filter: blur(9px);
	backdrop-filter: blur(9px);
	background-color: rgba(0,0,0,0.25);
	transition: backdrop-filter 0.4s linear, background-color 0.4s linear, opacity 0.4s linear;
	color: rgb(var(--color-white));
	opacity: 0;
}

section.masonry.projet div.text {
	color: rgb(var(--color-grey-53));
}

section.masonry.accueil > div > div:hover div.text {
	opacity: 1;
}

section.two-cols h3,
section.masonry h3,
section.gallery h2,
section.liste-poi h3,
section.privacy h2 {
	font-size: clamp(20px, (25 / var(--base-w)) * 100vw, 25px);
	font-weight: 300;
	line-height: calc((30 / 25) * 1em);
}

section.two-cols h3,
section.liste-poi h3 {
	text-transform: uppercase;
}

section.masonry h3:first-child {
	clip-path: inset(0 0 100% 0);
	font-weight: 500;
	opacity: 0;
	transform: translateY(100%);
}

section.masonry .text.show h3:first-child {
	clip-path: inset(0);
	opacity: 1;
	transform: translateY(0);
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc((var(--transition-delay) * 0.2s) + 0.4s);	
}

section.masonry h2 + h3 {
	margin-top: calc((18 / 25) * 1em);
}

section.two-cols h3 + p,
section.masonry h2 + p,
section.masonry h3 + p,
section.liste-poi h3 + p,
section.privacy h2 + p {
	margin-top: calc((18 / 20) * 1em);
}

section.gallery h2 {
	text-transform: uppercase;
}

/*section.masonry p + p {
	margin-top: calc((30 / 25) * 1em);
}*/

/*section.masonry p + p:has(a.bt) {
	margin-top: calc((160 / 25) * 1em);
}*/

section.masonry .bt {
	border-width: 2px;
	border-radius: calc((10 / 25) * 1em);
	font-size: clamp(20px, (25 / var(--base-w)) * 100vw, 25px);
	margin-top: calc((148 / 25) * 1em);
}

section.masonry .bt:before {
	content: "";
	display: block;
	position: absolute;
	width: 2px;
	height: calc((108 / 25) * 1em);
	left: 0;
	right: 0;
	top: calc(((-108 - 36) / 25) * 1em);
	margin: 0 auto;
	transform: scaleY(0);
	transform-origin: left top;
}

section.masonry.accueil .bt:before {
	background: rgb(var(--color-white));
}

section.masonry.projet .bt:before {
	background: rgb(var(--color-grey-53));
}

section.masonry.accueil > div > div:hover .bt:before,
section.masonry.projet div.text.show .bt:before {
	transform: scaleY(1);
	transition: transform 0.6s cubic-bezier(0.25,0.25,0.25,1);
}

section.masonry.accueil > div > div:hover .bt:before {
	transition-delay: 0.4s;
}

section.masonry.projet div.text.show .bt:before {
	transition-delay: calc((var(--transition-delay) * 0.2s) + 0.8s);
}

section.masonry .bt:hover {
	border-color: rgb(var(--color-aqua));
	color: rgb(var(--color-aqua));
}

/*a.bt-more {
	display: inline-block;
	text-transform: uppercase;
}

a.bt-more:after {
	content: "";
	display: block;
	position: relative;
	width: 100%;
	height: 2px;
	background: rgb(var(--color-white));
	margin-top: 2px;
}*/


/*************************************
	???
 *************************************/


section:not(.header) .text h2 > span,
section:not(.header) #form-contact h2,
section:not(.header) .text h3 > span {
	display: inline-block;
	clip-path: inset(0 0 100% 0);
	opacity: 0;
	transform: translateY(100%);
}

section.inclusions.accueil > div > div > div.text h2:after {
	transform: scaleX(0);
}

section:not(.header):not(.masonry.accueil) .text.show h2 > span,
section:not(.header) #form-contact.show h2,
section:not(.header):not(.masonry.accueil) .text.show h3 > span,
section.masonry.accueil .text:hover h2 > span,
section.masonry.accueil .text:hover h3 > span {
	clip-path: inset(0);
	opacity: 1;
	transform: translateY(0);
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc((var(--transition-delay) * 0.2s) + (var(--word-transition-delay) * 0.2s) + 0.4s);
}

section.masonry.accueil .text:hover h2 > span,
section.masonry.accueil .text:hover h3 > span {
	transition-delay: calc((var(--word-transition-delay) * 0.2s));
}

section.inclusions.accueil > div > div > div.text.show h2:after {
	transform: scaleX(1);
	transition: transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc((var(--transition-delay) * 0.2s) + 0.4s);	
}

section:not(.header) .text h3:not(:first-child),
section:not(.header) .text p,
section:not(.header) .text ol,
section:not(.header) .text ul {
	opacity: 0;
}

section:not(.header):not(.masonry.accueil) .text.show p,
section:not(.header):not(.masonry.accueil) .text.show ol,
section:not(.header):not(.masonry.accueil) .text.show ul,
section.masonry.accueil .text:hover h3,
section.masonry.accueil .text:hover p,
section.masonry.accueil .text:hover ol,
section.masonry.accueil .text:hover ul {
	opacity: 1;
	transition: opacity 0.2s linear;
	transition-delay: calc((var(--transition-delay) * 0.2s) + 0.8s);
}

section.masonry.accueil .text:hover h3,
section.masonry.accueil .text:hover p,
section.masonry.accueil .text:hover ol,
section.masonry.accueil .text:hover ul {
	transition-delay: 0.6s;
}


.overflow-top {
	margin-top: max(-70px, (-70 / var(--base-w)) * 100vw);
}

.overflow-right {
	margin-right: calc(var(--page-margin) * -1);
}

.overflow-bottom {
	margin-bottom: max(-70px, (-70 / var(--base-w)) * 100vw);
}

.overflow-left {
	margin-left: calc(var(--page-margin) * -1);
}

.no-padding-left {
	margin-left: var(--page-margin-neg);
}

.no-padding-right {
	margin-right: var(--page-margin-neg);
}

section.gallery {
	color: rgb(var(--color-grey-53));
	padding-bottom: var(--page-margin);
}

section.gallery div {
	position: relative;
}

section.gallery > div {
	display: block;
}

section.gallery div.gallery + div.gallery {
	margin-top: min(162px, (162 / var(--base-w)) * 100vw);
}

.gallery h2 {
	clip-path: inset(0 0 100% 0);
	opacity: 0;
	transform: translateY(100%);
}

.gallery.show h2 {
	clip-path: inset(0);
	opacity: 1;
	transform: translateY(0);
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc(var(--transition-delay) + var(--transition-delay-1));
}

.gallery .bt-next {
	position: absolute;
	right: 0;
	bottom: 0;
}

.gallery ul {
	display: grid;
	position: relative;
	grid-template-columns: repeat(12, 1fr);
	grid-gap: var(--grid-column-gap);
	margin-top: min(107px, (107 / var(--base-w)) * 100vw);
}

.gallery ul li {
	position: relative;
	grid-column-end: span 4;
}

.gallery ul:has(li:nth-child(4)) li {
	grid-column-end: span 6;
}

.gallery ul li picture {
	display: block;
	position: relative;
	padding-top: 66%;
	transition: transform 1.2s cubic-bezier(0.25,0.25,0.25,1);
}

.gallery ul li picture:before {
	content: "";
	min-height: 0vh;
	display: block;
	position: absolute;
	width: 1em;
	height: 1em;
	left: calc(50% - 0.5em);
	top: calc(50% - 0.5em);
	font-size: clamp(min(30px, (30 / 414) * 100vw), (30 / var(--base-w)) * 100vw, 30px);
	background-image: 
		radial-gradient(rgba(var(--color-white),1) 45%, rgba(var(--color-white),0) 45%),
		conic-gradient(rgba(var(--color-blue-dark),0) 25%, rgba(var(--color-blue-dark),1));
	border-radius: 9999px;
	animation: kf-gallery-loading 1.2s steps(8) both infinite;
	opacity: 0;
	transition: opacity 0.2s linear;
	z-index: 100;
}

.gallery.show ul li picture:before {
	opacity: 1;
	transition-delay: 0.4s;
}

.gallery.show ul li picture.loaded:before {
	opacity: 0;
	transition-delay: 0s;
}

@keyframes kf-gallery-loading {
    0% {
		transform: rotate(0deg);
	}
    100% {
		transform: rotate(360deg);
	}
}

.gallery ul li img {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	object-fit: cover;
	opacity: 0;
}

.gallery.show ul li picture.loaded img {
	opacity: 1;
	transition: opacity 0.4s linear;
	transition-delay: calc(var(--transition-delay) + var(--transition-delay-1) + var(--transition-delay-2) + 0.2s);
}

.gallery.show ul li a[data-iframe] figure:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-position: center center;
	background-repeat: no-repeat;
}

.gallery.show ul li a[data-iframe*="https://player.vimeo.com/"] figure:after {
	background-image: url("../images/ico-play.svg");
}

.gallery.show ul li a[data-iframe*="https://my.matterport.com/"] figure:after {
	background-image: url("../images/ico-360.svg");
}

.gallery.show ul li a[data-iframe] figure picture:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-image: 
		linear-gradient(rgba(var(--color-blue-dark),0.65), rgba(var(--color-blue-dark),0.5));
	background-position: center center;
	background-repeat: no-repeat;
}

.gallery figcaption {
	display: block;
	position: absolute;
	width: calc(100% - (var(--grid-column-gap) * 0.5));
	left: calc(var(--grid-column-gap) * 0.25);
	bottom: calc(var(--grid-column-gap) * 0.25);
	background: rgba(var(--color-blue-dark),0.75);
	color: rgb(var(--color-white));
	text-align: center;
	padding: calc(var(--grid-column-gap) * 0.5);
}


/*************************************
	Map
 *************************************/


section.map {
	padding-top: 0;
	padding-bottom: 0;
}

section.map > div {
	display: block;
	padding: 0;
}

gmp-map,
.map-container {
	height: min(1080px, (1080 / var(--base-w)) * 100vw);
}

.gm-style-iw span {
    background-color: black;
}

.pin-property,
.pin-pavilion {
	width: 32px;
	height: 67px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.pin-property {
}

.pin-pavilion {
	background-image: url("../upload/images/ico-viu-marker.svg");
}

.infowindow-content {
	font-family: "Montserrat", sans-serif;
}

.infowindow-title {
	font-weight: 500;
}

section.liste-poi {
	background: rgb(var(--color-grey-96));
	color: rgb(var(--color-grey-53));
	padding: min(125px, (125 / var(--base-w)) * 100vw) 0;
}

section.liste-poi .text,
section.liste-poi .map-nav {
	grid-column-end: span 4;
}

section.liste-poi .map-nav {
	grid-column-start: 9;
}

.poi {
	display: flex;
	flex-flow: column nowrap;
	row-gap: calc((17 / 25) * 1em);
	margin-top: min(50px, (50 / var(--base-w)) * 100vw);
	padding-left: clamp(40px, (50 / var(--base-w)) * 100vw, 50px);
}

.poi,
.poi li.expandable-list button {
	position: relative;
	color: rgb(var(--color-grey-53));
}

.poi li.expandable-list button:before {
	content: "";
	display: block;
	position: absolute;
	width: 1em;
	height: 1em;
	left: -2em;
	top: calc(50% - 0.5em);
	border: solid 1px rgb(var(--color-grey-53));
	border-radius: 50%;
}

.poi .expandable-list.active > button:after {
	transform: scaleY(-1);
}

.poi li.expandable-list li {
	cursor: pointer;
	transition: color 0.4s linear;
}

.poi {
	counter-reset: poi;
}

.poi ol li:before {
	content: counter(poi, decimal-leading-zero) " - ";
	counter-increment: poi;
}

.poi li.expandable-list.property,
.poi li.expandable-list.pavilion {
	display: none;
}

button.bt-view-all {
	margin-top: calc((32 / 20) * 1em);
}

button.bt-view-all:disabled {
	opacity: 0.25;
}

.poi:has(> li:only-child) {
	margin: 0;
	padding: 0;
}

.poi > li:only-child > button {
	display: none;	
}

.poi > li:only-child > ol {
	height: auto;
	overflow: visible;
}

.poi > li:only-child > ol > li + li {
	margin-top: calc((20 / 20) * 1em);
}

.poi > li:only-child > ol > li {
	position: relative;
	padding-left: 2em;
}

.pin-VIU,
.poi > li:only-child > ol > li:before {
	display: flex;
	position: relative;
	justify-content: center;
	align-items: center;
	width: 1.75em;
	height: 1.75em;
	background: rgb(var(--color-aqua));
	border: solid 1px rgb(var(--color-white));
	border-radius: 9999px;
	color: rgb(var(--color-white));
	font-family: "Montserrat", sans-serif;
	font-weight: 300;
	font-size: calc(clamp(16px, (20 / var(--base-w)) * 100vw, 20px) * 0.75);
}

.poi > li:only-child > ol > li:before {
	content: counter(poi, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: -0.1em;
}

div:has(.poi > li:only-child) button.bt-view-all {
	display: none;
}


/*************************************
	Plans
 *************************************/


section.plans {
    color: rgb(var(--color-dark-grey));
}

section.plans > div > div {
	grid-column: 2 / span 10;
}

section.plans > div > div {
    background: rgb(var(--color-white));
}

section.plans div.plans-selectors > form,
section.plans div.plans-unit {
    display: grid;
	position: relative;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: min(40px, (40 / 1280) * 100vw);
    padding: min(20px, (20 / 1280) * 100vw);
}

section.plans div.plans-selectors > form input, 
section.plans div.plans-selectors > form textarea,
section.plans div.plans-selectors > form select {
    display: block;
    position: relative;
    width: 100%;
    background: rgb(var(--color-white));
    border: solid 1px rgb(var(--color-dark-grey));
    border-radius: 0;
    color: rgb(var(--color-dark-grey));
	font-family: "Montserrat", sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1em;
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
}

section.plans div.plans-selectors > form label {
    display: block;
    position: relative;
    color: rgb(var(--color-dark-grey));
    font-size: 16px;
    line-height: 24px;
    transform-origin: left top;
    transition: opacity 0.4s, transform 0.4s;
}

section.plans div.plans-selectors > form input[type="button"] {
    display: inline-block;
    width: 38px;
    height: 38px;
    cursor: pointer;
    line-height: 38px;
    margin: 0 10px 10px 0;
    padding: 0;
    transition: background-color 0.4s, color 0.4s;
}

section.plans div.plans-selectors > form input[type="button"].disabled,
section.plans div.plans-selectors > form input[type="button"]:disabled {
    cursor: default;
    opacity: 0.25;
}

section.plans div.plans-selectors > form input[type="button"]:hover:not(:disabled), 
section.plans div.plans-selectors > form input[type="button"].active {
    background-color: rgb(var(--color-aqua));
    color: rgb(var(--color-white));
}

section.plans div.plans-selectors > form label.checkbox {
    display: block;
    font-weight: 400;
    margin: 0 0 10px 0;
    padding: 0 0 0 30px;
}

section.plans div.plans-selectors > form input[type="checkbox"] {
	position: absolute;
	left: 0;
	top: 0;
	width: auto;
	height: auto;
	-webkit-appearance: none;
	appearance: none;
	border: none;
	font-size: 0;
	margin: 0;
	padding: 0;	
}

section.plans div.plans-selectors > form input[type="checkbox"]:before {
    content: "\f00c";
    display: block;
    width: 18px;
    height: 18px;
    background: rgb(var(--color-white));
    border: solid 1px rgb(var(--color-dark-grey));
    color: rgba(var(--color-dark-grey), 0);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 10px;
    line-height: 18px;
    text-align: center;
    transition-property: width, height, border-width, line-height, background, color;
    transition-duration: 0.4s;
    transition-timing-function: var(--transition-timing-ease-out);
}

section.plans div.plans-selectors > form input[type="checkbox"]:checked:before {
    width: 14px;
    height: 14px;
    border-width: 3px;
    color: rgba(var(--color-dark-grey), 1);
    line-height: 14px;
    transition-delay: 0, 0, 0, 0, 0.1s, 0.2s;
}

section.plans div.plans-selectors > form > div {
    position: relative;
}

section.plans div.plans-selectors > form > div + div:before {
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 100%;
    left: max(-20px, (-20 / 1280) * 100vw);
    top: 0;
    background: rgb(var(--color-dark-grey));
}

section.plans h3 {
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0.8em;
}


/* -- Plans header -- */


section.plans div.plans-building {
    margin-bottom: min(20px, (20 / 1280) * 100vw);
}

section.plans div.plans-building {
}

.plans-building .building {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: var(--ratio);
    overflow: hidden;
}

.plans-building .building img,
.plans-building .building svg {
    display: none;
    position: absolute;
}

.plans-building .building.horizontal img,
.plans-building .building.horizontal svg,
.plans-building .building.vertical img,
.plans-building .building.vertical svg {
    display: block;
}

.plans-building .building.horizontal img,
.plans-building .building.horizontal svg {
    width: 100%;
    height: auto;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.plans-building .building.vertical img,
.plans-building .building.vertical svg {
    width: auto;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

.plans-building .building svg g.floor {
    fill: rgba(var(--color-aqua), 0.50);
    mix-blend-mode: overlay;
    cursor: pointer;
    transition: fill 0.6s, mix-blend-mode 0.6s;
}

.plans-building .building svg g.floor:hover,
.plans-building .building svg g.floor.active {
    fill: rgba(var(--color-aqua), 0.95);
    mix-blend-mode: multiply;
}

.plans-building .building a.bt {
    position: absolute;
    left: 50%;
    bottom: 32px;
    transform: translateX(-50%);
}


/* -- Selectors -- */

.selectors {
    grid-column: 9 / span 4;
}

.selectors > form {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: repeat(4, auto);
    align-content: space-between;
    height: 100%;
}


/* -- Floor plan -- */

.floor-plan > div > div {
    grid-column: 2 / span 10;
    display: grid;
    grid-template-columns: auto;
    grid-gap: 80px;
}

.floor-plan h2 {
    text-align: center;
}

.floor-plan form.select_unit {
    display: none;
}

div#floor-plan svg {
    display: block;
    width: 100%;
    max-width: 900px;
    height: auto;
    margin: 0 auto;
}

div#floor-plan svg g.units .unit,
div#floor-plan svg g.units .balcony,
div#floor-plan svg g.units .unit-pattern {
    transition: fill 0.6s, stroke 0.6s;
}

div#floor-plan svg g.floor {
    fill: rgb(var(--color-unit-floor));
    stroke: rgb(var(--color-unit-floor-stroke));
}

div#floor-plan svg g.others {
    fill: rgb(var(--color-unit-others));
    stroke: rgb(var(--color-unit-others-stroke));
}

div#floor-plan svg g.others text {
    fill: rgba(var(--color-unit-others-stroke), 0.5);
    stroke: none;
}

div#floor-plan svg g.units .unit,
div#floor-plan svg g.units .balcony {
    fill: rgb(var(--color-unit-unavailable));
}

div#floor-plan svg g.units .balcony {
    fill: rgba(var(--color-unit-unavailable), 0.6);
    stroke: rgb(var(--color-unit-unavailable-stroke));
}

div#floor-plan svg g.units .unit-stroke {
    stroke: rgb(var(--color-unit-unavailable-stroke));
}

div#floor-plan svg g.units .unit-pattern,
div#floor-plan svg g.units .unit-stroke {
    fill: none;
}

div#floor-plan svg text {
	font-family: "Montserrat", sans-serif;
    font-weight: 300;
    font-size: 24px;
}

div#floor-plan svg text.text-anchor-end {
    text-anchor: end;
}

div#floor-plan svg g.units text {
    fill: rgb(var(--color-unit-unavailable-stroke));
}


/* -- Floor plan | match -- */

div#floor-plan svg g.units g.unavailable {
    pointer-events: none;
}

div#floor-plan svg g.units g.match .unit,
div#floor-plan svg g.units g.match .balcony,
div#floor-plan svg g.units g.other .unit,
div#floor-plan svg g.units g.other .balcony {
    fill: rgb(var(--color-unit-match));
    stroke: rgb(var(--color-unit-match-stroke));
}

div#floor-plan svg g.units g.other .unit,
div#floor-plan svg g.units g.other .balcony {
    fill: rgb(var(--color-unit-match-active));
}

div#floor-plan svg g.units g.match .balcony,
div#floor-plan svg g.units g.other .balcony {
    fill: rgba(var(--color-unit-match), 0.6);
}

div#floor-plan svg g.units g.other .balcony {
    fill: rgba(var(--color-unit-match-active), 0.6);
}

div#floor-plan svg g.units g.match .unit-stroke,
div#floor-plan svg g.units g.other .unit-stroke {
    stroke: rgb(var(--color-unit-match-stroke));
}

div#floor-plan svg g.units g.match:hover .unit,
div#floor-plan svg g.units g.match.active .unit,
div#floor-plan svg g.units g.other:hover .unit,
div#floor-plan svg g.units g.other.active .unit {
    fill: rgb(var(--color-unit-match-active));
}

div#floor-plan svg g.units g.other:hover .unit,
div#floor-plan svg g.units g.other.active .unit {
    fill: rgb(var(--color-unit-match));
}

div#floor-plan svg g.units g.match:hover .balcony,
div#floor-plan svg g.units g.match.active .balcony,
div#floor-plan svg g.units g.other:hover .balcony,
div#floor-plan svg g.units g.other.active .balcony {
    fill: rgba(var(--color-unit-match-active), 1);
}

div#floor-plan svg g.units g.other:hover .balcony,
div#floor-plan svg g.units g.other.active .balcony {
    fill: rgba(var(--color-unit-match), 1);
}


/* -- Floor plan | other -- */


div#floor-plan svg g.units g.other .unit-pattern {
    fill: url(#pattern);
}

div#floor-plan svg g.units g.match .unit-pattern,
div#floor-plan svg g.units g.other .unit-pattern {
    stroke-width: 16px;
}

div#floor-plan svg g.units g.match .unit-pattern,
div#floor-plan svg g.units g.other .unit-pattern {
    stroke: rgb(var(--color-unit-match));
}


/* -- Floor plan | availability -- */

div#floor-plan svg g.units g.available,
div#floor-plan svg g.units g.soon {
    cursor: pointer;
}

div#floor-plan svg pattern line {
    fill: none;
    stroke: rgb(var(--color-white));
    stroke-width: 2;
    stroke-miterlimit: 10;
    opacity: 0.5;
}

div#floor-plan g#compass > * {
    fill: rgb(var(--color-black));
}

div#floor-plan g#compass > circle {
    fill: rgb(var(--color-white));
}



/* -- Floor plan legend -- */

.floor-plan-legend {
    padding-top: min(20px, (20 / 1280) * 100vw);
}

.floor-plan-legend ul li {
    position: relative;
    font-size: 16px;
    line-height: 1.25em;
    margin: 0 0 0.5em 0;
    padding: 0 0 0 2em;
}

.floor-plan-legend ul li:before,
.floor-plan-legend ul li:after {
    content: "";
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    left: 0;
    top: 0;
    border: solid 1px transparent;
}

.floor-plan-legend ul li:before {
    background-color: rgb(var(--color-unit-unavailable));
    border-color: rgb(var(--color-unit-unavailable-stroke));
}

.floor-plan-legend ul li.match:before,
.floor-plan-legend ul li.other:before {
    background-color: rgb(var(--color-unit-match));
    border-color: rgb(var(--color-unit-match-stroke));
}

.floor-plan-legend ul li.other:after {
    width: 10px;
    height: 10px;
    left: 3px;
    top: 3px;
    background: url("../images/pattern-availability-soon.svg") left top repeat;
}


/* -- Unit -- */


div.plans-unit {
    text-transform: uppercase;
}

div.plans-unit:empty {
    display: none !important;
}

div.unit-collection {
    display: flex;
    justify-content: center;
    position: relative;
    padding-bottom: min(20px, (20 / 1280) * 100vw);
}

div.unit-title,
div.unit-hr {
    grid-column: 1 / -1;
    position: relative;
}

div.unit-hr:before,
div.unit-hr:after {
    content: "";
    display: block;
}

div.unit-hr:before {
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    top: min(20px, (20 / 1280) * 100vw);
    background: rgb(var(--color-dark-grey));
}

div.unit-collection + div.unit-title:before {
    content: none;
}

div.unit-hr:after {
    height: min(40px, (40 / 1280) * 100vw);
}

div.unit-hr:first-of-type:before {
    top: max(-20px, (-20 / 1280) * 100vw);
}

div.unit-hr:first-of-type:after {
    height: 0;
}

div.unit-area {
    grid-column-end: span 2;
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-column-gap: min(20px, (20 / 1280) * 100vw);
    justify-content: start;
}

div.unit-area span:nth-of-type(3n+1)  {
    padding-right: min(20px, (20 / 1280) * 100vw);
}

div.unit-area span:nth-of-type(3n+2)  {
    text-align: right;
}

div.unit-area span:nth-of-type(3n+2),
div.unit-area span:nth-of-type(3n+3)  {
    text-transform: none;
}

div.unit-area span:nth-last-of-type(-n+3) {
    font-weight: 700;
}

div.unit-area hr {
    grid-column: 1 / -1;
    height: 0.5em;
}

div.unit-details {
    grid-row-end: span 2;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    position: relative;
}

div.unit-details:after,
div.unit-cta:after {
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 100%;
    right: min(-20px, (-20 / 1280) * 100vw);
    top: 0;
    background: rgb(var(--color-dark-grey));
}

div.unit-details ol {
    display: none;
}

div.unit-details ol.show {
    display: block;
}

div.unit-details ol li {
    position: relative;
    font-size: 16px;
    line-height: 1.25em;
    margin-bottom: 10px;
    padding-left: 60px;
}
div.unit-details ol li:before {
	content: attr(data-num);
    display: block;
    position: absolute;
    width: 38px;
    height: 38px;
    left: 0;
    top: 0;
    background: rgb(var(--color-white));
    border: solid 1px rgb(var(--color-dark-grey));
    color: rgb(var(--color-dark-grey));
    font-size: 18px;
    line-height: 38px;
    text-align: center;
}

section.plans div.floors-nav,
section.plans div.unit-images,
section.plans div.unit-tools {
    grid-column-end: span 2;
}

section.plans div.unit-images img {
    display: none;
    width: 100%;
    height: auto;    
}

section.plans div.unit-images img.show {
    display: block;
}

section.plans div.floors-nav {
    display: flex;
    padding-bottom: min(40px, (40 / 1280) * 100vw);
}

section.plans div.floors-nav:empty {
    padding-bottom: 0;
}

section.plans div.floors-nav > div {
    cursor: pointer;
}

section.plans div.floors-nav > div.active {
    font-weight: 600;
    color: rgb(var(--color-aqua));
}

section.plans div.floors-nav > div + div {
    margin-left: min(20px, (20 / 1280) * 100vw);
}

div.unit-cta,
div.unit-tools {
    position: relative;
    padding: min(20px, (20 / 1280) * 100vw) 0;
}

div.unit-cta {
    display: flex;
    justify-content: center;
    text-align: center;
}

div.unit-tools {
    display: flex;
    justify-content: space-between;
}

div.unit-tools div,
div.unit-tools a {
    display: inline-block;
    margin-left: 12px;
}

div.unit-cta > a,
div.unit-tools > a {
	display: flex;
	align-items: center;
    background-color: rgb(var(--color-aqua));
	border-radius: 0;
    color: rgb(var(--color-white));
}

div.unit-tools div + a {
    margin-left: 24px;
}

div.unit-tools a + a {
    margin-left: 12px;
}

section.plans span.fa-stack {
    width: 2em;
    font-size: 18px;
    margin: 0;
}

section.plans span.fa-stack i:nth-of-type(1) {
    color: rgb(var(--color-aqua));
}

section.plans span.fa-stack i:nth-of-type(2) {
    color: rgb(var(--color-white));
}


/*************************************
	Form
 *************************************/


form#form-contact,
form#form-contact .interests,
form#form-footer,
form#form-lb {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	row-gap: min(20px, (20 / var(--base-w)) * 100vw);
	position: relative;
	font-size: 0px;
}

form#form-contact {
	padding-bottom: min(104px, (104 / var(--base-w)) * 100vw);
}

form#form-footer {
	margin-top: min(21px, (21 / var(--base-w)) * 100vw);
	margin-bottom: min(60px, (60 / var(--base-w)) * 100vw);
}

form#form-contact.hide,
form#form-footer.hide {
	height: 0 !important;
	overflow: hidden;
	transition: height 0.8s var(--transition-timing-ease-in-out);
}

form#form-contact input,
form#form-contact textarea,
form#form-contact select,
form#form-contact label,
form#form-contact p,
form#form-footer input, 
form#form-footer label,
form#form-footer p,
form#form-lb input, 
form#form-lb label,
form#form-lb p {
    display: block;
    position: relative;
    min-height: 0vh;
    font-family: "Montserrat", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 16px;
	line-height: calc((19 / 16) * 1em);
    margin: 0;
	padding: 0;
}

form#form-contact button[type="submit"],
form#form-footer button,
form#form-lb button {
    font-family: "Montserrat", sans-serif;
	font-style: normal;	
}

form#form-contact input, 
form#form-contact textarea,
form#form-contact select,
form#form-footer input,
form#form-lb input {
    width: 100%;
	border: none;
    border-radius: calc((10 / 16) * 1em);
    -webkit-appearance: none;
	appearance: none;
    transition: min-height 0.4s var(--transition-timing-ease-in-out);
}

form#form-contact input, 
form#form-contact textarea,
form#form-contact select {
    background: rgb(var(--color-grey-96));
}

form#form-footer input {
    background: rgb(var(--color-white));
}

form#form-contact input,
form#form-contact textarea,
form#form-contact p,
form#form-footer input,
form#form-lb input {
	/*--r: calc(((24 / 20) * 1em) + 3px);*/
	border-width: 0;
	clip-path: inset(0 100% 0 0);
	opacity: 0;
}
form#form-contact.show input,
form#form-contact.show textarea,
form#form-contact.show p,
form#form-footer.show input,
form#form-lb.show input {
	clip-path: inset(0);
	opacity: 1;
	margin: 0;
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.4s linear, min-height 0.4s var(--transition-timing-ease-in-out);
	--td: calc((var(--transition-delay) * 0.2s) + (var(--transition-delay-1) * 0.2s) + ((var(--transition-delay-2) - 1) * 0.1s));
	transition-delay: var(--td), var(--td), 0s;
}

form#form-contact input,
form#form-contact label:not(.checkbox) span,
form#form-footer input,
form#form-footer label:not(.checkbox) span,
form#form-lb input,
form#form-lb label:not(.checkbox) span {
    padding: calc((8 / 16) * 1em) calc((12 / 16) * 1em);
}

form#form-contact input,
form#form-contact textarea,
form#form-footer input,
form#form-lb input {
	color: rgb(var(--color-grey-53));
}

form#form-contact textarea {
	min-height: calc((48 / 20) * 1em);
	padding: 0;
}

form#form-contact textarea.focus-in {
    min-height: calc(((9 * 24) / 20) * 1em);
    padding: calc((8 / 16) * 1em) calc((12 / 16) * 1em);
}

form#form-contact label,
form#form-footer label,
form#form-lb label {
	width: 100%;
}

form#form-contact label:not(.checkbox),
form#form-footer label:not(.checkbox),
form#form-lb label:not(.checkbox) {
	transition: padding 0.4s var(--transition-timing-ease-in-out);
}

form#form-contact input:not([type="hidden"]) + label {
    margin-top: 1.5em;
}

form#form-contact label.focus-in,
form#form-footer label.focus-in,
form#form-lb label.focus-in {
	transition-delay: 0s;
}

form label:not(.checkbox) span {
	position: absolute;
	transform-origin: left bottom;
	transition: color 0.4s linear, transform 0.4s var(--transition-timing-ease-in-out);
	z-index: 10;
}

form#form-contact label span ,
form#form-footer label span,
form#form-lb label span {
	opacity: 0;
}

form#form-contact.show label span,
form#form-footer.show label span,
form#form-lb.show label span {
	opacity: 1;
	transition: opacity 0.2s linear, color 0.4s linear, transform 0.4s var(--transition-timing-ease-in-out);
	transition-delay: calc((var(--transition-delay) * 0.2s) + (var(--transition-delay-1) * 0.2s) + 0.1s), 0s, 0s;
}

form label.focus-in span {
	color: rgb(var(--color-aqua));
	transform: scale(0.8) translateY(-100%);
	transition: color 0.4s 0.2s linear, transform 0.4s 0.2s var(--transition-timing-ease-in-out);
}

form#form-contact .interests {
	margin: min(30px, (30 / var(--base-w)) * 100vw) 0;
}

form#form-contact .interests label.checkbox span {
	font-weight: 500;
	text-transform: uppercase;
}

form#form-contact .interests h3,
form#form-contact .interests label.checkbox span {
	opacity: 0;
}

form#form-contact.show .interests h3,
form#form-contact.show .interests label.checkbox span {
	opacity: 1;
	transition: opacity 0.2s linear;
	transition-delay: calc((var(--transition-delay) * 0.2s) + (var(--transition-delay-1) * 0.2s) + 0.1s);
}

form#form-contact.show .interests label.checkbox span {
	opacity: 1;
	transition: opacity 0.2s linear;
	transition-delay: calc((var(--transition-delay) * 0.2s) + (var(--transition-delay-1) * 0.2s) + (var(--transition-delay-2) * 0.1s) + 0.1s);
}

form#form-contact input[type="checkbox"],
form#form-footer input[type="checkbox"] {
    align-self: start;
	width: auto;
	height: auto;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	font-size: 0;
	margin: 0;
	padding: 0;	
}

form#form-footer label.checkbox,
form#form-contact label.checkbox {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 1em;
    align-items: center;
    padding: 0;
    transform: none;
}

form#form-contact input[type="checkbox"]:before,
form#form-contact input[type="checkbox"]:after,
form#form-footer input[type="checkbox"]:before,
form#form-footer input[type="checkbox"]:after {
	content: "";
    display: block;
    min-height: 0vh;
	font-size: 33px;
}

form#form-contact input[type="checkbox"]:before,
form#form-footer input[type="checkbox"]:before {
	width: 1em;
    height: 1em;
    background: transparent;
	border: solid 1px rgb(var(--color-grey-53));
	border-radius: 10px;
}

form#form-footer input[type="checkbox"]:before {
	border-color: rgb(var(--color-grey-53));
}

form#form-contact input[type="checkbox"]:after,
form#form-footer input[type="checkbox"]:after {
	position: absolute;
    width: calc(1em - 6px);
    height: calc(1em - 6px);
	left: 4px;
	top: 4px;
    background: rgb(var(--color-aqua));
	border-radius: 7px;
	opacity: 0;
    transition: opacity 0.2s linear;
}

form#form-contact input[type="checkbox"]:checked:after,
form#form-footer input[type="checkbox"]:checked:after {
    opacity: 1;
}

form#form-contact button[type="submit"] {
	margin-top: min(30px, (30 / var(--base-w)) * 100vw);
}

form#form-contact button[type="submit"],
form#form-footer button[type="submit"],
form#form-lb button[type="submit"] {
	border-color: rgb(var(--color-grey-53));
	color: rgb(var(--color-grey-53));
	clip-path: inset(0 0 100% 0);
	margin-top: calc((30 / 20) * 1em);
	opacity: 1;
	transform: translateY(100%);
}

form#form-lb button[type="submit"] {
	margin: 0 auto;
}

form#form-contact.show button[type="submit"],
form#form-footer.show button[type="submit"],
form#form-lb.show button[type="submit"] {
	clip-path: inset(0);
	opacity: 1;
	transform: translateY(0);
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc((var(--transition-delay) * 0.2s) + (var(--transition-delay-1) * 0.2s) + 0.1s);
}

form button[type="submit"]:disabled {
	opacity: 0.25;
}

a.bt-reserve {
	display: inline-block;
}

form#form-contact input:-webkit-autofill,
form#form-contact input:-webkit-autofill:hover, 
form#form-contact input:-webkit-autofill:focus, 
form#form-contact input:-webkit-autofill:active {
    -webkit-text-fill-color: rgb(var(--color-grey-53));
	-webkit-box-shadow: 0 0 0 60px rgb(var(--color-grey-96)) inset !important;
	box-shadow: 0 0 0 60px rgb(var(--color-grey-96)) inset !important;
}

form#form-footer input:-webkit-autofill,
form#form-footer input:-webkit-autofill:hover, 
form#form-footer input:-webkit-autofill:focus, 
form#form-footer input:-webkit-autofill:active,
form#form-lb input:-webkit-autofill,
form#form-lb input:-webkit-autofill:hover, 
form#form-lb input:-webkit-autofill:focus, 
form#form-lb input:-webkit-autofill:active {
    -webkit-text-fill-color: rgb(var(--color-grey-53));
	-webkit-box-shadow: 0 0 0 60px rgb(var(--color-white)) inset !important;
	box-shadow: 0 0 0 60px rgb(var(--color-white)) inset !important;
}

form input.error,
form p.error {
	color: #FF0000;
}

form p.error {
	grid-column: 1 / -1;
}

input.error,
select.error {
    background: #f2bebe;
}

.takk {
	display: block;
	position: relative;
	animation: kf-fade-in 0.4s linear both;
}


/*************************************
	Footer
 *************************************/


footer {
	display: block;
	position: relative;
	background-color: rgb(var(--color-grey-96));
	color: rgb(var(--color-grey-53));
}

footer > div.content {
	display: grid;
	position: relative;
	grid-template-columns: repeat(12, 1fr);
	grid-column-gap: var(--grid-column-gap);
	grid-row-gap: min(48px, (48 / var(--base-w)) * 100vw);
	max-width: calc(var(--base-w) * 1px);
	margin: 0 auto;
	padding: var(--page-margin);
	padding-top: min(110px, (110 / var(--base-w)) * 100vw);
	z-index: 10;
}

footer > div.content h2 {
	font-weight: 400;
	text-transform: uppercase;
}

footer > div.content h2,
footer > div.content div.copyright img {
	clip-path: inset(0 0 100% 0);
	opacity: 0;
	transform: translateY(100%);
}

footer > div.content *.show h2,
footer > div.content div.copyright.show img {
	clip-path: inset(0);
	opacity: 1;
	transform: translateY(0);
	transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc(var(--transition-delay) * 0.2s);
}

footer > div.content p {
	opacity: 0;
}

footer > div.content *.show p {
	opacity: 1;
	transition: opacity 0.2s linear;
	transition-delay: calc((var(--transition-delay) * 0.2s) + 0.4s);
}

footer h2 + p {
	margin-top: calc((18 / 20) * 1em);
}

footer div.logo {
	grid-row-end: span 3;
}

footer div.logo a,
footer div.logo svg {
	width: var(--grid-column-w);
	height: calc((109 / 72) * var(--grid-column-w));
}

footer div.logo svg g > * {
	fill: rgb(var(--color-grey-53));
}

footer nav {
	grid-column: 1 / span 6;
	grid-row: 1 / span 4;
}

footer nav li.active {
}

footer nav ul li {
	clip-path: inset(-1px);
}

footer nav ul li a {
	opacity: 0;
	transform: translateY(100%);
}

footer nav.show ul li a {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: calc(var(--transition-delay) * 0.1s);
}

footer div.back-to-top {
	grid-column: 12 / span 1;
	justify-self: end;
}

a.bt-next,
a.bt-next svg,
footer div.back-to-top a,
footer div.back-to-top svg {
	display: block;
	width: clamp(16px, (21 / var(--base-w)) * 100vw, 21px);
	height: clamp(44px, (55 / var(--base-w)) * 100vw, 55px);
}

a.bt-next {
	display: inline-block;
}

footer div.back-to-top a {
	position: absolute;
}

a.bt-next svg,
footer div.back-to-top svg {
	pointer-events: none;
}

footer div.back-to-top svg {
	transform: scaleY(-1);
}

a.bt-next svg > g > *,
footer div.back-to-top svg > g > * {
	fill: none;
	stroke: rgb(var(--color-grey-53));
	transition: stroke 0.4s;
}

p:has(a.bt-next:hover) svg > g > *,
footer div.back-to-top:has(a:hover) svg > g > * {
	stroke: rgb(var(--color-aqua));
}

footer div.address,
footer div.opening-hours,
footer div.contact {
	grid-column: 7 / span 5;
}

footer div.footer-form {
	grid-column: 7 / span 4;
	position: relative;
}

@media screen and (max-width: 1280px) {
	footer div.footer-form {
		grid-column: 7 / span 5;
	}
}

/*@media screen and (max-width: 1024px) {
	footer div.footer-form {
		grid-column: 7 / span 6;
	}
}*/

footer .logo-westcliff {
	display: inline-block;
	position: relative;
	font-weight: 300;
	font-size: clamp(12px, (16 / var(--base-w)) * 100vw, 16px);
	letter-spacing: 0.07em;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: min(96px, (96 / var(--base-w)) * 100vw);
}

footer .logo-westcliff svg {
	width: clamp(117px, (156 / var(--base-w)) * 100vw, 156px);
	height: auto;
	margin-top: 13px;
}

footer .logo-westcliff svg g > * {
	fill: rgb(var(--color-grey-53));
}

footer div.copyright {
	grid-column: 1 / -1;
}

footer p {
	font-size: clamp(12px, (15 / var(--base-w)) * 100vw, 15px);
}

footer div.copyright img {
	display: inline-block;
	width: calc((285 / 20) * 1em);
	height: auto;
	margin-bottom: calc((55 / 20) * 1em);
}


/*************************************
	Lightbox
 *************************************/


#lightbox,
#lightbox .lightbox_bckg {
	position: fixed;
	display: none;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}

#lightbox {
	z-index: 2000;
}

#lightbox.show {
	display: block;
	animation: kf-fade-in 0.2s linear 0s forwards;
}

#lightbox .lightbox_bckg {
	display: block;
	background: rgba(var(--color-white),0.85);
}

/*#lightbox .lightbox_bckg.lightbox_bckg_dark {
	background: rgba(var(--color-blue-1),0.8);
}*/

#lightbox button.bt-close {
	position: absolute;
	/*width: 1em;
	height: 1em;
	right: 0;
	top: -1.25em;
	font-size: clamp(min(36px, (36 / var(--base-w-mobile)) * 100vw), (45 / var(--base-w)) * 100vw, 45px);
	background: rgba(var(--color-blue),0.8) url("../images/ico-close.svg") center center no-repeat;
	background-size: auto 0.6em;*/
	/*width: min(90px, (90 / var(--base-w)) * 100vw);
	height: min(90px, (90 / var(--base-w)) * 100vw);*/
	width: min(50px, (50 / var(--base-w)) * 100vw);
	height: min(50px, (50 / var(--base-w)) * 100vw);
	/*right: max(-45px, (-45 / var(--base-w)) * 100vw);
	top: max(-45px, (-45 / var(--base-w)) * 100vw);*/
	right: 0;
	top: 0;
	background: rgba(var(--color-aqua),1) url("../images/ico-close.svg") center center no-repeat;
	background-size: 100%;
	border-radius: min(10px, (10 / var(--base-w)) * 100vw);
	transform: translate(50%, -50%);
	z-index: 10;
}

#lightbox div.lightbox-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
    pointer-events: none;
}

#lightbox div.lightbox-content {
	display: block;
	position: relative;
    pointer-events: auto;
}

#lightbox div.lightbox-content.gallery {
	display: flex;
	justify-content: center;
	align-items: center;
	width: auto;
	height: auto;
}

#lightbox div.lightbox-content.gallery iframe,
#lightbox div.lightbox-content.gallery img {
	/*border: solid var(--grid-column-gap) rgb(var(--color-white));*/
	/*box-shadow: 0 min(30px, (30 / var(--base-w-mobile)) * 100vw) min(60px, (60 / var(--base-w-mobile)) * 100vw) rgba(var(--color-black),0.35);*/
	animation: kf-fade-in 0.8s linear 0s forwards;
}

#lightbox div.lightbox-content.gallery img {
	width: auto;
	height: auto;
	max-width: calc((var(--grid-column-w) * 8) + (var(--grid-column-gap) * 7));
	/*max-height: calc(100vh - ((var(--grid-column-w) * 2) + (var(--grid-column-gap) * 2)));*/
	max-height: calc(100vh - (var(--page-margin) * 2));
}

#lightbox div.lightbox-content.gallery iframe {
	width: 100vw;
	height: 100vh;
	max-width: calc((var(--grid-column-w) * 8) + (var(--grid-column-gap) * 7));
	max-height: calc((480 / 853) * ((var(--grid-column-w) * 8) + (var(--grid-column-gap) * 7)));
	background: rgb(var(--color-black));
}

#lightbox div.lightbox-content.gallery .ctrl-arr {
	display: flex;
	justify-content: space-between;
	position: absolute;
	/*width: min((var(--base-w) * 1px) - (var(--page-margin) * 2), 100vw - (var(--page-margin) * 2));*/
	/*width: calc(100% + min(90px, (90 / var(--base-w)) * 100vw));*/
	width: calc(100% + min(50px, (50 / var(--base-w)) * 100vw));
	left: 50%;
	top: 50%;
	pointer-events: none;
	transform: translate(-50%, -50%);
}

#lightbox div.lightbox-content.gallery .ctrl-arr button {
	display: block;
	position: relative;
	/*width: min(90px, (90 / var(--base-w)) * 100vw);
	height: min(90px, (90 / var(--base-w)) * 100vw);*/
	width: min(50px, (50 / var(--base-w)) * 100vw);
	height: min(50px, (50 / var(--base-w)) * 100vw);
	background: rgba(var(--color-aqua),1) url("../images/ico-arrow-slideshow.svg") center center no-repeat;
	background-size: 100%;
	border-radius: min(10px, (10 / var(--base-w)) * 100vw);
	opacity: 0.2;
	pointer-events: none;
}

#lightbox div.lightbox-content.gallery .ctrl-arr button[data-dir="next"] {
    transform: scaleX(-100%);
}

#lightbox div.lightbox-content.gallery div.ctrl-arr button.show {
	opacity: 1;
	pointer-events: auto;
}

@media screen and (max-width: 960px) {
	/*#lightbox button.bt-close {
		right: 0.25em;
	}*/
	
	#lightbox div.lightbox-content.gallery img,
	#lightbox div.lightbox-content.gallery iframe {
		max-width: calc(100vw - (var(--page-margin) * 2));
		max-height: calc(100vh - (var(--page-margin) * 2));
	}
	
	/*#lightbox div.lightbox-content.gallery iframe {
		max-width: calc((var(--grid-column-w) * 14) + (var(--grid-column-gap) * 13));
		max-height: calc((var(--grid-column-w) * 14) + (var(--grid-column-gap) * 13));
	}*/
	
	#lightbox div.lightbox-content.gallery .ctrl-arr {
		width: calc(100% + min(45px, (45 / var(--base-w-mobile)) * 100vw));
	}
	
	#lightbox button.bt-close,
	#lightbox div.lightbox-content.gallery .ctrl-arr button {
		width: min(45px, (45 / var(--base-w-mobile)) * 100vw);
		height: min(45px, (45 / var(--base-w-mobile)) * 100vw);
		border-radius: min(10px, (10 / var(--base-w-mobile)) * 100vw);
	}
}


/****  Promo 2 mois gratuits  ****/


#lightbox .lightbox-content.lb-promo-2-mois-gratuits {
	display: grid;
	background: rgb(var(--color-blue));
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits img {
	width: min(490px, (490 / 980) * var(--f));
	height: auto;
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits .promo {
	display: flex;
	flex-direction: column;
	justify-content: center;
	row-gap: min(15px, (15 / 980) * var(--f));
	color: rgb(var(--color-white));
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits h2,
#lightbox .lightbox-content.lb-promo-2-mois-gratuits h3 {
	font-family: "EB Garamond", serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	text-align: center;
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits h2 {
	color: rgb(var(--color-white));
	font-size: min(48px, (48 / 980) * var(--f));
	line-height: 1em;
	text-transform: uppercase;
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits h3 {
	/*color: rgb(var(--color-green));*/
	font-size: min(32px, (32 / 980) * var(--f));
	line-height: calc((32 / 32) * 1em);
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits form {
	padding: 0 min(60px, (60 / 980) * var(--f));
}

form#form-lb {
	row-gap: min(10px, (10 / 980) * var(--f));
}

form#form-lb input, 
form#form-lb label,
form#form-lb button,
form#form-lb p {
	font-size: min(20px, (20 / 980) * var(--f));
}

form#form-lb label[for="phone"] {
	display: none;
}

#lightbox .lightbox-content.lb-promo-2-mois-gratuits p {
	color: rgb(var(--color-white));
	font-size: min(12px, (12 / 980) * var(--f));
	line-height: calc((14 / 12) * 1em);
	text-align: center;
	margin-top: min(15px, (15 / 980) * var(--f));
}

@media screen and (orientation : landscape) {
	#lightbox .lightbox-content.lb-promo-2-mois-gratuits {
		--f: 85vw;
		grid-template-columns: repeat(2, 1fr);
		width: min(980px, var(--f));
		height: min(520px, (520 / 980) * var(--f));
	}
	
	/*#lightbox .lightbox-content.lb-promo-2-mois-gratuits img {
		width: min(490px, (490 / 980) * 85vw);
		height: min(520px, (520 / 980) * 85vw);
	}*/
}

@media screen and (orientation : portrait) {
	#lightbox .lightbox-content.lb-promo-2-mois-gratuits {
		--f: 75vh;
		grid-template-columns: auto;
		grid-template-rows: repeat(2, 1fr);
		width: min(490px, (490 / 980) * var(--f));
		height: min(980px, var(--f));
	}
	
	/*#lightbox .lightbox-content.lb-promo-2-mois-gratuits img {
		width: min(490px, (490 / 980) * var(--f));
		height: auto;
	}*/
	
	/*#lightbox .lightbox-content.lb-promo-2-mois-gratuits h2 {
		font-size: min(48px, (48 / 980) * var(--f));
	}

	#lightbox .lightbox-content.lb-promo-2-mois-gratuits h3 {
		font-size: min(32px, (32 / 980) * var(--f));
	}

	#lightbox .lightbox-content.lb-promo-2-mois-gratuits form {
		padding: 0 min(60px, (60 / 980) * var(--f));
	}

	form#form-lb {
		row-gap: min(10px, (10 / 980) * 75vh);
	}
	
	form#form-lb input, 
	form#form-lb label,
	form#form-lb button,
	form#form-lb p {
		font-size: min(20px, (20 / 980) * 75vh);
	}

	#lightbox .lightbox-content.lb-promo-2-mois-gratuits p {
		font-size: min(12px, (12 / 980) * 75vh);
	}*/
}


/****  Form visit model units  ****/


#lightbox .lightbox-content.lb-form-visit-model-units {
	max-height: calc(100vh - (var(--page-margin) * 0.5));
	background: rgb(var(--color-beige-4));
	box-shadow: 0 0 10px rgba(var(--color-blue-1));
	padding: calc(var(--page-margin) * 0.5);
	overflow: auto;
}

#lightbox .lightbox-content.lb-form-visit-model-units button.bt-close {
	right: calc(var(--page-margin) * 0.5);
	top: calc(var(--page-margin) * 0.5);
}

#lightbox .lightbox-content.lb-form-visit-model-units h2 {
	padding-right: calc(clamp(min(36px, (36 / var(--base-w-mobile)) * 100vw), (45 / var(--base-w)) * 100vw, 45px) * 2);
}

@keyframes kf-fade-in {
    0%   {opacity: 0;}
    100%  {opacity: 1;}
}

@keyframes kf-show-nav {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(0);
	}
}

.bp-960,
.bp-640 {
	display: none;
}

.bp-1400 {
	display: inline-block;
}

@media screen and (max-width: 960px) {
	:root {
		--page-margin: calc((25 / var(--base-w-mobile)) * 100vw);
		--header-img-h: 130vw;
		/*--header-logo-w: clamp((16 / 20) * 72px, (72 / var(--base-w)) * 100vw, 72px);
		--header-logo-h: clamp((16 / 20) * 108px, (108 / var(--base-w)) * 100vw, 108px);*/
		--header-logo-w: min(50px, (50 / var(--base-w-mobile)) * 100vw);
		--header-logo-h: min(75px, (75 / var(--base-w-mobile)) * 100vw);
	}
	
	.bp-1400 {
		display: none;
	}
	
	.bp-960 {
		display: inline-block;
	}
	
	.ticker {
		height: 3.6em;
	}
	
	body.nav-open .ticker {
		display: none;
	}
	
	.bt img {
		width: min(var(--w) * 0.5px, ((var(--w) * 0.5) / var(--base-w-mobile)) * 100vw);
	}
	
	header nav {
		display: block;
	}

	header nav ul.main {
		flex-direction: row;
		justify-content: space-between;
		display: flex;
		width: 100%;
		/*align-items: flex-start;
		row-gap: var(--page-margin);
		display: inline-flex;
		padding: var(--page-margin);
		z-index: 20;*/
	}
	
	header nav ul.expand,
	footer nav ul {
		font-weight: 500;
		font-size: min(14px, (14 / var(--base-w-mobile)) * 100vw);
		line-height: calc((18 / 14) * 1em);
	}
	
	body.nav-open header .ico span {
		background-color: rgb(var(--color-grey-96));
	}
	
	
	
	
	main {
		row-gap: 0;
	}
	
	picture.parallax {
		height: min(var(--h-m) * 1px, (var(--h-m) / var(--base-w-mobile)) * 100vw);
	}

	
	section.header div.bckg-video iframe {
		width: calc((16 / 9) * var(--header-img-h));
		height: var(--header-img-h);
	}
	
	section.header .text {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-end;
		position: absolute;
		right: var(--page-margin);
		top: 0;
		height: 100%;
	}
	
	

	section.grid-layout > div > *[style*="--grid-column-start-m:"] {
		grid-column-start: var(--grid-column-start-m);
	}
	
	section.grid-layout > div > *[style*="--grid-column-end-m:"] {
		grid-column-end: var(--grid-column-end-m);
	}
	
	section.grid-layout > div > *[style*="--grid-row-start-m:"] {
		grid-row-start: var(--grid-row-start-m);
	}
	
	section.grid-layout > div > *[style*="--grid-row-end-m:"] {
		grid-row-end: var(--grid-row-end-m);
	}
	
	section.two-cols > div,
	section.privacy > div {
		grid-row-gap: min(25px, (25 / var(--base-w-mobile)) * 100vw);
		padding-top: min(50px, (50 / var(--base-w-mobile)) * 100vw);
		padding-bottom: min(50px, (50 / var(--base-w-mobile)) * 100vw);
	}
	
	section.two-cols > div > div:nth-child(1) {
		grid-column-end: span 9;
	}

	/*section.two-cols > div > div:nth-child(1):has(h3) {
		grid-column-end: span 4;
	}*/
	
	section.two-cols > div > div:nth-child(1):has(h3) {
		grid-column-end: span 12;
	}

	section.two-cols > div > div:nth-child(2) {
		grid-column: 1 / -1;
	}

	section.two-cols > div > div:nth-child(3) {
		grid-column: 12 / span 1;
		grid-row-start: 1;
	}
	
	section.two-cols > div > div:nth-child(3):has(.bt) {
		grid-column: 1 / -1;
		grid-row-start: auto;
		justify-content: space-between;
	}
	
	
	section.privacy > div > div {
		grid-column: 1 / -1;
	}

	section.two-cols h2,
	section.masonry h2,
	section.privacy h1 {
		font-size: min(18px, (18 / var(--base-w-mobile)) * 100vw);
		line-height: calc((22 / 18) * 1em);
	}

	section.two-cols h3,
	section.two-cols p,
	section.two-cols li,
	section.masonry h3,
	section.masonry p,
	section.grid-layout p,
	section.grid-layout h3,
	section.gallery h2,
	section.liste-poi h3,
	section.privacy h2	
	section.privacy p,
	section.privacy ul,
	.map-nav .bt,
	.poi,
	form#form-contact button[type="submit"],
	footer h2,
	footer p,
	footer button[type="submit"] {
		font-size: 14px;
		line-height: calc((18 / 14) * 1em);
	}
	
	footer h2 {
		font-weight: 400;
	}

	/*section.grid-layout h3 + p {
		margin-top: calc((18 / 20) * 1em);
	}*/

	section.two-cols p + p,
	section.two-cols p + ul,
	section.two-cols ul + p,
	section.grid-layout h3 + p,
	section.masonry p + p,
	section.grid-layout p + p,
	section.privacy p + p,
	section.privacy p + ul,
	section.privacy ul + p {
		margin-top: calc((18 / 14) * 1em);
	}

	/*section.grid-layout p + h3,
	section.privacy p + h2,
	section.privacy ul + h2 {
		margin-top: calc((54 / 20) * 1em);
	}*/

	/*section.two-cols li + li,
	section.privacy li + li {
		margin-top: calc((18 / 20) * 1em);
	}*/
	
	
	
	section.masonry > div {
		grid-gap: 0;
	}

	section.masonry > div > div {
		grid-column-start: 1;
		grid-column-end: -1;
	}
	
	section.masonry.projet > div > div:nth-child(4) {
		grid-row-start: 3;
	}
	
	section.masonry.projet > div > div:has(div.text):not(:last-child) {
		padding-bottom: var(--page-margin);
	}
	
	section.masonry.projet > div > div:has(div.text):not(:last-child):after {
		content: "";
		display: block;
		position: relative;
		width: 100%;
		height: var(--page-margin);
		background: rgb(var(--color-white));
		margin-bottom: calc(var(--page-margin) * -1);
	}

	section.masonry div.bckg picture {
		display: block;
		position: relative;
	}

	section.masonry > div > div[style*="--grid-column-end: span 12"] div.bckg picture,
	section.masonry > div > div[style*="--grid-column-end: span 6"] div.bckg picture,
	section.masonry div.text {
		min-height: calc((368 / var(--base-w-mobile)) * 100vw);
	}

	section.masonry div.bckg picture img {
		display: block;
		position: relative;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	section.masonry div.text {
		position: relative;
		width: 100vw;
		height: auto;
		left: auto;
		top: auto;
		padding: calc(var(--page-margin) * 2);
	}

	section.masonry.accueil div.text {
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		background: rgb(var(--color-white));
		color: rgb(var(--color-grey-53));
		opacity: 1;
	}

	section.masonry .bt {
		border-width: 1px;
		border-radius: calc((10 / 14) * 1em);
		font-size: min(14px, (14 / var(--base-w-mobile)) * 100vw);
		margin-top: calc((80 / 14) * 1em);
	}

	section.masonry .bt:before {
		width: 1px;
		height: calc((55 / 14) * 1em);
		top: calc(((-55 - 25) / 14) * 1em);
	}

	section.masonry.accueil .bt:before {
		background: rgb(var(--color-grey-53));
	}

	section.masonry.accueil div.text.show .bt:before/*,
	section.masonry.projet div.text.show .bt:before*/ {
		transform: scaleY(1);
		transition: transform 0.6s cubic-bezier(0.25,0.25,0.25,1);
		transition-delay: 0.8s;
	}

	/*section.masonry.accueil > div > div:hover .bt:before {
		transition-delay: 0.4s;
	}

	section.masonry.projet div.text.show .bt:before {
		transition-delay: calc((var(--transition-delay) * 0.2s) + 0.8s);
	}*/
	
	section.masonry.accueil .text.show h2 > span,
	section.masonry.accueil .text.show h3 > span {
		clip-path: inset(0);
		opacity: 1;
		transform: translateY(0);
		transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
		transition-delay: 0.2s;/*calc((var(--transition-delay) * 0.2s) + (var(--word-transition-delay) * 0.2s) + 0.4s);*/
	}

	section.masonry.accueil .text.show h3,
	section.masonry.accueil .text.show p,
	section.masonry.accueil .text.show ol,
	section.masonry.accueil .text.show ul {
		opacity: 1;
		transition: opacity 0.2s linear;
		transition-delay: 0.6s;
	}

	.overflow-right-m {
		margin-right: calc(var(--page-margin) * -1);
	}

	.overflow-left-m {
		margin-left: calc(var(--page-margin) * -1);
	}
	
	/*section.gallery {
		color: rgb(var(--color-grey-53));
		padding-bottom: var(--page-margin);
	}

	section.gallery div {
		position: relative;
	}

	section.gallery > div {
		display: block;
	}

	section.gallery div.gallery + div.gallery {
		margin-top: min(162px, (162 / var(--base-w)) * 100vw);
	}*/
	
	section.gallery div.gallery + div.gallery {
		margin-top: min(50px, (50 / var(--base-w-mobile)) * 100vw);
	}

	/*.gallery h2 {
		clip-path: inset(0 0 100% 0);
		opacity: 0;
		transform: translateY(100%);
	}

	.gallery.show h2 {
		clip-path: inset(0);
		opacity: 1;
		transform: translateY(0);
		transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
		transition-delay: calc(var(--transition-delay) + var(--transition-delay-1));
	}

	.gallery .bt-next {
		position: absolute;
		right: 0;
		bottom: 0;
	}

	.gallery ul {
		display: grid;
		position: relative;
		grid-template-columns: repeat(12, 1fr);
		grid-gap: var(--grid-column-gap);
		margin-top: min(107px, (107 / var(--base-w)) * 100vw);
	}*/
	
	.gallery ul {
		grid-gap: min(15px, (15 / var(--base-w-mobile)) * 100vw);
		margin-top: min(50px, (50 / var(--base-w-mobile)) * 100vw);
	}

	/*.gallery ul li {
		position: relative;
		grid-column-end: span 4;
	}*/
	
	.gallery ul li {
		grid-column: 1 / -1 !important;
	}

	/*.gallery ul:has(li:nth-child(4)) li {
		grid-column-end: span 6;
	}

	.gallery ul li picture {
		display: block;
		position: relative;
		padding-top: 66%;
		transition: transform 1.2s cubic-bezier(0.25,0.25,0.25,1);
	}*/
	
	.gallery ul li picture {
		padding-top: 133%;
	}

	/*.gallery ul li picture:before {
		content: "";
		min-height: 0vh;
		display: block;
		position: absolute;
		width: 1em;
		height: 1em;
		left: calc(50% - 0.5em);
		top: calc(50% - 0.5em);
		font-size: clamp(min(30px, (30 / 414) * 100vw), (30 / var(--base-w)) * 100vw, 30px);
		background-image: 
			radial-gradient(rgba(var(--color-white),1) 45%, rgba(var(--color-white),0) 45%),
			conic-gradient(rgba(var(--color-blue-dark),0) 25%, rgba(var(--color-blue-dark),1));
		border-radius: 9999px;
		animation: kf-gallery-loading 1.2s steps(8) both infinite;
		opacity: 0;
		transition: opacity 0.2s linear;
		z-index: 100;
	}

	.gallery.show ul li picture:before {
		opacity: 1;
		transition-delay: 0.4s;
	}

	.gallery.show ul li picture.loaded:before {
		opacity: 0;
		transition-delay: 0s;
	}

	@keyframes kf-gallery-loading {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	.gallery ul li img {
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		object-fit: cover;
		opacity: 0;
	}

	.gallery.show ul li picture.loaded img {
		opacity: 1;
		transition: opacity 0.4s linear;
		transition-delay: calc(var(--transition-delay) + var(--transition-delay-1) + var(--transition-delay-2) + 0.2s);
	}

	.gallery.show ul li a[data-iframe] figure:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-position: center center;
		background-repeat: no-repeat;
	}

	.gallery.show ul li a[data-iframe*="https://player.vimeo.com/"] figure:after {
		background-image: url("../images/ico-play.svg");
	}

	.gallery.show ul li a[data-iframe*="https://my.matterport.com/"] figure:after {
		background-image: url("../images/ico-360.svg");
	}

	.gallery.show ul li a[data-iframe] figure picture:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-image: 
			linear-gradient(rgba(var(--color-blue-dark),0.65), rgba(var(--color-blue-dark),0.5));
		background-position: center center;
		background-repeat: no-repeat;
	}

	.gallery figcaption {
		display: block;
		position: absolute;
		width: calc(100% - (var(--grid-column-gap) * 0.5));
		left: calc(var(--grid-column-gap) * 0.25);
		bottom: calc(var(--grid-column-gap) * 0.25);
		background: rgba(var(--color-blue-dark),0.75);
		color: rgb(var(--color-white));
		text-align: center;
		padding: calc(var(--grid-column-gap) * 0.5);
	}*/




	
	.map-container {
		height: calc((368 / var(--base-w-mobile)) * 100vw);
	}

	/*section.liste-poi .text,
	section.liste-poi .map-nav {
		grid-column-end: span 12
	}*/
	section.liste-poi {
		padding: calc(var(--page-margin) * 2) 0;
	}

	section.liste-poi .text,
	section.liste-poi .map-nav {
		grid-column: 1 / -1;
	}
	
	section.liste-poi > div {
		grid-row-gap: var(--page-margin);
	}
	
	
	/*************************************
        Plans
     *************************************/


    section.plans > div {
        padding: 0 min(40px, (20 / 375) * 100vw);
    }
    
    section.plans div.plans-selectors > form,
    section.plans div.plans-unit {
        padding: min(40px, (20 / 375) * 100vw);
    }

    section.plans div.plans-selectors > form {
        grid-gap: min(40px, (40 / 375) * 100vw);
    }
    
    section.plans div.plans-selectors > form > div {
        grid-column: 1 / -1;
    }
    
    section.plans div.plans-selectors > form > div + div:before,
    div.unit-collection:before,
    div.unit-title:before,
    div.unit-details:before,
    div.floors-nav:before {
        content: "";
        display: block;
        position: absolute;
        
        width: 100%;
        height: 1px;
        left: 0;
        top: max(-20px, (-20 / 375) * 100vw);

        background: rgb(var(--color-dark-grey));
    }
    
    section.plans div.plans-unit {
        grid-gap: min(20px, (20 / 375) * 100vw);
    }
    
    div.unit-collection + div.unit-title:before {
        content: none;
    }
    
    div.unit-title h3 {
        margin-bottom: 0;
    }
    
    div.unit-details {
        margin-top: min(20px, (20 / 375) * 100vw);
    }
    
    section.plans div.plans-building {
        display: none;
    }

    div.plans-unit > div {
        position: relative;
        grid-column: 1 / -1 !important;
    }
    
    div.unit-collection {
        padding: 0;
    }
    
    div.unit-collection img {
        width: min(234px, 50vw);
        height: auto;
    }

    div.unit-hr {
        display: none;
    }
    
    div.unit-details:after,
    div.unit-cta:after {
        content: none;
    }
    
    div.unit-cta {
        padding: min(20px, (20 / 375) * 100vw) 0;
    }
    
    div.unit-tools {
        flex-flow: column nowrap;
        align-items: center;
        text-align: center;
        padding: 0 0 min(20px, (20 / 375) * 100vw) 0;
    }
    
    div.unit-tools div.share > div {
        display: block;
        padding: min(40px, (40 / 375) * 100vw) 0 min(20px, (20 / 375) * 100vw) 0;
    }
    
    div.unit-tools div,
    div.unit-tools a,
    div.unit-tools div + a {
        margin-left: 0;
    }
    
    section.plans div.floors-nav {
        grid-row-start: 6;
        flex-flow: column nowrap;
        padding: 0;
    }

    section.plans div.floors-nav:empty {
        display: none;
    }
    
    section.plans div.floors-nav > div + div {
        margin-top: min(10px, (10 / 375) * 100vw);
        margin-left: 0;
    }
	
	
	
	/*section.contact > div {
		grid-row-gap: var(--page-margin);
		padding-top: var(--page-margin);
	}

	section.contact .text,
	section.contact .img {
		grid-column: 1 / span 12;
	}

	section.contact .img {
		margin-right: var(--page-margin-neg);
	}

	section.contact .img picture img {
		width: 100%;
		height: auto;
	}
	
	section.contact .form-container {
		grid-column: 1 / span 12;
		grid-row: 1 / span 1;
	}*/
	
	
	/*form#form-contact,
	form#form-contact .interests,
	form#form-footer {
		row-gap: calc(var(--page-margin) * 0.5);
	}

	form#form-contact {
		padding-bottom: 0;
	}*/
	
	form#form-contact {
		padding: calc(var(--page-margin) * 2) 0 !important;
	}
	
	/*form#form-contact input, 
	form#form-contact textarea,
	form#form-contact select,
	form#form-contact label,
	form#form-contact p,
	form#form-footer input, 
	form#form-footer label,
	form#form-footer p,
	form#form-lb input, 
	form#form-lb label,
	form#form-lb p {
		display: block;
		position: relative;
		min-height: 0vh;
		font-family: "Montserrat", sans-serif;
		font-weight: 300;
		font-style: normal;
		font-size: 16px;
		line-height: calc((19 / 16) * 1em);
		margin: 0;
		padding: 0;
	}*/
	
	form#form-contact,
	form#form-contact .interests,
	form#form-footer,
	form#form-lb {
		row-gap: min(15px, (15 / var(--base-w-mobile)) * 100vw);
	}

	form#form-contact {
		padding-bottom: min(104px, (104 / var(--base-w)) * 100vw);
	}

	form#form-footer {
		margin-top: min(25px, (25 / var(--base-w-mobile)) * 100vw);
		margin-bottom: 0;
	}
	
	
	form#form-contact input,
	form#form-contact textarea,
	form#form-contact select,
	form#form-contact label,
	form#form-contact p,
	form#form-footer input, 
	form#form-footer label,
	form#form-footer p,
	form#form-lb input, 
	form#form-lb label,
	form#form-lb p {
		font-size: 12px;
	}
	
	form#form-contact input, 
	form#form-contact textarea,
	form#form-contact select,
	form#form-footer input,
	form#form-lb input {
		border-radius: calc((10 / 12) * 1em);
	}

	form#form-contact input,
	form#form-contact label:not(.checkbox) span,
	form#form-footer input,
	form#form-footer label:not(.checkbox) span,
	form#form-lb input,
	form#form-lb label:not(.checkbox) span {
		padding: calc((10 / 12) * 1em) calc((14 / 12) * 1em);
	}
	
	form#form-contact input[type="checkbox"]:before,
	form#form-contact input[type="checkbox"]:after,
	form#form-footer input[type="checkbox"]:before,
	form#form-footer input[type="checkbox"]:after {
		font-size: 28px;
	}

	/*footer > div.content {
		grid-row-gap: var(--page-margin);
		max-width: none;
		padding: var(--page-margin);
	}
	
	footer div.logo {
		grid-column: 1 / -1;
	}
	
	footer nav {
		grid-column: 7 / span 6;
		grid-row: 3 / span 5;
		justify-self: end;
	}
	
	footer nav ul {
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		row-gap: 0.7em;
	}*/
	
	
	footer > div.content {
		grid-row-gap: min(20px, (20 / var(--base-w-mobile)) * 100vw);
		padding: var(--page-margin);
	}
	
	/*footer > div.content {
		display: grid;
		position: relative;
		grid-template-columns: repeat(12, 1fr);
		grid-column-gap: var(--grid-column-gap);
		grid-row-gap: min(48px, (48 / var(--base-w)) * 100vw);
		max-width: calc(var(--base-w) * 1px);
		margin: 0 auto;
		padding: var(--page-margin);
		padding-top: min(110px, (110 / var(--base-w)) * 100vw);
		z-index: 10;
	}

	footer > div.content h2 {
		font-weight: 400;
		text-transform: uppercase;
	}

	footer > div.content h2,
	footer > div.content div.copyright img {
		clip-path: inset(0 0 100% 0);
		opacity: 0;
		transform: translateY(100%);
	}

	footer > div.content *.show h2,
	footer > div.content div.copyright.show img {
		clip-path: inset(0);
		opacity: 1;
		transform: translateY(0);
		transition: clip-path 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
		transition-delay: calc(var(--transition-delay) * 0.2s);
	}

	footer > div.content p {
		opacity: 0;
	}

	footer > div.content *.show p {
		opacity: 1;
		transition: opacity 0.2s linear;
		transition-delay: calc((var(--transition-delay) * 0.2s) + 0.4s);
	}

	footer h2 + p {
		margin-top: calc((18 / 20) * 1em);
	}

	footer div.logo {
		grid-row-end: span 3;
	}*/
	
	footer div.logo {
		grid-column: 1 / span 6;
		grid-row: 1 / span 1;
	}
	
	footer div.logo a,
	footer div.logo svg {
		width: var(--header-logo-w);
		height: var(--header-logo-h);
	}

	/*footer div.logo a,
	footer div.logo svg {
		width: var(--grid-column-w);
		height: calc((109 / 72) * var(--grid-column-w));
	}

	footer div.logo svg g > * {
		fill: rgb(var(--color-grey-53));
	}

	footer nav {
		grid-column: 1 / span 6;
		grid-row: 1 / span 4;
	}*/
	
	footer nav {
		grid-column: 7 / span 6;
		grid-row: 1 / span 1;
	}
	
	footer nav ul {
		align-items: flex-end;
	}

	/*footer nav ul li {
		clip-path: inset(-1px);
	}

	footer nav ul li a {
		opacity: 0;
		transform: translateY(100%);
	}

	footer nav.show ul li a {
		opacity: 1;
		transform: translateY(0);
		transition: opacity 0.2s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
		transition-delay: calc(var(--transition-delay) * 0.1s);
	}

	footer div.back-to-top {
		grid-column: 12 / span 1;
		justify-self: end;
	}*/
	
	footer div.back-to-top {
		grid-row: 2 / span 1;
	}

	/*a.bt-next,
	a.bt-next svg,
	footer div.back-to-top a,
	footer div.back-to-top svg {
		display: block;
		width: clamp(16px, (21 / var(--base-w)) * 100vw, 21px);
		height: clamp(44px, (55 / var(--base-w)) * 100vw, 55px);
	}*/
	
	a.bt-next,
	a.bt-next svg,
	footer div.back-to-top a,
	footer div.back-to-top svg {
		width: min(12px, (12 / var(--base-w-mobile)) * 100vw);
		height: min(32px, (32 / var(--base-w-mobile)) * 100vw);
	}

	/*a.bt-next {
		display: inline-block;
	}

	footer div.back-to-top a {
		position: absolute;
	}

	a.bt-next svg,
	footer div.back-to-top svg {
		pointer-events: none;
	}

	footer div.back-to-top svg {
		transform: scaleY(-1);
	}

	a.bt-next svg > g > *,
	footer div.back-to-top svg > g > * {
		fill: none;
		stroke: rgb(var(--color-grey-53));
		transition: stroke 0.4s;
	}

	p:has(a.bt-next:hover) svg > g > *,
	footer div.back-to-top:has(a:hover) svg > g > * {
		stroke: rgb(var(--color-aqua));
	}

	footer div.address,
	footer div.opening-hours,
	footer div.contact {
		grid-column: 7 / span 5;
	}*/

	footer div.address,
	footer div.opening-hours,
	footer div.contact {
		grid-column: 1 / -1;
	}
	
	/*footer div.footer-form {
		grid-column: 7 / span 4;
		position: relative;
	}*/
	
	footer div.footer-form {
		grid-column: 1 / -1;
		padding: min(30px, (30 / var(--base-w-mobile)) * 100vw) 0;
	}
	
	footer div.footer-form h2 {
		font-weight: 500;
		text-align: center;
	}

	/*@media screen and (max-width: 1280px) {
		footer div.footer-form {
			grid-column: 7 / span 5;
		}
	}

	footer .logo-westcliff {
		display: inline-block;
		position: relative;
		font-weight: 300;
		font-size: clamp(12px, (16 / var(--base-w)) * 100vw, 16px);
		letter-spacing: 0.07em;
		text-align: center;
		text-transform: uppercase;
		margin-bottom: min(96px, (96 / var(--base-w)) * 100vw);
	}

	footer .logo-westcliff svg {
		width: clamp(117px, (156 / var(--base-w)) * 100vw, 156px);
		height: auto;
		margin-top: 13px;
	}*/
	
	footer .logo-westcliff {
		font-size: 8px;
		margin-top: min(25px, (25 / var(--base-w-mobile)) * 100vw);
		margin-bottom: min(40px, (40 / var(--base-w-mobile)) * 100vw);
	}

	footer .logo-westcliff svg {
		width: min(80px, (80 / var(--base-w-mobile)) * 100vw);
		margin-top: min(11px, (11 / var(--base-w-mobile)) * 100vw);
	}

	/*footer .logo-westcliff svg g > * {
		fill: rgb(var(--color-grey-53));
	}

	footer div.copyright {
		grid-column: 1 / -1;
	}*/
	
	footer div.copyright {
		text-align: center;
	}
	
	footer p {
		font-size: 12px;
	}

	/*footer p {
		font-size: clamp(12px, (15 / var(--base-w)) * 100vw, 15px);
	}

	footer div.copyright img {
		display: inline-block;
		width: calc((285 / 20) * 1em);
		height: auto;
		margin-bottom: calc((55 / 20) * 1em);
	}*/
	
	
	
	/*footer div.footer-form {
		grid-column: 1 / -1;
		grid-row: 2 / span 1;
		margin: var(--page-margin) 0;
	}
	
	footer div.address,
	footer div.opening-hours,
	footer div.contact {
		grid-column: 1 / span 6;
	}*/
}

.body-preload,
.preload {
	display: none !important;
}