@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: 20px/24px 'Lato', sans-serif;
	font-weight:300;
	color: #afb7ae;
	background: #fff url(/img/ui/bg.gif) repeat-x top center;
	height:100%;
}

.animatein {visibility:hidden}

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

.noe {font-weight:normal;font-family:"Noe", serif}
.red {color:#ed1c24}
.redbg {background:#ed1c24}
.whitetext {color:#fff}
.shadowtext {text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);}
.lightgreybg {background:#d7d3d5}
.lightgreybg2 {background:#ebe9ea}
.greybg {background:#b0a7ab;color:#fff}
.darkgreybg {background:#4d4d4d;color:#fff}
.pinkbg {background:#f5d9cb;color:#4d4d4d}
.pinkbg2 {background:#faebe3;color:#4d4d4d}

.charterlogo {display:block;position:fixed;top:0;left:5vw;width:10vw;height:10vw;max-width:150px;background:url("../img/content/logo.svg") top left no-repeat;background-size:contain;z-index:5001;transition:width 0.2s, height 0.2s}

.scroll {position:fixed;bottom:5vw;left:5vw;display:flex;flex-direction:column;align-items:flex-start;z-index:3000}
.scroll .scrollline {width:1px;height:15vh;background:#ed1c24;margin-top:1.25vw}
.scroll .scrolltext {/*writing-mode: sideways-lr;*/font-size:15px;line-height:15px;transform:rotate(-90deg);position:relative;left:-15px}
@media screen and (-ms-high-contrast: none) {
  .scroll .scrolltext {transform:rotate(-90deg);position:relative;left:-15px}
}
 
/* Microsoft Edge Browser 15+ - @supports method */
 
@supports (-ms-ime-align:auto)
and (-webkit-text-stroke:initial) {
  .scroll .scrolltext {transform:rotate(-90deg);position:relative;left:-15px}
}

.enquire {cursor: pointer}
/*.fixedenquire {position:fixed;top:50vh;left:0;cursor:pointer;z-index:1000;transform:rotate(-90deg);transform-origin:0% 0%}*/
.fixedenquire {position:fixed;top:170px;left:0;cursor:pointer;z-index:2000;}

.social {width:50vw;height:20px;display:flex;flex-direction:row;align-items: center;justify-content:flex-end;position:fixed;right:5vw;top:20px;z-index:3000}
.social a {width:20px;height:20px;flex:0 0 20px;background:50% 50% no-repeat;background-size:contain;margin:0 0 0 15px}
.social a.facebook {background-image:url("../img/content/social/facebookred.svg")}
.social a.instagram {background-image:url("../img/content/social/instagramred.svg")}
.social a.twitter {background-image:url("../img/content/social/twitterred.svg")}
.social a.linkedin {background-image:url("../img/content/social/linkedinred.svg")}

/**** instagram feed ****/
.instaOverlay {display:none !important}
.charterinstagram {margin:10vw 0 -10vw 0;text-align:center}
.charterinstagram .links {margin-bottom:5vw;font-size:25px}
.charterinstagram .links a {color:#afb7ae;text-decoration: none}
.charterinstagram .links a:hover {text-decoration:underline}
.charterinstagram .links .instaicon {width:30px;height:30px;background:50% 50% no-repeat;background-size:contain;background-image:url("../img/content/social/instagramred.svg");margin:0 10px 0 0;display:inline-block;position:relative;top:8px}
.charterinstagram #instagramImages {display:flex;flex-direction:row;justify-content:center}
.charterinstagram #instagramImages .instaWrap {width:20vw;height:20vw;margin:0 1px;background:#aaa 50% 50% no-repeat;background-size:cover;margin:0 5px}

/**** nav ****/
.navholder {position:fixed;top:60px;right:5vw;width:70vw;overflow:hidden;height:40px;z-index:5000;transition:height 0.4s}
.navholder .navinner {position:relative;width:70vw;height:40px;}

.navbg {width:100%;height:0;transition:height 0.4s;background:rgba(238,191,168,0.95);position:fixed;top:0;right:0;z-index:4000}

.navbutton {position:absolute;top:0;right:-74px;width:74px;height:33px;transition:right 0.2s 0s;cursor:pointer;z-index:6000}
.navicon {position:relative;width:100%;height:100%}
.navicon span {display:block;width:74px;height:1px;background:#ed1c24;position:absolute;transition:top 0.2s}
.navicon span:nth-child(1) {top:0;left:0}
.navicon span:nth-child(2) {top:15px;left:0}
.navicon span:nth-child(3) {top:30px;left:0}

.navholder .navinner .nav {position:absolute;right:0;transition:right 0.2s 0.2s;font-weight:700}
.navholder .navinner .nav ul {margin:0;padding:0;list-style-type:none;display:flex;flex-direction:row;justify-content:flex-end}
.navholder .navinner .nav ul li {margin:0 0 0 40px;padding:0}
.nav ul li a {color:#fff;text-decoration:none}
.s1 .nav ul li a {color:#4d4d4d}
.s1.navopen .nav ul li a {color:#fff}
.navholder .navinner .nav ul li a.enquire {color:#ed1c24;cursor:pointer}
.navholder .navinner .nav ul li a:hover {text-decoration:underline}

.scrolled .nav {display:none}
.scrolled.navopen .nav {display:block}
.scrolled .navbutton {right:0;transition:right 0.2s 0.2s}
.scrolled .navinner .nav {right:-60vw;transition:right 0.2s 0s}

.navopen .navholder {width:calc(100% - 10vw);height:100vh}
.navopen .navinner {width:100%;height:calc(100vh - 10vw);display:flex;flex-direction:row;align-items:center;position:relative}
.navopen .navinner .nav {right:0;width:100%;position:relative;font-weight:400}
.navopen .navholder .navinner .nav ul {justify-content:flex-start;flex-wrap:wrap}
.navopen .navholder .navinner .nav ul li {padding:0 1.25vw;margin:0;flex:0 0 23%;box-sizing: border-box;}
.navopen .navopen .navholder .navinner .nav ul li:first-child {margin-left:0}
.navopen .navholder .navinner .nav ul li:last-child {margin-right:0}

.navholder .navinner .nav ul.subnav {display:none}
/*.scrolled.navopen .navholder .navinner .nav ul.subnav,.navopen .navholder .navinner .nav ul.subnav {display:flex}*/

.navopen .navholder .navinner .nav .topnav {font-weight:normal;font-family:"Noe", serif;font-size:40px;line-height:40px;position:relative}
.navopen .navholder .navinner .nav .topnav:before {content:'';display:inline-block;width:1em;height:1px;background:#ec2027;position:relative;top:-0.3em;margin-right:0.2em}
.navopen .navinner .nav ul.subnav {display:flex;flex-direction:column;margin-top:0.5vw}
.navopen .navholder .navinner .nav .subnav li {margin:0.5vw 0}
.navopen .navinner .nav .subnav a {color:#4e4e4e;font-size:22px;line-height:32px}
.navopen .navbg {width:100%;height:100vh}
.navopen .navicon span:nth-child(1) {top:15px;left:0}
.navopen .navicon span:nth-child(2) {top:15px;left:0}
.navopen .navicon span:nth-child(3) {top:15px;left:0}

.navopen .navholder .navinner .nav ul li.n0, .navopen .navholder .navinner .nav ul li.n4 {flex:0 0 100%;padding-bottom:20px}

.s0 .nav .n0 > a,
.s1 .nav .n1 > a,
.s2 .nav .n2 > a,
.s3 .nav .n3 > a,
.s4 .nav .n4 > a,
.s5 .nav .n5 > a,
.s6 .nav .n6 > a,
.s7 .nav .n7 > a {text-decoration:underline}


/**** banner ****/
.pageintro {width:100%;min-height:70vh;position:relative;display:flex;justify-content:center;align-items:center}
.banner {width:100%;height:100%;background:50% 50% no-repeat #aaa;background-size:cover;position:absolute;top:0;left:0;z-index:500}
.banneroverlay {position:absolute;top:0;left:0;width:100%;height:50vh;opacity:1;z-index:1000;mix-blend-mode:multiply;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4d4d4d+0,4d4d4d+100&1+0,0+100 */
background: -moz-linear-gradient(top,  rgba(77,77,77,1) 0%, rgba(77,77,77,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(77,77,77,1) 0%,rgba(77,77,77,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(77,77,77,1) 0%,rgba(77,77,77,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d4d4d', endColorstr='#004d4d4d',GradientType=0 ); /* IE6-9 */
}
.colouroverlay {position:absolute;top:0;left:0;width:100%;height:100%;background:#b0a7ab;mix-blend-mode:color;z-index:501}
/* Microsoft Edge Browser 12+ (All) - @supports method */
 
@media screen and (-ms-high-contrast: none) {
  .colouroverlay {opacity:0.7}
}
 
/* Microsoft Edge Browser 15+ - @supports method */
 
@supports (-ms-ime-align:auto)
and (-webkit-text-stroke:initial) {
  .colouroverlay {opacity:0.7}
}
.bannertext {width:calc(100% - 30vw);display:flex;align-items:center;justify-content:center;z-index:1500;color:#fff;font-size:5vw;line-height:1.1em;position:relative;padding:15vw 15vw;text-align:center}
.bannertext p {margin:0}
.bannertext .redline, .bannersub .redline, .breaknav .redline, .subheading .redline {display:inline-block;width:1.2em;height:1px;background:#ed1c24;position:relative;top:-0.3em}
.bannersub {text-align:center;position:absolute;bottom:2.5vw;font-size:2.5vw;color:#fff;z-index:1500;width:100%}

.breaktext {padding:5vw 15vw;text-align:center}
.breaktext.secondbreak {padding-top:0}
.breaktext .noe {color:#4d4d4d;font-size:45px;line-height:54px}
.breaktext p.noe:last-child {margin:0}
.breakheader {margin-top:5vw}
.breaknav {list-style-type: none;margin:0;padding:0;cursor:pointer}
.breaknav li {margin:5px 0px;padding:0}
.breaknav li:hover {text-decoration: underline}

.subheading {color:#4d4d4d;font-size:40px;line-height:48px;padding-left:10vw}
.darkgreybg .subheading {color:#fff}
.darkgreybg .redline {background:#333333}


/**** footer ****/
.footer {background:#4d4d4d;padding:10vw 5vw 5vw 5vw}
.footer .inner {padding:5vw 0 0 0;display:flex;justify-content:space-between}
.footerleft {}
.footersocial {display:flex;flex-direction:row;margin-bottom:20px}
.footersocial a {width:30px;height:30px;flex:0 0 30px;background:50% 50% no-repeat;background-size:contain;margin:0 8px}
.footersocial a.facebook {background-image:url("../img/content/social/facebookwhite.svg")}
.footersocial a.instagram {background-image:url("../img/content/social/instagramwhite.svg")}
.footersocial a.twitter {background-image:url("../img/content/social/twitterwhite.svg")}
.footersocial a.linkedin {background-image:url("../img/content/social/linkedinwhite.svg")}
.linelink {color:#fff;text-decoration:none;font-size:16px}
.linelink:before {content:'';display:block;float:left;width:2em;height:1px;background:#ed1c24;position:relative;top:0.8em;margin-right:0.5em}
.linelink:hover {text-decoration:underline}
.footerright {display:flex;flex-direction:column;align-items:flex-end}
.footer .landid {display:block;width:120px;height:120px;background:url("../img/content/spelthorne.svg") top right no-repeat;margin-top:20px}

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

/**** home ****/
.homeintro {width:100%;height:80vh;position:relative;display:flex;justify-content:center;align-items:center}
.homeintrobg {width:100%;height:100%;position:absolute;bottom:0;left:0;z-index:1000;background:#4d4d4d;mix-blend-mode: multiply}

.changewords {overflow:hidden;height:1.1em;position:relative;top:0em;left:0.2em;width:5.5em;text-align:left}
.allwords {position:absolute;top:0}


.piclinks {display:flex;flex-direction:row;align-items:center;justify-content:center}
.piclinks a {flex:0 0 31vw;height:31vw;position:relative;display:flex;align-items:center;justify-content:center;text-decoration:none}
.piclinks a .pic {position:absolute;top:0;left:0;width:100%;height:100%;background:50% 50% no-repeat;background-size:auto 100%;transition:background 0.5s}
.piclinks a .pic:after {content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:#b0a7ab;mix-blend-mode: color;transition:opacity 0.4s}
@media screen and (-ms-high-contrast: none) {
  .piclinks a .pic:after {opacity:0.7}
}
 
/* Microsoft Edge Browser 15+ - @supports method */
 
@supports (-ms-ime-align:auto)
and (-webkit-text-stroke:initial) {
  .piclinks a .pic:after {opacity:0.7}
}
.piclinks a .text {position:relative;z-index:100;color:#fff;font-size:40px}
.piclinks a .text:before {content:'';display:block;float:left;width:1em;height:1px;background:#ed1c24;position:relative;top:0.3em;margin-right:5px}

.piclinks a:hover .pic:after {opacity:0}
.piclinks a:hover .pic {background-size:auto 105%}

/**** location ****/
.mapsection {position:relative}
.mapsection .mapholder {width:calc(100% - 14vw);margin-left:7vw}
.mapsection .map {margin:0;position:relative}
.mapsection .map .mapoverlay {position:absolute;top:0;left:0;z-index:100}

.mapkey {position:absolute;bottom:5vw;left:0;padding:1.25vw 1.25vw 1.25vw 7vw;background:#fff;z-index:2000}
.mapkey ul {margin:5px 0;padding:0 2.5vw 0 0;list-style-type:none;color:#4d4d4d}
.mapkey ul li {margin:5px 0;padding:0;text-decoration:none;font-size:20px;line-height:30px;cursor:pointer}
.mapkey ul li:before {content:'';display:inline-block;width:16px;height:16px;border-radius:10px;background:#aaa;margin-right:5px}
.mapkey ul li#shopping:before {background:#1ca399}
.mapkey ul li#health:before {background:#d78b6e}
.mapkey ul li#food:before {background:#3b5b3d}
.mapkey ul li.cycle-pager-active {text-decoration:underline}

.uxbridgeoverlap {padding-top:50vh;margin-top:-50vh}
.uxbridge {padding:10vw 0 5vw 0}

.uxbridgepics {width:100%;height:80vh;position:relative}
.uxbridgepics .pic1 {background:50% 50% no-repeat;background-size:cover;position:absolute;top:8%;left:0;width:55%;height:80%;z-index:10}
.uxbridgepics .pic2 {background:bottom left no-repeat;background-size:cover;position:absolute;top:0;right:0;width:40%;height:60%;z-index:10}
.uxbridgepics .redline {position:absolute;top:0;left:50%;width:1px;height:100%;background:#ed1c24}
.uxbridgepics .uxbridgetext {position:absolute;bottom:5%;right:5%;width:50%;color:#fff;text-align:center;z-index:20;font-size:45px;line-height:54px}

.connections {padding:10vw 0}
.connectionsinfo {padding:5vw 7.5vw;display:flex;flex-direction:row;text-align:center;justify-content:center}
.connectionsinfo .connection {padding:2.5vw;display:flex;flex-direction:column;align-items:center}
.connectionsinfo .connection .icon {width:10vw;height:10vw;margin-bottom:5vw;background:50% 50% no-repeat;background-size:contain}

svg {width:100%;height:100%}
/*.connectionsinfo .connection .icon {stroke-dashoffset:0;stroke-dasharray: 400;transition:all 2s}
.connectionsinfo .connection .icon.beforescroll {stroke-dashoffset:400}
.connectionsinfo .connection .icon .redlines {stroke-dashoffset:400;transition:all 1s}
.connectionsinfo .connection .icon:hover .redlines {stroke-dashoffset:0}*/
.connectionsinfo .connection .icon .redlines {display: none}

.connectionsinfo .connection .icon .st0, .connectionsinfo .connection .icon .st1 {fill:none;stroke:#4D4D4D;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.connectionsinfo .connection .icon .redlines .st0, .connectionsinfo .connection .icon .redlines .st1 {fill:none;stroke:#ed1c24;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}



.connectionsinfo .connection .icon.walk {/*background-image: url("../img/content/location/connections/walk.svg")*/display:flex;align-items:center;justify-content:center}
.connectionsinfo .connection .icon.plane {/*background-image: url("../img/content/location/connections/plane.svg")*/display:flex;align-items:center;justify-content:center}
.connectionsinfo .connection .icon.car {/*background:bottom center no-repeat;background-image: url("../img/content/location/connections/car.svg")*/display:flex;align-items:flex-end;justify-content:center}
.connectionsinfo .connection .icon.tube {/*background-image: url("../img/content/location/connections/tube.svg")*/display:flex;align-items:center;justify-content:center}

.connectionsinfo .connection .icon.walk {background-image:url("../img/content/location/connections/walk.png")}
.connectionsinfo .connection .icon.walk:hover {background-image:url("../img/content/location/connections/walk.gif")}
.connectionsinfo .connection .icon.plane {background-image:url("../img/content/location/connections/plane.png")}
.connectionsinfo .connection .icon.plane:hover {background-image:url("../img/content/location/connections/plane.gif")}
.connectionsinfo .connection .icon.car {background-image:url("../img/content/location/connections/car.png")}
.connectionsinfo .connection .icon.car:hover {background-image:url("../img/content/location/connections/car.gif")}
.connectionsinfo .connection .icon.tube {background-image:url("../img/content/location/connections/tube.png")}
.connectionsinfo .connection .icon.tube:hover {background-image:url("../img/content/location/connections/tube.gif")}

.connectionsinfo .connection .text {color:#4d4d4d}
.connectionsinfo .connection .text .noe {font-size:40px}



.occupiers {padding:10vw 0 5vw 0}
.occupiersheading {display:flex;flex-direction:row}
.occupiersheading .subheading {flex:0 0 calc(50% - 10vw)}
.occupiersheading p {margin-right:15vw}

.occupierlogos {display:flex;flex-wrap:wrap;flex-direction:row;margin:5vw 15vw;justify-content:center}
.occupierlogos .logo {flex:0 0 calc((95% - 2px) / 3);height:10vw;border-bottom:1px solid #999999;display:flex;flex-direction:row;align-items:center;justify-content:center}
.occupierlogos .logo div {width:60%;height:60%;background:50% 50% no-repeat url("/img/content/location/occupiers/amgen.svg");background-size:contain;}
.occupierlogos .logo:nth-child(1) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(2) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(4) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(5) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(7) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(8) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(10) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(11) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(13) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(14) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(16) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(17) {border-right:1px solid #999999}
.occupierlogos .logo:nth-child(19) {border-bottom:none;border-right:1px solid #999999}
.occupierlogos .logo:nth-child(20) {border-bottom:none;border-right:1px solid #999999}
.occupierlogos .logo:nth-child(21) {border-bottom:none}


/**** culture ****/
.peoplepics {width:calc(100% - 20vw);height:80vh;position:relative;margin:5vw 10vw}
.personpic {transition:all 0.2s;width:100%;height:100%;background:50% 50% no-repeat;background-size:cover;filter: blur(0px);-webkit-filter: blur(0px) grayscale(0%);}
.peoplepics.personhover .personpic {
    opacity: 0.6;filter: blur(3px);-webkit-filter: blur(3px);transition:all 0.5s;
}
.peoplepics.personhover .personpic:hover {
   opacity: 1;filter: blur(0px);-webkit-filter: blur(0px);
}

/*.peoplepics:hover .personpic {
    opacity: 0.6;filter: blur(4px) grayscale(100%);-webkit-filter: blur(4px) grayscale(100%);
}
.peoplepics .personpic:hover {
   opacity: 1;filter: blur(0px) grayscale(0%);-webkit-filter: blur(0px) grayscale(0%);
}*/
/*.personpic:not(:hover){
  opacity: 0.3;
}*/
.peoplepics .pic1 {background:50% 50% no-repeat;background-size:cover;position:absolute;top:5%;left:7%;width:40%;height:60%;z-index:10}
.peoplepics .pic2 {background:50% 50% no-repeat;background-size:cover;position:absolute;top:0;right:0;width:45%;height:55%;z-index:10}
.peoplepics .pic3 {background:50% 50% no-repeat;background-size:cover;position:absolute;bottom:10%;left:0;width:20%;height:40%;z-index:10}
.peoplepics .pic4 {background:50% 50% no-repeat;background-size:cover;position:absolute;top:60%;left:48%;width:20%;height:30%;z-index:10}
.peoplepics .pic5 {background:50% 50% no-repeat;background-size:cover;position:absolute;top:40%;right:5%;width:22%;height:40%;z-index:10}
.peoplepics .redline {position:absolute;top:0;left:50%;width:1px;height:100%;background:#ed1c24}

.peopleslider {color:#666666;position:relative;margin:10vw 0 5vw 0}
.peopleslider .slide {padding:0 20vw 5vw 20vw;text-align:center;width:calc(100% - 40vw)}
.peopleslider .slide .noe {font-size:45px;line-height:54px}
.peopleslider .slidepager {width:100%;display:flex;flex-direction:row;justify-content:center;position:absolute;bottom:0}
.peopleslider .slidepager span {flex:0 0 10px;height:10px;border:#ed1c24 1px solid;text-indent:-9999px;overflow:hidden;border-radius:5px;margin:0 3px;cursor:pointer}
.peopleslider .slidepager span.cycle-pager-active {background:#ed1c24}
.peopleslider .slidearrow, .planslider .slidearrow {width:23px;height:46px;background:50% 50% no-repeat;background-size:contain;position:absolute;top:calc(50% - 23px);z-index:500;cursor:pointer}
.peopleslider .slidearrow#prev, .planslider .slidearrow.slideprev {background-image:url("../img/ui/leftarrow.svg");left:10vw}
.peopleslider .slidearrow#next, .planslider .slidearrow.slidenext {background-image:url("../img/ui/rightarrow.svg");right:10vw}

.occupierlogos.peoplelogos .logo:nth-child(4), .occupierlogos.peoplelogos .logo:nth-child(5), .occupierlogos.peoplelogos .logo:nth-child(6) {border-bottom:none}
.occupierlogos.peoplelogos .logo {border-color:#ed1c24}
.collective {margin-top:10vw;min-height:80vh;position:relative;padding-top:2.5vw}
.collective .pic1 {background:top right no-repeat;background-size:cover;position:absolute;top:0;right:0;width:60%;height:100%;z-index:-1
}
.collective .pic2 {background:50% 50% no-repeat;background-size:cover;position:absolute;bottom:0;left:0;width:30%;height:60vh;z-index:-1}
.collective .pic1 .cycle-slideshow, .collective .pic2 .cycle-slideshow {width:100%;height:100%;position:relative}
.collective .pic1 .slide, .collective .pic2 .slide {width:100%;height:100%;background:50% 50% no-repeat;background-size:cover}
.collective .collectivetext {margin:2.5vw 0 0 10vw;width:25%;padding-bottom:70vh}

.collectiveicons {padding:10vw 10vw 5vw 10vw;display:flex;flex-direction:row;justify-content:space-between;flex-wrap: wrap;}
.collectiveicons .collectiveitem {display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:5vw}
.collectiveicons .collectiveitem .icon {width:25vw;height:8vw;background:50% 50% no-repeat;background-size:contain;margin-bottom:2.5vw}

.collectiveitem .icon.football {background-image:url("../img/content/culture/activities/football.png")}
/*.collectiveitem .icon.football:hover {background-image:url("../img/content/culture/activities/football.gif")}*/
.collectiveitem .icon.yoga {background-image:url("../img/content/culture/activities/yoga.png")}
/*.collectiveitem .icon.yoga:hover {background-image:url("../img/content/culture/activities/yoga.gif")}*/
.collectiveitem .icon.pamper {background-image:url("../img/content/culture/activities/pamper.png")}
/*.collectiveitem .icon.pamper:hover {background-image:url("../img/content/culture/activities/pamper.gif")}*/
.collectiveitem .icon.pizza {background-image:url("../img/content/culture/activities/pizza.png")}
/*.collectiveitem .icon.pizza:hover {background-image:url("../img/content/culture/activities/pizza.gif")}*/
.collectiveitem .icon.workshops {background-image:url("../img/content/culture/activities/workshops.png")}
/*.collectiveitem .icon.workshops:hover {background-image:url("../img/content/culture/activities/workshops.gif")}*/
.collectiveitem .icon.massage {background-image:url("../img/content/culture/activities/massage.png")}
.collectiveitem .icon.pool {background-image:url("../img/content/culture/activities/pool.png")}
.collectiveitem .icon.tabletennis {background-image:url("../img/content/culture/activities/tabletennis.png")}


.downloadholder {width:100%;text-align:center;position:relative}
.downloadholder:before {content:'';display:block;width:1px;height:10vw;background:#ed1c24;margin-left:50%}
.download, .fixedenquire {margin:0 auto;display:inline-block;padding:1.25vw;text-decoration:none;background:#ed1c24;color:#fff}
.fixedenquire {padding:15px 30px}
.download:hover, .fixedenquire:hover {background:#f5d9cb;color:#4d4d4d;}

.downloadfull {display:block;background: #ed1c24 url(/img/ui/downarrow.svg) left 50% bottom 20px no-repeat;background-size:auto 15px;color:#fff;padding:35px 40px 50px 40px;text-align:center;font-size:30px;line-height:1em}
.downloadfull:hover {background-color:#4D4D4D}


.eventsoverlap {margin-top:-10vw;padding-top:10vw}
.events {padding:10vw 0 5vw 0}
.eventtext {color:#4d4d4d;display:flex;flex-direction:row;justify-content:space-between;padding:5vw 10vw}
.eventtext .col1 {flex:0 0 50%}
.eventtext .col2 {flex:0 0 30%;text-align:right}
.eventpic {margin:0 10vw;height:60vh;background:50% 50% no-repeat;background-size:cover}


/**** space ****/
.size {width:80%;margin:2.5vw 10%;text-align:center;font-size:45px;line-height:54px}
.galleries {margin:5vw 0}
.buildinggallery {height:0;width:100%;margin:0;overflow:hidden;transition:height 0.4s}
.buildinggallery.active {height:80vh}
.buildinggallery .slide {width:80vw;height:80vh;background:50% 50% no-repeat;background-size:cover;margin:0 0.5vw}
.slick-arrow {background:50% 50% no-repeat rgba(255,255,255,0.7);background-size:23px auto;position:absolute;top:calc(40vh - 23px);width:40px;height:60px;border:0;overflow:hidden;text-indent: -9999px;z-index:500;cursor:pointer;}
.slick-prev {background-image:url("../img/ui/leftarrow.svg");left:12vw}
.slick-next {background-image:url("../img/ui/rightarrow.svg");right:12vw}

.galleryselect {display:flex;flex-direction:row;margin-bottom:10vw}
.galleryselect h2 {flex:0 1 40%}
.galleryselect ul {display:flex;flex-direction:row;flex-wrap: wrap;margin:0;padding:0;list-style-type:none}
.galleryselect ul li {flex:0 0 50%;margin:0;padding:0;text-decoration:underline;color:#4d4d4d;cursor:pointer}
.galleryselect ul li.active {color:#ed1c24}

.specification {padding:10vw 0}
.specheader {display:flex;flex-direction:row;}
.specheader h2 {flex:0 0 40%}
.specheader p {flex:0 1 30%;margin-right:10vw}


.specicons {display:flex;flex-wrap:wrap;padding:5vw 7.5vw 0 7.5vw}
.specitem {margin:2.5vw;display:flex;flex-direction:column;align-items:center;flex:0 0 calc(25% - 5vw);text-align:center}
.specitem .icon {width:15vw;height:15vw;margin-bottom:0;background:50% 50% no-repeat;background-size:contain}
/*.specitem .icon.hairdryer {background-image:url("../img/content/space/specification/hairdryer.png")}*/
.specitem .icon.hairdryer {background-image:url("../img/content/space/specification/hairdryer.gif")}
/*.specitem .icon.wifi {background-image:url("../img/content/space/specification/wifi.png")}*/
.specitem .icon.wifi {background-image:url("../img/content/space/specification/wifi.gif")}
/*.specitem .icon.concierge {background-image:url("../img/content/space/specification/concierge.png")}*/
.specitem .icon.concierge {background-image:url("../img/content/space/specification/concierge.gif")}
/*.specitem .icon.coffee {background-image:url("../img/content/space/specification/coffee.png")}*/
.specitem .icon.coffee {background-image:url("../img/content/space/specification/coffee.gif")}
/*.specitem .icon.leaf {background-image:url("../img/content/space/specification/leaf.png")}*/
.specitem .icon.leaf {background-image:url("../img/content/space/specification/leaf.gif")}
/*.specitem .icon.chair {background-image:url("../img/content/space/specification/chair.png")}*/
.specitem .icon.chair {background-image:url("../img/content/space/specification/chair.gif")}
/*.specitem .icon.sun {background-image:url("../img/content/space/specification/sun.png")}*/
.specitem .icon.sun {background-image:url("../img/content/space/specification/sun.gif")}
/*.specitem .icon.bike {background-image:url("../img/content/space/specification/bike.png")}*/
.specitem .icon.bike {background-image:url("../img/content/space/specification/bike.gif")}

.amenitieshead {padding:5vw 0 }
.amenitiesintro {padding:0 0 0 10vw;width:35vw}
.caffe {margin-left:10vw;background:#faebe3;color:#4d4d4d;display:flex}
.caffe .pic1 {background:50% 50% no-repeat;background-size:cover;flex:0 0 40vw;z-index:10;position:relative}
.caffe .text {padding:40px 80px 40px 40px;font-size:16px;line-height:24px}
.amenities {margin:5vw 0 5vw 0;display:flex;flex-direction:row;position:relative}
.caffe .download {margin-top:20px}
.amenities div.redline {position:absolute;top:-10vw;left:calc(50vw - 1px);width:1px;height:calc(100% + 10vw);background:#ed1c24;z-index:-1}
.amenities .col1 {flex:0 0 45%;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.amenities .col1 p {width:60%;margin:5vw 0vw 5vw 10vw}
.amenities .col1 .pic1 {background:50% 50% no-repeat;background-size:cover;width:40vw;height:45vw;z-index:10;margin-bottom:5vw;position:relative}
.amenities .col1 .pic2 {background:50% 50% no-repeat;background-size:cover;width:100%;height:35vw;z-index:10;margin-bottom:5vw;position:relative}
.amenities .col2 {flex:0 0 55%;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start}
.amenities .col2 .pic1 {background:50% 50% no-repeat;background-size:cover;width:100%;height:30vw;z-index:10;margin-bottom:5vw;position:relative}
.amenities .col2 p {font-size:45px;line-height:54px;text-align:center;margin:5vw 5vw 5vw 0;color:#4d4d4d}
.amenities .col2 .pic2 {background:50% 50% no-repeat;background-size:cover;width:40vw;height:25vw;z-index:10;margin-bottom:5vw;position:relative}
.amenities .caption, .caffe .caption {background:#ed1c24;color:#fff;font-size:30px;line-height:30px;display:block;position:absolute;padding:10px;bottom:-10px}
.amenities .col1 .pic1 .caption {right:2vw}
.amenities .col1 .pic2 .caption {right:4vw}
.amenities .col2 .pic1 .caption {left:6vw}
.amenities .col2 .pic2 .caption {left:4vw}

.contact {padding:5vw 0;margin-bottom:10vw}
.contact h2 {margin:0 0 5vw 10vw;font-size:45px;line-height:54px}
.contacts {margin:0 10vw;display:flex;flex-direction:row;justify-content: space-between;}
.contacts .agents {display:flex;flex:1 1}
.contacts .agent {padding-right:5vw}
.contacts .agent:last-child {padding:0}
/*.contacts .agent:nth-child(1) {flex:0 0 35%}
.contacts .agent:nth-child(2) {flex:0 0 45%}*/
.contacts .agent a {color:#fff}
.contacts .agent .agentlogo {width:120px;height:80px;background:bottom left no-repeat;background-size:contain;display:block;margin-bottom:2.5vw}
.contacts .landid {flex:0 0 20%;display:flex;flex-direction:column;align-items:flex-end}
.contacts a.landid {flex:0 0 100%;width:120px;height:120px;background:url("../img/content/spelthorne.svg") top right no-repeat;margin-top:20px}

/**** availability ****/
.plansection {padding:5vw 0}
.north {position: absolute;bottom:40px;left:40px;}
.north img {width:30px;display:block;margin:0 0 10px 0}
.north p {margin:0;line-height:1.3em}
.planslider {position:relative}
.planslider .slide {padding:0 15vw;box-sizing: border-box;width:100%;}
.planslider .slideinner {display:flex;align-items:center;height:60vh}
.planslider .text {border-left:1px solid #4D4D4D;padding-right:40px}
.planslider .plan {flex:1 1;height:100%;display:flex;align-items:center;justify-content: center;}
.planslider .plan img {max-height:100%;max-width:100%}
.floorname {font-size:30px;padding:5px 10px;display:inline-block;color:#fff;line-height:1.2em}
.floordeets {padding:20px}
.occupierlogo {width:160px;height:50px;background:left center no-repeat;background-size:contain;margin-bottom:10px}

.splits {padding:5vw 0}
.splittabs {display:flex;padding:2.5vw 0 0 10vw}
.splittabs a {color:#4d4d4d;font-size:30px;line-height:1.2em;padding:5px 15px 0 15px;cursor: pointer;}
.splittabs a:hover {text-decoration: underline;}
.splittabs a.active {background:#faebe3;}
.splitholder {padding:5vw 10vw;display:flex;align-items:center;opacity: 0;pointer-events: none;position:absolute;transition:opacity 0.5s}
.splits.lowerground .splitholder.lowerground,
.splits.upperground .splitholder.upperground,
.splits.first .splitholder.first,
.splits.second .splitholder.second,
.splits.third .splitholder.third,
.splits.fourth .splitholder.fourth,
.splits.fifth .splitholder.fifth {opacity:1;pointer-events: all;position:relative}
.splitholder .splitslider {flex:0 0 60vw;}
.splitinner {width:100%;height:100%;display:flex;align-items:center;justify-content: center;}
.splitholder .splitslider, .splitholder .splitslider .slide {height:60vh;width:60vw}
.splitslider img {max-height:100%;max-width:100%}

.splitnav {padding-left:20px}
.splitpager {list-style-type: none;margin:0;padding:0;}
.splitpager li {margin:0 0 10px 0;border-bottom:1px solid #ed1c24;padding:0 0 10px 0;position:relative;cursor: pointer;}
.splitpager li.cycle-pager-active:before {content:'';display:block;width:20px;height:100%;position:absolute;left:-20px;top:0;background:left center no-repeat url(/img/ui/select.svg);background-size:10px auto}
.splitpager li:hover {text-decoration: underline;}

.schedulesection {color:#4D4D4D;padding:5vw 0}
.availabletable {padding:2.5vw 10vw;display:flex}
.availabletable .scheduletext {padding-left:10vw;box-sizing: border-box;flex:0 0 33vw;}

.availabletable .redline {width:100%;height:1px;background:#ec2027;margin:15px 0}
.availabletable td {padding:3px 0}

/**** contact ****/
.contactpage {padding:5vw 0;margin-bottom:10vw}
.contactpage h2 {margin:10vw 0 5vw 10vw;font-size:45px;line-height:54px}
.redlinebreak {width:calc(100% - 20vw);height:1px;background:#ec2027;clear:both;margin:5vw auto}
.address {margin:0 0 5vw 10vw;display:flex;flex-direction:column}
.address .address1 {flex:0 0 35%;margin-top:calc(80px + 2.5vw)}
.address .address2 {flex:0 0 45%}
.address .landid {flex:0 0 20%;display:flex;flex-direction:column;align-items:flex-end}
.address a.landid {flex:0 0 100%;width:120px;height:120px;background:url("../img/content/spelthorne.svg") top right no-repeat;margin-top:20px}

.contactpage a {color:#fff}
.contactpage .download {margin-left:10vw}

/**** privacy ****/
.privacylink {font-size:11px;line-height:13px;margin-top:20px;color:#fff;text-decoration: none}
.privacylink:hover {text-decoration: underline}
.copyright {font-size:11px;line-height:13px;margin:10px 0 0 0;color:#fff;text-decoration: none}
.privacypage {padding:25vw 20vw 10vw 20vw;width:calc(100% - 40vw);color:#4d4d4d}
.privacypage a {color:#fff}

/**** enquiry form ****/
.enquiryholder {position:fixed;z-index:6000;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden;transition:height 0s 0.2s, opacity 0.2s 0s;height:0;opacity:0}

.enquirybg {position:absolute;top:0;left:0;background:rgba(77,77,77,0.9);width:100%;height:100%;z-index:6001}
.enquiryform {background:#b0a7ab;width:80vw;max-width:800px;z-index:6002;color:#fff;padding:5vh 5vw;position:relative;transition:top 0.2s 0s;top:25px}
.closeenquiry {display:block;position:absolute;top:20px;right:20px;width:16px;height:16px;background:url("../img/ui/close.svg") 50% 50% no-repeat;background-size:contain;margin-bottom:10px;cursor:pointer;cursor:hand}
.enquiryform h2 {color:#4d4d4d;text-align:center}

.enquiryopen .enquiryholder {transition:height 0s 0s, opacity 0.2s 0s;height:100%;opacity:1}
.enquiryopen .enquiryform {top:0}

.charterform {}
.charterform .charterfield {width:calc(50% - 20px);margin:10px;padding:0;float:left}
.charterform .charterfield input[type='text'] {border:0;padding:10px;text-align:center;font-size:16px;line-height:20px;font-family:'Lato', sans-serif;width:calc(100% - 20px)}
.chartercheckbox, .charterbutton {width:100%;clear:both;padding:10px 0 !important}
.charterbutton input {border:0;font-size:16px;line-height:20px;font-family:'Lato', sans-serif;padding:10px 30px;cursor:pointer;cursor:hand;background:#ed1c24;color:#fff}
.charterbutton input:hover {background:#f5d9cb;color:#4d4d4d}

.enquiryform .privacy {font-size:9px;line-height:11px;clear:both;margin:10px 10px 10px 10px}
.chartercheckbox, .charterbutton {margin:10px 10px 0 10px;text-align:center}


/****************************************************
* 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;
}



/* #Media Queries
================================================== */
	
	/* biggest desktop */
	@media only screen and (max-width: 1230px) {}
	
	/* bigger desktop */
	@media only screen and (min-width: 1100px) and (max-width: 1229px) {}

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width:1099px) {
		.splitnav {font-size:16px}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		
		body {font-size:16px;line-height:22px}
		.scrolled .charterlogo {width:100px;height:100px}
		
		.navholder {top:0;right:0;width:100vw;overflow:hidden;height:60px}
		
		.navholder .navinner .nav ul {flex-direction:column;align-items:center}
		.navholder .navinner .nav ul li {margin:2.5vw 0}
		
		.navbg {width:100vw;opacity:0.95}

		.navbutton {top:5vw;right:5vw;width:40px;height:33px;transition:right 0.2s 0s;}
		
		.navicon span {width:40px;transition:top 0.2s}
		.navicon span:nth-child(1) {top:0;left:0}
		.navicon span:nth-child(2) {top:12px;left:0}
		.navicon span:nth-child(3) {top:24px;left:0}

		.navholder .navinner {width:100%}
		.navholder .navinner .nav {position:absolute;right:auto;left:100vw;/*transition:right 0.2s 0.2s*/}
		.navopen .navholder .navinner .nav ul {flex-direction:column;justify-content:center;align-items:center;text-align:center;width:100vw;height:100vh}
		.navopen .navholder .navinner .nav ul li {margin:15px 0;font-size:22px;line-height:22px;flex:0 0 auto}
		
		
		.navopen .navholder .navinner .nav .topnav {font-size:30px;line-height:30px}
		.navopen .navinner .nav ul.subnav {display:none}
		.navopen .navholder {width:100vw}
		.navopen .navholder .navinner {width:100vw;height:100vh;}
		.navopen .navinner .nav {width:100%;align-items:center;justify-content: center}
		
		
		
		.scrolled .navbutton {right:5vw;transition:right 0.2s 0s}
		.scrolled .navinner .nav {right:auto;transition:left 0.2s 0.2s}

		.navopen .navinner .nav {right:auto;left:0;transition:left 0.2s 0.2s}
		.navopen .navbg,.navopen .navholder {height:100vh}
		.navopen .navholder .navinner .nav ul li.n0, .navopen .navholder .navinner .nav ul li.n4 {flex:0 0 auto;padding:0}
		
		.subheading, .breaktext .noe, .size, .amenities .col2 p, .uxbridgepics .uxbridgetext {font-size:30px;line-height:36px}
		
		/**** footer ****/
		.charterinstagram .links {font-size:18px}
		
		/**** home ****/
		.piclinks a .text {font-size:24px}
		
		/**** location ****/
		.uxbridgeoverlap {margin-top:-30vh;padding-top:30vh}
		.uxbridgepics {height:60vh}
		.mapsection .mapholder {margin:0;width:100%}
		.mapkey {position:relative;display:inline-block;bottom:0}
		
		.connectionsinfo .connection .text .noe {font-size:20px;line-height:24px}
		
		.occupiersheading .subheading {flex:0 0 calc(60% - 10vw)}
		/*.occupiersheading p {font-size:16px;line-height:22px}*/
		
		/**** culture ****/
		.peoplepics {height:60vh}
		
		.collective {height:60vh}
		/*.collective .collectivetext {font-size:16px;line-height:22px}*/
		
		.eventtext {font-size:16px;line-height:22px}
		
		/**** space ****/
		.buildinggallery.active {height:60vh}
		.buildinggallery .slide {height:60vh}
		.slick-arrow {top:calc(30vh - 23px)}
		
		.amenitiesintro {width:75vw}
		.caffe {flex-direction:column}
		
		.amenities .caption {font-size:20px;line-height:20px}
		
		/**** availability ****/
		.specheader h2 {flex-basis:60%}
		.splitholder {flex-direction: column;}
		.splitholder .splitslider, .splitholder .splitslider .slide {height:40vh}
		.availabletable .scheduletext {padding-left:5vw;}
		
		.floorname {font-size:20px}
		.occupierlogo {width:100px;height:30px}
		
}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		.charterlogo, .scrolled .charterlogo {width:60px;height:60px}
		
		.social {display:none}
		
		
		

		
		
		.bannertext {font-size:24px;line-height:30px}
		.subheading, .breaktext .noe, .size, .amenities .col2 p, .uxbridgepics .uxbridgetext, .peopleslider .slide .noe {font-size:22px;line-height:30px}
		.scroll, .fixedenquire {display:none}
		.bannersub {font-size:20px}
		
		.breaktext {padding:30px 5vw}
		
		/**** footer ****/
		.charterinstagram .links .instaicon {width:20px;height:20px}
		.charterinstagram .links {font-size:14px}
		.charterinstagram #instagramImages .instaWrap {width:calc(25vw - 2px);height:25vw}
		
		.footer .inner {flex-direction:column;padding-top:30px}
		.footerleft {margin-bottom:10px}
		.footerright {align-items:flex-start}
		.footer .landid {margin:30px auto}
		
		
		/**** home ****/
		.piclinks {flex-direction:column}
		.piclinks a {width:100%;flex:0 0 40vh;margin:2px 0}
		.piclinks a .pic {background-size:100% auto}
		.piclinks a:hover .pic {background-size:105% auto}
		
		/**** location ****/
		.mapkey ul li {font-size:14px}
		.uxbridgepics {height:auto}
		.uxbridgepics .pic1 {position:relative;height:200px;width:80vw;margin:0 0 5vw 20vw}
		.uxbridgepics .pic2 {position:relative;height:200px;width:80vw;margin:0 20vw 5vw 0}
		.uxbridgepics .uxbridgetext {position:relative;right:auto;bottom:auto;width:90vw;margin:5vw}
		
		.connectionsinfo {flex-wrap:wrap}
		.connectionsinfo .connection {flex:0 0 40%}
		.connectionsinfo .connection .icon {width:50px;height:50px}
		
		.occupiersheading {flex-direction:column}
		.occupiersheading p {margin-left:10vw}
		
		.occupierlogos {margin:5vw 0}
		.occupierlogos .logo {height:15vw}
		.occupierlogos .logo div {width:70%;height:70%}
		
		/**** culture ****/
		.peoplepics {width:90vw;height:auto;margin:5vw 5vw 50px 5vw}
		.peoplepics .pic1 {position:relative;top:auto;left:auto;width:60%;height:80vw;z-index:10;float:left}
		.peoplepics .pic2 {position:relative;top:auto;right:auto;width:45%;height:55vw;z-index:10;float:left;margin:-5vw 0 0 -10vw}
		.peoplepics .pic3 {position:relative;bottom:auto;left:auto;width:45%;height:40vw;z-index:10;float:left;margin:10vw 0 0 -5vw}
		.peoplepics .pic4 {position:relative;top:auto;left:auto;width:35%;height:50vw;z-index:10;float:left;margin:-5vw 0 0 5vw}
		.peoplepics .pic5 {position:relative;top:auto;right:auto;width:50%;height:55vw;z-index:10;float:left;margin:5vw 0 0 5vw}
		
		.collective {margin-top:10vw;height:auto;position:relative;padding-top:2.5vw}
		.collective .pic1 {position:relative;top:auto;right:auto;width:80vw;height:50vw;z-index:-1}
		.collective .pic2 {position:relative;bottom:auto;left:auto;width:80vw;height:50vw;z-index:-1;margin:5vw 0 0 20vw}
		.collective .collectivetext {margin:5vw 10vw;width:80vw}
		
		.collectiveicons {flex-wrap:wrap;justify-content:center}
		.collectiveicons .collectiveitem {flex:0 0 40%;margin-bottom:10vw}
		.collectiveicons .collectiveitem .icon {width:50px;height:50px}
		
		
		
		.download {padding:5vw}
		
		.eventtext {flex-direction: column}
		.eventtext .col2 {text-align: left}
		
		
		/**** space ****/
		.buildinggallery .slide, .buildinggallery.active {height:50vw}
		.slick-arrow {top: calc(25vw - 23px);}
		.galleryselect {flex-direction:column}
		.galleryselect ul {margin-left:10vw}
		.specheader {flex-direction:column}
		.specheader p {margin:0 10vw 5vw 10vw}
		
		.specitem {flex:0 0 40%;margin-bottom:10vw}
		.specitem .icon {width:50px;height:50px}
		
		.caffe .text {padding-right:40px}
		
		.amenities {flex-direction:column}
		.amenities div.redline {left:80%}
		.amenities .col1 .pic1 {width:60vw;height:70vw;margin-bottom:10vw}
		.amenities .col1 .pic2 {width:85vw;height:70vw;margin-left:15vw}
		.amenities .col2 {align-items:flex-start}
		.amenities .col2 .pic1 {width:85vw;height:70vw;margin:5vw 0}
		.amenities .col2 p {width:80vw;margin:5vw 10vw}
		.amenities .col2 .pic2 {width:95vw;height:70vw}
		
		.contacts {flex-direction:column}
		.contacts .agent {margin-bottom:10vw}
		.contacts .agent .agentlogo {margin-bottom:5vw}
		
		.contacts .landid {display:block}
		
		/**** availability ****/
		.planslider .slideinner {flex-direction: column;height:90vh}
		.planslider .slidearrow {width:18px}
		.planslider .slidearrow.slideprev {left:20px}
		.planslider .slidearrow.slidenext {right:20px}
		.availabletable {flex-direction: column;padding-right:10vw;}
		.availabletable .scheduletext {padding:0}
		.availabletable table {font-size:12px;line-height:1.3em}
		
		/**** contactc ****/
		.contactpage h2 {margin-top:120px}
		.address {flex-direction:column}
		.address .address1, .address .address2 {margin-bottom:10vw}
		.address .landid {display:block}
		
		
		
}

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

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		.homeintro {height:60vh}
		.homeintro .banner {background-position:right center}
		
}


/* #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: 'Noe';
	    src: url('/fonts/Noe Display Bold.eot');
	    src: url('/fonts/Noe Display Bold.eot?iefix') format('eot'),
	         url('/fonts/Noe Display Bold.woff') format('woff');
	    font-weight: normal;
	    font-style: normal; }