* {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

body {
    background: none!important;
    background-color: #111!important;
    margin: 0;
    padding: 0;
    background: #000;
    overflow: hidden;
    overflow-y: auto;
    scroll-behavior: smooth;
    width: 100dvw!important;
    max-width: 100dvw!important;
    height: 100dvh!important;
    max-height: 100dvh!important;
    font: italic normal 100% Georgia, Utopia, 'Palatino Linotype', Palatino, serif;
    color: #afafaf;
    line-height: 1.6;
    font-size: 1.1rem;
    
}
h1, h3 {
    font-family: 'Shadows Into Light',cursive; text-align: center; 
    font-style: normal!important;
}
h3, img, div {
    user-select: none;
}
h1 {
    font: normal normal 60px 'Shadows Into Light', cursive;
    color: #ffffff;
}
h3 {
    font-size: xx-large;
    line-height: 1;
    color: #ffffff;
}
h4 {
    font-size: x-large;
    margin-bottom: 1rem;
}
div {
    text-align: center;
}
div + h3 {
    margin-top: 4rem;
}
img.visual {
    width: 600px;
    max-width: 90%;
    height: auto;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.3);
    margin: 0 auto 2rem;
    z-index:2;
}
#blog {
    min-width: 700px;
    max-width: 700px;
    border-radius: 5px;
    background: #0000003b !important;
    margin: 1.5rem auto;
    padding: 2rem;
    padding-top: 1rem;
    text-shadow: 0 1px 3px #000;
}
svg {
    overflow: visible;
    display: block;
    margin: auto;
    fill-rule: evenodd;
    clip-rule: evenodd;
    stroke-linejoin: round;
    stroke-miterlimit: 1.5;
    position: fixed;
    top: 0;
    left: 30%;
    transform: translate(-60%, -30%) scale(1);
    min-height: 60dvh;
    z-index: -1;
}
clipPath path { fill: none; }
g, path, ellipse, circle {
    transform-box: fill-box;
    transition-timing-function: cubic-bezier(0.68, -0.55, .27, 1.55);
}
#red #blurs ellipse {
    fill: #800000cc!important;
    filter: blur(30px);
}
#red #blurs circle {
    fill: red!important;
    filter: blur(40px);
}
#glows ellipse {
    fill: #ffffff88!important;
    filter: blur(1px);
}
#glows circle {
    fill: #ffffff63!important;
    filter: blur(8px);
}
#red #blurs {
    animation: huerot 30s ease-in-out infinite;
}
@keyframes huerot {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(180deg); }
    100% { filter: hue-rotate(360deg); }
}

.lightbox:not(.showimg) {
    pointer-events: none;
} 
.lightbox { 
    position: fixed; 
    z-index: 9999; 
    left: 0; right: 0; top: 0; bottom: 0; 
    background-color: rgba(0,0,0,.8);
    display: -ms-flex; 
    display: flex; 
    justify-content: center;
    align-items: center; opacity: 0;
    transition: all 300ms ease-in-out;
}
.lightbox.showimg { 
    pointer-events: all!important; 
    opacity: 1!important; 
    transition: all 500ms ease-in-out;
}
.lightbox.showimg .wrapper { 
    max-width: 98%; 
    display: -ms-flex; 
    display: flex; 
    justify-content: center; 
    align-items: flex-end; 
    flex-flow: column;
}
.lightbox:hover, .lightbox #closeMe:hover { cursor: pointer; }
.lightbox #closeMe { color: #FFF; padding: 10px 0 10px 10px; }
.lightbox #closeMe:hover { cursor: pointer; z-index: 2; }
.lightbox #lightimg {
    max-width: 100%; 
    max-height: 95vh; 
    pointer-events: none;
}

links {
    margin: 1rem 2rem;
    position: relative;
    display: block;
}
links a {
    color: #9e9e9e;
    text-decoration: none;
    font-size: small;
    float: right;
    padding: 0 1rem;
}
links a:hover {
    color: white;
}
links a.about:hover {
   color: #00000000!important;
   cursor: none;
   user-select: none;
}



