/* ============================================================
   ELR MOBILE FINAL FIXES

   Final mobile override layer.
   Loaded directly by templates/core/base.html.

   Purpose:
   The real masthead already contains the journal title.
   The obsolete internal title below the mobile navigation
   must therefore never render.
============================================================ */


@media (max-width: 700px){

    html body:not(.elr-home-mobile-v1)
    .elr-global-content::before{

        content: none !important;

        display: none !important;

        visibility: hidden !important;

        opacity: 0 !important;

        width: 0 !important;
        height: 0 !important;

        min-width: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;

        position: absolute !important;

        pointer-events: none !important;

    }

}


/*
   Additional protection for the known internal-title band
   should a historical selector still exist elsewhere.
*/

@media (max-width: 700px){

    html body
    .elr-global-content::before{

        content: none !important;

    }

}


/* ================================================================
   ELR MOBILE CAROUSEL V5.5 CLEAN START
================================================================ */

@media(max-width:700px){

    html,
    body{

        width:
            100%;

        max-width:
            100%;

        overflow-x:
            hidden;

    }


    .carousel,
    .carousel-inner,
    .carousel-item{

        width:
            100% !important;

        max-width:
            100% !important;

        box-sizing:
            border-box !important;

    }


    .carousel,
    .carousel-inner{

        overflow:
            hidden !important;

    }


    .carousel-inner{

        touch-action:
            pan-y;

        overscroll-behavior-x:
            contain;

    }


    .carousel-item{

        height:
            260px !important;

        min-height:
            260px !important;

        overflow:
            hidden !important;

    }


    .carousel-item img,
    .carousel img{

        display:
            block !important;

        width:
            100% !important;

        height:
            260px !important;

        min-height:
            260px !important;

        max-width:
            none !important;

        object-fit:
            cover !important;

        object-position:
            center center !important;

        margin:
            0 !important;

    }


    .carousel-caption{

        left:
            16px !important;

        right:
            16px !important;

        bottom:
            16px !important;

        width:
            auto !important;

        max-width:
            calc(100% - 32px) !important;

        box-sizing:
            border-box;

    }


    .carousel-control-prev,
    .carousel-control-next{

        width:
            42px !important;

    }

}

/* ELR MOBILE CAROUSEL V5.5 CLEAN END */

