@import url(//fonts.googleapis.com/css?family=Lato:300:400);body{margin:0}h1{font-weight:300;letter-spacing:2px;font-size:48px}h1,p{font-family:Lato,sans-serif}p{letter-spacing:1px;font-size:14px;color:#333}.header{position:relative;text-align:center;background:linear-gradient(60deg,#543ab7,#00acc1);color:#fff}.logo{width:50px;fill:#fff;padding-right:15px;display:inline-block;vertical-align:middle}.inner-header{height:65vh;width:100%;margin:0;padding:0}.waves{position:relative;width:100%;height:15vh;margin-bottom:-7px;min-height:100px;max-height:150px}.parallax>use{-webkit-animation:move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;animation:move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite}.parallax>use:first-child{-webkit-animation-delay:-2s;animation-delay:-2s;-webkit-animation-duration:7s;animation-duration:7s}.parallax>use:nth-child(2){-webkit-animation-delay:-3s;animation-delay:-3s;-webkit-animation-duration:10s;animation-duration:10s}.parallax>use:nth-child(3){-webkit-animation-delay:-4s;animation-delay:-4s;-webkit-animation-duration:13s;animation-duration:13s}.parallax>use:nth-child(4){-webkit-animation-delay:-5s;animation-delay:-5s;-webkit-animation-duration:20s;animation-duration:20s}@-webkit-keyframes move-forever{0%{transform:translate3d(-90px,0,0)}to{transform:translate3d(85px,0,0)}}@keyframes move-forever{0%{transform:translate3d(-90px,0,0)}to{transform:translate3d(85px,0,0)}}@media (max-width:768px){.waves{height:40px;min-height:40px}h1{font-size:24px}}body{background-size:cover;font-family:Roboto Condensed,sans-serif}li,ul{list-style:none outside none}.nav-menu{background:#74adaa;margin:auto}.nav-menu>li{display:inline;float:left;border-right:1px solid #333;position:relative}.nav-menu>li:last-child{border-right:none}.nav-menu li a{color:#fff;display:block;text-decoration:none;font-family:Roboto Condensed,sans-serif;font-smoothing:antialiased;text-transform:uppercase;overflow:visible;line-height:20px;font-weight:300;font-size:25px;letter-spacing:1px;padding:15px 40px 15px 31px}.three-d{perspective:200px;transition:all .07s linear;position:relative}.three-d:not(.active):hover{cursor:pointer}.three-d:not(.active):focus .three,.three-d:not(.active):hover .three{transform:translateZ(-25px) rotateX(90deg)}.three{transition:all .3s ease-out;transform:translatez(-25px);transform-style:preserve-3d;pointer-events:none;position:absolute;top:0;left:0;display:block;width:100%;height:100%}.front{transform:rotatex(0deg) translatez(25px)}.back{transform:rotatex(-90deg) translatez(25px);color:#ffe7c4}.back,.front{display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:#543ab7;padding:15px 30px 15px 31px;color:#fff;pointer-events:none;box-sizing:border-box}.nav-menu li .active .back,.nav-menu li .active .front,.nav-menu li a:hover .back,.nav-menu li a:hover .front{background-color:#00acc1;background-size:5px 5px;background-position:0 0,30px 30px;color:#000}.card-container{perspective:50em}.card-container:first-child{--bi:repeating-linear-gradient(30deg,#00acc1 0 0.25em,#00acc1 0 1em)}.card-container:nth-child(2){--bi:linear-gradient(#00acc1 5em,#00acc1 0),linear-gradient(60deg,#880e4f,#1a237e)}.card{position:relative;width:320px;padding:3em;color:#fff;transform:rotateY(30deg) rotateX(15deg);transform-style:preserve-3d;transition:transform 1s}.card:hover{transform:rotateY(-30deg) rotateX(-15deg)}.layers{transform-style:preserve-3d;z-index:-1}.layer,.layers{position:absolute;left:0;top:0;width:100%;height:100%}.layer{border-radius:1em;background-image:var(--bi);transform:translateZ(var(--tz));box-shadow:inset 0 0 .5em #000d}.layer:first-child{--tz:0px}.layer:nth-child(2){--tz:-4px}.layer:nth-child(3){--tz:-8px}.layer:nth-child(4){--tz:-12px}.layer:nth-child(5){--tz:-16px}.layer:nth-child(6){--tz:-20px}.layer:nth-child(7){--tz:-24px}.layer:nth-child(8){--tz:-28px}.layer:nth-child(9){--tz:-32px}.layer:nth-child(10){--tz:-36px}.layer:last-child{box-shadow:inset 0 0 .5em #000d,0 0 5px #000}.fancy-card{color:#fff;display:grid;place-items:center;position:relative;height:200px;width:150px;background:#333;border-radius:8px;overflow:hidden}.fancy-card:before{content:"";width:110px;height:350px;left:10px;top:-70px;position:absolute;background:linear-gradient(#00e5ff,#b400fb);-webkit-animation:animate 5s linear infinite;animation:animate 5s linear infinite}@-webkit-keyframes animate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes animate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.fancy-card:after{content:"";position:absolute;background:#333;inset:3px;border-radius:8px}.fancy-card .fancy-content{z-index:1}