/* 
 * © 2024 make. Todos los derechos reservados. 
 * Este archivo de estilo CSS es parte del proyecto Warner2. 
 * No se permite la reproducción, distribución ni modificación sin autorización previa. 
 */
/* Mobilbarát beállítások kis képerny?kre (pl. 768 képpont alatt) */
@media screen and (max-width: 768px) {
    /* Például a f? konténer szélességének igazítása */
    body {
        width: 100% !important;
        margin: 0 !important;
        padding: 5px !important;
    }
    
    /* Táblázatok átméretezése, hogy ne lógjanak ki */
    table.ranking {
        width: 100% !important;
        font-size: 12px;
    }
    
    /* Dobozok igazítása */
    .card, .news-card {
        width: 100% !important;
        box-sizing: border-box;
    }
}

@media only screen and (max-width: 992px){
    .col-left, .col-middle, .col-right {
        width: 90%;
        display: block;
        padding: 10px 20px;
        margin-left: auto;
        margin-right: auto;
    }

    nav {
        display: none; /* Display 'block' cuando presionen botón de abrir menú */
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: #000;
        z-index: 10;
    }

    nav ul {
        flex-direction: column;
    }

    nav ul li {
        padding: 5vh;
    }

    .hero-top {
        width: 100%;
        background-size: cover;
        background-position: 30%;
        margin-top: 0px;
    }

    .logo {
        float: unset !important;
        margin: unset;
        width: 300px;
        margin-top: -240px;
    }

    .logo-container {
        display: flex;
        justify-content: center; /* Centra horizontalmente */
        align-items: center; /* Centra verticalmente si es necesario */
        height: 100vh; /* Opcional: altura total de la ventana */
    }

    .sidenav-trigger {
        display: block; /* Oculta el menú por defecto */
        /* Otros estilos que necesites */
    }
}