html,
        body{
            height:100%;
            margin:0;
            overflow-x:hidden;
            font-family:Arial, Helvetica, sans-serif;
        }

        .hero{
            position:relative;
            height:100vh;
            overflow:hidden;
        }

        .hero video{
            position:absolute;
            top:50%;
            left:50%;
            min-width:100%;
            min-height:100%;
            width:auto;
            height:auto;
            transform:translate(-50%,-50%);
            object-fit:cover;
            z-index:-2;
        }

        .overlay{
            position:absolute;
            inset:0;
            background:rgba(0,0,0,.55);
            z-index:-1;
        }

        .hero-content{
            height:100vh;
            display:flex;
            align-items:center;
            justify-content:center;
            text-align:center;
            color:#fff;
        }

        .hero h1{
            font-size:clamp(2.5rem,6vw,5rem);
            font-weight:700;
        }

        .hero p{
            font-size:1.25rem;
            max-width:700px;
            margin:auto;
        }

        .navbar{
            background:rgba(0,0,0,.3);
            backdrop-filter:blur(8px);
        }

        section{
            padding:100px 0;
        }

        footer{
            background:#111;
            color:#fff;
            padding:40px 0;
            text-align:center;
        }

        @media(max-width:768px){

        .hero h1{
            font-size:2.3rem;
        }

        .hero p{
            font-size:1rem;
        }

        }
    
/* ==========================
   Fullscreen Loader
========================== */

        #loader{
            position:fixed;
            inset:0;
            background:#000;
            display:flex;
            justify-content:center;
            align-items:center;
            z-index:99999;
            transition:opacity .6s ease, visibility .6s ease;
        }

        #loader.hide{
            opacity:0;
            visibility:hidden;
        }

        /* größer als Bootstrap Standard */

        .spinner-border{
            width:70px;
            height:70px;
            border-width:5px;
        }

    
        body{
            opacity:0;
            transition:opacity .8s ease;
        }

        body.loaded{
            opacity:1;
        }