@font-face {
  font-family: nimora;
  src: url(https://dl.dropbox.com/s/oxbm39pk3jf2lke/Nimora.ttf);
}
@font-face {
  font-family: pinkypromise;
  src: url(https://dl.dropbox.com/scl/fi/11o8c9dnzldwx96zrdrhp/Pinky-Promise.ttf?rlkey=dcdf5ntwu9o2xxd885vuwlvir&st=tk8gimnf);
}
/* Small Grey Outline Pointer - https://www.cursors-4u.com/cursor/small-grey-outline-pointer */
* {
  cursor: url('https://cdn.cursors-4u.net/previews/small-grey-outline-pointer-6a97f823-32.webp') 32 32, auto !important;
}
/* End www.Cursors-4U.com Code */
::selection {
background: #666b9f90;
color: #FFFFFF;
}
html {
    background: #b3c1d0;
    padding: 6em 0;
}
body {
    width: 50%;
    margin: 0 auto;
}
a {
    color: #666b9f;
    text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff, 0 0;
    text-decoration: none;
    transition: 1s;
    cursor: help;
}
a:hover,a:focus {
    color: #fff;
    text-shadow: -1px 0 #666b9f, 0 1px #666b9f, 1px 0 #666b9f, 0 -1px #666b9f, 0 0;
}
h1 {
    margin: 0;
    font-family: nimora;
    font-size: 6em;
    color: #666b9f;
    filter: drop-shadow(0px 1px #fff) drop-shadow(0 -1px #fff) drop-shadow(1px 0 #fff) drop-shadow(-1px 0 #fff);
    position: relative;
    bottom: -.3em;
}
h2 {
    font-size: 1em;
    margin: .3em 0;
    padding: .3em;
    font-family: pinkypromise;
    color: #fff;
    background: #666b9f;
}
h3 {
    font-family: pinkypromise;
    color: #fff;
    text-shadow: -1px 0 #666b9f, 0 1px #666b9f, 1px 0 #666b9f, 0 -1px #666b9f, 0 0;
    font-size: .8em;
    margin: .3em;
}
h4 {
    font-family: pinkypromise;
    color: #666b9f;
    font-size: .7em;
    margin: .3em;
}
.subtitle {
    margin: 0;
    font-family: pinkypromise;
    font-size: .8em;
    color: #fff;
    text-shadow: -1px 0 #666b9f, 0 1px #666b9f, 1px 0 #666b9f, 0 -1px #666b9f, 0 0;
}
p {
    font-family: arial;
    font-size: 1em;
    color: #555;
    margin: .5em 0;
}
main {
    border: 4px double #666b9f;
    border-radius: 5px;
    background: #fff;
    height: 50vh;
    padding: .5em;
    overflow: auto;
}
p > img {
    position: relative;
    bottom: -.3em;
}
textarea {
    padding: .3em;
    background:#fff;
    border:1px solid #666b9f;
    font-family: arial;
    font-size: 1em;
    color: #555;
    margin: .5em 0;
}
hr {
    border: 1px dashed #666b9f;
}
#bottom {
    float: right;
}
#hide {
    width: 35%;
    z-index: -1;
    position: fixed;
    right: -3rem;
    top: -2.5rem;
}
#hide2 {
    width: 35%;
    z-index: -1;
    position: fixed;
    left: 2rem;
    bottom: -5rem;
    transform: rotate(25deg);
}
@media (max-width: 800px) {
    html { padding: 10em 0; }
    body { margin: 0 auto; width: 70%; }
    h1 { font-size: 3em; bottom: -.2em; }
    #subtitle { font-size: .6em }
    main { font-size: .8em; }
    #hide { margin: 0 auto; width: 80%; position: fixed; left: 7em; }
    #hide2 { display: none; }
}