body {
    margin-top: 50px;
}

nav {
    /* border: 1px solid black; */
    border-radius: 5px;
    /* width: 300px; */
    width: 50%;
    margin: auto;
    text-align: center;
    padding-bottom: 10px;
}

.player-nav-bar-1 li {
    list-style-type: none;
    display: inline-block;
}

.player-nav-bar-1 {
    margin-bottom: 0px;
    padding: 0;
    margin-top: 5px;
}

.player-nav-bar-1 img {
    width: 50px;
    height: 50px;
    -webkit-filter: grayscale(1);
    border-radius: 10px;
}

.player-nav-bar-1 img:hover {
    -webkit-filter: grayscale(0);
    border-radius: 10px;
    border: 2px solid yellow;
}

/* .player-nav-bar-2 li {
    list-style-type: none;
    display: inline-block;
}

.player-nav-bar-2 {
    margin-top: 0px;
    padding: 0;
    margin-bottom: 5px;
}

.player-nav-bar-2 img {
    width: 50px;
    height: 50px;
    -webkit-filter: grayscale(1);
    border-radius: 10px;
}

.player-nav-bar-2 img:hover {
    -webkit-filter: grayscale(0);
    border-radius: 10px;
} */