/*  =========================================================================
    Farben
    ========================================================================= */

/* Hintergrundfarbe Browser bei Mobile weiß #fff, ab Desktop frei wählbar */
/* Hintergrundfarbe Wrapper weiß #fff */

/* Farben Headlines, Textlinks, Nav, Call-to-Action-Fläche, Footer sind frei wählbar */

/* Beispiel Hot Pink
        Master: #d456b2
        heller: #d867ba
        dunkler: #913b7a
*/


/*  =========================================================================
    MOBILE FIRST
    ========================================================================= */

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    background: #fff;
}

#wrapper {
    background: #fff;
}

/* --- Typo -------------------------------------------------- */
h1, h2, h3, h4 {
    color: #038703;
}

/* Text-Hervorhebung*/
.high {
    color: #d456b2;
}

header {
    background: #fff;
}

nav {
    background: #038703;
}

nav ul {
    background: #038703;
}

nav li.active {
    background: #2b7606;
}

nav li a, nav li a:link, nav li a:visited {
    color: #fff;
}

nav li a:hover, nav li a:active, nav li a:focus {
    background: #53b025;
}

/* --- Call-to-Action ------------------------------------ */
.cta {
    background: #d456b2;
    color: #fff;
}


.cta h4 {
    color: #fff;
    font-size: 1rem;
}

.cta p {
    font-size: 1.5rem;
    margin: 0;
}

.cta a[href^="tel"]:link, .cta a[href^="tel"]:visited, .cta a[href^="tel"]:hover {
    color: #fff
}

/* --- Googlemap ------------------------------------------ */

#map {
    border: 1px solid #ddd;
}


/* --- Footer --------------------------------------------- */

footer {
    background: #038703;
}

footer p {
    color: #fff;
}

/* --- Links ---------------------------------------------- */

a:link, a:visited, a:hover {
    color: #e3000f;
}

a.button:link, a.button:visited, a.button:hover {
    color: #fff;
    background: #2b7606;
}

a.button:hover {
    color: #fff;
    background: #53b025;
}


footer a:link, footer a:visited, footer a:hover {
    color: #fff;
}

footer a[href^="tel"]:link, footer a[href^="tel"]:visited, footer a[href^="tel"]:hover {
    color: #fff;
}

a[href^="tel"]:link, a[href^="tel"]:visited, a[href^="tel"]:hover {
    color: #222;
}


/*  =========================================================================
    MIN 768 (Tablet)
    ========================================================================= */
@media only screen and (min-width: 768px) { 


    nav li a {
        color: #fff;
    }
    
    nav li a:hover, nav li a:active, nav li a:focus {
        color: #fff;
    }
    
    #map {
        border: 2px solid #F0ECE9;
    }
    
    footer {
        background: #038703;
    }

}

/*  =========================================================================
    MIN 992 (Desktop)
    ========================================================================= */
@media only screen and (min-width: 992px) { 
    
    body {
        background:url('../img/hintergrund.jpg');
            background-size: cover;
            background-repeat: repeat;
                background-attachment: fixed;
    }
    }
}