body{background:url(../img/fpo-bkg-df.jpg) no-repeat center top;background-size:cover}footer{margin:1rem auto}footer p{font-size:.9rem}header .logo-wrap{padding-top:1.5rem}main.work{margin-bottom:.75rem}main:not(.work) article{padding-top:1rem}#about main header{overflow:hidden}#index h1{margin-bottom:1.5rem}#index nav{margin-bottom:1.5rem}.menu>li{display:inline-flex;flex-direction:column;align-items:center}#intro-wrap{padding-top:0;width:100%;height:100%;transition:all 1000ms cubic-bezier(0.250,0.460,0.450,0.940)}#intro{width:100%;min-height:100vh;margin-bottom:1.5rem;transition:all 1000ms cubic-bezier(0.250,0.460,0.450,0.940)}main.work>section,.work header,.work>section>article{position:relative;overflow:hidden;text-align:center;height:100%}.caps{text-transform:uppercase}.content *{color:#fff}.content{position:absolute;bottom:1rem;left:0;width:100%;padding:0 .5rem;z-index:5;-webkit-transition:all .5s;transition:all .5s}.close-button{top:0;font-size:5em}.note{font-size:.8rem;font-style:oblique}.reveal.full{top:0!important}.reveal.full header{background:#67cbbe}.reveal-nav{position:relative;padding-top:80px;margin-bottom:40px}.reveal-nav::before{position:absolute;content:" ";width:calc(100vw - 16px);height:30px;top:0;left:50%;background-color:#67cbbe;background-image:url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23eef1f2' fill-opacity='0.4' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");transform:translateX(-50%)}.colors{flex:1}p.color{margin-left:.5rem;line-height:1.2;padding-top:.4rem}p.font{font-size:30px;text-transform:uppercase;line-height:1;margin-bottom:0}.fonts small{color:#c8a968;text-transform:uppercase}.details{padding:2rem 0}.info{padding-top:2rem;padding-bottom:.75rem}.info h3{color:#920003}.info p.caps{margin-bottom:0}.info p:not(.caps),.info a{color:#5f737d;font-size:.9rem}.info a:hover,.info a:focus{color:#258faf}.bkg-white{background:#fefefe;height:100%}.white{color:#fefefe}.blue{color:#286bbd}.aqua{color:#008e8c}.ltaqua{color:#67cbbe}.olive{color:#808000}.scroll{overflow-y:auto}.sample{padding-bottom:.5rem}.sample p.lead{margin:0 auto;padding:.25rem}.work article img{-webkit-filter:grayscale(.9);filter:grayscale(.9);opacity:.5;transition:all 300ms ease-in-out}.work article{-webkit-box-shadow:inset 0 0 14px #111;box-shadow:inset 0 0 14px #111}.work article:hover img,.work article:focus img{filter:none;opacity:1}.work article::after{position:absolute;content:" ";background:#008e8c;width:150%;height:0;top:0;left:0;transition:all .5s;-webkit-transform-origin:top left;transform-origin:top left;-webkit-transform:translateX(100%) translateY(100%) rotate(0deg);transform:translateX(100%) translateY(100%) rotate(0deg);z-index:1}.work article:hover::after,.work article:focus::after{height:100%;-webkit-transform:translateX(-37%) translateY(115%) rotate(-45deg);transform:translateX(-37%) translateY(115%) rotate(-45deg)}.work article.wide::after{top:auto;left:auto;width:100%;height:0;-webkit-transform-origin:bottom right;transform-origin:bottom right}.work article.wide:hover::after,.work article.wide:focus::after{height:150%;-webkit-transform:translateX(-80%) translateY(2%) rotate(45deg);transform:translateX(-80%) translateY(2%) rotate(45deg)}.safari .work article.wide:hover::after,.safari .work article.wide:focus::after{height:150%;-webkit-transform:translateX(-128%) translateY(70%) rotate(45deg);transform:translateX(-128%) translateY(70%) rotate(45deg)}.wrap{max-height:0;opacity:0;overflow:hidden;-webkit-transition:all .5s;transition:all .5s}.wrap p{line-height:1.2}.wide .wrap p{margin:0 auto 1rem}.tag{-webkit-transition:all .7s;transition:all .7s}.tag::before,.tag::after{content:" ";background:#008e8c;width:15%;height:2px}.tag small{margin:10px;padding:10px;text-transform:uppercase;background:#008e8c}.blue .tag::before,.blue .tag::after,.work article.blue::after,.blue .tag small{background:#286bbd}.olive .tag::before,.olive .tag::after,.work article.olive::after,.olive .tag small{background:#808000}article:hover .tag,article:focus .tag{opacity:0;-webkit-transform:translateY(-50%);transform:translateY(-50%)}article:hover .content,article:focus .content{bottom:0}article:hover .wrap,article:focus .wrap{opacity:1;max-height:10rem}.content h2{margin-bottom:.5rem;line-height:1;font-size:1.15rem;font-family:Anton,Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black","sans-serif";text-shadow:1px 1px 4px #000}#work .title{width:100%;height:auto;line-height:1.2;margin:0;padding-bottom:1.25rem}@media screen and (min-width:40em){body{background:url(../img/fpo-bkg-md.jpg) no-repeat center top;background-size:cover}.content h2{font-size:1.25rem}.wide .wrap p{max-width:70%}.reveal-nav::before{height:40px}}@media screen and (min-width:40.063em){#work .title{position:absolute;top:10%;left:20px;font-size:6.4vw}p.font{font-size:40px}.project header{max-height:440px;overflow:hidden}.reveal-nav{position:relative;padding-top:60px;margin-bottom:2rem}.reveal-nav .flex-item:nth-of-type(1){order:1}.reveal-nav .flex-item:nth-of-type(2){order:3}.reveal-nav .flex-item:nth-of-type(3){order:2}.work article:hover::after,.work article:focus::after{-webkit-transform:translateX(-37%) translateY(98%) rotate(-45deg);transform:translateX(-37%) translateY(98%) rotate(-45deg)}.safari .work article:hover::after,.safari .work article:focus::after{-webkit-transform:translateX(-37%) translateY(90%) rotate(-45deg);transform:translateX(-37%) translateY(90%) rotate(-45deg)}.work article.wide:hover::after,.work article.wide:focus::after{-webkit-transform:translateX(-80%) translateY(2%) rotate(45deg);transform:translateX(-80%) translateY(2%) rotate(45deg)}}@media screen and (min-width:64em){body{background:url(../img/fpo-bkg-lg.jpg) no-repeat center top;background-size:cover}p.font{font-size:60px}.project header{max-height:525px}}@media screen and (min-width:64.063em){.project header{max-height:700px}}.work .reveal header{background:#008e8c}.flex-nowrap{-ms-flex-flow:nowrap;flex-flow:nowrap}.login{position:fixed;width:100px;height:auto;left:1rem;bottom:0}.login .button{border-radius:100px;border:1px solid #fefefe;color:#fefefe;background:transparent}.login .button:hover,.login .button:focus{background:rgba(254,254,254,0.5);border-color:#911015;color:#911015}.title{font-size:10.4vw;line-height:1.4;color:#062025;font-family:Anton,Impact,Haettenschweiler,"Franklin Gothic Bold","Arial Black",sans-serif;-webkit-animation:title-rotate 1s .5s ease-out forwards;-moz-animation:title-rotate 1s .5s ease-out forwards;-o-animation:title-rotate 1s .5s ease-out forwards;animation:title-rotate 1s .5s ease-out forwards}@media screen and (min-width:120.063em){body{background:url(../img/fpo-bkg-xl.jpg) no-repeat center top;background-size:cover}.title{font-size:184px}}@-webkit-keyframes title-rotate{100%{color:#fff;transform:perspective(600px) rotateX(8deg) rotateY(-8deg) translate(-6%);text-shadow:1px 1px rgba(0,0,0,0.96),2px 2px rgba(0,0,0,0.92),3px 3px rgba(0,0,0,0.88),4px 4px rgba(0,0,0,0.84),5px 5px rgba(0,0,0,0.8),6px 6px rgba(0,0,0,0.76),7px 7px rgba(0,0,0,0.72),8px 8px rgba(0,0,0,0.68),9px 9px rgba(0,0,0,0.64),10px 10px rgba(0,0,0,0.6),11px 11px rgba(0,0,0,0.56),12px 12px rgba(0,0,0,0.52),13px 13px rgba(0,0,0,0.48),14px 14px rgba(0,0,0,0.44),15px 15px rgba(0,0,0,0.4),16px 16px rgba(0,0,0,0.36),17px 17px rgba(0,0,0,0.32),18px 18px rgba(0,0,0,0.28),19px 19px rgba(0,0,0,0.24),20px 20px rgba(0,0,0,0.2),21px 21px rgba(0,0,0,0.16),22px 22px rgba(0,0,0,0.12),23px 23px rgba(0,0,0,0.08),24px 24px rgba(0,0,0,0.04),25px 25px transparent,26px 26px transparent,27px 27px transparent,28px 28px transparent,29px 29px transparent,30px 30px transparent,31px 31px transparent,32px 32px transparent,33px 33px transparent,34px 34px transparent,35px 35px transparent,36px 36px transparent,37px 37px transparent,38px 38px transparent,39px 39px transparent,40px 40px transparent}}@-moz-keyframes title-rotate{100%{color:#fff;transform:perspective(600px) rotateX(8deg) rotateY(-8deg) translate(-6%);text-shadow:1px 1px rgba(0,0,0,0.96),2px 2px rgba(0,0,0,0.92),3px 3px rgba(0,0,0,0.88),4px 4px rgba(0,0,0,0.84),5px 5px rgba(0,0,0,0.8),6px 6px rgba(0,0,0,0.76),7px 7px rgba(0,0,0,0.72),8px 8px rgba(0,0,0,0.68),9px 9px rgba(0,0,0,0.64),10px 10px rgba(0,0,0,0.6),11px 11px rgba(0,0,0,0.56),12px 12px rgba(0,0,0,0.52),13px 13px rgba(0,0,0,0.48),14px 14px rgba(0,0,0,0.44),15px 15px rgba(0,0,0,0.4),16px 16px rgba(0,0,0,0.36),17px 17px rgba(0,0,0,0.32),18px 18px rgba(0,0,0,0.28),19px 19px rgba(0,0,0,0.24),20px 20px rgba(0,0,0,0.2),21px 21px rgba(0,0,0,0.16),22px 22px rgba(0,0,0,0.12),23px 23px rgba(0,0,0,0.08),24px 24px rgba(0,0,0,0.04),25px 25px transparent,26px 26px transparent,27px 27px transparent,28px 28px transparent,29px 29px transparent,30px 30px transparent,31px 31px transparent,32px 32px transparent,33px 33px transparent,34px 34px transparent,35px 35px transparent,36px 36px transparent,37px 37px transparent,38px 38px transparent,39px 39px transparent,40px 40px transparent}}@-o-keyframes title-rotate{100%{color:#fff;transform:perspective(600px) rotateX(8deg) rotateY(-8deg) translate(-6%);text-shadow:1px 1px rgba(0,0,0,0.96),2px 2px rgba(0,0,0,0.92),3px 3px rgba(0,0,0,0.88),4px 4px rgba(0,0,0,0.84),5px 5px rgba(0,0,0,0.8),6px 6px rgba(0,0,0,0.76),7px 7px rgba(0,0,0,0.72),8px 8px rgba(0,0,0,0.68),9px 9px rgba(0,0,0,0.64),10px 10px rgba(0,0,0,0.6),11px 11px rgba(0,0,0,0.56),12px 12px rgba(0,0,0,0.52),13px 13px rgba(0,0,0,0.48),14px 14px rgba(0,0,0,0.44),15px 15px rgba(0,0,0,0.4),16px 16px rgba(0,0,0,0.36),17px 17px rgba(0,0,0,0.32),18px 18px rgba(0,0,0,0.28),19px 19px rgba(0,0,0,0.24),20px 20px rgba(0,0,0,0.2),21px 21px rgba(0,0,0,0.16),22px 22px rgba(0,0,0,0.12),23px 23px rgba(0,0,0,0.08),24px 24px rgba(0,0,0,0.04),25px 25px transparent,26px 26px transparent,27px 27px transparent,28px 28px transparent,29px 29px transparent,30px 30px transparent,31px 31px transparent,32px 32px transparent,33px 33px transparent,34px 34px transparent,35px 35px transparent,36px 36px transparent,37px 37px transparent,38px 38px transparent,39px 39px transparent,40px 40px transparent}}@keyframes title-rotate{100%{color:#fff;transform:perspective(600px) rotateX(8deg) rotateY(-8deg) translate(-6%);text-shadow:1px 1px rgba(0,0,0,0.96),2px 2px rgba(0,0,0,0.92),3px 3px rgba(0,0,0,0.88),4px 4px rgba(0,0,0,0.84),5px 5px rgba(0,0,0,0.8),6px 6px rgba(0,0,0,0.76),7px 7px rgba(0,0,0,0.72),8px 8px rgba(0,0,0,0.68),9px 9px rgba(0,0,0,0.64),10px 10px rgba(0,0,0,0.6),11px 11px rgba(0,0,0,0.56),12px 12px rgba(0,0,0,0.52),13px 13px rgba(0,0,0,0.48),14px 14px rgba(0,0,0,0.44),15px 15px rgba(0,0,0,0.4),16px 16px rgba(0,0,0,0.36),17px 17px rgba(0,0,0,0.32),18px 18px rgba(0,0,0,0.28),19px 19px rgba(0,0,0,0.24),20px 20px rgba(0,0,0,0.2),21px 21px rgba(0,0,0,0.16),22px 22px rgba(0,0,0,0.12),23px 23px rgba(0,0,0,0.08),24px 24px rgba(0,0,0,0.04),25px 25px transparent,26px 26px transparent,27px 27px transparent,28px 28px transparent,29px 29px transparent,30px 30px transparent,31px 31px transparent,32px 32px transparent,33px 33px transparent,34px 34px transparent,35px 35px transparent,36px 36px transparent,37px 37px transparent,38px 38px transparent,39px 39px transparent,40px 40px transparent}}.box{fill:none;stroke:#fff;stroke-miterlimit:10;stroke-width:1.87px;stroke-dasharray:395;stroke-dashoffset:395;-webkit-animation:dash 2s 1.5s ease-out forwards;-moz-animation:dash 2s 1.5s ease-out forwards;-o-animation:dash 2s 1.5s ease-out forwards;animation:dash 2s 1.5s ease-out forwards}#index .box{-webkit-animation-delay:8s;animation-delay:8s}@-webkit-keyframes dash{from{stroke-dashoffset:395}to{stroke-dashoffset:0}}@-moz-keyframes dash{from{stroke-dashoffset:395}to{stroke-dashoffset:0}}@-o-keyframes dash{from{stroke-dashoffset:395}to{stroke-dashoffset:0}}@keyframes dash{from{stroke-dashoffset:395}to{stroke-dashoffset:0}}.shadow{-webkit-filter:drop-shadow(2px 3px 6px #777);filter:drop-shadow(2px 3px 6px #777)}.safari .shadow{-webkit-filter:none;filter:none}.finished #intro-wrap{padding-top:30px}.finished #intro{min-height:10vh}.gradient{position:fixed;width:100%;height:100vh;background:-webkit-radial-gradient(rgba(254,254,254,0.8),rgba(6,32,37,0.2));background:radial-gradient(rgba(254,254,254,0.8),rgba(6,32,37,0.2));z-index:-1}.logo{width:100%;height:auto}.logo-scale{position:absolute;width:60vw;height:auto;top:50%;left:50%;transform:translate(-50%,-50%)}.logo-wrap{max-width:60vw;height:auto}.logo-scale>.logo{opacity:0;transition:all 200ms cubic-bezier(0.550,0.055,0.675,0.190);-webkit-animation:scalelogo 200ms 5.3s forwards;-moz-animation:scalelogo 200ms 5.3s forwards;-o-animation:scalelogo 200ms 5.3s forwards;animation:scalelogo 200ms 5.3s forwards}.logo-scale #text1,.logo-scale #text2,.logo-scale #hand_grp{opacity:0;transition:opacity 1.4s 2.7s cubic-bezier(0.165,0.84,0.44,1)}.finished .logo-scale #text1,.finished .logo-scale #text2,.finished .logo-scale #hand_grp{opacity:1}.menu p{line-height:1.2;font-size:.85rem}.menu .button{margin-bottom:.25rem}.relative{position:relative}.web-text p{font-size:8vw;font-weight:bold;text-transform:uppercase;margin-bottom:0;line-height:1.2;-webkit-animation:fadeoutup 300ms 5.2s forwards;-moz-animation:fadeoutup 300ms 5.2s forwards;-o-animation:fadeoutup 300ms 5.2s forwards;animation:fadeoutup 300ms 5.2s forwards}.word-text{overflow:hidden}.word-text::after{position:absolute;content:'';top:50%;left:0;width:2px;height:33%;transform:translateY(-50%);background-color:#bf151b;-webkit-animation:cd-pulse 1.8s 0s 3 both;animation:cd-pulse 1.8s 0s 3 both}.word-text p{color:#89181d;font-size:6.4vw;font-weight:400;text-transform:lowercase;line-height:1.2;margin-bottom:0}.word-text p:nth-child(1){transform:translate(-100%,100%);animation:slide-p1 1.4s .5s forwards}.word-text p:nth-child(2){transform:translate(-100%,0);animation:slide-p2 1.4s 2.3s forwards}.word-text p:nth-child(3){transform:translate(-100%,-100%);animation:slide-p3 1.4s 4.2s forwards}@media screen and (max-width:40em){h2{margin-bottom:0}}@media screen and (min-width:40.063em){main:not(.work) article{padding-top:1.5rem}#index h1{font-size:2.5rem;margin-bottom:3rem}.finished #intro-wrap{padding-top:100px}.logo-scale{width:45vw;height:auto;max-width:650px}.logo-wrap{max-width:32vw}.web-text p{font-size:5vw}.word-text p{font-size:4vw}}@media screen and (min-width:64.063em){main article{padding-top:0}}@keyframes slide-p1{0%{opacity:1;transform:translate(-100%,100%)}25%{transform:translate(0,100%)}70%{opacity:1;transform:translate(0,100%)}100%{opacity:0;transform:translate(0,200%)}}@keyframes slide-p2{0%{opacity:1;transform:translate(-100%,0)}25%{transform:translate(0,0)}70%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(0,100%)}}@-webkit-keyframes slide-p3{0%{opacity:1;transform:translate(-100%,-100%)}25%{transform:translate(0,-100%)}70%{opacity:1;transform:translate(0,-100%)}90%{opacity:0}100%{opacity:0;transform:translate(0,50%)}}@-moz-keyframes slide-p3{0%{opacity:1;transform:translate(-100%,-100%)}25%{transform:translate(0,-100%)}70%{opacity:1;transform:translate(0,-100%)}90%{opacity:0}100%{opacity:0;transform:translate(0,50%)}}@-o-keyframes slide-p3{0%{opacity:1;transform:translate(-100%,-100%)}25%{transform:translate(0,-100%)}70%{opacity:1;transform:translate(0,-100%)}90%{opacity:0}100%{opacity:0;transform:translate(0,50%)}}@keyframes slide-p3{0%{opacity:1;transform:translate(-100%,-100%)}25%{transform:translate(0,-100%)}70%{opacity:1;transform:translate(0,-100%)}90%{opacity:0}100%{opacity:0;transform:translate(0,50%)}}@-webkit-keyframes fadeoutup{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-100%)}}@-moz-keyframes fadeoutup{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-100%)}}@-o-keyframes fadeoutup{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-100%)}}@keyframes fadeoutup{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-100%)}}@-webkit-keyframes drawbox{100%{width:100%;height:100%}}@-moz-keyframes drawbox{100%{width:100%;height:100%}}@-o-keyframes drawbox{100%{width:100%;height:100%}}@keyframes drawbox{100%{width:100%;height:100%}}@-webkit-keyframes cd-pulse{0%,11.4%{opacity:0}5.7%,17.1%,22.8%,25.9%{opacity:1}37%,100%{opacity:0}}@-moz-keyframes cd-pulse{0%,11.4%{opacity:0}5.7%,17.1%,22.8%,25.9%{opacity:1}37%,100%{opacity:0}}@-o-keyframes cd-pulse{0%,11.4%{opacity:0}5.7%,17.1%,22.8%,25.9%{opacity:1}37%,100%{opacity:0}}@keyframes cd-pulse{0%,11.4%{opacity:0}5.7%,17.1%,22.8%,25.9%{opacity:1}37%,100%{opacity:0}}@-webkit-keyframes scalelogo{from{opacity:0;transform:scale(0.2)}to{opacity:1;transform:scale(1)}}@-moz-keyframes scalelogo{from{opacity:0;transform:scale(0.2)}to{opacity:1;transform:scale(1)}}@-o-keyframes scalelogo{from{opacity:0;transform:scale(0.2)}to{opacity:1;transform:scale(1)}}@keyframes scalelogo{from{opacity:0;transform:scale(0.2)}to{opacity:1;transform:scale(1)}}form span{color:darkred}form.floatingLabel div{position:relative}#checkMe{position:absolute;top:0;left:-4000px}#no-error{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:auto;display:block;background:#fefefe;padding:2rem;border-radius:12px;border:2px solid gold;z-index:1000}.disclaimer{font-size:.8rem;font-style:oblique}.floatingLabel input[type="text"],.floatingLabel input[type="email"],.floatingLabel input[type="tel"],.floatingLabel textarea,.floatingLabel button,.floatingLabel select{-webkit-transition:all .3s ease-out;transition:all .3s ease-out}.floatingLabel input[type="text"]:focus,.floatingLabel input[type="text"]:hover,.floatingLabel input[type="date"]:hover,.floatingLabel input[type="date"]:focus,.floatingLabel input[type="email"]:focus,.floatingLabel input[type="email"]:hover,.floatingLabel input[type="tel"]:focus,.floatingLabel input[type="tel"]:hover,.floatingLabel textarea:focus,.floatingLabel textarea:hover,.floatingLabel button:focus,.floatingLabel button:hover,.floatingLabel select:focus,.floatingLabel select:hover{outline:0;border-color:#23c3af}.floatingLabel input[type="text"]:focus+label,.floatingLabel input[type="text"]:hover+label,.floatingLabel input[type="date"]:hover+label,.floatingLabel input[type="date"]:focus+label,.floatingLabel input[type="email"]:focus+label,.floatingLabel input[type="email"]:hover+label,.floatingLabel input[type="tel"]:focus+label,.floatingLabel input[type="tel"]:hover+label,.floatingLabel textarea:focus+label,.floatingLabel textarea:hover+label,.floatingLabel button:focus+label,.floatingLabel button:hover+label,.floatingLabel select:focus+label,.floatingLabel select:hover+label{color:#23c3af;cursor:text}.floatingLabel select{-moz-appearance:none;-webkit-appearance:none;cursor:pointer}.floatingLabel label{position:absolute;top:.5rem;left:1.5rem;display:inline-block;cursor:text;transition:color .3s,top .2s,left .2s,font-size .2s}.floatingLabel label.active{font-size:.8rem;top:-1.3rem;left:.25rem;font-style:oblique;color:#23c3af}.floatingLabel textarea{min-height:140px;resize:vertical;overflow:auto}