@keyframes rolling{0%{transform:translate(0)}to{transform:translate(-1000px)}}.select{z-index:5;transition:all .2s;animation:4s infinite flickanim;position:absolute;top:15%}#introduction h1{color:var(--text-white);font-size:var(--large-text);line-height:1;display:inline-block;position:relative}#introduction span{color:var(--background);background-color:var(--accent-primary)!important}#introduction p{font-size:var(--small-text);color:var(--text-gray)}#introduction .banner-top{z-index:10;margin-top:-10rem}#introduction div{transition:all .2s}#introduction div h1{transition:all .2s}#introduction div:hover h1{animation:.3s ease-in-out infinite glitch}#introduction div:hover .select{transform:scale(.9)}.text-stripe-right{animation:15s ease-in-out infinite rolling}.text-stripe-left{animation:10s infinite reverse rolling}
.stripes-row{height:120vh;color:var(--background);background-color:var(--accent-primary);margin-top:-3rem;margin-bottom:-8.2rem}.stripes-row section{z-index:8;margin-top:-10rem;margin-bottom:-10rem;position:relative}.stripes-row div{text-shadow:10px 0 25px #00000073}.stripes-row .bg-2{background-color:var(--accent-primary)}.stripes-row p{font-size:var(--small-text);white-space:none;text-shadow:10px 10px 55px #000000b1;margin-left:1rem}.stripes-row .container-stripes{width:8000px}.stripes-row .globe{z-index:2;margin-bottom:-12rem;position:relative}
#about p{color:var(--text-gray)}#about button{background-color:var(--text-white);border-radius:.8rem;padding:.3rem .5rem;transition:all .2s}#about button:active{transform:scale(.9)}#about button:hover{background-color:var(--accent-primary);color:var(--background)}#about div{border:1px solid var(--background);background-color:var(--foreground);border-radius:2rem}#about .about-rody{z-index:12;background-color:var(--foreground);border-radius:.5rem;margin-top:2rem;padding:1rem}#about .about-rody h3{color:var(--background)}#about .about-rody p{color:var(--text-gray)}#about .about-rody strong{background-color:var(--accent-primary);border-radius:.3rem;padding:.5rem}.tech-stack button{background-color:var(--text-white);border-radius:.2rem;width:100%;padding:.3rem .5rem;transition:all .2s}.tech-stack button:active{transform:scale(.9)}.tech-stack button:hover{background-color:var(--accent-primary);color:var(--background)}.select-globe{filter:invert(100);margin-top:-7.5rem}
.secondary-bg{background-color:var(--foreground)}.how-pricing{margin-top:-.6rem}.how-pricing .whoami-banner{margin-top:2rem}.container-prices div{background-color:var(--foreground);border-radius:.5rem;transition:all .2s}.container-prices article{border:1px solid var(--text-black);border-radius:1rem;max-width:325px;padding:1rem}.container-prices article p{border-top:1px solid var(--text-black);padding:1rem}@media (min-width:600px){.container-prices div{background-color:var(--foreground);border-radius:1rem}.container-prices article{max-width:315px}}
.project-container .project{background-color:var(--foreground);border:2px solid var(--foreground);border-radius:1rem;width:580px;height:350px;transition:all .2s}.project-container .project div{opacity:0;transition:all .2s}.project-container .project:hover{border:2px dashed var(--accent-primary)}.project-container .project:hover div{opacity:2}.project-container .project:active{transform:scale(.9)}.project-container .small{transform:scale(.75)}
@keyframes start{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes flicker{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(2px,-2px)}60%{transform:translate(-2px,-2px)}80%{transform:translate(2px,2px)}to{transform:translate(0)}}@keyframes flickanim{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px);box-shadow:6px 0 red,-4px 0 #0f5}40%{transform:translate(2px,-2px);box-shadow:6px 0 red,-4px 0 #0ff}60%{transform:translate(-2px,-2px);box-shadow:5px 0 red,-4px 0 #ff7899}80%{transform:translate(2px,2px)}to{transform:translate(0)}}@keyframes rotateCircle{0%{transform:rotate(0)}50%{transform:rotate(90deg)}to{transform:rotate(180deg)}}@keyframes move-rotate{0%{transform:rotate(0)translateY(0)}50%{transform:rotate(20deg)translateY(-1rem)}to{transform:rotate(0)translateY(0)}}@keyframes floating{0%{transform:translateY(0)}50%{transform:translateY(-1rem)}to{transform:translateY(0)}}@keyframes move-up{0%{transform:translateY(0)}to{transform:translateY(-20rem)}}@keyframes text-glowing{0%{text-shadow:2px 2px 20px var(--white-light)}50%{text-shadow:2px 2px 50px var(--white-light)}to{text-shadow:2px 2px 20px var(--white-light)}}.floating-anim{animation:ease-in-out move-up;animation-timeline:view();animation-range:entry 30% cover}.start{animation:.5s start}.fade-show-anim{animation:ease-in-out fade-on;animation-timeline:view();animation-range:entry 5% cover}
.user-select-none{-webkit-user-select:none;user-select:none;--webkit-user-select:none}.no-pointer-event{pointer-events:none}
.primary-button{background-color:var(--text-white);border-radius:.2rem;padding:.6rem 1rem;transition:all .2s}.primary-button:hover{background-color:var(--accent-primary);color:var(--background);animation:.2s ease-in-out glitch}.primary-button:active{transform:scale(.9)}.nav-button-primary{padding:.5rem 1rem;transition:all .2s}.nav-button-primary:hover{color:var(--accent-primary);-webkit-text-decoration:line-through var(--accent-primary);text-decoration:line-through var(--accent-primary);font-weight:700}.nav-button-secondary{border:1px solid var(--foreground);width:90px;padding:.1rem 1rem}.nav-button-secondary a{color:var(--text-black);background-color:var(--foreground);margin-left:-1.7rem;padding:.2rem 1rem;position:relative;top:-.3rem}.nav-button-secondary:hover a{color:var(--background);background-color:var(--foreground);margin-left:-1rem;padding:.2rem 1rem;position:relative;top:0}.nav-button-secondary:active{transform:scale(.9)}.nav-button-secondary:active a{color:var(--text-black);background-color:var(--foreground);margin-left:-1rem;padding:.2rem 1rem;position:relative;top:0}.footer-button{border:1px dashed var(--background);padding:.5rem}.footer-button p{transition:all .2s}.footer-button{transition:all .2s}.footer-button:hover{color:var(--text-white);background-color:var(--background);border:1px dashed var(--accent-primary);transform:scale(1.1)}.footer-button:hover p{transform:translate(.5rem)}.footer-button:hover .banner{filter:invert(0)}.footer-button:active{transform:scale(.9)}
