/* CSS für Startseite */


/*----- Teaser -----*/
.teaser {
  position: relative;
}

.teaser-headline {
  position: absolute;
  bottom: 0;
  color: #FFF;
  background-color: rgba(32, 90, 167, .7);
  text-align: center;
  width: 100%;
  padding: 15px 0;
  margin: 0;
  font-weight: 700;
  font-size: 22px;
  z-index: 1;
}

.teaser-img-wrapper {
  overflow: hidden;
  width: 100%;
  padding-top: 100%;
  position: relative;
  padding-top: 76.38%
}

.teaser-img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 0;
  overflow: hidden;
  transition: all .2s ease-in-out;
}

.teaser:hover .teaser-img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

@media (max-width: 767px) {
  .teaser {
    max-width: 450px;
  }
}


/*----- Container für Fakten -----*/
#em-facts {
  text-shadow: 2px 2px 3px rgba(0,0,0, .3);
  color: #FFF;

  /* background-repeat: no-repeat;
  background-position: auto auto;
  background-size: cover;
  background: none; */
}

.em-facts-heading {
  font-size: 50px;
}

@media (max-width: 767px) {
  .em-facts-heading {
    font-size: 40px;
  }
}


/*----- Fakten für personalentwicklung -----*/
.fact {
  margin-top: 25px;
}

.fact-sign {
  font-size: 50px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.fact-content {
  margin-left: 50px;
  text-align: center;
}


.fact-solution > .line-1 {
  font-size: 55px;
  font-weight: bold;
}

.fact-solution > .line-2 {
  font-size: 55px;
  margin-top: -50px;
}

.fact-seperator {
  border-bottom: solid #ffffff;
  border-bottom-width: 2px;
  margin: 8px 0;
}

.fact-headline {
  font-size: 50px;
}
.fact-text {
  font-size: 14px;
}



@media (max-width: 991px) {
  .fact {
    margin-left: calc( ( 100% - 280px ) / 2 );
    margin-right: calc( ( 100% - 280px ) / 2 );
  }
}