/* FONTS (via fonts.com)
	font-family: futura-pt
	font-family: futura-pt-bold
*/



/* VARIABLES */

:root {
  --default-font: "futura-pt";
  --default-font-size: 40px;
  --default-input-font-size: 14px;

  --col-primary: #123865;
  --col-primary-rgb: 0,0,0;

  --col-accent: #000;
  --col-accent-rgb: 0, 0, 0;

  --col-text: #000;
  --col-input: #000;
  --col-placeholder: #c0c0c0;
  --col-input-bg: #fff;

  --col-button: #fff;
  --col-button-rgb: 255, 255, 255;

  --col-link: #000;
  --col-link-rgb: 0,0,0;

  --col-link-hover: #000000;
  --col-link-hover-rgb: 0, 0, 0;

  --col-error: #ff6633;
  --col-error-rgb: 255, 51, 0;

  --col-attention: #ff6633;
  --col-attention-rgb: 255, 51, 0;

  --col-warning: #f5b00e;
  --col-warning-rgb: 245, 176, 14;

  --col-missing: #ff6633;
  --col-missing-rgb: 255, 51, 0;

  --col-burger: #123865;

  --col-border: #707070;
  --col-border-rgb: 112, 112, 112;

  --dim-site-width: 1440px;
  --dim-default-space: 100px;
  --dim-input-height: 49px;

  --grid-spacing: 45px;
  --grid-spacing-neg: -45px;
  --grid-spacing-2x: 90px;
  --grid-margin: 50px;
  --grid-margin-neg: -50px;

    --vh: 1vh;
}

/* theme */

body { font-weight: 400; }

/*CORE HTML*/
p { margin-bottom: 60px}
p.short  { max-width: 1060px; }
p.shorter  { max-width: 740px; }
p.large { }
p.larger {}
a { }
p a { font-weight: 500; text-decoration: underline}
b, strong { font-weight: normal; font-family:"futura-pt-bold"; }

h1, h2, h3, h4, h5, h6 { text-align: left; color: var(--col-primary)}
h1 { font-weight: 300; font-size: 100px; text-transform: uppercase; line-height: 1; margin-bottom: 60px;  }
h2 { font-weight: 300; font-size: 80px; text-transform: uppercase; line-height: 1; margin-bottom: 20px;  }
h3 { font-weight: 300; font-size: 60px; text-transform: uppercase; line-height: 1.33; margin-bottom: 60px;   }
h4 { font-weight: 600; font-size: 50px; text-transform: uppercase; line-height: 1.33; margin-bottom: 60px;   }
h1 + h4 { margin-top: -40px;}


/*CONTAINERS*/
article { padding-left: 190px; padding-top: 240px; margin-bottom: 80px;}
article#home { padding-left: 0px; padding-top: 0px; margin-bottom: 0}
section.full {max-width: 1920px; }
section { margin: 0 auto; padding: 0 130px; max-width: 1670px}

section.masthead { position: relative; z-index: 2;}

/*BUTTONS*/
a.btn { color: #000; position: relative; padding-right: 30px; background: url(/img/svg/arrow.svg) no-repeat right center; background-size: 8px 16px; font-size: 15px; font-family:"VisueltBold"; margin: 0 auto 0 0; text-transform: uppercase; letter-spacing: 1px}
a.btn2 { line-height: 54px; background: var(--col-primary); color: #fff; padding: 0 35px; font-size: 20px; font-weight: 500; text-transform: uppercase; text-align: left; display: inline-block; }
div.buttons { display: block; text-align: center; margin: 0 auto 20px;}
div.buttons a.btn2 { margin: 0 2px}

/*CAPTIONS*/
div.caption-masthead { bottom: 80px; left: 0; text-align: left; padding: 100px 20px 0px 80px}
div.caption-masthead * { color: #fff}
div.caption-masthead p { max-width: 580px; margin: 0 auto 0 0; font-size: 24px}
/*div.caption-shadow { background: url(/img/svg/mask3.png) repeat-x left bottom; background-size: contain;}*/

/*COLOURS*/
.b-blue { background-color: rgba(27, 171, 193, .33)}


*::-webkit-input-placeholder {  line-height: var(--dim-input-height);  color: var(--col-placeholder); font-size: var(--default-input-font-size); font-family: var(--default-font); text-transform: uppercase; letter-spacing: 2px; font-family:"VisueltBold";}
*::-moz-placeholder {  line-height: var(--dim-input-height);  color: var(--col-placeholder); font-size: var(--default-input-font-size); font-family: var(--default-font); text-transform: uppercase; letter-spacing: 2px; font-family:"VisueltBold";}
*:-ms-input-placeholder {  line-height: var(--dim-input-height);  color: var(--col-placeholder); font-size: var(--default-input-font-size); font-family: var(--default-font); text-transform: uppercase; letter-spacing: 2px; font-family:"VisueltBold";}


header { width: 190px; position: fixed; top: 0; left: 0; height: 100%; background: #fff; border-right: 1px solid #707070}
header div.logo { width: 100%; padding: 30px 30px; background: #fff; border-bottom: 1px solid #707070; transition: all .3s ease-in}
header.attached div.logo { width: 100%; padding-left: 15px;padding-right: 15px; border-right: 0px solid #707070}
header div.logo img { width: 100%; display: block; margin: 0 auto;}
header nav { left: -500px; opacity: 0; display: block; width: 500px; background: var(--col-primary); position: fixed; top: 190px; z-index: 5; padding: 60px 50px 160px; min-height: 680px; max-height: calc(100vh - 220px); transition: all .3s ease-in}
/*header nav { left: 0px; opacity: 1; }*/
header.active nav { left: 0px; opacity: 1; }
header nav ul li a { color: #fff; font-size: 26px; font-weight: 400; line-height: 40px; padding-left: 0px; position: relative; text-transform: uppercase; display: block; cursor: pointer;}
header nav ul li.subnav > a { padding-left: 40px; }
header nav ul li a:hover { color: #ccc; }
header nav > ul > li.subnav > a:before { content:""; left:0; top: 0; height: 40px; width: 20px; background: url(/img/svg/plus.svg) no-repeat center center; background-size: contain; position: absolute;}
header nav ul > li.open > a:before { background-image: url(/img/svg/minus.svg);}
header nav ul li ul li a { font-size: 26px; font-weight: 400; line-height: 50px; padding-left: 40px; position: relative; transition: all .2s linear}
header nav ul li ul li a:hover { font-weight: 500; }
header nav ul li ul { max-height: 0; overflow: hidden; opacity: 0; transition: all .2s linear}
header nav ul li.open ul { max-height: 400px; opacity: 1; overflow: auto; min-height: 100px;}
header a.open-menu { position: fixed; top: 570px; left: 68px; transform: rotate(-90deg); transform-origin: 0 0; font-size: 44px; font-weight: 400; color: var(--col-primary); padding-right: 60px; text-transform: uppercase;}
header a.open-menu:after { content:""; display: block; position: absolute; right: 0; top: 0;width: 20px; height: 100%; background: url(/img/svg/arrow.svg) no-repeat center center; background-size: contain; transform: rotate(90deg);}
header nav a.toggle-menu { position: absolute; bottom: 10px; left: 50px; padding-left: 40px; line-height: 70px; color: #fff; font-size: 30px; text-transform: uppercase; font-weight: 400}
header nav a.toggle-menu:before {content:"";  position: absolute; left:0; top: 0; height: 70px; background: url(/img/svg/arrow-white.svg) no-repeat center center; background-size: contain; width: 30px; }
div.quick-links { position: absolute; bottom: 0; left: 0; width: 100%; }
div.quick-links a { display: block; width: 100%; font-size: 20px; color: var(--col-primary); font-weight: 600; text-transform: uppercase; text-decoration: underline; text-align: center; padding-bottom: 40px; border-top: 1px solid #707070; padding-top: 30px; transition: all .2s linear}
div.quick-links a:hover { background-color: var(--col-primary); color: #fff; }
div.quick-links a:before { content:""; display: block; width: 100%; width: 60px; height: 60px; margin: 0 auto 20px; background: url() no-repeat center center; background-size: contain;}
div.quick-links a.siteplan:before { background-image: url(/img/svg/grid.svg);}
div.quick-links a.visit:before { background-image: url(/img/svg/calendar.svg);}
div.quick-links a.contact:before { background-image: url(/img/svg/contact.svg);}
div.quick-links a.siteplan:hover:before { background-image: url(/img/svg/calendar-white.svg);}
div.quick-links a.visit:hover:before { background-image: url(/img/svg/grid-white.svg);}
div.quick-links a.contact:hover:before { background-image: url(/img/svg/contact-white.svg);}
div.quick-links a.move-now:before { display: none;}
div.quick-links a.move-now:hover { background: #fff;}

footer { padding: 0px 0 0px 190px; }
footer section { text-align: left; width: 100%;  padding: 40px 20px 40px 140px; margin: 0 auto}
div.first-row {font-size: 0}
div.first-row > * { display: inline-block; vertical-align: top; }
div.first-row > a {width: 280px; margin-right: 100px}
div.first-row > div {width: 1320px; max-width: calc(100% - 380px); text-align: center; margin: 0 auto 0 0; text-align: left;}
div.first-row > div > div {font-size: 24px; display: inline-block; max-width: 25%; vertical-align: top; text-align: left; padding: 0 20px;}
div.first-row > div > div strong {font-weight: 500; font-family: futura-pt; display: block; margin-bottom: 5px; text-transform: uppercase;}
div.first-row > div > div a {line-height: 40px; color: #000; display: block;}
footer div.disclaimer { padding-top: 70px; text-align: left;}
footer div.disclaimer p { font-size: 18px; font-weight: 400; color: #000}
footer div.disclaimer p a { font-size: 18px; font-weight: 400; color: #000; text-decoration: underline;}

section.full-screen { display: block; width: 100vw; height: 100vh; background: url() no-repeat center center; background-size: cover; margin: 0; padding: 0; max-width: 100vw; overflow: hidden;}
section.full-screen > div:not(.promo) { display: block; width: 100%; position: absolute; left: 0; bottom: 0; padding: 0 70px 210px 260px; text-align: left;}
section.full-screen > div.iframe { padding: 0!important; top: 0; left: 0; padding-bottom: 0!important}
section.full-screen > div.iframe:after { content:""; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: transparent;}
section.full-screen > div.type2 { padding-bottom: 140px;}
section.full-screen div.title { font-size: 250px; color: #fff; font-weight: 300; margin-bottom: 0; line-height: 0.9; text-transform: uppercase;}
section.full-screen div.subtitle { font-size: 60px; color: #fff; font-weight: 400; margin-bottom: 40px; line-height: 1; text-transform: uppercase;}
section.full-screen div.inner-nav { font-size: 0px; text-align: left; display: block}
section.full-screen div.inner-nav a { font-size: 30px; padding: 0 35px; line-height: 100px; background: #fff; color: var(--col-primary); font-weight: 600; text-transform: uppercase; display: inline-block; vertical-align: top; border-right: 1px solid #707070}
section.full-screen div.type2 div.inner-nav a, section.full-screen div.inner-nav a:last-child {border-right: 0}
section.full-screen div.type2 div.inner-nav a { line-height: 80px; background: transparent; color: #fff; padding: 0 60px 0 20px;}

div.iframe.max-1000{
	max-width:1000px;
	padding-bottom: min(563px, 56.25%);
}

#slide1 { background: var(--col-primary); }
#slide2 { background-image: url(/img/home/2.jpg);}
#slide3 { background-image: url(/img/home/3.jpg);}
#slide4 { background-image: url(/img/home/4.jpg);}

div.image { margin: 50px auto; position: relative}
div.image > img { display: block; width: 100%;}
div.image div.caption { bottom: 30px; left: 30px; text-align: left; color: #fff; font-size: 80px; font-weight: 300; text-transform: uppercase;}

div.model-slideshow { display: block; width: 100%; padding-bottom: 40px}
div.model-slideshow div.image { margin: 0 auto !important}

div.grid-1a > div { width: 35%}
div.grid-1a > div:first-child { width: 65%; padding-right: 100px;}
div.grid-1b > div { width: 64%}
div.grid-1b > div:first-child { width: 36%; padding-right: 80px;}
div.grid-1c > div { width: 50%}
div.grid-1c > div:first-child { width: 50%; padding-right: 80px;}

div.area-feature { margin: 77px auto;}
div.area-feature div.slick-slide { padding: 10px}
div.area-feature div.caption { bottom: 30px; left: 30px; color: #fff; font-size: 40px; font-weight: 300; text-align: left; text-transform:uppercase;}

.ralign img { margin: 0 0 0 auto; display: block; }

div.siteplan { position: relative;}
a.download  { display: block; width: 190px;  font-size: 20px; color: var(--col-primary); font-weight: 600; text-transform: uppercase; text-decoration: underline; text-align: center; padding: 30px 25px; border: 1px solid #707070; position: absolute; left: 0; top: 0}
a.download:before { content:""; display: block; width: 100%; width: 35px; height: 50px; margin: 0 auto 20px; background: url(/img/svg/arrow.svg) no-repeat center center; background-size: contain; transform: rotate(90deg);}
a.enlarge {position: absolute; right: 20px; top: 20px; }

div.contact-info { margin-bottom: 80px}
div.field { margin-bottom: 40px}
div.field label { display: block; font-size: 40px; font-weight: 600; text-transform: uppercase; margin-bottom: 20px}
div.splitter.s50_50 > div, div.splitter.split-2 > div { padding-right: 20px;}
input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"]  { line-height: 90px; font-size: 40px; min-height: 90px;}
textarea  { font-size: 40px; height: 200px}
div.registration { margin-top: 40px}
button[type="submit"], button[type="button"] { line-height: 90px; font-size: 40px; font-weight: 500; color:#fff; background-color: var(--col-primary); padding: 0 70px}

.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 90px; font-size: 24px; text-transform: none;}
.select2-results__option { font-size: 24px; text-transform: none;}

div.reveal-response p { font-size: 40px; text-align: left; font-weight: 600;}

div.iframe + p { margin-top: 50px;}
div.iframe + h2 { margin-top: 50px;}
div.iframe + div { margin-top: 50px;}
div.iframe + div.promo { margin-top: 0px;}
div.with-play  { cursor: pointer;}
div.with-play img { display: block; width: 100%;}
div.with-play.active img { display: none; }
div.with-play iframe { display: none; }
div.with-play.active iframe { display: block; }
div.with-play:after { content:""; display: block; bottom: 50px; left: 50px; position: absolute; width: 187px; height: 60px; background: url(/img/svg/play.svg) no-repeat center center; background-size: contain;}
div.with-play.active:after { display: none}

#mortgage-calc { font-size: 24px;}
#mortgage-calc select { min-height: 0}
#mortgage-calc div.calc-social-icons  { display: none !important}

div.models { margin: 0 auto 100px}
div.tr div { display: inline-block; font-size: 20px; vertical-align: middle; color: #000;}
div.th { padding: 10px 0px; text-align: center; font-weight: 500; text-transform: uppercase;}
div.th:nth-child(1) { width: 203px; }
div.th:nth-child(2) { width: calc(100% - 773px); text-align: left; padding-left: 20px }
div.th:nth-child(3) { width: 120px; text-align: left;}
div.th:nth-child(4) { width: 180px; }
div.th:nth-child(5) { width: 120px; }
div.th:nth-child(6) { width: 150px; text-align: right;}
/*div.td { padding: 10px 10px; text-align: center; font-weight: 400}*/
/*div.tr > div:nth-child(1) { text-align: left; width: calc(100% - 580px);}*/
/*div.tr > div:nth-child(2) { width: 200px;}*/
/*div.tr > div:nth-child(3) { width: 140px;}*/
/*div.tr > div:nth-child(4) { text-align: right; width: 240px;}*/
/*div.tr > div:nth-child(5) { text-align: right; width: 120px;}*/
/*div.tr > div:nth-child(1) img { display: block; width: 100%;}*/

div.model-row { display: block; width: 100%; font-size: 0; margin-bottom: 30px; border-bottom: 1px solid #eee}
div.model-row > div { display: inline-block; vertical-align: top;}
div.model-row > div.tr { display: block; width: 100%; }
div.tr { display: block; font-size: 0; border-bottom: 1px solid #eee;}
div.elevations { position: relative;}
div.elevations svg { position: absolute; left: -22px}
div.elevations > div.tr { border-bottom: 0px; padding: 10px 0}
div.elevations > div.tr:nth-child(even) { background-color: #eee;}
div.model-row > div.model-image { width: 203px;}
div.model-row > div.model-image img { display: block}
div.model-row > div.model-name { width: calc(100% - 773px); padding-left: 20px; padding-right: 20px; font-size: 28px; color: #000; padding-top: 15px}
div.model-row > div.elevations { width: 570px; }
div.model-row > div.elevations div.tr div.td { font-size: 18px; text-align: center;}
div.model-row > div.elevations div.tr div.td:nth-child(1) { width: 120px; text-align: left;}
div.model-row > div.elevations div.tr div.td:nth-child(2) { width: 180px; }
div.model-row > div.elevations div.tr div.td:nth-child(3) { width: 120px; }
div.model-row > div.elevations div.tr div.td:nth-child(4) { width: 150px; text-align: right;}
div.model-row a.view-pdf { font-size: 14px; display: block; margin: 20px auto 0 0; font-weight: 500; text-decoration: underline; text-decoration-style: dotted;}


button.slick-arrow { font-size: 0 !important; margin: 0 !important; padding: 0 !important; line-height: 0 !important;  width: 30px; height: 60px; background: url(/lib/img/dark/arrow-right.svg) transparent no-repeat center center; background-size: contain; }
button.slick-arrow.slick-next { left: auto; right: -55px}
button.slick-arrow.slick-prev { left: -60px}

div.footnote { margin-top: 30px}
div.footnote p {font-size: 18px; line-height: 1.5;}

		div.contact-info { margin-bottom: 60px}
		div.field { margin-bottom: 20px}
		div.field label { font-size: 24px; margin-bottom: 10px}
		div.splitter.s50_50 > div, div.splitter.split-2 > div { padding-right: 10px;}
		input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"]  { line-height: 50px; font-size: 24px; min-height: 50px;}
		textarea  { font-size: 24px; }
		div.registration { margin-top: 30px}
		button[type="submit"], button[type="button"] { line-height: 60px; font-size: 24px; padding: 0 40px}
		.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 50px; font-size: 18px; text-transform: none;}
		.select2-results__option { font-size: 18px; text-transform: none;}

		img.siteplan-icon { width: 140px;}

		div.reveal-response p { font-size: 24px; text-align: left; font-weight: 600;}

		div.emergency-form { display: none;}
		div.emergency-form.active { display: block;}

		div.radios { margin-top: 10px;}
		div.radios > label { display: inline-block; width: auto; margin-right: 40px}
		div.radio label:before { top: 5px;}
		div.radio label:after { top: 8px; }
		div.radio input[type=radio]:checked + label:after { border-color: #ccc;}

div.covid-protocols { display: block; font-size: 0; width: calc(100% + 80px); margin-left: -40px; margin-bottom: 150px; margin-top: 50px;}
div.covid-protocols > div { display: inline-block; vertical-align:top; width: 50%; padding: 0 40px 0 190px; font-size: 40px; position: relative; margin-bottom: 50px; line-height: 1.2;}
div.covid-protocols > div:before {content:""; left: 40px; top: 0; height: 100%; background: url() no-repeat center center; background-size: contain; position: absolute; display: block;}
div.covid-protocols > div.covid-calendar:before {background-image: url(/img/contact/calendar.svg); width: 85px;}
div.covid-protocols > div.covid-user:before {background-image: url(/img/contact/people.svg); width: 95px;}
div.covid-protocols > div.covid-mask:before {background-image: url(/img/contact/mask.svg); width: 115px;}
div.covid-protocols > div.covid-sanitizer:before {background-image: url(/img/contact/sanitize.svg); width: 95px;}
div.covid-protocols > div.covid-washroom:before {background-image: url(/img/contact/gender.svg); width: 97px;}
div.covid-protocols > div.covid-surface:before {background-image: url(/img/contact/wipe.svg); width: 100px;}
div.covid-protocols > div.covid-paper:before {background-image: url(/img/contact/paperless.svg); width: 83px;}

div.book-appt { margin-bottom: 150px}

div.grid-sales-address{ margin-top: 0px}
div.grid-sales-address > div { vertical-align: top !important}
div.grid-sales-address > div div.image { padding: 0; margin: 0}
div.grid-sales-address > div:first-child { width: 400px; }
div.grid-sales-address > div:last-child { width: calc(100% - 400px); padding-left: 100px}

a.enable-sound { position: absolute; bottom: 20px; right: 20px; z-index: 4; transition: top .2s linear; background-color: #fff; color: var(--col-primary); font-size: 24px; width: 180px; padding: 10px; padding-left: 42px; }
a.enable-sound:after { content:" TURN ON SOUND"; color:  var(--col-primary); font-size: 16px; line-height: 24px; position: relative; top: -4px; font-weight: 500;}
a.enable-sound svg  { position: absolute; left: 8px; top: 9px}
a.enable-sound svg:last-child { display: none;}
a.enable-sound.active svg:last-child { display: block;}
a.enable-sound.active svg:first-child { display: none;}
a.enable-sound.active:after { content: " TURN OFF SOUND"; }

p.big-disclaimer { background: var(--col-primary); color: #fff; padding: 20px; font-size: 16px;}

div.promo { position: absolute; top: 0; right: 0; padding:25px; background: #fff; width: 810px; max-width: 40%}
div.promo-body { display: flex; width: 100%; gap: 40px; justify-content: space-between;}
div.promo-body > div { width: 50%; text-align: left;}
div.promo-body > div:last-child { padding-top: 65px;}
div.promo-body img { display: block; width: 100%;}
div.promo-body div.title {font-size: 60px; font-weight: 300; color: var(--col-primary); display: block; margin-bottom: 10px;}
div.promo-body div.subtitle {font-size: 30px; font-weight: 500; color: var(--col-primary); display: block; margin-bottom: 30px;}
div.promo-body p {font-size: 24px; font-weight: 400; color: var(--col-primary); }
#toggle-promo { display: block; position: absolute; right: 30px; top: 25px; height: 26px;  padding-left: 30px; text-align: left;}
#toggle-promo:after { content:"CLOSE"; color: var(--col-primary); font-size: 20px; line-height: 26px; font-weight: 400; display: block; }
#toggle-promo:before { content:""; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 24px; background: url(/img/svg/arrow.svg) no-repeat left center; background-size: contain; transform: rotate(270deg);}
div.promo.closed  { padding: 20px; }
div.promo.closed div.promo-body { padding: 0px; padding-right: 200px}
div.promo.closed div.promo-body > div { width: 100%;}
div.promo.closed div.promo-body p, div.promo.closed div.promo-body a { display: none;}
div.promo.closed div.promo-body > div:last-child { display: flex; gap: 10px; justify-items: flex-start; padding: 0}
div.promo.closed div.promo-body > div:first-child { display: none;}
div.promo.closed div.promo-body div.title {font-size: 30px; font-weight: 500; margin-bottom: 0px;}
div.promo.closed div.promo-body div.subtitle {font-size: 30px; font-weight: 300; margin-bottom: 0px;}
div.promo.closed #toggle-promo:after { content:"OPEN"; }
div.promo.closed #toggle-promo:before { transform: rotate(90deg);}

div.promo-popup { display: block; width: 100%; max-width: 980px; position: relative; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); padding: 0 20px}
div.promo-popup img { display: block; width: 100%; margin: 0 auto; max-width: 980px; }
div.promo-popup a.close-overlay2 { display: block; width: 25px; height: 25px; position: absolute; top: 15px; right: 35px; z-index: 2; }

div.tooltip { display: none; position: fixed; top: 0; left: 0; background: var(--col-primary); color: #fff; font-size: 16px; padding: 30px; width: 400px; max-width: 100%; z-index: 10}
div.tooltip > div { display: block; color: #fff; font-size: 18px; width: 100%; line-height: 1.4;}
div.tooltip > div p { color: #fff; font-size: 18px; line-height: 1.4; margin-bottom: 30px}
div.tooltip > div p:last-child { margin-bottom: 0px}
div.tooltip.active { display: block; }
a.close-tooltip { position: absolute; right: 10px; top: 10px; width: 10px; display: block; z-index: 3;}

div.testimonials { display: flex; margin: 0 auto 80px; justify-content: flex-start; flex-direction: column; gap: 55px;}
div.testimonial { display: flex; padding: 70px 85px; background: var(--col-primary); justify-content: space-between; align-items: flex-end; gap: 0px; position: relative;}
div.testimonial:after{ content:""; position: absolute; width: 77px; height: 83px; top: 70px; left: 85px; display: block; background: url(/img/svg/quote.svg) no-repeat center center; background-size: contain;}
div.testimonial > div { width: 60%;}
div.testimonial > div:first-child { width: 40%; padding-right: 40px;}
div.testimonial * { color: #fff !important;}
div.testimonial div.title {font-size: 60px; font-weight: 300; margin-bottom: 0; text-transform: uppercase;}
div.testimonial div.address {font-size: 30px; font-weight: 600; margin-bottom: 0; text-transform: uppercase;}
div.testimonial p {font-size: 24px; font-weight: 300; margin-bottom: 60px}
div.rating { display: flex; gap: 25px; justify-content: flex-start; }
div.rating img { display: block;width: 42px;}

div.testimonials-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: 0; row-gap: 20px; overflow: visible; padding-bottom: 40px}
div.testimonials-list > div { overflow: visible}
div.testimonials-list > div > span { font-size: 30px; color: #000; font-weight: 300; cursor: pointer; text-decoration: underline;}
div.testimonial-popup { display: none; padding: 50px 50px; background: var(--col-primary); position: absolute; width: 700px; max-width: calc(50vw - 140px);}
.active div.testimonial-popup { display: block; z-index: 3; top: -100px;}
.active span { color: var(--col-primary) !important; font-weight: 700 !important }
triangle { content:""; width: 0px; height: 0px; border-style: solid; border-width: 28px 52px 28px 0;    border-color: transparent var(--col-primary) transparent transparent; position: absolute; display: none; }
.active triangle { left: -81px; display: block; top: -10px;}
.active.leftside triangle { left: 880px; border-width: 28px 0 28px 52px ;    border-color: transparent  transparent transparent var(--col-primary); }
div.testimonial-popup * { color: #fff !important;}
div.testimonial-popup p {font-size: 28px; font-weight: 300; margin-bottom: 40px}
div.testimonial-popup >img {display: block; margin: 0 auto 40px 0; width: 60px;}
div.testimonial-popup div.rating { gap: 20px; }
div.testimonial-popup div.rating img { width: 32px;}

div.promobar {background: var(--col-primary); color: #fff; position: absolute; left: 190px; top: 0; padding: 25px 20px 0; width: calc(100% - 190px); text-align: center; height: 118px; display: none !important;}
div.promobar p { color:#fff; margin: 0 auto; text-align: center; }
div.promobar p small { font-size: .5em}

@media only screen and (max-width: 1920px), (max-height: 1300px) {

		section.full-screen div.title { font-size: 160px; }
		section.full-screen div.subtitle { font-size: 40px; }
		section.full-screen > div:not(.promo) { padding-bottom: 60px;}
		section.full-screen > div.type2 { padding-bottom: 40px;}
		section.full-screen div.inner-nav a { font-size: 24px; padding: 0 30px; line-height: 60px; }
		section.full-screen div.type2 div.inner-nav a { line-height: 50px; padding: 0 40px 0 20px;}

		p { margin-bottom: 40px; font-size: 24px}
		h1 { font-size: 80px; margin-bottom: 50px;  }
		h2 { font-size: 60px; margin-bottom: 20px;  }
		h3 { font-size: 48px; margin-bottom: 50px;   }
		h4 { font-size: 40px; margin-bottom: 50px;   }
		h1 + h4 { margin-top: -30px;}

		article { padding-left: 140px; padding-top: 200px; margin-bottom: 50px;}
		article#home { padding-left: 0px; padding-top: 0px; margin-bottom: 0}

		section { padding: 0 70px; max-width: 1300px;}
		header { width: 140px; }
		header div.logo { padding: 30px 20px; }
		
		header nav { top: 100px; padding: 60px 50px 160px; min-height: 0px; max-height: calc(100vh - 100px); }

/*		header nav ul li a { font-size: 24px; line-height: 50px; padding-left: 30px; }*/
/*		header nav > ul > li > a:before { height: 50px; }*/
/*		header nav ul li ul li a { font-size: 18px; line-height: 40px; padding-left: 30px; }*/
		header a.open-menu { top: 400px; left: 53px; font-size: 27px; padding-right: 60px; }
		header nav a.toggle-menu { bottom: 40px; left: 50px; padding-left: 40px; line-height: 50px; font-size: 24px; }
		header nav a.toggle-menu:before {height: 50px; width: 24px; }
		div.quick-links a { font-size: 16px; padding-bottom: 25px; padding-top: 20px; }
		div.quick-links a:before { width: 40px; height: 40px; margin: 0 auto 20px; }

		footer { padding: 0px 0 0px 140px; }
		footer section { padding: 40px 20px 40px 70px; }
		div.first-row > a {width: 200px; margin-right: 100px}
		div.first-row > div {width: calc(100% - 300px); max-width: 100%;}
		div.first-row > div > div {font-size: 18px; padding: 0 40px 0 0;}
		div.first-row > div > div a {line-height: 30px; }
		footer div.disclaimer { padding-top: 50px; }
		footer div.disclaimer p, footer div.disclaimer p a { font-size: 14px; }

		section.full-screen > div:not(.promo) { padding-left: 190px}

		div.image { margin: 50px auto; }
		div.image div.caption { bottom: 20px; left: 20px; font-size: 24px;}

		div.grid-1a > div:first-child { padding-right: 60px;}
		div.grid-1b > div:first-child { padding-right: 50px;}
		div.grid-1c > div:first-child { padding-right: 40px;}

		div.area-feature { margin: 60px auto;}
		div.area-feature div.slick-slide { padding: 5px}
		div.area-feature div.caption { bottom: 20px; left: 20px; font-size: 24px; }

		a.download  { width: 140px;  font-size: 18px; padding: 20px 20px; }
		a.download:before { width: 30px; height: 40px; }

		div.contact-info { margin-bottom: 60px}
		div.field { margin-bottom: 20px}
		div.field label { font-size: 24px; margin-bottom: 10px}
		div.splitter.s50_50 > div, div.splitter.split-2 > div { padding-right: 10px;}
		input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"]  { line-height: 50px; font-size: 24px; min-height: 50px;}
		textarea  { font-size: 24px; }
		div.registration { margin-top: 30px}
		button[type="submit"], button[type="button"] { line-height: 60px; font-size: 24px; padding: 0 40px}
		.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 50px; font-size: 18px; text-transform: none;}
		.select2-results__option { font-size: 18px; text-transform: none;}

		img.siteplan-icon { width: 140px;}

		div.reveal-response p { font-size: 24px; text-align: left; font-weight: 600;}

		div.covid-protocols > div {padding: 0 40px 0 110px; font-size: 24px; margin-bottom: 30px; line-height: 1.33;}
		div.covid-protocols > div:before { left: 20px; height: 32px;}
		div.covid-protocols > div.covid-calendar:before {width: 84px; }
		div.covid-protocols > div.covid-user:before {width: 70px;}
		div.covid-protocols > div.covid-mask:before {width: 80px; height: 22px}
		div.covid-protocols > div.covid-sanitizer:before {width: 70px;}
		div.covid-protocols > div.covid-washroom:before {width: 80px;}
		div.covid-protocols > div.covid-surface:before {width: 72px;}
		div.covid-protocols > div.covid-paper:before {width: 80px; }

		div.promo { padding:20px; max-width: 50%; gap: 30px; width: 720px;}
		div.promo-body > div { width: 40%;}
		div.promo-body > div:last-child { width: 60%}
		div.promo-body div.title {font-size: 48px; margin-bottom: 10px;}
		div.promo-body div.subtitle {font-size: 26px; margin-bottom: 25px;}
		div.promo-body p {font-size: 20px; }
		#toggle-promo { right: 20px; top: 20px; height: 24px;  padding-left: 28px; }
		#toggle-promo:after { font-size: 18px; line-height: 24px; }
		#toggle-promo:before { width: 20px; }
		div.promo.closed  { padding: 20px; }
		div.promo.closed div.promo-body { padding: 0px; padding-right: 200px}
		div.promo.closed div.promo-body div.title {font-size: 24px; font-weight: 500; margin-bottom: 0px;}
		div.promo.closed div.promo-body div.subtitle {font-size: 24px; font-weight: 300; margin-bottom: 0px;}

		div.promobar {left: 140px; padding: 25px 20px 0; width: calc(100% - 140px); height: 105px;}
		div.promobar p  {font-size: 32px}

}

/* @media only screen and (max-height: 1080px) {
	div.quick-links a:first-child { display: none !important;}
} */
@media only screen and (max-height: 950px) {
		/* header a.open-menu { top: 390px; font-size: 24px; padding-right: 50px; } */
		header a.open-menu { top: 370px; font-size: 24px; padding-right: 50px; }
}

@media only screen and (max-height: 850px) {
		/* header a.open-menu { top: 320px; font-size: 20px; padding-right: 30px; } */
		header a.open-menu { top: 325px; font-size: 20px; padding-right: 30px; }

}

div.quick-links a.move-now img {width: 80px}

@media only screen and (max-height: 920px) {
	div.quick-links a.move-now img {width: 60px}
}

@media only screen and (max-height: 780px) {
		div.quick-links a { font-size: 14px; padding-bottom: 20px; padding-top: 20px; }
		div.quick-links a:before { width: 32px; height: 32px; margin: 0 auto 10px; }
		div.quick-links a.move-now {padding-top: 0; border-top: 0}
		div.quick-links a.move-now img {width: 60px}
/*div.promo*/
}

@media only screen and (max-width: 1680px) {

div.testimonials {gap: 40px;}
div.testimonial { padding: 40px 40px; }
div.testimonial:after{ width: 48px; height: 50px; top: 40px; left: 40px; }
div.testimonial > div:first-child { padding-right: 20px;}
div.testimonial div.title {font-size: 48px; }
div.testimonial div.address {font-size: 16px; }
div.testimonial p {font-size: 24px; margin-bottom: 40px}
div.rating { gap: 15px; }
div.rating img { width: 24px;}

div.testimonials-list > div > span { font-size: 28px; }
div.testimonial-popup { padding: 40px; /*max-height: 96vh; overflow: auto*/}
triangle { border-width: 20px 40px 20px 0;  }
.active triangle { top: -6px;}
.active.leftside triangle { border-width: 20px 0 20px 40px ;}
div.testimonial-popup p {font-size: 24px; }
div.testimonial-popup >img {margin: 0 auto 30px 0; width: 40px;}
div.testimonial-popup div.rating { gap: 15px; }
div.testimonial-popup div.rating img { width: 24px;}

div.with-play:after { bottom: 30px; left: 30px; width: 140px; height: 50px; }

		div.promo-popup { max-width: 740px; }
		div.promo-popup a.close-overlay2 { width: 20px; height: 20px; top: 10px; right: 30px; }

}
@media only screen and (max-width: 1600px) {
		div.promo-body p {margin-bottom: 20px; }
		a.btn2 { line-height: 40px; font-size: 18px; padding: 0 20px;}

		section.full-screen div.title { font-size: 120px; }
		section.full-screen div.subtitle { font-size: 36px; }
		section.full-screen > div:not(.promo) { padding-bottom: 50px;}
		section.full-screen > div.type2 { padding-bottom: 40px;}
		section.full-screen div.inner-nav a { font-size: 18px; padding: 0 20px; line-height: 50px; }
		section.full-screen div.type2 div.inner-nav a { line-height: 40px; padding: 0 20px 0 20px;}

}
@media only screen and (max-width: 1440px) {
		h1 { font-size: 60px; margin-bottom: 50px;  }
		h2 { font-size: 48px; margin-bottom: 20px;  }
		h3 { font-size: 32px; margin-bottom: 40px;   }
		h4 { font-size: 30px; margin-bottom: 50px;   }
		h1 + h4 { margin-top: -30px;}

		div.grid-1b > div:first-child {width: 460px}
		div.grid-1b > div:last-child {width: calc(100% - 460px)}
 


		#mortgage-calc { font-size: 18px;}

		div.tr > div { font-size: 18px; }

		div.grid-sales-address > div:last-child { padding-left: 60px}
		div.book-appt { margin-bottom: 100px}
		div.covid-protocols { margin-bottom: 100px; margin-top: 50px;}

		div.promo { padding:20px;  gap: 20px}
		div.promo-body > div:last-child { padding-top: 50px;}
		div.promo-body div.title {font-size: 40px; margin-bottom: 10px;}
		div.promo-body div.subtitle {font-size: 20px; margin-bottom: 20px; letter-spacing: 0}
		div.promo-body p {font-size: 18px; }
		#toggle-promo { right: 20px; top: 20px; height: 24px;  padding-left: 28px; }
		#toggle-promo:after { font-size: 18px; line-height: 24px; }
		#toggle-promo:before { width: 20px; }
		div.promo.closed  { padding: 20px; }
		div.promo.closed div.promo-body { padding: 0px; padding-right: 140px}
		div.promo.closed div.promo-body div.title {font-size: 20px; font-weight: 500; margin-bottom: 0px;}
		div.promo.closed div.promo-body div.subtitle {font-size: 20px; font-weight: 300; margin-bottom: 0px;}

}

@media only screen and (max-width: 1368px) {
/*	div.image { max-width: 800px; margin-left: 0; }*/
}
@media only screen and (max-width: 1280px) {
		section { padding: 0 40px; }
		header { width: 120px; }
		header div.logo { padding: 30px 15px; }
		
		header nav { top: 140px; padding: 50px 40px 160px; min-height: 0px; max-height: calc(100vh - 200px); }

		header nav ul li a { font-size: 18px; line-height: 32px; padding-left: 0px; }
		header nav > ul > li > a:before { height: 40px; }
		header nav ul li ul li a { font-size: 14px; line-height: 30px; padding-left: 25px; }
		/* header a.open-menu { top: 390px; left: 47px; font-size: 24px; padding-right: 50px; } */
		header nav > ul > li > a:before { width: 16px}
		header nav a.toggle-menu { bottom: 30px; left: 40px; padding-left: 30px; line-height: 40px; font-size: 18px; }
		header nav a.toggle-menu:before {height: 40px; width: 20px; }
		div.quick-links a { font-size: 14px; padding-bottom: 20px; padding-top: 20px; }
		div.quick-links a:before { width: 32px; height: 32px; margin: 0 auto 10px; }

		footer { padding: 0px 0 0px 120px; }
		footer section { padding: 40px 20px 40px 40px; }
		div.first-row > div > div {font-size: 16px; padding: 0 30px 0 0;}
		div.first-row > div > div a {line-height: 30px; }
		div.first-row > a { display: none;}
		div.first-row > div {width: 100%;}
		footer div.disclaimer { padding-top: 40px; }
		footer div.disclaimer p, footer div.disclaimer p a { font-size: 14px; }

		section.full-screen > div:not(.promo) { padding-left: 160px}

		div.field { margin-bottom: 20px}
		div.field label { font-size: 18px; margin-bottom: 10px}
		input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"]  { line-height: 40px; font-size: 18px; min-height: 40px;}
		textarea  { font-size: 18px; }
		div.registration { margin-top: 30px}
		button[type="submit"], button[type="button"] { line-height: 50px; font-size: 18px; padding: 0 30px}
		.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 40px; font-size: 18px; text-transform: none;}
		.select2-results__option { font-size: 18px; text-transform: none;}

		div.reveal-response p { font-size: 18px; }

		a.download  { display: block; width: 100px;  font-size: 12px; padding: 15px 10px; background: #fff}
		a.download:before { width: 30px; height: 30px; margin: 0 auto 10px; }
		a.enlarge { width: 30px; right: 10px; top: 10px}

		div.tr > div { font-size: 16px; }
/*		div.th { padding: 15px 5px; }*/
/*		div.td { padding: 8px 5px; }*/
/*		div.tr > div:nth-child(1) { display: none;}*/
/*		div.tr > div:nth-child(1) { text-align: left; width: calc(100% - 400px);}*/
/*		div.tr > div:nth-child(2) { width: 180px;}*/
/*		div.tr > div:nth-child(3) { width: 80px;}*/
/*		div.tr > div:nth-child(4) { text-align: right; width: 140px;}*/
/*		div.tr > div:nth-child(5) { text-align: right; width: 60px;}*/

		button.slick-arrow { width: 20px; height: 40px; }
		button.slick-arrow.slick-next { right: -25px}
		button.slick-arrow.slick-prev { left: -30px}

		div.model-row > div.model-name { font-size: 24px; }

		div.promo { padding:20px; max-width: 50%; gap: 20px}
		div.promo-body > div:last-child { padding-top: 50px;}
		div.promo-body div.title {font-size: 32px; margin-bottom: 10px;}
		div.promo-body div.subtitle {font-size: 16px; margin-bottom: 20px; letter-spacing: 0}
		div.promo-body p {font-size: 16px; }
		#toggle-promo { right: 20px; top: 20px; height: 24px;  padding-left: 28px; }
		#toggle-promo:after { font-size: 18px; line-height: 24px; }
		#toggle-promo:before { width: 20px; }
		div.promo.closed  { padding: 20px; }
		div.promo.closed div.promo-body { padding: 0px; padding-right: 120px}
		div.promo.closed div.promo-body div.title {font-size: 18px; font-weight: 500; margin-bottom: 0px;}
		div.promo.closed div.promo-body div.subtitle {font-size: 18px; font-weight: 300; margin-bottom: 0px;}
		a.btn2 { line-height: 36px; font-size: 16px; padding: 0 20px;}


		div.testimonials {gap: 20px;}
		div.testimonial { padding: 30px}
		div.testimonial:after{ width: 32px; height: 30px; top: 30px; left: 30px; }
		div.testimonial > div:first-child { padding-right: 20px;}
		div.testimonial div.title {font-size: 32px; margin-bottom: 4px;}
		div.testimonial div.address {font-size: 14px; }
		div.testimonial p {font-size: 18px; margin-bottom: 30px}
		div.rating { gap: 10px; }
		div.rating img { width: 16px;}

		div.testimonials-list { row-gap: 0px; }
		div.testimonials-list > div > span { font-size: 20px; }
		triangle {  border-width: 0 20px 20px 20px; border-color: transparent transparent var(--col-primary) transparent;}
		.active triangle { top: -4px;}
		.active.leftside triangle { border-width: 20px 20px 0px 20px; border-color: var(--col-primary) transparent transparent transparent;}
		div.testimonial-popup { padding: 30px; max-width: calc(100vw - 140px); width: 200%;}
		div.testimonial-popup p {font-size: 18px; margin-bottom: 20px}
		div.testimonial-popup >img {margin: 0 auto 20px 0; width: 32px;}
		div.testimonial-popup div.rating { gap: 10px; }
		div.testimonial-popup div.rating img { width: 16px;}

		div.with-play:after { bottom: 20px; left: 20px; width: 120px; height: 40px; }

		div.promobar {left: 120px; padding: 35px 20px 0; width: calc(100% - 120px); height: 101px;}
		div.promobar p  {font-size: 24px}

		section.full-screen div.title { font-size: 80px; }
		section.full-screen div.subtitle { font-size: 24px; margin-bottom: 20px}
		section.full-screen > div:not(.promo) { padding-bottom: 30px;}
		section.full-screen > div.type2 { padding-bottom: 20px;}
		section.full-screen div.inner-nav a { font-size: 12px; padding: 0 15px; line-height: 40px; }
		section.full-screen div.type2 div.inner-nav a { line-height: 40px; padding: 0 15px;}

}

@media only screen and (max-height: 680px) {
		div.promo { max-width: 500px }
		header a.open-menu { top: 325px}

}
@media only screen and (max-height: 620px) {
		div.quick-links { display: none;}
		header nav {    max-height: calc(100vh - 100px); overflow: auto; top: 100px}
		header nav ul li a { font-size: 18px; line-height: 35px; padding-left: 0px; }
		/* header nav a.toggle-menu { bottom: auto; left: auto; top: 20px; right: 20px;} */
}

@media only screen and (max-height: 700px) {
	div.quick-links { display: none;}
	/* header nav a.toggle-menu { bottom: auto; left: auto; top: 20px; right: 20px;} */
}

@media only screen and (max-height: 760px) {
	/* header nav a.toggle-menu { bottom: auto; left: auto; top: 20px; right: 20px;} */
}

@media only screen and (max-height: 875px) {
	header nav a.toggle-menu { bottom: auto; left: auto; top: 20px; right: 20px;}
}

@media only screen and (max-width: 1180px) {
		div.models { margin: 0 auto 100px}
		div.tr div { font-size: 16px; }
		div.th { padding: 8px 0px; }
		div.th:nth-child(1) { width: 180px; }
		div.th:nth-child(2) { width: calc(100% - 680px); padding-left: 15px }
		div.th:nth-child(3) { width: 100px; }
		div.th:nth-child(4) { width: 160px; }
		div.th:nth-child(5) { width: 100px; }
		div.th:nth-child(6) { width: 140px; }
		div.model-row { border-bottom: 1px solid #eee}
		div.elevations > div.tr { padding: 10px 0}
		div.model-row > div.model-image { width: 180px;}
		div.model-row > div.model-name { width: calc(100% - 680px); padding-left: 10px; padding-right: 10px; font-size: 20px; padding-top: 10px}
		div.model-row > div.elevations { width: 500px; }
		div.model-row > div.elevations div.tr div.td { font-size: 16px; }
		div.model-row > div.elevations div.tr div.td:nth-child(1) { width: 100px; }
		div.model-row > div.elevations div.tr div.td:nth-child(2) { width: 160px; }
		div.model-row > div.elevations div.tr div.td:nth-child(3) { width: 100px; }
		div.model-row > div.elevations div.tr div.td:nth-child(4) { width: 140px; }

		div.model-row a.view-pdf { font-size: 14px; display: block; margin: 20px auto 0 0; }

}

@media only screen and (max-width: 1080px) {
		div.th:nth-child(1) { width: 140px; }
		div.th:nth-child(2) { width: calc(100% - 610px); padding-left: 15px }
		div.th:nth-child(3) { width: 70px; }
		div.th:nth-child(4) { width: 160px; }
		div.th:nth-child(5) { width: 100px; }
		div.th:nth-child(6) { width: 140px; }
		div.model-row {border-bottom: 0}
		div.model-row > div.model-image { width: 140px;}
		div.model-row > div.model-name { width: calc(100% - 610px); padding-left: 10px; padding-right: 10px; font-size: 20px; padding-top: 10px}
		div.model-row > div.elevations { width: 470px; }
		div.model-row > div.elevations div.tr div.td:nth-child(1) { width: 70px; }
		div.model-row > div.elevations div.tr div.td:nth-child(2) { width: 160px; }
		div.model-row > div.elevations div.tr div.td:nth-child(3) { width: 100px; }
		div.model-row > div.elevations div.tr div.td:nth-child(4) { width: 140px; }


}


@media only screen and (max-width: 980px) {

		section { padding: 0 20px; }

		#mortgage-calc { font-size: 16px;}


		button.slick-arrow { width: 20px; height: 40px; background-image: url(/lib/img/white/arrow-right.svg)}
		button.slick-arrow.slick-next { right: 10px}
		button.slick-arrow.slick-prev { left: 10px; background-image: url(/lib/img/white/arrow-left.svg)}

		div.covid-protocols {width: calc(100% + 40px); margin-left: -20px;}
		div.covid-protocols > div {padding: 0 20px 0 72px; font-size: 18px; margin-bottom: 20px; line-height: 1.4;}
		div.covid-protocols > div:before { left: 0px; }

		div.grid-sales-address > div:last-child { width: 400px; padding-left: 30px}
		div.grid-sales-address > div:first-child { width: calc(100% - 400px); }

		div.promo-body div.title {font-size: 32px; margin-bottom: 10px;}
		div.promo-body div.subtitle {font-size: 16px; margin-bottom: 20px; letter-spacing: 0}
		div.promo.closed div.promo-body div.title {font-size: 18px; font-weight: 500; margin-bottom: 0px;}
		div.promo.closed div.promo-body div.subtitle {font-size: 18px; font-weight: 300; margin-bottom: 0px;}


/*		div.tr > div { font-size: 16px; }*/
/*		div.th { padding: 15px 5px; }*/
/*		div.td { padding: 8px 5px; }*/

/*div.model-row > div.model-image { width: 80px;}*/
/*div.model-row > div.elevations { width: calc(100% - 80px);}*/
/**/
/*		div.tr > div:nth-child(1) { text-align: left; width: 40%;}*/
/*		div.tr > div:nth-child(2) { width: 20%;}*/
/*		div.tr > div:nth-child(3) { width: 20%;}*/
/*		div.tr > div:nth-child(4) { text-align: right; width: 20%;}*/
/*		div.tr > div:nth-child(5) { text-align: right; width: 10%;}*/

		div.th:nth-child(1) { width: 100%; }
		div.th:nth-child(2) { width: 100%; display: none;}
		div.th:nth-child(3) { width: 70px; display: none;}
		div.th:nth-child(4) { width: 160px; display: none;}
		div.th:nth-child(5) { width: 100px; display: none;}
		div.th:nth-child(6) { width: 140px; display: none;}
		div.model-row {border-bottom: 0}
		div.model-row > div.model-image { width: 100%;}
		div.model-row > div.model-image img { max-width: 350px}
		div.model-row > div.model-name { width: 100%; padding-left: 0px; padding-right: 10px; font-size: 26px; padding-top: 20px}
		div.model-row a.view-pdf { margin-top: 10px; margin-bottom: 20px}
		div.model-row > div.elevations { width: 100%; }
		div.model-row > div.elevations div.tr div.td:nth-child(1) { width: 70px; }
		div.model-row > div.elevations div.tr div.td:nth-child(2) { width: 160px; }
		div.model-row > div.elevations div.tr div.td:nth-child(3) { width: 100px; }
		div.model-row > div.elevations div.tr div.td:nth-child(4) { width: 140px; }

		div.promobar p  {font-size: 20px; line-height: 1;}
		div.promobar p  small {font-size: .66em; display: block; margin-top: 5px}

	section.full-screen > div.type2 { padding-bottom: 20px; }
	section.full-screen div.inner-nav a { font-size: 14px; padding: 0 15px; line-height: 40px; }
	section.full-screen div.type2 div.inner-nav a { line-height: 14px; padding: 0 15px;}
	section.full-screen div.inner-nav a { display: block !important; width: 100% !important;}
	section.full-screen div.inner-nav { max-height: 40px; overflow: hidden; transition: all .3s ease-in; width: 240px; margin-top: 40px}
	section.full-screen div.inner-nav:after { content:""; display: block; position: absolute; top: 0; right: 0; height: 40px; width: 40px; background: url(/img/svg/arrow.svg) no-repeat center center; background-size: 20px 10px; transform: rotate(90deg); cursor: pointer;}
	section.full-screen div.inner-nav.open { max-height: 240px;}
	section.full-screen div.type2 div.inner-nav a { background-color: var(--col-primary); line-height: 40px; padding: 0 15px;}
	section.full-screen div.type2 div.inner-nav:after { background-image: url(/img/svg/arrow-white.svg); transform: rotate(270deg);}
}

@media only screen and (max-height: 760px) {
/*header nav a.toggle-menu { display: none!important}*/
}
@media only screen and (max-width: 760px) {
	header { width: 100%; height: 60px; background: #fff; border-right: 0}
	header div.quick-links  { display: none;}
	header div.logo { padding: 8px 0; width: auto; margin: 0 auto; position: relative; top: 0; left: 0; border-right: 0}
	header div.logo img { height: 44px; width: auto; display: block;}
	header div.burger { display: block; }
	header nav { top: 60px; width: 100vw; height: calc(100vh - 60px); overflow: auto; max-height: 100vh; left: -150vw; padding-bottom: 60px;}
	header nav a.toggle-menu { display: none;}
	header a.open-menu { display: none;}

	article { padding-left: 0px; padding-top: 90px; margin-bottom: 50px;}
	article#home { padding-left: 0px; padding-top: 0px; margin-bottom: 0}
	section { margin: 0 auto; padding: 0 20px; }
	section.full-screen div.title { font-size: 52px; }
	section.full-screen div.subtitle { font-size: 18px; margin-top: 10px}

	
	footer { padding: 40px 20px;}
	footer section { padding: 0px;}
		div.first-row > div > div {font-size: 12px; padding: 0 20px 0 0;}
		div.first-row > div > div a {line-height: 30px; }
		footer div.disclaimer { padding-top: 30px; }
		footer div.disclaimer p, footer div.disclaimer p a { font-size: 12px; }

		p { margin-bottom: 30px; font-size: 18px}
		h1 { font-size: 40px; margin-bottom: 30px;  }
		h2 { font-size: 32px; margin-bottom: 20px;  }
		h3 { font-size: 24px; margin-bottom: 10px;   }
		h4 { font-size: 20px; margin-bottom: 30px;   }
		h1 + h4 { margin-top: -10px;}


		div.image { margin: 20px auto; }

		div.grid-1b > div:first-child {width: 100%; margin-bottom: 20px}
		div.grid-1b > div:last-child {width: 100%}
		div.grid-1b .margin-bottom-50 { margin-bottom: 10px !important}


		div.grid-1a.responsive > div { width: 100%}
		div.grid-1a.responsive > div:first-child { width:100%; padding-right: 0px;}

		div.grid-1a > div:first-child { padding-right: 60px;}
		div.grid-1b > div:first-child { padding-right: 0px;}
		div.grid-1c > div:first-child { padding-right: 0px; width: 100%;}
		div.grid-1c > div:last-child { display: none;}

		div.area-feature { margin: 60px auto;}
		div.area-feature div.slick-slide { padding: 0px}
		div.area-feature div.caption { bottom: 10px; left: 10px; font-size: 18px; }

		a.download  { width: 92px;  font-size: 11px; padding: 15px 10px; }
		a.download:before { width: 15px; height: 20px; }

		div.contact-info { margin-bottom: 60px}
		div.field { margin-bottom: 10px}
		div.field label { font-size: 18px; margin-bottom: 5px}
		div.splitter.s50_50 > div, div.splitter.split-2 > div { padding-right: 0px; width: 100%;}
		input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"]  { line-height: 40px; font-size: 18px; min-height: 40px;}
		textarea  { font-size: 24px; }
		div.registration { margin-top: 30px}
		button[type="submit"], button[type="button"] { line-height: 44px; font-size: 18px; padding: 0 30px}

		div.footnote { margin-top: 20px}
		div.footnote p {font-size: 14px; line-height: 1.5;}

		img.siteplan-icon { width: 80px;}
		picture img { width: 100%; display: block;}
		.responsive picture img { margin-top: 20px;}
		.margin-top-100 { margin-top: 40px !important}

		picture + img { margin-top: 3px}
		
		div.slideshow { padding-bottom: 20px}
		ul.slick-dots { bottom: -20px;}
		ul.slick-dots button { margin: 0; padding: 0; font-size: 0; width: 9px; height: 9px; border: 2px solid #fff; background: #CCCCCC; border-radius: 9px;}
		ul.slick-dots .slick-active button { border-color: #000; background: #000}


		div.grid-sales-address > div:first-child { width: 100%; }
		div.grid-sales-address > div:last-child { width: 100%; padding-left: 0px; padding-top: 30px}

		div.book-appt { margin-bottom: 50px}
		div.covid-protocols { margin-bottom: 50px; margin-top: 50px;}
		
		div.radios {display: block; margin-bottom: 25px}
		div.radios > label {display: block; margin-bottom: 15px}

		a.enable-sound { bottom: 20px; right: 20px; }

		div.model-row > div.elevations div.tr div.td:nth-child(1) { width: 60px; }
		div.model-row > div.elevations div.tr div.td:nth-child(2) { width: calc(100% - 260px); }
		div.model-row > div.elevations div.tr div.td:nth-child(3) { width: 60px; }
		div.model-row > div.elevations div.tr div.td:nth-child(4) { width: 130px; }

		div.promo { padding:20px; max-width: 100%; gap: 20px; top: 60px;}
		div.promo.closed div.promo-body { padding: 0px; padding-right: 60px}
		div.promo.closed div.promo-body div.subtitle { margin-top: 0}

		div.testimonials {}
		div.testimonial { padding: 30px; flex-direction: column; gap: 20px}
		div.testimonial > div { width: 100% !important}
		div.testimonial:after{ width: 24px; height: 20px; }
		div.testimonial > div:first-child { padding-right: 0px; padding-top: 40px;}
		div.testimonial p {margin-bottom: 20px}

		div.testimonials-list { grid-template-columns: 1fr;}
		div.testimonials-list > div > span { font-size: 20px; }
		triangle {  border-width: 0 20px 20px 20px; border-color: transparent transparent var(--col-primary) transparent;}
		.active triangle { top: -4px;}
		.active.leftside triangle { border-width: 20px 20px 0px 20px; border-color: var(--col-primary) transparent transparent transparent;}
		div.testimonial-popup { padding: 30px; max-width: 100%; width: 100% !important;}
		div.testimonial-popup p {font-size: 18px; margin-bottom: 20px}
		div.testimonial-popup >img {margin: 0 auto 20px 0; width: 32px;}
		div.testimonial-popup div.rating { gap: 10px; }
		div.testimonial-popup div.rating img { width: 16px;}
	
		div.with-play:after { bottom: 10px; left: 10px; width: 80px}

		div.promobar {left: 0px; padding: 20px 20px 20px; width: 100%; height: auto; position: relative; margin-top: -30px; margin-bottom: 30px}
		div.promobar p  {font-size: 18px}

	section.full-screen > div:not(.promo) { padding-bottom: 30px; padding-left: 20px; padding-right: 20px !important}

} 

@media only screen and (max-width: 600px) {
/*		div.models div.th { display: none !important;}*/
/*		div.models > div.tr { border: none; margin-bottom: 30px}*/
/*		div.models div.td { padding: 5px 0px}*/
/*		div.models div.td:empty { display: none;}*/
/*		div.tr > div:nth-child(1) { width: 100%; max-width: 480px; display: block}*/
/*		div.tr > div:nth-child(1) img.no-image { display: none}*/
/*		div.model-row { margin-bottom: 60px}*/
/*		div.model-row > div.model-image { width: 100%; display: block}*/
/*		div.model-row > div.elevations { width: 100%; margin-top: 10px; padding-left: 0}*/
/*		div.model-row > div.elevations div.tr { padding: 10px 0}*/
/*		div.model-row > div.elevations div.tr:last-child { border-bottom: 0}*/

/*		div.tr > div:nth-child(1) { text-align: left; display: block; font-size: 20px; width: 100%; font-weight: 500;}*/
/*		div.tr > div:nth-child(2) {display: block; width: 100%; text-align: left; }*/
/*		div.tr > div:nth-child(3) {display: block; width: 100%; text-align: left; ;}*/
/*		div.tr > div:nth-child(4) { display: block; width: 100%; text-align: left; }*/
/*		div.tr > div:nth-child(5) { text-align: left;display: block; width: 100%;  }*/

		#slide2 { background-image: url(/img/home/mobile/2.jpg);}
		#slide3 { background-image: url(/img/home/mobile/3.jpg);}
		#slide4 { background-image: url(/img/home/mobile/4.jpg);}

div.grid-1a > div { width: 25%}
div.grid-1a > div:first-child { width:75%; padding-right: 40px;}
section.full-screen { height: calc(var(--vh, 1vh) * 100); }
section.full-screen > div.iframe { width: 100% !important; left: 0 !important; top: 116px !important; padding-bottom: 56.25% !important; height: 0!important}
section.full-screen#slide1 {height: calc(56.25vw + 380px)}
section.full-screen#slide1 div.inner-nav {border: 1px solid #fff;}
/*div.grid-1b > div { width: 64%}*/
/*div.grid-1b > div:first-child { width: 36%; padding-right: 80px;}*/
/*div.grid-1c > div { width: 50%}*/
/*div.grid-1c > div:first-child { width: 50%; padding-right: 80px;}*/
		div.promo-popup a.close-overlay2 { width: 15px; height: 15px; top: 5px; right: 25px; }

}

@media only screen and (max-width: 480px) {

		div.tr > div { font-size: 14px; }
		div.th { padding: 15px 5px; }
		div.td { padding: 8px 5px; }
/*		div.tr > div:nth-child(1) { display: none;}*/

		h3 { font-size: 20px}
		div.image div.caption { bottom: 10px; left: 10px; font-size: 14px;}
		div.area-feature div.caption { bottom: 10px; left: 10px; font-size: 14px; }

		button.slick-arrow { width: 15px; height: 30px; }
		button.slick-arrow.slick-next { right: 10px}
		button.slick-arrow.slick-prev { left: 10px; }

		div.covid-protocols {width: calc(100% + 20px); margin-left: -10px;}
		div.covid-protocols > div {padding: 0 10px 0 50px; font-size: 16px; margin-bottom: 20px; line-height: 1.5;}
		div.covid-protocols > div:before { left: 0px; height: 24px;}
		div.covid-protocols > div.covid-calendar:before {width: 54px; }
		div.covid-protocols > div.covid-user:before {width: 40px;}
		div.covid-protocols > div.covid-mask:before {width: 50px; height: 16px}
		div.covid-protocols > div.covid-sanitizer:before {width: 40px;}
		div.covid-protocols > div.covid-washroom:before {width: 50px;}
		div.covid-protocols > div.covid-surface:before {width: 42px;}
		div.covid-protocols > div.covid-paper:before {width: 50px; }

		div.promo { padding:20px; gap: 0px}
		div.promo-body > div { width: 100%;}
		div.promo-body > div:first-child { display: none;}
		div.promo-body > div:last-child { padding-top: 0px;}
		div.promo-body div.title {font-size: 20px; margin-bottom: 10px;}
		div.promo-body div.subtitle {font-size: 14px; margin-bottom: 15px;}
		div.promo-body p {font-size: 14px; }
		#toggle-promo { right: 10px; top: 20px; height: 16px;  padding-left: 17px; }
		#toggle-promo:after { font-size: 14px; line-height: 16px; }
		#toggle-promo:before { width: 12px; }
		div.promo.closed  { padding: 20px; }
		div.promo.closed div.promo-body { padding: 0px; padding-right: 60px}
		div.promo.closed div.promo-body div.title {font-size: 16px; font-weight: 500; margin-bottom: 0px;}
		div.promo.closed div.promo-body div.subtitle {font-size: 16px; font-weight: 300; margin-bottom: 0px;}
		a.enable-sound { bottom: auto; top: calc(116px + 56.25vw); right: 0px; font-size: 14px; padding: 6px 6px 2px 34px; line-height: 24px; width: 150px}
		a.enable-sound:after { line-height: 14px; font-size: 14px; top: -2px}
		div.elevations svg { position: absolute; left: -15px}

		div.promobar {padding: 15px}
		div.promobar p  {font-size: 14px}

}