/* Teaser   ========================== */
.teaser_50 { position: relative; padding-top: 56.25%; margin-bottom: 20px; background-size: cover; background-position: center; }
.teaser_100 { position: relative; padding-top: 56.25%; margin-bottom: 20px; background-size: cover; background-position: center; }


.wrapper_teaser_news { max-width: 800px; margin: 0 auto; }
.teaser_news { padding: 4% 4% 4% 4%; text-align: center; color: #FFF; transition-duration: 0.5s; background-color: rgba(97,91,73,1); }
.teaser_news a { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; border: none; text-decoration: none; }
.teaser_news:hover { background-color: rgba(0,0,0,1) }

.wrapper_teaser_A { max-width: 1400px; margin: 0 auto; }
.teaser_A { background-image: url("../img/teaser_home_sonnenschirme_16zu9.jpg"); }
.teaser_A_text { position: absolute; z-index: 5; bottom: 0; left: 0; width: 100%; padding: 2% 0; text-align: center; color: #FFF;  transition-duration: 0.5s; }
.teaser_A_zusatz { display: none; }
.teaser_A a { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; border: none; text-decoration: none; transition-duration: 0.5s; }
.teaser_A a:hover { background-color: rgba(0,0,0,0.25); }
.teaser_A:hover .teaser_A_zusatz { opacity: 1; transition-duration: 0.5s; }


.wrapper_teaser_B { max-width: 1400px; margin: 0 auto; }
.teaser_B { position: relative; margin-bottom: 20px; background-color: white; }
.teaser_B_foto { padding-top: 56.25%; background-size: cover; background-position: center; background-image: url("../img/teaser_home_sonnenschirme_16zu9.jpg"); transition-duration: 0.5s; }
.teaser_B_text { padding: 3% 0 2% 5%; text-align: left; transition-duration: 0.5s; }
.teaser_B a { position: absolute; z-index: 5; top: 0; right: 0; bottom: 0; left: 0; border: none; text-decoration: none; }
.teaser_B:hover .teaser_B_foto { filter: brightness(75%); }



.wrapper_teaser_C { max-width: 1400px; margin: 0 auto; }
.teaser_C { position: relative; margin-bottom: 20px; background-color: white; }
.teaser_C_foto_01 { padding-top: 56.25%; background-size: cover; background-position: center; background-image: url("../img/teaser_home_sonnenschirme_16zu9.jpg"); }
.teaser_C_text { padding: 3% 0 5% 5%; text-align: left; background-color: white; transition-duration: 0.5s; }
.teaser_C_foto_02_spacer { padding-top: 56.25%; }
.teaser_C_foto_02 { padding-top: 56.25%; background-size: cover; background-position: center; background-image: url("../img/teaser_home_sonnenschirme_16zu9.jpg"); position: absolute; bottom: 0; left: 0; right: 0; }

.CallToAction_wrapper { position: relative; display: flex; justify-content: center; align-items: center; }
.CallToAction { position: relative; font-size: 1.375em;; line-height: 1.5em; font-family: "Montserrat-Light", sans-serif; font-weight: 300; color: white; text-align: center; max-width: 700px; padding: 10px 20px; margin: 0 20px; background-color: #918975; transition-duration: 0.5s; 
    -webkit-box-shadow: 7px 7px 7px 0px rgba(97,91,73,1);
	-moz-box-shadow: 7px 7px 7px 0px rgba(97,91,73,1);
	box-shadow: 7px 7px 7px 0px rgba(97,91,73,1); }
.CallToAction a { position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; border: none; text-decoration: none; }
.CallToAction:hover { background-color: rgba(0,0,0,1); cursor: pointer; }



/* =======================================
	Responsive
======================================= */
@media screen and (min-width: 700px) {
.teaser_50 { float: left; width: 48.5%; padding-top: 27.28125%; margin-right: 3%; margin-bottom: 3%; }
.teaser_50:nth-of-type(2) { margin-right: 0; }
.teaser_100 { margin-bottom: 3%; }
.teaser_news { padding: 2%; }
    
.teaser_B { margin-bottom: 40px; }
.teaser_C { margin-bottom: 40px; } 
}

@media screen and (min-width: 1024px) {
.wrapper_teaser_A p { font-size: 1.125em; }
.wrapper_teaser_A h2 { font-size: 1.25em; text-transform: uppercase; margin-bottom: 0; }
.teaser_A_text { z-index: 5; width: auto; padding: 2% 30px; text-align: left; }
.teaser_A_zusatz { display: block; opacity: 0; }
}

@media screen and (min-width: 1400px) {
.teaser_50 { float: left; width: 49%; padding-top: 27.5625%; margin-right: 2%; margin-bottom: 2%; }
.teaser_50:nth-of-type(2) { margin-right: 0; } 
.teaser_100 { margin-bottom: 2%; }

.CallToAction { font-size: 2em;; line-height: 1.5em; padding: 15px 25px; } 

}

    

    
    
    