@charset "UTF-8";

    
    /* BASE STRUCTURE */



    li, dd, td {
        font-size: 1.6rem;
    }

    dt, figcaption {
        font-size: 1.8rem;
    }

    #devlog a:hover, todo a:hover {
        text-decoration: underline;
    }

/* TABLE */

/* ANIMATIONS */

    .floaty {
        -webkit-animation: mover 5s -1s infinite alternate;
        animation: mover 5s -1s infinite alternate;
        animation-timing-function: ease-in-out;
        
        -webkit-filter: drop-shadow(2px 5px 2px #00000057);
        filter: drop-shadow(2px 5px 2px #00000057);
    }

    @-webkit-keyframes mover {
        0% { transform: translateY(-30px); }
        100% { transform: translateY(-10px); }
    }

    @keyframes mover {
        0% { transform: translateY(-30px); }
        100% { transform: translateY(-10px); }
    }

    
    .scroll-parent {
        position: relative;
        width: 100%;
        height: auto;
        padding: 1rem;
        overflow-x: hidden;
    }

    .scroll-element {
        width: inherit;
        height: inherit;
        position: absolute;
        gap: 12px;
        left: 0%;
        top: 0%;
        display: flex;
        align-items: left;
        justify-content: space-around;
        animation: scroll-element 16s linear infinite;
    }

    .scroll-element a img {
        max-width: 88px
    }

    @keyframes scroll-element {
        from {
            left: 120%;
        }

        to {
            left: -500%;
        }
    }

    .scroll-element:hover,
    .scroll-element:hover {
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }

    .scroll-parent:hover>.scroll-element:not(:hover) {
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }
    .scroll-parent {
        position: relative;
        width: 100%;
        height: auto;
        padding: 1rem;
        overflow-x: hidden;
    }

    .scroll-element {
        width: inherit;
        height: inherit;
        position: absolute;
        gap: 12px;
        left: 0%;
        top: 0%;
        display: flex;
        align-items: left;
        justify-content: space-around;
        animation: scroll-element 16s linear infinite;
    }

    .scroll-element a img {
        max-width: 88px
    }

    @keyframes scroll-element {
        from {
            left: 120%;
        }

        to {
            left: -500%;
        }
    }

    .scroll-element:hover,
    .scroll-element:hover {
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }

    .scroll-parent:hover>.scroll-element:not(:hover) {
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        animation-play-state: paused;
    }



@media screen and (max-width: 500px) {

    @-webkit-keyframes mover {
        0% { transform: translateY(-10px); }
        100% { transform: translateY(10px); }
    }

    @keyframes mover {
        0% { transform: translateY(-10px); }
        100% { transform: translateY(10px); }
    }
    
}