awilix code

body {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    background: #D970CA;
    background: -moz-linear-gradient(top, #D970CA 0%, #7871AA 70%, #4E5283 100%);
    background: -webkit-linear-gradient(top, #D970CA 0%, #7871AA 70%, #4E5283 100%);
    background: linear-gradient(to bottom, #D970CA 0%, #7871AA 70%, #4E5283 100%);
    background-size: 10vw ;
    background-position: center;
    background-repeat: repeat;
    overflow: hidden;
    cursor: url(https://i.imgur.com/2inIpFX.png), default;
}

   ::-webkit-scrollbar {
        width: 0px;
        height: 0px;
        background:#000;
        }

::-webkit-scrollbar-thumb {
        background-color:#9fbfcc;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        }

u {
    text-decoration: none;
    line-height: 1.1vw;
    border-bottom: .1vw dotted #E4FDE1;

}

a {color: #D9BBF9;
          text-decoration: none;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        }

        a:hover {color: #000;
        text-decoration: bold;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        }

span {color: #D9BBF9;
          text-decoration: none;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        }

        span:hover {color: #000;
        text-decoration: bold;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        }

.topborder {
    filter: brightness(120%) saturate(100%) contrast(70%) blur(.6vw);
    position: absolute;
    border-top: .15vw solid #E4FDE1;
    border-bottom: .15vw solid #E4FDE1;
    width: 36vw;
    top: 4.4vw;
    left: 27vw;
    height: .3vw;
    opacity: 1;
    background-color: #E4FDE1;
    background-size: 5vw;
    color: #000;
    font-family: 'lato', sans-serif;
    font-size: .8vw;
    overflow: hidden;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: .82vw;
    z-index: 54;
}

.bottomborder {
    filter: brightness(120%) saturate(100%) contrast(70%) blur(.6vw);
    position: absolute;
    border-top: .15vw solid #E4FDE1;
    border-bottom: .15vw solid #E4FDE1;
    width: 35.5vw;
    top: 39.4vw;
    left: 27vw;
    height: .3vw;
    opacity: 1;
    background-color: #E4FDE1;
    background-size: 5vw;
    color: #000;
    font-family: 'lato', sans-serif;
    font-size: .8vw;
    overflow: hidden;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: .82vw;
    z-index: 54;
}
.leftborder {
    filter: brightness(120%) saturate(100%) contrast(70%) blur(.6vw);
    position: absolute;
    border-left: .15vw solid #C56CE1;
    border-right: .15vw solid #C56CE1;
    width: .3vw;
    top: 4.5vw;
    left: 27vw;
    height: 35vw;
    opacity: 1;
    background-color: #E4FDE1;
    background-size: 5vw;
    color: #000;
    font-family: 'lato', sans-serif;
    font-size: .8vw;
    overflow: hidden;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: .82vw;
    z-index: 54;
}


.rightborder {
    filter: brightness(120%) saturate(100%) contrast(70%) blur(.6vw);
    position: absolute;
    border-left: .15vw solid #E4FDE1;
    border-right: .15vw solid #E4FDE1;
    width: .3vw;
    top: 4.5vw;
    left: 62.1vw;
    height: 35vw;
    opacity: 1;
    background-color: #E4FDE1;
    background-size: 5vw;
    color: #000;
    font-family: 'lato', sans-serif;
    font-size: .8vw;
    overflow: hidden;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: .82vw;
    z-index: 54;
}

.namebox1 {
    transition: .9s ease-out;
    position: absolute;
    border: .vw solid #fff;
    width: 60vw;
    top: 1vw;
    left: 13.7vw;
    height: 2vw;
    background: #E4FDE1;
    background: -moz-linear-gradient(top, #E4FDE1 0%, #E4FDE1 50%, #4E5283 100%);
    background: -webkit-linear-gradient(top, #E4FDE1 0%, #E4FDE1 50%, #4E5283 100%);
    background: linear-gradient(to bottom, #E4FDE1 0%, #E4FDE1 50%, #4E5283 100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-stroke-width: .05vw;
    -webkit-text-stroke-color: #4E5283;
    opacity: 1;
    color: #fff;
    font-family: 'Cinzel', serif;
    font-size: 4.5vw;
    overflow: hidden;
    text-align: center;
    line-height: 1vw;
    z-index: 54;
    padding: 2.5vw 1vw 1vw 1vw
    }

.namebox2 {
    transition: .9s ease-out;
    position: absolute;
    border-left: .vw solid #000;
    border-right: .vw solid #000;
    width: 5vw;
    top: 3vw;
    left: 45.05vw;
    height: 8.2vw;
    opacity: 1;
    background-color: #transparent;
    background-size: 5vw;
    color: #000;
    font-family: 'Raleway', sans-serif;
    font-size: .9vw;
    overflow: auto;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: 1vw;
    letter-spacing: .1vw;
    z-index: 64;
}

.statbox1 {
    transition: .9s ease-out;
    position: absolute;
    border-left: .1vw solid #000;
    border-right: .1vw solid #000;
    width: 15vw;
    top: 29vw;
    left: 46vw;
    height: 8vw;
    opacity: 1;
    background-color: #transparent;
    background-size: 5vw;
    color: #D970CA;
    font-family: 'Raleway', sans-serif;
    font-size: .8vw;
    overflow: auto;
    text-align: center;
    padding: 1vw .1vw .1vw .1vw;
    line-height: 1vw;
    letter-spacing: .1vw;
    z-index: 54;
}

body:hover .statbox1 {
    opacity: 0;
    transition: .5s ease-in;
    transition-delay: 2s;
    transition-timing-function: ease-in;
}

.statbox2 {
    transition: .9s ease-out;
    position: absolute;
    border-left: .1vw solid #000;
    border-right: .1vw solid #000;
    width: 15vw;
    top: 29vw;
    left: 46vw;
    height: 8.5vw;
    opacity: 0;
    background-color: #transparent;
    background-size: 5vw;
    color: #D970CA;
    font-family: 'Raleway', sans-serif;
    font-size: .8vw;
    overflow: auto;
    text-align: center;
    padding: .5vw .1vw .1vw .1vw;
    line-height: 1.2vw;
    letter-spacing: .1vw;
    z-index: 55;
}

body:hover .statbox2 {
    opacity: 1;
    transition: .5s ease-in;
    transition-delay: 2s;
    transition-timing-function: ease-in;
}

.backbox1 {
    transition: .9s ease-out;
    position: absolute;
    border-left: .vw solid #000;
    border-right: .vw solid #000;
    width: 15.2vw;
    top: 29vw;
    left: 46vw;
    height: 8.9vw;
    opacity: .2;
    background-color: #000;
    background-size: 1vw;
    color: #D970CA;
    font-family: 'Raleway', sans-serif;
    font-size: 1vw;
    overflow: auto;
    text-align: center;
    padding: .1vw .1vw .1vw .1vw;
    line-height: 1vw;
    letter-spacing: .1vw;
    z-index: 22;
}

.backbox2 {
    transition: .9s ease-out;
    position: absolute;
    border-left: .vw solid #000;
    border-right: .vw solid #000;
    width: 35.8vw;
    top: 41vw;
    left: 26.95vw;
    height: 1.5vw;
    opacity: .2;
    background-color: #000;
    background-size: 1vw;
    color: #D970CA;
    font-family: 'Raleway', sans-serif;
    font-size: 1vw;
    overflow: auto;
    text-align: center;
    padding: .7vw .1vw .1vw .1vw;
    line-height: 1vw;
    letter-spacing: .1vw;
    z-index: 22;
}

.image1 {
    transition: 1.5s ease-out;
    filter: brightness(120%) saturate(100%) contrast(70%) blur(0vw);
    background-image: url(https://i.pinimg.com/originals/07/d9/02/07d9024d34209d5e9be5c4be2a260bde.gif);
    background-size: 35vw;
    position:absolute;
    top: 5vw;
    left: 28vw;
    width: 34vw;
    height: 34.4vw;
    opacity: 1;
    border: .vw solid #000;
    border-top: .vw solid #000;
    border-left: vw solid #000;
    border-right: .vw solid #000;
    outline: vw solid #000;
    outline-offset: vw;
    -webkit-box-shadow: 5px 5px 30px 34px rgba(228,253,225,0.17);
    box-shadow: 5px 5px 30px 34px rgba(228,253,225,0.17);
    background-repeat: no-repeat;
    background-position: bottom;
    z-index: -3;


}



<link href="https://fonts.googleapis.com/css?family=Cinzel|Lato|Raleway&display=swap" rel="stylesheet">
<div class="image1"></div>
<div class="topborder"></div>
<div class="leftborder"></div>
<div class="rightborder"></div>
<div class="bottomborder"></div>
<div class="namebox1">Goddess Moon</div>
<div class="namebox2"><i>of<br>the</i></div>
<div class="statbox1"><i>"Pale white shines the light from her sentinel high above Earth. She watches, the eye that pierces shadow, and listens with the ears of birds and beasts that use the darkness to hunt and revel."</div>
<div class="statbox2"><font style ="float:left"><u></i>Name<i></u></font><font style ="float:right">Awilix</font><br>
<font style ="float:left"><u></i>Designation<i></u></font><font style ="float:right"><span title="Queen of the Night.
Patron of Xibalba + that one game you see them playing in the Road to El Dorado.
Escorts the deceased over the Milky Way to the Spirit World.">Moon Deity</span></font><br>
<font style ="float:left"><u></i>Age</u><i></font><font style ="float:right">Old as the night</font><br>
<font style ="float:left"><u></i>Pantheon<i></u></font><font style ="float:right">Mayan</font><br>
<font style ="float:left"><u></i>Totem Animal<i></u></font><font style ="float:right"><span title="Often goes hunting with her favorite feline companion, Suku.
She also holds sway over eagles, and uses them to communicate.
Finds cellphones to be 'too futuristic' for her taste.">Jaguar</font><br>
<font style ="float:left"><u></i>Weapon<i></u></font><font style ="float:right">Shadowlit Spear</font><br>
<font style ="float:left"><u></i>Appearance<i></u></font><font style ="float:right"><a target="_blank" href="https://cdn.discordapp.com/attachments/580312013889339393/689663410392399933/d926dbb0691eecb1518a54124e034d57.png"><span title="Her hair color waxes and wanes with the light of the moon.
When it is full, strands give off a silver hue.
When no moonlight shines, tresses mirror the blackest of nights.">Click Here.</span></a></font></div>
<div class="backbox1"></div>
<div class="backbox2"><center>wip • shitpost-novella • often tabbed • dm friendly </div>