body{margin:0;background-image:url(/assets/bg-BTeosBLC.jpg);background-size:cover;height:100vh;background-repeat:no-repeat;overflow:hidden}*{font-family:Tahoma,sans-serif!important;box-sizing:border-box}.draggable-handle{position:absolute}iframe{position:absolute;z-index:1}.title-bar-text span{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:80%}.window{resize:both;overflow:auto;position:absolute;top:20px;left:20px;width:360px}.window .title-bar-text{display:flex;align-items:center;gap:20px}.window .title-bar-text img{width:20px}.windows{position:relative;max-width:850px;height:100%;margin-inline:auto}.windows .window:not(#player){max-width:380px}#about{height:330px}#me{left:390px;height:550px}@media screen and (max-width: 900px){.windows{overflow-y:auto;padding-bottom:50px;padding-inline:10px;display:flex;flex-direction:column;align-items:center;height:90%}.windows .row{width:fit-content;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}.windows .col{min-width:250px;width:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.windows .col .window{width:100%}.windows .middle .window{height:50%}.windows .window:not(#player){position:static;height:unset!important;overflow:visible;max-width:unset;z-index:0}.windows .window:not(#player)#webrings{grid-area:n}.windows .window:not(#player)#blinkies{grid-area:b}.windows .window:not(#player)#music{grid-area:m}.windows .window:not(#player)#about{grid-area:a}.windows .window:not(#player)#me{grid-area:w}nav{margin-top:10px}}@media screen and (max-width: 800px){.windows .col{width:45%}}@media screen and (max-width: 550px){.windows .small{flex-direction:row;flex-wrap:wrap}.windows .col{width:100%}}@media screen and (max-width: 400px){.windows .window{max-width:300px!important;left:calc(50% - 150px)!important}.windows .window .title-bar-controls [aria-label=Minimize],.windows .window .title-bar-controls [aria-label=Restore]{display:none}.windows #about{height:220px}.windows #me{top:250px}}nav#start{position:fixed;bottom:0;height:35px;width:100%;background:linear-gradient(180deg,#0997ff,#0053ee 8%,#0050ee 40%,#06f 88% 93%,#005bff 95%,#003dd7 96%,#003dd7);display:flex}nav#start .start{height:100%}nav#start button#start{position:relative;font-size:14pt;z-index:1;height:100%;border-top-right-radius:10% 50%;border-bottom-right-radius:10% 50%;background-color:#7bd08a;color:#fff;font-style:italic;text-shadow:1px 1px #000;display:flex;align-items:center;padding-inline-end:30px}nav#start button#start span,nav#start button#start img{position:relative;z-index:1}nav#start button#start img{height:20px;margin-inline-end:5px}nav#start button#start .overlay{width:100%;height:100%;position:absolute;top:0;left:0;border-top-right-radius:inherit;border-bottom-right-radius:inherit;background:linear-gradient(to bottom,#7bd08a,#0000 15%),linear-gradient(to top,#7bd08a,#0000 15%)}nav#start button#start:before,nav#start button#start:after{content:"";width:100%;height:100%;position:absolute;top:0;left:0;border-top-right-radius:inherit;border-bottom-right-radius:inherit}nav#start button#start:before{z-index:0;background-color:#37b851}nav#start button#start:after{background:linear-gradient(90deg,rgb(29,130,28) 0%,transparent 20%,transparent 80%,rgb(29,130,28) 100%)}nav#start .tabs{padding-inline-start:20px;display:flex;gap:2px;padding-block:3px;text-shadow:1px 1px #000;color:#fff}nav#start .tabs .tab{background:linear-gradient(to bottom,#5291e9,#176fea 15% 85%,#5291e9);height:100%;flex:1 0 150px;border-radius:5px;display:flex;align-items:center;padding-inline:20px}nav#start .tabs .tab img{width:20px;margin-inline-end:5px}.sticker{width:200px}.sticker img{width:100%}#sticker-beetlejuice{left:26%;top:17.5%;display:block}#sticker-angela{display:block;left:37%;top:48.5%}.sticker{display:none}@media screen and (max-width: 900px){.sticker{display:none!important}}@media screen and (max-width: 600px){#sticker-beetlejuice{left:15%;top:44%}}@media screen and (max-width: 400px){#sticker-beetlejuice{left:4%;top:49%}#sticker-dean{left:51%;top:53%}}#music{left:460px;top:215px}#music li[data-link]{cursor:pointer}@media screen and (max-width: 1190px){#music{z-index:3;left:50%;top:35%}}@media screen and (max-width: 900px){#music{left:calc(50% - 180px);top:700px}}@media screen and (max-width: 400px){#music{top:720px}}#player{top:calc(50% - 180px);left:calc(50% - 290px);width:580px;height:360px;z-index:10}#blinkies{left:-10%;top:30%;z-index:2;width:250px}#blinkies .window-body{display:flex;flex-direction:column;gap:5px;align-items:center}#blinkies img{max-width:200px}@media screen and (max-width: 1100px){#blinkies{left:10%;top:30%}}#webrings{width:245px;left:90%}#webrings .window-body{display:flex;flex-direction:column;align-items:center}#webrings .webring{margin-top:10px}#webrings .retro .commands{display:flex;justify-content:space-between}#webrings .retro img{width:150px;display:block}@media screen and (max-width: 1190px){#webrings{left:10%;top:51%}}.window.image img{max-width:100%}#blog{left:-1%;top:50%}@media screen and (max-width: 1190px){#blog{z-index:3;left:50%;top:20%}}body:has(.blog-post){position:static;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;height:unset;overflow:auto;padding-block:50px;min-height:100vh}body:has(.blog-post) .blog-post{position:static;max-width:700px;width:60%}body:has(.blog-post) .blog-post .window-body img{max-width:50%;margin:10px;shape-margin:30px}body:has(.blog-post) .blog-post .window-body img:nth-of-type(odd){float:right}body:has(.blog-post) .blog-post .window-body img:nth-of-type(2n){float:left}body:has(.blog-post) .blog-post .window-body button{background:#0000ff4d;min-width:unset;display:flex;align-items:center;gap:10px}body:has(.blog-post) .blog-post .window-body button img{margin:0;width:15px}body:has(.blog-post) .blog-post .window-body button:disabled img{opacity:.5}body:has(.blog-post) .blog-post .title-bar{position:sticky;top:0}body:has(.blog-post) .blog-post header img{width:100%;aspect-ratio:16/9;max-width:unset!important;object-fit:cover;float:unset!important;margin:0!important}body:has(.blog-post) .blog-post h1{font-size:20pt}body:has(.blog-post) .blog-post .date{text-align:end}body:has(.blog-post) .blog-post .categories .tags{margin-inline-start:5px;font-style:italic;display:inline-flex;gap:5px}body:has(.blog-post) .blog-post .categories .tags .tag:not(:last-child):after{content:","}@media screen and (max-width: 700px){body:has(.blog-post) .blog-post{width:80%}}