:root{--rem:10px;--theme-color-main:hsl(0,0%,0%);--theme-color-second:hsl(0,0%,0%);--theme-color-third:hsl(250,99%,37%);--overlay-bg-clr:hsla(0,0%,100%,.6);--msg-overlay-bg-clr:hsla(0,0%,0%,.7);--header-bg-clr:hsl(0,0%,100%);--header-font:'Orbitron',sans-serif;--header-clr:hsl(0,0%,0%);--header-font-sz:4rem;--nav-bg-clr:hsl(0,0%,100%);--page-nav-bg-clr:hsl(0,0%,100%);--h-font:'Montserrat',sans-serif;--h-clr:var(--theme-color-main);--h-font-weight:500;--h1-font-sz:3rem;--h2-font-sz:2.8rem;--h3-font-sz:2.6rem;--h4-font-sz:2.4rem;--h5-font-sz:2.2rem;--h6-font-sz:1.8rem;--p-font:'Montserrat',sans-serif;--p-clr:hsla(0,0%,0%,.8);--p-font-sz:1.5rem;--p-font-weight:300;--b-font-weight:500;--ol-ul-font:'Montserrat',sans-serif;--ol-ul-clr:hsla(0,0%,0%,.8);;--ol-ul-font-sz:1.5rem;--ol-ul-font-weight:300;--ol-ul-marker-clr:var(--theme-color-third);--a-font:'Montserrat',sans-serif;--a-clr:hsla(0,0%,0%,.8);;--a-font-sz:1.5rem;--a-font-weight:300;--btn-font:'Montserrat',sans-serif;--btn-clr:hsl(0,0%,100%);--btn-font-sz:1.5rem;--btn-font-weight:500;--btn-bg-clr:hsl(0,100%,34%);--btn-hover-clr:hsl(0,100%,50%);--btn-hover-bg-clr:hsl(0,0%,0%);--btn-border-clr:hsl(0,100%,50%);--btn-border:none;--btn-border-radius:4px;--code-font:'Courier New',Courier,monospace;--code-clr:hsla(0,0%,0%,.8);--code-font-sz:1.5rem;--code-font-weight:300;--code-hover-clr:hsl(90,100%,49%);;--code-bg-clr:hsl(0,0%,86%);--code-hover-bg-clr:hsl(0,0%,0%);--footer-font:'Montserrat',sans-serif;--footer-clr:hsl(0,0%,0%);--footer-bg-clr:hsl(0,0%,100%);--footer-font-sz:1rem}*{margin:0;padding:0;box-sizing:border-box;-webkit-box-sizing:border-box}html{font-size:var(--rem);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:3rem}#container{display:grid;grid-template-columns:1fr 8rem;grid-template-rows:max-content 1fr max-content;min-height:100dvh}h1,h2,h3,h4,h5,h6{font-family:var(--h-font);color:var(--h-clr);font-weight:var(--h-font-weight);margin-bottom:1rem}h1{font-size:var(--h1-font-sz)}h2{font-size:var(--h2-font-sz)}h3{font-size:var(--h3-font-sz)}h4{font-size:var(--h4-font-sz)}h5{font-size:var(--h5-font-sz)}h6{font-size:var(--h6-font-sz)}p{font-family:var(--p-font);color:var(--p-clr);font-weight:var(--p-font-weight);font-size:var(--p-font-sz);line-height:2rem;margin-bottom:1rem}b{font-weight:var(--b-font-weight)}ul,ol{font-family:var(--ol-ul-font);color:var(--ol-ul-clr);font-size:var(--ol-ul-font-sz);font-weight:var(--ol-ul-font-weight);margin-left:2rem;margin-bottom:1rem}ul>li,ol>li{font-family:var(--ol-ul-font);color:var(--ol-ul-clr);font-size:var(--ol-ul-font-sz);font-weight:var(--ol-ul-font-weight);margin-bottom:.5rem}ul>li::marker,ol>li::marker{color:var(--ol-ul-marker-clr)}a{font-family:var(--a-font);font-size:var(--a-font-sz);color:var(--a-clr);cursor:pointer;text-decoration:none;display:inline-block;position:relative;user-select:none}a:hover,a:focus,a:focus-within,a:focus-visible,a:active{border:none;outline:none}a.page-link::after{content:"";width:0;position:absolute;border-bottom:1px solid var(--theme-color-second);left:0;bottom:0;z-index:1}a.page-link:hover::after,a.page-link:focus::after,a.page-link:focus-within::after,a.page-link:focus-visible::after,a.page-link:active::after{width:0;animation-name:example;animation-duration:300ms;animation-fill-mode:forwards}@keyframes example{from{width:0}to{width:100%;}}a.page-nav-item{color:var(--theme-color-main);font-size:var(--p-font-sz);font-family:var(--p-font);text-decoration:none;display:block;line-height:2rem;cursor:pointer;margin-bottom:1rem;position:relative}a.page-nav-item:focus,a.page-nav-item:focus-within,a.page-nav-item:focus-visible,a.page-nav-item:active{transform:scale(1)}a.page-nav-item:hover{transform:scale(1)}a.page-nav-item:hover::after{content:url('../icons/arrow-forward.svg');position:absolute;margin-left:1rem;margin-top:.2rem}button.page-button{font-family:var(--btn-font);color:var(--btn-clr);font-size:var(--btn-font-sz);font-weight:var(--btn-font-weight);padding:1rem 3rem;background-color:var(--btn-bg-clr);border:var(--btn-border);border-radius:var(--btn-border-radius);margin-bottom:1rem;text-shadow:1px 1px 1px #000;background-image:linear-gradient(to top left,rgba(0,0,0,.2),rgba(0,0,0,.2) 30%,rgba(0,0,0,0));box-shadow:inset 2px 2px 3px rgba(255,255,255,.5),inset -2px -2px 3px rgba(0,0,0,.3);transition:background-color 300ms}button.page-button:hover{background-color:var(--btn-hover-clr)}button.page-button:focus,button.page-button:focus-within,button.page-button:focus-visible,button.page-button:active{outline-color:var(--theme-color-second);outline-width:1px;outline-style:solid}[data-tooltip]{position:relative}[data-tooltip]:hover::before{content:attr(data-tooltip);position:absolute;width:100%;background-color:black;color:#fff;padding:.5rem;top:100%;left:50%;transform:translate(-50%,10%);font-size:1.2rem;z-index:100}img{max-height:100%;display:block;margin-bottom:1rem}code{font-family:var(--code-font);color:var(--code-clr);font-size:var(--code-font-sz);font-weight:var(--code-font-weight);background-color:var(--code-bg-clr);padding:0 .5rem 0 .5rem}code:hover,code:focus,code:focus-visible,code:focus-within,code:active{color:var(--code-clr);background-color:var(--code-bg-clr);animation-name:code;animation-duration:400ms;animation-fill-mode:forwards;animation-delay:200ms}@keyframes code{from{color:var(--code-clr);background-color:var(--code-bg-clr)}to{color:var(--code-hover-clr);background-color:var(--code-hover-bg-clr)}}header{grid-column:1;grid-row:1;display:grid;grid-template-columns:1fr;grid-template-rows:auto;padding:2rem 0 3rem 0;background-color:var(--header-bg-color)}header h1{grid-column:1;grid-row:1;justify-self:center;font-family:var(--header-font);color:var(--header-font-clr);font-size:var(--header-font-sz);margin:0 1rem 0 1rem;user-select:none}nav{position:fixed;right:0;bottom:0;top:0;width:8rem;height:100%;background-color:var(--nav-bg-clr);display:grid;grid-template-columns:1fr;grid-template-rows:1rem repeat(3,6rem);justify-items:center;align-items:center;overflow-y:auto;z-index:2}#page-nav{position:fixed;right:-100%;bottom:0;top:0;width:max-content;height:100%;display:flex;flex-direction:column;background-color:var(--page-nav-bg-clr);overflow-y:hidden;padding:1rem 12rem 2rem 2rem;border-left:1px solid var(--theme-color-main);z-index:1}.nav-card{padding:1rem 5rem .5rem 1rem;margin-bottom:1rem}.nav-card h6{color:var(--theme-color-main);user-select:none}nav.open-menu{right:0}#page-nav.open-menu{right:0}.nav-button{cursor:pointer}#logout-button{grid-column:1;grid-row:2}#logout-button::before{content:url('../icons/logout.svg')}#home-button{grid-column:1;grid-row:3}#home-button::before{content:url('../icons/home.svg')}#menu-button{grid-column:2;grid-row:1;cursor:pointer;align-self:center;justify-self:center;display:none}#menu-button::before{content:url('../icons/menu.svg')}#close-menu-button{display:none}#close-menu-button::before{content:url('../icons/close.svg')}#page-nav-button{grid-column:1;grid-row:4}#page-nav-button::before{content:url('../icons/more-menu.svg')}#close-page-nav-button::before{content:url('../icons/close.svg')}section p.p-info{color:var(--theme-color-main);position:relative;padding-left:2.4rem}footer{grid-column:1;grid-row:3;display:flex;align-content:center;justify-content:center;padding:2rem 0}footer p{font-family:var(--footer-font);color:var(--footer-clr);font-size:var(--footer-font-sz);font-weight:var(--footer-font-weight)}.blink{filter:grayscale(0%);animation-name:blink;animation-duration:500ms;animation-delay:200ms;animation-iteration-count:6}@keyframes blink{from{filter:grayscale(0%)}to{filter:grayscale(100%)}}::-webkit-scrollbar{width:14px}::-webkit-scrollbar-track{box-shadow:inset 0 0 2px rgb(46,46,46);border-radius:2px;background-color:#fff}::-webkit-scrollbar-thumb{background-color:var(--theme-color-main);border-radius:2px}#overlay{position:fixed;top:0;left:0;width:100dvw;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#fff;z-index:100}#message-overlay{position:fixed;top:0;left:0;width:100dvw;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-color:var(--msg-overlay-bg-clr);z-index:101}.spin{animation-name:spin;animation-duration:2000ms;animation-iteration-count:infinite;animation-timing-function:linear;user-select:none}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.modal{width:min(600px,70vw);height:auto;background-color:#fff;border-radius:8px;border:1px rgba(0,0,0,.5) solid;margin-top:80px;padding:2rem;word-break:break-word;box-shadow:4px 4px 6px hsl(0deg 0% 19%)}.modal>h2{font-family:var(--h-font);color:var(--theme-color-main);font-size:2rem;margin-bottom:20px;border-bottom:1px currentColor solid}div#message p{font-family:var(--p-font);color:var(--p-clr);font-size:var(--p-font-sz);font-weight:var(--p-font-weight)}.hidden{opacity:0}.shown{opacity:1}button.close-modal-button,button.reload-page-button{margin-top:1rem}@media screen and (max-width:500px){#container{grid-template-columns:1fr}#menu-button{display:block}header{grid-template-columns:1fr 8rem}nav{grid-template-rows:1rem repeat(4,6rem) 1fr;right:-8rem}#close-menu-button{grid-row:2;display:block}#logout-button{grid-row:3}#home-button{grid-row:4}#page-nav-button{grid-row:5}#page-nav{padding:1rem 8rem 2rem 2rem;width:100%}html{font-size:9px}}