.scroll-menu-btn {
    display: inline-block;
    background-color: lightslategray;
    color: #fff;
    border-radius: 3px;
    margin: 3px 0;
    padding: 7px 9px;
    scroll-snap-align: start;   
} 
.scroll-menu-btn a {
    text-decoration: none;
    color: #fff;
}
.scroll-menu-btn:hover {
    background-color: lightgray;
}

.container-scroll-menu {
    /* border: 1px solid lightslategray; */
    box-sizing: border-box;
    width: 100%;
    /* sticks menu */
    position: sticky;
    /* where it sticks the menu to */
    top: 0px;
    padding: 15px 0;
    background-color: #fff;  
    display: flex; 
    flex-direction: row;  
    opacity: 1;
    /* transition: opacity 1s; */
    transition: top 1.5s;               
    /* transition: rotate 1s; */
    z-index: 10;    
}

#scroll_menu_prev, #scroll_menu_next {    
    color: #fff;
    background-color: lightslategray;
    padding: 5px 9px;
    margin: 3px;
    border-radius: 3px;
    font-weight: bold;
    cursor: pointer;    
}
#scroll_menu_prev:hover, #scroll_menu_next:hover {
    box-shadow: 0 0 7px lightgrey;
}

.scroll-menu {
    display: inline-block;
    text-align: center;                
                                   
    /* enable overflow (scroll appears) */
    overflow-x: auto;
    /* free space will not be used */
    white-space: nowrap;
    scroll-snap-type: x mandatory;

    /* hide scroll */
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* hide firefox */
    scrollbar-width: none;
}

/* hide scroll */
.scroll-menu::-webkit-scrollbar {
    /* chrome safari opera */
    display: none;
}