:root {
	
	--lt-body: #767474;
	--lt-body-light: #a8a8a8;
	--lt-red: #c74a4a;

	--font-body: 'Muli', sans-serif;
	--font-heading: 'Ovo', serif;
	
	--input-padding-x: 1em;
  --input-padding-y: 1em;
}

body { min-width: 320px; font-family: var(--font-body), sans-serif; font-size: 13px; }
@media (min-width: 768px) {
	body { font-size: 15px; }
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 { font-family: var(--font-heading); color: var(--lt-body); }
.headingFont { font-family: var(--font-heading); }

.text-body-light { color: var(--lt-body-light); }
.bg-body { background-color: var(--lt-body); }


/* ********* */
/* BOOTSTRAP */
/* ********* */

.lead { font-size: 1.4em; }

.position-initial { position: initial !important; }


/* ***** */
/* MODAL */
/* ***** */

.modal-backdrop { background-color: rgba(247, 247, 247, 0.95); }
.modal-backdrop.show { opacity: 0.95; }
.modal-title { padding-left: 15px; padding-right: 15px; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.24); }
.modal-header .close { opacity: 1 !important; margin: 0 0 0 auto; width: 46px; height: 46px; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.24); }
.modal-header .close:hover,
.modal-header .close:focus { outline: none; }
.modal-body { box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.24); }

div.modal-xl { width: 92vw; max-width: 1000px; margin-left: auto; margin-right: auto;}


/* ************ */
/* SLICK SLDIER */
/* ************ */

.innerSlide { /*display: none;*/ visibility: hidden; }
.floorSlider img { max-width: 100%; max-height: 80vh; width: auto; height: auto; margin: auto; }
@media (min-width: 992px) {
	.floorSlider img { max-height: 900px; }
}

/* Slick arrows */
.slick-arrow { color: var(--lt-body-light); font-size: 15px; line-height: 1; border: none; outline: none; background: transparent; }
.slick-arrow:hover,
.slick-arrow:focus { outline: none; }

/* Slick dots */
.slick-dots { padding: 0;  margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; margin: 0 3px; padding: 0; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; padding: 3px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
.slick-dots li button:hover,
.slick-dots li button:focus { outline: none; }
.slick-dots li button:before {
    font-family: "Font Awesome 5 Pro";
    font-size: 12px;
	line-height: 1;
    content: "\f111";
	font-weight: 400;
    text-align: center;
    color: var(--lt-body-light);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before { font-weight: 900; }


/* ***** */
/* WAVES */
/* ***** */

.waveBelow { margin-bottom: 9.5vw; position: relative; }
.waveBelowSvg { position: absolute; top: 100%; left: 0; right: 0; }

.whiteOpFill{ fill: rgba(255,255,255,0.4); }
.whiteFill{ fill: #ffffff; }

.greyOpFill{ fill: rgba(168,168,168,0.4); }
.greyFill{ fill: #a8a8a8; }

.headerImgSpacer,
.upperWave,
.lowerWave { position: relative; }
.upperWave:before,
.lowerWave:after,
.headerImgSpacer:after { content: ""; height: 1px; background-color: #fff; position: absolute; left: 0; right: 0; bottom: 0; }
.upperWave:before { top: 0; }


/* ****** */
/* HEADER */
/* ****** */

header { background-color: var(--lt-body-light); background-position: center; background-size: cover; }
.headerLogo { position: absolute; top: 0; left: 0; right: 0; z-index: 50; line-height: 1; }
.headerLogo img { width: 310px; max-width: 30vw; min-width: 130px; }
.headerImgSpacer { padding-top: 30vh; }
@media (min-width: 992px) {
	.headerImgSpacer { padding-top: 30vw; }
}
@media (min-width: 1200px) {
	.headerLogo { top: 8px; }
	.headerImgSpacer { padding-top: 50vh; }
}


/* **** */
/* MENU */
/* **** */

/* Nav sections */
.navSections { z-index: 40; position: fixed; right: 0; top: 0; left: 0; bottom: 0; }
.navSections > div { position: absolute; top: 75px; left: 0; right: 0; bottom: 0; z-index: 1; 
	transition: all 500ms ease-in-out;
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition: all 500ms ease-in-out;
	-o-transition: all 500ms ease-in-out;
}
@media (min-width: 576px) {
	.navSections > div { top: 15vw; }
}
@media (min-width: 992px) {
	.navSections > div { top: 150px; }
}
.scrolled .navSections > div { top: 25px; }

.navSections .nsContact:not(.move) { 
    transform: translate(-100vw, 0px);
    -webkit-transform: translate(-100vw, 0px);
    -moz-transform: translate(-100vw, 0px);
    -o-transform: translate(-100vw, 0px);
    -ms-transform: translate(-100vw, 0px);
}
.navSections .nsFindUs:not(.move) { 
    transform: translate(100vw, 0px);
    -webkit-transform: translate(100vw, 0px);
    -moz-transform: translate(100vw, 0px);
    -o-transform: translate(100vw, 0px);
    -ms-transform: translate(100vw, 0px);
}
.navSections .nsMenu.movefor-findus { 
    transform: translate(-100vw, 0px);
    -webkit-transform: translate(-100vw, 0px);
    -moz-transform: translate(-100vw, 0px);
    -o-transform: translate(-100vw, 0px);
    -ms-transform: translate(-100vw, 0px);
}
.navSections .nsMenu.movefor-contactus { 
    transform: translate(100vw, 0px);
    -webkit-transform: translate(100vw, 0px);
    -moz-transform: translate(100vw, 0px);
    -o-transform: translate(100vw, 0px);
    -ms-transform: translate(100vw, 0px);
}

.nav { font-size: 3em; }
.backlink { font-size: 1.4em; color: var(--lt-body); text-decoration: none; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.24); }
.backlink:focus,
.backlink:hover { text-decoration: none; color: var(--lt-body); }

.findUsMap { height: 35vh; }
@media (min-width: 576px) {
	.findUsMap { height: 55vh; }
}


/* Nav Control */
.nav-tgl {
	display: inline-block;
	cursor: pointer;
	position: fixed;
	z-index: 100;
	right: 25px;
	top: 25px;
	width: 50px;
	height: 50px;
	border: none;
	border-radius: 50%;
	padding: 0;
	background: #fff;
	box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.24);
	line-height: 0.6;
	text-align: center;
}
.nav-tgl > span {
	display: inline-block;
	position: relative;
	height: 2px;
	width: 26px;
	border-radius: 1px;
	background: #293335;
	vertical-align: middle;
}
.nav-tgl > span:before, .nav-tgl > span:after {
	display: inline-block;
	position: absolute;
	content: "";
	height: 2px;
	border-radius: 1px;
	background: #293335;
	transition: all 200ms;
}
.nav-tgl > span:before { top: -8px;	left: 2px; width: 22px; }
.nav-tgl > span:after { top: 8px; left: 4px; width: 18px; }
.nav-tgl:focus { outline: none; }
.nav-tgl:hover > span:after, .nav-tgl:hover > span:before { width: 26px; left: 0; }

.navSections:before {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	content: '';
	width: 100vw;
	height: 100vh;
	background: rgba(247, 247, 247, 0.95);
}
.navSections,
.navSections:before {
	transition: all 500ms ease-in-out;
	-webkit-transition: all 500ms ease-in-out;
	-moz-transition: all 500ms ease-in-out;
	-o-transition: all 500ms ease-in-out;

	clip-path: circle(30px at calc(100% - 50px) 50px);
	visibility: hidden;
}
.menu.active .navSections,
.menu.active .navSections:before { 
	visibility: visible;
	clip-path: circle(100%);
}

.menu.active .nav-tgl > span { height: 0; }
.menu.active .nav-tgl > span:after, .menu.active .nav-tgl > span:before { top: -2px; left: 0; width: 26px; }
.menu.active .nav-tgl > span:after { transform: rotate(-45deg); }
.menu.active .nav-tgl > span:before { transform: rotate(45deg); }
@media (min-width: 576px) {
	.nav-tgl { width: 70px; height: 70px; }
	.nav-tgl > span { width: 34px; }
	.nav-tgl > span:before { top: -11px;	left: 3px; width: 28px; }
	.nav-tgl > span:after { top: 11px; left: 6px; width: 22px; }
	.nav-tgl:hover > span:after, .nav-tgl:hover > span:before { width: 34px; }
	
	.navSections,
	.navSections:before { 
		clip-path: circle(30px at calc(100% - 65px) 65px);
	}
	
	.menu.active .nav-tgl > span:after, .menu.active .nav-tgl > span:before { width: 34px; }
}


/* ****** */
/* FOOTER */
/* ****** */

footer img { max-width: 45px; }
@media (min-width: 576px) {
	footer img { max-width: 60px; }
}


/* **** */
/* LINK */
/* **** */

.link {
	position: relative;
	-webkit-transition: -webkit-clip-path 275ms ease;
	transition: -webkit-clip-path 275ms ease;
	transition: clip-path 275ms ease;
	transition: clip-path 275ms ease, -webkit-clip-path 275ms ease;
}
.link:hover span:before, .link:focus span:before {
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.link span { position: relative; display: inline-block; color: var(--lt-body); }
.link span:before {
	position: absolute;
	content: attr(data-content);
	color: var(--lt-red);
	text-decoration: underline;
	-webkit-text-decoration-color: var(--lt-red);
	text-decoration-color: var(--lt-red);
	-webkit-clip-path: polygon(0 0, 0 0, 0% 100%, 0 100%);
	clip-path: polygon(0 0, 0 0, 0% 100%, 0 100%);
	-webkit-transition: -webkit-clip-path 275ms ease;
	transition: -webkit-clip-path 275ms ease;
	transition: clip-path 275ms ease;
	transition: clip-path 275ms ease, -webkit-clip-path 275ms ease;
}


/* ******** */
/* SECTIONS */
/* ******** */

section { position: relative; overflow: hidden; }
section h2 { font-size: 3.6em; line-height: 1.1; }
section h2 span { display: block; color: var(--lt-body-light); }

.productHighlights { z-index: 1; position: absolute; top: 100%; left: 0; right: 0; }
.productHighlights a { width: 29%; overflow: hidden; color: var(--lt-body); background-repeat: no-repeat; background-size: cover; background-position: center; }
.productHighlights a > span { display: block; height: 0; padding-bottom: 100%; position: relative; }
.productHighlights a > span > span { position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 10px; background-color: rgba(255, 255, 255, 0.7); }

section .imageWave { background-color: var(--lt-body-light); background-position: center; background-size: cover; }
.imageSpacer { height: 55vw; }

.galleryCircle { z-index: 1; position: relative; width: 70vw; height: 70vw; max-width: 530px; max-height: 530px; padding: 1vw; margin: 1rem auto; }
.galleryCircle > div { background-color: var(--lt-body-light); background-position: center; background-size: cover; }
.galleryCircleLink { position: absolute; width: 60%; height: 60%; top: 37%; border: 5px solid #fff; background-color: var(--lt-body); color: #fff; }
.galleryCircleLeft .galleryCircleLink { left: -18%; }
.galleryCircleRight .galleryCircleLink { right: -18%; }
.galleryCircleLink > a { -webkit-box-shadow: inset 0px 0px 0px 2px var(--lt-body-light); -moz-box-shadow: inset 0px 0px 0px 2px var(--lt-body-light); box-shadow: inset 0px 0px 0px 2px var(--lt-body-light); 
	transition: all 250ms ease-in-out;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
}
.galleryCircleLink > a:hover { text-decoration: none; -webkit-box-shadow: inset 0px 0px 0px 5px var(--lt-body-light); -moz-box-shadow: inset 0px 0px 0px 5px var(--lt-body-light); box-shadow: inset 0px 0px 0px 5px var(--lt-body-light); }
.galleryCircleLink > a span { color: #d1d0d0; font-size: 5vw; line-height: 1.2; }
.galleryCircleLink > a span:first-of-type { color: #fff; font-family: var(--font-heading); }
.galleryCircleLeft .galleryCircleMargin { margin-left: 11vw; }
.galleryCircleRight .galleryCircleMargin { margin-right: 11vw; }

@media (min-width: 576px) {
	.productHighlights a { width: 27%; }
	.productHighlights a > span > span { padding: 6px 10px; }
	
	.galleryCircle { position: absolute; width: 40vw; height: 40vw; bottom: -7vw; margin: 0; }
	.galleryCircleLeft .galleryCircle { right: -8vw; padding: 1vw 0 1.5vw 2.5vw; }
	.galleryCircleRight .galleryCircle { left: -8vw; padding: 1vw 2.5vw 1.5vw 0; }
	.galleryCircleLink { width: 55%; height: 55%; top: 41%; border: 8px solid #fff; }
	.galleryCircleLeft .galleryCircleLink { left: -9%; }
	.galleryCircleRight .galleryCircleLink { right: -9%; }
	.galleryCircleLeft .galleryCircleMargin,
	.galleryCircleRight .galleryCircleMargin { margin: 0; }
	.galleryCircleLink > a span { font-size: 2.5vw;  }
}
@media (min-width: 768px) {
	section h2 { font-size: 5em; }
	.imageSpacer { height: 30vw; }
}
@media (min-width: 992px) {
	.galleryCircleLeft .galleryCircle { right: -5vw; }
	.galleryCircleRight .galleryCircle { left: -5vw; }
	.galleryCircleLink { width: 45%; height: 45%; top: 46%; border: 10px solid #fff; }
	.galleryCircleLeft .galleryCircleLink { left: -8%; }
	.galleryCircleRight .galleryCircleLink { right: -8%; }
	.galleryCircleLink > a span { font-size: 2vw; }
}
@media (min-width: 1200px) {
	.galleryCircleLeft .galleryCircle { right: -2vw; }
	.galleryCircleRight .galleryCircle { left: -2vw; }
	.galleryCircleLink > a span { font-size: 1.5em;  }
}


/* ***** */
/* FORMS */
/* ***** */

.form-label-group { position: relative; margin-bottom: 1rem; }
.form-label-group > input,
.form-label-group > label,
.form-label-group > textarea {
	padding: var(--input-padding-y) var(--input-padding-x);
	height: unset;
	font-size: 1em;
}
.form-label-group > label {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	margin-bottom: 0;
	line-height: 1.5;
	color: #495057;
	border: 1px solid transparent;
	border-radius: .25rem;
	transition: all .1s ease-in-out;
}
.form-label-group input::-webkit-input-placeholder,
.form-label-group textarea::-webkit-input-placeholder {
	color: transparent;
}
.form-label-group input:-ms-input-placeholder,
.form-label-group textarea:-ms-input-placeholder {
	color: transparent;
}
.form-label-group input::-ms-input-placeholder,
.form-label-group textarea::-ms-input-placeholder {
	color: transparent;
}
.form-label-group input::-moz-placeholder,
.form-label-group textarea::-moz-placeholder {
	color: transparent;
}
.form-label-group input::placeholder,
.form-label-group textarea::placeholder {
	color: transparent;
}
.form-label-group input:not(:placeholder-shown),
.form-label-group textarea:not(:placeholder-shown) {
	padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
	padding-bottom: calc(var(--input-padding-y) / 3);
}
.form-label-group input:not(:placeholder-shown) ~ label,
.form-label-group textarea:not(:placeholder-shown) ~ label {
	padding-top: calc(var(--input-padding-y) / 3);
	padding-bottom: calc(var(--input-padding-y) / 3);
	font-size: 0.9em;
	color: #777;
}