html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

.tulisan {
    word-spacing: -0.05em;
    hyphens: auto;
    text-align-last: left;
}

#menu li {
    position: relative;
}

#menu li a {
    position: relative;
}

#menu li a span {
    position: relative;
    transition: 0.15s;
    overflow: hidden;
}

#menu li a span .out {
    display: inline-flex;
    opacity: 1;
}

#menu li a:hover span .out {
    opacity: 0;
    transform: translateY(-100%);
}

#menu li a span .in {
    position: absolute;
    left: 0;
    color: greenyellow;
    transform: translateY(100%);
    opacity: 0;
}

#menu li a:hover span .in {
    opacity: 1;
    transform: translateY(0);
}

#download::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #04F404;
    transform: scaleX(0);
    transition: transform 0.5s ease-in-out;
    transform-origin: right;
    border-radius: 9999px;
}

#download:hover::before {
    transform: scaleX(1);
    transform-origin: left;
    border-radius: 9999px;
}

#download span,
#download i {
    display: inline-block;
    z-index: 2;
    transition: 0.5s ease-in-out;
}

#download:hover {
    color: #000;
}