#home::after,.cta:before{content:'';position:absolute}#home,.box,.home .cta{position:relative}.content,.home .cta{background-color:transparent}#home{font-family:'Source Sans Pro',sans-serif;z-index:1;-webkit-animation:40s linear infinite alternate bgAnimation;animation:40s linear infinite alternate bgAnimation}#home::after{left:0;top:0;height:100%;width:100%;background:var(--bg-gray-900);z-index:-1}.home{max-width:1200px;margin:0 auto;padding:0 50px;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.home h1{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:2px;font-size:5rem;font-weight:300}.box{width:30rem;height:30rem;margin:4rem}.content,.imgBox{position:absolute;left:0}.box:hover .imgBox{-webkit-transform:translate(-2rem,-8rem);transform:translate(-2rem,-8rem)}.box:hover .content{-webkit-transform:translate(2.5rem,5rem);transform:translate(2.5rem,5rem);z-index:1}.box:hover .imgBox img{padding:0;-webkit-transition:.8s ease-in-out;transition:.8s ease-in-out;-webkit-transform:scale(.8);transform:scale(.8);border-style:solid;filter:drop-shadow(1px 2px 3px #470ba9) brightness(.9) grayscale(1);-webkit-filter:drop-shadow(1px 2px 3px #470ba9) brightness(0.9) grayscale(1)}.imgBox,.portfolioIcon{-webkit-transition:.5s ease-in-out}.imgBox{top:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;z-index:2;transition:.5s ease-in-out}.content,.cta:before{top:0;width:100%;height:100%}.imgBox img{height:280px;border-radius:50%;border:2px var(--text-color);padding:15px;margin-top:25px;filter:hue-rotate(-10deg) brightness(.8);-webkit-filter:hue-rotate(-10deg) brightness(0.8)}.content{padding:1.5rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:-1;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;text-align:center;-webkit-transition:1.3s ease-in-out;transition:1.3s ease-in-out}.content-title{display:block;font-size:2rem;white-space:pre-line;color:var(--content-title);font-weight:500;line-height:2rem;letter-spacing:1px}.content-title span{color:var(--content-title-span);font-size:1.6rem;font-weight:500;letter-spacing:2px}.home .cta,.home h2{letter-spacing:.2rem}.infoAnimation{-webkit-animation:4.5s cubic-bezier(.175,.885,.32,1) moveInfo;animation:4.5s cubic-bezier(.175,.885,.32,1) moveInfo;color:var(--nav-links2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.home h1:nth-child(3){color:var(--primary-color)}.home h2{margin-top:3rem;font-size:4rem;font-weight:500}.home .cta{overflow:hidden;display:inline-block;padding:15px 35px;text-transform:uppercase;color:var(--text-color);border:2px solid;border-color:var(--primary-color);border-radius:15px;font-size:2rem;font-weight:400;margin-top:30px;-webkit-transition:background-color .7s ease-in,color 1s;transition:background-color .7s ease-in,color 1s,transform .5s ease-in-out}.home .cta:hover{-webkit-box-shadow:1px 1px 10px 5px var(--portfolio-hover);box-shadow:1px 1px 10px 5px var(--portfolio-hover);background-color:var(--primary-color)}.cta:before{left:-100%;background:linear-gradient(120deg,transparent,var(--portfolio-hover),transparent);-webkit-transition:999ms;transition:999ms}.cta:hover:before{left:100%}.portfolioIcon{font-size:20px;color:var(--text-color);margin:0 6px -3px 0;transition:.5s ease-in-out}.home .cta:hover,.home .cta:hover .portfolioIcon{color:#cacaca;-webkit-transition:.5s ease-in-out;transition:.5s ease-in-out;transform:scale(1) translateY(-5px)}.home .cta:hover .portfolioIcon{animation:.5s linear infinite alternate floating}@keyframes floating{from{transform:translateY(2px)}to{transform:translateY(-5px)}}@-webkit-keyframes bgAnimation{50%{background-position:center}75%{background-position:bottom center}}@keyframes bgAnimation{50%{background-position:center}75%{background-position:bottom center}}@-webkit-keyframes moveInfo{0%{-webkit-transform:translateY(10rem) rotateY(20deg);transform:translateY(10rem) rotateY(20deg)}100%{-webkit-transform:translateY(0) rotateY(0);transform:translateY(0) rotateY(0);opacity:1}}@keyframes moveInfo{0%{-webkit-transform:translateY(10rem) rotateY(20deg);transform:translateY(10rem) rotateY(20deg)}100%{-webkit-transform:translateY(0) rotateY(0);transform:translateY(0) rotateY(0);opacity:1}}@keyframes moveInfo2{0%{-webkit-transform:translateY(-10rem) rotateY(20deg);transform:translateY(-10rem) rotateY(20deg)}100%{-webkit-transform:translateY(0) rotateY(0);transform:translateY(0) rotateY(0);opacity:1}}
