* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-repeat: no-repeat;
}

body, html {
    height: 100%;
    font-family: "Josefin Sans", sans-serif;
    font-weight: 300;
    color: #bbb;
    background-color: black;
}   

h1, h2, h3, h4, h5, h6 {
    font-weight: 100;
    color:white;
    margin-bottom:1.8dvh;
}
h1 {font-size:10.6dvh; line-height: 1; letter-spacing:0dvh; margin-bottom:0dvh;}
h2 {font-size:9dvh; line-height: 1.05;}
h3 {font-size:7dvh; line-height: 1.1;}
h4 {font-size:5.8dvh;}
h5 {font-size:4dvh;}
h6 {font-size:3dvh;}
p {font-size:2.2dvh;}



.btn {
	font-size: 1.4dvh;
	text-transform:uppercase;
	line-height:1;
	padding:1.5dvh 2dvh 1.2dvh 2dvh;
	border-radius: 3dvh;	
}
.whitebtn {
	background-color:white;
	color:black;
	border: 1px solid black;
	transition: box-shadow .3s;
	box-shadow:0 .6dvh .8dvh rgba(0,0,0,0);
}
.whitebtn:hover {
	background-color:white;
	color:black;
	border: 1px solid black;
	box-shadow:0 .6dvh .8dvh rgba(0,0,0,.3);
}
.blackbtn {
	background-color:black;
	color:white;
	border: 1px solid white;
	transition: background-color .3s, color .3s,;
}
.blackbtn:hover {
	background-color:white;
	color:black;
}

.toppad6 {padding-top:6dvh;}
.bottomspace4 {margin-bottom:4dvh;}


/*  PORTRAIT INSTRUCTION  */
.portrait {
	display:none;
}


/*  LOGO SPLASH  */

.logo {
    position: absolute;
    z-index: 100;
    height: 25dvh;
    left: 50%;
    bottom: 50dvh;
    transform: translate(-50%, 12.5dvh);
    opacity: 0;
}

.logo-splash {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 90;
    width: 100dvw;
    height: 100dvh;
    background-color: rgba(0,0,0,1);
}

.white-block {
    position: absolute;
    z-index: 95;
    bottom: 0; /* Use safe area inset for the bottom */
    left: 0;
    width: 0;
    height: 46.2dvh;
    background-color: white;
}

/* Logo animation */
.animated-logo {
    animation: fadeIn 1s forwards, moveShrinkLogo 1.5s forwards 2s;
}

/* Splash background animation */
.animated-splash {
    animation: BGfadeOut 1.5s forwards 2s, ShrinkBox .1s forwards 3.5s;
}

/* White block animation */
.animated-white-block {
    animation: expandBlock .5s forwards 1.5s, moveShrinkBlock 1.5s forwards 2s;
}

/* Keyframes */
@keyframes fadeIn {
    to { opacity: 1; }
}

@keyframes BGfadeOut {
    to { background-color: rgba(0,0,0,0); }
}

@keyframes moveShrinkLogo {
    to {
        height: 13dvh;
        left: 1dvh;
        bottom: 1.45dvh;
        top: auto;
        transform: translate(0, 0);
    }
}

@keyframes moveShrinkBlock {
    to {
        width: 100%;
        height: 6dvh;
        left: 0;
        bottom: 0;
    }
}

@keyframes expandBlock {
    to { width: 100%; }
}

@keyframes ShrinkBox {
    to { height: 6dvh; }
}





.mainmenu {
	position:absolute;
	bottom:1.7dvh;
	right:0;
	z-index:100;
	list-style-type:none;
	animation: reveal 4s forwards;
}
@keyframes reveal {
  0%   { opacity: 0; display:none;}
  60%   { opacity: 0; display:block; }
  100% { opacity: 1; display:block; }
}
.mainmenu li {
	opacity:100%;
	color:black;
	display:inline;	
	text-transform: uppercase;
	font-size: 1.6dvh;
}
.mainmenu li a {
	margin:0 1dvh;
	padding:1dvh 2dvh;
	text-decoration:none;
	line-height:1;
	color:black;
	border-radius:4dvh;
	font-weight: 400;
	transition: box-shadow .5s;
}
.mainmenu li a:hover {
	color: #000;
	cursor: pointer;
	background-color:#fff;
	box-shadow:0 .2dvh .8dvh rgba(0,0,0,.3);
}
.mainmenu li::after {content:'|';}
.mainmenu li:last-child::after {content:'';}





/*  END LOGO SPLASH  */


/* SCROLL CONTAINER */

.scroll-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	height: 94dvh;
}
.section {
    display:flex;
    height:100%;
    flex: 0 0 100%;
    max-width:215dvh;
}
.spacer {
    display:flex;
    height:100%;
    flex: 0 0 10%;
}
.section .row {height:100%;}
/*  END SCROLL CONTAINER   */


/* MAIN BANNER */

.main-banner {
	position:relative;
    flex: 0 0 75%;
    overflow:hidden;
}
.slide {
	position:absolute;
	top:0;
	left:0;
	width:101%;
	height:100%;
    background-size: cover;
	background-position: top center;
	opacity:0;
	animation-name: bannerfade; 
	animation-duration: 24s; 
	animation-iteration-count: infinite;

}
@keyframes bannerfade {
  0%   { opacity: 0; }
  8.33%   { opacity: 1; }
  25%  { opacity: 1; }
  33.33%  { opacity: 0; }
  100% { opacity: 0; }
}
.slide:nth-child(1) {animation-delay: 0s; background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_priano.webp');}
.slide:nth-child(2) {animation-delay: 6s; background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_artistry.webp');}
.slide:nth-child(3) {animation-delay: 12s; background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_kolter.webp');}
.slide:nth-child(4) {animation-delay: 18s; background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_springhaven.webp');}

.slide-overs {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.slide-overs .slide:nth-child(1) {background-image: url('../img/mainslide_priano_t.webp');}
.slide-overs .slide:nth-child(2) {background-image: url('../img/mainslide_artistry_t.webp');}
.slide-overs .slide:nth-child(3) {background-image: url('../img/mainslide_kolter_t.webp');}
.slide-overs .slide:nth-child(4) {background-image: url('../img/mainslide_springhaven_t.webp');}

.slantbar {
	position:absolute;
	top:0;
	right:0;
	width:100%;
	height:100%;
	background-size: cover;
    background-position-y: 0;
	animation-name: slantbar; 
	animation-duration: 24s; 
	animation-iteration-count: infinite;
	background-image: url('../img/mainslide-slantbar1.webp');
	animation-delay: 6s;
	background-position-x: 40dvh;
}
.slantbar2 {
	background-image: url('../img/mainslide-slantbar2.webp');
	animation-name: slantbar2;
	animation-duration: 22s;
	background-position-x: 0dvh;
	animation-delay: 3s;
}
.slantbar3 {
	background-image: url('../img/mainslide-slantbar3.webp');
	animation-name: slantbar3;
	animation-duration: 20s;
	animation-delay: 0s;
	background-position-x: 15dvh;
}
@keyframes slantbar {
  0%   { background-position-x: 40dvh; }
  50%  { background-position-x: 30dvh; }
  100% { background-position-x: 40dvh; }
}
@keyframes slantbar2 {
  0%   { background-position-x: 0dvh; }
  50%  { background-position-x: 15dvh; }
  100% { background-position-x: 0dvh; }
}
@keyframes slantbar3 {
  0%   { background-position-x: 15dvh; }
  50%  { background-position-x: -5dvh; }
  100% { background-position-x: 15dvh; }
}


.banner-title {
	z-index:50;
	height:100%;	
}

	.banner-title h1 {
		position:relative;
		float:right;
		padding: 0;
		margin: 0;
		height:100%;
		font-weight: 200;
		text-align:center;
		writing-mode: vertical-rl;
		text-orientation: sideways;
		text-transform: uppercase;
		text-shadow: rgba(0,0,0,.5) 0 .3dvh 1dvh;
		animation: BannerText 12s infinite;
	}
	.banner-title h1:nth-child(2) {
		position:absolute;
		right:-9dvh;
		animation-delay:6s;
	}
	@keyframes BannerText {
		0% {right:-9dvh; }
		5% {right: 1dvh;}
		45% {right: 1dvh;}
		50% {right:-9dvh;}
		100% {right:-9dvh;}
	}
	
	.banner-bullets {
		position:relative;
		z-index:inherit;
		float:right;
		padding:20dvh 3.5dvh 0 0;
	}	
	.banner-bullets h4 {
		padding-top:.2dvh;
		text-align:right;
		text-transform: lowercase;
	}	

/* END MAIN BANNER */


/* MAIN BANNER TEXT */

.main-banner-txt {
	position:relative;
    padding: 5dvh;
	flex: 0 0 25%;
}
.main-banner-txt div {
	margin: 25vh 0 0 0;
}
.main-banner-txt img {
	width:130%;
	opacity:25%;
	margin-left:-3%;
}
.main-banner-txt p {
    max-width:70%;
    min-width:18dvh !important;
}

/* END MAIN BANNER TEXT */


/* IMPACT TAGLINE */

#tagline {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:right;
	height:100%;
    padding: 8dvh;
    background-image: url('../img/priano-lobby.webp');
    background-size: 75%;
	background-position: center right;
	background-repeat: no-repeat;
	width:100dvw;
	position:relative;
}
#tagline h2 {
    font-size:30dvh;
    margin-bottom:0;
    line-height:.9;
    color: #fff;
}

/* END IMPACT TAGLINE */


/* BUSINESS LINE SECTIONS */


.whitesection {
    background-color:white;
}
.whitesection p {
    color:#777 !important;
}
.detailpics {
	flex: 0 0 auto;
	aspect-ratio:.6;
    height:100%;
    position:relative;
    margin:0 1.5dvh;
}
.vertpic {
	position:relative;
	height:100%;
	overflow:hidden;
	padding:0;
}
.vertpic img {
	position:relative;
	left:0;
	width:100%;
	animation:Vertpicslide 30s infinite;
}
.vertpic:nth-child(2)  img {
	animation:Vertpicsliderev 30s infinite;
}
@keyframes Vertpicslide {
  	0%   { top: 0; }
 	20%  { top: 0; }
 	25%  { top:-100%; }
	45%  { top:-100%; }
 	50%  { top:-200%; }
 	70%  { top:-200%; }
 	75%  { top:-100%; }
	95%  { top:-100%; }
	100% { top: 0; }
}
@keyframes Vertpicsliderev {
  	0%   { top:-200%; }
 	20%  { top:-200%; }
 	25%  { top:-100%; }
	45%  { top:-100%; }
 	50%  { top: 0; }
 	70%  { top: 0; }
 	75%  { top:-100%; }
	95%  { top:-100%; }
	100% { top:-200%; }
}
.sqpic {
	position:absolute;
	top:10%;
	left:20%;
	width:60%;
	aspect-ratio:1;
	background-image: url('../img/sq-thumb-design.webp');
	background-size:100%;
	background-position:center center;
	border:3dvh solid white;
	box-shadow:0 1dvh 2dvh rgba(0,0,0,.6);
	transition:background-size .3s;
}
.sqpic:hover {background-size:200%;}
.sqpic-low {
	top:auto;
	bottom:10%;
	background-image: url('../img/sq-thumb-sales.webp');
	background-size:140%;
}

.bizcontent {
	position:relative;
	flex: 1 1 auto;
	width:100%;
	padding:6dvh 2%;
    color:#999;
    background-image: linear-gradient(to bottom, rgba(230, 230, 230, 0) 90%, rgba(230, 230, 230, 1) 98%);
}

.bizcontent h2 {color: black; margin-left:-.3dvh;}
.bizcontent h5 {color: black;}
.bizcontent p {color: #999;}



.bizlearnmore {text-align:right;}
.bizlearnmore > div {width:100%;}

.biztitle, .bizlearnmore {height:25%;}
.biztext {height:25%; width:100%;}
.biztext p {width:80%}
.gallerybox {height:50%; width:100%; padding:0;}

.gallerypic {
	height:100%;
	flex-grow: 1;
	flex-shrink: .5;
	transition:flex-grow .3s, flex-shrink .3s, flex-basis .3s;
	padding:0 1dvh;
}


.gallerypic:hover {flex-grow:10;}
.gallerypic:hover div {margin-top:-3%;}

.gallerypic div {
	height:100%;
	margin-top:0%;
	background-color:#bbb;
	transition: margin-top .8s;
}


.gallerypic div div {
	height:100%;
	background-size:cover;
	background-position: 50% 50%;
	opacity:10%;
	transition:opacity .5s;
}

.gallerypic:hover div div {opacity:100%;}

.gallerypic div div h6 {
	display:none;
	padding: 1dvh;
	text-align:center;
	font-weight: 500;
	color:white !important;
	text-shadow: rgba(0,0,0,.8) 0 .2dvh .2dvh;
	opacity:0%;
	transition:opacity .5s;
}

.gallerypic:hover div div h6 {display: block; opacity:100%;}

/*
#designstudios .gallerypic:nth-child(1) div div {background-image:url('../img/gallery-edgehomes1.jpg');}
#designstudios .gallerypic:nth-child(2) div div {background-image:url('../img/gallery-edgehomes2.jpg');}
#designstudios .gallerypic:nth-child(3) div div {background-image:url('../img/gallery-parksquare2.jpg');}
#designstudios .gallerypic:nth-child(4) div div {background-image:url('../img/gallery-parksquare1.jpg');}
#designstudios .gallerypic:nth-child(5) div div {background-image:url('../img/gallery-darkdesign.jpg');}
#designstudios .gallerypic:nth-child(6) div div {background-image:url('../img/gallery-priano1.jpg');}
#designstudios .gallerypic:nth-child(7) div div {background-image:url('../img/gallery-westbay1.jpg');}

#salescenters .gallerypic:nth-child(1) div div {background-image:url('../img/kolter-astor.jpg');}
#salescenters .gallerypic:nth-child(2) div div {background-image:url('../img/kolter-astor2.jpg');}
#salescenters .gallerypic:nth-child(3) div div {background-image:url('../img/kolter-twinlakes-cafe.jpg');}
#salescenters .gallerypic:nth-child(4) div div {background-image:url('../img/kolter-twinlakes-desk.jpg');}
#salescenters .gallerypic:nth-child(5) div div {background-image:url('../img/gallery-brunswick.jpg');}
#salescenters .gallerypic:nth-child(6) div div {background-image:url('../img/gallery-lakeside.jpg');}
#salescenters .gallerypic:nth-child(7) div div {background-image:url('../img/gallery-verano.jpg');}
*/


/* END BUSINESS LINE SECTIONS */



/*  ABOUT SECTION  */

#about {
    flex: 0 0 160%;
    max-width:320dvh;
}
#about > .row {
	position:relative;
	align-items:center;
	justify-content:center;
}
#about .video-col {
	z-index:0;
	position:absolute;
	top:0;
	left:3dvh;
}
#locations  {

}
.location-text {
	position:relative;
	z-index:10;
	padding:3dvh 0 2dvh 0;
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, .8) 40%, rgba(0, 0, 0, .8) 60%, rgba(0, 0, 0, 0) 75%);
}
.location-text h3 {
	position:relative;
	z-index:10;
	text-align:center;
	text-transform:uppercase;
	font-weight:300;
	margin:0;
	line-height:.95;
}
#video {
	left:-45dvh;
    height:100%;
    width:220dvh;
    position:relative;
    /*width:65dvh;*/
    z-index:0;
}
#video div {
	position:relative;
	z-index:0;
}
.videobox {
	height:100%;
	aspect-ratio:1.78;
}

#locations .videobox {
	position:relative;
	height:100%;
	aspect-ratio:1.78;
}


.videobox .row, .video-col  {
	height:100%;
	}

#locationsvideo {
	height:100%; 
	aspect-ratio:1.48;
}



/*  ABOUT US TEXT  */

.aboutus_txt {
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 80%);
	position: relative;
	z-index: 20;
	height:100%;
    display: flex;
    flex-direction: column;  
    justify-content:center; 
    padding-bottom:6dvh;
}
.aboutus_txt h4 {
	text-align:center;
	}
.aboutus_txt h4, .aboutus_txt p {
	padding:2dvh 8dvh 2dvh 0dvh;
	margin:0;
}


/*  END ABOUT US TEXT  */


/*
#tagline {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:right;
	height:100%;
    padding: 8dvh;
    background-image: url('../img/priano-lobby.jpg');
    background-size: 75%;
	background-position: center right;
	background-repeat: no-repeat;
	width:100dvw;
	position:relative;
}
#tagline h2 {
    font-size:30dvh;
    margin-bottom:0;
    line-height:.9;
    color: #fff;
}
*/



#craftvideo {
	height:100%; 
	aspect-ratio:1.78;
	position:relative;
	z-index:0;
}
.mute {
	height:12dvh;
	width:12dvh;
	position:absolute !important;
	bottom:10dvh;
	left:50%;
	z-index:20 !important;
	opacity:35%;
	margin-left:-6dvh;
	background-image: url('../icons/icon_video_mute.svg');
}
.mute:hover {cursor:pointer;}

/* CONTACT */

#contact {
	width:110dvh;
	position:absolute !important;
	top:0;
	left:120dvh;
	z-index:40 !important;
}
#contact div {
	z-index:40 !important;
}
.contact {
	padding:6dvh 8dvh 8dvh 0;
}
.contactimg {
	text-align:right;
}
.contactimg > img {
	height:24dvh;
	opacity:20%;
	margin-right:-3dvh;
}
.contact-text-box {
	padding-top:4dvh;
}
.contacttext {
	text-align:right;
}
.phonelink a {color:white; text-decoration:none;}
.phonelink a:hover {font-weight:300;}
.social {
	text-align:right;
}
.social-icon {
	opacity:.5;
	width:3dvh;
    padding-bottom:2dvh;
}

.contact-form {
	padding:0 0 0 4dvh;
}
.contact-form label {
	display: block;
	text-transform:uppercase;
	color:#444;
	font-weight:400;
	font-size:1.2dvh;
}
.contact-form input,
.contact-form textarea {
	width: 100%;
	padding: 1dvh;
	margin-bottom: 1.5dvh;
	background-color:#999;
	color:white;
	border:none;
}
.contact-form button {
	display:inline-block;
	margin:0 0 0 2dvh;
	width:25%;
	float:right;
}

/* END CONTACT */




/* LIGHTBOX */

.lightbox {
    display: none;
    position: fixed;
    z-index: 1000;
    padding-top: 1dvh;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
}

.lightbox-img {
    margin: auto;
    margin-top:1dvh;
    display: block;
    height: 88dvh;
    max-width: 80%;
    max-height: 88dvh;
}
.lightbox-description {
	width:100%;
    color: white;
    font-size: 3vh;
    text-align: center;
}
.lightbox-description a {
	text-decoration: none;
	color: #aac670;
}
.lightbox-description a:hover {
	color: #cce29e;
}
.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    color: white;
    font-size: 10dvh;
    font-weight: 100;
    padding: 4dvh;
    margin-top: -10dvh;
    transition: 0.1s ease;
    user-select: none;
    text-decoration:none;
}

.prev {
    left: 0;
}

.next {
    right: 0;
}

.close {
    position: absolute;
    top: 1dvh;
    right: 4dvh;
    color: white;
    font-size: 10dvh;
    font-weight: 100;
    cursor: pointer;
    transition: 0.1s ease;
}

.close:hover, .prev:hover, .next:hover {
    color: #c33;
}


/*  END LIGHTBOX  */


/*  HIDE RECAPTCHA LOGO  */
.grecaptcha-badge { visibility: hidden; } 
.rc-anchor-normal-footer {
    display: none !important;
}
.recaptcha-disclaimer {
	display:inline-block;
	float:left;
	font-size:1.2dvh;
	color:#666;
	width:70%;
	text-align:right;
}
.recaptcha-disclaimer a {
	color:#888;
	text-decoration:none;
}



h1 {font-size:10.6dvh; line-height: 1; letter-spacing:0dvh; margin-bottom:0dvh;}
h2 {font-size:9dvh; line-height: 1.05;}
h3 {font-size:7dvh; line-height: 1.1;}
h4 {font-size:5.8dvh;}
h5 {font-size:4dvh;}
h6 {font-size:3dvh;}
p {font-size:2.2dvh;}



/*  SMALLER SCREENS  */

@media screen and (max-height: 1300px) {
	h2 {font-size:9dvh; margin-bottom:2.1dvh;}
	h3 {font-size:7dvh; margin-bottom:2.1dvh;}
	h4 {font-size:5.8dvh; margin-bottom:2.1dvh;}
	h5 {font-size:4dvh; margin-bottom:2.1dvh;}
	h6 {font-size:3dvh; margin-bottom:2.1dvh;}
	p {font-size:2.2dvh; margin-bottom:2.1dvh;}
}
@media screen and (max-height: 1100px) {
	h2 {font-size:9dvh; margin-bottom:2.4dvh;}
	h3 {font-size:7dvh; margin-bottom:2.4dvh;}
	h4 {font-size:5.8dvh; margin-bottom:2.4dvh;}
	h5 {font-size:4dvh; margin-bottom:2.4dvh;}
	h6 {font-size:3dvh; margin-bottom:2.4dvh;}
	p {font-size:2.2dvh; margin-bottom:2.4dvh;}
	.main-banner-txt p {max-width: 70%;}
}
@media screen and (max-height: 900px) {
	h2 {font-size:9dvh; margin-bottom:2.4dvh;}
	h3 {font-size:7dvh; margin-bottom:2.4dvh;}
	h4 {font-size:6dvh; margin-bottom:2.4dvh;}
	h5 {font-size:5dvh; margin-bottom:2.4dvh;}
	h6 {font-size:4dvh; margin-bottom:2.4dvh;}
	p {font-size:2.5dvh; margin-bottom:3dvh;}
	.btn, .contact-form label {font-size: 2dvh;}
	.social-icon {width:4dvh;}
	.main-banner-txt p {max-width: 80%; }
	.recaptcha-disclaimer {font-size: 1.5dvh;}
}


@media screen and (max-height: 700px) {
	h1 {font-size:19dvh; line-height: .9;}
	h2 {font-size:10dvh; margin-bottom:2.4dvh;}
	h3 {font-size:8dvh; margin-bottom:2.4dvh;}
	h4 {font-size:6dvh; font-weight: 300;}
	h5 {font-size:5dvh; font-weight: 300;}
	h6 {font-size:4dvh; font-weight: 300;}
	p {font-size:2.8dvh; font-weight: 300;}
	.btn {font-size: 2.4dvh; font-weight: 600; padding:2dvh 3dvh 1.7dvh 3dvh; border-radius: 3dvh;	}
	
	.mainmenu {bottom:1.2dvh;}	
	.mainmenu li {font-size: 2.4dvh;}
	.main-banner-txt div {margin: 10dvh 0 0 0;}
	.main-banner-txt p {max-width: 100%;}
	.scroll-container {height: 92.3dvh;}

	.slide:nth-child(1) {background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_priano.webp');}
	.slide:nth-child(2) {background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_artistry.webp');}
	.slide:nth-child(3) {background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_kolter.webp');}
	.slide:nth-child(4) {background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 1) 98%), url('../img/mainslide_springhaven.webp');}

	.whitesection {flex: 0 0 180%;max-width: 360dvh;}
	.section .row {margin:0;}
	.biztitle {order:1; height:20%; width:38%; max-width: 38%; align-content:center;padding:0;}
	.bizlearnmore {order:2; height:20%;width:58%; max-width: 58%; align-content:center;padding:0;}
	.biztext p {width:90%;}
	.biztext {order:3; height:80%; width:31%; max-width: 31%;padding:0;}
	.gallerybox {order:4; height:80%; width:65%; max-width: 65%;}
	.bizlearnmore  h5 {display:inline; width:auto;}
	.navbtn {display:inline; margin-left: 1.5dvh; position:relative; top:-.75dvh;}
	.gallerypic:hover div {margin-top:-2%;}

	.aboutus_txt {}
	.aboutus_txt h4, .aboutus_txt p {padding:2dvh 8dvh 2dvh 6dvh;}

	.quote {aspect-ratio: 3.4;}
	.quote:nth-child(1), .quote:nth-child(7) {font-size:.75dvh;}
	.quote:nth-child(2), .quote:nth-child(6) {font-size:1.5dvh;}
	.quote:nth-child(3), .quote:nth-child(5) {font-size:3dvh;}
	.quote:nth-child(4) {font-size:6dvh;}

	#contact {width: 160dvh;left: 120dvh;}
	.contact {padding: 2dvh 8dvh 4dvh 0;}
	.contact-text-box {padding-top: 0dvh;}
	.contact-form input {padding-bottom:0dvh;}
	.contact-form label {font-size: 2.4dvh; font-weight: 600; color:#666;}
	#message {height:12dvh;margin-bottom:0;}
	.social-icon {width:5dvh;}	
	.recaptcha-disclaimer {font-size: 1.8dvh;}
	
	@keyframes moveShrinkLogo {
    to {
        height: 18dvh;
        left: 1dvh;
        bottom: 1.45dvh;
        top: auto;
        transform: translate(0, 0);
    	}
	}
	@keyframes moveShrinkBlock {
    to {
        width: 100%;
        height: 7.7dvh;
        left: 0;
        bottom: 0;
    	}
	}
	@keyframes ShrinkBox {to {height: 7.7dvh;}}
	
	.slantbar {background-position-x: 20dvh;}
	.slantbar2 {background-position-x: 0dvh;}
	.slantbar3 {background-position-x: -30dvh;}
	@keyframes slantbar {
	  0%   { background-position-x: 20dvh; }
	  50%  { background-position-x: 0dvh; }
	  100% { background-position-x: 20dvh; }
	}
	@keyframes slantbar2 {
	  0%   { background-position-x: -5dvh; }
	  50%  { background-position-x: 15dvh; }
	  100% { background-position-x: -5dvh; }
	}
	@keyframes slantbar3 {
	  0%   { background-position-x: -10dvh; }
	  50%  { background-position-x: -30dvh; }
	  100% { background-position-x: -10dvh; }
	}
	
	.banner-title h1:nth-child(2) {right:-35dvh;}
	@keyframes BannerText {
		0% {right:-35dvh; }
		5% {right: 1dvh;}
		45% {right: 1dvh;}
		50% {right:-35dvh;}
		100% {right:-35dvh;}
	}
	

	
}

@media screen and (max-height: 500px) {	
	h1 {font-size:19dvh;}
	h2 {font-size:12dvh;}
	h3 {font-size:11dvh;}
	h4 {font-size:7.5dvh;}
	h5 {font-size:6.5dvh;}
	h6 {font-size:5.5dvh;}
	p {font-size:3.3dvh; font-weight: 400;}
	.btn, .mainmenu li, .contact-form label {font-size: 2.8dvh;}
	.recaptcha-disclaimer {font-size: 2.1dvh;}	
}



@media screen and (max-aspect-ratio: 2.15) {	
	.aspect {transform:scale(.95,.95); transform-origin: 0 0;}
	.keep-width {max-width: 105% !important; width: 105% !important;}
	.stay-right {transform-origin: 100% 0;}
	.main-banner-txt {padding-left:3.5dvh; padding-right:3.5dvh;}	
}
@media screen and (max-aspect-ratio: 1.75) {	
	.aspect {transform:scale(.90,.90);}
	.keep-width {max-width: 111% !important; width: 111% !important;}
	.main-banner-txt {padding-left:3dvh; padding-right:3dvh;}
}
@media screen and (max-aspect-ratio: 1.45) {	
	.aspect {transform:scale(.85,.85);}
	.keep-width {max-width: 118% !important; width: 118% !important;}
	.main-banner-txt {padding-left:2.5dvh; padding-right:2.5dvh;}
}

@media screen and (min-height: 701px) {	
	@media screen and (min-aspect-ratio: 2.16) {	
		/*.section {flex: 0 0 85%; max-width:200dvh;}*/
		.whitesection {flex: 0 0 80%;max-width: 200dvh;}
	}
	@media screen and (max-aspect-ratio: 2.15) {	
		/*.section {flex: 0 0 100%; max-width:215dvh;}*/
		.whitesection {flex: 0 0 100%;max-width: 215dvh;}
	}
	@media screen and (max-aspect-ratio: 1.75) {	
		/*.section {flex: 0 0 108%; max-width:215dvh;}	*/
		.whitesection {flex: 0 0 115%;max-width: 230dvh;}
		.aboutus_txt {padding-left:10dvw !important;}
		#about {flex: 0 0 170%;max-width:340dvh;}
	}
	@media screen and (max-aspect-ratio: 1.45) {	
		/*.section {flex: 0 0 116%; max-width:230dvh;}*/
		.whitesection {flex: 0 0 150%;max-width: 300dvh;}
		.aboutus_txt {padding-left:20dvw !important;}
		#about {flex: 0 0 185%;max-width:370dvh;}
	}
}

