body {
    background-color: #191919;
    width: 100%;
    height: 100%;
    padding: auto;
}


ul.menu
{
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 96vw;
    max-width: 1080px;
}

li.menu-item
{
    margin: 0 0 10px 0;
    list-style: none;
    width: 48vw;
    max-width: 540px;
}

.menu-icon
{
    display: block;

    width: 28vw;
    height: 9vw;

    background-image: url("../images/menu-icons.jpg");
    background-repeat: no-repeat;
    background-size: calc(500 * 98vw / 750) calc(960 * 98vw / 750);
}

.menu-icon-1
{
    background-position: 5% 1%;
}

.menu-icon-2
{
    background-position: 91% 1%;
}

.menu-icon-3
{
    background-position: 5% 9%;
}

.menu-icon-4
{
    background-position: 91% 9%;
}

.menu-icon-5
{
    background-position: 5% 17%;
}

.menu-icon-6
{
    background-position: 91% 17%;
}

.menu-icon-7
{
    background-position: 5% 24%;
}

.menu-icon-8
{
    background-position: 91% 24%;
}

.menu-icon-9
{
    background-position: 5% 32%;
}

.menu-icon-10
{
    background-position: 91% 32%;
}

.menu-icon-11
{
    background-position: 5% 38%;
}

.menu-icon-12
{
    background-position: 91% 38%;
}

.menu-icon-13
{
    background-position: 5% 44%;
}

.menu-icon-14
{
    background-position: 91% 44%;
}

.menu-icon-15
{
    background-position: 5% 51%;
}

.menu-icon-16
{
    background-position: 91% 51%;
}

.menu-icon-17
{
    background-position: 5% 58%;
}

.menu-icon-18
{
    background-position: 91% 58%;
}

.menu-icon-19
{
    background-position: 5% 66%;
}

.menu-icon-20
{
    background-position: 91% 66%;
}

.menu-icon-21
{
    background-position: 5% 73%;
}

.menu-icon-22
{
    background-position: 91% 73%;
}

.menu-icon-23
{
    background-position: 5% 93%;
}

.menu-icon-25
{
    background-position: 91% 81%;
}

.img-menu {
    padding: 0.25rem;
    background-color: #191919;
    border-radius: 0.25rem;
    border: 2px solid #1b1b1b;
    max-width: 100%;
    height: auto;
}