:root{--btnAlpha: .5;--width: 0;--height: 0;--switch: 1s}@font-face{font-family:font;src:url(/font.woff2);font-display:block}body{font-family:font;background-color:#000;color:#fff;overflow:hidden;-webkit-user-select:none;user-select:none}button{font-family:font}html{font-size:1px}h1{text-align:center;font-size:100rem;text-shadow:0 10rem #555,0 0 20rem black,0 10rem 20rem black}canvas{position:absolute;top:0;left:0;z-index:-1}#pages{display:flex;flex-direction:column;position:absolute;top:50%;left:0;transform:translateY(-50%)}#pages button{margin:2.5rem 0;font-size:50rem;text-shadow:0 5rem #555,0 0 10rem black,0 5rem 10rem black;position:relative;width:325rem;height:75rem;text-align:left;border:none;padding-left:30rem;color:#fff;transition:width .2s ease-out,padding-left .2s ease-out,all .2s ease-out}button:after{content:"";position:absolute;top:50%;left:99.9%;transform:translateY(-50%);width:75rem;height:75rem;background:inherit;clip-path:polygon(0 0,100% 0%,0 100%)}#pages button:hover{width:362.5rem;padding-left:67.5rem}#pages button:disabled{width:287.5rem;padding-left:20rem;opacity:.5}#pages button:disabled{translate:-10rem 0}.sideClick{animation:sideBtnClick 2s cubic-bezier(.16,1,.3,1)}.sideClick:disabled{animation:sideBtnClickD 2s cubic-bezier(.16,1,.3,1)}@keyframes sideBtnClick{0%{right:0}25%{right:200rem;opacity:0}50%{right:100rem;opacity:0}to{right:0;opacity:1}}@keyframes sideBtnClickD{0%{right:0;opacity:.5}25%{right:200rem;opacity:0}50%{right:100rem;opacity:0}to{right:0;opacity:.5}}#silverBtn{background-color:rgba(0,127,255,var(--btnAlpha))}#gamesBtn{background-color:rgba(255,0,0,var(--btnAlpha))}#infoBtn{background-color:rgba(255,127,0,var(--btnAlpha))}#devlogsBtn{background-color:rgba(255,255,0,var(--btnAlpha))}#chatBtn{background-color:rgba(0,255,0,var(--btnAlpha))}#extraBtn{background-color:rgba(127,127,127,var(--btnAlpha))}.content{display:block;opacity:1;position:absolute;left:450rem;top:200rem;width:calc(var(--width) - 450rem - 50em);height:calc(var(--height) - 200rem - 50em);transition:opacity .75s}.in{transition-timing-function:cubic-bezier(.33,0,.66,0);opacity:1;z-index:0}.out{transition-timing-function:cubic-bezier(.33,1,.66,1);opacity:0;z-index:-1}iframe{width:100%;height:100%;position:absolute;left:0;top:0;z-index:-1000}#title{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:210rem}#title *{position:absolute}#title h1{left:50%;top:50%;transform:translate(-50%,-100%)}#silver{display:flex;flex-direction:column;justify-content:center;align-items:center}#silver p{text-align:center;font-size:40rem;text-shadow:0 4rem #555,0 0 8rem black,0 4rem 8rem black;transition:translate var(--switch) ease}#silver p.hide{translate:0 50rem}#silver img{width:300rem;height:300rem;transform:translate(-50%,-50%)}#silver #images{width:700rem;height:500rem;position:relative}#main-img{position:absolute;left:50%;top:50%;filter:drop-shadow(0 0 10rem white);animation:slow-rotate 10s ease-in-out infinite;transition:scale var(--switch) ease,translate var(--switch) ease;scale:1;translate:0 0}#main-img.hide{scale:0;translate:-50% -50%}#silver #images .side-img{width:200rem;height:200rem;object-fit:cover;transform:translate(-50%,-50%);position:absolute;border-radius:50%;clip-path:none}#silver #images #img1{background-image:url(/devlogs/shadows.webp);background-size:cover;background-position:-80rem 0;left:calc(50% + 150rem);top:calc(50% - 200rem);clip-path:none;box-shadow:0 0 20rem #90ee90;animation:float 4s ease-in-out infinite;transition:scale calc(var(--switch) * .887) ease,translate calc(var(--switch) * .887) ease}#silver #images #img1.hide,#silver #images #img3.hide{translate:0 -50%;scale:0}#silver #images #img2.hide,#silver #images #img4.hide{translate:-100% -50%;scale:0}#img2{left:calc(50% - 200rem);top:calc(50% + 150rem);background-image:url(/devlogs/the-farlands.webp);background-position:50% 50%;background-size:300%;box-shadow:0 0 20rem #90ee90;animation:float 3s ease-in-out infinite;animation-delay:1s;transition:scale calc(var(--switch) * .667) ease,translate calc(var(--switch) * .667) ease}#img3{left:calc(50% + 250rem);top:calc(50% + 100rem);background-image:url(/games/battle-cubes.webp);background-position:50% 0;background-size:cover;box-shadow:0 0 20rem gray;animation:float 3.5s ease-in-out infinite;animation-delay:2s;transition:scale calc(var(--switch) * 1.333) ease,translate calc(var(--switch) * 1.333) ease}#silver #images #img4{border-radius:50%;clip-path:none;background-image:url(/games/net-maker.png);background-size:200%;background-position:-40rem -40rem;left:calc(50% - 250rem);top:calc(50% - 100rem);box-shadow:0 0 20rem #00008b;animation:float 3.25s ease-in-out infinite;animation-delay:3s;transition:scale calc(var(--switch) * 1.107) ease,translate calc(var(--switch) * 1.107) ease}@keyframes float{0%,to{transform:translate(-50%,-50%) translate(0) scale(1)}50%{transform:translate(-50%,-50%) translateY(-10rem) scale(1.02)}}@keyframes slow-rotate{0%{transform:translate(-50%,-50%) rotate(-5deg) scale(1);filter:drop-shadow(0 0 10rem white)}50%{transform:translate(-50%,-50%) rotate(5deg) scale(1.1);filter:drop-shadow(0 0 5rem white)}to{transform:translate(-50%,-50%) rotate(-5deg) scale(1);filter:drop-shadow(0 0 10rem white)}}@keyframes slow-rotate-hide{0%{transform:translate(-50%,-50%) rotate(-5deg) scale(0);filter:drop-shadow(0 0 10rem white)}50%{transform:translate(-50%,-50%) rotate(5deg) scale(0);filter:drop-shadow(0 0 5rem white)}to{transform:translate(-50%,-50%) rotate(-5deg) scale(0);filter:drop-shadow(0 0 10rem white)}}h2{font-size:75rem;text-shadow:0 7.5rem #555,0 0 15rem black,0 7.5rem 15rem black;text-align:center;margin:20rem 0;position:absolute;left:50%;transform:translate(-50%);pointer-events:none;transition:translate var(--switch) ease}h2.hide{translate:0 -50rem}#games #games-container{display:flex;flex-wrap:wrap;flex-direction:row;align-items:flex-start;align-content:flex-start;justify-content:center;padding:20rem;width:100%;height:calc(100% - 150rem);border-radius:50rem;background-color:#00000080;border:2.5rem white solid;overflow:auto;position:relative;z-index:10}#games-top{display:flex;position:relative;align-items:center;height:100rem}.right{position:absolute;right:0;z-index:10}select{font-size:30rem;font-family:font;text-shadow:0 3rem #555,0 0 10rem black,0 3rem 10rem black;position:relative;z-index:11;margin-right:50rem;width:150rem;height:45rem;border-radius:40rem;background-color:#00000080;color:#fff;border:2.5rem solid white;padding:0 10rem;transition:translate calc(var(--switch) * .667) ease}select.hide{translate:0 -25rem}select:nth-child(2){transition:translate calc(var(--switch) * 1.333) ease}input{font-size:30rem;font-family:font;text-shadow:0 3rem #555,0 0 10rem black,0 3rem 10rem black;position:relative;z-index:10;border-radius:40rem;background-color:#00000080;color:#fff;border:2.5rem solid white;padding:0 10rem;margin-left:50rem;width:calc(35% - 80rem);height:45rem;transition:translate var(--switch) ease}input.hide{translate:-100rem 0}.game{width:300rem;height:200rem;margin:5rem;border-radius:20rem;background-size:cover;background-position:center;position:relative;transition:all .3s ease-out;z-index:0;cursor:pointer}.game:hover{scale:1.05;z-index:2;filter:brightness(1.1);box-shadow:0 0 20rem #000}.game-text{position:absolute;width:100%;bottom:0;text-align:center}.game-title,.game-description,.game-title-hide{font-size:30rem;text-align:center;color:#fff;left:50%;translate:-50% 0;width:100%;text-shadow:0 3rem #555,0 0 10rem black,0 3rem 10rem black;transition:opacity .3s ease-out,bottom .3s ease-out}.game-title,.game-title-hide{position:absolute;bottom:10rem}.game-title-hide{opacity:0}.game-description{font-size:20rem;text-shadow:0 2rem #555,0 0 10rem black,0 3rem 10rem black}.game .game-description,.game .game-title-hide{opacity:0}.game:hover .game-description,.game:hover .game-title-hide{opacity:1}.game:hover .game-title,.game:hover .game-title-hide{bottom:100%}.game-clicks{position:absolute;font-size:20rem;color:#fff;left:35rem;top:10rem;text-shadow:0 2rem #555,0 0 6rem black,0 0 6rem black}.game-date{position:absolute;font-size:15rem;color:#fff;right:10rem;top:10rem;text-shadow:0 2rem #555,0 0 6rem black,0 0 6rem black;opacity:0;transition:opacity .3s ease-out}.game:hover .game-date{opacity:1}.game-clicks-icon{position:absolute;width:25rem;height:25rem;left:10rem;top:10rem;image-rendering:pixelated}#info h2{position:relative}#info h2.hide{translate:0 50rem}#info h3{font-size:40rem;line-height:30rem;text-shadow:0 4rem #555,0 0 8rem black,0 4rem 8rem black;width:500rem;transition:translate var(--switch) ease}#info h3:nth-child(1).hide{translate:0 -50rem}#info h3:nth-child(5).hide{translate:50rem 0}#info h4{font-size:18rem;color:#ccc;text-shadow:0 2rem #333,0 0 4rem black,0 2rem 4rem black;transition:translate var(--switch) ease}#info h4.hide{translate:0 50rem}#info h4 span{color:#007eac;text-shadow:0 2rem #002b3a,0 0 4rem black,0 2rem 4rem black}#info p{font-size:30rem;text-shadow:0 3rem #555,0 0 6rem black,0 3rem 6rem black}#info p.hide{translate:-50rem 0}#info p:nth-child(2){transition:translate calc(var(--switch) * .667) ease}#info p:nth-child(3){transition:translate var(--switch) ease}#info p:nth-child(4){transition:translate calc(var(--switch) * 1.333) ease}#info p:nth-child(6){transition:translate calc(var(--switch) * 1.667) ease}#about-me{width:500rem;padding:10rem 10rem 10rem 60rem;height:calc(100% - 150rem);translate:-50rem -25rem;overflow-x:hidden;overflow-y:auto;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 90%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 90%,transparent 100%)}#pf-img{width:500rem;height:500rem;position:absolute;right:0;top:50%;translate:-25% -50%;border-radius:50%;transition:scale var(--switch) ease;scale:1;box-shadow:0 0 30rem #87ceeb}#pf-img.hide{scale:0}#info a img{width:75rem;height:75rem;margin-right:25rem;scale:1;position:relative;z-index:10}#info a img:hover{scale:1.15}#info a img.hide{translate:0 100rem}#links{position:absolute;right:0;top:calc(50% + 275rem);translate:-25% 0;width:500rem;height:100rem;justify-content:center;display:flex;align-items:center}#links a:nth-child(1) img{filter:drop-shadow(0 0 5rem purple) drop-shadow(0 0 10rem purple);transition:scale .25s ease,translate calc(var(--switch) * .667) ease}#links a:nth-child(2) img{filter:drop-shadow(0 0 10rem red);transition:scale .25s ease,translate var(--switch) ease}#links a:nth-child(3) img{filter:drop-shadow(0 0 10rem orange);transition:scale .25s ease,translate calc(var(--switch) * 1.333) ease}#devlogs h2.hide{translate:-100rem 0}#devlogs-path{position:absolute;left:100rem;top:200rem;background:repeating-radial-gradient(circle at center,white 0 4rem,transparent 1rem 16rem);background-size:100% 16rem;width:8rem;height:calc(100% - 200rem);-webkit-mask-image:linear-gradient(to bottom,transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(to bottom,transparent,black 10%,black 90%,transparent)}#devlogs-container{position:absolute;left:120rem;top:200rem;padding-top:100rem;width:calc(100% - 120rem);height:calc(100% - 200rem);-webkit-mask-image:linear-gradient(to bottom,transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(to bottom,transparent,black 10%,black 90%,transparent)}.devlog{position:relative;height:60rem;width:250rem;padding-left:10rem;border-radius:25rem;background-color:#00000080;border:2.5rem rgba(255,255,255,.75) solid;margin-bottom:20rem}.devlog-title{position:absolute;top:20rem;translate:0 -50%;font-size:30rem;text-shadow:0 3rem #555,0 0 6rem black,0 3rem 6rem black;font-family:font}.devlog-date{left:15rem;font-size:20rem;font-family:font;position:absolute;text-shadow:0 2rem #555,0 0 4rem black,0 3rem 4rem black;top:35rem}.devlog-description{display:none}#chat h2.hide{translate:100rem 0}#chat-container{position:absolute;left:0;top:125rem;width:calc(100% - 50rem);height:calc(100% - 300rem);border-radius:50rem;background-color:#00000080;border:2.5rem white solid;padding:25rem;overflow:auto}#chat input{position:absolute;bottom:65rem}#colour{width:50rem;height:50rem;border-radius:50rem;padding:3rem 5rem;left:-50rem}#username{width:calc(30% - 60rem);left:10rem}#username.hide{translate:0 50rem}#message{width:calc(70% - 60rem);right:0}#message.hide{translate:100rem 0}.msg{margin-bottom:10rem;background-color:#32323280;border-radius:20rem;padding:10rem}.msg-user{font-size:30rem;font-family:font;color:#fff}.msg-time{position:relative;left:25rem;font-size:15rem;font-family:font;color:#ccc;text-shadow:0 2rem #555,0 0 4rem black,0 3rem 4rem black;top:-2.5rem}.msg-text{margin-top:0;font-size:25rem;font-family:font;line-height:25rem;margin-bottom:5rem;text-shadow:0 2rem #555,0 0 4rem black,0 3rem 4rem black}#extra h2{transition:translate var(--switch) ease,scale var(--switch) ease}#extra h2.hide{translate:-50% 0;scale:0}#extra-content{position:absolute;left:50%;top:50%;translate:-50% -50%;text-align:center}#extra p,#extra a{font-size:30rem;font-family:font;text-shadow:0 3rem #555,0 0 10rem black,0 3rem 10rem black;transition:translate var(--switch) ease}#extra p.hide,#extra a.hide{translate:0 50rem}#extra p:nth-child(2){transition-delay:calc(var(--switch) / 3 / 3)}#extra a{color:#0096ff;text-shadow:0 3rem rgb(0,40,70),0 0 10rem black,0 3rem 10rem black;display:block;transition-delay:calc(var(--switch) * 2 / 3 / 3)}#extra a:visited{color:#9600ff;text-shadow:0 3rem rgb(40,0,70),0 0 10rem black,0 3rem 10rem black}