html,body{margin:0;padding:0;width:100%;}
html{font-size:62.5%;/*user's browser setting controls font-size, default is 16px (so now 24px = 2.4rem)*/}
body{font-family:'Founders-Grotesk', sans-serif;background-color:#FAF5EF;color:#3D4E44;box-sizing:border-box;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeSpeed;/*transition:background-color .5s ease-out;*/}
::selection{color:#FAF5EF;background-color:#3D4E44;}
body:not(.animates) *{transition:none!important;}
/* for testing without scrollbar 
body::-webkit-scrollbar{width:0;height:0;}*/
.lock{overflow:hidden!important;width:100%;height:100%;}
.lockoverlay{position:fixed;left:0;top:0;width:100%;height:100%;z-index:5;background-color:#FAF5EF;transition:opacity .6s ease-out;}
.lockoverlay.hide{pointer-events:none;opacity:0;}
.lockoverlay .login{position:absolute;left:50%;top:50%;width:320px;height:200px;margin:-100px 0 0 -160px;text-align:center;}
.lockoverlay .login input{margin-top:30px;text-align:left;width:100%;border-bottom:1px solid #9b9c94;padding:5px 0;}
.lockoverlay .login .error{color:red;font-family:'Founders-Grotesk';text-transform:uppercase;font-size:1.2rem;font-weight:500;letter-spacing:.2rem;margin-top:10px;opacity:0;transition:opacity .3s ease-out;}
.lockoverlay .login .error.on{opacity:1;}
.lockoverlay .login .enterBtn{font-family:'Founders-Grotesk';text-transform:uppercase;font-size:1.2rem;font-weight:500;letter-spacing:.2rem;/*border-bottom:1px solid #3D4E44;*/padding:2px;margin-top:40px;transition:opacity .3s ease-out;}
.lockoverlay .login .enterBtn:hover{opacity:.6;}

@font-face{font-family:'Founders-Grotesk';src:url('../Fonts/founders-grotesk-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-stretch:normal;font-display:swap;}
@font-face{font-family:'Founders-Grotesk';src:url('../Fonts/founders-grotesk-medium.woff2') format('woff2');font-weight:500;font-style:normal;font-stretch:normal;font-display:swap;}

h1,h2,h3,h4,h5,h6,p,q{position:relative;margin:0;padding:0;font-weight:normal;font-style:normal;line-height:1.3;box-sizing:border-box;}
h1,h2{font-size:1.3rem;line-height:1.3;text-transform:uppercase;letter-spacing:.25rem;}
.contactform .title{font-size:3.4rem;font-weight:100;line-height:1.4;font-family:'ivypresto-text';/*letter-spacing:.1rem;*/}
h3,p{font-size:1.9rem;line-height:1.4;min-height:1.4rem;font-family:'ivypresto-text';/*letter-spacing:.1rem;*/}
h3{font-weight:400;}
p{font-weight:100;}
p.small{font-size:1.7rem;line-height:1.5;}
.person h3, .bioOverlay h3{font-size:2.7rem;font-weight:100;}
@media (min-width:1000px) {.person h3.long{font-size:2.5rem;line-height:1.5;}}
p a, p button,li a, h2 a, h3 a{text-decoration:none;transition:opacity .3s ease-out;}
p a:hover, p button:hover, li a:hover, h2 a:hover, h3 a:hover{opacity:.6;}
p.label, label, input[type="submit"]{font-family:'Founders-Grotesk';text-transform:uppercase;font-size:1.4rem;line-height:1.4;letter-spacing:.25rem;}
header p.label, label, input[type="submit"]{font-size:1.2rem;}
input[type="submit"]{font-weight:500;}
.primary{font-family:'ivypresto-text';font-size:3.0rem;line-height:1.4;letter-spacing:.2rem;font-weight:100;}
.secondary{font-family:'ivypresto-text';font-size:1.7rem;line-height:1.4;letter-spacing:.1rem;font-weight:100;}
header .menuToggle, .contactToggle{font-size:2.0rem;font-family:'ivypresto-text';line-height:1;box-sizing:border-box;padding:10px;/*letter-spacing:.1rem;*/font-weight:100;transition:opacity .3s ease-out;will-change:opacity;}
.contactToggle.faded{opacity:0;}

/*      Buttons     */
a{position:relative;box-sizing:border-box;color:inherit;text-decoration:none;line-height:inherit;}
a,.home .time .slider .knob{-moz-user-drag:none;-moz-user-select:none;-webkit-user-select:none;-webkit-user-drag:none;user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);touch-action:manipulation;/*removes delay*/}
button{position:relative;box-sizing:border-box;margin:0;padding:0;border:none;background:none;color:inherit;font-family:inherit;cursor:pointer;letter-spacing:inherit;text-transform:inherit;font-weight:inherit;}
button:focus{outline:none;}
button{-moz-user-select:none;-webkit-user-select:none;-webkit-user-drag:none;user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
input, textarea{font-family:'ivypresto-text';font-size:1.8rem;font-weight:100;/*letter-spacing:.1rem;*/appearance:none;background:none;border:none;display:block;color:#3D4E44;padding:0;margin:0;outline:0;}

@media all and (max-width:1000.5px){
    h3,p{font-size:1.6rem;line-height:1.5;}
    h1,h2, p.label, label, input[type="submit"]{font-size:1.2rem;}
    p.small{font-size:1.4rem;}
    .contactform .title{font-size:2.4rem;}

    header .menuToggle, .contactToggle{font-size:1.4rem;}
}

/*      Media       */
img,video,.lazy{border:0;-moz-user-select:none;-webkit-user-select:none;-webkit-user-drag:none;user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
img,video{pointer-events:none;}/*with smooth scroll this helps Firefox external mouse*/
.fade{opacity:0;transition:opacity .6s ease-in-out;}
.fade.in{opacity:1;}
.lazy{position:relative;}
.lazy .rel{position:relative;width:100%;overflow:hidden;}
.lazy .rel .img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;transition:opacity 1.0s ease-in-out;/*, transform 2.0s ease-out;*/will-change:opacity;}
.txtfade{opacity:0;transition:opacity 0s ease-in-out;will-change:opacity;}
.txtfade.in{opacity:1;transition-duration:1s;}
.externalvideoplayer{transition:opacity 1s ease-in-out;opacity:0;}
.externalvideoplayer.in{opacity:1;}
.externalvideoplayer.youtube{position:absolute;left:0;top:0;width:100%;height:100%;}
.externalvideoplayer.youtube iframe{position:absolute;left:0;top:0;width:100%;height:100%;}

/*      Menu        */
header{position:fixed;left:0;top:0;width:100%;height:0;z-index:10;}
header .menuoverlay, header .contactoverlay{position:fixed;top:0;width:50vw;height:100vh;color:#FFF;text-align:center;z-index:11;}
header .menuoverlay{left:0;}
header .contactoverlay{right:0;}
header .mainmenu{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:opacity .3s ease-out 0s;display:flex;overflow:auto;overflow-x:hidden;}
header .menuoverlay .center{position:relative;width:50vw;padding:15vh 50px 50px 50px;margin:auto;box-sizing:border-box;}
header .contactoverlay .center{position:relative;width:50vw;padding:10vh 50px 50px 50px;margin:auto;box-sizing:border-box;}
header .label{padding:15px 0;}
header .menuoverlay:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background-color:#617F6E;transform-origin:0 0;transform:scaleX(0);transition:transform 1s cubic-bezier(0.16, 1, 0.3, 1);will-change:transform;}
header .contactoverlay:before{content:"";position:absolute;right:0;top:0;width:100%;height:100%;background-color:#617F6E;transform-origin:100% 0;transform:scaleX(0);transition:transform 1s cubic-bezier(0.16, 1, 0.3, 1);will-change:transform;}
header .menuoverlay.open:not(.closing):before, header .contactoverlay.open:not(.closing):before{transform:scaleX(1);}
.openinquiry header .contactoverlay.open:not(.closing):before{transform:scaleX(2);}/*for form*/
header .menuoverlay:not(.open), header .contactoverlay:not(.open){pointer-events:none;}
header .menuoverlay:not(.open):not(.closing) .mainmenu, header .contactoverlay:not(.open):not(.closing) .mainmenu{width:0;overflow:hidden;}
header .menuoverlay.open:not(.closing) .mainmenu, header .contactoverlay.open:not(.closing) .mainmenu{opacity:1;transition:opacity .5s ease-out;}
header .menuoverlay:not(.opening):before, header .contactoverlay:not(.opening):before{transition:transform .6s cubic-bezier(0.76, 0, 0.24, 1);}

/* Tone down rest of website */
header .bg{content:"";position:fixed;left:0;top:0;width:0;height:100vh;background-color:#FAF5EF;z-index:10;pointer-events:none;opacity:0;transition:opacity .5s ease-out;will-change:opacity;}
.overlayon header .bg{opacity:.75;pointer-events:all;width:100vw;}
.overlayon.overlayoff header .bg{opacity:0;transition:opacity .4s ease-out;}

header .menuToggle{position:absolute;left:25px;top:15px;z-index:2;}
.contactToggle{position:absolute;right:25px;top:15px;z-index:2;}
header .menuToggle.open, .contactToggle.open{color:#FFF;z-index:100;}
.openinquiry .contactToggle.open{color:#3D4E44;transition:color .3s ease-out .3s, opacity .3s ease-out;}

header .primary{padding:20px 0;display:block;transition:opacity .3s ease-out;will-change:opacity, transform;}
header .secondary{padding:2px 0;display:block;transition:opacity .3s ease-out;}
/*header .secondary:first-of-type{padding-bottom:10px;}telephone*/
header .secondary + p.label{padding-top:35px;}
header .primary.selected, header .primary.selected:hover{opacity:.3;}

.menuoverlay .clientaccess{margin:50px auto;width:135px;}
.menuoverlay .clientaccess .illu{position:relative;width:100%;height:112px;background:url("../Grx/illu_menu.png") no-repeat;background-size:contain;}
.menuoverlay .clientaccess p.label{font-weight:500;padding-top:10px;}
header .credits{position:fixed;width:50vw;text-align:center;left:0;bottom:0;}
header .credits span{font-size:1.2rem;display:block;/*letter-spacing:.1rem;*/opacity:.6;}
header .credits a, header .credits button{opacity:.6;}

header .menuoverlay .credits .label{padding:10px 0 30px 0;font-weight:500;}
header .contactoverlay .label a{display:inline-block;font-weight:500;padding-bottom:4px;}
header .contactoverlay .label.underline{margin-bottom:25px;padding-top:35px;}
header .contactoverlay .label.underline button{padding-bottom:2px;/*font-size:1.2rem;font-weight:500;*/text-transform:none;font-family:'ivypresto-text';font-size:1.7rem;line-height:1.4;letter-spacing:.1rem;font-weight:100;}
header .contactoverlay .label.underline button:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background-color:#FFF;/*transform-origin:0 0;transition:transform .3s ease-out;will-change:transform;*/}
/*header .contactoverlay .label.underline button:hover:after{transform:scaleX(0);transform-origin:100% 0;}*/
header .projectinquiry{position:fixed;left:0;top:0;width:100vw;height:100vh;color:#3D4E44;overflow:hidden;z-index:99;}
header .projectinquiry .contactform{transition:opacity .8s ease-out .2s;will-change:opacity;background-color:#FAF5EF;position:absolute;left:0;top:0;width:100%;height:100%;display:flex;box-sizing:border-box;padding:25px;overflow:auto;}
header .projectinquiry:not(.open){width:0;pointer-events:none;}
header .projectinquiry:not(.open) .contactform{opacity:0;}

.toplogo{position:fixed;left:0;top:0;width:100vw;z-index:100;}
.toplogo .logo{position:absolute;left:calc(50% - 218px);top:1px;width:436px;transition:opacity .6s ease-out, transform 1.6s cubic-bezier(0.25, 1, 0.5, 1);will-change:opacity, transform;}
.toplogo .logo .rel{position:relative;padding-top:41.972%;}
.toplogo .logo .rel img{position:absolute;left:0;top:0;width:100%;height:100%;}

footer{position:fixed;left:0;bottom:0;width:100vw;z-index:100;}
footer .logo{position:absolute;left:calc(50% - 219px);bottom:1px;width:437px;transition:opacity .6s ease-out, transform 1.8s cubic-bezier(0.25, 1, 0.5, 1) .1s;will-change:opacity, transform;}
footer .logo .rel{position:relative;padding-top:21.052%;}
footer .logo .rel img{position:absolute;left:0;top:0;width:100%;height:100%;}

/* Start hidden */
.toplogo .logo{transform:translateX(150px);}
footer .logo{transform:translateX(-170px);}
.animedIn .toplogo .logo{transform:translateX(0%);}
.animedIn footer .logo{transform:translateX(0%);}
/* Control opacity for menu and scrolling */
.fadelogo .toplogo .logo, .fadelogo footer .logo{opacity:.05;transition:opacity 1s ease-out;}
.fadelogo footer .logo{pointer-events:none;}
.overlayon .toplogo .logo, .overlayon footer .logo{opacity:1;pointer-events:all;}
/* Hide when reading person bio */
.fadelogos .toplogo .logo, .fadelogos footer .logo{opacity:0;transition:opacity .3s ease-out;pointer-events:none;}
/* Hide for contact form */
.openinquiry .toplogo .logo, .openinquiry footer .logo{opacity:0;transition:opacity .3s ease-out;pointer-events:none;}

main{position:relative;width:100%;}
.page{position:relative;width:100%;box-sizing:border-box;font-size:0;}

/* Handle horizontal scrolling (desktop only) */
@media all and (min-width:1000.5px){
    body.hori{overflow-y:hidden;overflow-x:auto;}
    .page[data-horizontal="true"]{height:100vh;width:auto;}
    /* touch/ios version (100vh ios "bug") */
    html.ios{position:fixed;height:100%;overflow-y:hidden;}
    .ios body{height:100%;}
    .ios .page[data-horizontal="true"]{height:100%;}
    .ios main{height:100%;}
}

/* Standard module */
.m{position:relative;/*width:100%;*/box-sizing:border-box;}
.m .l, .m .r{position:relative;display:inline-block;vertical-align:top;width:50%;box-sizing:border-box;}

/* Projects etc. */
.fullscreensmodules{position:relative;height:100%;display:inline-block;white-space:nowrap;width:auto;}
.fullscreensmodules .scroller{position:relative;white-space:nowrap;width:auto;height:100%;display:inline-flex;flex-direction:row;align-items:flex-start;}
/* Good old safari... */
.safarifix .fullscreensmodules .scroller img{display:flex;align-self:center;}

.intro{position:fixed;left:0;top:0;width:100vw;height:100vh;background-color:#FAF5EF;z-index:1000;transition:opacity 1s ease-in-out .5s;will-change:opacity;}
.intro .illu{position:absolute;left:50%;top:50%;width:229px;height:189px;margin:-140px 0 0 -115px;background:url("../Grx/illu_intro.png") no-repeat;background-size:contain;will-change:transform;opacity:0;transition:opacity 1s ease-out .4s;}
.intro .illu.in{opacity:1}
.intro p{position:absolute;left:50%;top:50%;width:600px;text-align:center;margin:80px 0 0 -300px;font-size:2.6rem;opacity:0;transition:opacity 1s ease-out .5s;will-change:opacity;}
.intro p.in{opacity:1}
.intro.hide{opacity:0;pointer-events:none;}

.m.freemedia{margin:auto;display:inline-block;margin-right:200px;font-size:0;white-space:normal;}
.m.freemedia.first{margin-left:50vw;}
.m.freemedia.first .lazy{margin-left:-50%;}
.m.freemedia .lazy{width:auto;height:100vh;display:block;}
.m.freemedia.medium .lazy{height:calc(100vh - 140px);}
.m.freemedia.small .lazy{height:calc(100vh - 250px);}
.m.freemedia.smaller .lazy{height:42vh;/*calc(90vh - 350px)*/;}/* home layout */
.m.freemedia.alignb{padding-top:70px;}
/*.m.freemedia.alignb .lazy{height:calc(100vh - 215px);}*/
.m.freemedia.alignb .lazy{height:calc(90vh - 120px);}
.m.freemedia.alignt{/*padding-bottom:205px;*/transform:translateY(-100px);}
.m.freemedia.alignt .lazy{height:calc(100vh - 345px);}
.m.freemedia.small.alignt{/*padding-bottom:205px;*/transform:translateY(-100px);}
.m.freemedia.small.alignt .lazy{height:45vh;}
.m.freemedia.small.alignb{margin-top:40vh;padding-top:0;/*padding*/}
.m.freemedia.small.alignb .lazy{height:40vh;}
.m.freemedia.smaller.alignb{padding-top:150px;}
.m.freemedia.smaller.alignb .lazy{height:55vh;}
.m.freemedia.twin{margin-right:150px;padding-bottom:100px;white-space:nowrap;}/*overlapping in case studies*/
.m.freemedia.twin .lazy{display:inline-block;vertical-align:top;}
.m.freemedia .lazy .rel{width:auto;height:100%;}
.m.freemedia .lazy .rel .img{position:relative;width:auto;}
.m.freemedia.norightmargin{margin-right:0;}
.m.freemedia.reganimg{margin-right:100px;}

.frontpage .m.freemedia{margin-right:130px;}
.frontpage .m.freemedia.first{margin-left:170px;}
.frontpage .m.freemedia.first .lazy{margin-left:0;}
.frontpage .m.freemedia p{position:absolute;left:20px;top:50%;width:calc(100% - 40px);text-align:center;color:#3D4E44;z-index:1;pointer-events:none;transform:translate(20px,-50%);opacity:0;transition:opacity .3s ease-out, transform .5s cubic-bezier(0.25, 1, 0.5, 1);will-change:transform, opacity;}

.m.text{margin:auto 200px auto auto;text-align:left;white-space:normal;display:inline-block;}
.m.text.alignb{margin:auto 200px 120px -40px;}
.m.text.alignbc{margin:auto 200px 180px 0;}
.m.text.alignt{margin:210px 200px auto 0;}
.m.text.aligntc{margin:210px 200px auto 0;margin-top:calc(50vh - 130px);}
.m.text .inner{width:310px;}
.m.text.wider .inner{width:440px;}
.m.text.wider h3{padding-top:20px;padding-bottom:10px;}
.m.text h3{padding-bottom:5px;}
.m.text h1, .m.text h2{padding-bottom:10px;}
.m.text.list h1, .m.text.list h2{padding-bottom:25px;}
.m.text.list p.label{margin:5px 0 20px 0;}
.m.text.list.grid{margin:auto;margin-right:90px;}
/*.m.freemedia + .m.text.list{color:red;margin-left:50px;}*/

.m.text.list.grid p{min-width:260px;}
.m.text.list.grid p:not(.label){margin-top:20px;}
.m.text.list.grid p.label{margin-bottom:0;}
.m.text:not(.list) p.label a, .m.text:not(.list) p.label button{font-size:1.2rem;font-weight:500;color:#617F6E;}
.m.text:not(.list) p.label .underlined{padding-bottom:2px;}
.m.text:not(.list) p.label .underlined:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background-color:#617F6E;}
.m.text:not(.list) p + p.label{margin-top:20px;}
.m.text.twocolumn h1, .m.text.twocolumn h2{padding-bottom:25px;}
.m.text.twocolumn .inner{width:auto;}
.m.text.twocolumn .row{white-space:nowrap;}
.m.text.twocolumn .column{display:inline-block;width:400px;vertical-align:top;white-space:normal;}
.m.text.twocolumn .column + .column{margin-left:150px;}
.m.text.twocolumn p + h3{padding-top:20px;}
.m.text.first{margin-left:170px;}

.m.project{margin:auto;display:inline-block;margin-right:100px;font-size:0;top:45px;}
.m.project .lazy{width:auto;height:calc(100vh - 405px);overflow:hidden;}
.m.project .lazy .rel{width:auto;height:100%;}
.m.project .lazy .rel .img{position:relative;width:auto;}
.m.project .lazy:after, a.freemedia:not(.parallax) .lazy .rel:after, .freemedia.parallax a.lazy:after, .freemedia:not(.parallax) a.lazy .rel:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background-color:#FAF5EF;/*background-color:#617F6E;*/opacity:0;transition:opacity .3s ease-out;/*will-change:opacity;*/}
/*.m.project .lazy .rel .img.complete, a.freemedia .lazy .rel .img.complete{transition:filter .5s ease-out;}
.m.project:hover .lazy .rel .img.complete, a.freemedia:hover .lazy .rel .img.complete{filter:brightness(1.2) saturate(.5);}*/
.m.project p{position:absolute;left:0;top:50%;padding:0;margin:0;height:25px;transform-origin:50% 0;transform:translateX(-50%) rotate(-90deg);max-width:calc(100vh - 410px);margin-left:-35px;overflow:hidden;text-overflow:ellipsis;will-change:transform;}
.m.project.next p.label{transform:translateX(-50%) rotate(-90deg) translateY(-20px);color:#617F6E;}
.m.project.next p{margin-left:-45px;}
.m.project.first{margin-left:170px;}
.m.project:last-of-type{margin-right:170px;}
.m.project .overlay{position:absolute;left:-1%;top:-1%;width:102%;height:102%;background-color:#FAF5EF;z-index:1;will-change:transform;}
.m.project.next{margin-right:0;}

.people{margin:auto 175px auto 0;}
.people .inner{width:auto;margin:auto;display:grid;row-gap:25px;column-gap:50px;grid-template-rows:repeat(2, 320px);grid-auto-rows:250px;grid-auto-flow:column dense;}
.people .person{position:relative;width:250px;display:inline-block;vertical-align:top;cursor:pointer;}
.people .person .lazy{width:calc(100% - 50px);box-sizing: border-box;}
.people .person .lazy + .lazy{pointer-events:none;display:none;position:absolute;left:0;top:0;}/*hover image*/
.people .person .lazy + .lazy .rel .img{transition:none;opacity:1;}
.people .person h3{padding:15px 0 2px 0;width:100%;overflow:hidden;text-overflow:ellipsis;}
.people .person p{white-space:normal;}
.people .person p.label{line-height:1.2;}
.people .person p.label a/*, .people .person p.label button*/{font-size:1.2rem;font-weight:500;}
.people .person p + p.label{margin-top:8px;}
.info.hidden{display:none;}

.bioOverlay{position:fixed;right:0;top:0;width:50vw;height:100%;color:#FFF;display:flex;z-index:11;}
.bioOverlay:before{content:"";position:absolute;right:0;top:0;width:100%;height:100%;background-color:#617F6E;transform-origin:100% 0;transform:scaleX(0);transition:transform .6s cubic-bezier(0.76, 0, 0.24, 1);will-change:transform;}
.bioOverlay.open:not(.closing):before{transform:scaleX(1);transition:transform 1s cubic-bezier(0.16, 1, 0.3, 1);}
.bioOverlay .inner{position:relative;margin:auto;box-sizing:border-box;padding:100px 150px 50px 150px;opacity:0;transition:opacity .3s ease-out 0s;overflow:auto;max-height:100%;}
.bioOverlay .inner .scroller{position:relative;width:auto;height:auto;}
.bioOverlay h3 + p{margin-bottom:45px;}
.bioOverlay .info{max-width:400px;}
.bioOverlay.open .inner{opacity:1;transition:opacity .5s ease-out .15s;}

.contactform{margin:auto;width:100vw;text-align:center;white-space:normal;display:inline-block;font-size:0;}
.contactform .l{display:inline-block;vertical-align:top;box-sizing:border-box;padding-right:60px;width:50%;}
.contactform .r{display:inline-block;vertical-align:top;box-sizing:border-box;padding-left:60px;width:50%;}
.contactform .inner{width:100%;margin:auto;max-width:1044px;text-align:left;box-sizing:border-box;padding:0 50px;}
.contactform .title{margin-bottom:70px;}
.contactform .title p{width:50%;padding-top:10px;}
.contactform input, .contactform label, .contactform textarea{width:100%;display:block;}
.contactform label{margin-bottom:10px;}
.contactform input, .contactform textarea{border-bottom:1px solid #9b9c94;padding-bottom:5px;margin-bottom:40px;}
.contactform input[id="name"], .contactform input[id="email"], .contactform input[id="startdate"]{width:65%;}
.contactform input[type="submit"]{border:0;text-align:left;cursor:pointer;transition:opacity .3s ease-out;}
.contactform input[type="submit"]:hover{opacity:.6;}
.contactform input::placeholder, .contactform textarea::placeholder{opacity:.5;transition:opacity .3s ease-out;}
.contactform input:focus::placeholder, .contactform textarea:focus::placeholder{opacity:.7;}
.contactform form{position:relative;width:100%;}
input[name="message"],input[name="c"]{opacity:0;position:absolute;left:0;top:0;width:0;height:0;z-index:-1;}

.thankyou{position:absolute;top:0;pointer-events:none;opacity:0;transition:opacity .6s ease-in-out .3s;}
.contactform form.submitted .l, .contactform form.submitted .r{opacity:.1;pointer-events:none;transition:all .3s ease-out;filter:blur(1px);}
.contactform form.submitted .thankyou{opacity:1;}

@media (hover:hover){
    header .menuToggle:hover, .contactToggle:hover{opacity:.4;}
    header .primary:hover, header .secondary:hover{opacity:.6;}
    header .credits a:hover, header .credits button:hover{opacity:1;}
    .m.project:hover .lazy:after{opacity:.6;}
    
    .people .person .lazy:hover + .lazy{display:block;}
    /*.people .person p + p.label{opacity:0;transition:opacity .3s ease-out;}
    .people .person:hover p + p.label{opacity:1;}*/
}

/*.touch .frontpage .m.freemedia a p{transform:translate(0px,-50%);opacity:1;}
.touch .frontpage .freemedia:not(.parallax) a.lazy .rel:after, .frontpage .freemedia.parallax a.lazy:after{opacity:.8;}*/

/* Tablet */
@media all and (min-width:1000.5px) and (max-width:1350.5px) and (max-height:821px){
    .bioOverlay .inner{padding:30px 60px 15px 60px;}
    .bioOverlay .info{max-width:unset;}
}



/* Adjust based on height (desktop) */
@media all and (min-width:1000.5px) and (max-height:850px){
    header .menuoverlay .center{padding-top:10vh;}
    .toplogo .logo, footer .logo{left:calc(50% - 25vh);width:50vh;}
}
@media all and (min-width:1000.5px) and (max-height:780px){
    h1,h2{font-size:1.2rem;line-height:1.2;}
    h3, p{font-size:1.8rem;}
    .person h3, .bioOverlay h3{font-size:2.6rem;}
    p.small{font-size:1.6rem;}
    p.label, label, input[type="submit"]{font-size:1.3rem;}
    .people .inner{grid-template-rows:repeat(2, 280px);/*row-gap:40px;*/}
    .people .person h3{padding-top:10px;}
}
@media all and (min-width:1000.5px) and (max-height:730px){    
    /*.people .person .lazy{max-height:200px;overflow:hidden;}*/
    .bioOverlay .info{max-width:450px;}
    .m.project{top:40px;}
    .m.project .lazy{height:calc(100vh - 360px);}
    .m.project p{max-width:calc(100vh - 360px);}
}
@media all and (min-width:1000.5px) and (max-height:700px){
    .people .person .lazy{max-height:200px;overflow:hidden;}
    .people .inner{grid-template-rows:repeat(2, 250px);row-gap:15px;}
    .people .person .lazy{max-height:160px;}
}
@media all and (min-width:1000.5px) and (max-height:680px){
    header .menuoverlay .center{padding-top:5vh;}
    .menuoverlay .clientaccess{margin-top:25px;}
    header .label{padding:10px 0;}
    header .primary{padding:15px 0;}
    .m.text.aligntc{margin-top:calc(50vh - 160px);}    
    .bioOverlay .inner{padding:50px 60px 25px 60px;}
    .bioOverlay .info{max-width:unset;}
    .m.project{top:30px;}
    .m.project .lazy{height:50vh;}
    .m.project p{max-width:50vh;}
    .contactform .title{margin-bottom:40px;}
}
@media all and (min-width:1000.5px) and (max-height:580px){
    h3, p{font-size:1.8rem;}
    p.small{font-size:1.5rem;}
    header .primary{padding:10px 0;}
    .menuoverlay .clientaccess .illu{display:none;}
    .m.text.alignt{margin-top:130px;}
    .m.text.aligntc{margin-top:130px;}
    .people .inner{display:inline-block;white-space:nowrap;}
    .people .person{white-space:normal;}
    .people .person + .person{margin-left:100px;}
    .people .person .lazy{max-height:unset;padding:0;}
    .bioOverlay .inner{padding:30px 60px 15px 60px;}
    .contactform .title{margin-bottom:20px;}
    .contactform input, .contactform textarea{margin-bottom:30px;}
}
/* Very little height */
@media all and (min-width:1000.5px) and (max-height:500px){
    h1, h2{font-size:1.3rem;}
    h3, p{font-size:1.6rem;}
    p.small{font-size:1.3rem;}
}

/* Mobile (from 1000.5 and down) */
@media all and (max-width:1000.5px){
    .desktop{display:none!important;}

    header:before{content:"";position:absolute;left:0;top:0;width:100%;height:55px;background-color:#FAF5EF;}
    header .menuoverlay, header .contactoverlay{width:100%;}
    header .menuoverlay .center, header .contactoverlay .center{width:100%;padding:10vh 15px 50px 15px;}
    header .label{padding:15px 0;}
    header .menuToggle, .contactToggle{transition:color .3s ease-out;}
    header .menuToggle{left:5px;top:10px;}/*5px*/
    .contactToggle{right:5px;top:10px;}/*5px*/
    header .menuToggle.open, .contactToggle.open{color:#FFF;z-index:12;}
    .overlayon header .menuToggle, .overlayon .contactToggle{color:#FFF;z-index:12;}
    header .credits{width:100%;}
    header .primary{padding:15px 0;}
    header .contactoverlay .label.underline{margin-bottom:20px;padding-top:30px;}

    header .projectinquiry .contactform{padding:30px;}
    .contactform .inner{padding:0;}
    .contactform .l, .contactform .r{width:100%;display:block;padding-right:0;padding-left:0;}
    .contactform .title{margin-bottom:40px;}
    .contactform input[type="submit"]{margin-bottom:150px;}/*make sure it's not hidden behind iOS browser ui*/
    .contactform .title p{width:100%;}

    .toplogo{z-index:5;}
    .toplogo .logo{left:calc(50% - 51px);top:14px;width:102px;transition:opacity .6s ease-out;will-change:opacity;}
    .toplogo .logo .rel{padding-top:62.136%;}
    /*.overlayon .toplogo .logo{opacity:0;}*/
    footer{display:none;}

    .intro .illu{width:174px;height:144px;margin:-140px 0 0 -87px;}
    .intro p{width:260px;margin:50px 0 0 -130px;font-size:2.2rem;white-space:normal;}
    
    .fullscreensmodules{width:100%;height:auto;display:block;white-space:normal;}
    .fullscreensmodules .scroller{white-space:normal;width:100%;height:auto;display:block;}

    .m.text{margin:auto;display:block;width:100%;box-sizing:border-box;padding:20px 30px 70px 30px;}
    .m.text.alignb, .m.text.alignt, .m.text.alignbc, .m.text.aligntc{margin:auto;}
    .m.text .inner{width:100%;transform:none;}
    .m.text.first{margin-left:0;margin-top:130px;}
    .m.text.twocolumn .row{white-space:normal;}
    .m.text.twocolumn .column{display:block;width:100%;}
    .m.text.twocolumn .column + .column{margin:20px 0 0 0;}
    .m.text.wider .inner{width:100%;}
    .m.text.wider h3{padding-top:5px;}

    .m.text.list.grid .inner{text-align:center;padding-top:90px;padding-bottom:55px;color:#617F6E;}
    .m.text.list.grid p:not(.label){margin-top:40px;font-size:1.8rem;}

    .m.freemedia{margin:0;width:100%;padding:0;display:block;margin-bottom:50px;}
    .m.freemedia.alignt, .m.freemedia.alignb, .m.freemedia.alignb, .m.freemedia.twin, .m.freemedia.small, .m.freemedia.smaller.alignb, .m.freemedia.small.alignb{padding:0 15px;}
    .m.freemedia.alignt, .m.freemedia.small.alignt{transform:none;}
    .m.freemedia.small.alignt{padding:0 80px 0 0;}
    .m.freemedia.reganimg{margin:80px 0 30px 0;}
    .m.freemedia.alignb{padding-top:0;}
    .m.freemedia.medium + .m.freemedia.medium{padding:0 60px;}
    
    .m.freemedia .lazy, .m.freemedia.medium .lazy, .m.freemedia.small.alignt .lazy, .m.freemedia.alignt .lazy{width:100%;height:auto;}
    .m.freemedia.alignb .lazy, .m.freemedia.small .lazy, .m.freemedia.smaller .lazy, .m.freemedia.smaller.alignb .lazy, .m.freemedia.small.alignb .lazy{height:auto;}
    .m.freemedia .lazy .rel .img, .m.project .lazy .rel .img{position:absolute;left:0;top:0;width:100%;height:100%;}
    .m.freemedia.first{margin-left:0;margin-top:55px;}
    .m.freemedia.first .lazy{margin-left:auto;}
    .m.freemedia.alignt .lazy{padding:0 30px;box-sizing:border-box;}
    .m.freemedia.twin{padding-bottom:0;margin-right:0}
    .m.freemedia.twin .lazy{display:block;}
    .m.freemedia.twin .lazy:nth-of-type(2){padding:0 40px;box-sizing:border-box;margin-top:-40px;}
    .m.freemedia.norightmargin{margin-right:0;margin-bottom:0;}
    
    .frontpage .m.freemedia.first{margin-left:0;}
    .frontpage .m.freemedia{margin-right:0;}
    .frontpage .m.freemedia .lazy{padding:0 35px;box-sizing:border-box;}
    /*.frontpage .m.freemedia.small + .m.freemedia.smaller{margin-top:-100px;padding-left:40px;}*/
    .frontpage .m.freemedia:nth-of-type(9n + 3){margin-top:-100px;padding-left:60px;}
    .frontpage .m.freemedia:nth-of-type(9n + 4){padding:0;}
    .frontpage .m.freemedia:nth-of-type(9n + 5){margin-top:-20px;padding:0 15px;z-index:2;}
    .frontpage .m.freemedia:nth-of-type(9n + 6){padding:0;margin-top:-20px;}
    .frontpage .m.freemedia:nth-of-type(9n + 9){margin-top:-100px;}
    .frontpage .m.freemedia:last-of-type{margin-bottom:130px;}
    .frontpage .m.freemedia p{display:none;}

    .people{margin:auto;width:100%;margin-bottom:110px;}
    .people .inner{display:block;}
    .people .person{display:inline-block;vertical-align:top;width:50%;box-sizing:border-box;padding:15px;}
    .people .person:nth-of-type(2n){padding-left:12px;}
    .people .person:nth-of-type(2n+1){padding-right:12px;}
    .people .person .lazy{width:100%;}
    .person h3{font-size:1.8rem;}
    .people .person h3{padding:10px 0 0 0;}
    .people .person p.label{margin-top:5px;}
    /*.people .person p + p.label{margin-top:15px;}*/

    .m.project{display:block;margin:auto;margin-bottom:60px;padding:0 40px;top:auto;}
    .m.project .lazy{width:100%;height:auto;}
    .m.project.first{margin-left:0;margin-top:120px;}
    .m.project p, .m.project.next p, .m.project.next p.label{position:relative;left:auto;top:auto;transform:none;margin:0;text-align:center;padding-top:5px;padding-bottom:16px;height:auto;max-width:100%;}
    .m.project.next p.label{padding-bottom:0;}
    .m.project:not(.next) p{padding-top:16px;padding-bottom:0;}
    .m.project:last-of-type{margin-right:0;margin-bottom:95px;}
    .m.project .overlay{left:40px;width:calc(100% - 79px);}

    .bioOverlay{width:100vw;}
    .bioOverlay .inner{padding:30px;}
    .bioOverlay h3{font-size:2.4rem;}
}
/* Desktop */
@media all and (min-width:1000.5px){
    .mobile{display:none!important;}

    .m.freemedia.parallax .lazy/*, .m.project .lazy*/{overflow:hidden;/*background:black;*/}
    .m.freemedia.parallax .lazy .rel, .m.freemedia .lazy.parallax .rel{overflow:visible;will-change:transform;}
    .m.freemedia.parallax .lazy .rel .img:not(.video){transform:scale(1.2,1.2);}
    /*.m.project .lazy .rel .img{transform:scale(1.3,1.3);}*/
    .m.freemedia.small.parallax a.lazy .rel .img:not(.video){transform:scale(1.4,1.4);}/*frontpage version*/
    /*.m.project .lazy .rel{overflow:visible;will-change:transform;}*/
    .m.freemedia.parallax .lazy .rel .img:not(.video), .m.freemedia .lazy.parallax .rel .img:not(.video), .m.project .lazy .rel .img:not(.video){will-change:auto;}

    .m.freemedia.twin .lazy:nth-of-type(1){height:calc(50vh + 20px);}
    .m.freemedia.twin.b .lazy:nth-of-type(1){height:calc(50vh + 150px);}
    .m.freemedia.twin .lazy:nth-of-type(2){height:calc(50vh - 10px);margin-top:100px;margin-left:-45px;}
    .frontpage .m.freemedia:nth-of-type(9n + 2){margin-right:-60px;}
    .frontpage .m.freemedia:nth-of-type(9n + 4){margin-right:-130px;}
    .frontpage .m.freemedia:nth-of-type(9n + 5){margin-right:-130px;z-index:1;}
    .frontpage .m.freemedia:nth-of-type(9n + 8){margin-right:-130px;}
    .frontpage .m.freemedia:last-of-type{margin-right:25vw;}

    /* Hover allowed for touch too */
    .freemedia:not(.parallax) a.lazy:hover .rel:after, .freemedia.parallax a.lazy:hover:after{opacity:.8;}
    .frontpage .m.freemedia a:hover p{transform:translate(0px,-50%);opacity:1;}

    .m.text.list{margin-right:150px;/*200px*/}
    .m.text.list + .m.text{margin-left:-25px;}
    /* Press */
    .m.text.list.grid .inner{display:grid;width:auto;row-gap:30px;column-gap:20px;grid-template-rows:repeat(8, 20px);grid-auto-rows:260px;grid-auto-flow:column dense;box-sizing:border-box;padding-top:30px;padding-left:170px;color:#617F6E;}
    .m.text:not(.alignb):not(.alignbc):not(.alignt):not(.aligntc) .inner{/*color:red;*/transform:translateY(30px);}/*optically center by miving a little down*/
}
@media all and (min-width:1000.5px) and (max-width:1500px){
    .m.freemedia.parallax:not(.portrait) .lazy .rel .img:not(.video){transform:scale(1.1,1.1);}
    .m.freemedia.small.parallax a.lazy .rel .img:not(.video){transform:scale(1.3,1.3);}/*frontpage version*/
}

.pageTransition{position:fixed;/*pointer-events:none;*/z-index:9000;width:100vw;height:100vh;background-color:#FAF5EF;left:0;top:0;transition:opacity 1s cubic-bezier(0.22, 1, 0.36, 1);will-change:opacity;}
.atIntro .pageTransition{transition-duration:0s;}
.pageTransition.loaded{opacity:0;/*below menu etc.*/transition:opacity .3s cubic-bezier(0.61, 1, 0.88, 1);}
.pageTransition.undermenu{z-index:9;}
.pageTransition.in{opacity:1;transition:opacity .3s cubic-bezier(0.61, 1, 0.88, 1);}
.pageTransition.in.fast{opacity:1;transition:opacity .1s ease-out;}

/*Used for mobile measurement of vh unit */
.vh{position:absolute;z-index:-1;top:0;left:-1px;width:1px;height:100vh;}

.oldIe .lazy .rel .img{object-fit:cover;font-family:'object-fit: cover;';}
