@keyframes sidebar_hide {
    from {
        width: 250px;
    }

    to {
        width: 100px;
    }
}

@keyframes sidebar_show {
    from {
        width: 100px;
    }

    to {
        width: 250px;
    }
}

@keyframes menu_btn_title_show {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes menu_btn_title_hide {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

#sidebar:hover {
    animation: sidebar_show 0.2s ease forwards;
}

#sidebar:hover .menu-btn-title {
    animation: menu_btn_title_show 0.1s ease forwards;
}

#sidebar:not(:hover) .menu-btn-title {
    animation: menu_btn_title_hide 0.1s ease forwards;
}

#sidebar:not(:hover) {
    animation: sidebar_hide 0.2s ease forwards;
}