*{color: gray; overflow: hidden;}
#root{
    overflow-y: auto;
    scrollbar-width: 0px;
    scroll-behavior: smooth;
}

.navigation{
    top: 0px;
    transform-origin: 0 0;
}

.navigation:hover{
    opacity: 100%;
}

.navigation-item{
    font-size: 2rem;
    text-decoration: none;
    color: #727272;
    user-select: none;
    position: sticky;
}

.navigation-item:hover{
    color: #ffffff;
    scale: 1.1;
    rotate: 3deg;
}

#cat{
    animation-name: cat;
    animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.177, 0.888, 0.33, 1.488);
    height: 300px;
    width: 300px;
}

@keyframes cat {
    0%{rotate: 0deg;}
    50%{rotate: 180deg;}
    100%{rotate: 360deg;}
}

/* .card:hover{
    rotate: -5deg;
} */