.project{background-color:rgba(17,17,17,.25);border:solid rgba(80,80,80,.5) 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;backdrop-filter:blur(5px);border-radius:15px;gap:10px;padding:20px;box-shadow:#1e1e1e 0 0 40px;transition:background-color .25s,transform .25s;gap:1.4em;margin:20px;max-width:min(500px,90%);width:100%}@media(hover: hover)and (pointer: fine){.project:hover{background-color:rgba(112,112,112,.25);transform:scale(1.025) translateY(-5px)}.project:hover hr{background:linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(17, 17, 17) 48%, rgb(17, 17, 17) 52%, rgba(0, 0, 0, 0) 100%)}}.project .project-icon{width:120px;height:100%;fill:#fff;flex-shrink:0}.project .project-name{padding:0;margin:0;text-align:center;font-size:2.6em}.project .project-description{margin:0;text-align:center}.project .project-technologies{display:flex;align-items:center;justify-content:center;gap:10px}.project .project-technologies .divider{background-color:#fff;width:1.5px;height:2em;margin:0 2px}.project .project-technologies i{font-size:2.2em}.project .project-technologies img{width:2em}.project .project-tags{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0;justify-content:center}.project .project-tags .project-tag{--deg: 0deg;position:relative;margin:1px 0;padding:3px 8px;font-size:1rem;background-color:rgba(40,40,40,.7);border-radius:20px;backdrop-filter:blur(1px);color:#fff;z-index:1;overflow:hidden}.project .project-tags .project-tag.highlight{background-color:rgba(60,60,60,.7);color:#ffe17b}.project .project-tags .project-tag.highlight::before{background:conic-gradient(from var(--deg), rgba(255, 255, 255, 0.9) 0deg, rgba(255, 223, 100, 0.5) 100deg, rgba(255, 255, 200, 0.7) 180deg, rgba(255, 223, 100, 0.5) 260deg, rgba(255, 255, 255, 0.9) 360deg);filter:blur(1px) saturate(1.5)}.project .project-tags .project-tag.alpha{background-color:rgba(60,60,60,.7);color:#9d00ff}.project .project-tags .project-tag.alpha::before{background:conic-gradient(from var(--deg), rgba(255, 255, 255, 0.9) 0deg, rgba(157, 0, 255, 0.5) 100deg, rgba(228, 200, 255, 0.7) 180deg, rgba(157, 0, 255, 0.5) 260deg, rgba(255, 255, 255, 0.9) 360deg);filter:blur(1px) saturate(1.5)}.project .project-tags .project-tag.beta{background-color:rgba(60,60,60,.7);color:#e734ff}.project .project-tags .project-tag.beta::before{background:conic-gradient(from var(--deg), rgba(255, 255, 255, 0.9) 0deg, rgba(239, 60, 255, 0.5) 100deg, rgba(237, 200, 255, 0.7) 180deg, rgba(239, 60, 255, 0.5) 260deg, rgba(255, 255, 255, 0.9) 360deg);filter:blur(1px) saturate(1.5)}.project .project-tags .project-tag::before{content:"";position:absolute;inset:0;z-index:-1;padding:1px;border-radius:20px;background:conic-gradient(from var(--deg), rgba(255, 255, 255, 0.7) 0deg, rgba(80, 80, 80, 0.5) 100deg, rgba(140, 140, 140, 0.4) 180deg, rgba(80, 80, 80, 0.5) 260deg, rgba(255, 255, 255, 0.7) 360deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:background .1s}.project hr{width:100%;border:none;height:2px;transition:background .25s;background:linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(30, 30, 30) 48%, rgb(30, 30, 30) 52%, rgba(0, 0, 0, 0) 100%);margin:.2rem 0;border-radius:20px}@keyframes scroll-arrow-anim{0%,100%{transform:translateY(0) scale(1);opacity:1;filter:drop-shadow(0 0 0 transparent);color:#fff}50%{transform:translateY(30px) scale(1.2);opacity:.7;filter:drop-shadow(0 0 5px black)}100%{color:#fff}}.screen{padding-bottom:40px;padding-top:100px}.screen .scroll-arrow{margin-top:20px;font-size:2em;cursor:pointer}@media(prefers-reduced-motion: no-preference){.screen .scroll-arrow{opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease}.screen .scroll-arrow.shown{opacity:1;visibility:visible;animation:scroll-arrow-anim 2s ease-in-out infinite;animation-delay:.25s}}@media(prefers-reduced-motion: reduce){.screen .scroll-arrow{animation:none;opacity:1;visibility:visible}}