/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 */
.redesign-banner {
  background: #e6e9ef;
  margin: 0 -75px;
  display: flex;
  position: relative; }
  .redesign-banner__image {
    background: no-repeat left bottom;
    background-size: contain;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; }
  .redesign-banner__mobile-image {
    width: calc(100% + 15px);
    height: auto;
    display: none; }
  .redesign-banner__text {
    padding: 75px;
    flex-basis: 33.33333%;
    position: relative;
    z-index: 5; }
  .redesign-banner--image-left .redesign-banner__image {
    background-position: left bottom; }
  .redesign-banner--image-center .redesign-banner__image {
    background-position: center bottom; }
  .redesign-banner--image-right .redesign-banner__image {
    background-position: right bottom; }
  .redesign-banner--text-left {
    justify-content: flex-start; }
  .redesign-banner--text-center {
    justify-content: center; }
  .redesign-banner--text-right {
    justify-content: flex-end; }
  .redesign-banner--color-primary {
    background: #003978;
    color: #fff; }
    .redesign-banner--color-primary h1, .redesign-banner--color-primary h2, .redesign-banner--color-primary h3, .redesign-banner--color-primary h4, .redesign-banner--color-primary h5, .redesign-banner--color-primary h6 {
      color: #fff; }
  .redesign-banner--color-gradient {
    background: #003978 linear-gradient(to right, #003978, #0071F0);
    color: #fff; }
    .redesign-banner--color-gradient h1, .redesign-banner--color-gradient h2, .redesign-banner--color-gradient h3, .redesign-banner--color-gradient h4, .redesign-banner--color-gradient h5, .redesign-banner--color-gradient h6 {
      color: #fff; }
  .redesign-banner--color-primary-light {
    background-color: #e6e9ef; }
  .redesign-banner--color-secondary {
    background-color: #84b400;
    color: #fff; }
    .redesign-banner--color-secondary h1, .redesign-banner--color-secondary h2, .redesign-banner--color-secondary h3, .redesign-banner--color-secondary h4, .redesign-banner--color-secondary h5, .redesign-banner--color-secondary h6 {
      color: #fff; }
  .redesign-banner--color-white {
    background-color: #fff; }
  .redesign-banner.sos-init {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity .25s ease, transform .25s ease; }
  .redesign-banner.sos-visible {
    opacity: 1;
    transform: translateY(0); }
  @media only screen and (max-width: 1450px) {
    .redesign-banner {
      margin: 0 -35px; }
      .redesign-banner__text {
        padding: 75px 35px; } }
  @media only screen and (max-width: 767px) {
    .redesign-banner {
      margin: 0 -15px;
      flex-direction: column; }
      .redesign-banner__image {
        display: none; }
      .redesign-banner__mobile-image {
        display: block; }
      .redesign-banner__text {
        padding: 75px 15px 50px 15px;
        flex-basis: 100%; } }