html {
    background: #181825;
    background-image: radial-gradient(#aaaaaa30 5%, transparent 0), radial-gradient(#aaaaaa15 5%, transparent 0);
    background-position: 0 0, .8rem .8rem;
    background-size: 1.6rem 1.6rem
}

body {
    color: #cdf;
    font-size: 100%;
    font-family: 'Noto Sans Mono', 'roboto mono', 'Courier New', 'Courier', monospace;
    background: initial;
    padding: 0 1rem;
    margin: 0 auto;
    max-width: fit-content
}

article {
    max-width: 64rem;
    background-color: rgba(0, 0, 0, .25);
    box-shadow: 0.2rem 0.2rem 0px 0px rgba(68, 68, 136, 0.5);
    padding: 1rem;
    padding-top: 0;
    border: 1px solid #abd;
    border-radius: 1rem;
    margin: 2rem auto
}

header {
    font-family: 'times new roman', times, serif;
    background: transparent;
    text-align: center;
    padding: 3.5rem 0 1.5rem
}

header a {
    font-size: 340%;
    letter-spacing: .2rem;
    color: #cdf;
    text-align: center;
    text-decoration: none;
    padding: .7rem 1rem
}

header a:hover {
    color: #fff;
}

header a:active {
    color: #fff;
    background: rgba(68, 68, 68, 0.3);
}

nav {
    background: initial;
    text-align: center;
    max-width: fit-content;
    padding-bottom: .5rem;
    margin: 0 auto
}

nav a {
    color: #ec6;
    font-size: 1.0rem;
    text-decoration: none;
    letter-spacing: .1rem;
    display: inline-block;
    border: none;
    /*box-shadow: 0.3rem 0.3rem 0px 0px rgba(68, 68, 68, 0.5);*/
    /*padding: .4rem .3rem .5rem .3rem;*/
    padding: .5rem;
    margin: 0.5rem
}

nav a:hover {
    color: #fff;
    background: #666;
    text-shadow: none;
    text-decoration: none;
    border: none;
    border-radius: 1rem;
    outline: solid #666;
}

nav a:active {
    background: unset;
}

hr {
    border: 1px solid #abd;
    margin: 16px 0px 16px 0px;
}

.smooth-scroll {
    scroll-behavior: smooth
}

.title-bar {
    line-height: 3rem;
    border-bottom: 1px solid #ccddff88;
    padding: 0 1rem;
    margin: 0 auto
}

.center {
    text-align: center;
}

.noborder {
    border: none;
}

.dashed {
    text-decoration-style: dashed;
}

.msg {
    font-family: Courier, 'Courier New', monospace;
    font-size: 100%;
    line-height: 1rem;
    color: #99ffffdd;
    background: #181825cc;
    text-align: left;
    white-space: pre-wrap;
    padding: 1rem;
    border: 1px solid #99ffff11;
    margin: 0 auto;
    max-width: 44ch
}

.cover {
    background: linear-gradient(-135deg, #4DD6DCaa 0%, #915BB7aa 50%, #446DAAaa 100%);
    text-align: left;
    white-space: pre-wrap;
    padding: 2rem;
    border: 2px solid #444;
    border-radius: 1rem;
    max-width: 80ch
}

.description {
    font-size: 80%;
    font-family: 'Times New Roman', Helvetica, Arial, sans-serif;;
    letter-spacing: .1rem;
    text-align: center;
}

.more_btm:link,
.more_btm:visited {
    font-size: .6rem;
    text-decoration: none;
    color: #99bbff;
    /* 220, 40, 100 */
    padding: .6rem;
    border-radius: .5rem;
    outline: 1px solid #99bbff44;
    box-shadow: 2px 2px 0px 0px #99bbff44;
}

.more_btm:hover {
    color: #ddd;
    outline: 1px solid #ffffff44;
    box-shadow: 2px 2px 0px 0px #ffffff44;
}

.more_btm:active {
    color: #fc6;
    /* 40, 60, 100 */
    outline: 1px solid #fc6
        /* 40, 60, 100 */
}

.edit-time {
    background: transparent;
    font-size: 1.0rem;
    line-height: 0;
    display: block;
    text-align: right;
    margin: 0
}

.center-block {
    display: block;
    margin: 1rem auto
}

.center-small-image {
    display: block;
    max-width: 35%;
    width: auto;
    margin: 1rem auto
}

.no_underline {
    text-decoration: none;
}

a:hover.no_hover_underline {
    text-decoration: none;
    text-shadow: 0.0rem 0.0rem 0.6rem #008CFF;
}

.logo {
    color: #008CFF;
    text-shadow: 0.0rem 0.0rem 0.1rem #910EE2ff, 0.0rem 0.0rem 0.25rem #910EE2cc, 0.0rem 0.0rem 0.4rem #910EE299, 0.0rem 0.0rem 0.55rem #910EE266, 0.0rem 0.0rem 0.7rem #910EE233;
}

h1,
h2,
h3,
h4,
h5 {
    color: green;
    /* 355, 37, 92 */
    font-weight: 700;
    font-family: 'roboto mono', monospace;
    text-shadow: 0.0rem 0.0rem 0.2rem #000000DD;
}

h1 {
    letter-spacing: .1rem
}

h2 {
    letter-spacing: .08rem
}

h3 {
    color: #008000dd;
    letter-spacing: .06rem;
    margin-left: 1rem;
}

h4 {
    color: sienna;
    letter-spacing: .04rem;
    margin-left: 1.5rem
}

h5 {
    color: sienna;
    letter-spacing: .02rem;
    margin-left: 2rem
}

p {
    font-family: roboto, helvetica, arial, 'noto sans', sans-serif;
    font-size: 100%;
    line-height: 1.5rem;
    letter-spacing: .02rem;
    margin-left: 2rem
}

a {
    font-size: 1.0rem;
    font-family: 'Courier New';
    color: lightskyblue;
    /* 240, 60, 100 */
    text-decoration: none;
    letter-spacing: initial;
}

p a {
    font-size: 1.0rem;
    letter-spacing: initial;
    text-decoration: none;
}

a:hover,
ul li a:hover,
ol li a:hover {
    text-shadow: 0.0rem 0.0rem 0.1rem #66f, 0.0rem 0.0rem 0.25rem #66f, 0.0rem 0.0rem 0.4rem #66f;
    text-decoration: underline
}

a:active,
p a:active,
li a:active a:active,
ul li a:active,
ol li a:active {
    background: rgba(68, 68, 68, 0.3)
}

table {
    border-collapse: collapse;
    margin-left: 2rem;
    display: block;
    overflow-x: auto
}

table th,
table td {
    padding: .3rem .8rem;
    border: 1px solid #ddd
}

table td {
    color: #EFEF8F;
}

caption {
    padding: .5rem;
    border: 1px solid #ddd;
    caption-side: top
}

ul,
ol {
    font-family: roboto, helvetica, arial, 'noto sans', sans-serif;
    font-size: 100%;
    line-height: 1.7rem;
    letter-spacing: .02rem;
    margin-left: 2rem
}

code {
    color: #80FF80CC;
    background: #00000099;
    font-family: 'roboto mono', 'droid sans mono', 'dejavu sans mono', 'liberation mono', monospace;
    font-size: 1.0rem;
    display: inline;
    overflow-x: auto;
}

p code {
    display: inline;
    padding: .2rem;
    border: 0.8px dashed #0eb7fa;
    border-radius: .3rem
}

pre code {
    display: block;
    padding: 1rem;
    border: 1px dashed #9ef;
    /* 190, 40, 100 */
    border-radius: .3rem;
    margin: 0 1.5rem
}

blockquote {
    color: #e86;
    font-style: italic;
    padding-left: 1.7rem;
    border-left: .25rem solid #ea0;
    margin: 1rem 0
}

figure {
    border: 3px solid #334;
    border-radius: 12px;
    display: flex;
    flex-flow: column;
    padding: 5px;
    max-width: 220px;
    margin: 1rem auto
}

figcaption {
    background-color: #222;
    color: #ddd;
    font: italic smaller sans-serif;
    padding: 3px;
    border-radius: 9px;
    text-align: center
}

figure img {
    display: block;
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
    height: auto;
    width: auto;
    user-select: none
}

footer {
    /* 51, 19, 44 */
    font-size: 1.0rem;
    text-align: center;
    font-style: italic;
    padding: 0;
    margin: 0
}

time {
    font-family: 'times new roman', times, serif
}

img {
    max-width: 100%;
    height: auto;
    border-radius: .25rem
}

dl {
    margin-left: 2rem
}

a.HoverInfo:hover::after {
    content: "\2197";
}

p>a.HoverLink {
    display: none;
}

p:hover>a.HoverLink {
    display: inline;
    text-decoration: none
}