/* FONTS (via fonts.com)

font-family: skolar-sans-latin-extended, sans-serif;

*/


/* VARIABLES */

:root {
  --default-font: skolar-sans-latin-extended;
  --default-font-size: 18px;
  --default-input-font-size: 50px;

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

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

  --col-text: #000;
  --col-input: #000;
  --col-placeholder: #D1D1D1;
  --col-input-bg: #000;

  --col-button: transparent;
  --col-button-rgb: 255, 255, 255;

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

  --col-link-hover: #fff;
  --col-link-hover-rgb: 255, 255, 255;

  --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: #fff;

  --col-border: #646464;
  --col-border-rgb: 139, 1395, 139;

  --dim-site-width: 1440px;
  --dim-default-space: 80px;
  --dim-input-height: 79px;

  --grid-spacing: 15px;
  --grid-spacing-neg: -15px;
  --grid-spacing-2x: 30px;
  --grid-margin: 50px;
  --grid-margin-neg: -50px;
}

/* theme */

html {background-color: #fff}
body { font-weight: 300; background-color: #fff; font-size: 24px; font-family: skolar-sans-latin-extended;}
html.overlay-active, html.overlay-active body { max-height: 100vh; overflow: hidden;}

/*CORE HTML*/
p { line-height: 1.5; margin-bottom: 40px; font-size: 24px; font-weight: 300}
p.shorter  { max-width: 800px; margin-left: auto; margin-right: auto;}
p.short  { max-width: 1180px; margin-left: auto; margin-right: auto;}
p.large { font-size: 22px;}
b,strong { font-weight: 700; }
p.larger { font-size: 24px;}
p.lighter { font-weight: 300}

h1, h2, h3, h4, h5, h6 { font-weight: normal; display: block;}
h1 { font-size: 80px; line-height: 1; margin-bottom: 0px; color: #FED419; letter-spacing: 0px; text-transform: uppercase; text-align: left; font-weight: 700; position: relative}
h1 span { font-size: 180px; display: block; margin-left: -15px;;}
h1 small { font-size: 40px; display: block; color: #fff; }
h2 { font-family: skolar-sans-latin-extended; font-size: 34px;  color: #fff; line-height: 1.1; margin-bottom: 0px; width: 100%; margin-top: 30px}
h3 { font-size: 60px; font-weight: 700;  line-height: 1; margin-bottom: 30px; color: #fff; }
h4 { font-size: 40px; font-weight: 700;  line-height: 1; text-transform: uppercase; text-align: center; max-width: 1240px; padding: 0 20px; margin: 0 auto 40px}
h5 { font-size: 22px; font-weight: 400;  line-height: 1.1; ; text-transform: uppercase; margin-bottom: 30px; letter-spacing: 2px;}
h6 { font-size: 32px; font-weight: 700;  color: #FED419; line-height: 1.25; ; text-transform: uppercase; margin-bottom: 10px; }
h2 + h3 { margin-top: -10px;}
h4 { }
h5 { }
h6 { }

/*CONTAINERS*/
article { padding-top: 0px; }
article.flush { padding-top: 0px; }
article.no-masthead { padding-top: 100px; }

article > section {max-width: 1920px; padding: 0px 100px; margin: 0px auto;}
article > section.full {max-width: 1920px; padding: 0}
article > section.max {max-width: 100%; }
article > section.blue { background-color: var(--col-primary); margin-top: -1px; max-width: 100%; }
article > section.spaced { margin: 80px auto;}
article > section.padded { padding-top: 80px; padding-bottom: 80px;}
article > section.masthead { max-width: 100%; margin: 0px auto; padding: 0}
article > section.masthead.masthead-full { max-width: 100%; margin: 0px auto; padding: 0}
div.masthead > a > img, div.masthead > img  { display: block; width: 100%;}

div.content { display: block; width: 100%; padding: 80px 40px}

div.social { display: block; text-align: center; margin-top: 20px; font-size:0}
div.social a { display: inline-block; font-size: 20px; margin: 0 10px; color: #fff; transition: all .3s ease-in}
div.social a:hover { color: #aaa;}

/* OVERLAY */
div.overlay { width: 100vw; height: 100vh; position: fixed; left: 0; top: -200vh; z-index: 999;display: block; transition: opacity .3s ease-in .1s; opacity: 0; background: rgba(0,0,0,0.9); }
div.overlay.active { top: 0; opacity: 1;}
div.overlay > div{ width: 100%; height: 100%; display: block; position: relative; z-index: 3;}
div.overlay div.popup { width: 1180px; display: block; position: relative; z-index: 3; top: 50%; transform: translate3D(0,-50%, 0); max-width: 92%; margin: 0 auto; background: transparent; max-height: 92%; overflow: auto}
div.overlay > img { width: 100%; display: block;}
div.overlay a.close-overlay { position: absolute; display: block; width: 40px; height: 40px; border-radius: 40px; top:25px; right: 25px; z-index: 11; background: url(../img/logo.svg) var(--col-primary)  no-repeat center center; background-size: 20px 20px; }


/* ALIGNMENTS */

/*BUTTONS*/
a.btn { color: #22449C; line-height: 80px; border: 0; padding: 0px 25px; font-size: 30px; font-weight: 500; display: table; margin: 0 auto 0 0; max-width: 100%; background: #FED419; letter-spacing: -1px}

a.btn2 {font-size: 30px; text-decoration: underline; font-weight: 700}

/* COLOURS */
.white { color: #fff !important}
.blue { color: #22449C !important}
.bg-blue { background-color: #22449C !important}
.yellow { color: #FED419 !important}
.green { color: #127F40 !important}
.red { color: #E1251B !important}
.bg-red { background-color: #E1251B !important}

/* CONTENT BLOCKS */

/*CAPTIONS*/

div.grecaptcha-badge { right: -1600px !important}
#ui-datepicker-div { z-index: 999 !important}
table.ui-datepicker-calendar td { font-size: 18px; color: var(--col-primary)}
table.ui-datepicker-calendar td a { color: #000}
table.ui-datepicker-calendar td a.ui-state-highlight { color: var(--col-primary)}
table.ui-datepicker-calendar td.ui-datepicker-today { background: var(--col-primary); color: #fff}
table.ui-datepicker-calendar td.ui-datepicker-today a { color: #fff}
table.ui-datepicker-calendar th { line-height: 2;}
table.ui-datepicker-calendar th span { font-size: 18px;}
.ui-datepicker-title { line-height: 1;}
.ui-datepicker-title span { font-weight: 300; font-size: 24px; }

/*HEADER AND FOOTER*/
header {background: #22449C; width: 1920px; max-width: 100%; position: relative; margin: 0 auto; display: block;top: 0; left: 0; padding: 150px 100px 0px; }
div.burger { display: none; position: absolute; top: 19px; left: 40px; }
div.burger:after { content:"MENU"; display: block; color: #fff; line-height: 60px; font-size: 14px; font-family: skolar-sans-latin-extended; padding-left: 50px;}
header div.logo { width: 200px; height: 200px; top: 0; right: 100px; display: block; position: absolute; z-index: 4;}
header div.logo a { width: 100%; height: 100%; display: block;}
header div.logo img { width: 100%; height: 100%; display: block;}
header div.logo-brand { height: 100px; display: block; position: relative; z-index: 4; margin-bottom: 20px; }
header div.logo-brand img { height: 100%; display: block; }


/*header nav { position: fixed; top: -200vh; left: 0vw; display: block; width: 100vw; height:100vh; z-index: 3; padding: 80px 20px; opacity: 0; transition: opacity .3s ease-in; transition: opacity .3s ease-in}*/
/*header.active nav { top: 0; opacity: 1;}*/
header nav { display: block; text-align: left; }
header nav ul { display: block; width: 100%; text-align: left}
header nav li { display: inline-block; vertical-align: top; text-align: left;}
header nav ul a { display: block; width: 100%; text-align: left; font-family: skolar-sans-latin-extended; color: #fff; font-size: 24px; font-weight: 700; line-height: 100px; padding-right: 8vw; text-decoration: underline;}

div.neighbourhoods { padding: 100px 20px; font-size: 0; text-align: center; display: block; width:100%;}
div.neighbourhoods > a { display: inline-block; width: 740px; max-width: 50%; padding-left: 220px; min-height: 80px; position:relative; text-align:left; margin: 10px 0px; font-size:40px; font-weight: 500; color: #22449C; letter-spacing:-2px}
div.neighbourhoods > a:before { display: block; content: ""; width: 175px; height: 80px; background: url(../img/svg/qw.svg) no-repeat center center; background-size: contain; position: absolute; top: 0; left: 0}
div.neighbourhoods > a.ap { color: #FED419}
div.neighbourhoods > a.km { color: #127F40}
div.neighbourhoods > a.ct { color: #E1251B}
div.neighbourhoods > a.ap:before { background-image: url(../img/svg/ap.svg)}
div.neighbourhoods > a.km:before { background-image: url(../img/svg/km.svg)}
div.neighbourhoods > a.ct:before { background-image: url(../img/svg/ct.svg)}
footer { display: block; width: 100%; background: #fff; max-width: 1920px;}
footer section { display: block; max-width: 100%; }
footer div.disclaimer { display: block; width: 100%; text-align: left; padding: 100px 100px 30px;}
footer div.disclaimer p { display: block; width: 100%; text-align: left; font-size: 14px; font-family: skolar-sans-latin-extended; color:#707070 }
footer div.disclaimer img { height: 12px;}
div.footer-form { display: block; width: 100%; position: relative;}
div.footer-form > div { display: block; width: 50%; margin-left: 50%; }
div.footer-form > div:first-child { position: absolute; top: 0; left: 0; margin: 0; padding-left: 100px; height: 100%; }
div.footer-form > div:first-child > div { display: block; height: 50%; width: 100%; position: relative;}
div.footer-form > div:first-child > div:last-child { height: auto; position: absolute; bottom: 0; left: 100px; width: calc(100% - 100px)}
div.footer-form > div:first-child > div p.bold { display: block; position: relative; top: 50%; transform: translate3D(0, -50%, 0); font-size: 40px; font-weight: 700; text-align: left; color: #22449C; padding-right: 80px; letter-spacing: -2px}
div.footer-form > div:first-child > div:last-child { }
div.footer-form div.grid { margin: 0; border-bottom: 0}
div.footer-form div.grid > div { margin: 0;}
div.footer-form div.grid > div {vertical-align: middle}

div.footer-form img { display: block;}
div.sales-team { text-align: left; padding: 40px; position: relative; }
div.sales-team p { color:#fff; margin: 0 auto 30px; font-size: 26px; font-weight: 500; letter-spacing: -1px}



/*CONTENT*/

div.grid.grid-2b > div { width: 55%; }
div.grid.grid-2b > div:last-child { width: 45%; padding-right: 50px;}
div.grid.grid-2c > div { width: 45%; padding-left: 50px;}
div.grid.grid-2c > div:last-child { width: 55%; padding-right: 0}
div.image1 {display: block; position: relative; background: #22449C; left: -100px}
div.image1 span {display: block; position: absolute; left: 100px; height: 100%; background: #fff; width: calc(100% - 100px); z-index: 2;}
div.image1 img {display: block; position: relative; left: 0; width: 100%; mix-blend-mode: multiply; z-index: 3;}
div.image2 {display: block; position: relative; background: #127F40; right: -100px}
div.image2 span {display: block; position: absolute; left: 0px; height: 100%; background: #fff; width: calc(100% - 100px); z-index: 2;}
div.image2 img {display: block; position: relative; left: 0; width: 100%; mix-blend-mode: multiply; z-index: 3;}

div.suites { background-color: #FED419; padding: 80px 0 300px; margin-top: -80px}
div.lofts { padding: 80px 0 300px}

table.floorplans { margin: -200px auto 50px 0; max-width: 1200px; width: 100%; background: #fff; }
table.floorplans tr { cursor: pointer;}
table.floorplans tr:hover { background-color: #aaa}
table.floorplans th { background: #DDDDDD; font-weight: 500}
table.floorplans th, table.floorplans td { font-size: 18px; color: #000; padding: 15px 0; border-top: 1px solid #3E3E3E; text-align: center; font-weight:300}
table.floorplans th:first-child, table.floorplans td:first-child { padding-left: 15px;}
table.floorplans th:nth-child(2), table.floorplans td:nth-child(2), table.floorplans th:nth-child(3), table.floorplans td:nth-child(3) { text-align: left;}

div.floorplan { display: block; width: 100%; font-size: 0; max-height: 0; overflow: hidden; text-align: center;}
div.floorplan.active { max-height: 3000px; }
div.floorplan > div:first-child { display: block; width: 100%; vertical-align: top; padding-top: 50px;}
div.floorplan > div.plan, div.floorplan > div.keyplate { display: inline-block; width: 240px; vertical-align: top; padding-top: 50px;}
div.floorplan > div.plan { padding: 50px; width: calc(100% - 240px); max-width: 1200px;}
div.floorplan img {width: 100%; }
div.floorplan div.keyplate img {max-width: 240px; }

div.floorplan-details div.name { font-size: 40px; margin: 0 auto 40px;}
div.floorplan-details div.info { text-align: center; font-size:0; width: 100%; margin: 0 auto 40px;}
div.floorplan-details div.info > div { display: inline-block; vertical-align: top; padding: 0 25px; text-align: center; border-right: 1px solid #3E3E3E; font-size: 24px;}
div.floorplan-details div.info > div:last-child { border: 0}
div.floorplan-details div.info div small { display: block; font-size: 18px; margin-top: 5px;}

div.floorplan-details div.more-info { text-align: center; font-size:0; width: 100%; margin: 0 auto 40px; padding-left: 5%;}
div.floorplan-details div.more-info > div { display: inline-block; vertical-align: top; padding: 0 100px; text-align: center;font-size: 24px;}
div.floorplan-details div.more-info > div > div { display: block; font-size: 0px;  margin: 0 auto 10px; text-align: left; min-width: 250px; }
div.floorplan-details div.more-info > div > div span { display: inline-block; width: 50%; text-align: left; font-size: 18px; white-space: nowrap}



div.intro { background-color: #22449C; padding: 80px 100px 80px}
div.intro img { display: block;}
div.intro div.grid > div { vertical-align: middle;}

div.content {padding: 100px 100px 400px; text-align: center;}
div.content p { max-width: 1380px; margin: 0 auto 40px; }
.bg-blue p { color: #fff;}
.bg-red p { color: #fff;}

div.slideshow { margin-top: -340px}
button.slick-arrow { position: absolute; bottom: 210px; left: 50%; margin: 0; padding:0; width: 60px; border:0; font-size: 0; height: 60px;  z-index: 3; display: block; background: url(../img/arrow.svg) no-repeat center center; background-size: cover; }
button.slick-arrow:hover { background-color: transparent;}
button.slick-arrow.slick-prev { margin-left: -90px;}
button.slick-arrow.slick-next { margin-left: 30px;transform: rotate(180deg); }
ul.slick-dots { position: absolute; bottom: 0px; left: 0; text-align: center; display: block; width: 100%;}
ul.slick-dots li { display: inline-block; width: 20px; height: 20px; margin: 0 5px; vertical-align: top;}
ul.slick-dots li button { display: block; width: 100%; height: 100%; background: #EBEBEB; opacity: 1; margin:0; padding: 0; font-size: 0; border-radius: 14px; }
ul.slick-dots li.slick-active button { background: #22449C;}
div.slide { padding: 40px; text-align: center; opacity: 1; transition: opacity .3s ease-in}
div.slide.slick-current.slick-center { opacity: 1}
div.slide img { display: block; width: 100%;}
div.slide p { font-size: 50px; font-weight: 700; margin: 0 auto; padding-top: 80px; text-align: center; display: block; opacity: 0; padding-bottom: 40px; color: #22449C; transition: opacity .1s ease-in 0s; text-transform: uppercase;}
div.slideshow2 div.slide p { opacity: 0 !important}
div.slideshow > p { font-size: 50px; font-weight: 700; margin: 0 auto; position: absolute; text-align: center; display: block; opacity: 1; bottom: 40px; color: #22449C; transition: opacity .1s ease-in 0s; text-transform: uppercase; width: 100%;}
div.slide.slick-current p { opacity: 1; transition: opacity .3s ease-in .5s}

/*div[data-editorblocktype="Field-integer"] {display: none !important}*/
#crmform { display: block; width: calc(100% - 200px); padding: 50px; margin: 0 auto}
#crmform h3 { margin-top: 40px; }
form.microsite-contact-form { padding: 0 !important; max-width: 800px !important;}
div.marketing-subscription-list { position: relative; display: block; width: 100%; text-align: left; padding-left: 32px; margin-top: 30px; margin-bottom: 30px}
div.marketing-subscription-list span { font-size: 14px !important; line-height: 1.25 !important; display: block; width: 100%; text-align: left; padding-left: 0px; color:#000 !important}
.microsite-contact-form input[type='checkbox'] {position: absolute; display: block; left: 0; top: 3px; width: 20px !important; height: 20px !important; border-color: #000; background-color: #fff !important}
div[data-editorblocktype] { position: relative; }
.microsite-contact-form label { position: absolute; top: 0; left: 0; display: none !important}
.microsite-contact-form span.lp-required {display: none !important}
.microsite-contact-form .lp-form-header { display: block; font-size: 0; width: 100%; }
.microsite-contact-form  div[data-editorblocktype="Field-text"], .microsite-contact-form  div[data-editorblocktype="Field-integer"] { display: inline-block !important; width: 50%!important; vertical-align:top; padding-right: 10px;}
.microsite-contact-form  div[data-editorblocktype="Field-email"] { padding-right: 10px;}
.microsite-contact-form  div[data-editorblocktype="Field-text"][hidden] { display:none !important; }
.microsite-contact-form  div[data-editorblocktype="Field-text"] input, .microsite-contact-form  div[data-editorblocktype="Field-integer"] input, .microsite-contact-form  div[data-editorblocktype="Field-email"] input {  height: 50px !important; min-height: 50px !important; padding: 0px !important; border: 1px solid #000 !important;  line-height: 48px !important; font-family: "skolar-sans-latin-extended" !important; font-weight: 300 !important; margin-bottom: 25px !important; font-size: 24px !important; background-color: #fff;}
.microsite-contact-form input::-input-placeholder {  height: 50px !important; min-height: 50px !important; padding: 0 !important; font-size: 24px !important; color: #000 !important; line-height: 48px !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
.microsite-contact-form textarea::-input-placeholder {  height: 50px !important; min-height: 50px !important; padding: 0 !important; font-size: 24px !important; color: #000 !important; line-height: 48px !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
.microsite-contact-form textarea::-webkit-input-placeholder {font-size: 18px !important; color: #000 !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
.microsite-contact-form input::-webkit-input-placeholder {  height: 50px !important; min-height: 50px !important; padding: 0 !important; font-size: 24px !important; color: #000 !important; line-height: 48px !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
.microsite-contact-form input::-moz-placeholder { height: 50px !important; min-height: 50px !important;  font-size: 24px !important; color: #000 !important; line-height: 48px !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
.microsite-contact-form input:-ms-input-placeholder {height: 50px !important; min-height: 50px !important;   font-size: 24px !important; color: #000 !important; line-height: 48px !important; font-family: skolar-sans-latin-extended !important; font-weight: 300 !important; ; }
form.microsite-contact-form { margin: 0 auto !important}
#crmform > div { margin: 0 auto 0 0 !important}
.microsite-contact-form button { line-height: 68px !important; border: none !important; width: 240px !important; padding: 0 !important; text-align: center; font-size: 20px !important; ; font-family:skolar-sans-latin-extended !important; margin: 0 auto !important; height: auto !important; font-weight: normal !important; background-color: #E1251B; color: #fff;}
.microsite-contact-form textarea { background: transparent !important;  border: 1px solid #707070 !important; color: #000; font-size: 18px !important }

.slick-slide { height: auto}

@media only screen and (max-width: 1920px) {
	#crmform { width: 100%; }

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


	a.btn {font-size: 24px; }

}

@media only screen and (max-width: 1680px) {
	header {padding: 100px 50px 0px; }
	div.burger { display: none; position: absolute; top: 19px; left: 40px; }
	header div.logo { width: 120px; height: 120px; right: 50px; }
	header div.logo-brand { height: 70px; margin-bottom: 20px; }
	header nav ul a {  font-size: 24px; font-weight: 500; line-height: 80px; padding-right: 6.8vw; }

	footer div.disclaimer { padding: 70px 50px 30px;}
	div.footer-form > div:first-child { padding-left: 50px; }
	div.footer-form > div:first-child > div:last-child { left: 50px; width: calc(100% - 50px)}
	div.footer-form > div:first-child > div p.bold { font-size: 32px; padding-right: 40px; letter-spacing: -1px}
	div.sales-team { padding: 30px; }
	div.sales-team p { margin: 0 auto 20px; font-size: 22px; }

	div.neighbourhoods { padding: 50px 20px 50px 50px; }
	div.neighbourhoods > a { padding-left: 160px; min-height: 60px; margin: 10px 0px; font-size: 32px; }
	div.neighbourhoods > a:before { width: 130px; height: 60px; }
	
	a.btn { line-height: 60px; padding: 0px 20px; font-size: 24px; }

	article > section { padding: 0 50px;}
	article > section.full { padding: 0;}
	div.grid.grid-2b > div:last-child { padding-right: 30px;}
	div.grid.grid-2c > div { padding-left: 30px;}
	div.image1 {left: -50px}
	div.image1 span {left: 50px; width: calc(100% - 50px); }
	div.image2 {right: -50px}
	div.image2 span {width: calc(100% - 50px); }
	div.intro { padding: 80px 50px 80px}
	div.content {padding: 100px 50px 400px; }

	div.floorplan-details div.title {font-size: 60px}
	div.floorplan-details div.title:after { margin-top: 20px;}
	div.floorplan-details div.more-info > div { padding: 0 40px;}

/*	#crmform { width: calc(100% - 100px); padding: 50px; }*/


}

@media only screen and (max-width: 1440px) {
	h1 { font-size: 60px; }
	h1 span { font-size: 135px; margin-left: -10px;;}
	h1 small { font-size: 30px; }
	h2 { font-size: 25px;  margin-top: 20px}
	h3 { font-size: 40px; margin-bottom: 24px; }
	h4 { font-size: 30px; margin: 0 auto 30px}
	h6 { font-size: 24px; }
	p { margin-bottom: 30px; font-size: 18px; }
	a.btn2 {font-size: 22px; }
	a.btn { line-height: 48px; padding: 0px 15px; font-size: 18px; }
	div.sales-team p { font-size: 18px; }
	div.footer-form > div:first-child > div p.bold { font-size: 24px; }
	div.slideshow > p, div.slide p { font-size: 32px;}
	div.slideshow > p { bottom: 49px}
	table.floorplans { max-width: 92%}
	table.floorplans th, table.floorplans td { font-size: 16px; }

	button.slick-arrow { bottom: 130px; width: 40px; height: 40px;  }
	button.slick-arrow.slick-prev { margin-left: -70px;}
	button.slick-arrow.slick-next { margin-left: 20px;}
	ul.slick-dots li { width: 14px; height: 14px; }
	div.slide { padding: 30px; }
	div.slide p {padding-top: 40px;  padding-bottom: 30px; }

	.margin-top-100 { margin-top: 50px !important}

	div.neighbourhoods > a { padding-left: 140px; min-height: 48px; margin: 10px 0px; font-size: 24px; line-height: 48px;}
	div.neighbourhoods > a:before { width: 104px; height: 48px; }

}

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

	header {padding: 100px 20px 0px; }
	div.burger { display: none; position: absolute; top: 19px; left: 40px; }
	header div.logo { width: 80px; height: 80px; right: 20px; }
	header div.logo-brand { height: 50px; margin-bottom: 20px; }
	header nav ul a {  font-size: 20px; font-weight: 500; line-height: 60px; padding-right: 7vw; }

	footer div.disclaimer { padding: 50px 20px 30px;}
	div.footer-form > div:first-child { padding-left: 20px; }
	div.footer-form > div:first-child > div:last-child { left: 20px; width: calc(100% - 20px)}
	div.footer-form > div:first-child > div p.bold { font-size: 24px; padding-right: 20px; letter-spacing: -1px}
	div.sales-team { padding: 20px; }
	div.sales-team p { margin: 0 auto 20px; font-size: 16px; }

/*	#crmform { width: calc(100% - 40px); padding: 40px 20px; }*/
	
	a.btn { line-height: 40px; padding: 0px 15px; font-size: 16px; }

	article > section { padding: 0 20px;}
	article > section.full { padding: 0;}
	div.grid.grid-2b > div:last-child { padding-right: 20px;}
	div.grid.grid-2c > div { padding-left: 20px;}
	div.image1 {left: -20px}
	div.image1 span {left: 20px; width: calc(100% - 20px); }
	div.image2 {right: -20px}
	div.image2 span {width: calc(100% - 20px); }
	div.intro { padding: 50px 20px 120px}
	div.content {padding: 50px 20px 400px; }

	div.slideshow { margin-top: -240px}
	div.content {padding: 100px 100px 300px; text-align: center;}
	div.slide { padding: 15px; }
	button.slick-arrow { bottom: 115px; }

	table.floorplans { max-width: 100%; margin-top: 50px;}
	div.suites, div.lofts { padding-bottom: 50px;}

	div.neighbourhoods > a { padding-left: 90px; min-height: 32px; margin: 10px 0px; font-size: 18px; line-height: 32px;}
	div.neighbourhoods > a:before { width: 70px; height: 32px; }

}
@media only screen and (max-width: 1080px) {
	table.floorplans th:nth-child(5), table.floorplans td:nth-child(5) { display: none !important}
	div.floorplan-details div.more-info > div { padding: 0 20px;} 
	div.floorplan-details div.more-info > div { font-size: 20px; }

	div.floorplan { padding: 0px 20px; }
	div.floorplan div.plan { padding-right: 40px;}
	div.floorplan div.actions { text-align: right; padding-right: 0}
	div.floorplan div.actions { top: 50px; right: 20px;}
	div.floorplan div.actions a { font-size: 14px;}
	div.floorplan div.actions a:after { width: 20px;height: 10px;}
	div.floorplan div.actions a { padding-right: 20px;}
	div.floorplan div.actions a:last-child { padding-right: 30px;}


}

@media only screen and (max-width: 980px) {
	header nav ul a {  font-size: 18px; font-weight: 500; line-height: 60px; padding-right: 30px; }

	h1 { font-size: 48px; }
	h1 span { font-size: 100px; margin-left: -10px;;}
	h1 small { font-size: 24px; }

	div.suites { margin-top: 0}

	h6 { font-size: 18px;}
	div.sales-team { padding: 15px}
	div.sales-team p { margin-bottom: 10px; line-height: 1.25;}
	a.btn { font-size: 14px;}
}

@media only screen and (max-width: 880px) {
	table.floorplans th:nth-child(4), table.floorplans td:nth-child(4) { display: none !important}

	div.floorplan-details div.more-info > div { display: block; max-width: 300px; margin: 0 auto 10px} 
	div.floorplan-details div.title { font-size: 40px}
	div.floorplan-details div.title:after { margin-top: 15px}

	div.floorplan div.plan { display: block; width: 100%; padding: 0;}
	div.floorplan div.keyplate { display: block; width: 100%; padding: 0; margin-top:50px}
	div.floorplan div.actions { position: relative; text-align: center; padding: 0; top: 0; right: 0; width: 100%; margin-top: 50px}
	div.masthead4 div.caption { position: relative; top:0; left: 0; transform: none !important; padding-top: 30px}
	div.masthead4 div.caption.bottom { margin-bottom: -100px}
	div.masthead4 div.caption-community img.logo { max-width: 15%; }


	#crmform .microsite-contact-form  div[data-editorblocktype="Field-text"] input, #crmform .microsite-contact-form  div[data-editorblocktype="Field-integer"] input, #crmform .microsite-contact-form  div[data-editorblocktype="Field-email"] input { margin-bottom: 10px !important; font-size: 16px !important;;}
	#crmform .microsite-contact-form input::-input-placeholder {  font-size: 16px !important; ;}
	#crmform .microsite-contact-form input::-webkit-input-placeholder {  font-size: 16px !important; }
	#crmform .microsite-contact-form input::-moz-placeholder {   font-size: 16px !important; }
	#crmform .microsite-contact-form input:-ms-input-placeholder {  font-size: 16px !important; }
	#crmform .microsite-contact-form button { line-height: 40px !important; width: 180px !important; font-size: 14px !important;  }
	#crmform .microsite-contact-form div[data-editorblocktype="Field-text"] { width: 100% !important; padding-right: 0 !important}
	#crmform .microsite-contact-form div[data-editorblocktype="Field-integer"] { width: 100% !important; padding-right: 0 !important}
	#crmform .microsite-contact-form div[data-editorblocktype="Field-email"] { width: 100% !important; padding-right: 0 !important}

}

@media only screen and (max-width: 760px) {
	header { padding-top: 80px; height: 160px;}
	header div.burger { display: block; top: 0; left: 0}
	header nav ul a {  font-size: 18px; font-weight: 500; line-height: 60px; padding-right: 30px; }
	header { position: fixed; top: 0; left: 0; }
	header nav { position: fixed; top: 0; left: 0; display: block; width: 100vw; padding-top: 60px; background-color: #22449C; left: -200vw; opacity: 0; height: 100vh; padding-top: 60px;}
	header nav ul li { display: block; width: 100%; }
	header nav ul li a { display: block; width: 100%; padding: 0 20px; line-height: 40px;}
	header.active nav { left: 0; opacity: 1}
	header div.logo { width: 60px; height: 60px; right: 20px; }
	header div.logo-brand { height: 40px; margin-bottom: 0px; }
	header.active div.logo-brand { display: none;}
	article { padding-top: 160px;}

	div.intro { background-color: #22449C; padding-top: 20px; padding-bottom: 20px; }
	div.intro img { display: block;}
	div.intro div.grid > div { display: block; width: 100%; margin-top: 20px}
	div.intro h2 br { display: none}
	article > section { padding: 0}
	div.suites { display: block; width: 100%; padding: 20px 20px 40px;}
	div.lofts { padding: 20px 20px 20px} 
	div.grid.grid-2c > div { display: block; width: 100% !important;}
	div.grid.grid-2b > div { display: block; width: 100% !important;}
	div.grid.grid-2c > div { padding:0}

	div.image1 {display: block; position: relative; left: 0px; margin-bottom: 40px}
	div.image1 span {display: none}
	div.image1 img {mix-blend-mode: normal;}
	div.image2 {display: block; position: relative; right: 0px; margin-top: 40px}
	div.image2 span {display: none}
	div.image2 img {mix-blend-mode: normal;}

	div.content { padding: 40px 20px}
	div.slideshow { margin-top: 20px}
	div.neighbourhoods { display: block; width: 100%; padding: 50px 0px 0px 40px}
	div.neighbourhoods > a { display: block; width: 100%; width: 350px; margin: 0 auto 10px; max-width: 100%}
	
	div.footer-form { padding: 50px 20px 20px}
	div.footer-form > div:first-child { display: block; width: 100%; position: relative; left: 0; height: auto; padding:0}
	div.footer-form > div:last-child { display: block; width: 100%; position: relative; margin: 0; padding:0}
	div.footer-form > div:first-child > div { display: block; height: auto; }
	div.footer-form > div:first-child > div:last-child { position: relative; left: 0; width: 100%}

	h6 { font-size: 24px;}
	div.sales-team { padding: 20px}
	div.sales-team p { margin-bottom: 20px; line-height: 1.33;}
	a.btn { font-size: 18px;}

	div.footer-form > div:first-child > div p.bold { text-align: center; padding: 0}

	div.slideshow > p, div.slide p { font-size: 14px;}
/*	div.slideshow > p { bottom: 40px}*/
	button.slick-arrow { bottom: 88px}

	div.floorplan-details div.title { font-size: 24px; margin-bottom: 30px}
	div.floorplan-details div.title:after { margin-top: 10px}
	div.floorplan-details div.name { font-size: 32px; margin-bottom: 30px}
	div.footer-form > div:first-child > div p.bold { top: 0; transform: none; margin-bottom: 30px; font-size: 20px;}

}

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

	table.floorplans th, table.floorplans td { font-size: 14px;}
	table.floorplans th:nth-child(6), table.floorplans td:nth-child(6) { display: none !important}
	div.footer-form div.grid > div { display: block; width: 100%;}
	div.footer-form div.grid > div img { display: block; width: 100%;}

	h6 { font-size: 24px; text-align: center;}
	div.sales-team { padding: 20px; text-align: center;}
	div.sales-team p { margin-bottom: 20px; line-height: 1.33; text-align: center;}
	a.btn { font-size: 18px; margin: 0 auto}

	h4 { font-size: 24px;}
	a.btn2 { font-size: 18px;}
	p { font-size: 16px;}

	div.floorplan-details div.info > div { font-size: 20px; padding: 0 15px;} 
	div.floorplan-details div.more-info > div > div span { font-size: 16px;}

}