/* =========================================================
   TABLET: max 64em / 1024px
========================================================= */

@media (max-width: 1024px) {

    .r_panel {
        flex: 0 0 100vw;
        width: 100%;
        height: 20vh;
        min-width: 100vw;
        max-width: 100vw;
        order: 3;
        z-index: 200;
       
    }

    /* moduli z levim panelom */
    .SS_VCM .prezrti-shell,
    .MM_MLJ .prezrti-shell,
    .SS_MLJ .prezrti-shell,
    .SS_STD .prezrti-shell {
        flex-wrap: wrap;
        align-content: flex-start;
    }

    .SS_VCM .l_panel,
    .MM_MLJ .l_panel,
    .SS_MLJ .l_panel,
    .SS_STD .l_panel {
        flex: 0 0 var(--shell_side_L);
        width: var(--shell_side_L);
        height: 80vh;
        order: 1;
    }

    .SS_VCM .c_panel,
    .MM_MLJ .c_panel,
    .SS_MLJ .c_panel,
    .SS_STD .c_panel {
        flex: 1;
        width: auto;
        height: 80vh;
        min-width: 0;
        order: 2;
    }

    .SS_VCM .r_panel,
    .MM_MLJ .r_panel,
    .SS_MLJ .r_panel,
    .SS_STD .r_panel {
        order: 3;
    }

    /* moduli brez leviga panela */

    .MM_PPL .prezrti-shell, 
    .SS_PPL .prezrti-shell,
    .SS_LPT .prezrti-shell,
    .SS_DLE .prezrti-shell,
    .SS_KEV .prezrti-shell{
        flex-wrap: wrap;
        align-content: flex-start;
    }

    .MM_PPL .c_panel,
    .SS_PPL .c_panel,
    .SS_LPT .c_panel,
    .SS_DLE .c_panel,
    .SS_KEV .c_panel {
        flex: 0 0 100%;
        width: 100%;
        height: 80vh;
        min-width: 0;
        order: 1;
    }

    .SS_LPT .c_panel {
        display: flex;
        justify-content: center;
    }

    .MM_PPL .r_panel,
    .SS_PPL .r_panel,
    .SS_LPT .r_panel,
    .SS_DLE .r_panel,
    .SS_KEV .r_panel {
        order: 2;
    }
}

    /* =========================================================
   PHONE: max 48em / 768px
========================================================= */
@media only screen and (max-width: 48em) {

    .prezrti-shell {
        flex-wrap: wrap;
        height: 100dvh;
        overflow: hidden;
    }

    /* MODULI Z LEVIM MENIJEM */

    .SS_LPT .l_panel,
    .SS_VCM .l_panel,
    .MM_MLJ .l_panel,
    .SS_MLJ .l_panel,
    .SS_STD .l_panel {
        position: fixed;
        inset: 0;
        width: 100vw;
        height: 80dvh;
        transition: transform .3s ease;
        transform: translateX(-100%);
    }

    .SS_LPT .l_panel {
        display: flex;
    }
    /* odprt meni */
    .nav_active .l_panel {
        transform: translateX(0);
    }

    /* moduli brez levega panela */
    .MM_PPL .l_panel,
    .SS_PPL .l_panel,
    .SS_DLE .l_panel,
    .SS_KEV .l_panel {
        display: none;
    }

    .SS_VCM .c_panel,
    .MM_MLJ .c_panel,
    .SS_MLJ .c_panel,
    .SS_STD .c_panel,
    .MM_PPL .c_panel,
    .SS_PPL .c_panel,
    .SS_LPT .c_panel,
    .SS_DLE .c_panel,
    .SS_KEV .c_panel {
        flex: 0 0 80vh;
        width: 100%;
        height: 80vh;
        min-width: 0;
        min-height: 0;
    }

    .SS_VCM .c_panel,
    .MM_MLJ .c_panel,
    .MM_PPL .c_panel,
    .SS_PPL .c_panel {
        flex: 0 0 100%;
    }

        .MM_PPL .c_panel,
        .SS_PPL .c_panel,
        .SS_LPT .c_panel,
        .SS_DLE .c_panel,
        .SS_KEV .c_panel {
            order: 1;
        }

        .MM_PPL .r_panel,
        .SS_PPL .r_panel,
        .SS_LPT .r_panel,
        .SS_DLE .r_panel,
        .SS_KEV .r_panel {
            order: 2;
        }

        .r_panel_full {
            position: fixed;
            inset: 0;
            width: 100vw;
            height: 100dvh;
            z-index: 200;
            background-color: var(--color_RockBlue_75);
        }
    }