@import url(/css/reset.css);
@import url(/css/text.css);
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
html {
	height:100%
}
body {
	font: 16px/22px "MaisonNeue-Book", Arial, sans-serif;letter-spacing:0.05em;
	color: #303030;
	background: #fff url(/img/ui/bg.gif) repeat-x top center;
	height:100%;
}

.resizeimg {max-width: 100%;height: auto;}

.flexmiddle {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;
}

.animatein {visibility:hidden}

h1 {text-transform:uppercase;font-weight:normal;font-family:"eksell";font-size:56px;line-height:56px;letter-spacing:0.05em}
h1 span {font-size:15px;line-height:18px;display:block;margin-bottom:30px}
h2 {text-transform:uppercase;font-weight:normal;font-family:"eksell";font-size:38px;line-height:38px;letter-spacing:0.05em;margin:0 0 20px 0}
h2 span {font-size:16px;line-height:18px;display:block;margin-bottom:0px;font-family:"MaisonNeue-Book"}
h2.noslider {margin-bottom:100px}
h4 {text-transform:uppercase;font-weight:normal;font-family:"eksell";font-size:20px;line-height:20px;letter-spacing:0;margin:0 0 10px 0}

.scrolldown, .scrolldownright {position:relative}
.scrolldown:before {content:'';display:block;width:20px;height:49px;background:url(../img/ui/scrolldown.png) top left no-repeat;position:absolute;bottom:0;left:-50px}
.scrolldownright:before {content:'';display:block;width:20px;height:49px;background:url(../img/ui/scrolldown.png) top left no-repeat;position:absolute;bottom:0;right:-50px}
p.scrolldown {margin-bottom:0}

.rightarrow {width:120px;background: url(../img/ui/rightarrow.svg) 50% 50% no-repeat;height:60px;margin-left:-66px;margin-bottom:20px;position:relative;z-index:1000;cursor:pointer;cursor:hand;
-webkit-transition: margin 0.2s ease-out;
  -moz-transition: margin 0.2s ease-out;
  -o-transition: margin 0.2s ease-out;
  transition: margin 0.2s ease-out;}
.leftarrow {width:120px;background: url(../img/ui/leftarrow.svg) 50% 50% no-repeat;height:60px;margin-right:-66px;float:right;margin-bottom:20px;position:relative;z-index:1000;cursor:pointer;cursor:hand;
-webkit-transition: margin 0.2s ease-out;
  -moz-transition: margin 0.2s ease-out;
  -o-transition: margin 0.2s ease-out;
  transition: margin 0.2s ease-out;}
.rightarrow:hover {margin-left:-60px}
.leftarrow:hover {margin-right:-60px}
.circlelink {width:100%;height:120px;position:absolute;bottom:40px;left:0;text-align:center;font-family:'MaisonNeue-Demi';font-size:15px;line-height:15px;color:#303030;display:block}
.circleholder {width:100%;height:100%;position:relative;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.circletext {position:relative;z-index:500;letter-spacing:0.05em}
.circlelink svg {position:absolute;top:0;left:calc(50% - 60px);height:100%}
.orangecircleline{stroke:#E98401;stroke-width:2px;fill:none;stroke-dasharray: 400;stroke-dashoffset: 400;
-webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;}
.circlelink:hover {text-decoration:none}
.circlelink:hover .orangecircleline {stroke-dashoffset: 00;opacity:0.4}

.sectiongap {width:100%;height:80px;clear:both}


/**** nav ****/
.navbar {width:50px;height:100vh;position:fixed;top:0;right:0;background:#E98401 url(../img/ui/menuicons.svg) 0px center no-repeat;background-size:100px auto;cursor:pointer;cursor:hand;overflow:hidden;
-webkit-transition: background-position 0.2s ease-out;
  -moz-transition: background-position 0.2s ease-out;
  -o-transition: background-position 0.2s ease-out;
  transition: background-position 0.2s ease-out;}
.navbar:hover {background-color:#ED9D34}
.menuopen .navbar {background-position:-50px center}

.navholder {width:0;height:100vh;position:fixed;top:0;right:50px;z-index:2000;overflow:hidden;background:#fff;
-webkit-transition: width 0.2s ease-out;
  -moz-transition: width 0.2s ease-out;
  -o-transition: width 0.2s ease-out;
  transition: width 0.2s ease-out;}
.menuopen .navholder {width:calc((100% - 50px) * 0.6)}
.navholder .nav {width:100%;height:100%;margin:0;padding:0;list-style-type:none}
.navholder .nav li {width:calc(20% - 1px);height:100%;float:left;margin:0;padding:0;background:#fff;border-right:1px solid #CFCFCF;writing-mode: tb-rl;transform: rotate(-180deg);overflow:hidden;
display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.navholder .nav li a {display:block;height:calc(100% - 50px);padding-top:50px;font-size:54px;line-height:54px;text-decoration:none;font-family:"eksell";text-transform:uppercase;color:#303030;letter-spacing:0.05em;
-webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
opacity:0}
.menuopen .navholder .nav li a {opacity:1}
.navholder .nav li a:hover {color:#E98401}


.pageholder {width:calc(100% - 50px);position:relative;overflow-x:hidden}
.introsection {width:100%;height:100vh;background:#fff;position:relative}
.pagesection {height:100vh;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}

.homebutton {display:block;background:url(../img/content/logo.svg) 50% 50% no-repeat #fff;background-size:80%;position:absolute;top:0px;left:60px;width:135px;height:135px;z-index:1000}
.s0 .homebutton {background-color:transparent;top:40px;background-size:contain}


/**** up next ****/
.upnext {text-align:center}
.prevpage{width:40%;margin-right:10%;float:left;text-align:right;padding-top:40px}
.nextpage{width:40%;margin-left:10%;float:left;text-align:left;padding-top:40px}
.upnext span {margin-bottom:10px}
.upnext a {text-decoration:none;color:#303030}
.upnext a:hover {color:#E98401}
.upnext a:hover span {color:#036666}

/**** footer ****/
.footer {background:#036666;color:#fff;padding:60px 30px;font-size:12px;line-height:16px}
.footer a {color:#fff}
.footerlogo {height:135px;margin-bottom:60px}
.footerlogo img {width:135px;height:135px;margin-right:30px;float:left}
.footerlogo .address {height:135px;
display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.footerlogo .address p {width:100%;text-align:left;font-size:14px}
.footer .agency {width:45%;margin-right:0px;float:left;margin-bottom:40px}
.footer .agency .logo {width:100%}
.footer .agency .logo.knightfrank {padding-top:40px}
.footer .agency .logo img {height:40px;width:auto;margin-bottom:10px}
.footer .agency .logo.farebrother img {height:40px;margin-top:40px}
.footer .agency .agent {float:left;box-sizing:border-box;padding-right:40px;margin-bottom:10px;width:50%}


/* #Page Styles
================================================== */

/**** holding ****/
.holding .holdingholder {width:100%;min-height:100vh}
.holding {color:#fff;background:#036666}
.holding h1 {font-size:60px;line-height:60px;font-family:'eksell';font-weight:normal;text-transform:uppercase;letter-spacing:0.03em;margin-bottom:60px}
.holding h2 {font-family:'sofiapro-light';font-size:36px;line-height:40px;font-weight:normal}
.subheading {margin-bottom:60px}
.holding .orangeline {width:100%;height:1px;background:#e98401;clear:both;margin-bottom:20px}
.holding .agents {font-family: 'Open Sans', sans-serif;letter-spacing:0.01em}
.holding .agents .agentlogo {height:100px}
.holding .agents a.logo {width:100%;height:100px;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: left;
   align-items: left;
   -webkit-justify-content: center;
   justify-content: center;}
.holding .agents img {max-width:150px}
.holding .agents a {color:#fff}
.holding .agents span {color:#e98401}


/**** home ****/
.introanimation {background:#036666;position:fixed;top:0;left:0;width:100%;height:100vh;z-index:3000;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}

#tree {stroke-dashoffset:0;stroke-dasharray: 2200;}
#outercircle {stroke-dashoffset:4400;stroke-dasharray: 2200;}

.hideintro {display:none !important}


.homeleft {width:40%;float:left;background:#036666;color:#fff;height:100vh}
.homeleft h1 {margin:0 60px;position:absolute;bottom:20vh;left:0}

.orangebox {display:inline-block;border-top:2px solid #E98401;color:#E98401;padding:5px;margin-top:30px;font-size:30px;line-height:30px;clear:both}
.orangebox p {font-size:14px;line-height:18px}
.orangebox p.available {margin:0}
.orangebox p.gradea {font-family:"MaisonNeue-Book", Arial, sans-serif;letter-spacing:0.05em;text-transform: none;color:#fff}
.homeright {width:60%;float:left;position:relative;height:100vh}
.homeright .banner {width:100%;height:80vh;background: url(../img/content/home/banner.jpg) 50% 50% no-repeat;background-size:cover}
.homeright .introtext {height:20vh;width:100%}
.homeright .introtext p {width:50%;margin-left:20%;position:relative}

.homebuilding {
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.homebuildingpicholder {width:calc(50vw + 38px);margin:30px}
.previewslider {width:100%;overflow:hidden}
.previewslider .cycle-slideshow {width:calc(100vw + 8px)}

.previewslider .cycle-slideshow .slide {width:50vw;margin:0 4px 0 0;height:60vh;background:50% 50% no-repeat;background-size:cover}

.rightpic .previewslider .cycle-slideshow {width:calc(100vw + 8px);margin-left:calc((75vw - 152px) * -1)}
.leftpic .previewslider .cycle-slideshow .slide, .rightpic .previewslider .cycle-slideshow .slide {height:80vh;width:calc(75vw - 122px)}


.homebuildingtext {width:25vw;height:60vh;position:relative}

.fetterlife {position:relative;padding-bottom:180px}
.fetterlife h2 {text-transform: none;color:#E98401;margin-bottom:20px}
.lifeintro {margin:40px;width:35%}
.lifegrid {margin:15px}
.lifegrid .gridpic {width:calc(25% - 30px);height:calc(25vw - 30px);margin:15px;background:50% 50% no-repeat;background-size:cover;float:left}

.homeconnections {position:relative;padding:0 140px;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.homeconnections:before {content:'';display:block;width:100%;position:absolute;background:#EEEEEE;top:80px;bottom:80px;left:0;z-index:-1}
.homeconnectionstext {width:48%;position:relative}
.homeconnectionspic {width:52%;margin:30px}

.homespace {position:relative;padding:0 30px;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.homespacetext {width:25%;margin-right:5%;position:relative;height:30vh;padding-bottom:180px}
.homespacetext h2 {margin-bottom:100px}
.homespacepic {width:70%;margin:30px;height:60vh;background:url(../img/content/home/space.png) 50% 50% no-repeat;background-size:contain}

/**** building ****/
.buildingbanner {width:100%;height:80vh;background:url(../img/content/building/banner.jpg) 50% 50% no-repeat;background-size:cover}
.buildingbannertext {padding:30px 140px}
.buildingbannertext .lefttext {width:50%;float:left}
.buildingbannertext .righttext {width:50%;float:left}

.rightpic, .leftpic {padding:0 30px;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.leftpic {padding:0 30px 0 0}
.buildingtext {height:80vh;width:calc(25% - 15px);position:relative}
.buildingpic {height:80vh;width:calc(75% - 15px);background:50% 50% no-repeat;background-size:cover}
.rightpic .buildingtext {margin-right:15px}
.leftpic .buildingtext {margin-left:15px}
.rightpic .buildingpic {margin-left:15px}
.leftpic .buildingpic {margin-right:15px}

.specsection {min-height:100vh;height:auto}
.specsection .scrolldown:before {display:none}
.specsection .buildingtext {height:auto}
.spec {width:95%}
.spec li {margin-bottom:5px}
.specbutton {font-family:'MaisonNeue-Demi';font-size:15px;line-height:15px;color:#303030}

/**** location ****/
.locationbanner {height:100vh;width:75%;float:left}
#map {width:100%;height:100%}
.locationbannertext {width:calc(25% - 60px);float:left;padding:30px}
/*.locationbannertext h2 {margin-bottom:100px}*/

.amenitieslist {text-transform:uppercase;padding-top:20px}
.amenitieslist h3 {font-weight:normal;font-size:15px;line-height:18px;margin:0 0 10px 0;border-top:1px solid #D9D9D9;padding-top:14px;clear:both;position:relative;float:left;cursor:pointer;cursor:hand}
.amenitieslist h3:before {content:'';display:block;position:absolute;top:0;left:0;width:100%;height:1px;background:#D9D9D9}
.amenitieslist h3:hover {text-decoration:underline}
.amenitieslist h3.restaurants {color:#036666}
.amenitieslist h3.bars {color:#303030}
.amenitieslist h3.leisure {color:#E98401}
.amenitieslist ul {list-style-type:none;margin:0 0 40px 0;padding:0;font-size:13px;line-height:22px;clear:both}
.amenitieslist ul li {margin:0;padding:0 0 0 0}
.amenitieslist span {display:inline-block;width:30px;float:left;display:none}
.amenitiesplus {width:10px}


.plusline {fill:none;stroke:#E98401;stroke-linecap:square;stroke-miterlimit:10;}
.plusline.vertical {opacity:1;-webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;}
.ui-state-active .plusline.vertical {opacity:0}
.restaurants .plusline {stroke:#036666}
.bars .plusline {stroke:#303030}
.leisure .plusline {stroke:#E98401}

.connectionssection {padding:0 40px;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}

.connectionstext {width:30%;margin-left:100px;margin-right:30px}
.connectionspic {height:80vh;width:70%;background:50% 50% no-repeat;background-size:contain}

.walkingtimes {font-size:14px;line-height:18px}
.walkingtimes .station {width:calc(50% - 20px);margin:10px 20px 10px 0;float:left}
.walkingtimes .station span {color:#E88302;font-family: 'MaisonNeue-Demi'}


/**** floor plans ****/
.floorplansbanner {height:100vh;width:70%;background:url(../img/content/floorplans/banner.jpg) 50% 50% no-repeat;background-size:cover;float:left;position:relative}
.showplan {position:absolute;top:0;left:0;width:100%;height:100%;background:#F2F7F7;display:none}
.planholder {position:relative;width:100%;height:100%;
	display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;}
.downloadfloors {display:inline-block;position:absolute;bottom:30px;left:30px;font-size:14px;color:#303030;background:url(../img/ui/download.svg) no-repeat top left;line-height:14px;padding-left:40px;z-index:600}
.north {position:absolute;top:30px;right:30px;width:30px}
.planpic {width:80%;height:80%;background:50% 50% no-repeat;background-size:contain}


.floorplansbannertext {height:100vh;width:30%;float:left;background:#368484}
.smallprint {padding:10px}

.planslist ul {margin:0;padding:0;list-style-type:none}
.planslist ul li {margin:0;padding:0}
.planbutton, .headingbutton {color:#fff;background:#5B9B9B;height:calc(100vh / 11);padding-left:30px;cursor:pointer;cursor:hand;
display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: flex-start;
   justify-content: flex-start;
	-webkit-transition: height 0.2s ease-out, background-color 0.2s ease-out;
  -moz-transition: height 0.2s ease-out, background-color 0.2s ease-out;
  -o-transition: height 0.2s ease-out, background-color 0.2s ease-out;
  transition: height 0.2s ease-out, background-color 0.2s ease-out;}
.planbutton.fifth {background:#4E9393}
.planbutton.fourth {background:#428C8C}
.planbutton.third {background:#368484}
.planbutton.second {background:#297C7C}
.planbutton.first {background:#1C7574}
.planbutton.ground {background:#106E6D}
.planbutton.lowerground, .planbutton.basement {background:#036666}
.planbutton .floorname, .headingbutton .listheading {font-size:24px;line-height:24px;font-family:"eksell";text-transform:uppercase;margin-bottom:10px}
.planbutton .planarea, .totalarea, .totalarealabel {font-size:14px;line-height:18px;float:left;margin-right:30px}
.planbutton:hover .floorname {text-decoration:underline}
.planbutton.let .floorname, .planbutton.basement:hover .floorname {text-decoration: none;}
.totalarealabel {font-family:"eksell";text-transform:uppercase;margin-left:20px}

.headingbutton {background:#fff;color:#000;cursor:pointer;cursor:hand}
.headingbutton:hover .listheading {text-decoration: underline}
.ui-state-active.headingbutton {background:#000;color:#fff}
.floorsplus {width:13px}
.headingbutton .plusline {stroke:#000}
.planslist .ui-state-active .plusline {stroke:#fff}

.spaceplans .planbutton {width:calc(100% - 30px);}
.buttonholder {width:100%}
.spaceplans .planarea {width:calc(50% - 30px)}

.planbutton.selectplan {background:#F2F7F7;color:#303030}
.spaceplans .planbutton.selectplan {height:calc(100vh - ((100vh / 11) * 5))}
.spacedetails {clear:both;font-size:11px;line-height:16px;letter-spacing:0;display:none}
.selectplan .spacedetails {display:block}

.let {cursor:default;color:#ccc}
.basement {cursor:default}
.floorlet {display:none}
.let .planarea {display:none}
.let .floorlet {display:block}

/**** engaged ****/
.engagedbanner {width:100%;height:100vh;background:url(/../img/content/engaged/equiem.jpg) 50% 50% no-repeat;background-size:cover}
.engagedbannertext {position:absolute;bottom:40px;left:5vw;width:20%}
.engagedbannertext h2 {margin-bottom:100px}
.equiemlogo {width:120px;margin-top:40px}

.engagedgrid {width:70%;margin:0 15%}
.engageditem {width:calc(25% - 30px);margin:15px 15px 45px 15px;float:left;font-size:14px;line-height:22px}
.engageditem .engagedicon {width:50px;height:50px;background:50% 50% no-repeat;background-size:contain;margin-bottom:30px}

/**** contact ****/
.contactpage .footerlogo img {display:none}
.contactpage .footer {padding:60px}
.contactpage {width:100%;min-height:100vh;padding:200px 0;background:#036666;}


/****************************************************
* Misc
****************************/
/*hide social stuff and headings on prettyphoto*/
.ppt {display:none !important}
.pp_social {display:none !important}
.pp_description {display:none !important}

.smallText { font-size: 11px; }
.smallprint {
	font-size: 11px;
	color: #BBBDC0;
}
.smallprint a { color: #BBBDC0; }
.padTop { margin-top: 30px; }
.largeText { font-size: 13px; }

.superscript {vertical-align: baseline;
	font-size: 0.8em;
	position: relative;
	top: -0.4em;}
.subscript {vertical-align: baseline;
	font-size: 0.8em;
	position: relative;
	top: 0.4em;}

.vmiddle {position: relative;top: 50%;  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}

.caps {text-transform:uppercase;letter-spacing:0.1em}
.num {text-align:right}


.revealOnScroll.fadeInUp {
  opacity: 0;
}

/**** slicknav ****/
.slicknav_menu {
	display:none;
}


@media screen and (max-width: 767px) {
	#nav {
		display:none;
	}

	.slicknav_menu {
		display:block;z-index:1000;position:fixed;top:0;right:0;padding:0;width:100%;height:0;
	}
	.slicknav_menu .vmiddle {position: relative;top: 0;  -webkit-transform: translateY(0);  -ms-transform: translateY(0);  transform: translateY(0);}
	.slicknav_menu .logo {display:none}
	.slicknav_btn {margin:0;background:#666666;position:fixed;top:30px;right:30px;border-radius:0;padding:8px 5px 8px 5px;height:35px;z-index:600}
	.slicknav_menu .slicknav_menutxt {font-family:"Lato", Arial, Helvetica, sans-serif;letter-spacing:0.1em;color:#fff;text-shadow:none;font-weight:300}
	.slicknav_menu .slicknav_icon {width:30px}
	.slicknav_menu .slicknav_icon-bar {background-color:#aaaaaa;box-shadow:none;height:3px;width:30px;margin:5px 0;transition:0.2s;opacity:1;position:relative}
	.slicknav_menu .slicknav_icon-bar:nth-of-type(1) {margin-top:0}
	.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-of-type(1) {opacity:1;transform: rotate(45deg);top:8px}
	.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-of-type(2) {opacity:0;transform: rotate(-135deg);}
	.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-of-type(3) {opacity:1;transform: rotate(-45deg);top:-8px}
	.slicknav_btn:hover .slicknav_icon-bar {background-color:#fff}
	.slicknav_nav {width:100%;background:#fff}
	.slicknav_nav a {color:#fff;display:inline-block;padding:8px 0;width:auto;margin:0}
	.slicknav_nav ul {margin:0}
	.slicknav_nav li {margin:0 !important;text-align:center;text-transform:uppercase;letter-spacing:0.1em}
	.slicknav_nav a:hover {text-decoration:underline}

	.slicknav_nav {background:#383737}
}

/* #Media Queries
================================================== */
/* bigger desktop holding */
	@media only screen and (max-width: 1675px) {
		.mobilebreak {clear:both}
		.mobilealpha {margin-left:0 !important}
}


	

	/* biggerest desktop */
	@media only screen and (max-width: 1300px) {
		h1 {font-size:38px;line-height:38px}
		h2 {font-size:26px;line-height:26px}
		h2 span {font-size:12px}
		
		.rightarrow, .leftarrow {height:30px}
}

	/* biggest desktop */
	@media only screen and (max-width: 1229px) {
		/**** location ****/
		.connectionstext {margin-left:0}
		
		/**** contact ****/
		.footer .agency {width:65%}
}

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width:1099px) {
		body {font-size:14px;line-height:20px}
		
		/**** home ****/
		.homeconnections {padding:0 30px}
		.homespacetext {width:30%;margin-right:0}
		
		/**** building ****/
		.buildingbannertext {padding:30px 60px}
		
		.buildingtext {width:calc(25% - 10px);}
		.buildingpic {width:calc(75% - 10px);background:50% 50% no-repeat;background-size:cover}
		.rightpic .buildingtext {margin-right:10px}
		.leftpic .buildingtext {margin-left:10px}
		.rightpic .buildingpic {margin-left:10px}
		.leftpic .buildingpic {margin-right:10px}
		
		/**** location ****/
		.locationbannertext {padding:20px;width: calc(25% - 40px);}
		.amenitieslist ul {margin-bottom:20px;font-size:12px;line-height:18px}
		.connectionstext {width:35%}
		
		/**** floor plans ****/
		.planbutton, .headingbutton {padding-left:15px}
		.planbutton .floorname, .headingbutton .listheading {font-size:16px;line-height:16px;margin-bottom:5px}
		.planbutton .planarea, .totalarea, .totalarealabel {font-size:11px;line-height:13px;margin-right:10px}
		.spaceplans .planbutton {width: calc(100% - 15px);}
		.spaceplans .planarea {width: calc(50% - 10px);}
		.totalarealabel {margin-left:0px}
		
		/**** engaged ****/
		.engagedgrid {width: 80%;margin: 0 10%;}
		
		
}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		.holding h1 {font-size:36px;line-height:36px}
		.holding h2 {font-size:24px;line-height:28px}
		
		
		h1 {font-size:30px;line-height:30px}
		h2.noslider {margin-bottom: 30px;}
		.homebutton {left:30px}
		
		/**** home ****/
		.homeleft h1 {margin:0 30px}
		
		/**** location ****/
		.connectionssection {-webkit-flex-direction: column;flex-direction: column;}
		.connectionstext {width:100%}
		.connectionspic {width:100%}
		
		/**** floor plans ****/
		.spaceplans .planarea.density {width:80%;margin-bottom:10px}
		
		/**** engaged ****/
		.engagedbanner {height:70vh}
		.engagedbannertext {height:auto;left:5%;width:90%}
		.engagedbannertext h2 {margin-bottom:30px}
		.equiemlogo {margin-top:20px}
		.engagedgrid {width: 90%;margin: 0 5%;}
		.engageditem {width: calc(25% - 20px);margin: 10px 10px 30px 10px;font-size: 13px;line-height: 20px;}
		.contactpage .footer {padding: 30px;}
		

}

@media only screen and (max-height: 680px) {
	.planbutton .floorname, .headingbutton .listheading {font-size:18px;line-height:18px;margin-bottom:3px}
	.planbutton .planarea, .totalarea, .totalarealabel {font-size:12px;line-height:16px}
}
@media only screen and (max-height: 530px) {
	.planbutton .floorname, .headingbutton .listheading {font-size:14px;line-height:14px;margin-bottom:2px}
	.planbutton .planarea, .totalarea, .totalarealabel {font-size:10px;line-height:12px}
}


	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		.holdinglogo {width:200px;margin-bottom:30px}
		
		.homebutton {left:10px;width:80px;height:80px}
		.s0 .homebutton {top:10px}
		
		.pageholder { width: calc(100% - 30px);}
		
		/**** nav ****/
		.navbar {width:30px;background-size:60px auto}
		.menuopen .navbar {background-position: -30px center;}
		.navholder {right:30px}
		.menuopen .navholder {width: calc(100% - 30px);}
		.navholder .nav li a {font-size:30px;line-height:30px;padding-top:0px}
		
		/**** home ****/
		.introsection {height:auto}
		.homeleft {width:100%;float:none;height:auto;padding:120px 0 20px 0}
		.homeleft h1 {margin:0 10px;position:relative;bottom:0;left:0}
		.homeright {width:100%;float:none;position:relative;height:auto}
		.homeright .banner {width:100%;height:80vh}
		.homeright .introtext {height:auto;width:100%;margin-top:20px}
		.homeright .introtext p {width:calc(100% - 80px);margin-left:60px;position:relative}
		
		.leftarrow, .rightarrow {display:none}
		
		.pagesection {padding:20px 0;height:auto}
		
		.homebuilding {-webkit-flex-direction: column;flex-direction: column;}
		.homebuildingpicholder {width:100%;margin:10px 0}
		.previewslider .cycle-slideshow .slide {width:100vw}
		.homebuildingtext {width:calc(100% - 20px);margin:10px}
		
		.sectiongap {height:40px}
		
		.lifeintro {margin: 10px;width:calc(100% - 20px);}
		.lifegrid {    margin: 5px;}
		.lifegrid .gridpic {margin:5px;width: calc(50% - 10px);height: calc(50vw - 10px);}
		
		.homeconnections {-webkit-flex-direction: column;flex-direction: column;padding:10px}
		.homeconnectionstext {width:100%}
		.homeconnectionspic {width:100%;margin:10px 0}
		
		.homespace {-webkit-flex-direction: column;flex-direction: column;padding:10px}
		.homespacetext {width:100%}
		.homespacetext h2 {margin-bottom: 20px;}
		
		.homespacepic {width: 100%;    margin: 10px 0;    height: 50vh;}
		
		.footer {text-align:center}
		.footer .agency, .footer .agency .agent {width:100%;margin-right:0;padding:0}
		
		
		/**** building ****/
		.buildingbannertext {padding:10px}
		.buildingbannertext .lefttext {    width: 100%;    float: none;}
		.buildingbannertext .righttext {    width: calc(100% - 60px);margin:0 0 0 60px;    float: none;}
		.rightpic, .leftpic {-webkit-flex-direction: column;flex-direction: column;}
		.buildingtext {width:calc(100% - 20px);margin:10px;height:auto}
		.buildingpic.scrolldown {width:calc(100% - 60px);margin-left:60px}
		.buildingpic.scrolldownright {width:calc(100% - 60px);margin-left:0px;margin-right:60px}
		.leftpic .previewslider .cycle-slideshow .slide, .rightpic .previewslider .cycle-slideshow .slide {width:100vw}
		.rightpic .previewslider .cycle-slideshow {margin-left: -100vw;}
		
		.prevpage {width:calc(50% - 20px);margin:0 10px 0 10px}
		.nextpage {width:calc(50% - 20px);margin:0 10px 0 10px}
		.prevpage h2, .nextpage h2 {font-size:20px;line-height:20px}
		
		/**** location ****/
		.locationbanner {height:80vh;width:100%}
		.locationbannertext {padding:10px;width:auto}
		.connectionstext {margin:10px;width:calc(100% - 20px)}
		.walkingtimes .station {margin:10px 0;width:100%}
		
		/**** floor plans ****/
		.floorplansbanner {height:70vh;width:100%}
		.floorplansbannertext {width:100%}
		.north {top:10px;right:10px}
		.downloadfloors {bottom:10px;left:10px}
		
		/**** engaged ****/
		.engagedbannertext {position:relative;bottom:0;padding-top:20px}
		.engagedgrid {width:calc(100% - 40px);margin:5px 20px}
		.engageditem {width:calc(100% - 5px);margin-left:5px;lmargin-right:5px}
		
		/**** contact ****/
		.contactpage {padding:120px 0}
		.contactpage .footer {padding:10px}
		.contactpage .footerlogo {height:auto;margin-bottom:40px}
		.contactpage .footerlogo .address {display:block;height:auto;}
		.contactpage .footerlogo .address p {text-align:center}
		
}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		
		.homebuildingtext {padding-bottom:100px}
		.floorplansbannertext {height:auto}
		.planbutton, .headingbutton {height:15vh}
}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}



/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

@font-face {
    font-family: 'MaisonNeue-Book';
    src: url('/fonts/MaisonNeue-Book.woff2') format('woff2'),
         url('/fonts/MaisonNeue-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MaisonNeue-Demi';
    src: url('/fonts/MaisonNeue-Demi.woff2') format('woff2'),
         url('/fonts/MaisonNeue-Demi.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'eksell';
	src: url('/fonts/EksellDisplayWeb-Large.eot');
	src: url('/fonts/EksellDisplayWeb-Large.eot?iefix') format('eot'),
    	url('/fonts/EksellDisplayWeb-Large.woff2') format('woff2'),
        url('/fonts/EksellDisplayWeb-Large.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}