/* Styly pro mobilní verzi */
@media screen and (max-width: 768px) {
    .mobile {
        display: block;
    }

    .desktop {
        display: none;
    }

    /* Další mobilní styly */
    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #fff;
    }

    .container {
        width: 100%;
        margin: 0 auto;
        max-width: 600px;
        padding: 15px;
    }

    .box {
        border: 1px solid #ccc;
        padding: 15px;
        margin: 10px 0;
        background: #f9f9f9;
        border-radius: 5px;
        text-align: center;
        /* Zarovnání obsahu na střed */
    }

    .box h2 {
        margin-top: 0;
    }

    .header img {
        display: block;
        margin: 0 auto;
        max-width: 100%;
        height: auto;
    }

    .box img {
        display: block;
        margin: 10px auto;
        max-width: 100%;
        height: auto;
        border-radius: 5px;
    }

    .button-container {
        display: flex;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
    }

    .button {
        display: inline-block;
        padding: 12px 20px;
        background-color: #6c757d8f;
        /* Šedé tlačítko */
        color: white;
        text-align: center;
        text-decoration: none;
        border-radius: 5px;
        font-size: 16px;
        transition: background-color 0.3s ease;
        width: 60%;
    }

    .button:hover {
        background-color: #5a6268;
        /* Tmavší šedá při najetí */
    }

    .button:active {
        background-color: #4e555b;
        /* Ještě tmavší šedá při stisknutí */
    }

    .suppliers {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2px; /* Mezera mezi obrázky */
     }
  
     .suppliers img {
        width: 160px;
        height: 48px;
     }

}