@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'Alternate Gothic No2 D Regular';
  src:url("../fonts/Alternate-gothic-no2-regular.woff2");
}
   @font-face {
    font-family: 'Open Sans Regular';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/OpenSans-Regular.woff");
    }
    
     @font-face {
    font-family: 'Open Sans Italic';
    font-style: normal;
    font-weight: normal;
  src:url("../fonts/OpenSans-Italic.woff");
    }
    

    @font-face {
    font-family: 'Open Sans Light';
    font-style: normal;
    font-weight: normal;
     src:url("../fonts/OpenSans-Light.woff");
    }
    

    @font-face {
    font-family: 'Open Sans Light Italic';
    font-style: normal;
    font-weight: normal;
   src:url("../fonts/OpenSans-LightItalic.woff");
    }
    

    @font-face {
    font-family: 'Open Sans SemiBold';
    font-style: normal;
    font-weight: normal;
  src:url("../fonts/OpenSans-SemiBold.woff");
    }
    

    @font-face {
    font-family: 'Open Sans SemiBold Italic';
    font-style: normal;
    font-weight: normal;
   src:url("../fonts/OpenSans-SemiBoldItalic.woff");
    }
    

    @font-face {
    font-family: 'Open Sans Bold';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/OpenSans-Bold.woff");
    }
    

    @font-face {
    font-family: 'Open Sans Bold Italic';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/OpenSans-BoldItalic.woff");
    }
    

    @font-face {
    font-family: 'Open Sans ExtraBold';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/OpenSans-ExtraBold.woff");
    }
    

    @font-face {
    font-family: 'Open Sans ExtraBold Italic';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/OpenSans-ExtraBoldItalic.woff");
    }
       @font-face {
    font-family: 'nunito_bold';
    font-style: normal;
    font-weight: normal;
    src:url("../fonts/nunito.bold.woff2");
    }




		body {
    background-color:rgba(42,47,53,1.00)!important;
	color: white;
	 font-family:"Open Sans Regular";
   text-align: left;

}

h1 {
font-family: 'nunito_bold';
    text-transform:  uppercase; 
           font-size: 2em;
       letter-spacing: 0.02em;
            line-height:1.2;
    text-align: left;
            color:rgba(255,255,255,1.00);
		}
		
h2 {
 font-family: 'nunito_bold';
			font-size: 1.7em;
             line-height:1.15;
    padding-bottom: 8px;
             letter-spacing: 0.02em;
    text-align: left;
}

 h3 {
           font-family: 'nunito_bold';
			font-size: 1.5em;
             line-height:1.3;
         padding-top:0.3em;
            padding-bottom: 0.1em;
		letter-spacing: 0.02em;
     text-align: left;
		}

h4 {
 font-family: 'nunito_bold';
			font-size: 1.3em;
             line-height:1.2;
             padding-top:0.3em;
            padding-bottom: 0.1em;
    letter-spacing: 0.02em;
    text-align: left;
}


h5 {
 font-family: 'nunito_bold';
			font-size: 1.1em;
             line-height:1.3;
             letter-spacing: 0.02em;
   word-spacing: 0.03em;
   padding-top:0.3em;
            padding-bottom: 0.1em;
    text-align: left;
   
}


.hellrot {
    color: #C5648B!important;
}

.gruen {
    color:#A0A653!important;
}

.hellblau {
    color:#81ACA9!important;
}

.jumbotron p {
    margin-top:1em;
    margin-bottom:1em;
    font-family:"Open Sans Regular";
   text-align: left;
    font-size: 1em;

}

.fake_h1 {
font-family: 'nunito_bold';
     font-size: 2em;
    font-variant: uppercase; 
    letter-spacing: 0.03em;
             line-height:1.2;
            color:rgba(255,255,255,1.00);
    text-align: left;
		}
		
		
p { font-family:"Open Sans Regular";
   text-align: left;
    font-size: 1em;
    margin-bottom: 0px;
       margin-top: 0px;
    
}
li {
    font-size: 1em;
}

.hintergrund-gruen {
    background-color: #A0A653!important;
}

.hintergrund-einfallsreich-grau {
    background-color: #8b838c!important;
}
.hintergrund-lehr {
    background-color:#81ACA9!important;
}
.hintergrund-produkte {
    background-color:#dd9a1d!important;
}
.hintergrund-geschichten {
    background-color:#a83e68!important;
}

.hintergrund-hell {
    background-color: #CAC6CA!important;
}
		
		
		.grau_hintergrund {
			
			background-color: #33363f;
		}


.navbar {
  padding-left:20px;
    padding-right: 20px;
    height:auto;
    background-color:rgba(42,47,53,0.9);
     font-family: 'Open Sans SemiBold';
    text-transform: uppercase;
}


.navbar a:hover {
    color:#A0A653!important;
}
 .navbar-toggler {
      margin-left: auto;
     background-color: rgba(160,166,83,1.0);
    }
.navbar-toggler-lehr {
      margin-left: auto;
     background-color:#81ACA9!important;
    }
.navbar-toggler-produkte {
      margin-left: auto;
     background-color:#dd9a1d!important;
    }

.navbar-toggler-geschichten {
      margin-left: auto;
     background-color:#a83e68!important;
    }


.nav-item {
      margin-left: auto;
    text-align: left;
    
}




.hauptcontainer {
    margin-top:128px;
    margin-bottom:10px;
}
.container-fluid {
    padding:10px;
}
.jumbotron {
 margin:8px;
    padding: 1.5em;
    padding-top: 2em;
     padding-bottom: 2em;
 background-color:#474B54;
 border-radius: 10px;
    text-align: left;
}

.bento-item {
     height: 250px;
     border-radius: 10px;
   text-align: left;
    display: flex; 
    flex-direction: column;
  align-items: center; 
    justify-content:center;
    color: white;
    background-color:rgba(71,75,84,1.00);
    transition: transform 0.25s ease;
    margin:8px;
    padding: 1.5em;
    padding-top: 2em;
     padding-bottom: 2em;
            
        }
.bento-item-left {
     text-align: left;
    display: flex; 
    flex-direction: column;
  align-items: flex-start; 
    justify-content:center;
}
    
 
.bento-item_flexheight {
    height:auto!important;
}


.bento-item_bild {
     height: 250px;
     border-radius: 10px;
   text-align: center;
    font-size: 1em;
    align-items: center;
    justify-content:center;
    color: white;
    background-color:rgba(71,75,84,1.00);
    transition: transform 0.25s ease;
    margin:8px;
    padding: 0.2em;
    padding-top: 0.2em;
     padding-bottom: 0.2em;
            
        }

.bento-item_bild_direkt {
    height: 250px;
    overflow: hidden;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    color: white;
    background-color: rgba(71,75,84,1.00);
    transition: transform 0.25s ease;
    margin: 8px;
    padding: 0em;
}

.bento-item_bild_direkt img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 10px;
}
.bento-item_dark {
    background-color:#1F2327;
}

.bento-medium {
            height: 515px;
        }
.bento-tall {
            height: 515px;
        }
.bento_zentriert {
    
    text-align: center;
}

.bento_mehr_abstand {
     margin:8px;
    padding: 1.5em;
    padding-top: 2em;
     padding-bottom: 2em;
}


@media (min-width: 1200px) {
    .bento_mehr_abstand {
     margin:8px;
    padding: 5em;
    padding-top: 3em;
     padding-bottom: 3em;
}
}
.bento-item a {
color:#bdbe89;
text-decoration: none;
		}

.bento-item p li {
    font-size: 1em;
    line-height: 1.6;
    text-align: left;
}
.bento-item h1 {
font-family: 'nunito_bold';
     font-size: 2em;
    font-variant: uppercase; 
    letter-spacing: 0.03em;
             line-height:1.2;
    text-align: left;
            color:rgba(255,255,255,1.00);
		}

.bento-item h2 {
 font-family: 'nunito_bold';
			font-size: 1.7em;
             line-height:1.15;
             letter-spacing: 0.03em;
      padding-bottom: 0.1em;
            padding-top:0.2em;
      text-align: left;
}

.bento-item h3 {
    font-family: 'nunito_bold';
    font-size: 1.5em;
    line-height: 1.3;
    padding-top: 0.3em;
    padding-bottom: 0.1em;
    letter-spacing: 0.02em;
    text-align: left;
    color: #FFFFFF;
		}

.bento-item h4 {
 font-family: 'nunito_bold';
			font-size: 1.3em;
             line-height:1.3;
             letter-spacing: 0.02em;
    padding-top:0.3em;
            padding-bottom: 0.1em;
    text-align: left;
}


.bento-item h5 {
 font-family: 'nunito_bold';
			font-size: 1.1em;
             line-height:1.3;
             letter-spacing: 0.03em;
   word-spacing: 0.03em;
   padding-top:0.3em;
            padding-bottom: 0.1em;
    text-align: left;
   
}

        .bento-item:hover {
            transform: scale(1.01);
        }

.bild_verschwindet {
   visibility: visible;
}

.bild_verschwindet_smartphone {
   visibility: visible;
}
@media (max-width: 992px) {
    .bild_verschwindet{
   
   display:none; 
}
    .bento-item {
    
    padding: 1em;
    padding-top: 1.2em;
     padding-bottom: 1.2em;
            
        }
    

.bento-item h2 {

			font-size: 1.3em;
            
        }
     p li {
        font-size: 0.9em;
    }
    .bento-item p li {
        font-size: 0.9em;
    }
    .bento-item {
    
    padding: 1em;
    padding-top: 1em;
     padding-bottom: 1em;
            
        }
    .bento-medium {
             height: 250px;
        }
    
    .bento-item h1 {
        font-size: 1.6em;
        
    }
    
    .bento-item h2 {

			font-size: 1.2em;
            
}
    
    h1 {
            font-size: 1.6em;
           
		}
		
		h2 {
        
			font-size: 1.2em;
             
		}
		.bento-item h3 {
          
			font-size: 1em;
          
             
		
		}
    
    .bento-item h5 {
			font-size: 1em;
            
   
}
    
    }
@media (max-width: 768px) {
  
       .bild_verschwindet_smartphone {
   display:none; 
}
    
    }


@media (max-width: 400px) {
    

   .progress {
    height:22px;
     font-family: 'Open Sans SemiBold';
	font-size: 0.75em;
    text-align: left;
       }
    .container-fluid {
    padding:2px!important;
}
    
    .bento-item h1 {
        font-size: 1.4em;
        
    }
    
    .bento-item h2 {

			font-size: 1.1em;
            
}
    
    h1 {
            font-size: 1.4em;
           
		}
		
		h2 {
        
			font-size: 1.1em;
             
		}
		 .bento-item p li {
        font-size: 0.9em;
        
    }
    .bento-item h3 {
			font-size: 0.9em;        
}
    
    .bento-item h4 {
			font-size: 0.9em;
            
   
}
     .bento-item h5 {
			font-size: 0.9em;
            
   
}
    }
    
a {
color:#bdbe89;
text-decoration: none;
		}

a:hover {
	color:#CAC6CA;	text-decoration: none;
}

.aussenabstand_klein {
    margin: 5px;
    margin-bottom: 25px;
}


.progress {
    height:22px;
     font-family: 'Open Sans SemiBold';
	font-size: 0.85em;
    text-align: left;
    
            
    
}

.bg-success {
    background-color: #adaa3d!important;
    text-align: left;
    text-indent: 10px;
  
}

.bg-lehr {
    background-color: rgba(129,172,169,1.00)!important;
    text-align: left;
    text-indent: 10px;
  
}

.bg-geschichten {
    background-color: #a83e68!important;
    text-align: left;
    text-indent: 10px;
  
}


.bg-grau {
    background-color:rgba(71,75,84,1.00);
    text-align: left;
    text-indent: 10px;
    font-size: 0.9em;
   
  
}
/*--------------------Button-------------------------------*/

.btn-success {
  color:white!important;
  background-color:#A0A653;
  border-color:rgba(135,122,130,1.00);
    text-align: center;
    font-family: 'Open Sans SemiBold';
    margin-top:5px;
}
.btn-lehr {
  color:white!important;
  background-color:#81ACA9!important;
  border-color:rgba(135,122,130,1.00);
    text-align: center;
    font-family: 'Open Sans SemiBold';
    margin-top:5px;
}

.btn-produkte {
  color:white!important;
  background-color:#dd9a1d!important;
  border-color:rgba(135,122,130,1.00);
    text-align: center;
    font-family: 'Open Sans SemiBold';
    margin-top:5px;
}

.btn-geschichten {
  color:white!important;
  background-color:#a83e68!important;
  border-color:rgba(135,122,130,1.00);
    text-align: center;
    font-family: 'Open Sans SemiBold';
    margin-top:5px;
}


.btn-success:hover {
  color: #fff;
  background-color:rgba(135,122,130,1.00)!important;
  border-color:rgba(135,122,130,1.00);
}

.btn-success:focus, .btn-success.focus {
  color: #fff;
    background-color:rgba(135,122,130,1.00);
  border-color:#A0A653;
  box-shadow: 0 0 0 0.2rem rgba(160,166,83,0.5);
}

.btn-success.disabled, .btn-success:disabled {
  color: #fff;
  background-color: #A0A653;
  border-color: #A0A653;
}

.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
  color: #fff;
  background-color: #A0A653;
  border-color: #A0A653;
}

.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(160,166,83,0.5);
}

/*---------------------hintergrund bilder----------------*/

.background_gluehbirne {
    
    background-image: url("../links/kreativ.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}



.background_christine {
    
    background-image:url("../links/cehmke.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.background_arbeitsprobe1 {
    
    background-image:url("../links/arbeitsprobe_psychosomatikum.jpg");
     background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}
.background_arbeitsprobe_sonderby {
    
    background-image:url("../links/arbeitsproben/sonderby_web.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}


.background_arbeitsprobe_sonderby_flyer {
    
    background-image:url("../links/arbeitsproben/sonderby_flyer.png");
   background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_sonderby_diverse {
    
    background-image:url("../links/arbeitsproben/sonderby_diverse.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_sonderby_grill {
    
    background-image:url("../links/arbeitsproben/sonderby_grill.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_sonderby_schilder {
    
    background-image:url("../links/arbeitsproben/sonderby_schilder.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe3 {
    
    background-image:url("../links/arbeitsproben/Mockup_dennis_friseur-web.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}
.background_arbeitsprobe3-2 {
    
    background-image:url("../links/arbeitsproben/dennis_dosen.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe3-3 {
    
     background-image:url("../links/arbeitsproben/dennis_flyer.png");
   background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe3-4 {
    
     background-image:url("../links/arbeitsproben/dennis_karte.png");
    background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_klangbar {
    
     background-image:url("../links/arbeitsproben/klangbar.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}


.background_arbeitsprobe_psychosomatikum {
    
     background-image:url("../links/arbeitsproben/psychosomatikum.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_logos {
    
     background-image:url("../links/arbeitsproben/Logowand.png");
 background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_plakate {
    
     background-image:url("../links/arbeitsproben/Plakatwand_Musik.jpg");
 background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
}


.background_arbeitsprobe_diversita {
    
     background-image:url("../links/arbeitsproben/diversita.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_nuesch_albrecht-debus {
    
     background-image:url("../links/arbeitsproben/nuesch_albrecht-debus.jpg");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_logo_albrecht-debus {
    
     background-image:url("../links/arbeitsproben/logo_albrecht_debus.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_cafetuerkis {
    
     background-image:url("../links/arbeitsproben/cafetuerkis.png");
 background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_peggy_inside {
    
     background-image:url("../links/arbeitsproben/peggy_inside_web.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_alle_farben {
    
     background-image:url("../links/arbeitsproben/alle_farben.png");
 background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_waldenau_flyer {
    
     background-image:url("../links/arbeitsproben/flyer_waldenauer_rocknacht.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_flyer_dvis {
    
     background-image:url("../links/arbeitsproben/flyer_dvis.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_luethje {
    
     background-image:url("../links/arbeitsproben/telse_luethje.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}

.background_arbeitsprobe_refire {
    
     background-image:url("../links/arbeitsproben/refire.png");
 background-position: center;
    background-size:contain;
    background-repeat: no-repeat;
}


.text-end {
}



/*---------------- Vorschau-Kacheln (impulse.html) ----------------*/

/* Kachel baut auf .bento-item auf, braucht aber flexible Höhe
   und keinen Innenabstand, weil das Bild bündig oben sitzt. */
.impuls-kachel {
    height: auto;
    padding: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    align-items: stretch;
}

.impuls-kachel_link {
    display: block;
    height: 100%;
    color: white;
    text-decoration: none;
}

.impuls-kachel_link:hover {
    color: white;
}

.impuls-kachel_bild {
    width: 100%;
    height: 190px;
    background-size: cover;
    background-position: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.impuls-kachel_body {
    padding: 1.3em 1.5em 1.6em;
    text-align: left;
    min-height: 230px;
}
@media (max-width: 992px) {
    .impuls-kachel_body {
        min-height: 150px;
}}
.impuls-kachel_titel {
    color: rgba(255,255,255,1.00);
    margin-bottom: 0.3em;
}

.impuls-kachel_text {
    color: #CAC6CA;
    line-height: 1.6;
    margin-bottom: 0;
}

/* Kategorie-Label, grün wie die Hausfarbe */
.impuls-tag {
    display: inline-block;
    font-family: 'Open Sans SemiBold';
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.75em;
    color: #C5648B!important;
    margin-bottom: 0.4em;
}


/*---------------- Einzelbeitrag (impulse/…) ----------------*/

/* Beitrag sitzt in einer Bento-Fläche, aber mit flexibler Höhe
   und linksbündigem Text für den Lesefluss. */
.impuls-beitrag {
    height: auto;
    text-align: left;
    padding: 2em 2.2em 2.4em;
}

.impuls-beitrag h1 {
    margin-bottom: 0.6em;
}

.impuls-beitrag_bild {
    width: 100%;
    border-radius: 10px;
    margin: 0.5em 0 1.6em;
    display: block;
}

/* Falls statt eines Bildes die grüne Akzentfläche genutzt wird */
div.impuls-beitrag_bild {
    height: 250px;
}

.impuls-beitrag_body {
    font-size: 1.05em;
    line-height: 1.7;
}

.impuls-beitrag_body p {
    line-height: 1.7;
    margin-bottom: 1.2em;
}

.impuls-beitrag_body h2 {
    padding-top: 0.4em;
    margin-bottom: 0.4em;
}

/* Abschluss-Karte mit Verweis auf App oder Buch */
.impuls-cta {
    background-color: #1F2327;
    border-left: 4px solid #C5648B;
    border-radius: 10px;
    padding: 1.5em 1.7em;
    margin: 2.2em 0 0.5em;
}

.impuls-cta p {
    color: #CAC6CA;
    line-height: 1.6;
    margin-bottom: 1em;
}
.background_arbeitsprobe_flyer_dvis {
}
.hellblau {
}