body {
    background-color: azure;
    background-image: url(floor.png);
    background-size: 3000px;
    background-repeat: repeat;
    display: flex;
    flex-wrap: wrap; 
    overflow: auto;
    z-index: -1;
}

@keyframes fade {
    from {color: skyblue;}
    to {color: deepskyblue;}
}

.nav {
    position: fixed;
    margin-top: 2vmin;
    margin-left: 2vmin;
    font-size: 200%;
    z-index: 2;
}

body.innercap {
    background-color: black;
    background-image: url(fibers.png);
    background-size: 190vw;
    background-position: top;
    background-repeat: repeat;
    display: flex;
    flex-wrap: nowrap;
}


.corner {
    position: fixed;
/*    filter: opacity(70%) invert(1);*/
    z-index: 1;
    animation: fade 10s linear infinite alternate;
}

@keyframes fade {
    from {filter: opacity(70%) invert(1)};
    to {filter: opacity(70%) invert(0)};
}

#tl {
    top: 0%;
    left: 0%;
    width: 120vw;
    height: 60vh;
}

#tr {
    top: 0%;
    right: 0%;
    transform: rotateY(180deg);
    width: 70vw;
    height: 80vh;
}

#bl {
    bottom: 0%;
    left: 0%;
    transform: rotateX(180deg);
    width: 70vw;
    height: 80vh;
}

#br {
    bottom: 0%;
    right: 0%;
    transform: rotateZ(180deg);
    width: 70vw;
    height: 30vh;
}


a {
    text-decoration: none;
    color: skyblue;
    cursor: pointer;
    z-index: 2;
}

a:hover {
    filter: hue-rotate(90deg) invert(0.7);
}


.spider {
    position: absolute;
    width: 300px;
/*    filter: blur(3px);*/
    z-index: 0;
}

.animal {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 2000px;
    filter: blur(2px) invert(1) ;
}

.nami1 {
    position: absolute;
    width: 200px; 
    top: 1650px; 
    left: 1250px; 
    z-index: 0;
    animation: hovering 3s linear infinite alternate;
}

@keyframes hovering {
    from {transform: translateY(-25px);}
    to {transform: translateY(25px);}
}

.nami2 {
    position: absolute;
    width: 150px;
    top: 450px;
    left: 1500px;
    animation: birth1 2s linear infinite;
}

@keyframes birth1 {
    from {transform: translate(0px, 0px);}
    to {transform: translate(-100px, 100px) scale(3);}
}

.nami3 {
    position: absolute;
    width: 150px;
    top: 430px;
    left: 1500px;
    animation: birth2 1.7s linear infinite;
}

@keyframes birth2 {
    from {transform: translate(0px, 0px);}
    to {transform: translate(60px, 160px) scale(3);}
}



/* Start http://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/holidays/hol-1/hol59.cur), auto !important;} /* End http://www.cursors-4u.com */