style.css

@import url(https://unpkg.com/modern-css-reset);@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/fontawesome.min.css);@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/regular.min.css);@import url(https://unpkg.com/simple-line-icons);@media all{:root{--color-primary-tint-1:#212121;--color-primary-tint-2:#292929;--color-primary-tint-3:#646464;--color-secondary-tint-1:#e7e7e7;--color-secondary-tint-2:#dedede;--color-secondary-tint-3:#b9b9b9;--color-highlight:#000;--color-textshadow:#c7c7c7}@media (prefers-color-scheme:dark){:root{--color-primary-tint-1:#d0d0d0;--color-primary-tint-2:#c7c7c7;--color-primary-tint-3:#a2a2a2;--color-secondary-tint-1:#212121;--color-secondary-tint-2:#292929;--color-secondary-tint-3:#535353;--color-highlight:#fff;--color-textshadow:#000}}}@media all{*{color:var(--color-primary-tint-1);font-family:"Roboto Condensed",sans-serif;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}html{box-sizing:border-box;scroll-behavior:smooth}body{display:flex;flex-direction:column;padding:2.5%;background-color:var(--color-secondary-tint-1)}p{text-align:justify;text-justify:inter-word}a{text-decoration:none}span{color:var(--color-primary-tint-3)}:focus{outline-color:var(--color-primary-tint-3)}@media (min-width:50em){body{font-size:2.25vw}}@media (min-width:75em){body{font-size:1.5vw}}}@media all{body>footer,body>header{text-align:center}body>header,body>main,body>nav{display:flex;flex-flow:column}body>footer,body>header,body>main{max-width:90%;margin:0 auto;padding:.375em 0}@media (min-width:50em){body>footer,body>header,body>main{width:70%}}@media (min-width:70em){body>footer,body>header,body>main{width:55vw}}}@media all{nav *{justify-content:space-around;color:var(--color-primary-tint-3)}@media (min-width:50em){nav>*{justify-content:space-between}}}@media all{body>header{align-items:center;flex-flow:row wrap;justify-content:space-between;text-shadow:3px 3px 1px var(--color-textshadow);-moz-column-gap:5vw;column-gap:5vw;transition:all .4s ease-in-out}body>header.sticky{position:-webkit-sticky;position:sticky;z-index:9999;top:0;padding-top:1.5%;overflow-y:hidden;background:var(--color-secondary-tint-1);border-bottom:.075em solid var(--color-primary-tint-1)}@media (min-width:50em){body>header>:first-child{flex-grow:2;padding-right:5em}body>header>:last-child{flex-grow:5}}@media (max-width:50em){body>header{width:100%;flex-flow:column nowrap;justify-content:space-around}body>header>label{font-size:1.25em;margin-bottom:3vh}body>header>:last-child{width:100%}}}@media all{main{flex:1 0 auto}main,main section{display:flex;flex-flow:column nowrap;gap:2.5vh 1vw}}@media all{body>footer{display:flex;flex-flow:row nowrap;align-items:stretch;justify-content:center;flex-shrink:0;margin:0 auto;padding:1em 0}body>footer>*{margin:0 .75em}body>footer section{display:flex;justify-content:space-between}body>footer section:first-child{flex-flow:column}body>footer a{display:inline-block}body>footer em{color:var(--color-primary-tint-3)}}@media all{ul.horizontal{display:flex;padding:0;margin:0;list-style:none}ul.horizontal label>*{display:flex;flex-flow:column wrap;align-items:center}ul.horizontal.dispersed{justify-content:space-between}}@media all{input.paged[type=radio],input.paged[type=radio]+section{display:none}input.paged[type=radio]:checked+section{display:flex}label.paged{cursor:pointer}li.paged.selected *{color:var(--color-highlight)}li.paged.selected span{font-weight:600}}@media all{.undisplayed{display:none}.transparent{transition:.75s ease;opacity:0}}@media all{.icons{font-size:2em}}@media all{.spinner{min-width:3em;min-height:3em}.spinner:after{content:" ";display:block;width:3.5vw;height:3.5vw;min-width:2em;min-height:2em;margin:0 auto;border-radius:50%;border:.1vw solid var(--color-primary-tint-1);border-color:var(--color-primary-tint-1) transparent var(--color-primary-tint-1) transparent;-webkit-animation:spinner .65s linear infinite;animation:spinner .65s linear infinite}@-webkit-keyframes spinner{to{transform:rotate(360deg)}}@keyframes spinner{to{transform:rotate(360deg)}}}@media all{#articles article{padding:.5em 1em;overflow:hidden;background-color:var(--color-secondary-tint-2);border-radius:.5em;transition:all .3s ease-in-out}#articles header{display:flex;justify-content:space-between;align-items:center}#articles header em{font-size:1em;transition:all .25s ease-in-out}#articles .horizontal{justify-content:center;flex-flow:row wrap;gap:3vh 5vw}#articles .horizontal *{font-size:1.25em;line-height:.5em;font-weight:700}#articles section{font-family:Futura,serif;height:0;opacity:0}#articles footer{text-align:right}#articles footer span{font-style:italic;font-size:75%}#articles footer time{font-weight:bolder}#articles input.paged[type=radio]:checked+label section,#articles input.paged[type=radio]:checked+section{height:auto;opacity:1;transform:none}#articles input.paged[type=radio]:checked+label em{transform:rotate(90deg)}@media (min-width:50em){#articles article:hover{transform:scale(1.02)}}}@media all{#to-top{display:flex;justify-content:center;align-items:center;position:fixed;right:5.5vw;bottom:5vh;width:6em;height:6em;border-radius:50%;font-size:.5em;text-align:center;background-color:var(--color-secondary-tint-1)}#to-top,#to-top *{transition:all .3s ease-in}#to-top em{font-weight:bolder}#to-top,#to-top:hover{border:.125em solid var(--color-primary-tint-3)}@media (max-width:30em){#to-top:active{background-color:var(--color-primary-tint-1);border-color:var(--color-primary-tint-1)}#to-top:active em{color:var(--color-secondary-tint-1)}}@media (min-width:30em){#to-top{right:15.5vw;bottom:5vh}}@media (min-width:50em){#to-top{right:21.5vw;bottom:5vh}#to-top:hover{background-color:var(--color-primary-tint-1);border-color:var(--color-primary-tint-1)}#to-top:hover em{color:var(--color-secondary-tint-1)}}@media (min-width:70em){#to-top{width:6em;height:6em;right:27.5vw;bottom:10vh}}}@media all{#qr canvas{width:100%;height:auto}@media (min-width:50em){#qr{height:calc(10.5%);width:calc(10.5vw)}}@media (min-width:70em){#qr{max-height:calc(8%);max-width:calc(8vw)}}}