body:not(.scrolled) header .menu-toggle span{background:#111}body header{color:#000}body:not(.scrolled) header #logo{filter:brightness(.15)}#portfolio-header .logo img{max-width:55vw;margin:0 auto}@media (min-width:1440px){#portfolio-header .container{max-width:1380px}}#portfolio-header h1{text-transform:none;letter-spacing:none;font-weight:300;font-size:3.5rem}@media (max-width:41.6775em){#portfolio-header h1{font-size:2.5rem;line-height:1.5}}#portfolio-image-feature{overflow:visible}#portfolio-image-feature>div{position:relative}#portfolio-image-feature .waves{position:absolute;bottom:100%;left:0;width:100%;height:33vh;pointer-events:none}#portfolio-image-feature .waves canvas{position:absolute;left:0;bottom:0}@media (min-width:1440px){#portfolio-image-feature .container{max-width:1380px}}#portfolio-image-feature .row>div{padding-top:max(8rem, 5vw);padding-bottom:0}#portfolio-image-feature img{max-width:100%}@media (min-width:1440px){#portfolio-introduction .container{max-width:1380px}}#portfolio-introduction h2{text-transform:none;color:#111;letter-spacing:none;font-weight:300;line-height:1.5}#portfolio-introduction ul{list-style:none}#portfolio-introduction ul li{font-size:1.8rem;padding:.7rem 0}#portfolio-content-1{color:#111}#portfolio-content-1 .container{padding-top:max(8rem, 5vw)}@media (max-width:64.0525em){#portfolio-content-1 .container{width:100%;padding:15px}}#portfolio-content-1 .mockup{max-width:100%}@media (min-width:41.6875em){#portfolio-content-1 .mockup img{-webkit-transform:translateX(-15.8%);transform:translateX(-15.8%)}}@media (max-width:41.6775em){#portfolio-content-1 .mockup img{width:100%}}#portfolio-content-1 p{font-size:1.8rem}#portfolio-content-1 p:not(:first-child){margin-top:2rem}@media (min-width:75em) and (max-width:119.99em){#portfolio-content-1 .row>div:nth-child(2){margin:0 auto}}#portfolio-content-1 .graphics img{max-width:100%}#portfolio-content-2 p{font-size:1.8rem}#portfolio-content-2 p:not(:first-child){margin-top:2rem}#portfolio-content-2 .image-mockups img{max-height:50vh;padding:0 15px}#portfolio-mockups{height:calc(100vh - 20px)}#portfolio-mockups .logo{position:absolute;top:53%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:max(32vw, 300px);z-index:1}#portfolio-mockups .logo img{width:100%}#portfolio-mockups .bg{position:absolute;top:50%;left:50%;height:100%;width:100%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}#portfolio-mockups .bg .simpleParallax{height:100%}#portfolio-mockups .bg img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover}#portfolio-content-center h3{text-transform:none;letter-spacing:none;font-weight:300;line-height:1.5}#portfolio-end h3{text-transform:none;letter-spacing:none;font-weight:300;line-height:1.5}#portfolio-end .container{position:relative;z-index:1}#portfolio-end img{max-width:90%}#portfolio-end .waves{position:absolute;bottom:0;height:100%;z-index:0;width:100%;left:0}#portfolio-end .waves canvas{position:absolute;left:0;bottom:0}@keyframes rightArrowStart{0%{transform:translateX(-50px)}100%{transform:translateX(42px)}}@keyframes rightArrowEnd{0%{transform:translateX(42px)}100%{transform:translateX(75px)}}@keyframes rightArrowStart2{0%{transform:translateX(50px) rotate(180deg)}100%{transform:translateX(-42px) rotate(180deg)}}@keyframes rightArrowEnd2{0%{transform:translateX(-42px) rotate(180deg)}100%{transform:translateX(-75px) rotate(180deg)}}@keyframes rightArrowLineStart{0%{stroke-dashoffset:30px}100%{stroke-dashoffset:40px}}@keyframes rightArrowLineEnd{0%{stroke-dashoffset:40px}100%{stroke-dashoffset:50px}}@keyframes portRightLineStart{0%{transform:translateY(-50%) translateX(-25px) scaleX(0)}100%{transform:translateY(-50%) translateX(0) scaleX(1)}}@keyframes rightLineStart{0%{transform:translateY(-50%) translateX(-88px) scaleX(0)}100%{transform:translateY(-50%) translateX(0) scaleX(1)}}@keyframes rightLineEnd{0%{transform:translateY(-50%) translateX(0) scaleX(1)}100%{transform:translateY(-50%) translateX(28px) scaleX(0)}}@keyframes rightLineStart2{0%{transform:translateY(-50%) translateX(88px) scaleX(0)}100%{transform:translateY(-50%) translateX(0) scaleX(1)}}@keyframes rightLineEnd2{0%{transform:translateY(-50%) translateX(0) scaleX(1)}100%{transform:translateY(-50%) translateX(-28px) scaleX(0)}}#post-navigation .line{height:2px;width:45px;background-color:#fff;position:absolute;content:"";display:block;backface-visibility:hidden;top:50%;-webkit-transform:translateY(-50%) translateX(28px) scaleX(0);-webkit-transform-origin:right;transform:translateY(-50%) translateX(28px) scaleX(0);transform-origin:right}#post-navigation a:first-child .line{left:-74px;animation:rightLineEnd2 0.4s cubic-bezier(.05,.2,.1,1) forwards}#post-navigation a:last-child .line{right:-74px;animation:rightLineEnd 0.4s cubic-bezier(.05,.2,.1,1) forwards}#post-navigation svg{position:absolute;backface-visibility:hidden;top:50%;margin-top:-15px;height:30px;width:40px;display:block;transform:translateX(38px);-webkit-transform:translateX(38px) rotate(180deg);transform:translateX(38px) rotate(180deg)}#post-navigation .row a:first-child svg{animation:rightArrowEnd2 0.7s cubic-bezier(0,.2,.1,1) forwards;right:auto;left:-43px}#post-navigation .row a:last-child svg{animation:rightArrowEnd 0.7s cubic-bezier(0,.2,.1,1) forwards;left:auto;right:-43px}#post-navigation line{stroke-width:2px;stroke-dasharray:10px;stroke:#fff}#post-navigation .row a:first-child:hover .line{-webkit-transform:translateY(-50%) translateX(0) scaleX(1);-webkit-transform-origin:right;transform:translateY(-50%) translateX(0) scaleX(1);transform-origin:right;animation:rightLineStart2 0.4s cubic-bezier(.05,.2,.1,1) forwards}#post-navigation .row a:last-child:hover .line{-webkit-transform:translateY(-50%) translateX(0) scaleX(1);-webkit-transform-origin:left;transform:translateY(-50%) translateX(0) scaleX(1);transform-origin:left;animation:rightLineStart 0.4s cubic-bezier(.05,.2,.1,1) forwards}#post-navigation .row a:first-child:hover .next-arrow{-webkit-transform:translateX(42px);transform:translateX(42px);animation:rightArrowStart2 0.4s cubic-bezier(.05,.2,.1,1) forwards}#post-navigation .row a:last-child:hover .next-arrow{animation:rightArrowStart 0.4s cubic-bezier(.05,.2,.1,1) forwards;-webkit-transform:translateX(42px);transform:translateX(42px)}#post-navigation .row a:hover line{animation:rightArrowLineStart 0.3s cubic-bezier(.05,.2,.1,1) 0.1s forwards;stroke-dashoffset:30px}#post-navigation .row a line{animation:rightArrowLineEnd 0.4s cubic-bezier(.3,.2,.1,1) 0.25s forwards;stroke-dashoffset:40px}