/*
 * Globals
 */
            /* Custom default button */
            
            .btn-secondary,
            .btn-secondary:hover,
            .btn-secondary:focus {
                color: #333;
                text-shadow: none;
                /* Prevent inheritance from `body` */
            }
            /*
 * Base structure
 */
            
            body {
                text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
                box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
            }
            
            .cover-container {
                position: relative;
                background-image: url(images/jakobskreuz.jpg);
                background-size: cover;
                background-repeat: no-repeat;
                width: 100%;
                height: 100%;
                overflow-x: hidden;
                background-position: top right;
                /* Bildausrichtung für sm je nach Motib x y-Achse */
            }
            /*.karte-bunt {
    position: absolute;
    background-image: url(images/jakobskreuz.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all 0.5s linear 1.5s;
}

.karte-bunt-animated {
    opacity: 1;
}*/
            
            .logo-big {
                position: absolute;
                background-image: url(images/headphones_big.svg);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                width: 100%;
                height: 100%;
                top: 0%;
                left: 0%;
                transition: all 1s ease-out 0.5s;
            }
            
            .logo-big-animated {
                width: 30% !important;
                height: 30% !important;
                top: 15% !important;
                left: 35% !important;
            }
            
            .logo-small {
                position: absolute;
                background-image: url(images/headphones_small.svg);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                width: 30%;
                height: 30%;
                top: 15%;
                left: 35%;
                opacity: 0;
                transition: all 0.5s linear 1.5s;
            }
            
            .logo-small-animated {
                opacity: 1;
            }
            
            .pfeil {
                /*background-color: rgba(51, 51, 51, 0.533);*/
                position: absolute;
                background-image: url(images/pfeil_jakobsweg.svg);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                width: 70%;
                height: 30%;
                bottom: 10%;
                left: 15%;
                opacity: 0;
                transition: all 0.5s linear 1.5s;
            }
            
            .pfeil2 {
                /*background-color: rgba(51, 51, 51, 0.533);*/
                position: absolute;
                background-image: url(images/pfeil_jakobsweg_mobil.svg);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                width: 70%;
                height: 30%;
                bottom: 10%;
                left: 15%;
                opacity: 0;
                transition: all 0.5s linear 1.5s;
            }
            
            .pfeil-animated:hover,
            .pfeil-animated2:hover {
                background-color: rgba(51, 51, 51, 0.533);
            }
            
            .pfeil-animated {
                left: 15% !important;
                opacity: 1 !important;
            }
            
            .pfeil-animated2 {
                left: 15% !important;
                opacity: 1 !important;
            }
            /** Größere Monitore **/
            
            @media only screen and (min-width: 570px) {
                .pfeil2 {
                    display: none;
                }
            }
            /** Kleinere Monitore **/
            
            @media only screen and (max-width: 600px) {
                .pfeil {
                    display: none;
                }
            }
            
            .cover {
                position: absolute;
                top: 50%;
                right: 10%;
                z-index: 20;
            }
            /* Header */
            
           .navbar-nav .nav-item{
                padding: .25rem 0;
                font-weight: 700;
                color: rgba(255, 255, 255, 1);
                background-color: transparent;
                border-bottom: .25rem solid transparent;
            }
            
             .navbar-nav .nav-item:hover,
            .navbar-nav .nav-item:focus {
                border-bottom-color: rgba(255, 255, 255, 1);
            }
            
             .navbar-nav .nav-item+.nav-item {
                margin-left: 1rem;
            }
            
             .navbar-nav .nav-item .active {
                color: #fff;
                border-bottom-color: #fff;
            }

.offcanvas-collapse h4 {
    font-size: 1rem;
    font-weight: 400;
    color: #ffffff;
}