﻿/* FONT 
Hero New Regular
font-family: hero-new, sans-serif;
font-weight: 400;
font-style: normal;

Hero New Medium
font-family: hero-new, sans-serif;
font-weight: 500;
font-style: normal;

Hero New Bold
font-family: hero-new, sans-serif;
font-weight: 700;
font-style: normal;
*/

* 		{margin:0; padding:0; outline:none; border:none; box-sizing:border-box; -moz-box-sizing:border-box;}
html 	{ }
body { line-height: 1; font-family: hero-new, sans-serif; font-size: 1em; font-weight: 300; color: #878787; -webkit-font-smoothing: antialiased; }

::-webkit-input-placeholder     {color:#aaaaaa;}
::-moz-placeholder              {color:#aaaaaa; opacity:1;}
:-ms-input-placeholder          {color:#aaaaaa;}
:-moz-placeholder               {color:#aaaaaa; opacity:1;}


img     {max-width:100%; height:auto;}
a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block; z-index: 30;}

h2		{margin-bottom: 0.5em; font-size: 45px; font-weight: 300; line-height: 1.2em; color: #878787}
p		{margin-bottom: 1.5em; font-size: 15px; line-height: 1.7em; color: #878787}

.inner	{width:1400px; padding-left: 30px; padding-right: 30px; max-width: 100%; margin: auto}

ul					{margin-left: 0}

.col-container		{width:calc(100% + 60px); margin-left: -30px; font-size: 0;}
.col-1				{width:100%; display: inline-block; vertical-align: top; padding: 30px; font-size: 16px;}
.col-2				{width:50%; display: inline-block; vertical-align: top; padding: 30px; font-size: 16px;}
.col-3				{width:33.333%; display: inline-block; vertical-align: top; padding: 30px; font-size: 16px;}
.col-4				{width:25%; display: inline-block; vertical-align: top; padding: 30px; font-size: 16px;}
.col-5				{width:20%; display: inline-block; vertical-align: top; padding: 30px; font-size: 16px;}


/* FLEX */
.flex				{display: flex}
.aic				{align-items: center}
.sb					{justify-content: space-between}
.fdc				{flex-direction: column}

/* HEADER */
header 				{padding: 30px 0; position: absolute; left: 0; top:0; width:100%; z-index: 10; transition: 0.2s ease-out}		
header .inner		{width:100%;}
.header-right		{display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end;}

header:after			{position: absolute; left: 0; top:0; width:100%; height: 100%; content: ''; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(36,36,36,0) 0%, rgba(36,36,36,1) 100%); z-index: -20;}

#page12 header:after,
header.fixed:after     {height: 0px !important;}


nav							{}
nav ul						{display:flex; list-style:none; position: relative; align-items: flex-end; font-size: 14px;}
nav ul li					{margin-left: 50px; position:relative; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) ; text-transform: uppercase; letter-spacing: 1px; padding-top: 20px; padding-bottom: 20px;}
nav ul li a					{text-decoration: none; color:#ffffff; display: block; position: relative; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1)}
nav ul li.active a			{font-weight: 500}
nav ul li:hover a			{color:rgba(90,90,90,0.5);}

nav ul li ul				{position: absolute; left: -999999px; top:100%; flex-direction: column; align-items: flex-start; width: 220px; transform: translateX(-15px); background-color: rgba(212,209,200,.85); z-index: -10;}
nav ul li ul li				{margin: 0; padding: 0; width: 100%}
nav ul li ul li a			{padding: 15px; color: #5A5A5A; width: 100%; display: block}
nav ul li ul li:hover a		{background-color: rgba(212,209,200,.85); width: 100%}

nav ul li ul:before         {position: absolute; left: 0; top:-50px; width:80%; height: 50px; content: ''; background: rgba(212,209,200,.85); z-index: -10;}



nav ul li:hover ul			{left: 0;}
nav ul li:hover ul a		{color:#5a5a5a}

li.home-icon svg .cls-1				{fill:#ffffff; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
li.home-icon:hover svg .cls-1		{fill:rgba(255,255,255,0.8);}

.logo img					{transition: 0.2s ease-out}

header.fixed				{background-color:#D4D1C8; position: fixed; left: 0; top: 0; width: 100%; z-index: 20}
header.fixed nav ul li a	{color: #5A5A5A;}
header.fixed .logo img		{filter: brightness(0.2)}

header.fixed .nav-icon span {background-color: #878787}

header.fixed nav ul li ul:before,
header.fixed nav ul li ul	{background-color: rgba(255,255,255,0.85)}




/* HEADER VARS */
#page12	header				{background-color: #ffffff; border-bottom: 1px solid #D4D1C8}
#page12 header nav ul li a	{color: #5A5A5A;}
#page12	header .logo img 	{filter: brightness(0.2);}


/* NAV ICON */
.nav-icon 					{width: 28px; height: 22px; z-index: 100; position: absolute; right:30px; top:50%; margin-top: -13px; cursor: pointer; display: none}
.nav-icon span 				{width: 100%; display: block; height: 2px; background-color: #ffffff; position: absolute; top: 0; left: 0; border-radius: 1px; }
.nav-icon span:nth-child(1) {}
.nav-icon span:nth-child(2) {top: 8px; }
.nav-icon span:nth-child(3) {top: 16px; }

.nav-icon.open span					{background-color:#D4D1C8;}
.nav-icon.open span:nth-child(1) 	{top: 10px; transform: rotate(45deg) }
.nav-icon.open span:nth-child(2) 	{opacity: 0; transform: scale(0) }
.nav-icon.open span:nth-child(3) 	{top: 10px; transform: rotate(-45deg)}

/* HEADER TOP */
.header-right-top					{display: flex; margin-bottom: 10px; transform: translateY(-5px);}

/* SOCIAL LIST */
.social-list						{list-style: none; display: flex;}
.social-list li						{margin-left: 15px;}
.social-list li a					{background-color:transparent; display: flex; justify-content: center; align-items: center; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
.social-list li a svg				{height:20px; width: auto; max-width: 20px; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
.social-list li a svg .cls-1		{fill:#ffffff; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
.social-list li a:hover svg .cls-1	{fill:#DD7A39}

li a svg .insta_path		{transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
li a:hover svg .insta_path	{fill:#DD7A39}

/* HERO CONTAINER */
.home-hero-container						{min-height:650px; height:100vh; position: relative;}
.home-hero-container .home-hero-carouselx	{width:100%; height: 100%;}
.home-hero-container .inner					{width:100%; height:100%; display: flex; align-items: flex-end; padding-bottom: 40px; position: relative; z-index: 5}
.home-hero-container .slide					{background-size: cover; background-position: center; width:100%; height:100%; position: relative}
.xxhome-hero-container .slide:after			{position: absolute; left: 0; top:0; width:100%; height: 100%; content: ''; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(36,36,36,0) 0%, rgba(36,36,36,0.3) 40%, rgba(36,36,36,0) 80%, rgba(36,36,36,0.75) 100%);}
.home-hero-container .hero-text	h1,
.home-hero-container .hero-text	h2			{font-weight: 300; color:#ffffff; text-transform: uppercase; font-size: 20px; margin-bottom:0; letter-spacing: 2px}
.home-hero-container .hero-text p			{width:100%; max-width: 640px; font-size: 20px; color:#ffffff; line-height: 1.4em; margin-bottom: 0;}
.home-hero-container .hero-text .btn 		{margin-top:20px;}
.home-hero-container .hero-text .btn:after 	{background-color: #DD7A39 !important; }
.home-hero-container .hero-text				{width:70%; max-width: 960px;}

.home-hero-container .video-container .hero-text {position: absolute; left: 30px; bottom: 30px;}



.home-hero-container .slick-track,
.home-hero-container .slick-list 				{height: 100%; }
.home-hero-container .property-tag				{position: absolute; right:0px; bottom: 40px; background-color: #DD7A39; z-index: 5; color:#ffffff; text-decoration: none; font-size: 18px; text-align: right; padding:10px 15px; line-height: 1.4em; transition: 0.3s cubic-bezier(0.65, 0, 0.35, 1); display: none; overflow: hidden;}
.home-hero-container .property-tag strong		{font-weight: 500; display: block;}
.home-hero-container .property-tag p			{position: relative; z-index: 5; margin-bottom: 0; width: 100%; font-size: 16px;}
.home-hero-container .property-tag:hover		{padding-right: 30px;}
.home-hero-container .property-tag:after		{position: absolute; right: -100%; top:0; width:100%; height: 100%; content: ''; display: block; background-color: #242424; transition: 0.3s cubic-bezier(0.65, 0, 0.35, 1)}
.home-hero-container .property-tag:hover:after	{right:0}

.home-hero-container .video-container		{position: absolute; width:100%; height: 100%; left: 0; top:0}
.home-hero-container .video-container video	{width:100%; height: 100%; position: absolute; left: 0; top:0; object-fit: cover; object-position: center}
/*.home-hero-container .video-container:after	{position: absolute; left: 0; top:0; width:100%; height: 100%; content: ''; background-color: rgba(36,36,36,0.6);}*/

.home-hero-container a.cover	{z-index: 6}


.listing-hero-container 				{min-height: 350px; display: flex; position: relative; }
.listing-hero-container .bg-container 	{width: 100%; background-position:center !important; background-size: cover !important; background-repeat:no-repeat !important;}
.listing-hero-container .inner 			{height: 100%; display: flex; align-items:flex-start; align-items: center; padding-top: 40px; position: relative; z-index: 5;}
.listing-hero-container .hero-text 		{margin-left:auto; margin-right:auto; background-color: rgba(212,209,200,.65); padding: 30px 50px}
.listing-hero-container .hero-text h1,
.listing-hero-container .hero-text h2 	{font-weight: 300; color: #5A5A5A; text-transform: uppercase; font-size: 48px; margin-bottom: 0; text-align: center; letter-spacing: 1.5px}
.listing-hero-container .hero-text p 			{font-size: 16px; color: #878787; line-height: 1.4em; margin-bottom: 0; text-align: center; margin-top: 0.5em}
.listing-hero-container .hero-text .btn 		{margin-top: 20px; }
.listing-hero-container .hero-text .btn:after 	{background-color: #DD7A39 !important; }
.listing-hero-container .hero-text {}

.listing-hero-container:after	{background-color:rgba(36,36,36,0.75); position: absolute; left: 0; top:0; width: 100%; height: 100%; content: ''; display: none}

.listing-hero-container ul.filter-list 				{text-align:center; margin-top:10px; font-weight: 500; font-size: 14px;}
.listing-hero-container ul.filter-list li 			{display: inline-block; margin-left:10px; margin-right:10px; cursor:pointer; transition:0.2s ease-in-out;}
.listing-hero-container ul.filter-list li a 		{text-decoration: none; padding-bottom: 3px; display: block; border-bottom: 0px solid #878787; color: #dadada; transition: 0.2s ease-out-in;}
.listing-hero-container ul.filter-list li a.active 	{color: #5A5A5A; border-color:#5A5A5A; opacity: 1;}

.project-detail-hero-container 					{height: 100vH; position: relative; }
.project-detail-hero-container .bg-container 	{width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size:cover; position: relative;}
.project-detail-hero-container .inner 			{height: 100%; display: flex; align-items: flex-end; padding-bottom: 30px; position: relative; z-index: 5; }
.project-detail-hero-container h1				{color:#fff; text-transform:uppercase; font-size:70px; font-weight:300; margin-bottom:20px;}
.project-detail-hero-container h2				{color:#fff;font-size:30px}
.project-detail-hero-container h2 strong 		{font-weight:900}

.project-detail-hero-container .btn:after 		{background-color: #DD7A39 !important;}

.project-detail-hero-container .btn-gallery { background-color: transparent; border: 2px solid #ffffff; }
.project-detail-hero-container .btn-gallery.btn-open-gallery { position: absolute; bottom: 50px; right: 30px; }
.project-detail-hero-container .btn-gallery.btn-close-gallery { position: absolute; top: 50px; right: 30px; padding: 15px 20px; font-size:12px;}

.project-detail-hero-container .bg-container:after { background: linear-gradient(0deg, rgba(36,36,36,0.9) 0%, rgba(36,36,36,0) 50%, rgba(36,36,36,0.9) 100%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; }

.project-detail-hero-container {position:relative;overflow:hidden}

.project-detail-hero-container .project-detail-gallery { width: 100%; height: 100%; transition:.8s ease-in-out; transform:scale(1.3);}
.project-detail-hero-container .project-detail-gallery.zo {transform:scale(1);}
.project-detail-hero-container .inner { height: 100%; display: flex; align-items: flex-end; padding-bottom: 40px; position: relative; z-index: 5 }

.project-detail-hero-container .slide { background-size: contain; background-position: center; width: 100%; height: 100%; position: relative; transition:transform 0.4s ease-in-out; background-repeat: no-repeat; background-color: #242424; }

.project-detail-gallery.hero .slide {background-size: cover; transition:1s ease-in-out; }


.project-detail-hero-container .slide div {position:absolute; width:100%; height:100%;top:0; left:0;}
.project-detail-hero-container .slide div:after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(36,36,36,0.9) 0%, rgba(36,36,36,0.4) 40%, rgba(36,36,36,0) 80%, rgba(36,36,36,0.75) 100%);}



.project-detail-gallery .slick-track,
.project-detail-gallery .slick-list { height: 100%; }

.project-detail-hero-container .project-gallery-text-container { position: absolute; bottom:40px; left: 30px; }
.project-detail-hero-container li[role=presentation] {display:none !important;}
.project-detail-hero-container .slick-arrow {bottom:0px;}
.project-detail-hero-container .carousel-nav-container {text-align:right; bottom:135px;}
.project-detail-hero-container .carousel-nav:before {left:100%}




.full-width-image { width: 100%; height: 100VH; padding: 90px 0 30px 0 }
.full-width-image .bg-image { background-position: center; background-repeat: no-repeat; background-size: cover; width:100%; height:100%;}

.hero-header-container 					{height: 100vh; position: relative; }
.hero-header-container .bg-container 	{width: 100%; height: 100%; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; }
.hero-header-container .inner 			{height: 100%; display: flex; align-items: center; padding-bottom: 30px; position: relative; z-index: 5; justify-content:center;}
.hero-header-container h1,
.hero-header-container h2 				{color: #fff; text-transform: uppercase; font-size: 70px; font-weight: 300; margin-bottom: 20px; }
.hero-header-container .sub-text 		{position:absolute; bottom: 20px; right:70px; opacity:0.6}
.hero-header-container .sub-text p 		{color:#fff;font-size:20px;font-weight:300}

.more-projects-header 				{background-color: #242424;}
.more-projects-header .flex 		{justify-content: space-between; padding-top: 40px; padding-bottom: 40px; align-items: center}
.more-projects-header h3 			{font-size: 48px; color: #ffffff; text-transform: uppercase; font-weight: 300; margin-bottom:0; }
.more-projects-header .btn:after	{background-color:#ffffff;}
.more-projects-header .btn:hover span	{color:#242424}
.more-projects-container .project-carousel-container { padding-top: 0; }
.more-projects-container .carousel-nav-container {width:auto;}

/* PROJECT LISTING PAGE */
.image-listing-container { padding: 30px 0; }
.image-listing-container .inner     {width:100%;}

.image-listing-container .col-container {width:100%; margin-left:0}

.listing-inner                      {position: relative; overflow: hidden; }
.listing-img                        {width: 100%; height: auto;  padding-top: 80%; background-position: center; background-size: cover; background-repeat: no-repeat; transition: 0.5s ease-out; }
.listing-text                       {position: absolute; width: 100%; bottom: 0; z-index: 5; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-left: 20px; padding-right: 20px;}
.listing-text p                     {font-size: 14px; color: #fff; text-align: center; margin-bottom:0px; font-weight:400; text-transform: uppercase}
.listing-text p.sub-text            {font-size: 30px; padding-top:0; font-weight:100; line-height: 1.2em; margin: 8px;}

.listing-inner:after 				{background: linear-gradient(0deg, rgba(36,36,36,0.2) 0%, rgba(36,36,36,0.75) 50%, rgba(36,36,36,0.2) 100%); position: absolute; left: 0; top:0; width: 100%; height: 100%; content: ''; transition: 0.5s ease-out;}

.listing-inner:hover:after			{opacity: 0.75;}
.listing-inner:hover .listing-img   {transform: scale(1.1);}

.listing-inner a.cover				{z-index: 20}

/* CV FORM */
.cv-form				{padding: 30px 0; background-color:#f7f7f7}
.cv-form .inner			{width:600px; max-width: 100%;}
.cv-form-inner			{background-color:#ffffff; padding: 50px;}
.cv-text 				{vertical-align: top; margin-left: 10px; margin-top: 20px; display: inline-block; }
.cap-cell 				{display:none}
.form-cell.error.cv ul 	{list-style-type:none}
.form-cell.error.cv li 	{margin-bottom:10px}
.form-cell.error.cv li:last-child {margin-bottom:0}

.form-row-buttons		{display: flex; justify-content: space-between; margin-top: 20px;}

/* CAROUSEL NAV */
.carousel-nav { width: auto; display: inline-block; position: relative }
ul.custom_paging 					{margin: 0; padding:0 50px; list-style: none}
ul.custom_paging li 				{display: none; color: #ffffff; font-size:20px; padding:0 !important; margin-left: 0 !important} 
ul.custom_paging li:before 			{display:none}
ul.custom_paging li.slick-active 	{display: block;}
.slick-arrow 						{width:23px; height: 20px; background-image:url(/_assets/icon-chevron-white.svg); background-size: cover; background-color:transparent; font-size:0; position: absolute; display: block; z-index: 5}
.slick-arrow.slick-next 			{left:auto; right:0}
.slick-arrow.slick-prev 			{transform:rotate(180deg)}


.carousel-nav-container				{position: absolute; bottom:300px; left: 50%; margin-left: -670px; z-index: 10; width:1400px; padding-left: 30px; padding-right: 30px; max-width: 100%}
.carousel-nav:after					{content: ''; border-bottom: 1px solid #ffffff; display: block; position: absolute; bottom: -15px; width:100%;}
.carousel-nav:before				{content: ''; border-bottom: 1px solid #ffffff; display: block; position: absolute; bottom: -15px; width:8000px; right:100%;}

/* TEXT IMAGE LISTING */
.text-image-section									{padding-top:60px}
.text-image-container .col-container				{display: flex;}
.text-image-container .col-container .col-2			{padding-top: 0; padding-bottom: 0}
.text-image-container .col-container .col-2-image	{width:68%;}
.text-image-container .col-container .col-2-text	{width:32%; display: flex; align-items: center;}
.text-image-container .panel-image-container		{overflow: hidden; height: 100%; min-height: 590px;}
.text-image-container .panel-image					{background-size: cover; height:100%; width:100%; background-position: center}
.text-image-container .text-panel					{padding: 30px;}
.text-image-container .btn							{margin-top: 1em}
.text-image-section.grey							{background-color:#F8F8F8;}

.text-image-section.small-image .col-container .col-2-image { width: 400px; }
.text-image-section.small-image .col-container .col-2-text { width: calc(100% - 400px) }
.text-image-section.small-image .panel-image-container {min-height: 400px; }

.text-image-section	.text-image-container:nth-child(even) .col-container	{flex-direction: row-reverse;}
.text-image-section.image-right .text-image-container .col-container { flex-direction: row-reverse; }

.text-image-section.designer-notes-section .text-panel { padding-left: 100px; padding-right:100px;}
.text-image-section.designer-notes-section .text-panel strong  {font-weight:900}
.text-image-section.designer-notes-section blockquote { position: relative }
.text-image-section.designer-notes-section blockquote:after,
.text-image-section.designer-notes-section blockquote:before { width: 60px; height: 35px; background-image: url(/_assets/icon-quote.svg); background-position: center; background-size: contain; background-repeat: no-repeat; display: block; content: ''; position: absolute; }
.text-image-section.designer-notes-section blockquote:before { left: -80px; top: 0; }
.text-image-section.designer-notes-section blockquote:after { bottom: 0; right: -80px; transform: rotate(180deg) }

.designer-notes-section .col-container	{width: 100%; margin: auto}

.two-col-text .col-container			{align-items:center; flex-direction:column}
.two-col-text .col-2					{width:769px; text-align:center}
.two-col-text .text-panel.tp-right 		{text-align:center; border: 1px solid #d3d1c8; padding: 30px 35px; margin-bottom:30px; margin-top:30px;}
.two-col-text .text-panel.tp-right h3 	{font-size:20px; margin-bottom:20px; font-weight:500;}
.two-col-text .text-panel				{padding: 0}

/* TEXT IMAGE STACKED */
.text-image-section.stacked	.col-container	{flex-direction: column;}
.text-image-section.stacked	.col-text		{text-align: center; width: 900px; max-width: 100%; margin: auto;}
.text-image-section.stacked	.col-text .btn	{margin-top: 20px;}
.text-image-section.stacked .col-image							{padding: 50px 30px 0}
.text-image-section.stacked .col-image .panel-image-container	{position: relative;}
.text-image-section.stacked .text-image-container .panel-image	{position: absolute; left: 0; top:0}

/* MASONRY */
.grid:after 		{content: ''; display: block; clear: both;}
.grid-item 			{float: left; width: 33.333%; height: 20vw; padding: 5px; overflow: hidden;}
.grid-item--width2 	{width: 200px; }/* NOT USED */
.grid-item--height2 {height: 40vw; }

.grid-item--heightSQ {height: 30vw; }



.panel			{width:100%; height: 100%; position: relative; transition: 0.4s ease-out; overflow: hidden;}
.panel-image	{position: absolute; left: 0; top:0; width:100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; transition: 0.4s ease-out; transform-origin: center;}
.hover-outer	{position: absolute; left: 0; top:0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; opacity: 0; visibility: hidden; background-color: rgba(0,0,0,0.4); transition: 0.4s ease-out}
.hover			{width:auto; height:auto; background-color: rgba(212,209,200,0.7); padding: 20px 30px;}
.hover p		{color:#ffffff; left: 0.5px; font-size: 14px; margin: 0; transition: 0.6s ease-out; text-transform: uppercase;}

.panel:hover .panel-image	{filter: grayscale(1)}
.panel:hover .hover-outer	{visibility: visible; opacity: 1; transform: scale(1);}

.button	{display: flex; justify-content: center; margin: 50px 0 0 0;}

section.project-images {margin-bottom: 60px; }

.project-images .grid .grid-item	{height: auto; width: 50%}





/* PROJECT DETAIL PAGE BLOCKQUOTE SECTION */
.blockquote-section 						{padding-left: 30px; padding-right: 30px; margin: 80px auto 30px; display: block; text-align: center }
.blockquote-section .blockquote-text 		{position:relative;}
.blockquote-section .blockquote-text p 		{font-size: 30px; line-height: 1.4em; padding-left: 10px; padding-right: 10px;}
.blockquote-section .blockquote-text p:last-child	{margin-bottom: 0}
.blockquote-section .blockquote-text:after,
.blockquote-section .blockquote-text:before {width: 60px; height: 35px; background-image: url(/_assets/icon-quote.svg); background-position: center; background-size: contain; background-repeat: no-repeat; display: block; content: ''; position: absolute; display: none}
.blockquote-section .blockquote-text:before {left: -2px; top: -10px; }
.blockquote-section .blockquote-text:after 	{bottom: -10px; right: -2px; transform: rotate(180deg) }
.blockquote-section .inner					{width:1020px;}

/* DESIGNER NOTES */
.designer-notes-section								{padding: 60px 0; background-color: rgba(211,209,209,0.3);}
.designer-notes-section .col-image					{width: 250px; max-width: 100%; margin:0 auto 40px auto}
.project-page-main .designer-notes-section .inner	{width: 500px; text-align: center;}
.designer-notes-section blockquote cite				{font-size: 12px; text-transform: uppercase; font-style: normal}
.designer-notes-section blockquote p				{font-size: 20px;}
.designer-notes-section h2							{font-size: 16px; text-transform: uppercase; font-weight: 500; color:#5A5A5A; margin-bottom: 1em}

/* SORTING OUT THE VERTICAL SPACE */
.project-page-main							{padding: 190px 0 0 0}
.project-page-main .text-image-section		{padding: 0; padding-bottom: 60px; margin: 0 auto;}
.project-page-main .blockquote-section		{padding: 0; padding-bottom: 60px; margin: 30px auto;}
.project-page-main .full-width-image		{padding: 0; padding-bottom: 60px; margin: 30px auto; overflow: hidden;}
.more-project								{padding: 0; margin: 0 auto;}

.project-page-main .inner	{width: 1200px;}
.project-intro				{text-align: center; margin-bottom: 60px;}
.project-intro h1			{font-size: 40px; font-weight: 300; margin-bottom: 0.3em}
.project-intro h2			{font-size: 12px; font-weight: 400; text-transform: uppercase; margin-bottom: 2.5em;}
.project-intro h2 strong	{font-weight: 400}
.project-intro p			{margin-bottom: 0; font-size: 14px; width: 680px; max-width: 100%; margin-left: auto; margin-right: auto;}
.project-intro img			{margin-top: 60px; margin-bottom: 60px;}

.project-intro .blockquote-section		{margin: 0; padding: 0}
.project-intro .blockquote-section p	{font-size: 18px; width: 680px; margin: auto; line-height: 1.6em}

/* PROJECT CAROUSEL */
.project-carousel-container 		{position: relative; padding-top: 60px; }
.project-carousel .inner			{height:100%; display: flex; align-items: flex-end; padding-bottom: 60px; position: relative; z-index: 5}
.project-carousel .slide			{height:70vh; min-height: 700px; background-size: cover; background-position: center; width:100%; position: relative;}
.project-carousel .slide:after		{position: absolute; left: 0; top:0; width:100%; height: 100%; content: ''; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(36,36,36,0.9) 0%, rgba(36,36,36,0.6) 40%, rgba(36,36,36,0) 100%);}
.project-carousel .carousel-text	{max-width:100%; width:650px; position: relative; z-index: 5;}
.project-carousel .carousel-text h3	{font-size:48px; color:#ffffff; text-transform: uppercase; font-weight: 300; margin-bottom: 0.6em;}
.project-carousel .carousel-text p	{font-size:20px; color:#ffffff; font-weight: 300; line-height: 1.4em; width:90%; margin-bottom: 1.7em;}
.project-carousel .carousel-text .btn:after	{background-color:#DD7A39 !important}

.home-hero-container .carousel-nav-container,
.project-carousel-container	.carousel-nav-container	{padding-left: 0}

.home-hero-container .carousel-nav-container	{display: none}

/* TESTIMONIALS */
.testimonials-carousel-container							{padding: 80px 0 60px 0}
.testimonials-carousel-container .header-text				{display: flex; justify-content: center; margin-bottom: 20px; position: relative}
.testimonials-carousel-container > .inner:first-of-type		{width: 100%; padding: 0 } /* CHANGE 23/03 - added inner class to .testimonials-carousel-container .header text */
.testimonials-carousel .inner								{height:100%; display: flex; align-items: flex-end; position: relative; z-index: 5; }
.testimonials-carousel .slide								{height: 60vh; min-height: 500px; background-size: cover; background-position: center; width:100%; position: relative;}
.testimonials-carousel .testimonial-text					{width:600px; max-width: 100%; margin: auto; padding: 50px 65px;}	
.testimonials-carousel .testimonial-text p					{font-size: 22px; color:#5A5A5A; line-height: 1.5em}
.testimonials-carousel .testimonial-text cite				{font-style: normal; font-weight: 500; font-size: 12px; text-transform: uppercase; color:#5A5A5A}
.testimonials-carousel .testimonial-text blockquote			{position: relative; color:#ffffff}
.testimonials-carousel .testimonial-text blockquote:before	{width: 90px; height: 52px; background-image: url(/_assets/icon-quote.svg); background-position: center; background-size: contain; background-repeat: no-repeat; display: block; content: ''; position: absolute; left: 0; top:0; opacity: 0.6; display: none}
.testimonials-carousel .slide:after							{position: absolute; left: 0; top:0; width:100%; height: 100%; content: ''; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(36,36,36,0.3) 0%, rgba(36,36,36,0.7) 50%, rgba(36,36,36,0.3) 100%); display: none}

.testimonials-carousel-container .carousel-nav-container						{position: relative; display: flex; justify-content: center; bottom: auto; left: auto; margin-left: auto; margin-top: 40px; width: 100%;}
.testimonials-carousel-container .carousel-nav-container .slick-arrow			{background-image:url(/_assets/icon-chevron-grey.svg)}
.testimonials-carousel-container .carousel-nav-container ul.custom_paging li	{color:#878787}
.testimonials-carousel-container .carousel-nav-container .carousel-nav:before,
.testimonials-carousel-container .carousel-nav-container .carousel-nav:after	{border-color:#242424; display: none}

.slide.slick-active .testimonial-text	{transform: translateY(50px); opacity: 0; animation: slide-up 1s ease-out forwards 0s; background-color: rgba(212,209,200,0.9);}	


/* OUR APPROACH HOME */
.our-approach-listing-container							{background-color:#ffffff; padding: 30px 0 60px; text-align: center;}
.our-approach-listing-container .col-1					{text-align: center;}
.our-approach-listing-container .col-5					{border-right:1px dashed rgba(255,255,255,0.5); width:20%; padding-top:0; padding-bottom: 0; padding-left: 10px; padding-right: 10px;}
.our-approach-listing-container .col-5:last-child		{border-right: none}
.our-approach-listing-container img						{width: auto;}
.our-approach-listing-container .approach-panel			{text-align: center;}
.our-approach-listing-container h3						{font-size:18px; line-height: 1.2em; font-weight: 300; margin-bottom: 0.75em}
.our-approach-listing-container .approach-panel-text	{margin-top:30px;}
.our-approach-listing-container .btn:after				{background-color:#DD7A39 !important}

.our-approach-listing					{display: flex; flex-wrap: wrap; justify-content: center}
.our-approach-listing-container .btn	{margin-top: 50px;}

.our-approach-listing-container	 .col-container	{width:calc(100% + 20px); margin-left: -10px}

/* NEWSLETTER SIGN UP */
.newsletter-container						{border:1px solid #D4D1C8; padding: 40px; display: flex; margin: 30px 0}
.newsletter-container .col-text				{flex: 1; background-color:rgba(212,209,200,.4); display: flex; align-items: center; flex-shrink: 0;}
.newsletter-container .col-image			{flex: 1; flex-shrink: 0; position: relative;}
.newsletter-container .col-image img		{position: absolute; width: 100%; height: 100%; left: 0; top:0; object-fit: cover; object-position: center}
.newsletter-container .col-text-box			{padding: 60px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%;}
.newsletter-container .col-text-box label					{font-size: 20px; margin-bottom: 35px; font-weight: 500; line-height: 1.2em}
.newsletter-container .col-text-box input[type="text"]		{background-color: transparent; border-bottom: 1px solid #878787; width: 100%; font-size: 16px; padding-bottom: 10px; font-weight: 300; color:#878787}
.newsletter-container .col-text-box input[type="submit"]	{width: auto; margin-top: 25px;}

.newsletter-form	{width: 100%;}

/* TEAM */
.team-listing									{padding-top: 40px;}
.team-listing .image-container 					{width:100%; padding-top: 105%; overflow: hidden; position:relative;}
.team-listing .image-container .bg-image 		{width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; position: absolute; top: 0; transition:opacity ease-in-out 0.2s;}
.team-listing .image-container .bg-image.alt 	{position:absolute; top:0}
.team-listing .contact-icons 					{position: absolute; bottom: 10px; right: 10px; z-index:5;}
.team-listing .contact-icons li 				{list-style-type:none; display:inline-block; margin-left: 10px;}
.team-listing .contact-icons img 				{width: 20px; height: auto; }

.team-listing .text-container 					{text-align: center; margin-top: 20px; }
.team-listing .text-container h3 				{font-weight: 300; font-size:20px; margin-bottom:10px;}
.team-listing .text-container h4 				{font-weight: 500; font-size: 12px; margin-bottom: 10px; text-transform: uppercase;}
.team-listing .text-container p 				{font-size:12px;}

.team-listing .image-container .bg-image:hover:first-child {opacity:0;}
.team-listing .image-container .bg-image:not(.alt) {z-index:3;}


/* STATS */
.stats-listing-container {text-align:center; padding-bottom: 30px;}


.stats-listing-container .stat 					{padding:10px 0;}
.stats-listing-container .stat h3 				{font-size: 50px; margin-bottom: 20px; font-weight:500}
.stats-listing-container .stat h4 				{font-size:28px; font-weight: 300;}
.stats-listing-container .col-3 				{border-right: 2px dashed rgba(0,0,0,0.1); border-bottom: 2px dashed rgba(0,0,0,0.1); }
.stats-listing-container .col-3:nth-child(3n) 	{border-right: none }
.stats-listing-container .col-3:nth-child(7),
.stats-listing-container .col-3:nth-child(8),
.stats-listing-container .col-3:nth-child(9) 	{border-bottom: none }

/* TIMELINE */
.lj-timeline .col-1         {background-color: #fff; z-index: 1; position: relative; text-align: center}
.lj-timeline h3				{font-size: 45px;}
.lj-timeline				{padding: 50px 0;}
.lj-timeline .inner			{position: relative;}
.lj-timeline .inner:after	{border-left:2px dashed #DCD7D4; content: ''; position: absolute; height: 100%; top:0; left: 50%; margin-left: -1px;}

.timeline-item			{display: flex; width:100%; flex-direction: column; text-align: right; position: relative; z-index: 5}
.timeline-text			{width:50%; position: relative; padding-right: 120px;}
.timeline-circle		{width:40px; height: 40px; border-radius: 40px; border:4px solid #ffffff; background-color: #D4D1C8; position: absolute; right: -20px; top:115px; display: block;}

.timeline-text:before	{border-left:2px dashed #DCD7D4; position: absolute; height: 100px; content: ''; right: 40px; top:45px; transform: rotate(-45deg);}
.timeline-text:after	{border-top:2px dashed #DCD7D4; position: absolute; width:160px; content: ''; right: 76px; top:59px;}

.timeline-item:nth-child(even)							{align-items: flex-end; text-align: left;}	
.timeline-item:nth-child(even) .timeline-text			{padding-left: 120px; padding-right: 0}
.timeline-item:nth-child(even) .timeline-circle			{right:auto; left: -20px;}
.timeline-item:nth-child(even) .timeline-text:before	{right:auto; left: 40px; transform: rotate(45deg)}
.timeline-item:nth-child(even) .timeline-text:after		{right:auto; left: 76px;}

/* OUR APPROACH PAGE */
.oa-box						{margin: auto; background-color: #ffffff; padding:40px 50px; max-width: 100%; border:1px solid #dddddd; height: 100%; position: relative;}
.oa-box ul					{margin:20px 0 0 25px; font-size: 16px; line-height: 1.4em;}
.oa-box ul li				{margin-bottom: 10px;}
.oa-box ul li:last-child	{margin-bottom: 0}
.oa-box-header h2			{font-size: 30px; display: flex}
.oa-box-header span			{margin-right: 10px; font-weight: 500; color:#DCD7D4;}
.oa-box-outer				{padding: 40px 0; background-color:#f7f7f7; background-attachment: fixed;}

.our-approach-process							{overflow: hidden; padding: 30px 0}
.our-approach-process .col-2					{position: relative;}
.our-approach-process .inner					{width:1024px;}
.our-approach-process .col-container			{display: flex;}
.our-approach-process .col-container.flipped	{flex-direction: row-reverse;}

.oa-box.arrow:after			{width:50px; height: 12px; position: absolute; right:-55px; top:50%; margin-top: -6px; background-image:url(/_assets/arrow-process.svg); background-size: cover; content: ''; display: block;}
.oa-box.arrow-left:after	{transform: rotate(180deg); right:auto; left:-55px;}
.oa-box.arrow-down:after	{transform: rotate(90deg); left: 50%; margin-left: -25px; right:auto; bottom: -37px; top:auto; margin-top: 0}



/****************/
/* CONTACT PAGE */

.contact-info-container					 	{position: relative}
.contact-info-container .inner 				{width:1150px}
.contact-info-container .info-container 	{width:100%; position: relative; z-index: 5; padding-top: 150px; padding-bottom: 50px;}
.contact-info-container .contact-info 		{padding:0px; display: flex; width: 100%;}
.contact-info-container .ci-top 			{background-color: #D4D1C8; padding:50px 25px; display: flex; width: 50%; background-color: rgba(212,209,200,.4);}

.contact-info-container .contact-info .ci-image	{width:30%; flex-shrink: 0; display: none !important}

.col-1:nth-child(even) .contact-info	{flex-direction: row-reverse}

.contact-info-container .contact-info .ci-info 			{color: #fff; margin-left: 25px; }
.contact-info-container .contact-info .ci-info h2 		{font-size:30px;}
.contact-info-container .contact-info .ci-info p 		{margin-bottom:10px; background-image:url(/_assets/icon-location.svg); background-size: 15px auto; background-repeat: no-repeat; padding-left: 28px;}
.contact-info-container .contact-info .ci-info p.phone	{background-image:url(/_assets/icon-phone.svg); background-size: 14px auto;}
.contact-info-container .contact-info .ci-info p.email	{background-image:url(/_assets/icon-email.svg); background-size: 18px auto; background-position: 0 6px;}
.contact-info-container .contact-info .ci-info a 		{text-decoration:none}
.contact-info-container .contact-info .ci-info a:hover 	{text-decoration:underline}

.contact-info-container .contact-info .ci-image img {width: 100%;}
.contact-info-container .ci-map					{width: 50%; position: relative}
.contact-info-container .ci-map iframe 			{}
.contact-info-container .ci-map #map-1,
.contact-info-container .ci-map #map-2			{height: 100%;}


.hero-video-container 					{overflow:hidden; position:relative;}
.hero-video-container video 			{width:100%; }
.hero-video-container .text-container 	{position:absolute; top:50%; width:100%; transform:translateY(-50%);height:100%}

/* TEXT PAGE */
.text-page { padding: 60px 0 }
.text-page .inner			{width:1024px;}
.text-page h2				{font-size: 26px; font-weight: 400; margin-top: 1.5em;}
.text-page h2:first-child	{margin-top: 0}
.text-page ul,
.text-page ol				{line-height: 1.6em; font-size: 16px; margin-bottom: 1.5em;}
.text-page ul li,
.text-page ol li			{margin-bottom: 0.5em;}
.text-page strong			{font-weight: 700}

/* FOOTER */
footer { padding: 30px 0 }
footer h4					{display: block; border-bottom: 1px solid #D4D1C8; margin-bottom: 1.8em; font-size: 16px; padding-bottom: 10px; text-transform: uppercase; font-size: 12px;}
footer ul					{list-style: none; font-size: 16px; margin-bottom: 1.8em}
footer ul li				{line-height: 1.4em; margin-bottom: 0.6em;}
footer ul li a				{text-decoration: none; position: relative; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1)}
footer ul li a:after		{position: absolute; bottom: -2px; border-top: 2px solid #DD7A39; content: ''; width:0%; display: block; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1); display: none}
footer ul li a:hover		{color:#242424}
footer ul li:last-child		{margin-bottom: 0}
footer .col-4 ul:last-child	{margin-bottom: 0;}
footer ul li:hover a:after	{width:100%;}
.col-4-address ul li a			{color:#878787}
.col-4-address ul li a:hover	{color:#242424}

footer .col-1	{padding-bottom: 0}

.footer-social li							{margin-bottom: 15px;}
.footer-social li span						{transform: translateY(3px)}
.footer-social li a							{display: inline-flex; align-items: center; padding-bottom: 3px;}
.footer-social svg							{width:auto; height: 20px; margin-right: 15px;}
.footer-social svg .cls-1					{fill:#D4D1C8}
.footer-social li a svg .insta_path			{fill:#D4D1C8; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1) }
.footer-social li a:hover svg .insta_path	{fill:#D4D1C8}

footer .logo img	{width: 220px;}

footer p a	{color:#DD7A39; text-decoration: none}

/* FORM CONTAINER */
.form-cell						{margin-bottom: 10px}
.form-cell textarea,
.form-cell input[type="text"]	{font-weight: 300; font-size: 14px; border-bottom: 1px solid #D4D1C8; width:100%; padding-bottom: 15px; margin-bottom: 10px; padding: 11px 0 10px; transition: 0.3s cubic-bezier(0.65, 0, 0.35, 1) ;}
.form-cell textarea				{height:120px; resize: none}

input[type="submit"]	{font-size: 12px;}

.form-cell textarea:focus,
.form-cell input[type="text"]:focus	{border-color:#D4D1C8; background-color: #f1f1f1; padding-left: 10px;}
.form-cell.error { color: red; border: 1px solid; border-radius: 10px; padding: 10px; background-color: #ffdfdf; margin-bottom:1.8em;}
/* BUTTONS */


.btn			{padding: 20px 0; min-width: 210px; text-align: center; background-color:#ffffff; color:#878787; border:1px solid #878787; text-decoration: none; letter-spacing: 1px; font-weight: 500; display: inline-block; position: relative; overflow: hidden; text-transform: uppercase; transition: 0.2s cubic-bezier(0.65, 0, 0.35, 1);}
.btn span		{position: relative; z-index: 5; transition: 0.3s cubic-bezier(0.65, 0, 0.35, 1); display: block; font-size: 11px; letter-spacing: 1.5px}
.btn:hover 		{background-color:#D4D1C8; border-color: #D4D1C8}
.btn:hover span	{color:#5A5A5A}

/*
.btn:after			{position: absolute; left: -100%; top:0; width:100%; height: 100%; content: ''; display: block; background-color: #242424; transition: 0.3s cubic-bezier(0.65, 0, 0.35, 1) }
*/

.btn.small span		{font-size: 12px;}

.btn.white.border	{color:#ffffff; border:1px solid #ffffff; background-color: rgba(255,255,255,0);}

.btn.black 				{background-color:#000;}
.btn.black:hover:after	{background-color:#DD7A39;}

/* ANIMATIONS */
.project-carousel-container .slick-active .carousel-text h3,
.project-carousel-container .slick-clone-current .carousel-text h3,

.slick-active .hero-text h1,
.slick-clone-current .hero-text h1,
.slick-active .hero-text h2,
.slick-clone-current .hero-text h2 { transform: translateX(300px); animation: slide-in 1s ease-out forwards 0s; opacity: 0 }

.project-carousel-container .slick-active .carousel-text p,
.project-carousel-container .slick-clone-current .carousel-text p,

.slick-active .hero-text p,
.slick-clone-current .hero-text p { transform: translateX(350px); animation: slide-in 1.2s ease-out forwards 0s; opacity: 0 }


.project-carousel-container .slick-active .carousel-text a.btn,
.project-carousel-container .slick-clone-current .carousel-text a.btn,

.slick-active .hero-text a.btn,
.slick-clone-current .hero-text a.btn { transform: translateX(400px); animation: slide-in 1.4s ease-out forwards 0s; opacity: 0 }


.slick-active .property-tag, .slick-clone-current .property-tag {transform: translateY(125px); animation: slide-up 0.5s ease-out forwards 0.75s;}

.testimonials-carousel .slide.slick-active:after,
.project-carousel .slide.slick-active:after	{opacity: 0; animation: fade-in 1s ease-out forwards 0s;}




@keyframes slide-in {
	to {transform: translateX(0px); opacity: 1}
}

@keyframes slide-up {
	to {transform: translateY(0); opacity: 1}
}

@keyframes fade-in {
	to {opacity: 1}
}

/* COOKIE BAR */
.cookieBar              { width: 100%; background: url('/_assets/bg_cookiebar.png'); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999; box-sizing:border-box; -moz-box-sizing:border-box; }
.cookieBar p			{color:#ffffff; font-size:14px; font-family:inherit; line-height:1.5em; text-align:center; display:inline-block;}
.cookieBar .acceptBtn   {border:0px; background:#000; border:1px solid #DEDEDE; font-weight:bold; display:inline-block; margin-top:6px; margin-left:5px; font-family:inherit; font-size:12px; padding:5px 10px; text-decoration:none; color:#FFF; text-transform:uppercase; }


@keyframes lds-ring {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
}


/* IE10+ SPECIFIC STYLES GO HERE. IE10+ NO LONGER SUPPORT CONDITIONAL STATEMENTS IN THE HEAD OF A FILE */ 
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  

}


