/*
FONTS

font-family: trade-gothic-next;
font-family: trade-gothic-next-condensed;

font-family: trade-gothic-next-compressed

*/




/* VARIABLES */

:root {
  --default-font: trade-gothic-next;
  --default-font-size: 23px;
  --default-line-height: 1.5;

  --default-input-font: trade-gothic-next;
  --default-input-font-size: 18px;
  --dim-input-height: 60px;
  
  --button-input-font: trade-gothic-next;
  --button-font-size: 15px;
  --button-height: 60px;

  --col-primary: #E1001E;
  --col-accent: #000;
  --col-burger: #fff;
  --col-text: #000;
  --col-page-bg: #fff;
  --col-border: #CCCCCC;
  --col-input: #000;
  --col-placeholder: #000;
  --col-input-bg: #fff;
  --col-button: #fff;
  --col-button-bg: #E1001E;
  --col-link: #000;
  --col-link-hover: #000000;

  --col-error: #ff6633;
  --col-attention: #ff6633;
  --col-warning: #f5b00e;
  --col-missing: #ff6633;

  --col-primary-rgb: 225,0,30;
  --col-accent-rgb: 0, 0, 0;
  --col-button-rgb: 255, 255, 255;
  --col-link-rgb: 0,0,0;
  --col-link-hover-rgb: 0, 0, 0;
  --col-error-rgb: 255, 51, 0;
  --col-attention-rgb: 255, 51, 0;
  --col-warning-rgb: 245, 176, 14;
  --col-border-rgb: 190, 190, 190;
  --col-missing-rgb: 255, 51, 0;

  --dim-site-width: 1920px;
  --dim-default-space: 100px;

  --vh: 1vh;
}

/* theme */


/*CORE HTML*/

p { margin-bottom: 40px; font-weight: 400}
p a:hover { color: #aaa;}
a.underline { text-decoration: underline}

h1 { font-size: 200px; margin: 0 auto; text-align: left; color: #fff; line-height: 1; text-transform: uppercase;}
h2 { font-size: 75px; margin: 0 auto; text-align: left; color: #000; line-height: 1.1; text-transform: uppercase; margin-bottom: 40px; font-family: trade-gothic-next-condensed; font-weight: 700;}
h2.thin { font-family: trade-gothic-next; font-weight: 300;}
h3 { font-size: 40px; margin: 0 auto 20px; text-align: left; color: #000; line-height: 1.05;  text-transform: uppercase;}
h3.lighter { font-weight: 300}
h4 { font-weight: 300; font-size: 40px; margin: 0 auto 40px; text-align: left; color: #000; line-height: 1.25;  }

p.larger { font-size: 30px; line-height: 1.33}
p.largest { font-size: 40px; line-height: 1.25; font-weight: 300}
p.shorter { max-width: 1360px; margin-right: auto; margin-left: 0}
p.shortest { max-width: 740px; margin-right: auto; margin-left: 0; }
p.short { max-width: 880px; margin-right: auto; margin-left: 0}
p.bolder { font-family: trade-gothic-next-condensed;; font-size: 25px; text-transform: uppercase;}

/*CONTAINERS*/

article { padding-top: 0px; }
section { max-width: 1640px; }
section.full { max-width: 100%; }
section.masthead { max-width: 100%; }

/*BUTTONS*/

a.btn { text-transform: uppercase; color: #fff; font-size: 25px; font-weight: 700; display: table; font-family: trade-gothic-next-condensed; border: 1px solid #fff; line-height: 50px; letter-spacing: 2px;  text-transform: uppercase; background: transparent; margin: 0 auto 0 0; padding: 0 20px;position: relative;}
/*a.btn span { position: relative; z-index: 2;}*/
/*a.btn:hover { color: #000}*/
/*a.btn:hover { position: absolute; z-index: 1; background: #fff; content:""; display: block; height: 100%; width: 0px; top: 0; left: 0; opacity: 0}*/
/*a.btn:hover:after { width: 100%; transition: all .15s linear; opacity: 1;}*/
a.btn2 { text-transform: uppercase; color: #000; font-size: 25px; font-weight: 700; display: table; font-family: trade-gothic-next-condensed; border: 1px solid #000; line-height: 50px; letter-spacing: 2px;  text-transform: uppercase; background: transparent; margin: 0 auto 0 0; padding: 0 20px; position: relative;}
a.btn2 span { position: relative; z-index: 2;}
a.btn2:hover { color: #fff}
a.btn2:after { position: absolute; z-index: 1; background: #000; content:""; display: block; height: 100%; width: 0px; top: 0; left: 0; opacity: 0}
a.btn2:hover:after { width: 100%; transition: all .15s linear; opacity: 1;}
/*a.btn2 { text-transform: uppercase; color: var(--col-primary); font-size: 20px; font-weight: 700; display: block;}*/

/*HEADER AND NAV*/

header { position: absolute; width: 100%; top: 0; left: 0; padding: 0 20px; z-index: 9; padding-top: 0px;}
header.with-promo { padding-top: 80px;}
header > div { position: relative; width: 100%; max-width: 1640px; margin: 0 auto; }
header div.logo { position: absolute; left: 0; top: 42px; width: 160px; z-index: 3;}
header div.logo img { width: 100%; display: block}
header div.navigation { display: table; margin: 0 0 0 auto; z-index: 2;}
header div.navigation > div { display: flex; justify-content: flex-end;  align-items: flex-end; margin-bottom: 20px }
header nav { display: flex; justify-content: space-between; gap: 0; width: 100%}
header nav a { display: block; position: relative; font-weight: 700; font-size: 15px; color: #fff; padding-right: 58px; line-height: 20px; letter-spacing: 1px; text-transform: uppercase;}
header nav a.active { color: var(--col-primary)}
header nav a:hover { color: var(--col-primary)}
header nav a:after {content:""; display: block; width:  58px; position: absolute; right: 0; top: 0; height: 100%; background: url(/img/svg/white/dot.svg) no-repeat center center; background-size: 4px 4px; }
header nav a:last-child {padding-right: 0}
header nav a:last-child:after {display: none;}

header.attached {top: -300px; }
header.visible {position: fixed; background: #000; padding: 10px 0; top: 0; transition: top .3s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
header.visible > div { max-width: 100%}
header.visible div.logo { left: 20px; top: 2px; width: 65px;}
header.visible  div.navigation { display: flex; flex-direction: row-reverse; padding-left: 140px; justify-content: flex-start; gap: 40px}
header.visible  div.country-selector { display: none;}
header:not(.active).visible  div.quick-quote a > span:last-child { display: none;}
header:not(.active).visible  div.quick-quote a > span:first-child span:first-child { display: none;}
header:not(.active).visible  div.quick-quote a > span:first-child:after { display: none;}
header:not(.active).visible div.quick-quote a > span:first-child { padding: 0px 20px; display: block; line-height: 40px; color: var(--col-primary); font-family: trade-gothic-next-condensed; font-weight: 800}
header:not(.active).visible div.quick-quote a > span:first-child br { display: none;}
header:not(.active).visible div.quick-quote a { font-size: 18px; background: transparent;}
header.visible div.navigation > div { margin-bottom: 0}
header.visible nav a { line-height: 40px;}
header.visible nav a:hover { color: var(--col-primary)}

header div.promo-bar { position: absolute; top: 0px; left: 0; width: 100%; background: #000; z-index: 3; max-width: 100%; display: none;}
header div.promo-bar > div { max-width: 1640px; margin: 0 auto; height: 80px; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-right: 50px; position: relative;}
header div.promo-bar a { color: #fff; font-size: 37px; text-transform: uppercase;font-family: trade-gothic-next-condensed;}
header div.promo-bar a span { color: var(--col-primary); }
header div.promo-bar img.google-reviews { display: block;width: 330px; max-width: 100%; }
header div.promo-bar img.google-reviews { display: block;width: 330px; max-width: 100%; }
header div.promo-bar a.close-promo {position: absolute; right: 10px; top: 50%; transform: translateY(-50%); display: block;}
header div.promo-bar a.close-promo img { display: block; width: 100%;}

header.with-promo div.promo-bar { display: block; }

header.attached { padding-top: 0}
header.attached > div.promo-bar { display: none;}

div.country-selector { display: flex; height: 25px;}
div.country-selector a { padding: 0 50px; color: #fff; font-size: 18px; font-family: trade-gothic-next-condensed; font-weight: 700; line-height: 25px;}
div.country-selector a:first-child { padding-left: 0px; border-right: 2px solid #fff; }

div.quick-quote a { display: flex; padding: 0; gap: 0; background: #fff; align-items: center;  font-size: 30px; font-weight: 300; text-transform: uppercase; }
div.quick-quote a > span:first-child { display: block; color: #000; padding: 12px 25px 12px 75px; position: relative; text-transform: uppercase;}
div.quick-quote a > span:first-child:after { content:""; display: block; width: 48px; position: absolute; left: 12px; top: 0; height: 100%; background: url(/img/svg/phone.svg) no-repeat center center; background-size: 48px 48px; }
div.quick-quote a > span:last-child { display: block; padding: 15px 25px; text-align: center; color: #fff;background: var(--col-primary)}

footer {max-width: 100%; margin: 0 auto; background:url(/img/home/bg-footer5.jpg) no-repeat center center; background-size: cover; padding: 80px 0px 0}
footer > div:first-child {max-width: 1680px; margin: 0 auto; padding: 0 20px}
div.footer > div{ display: flex; gap:50px; justify-content:space-between; align-items: flex-start}
div.footer  div.social { display: flex; gap:30px; justify-content:flex-start; }
div.footer  div.social a { font-size: 20px; color: #fff;}
div.footer-nav  { display: flex; gap:0px; justify-content:flex-end; align-items: flex-start; }
div.footer-nav  > div  { display: block; position: relative; padding: 0 70px 0 0; }
div.footer-nav  > div  > a { font-weight: 700; font-size: 15px; color: #fff; line-height: 20px; letter-spacing: 1px; text-transform: uppercase;}
div.footer-nav  > div  > a:hover { color: var(--col-primary)}
div.footer-nav div:after {content:""; display: block; width:  70px; position: absolute; right: 0; top: 7px; height: 20px; background: url(/img/svg/white/dot.svg) no-repeat center center; background-size: 4px 4px; }
div.footer-nav div:last-child {padding-right: 0}
div.footer-nav div:last-child:after {display: none;}
div.footer-nav  > div  > div { display: block; }
div.footer-nav  > div  > div a { display: block; font-size: 15px; color: #fff; line-height: 20px; }
div.footer-nav  > div  > div a:hover { color: var(--col-primary)}
footer div.logos { display: flex; gap:56px; justify-content:flex-start; }
footer div.disclaimer { display: block; background: #000; width: 100%; height: 90px; margin-top: 55px}
footer div.disclaimer > div { display: flex; gap:0px; justify-content:space-between; background: #000; max-width: 1680px; padding: 0 20px; margin: 0 auto}
footer div.disclaimer > div > div { width: 50%; display: flex; gap:0px; justify-content: space-between}
footer div.disclaimer > div > div.disclaimer-left { padding-top: 30px; justify-content: flex-start; gap: 150px} 
footer div.disclaimer-last { padding-top: 30px; } 
footer div.disclaimer-left div:last-child { text-align: center} 
footer div.disclaimer-left p, footer div.disclaimer-left a { color: #fff; font-size: 15px} 
footer div.disclaimer-last p, footer div.disclaimer-last a { color: var(--col-primary); font-size: 15px} 


footer div.seo-links  { display: flex; gap: 0px; justify-content:flex-end; align-items: flex-start; margin-top: 40px;}
footer div.seo-links  a { display: block; position: relative; padding: 0 40px 0 0; }
footer div.seo-links  a { font-weight: 700; font-size: 15px; color: #fff; line-height: 20px; letter-spacing: 1px; text-transform: uppercase; font-weight: 300}
footer div.seo-links  a:hover { color: var(--col-primary)}
footer div.seo-links  a:after {content:""; display: block; width:  40px; position: absolute; right: 0; top: 0px; height: 20px; background: url(/img/svg/white/dot.svg) no-repeat center center; background-size: 4px 4px; }
footer div.seo-links  a:last-child {padding-right: 0}
footer div.seo-links  a:last-child:after {display: none;}


/*ELEMENTS*/
.c-primary { color: var(--col-primary) !important}
.c-black { color: #000 !important}
.c-white{ color: #fff !important}
.b-primary { background-color: var(--col-primary) !important}
.b-black { background-color: #000 !important}
.b-white { background-color: #fff !important}
.b-gray { background-color: #E0E0E0 !important}
.b-dark-gray { background-color: #2C2C2C !important}

/*CONTENT*/

div.subhead {font-family: trade-gothic-next-condensed; color: var(--col-primary); font-size: 25px; font-weight: 700; text-transform: uppercase; margin-bottom: 40px;}

div.custom-1 { display: flex; gap: 0}
div.custom-1 > div { width: 50%;}
div.custom-1 img { width: 100%;}
p.custom-2 { display: flex; gap: 10px; justify-content: center; align-items: center; color: #fff;}
div.home-projects { display: flex; gap: 0}
div.home-features { display: flex; gap: 0}
div.location-maps { display: flex; gap: 0}

div.home-projects > div { width: 20%;}
div.home-projects > div img { width: 100%; display: block}

div.custom-slider { position: absolute; top: 50%; left: 50%; transform: translate3D(-50%,-50%, 0); width: 600px; max-width: 80%; }

div.projects-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; row-gap: 16px; margin-bottom: 40px}
div.projects-grid a { position: relative; display: block; }
div.projects-grid a:after { content:""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;  background: transparent; mix-blend-mode: multiply; z-index: 2; transition: all .3s linear}
div.projects-grid a:hover:after { background: var(--col-primary); }
div.projects-grid a > div { display: block; width: 100%;  position: absolute; top: 50%; left: 0; text-align: center; z-index: 3; padding-left: 50px; transform: translate3D(0,-50%,0); opacity: 0}
div.projects-grid a:hover > div { opacity: 1; transition: opacity .3s linear}
div.projects-grid a div.city { font-size: 40px; color: #fff; font-weight: 300; text-align: left; text-transform: uppercase; }
div.projects-grid a div.info { font-size: 23px; color: #fff; font-weight: 400; text-align: left; text-transform: uppercase; }
div.projects-grid a div.size { font-size: 170px; color: #fff; font-weight: 300; text-align: left; line-height: .8; text-transform: uppercase; }
div.projects-grid a div.size small { font-size: 25px; color: #fff; }


p.custom-2 span:first-child { font-size: 200px; font-family: trade-gothic-next-condensed; font-weight: 700}
p.custom-2 span:last-child { font-size: 20px; font-family: trade-gothic-next-condensed; font-weight: 700}

section.masthead:after {content:""; display: block; position: absolute; z-index: 2; left: 0; top: 0; width: 100%; height: 100%; background: url(/img/svg/shadow.png) repeat-x center top; }

div.home-about {padding: 0px;}
div.home-about > img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
div.home-about > div:before {content:""; display: block; width: 100%; height: 12px; background: var(--col-primary); margin-bottom: 100px}
div.home-about > div { max-width: 1680px; margin: 0 auto; text-align: left; color: #fff; padding: 0 20px}
div.home-about p { max-width: 840px;margin-bottom: 40px;color: #fff; }
div.home-about p.largest { max-width: 1080px;}
div.home-about a.btn { margin-bottom: 230px;}

div.cities { display: flex; gap: 0; border-top: 1px solid #fff; width: 100%; justify-content: space-between;  }
div.cities span { line-height: 160px; text-transform: uppercase; color: #fff; font-size: 25px; font-weight: 700; display: block}

div.projects-grid-slider > div { padding-bottom: 20px}

div.patrick { margin-bottom: 180px;}
div.patrick p { margin-bottom: 10px;}
div.patrick p strong { text-transform: uppercase; font-family: trade-gothic-next-condensed; font-weight: 800; letter-spacing: 2px}
div.patrick a { margin-top: 40px; display: block; font-size: 30px} 

div.project-logos { max-width: 1680px;display: block; margin: 0 auto; padding: 50px 20px}
div.project-logos img { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity .5s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
div.project-logos img.active { position: relative; opacity: 1;}

div.built-ontario {padding:0; position:relative; overflow: hidden; height: 100%; background: #000; }
.built-ontario-track { position: absolute; top: 0; left: 0; display: flex; align-items: center; width: max-content; max-width: none; height: 100%; animation: built-ontario-scroll 30s linear infinite; }
.built-ontario-track > span { flex: 0 0 auto; padding-right: 80px; color: #fff; font-size: clamp(48px, 9vw, 130px); font-weight: 300; line-height: 1; text-transform: uppercase; white-space: nowrap; }
@keyframes built-ontario-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

div.registration-form > div { display: flex; gap: 0; padding: 75px 20px; max-width: 1680px; margin: 0 auto;}
div.registration-form > div > div { width: 45%;}
div.registration-form > div > div:first-child { padding-right: 100px; width: 55%;}
div.registration-form > img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
div.registration-form p.largest { max-width: 520px; margin: 0 auto 20px 0;}
div.registration-form p.conditions { font-size: 18px; margin-top: 100px}

div.iframe.vimeo.with-poster { width: 100%; height: 0; padding-top: 56.25%;}
div.iframe.vimeo.with-poster > img { width: 100%; height: 100%; object-fit: cover; position: absolute; object-position: center center; top :0; left: 0}
div.iframe.vimeo.with-poster > iframe { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
div.iframe.vimeo.with-poster.active > iframe { display: block}
div.iframe.vimeo.with-poster.active > img { display: none}
div.iframe.vimeo.with-poster.active > a { display: none}
div.iframe.vimeo.with-poster.active:after { content:""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 7; }
a.play-video { display: block; position: absolute;  top: 50%; left: 50%; transform: translate3D(-50%,-50%, 0); z-index: 6}

div.top-frame, div.bottom-frame { height: 100%; width: 100%; text-align: left;}
div.top-frame { position: absolute; ; z-index: 3; bottom: 0; left: 0; padding-top: 40px; padding-left: 85px; }
div.top-frame div.title { color:#fff; font-size: 75px; font-weight: 300; margin-bottom: 50px}
div.top-frame p { color: #fff; font-size: 25px; font-family: trade-gothic-next-condensed; font-weight: 700; margin-bottom: 50px; max-width: 450px; margin-right: auto; margin-left: 0}
/*div.top-frame a.btn { color: #fff; font-size: 25px; font-family: trade-gothic-next-condensed; font-weight: 700; margin-bottom: 50px}*/
div.bottom-frame { position: absolute; z-index: 2; bottom: 0; left: 0; transition: height .3s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
div.bottom-frame img { height: 100%; width: 100%;object-fit: cover; object-position: center bottom;}
div.bottom-frame p { position: absolute; top: 0; left: 85px; width: calc(100% - 170px); color: #fff; padding-top: 80px; display: none;}
/*.b-primary div.bottom-frame p { border-top: 30px solid #fff; }*/
div.bottom-frame div.animation { position: absolute; bottom: 0; left: 0px; width: 100%; display: none; overflow: hidden;}
div.bottom-frame:after { content:""; display: block; bottom: 85px; left: 85px; width: 136px; height: 136px; position: absolute; background: url(/img/svg/white/plus.svg) no-repeat center center; background-size: contain; z-index: 5;}
div.bottom-frame:before { content:""; display: block; bottom: 147px; left: 85px; width: 136px; height: 12px; position: absolute; background: #fff; z-index: 4; }
div.home-features > div:hover div.bottom-frame:before { bottom: calc(100% - 40px); width: calc(100% - 170px);; height: 40px; transition: all .3s ease-in; background: var(--col-primary)}
div.home-features > div.b-primary:hover div.bottom-frame:before { background: #fff}
div.home-features > div { width: 33.33%; background: #2C2C2C; height: 917px}
div.home-features > div:hover div.bottom-frame {height: 50%;position: absolute; }
div.home-features > div:hover div.bottom-frame p { display: block}
div.home-features > div:hover div.bottom-frame div.animation { display: flex}
div.home-features > div:hover div.bottom-frame:after { display: none;}

div.animation > div { max-width: 10000px; position: relative;}
div.animation > div { display: flex; gap: 20px; justify-content: flex-start; transition: none}
div.animation > div.active { transition: left 1s linear}
div.animation > div > div { display: flex; gap: 20px; justify-content: flex-start;}
div.animation span { display: block; font-size: 40px; font-family: trade-gothic-next-condensed; font-weight: 800; text-transform: uppercase; color: #fff; white-space: nowrap}

div.testimonials-slider { max-width: 1280px; margin: 0 auto}
div.testimonials-slider div.title { margin: 0 auto; display: block; margin-bottom: 20px}
div.testimonials-slider img  { height: 100px; margin: 0 auto; display: block; margin-bottom: 20px}
div.testimonials-slider div.slick-slide { text-align: center;}
div.testimonials-slider div.slick-slide img { margin: 0 auto 20px;}
div.slick-list { padding-bottom: 40px}
div.custom-1 div.slick-list { padding-bottom: 0px}
div.testimonials-slider ul.slick-dots { bottom: 0}
ul.slick-dots li button {width: 19px; height: 19px; border: 1px solid #000; background: transparent; border-radius: 19px; cursor: pointer;}
ul.slick-dots li.slick-active button {border: 1px solid var(--col-primary); background: var(--col-primary)}


div.location-address { width: 410px; padding: 25px; text-align: center; background: var(--col-primary); position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 3; max-width: 50%;}
div.location-address * { color: #fff;}
div.location-maps > div {position: relative}
div.location-maps > div:last-child div.location-address { background: #2C2C2C}
div.location-maps > div:last-child div.location-address div.title { color: var(--col-primary)}
div.location-maps > div:last-child:after {content:""; background: rgba(244, 244, 244, 1); mix-blend-mode: multiply; display: block; position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%}
div.location-maps div.title {font-size: 25px; font-family: trade-gothic-next-condensed; font-weight: 800; margin-bottom: 15px;}
div.location-maps p {font-size: 20px; }

div.masthead {width: 100%; height: calc(100 * var(--vh)); position: relative}
div.masthead.masthead-red:after {content:""; background: var(--col-primary); position: absolute; display: block; width: 100%; height: 100%; z-index: 2; mix-blend-mode: multiply; left: 0; top: 0 }
div.masthead img {width: 100%; height: 100%; object-fit: cover; object-position: center center;}
img.bg-image {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center;}

div.masthead-short { height: calc(70 * var(--vh)) !important;}
/*div.masthead-short > img { display: block; width: 100%; height: auto; object-fit: intherit; }*/

div.caption-masthead-center { position: absolute; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); z-index: 3; width: 100%; padding-top: 104px}
div.caption-masthead-center h1 { color: #fff; font-size: 200px; text-align: center; text-transform: uppercase; margin-bottom: 20px; line-height: 1; font-weight: 300;}
div.caption-masthead-center h1 small { font-size: .2em; display: block; line-height: 1.2;}
div.masthead div.caption-masthead-center a.scrolling img {width: 50px; height: auto;object-fit: inherit; margin: 0 auto}

div.caption-short { max-width: 820px; margin: 0 auto 0 0; text-align: left;}
div.caption-short h2 { font-size: 40px; font-weight: 300; font-family: trade-gothic-next;}
div.seo-3 {  text-align: center; margin: 0 auto; display: block; max-width: 1140px; padding: 200px 30px}
div.seo-3 h2 { font-size: 75px; font-weight: 300; font-family: trade-gothic-next; text-align: center;}
div.seo-3 a.btn { margin: 40px auto }
p.heavy {font-weight: 700; font-size: 40px; margin-top: 40px; text-transform: uppercase;font-family: trade-gothic-next-condensed;}
div.seo-1 { text-align: center;padding: 180px 30px; display: block; margin: 0 auto}
div.seo-1 h3 { text-align: center;font-weight: 700; }
div.seo-2 {  text-align: center; margin: 0 auto; display: block; max-width: 1140px; padding: 200px 30px}
div.seo-2 h2 { font-size: 200px; font-weight: 300; font-family: trade-gothic-next; text-align: center; line-height: 1;}
div.seo-2 h2 span { font-size: .2em; display: block;}
div.seo-2 p { max-width: 610px; margin: 0 auto 40px;}
div.seo-2 a.btn { margin: 40px auto }

div.caption-masthead { position: absolute; bottom: 0; left: 0; width: 100%; bottom: 0px;z-index: 3;}
div.caption-masthead h1 { width: calc(100% - 40px); max-width: 1640px; margin: 0 auto; padding-bottom: 64px; color: #fff; text-align: left; position: relative;}
div.caption-masthead h1 small { display: block; font-size: 0.2em; font-weight: 300;}
div.caption-masthead h1:after { content:""; width: 1px; height: 16px; background: var(--col-primary); position: absolute; left: 0; bottom: 0; display: block; transition: width .6s cubic-bezier(0.250, 0.460, 0.450, 0.940) .5s; }
div.masthead.masthead-red h1:after { background: #fff}
.in-view div.caption-masthead h1:after { width: 100%; }

div.content { max-width: 1680px; margin: 0 auto; padding: 120px 20px 0; min-height: 1080px}
div.content-tall { max-width: 1680px; margin: 0 auto; padding: 120px 20px 200px; min-height: 1380px}
div.content2 { max-width: 1680px; margin: 0 auto; padding: 120px 20px 80px; }
div.content2 + div.content2 { padding-top: 0}

div.plus-content { margin-top: 100px}
div.plus-content > div { opacity: 0; transition: opacity .3s cubic-bezier(0.250, 0.460, 0.450, 0.940); padding-bottom: 40px; }
div.plus-content.open > div { opacity: 1;}
a.plus-content {padding-left: 140px; font-size: 25px; font-family: trade-gothic-next-condensed; display: block; font-weight: 800; line-height: 1.4; margin-bottom: 40px}
a.plus-content:before {content:""; width: 100px; height: 100px; left: 0; top: 0; position: absolute; display: block; background: url(/img/svg/plus.svg) no-repeat center center; background-size: contain; transition: all .3s linear;}
.open a.plus-content:before {background-image: url(/img/svg/minus.svg)}
a.plus-content:hover:before {left: 15px;}
.p-white a.plus-content { color: #fff}
.p-white a.plus-content:before {filter: invert(1)}

div.inner-nav { display: flex; gap: 0; border-top: 1px solid #000; width: 100%; justify-content: space-between;  max-width: 1640px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
div.inner-nav span, div.inner-nav a { line-height: 160px; text-transform: uppercase; color: #000; font-size: 25px; font-weight: 700; display: block}
div.inner-nav a:hover { color: var(--col-primary) !important}
div.inner-nav.n-white { border-top: 1px solid #fff; }
div.inner-nav.n-white span, div.inner-nav.n-white a { color: #fff; }

div.projects { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; row-gap: 20px; column-gap: 16px; padding-bottom: 200px;}
div.projects a { display: block}
div.projects a > div { display: none}
div.projects a img { display: block; width: 100%; height: 100%; object-fit: cover;}
div.projects a:hover { display: block}

div.project { display: none; width: 100%; top: 0; left: -200vw;  z-index: 2; opacity: 0; max-width: 1440px;}
div.project > img { display: block; width: 100%;}
div.project.active { display: block; left: 0; opacity: 1; top: 50%; left: 50%; transform: translate3D(-50%, -50%, 0); }
div.project:after { content:""; display: block; width: 0%; height: 100%; position: absolute; top: 0; right: 0;  background: var(--col-primary); mix-blend-mode: multiply; z-index: 2;}
div.project.active:after { width: 50%; transition: all .3s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
div.project > div { display: block; width: 50%;  position: absolute; bottom: -500px; left: 50%; text-align: center; z-index: 3; padding: 90px 80px; opacity: 0; transition: all .4s cubic-bezier(0.250, 0.460, 0.450, 0.940) .3s;}
div.project.active > div { bottom: -0px; opacity: 1}
div.project div.city { font-size: 36px; color: #fff; font-weight: 300; text-align: left; text-transform: uppercase;  margin-bottom: 5px}
div.project div.info { font-size: 20px; color: #fff; font-weight: 400; text-align: left; }
div.project div.size { font-size: 170px; color: #fff; font-weight: 300; text-align: left; line-height: .9; text-transform: uppercase; }
div.project div.size sup { font-size: 25px; color: #fff; vertical-align: top; font-family: trade-gothic-next-condensed; font-weight: 800}
a.close-project { position: absolute; z-index: 5; right: 40px; top: 40px; width: 30px; display: block;}

div.grid-list { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; row-gap: 40px; column-gap: 80px;}
div.grid-list.grid-list-3 { grid-template-columns: 1fr 1fr 1fr;}
div.grid-list span { display: block; }
div.grid-list span.red { color: var(--col-primary) !important}
.p-white div.grid-list p { color: #fff;}

div.grid-1 { display: flex; justify-content: space-between; gap: 150px;}
div.grid-1 > div { width: 50%}

div.grid-vertical { display: flex; flex-direction: column; justify-content: space-between}

ul:not(.slick-dots) { list-style-type: none; margin-bottom: 40px}
ul:not(.slick-dots) li { padding-left: 18px; position: relative; font-size: 23px; margin-bottom: 10px; line-height: 1.33}
ul.l-large li { font-size: 40px; }
ul.l-white li { color:#fff;}
ul:not(.slick-dots) li:before { content:""; display: block; position: absolute; left: 0;  height: 6px; width: 6px; top: .5em; background: var(--col-primary); border-radius: 6px; font-weight: 400; font-family: trade-gothic-next;}
ul.l-white-bullets li:before { background: #fff}

.triangle-gray:after { content:""; display: block; width: 0px; height: 0px; border-style: solid; border-width: 0 61px 38px 61px; border-color: transparent transparent #E0E0E0 transparent; transform: rotate(180deg); position: absolute; left: 140px; top: -100px; z-index: 4; opacity: 0}
.triangle-white:after { content:""; display: block; width: 0px; height: 0px; border-style: solid; border-width: 0 61px 38px 61px; border-color: transparent transparent #fff transparent; transform: rotate(180deg); position: absolute; left: 140px; top: -100px; z-index: 4; opacity: 0}
.triangle-black:after { content:""; display: block; width: 0px; height: 0px; border-style: solid; border-width: 0 61px 38px 61px; border-color: transparent transparent #000 transparent; transform: rotate(180deg); position: absolute; left: 140px; top: -100px; z-index: 4; opacity: 0}

.in-view.triangle-gray:after { opacity: 1; top: 0; transition: opacity .01s linear 1s, top .3s linear 1s}
.in-view.triangle-white:after { opacity: 1; top: 0; transition: opacity .01s linear 1s, top .3s linear 1s}
.in-view.triangle-black:after { opacity: 1; top: 0; transition: opacity .01s linear 1s, top .3s linear 1s}


div.images-1 { display: flex; justify-content: space-between; gap: 16px; margin-top: 80px; padding-bottom: 80px;}
div.images-2 { display: flex; justify-content: space-between; gap: 16px; margin-top: 80px; padding-bottom: 70px;}

div.big-text-1 {display: block; margin-top: -540px; width: 100%; margin-bottom: 20px}
div.big-text-1 span {font-size: 200px; font-family: trade-gothic-next-condensed; font-weight: 700; line-height: 0.8;color: #E0E0E0}
div.custom-2 { padding: 40px 20px 140px; text-align: center;}
div.custom-2 p { color: #fff; margin-left: auto; margin-right: auto; padding: 0 20px; letter-spacing: 1px}
div.big-text-2 {display: block; width: 100%; }
div.big-text-2 span {font-size: 200px; font-family: trade-gothic-next-condensed; font-weight: 700; line-height: 0.8;color: #E0E0E0}
div.big-text-1 img { display: block; width: 320px; margin-bottom: 20px}

div.position-list { display: flex;flex-direction: column; gap: 0; align-items: flex-start; }
div.position-list a { display: block; font-size: 23px; color: #fff; padding: 12px 0; border-bottom: 1px solid #fff; text-transform: uppercase;width: 400px; max-width: 100%;}

div.file-upload label { background: #E0E0E0; padding-left: 16px; padding-right: 52px; width: 172px}
div.file-upload label:after { width: 21px; height: 100%; left: auto; right: 14px; }

form.f-white div.checkbox label {color: #fff;}
form.f-white div.checkbox label:before {border-color: #fff;}
form.f-white div.checkbox input:checked + label:before {background-image: url(/lib/img/white/checkmark.svg)}
form.f-white input[type="text"], form.f-white input[type="email"] {background: transparent; color: #fff;}
form.f-white *::-webkit-input-placeholder {  color: #fff;}
form.f-white *::-moz-placeholder {  color: #fff;}
form.f-white *:-ms-input-placeholder {  color: #fff;}
form.f-white button[type="submit"], form.f-white button[type="button"] {background: transparent; color: #fff; border: 1px solid #fff; }
form.f-white .select2-container--default .select2-selection--single { background: transparent; border: 1px solid #fff; }
form.f-white .select2-container--default .select2-selection--single .select2-selection__rendered { color: #fff;}
form.f-white .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #fff;}
form.f-white .select2-container--default .select2-selection--single .select2-selection__arrow { background-image: url(/img/svg/down-arrow.svg)}
.select2-container--default .select2-results>.select2-results__options { max-height: 250px;}
.select2-results__option {text-transform: none !important; margin-bottom: 0 !important; padding: 10px !important;}
ul.select2-results__options { margin-bottom: 0 !important;}
.select2-results__option:before {display: none !important; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { color: var(--col-primary); background: #fff}

div.grid-address {display: flex; gap: 30px; justify-content: flex-start; align-items: flex-start; }
div.grid-address * { color: #fff; font-size: 23px;}
div.grid-address p { }
div.grid-address a { border-right: 1px solid #fff; padding-right: 30px; line-height: 1.5}
p.address-disclaimer { color:#fff; font-size: 18px; padding-top: 20px; border-top: 1px solid #fff; margin-top: 80px;}
div.grid-contact { display: flex; justify-content: space-between; gap: 100px;}
div.grid-contact > div { width: 60%}
div.grid-contact > div:last-child { width: 40%}
div.grid-contact div.checkbox label {color: #fff;}
div.grid-contact div.checkbox label:before {border-color: #fff;}
div.grid-contact button[type="submit"] {background: transparent; color: #fff; border: 1px solid #fff; }

ul.custom-4 p { display: block; position: absolute; right: 0; top: 0; max-width: 50%; text-align: left; opacity: 0; color: #fff; transition: opacity .2s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
ul.custom-4 { position: relative; width: 100%; margin-top: 70px}
ul.custom-4 li { margin-bottom: 20px; padding-bottom: 20px; color:#fff; position: static; display: flex; gap: 10px; max-width: 45%;}
ul.custom-4  li:before { content:""; display: inline-block; width: 6px; background: var(--col-primary); border-radius: 6px; font-weight: 400; font-family: trade-gothic-next; position: relative;}
ul.custom-4 li:hover { color: var(--col-primary);}
ul.custom-4 li:hover p { opacity: 1;}


div.js-accordion h4 { padding-left: 48px; position: relative; min-height: 50px; cursor: pointer;}
div.js-accordion h4 span { position: absolute; top: 0; left: 0; height: 50px; width: 18px; display: block; background: url(/img/svg/red/plus.svg) no-repeat center center; top: 0; left: 0}
div.js-accordion h4.ui-accordion-header-active span { background-image: url(/img/svg/red/minus.svg);}
div.ui-accordion-content-active { padding-bottom: 40px}

div.grid-news { display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap: 120px; row-gap: 60px;}
div.grid-news > div { display: flex; flex-direction: column; gap: 40px; justify-content: space-between; align-items: flex-start;}
div.grid-news div.title { font-size: 30px; font-weight: 300; line-height: 1.33;}

div.grid-news-large { display: flex; gap: 40px; justify-content: space-between; margin-bottom: 150px}
div.grid-news-large > div { width: 50%;}
div.grid-news-large div.photo { margin-bottom: 40px;}
div.grid-news-large div.photo img { display: block; width: 100%;}
div.grid-news-large div.title { font-size: 40px; font-weight: 300; line-height: 1.25;}
div.grid-news-large div.details { display: flex; flex-direction: column; gap: 40px; justify-content: space-between; align-items: flex-start;}

div.two-columns { column-count: 2; column-gap: 72px; margin-top: 54px}
div.press-footer { display: flex; gap: 72px; justify-content: space-between; margin-top: 120px}
div.press-footer > div { width: 50%}

div.picture-caption span { font-size: 18px; display: block; margin-top: 20px;}
div.picture-caption img { display: block;}

a.big-cta { font-size: 140px; color: var(--col-primary); font-family: trade-gothic-next-condensed; font-weight: 700; text-transform: uppercase; display: block; position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center;}
a.big-cta:hover { color: #000}

div.leading-the-way-text { max-width: 1700px; padding: 50px 30px 75px; margin: 0 auto; text-align: left;}
div.leading-the-way-text p { display: none;}
div.leading-the-way-text p.visible, div.leading-the-way-text.open p { display: block;}
div.leading-the-way-text a.expand { margin: 56px auto 0 0;}
div.leading-the-way-text a.expand img:nth-child(2) { display: none;}
div.leading-the-way-text.open a.expand img:nth-child(2) { display: block;}
div.leading-the-way-text.open a.expand img:nth-child(1) { display: none;}
div.leading-the-way > img { display: block; width: 100%; }
div.leading-the-way div.caption { top: 50%; left:50% ; transform: translate3D(-50%, -50%, 0); max-width: 1700px; padding: 0 30px;}
div.leading-the-way div.caption * { color: #fff; }
div.leading-the-way div.caption > div { display: flex; gap: 20px; justify-content: flex-start; align-items: flex-start; max-width: 1360px; margin: 0 auto 0 0 }
div.leading-the-way div.caption span:first-child { width: 250px; padding-top: 10px}
div.leading-the-way div.caption span:last-child { flex: 1}
div.leading-the-way div.caption span:first-child {font-size: 25px; /* font-family: trade-gothic-next-condensed; */ font-weight: 300; text-transform: uppercase;}
div.leading-the-way div.caption span:last-child {font-size: 70px; font-weight: 300; line-height: 1; text-transform: uppercase;}

div.cities-slider { width: 100%; overflow: hidden; border-top: 1px solid #fff; }
div.cities-slider a { line-height: 160px; text-transform: uppercase; color: #fff; font-size: 25px; font-weight: 700; display: block; text-align: center;}

/*FORMS*/
input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"], textarea { border-radius: 0px}
textarea { height: 240px}
div.field.form-footer { display: flex; justify-content: space-between; gap: 30px; align-items: center; margin-top: 40px}
button[type="submit"], form button[type="button"] { text-transform: uppercase; color: #000; font-size: 25px; font-weight: 800; display: table; font-family: trade-gothic-next-condensed; border: 1px solid #000; line-height: 50px; letter-spacing: 2px;  text-transform: uppercase; background: transparent; margin: 0 0  0 auto; padding: 0 20px;}
button[type="submit"]:hover { color: #fff; background: #000; transition: all .5s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
/*button[type="submit"]:hover:before { content:""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: block; background: #000; color: #fff; z-index: 0}*/
div.checkbox label:before { width: 20px; height: 20px; border-radius: 0px; border-color: #000}
div.checkbox label { padding-left: 35px;font-size: 12px; padding-top: 0px}

div.reveal-response p { text-align: left; font-size: 24px; }
.f-white div.reveal-response p { color: #fff;}

/*ANIMATIONS*/

.slide-in-bottom { transform: translateY(300px); opacity: 0;}
.slide-in-top { transform: translateY(-300px); opacity: 0;}
.in-better-view.slide-in-bottom {opacity: 1;	animation: slide-in-bottom 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.in-better-view .slide-in-bottom {	opacity: 1; animation: slide-in-bottom 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.in-better-view .slide-in-top {	opacity: 1;animation: slide-in-top 0.9s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
@keyframes slide-in-top {
  0% { transform: translateY(-300px); opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}

@keyframes slide-in-bottom {
  0% {transform: translateY(300px);opacity: 0;  }
  100% { transform: translateY(0);opacity: 1;
  }
}


@media only screen and (max-height: 800px) {
	div.caption-masthead-center h1 { font-size: 140px}
	div.caption-masthead-center h1 small { font-size: .25em; }
}
@media only screen and (max-height: 700px) {
	div.caption-masthead-center h1 { font-size: 100px}
	div.caption-masthead-center h1 small { font-size: .25em; }
}
@media only screen and (max-width: 1720px) {

		:root {
		  --default-font-size: 20px;
		  --default-line-height: 1.4;

		  --default-input-font-size: 18px;
		  --dim-input-height: 60px;
		  
		  --button-font-size: 15px;
		  --button-height: 60px;
		  }

	section:not(.full):not(.max):not(.masthead), div.home-about > div, div.registration-form > div,div.project-logos	,div.content-tall, div.inner-nav, div.content,div.content2	{ padding-left: 40px; padding-right: 40px;}
	div.caption-masthead h1 { width: calc(100% - 80px); }
	div.content-tall { padding-bottom: 150px;}
	div.content-tall, div.content { min-height: 980px}

		header div.logo { top: 13px;}
		footer div.disclaimer { height: auto; min-height: 65px;}

		div.quick-quote a { font-size: 20px; }
		div.quick-quote a > span:first-child { padding: 10px 20px 10px 60px; }
		div.quick-quote a > span:first-child:after { width: 32px; left: 10px; background-size: 32px 32px; }
		div.quick-quote a > span:last-child { padding: 12px 20px; }


		h1 { font-size: 160px;}
		h2 { font-size: 64px; margin-bottom: 32px; }
		h3 { font-size: 32px; }
		h4 { font-size: 25px; margin: 0 auto 25px; }

		p.larger { font-size: 25px; line-height: 1.33}
		p.largest { font-size: 32px; line-height: 1.25; }
		p.bolder { font-size: 22px; }
		a.btn { font-size: 22px; line-height: 44px; letter-spacing: 1px;  }
		a.btn2 { font-size: 22px; line-height: 44px; letter-spacing: 1px;  }

		div.subhead {font-size: 22px; margin-bottom: 32px;}
		div.projects-grid a div.city { font-size: 32px; }
		div.projects-grid a div.info { font-size: 18px;}
		div.projects-grid a div.size { font-size: 150px; line-height: .8}
		div.projects-grid a div.size small { font-size: 22px; }
		p.custom-2 span:first-child { font-size: 148px; }
		p.custom-2 span:last-child { font-size: 16px; }
		div.cities span { line-height: 120px; font-size: 22px; }
		div.cities-slider a { line-height: 120px; font-size: 22px; }
		div.registration-form p.conditions { font-size: 18px; margin-top: 100px}
		div.top-frame div.title { font-size: 64px; margin-bottom: 40px}
		div.top-frame p { font-size: 22px; margin-bottom: 40px; }
		div.animation span { font-size: 32px; }
		div.location-maps div.title {font-size: 22px; margin-bottom: 15px;}
		div.location-maps p {font-size: 16px; }
		a.plus-content {padding-left: 120px; font-size: 22px; line-height: 1.4; margin-bottom: 32px}
		div.inner-nav span, div.inner-nav a { line-height: 120px; font-size: 22px; }
		div.project div.city { font-size: 32px; margin-bottom: 3px}
		div.project div.info { font-size: 18px;}
		div.project div.size { font-size: 128px; line-height: .9; }
		div.project div.size sup { font-size: 22px; }
		ul:not(.slick-dots) li { padding-left: 18px; font-size: 20px; margin-bottom: 10px; line-height: 1.33}
		ul.l-large li { font-size: 32px; }
		div.big-text-1 span {font-size: 160px; line-height: 0.8;}
		div.big-text-2 span {font-size: 160px; line-height: 0.8;}
		div.position-list a { font-size: 20px; padding: 12px 0; }
		div.grid-address * { font-size: 20px;}
		p.address-disclaimer { font-size: 18px; padding-top: 20px; margin-top: 80px;}
		button[type="submit"], form button[type="button"] { font-size: 22px; line-height: 44px; letter-spacing: 1px;  padding: 0 20px;}

		a.plus-content:before {width: 72px; height: 72px; }
		a.plus-content:hover:before {left: 10px;}
		div.location-address { padding: 20px;}

		div.top-frame { padding-left: 60px; padding-top: 30px}
		div.bottom-frame:after { bottom: 60px; left: 60px; width: 96px; height: 96px; }
		div.bottom-frame:before { bottom: 105px; left: 60px; width: 96px; height: 8px; }
		div.home-features > div:hover div.bottom-frame:before { bottom: calc(100% - 30px); width: calc(100% - 120px);; height: 30px; }
		div.home-features > div { height: 800px}
		div.bottom-frame p { left: 60px; width: calc(100% - 120px); padding-top: 60px; }

		div.plus-content > div { max-height: 0; padding-bottom: 0}
		div.plus-content.open > div { max-height: 1000px; padding-bottom: 40px}

		div.grid-1 { gap: 120px;}

		div.inner-nav span, div.inner-nav a, div.cities span, div.cities-slider a { line-height: 60px; font-size: 16px; }

		div.grid-news { grid-template-columns: 1fr 1fr 1fr; column-gap: 80px; row-gap: 50px;}
		div.grid-news > div { gap: 30px; }
		div.grid-news div.title { font-size: 24px; }

		div.grid-news-large { gap: 20px; margin-bottom: 100px}
		div.grid-news-large div.photo { margin-bottom: 30px;}
		div.grid-news-large div.title { font-size: 24px; }
		div.grid-news-large div.details { gap: 30px; }

		div.two-columns { column-gap: 50px; margin-top: 50px}
		div.press-footer { gap: 50px; margin-top: 100px}

		a.big-cta { font-size: 8vw}

		div.projects-grid a div { padding-left: 20px;}
		div.projects-grid a div.city { font-size: 24px; }
		div.projects-grid a div.info { font-size: 14px;}
		div.projects-grid a div.size { font-size: 76px; line-height: .8; }

		div.leading-the-way-text a.expand { margin: 40px auto 0 0; width: 150px}
		div.leading-the-way-text a.expand img { width: 150px}
		div.leading-the-way div.caption span:first-child { padding-top: 10px; width: 200px}
		div.leading-the-way div.caption span:first-child {font-size: 20px; }
		div.leading-the-way div.caption span:last-child {font-size: 58px; }

}

@media only screen and (max-width: 1440px) {
footer div.seo-links  { gap: 10px; justify-content: space-between; width: 100%}
footer div.seo-links  a { padding: 0; }
footer div.seo-links  a { font-size: 14px; line-height: 16px; letter-spacing: 0px; }
footer div.seo-links  a:after {display: none;}

div.patrick { margin-bottom: 100px;}
div.patrick a { margin-top: 30px; display: block; font-size: 24px} 

}
@media only screen and (max-width: 1280px) {

		h1 { font-size: 120px;}

		header div.logo { top: 18px; width: 132px; }
		header div.navigation > div { margin-bottom: 15px }
		header nav a { font-size: 14px; padding-right: 24px; line-height: 18px; }
		header nav a:after {width:  24px; background-size: 3px 3px; }
		header nav a:last-child {padding-right: 0}

		header:not(.active).visible {padding: 10px 0; }
		header:not(.active).visible div.logo { left: 20px; top: 2px; width: 50px;}
		header:not(.active).visible  div.navigation { padding-left: 80px; gap: 20px}
		header:not(.active).visible div.quick-quote a > span:first-child { padding: 0px 20px; display: block; line-height: 40px; color: var(--col-primary); font-family: trade-gothic-next-condensed; font-weight: 800}
		header:not(.active).visible div.quick-quote a > span:first-child br { display: none;}
		header:not(.active).visible div.quick-quote a { font-size: 18px; }
		header:not(.active).visible nav a { line-height: 32px;}

		div.country-selector { display: flex; height: 25px;}
		div.country-selector a { padding: 0 40px; font-size: 16px; line-height: 18px;}
		div.country-selector a:first-child { border-right: 1px solid #fff; }

		div.quick-quote a { font-size: 18px; }
		div.quick-quote a > span:first-child { padding: 10px 16px 10px 50px; }
		div.quick-quote a > span:first-child:after { width: 26px; left: 10px; background-size: 26px 26px; }
		div.quick-quote a > span:last-child { padding: 12px 15px; }

		footer {padding: 50px 0px 0}
		div.footer > div{ gap:30px; }
		div.footer  div.social { gap:15px; }
		div.footer  div.social a { font-size: 16px; }
		div.footer-nav  > div  { padding: 0 40px 0 0; }
		div.footer-nav  > div  > a { font-size: 14px; line-height: 18px; letter-spacing: 0px; }
		div.footer-nav div:after {width:  40px; top: 0px; height: 18px; background: url(/img/svg/white/dot.svg) no-repeat center center; background-size: 3px 3px; }
		div.footer-nav div:last-child {padding-right: 0}
		div.footer-nav  > div  > div a { font-size: 14px; line-height: 18px; }
		footer div.logos { display: flex; gap:30px; }
		footer div.disclaimer { margin-top: 40px}
		footer div.disclaimer > div > div.disclaimer-left { padding-top: 20px; gap: 50px} 
		footer div.disclaimer-last { padding-top: 20px; } 
		footer div.disclaimer-left p, footer div.disclaimer-left a { font-size: 13px} 
		footer div.disclaimer-last p, footer div.disclaimer-last a {font-size: 13px} 

		div.grid-list {   row-gap: 40px; column-gap: 40px;}

		div.project > div { padding: 40px}
		div.project div.size { font-size: 96px;}
		div.project div.size sup { font-size: 18px;}

		div.big-text-1 span, div.big-text-2 span { font-size: 132px;}
		div.big-text-1 { margin-top: -420px}

		div.grid-1 { gap: 80px; padding-bottom: 40px}
		div.grid-contact { gap: 50px}

		div.leading-the-way-text a.expand { margin: 30px auto 0 0; width: 120px}
		div.leading-the-way-text a.expand img { width: 120px}
		div.leading-the-way div.caption span:first-child { padding-top: 5px; width: 160px}
		div.leading-the-way div.caption span:first-child {font-size: 16px; }
		div.leading-the-way div.caption span:last-child {font-size: 40px; }

		div.caption-masthead-center h1 { font-size: 120px;}
		div.caption-masthead-center h1 small { font-size: .25em; }
		div.masthead div.caption-masthead-center a.scrolling img {width: 30px; }
		div.caption-short { margin: 0 auto; text-align: center;}
		div.caption-short h2 { font-size: 32px; text-align: center;}
		div.caption-short a { margin: 0 auto}
		div.seo-3 h2 { font-size: 48px; }
		div.seo-3 a.btn { margin: 30px auto }
		p.heavy {font-size: 24px; margin-top: 30px; }
		div.seo-1 { padding: 100px 30px; }
		div.seo-2 h2 { font-size: 120px; }
		div.seo-2 h2 span { font-size: .25em; }
		div.seo-2 p {  margin: 0 auto 30px;}
		div.seo-2 a.btn { margin: 30px auto }

}

@media only screen and (max-width: 1080px) {

		:root {
		  --default-font-size: 16px;
		  --default-line-height: 1.4;

		  --default-input-font-size: 16px;
		  --dim-input-height: 60px;
		  
		  --button-font-size: 14px;
		  --button-height: 60px;
		  }

		section:not(.full):not(.max):not(.masthead), div.home-about > div, div.registration-form > div,div.project-logos	,div.content-tall, div.inner-nav, div.content,div.content2	{ padding-left: 20px; padding-right: 20px;}
		div.caption-masthead h1 { width: calc(100% - 40px); }
		div.content-tall { padding-bottom: 120px;}
		div.content-tall, div.content { min-height: 680px}
		div.big-text-1 { margin-top: -250px; }

		h1 { font-size: 72px;}
		h2 { font-size: 48px; margin-bottom: 25px; }
		h3 { font-size: 24px; }
		h4 { font-size: 20px; }
		
		div.caption-masthead h1 {padding-bottom: 25px; }
		div.caption-masthead h1:after {height: 10px; }

		p.larger { font-size: 19px; line-height: 1.33}
		p.largest { font-size: 22px; line-height: 1.25; }
		p.bolder { font-size: 19px; }
		a.btn { font-size: 16px; line-height: 38px; letter-spacing: 1px;  }
		a.btn2 { font-size: 16px; line-height: 38px; letter-spacing: 1px;  }

		div.subhead {font-size: 16px; margin-bottom: 24px;}

		div.projects-grid a div.size small { font-size: 12px; }
		p.custom-2 span:first-child { font-size: 96px; }
		p.custom-2 span:last-child { font-size: 14px; }
		div.inner-nav span, div.inner-nav a, div.cities span, div.cities-slider a { line-height: 60px; font-size: 16px; }
		div.registration-form p.conditions { font-size: 14px; margin-top: 40px}
		div.top-frame div.title { font-size: 44px; margin-bottom: 30px}
		div.top-frame p { font-size: 16px; margin-bottom: 24px; }
		div.animation span { font-size: 16px; }
		div.location-maps div.title {font-size: 18px; margin-bottom: 10px;}
		div.location-maps p {font-size: 14px; }
		a.plus-content {padding-left: 90px; font-size: 18px; line-height: 1.4; margin-bottom: 24px}
		
		div.project div.city { font-size: 24px; margin-bottom: 2px}
		div.project div.info { font-size: 14px;}
		div.project div.size { font-size: 80px; line-height: .9; }
		div.project div.size sup { font-size: 12px; }
		ul:not(.slick-dots) li { padding-left: 16px; font-size: 16px; margin-bottom: 7px; line-height: 1.33}
		ul.l-large li { font-size: 20px; }
		div.big-text-1 span {font-size: 96px; line-height: 0.8;}
		div.big-text-2 span {font-size: 96px; line-height: 0.8;}
		div.position-list a { font-size: 16px; padding: 15px 0; }
		div.grid-address * { font-size: 16px;}
		p.address-disclaimer { font-size: 14px; padding-top: 20px; margin-top: 40px;}
		button[type="submit"], form button[type="button"] { font-size: 16px; line-height: 38px; letter-spacing: 1px;  padding: 0 16px;}

		a.plus-content:before {width: 48px; height: 48px; }
		a.plus-content:hover:before {left: 10px;}
		div.location-address { padding: 20px;}

		div.top-frame { padding-left: 20px; padding-top: 30px}
		div.bottom-frame:after { bottom: 20px; left: 20px; width: 48px; height: 48px; }
		div.bottom-frame:before { bottom: 42px; left: 20px; width: 48px; height: 3px; }
		div.home-features > div:hover div.bottom-frame:before { bottom: calc(100% - 10px); width: calc(100% - 40px);; height: 10px; }
		div.home-features > div { height: 640px}
		div.bottom-frame p { left: 20px; width: calc(100% - 40px); padding-top: 25px; }

		div.grid-1 { gap: 50px; padding-bottom: 40px}
		div.grid-contact { gap: 50px}

		div.home-about > div:before { height: 10px; margin-bottom: 40px}
		div.registration-form > div > div:first-child { padding-right: 40px}

		header {height: 60px; position: fixed; background: #000; padding: 0 !important; top: 0 !important}
		header div.navigation { display: none !important; width: 100vw !important; height: calc(100 * var(--vh)) !important; top: 0 !important; left: -200vw !important; opacity: 0 !important; padding: 0 !important; gap: 0 !important; padding-top: 80px !important; }
		header.active div.navigation { display: flex !important; left: 0 !important; z-index: 5; background: #000; opacity: 1 !important; flex-direction: column-reverse !important; justify-content: center;}
		header nav { flex-direction: column; gap: 30px !important; padding-left: 20px !important;}
		header nav a { padding: 0 !important; font-size: 24px !important; line-height: 1.33 !important;}
		header div.navigation > div:first-child { display: flex; flex-direction: column; gap: 50px; align-items: flex-start;}
		div.country-selector { flex-direction: column; gap: 30px; padding-top: 30px; height: auto; display: flex !important}
		div.country-selector a { border: 0 !important; padding: 0 !important; padding-left: 20px !important; font-size: 20px; line-height: 1.33;}
		header nav a:after { display: none;}
		header div.burger { display: block;}
		header div.logo { left: auto !important; right: 20px !important; width: 60px !important; top: 12px !important;}
		article { padding-top: 60px;}
		div.masthead { height: calc(100 * var(--vh) - 60px)}
		div.burger ul li:before { display: none;}
		div.burger ul li { padding: 0}
		div.quick-quote { padding-left: 20px}

		div.footer { display: flex; flex-direction: column-reverse; gap: 50px;} 
		div.footer > div:first-child { flex-direction: column-reverse; gap: 30px;} 
		div.footer-nav { gap: 25px;}
		div.footer-nav > div { padding-right: 0;}
		div.footer-nav div:after { display: none;}

		div.projects { grid-template-columns: 1fr 1fr 1fr 1fr; row-gap: 10px; column-gap: 10px; padding-bottom: 100px;}

		footer div.quick-quote { display: none;}
		footer div.disclaimer > div  { flex-direction: column;}
		footer div.disclaimer > div > div { width: 100%;}
		footer div.disclaimer-last { width: 100%; padding-bottom: 20px;}
		footer div.disclaimer > div > div.disclaimer-left { justify-content: space-between}

		div.js-accordion h4 { min-height: 0px; }
		div.js-accordion h4 span { height: 30px; }

		div.grid-news { grid-template-columns: 1fr 1fr; column-gap: 50px; row-gap: 40px;}
		div.grid-news > div { gap: 20px; }
		div.grid-news div.title { font-size: 20px; }

		div.grid-news-large { gap: 12px; margin-bottom: 70px}
		div.grid-news-large div.photo { margin-bottom: 20px;}
		div.grid-news-large div.title { font-size: 20px; }
		div.grid-news-large div.details { gap: 20px; }

		div.two-columns { column-count: 1; margin-top: 40px}
		div.press-footer { gap: 40px; margin-top: 50px; flex-direction: column; margin-bottom: 40px}
		div.press-footer > div { width: 100%}

		div.caption-masthead-center { padding-top: 0}

		footer div.seo-links  a { font-size: 12px; }

		div.patrick { margin-bottom: 50px;}
		div.patrick a { margin-top: 20px; display: block; font-size: 20px} 
		h2.thin { font-size: 36px}
}

@media only screen and (max-width: 980px) {
footer div.seo-links  { display: grid; gap: 10px; grid-template-columns: 1fr 1fr 1fr 1fr;}

}
@media only screen and (max-width: 760px) {

/*	div.footer-nav { display: none;}*/
	div.footer-nav { flex-direction: column}

	div.content2, div.content-tall, div.content { min-height: 0px}

	div.content, div.content-tall, div.content2  { padding-top: 50px; padding-bottom: 50px}
	div.grid-1 {padding-bottom: 0}	

	div.home-features > div, div.registration-form > div > div, div.grid-1 > div, div.grid-contact>div, div.custom-1 > div 	 { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important}
	div.location-maps, div.grid-1, div.registration-form > div, div.home-features, div.grid-contact, div.custom-1 	{ flex-direction: column}
	div.registration-form > div { gap: 40px}
	div.registration-form p.conditions { margin-top: 20px}
	div.registration-form > div { padding: 50px 20px}

	div.grid-list, div.grid-list.grid-list-3 { grid-template-columns: 1fr 1fr ; }
	div.plus-content { margin-top: 40px}

	.triangle-gray:after, .triangle-white:after, .triangle-black:after { border-width: 0 30px 19px 30px; left: 10%; }

	ul.custom-4 li { max-width: 100%; width: 100% !important; display: block; margin-bottom: 30px; padding-left: 0}
	ul.custom-4 li:hover { color: #fff}
	ul.custom-4 li:before { display: none;}
	ul.custom-4 li p { position: static !important; display: block !important; opacity: 1 !important; width: 100% !important; max-width: 100% !important; margin-top: 10px;}

	div.inner-nav { display: none;}
	div.images-2, div.images-1 { padding-bottom: 0; margin-top: 50px}
	ul:not(.slick-dots):last-child { margin-bottom: 0}

	div.big-text-1 { margin-top: 0}

	div.home-about a.btn { margin-bottom: 40px}
	div.project-logos { padding: 20px}

		p.custom-2 span:first-child { font-size: 76px; }
		p.custom-2 span:last-child { font-size: 16px; }
		div.inner-nav span, div.inner-nav a, div.cities span, div.cities-slider a { line-height: 60px; font-size: 16px; }
		div.built-ontario { height: 80px}

		div.home-features > div { height: 540px;}

		ul.slick-dots li button { width: 12px; height: 12px;}

		h1 { font-size: 40px;}

		div.images-1 { display: grid; grid-template-columns: 1fr 1fr 1fr; row-gap: 10px; column-gap: 10px}

		section.masthead:after { display: none;}

		div.projects-grid { column-gap: 10px; row-gap: 10px}
		div.projects-grid a > div { top: 0; transform: none; width: 100%; height: 100%; padding: 12px; }
		div.projects-grid a > div > div { width: 100%; padding-left: 0}
		div.projects-grid a div.city { font-size: 15px}
		div.projects-grid a div.info { font-size: 10px; letter-spacing: 0; margin-bottom: 10px;}
		div.projects-grid a div.size { font-size: 32px}
		div.projects-grid a div.size sup { font-size: 12px}

		div.project > div { padding: 20px}
		div.project div.city { font-size: 14px; margin-bottom: 2px}
		div.project div.info { font-size: 11px; margin-bottom: 5px;}
		div.project div.size { font-size: 40px; line-height: .9; }
		div.project div.size sup { font-size: 12px; }
		div.project > div, div.project.active:after { width: 60%}
		a.close-project { top: 15px; right: 15px;} 
		a.close-project img { width: 20px} 
		div.project > div { left: 40%;}

		input[type="text"] { line-height: 48px; height: 48px; min-height: 48px;}
		fieldset { margin-bottom: 0}

		div.location-address { max-width: 80%; padding: 10px 20px}
		div.location-maps div.title { margin-bottom: 5px;}

		div.testimonials-slider img { height: 60px;}

		div.grid-news { grid-template-columns: 1fr; column-gap: 50px; row-gap: 40px;}
		div.grid-news div.title { font-size: 18px; }

		div.grid-news-large { gap: 40px; flex-direction: column; }
		div.grid-news-large > div { width: 100%;}
		div.grid-news-large div.photo { margin-bottom: 20px;}
		div.grid-news-large div.title { font-size: 18px; }
		div.grid-news-large div.details { gap: 20px; }

		a.big-cta { position: relative; bottom: 0px; left: 0; transform: translateX(0); margin-top: 100px}
		div.picture-caption span { font-size: 14px; margin-top: 12px;}

		footer div.seo-links  { grid-template-columns: 1fr 1fr 1fr;}

		div.leading-the-way-text { padding: 30px}
		div.leading-the-way-text a.expand { margin: 40px auto 0 0; width: 150px}
		div.leading-the-way-text a.expand img { width: 100px}
		div.leading-the-way { padding: 0px 0px;}
		div.leading-the-way div.caption > div { margin-top: 20px; flex-direction: column; }
		div.leading-the-way div.caption span { width: 100% !important}
		div.leading-the-way div.caption { transform: none; position: relative; top: 0; left: 0; padding: 40px 30px}
		div.leading-the-way img {position: absolute; width: 100%; height: 100%; object-fit: cover; }
		div.leading-the-way span br { display: none;}
		div.leading-the-way div.caption span:first-child {font-size: 14px; padding: 0}
		div.leading-the-way div.caption span:last-child {font-size: 20px; }

		div.caption-masthead-center h1 { font-size: 48px;}
		div.caption-masthead-center h1 small { font-size: .5em; }
		div.caption-short h2 { font-size: 24px; }
		div.seo-3, div.seo-2 { padding: 100px 30px}
		div.seo-3 h2 { font-size: 28px; }
		p.heavy {font-size: 16px; }
		div.seo-1 { padding: 70px 30px; }
		div.seo-2 h2 { font-size: 48px; }
		div.seo-2 h2 span { font-size: .5em; }

} 

@media only screen and (max-width: 400px) {
	div.projects-grid a div.size { font-size: 28px}
	div.project div.size { font-size: 36px; }
}