.topbar{display:flex;position:fixed;justify-content:start;align-items:left;height:40px;margin:10px;color:#15023a;transition:all .5s ease;top:0;z-index:10;background:#a9a9a9f2;border-radius:16px;box-shadow:0 4px 30px #0006;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(0,0,0,.7)}.topbar .wrapper{display:flex;align-items:center;justify-content:space-between}.topbar .wrapper .left{display:flex}.topbar .wrapper .left .btn{display:flex;background:#00000080;font-size:1rem;padding:1px;margin-left:10px;margin-bottom:2px;border:2px solid;border-radius:10px;cursor:pointer;box-shadow:.5px .5px .5px .5px #000;font-weight:700;text-decoration:none;color:inherit;margin-right:40px;outline:none}@media (hover: hover){.topbar .wrapper .left .btn :hover{color:orange}}.topbar .wrapper .left .btn :active{transform:translate(0);overflow:hidden}.topbar .wrapper .left :active{box-shadow:none;transform:translate(2px,2px)}.topbar .wrapper span{display:flex;margin-right:20px;align-items:center;justify-content:end;font-size:1.2rem;font-weight:700}.arcade-paper{display:flex "column";justify-content:center;font-weight:700;padding:20px;margin:4px;border:2px solid;border-radius:15px;background:#a9a9a9;box-shadow:.8px .8px .8px .8px #000}.arcade-paper div:not(:first-child){margin-top:10px}.clipboard-copy{display:flex;justify-content:center;margin-bottom:1rem}.clipboard-copy form{display:flex;justify-content:center;overflow-y:visible}.clipboard-copy form label{display:flex;justify-content:center;text-align:center;color:#d3d3d3;background:#00000080;font-size:1rem;border:2px solid black;border-radius:10px;padding:5px 10px}.clipboard-copy form button{display:flex;justify-content:center;align-items:center;background:gray;padding:5px;border:1px solid black;border-radius:10px;margin-left:5px;margin-right:5px;font-weight:700}@media (hover: hover){.clipboard-copy form:hover label,.clipboard-copy form:hover button{color:orange;cursor:pointer}}.home{background-color:var(--main-bg-color);overflow:hidden;height:100vh;width:100vw}.fullscreen-button{display:flex;position:absolute;top:15px;right:20px;background-color:#a9a9a9;border:2px solid black;border-radius:10px;padding:5px}.fullscreen-button:active{box-shadow:none;transform:translate(1px,1px)}@media only screen and (min-width: 600px){.fullscreen-button{display:none}}.content{display:flex;height:100vh;align-items:center}.intro-card{display:flex;margin:10px;flex-direction:column;padding:1rem}.header-name{font-size:3rem;letter-spacing:-1px;color:var(--primary)}@media only screen and (max-width: 768px){.header-name{font-size:2rem}}.header-title{margin-left:.2rem;font-size:1.5rem;letter-spacing:-1px;color:#000}@media only screen and (max-width: 768px){.header-title{font-size:1rem}}.body-summary{margin-top:20px;font-size:1rem;font-weight:500;color:#000}.stripes{display:flex;position:absolute;width:100vw;height:50px;margin-top:10px;opacity:.8;background:repeating-linear-gradient(45deg,#bbb,#fff 10px,#000 10px,#111 20px)}.kbd-key{display:flex;justify-content:center;align-items:center;width:fit-content;height:1.5rem;padding:1px 8px;font-weight:700;background:linear-gradient(gray,#d3d3d3,gray);box-shadow:1px 1px 1px 1px #000;border:2px solid;border-radius:10px;margin:4px}.kbd-key:hover{cursor:pointer;box-shadow:none;transform:translate(1px,1px)}.hotkeys table{display:flex;justify-content:center;padding:4px}.hotkeys table td{padding-right:5px;padding-left:5px}.hotkeys table .td-right{text-align:right;align-items:right;float:right}.contact h2{margin-bottom:1rem}.contact .links{display:flex;direction:row;justify-content:center;padding:4px}.contact .links button{display:flex;background-color:#00000080;border:2px solid black;border-radius:10px;padding:2px;margin-left:5px;margin-right:5px;box-shadow:.5px .5px .5px .5px #000}@media (hover: hover){.contact .links :hover{color:orange;cursor:pointer}}.contact .links button:active{box-shadow:none;transform:translate(1px,1px)}.contact-hotkeys{display:flex;flex-direction:column}.hidden{display:none}.arrow-container{display:flex;justify-content:center;width:100px;height:100px;position:relative;bottom:60px;left:50%;transform:translate(-50%,-50%) rotate(0)}.arrow-container:hover{cursor:pointer}.arrow-container:hover .arrow{top:50%}.arrow-container:hover .arrow:before{transform:translate(-50%,-50%) rotate(-30deg)}.arrow-container:hover .arrow:after{transform:translate(-50%,-50%) rotate(30deg)}.arrow{position:absolute;padding-left:30px;padding-right:30px;height:20px;transition:all .4s ease}.arrow:before,.arrow:after{transition:all .4s ease;content:"";display:block;position:absolute;transform-origin:bottom right;background:orange;box-shadow:1px 1px 2px 1px gray;width:5px;height:30px;border-radius:10px;transform:translate(-50%,-50%) rotate(-45deg)}.arrow:after{transform-origin:bottom left;transform:translate(-50%,-50%) rotate(45deg)}.arrow:nth-child(1){opacity:.3;top:25%}.arrow:nth-child(2){opacity:.6;top:45%}.arrow:nth-child(3){opacity:.9;top:65%}.skills{background-color:var(--main-bg-color);display:flex;overflow:hidden;height:100vh;width:100vw}.skills table{margin-top:20px;font-size:1.5rem;font-weight:700;border-spacing:10px;line-height:50px}.skills table td{padding-left:5px;padding-right:5px;border-radius:10px}@media only screen and (max-width: 1400px){.skills table{display:flex;justify-content:center;font-size:.8rem;line-height:30px}}.skills table tbody tr .left-cell{border:2px solid black}@media (hover: hover){.skills table tbody tr:hover .left-cell{transition:transform .5s ease;background:#000;cursor:pointer;color:#fff;transform:scale(1.04);background:linear-gradient(45deg,var(--main-bg-color),rgba(0,0,0,.7) 20%);background-position:200% 0%;background-size:200% 100%;animation:animateGradient .5s 1;animation-fill-mode:forwards}}.skills table tbody tr:active .left-cell{transform:scale(1);background:#0009;color:#d3d3d3;cursor:pointer;-webkit-user-select:none;user-select:none;transition:none}@keyframes animateGradient{0%{background-position:0% 0%}to{background-position:100% 0%}}@media (hover: hover){.skills table :hover tr:not(:hover){transition:opacity .5s ease;filter:grayscale(100%);opacity:.8}}.list{margin-top:20px;font-size:1rem;font-weight:700}.list li{display:flex;margin:1rem}.canvas-satellite{display:flex;align-items:center;width:100%;height:100%;background-color:#000c;border-radius:25px}.glow{box-shadow:inset 0 0 20px 5px var(--main-bg-color),inset 0 0 20px 5px #000}.canvas{display:flex;position:relative;width:inherit;height:inherit}.canvas .footer{font-weight:700;animation:color-change 3s Ease-in-out infinite;-webkit-user-select:none;user-select:none}@keyframes color-change{0%{color:#ffa50033}50%{color:#ffa500b3}to{color:#ffa50033}}.rating-container{display:flex;width:inherit;margin:2px;padding-left:5px;padding-right:5px;color:#000;border-radius:5px;border-style:solid}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;height:4px;margin:4px;background-color:#00000080}.progress::-webkit-progress-bar{background-color:#0000001a;border-radius:25px}.progress::-moz-progress-bar{background-color:#ffa500b3;border-radius:25px}.progress::-o-progress-bar{background-color:#0009;border-radius:25px}.progress::-ms-progress-bar{background-color:#0009;border-radius:25px}.progress::-webkit-progress-value{background-color:#ffa500b3;border-radius:25px}.progress::-moz-progress-value{background-color:#ffa500b3;border-radius:25px}.progress::-o-progress-value{background-color:#ffa500b3;border-radius:25px}.progress::-ms-progress-value{background-color:#ffa500b3;border-radius:25px}.work{background-color:var(--main-bg-color);overflow:hidden;height:100vh;width:100vw}.job-date{font-size:1rem;text-decoration:blue underline;text-decoration-thickness:2px;padding-bottom:.5rem;-webkit-user-select:none;user-select:none}.job-date:hover{text-decoration:rgba(255,165,0,.6) underline;text-decoration-thickness:4px}.company-body{display:flex;flex-direction:row;justify-content:center;align-items:flex-end;margin-bottom:1.5rem}.company-body img{margin-right:1rem;background:#00000080;padding:8px;border-radius:20%}.company-body .company-name-title h1{letter-spacing:-.1rem;word-spacing:-.5rem}.company-body .company-name-title p{font-style:italic;font-size:1rem}.company-body .company-link{display:flex;height:58px;margin-left:1rem}@media only screen and (max-width: 768px){.company-body .company-name-title p{font-size:.8rem}}.job-body{font-weight:400}.job-body .job-list{list-style:inside;margin-bottom:2rem}.job-body .underline{text-decoration:underline}.job-body .bold{font-weight:700}.job-body .margin-title{margin-bottom:.5rem}.job-body .body{margin-bottom:2rem}.job-body .hide{display:none}@media only screen and (max-width: 600px){.job-body .job-list{padding-left:1rem}.job-body .job-list li{margin-bottom:1rem}.job-body .mobile-hide{display:none}}.job-folder{position:relative;margin:2rem;padding:30px 2px 2px}.job-folder nav ul{position:absolute;right:0;top:10px;margin-right:10px}.job-folder nav li{display:inline-block;margin-left:-20px;overflow:hidden}.job-folder nav a{text-decoration:none;color:#fff;background:gray;position:relative;margin:10px 22px;padding:10px 11px;text-shadow:0 1px 0 rgba(0,2,0,.4);border-radius:7px 7px 0 0}.job-folder nav a:before,.job-folder nav a:after{content:"";position:absolute;top:0;width:23px;height:100%;background-color:inherit}.job-folder nav a:before{border-radius:12px 0 0;transform:skew(-24deg);left:-13px}.job-folder nav a:after{border-radius:0 12px 0 0;transform:skew(24deg);right:-13px;border-right:1px solid #628E2F;z-index:1}.job-folder nav li.active{padding-bottom:4px;font-weight:700}.job-folder nav li:hover{padding-bottom:4px;cursor:pointer}.job-folder nav li.active a{color:#00f;background:#a9a9a9;z-index:2}.job-folder nav li.active a:before{z-index:2}.job-folder .folder-content{display:flex "column";position:sticky;justify-content:center;font-weight:700;padding:20px;border:2px solid;z-index:1;border-radius:15px;background:#a9a9a9;box-shadow:.8px .8px .8px .8px #000}.job-folder .folder-content div:not(:first-child){margin-top:10px}.project-card .body-container,.project-card .button-container{width:100%}.project-folder{position:relative;margin:2rem;padding:30px 2px 2px}.project-folder nav ul{position:absolute;right:0;top:10px;margin-right:10px}.project-folder nav li{display:inline-block;margin-left:-20px;overflow:hidden}.project-folder nav a{text-decoration:none;color:#fff;background:gray;position:relative;margin:10px 22px;padding:10px 11px;text-shadow:0 1px 0 rgba(0,2,0,.4);border-radius:7px 7px 0 0}.project-folder nav a:before,.project-folder nav a:after{content:"";position:absolute;top:0;width:23px;height:100%;background-color:inherit}.project-folder nav a:before{border-radius:12px 0 0;transform:skew(-24deg);left:-13px}.project-folder nav a:after{border-radius:0 12px 0 0;transform:skew(24deg);right:-13px;border-right:1px solid #628E2F;z-index:1}.project-folder nav li.active{padding-bottom:4px;font-weight:700}.project-folder nav li:hover{padding-bottom:4px;cursor:pointer}.project-folder nav li.active a{color:#00f;background:#a9a9a9;z-index:2}.project-folder nav li.active a:before{z-index:2}.project-folder .folder-content{display:flex "column";position:sticky;justify-content:center;font-weight:700;padding:20px;border:2px solid;z-index:1;border-radius:15px;background:#a9a9a9;box-shadow:.8px .8px .8px .8px #000}.project-folder .folder-content div:not(:first-child){margin-top:10px}.project-folder .button-container{width:100%}.projects{background-color:var(--main-bg-color);display:flex;justify-content:center;align-items:center;overflow:hidden;height:100vh;width:100vw}.projects h3{margin-bottom:.5rem;word-spacing:-.2rem}.projects p{font-weight:400;margin-bottom:1rem;height:4rem}@media only screen and (max-width: 1200px){.projects{align-items:flex-start}.projects p{height:100%}}.projects .button-placeholder{height:32px}.projects button{color:#fff;cursor:pointer;background-color:#00000080;border:2px solid black;border-radius:10px;padding:4px;margin-bottom:2px;box-shadow:.5px .5px .5px .5px #000}@media (hover: hover){.projects button:hover{color:orange;cursor:pointer}}.projects button:active{box-shadow:none;transform:translate(1px,1px)}.projects .image-container{display:flex;justify-content:center;align-items:center;border:2px solid black;border-radius:15px;width:400px;height:inherit;max-width:400px;max-height:144px;margin-bottom:2rem}.projects .image-container .img-static{position:absolute;width:inherit}.projects .image-container .img-static:hover{opacity:0}.projects .image-container video{width:100%;height:144px;max-width:100%;max-height:100%;object-fit:fill}.projects .image-container img,.projects .image-container .dummy-144{height:144px}@media (max-height: 700px) and (min-width: 1200px){.projects .image-container{width:300px;height:100px;margin-bottom:0rem}}@media (max-height: 800px) and (min-width: 1200px){.projects .hide-height{display:none}}.contact-page{display:flex;justify-content:center;align-items:center;background-color:gray}.contact-page span{color:#000;font-size:4rem;letter-spacing:-.1rem;padding:2px;font-weight:700;font-style:italic}:root{--main-bg-color: #01A7A8;--primary: white;--secondary: yellow;background-color:var(--main-bg-color)}@property --primary-light{syntax: "<color>"; inherits: false; initial-value: rgba(203,96,64,.5);}*{font-family:JetBrains Mono;word-spacing:-.2rem}.app{z-index:10;background-color:#a9a9a9}.app .sections{width:100vw;height:100vh;position:absolute;z-index:9;overflow-y:auto;scroll-behavior:smooth}.app .sections::-webkit-scrollbar{width:.3rem}.app .sections::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:10px}.app .sections::-webkit-scrollbar-thumb{background:orange;border-radius:10px}.app .sections>*{width:100vw;height:100vh;overflow-y:hidden}.app .sections .buffer{height:1px;scroll-snap-align:start}.loading-screen{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background:gray}