@import"https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Doto:wght@100..900&display=swap";:root{--white: #f4f1ea;--yellowed-paper: #fefcf8;--grey: #8D99AE;--dark-grey: #2B2D42;--black: #000;--scarlet-red: #D90429;--ruby-red: #EF233C}#root{display:flex;flex-direction:column;align-items:center;min-height:100vh;overflow:hidden}body{background-color:var(--white);font-family:Lato,sans-serif;line-height:1.4;color:var(--dark-grey);background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px)}html{scrollbar-gutter:stable}.container{display:flex;flex-direction:column;align-items:center;min-width:100%;padding-bottom:2rem;margin-top:5.5rem}.main-logo{padding-left:1rem}.header{position:fixed;z-index:3;width:100%;top:0;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-shadow:0 15px 50px 7px #0000001a;background-color:var(--yellowed-paper);background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px)}.footer{margin-top:auto;display:flex;justify-content:center;width:100%;padding:.5rem 0;z-index:2;box-shadow:0 0 15px #0000004d}.footer-icons:nth-of-type(2){margin:0 1rem}.footer-icons:last-of-type{margin-right:1rem}.hamburger-btn{display:flex;justify-content:center;align-items:center;margin:0 1rem 0 auto;position:relative;z-index:4;height:4rem;width:4rem;background-color:transparent}.line{transition:1s;transform-origin:center}.top.expanded{transform:rotate(225deg) translateY(1.375rem);transform-origin:center}.middle.expanded{opacity:0}.bottom.expanded{transform:rotate(-225deg) translateY(-1.1rem);transform-origin:center}.nav-menu{position:absolute;top:0;right:0;display:flex;flex-direction:column;justify-content:center;background-color:var(--white);box-shadow:0 0 15px #0000004d;margin-left:auto;list-style:none;font-size:2rem;min-width:375px;transform:rotate(-90deg);padding:1rem 0;transform-origin:top right;transition:1s all;z-index:3;background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px)}.nav-menu-large{display:none}.nav-link{cursor:pointer;text-align:center;width:80%;border-bottom:1px solid var(--grey);margin-top:1.25rem;padding-bottom:1.25rem;align-self:center}.nav-menu .nav-link:last-of-type{border-bottom:1px solid var(--grey);align-self:center}.nav-socials{display:flex;flex-direction:row;justify-content:center;padding-top:1rem}.menu-visible{transition:ease-in-out .5s;transform:rotate(0)}.title{font-size:clamp(2.5rem,5vw,3rem);margin:2rem 0;line-height:1.4;text-align:center;font-weight:800}.error-message{margin-bottom:1rem}.error-image{margin-bottom:1rem;box-shadow:0 0 15px #0000004d}img{display:block;background-color:transparent;overflow:hidden}.home-title{grid-column:2/4}.home-section{width:100%;display:grid;grid-template-columns:2rem 1fr 1fr 2rem;max-width:80rem}.home-content-img{width:100%;margin:2rem 0;border-radius:50% 50% 60% 30%/30% 76% 24% 70%;grid-column:2/4;overflow:hidden;transform:translateZ(0);-webkit-mask-image:radial-gradient(circle,white 0%,white 100%)}.main-text{line-height:1.4;color:var(--dark-grey);margin:1.5rem 0}.home-text{grid-column:2/4;justify-self:center;font-size:clamp(1.2rem,3.25vw,2rem);line-height:1.6;letter-spacing:.3px;font-weight:400;text-align:center}.home-tech-icons-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem}.tech-icon-card{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--yellowed-paper);border:1px solid var(--grey);border-radius:1rem;padding:.5rem;aspect-ratio:1/1;flex:1 1 8rem;max-width:10rem;box-shadow:0 4px 6px #0000001a,0 2px 4px #0000000f,inset 0 0 30px #00000005;transition:.5s all linear}.tech-icon-card:hover{transform:translateY(-5px);box-shadow:0 10px 20px #00000026,0 6px 10px #0000001a,inset 0 0 30px #00000005}.tech-icon-img{width:90%;height:90%}.about-section{width:100%;display:grid;justify-content:center;grid-template-columns:2em 1fr 1fr 2em;max-width:80rem}.about-title{grid-column:2/4}.about-content-img{width:100%;align-self:center;border-radius:66% 34% 59% 41%/30% 28% 72% 70%;grid-column:2/4;overflow:hidden;transform:translateZ(0);-webkit-mask-image:radial-gradient(circle,white 0%,white 100%)}.dad-hair-container{position:relative;cursor:pointer;grid-column:2/4;grid-row:5/6;width:100%;align-self:center;transition:all .25s linear}.dad-hair-container img{filter:blur(10px);z-index:0;transition:filter .5s ease}.dad-hair-container img.unblurred{filter:blur(0)}.dad-hair-message{display:grid;place-items:center;position:absolute;top:50%;left:50%;transform:translate(-45%) translateY(-45%);padding:1rem;background-color:var(--white);color:var(--black);border-radius:.75rem;font-size:1.25rem;text-align:center}.about-content-img:nth-of-type(1){border-radius:38% 62% 55% 45%/48% 35% 65% 52%}.about-content-img:nth-of-type(3){border-radius:55% 45% 39% 61%/40% 44% 56% 60%}.about-text{font-size:clamp(1.2rem,3vw,1.75rem);width:90%;line-height:1.6;letter-spacing:.3px;font-weight:400;justify-self:center;text-align:center;grid-column:2/4}.about-text:first-of-type{margin-top:0}.projects-container{width:90%;min-height:100vh;display:flex;flex-direction:column;align-items:center}.projects-description-text{font-size:clamp(1.2rem,3vw,1.75rem);width:90%;max-width:60rem;margin-bottom:1rem;line-height:1.6;letter-spacing:.3px;font-weight:400;text-align:center}.project-0{transform:translate(300px) rotate(-20deg);opacity:0}.project-1{transform:translate(-300px) rotate(20deg);opacity:0}.project-2{transform:translateY(300px);opacity:0}.project{transform:translate(0) rotate(0);transition:all .6s ease-out;opacity:1;width:100%;background-color:var(--yellowed-paper);box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014,inset 0 0 60px #00000005;border:1px solid rgba(0,0,0,.08);border-radius:1rem;display:grid;grid-template-columns:1.5rem 5rem 1fr 5rem 1fr 1.5rem;grid-template-rows:1.5rem auto auto auto 2rem auto 2rem auto auto 1.5rem;grid-template-areas:". . . . . ." ". title title title title ." ". description description description description ." ". images images images images ." ". . . . . ." " massive-image massive-image massive-image massive-image massive-image massive-image " ". . . . . ." ". project-live-link project-live-link project-live-link project-live-link ." ". project-github-link project-github-link project-github-link project-github-link ." ". . . . . .";margin-bottom:5rem}.project-title{font-size:clamp(2rem,6vw,2.75rem);grid-area:title;margin-bottom:.5rem}.project-description-container{grid-area:description}.project-description-text{font-size:clamp(1.25rem,2.25vw,1.65rem);margin-bottom:1rem}.projects-description-link{color:var(--grey);font-style:italic;text-decoration:underline}.project-live-icon>svg,.project-github-icon>svg{font-size:clamp(3.5rem,10vw,5rem)}.project-live-link-container,.project-github-link-container{display:flex;justify-content:flex-start;align-items:center}.project-live-link{grid-area:project-live-link}.project-github-link{grid-area:project-github-link;margin-top:1.5rem}.project-live-link-text,.project-github-link-text{font-size:clamp(1.25rem,3vw,2rem);margin-left:1rem}.project-icon{font-size:5rem;width:5rem;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014,inset 0 0 60px #00000005;border:1px solid rgba(0,0,0,.08)}.project-gallery-container{grid-area:images;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem}.project-image{margin-top:.5rem;border-radius:.35rem;object-fit:cover;max-width:7rem;aspect-ratio:1/1;flex:1 1 50px;transition:.25s all ease-in;cursor:pointer;overflow:hidden;transform:translateZ(0)}.pulsing-image{animation:pulse 1.5s ease infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.project-massive-image-container{grid-area:massive-image;display:grid;transition:max-height .2s ease-out;max-height:0px;overflow:hidden}.project-massive-image{width:100%;box-shadow:0 0 15px #000}.massive-image-max-height{max-height:500px}.CV-section{display:grid;align-content:center;width:100%;grid-template-columns:1rem 1fr 1fr 1rem}.cv-title{grid-column:1/-1}.interactive-CV-container{display:grid;grid-column:2/4;justify-self:center;align-self:center;grid-template-rows:12% 12% auto;grid-template-columns:12% 12% 52% 12% 12%;grid-template-areas:". . statement . ." ". dial dial dial ." "personal dial dial dial hobbies";margin-bottom:2rem;width:100%;max-width:35rem}.cv-dial{height:100%;aspect-ratio:1/1;border-radius:50%;background-color:var(--grey);border:10px black solid;background-image:linear-gradient(to bottom,var(--grey),var(--white));grid-area:dial;display:flex;justify-content:start;align-items:center;transition:ease-in-out .5s}.knob{width:2rem;height:2rem;border-radius:50%;background-color:var(--dark-grey);margin-left:1rem;box-shadow:0 0 15px #0000004d}.cv-icon{color:var(--dark-grey);font-size:clamp(1.75rem,7vw,3rem);cursor:pointer}.personal{grid-area:personal;align-self:center;justify-self:center;margin-bottom:2rem}.history{grid-column:2/3;grid-row:2/3;justify-self:center;align-self:center}.statement{grid-area:statement;justify-self:center;align-self:self-start}.education{grid-column:4/5;grid-row:2/3;justify-self:center;align-self:center}.hobbies{grid-area:hobbies;justify-self:center;align-self:center;margin-bottom:2rem}.cv-element-container{grid-column:2/4;display:grid;grid-template-areas:"cv-item";width:100%}.cv-element{grid-area:cv-item;border-radius:1rem;width:100%;max-width:40rem;grid-template-columns:1fr;visibility:hidden;display:none;padding:1.5rem;align-content:flex-start;justify-self:center;background-color:var(--yellowed-paper);box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014,inset 0 0 60px #00000005;border:1px solid rgba(0,0,0,.08);height:fit-content}.cv-element-title{font-weight:800;margin-bottom:1.5rem;font-size:clamp(1.9rem,4vw,2.5rem);text-align:center}.cv-element-subHeader,.cv-element-subItem-subHeader{font-size:1.45rem;padding-bottom:1.5rem;width:85%}.cv-element-subHeaderDetail,.cv-element-subItem-subHeaderDetail{padding-bottom:1rem;font-style:italic;font-weight:400}.cv-element-text-container{padding-bottom:.5rem}.cv-element-text{font-size:clamp(1.2rem,2vw,1.4rem);line-height:1.4;padding-bottom:.5rem}.cv-element-list{padding-left:1rem}.cv-element-list-item{line-height:1.4;padding-bottom:.5rem;font-size:clamp(1.2rem,2vw,1.4rem)}.cv-element-subItem-container{display:flex;flex-direction:column;grid-column:1/3}.cv-element-subItem{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto 0fr;grid-template-areas:"cv-element-subHeader" "cv-element-subHeaderDetail" "cv-element-subItem-data";margin-bottom:2rem;transition:grid-template-rows .5s ease}.cv-arrow{grid-column:1/2;grid-row:1/2;justify-self:end;align-self:center;margin-right:1rem;font-size:2.25rem;transition:transform .5s;cursor:pointer}.rotate-cv-arrow{transform:rotate(180deg)}.cv-element-subItem:after{content:"";border-bottom:1px solid var(--grey);width:90%;justify-self:center;margin-top:1.25em}.cv-element-subItem:last-of-type:after{border-bottom:none}.cv-element-subItem:last-of-type{margin-bottom:0}.cv-element-subItem-subHeader-container{display:flex;justify-content:space-between}.cv-element-subItem-subHeader{grid-area:cv-element-subHeader;font-weight:900}.cv-element-subItem-subHeaderDetail{font-weight:600;padding-bottom:.5rem}.cv-element-subItem-data{grid-area:cv-element-subItem-data;overflow:hidden}.cv-element-subItem-date{color:var(--grey);padding-bottom:.75rem}.cv-element-subItem-text-container{padding-bottom:1rem}.cv-element-subItem-list{padding-left:1.25rem}.key-responsibilities{font-style:italic;font-size:1.25rem}.slide-up{animation:slide-up 1.5s forwards}.transition-visibility{display:grid;visibility:visible}.cv-max-height{grid-template-rows:auto auto 1fr}.text-fade-in{font-size:2rem;animation:fade-in .5s forwards}.reverse-fade-in{animation:reverse-fade-in .8s forwards;animation-delay:.4s}a{text-decoration:none;color:var(--dark-grey)}@media (min-width:768px){.hamburger-btn,.nav-menu{display:none}.main-logo{height:8rem;width:8rem;color:var(--dark-grey)}.main-text{margin-left:2rem}.main-logo-link{align-self:flex-start}.nav-menu-large{display:flex;font-size:1.35rem;letter-spacing:.5px;font-weight:500;align-self:flex-end}.nav-link{color:var(--grey);font-size:clamp(1rem,2.8vw,2.4rem);margin-left:0 .5rem .5rem;position:relative;text-decoration:none;align-self:flex-end;padding-bottom:.25rem;margin:0 .75rem .75rem;border-bottom:none;width:auto}.nav-link:after{content:"";position:absolute;background-color:var(--grey);width:0;height:4px;left:0;bottom:-5px;transition:.5s}.nav-link:hover:after{width:100%}.active-link{color:var(--dark-grey);position:relative}.active-link:after{content:"";position:absolute;background-color:var(--dark-grey);width:100%;height:4px;left:0;bottom:-5px}.container{margin-top:8.25rem}.cv-icon{font-size:clamp(2rem,4vw,3.5rem)}.home-content-img{grid-column:2/3}.home-text{width:100%;padding-left:2rem;grid-column:3/4;align-content:center}.about-text{align-self:center;padding:0 0 0 1.75rem}.about-content-img{margin-top:1rem}.about-content-img:nth-of-type(1),.about-content-img:nth-of-type(2){grid-column:3/4}.dad-hair-container{grid-column:2/3;grid-row:3/4}.about-text:first-of-type{margin-top:0}.about-text:nth-of-type(1),.about-text:nth-of-type(3){grid-column:2/3;padding:0 1.75rem 0 0}.about-text:nth-of-type(2){grid-column:3/4}.about-text:nth-of-type(4){grid-column:2/4;margin-top:2rem}.about-text:last-of-type{padding:0;margin-bottom:0}.CV-section{grid-template-columns:2rem 1fr 1.5rem 1fr 2rem;justify-content:center}.interactive-CV-container{grid-column:2/3;align-self:self-start;max-width:37.5rem}.cv-element{padding:1.5rem;max-width:40rem}.cv-element-container{grid-column:4/5;max-width:35rem}}@media (min-width:1000px){.project{max-width:80rem;grid-template-columns:1.5rem 2fr 2rem 3fr 1.5rem;grid-template-rows:1.5rem auto auto 1fr 1.5rem auto 1.5rem;grid-template-areas:". . . . ." ". title title title ." ". description . images ." ". description . massive-image ." ". . . . . " ". project-live-link . project-github-link ." ". . . . ."}.project-gallery-container{align-items:flex-start;justify-content:center;margin-bottom:2rem}.project-live-link{grid-area:project-live-link}.project-github-link{grid-area:project-github-link;margin:0}}@keyframes fade-in{0%{scale:1.5;opacity:0}to{scale:1;opacity:1}}@keyframes reverse-fade-in{0%{opacity:0}to{opacity:1}}@keyframes shrink-width{0%{width:50%;opacity:1}50%{opacity:0}to{opacity:0;width:0%}}@keyframes grow-width{0%{width:50%;opacity:0}to{width:100%;opacity:1}}@keyframes slide-up{0%{transform:translateY(1000px)}to{transform:translateY(0)}}:root{--white: #fff;--grey: #b9b9b9;--dark-grey: #1f2124;--black: #000;--charcoal: #010a01;--neon: #7d12ff;--crtGreen: #00ff33}*{padding:0;margin:0;box-sizing:border-box}.widgets-section{margin:0 auto;display:flex;justify-content:center;flex-wrap:wrap;gap:2rem;width:90%;padding:2rem 0}.widgets-title{grid-column:1/-1;width:100%}.widgets-description-text{font-size:clamp(1.2rem,3vw,1.75rem);width:90%;max-width:60rem;margin-bottom:1rem;line-height:1.6;letter-spacing:.3px;font-weight:400;text-align:center}.widget,.dark-widget{display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;flex:1 1 18.75rem;min-width:18.75rem;max-width:25rem;min-height:22rem;box-shadow:0 5px 5px 7px #0000001a;border-radius:1rem;padding-bottom:2rem}.widget{background-color:var(--yellowed-paper);box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014,inset 0 0 60px #00000005;border:1px solid rgba(0,0,0,.08)}.dark-widget{background-color:var(--charcoal)}.widget-title,.dark-widget-title{font-size:clamp(2.5rem,2vw,3rem);font-weight:600;margin:1.5rem 0;width:90%;text-align:center}.dark-widget-title{color:var(--white)}.play-next-container{position:relative;display:grid;place-items:center;justify-items:center;width:14rem;height:4rem;overflow:hidden;border-radius:1rem;margin-bottom:2.5rem;box-shadow:0 0 10px #0003;cursor:pointer}.play-next-light,.play-next-dark{position:absolute;top:0;left:0;width:14rem;height:4rem;overflow:hidden;z-index:1}.play-next-light{z-index:2;background-color:var(--white);color:var(--black)}.play-next-animated{animation:play-next 3s forwards linear}.play-next-dark{z-index:3;background-color:var(--black);color:var(--white);width:0}.play-next-text{display:flex;align-items:center;justify-content:center;width:14rem;height:4rem;font-size:2rem;font-weight:700}.play-next-text>svg{font-size:2.25rem;margin-right:.5rem}.image-gallery-container{display:flex;justify-content:center;height:30rem;max-width:343px;border-radius:1.5rem}.image-gallery-container>:hover{width:80%}.image-gallery-container:hover>:not(:hover){width:10%}.image-gallery-img{cursor:pointer;width:33.3%;object-fit:cover;border-radius:1.25rem;transition:.5s width ease-in-out}.neon-container{display:flex;justify-content:center;align-items:center;padding:1rem 2rem;width:15rem;height:5rem;border-radius:1rem;margin-bottom:2.5rem;font-weight:400;font-size:3rem;letter-spacing:1px;color:var(--white);box-shadow:0 0 7px var(--white),0 0 10px var(--white),0 0 21px var(--white),0 0 42px var(--neon),0 0 82px var(--neon),0 0 92px var(--neon),0 0 102px var(--neon),0 0 151px var(--neon),inset 0 0 30px var(--neon);border:4px solid var(--white);text-shadow:0 0 7px var(--white),0 0 10px var(--white),0 0 21px var(--white),0 0 42px var(--neon),0 0 82px var(--neon),0 0 92px var(--neon),0 0 102px var(--neon),0 0 151px var(--neon);animation:flickering 2s infinite alternate;cursor:pointer}.neon-text{color:var(--neon);font-weight:600;font-size:3rem;letter-spacing:1px;text-shadow:0 0 6px,0 0 6px}.neoff{text-shadow:none;animation:none;box-shadow:none;font-size:clamp(2rem,vw,4rem)}@keyframes flickering{0%,28%,32%,36%,88%{text-shadow:0 0 7px var(--white),0 0 10px var(--white),0 0 21px var(--white),0 0 42px var(--neon),0 0 82px var(--neon),0 0 92px var(--neon),0 0 102px var(--neon),0 0 151px var(--neon);box-shadow:0 0 7px var(--white),0 0 10px var(--white),0 0 21px var(--white),0 0 42px var(--neon),0 0 82px var(--neon),0 0 92px var(--neon),0 0 102px var(--neon),0 0 151px var(--neon),inset 0 0 30px var(--neon)}30%,34%,90%{text-shadow:none;box-shadow:none}}.social-widget{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:90%;max-width:34.3rem;height:20rem}.social-icon-container{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--charcoal);width:10rem;height:10rem;max-width:100%;transition:.3s ease-in all;border-radius:50%;cursor:pointer}.social-widget-logo{width:5.5rem;transition:.3s ease-in all}.social-widget-text{position:absolute;bottom:2.8rem;color:var(--charcoal);transition:.3s ease-in all}.social-icon-container:hover{border-radius:2rem;width:20rem;height:20rem}.social-icon-container:hover>img{width:9rem;padding-bottom:2rem}.social-icon-container:hover+p{color:var(--white);font-size:2rem;transition:.3s ease-in all}.nubbin{border-radius:.3rem .3rem 0 0;border:2px solid var(--charcoal);width:2rem;height:.5rem;background-color:silver}.battery{position:relative;width:6rem;height:20rem;border-radius:.5rem;border:2px solid var(--charcoal);cursor:pointer;transition:height 2s linear}.battery-top{background-color:#c88858;width:100%;height:34%}.battery-bottom{position:relative;background-color:var(--black);height:66%;width:100%}.battery-text{color:var(--white);position:absolute;bottom:10%;left:60%;font-size:1.8rem;font-weight:600;transform:rotate(-90deg);transform-origin:left bottom;letter-spacing:1.5px}.battery-text-charge{width:0%;position:absolute;bottom:16%;left:75%;color:var(--white);transform:rotate(-90deg);transform-origin:left bottom;letter-spacing:2px}.charge{height:0px;width:10%;position:absolute;right:5px;bottom:1.4rem}.zero-percent-charge{position:absolute;bottom:1.2rem;right:1px;transform:rotate(-90deg);transform-origin:right bottom;color:var(--white);font-size:.75rem}.hundred-percent-charge{position:absolute;top:-.6rem;right:1px;transform:rotate(-90deg);transform-origin:right bottom;color:var(--white);font-size:.75rem}.battery:hover>.charge{animation:battery-charge 2s linear forwards}.battery:hover>.battery-bottom>.hundred-percent-charge{animation:success .5s forwards ease-in;animation-delay:1.6s}.computer-container{position:absolute;top:0;left:0;height:100%;width:100%;min-width:18.75rem;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--black);border-radius:1rem;transition:all .5s linear;overflow:hidden}.computer-screen-container{position:absolute;top:0;left:0;height:100%;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--black);border-radius:1rem;transform:rotate(-90deg);transform-origin:left bottom;transition:all .75s linear;border:1px solid var(--black)}.computer-screen{position:absolute;top:0;left:0;width:100%;height:75%;border:solid var(--grey) 15px;border-radius:1rem;box-sizing:border-box;overflow:hidden}.computer-screen-controls{height:25%;width:100%;position:absolute;bottom:0;left:0;display:flex;justify-content:space-between;align-items:center;background-color:var(--grey);padding:0 1rem;border-radius:1rem;border-top:1px solid var(--dark-grey)}.computer-screen-container-toggled{transform:rotate(0)}.computer-screen-title{color:var(--crtGreen);margin-bottom:2rem;font-size:clamp(2.5rem,2vw,3rem);text-shadow:0 0 10px var(--crtGreen);font-family:Doto,sans-serif;text-align:center;width:90%}.computer-screen-button{width:10rem;height:5rem;font-size:1.5rem;color:var(--crtGreen);background-color:var(--black);border:5px solid var(--crtGreen);box-shadow:0 0 10px var(--crtGreen);border-radius:1rem;transition:all .5s ease;cursor:pointer}.computer-screen-button:hover{background-color:var(--crtGreen)}.computer-screen-button:hover>p{color:var(--black)}.computer-screen-button-text{font-size:clamp(1.5rem,2vw,2rem);font-weight:600;text-shadow:0 0 10px var(--crtGreen);font-family:Doto,monospace}.computer-screen-static{background-image:url(/assets/tvStatic-CN6-ChMX.gif);z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;animation:switch-on 3s forwards;transition:.3s opacity linear}.computer-screen-image{position:absolute;top:0;left:0;width:100%;height:100%;animation:switch-on 3s forwards;object-fit:cover}.computer-knob{z-index:3;border-radius:50%;border:5px var(--dark-grey) solid;background:radial-gradient(circle at 30% 30%,var(--grey),var(--dark-grey)),linear-gradient(135deg,transparent 45%,var(--crtGreen) 50%,transparent 55%);width:20%;aspect-ratio:1/1;box-shadow:0 0 10px var(--dark-grey);transition:.5s ease-in-out transform;cursor:pointer}.computer-knob:hover{transform:scale(1.15)}.computer-subscreen{display:flex;align-items:center;justify-content:flex-start;height:75%;width:50%;background-color:var(--black)}.computer-subscreen-text{display:flex;align-items:center;justify-content:center;width:0;font-family:Doto,sans-serif;font-size:1.5rem;color:var(--crtGreen);text-shadow:0 0 10px var(--crtGreen);animation:reveal steps(12,jump-start) forwards;white-space:nowrap;overflow:hidden}@keyframes switch-on{0%{transform:scale(0);background-color:#fff;border-radius:50%}30%{transform:scale(.01);border-radius:25%}40%{transform:scaleY(.2);border-radius:0%}60%{transform:scale(1)}70%{text-shadow:1px 1px #000}to{text-shadow:3px 3px #000,8px 8px #00B140}}@keyframes reveal{0%{width:0}60%{width:0}to{width:100%}}@keyframes play-next{0%{width:0%}to{width:100%}}@keyframes battery-charge{0%{background-color:red;height:0%}50%{background-color:#ff0;height:22%}to{background-color:green;height:46%}}@keyframes success{0%{scale:1}50%{scale:1.3}to{scale:1}}