div.menu{
    position: fixed;
    top:20hv;
}
.headerbox {
    position:absolute;
    left: 5vw;
}
.headerimage img{
    width: 95%;
}
div .header {
    display:block;
    top:10px;
    margin-left:10px;
    width: 90vw;
    background-image: url("images/clouds.gif");
    background-size: cover;
    height: 20vh;
    border-radius: 25px;
    align-items: left;
    border:5px solid;
    border-color:rgba(110, 18, 0, 0.541);
    box-shadow: 5px 5px rgba(0, 0, 0, 0.348);
}
.container{
    width:100%;
    height:100%;
    background-color:rgba(50, 160, 147, 0.81);
}
div .knife{
    position:absolute;
    top: 0px;
    animation: mymove 1s;
}
@keyframes mymove {
    from {top:-80000px}
    to {top: 20px}
}
div .knifeimage {
    position:absolute;
    width:20vw;
    top: 4vh;
    left: -70px;
}
div .landing{
    position: absolute;
    left: -70px;
    top: 346px;
    width: 20vw;
    animation: movetwo 1s;
}
@keyframes movetwo {
    from {left: -800px}
    to {left: -1000px}
}
div .showlist{
    position:relative;
    left: 17vw;
    margin-top: 15px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 1em;
    max-width:75vw;
    background-color: rgba(131, 255, 179, 0.33);
    border: 1px solid rgb(37, 22, 255);
    color:rgb(0, 0, 0);
    text-shadow: 1px 1px rgba(36, 189, 197, 0.699);
}
ul {
    list-style-image: url(images/drip.png);
}
img .header{
    max-width: 75%;
}
/*another note to self to at some point add a bunch of sticky images that block up the page and hide the content. fun. also, an animation of blood dripping down the side of the screen?? slowly...*/
.ghostA {
    
    position:absolute;
    top:-600px;
    animation: ghostfloat 12s;
}
.ghostB {
    position:absolute;
    top:-600px;
    animation: ghostfloat 10s;
}
.ghostC {
    position:absolute;
    top: -600px;
    animation: ghostfloat 4s;
}
@keyframes ghostfloat {
    from {top: 4000px; right: 1000px}
    to {top: -500px; right: 100px}
}
.ghostA img, .ghostB img, .ghostC img{
    opacity:50%;
}
h1 {
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: rgb(192, 0, 77);
    text-shadow: 0px 2px rgb(15, 16, 21);
}
.blood{
    display: block;
    position:sticky;
    bottom:0px;
    height:50px;
}
.blooddrip{
    display: inline-block;
    position:sticky;
    bottom: 50px;
    left: 30px;
}
.blooddrip img{
    position:relative;
    bottom:0px;
    width: 115px;
}
.blood img{
    position:relative;
    top: -36px;
    width:100%;
    height:170%;
}