/* ==========================================================================
   Author's custom styles
   ========================================================================== */


#teaser { text-align: center; margin: 50px; 0px 50px 0px; }
#teaser img { width: 450px; }

.team-member { height: 500px; }

body {
    color: #222;
    font-family: Helvetica, sans-serif;
}

h3 {
    margin-bottom: 30px;
	color: #227023;
	text-decoration: underline;
}

img.portrait {
    width: 300px;
}

.map {
    text-align: center;
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */


@media (max-width: 479px) {
    #teaser img { width: 300px; }
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    #teaser img { width: 600px; }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    #teaser img { width: 800px; }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #teaser img { width: 1000px; }
}

/* The Rotis font is rather smallish - so set font size to 125% of original */
h1 { font-size: 45px; }
h2 { font-size: 38px; }
h3 { font-size: 30px; }
h4 { font-size: 23px; }
h5 { font-size: 18px; }
h6 { font-size: 15px; text-decoration: underline; }
body { font-size: 15px; }

/* ==========================================================================
   NAVBAR (via http://work.smarchal.com/twbscolor/css/e74c3cc0392becf0f1ffbbbc0)
   ========================================================================== */

.green {
    color: #227023;
}

.blue {
    color: #72889b;
}


/*Anpassungen durch Sascha Travica Digital Marketing*/
img.portrait {
    transition: transform 0.3s ease; /* Übergangseffekt */
}

img.portrait:hover {
    transform: scale(1.1); /* Bild vergrößern */
}

img.portrait {
    transition: transform 0.3s ease, filter 0.3s ease; /* Übergangseffekt für Transform und Filter */
    filter: grayscale(100%); /* Schwarz-Weiß-Effekt */
}

img.portrait:hover {
    transform: scale(1.1); /* Bild vergrößern */
    filter: grayscale(40%); /* Zurück zur Originalfarbe bei 0*/
}

img.map:hover {
    transform: scale(1.1); /* Bild vergrößern */
	transition: transform 0.3s ease, filter 0.3s ease; /* Übergangseffekt für Transform und Filter */
    filter: grayscale(40%); /* Zurück zur Originalfarbe bei 0 */
}
/*Ende Anpassungen*/