@charset "UTF-8";
/**
 * Base Styles
 *
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 */
/* Base
/* -----------------------------*/
/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  mediaQuery
 *  box-sizing
 *  background-gradient
 *  background-size
 *  border-radius
 *  box-shadow
 *  transform
 *  transform-style
 *  transition
 *  perspective
 *  perspective-origin
 *  keyframe
 *  animation
 *  flex-flow
 *  flexbox
 *  flex
 *  order
 *
 */
.clearfix:after, .csc:after, header:after, .content:after, .scroll-hint:after, .wrapper:after, .metanavigation-tabs:after, .metanavigation-layer:after, .content .grid-100 .trail:after,
.content .grid-75 .trail:after, .sitemap:after, .content .grid-75 .downloads li:after, .content .grid-100 .downloads li:after, .content .outer-grid ul.history:after, .grid:after, .formular fieldset:after, .formular .form-input:after,
.formular .form-textarea:after,
.formular .form-checkbox:after,
.formular .form-submit:after,
.formular .form-select:after,
.formular .form-multiple-select:after,
.formular .form-radiobutton:after,
.formular .form-file:after,
.formular .form-duplicate-button:after,
.formular .csc-form-element-submit:after, .form-help-above:after, .form-grid:after, .form-step:after, .powermail_tabmenu:after, .directsearch fieldset > div:after, .directsearch:after, .mainnavigation:after, strong.logo:after, .metanavigation ul:after, ul.country-switch ul:after, .dl-menuheader:after, .sidenavigation li:after, footer:after, .description-helper-above:after {
  display: block;
  clear: both;
  content: ''; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 */
/* Vendor
/* ----------------------------- */
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
  -webkit-transform: translateZ(0); }

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020; }

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 0; }

.fancybox-opened {
  z-index: 8030; }

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }

.fancybox-outer, .fancybox-inner {
  position: relative; }

.fancybox-inner {
  overflow: hidden; }
  .fancybox-inner .csc {
    max-width: 750px;
    margin: 0 auto; }
  .fancybox-inner ul li {
    background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat;
    padding-left: 1.5em; }
  .fancybox-inner .checked {
    list-style-image: none; }
    .fancybox-inner .checked li {
      background: none;
      position: relative;
      padding-left: 25px; }
      .fancybox-inner .checked li:before {
        color: #84b400;
        position: absolute;
        left: 0;
        font-size: 20px; }
  .fancybox-inner ol li {
    font-size: 1.5em;
    line-height: 1.333333333;
    margin: 0 0 0.5em; }
  .fancybox-inner li li {
    font-size: 1em; }

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch; }

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap; }

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%; }

.fancybox-image {
  max-width: 100%;
  max-height: 100%; }

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox-ista-blue_sprite.png"); }

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060; }

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_loading.gif") center center no-repeat; }

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040; }

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url("/fileadmin/twt_customer/base/system/templates/images/fancybox/blank.gif");
  /* helps IE */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  z-index: 8040; }

.fancybox-prev {
  left: 0; }

.fancybox-next {
  right: 0; }

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden; }

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px; }

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px; }

.fancybox-nav:hover span {
  visibility: visible; }

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important; }

/* Overlay helper */
.fancybox-lock {
  overflow: hidden !important;
  width: auto; }

.fancybox-lock body {
  overflow: hidden !important; }

.fancybox-lock-test {
  overflow-y: hidden !important; }

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_overlay.png"); }

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0; }

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll; }

/* Title helper */
.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050; }

.fancybox-opened .fancybox-title {
  visibility: visible; }

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center; }

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent;
  /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap; }

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff; }

.fancybox-title-inside-wrap {
  padding-top: 10px; }

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.8); }

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox-ista-blue_sprite@2x.png");
    background-size: 44px 152px;
    /*The size of the normal image, half the size of the hi-res image*/ }
  #fancybox-loading div {
    background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox/fancybox_loading@2x.gif");
    background-size: 24px 24px;
    /*The size of the normal image, half the size of the hi-res image*/ } }

#fancybox-thumbs {
  position: fixed;
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: 8050; }

#fancybox-thumbs.bottom {
  bottom: 2px; }

#fancybox-thumbs.top {
  top: 2px; }

#fancybox-thumbs ul {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0; }

#fancybox-thumbs ul li {
  float: left;
  padding: 1px;
  opacity: 0.5; }

#fancybox-thumbs ul li.active {
  opacity: 0.75;
  padding: 0;
  border: 1px solid #fff; }

#fancybox-thumbs ul li:hover {
  opacity: 1; }

#fancybox-thumbs ul li a {
  display: block;
  position: relative;
  overflow: hidden;
  border: 1px solid #222;
  background: #111;
  outline: none; }

#fancybox-thumbs ul li img {
  display: block;
  position: relative;
  border: 0;
  padding: 0;
  max-width: none; }

#fancybox-buttons {
  position: fixed;
  left: 0;
  width: 100%;
  z-index: 8050; }

#fancybox-buttons.top {
  top: 10px; }

#fancybox-buttons.bottom {
  bottom: 10px; }

#fancybox-buttons ul {
  display: block;
  width: 166px;
  height: 30px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  border: 1px solid #111;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  background: #323232;
  background: -moz-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #444444), color-stop(50%, #343434), color-stop(50%, #292929), color-stop(100%, #333333));
  background: -webkit-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%);
  background: -o-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%);
  background: -ms-linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%);
  background: linear-gradient(top, #444444 0%, #343434 50%, #292929 50%, #333333 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#222222', GradientType=0); }

#fancybox-buttons ul li {
  float: left;
  margin: 0;
  padding: 0; }

#fancybox-buttons a {
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  background-color: transparent;
  background-image: url("/fileadmin/twt_customer/base/system/templates/images/fancybox_buttons.png");
  background-repeat: no-repeat;
  outline: none;
  opacity: 0.8; }

#fancybox-buttons a:hover {
  opacity: 1; }

#fancybox-buttons a.btnPrev {
  background-position: 5px 0; }

#fancybox-buttons a.btnNext {
  background-position: -33px 0;
  border-right: 1px solid #3e3e3e; }

#fancybox-buttons a.btnPlay {
  background-position: 0 -30px; }

#fancybox-buttons a.btnPlayOn {
  background-position: -30px -30px; }

#fancybox-buttons a.btnToggle {
  background-position: 3px -60px;
  border-left: 1px solid #111;
  border-right: 1px solid #3e3e3e;
  width: 35px; }

#fancybox-buttons a.btnToggleOn {
  background-position: -27px -60px; }

#fancybox-buttons a.btnClose {
  border-left: 1px solid #111;
  width: 35px;
  background-position: -56px 0px; }

#fancybox-buttons a.btnDisabled {
  opacity: 0.4;
  cursor: default; }

/*!
Video.js Default Styles (http://videojs.com)
Version 4.8.1
Create your own skin at http://designer.videojs.com
*/
/* SKIN
================================================================================
The main class name for all skin-specific styles. To make your own skin,
replace all occurances of 'vjs-default-skin' with a new name. Then add your new
skin name to your video tag instead of the default skin.
e.g. <video class="video-js my-skin-name">
*/
.vjs-default-skin {
  color: #cccccc; }
  .vjs-default-skin .vjs-slider {
    /* Replace browser focus hightlight with handle highlight */
    outline: 0;
    position: relative;
    cursor: pointer;
    padding: 0;
    /* background-color-with-alpha */
    background-color: #333333;
    background-color: rgba(51, 51, 51, 0.9); }
    .vjs-default-skin .vjs-slider:focus {
      /* box-shadow */
      -webkit-box-shadow: 0 0 2em #ffffff;
      -moz-box-shadow: 0 0 2em #ffffff;
      box-shadow: 0 0 2em #ffffff; }
  .vjs-default-skin .vjs-slider-handle {
    position: absolute;
    /* Needed for IE6 */
    left: 0;
    top: 0; }
    .vjs-default-skin .vjs-slider-handle:before {
      content: "\e009";
      font-family: VideoJS;
      font-size: 1em;
      line-height: 1;
      text-align: center;
      text-shadow: 0em 0em 1em #fff;
      position: absolute;
      top: 0;
      left: 0;
      /* Rotate the square icon to make a diamond */
      /* transform */
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      transform: rotate(-45deg); }
  .vjs-default-skin .vjs-control-bar {
    /* Start hidden */
    display: none;
    position: absolute;
    /* Place control bar at the bottom of the player box/video.
       If you want more margin below the control bar, add more height. */
    bottom: 0;
    /* Use left/right to stretch to 100% width of player div */
    left: 0;
    right: 0;
    /* Height includes any margin you want above or below control items */
    height: 3.0em;
    /* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, 0.7); }
  .vjs-default-skin.vjs-has-started .vjs-control-bar {
    display: block;
    /* Visibility needed to make sure things hide in older browsers too. */
    visibility: visible;
    opacity: 1;
    /* transition */
    -webkit-transition: visibility 0.1s, opacity 0.1s;
    -moz-transition: visibility 0.1s, opacity 0.1s;
    -o-transition: visibility 0.1s, opacity 0.1s;
    transition: visibility 0.1s, opacity 0.1s; }
  .vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
    display: block;
    visibility: hidden;
    opacity: 0;
    /* transition */
    -webkit-transition: visibility 1s, opacity 1s;
    -moz-transition: visibility 1s, opacity 1s;
    -o-transition: visibility 1s, opacity 1s;
    transition: visibility 1s, opacity 1s; }
  .vjs-default-skin.vjs-controls-disabled .vjs-control-bar, .vjs-default-skin.vjs-using-native-controls .vjs-control-bar, .vjs-default-skin.vjs-error .vjs-control-bar {
    display: none; }
  .vjs-default-skin .vjs-control {
    outline: none;
    position: relative;
    float: left;
    text-align: center;
    margin: 0;
    padding: 0;
    height: 3.0em;
    width: 4em; }
    .vjs-default-skin .vjs-control:before {
      font-family: VideoJS;
      font-size: 1.5em;
      line-height: 2;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      text-align: center;
      text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
    .vjs-default-skin .vjs-control:focus:before, .vjs-default-skin .vjs-control:hover:before {
      text-shadow: 0em 0em 1em #ffffff; }
    .vjs-default-skin .vjs-control:focus {
      /*  outline: 0; */
      /* keyboard-only users cannot see the focus on several of the UI elements when
      this is set to 0 */ }
  .vjs-default-skin .vjs-control-text {
    /* hide-visually */
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; }
  .vjs-default-skin .vjs-play-control {
    width: 5em;
    cursor: pointer; }
    .vjs-default-skin .vjs-play-control:before {
      content: "\e001"; }
  .vjs-default-skin.vjs-playing .vjs-play-control:before {
    content: "\e002"; }
  .vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value {
    font-size: 1.5em;
    line-height: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
  .vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content {
    width: 4em;
    left: -2em;
    list-style: none; }
  .vjs-default-skin .vjs-mute-control, .vjs-default-skin .vjs-volume-menu-button {
    cursor: pointer;
    float: right; }
  .vjs-default-skin .vjs-mute-control:before, .vjs-default-skin .vjs-volume-menu-button:before {
    content: "\e006"; }
  .vjs-default-skin .vjs-mute-control.vjs-vol-0:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
    content: "\e003"; }
  .vjs-default-skin .vjs-mute-control.vjs-vol-1:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
    content: "\e004"; }
  .vjs-default-skin .vjs-mute-control.vjs-vol-2:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
    content: "\e005"; }
  .vjs-default-skin .vjs-volume-control {
    width: 5em;
    float: right; }
  .vjs-default-skin .vjs-volume-bar {
    width: 5em;
    height: 0.6em;
    margin: 1.1em auto 0; }
  .vjs-default-skin .vjs-volume-menu-button .vjs-menu-content {
    height: 2.9em; }
  .vjs-default-skin .vjs-volume-level {
    position: absolute;
    top: 0;
    left: 0;
    height: 0.5em;
    /* assuming volume starts at 1.0 */
    width: 100%;
    background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat; }
  .vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
    width: 0.5em;
    height: 0.5em;
    /* Assumes volume starts at 1.0. If you change the size of the
       handle relative to the volume bar, you'll need to update this value
       too. */
    left: 4.5em; }
  .vjs-default-skin .vjs-volume-handle:before {
    font-size: 0.9em;
    top: -0.2em;
    left: -0.2em;
    width: 1em;
    height: 1em; }
  .vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
    width: 6em;
    left: -4em; }
  .vjs-default-skin .vjs-progress-control {
    position: absolute;
    left: 0;
    right: 0;
    width: auto;
    font-size: 0.3em;
    height: 1em;
    /* Set above the rest of the controls. */
    top: -1em;
    /* Shrink the bar slower than it grows. */
    /* transition */
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s; }
  .vjs-default-skin:hover .vjs-progress-control {
    font-size: .9em;
    /* Even though we're not changing the top/height, we need to include them in
        the transition so they're handled correctly. */
    /* transition */
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s; }
  .vjs-default-skin .vjs-progress-holder {
    height: 100%; }
    .vjs-default-skin .vjs-progress-holder .vjs-play-progress {
      position: absolute;
      display: block;
      height: 100%;
      margin: 0;
      padding: 0;
      /* updated by javascript during playback */
      width: 0;
      /* Needed for IE6 */
      left: 0;
      top: 0; }
    .vjs-default-skin .vjs-progress-holder .vjs-load-progress {
      position: absolute;
      display: block;
      height: 100%;
      margin: 0;
      padding: 0;
      /* updated by javascript during playback */
      width: 0;
      /* Needed for IE6 */
      left: 0;
      top: 0; }
      .vjs-default-skin .vjs-progress-holder .vjs-load-progress div {
        position: absolute;
        display: block;
        height: 100%;
        margin: 0;
        padding: 0;
        /* updated by javascript during playback */
        width: 0;
        /* Needed for IE6 */
        left: 0;
        top: 0; }
  .vjs-default-skin .vjs-play-progress {
    /*
      Using a data URI to create the white diagonal lines with a transparent
        background. Surprisingly works in IE8.
        Created using http://www.patternify.com
      Changing the first color value will change the bar color.
      Also using a paralax effect to make the lines move backwards.
        The -50% left position makes that happen.
    */
    background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat; }
  .vjs-default-skin .vjs-load-progress {
    background: #646464;
    background: rgba(255, 255, 255, 0.2); }
    .vjs-default-skin .vjs-load-progress div {
      background: #787878;
      background: rgba(255, 255, 255, 0.1); }
  .vjs-default-skin .vjs-seek-handle {
    width: 1.5em;
    height: 100%; }
    .vjs-default-skin .vjs-seek-handle:before {
      padding-top: 0.1em; }
  .vjs-default-skin.vjs-live .vjs-time-controls, .vjs-default-skin.vjs-live .vjs-time-divider, .vjs-default-skin.vjs-live .vjs-progress-control {
    display: none; }
  .vjs-default-skin.vjs-live .vjs-live-display {
    display: block; }
  .vjs-default-skin .vjs-live-display {
    display: none;
    font-size: 1em;
    line-height: 3em; }
  .vjs-default-skin .vjs-time-controls {
    font-size: 1em;
    /* Align vertically by making the line height the same as the control bar */
    line-height: 3em; }
  .vjs-default-skin .vjs-current-time, .vjs-default-skin .vjs-duration {
    float: left; }
  .vjs-default-skin .vjs-remaining-time {
    display: none;
    float: left; }

@media \0screen {
  .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
    content: ""; } }

.vjs-time-divider {
  float: left;
  line-height: 3em; }

.vjs-default-skin .vjs-fullscreen-control {
  width: 3.8em;
  cursor: pointer;
  float: right; }
  .vjs-default-skin .vjs-fullscreen-control:before {
    content: "\e000"; }

.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
  content: "\e00b"; }

.vjs-default-skin .vjs-big-play-button {
  left: 50%;
  margin-left: -2em;
  top: 50%;
  margin-top: -1.3em;
  font-size: 3em;
  display: block;
  z-index: 2;
  position: absolute;
  width: 4em;
  height: 2.6em;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  opacity: 1;
  /* Need a slightly gray bg so it can be seen on black backgrounds */
  /* background-color-with-alpha */
  background-color: #07141e;
  background-color: rgba(7, 20, 30, 0.7);
  border: 0.1em solid #3b4249;
  /* border-radius */
  -webkit-border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  border-radius: 0.8em;
  /* box-shadow */
  -webkit-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  -moz-box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  box-shadow: 0px 0px 1em rgba(255, 255, 255, 0.25);
  /* transition */
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s; }

.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
  /* Center it horizontally */
  left: 50%;
  margin-left: -2.1em;
  /* Center it vertically */
  top: 50%;
  margin-top: -1.4em; }

.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button, .vjs-default-skin.vjs-has-started .vjs-big-play-button, .vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
  display: none; }

.vjs-default-skin:hover .vjs-big-play-button {
  outline: 0;
  border-color: #fff;
  /* IE8 needs a non-glow hover state */
  background-color: #505050;
  background-color: rgba(50, 50, 50, 0.75);
  /* box-shadow */
  -webkit-box-shadow: 0 0 3em #ffffff;
  -moz-box-shadow: 0 0 3em #ffffff;
  box-shadow: 0 0 3em #ffffff;
  /* transition */
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -o-transition: all 0s;
  transition: all 0s; }

.vjs-default-skin .vjs-big-play-button:focus {
  outline: 0;
  border-color: #fff;
  /* IE8 needs a non-glow hover state */
  background-color: #505050;
  background-color: rgba(50, 50, 50, 0.75);
  /* box-shadow */
  -webkit-box-shadow: 0 0 3em #ffffff;
  -moz-box-shadow: 0 0 3em #ffffff;
  box-shadow: 0 0 3em #ffffff;
  /* transition */
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  -o-transition: all 0s;
  transition: all 0s; }

.vjs-default-skin .vjs-big-play-button:before {
  content: "\e001";
  font-family: VideoJS;
  /* In order to center the play icon vertically we need to set the line height
         to the same as the button height */
  line-height: 2.6em;
  text-shadow: 0.05em 0.05em 0.1em #000;
  text-align: center;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%; }

/* Big Play Button (play button at start)
--------------------------------------------------------------------------------
Positioning of the play button in the center or other corners can be done more
easily in the skin designer. http://designer.videojs.com/
*/
.vjs-error .vjs-big-play-button, .vjs-error-display {
  display: none; }

/* Error Display
--------------------------------------------------------------------------------
*/
.vjs-error .vjs-error-display {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }
  .vjs-error .vjs-error-display:before {
    content: 'X';
    font-family: Arial;
    font-size: 4em;
    color: #666666;
    /* In order to center the play icon vertically we need to set the line height
       to the same as the button height */
    line-height: 1;
    text-shadow: 0.05em 0.05em 0.1em #000;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.5em;
    width: 100%; }

.vjs-error-display div {
  position: absolute;
  bottom: 1em;
  right: 0;
  left: 0;
  font-size: 1.4em;
  text-align: center;
  padding: 3px;
  background: #000000;
  background: rgba(0, 0, 0, 0.5); }

.vjs-error-display a {
  color: #F4A460; }
  .vjs-error-display a:visited {
    color: #F4A460; }

/* Loading Spinner
--------------------------------------------------------------------------------
*/
.vjs-loading-spinner {
  /* Should be hidden by default */
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 4em;
  line-height: 1;
  width: 1em;
  height: 1em;
  margin-left: -0.5em;
  margin-top: -0.5em;
  opacity: 0.75; }

/* Show the spinner when waiting for data and seeking to a new time */
.vjs-waiting .vjs-loading-spinner, .vjs-seeking .vjs-loading-spinner {
  display: block;
  /* only animate when showing because it can be processor heavy */
  /* animation */
  -webkit-animation: spin 1.5s infinite linear;
  -moz-animation: spin 1.5s infinite linear;
  -o-animation: spin 1.5s infinite linear;
  animation: spin 1.5s infinite linear; }

/* Errors are unrecoverable without user interaction so hide the spinner */
.vjs-error .vjs-loading-spinner {
  display: none;
  /* ensure animation doesn't continue while hidden */
  /* animation */
  -webkit-animation: none;
  -moz-animation: none;
  -o-animation: none;
  animation: none; }

.vjs-default-skin .vjs-loading-spinner:before {
  content: "\e01e";
  font-family: VideoJS;
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  text-align: center;
  text-shadow: 0em 0em 0.1em #000; }

.vjs-default-skin .vjs-menu-button {
  float: right;
  cursor: pointer; }

.vjs-default-skin .vjs-menu {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0em;
  /* (Width of vjs-menu - width of button) / 2 */
  width: 0em;
  height: 0em;
  margin-bottom: 3em;
  border-left: 2em solid transparent;
  border-right: 2em solid transparent;
  border-top: 1.55em solid #000000;
  /* Same width top as ul bottom */
  border-top-color: rgba(7, 40, 50, 0.5);
  /* Same as ul background */ }

.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
  display: block;
  padding: 0;
  margin: 0;
  position: absolute;
  width: 10em;
  bottom: 1.5em;
  /* Same bottom as vjs-menu border-top */
  max-height: 15em;
  overflow: auto;
  left: -5em;
  /* Width of menu - width of button / 2 */
  /* background-color-with-alpha */
  background-color: #07141e;
  background-color: rgba(7, 20, 30, 0.7);
  /* box-shadow */
  -webkit-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
  -moz-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
  box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2); }

.vjs-default-skin .vjs-menu-button:hover .vjs-menu {
  display: block; }

.vjs-default-skin .vjs-menu-button ul li {
  list-style: none;
  margin: 0;
  padding: 0.3em 0 0.3em 0;
  line-height: 1.4em;
  font-size: 1.2em;
  text-align: center;
  text-transform: lowercase; }
  .vjs-default-skin .vjs-menu-button ul li.vjs-selected {
    background-color: #000; }
  .vjs-default-skin .vjs-menu-button ul li:focus, .vjs-default-skin .vjs-menu-button ul li:hover {
    outline: 0;
    color: #111;
    /* background-color-with-alpha */
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.75);
    /* box-shadow */
    -webkit-box-shadow: 0 0 1em #ffffff;
    -moz-box-shadow: 0 0 1em #ffffff;
    box-shadow: 0 0 1em #ffffff; }
  .vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
    outline: 0;
    color: #111;
    /* background-color-with-alpha */
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.75);
    /* box-shadow */
    -webkit-box-shadow: 0 0 1em #ffffff;
    -moz-box-shadow: 0 0 1em #ffffff;
    box-shadow: 0 0 1em #ffffff; }
  .vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
    text-align: center;
    text-transform: uppercase;
    font-size: 1em;
    line-height: 2em;
    padding: 0;
    margin: 0 0 0.3em 0;
    font-weight: bold;
    cursor: default; }

.vjs-default-skin .vjs-subtitles-button:before {
  content: "\e00c"; }

.vjs-default-skin .vjs-captions-button:before {
  content: "\e008"; }

.vjs-default-skin .vjs-chapters-button:before {
  content: "\e00c"; }

.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content {
  width: 24em;
  left: -12em; }

.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before, .vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
  /* box-shadow */
  -webkit-box-shadow: 0 0 1em #ffffff;
  -moz-box-shadow: 0 0 1em #ffffff;
  box-shadow: 0 0 1em #ffffff; }

@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg); } }

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(359deg); } }

@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg); }
  100% {
    -o-transform: rotate(359deg); } }

@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(359deg); } }

/* Menu Buttons (Captions/Subtitles/etc.)
--------------------------------------------------------------------------------
*/
/* Button Pop-up Menu */
/* Subtitles Button */
/* Captions Button */
/* Chapters Button */
/* Replacement for focus outline */
/*
REQUIRED STYLES (be careful overriding)
================================================================================
When loading the player, the video tag is replaced with a DIV,
that will hold the video tag or object tag for other playback methods.
The div contains the video playback element (Flash or HTML5) and controls,
and sets the width and height of the video.

** If you want to add some kind of border/padding (e.g. a frame), or special
positioning, use another containing element. Otherwise you risk messing up
control positioning and full window mode. **
*/
.video-js {
  background-color: #000;
  position: relative;
  padding: 0;
  /* Start with 10px for base font size so other dimensions can be em based and
     easily calculable. */
  font-size: 10px;
  /* Allow poster to be vertially aligned. */
  vertical-align: middle;
  /*  display: table-cell; */
  /*This works in Safari but not Firefox.*/
  /* Provide some basic defaults for fonts */
  font-weight: normal;
  font-style: normal;
  /* Avoiding helvetica: issue #376 */
  font-family: Arial, sans-serif;
  /* Turn off user selection (text highlighting) by default.
     The majority of player components will not be text blocks.
     Text areas will need to turn user selection back on. */
  /* user-select */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .video-js .vjs-tech {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .video-js:-moz-full-screen {
    position: absolute; }

/* Fullscreen Styles */
body.vjs-full-window {
  padding: 0;
  margin: 0;
  height: 100%;
  /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
  overflow-y: auto; }

.video-js.vjs-fullscreen {
  position: fixed;
  overflow: hidden;
  z-index: 1000;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  /* IE6 full-window (underscore hack) */
  _position: absolute; }

.video-js:-webkit-full-screen {
  width: 100% !important;
  height: 100% !important; }

.video-js.vjs-fullscreen.vjs-user-inactive {
  cursor: none; }

/* Poster Styles */
.vjs-poster {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }
  .vjs-poster img {
    display: block;
    margin: 0 auto;
    max-height: 100%;
    padding: 0;
    width: 100%; }

/* Hide the poster when native controls are used otherwise it covers them */
.video-js.vjs-using-native-controls .vjs-poster {
  display: none; }

.video-js .vjs-text-track-display {
  text-align: center;
  position: absolute;
  bottom: 4em;
  /* Leave padding on left and right */
  left: 1em;
  right: 1em; }

.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
  bottom: 1em; }

.video-js .vjs-text-track {
  display: none;
  font-size: 1.4em;
  text-align: center;
  margin-bottom: 0.1em;
  /* Transparent black background, or fallback to all black (oldIE) */
  /* background-color-with-alpha */
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.5); }

.video-js .vjs-subtitles {
  color: white; }

.video-js .vjs-captions {
  color: #ffcc66; }

/* Text Track Styles */
/* Overall track holder for both captions and subtitles */
/* Move captions down when controls aren't being shown */
/* Individual tracks */
.vjs-tt-cue {
  display: block; }

/* Hide disabled or unsupported controls */
.vjs-default-skin .vjs-hidden {
  display: none; }

.vjs-lock-showing {
  display: block !important;
  opacity: 1;
  visibility: visible; }

/*  In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
    The .video-js classname on the video tag also isn't considered.
    This optional paragraph inside the video tag can provide a message to users
    about what's required to play video. */
.vjs-no-js {
  padding: 20px;
  color: #ccc;
  background-color: #333;
  font-size: 18px;
  font-family: Arial, sans-serif;
  text-align: center;
  width: 300px;
  height: 150px;
  margin: 0px auto; }
  .vjs-no-js a {
    color: #F4A460; }
    .vjs-no-js a:visited {
      color: #F4A460; }

/* -----------------------------------------------------------------------------
The original source of this file lives at
https://github.com/videojs/video.js/blob/master/src/css/video-js.less */
/* Layout
/* ----------------------------- */
/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Reset
 *
 */
html, body {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0; }

html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased; }

img {
  -ms-interpolation-mode: bicubic; }

div, span, object, iframe, noscript,
h1, h2, h3, h4, h5, h6,
p, blockquote, q, br, hr,
a, abbr, acronym, address, cite,
del, em, i, img, a img, ins,
small, strong, b, sub, sup, mark,
pre, code, dfn, kbd, samp, tt, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0; }

details,
figcaption,
summary,
nav,
header,
footer,
main,
section,
aside,
article,
figure,
video,
audio,
canvas {
  display: block;
  margin: 0;
  padding: 0;
  border: 0; }

video,
audio {
  display: inline-block; }

small {
  font-size: 0.8em; }

ins {
  text-decoration: none;
  border-bottom: 1px dashed;
  padding-bottom: 0.1em; }

legend {
  color: #000; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

blockquote, q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before, q:after {
  content: "";
  content: none; }

sup, sub {
  vertical-align: baseline;
  position: relative;
  top: -0.3em;
  font-size: 0.8em; }

sub {
  top: 0.3em; }

input,
textarea,
select,
button {
  font-weight: normal;
  font-family: inherit;
  font-size: 100%; }

button,
select {
  text-transform: none; }

textarea {
  overflow: auto;
  vertical-align: top; }

input[type=submit],
input[type=reset],
input[type=button],
input[type=image],
button,
select,
.pointer {
  cursor: pointer;
  -webkit-font-smoothing: antialiased; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled],
html input[disabled] {
  cursor: default; }

abbr[title],
acronym[title] {
  cursor: help; }

pre, code, kbd, samp {
  font-family: monospace, sans-serif;
  white-space: pre-wrap; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Typo3 basics
 *
 */
/* > Textausrichtungen, wie sie in Typo3 verwendet werden */
/* rechtsbuendiger Text */
.align-right {
  text-align: right; }

/* zentrierter Text */
.align-center {
  text-align: center; }

/* eingerueckter Text */
.indent {
  margin-left: 25px; }

/* > Bildervorlagen, wie sie in Typo3 verwendet werden */
/* Bilder im Text */
.image-wrapper {
  float: left;
  max-width: 100%;
  margin: 0 0 10px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .image-wrapper a {
    display: block; }

.enlarge-image .image-wrapper img {
  margin-bottom: 0; }

.left-image,
.intext-left-image {
  float: left; }

.right-image,
.intext-right-image {
  float: right; }

.left-image,
.right-image,
.intext-right-image,
.intext-left-image {
  max-width: 30%; }
  .grid-75 > .csc .left-image, .grid-75 > .csc
  .right-image, .grid-75 > .csc
  .intext-right-image, .grid-75 > .csc
  .intext-left-image {
    max-width: 33%; }

/* nicht floatende Bilder */
.abovecenter-image,
.aboveleft-image,
.aboveright-image,
.intext-left-image,
.intext-right-image {
  margin: 0 0 10px 0; }

.content .abovecenter-image {
  display: table;
  margin: 0 auto; }

.abovecenter-image .image-wrapper {
  float: left; }

.intext-left-image .image-wrapper,
.grid-75 .left-image .image-wrapper {
  padding-right: 20px; }

.intext-right-image .image-wrapper,
.aboveright-image .image-wrapper,
.right-image .image-wrapper {
  padding-left: 20px;
  padding-right: 0; }

.aboveright-image .image-wrapper {
  float: right; }

/* Enlarge Images */
.fancybox,
.fancybox:link,
.fancybox:visited,
.fancybox:hover,
.fancybox:focus,
.fancybox:active {
  text-decoration: none;
  position: relative;
  line-height: 1; }

.fancybox span {
  position: absolute;
  right: 5px;
  bottom: 5px;
  display: block;
  color: #3e3e3e; }
  .fancybox span:before {
    font-size: 1.6em; }

p {
  margin: 0 0 25px 0; }

/* p als Caption */
.left-image p,
.right-image p,
.intext-left-image p,
.intext-right-image p,
.abovecenter-image p,
.aboveleft-image p,
.aboveright-image p {
  margin: 15px 0 0 0;
  font-size: 1.1em; }

.csc {
  position: relative; }

.button-wrapper a.buttonlink {
  margin-bottom: 0; }

/* > teaser */
.grid-20 .aboveleft-image .image-wrapper,
.grid-25 .aboveleft-image .image-wrapper,
.grid-33 .aboveleft-image .image-wrapper,
.grid-50 .aboveleft-image .image-wrapper,
.grid-66 .aboveleft-image .image-wrapper,
.grid-75 .aboveleft-image .image-wrapper {
  margin-right: 0; }

/* > Verhalten der Standardcontent Elemente innerhalb der Grids */
.outer-grid .grid .abovecenter-image {
  margin-bottom: 10px; }
  .outer-grid .grid .abovecenter-image + .content-wrapper {
    text-align: center;
    padding-top: 0; }
  .outer-grid .grid .abovecenter-image ~ .button-wrapper {
    text-align: center;
    width: 100%; }

.outer-grid .grid .grid-20,
.outer-grid .grid .grid-25,
.outer-grid .grid .grid-33,
.outer-grid .grid .grid-50 {
  position: relative;
  background: #fff; }
  .outer-grid .grid .grid-20 .image-wrapper,
  .outer-grid .grid .grid-25 .image-wrapper,
  .outer-grid .grid .grid-33 .image-wrapper,
  .outer-grid .grid .grid-50 .image-wrapper {
    margin-bottom: 0; }
    .outer-grid .grid .grid-20 .image-wrapper img,
    .outer-grid .grid .grid-25 .image-wrapper img,
    .outer-grid .grid .grid-33 .image-wrapper img,
    .outer-grid .grid .grid-50 .image-wrapper img {
      display: block; }
  .outer-grid .grid .grid-20 .content-wrapper,
  .outer-grid .grid .grid-25 .content-wrapper,
  .outer-grid .grid .grid-33 .content-wrapper,
  .outer-grid .grid .grid-50 .content-wrapper {
    margin-bottom: 50px;
    padding-bottom: 50px; }
  .outer-grid .grid .grid-20 .button-wrapper,
  .outer-grid .grid .grid-25 .button-wrapper,
  .outer-grid .grid .grid-33 .button-wrapper,
  .outer-grid .grid .grid-50 .button-wrapper {
    position: absolute;
    bottom: 0; }
  .outer-grid .grid .grid-20 .intext-left-image + .content-wrapper,
  .outer-grid .grid .grid-20 .intext-right-image + .content-wrapper,
  .outer-grid .grid .grid-20 .left-image + .content-wrapper,
  .outer-grid .grid .grid-20 .right-image + .content-wrapper,
  .outer-grid .grid .grid-25 .intext-left-image + .content-wrapper,
  .outer-grid .grid .grid-25 .intext-right-image + .content-wrapper,
  .outer-grid .grid .grid-25 .left-image + .content-wrapper,
  .outer-grid .grid .grid-25 .right-image + .content-wrapper,
  .outer-grid .grid .grid-33 .intext-left-image + .content-wrapper,
  .outer-grid .grid .grid-33 .intext-right-image + .content-wrapper,
  .outer-grid .grid .grid-33 .left-image + .content-wrapper,
  .outer-grid .grid .grid-33 .right-image + .content-wrapper,
  .outer-grid .grid .grid-50 .intext-left-image + .content-wrapper,
  .outer-grid .grid .grid-50 .intext-right-image + .content-wrapper,
  .outer-grid .grid .grid-50 .left-image + .content-wrapper,
  .outer-grid .grid .grid-50 .right-image + .content-wrapper {
    margin-bottom: 30px; }
  .outer-grid .grid .grid-20 .intext-left-image ~ .button-wrapper,
  .outer-grid .grid .grid-20 .intext-right-image ~ .button-wrapper,
  .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .intext-left-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .intext-right-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .intext-left-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .intext-right-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .intext-left-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .intext-right-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
    position: static; }
  @media only screen and (max-width: 767px) {
    .outer-grid .grid .grid-20,
    .outer-grid .grid .grid-25,
    .outer-grid .grid .grid-33,
    .outer-grid .grid .grid-50 {
      margin-bottom: 20px; } }
  .outer-grid .grid .grid-20 .left-image .image-wrapper,
  .outer-grid .grid .grid-20 .right-image .image-wrapper,
  .outer-grid .grid .grid-25 .left-image .image-wrapper,
  .outer-grid .grid .grid-25 .right-image .image-wrapper,
  .outer-grid .grid .grid-33 .left-image .image-wrapper,
  .outer-grid .grid .grid-33 .right-image .image-wrapper,
  .outer-grid .grid .grid-50 .left-image .image-wrapper,
  .outer-grid .grid .grid-50 .right-image .image-wrapper {
    margin: 0; }
  .outer-grid .grid .grid-20 .left-image + .content-wrapper,
  .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-20 .right-image + .content-wrapper,
  .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .left-image + .content-wrapper,
  .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .right-image + .content-wrapper,
  .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .left-image + .content-wrapper,
  .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .right-image + .content-wrapper,
  .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .left-image + .content-wrapper,
  .outer-grid .grid .grid-50 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .right-image + .content-wrapper,
  .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    max-width: 70%;
    width: 100%;
    padding: 0 20px; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid .grid-20 .left-image + .content-wrapper,
      .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-20 .right-image + .content-wrapper,
      .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .left-image + .content-wrapper,
      .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .right-image + .content-wrapper,
      .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .left-image + .content-wrapper,
      .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .right-image + .content-wrapper,
      .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .left-image + .content-wrapper,
      .outer-grid .grid .grid-50 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .right-image + .content-wrapper,
      .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
        width: 100%;
        max-width: 100%;
        padding: 0 15px; } }
  .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
    margin-bottom: 20px; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
        margin-bottom: 15px; } }
  .outer-grid .grid .grid-20 .left-image + .content-wrapper,
  .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .left-image + .content-wrapper,
  .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .left-image + .content-wrapper,
  .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .left-image + .content-wrapper,
  .outer-grid .grid .grid-50 .left-image ~ .button-wrapper {
    float: right;
    padding-top: 0; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid .grid-20 .left-image + .content-wrapper,
      .outer-grid .grid .grid-20 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .left-image + .content-wrapper,
      .outer-grid .grid .grid-25 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .left-image + .content-wrapper,
      .outer-grid .grid .grid-33 .left-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .left-image + .content-wrapper,
      .outer-grid .grid .grid-50 .left-image ~ .button-wrapper {
        padding-left: 0; } }
  .outer-grid .grid .grid-20 .right-image + .content-wrapper,
  .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-25 .right-image + .content-wrapper,
  .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-33 .right-image + .content-wrapper,
  .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
  .outer-grid .grid .grid-50 .right-image + .content-wrapper,
  .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
    float: left;
    padding-top: 0;
    padding-right: 20px; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid .grid-20 .right-image + .content-wrapper,
      .outer-grid .grid .grid-20 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-25 .right-image + .content-wrapper,
      .outer-grid .grid .grid-25 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-33 .right-image + .content-wrapper,
      .outer-grid .grid .grid-33 .right-image ~ .button-wrapper,
      .outer-grid .grid .grid-50 .right-image + .content-wrapper,
      .outer-grid .grid .grid-50 .right-image ~ .button-wrapper {
        padding-right: 0; } }
  .outer-grid .grid .grid-20 .aboveleft-image, .outer-grid .grid .grid-20 .abovecenter-image,
  .outer-grid .grid .grid-25 .aboveleft-image,
  .outer-grid .grid .grid-25 .abovecenter-image,
  .outer-grid .grid .grid-33 .aboveleft-image,
  .outer-grid .grid .grid-33 .abovecenter-image,
  .outer-grid .grid .grid-50 .aboveleft-image,
  .outer-grid .grid .grid-50 .abovecenter-image {
    display: block; }
    .outer-grid .grid .grid-20 .aboveleft-image .image-wrapper, .outer-grid .grid .grid-20 .abovecenter-image .image-wrapper,
    .outer-grid .grid .grid-25 .aboveleft-image .image-wrapper,
    .outer-grid .grid .grid-25 .abovecenter-image .image-wrapper,
    .outer-grid .grid .grid-33 .aboveleft-image .image-wrapper,
    .outer-grid .grid .grid-33 .abovecenter-image .image-wrapper,
    .outer-grid .grid .grid-50 .aboveleft-image .image-wrapper,
    .outer-grid .grid .grid-50 .abovecenter-image .image-wrapper {
      min-width: 100%; }
      .outer-grid .grid .grid-20 .aboveleft-image .image-wrapper img, .outer-grid .grid .grid-20 .abovecenter-image .image-wrapper img,
      .outer-grid .grid .grid-25 .aboveleft-image .image-wrapper img,
      .outer-grid .grid .grid-25 .abovecenter-image .image-wrapper img,
      .outer-grid .grid .grid-33 .aboveleft-image .image-wrapper img,
      .outer-grid .grid .grid-33 .abovecenter-image .image-wrapper img,
      .outer-grid .grid .grid-50 .aboveleft-image .image-wrapper img,
      .outer-grid .grid .grid-50 .abovecenter-image .image-wrapper img {
        min-width: 100%; }
    .outer-grid .grid .grid-20 .aboveleft-image + .content-wrapper, .outer-grid .grid .grid-20 .abovecenter-image + .content-wrapper,
    .outer-grid .grid .grid-25 .aboveleft-image + .content-wrapper,
    .outer-grid .grid .grid-25 .abovecenter-image + .content-wrapper,
    .outer-grid .grid .grid-33 .aboveleft-image + .content-wrapper,
    .outer-grid .grid .grid-33 .abovecenter-image + .content-wrapper,
    .outer-grid .grid .grid-50 .aboveleft-image + .content-wrapper,
    .outer-grid .grid .grid-50 .abovecenter-image + .content-wrapper {
      padding-top: 0; }

@media screen and (max-width: 600px) {
  .right-image, .left-image {
    display: none; } }

.image-wrapper {
  position: relative; }
  @media only screen and (max-width: 767px) {
    .image-wrapper {
      margin-right: 0; } }

.grid-75 .csc .left-image + .content-wrapper,
.grid-75 .csc .left-image ~ .button-wrapper,
.grid-75 .csc .right-image + .content-wrapper,
.grid-75 .csc .right-image ~ .button-wrapper {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  max-width: 66%; }
  @media screen and (max-width: 600px) {
    .grid-75 .csc .left-image + .content-wrapper,
    .grid-75 .csc .left-image ~ .button-wrapper,
    .grid-75 .csc .right-image + .content-wrapper,
    .grid-75 .csc .right-image ~ .button-wrapper {
      width: 100%;
      max-width: 100%; } }

.grid-75 .csc .left-image ~ .button-wrapper,
.grid-75 .csc .right-image ~ .button-wrapper {
  clear: both; }

/*"fake headline" for meta navigation (seo purposes). See ISTATYPO-478*/
span.metanavigation-headline {
  font-size: 2.7em;
  color: #0a2864;
  padding: 0 15px;
  padding-right: 35px;
  line-height: 1.1111111;
  margin-bottom: 10px;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-weight: normal;
  display: block; }
  @media screen and (max-width: 767px) {
    span.metanavigation-headline {
      font-size: 24px; } }

.userroles .grid-20,
.teaser-slider-primarycolor .grid-33 {
  margin-bottom: 20px;
  position: relative; }
  .userroles .grid-20:last-child,
  .teaser-slider-primarycolor .grid-33:last-child {
    margin-bottom: 0; }
  .userroles .grid-20 a,
  .teaser-slider-primarycolor .grid-33 a {
    display: block;
    text-decoration: none; }
    .userroles .grid-20 a:hover,
    .teaser-slider-primarycolor .grid-33 a:hover {
      opacity: 0.9; }
  .userroles .grid-20 .image-wrapper, .userroles .grid-20 img,
  .teaser-slider-primarycolor .grid-33 .image-wrapper,
  .teaser-slider-primarycolor .grid-33 img {
    margin-bottom: 0;
    width: 100%; }
  .userroles .grid-20 .csc .aboveleft-image,
  .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image {
    margin-bottom: -3px; }
  .userroles .grid-20 .csc .aboveleft-image + .content-wrapper,
  .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper {
    background: rgba(132, 180, 0, 0.9);
    color: #fff;
    width: 100%;
    position: absolute;
    padding-bottom: 0;
    margin-bottom: 0;
    bottom: 0;
    height: 53px; }
    .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before,
    .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before {
      bottom: 10px;
      font-size: 1.5em;
      float: right;
      position: absolute;
      right: 10px; }
    .userroles .grid-20 .csc .aboveleft-image + .content-wrapper p,
    .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper p {
      font-family: "TheSansBold", Arial, Verdana, sans-serif;
      font-size: 1.6em;
      position: absolute;
      bottom: 8px;
      left: 13px;
      margin: 0;
      display: block;
      max-width: 80%; }
  .userroles .grid-20 .csc .button-wrapper,
  .teaser-slider-primarycolor .grid-33 .csc .button-wrapper {
    display: none; }

.teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper {
  background: rgba(10, 40, 100, 0.9);
  padding: 5px 13px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper > * {
    color: #fff; }
  .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h1, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h2, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h3, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h4, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h5, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper h6, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper p, .teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper div.looks_like_a_headline {
    position: relative;
    display: block;
    left: auto;
    bottom: auto;
    font-size: 1.6em;
    margin-bottom: 0; }

@media only screen and (max-width: 767px) {
  .metanavigation-layer div.userroles {
    margin-bottom: 0; } }

.metanavigation-layer div.userroles h2, .metanavigation-layer div.userroles h3, .metanavigation-layer div.userroles div.looks_like_a_headline {
  color: #fff;
  padding-left: 15px; }

@media only screen and (max-width: 767px) {
  .metanavigation-layer div.userroles h2, .metanavigation-layer div.userroles h3, .metanavigation-layer div.userroles div.looks_like_a_headline {
    padding-left: 0; }
  .metanavigation-layer div.userroles > div {
    max-width: 75%;
    width: 100%;
    margin-bottom: 0; }
  .metanavigation-layer div.userroles .csc .aboveleft-image + .content-wrapper {
    position: static; }
  .metanavigation-layer div.userroles .image-wrapper img {
    display: none; } }

.content .outer-grid div.grid-100 > div.userroles,
.content .outer-grid div.grid-100 > div.teaser-slider-33,
.content .outer-grid div.grid-75 > div.teaser-slider-33,
.content .outer-grid div.grid-100 > div.teaser-slider-25,
.content .outer-grid div.grid-75 > div.teaser-slider-25 {
  display: block; }
  .content .outer-grid div.grid-100 > div.userroles > div,
  .content .outer-grid div.grid-100 > div.teaser-slider-33 > div,
  .content .outer-grid div.grid-75 > div.teaser-slider-33 > div,
  .content .outer-grid div.grid-100 > div.teaser-slider-25 > div,
  .content .outer-grid div.grid-75 > div.teaser-slider-25 > div {
    float: none; }

/* > Bild neben Text Element */
.outer-grid .grid[style*="background-image"] {
  width: 100%;
  padding: 30px 24px 45px 30px;
  background-size: cover;
  background-repeat: no-repeat; }
  @media only screen and (max-width: 767px) {
    .outer-grid .grid[style*="background-image"] {
      padding: 0; } }
  .outer-grid .grid[style*="background-image"] > h1,
  .outer-grid .grid[style*="background-image"] > h2,
  .outer-grid .grid[style*="background-image"] > h3,
  .outer-grid .grid[style*="background-image"] > h4,
  .outer-grid .grid[style*="background-image"] > h5,
  .outer-grid .grid[style*="background-image"] > h6,
  .outer-grid .grid[style*="background-image"] div.looks_like_a_headline {
    padding: 0; }
  .outer-grid .grid[style*="background-image"] .button-wrapper {
    margin-bottom: 15px; }
  @media only screen and (max-width: 1023px) {
    .outer-grid .grid[style*="background-image"] .grid-66 {
      padding-right: 5px; } }
  .outer-grid .grid[style*="background-image"] .grid-empty {
    background: none; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid[style*="background-image"] .grid-empty {
        display: none; } }
  .outer-grid .grid[style*="background-image"] .grid-66,
  .outer-grid .grid[style*="background-image"] .grid-33 {
    background: #fff;
    padding: 30px 30px 15px 30px; }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid[style*="background-image"] .grid-66,
      .outer-grid .grid[style*="background-image"] .grid-33 {
        padding: 0 15px; } }
    .outer-grid .grid[style*="background-image"] .grid-66.grid-empty,
    .outer-grid .grid[style*="background-image"] .grid-33.grid-empty {
      background: none; }
      @media only screen and (max-width: 767px) {
        .outer-grid .grid[style*="background-image"] .grid-66.grid-empty,
        .outer-grid .grid[style*="background-image"] .grid-33.grid-empty {
          display: none; } }
    @media only screen and (max-width: 767px) {
      .outer-grid .grid[style*="background-image"] .grid-66,
      .outer-grid .grid[style*="background-image"] .grid-33 {
        width: 100%; } }
  @media only screen and (max-width: 767px) {
    .outer-grid .grid[style*="background-image"] {
      background: none !important;
      /* Important notwendig um den durch das CMS gesetzten Inline-Style zu ueberschreiben */ } }

.outer-grid .grid .enlarge-image img {
  width: 270px; }
  @media screen and (max-width: 600px) {
    .outer-grid .grid .enlarge-image img {
      display: none; } }

.outer-grid .csc .content-wrapper {
  margin-bottom: 30px; }
  .outer-grid .csc .content-wrapper:last-child {
    padding-bottom: 0;
    margin-bottom: 0; }
  .outer-grid .csc .content-wrapper *:last-child {
    margin-bottom: 0; }

.grid.grid-background > div[class*="grid-"] .content-wrapper {
  padding: 30px 30px 20px 30px; }

.grid.grid-background > div[class*="grid-"] .button-wrapper {
  padding: 0 30px 20px 30px; }

.outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) div[class*="grid-"] .csc div[class*="above"] ~ .button-wrapper {
  margin-bottom: 0; }

.grid.grid-background > div[class*="grid-"] .csc .accordion {
  margin: 0 30px 20px 30px;
  padding-top: 30px; }

@media (max-width: 321px) {
  .hide-mobile {
    display: none; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Template
 *
 */
/* Base
/* -----------------------------*/
body {
  background: #fff;
  color: #3e3e3e;
  /* 62.5% = 10px, line-height 1.2 = 120% = 12px */
  font: 62.5%/1.2 Arial, Verdana, sans-serif;
  word-wrap: break-word; }

h1 a:link,
h1 a:active,
h1 a:visited, h2 a:link,
h2 a:active,
h2 a:visited, h3 a:link,
h3 a:active,
h3 a:visited, h4 a:link,
h4 a:active,
h4 a:visited, h5 a:link,
h5 a:active,
h5 a:visited, h6 a:link,
h6 a:active,
h6 a:visited, div.looks_like_a_headline a:link,
div.looks_like_a_headline a:active,
div.looks_like_a_headline a:visited {
  text-decoration: none;
  color: #0a2864; }

h1 a:hover,
h1 a:focus, h2 a:hover,
h2 a:focus, h3 a:hover,
h3 a:focus, h4 a:hover,
h4 a:focus, h5 a:hover,
h5 a:focus, h6 a:hover,
h6 a:focus, div.looks_like_a_headline a:hover,
div.looks_like_a_headline a:focus {
  color: #84b400; }

h1, h2, h4, h5, div.looks_like_a_headline {
  margin-bottom: 10px;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-weight: normal;
  color: #0a2864; }

h1 {
  font-size: 2.9em;
  line-height: 1.241379; }
  @media only screen and (max-width: 767px) {
    h1 {
      font-size: 2.4em;
      line-height: 1.125; } }

h2, div.looks_like_a_headline {
  font-size: 2.7em;
  line-height: 1.1111111; }
  @media only screen and (max-width: 767px) {
    h2, div.looks_like_a_headline {
      font-size: 2.4em;
      line-height: 1.125; } }

h3 {
  font-size: 2.2em;
  line-height: 1.18181818;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-weight: normal;
  color: #84b400; }

h4 {
  font-size: 1.8em; }

h5 {
  font-size: 1.5em;
  line-height: 1.333333333; }

h6 {
  font-size: 1.5em;
  font-weight: normal;
  line-height: 1.333333333;
  color: #3e3e3e; }

p {
  font-size: 1.5em;
  line-height: 1.333333333;
  margin: 0 0 1em 0; }

img {
  max-width: 100%;
  height: auto; }

dt {
  font-weight: bold; }

ul,
dl {
  margin-bottom: 1em;
  list-style: none;
  font-size: 1.5em;
  padding-left: 17px; }
  ul ul,
  ul ol,
  dl ul,
  dl ol {
    margin-bottom: 0;
    font-size: 1em; }

@media screen and (min-width: 1024px) {
  .no-touch .has-mediastage .content {
    position: relative;
    top: -43px;
    margin-bottom: -43px; } }

.content .grid-75 ul li ul li,
.content .grid-100 ul li ul li,
.content ul li ul li {
  font-size: 1.0em; }

blockquote {
  margin: 35px 0 35px 0;
  padding-left: 60px;
  position: relative;
  font-size: 1.5em;
  color: #6c7ea2; }
  blockquote p {
    font-size: 1em; }
  blockquote:before {
    content: '”';
    position: absolute;
    top: -20px;
    left: 20px;
    font-size: 7em;
    color: #ced4e0; }

/* Links */
a:link, a:visited, a:active {
  color: #3e3e3e; }

a:hover, a:focus {
  color: #84b400; }

a[name], a:hover[name], a.name {
  color: inherit;
  text-decoration: none; }

th a:link,
tfoot a:link {
  color: #fff; }

/* Buttons */
.buttonlink, .formular .form-input-tsr input,
.formular .form-input-tb input,
.formular .form-button button, button {
  background: #0a2864;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-size: 1.4em;
  padding: 10px 20px;
  text-decoration: none;
  color: #fff;
  line-height: 1.2;
  border: none;
  margin: 0 0 15px;
  display: inline-block; }
  p .buttonlink, p .formular .form-input-tsr input, .formular .form-input-tsr p input,
  p .formular .form-input-tb input, .formular .form-input-tb p input,
  p .formular .form-button button, .formular .form-button p button, p button {
    font-size: 1em;
    margin-bottom: 0; }
  .buttonlink:hover, .formular .form-input-tsr input:hover,
  .formular .form-input-tb input:hover,
  .formular .form-button button:hover, button:hover {
    background: #84b400; }

.buttonlink:link, .formular .form-input-tsr input:link,
.formular .form-input-tb input:link,
.formular .form-button button:link, .buttonlink:visited, .formular .form-input-tsr input:visited,
.formular .form-input-tb input:visited,
.formular .form-button button:visited, .buttonlink:active, .formular .form-input-tsr input:active,
.formular .form-input-tb input:active,
.formular .form-button button:active, button:link, button:visited, button:active {
  color: white; }

.content button, .content .buttonlink, .content .formular .form-input-tsr input, .formular .form-input-tsr .content input,
.content .formular .form-input-tb input, .formular .form-input-tb .content input,
.content .formular .form-button button, .formular .form-button .content button {
  position: relative;
  padding: 10px 31px 10px 20px; }
  .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before,
  .content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before,
  .content .formular .form-button button:before, .formular .form-button .content button:before {
    position: absolute;
    right: 12px;
    top: 50%;
    margin-top: -7px;
    float: right; }

/* > header = Kopfbereich der Seite */
@media only screen and (min-width: 1024px) {
  header {
    background: #0a2864; } }

@media only screen and (max-width: 1023px) {
  header {
    border-bottom: 3px solid #0a2864; } }

/* Helper
/* -----------------------------*/
.clear {
  clear: both;
  margin: -1px 0 0 0;
  /* laesst 1px clear nach oben verschwinden */
  height: 0;
  /* laesst auf 1px schrumpfen fuer IE */
  font-size: 0;
  line-height: 0;
  width: 100%; }

/* entspricht im wesentlichen display:none;, ist aber screenreaderfreundlich */
.ahem {
  position: absolute;
  overflow: hidden;
  height: 0;
  width: 0;
  left: -200em;
  top: -200em; }

/* clearfix */
.clearfix:after, .csc:after, header:after, .content:after, .scroll-hint:after, .wrapper:after, .metanavigation-tabs:after, .metanavigation-layer:after, .content .grid-100 .trail:after,
.content .grid-75 .trail:after, .sitemap:after, .content .grid-75 .downloads li:after, .content .grid-100 .downloads li:after, .content .outer-grid ul.history:after, .grid:after, .formular fieldset:after, .formular .form-input:after,
.formular .form-textarea:after,
.formular .form-checkbox:after,
.formular .form-submit:after,
.formular .form-select:after,
.formular .form-multiple-select:after,
.formular .form-radiobutton:after,
.formular .form-file:after,
.formular .form-duplicate-button:after,
.formular .csc-form-element-submit:after, .form-help-above:after, .form-grid:after, .form-step:after, .powermail_tabmenu:after, .directsearch fieldset > div:after, .directsearch:after, .mainnavigation:after, strong.logo:after, .metanavigation ul:after, ul.country-switch ul:after, .dl-menuheader:after, .sidenavigation li:after, footer:after, .description-helper-above:after {
  content: "";
  display: table;
  clear: both; }

/* einspaltig */
.content {
  position: relative;
  width: 100%;
  overflow: hidden;
  min-height: 600px; }
  @media only screen and (max-width: 767px) {
    .content {
      min-height: 300px; } }

h1, h2, h3, h4, h5, h6,
div.looks_like_a_headline,
.visual-text p,
.grid-20 .content-wrapper p,
.mainnavigation a,
.sidenavigation a,
.dl-menu a {
  word-wrap: break-word;
  overflow-wrap: break-word; }

/* > content = (Haupt)inhaltsbereich der Seite, fancyboxinhalte */
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6, .content div.looks_like_a_headline {
  margin-left: 0; }

.content .content-wrapper h1, .content .content-wrapper h2, .content .content-wrapper h3, .content .content-wrapper h4, .content .content-wrapper h5, .content .content-wrapper h6, .content .content-wrapper div.looks_like_a_headline {
  margin-left: 0; }

.content h1 {
  margin-bottom: 13px; }

.content h2,
.content div.looks_like_a_headline {
  margin-bottom: 22px; }

.content h3 {
  margin-bottom: 15px; }

.content .grid-75 ul,
.content .grid-100 ul,
.visual-wrapper .grid ul {
  margin: 0;
  padding-left: 0;
  font-size: 1em; }
  .content .grid-75 ul li,
  .content .grid-100 ul li,
  .visual-wrapper .grid ul li {
    background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat;
    font-size: 1.5em;
    margin: 0 0 0.5em 0;
    line-height: 1.33333;
    padding-left: 1.5em; }

iframe {
  width: 100%;
  max-width: 100%;
  margin-bottom: 2em;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translate3d(0, 0, 0); }

a.editlink {
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_edit.png) left center no-repeat;
  background-size: 14px;
  padding: 5px 0 4px 20px;
  margin-bottom: 20px;
  font-size: 1.5em;
  color: #0a2864;
  display: inline-block; }
  a.editlink:hover {
    text-decoration: none; }

.small-hint {
  font-size: 1.1em; }
  .table-wrapper + .small-hint {
    padding: 0 5px;
    margin-top: -4em;
    margin-bottom: 4em; }
  .formular .table-wrapper + .small-hint {
    margin-bottom: 25px; }

/* Tabellen */
table {
  font-size: 1.5em;
  border-collapse: separate;
  border-spacing: 5px 0; }
  table caption {
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 1.466666666em;
    color: #0a2864;
    margin-bottom: 0.75em; }
  table table, table p, table h5, table h6, table label, table .has-error .help-block {
    font-size: 1em; }
  table h1, table h2, table div.looks_like_a_headline {
    font-size: 1.933333333em; }
  table h3 {
    font-size: 1.466666666em; }
  table h4 {
    font-size: 1.2em; }
  .content .csc table ul li, .content .csc table ol li {
    font-size: 1em; }

th,
thead td {
  text-align: left;
  font-weight: normal;
  background: #6c7ea2;
  color: #fff; }

th, td {
  vertical-align: top;
  padding: 10px; }

tbody td {
  border-bottom: 1px solid #e6e9ef; }
  .formular tbody td {
    background: #fff; }

tbody tr:last-child td {
  border-bottom: none; }

tfoot td {
  background: #9da9c1;
  color: #fff; }

.table-border td,
.table-border:last-child td {
  border-bottom: 3px solid #9da9c1; }

.table-alternate-rows {
  border-spacing: 2px; }
  .table-alternate-rows td {
    border-bottom: 0; }
  .table-alternate-rows tbody .odd td {
    background: #e6e9ef; }

.scroll-hint span {
  display: none;
  font-size: 1.5em;
  font-weight: bold;
  font-style: normal;
  width: 65px;
  height: 20px;
  text-indent: -9999px; }

.table-scroll-right .scroll-hint .scroll-right {
  display: inline-block;
  float: right;
  width: 50%;
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_scrollright.png) right center no-repeat;
  background-size: auto 17px; }

.table-scroll-left .scroll-hint .scroll-left {
  display: inline-block;
  float: left;
  width: 50%;
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_scrollleft.png) left center no-repeat;
  background-size: auto 17px; }

.table-wrapper {
  position: relative;
  overflow: hidden;
  margin-bottom: 5em;
  clear: both; }
  div[class*="form-grid"] > .table-wrapper {
    background: #e6e9ef;
    padding: 20px; }
  fieldset div[class*="form-grid"] > .table-wrapper,
  div.form-summary > .table-wrapper {
    padding: 0; }

.table-innerwrapper {
  margin-top: 10px;
  width: 100%;
  overflow-x: auto; }

.table-scroll-right:after,
.table-scroll-left:before {
  content: '';
  display: block;
  width: 50px;
  height: 100%;
  position: absolute;
  z-index: 10;
  top: 27px; }
  div[class*="form-grid"]:not(.form-summary) > .table-scroll-right:after, div[class*="form-grid"]:not(.form-summary) >
  .table-scroll-left:before {
    top: 38px; }

.table-scroll-left:before {
  left: 0;
  background-color: rgba(255, 255, 255, 0);
  background-image: -webkit-gradient(linear, left right, left bottom, from(rgba(255, 255, 255, 0)), to(#fff));
  background-image: -webkit-linear-gradient(right, rgba(255, 255, 255, 0), #fff);
  background-image: -moz-linear-gradient(right, rgba(255, 255, 255, 0), #fff);
  background-image: -ms-linear-gradient(right, rgba(255, 255, 255, 0), #fff);
  background-image: linear-gradient(right, rgba(255, 255, 255, 0), #fff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(255, 255, 255, 0)', endColorStr='#fff'); }
  div[class*="form-grid"] > .table-scroll-left:before {
    background-color: rgba(230, 233, 239, 0);
    background-image: -webkit-gradient(linear, left right, left bottom, from(rgba(230, 233, 239, 0)), to(#e6e9ef));
    background-image: -webkit-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: -moz-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: -ms-linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: linear-gradient(right, rgba(230, 233, 239, 0), #e6e9ef);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(230, 233, 239, 0)', endColorStr='#e6e9ef'); }
  div[class*="form-grid"]:not(.form-summary) > .table-scroll-left:before {
    left: 20px; }

.table-scroll-right:after {
  right: 0;
  background-color: rgba(255, 255, 255, 0);
  background-image: -webkit-gradient(linear, left left, left bottom, from(rgba(255, 255, 255, 0)), to(#fff));
  background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  background-image: linear-gradient(left, rgba(255, 255, 255, 0), #fff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(255, 255, 255, 0)', endColorStr='#fff'); }
  div[class*="form-grid"] > .table-scroll-right:after {
    background-color: rgba(230, 233, 239, 0);
    background-image: -webkit-gradient(linear, left left, left bottom, from(rgba(230, 233, 239, 0)), to(#e6e9ef));
    background-image: -webkit-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: -moz-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: -ms-linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef);
    background-image: linear-gradient(left, rgba(230, 233, 239, 0), #e6e9ef);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(230, 233, 239, 0)', endColorStr='#e6e9ef'); }
  div[class*="form-grid"]:not(.form-summary) > .table-scroll-right:after {
    right: 20px; }

/* >> Inhaltsbereiche */
/* > wrapper = Container um alle Inhalte der Seite */
.wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer {
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  padding: 0;
  display: block; }
  @media screen and (max-width: 1170px) {
    .wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer {
      padding: 0 30px;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; } }
  @media only screen and (max-width: 767px) {
    .wrapper, .metanavigation > ul, .metanavigation-tabs, .metanavigation-layer {
      padding: 0 15px; } }

/* > trail Brotkrumenspur, trail, klickpfad */
.content .grid-100 .trail,
.content .grid-75 .trail {
  font-size: 1em;
  list-style: none;
  margin: 30px 0 18px;
  padding: 0 0 0 15px; }
  .content .grid-100 .trail li,
  .content .grid-75 .trail li {
    background: none;
    float: left;
    font-size: 1em;
    line-height: 1.7em;
    padding: 0; }
    .content .grid-100 .trail li:after,
    .content .grid-75 .trail li:after {
      color: #0a2864;
      font-size: 1.4em;
      position: relative;
      top: 2px; }
    .content .grid-100 .trail li a, .content .grid-100 .trail li span,
    .content .grid-75 .trail li a,
    .content .grid-75 .trail li span {
      display: inline-block;
      font-family: "TheSansBold", Arial, Verdana, sans-serif;
      font-size: 1.1em;
      margin-right: 3px;
      text-decoration: none;
      text-transform: uppercase; }
    .content .grid-100 .trail li span,
    .content .grid-75 .trail li span {
      color: #0a2864; }
    .content .grid-100 .trail li a,
    .content .grid-75 .trail li a {
      color: #0a2864; }
      .content .grid-100 .trail li a:after,
      .content .grid-75 .trail li a:after {
        margin-left: 3px; }
      .content .grid-100 .trail li a:hover,
      .content .grid-75 .trail li a:hover {
        color: #84b400; }
    .content .grid-100 .trail li.first a,
    .content .grid-75 .trail li.first a {
      float: left; }
      .content .grid-100 .trail li.first a:before,
      .content .grid-75 .trail li.first a:before {
        font-size: 1.2em;
        margin-top: 3px;
        margin-right: -3px; }
      .content .grid-100 .trail li.first a:after,
      .content .grid-75 .trail li.first a:after {
        margin-left: 0; }

/* > Sitemap */
.sitemap {
  width: 25%;
  margin: 15px 0 30px 0;
  float: left; }
  .sitemap:nth-child(4n+6) {
    clear: left; }
  .sitemap dl {
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    margin: 15px 15px 0 0;
    padding: 0; }
  .sitemap dt {
    font-size: 1.4666666em;
    font-weight: normal; }
    .sitemap dt a {
      color: #84b400; }
  .sitemap dd {
    margin: 0;
    list-style: none; }
  .sitemap a {
    margin-top: 10px;
    padding: 5px 0 5px 0;
    display: block;
    color: #0a2864;
    text-decoration: none; }
  .sitemap a:hover {
    color: #84b400; }
  @media screen and (max-width: 767px) {
    .sitemap {
      width: 100%;
      float: none; }
      .sitemap dl {
        margin: 15px 0 0; } }

/* > accordion base */
.accordion {
  font-size: 1em;
  list-style-type: none;
  margin: 0;
  padding: 0; }
  .accordion dt {
    background: #e6e9ef;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 1em;
    font-weight: normal;
    margin-bottom: 4px; }
    .accordion dt a {
      color: #0a2864;
      display: block;
      font-size: 1.8em;
      text-decoration: none;
      line-height: 1.3em;
      padding: 7px 15px 7px 20px;
      position: relative; }
      .accordion dt a:before {
        float: right; }
    .accordion dt.active {
      margin-bottom: 0; }
      .accordion dt.active a {
        color: #84b400;
        margin-bottom: 0; }
        .accordion dt.active a:before {
          color: #0a2864;
          top: 10px; }
  .accordion dd {
    background: #e6e9ef;
    padding: 0 50px 0 20px;
    margin: -4px 0 2px;
    height: 0px;
    overflow: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
    .accordion dd.active {
      display: block;
      max-height: 10000px;
      height: auto;
      padding: 10px 50px 20px 20px; }
      @media only screen and (max-width: 767px) {
        .accordion dd.active {
          padding: 10px 20px 20px 20px;
          margin-bottom: 2px; } }
      .accordion dd.active div.csc div.content-wrapper {
        margin-left: 0;
        margin-bottom: 0; }
      .accordion dd.active div.csc .button-wrapper {
        margin-top: 20px; }
    .accordion dd p {
      font-family: Arial, Verdana, sans-serif;
      margin: 0 0 25px 0; }
    .accordion dd *:last-child {
      margin-bottom: 0; }
    .accordion dd:last-child {
      position: relative;
      top: -4px; }

/* > glossar */
.content .grid-75 .filter-picker, .content .grid-100 .filter-picker {
  margin: 20px 0 30px;
  padding: 0; }
  .content .grid-75 .filter-picker li, .content .grid-100 .filter-picker li {
    background: none;
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    width: 16%;
    text-align: center;
    border-right: 1px dotted #0a2864; }
    @media only screen and (max-width: 767px) {
      .content .grid-75 .filter-picker li, .content .grid-100 .filter-picker li {
        width: 32%;
        margin-bottom: 20px; }
        .content .grid-75 .filter-picker li:nth-child(3n+0), .content .grid-100 .filter-picker li:nth-child(3n+0) {
          border-right: none; } }
    .content .grid-75 .filter-picker li.active a, .content .grid-100 .filter-picker li.active a {
      color: #84b400; }
    .content .grid-75 .filter-picker li:last-child, .content .grid-100 .filter-picker li:last-child {
      border-right: 0; }
    .content .grid-75 .filter-picker li a, .content .grid-100 .filter-picker li a {
      text-decoration: none;
      font-family: "TheSansBold", Arial, Verdana, sans-serif;
      font-weight: bold;
      font-size: 1.3em; }
      @media only screen and (max-width: 767px) {
        .content .grid-75 .filter-picker li a, .content .grid-100 .filter-picker li a {
          font-size: 1em; } }
      .content .grid-75 .filter-picker li a.disabled, .content .grid-100 .filter-picker li a.disabled {
        cursor: default;
        color: #e6e9ef; }

.search-container {
  width: 49%;
  display: inline-block;
  float: right; }
  @media only screen and (max-width: 767px) {
    .search-container {
      width: 100%;
      float: none; } }

/* > downloads */
.content .select .loading ~ .styledSelect:before {
  content: '';
  top: 3px;
  width: 30px;
  height: 30px;
  display: block;
  background: url(/fileadmin/twt_customer/base/system/templates/images/loader.gif) center center no-repeat;
  background-size: 20px 20px; }

.twt-download {
  margin-bottom: 60px; }
  .twt-download fieldset div.select {
    width: auto !important;
    min-width: 49%;
    display: inline-block; }
    .twt-download fieldset div.select ul.options {
      overflow-x: auto; }
  .twt-download .loader {
    display: none;
    height: 50px;
    background: url(/typo3conf/ext/twt_download/Resources/Public/Images/ista_loading.gif) center center no-repeat white; }

.content .grid-75 .downloads, .content .grid-100 .downloads {
  font-size: 1em;
  list-style-image: none;
  padding: 0; }
  .content .grid-75 .downloads li, .content .grid-100 .downloads li {
    background: #e6e9ef;
    font-size: 1em;
    padding: 15px 10px;
    position: relative; }
    .content .grid-75 .downloads li img, .content .grid-100 .downloads li img {
      float: left;
      border: 1px solid #9da9c1; }
      .content .grid-75 .downloads li img[height="0"], .content .grid-100 .downloads li img[height="0"] {
        display: none; }
    .content .grid-75 .downloads li div, .content .grid-100 .downloads li div {
      margin: 20px 0 0 10px;
      float: left;
      width: 72%; }
      .content .grid-75 .downloads li div a, .content .grid-100 .downloads li div a {
        color: #0a2864;
        display: block;
        font-size: 1.5em;
        font-weight: bold;
        line-height: 1.333333333;
        text-decoration: none; }
        .content .grid-75 .downloads li div a:hover, .content .grid-100 .downloads li div a:hover {
          text-decoration: underline; }
      .content .grid-75 .downloads li div span, .content .grid-100 .downloads li div span {
        color: #6c7ea2;
        display: block;
        font-size: 0.8em;
        font-weight: normal;
        margin-top: 5px; }
      @media only screen and (max-width: 767px) {
        .content .grid-75 .downloads li div, .content .grid-100 .downloads li div {
          margin: 0 0 0 10px; } }
    .content .grid-75 .downloads li:nth-child(odd), .content .grid-100 .downloads li:nth-child(odd) {
      background: #fff; }

/* List checked */
.content .grid-75 ul.checked, .content .grid-100 ul.checked, .visual-wrapper .csc ul.checked {
  list-style-image: none; }
  .content .grid-75 ul.checked li, .content .grid-100 ul.checked li, .visual-wrapper .csc ul.checked li {
    background: none;
    position: relative;
    padding-left: 25px; }
    .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before {
      color: #84b400;
      position: absolute;
      left: 0;
      font-size: 20px; }

@media only screen and (max-width: 767px) {
  .content .grid-75 ul, .content .grid-100 ul, .visual-wrapper .csc ul {
    padding: 0; } }

/* > fancybox */
.fancybox span {
  float: right;
  margin-top: 15px; }
  .fancybox span.first {
    color: #84b400;
    font-size: 2em;
    position: absolute;
    bottom: 10px;
    right: 0px; }

/* Fancybox content */
.fancybox-inner .csc {
  max-width: 750px;
  margin: 0 auto; }
  .fancybox-inner .csc ul li {
    background: url(/fileadmin/twt_customer/base/system/templates/images/bullet.png) 3px 7px no-repeat;
    padding-left: 1.5em; }
    .fancybox-inner .csc ul li ul {
      margin-top: 0.5em; }
  .fancybox-inner .csc .checked {
    list-style-image: none; }
    .fancybox-inner .csc .checked li {
      background: none;
      position: relative;
      padding-left: 25px; }
      .fancybox-inner .csc .checked li:before {
        color: #84b400;
        position: absolute;
        left: 0;
        font-size: 20px; }
  .fancybox-inner .csc ol li {
    font-size: 1.5em;
    line-height: 1.333333333; }
    .fancybox-inner .csc ol li ol {
      margin-top: 0.5em; }
  .fancybox-inner .csc li {
    margin: 0 0 0.5em; }
    .fancybox-inner .csc li li {
      font-size: 1em; }

/* Download Teaser */
.download-teaser .grid-33:nth-child(3n+1) {
  margin-right: 0; }

.download-teaser .grid-33 img {
  border: 1px solid #9da9c1;
  height: auto;
  width: auto;
  max-height: 100%;
  max-width: 100%; }
  .download-teaser .grid-33 img[height="0"] {
    display: none; }

.download-teaser .grid-33 > a {
  display: inline-block;
  height: 198px;
  max-height: 198px;
  width: 100%; }
  @media only screen and (max-width: 767px) {
    .download-teaser .grid-33 > a {
      height: auto; } }

@media screen and (max-width: 600px) {
  .download-teaser .grid-33 {
    width: 100%;
    margin-bottom: 0;
    padding-bottom: 0; }
    .download-teaser .grid-33 img {
      display: none; } }

.download-teaser .grid-33.last {
  margin: 0; }

.download-teaser div div a {
  font-size: 1.3em;
  display: block;
  padding-left: 10px;
  position: relative; }
  .download-teaser div div a:before {
    color: #6c7ea2;
    font-size: 1.4em;
    position: absolute;
    top: -2px;
    left: -6px; }

.download-teaser p {
  font-size: 1.4em;
  padding-left: 10px; }

.download-teaser span {
  color: #6c7ea2;
  font-size: 1em;
  display: block;
  padding-left: 0; }

.download-teaser div a {
  color: #6c7ea2;
  margin: 12px 0 5px;
  text-decoration: none; }
  .download-teaser div a:hover, .download-teaser div a:focus {
    text-decoration: underline; }

.grid > div.right-image {
  float: right; }

.video-wrapper {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 2em; }

/* pflegbare Listen unabhaengig vom grid */
.visual-wrapper .grid .content-wrapper ul,
.visual-wrapper .grid .content-wrapper ol,
.content .content-wrapper ul,
.content .content-wrapper ol {
  margin-bottom: 25px;
  font-size: 1em; }

.visual-wrapper .grid .content-wrapper ol ol,
.visual-wrapper .grid .content-wrapper ul ul,
.visual-wrapper .grid .content-wrapper ol ul,
.visual-wrapper .grid .content-wrapper ul ol,
.content .content-wrapper ol ol,
.content .content-wrapper ul ul,
.content .content-wrapper ol ul,
.content .content-wrapper ul ol {
  margin-top: 0.5em; }

.visual-wrapper .grid .content-wrapper li,
.content .content-wrapper li {
  font-size: 1.5em;
  line-height: 1.333333333;
  margin: 0 0 0.5em;
  padding-left: 1.5em; }

.visual-wrapper .grid .content-wrapper ol li,
.content .content-wrapper ol li {
  padding-left: 0; }

.visual-wrapper .grid .content-wrapper li li,
.content .content-wrapper li li {
  font-size: 1em; }

.content .outer-grid .location-data {
  clear: both; }
  .content .outer-grid .location-data li {
    background: none;
    padding-left: 0;
    margin-bottom: 10px;
    font-size: 1.3em; }

@media only screen and (min-width: 768px) {
  .form-locationfinder .form-button {
    margin-top: 25px; } }

.formular.form-locationfinder h1 {
  padding: 0 20px; }

.formular.form-locationfinder .form-input label {
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  margin-bottom: 10px; }

.location-data a,
.locationfinder-results a {
  color: #84b400;
  text-decoration: none; }
  .location-data a:hover,
  .locationfinder-results a:hover {
    color: #0a2864; }

.mail:before,
.phone:before,
.web:before,
.address:before,
.fax:before {
  width: 25px;
  display: inline-block;
  position: relative;
  top: 2px;
  color: #9da9c1; }

.mail:before {
  top: 4px;
  font-size: 1.5em;
  margin-top: -3px; }

.phone:before {
  font-size: 1.3em; }

.address:before {
  font-size: 1.1em; }

.locationfinder-results {
  margin-bottom: 100px; }
  .locationfinder-results p {
    font-size: 1.3em;
    margin-bottom: 5px; }
    .locationfinder-results p + h1,
    .locationfinder-results p + h2,
    .locationfinder-results p + h3,
    .locationfinder-results p + h4,
    .locationfinder-results p + h5,
    .locationfinder-results p + h6,
    .locationfinder-results p + div.looks_like_a_headline {
      margin-top: 40px; }

.formular.form-search fieldset {
  max-width: 570px;
  margin-bottom: 20px; }

.formular.form-search .form-input {
  margin-bottom: 0; }

@media only screen and (max-width: 767px) {
  .formular.form-search .form-input.form-grid-75 {
    width: 65%; }
  .formular.form-search .form-button.form-grid-25 {
    width: 35%;
    padding-left: 10px; } }

.content ul.ui-autocomplete,
ul.ui-autocomplete {
  position: absolute;
  left: 11px;
  right: 11px;
  padding-bottom: 10px;
  display: block;
  background: #fff;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); }
  @media only screen and (max-width: 767px) {
    .content ul.ui-autocomplete,
    ul.ui-autocomplete {
      left: 0;
      right: 0; } }
  .content ul.ui-autocomplete li,
  ul.ui-autocomplete li {
    display: block;
    background: none;
    margin: 0;
    padding: 0; }
  .content ul.ui-autocomplete a,
  ul.ui-autocomplete a {
    display: block;
    padding: 6px 10px 7px 10px;
    color: #3e3e3e;
    text-decoration: none; }
    .content ul.ui-autocomplete a:hover, .content ul.ui-autocomplete a:focus,
    ul.ui-autocomplete a:hover,
    ul.ui-autocomplete a:focus {
      text-decoration: none; }
  .content ul.ui-autocomplete .ui-state-focus,
  .content ul.ui-autocomplete li:hover,
  .content ul.ui-autocomplete li:focus,
  ul.ui-autocomplete .ui-state-focus,
  ul.ui-autocomplete li:hover,
  ul.ui-autocomplete li:focus {
    background: #e6e9ef;
    border: none; }

.searchresults-info {
  margin-bottom: 20px;
  display: block;
  font-size: 1.3em; }
  .searchresults-info strong.tx-solr-suggestword a {
    font-weight: bold;
    text-decoration: underline; }

.searchresults {
  list-style: none;
  padding: 0; }
  @media only screen and (min-width: 768px) {
    .searchresults {
      width: 65%;
      max-width: 570px;
      float: left; } }
  .searchresults li {
    margin-bottom: 60px; }
  .searchresults h2, .searchresults div.looks_like_a_headline {
    font-size: 1.8em;
    margin-bottom: 10px; }
  .searchresults p {
    margin-bottom: 15px; }
  .content .searchresults .trail {
    margin: 0;
    padding: 0; }
    .content .searchresults .trail li:last-child a:after {
      content: ''; }

.searchresults-loader {
  clear: both;
  margin-bottom: 60px;
  display: none;
  height: 50px;
  background: url(/typo3conf/ext/twt_download/Resources/Public/Images/ista_loading.gif) center center no-repeat white; }
  @media only screen and (min-width: 768px) {
    .searchresults-loader {
      width: 65%;
      max-width: 570px;
      float: left; } }

p .results-highlight {
  font-weight: bold; }

h2 .results-highlight {
  font-family: "TheSansExtraBold", Arial, Verdana, sans-serif; }

@media only screen and (min-width: 768px) {
  .searchresults-filter {
    float: right;
    width: 30%; } }

.searchresults-filter dl {
  font-size: 1em;
  margin-bottom: 40px; }
  @media only screen and (max-width: 767px) {
    .searchresults-filter dl {
      padding-left: 0; } }

.searchresults-filter dt {
  font-size: 1.8em;
  font-weight: normal;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  color: #0a2864;
  margin: 0 0 15px 0; }

.searchresults-filter dd {
  font-size: 1.3em;
  margin: 0 0 15px 0; }
  .searchresults-filter dd a {
    text-decoration: none; }

.content .outer-grid ul.history {
  width: 100%;
  margin-bottom: 4em;
  background: url(/fileadmin/twt_customer/base/system/templates/images/bg_history.png) center repeat-y; }
  @media only screen and (max-width: 767px) {
    .content .outer-grid ul.history {
      background: none; } }
  .content .outer-grid ul.history li {
    position: relative;
    padding: 0;
    background: #e6e9ef; }
    @media only screen and (min-width: 768px) {
      .content .outer-grid ul.history li {
        width: 46%;
        margin-bottom: 0; } }
    @media only screen and (max-width: 767px) {
      .content .outer-grid ul.history li {
        display: inline-block;
        width: 100%;
        margin-bottom: 20px; } }
    .content .outer-grid ul.history li:first-child:after {
      content: ' ';
      width: 10px;
      height: 28px;
      background: #fff;
      display: block;
      position: absolute;
      top: 0;
      right: -10%; }
      @media only screen and (max-width: 767px) {
        .content .outer-grid ul.history li:first-child:after {
          display: none; } }
    @media only screen and (min-width: 768px) {
      .content .outer-grid ul.history li:nth-child(2n+1) {
        float: left;
        clear: both;
        margin-bottom: 25px; } }
    .content .outer-grid ul.history li:nth-child(2n+1) strong:after {
      top: 13px;
      right: -27px; }
      @media only screen and (max-width: 767px) {
        .content .outer-grid ul.history li:nth-child(2n+1) strong:after {
          content: ''; } }
    .content .outer-grid ul.history li:nth-child(2n+1) strong:before {
      left: 106.25%; }
      @media screen and (max-width: 1280px) and (min-width: 1080px) {
        .content .outer-grid ul.history li:nth-child(2n+1) strong:before {
          left: 106%; } }
      @media screen and (max-width: 1079px) and (min-width: 1024px) {
        .content .outer-grid ul.history li:nth-child(2n+1) strong:before {
          left: 105.85%; } }
      @media screen and (max-width: 1023px) and (min-width: 1000px) {
        .content .outer-grid ul.history li:nth-child(2n+1) strong:before {
          left: 106.5%; } }
      @media screen and (max-width: 999px) and (min-width: 768px) {
        .content .outer-grid ul.history li:nth-child(2n+1) strong:before {
          left: 105.85%; } }
    @media only screen and (min-width: 768px) {
      .content .outer-grid ul.history li:nth-child(2n+2) {
        float: right;
        margin-top: 25px; } }
    .content .outer-grid ul.history li:nth-child(2n+2) strong:after {
      top: 17px;
      left: -28px; }
      @media only screen and (max-width: 767px) {
        .content .outer-grid ul.history li:nth-child(2n+2) strong:after {
          content: ''; } }
    .content .outer-grid ul.history li:nth-child(2n+2) strong:before {
      right: 106.15%; }
      @media screen and (max-width: 1280px) and (min-width: 1080px) {
        .content .outer-grid ul.history li:nth-child(2n+2) strong:before {
          right: 105.95%; } }
      @media screen and (max-width: 1079px) and (min-width: 1024px) {
        .content .outer-grid ul.history li:nth-child(2n+2) strong:before {
          right: 105.95%; } }
      @media screen and (max-width: 1023px) and (min-width: 1000px) {
        .content .outer-grid ul.history li:nth-child(2n+2) strong:before {
          right: 106.5%; } }
      @media screen and (max-width: 999px) and (min-width: 768px) {
        .content .outer-grid ul.history li:nth-child(2n+2) strong:before {
          right: 105.95%; } }
    @media only screen and (min-width: 768px) {
      .content .outer-grid ul.history li:nth-child(2) {
        margin-top: 60px; } }
    .content .outer-grid ul.history li:last-child {
      margin-bottom: 0; }
  .content .outer-grid ul.history p {
    margin-top: 20px;
    padding: 0 20px;
    font-size: 0.8666666em;
    line-height: 1.76923076em; }
  .content .outer-grid ul.history strong {
    display: block;
    width: 100%;
    padding: 15px 0;
    text-align: center;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-weight: normal;
    background: #0a2864;
    font-size: 1.93333333333em;
    color: #fff; }
    @media only screen and (max-width: 767px) {
      .content .outer-grid ul.history strong {
        font-size: 1.6em;
        padding: 10px 0; } }
    .content .outer-grid ul.history strong:after {
      position: absolute;
      font-size: 1.5em;
      color: #0a2864; }
    .content .outer-grid ul.history strong:before {
      content: ' ';
      top: 28px;
      position: absolute;
      display: block;
      width: 20px;
      height: 20px;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
      border-radius: 50%;
      background: #84b400; }
      @media only screen and (max-width: 767px) {
        .content .outer-grid ul.history strong:before {
          display: none; } }

.interactive-house {
  position: relative;
  width: 700px;
  max-width: 100%;
  height: 825px;
  margin: 0 auto; }
  @media only screen and (max-width: 767px) {
    .interactive-house {
      width: 450px;
      height: 442px; } }
  @media screen and (max-width: 479px) {
    .interactive-house {
      width: 290px;
      height: 382px; } }
  .interactive-house .hotspot {
    position: absolute;
    display: block; }
    @media only screen and (max-width: 767px) {
      .interactive-house .hotspot:not(.hotspot-info) {
        display: none; } }
    .interactive-house .hotspot img {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0; }
    .interactive-house .hotspot .hotspot-animation-frame-1 {
      opacity: 1; }
  .interactive-house .hotspot-info {
    display: block;
    width: 37px;
    height: 37px;
    background: url(/fileadmin/twt_customer/base/system/templates/images/hotspot-info.png) no-repeat;
    background-size: cover;
    text-indent: -9999px; }
    .interactive-house .hotspot-info:after {
      content: ' ';
      display: block;
      top: 20px;
      height: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line.png) repeat-x;
      position: absolute; }
  .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-animation-frame-1 {
    opacity: 0; }
  .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-animation-frame-2 {
    opacity: 1; }
  .interactive-house span[class*=hotspot-wrapper]:hover .hotspot-info {
    background: url(/fileadmin/twt_customer/base/system/templates/images/hotspot-info-hover.png) no-repeat;
    background-size: cover; }

.interactive-house-radio {
  background: url(/fileadmin/twt_customer/base/system/templates/images/ista_house.png) no-repeat;
  background-size: contain; }
  @media only screen and (max-width: 767px) {
    .interactive-house-radio {
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone.png) no-repeat;
      background-size: contain; }
      .interactive-house-radio.interactive-house-fr {
        background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-fr.png);
        background-size: contain; }
      .interactive-house-radio.interactive-house-dk {
        background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-dk.png); }
      .interactive-house-radio.interactive-house-it {
        background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-it.png); }
      .interactive-house-radio.interactive-house-cz {
        background-image: url(/fileadmin/twt_customer/base/system/templates/images/house-01-phone-cz.png); } }
  .interactive-house-radio .hotspot-wrapper-01 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-06 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-07 .hotspot-product {
    width: 47px;
    height: 35px;
    left: 216px; }
  .interactive-house-radio .hotspot-wrapper-01 .hotspot-product {
    top: 150px; }
  .interactive-house-radio .hotspot-wrapper-01 .hotspot-info {
    top: 135px; }
    .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after {
      width: 180px;
      left: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-01 .hotspot-info {
        top: 80px; }
        .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after {
          width: 114px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-01 .hotspot-info {
        top: 44px; }
        .interactive-house-radio .hotspot-wrapper-01 .hotspot-info:after {
          width: 60px; } }
  .interactive-house-radio .hotspot-wrapper-02 .hotspot-product {
    width: 54px;
    height: 55px;
    right: 195px;
    bottom: 254px; }
  .interactive-house-radio .hotspot-wrapper-02 .hotspot-info {
    right: 0;
    bottom: 264px; }
    .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after {
      width: 160px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-02 .hotspot-info {
        bottom: 121px; }
        .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after {
          width: 103px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-02 .hotspot-info {
        bottom: 156px; }
        .interactive-house-radio .hotspot-wrapper-02 .hotspot-info:after {
          width: 57px; } }
  .interactive-house-radio .hotspot-wrapper-03 .hotspot-product {
    width: 54px;
    height: 66px;
    right: 350px;
    bottom: 245px; }
  .interactive-house-radio .hotspot-wrapper-03 .hotspot-info {
    left: 0;
    bottom: 35px; }
    .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after {
      width: 285px;
      left: 100%; }
    .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before {
      content: ' ';
      display: block;
      height: 195px;
      right: -284px;
      bottom: 17px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-03 .hotspot-info {
        bottom: 22px; }
        .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before {
          height: 68px;
          bottom: 17px;
          right: -172px; }
        .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after {
          width: 169px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-03 .hotspot-info {
        bottom: 80px; }
        .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:before {
          height: 65px;
          bottom: 17px;
          right: -100px; }
        .interactive-house-radio .hotspot-wrapper-03 .hotspot-info:after {
          width: 99px; } }
  .interactive-house-radio .hotspot-wrapper-04 .hotspot-product {
    width: 50px;
    height: 68px;
    bottom: 470px;
    right: 345px; }
  .interactive-house-radio .hotspot-wrapper-04 .hotspot-info {
    right: 0;
    bottom: 479px; }
    .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after {
      width: 330px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-04 .hotspot-info {
        bottom: 228px; }
        .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after {
          width: 197px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-04 .hotspot-info {
        bottom: 235px; }
        .interactive-house-radio .hotspot-wrapper-04 .hotspot-info:after {
          width: 114px; } }
  .interactive-house-radio .hotspot-wrapper-05 .hotspot-product {
    width: 26px;
    height: 41px;
    bottom: 355px;
    right: 370px; }
  .interactive-house-radio .hotspot-wrapper-05 .hotspot-info {
    right: 0;
    bottom: 357px; }
    .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after {
      width: 338px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-05 .hotspot-info {
        bottom: 162px; }
        .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after {
          width: 200px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-05 .hotspot-info {
        bottom: 182px; }
        .interactive-house-radio .hotspot-wrapper-05 .hotspot-info:after {
          width: 118px; } }
  .interactive-house-radio .hotspot-wrapper-06 .hotspot-product {
    top: 275px; }
  .interactive-house-radio .hotspot-wrapper-07 .hotspot-product {
    top: 395px; }
  .interactive-house-radio .hotspot-wrapper-08 .hotspot-product {
    width: 54px;
    height: 59px;
    bottom: 235px;
    left: 135px; }
  .interactive-house-radio .hotspot-wrapper-08 .hotspot-info {
    left: 0;
    bottom: 243px; }
    .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after {
      width: 102px;
      left: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-08 .hotspot-info {
        bottom: 99px; }
        .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after {
          width: 69px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-08 .hotspot-info {
        bottom: 155px; }
        .interactive-house-radio .hotspot-wrapper-08 .hotspot-info:after {
          width: 32px; } }
  .interactive-house-radio .hotspot-wrapper-09 .hotspot-product {
    width: 72px;
    height: 67px;
    bottom: 192px;
    right: 167px; }
  .interactive-house-radio .hotspot-wrapper-09 .hotspot-info {
    right: 0;
    bottom: 197px; }
    .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after {
      width: 135px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-09 .hotspot-info {
        bottom: 81px; }
        .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after {
          width: 88px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-09 .hotspot-info {
        bottom: 94px; }
        .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:before {
          content: ' ';
          display: block;
          bottom: 16px;
          left: -54px;
          height: 36px;
          width: 5px;
          background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
          position: absolute; }
        .interactive-house-radio .hotspot-wrapper-09 .hotspot-info:after {
          width: 53px; } }
  .interactive-house-radio .hotspot-wrapper-10 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-11 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-12 .hotspot-product {
    width: 96px;
    height: 55px;
    right: 150px; }
  .interactive-house-radio .hotspot-wrapper-10 .hotspot-product {
    top: 200px; }
  .interactive-house-radio .hotspot-wrapper-10 .hotspot-info {
    right: 0;
    top: 196px; }
    .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after {
      width: 116px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-10 .hotspot-info {
        top: 113px; }
        .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after {
          width: 78px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-10 .hotspot-info {
        top: 68px; }
        .interactive-house-radio .hotspot-wrapper-10 .hotspot-info:after {
          width: 37px; } }
  .interactive-house-radio .hotspot-wrapper-11 .hotspot-product {
    top: 288px; }
  .interactive-house-radio .hotspot-wrapper-12 .hotspot-product {
    top: 404px; }
  .interactive-house-radio .hotspot-wrapper-13 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-14 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-15 .hotspot-product {
    width: 40px;
    height: 56px;
    left: 140px; }
  .interactive-house-radio .hotspot-wrapper-13 .hotspot-product {
    bottom: 460px; }
  .interactive-house-radio .hotspot-wrapper-13 .hotspot-info {
    left: 0;
    bottom: 462px; }
    .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after {
      width: 110px;
      left: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-13 .hotspot-info {
        top: 184px; }
        .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after {
          width: 74px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-13 .hotspot-info {
        top: 115px; }
        .interactive-house-radio .hotspot-wrapper-13 .hotspot-info:after {
          width: 34px; } }
  .interactive-house-radio .hotspot-wrapper-14 .hotspot-product {
    bottom: 343px; }
  .interactive-house-radio .hotspot-wrapper-15 .hotspot-product {
    top: 195px; }
  .interactive-house-radio .hotspot-wrapper-16 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-17 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-18 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-19 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-20 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-21 .hotspot-product {
    width: 22px;
    height: 32px; }
  .interactive-house-radio .hotspot-wrapper-16 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-17 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-18 .hotspot-product {
    left: 250px; }
  .interactive-house-radio .hotspot-wrapper-19 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-20 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-21 .hotspot-product {
    right: 263px; }
  .interactive-house-radio .hotspot-wrapper-16 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-19 .hotspot-product {
    top: 220px; }
  .interactive-house-radio .hotspot-wrapper-17 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-20 .hotspot-product {
    top: 330px; }
  .interactive-house-radio .hotspot-wrapper-18 .hotspot-product,
  .interactive-house-radio .hotspot-wrapper-21 .hotspot-product {
    top: 430px; }
  .interactive-house-radio .hotspot-wrapper-16 .hotspot-info {
    top: 235px; }
    .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after {
      width: 225px;
      left: 100%; }
    .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:before {
      content: ' ';
      display: block;
      bottom: 16px;
      right: -226px;
      height: 5px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-16 .hotspot-info {
        top: 130px; }
        .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after {
          width: 136px; }
        .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:before {
          display: none; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-16 .hotspot-info {
        top: 79px; }
        .interactive-house-radio .hotspot-wrapper-16 .hotspot-info:after {
          width: 79px; } }
  .interactive-house-radio .hotspot-wrapper-22 .hotspot-product {
    width: 43px;
    height: 49px;
    left: 194px;
    top: 170px; }
  .interactive-house-radio .hotspot-wrapper-22 .hotspot-info {
    top: 183px; }
    .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after {
      width: 180px;
      left: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-radio .hotspot-wrapper-22 .hotspot-info {
        top: 133px; }
        .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after {
          width: 108px; }
        .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:before {
          content: ' ';
          display: block;
          height: 17px;
          right: -110px;
          bottom: 17px;
          width: 5px;
          background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
          position: absolute; } }
    @media screen and (max-width: 479px) {
      .interactive-house-radio .hotspot-wrapper-22 .hotspot-info {
        top: 79px; }
        .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:after {
          width: 59px; }
        .interactive-house-radio .hotspot-wrapper-22 .hotspot-info:before {
          right: -59px;
          height: 10px; } }

.interactive-house-mbus {
  background: url(/fileadmin/twt_customer/base/system/templates/images/ista_house-mbus.png) no-repeat;
  background-size: contain; }
  @media only screen and (max-width: 767px) {
    .interactive-house-mbus {
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-02-phone.png) no-repeat;
      background-size: contain; } }
  .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-10 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product {
    width: 40px;
    height: 40px; }
  .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product {
    left: 156px; }
  .interactive-house-mbus .hotspot-wrapper-01 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product {
    top: 192px; }
  .interactive-house-mbus .hotspot-wrapper-02 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product {
    top: 296px; }
  .interactive-house-mbus .hotspot-wrapper-03 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product {
    top: 423px; }
  .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info {
    top: 459px; }
    .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after {
      width: 140px;
      left: 100%; }
    .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:before {
      content: ' ';
      display: block;
      width: 5px;
      height: 20px;
      bottom: 17px;
      right: -142px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info {
        top: 239px; }
        .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after {
          width: 68px; }
        .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:before {
          display: none; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info {
        top: 103px; }
        .interactive-house-mbus .hotspot-wrapper-03 .hotspot-info:after {
          width: 34px; } }
  .interactive-house-mbus .hotspot-wrapper-04 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-05 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-06 .hotspot-product {
    right: 155px; }
  .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product {
    left: 255px; }
  .interactive-house-mbus .hotspot-wrapper-07 .hotspot-product {
    top: 192px; }
  .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info {
    top: 227px; }
    .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after {
      width: 244px;
      left: 100%; }
    .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before {
      content: ' ';
      display: block;
      height: 20px;
      bottom: 17px;
      right: -244px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info {
        top: 129px; }
        .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after {
          width: 128px; }
        .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before {
          height: 10px;
          bottom: 16px;
          right: -129px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info {
        top: 38px; }
        .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:before {
          height: 17px;
          top: 25px;
          right: -75px; }
        .interactive-house-mbus .hotspot-wrapper-07 .hotspot-info:after {
          width: 73px; } }
  .interactive-house-mbus .hotspot-wrapper-08 .hotspot-product {
    top: 296px; }
  .interactive-house-mbus .hotspot-wrapper-09 .hotspot-product {
    top: 423px; }
  .interactive-house-mbus .hotspot-wrapper-10 .hotspot-product {
    top: 536px;
    left: 156px; }
  .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info {
    top: 700px;
    left: 157px; }
    .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before {
      content: ' ';
      display: block;
      bottom: 100%;
      height: 130px;
      left: 17px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info {
        top: 400px;
        left: 98px; }
        .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before {
          height: 65px;
          left: 15px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info {
        top: 275px;
        left: 57px; }
        .interactive-house-mbus .hotspot-wrapper-10 .hotspot-info:before {
          height: 59px; } }
  .interactive-house-mbus .hotspot-wrapper-11 .hotspot-product {
    width: 57px;
    height: 88px;
    top: 546px;
    right: 112px; }
  .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info {
    top: 578px;
    right: 0; }
    .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after {
      width: 89px;
      right: 100%; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info {
        top: 326px; }
        .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after {
          width: 76px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info {
        top: 207px; }
        .interactive-house-mbus .hotspot-wrapper-11 .hotspot-info:after {
          width: 37px; } }
  .interactive-house-mbus .hotspot-wrapper-12 .hotspot-product {
    width: 57px;
    height: 52px;
    top: 521px;
    right: 180px; }
  .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info {
    top: 700px;
    right: 152px; }
    .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after {
      width: 20px;
      right: 15px;
      top: -151px; }
    .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before {
      content: ' ';
      display: block;
      bottom: 100%;
      height: 151px;
      left: 17px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info {
        top: 400px;
        right: 127px; }
        .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before {
          height: 78px;
          right: 15px; }
        .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after {
          width: 5px;
          top: -78px;
          right: 16px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info {
        top: 275px;
        right: 75px; }
        .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:before {
          right: 15px;
          height: 66px; }
        .interactive-house-mbus .hotspot-wrapper-12 .hotspot-info:after {
          width: 4px;
          top: -66px; } }
  .interactive-house-mbus .hotspot-wrapper-13 .hotspot-product {
    width: 57px;
    height: 26px;
    top: 574px;
    right: 180px; }
  .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info {
    top: 700px;
    right: 238px; }
    .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after {
      left: 23px;
      top: -111px;
      width: 23px; }
    .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before {
      content: ' ';
      display: block;
      bottom: 100%;
      height: 111px;
      left: 17px;
      width: 5px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info {
        top: 400px;
        right: 173px; }
        .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before {
          height: 54px;
          right: 15px; }
        .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after {
          width: 22px;
          top: -60px;
          left: 18px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info {
        top: 275px;
        right: 140px; }
        .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:before {
          right: 15px;
          height: 49px; }
        .interactive-house-mbus .hotspot-wrapper-13 .hotspot-info:after {
          width: 50px;
          top: -56px; } }
  .interactive-house-mbus .hotspot-wrapper-14 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-15 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-16 .hotspot-product {
    left: 196px; }
  .interactive-house-mbus .hotspot-wrapper-17 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-18 .hotspot-product,
  .interactive-house-mbus .hotspot-wrapper-19 .hotspot-product {
    right: 119px; }
  .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info {
    top: 332px; }
    .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after {
      width: 180px;
      left: 100%; }
    .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before {
      content: ' ';
      display: block;
      width: 5px;
      height: 20px;
      bottom: 17px;
      right: -182px;
      background: url(/fileadmin/twt_customer/base/system/templates/images/house-line-y.png) repeat-y;
      position: absolute; }
    @media only screen and (max-width: 767px) {
      .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info {
        top: 190px; }
        .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after {
          width: 100px; }
        .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before {
          height: 10px;
          bottom: 16px;
          right: -102px; } }
    @media screen and (max-width: 479px) {
      .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info {
        top: 165px; }
        .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:before {
          right: -54px; }
        .interactive-house-mbus .hotspot-wrapper-15 .hotspot-info:after {
          width: 54px; } }

.interactive-house-mbus.mbus-variant {
  background-image: url(/fileadmin/twt_customer/base/system/templates/images/ista_house-mbus_variant.png); }

.interactive-house-mbus.mbus-no-heatmeter {
  background-image: url(/fileadmin/twt_customer/base/system/templates/images/ista_house-mbus_no_heatmeter.png); }

.cookie-overlay {
  width: 100%;
  max-height: 0;
  position: fixed;
  -webkit-transform: translateZ(0);
  bottom: 0;
  z-index: 1000;
  background: rgba(10, 40, 100, 0.95);
  color: #fff;
  -webkit-transition: max-height 0.5s;
  -moz-transition: max-height 0.5s;
  -ms-transition: max-height 0.5s;
  transition: max-height 0.5s; }
  @media screen and (max-width: 479px) {
    .cookie-overlay .grid-100 {
      padding-bottom: 60px !important; }
    .cookie-overlay .cookie-overlay-buttons {
      position: absolute;
      bottom: 0;
      right: 0; } }
  .cookie-overlay .buttonlink:link, .cookie-overlay .formular .form-input-tsr input:link, .formular .form-input-tsr .cookie-overlay input:link,
  .cookie-overlay .formular .form-input-tb input:link, .formular .form-input-tb .cookie-overlay input:link,
  .cookie-overlay .formular .form-button button:link, .formular .form-button .cookie-overlay button:link {
    margin-right: 0;
    background: #fff;
    color: #0a2864;
    margin-left: 10px;
    float: right; }
    .cookie-overlay .buttonlink:link.refuse, .cookie-overlay .formular .form-input-tsr input:link.refuse, .formular .form-input-tsr .cookie-overlay input:link.refuse,
    .cookie-overlay .formular .form-input-tb input:link.refuse, .formular .form-input-tb .cookie-overlay input:link.refuse,
    .cookie-overlay .formular .form-button button:link.refuse, .formular .form-button .cookie-overlay button:link.refuse {
      text-decoration: none;
      font-size: 30px;
      background: none;
      color: #fff;
      line-height: .5; }
      .cookie-overlay .buttonlink:link.refuse:hover, .cookie-overlay .formular .form-input-tsr input:link.refuse:hover, .formular .form-input-tsr .cookie-overlay input:link.refuse:hover,
      .cookie-overlay .formular .form-input-tb input:link.refuse:hover, .formular .form-input-tb .cookie-overlay input:link.refuse:hover,
      .cookie-overlay .formular .form-button button:link.refuse:hover, .formular .form-button .cookie-overlay button:link.refuse:hover {
        background: none;
        color: #84b400; }
    .cookie-overlay .buttonlink:link:hover, .cookie-overlay .formular .form-input-tsr input:link:hover, .formular .form-input-tsr .cookie-overlay input:link:hover,
    .cookie-overlay .formular .form-input-tb input:link:hover, .formular .form-input-tb .cookie-overlay input:link:hover,
    .cookie-overlay .formular .form-button button:link:hover, .formular .form-button .cookie-overlay button:link:hover {
      background: #84b400;
      color: #fff; }
    .cookie-overlay .buttonlink:link.ghost-button, .cookie-overlay .formular .form-input-tsr input:link.ghost-button, .formular .form-input-tsr .cookie-overlay input:link.ghost-button,
    .cookie-overlay .formular .form-input-tb input:link.ghost-button, .formular .form-input-tb .cookie-overlay input:link.ghost-button,
    .cookie-overlay .formular .form-button button:link.ghost-button, .formular .form-button .cookie-overlay button:link.ghost-button {
      background: transparent;
      color: #fff;
      outline: 1px solid #fff; }
      .cookie-overlay .buttonlink:link.ghost-button:hover, .cookie-overlay .formular .form-input-tsr input:link.ghost-button:hover, .formular .form-input-tsr .cookie-overlay input:link.ghost-button:hover,
      .cookie-overlay .formular .form-input-tb input:link.ghost-button:hover, .formular .form-input-tb .cookie-overlay input:link.ghost-button:hover,
      .cookie-overlay .formular .form-button button:link.ghost-button:hover, .formular .form-button .cookie-overlay button:link.ghost-button:hover {
        background-color: #fff;
        color: #0a2864; }
  .cookie-overlay h3 {
    float: left; }
    @media screen and (max-width: 479px) {
      .cookie-overlay h3 {
        float: none; } }
  .cookie-overlay .title {
    margin-bottom: 10px;
    display: inline-block;
    float: left;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 2.2em;
    line-height: 1.18181818; }
  .cookie-overlay p {
    clear: both; }
  .cookie-overlay .grid {
    position: static;
    margin-bottom: 0; }
    .cookie-overlay .grid > div {
      position: relative;
      overflow: auto;
      padding-top: 20px; }
  .cookie-overlay h1, .cookie-overlay h2, .cookie-overlay h3, .cookie-overlay h4, .cookie-overlay h5, .cookie-overlay h6, .cookie-overlay div.looks_like_a_headline {
    color: #fff;
    margin-bottom: 10px; }
  .cookie-overlay a:link {
    color: #fff; }
    .cookie-overlay a:link:hover {
      color: #84b400; }
  .cookie-overlay .metanavigation-close {
    text-decoration: none;
    top: 0; }

.cookie-overlay-open {
  -webkit-transition: max-height 10s;
  -moz-transition: max-height 10s;
  -ms-transition: max-height 10s;
  transition: max-height 10s;
  max-height: 500px; }
  .cookie-overlay-open.cookie-overlay-scrolling {
    top: 0;
    min-height: 100%;
    max-height: 100%;
    overflow: scroll; }

.TheSansRegular {
  font-family: "TheSansRegular", Arial, Verdana, sans-serif; }

.TheSansBold {
  font-family: "TheSansBold", Arial, Verdana, sans-serif; }

.TheSansExtraBold {
  font-family: "TheSansExtraBold", Arial, Verdana, sans-serif; }

.TheSansItalic {
  font-family: "TheSansItalic", Arial, Verdana, sans-serif; }

div[data-shadow="1"] img {
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }

/* Teaserwall */
.teaserwall {
  position: relative; }
  .teaserwall .teaserwall-main-text {
    position: absolute;
    top: 30px;
    left: 17.5%;
    width: 25%;
    text-align: center; }
  .teaserwall .teaserwall-teaserbox {
    position: absolute;
    top: 30px;
    right: 20%; }
  .teaserwall .teaserwall-teaserbox-teasers {
    padding: 20px 20px 20px 20px;
    background: white; }
    .teaserwall .teaserwall-teaserbox-teasers div.csc {
      margin-bottom: 5px; }
    .teaserwall .teaserwall-teaserbox-teasers .button-wrapper {
      text-align: center; }
      .teaserwall .teaserwall-teaserbox-teasers .button-wrapper a {
        width: 130px; }
    .teaserwall .teaserwall-teaserbox-teasers .abovecenter-image .image-wrapper {
      margin: 0px; }
      .teaserwall .teaserwall-teaserbox-teasers .abovecenter-image .image-wrapper img {
        max-height: 70px; }
  .teaserwall .teaserwall-teaserbox-newsletter {
    margin-top: 40px;
    background: white;
    padding: 10px;
    height: 20px; }
    .teaserwall .teaserwall-teaserbox-newsletter .teaserwall-teaserbox-newsletter-inner {
      text-align: center;
      font-size: 1.3em; }
      .teaserwall .teaserwall-teaserbox-newsletter .teaserwall-teaserbox-newsletter-inner .teaserwall-teaserbox-newsletter-link {
        color: #8B97B7;
        text-decoration: none;
        line-height: 20px; }
        .teaserwall .teaserwall-teaserbox-newsletter .teaserwall-teaserbox-newsletter-inner .teaserwall-teaserbox-newsletter-link img {
          float: right; }
  .teaserwall .teaserwall-footer-link {
    text-align: center;
    margin-top: 10px; }
    .teaserwall .teaserwall-footer-link h1, .teaserwall .teaserwall-footer-link h2, .teaserwall .teaserwall-footer-link h3, .teaserwall .teaserwall-footer-link h4 {
      font-size: 2.8em; }

@media screen and (max-width: 567px) {
  .teaserwall .teaserwall-teaserbox {
    position: initial; }
    .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers div.csc {
      float: none !important;
      width: 100% !important; } }

@media screen and (max-width: 768px) {
  .teaserwall .teaserwall-main-text {
    right: 2.5%;
    top: 2.5%;
    left: initial !important;
    width: 50% !important; }
  .teaserwall .teaserwall-teaserbox {
    position: initial; }
    .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers {
      padding: 0px;
      height: auto; }
      .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers div.csc {
        float: left;
        width: 33%; }
  .teaserwall .teaserwall-teaserbox-newsletter {
    margin-top: 10px;
    text-align: center; }
    .teaserwall .teaserwall-teaserbox-newsletter .teaserwall-teaserbox-newsletter-inner {
      width: 250px;
      margin: auto; } }

@media screen and (max-width: 1280px) {
  .teaserwall .teaserwall-teaserbox {
    right: 10%;
    top: 20px; }
  .teaserwall .teaserwall-main-text {
    left: 2.5%;
    width: 35%; }
  .teaserwall .teaserwall-teaserbox-newsletter {
    margin-top: 30px; } }

iframe[name=google_conversion_frame] {
  width: 0;
  height: 0;
  margin: 0; }

@media screen and (max-width: 47.99875em) {
  .hide-for-small-only {
    display: none !important; } }

@media screen and (max-width: 0em), screen and (min-width: 48em) {
  .show-for-small-only {
    display: none !important; } }

@media print, screen and (min-width: 48em) {
  .hide-for-medium {
    display: none !important; } }

@media screen and (max-width: 47.99875em) {
  .show-for-medium {
    display: none !important; } }

@media screen and (min-width: 48em) and (max-width: 63.99875em) {
  .hide-for-medium-only {
    display: none !important; } }

@media screen and (max-width: 47.99875em), screen and (min-width: 64em) {
  .show-for-medium-only {
    display: none !important; } }

@media print, screen and (min-width: 64em) {
  .hide-for-large {
    display: none !important; } }

@media screen and (max-width: 63.99875em) {
  .show-for-large {
    display: none !important; } }

@media screen and (min-width: 64em) and (max-width: 79.99875em) {
  .hide-for-large-only {
    display: none !important; } }

@media screen and (max-width: 63.99875em), screen and (min-width: 80em) {
  .show-for-large-only {
    display: none !important; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Grid
 *
 */
/* grid klassen */
.grid {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 1240px;
  padding: 10px 20px;
  margin: 0 auto 56px auto; }
  .grid.visible-overflow {
    overflow: visible; }
  .grid.teaser-slider-33, .grid.teaser-slider-25 {
    margin-bottom: 41px; }
    @media only screen and (max-width: 1023px) {
      .grid.teaser-slider-33, .grid.teaser-slider-25 {
        margin-bottom: 15px; } }
  @media only screen and (max-width: 1023px) {
    .grid {
      margin-bottom: 30px; }
      .grid:not(.grid-background) > div:not(.grid):last-child {
        margin-bottom: 0; } }
  @media only screen and (max-width: 767px) {
    .grid {
      padding: 10px 0px; } }
  .grid .grid {
    max-width: 100%;
    background: rgba(255, 255, 255, 0.9);
    padding: 0; }
  .grid > h1,
  .grid > h2,
  .grid > h3,
  .grid > h4,
  .grid > h5,
  .grid > h6,
  .grid > div.looks_like_a_headline {
    padding: 0 15px; }
  .grid > div:not(.grid) {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    padding: 10px 15px 0 15px; }

.grid-20 {
  width: 20%; }

.grid-25 {
  width: 25%; }

.grid-33 {
  width: 33.3333333333%; }

.grid-50 {
  width: 50%; }

.grid-66 {
  width: 66%; }

.grid-75 {
  width: 75%; }
  .grid-75 > div:not(.csc) {
    padding-left: 15px;
    padding-right: 15px; }
    @media only screen and (max-width: 767px) {
      .grid-75 > div:not(.csc) {
        padding-left: 0;
        padding-right: 0; } }
  .grid-75 > .csc {
    padding-left: 30px;
    padding-right: 30px; }
    @media screen and (max-width: 1260px) {
      .grid-75 > .csc {
        padding-right: 30px; } }
    @media only screen and (max-width: 767px) {
      .grid-75 > .csc {
        padding-left: 15px;
        padding-right: 15px; } }

@media only screen and (max-width: 767px) {
  .grid-20,
  .grid-25,
  .grid-33,
  .grid-50,
  .grid-66,
  .grid-75 {
    width: 100%; } }

.grid-100,
.userroles .grid-20,
.teaser-slider-25 .grid-25,
.teaser-slider-33 .grid-33 {
  width: 100%; }

.outer-grid {
  padding: 0;
  margin-bottom: 0; }
  .outer-grid > div:not(.grid) {
    padding: 0 30px 0 15px; }
    @media screen and (max-width: 1170px) and (min-width: 1024px) {
      .outer-grid > div:not(.grid) {
        padding: 0 30px; } }
    @media only screen and (max-width: 767px) {
      .outer-grid > div:not(.grid) {
        padding: 0; } }
  .outer-grid > .grid-100 > .csc,
  .outer-grid > .grid-100 .group,
  .outer-grid > .grid-75 > .csc,
  .outer-grid > .grid-75 .group {
    margin-bottom: 56px; }
    .outer-grid > .grid-100 > .csc > .grid,
    .outer-grid > .grid-100 .group > .grid,
    .outer-grid > .grid-75 > .csc > .grid,
    .outer-grid > .grid-75 .group > .grid {
      margin-bottom: 0; }
    @media only screen and (max-width: 1023px) {
      .outer-grid > .grid-100 > .csc,
      .outer-grid > .grid-100 .group,
      .outer-grid > .grid-75 > .csc,
      .outer-grid > .grid-75 .group {
        margin-bottom: 30px; } }
  @media only screen and (min-width: 768px) {
    .outer-grid > div.grid-100 {
      padding: 0 30px; } }
  @media screen and (max-width: 1170px) and (min-width: 1024px) {
    .outer-grid > div.grid-100 {
      padding: 0 15px; } }
  @media only screen and (max-width: 767px) {
    .outer-grid > div.grid-100 {
      padding: 0 15px; } }
  .outer-grid > div.grid-25 {
    padding-left: 35px;
    padding-right: 0; }
  .outer-grid > div.grid-75 {
    padding: 0; }
  @media only screen and (max-width: 1023px) {
    .outer-grid > div {
      padding-top: 0;
      padding-bottom: 0; }
    .outer-grid > .grid-25 {
      display: none; }
    .outer-grid > div.grid-75 {
      width: 100%;
      padding: 0; } }

.outer-grid .grid.grid-background {
  width: 100%;
  background-color: #e6e9ef;
  position: relative;
  display: table;
  overflow: visible;
  padding: 45px 15px 70px 15px; }
  @media only screen and (max-width: 767px) {
    .outer-grid .grid.grid-background {
      display: inline-block; }
      .outer-grid .grid.grid-background.teaser-slider-25, .outer-grid .grid.grid-background.teaser-slider-33, .outer-grid .grid.grid-background.userroles {
        padding: 10px 0 60px 0; }
      .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) {
        padding: 10px 0 0 0; } }
  .outer-grid .grid.grid-background .grid-25,
  .outer-grid .grid.grid-background .grid-33,
  .outer-grid .grid.grid-background .grid-50,
  .outer-grid .grid.grid-background .grid-66 {
    background: transparent; }
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 > .csc,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 > .csc,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 > .csc,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 > .csc,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 > .csc {
    background: #fff; }
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .button-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .button-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .button-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .button-wrapper {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .intext-left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-25 .intext-right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .intext-left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 .intext-right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .intext-left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-50 .intext-right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .intext-left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .intext-right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .right-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .intext-left-image + .content-wrapper,
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-100 .intext-right-image + .content-wrapper {
    padding-top: 1.5em; }
  .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image p {
    padding-left: 20px; }
  @media only screen and (min-width: 768px) {
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image + .content-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image + .content-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image + .content-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image + .content-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image ~ .button-wrapper {
      padding-left: 20px;
      padding-right: 20px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .aboveleft-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .abovecenter-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image ~ .button-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-right-image ~ .button-wrapper {
      margin-bottom: 15px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .csc {
      padding: 30px 30px 15px 30px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper {
      margin-bottom: 15px; } }
  @media only screen and (max-width: 767px) {
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .content-wrapper,
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .button-wrapper {
      padding-left: 15px;
      padding-right: 15px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .intext-left-image p {
      padding-left: 15px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .button-wrapper {
      margin-bottom: 15px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .csc {
      padding: 15px; }
    .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-66 .button-wrapper {
      margin-bottom: 15px; } }
  .outer-grid .grid.grid-background > .grid-empty {
    background-color: #e6e9ef; }

.outer-grid > .grid-100 .grid-background {
  padding: 45px 0 70px 0; }
  .outer-grid > .grid-100 .grid-background:after, .outer-grid > .grid-100 .grid-background:before {
    background-color: #e6e9ef;
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 0;
    top: 0;
    display: block; }
  .outer-grid > .grid-100 .grid-background:before {
    right: 100%; }
  .outer-grid > .grid-100 .grid-background:after {
    left: 100%; }

.grid-extra-padding {
  padding-top: 80px;
  padding-bottom: 80px; }

.grid-margin-top {
  margin-top: 66px; }

/**
 * @package ista Internet Relaunch
 * @author Robin Förster <robin.foerster@twt.de>
 *
 * Content:
 *  Onepager
 *
 */
/* overrides für onepager */
.onepager ul.checked {
  list-style-image: none; }
  .onepager ul.checked li {
    background: none;
    position: relative;
    padding-left: 25px; }
    .onepager ul.checked li:before {
      color: #84b400;
      position: absolute;
      left: 0;
      font-size: 20px; }

@media screen and (min-width: 1024px) {
  .no-touch .has-mediastage .onepager .content {
    top: 0; } }

.onepager header {
  background: transparent; }

.onepager .metanavigation {
  margin-top: -62px;
  background: transparent; }
  .onepager .metanavigation .metanavigation-tabs > li > a,
  .onepager .metanavigation .metanavigation-tabs > li > strong {
    color: #CCCCCC;
    font-size: 1.1 em; }

@media screen and (max-width: 1024px) {
  .onepager .metanavigation li:first-child {
    display: block; } }

@media only screen and (max-width: 767px) {
  .onepager .metanavigation li:not(.metanavigation-right) {
    display: block; } }

.onepager {
  /*#c41002 {
    & > .outer-grid {
      width: auto;
      padding: 320px 0 120px 0;

      & > div:first-child {
        background: $tertiaryColor10;
      }

      @media only screen and (max-width:767px) {
        padding: 30px 10px;

        .grid-empty {
          display: none;
        }
      }
    }
  }*/ }
  .onepager strong.logo img {
    width: auto;
    height: auto; }
  .onepager main > div {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-bottom: 30px; }
    .onepager main > div:first-child {
      margin-bottom: 50px; }
      .onepager main > div:first-child .csc {
        min-height: 380px;
        margin-bottom: 0; }
    .onepager main > div:last-child {
      margin-bottom: 0; }
  .onepager .grid-horizontalruler {
    background-position: center -125px;
    padding: 30px 0; }
    .onepager .grid-horizontalruler > .outer-grid:after {
      display: table;
      clear: both;
      content: ''; }
    .onepager .grid-horizontalruler > .outer-grid > h1 {
      margin-bottom: 360px; }
    @media only screen and (max-width: 1023px) {
      .onepager .grid-horizontalruler {
        background-position: center;
        padding: 30px 10px; }
        .onepager .grid-horizontalruler > .outer-grid > h1 {
          margin-bottom: 30px; }
        .onepager .grid-horizontalruler > .outer-grid > .grid-25 {
          margin-bottom: 10px;
          display: block; }
          .onepager .grid-horizontalruler > .outer-grid > .grid-25:last-child {
            margin-bottom: 0; } }
  .onepager ul.checked {
    list-style-image: none; }
    .onepager ul.checked li {
      background: none;
      position: relative;
      padding-left: 25px; }
      .onepager ul.checked li:before {
        color: #84b400;
        position: absolute;
        left: 0;
        font-size: 20px; }
  @media only screen and (max-width: 767px) {
    .onepager .image-wrapper {
      width: 100%; } }

/* Icons / font
/* ----------------------------- */
/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Fonts
 *
 */
@font-face {
  font-family: "TheSansRegular";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_B4_500_.eot"); }

@font-face {
  font-family: "TheSansRegular";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_B4_500_.woff") format("woff"); }

@font-face {
  font-family: "TheSansBold";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_LP_7_.eot"); }

@font-face {
  font-family: "TheSansBold";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_LP_7_.woff") format("woff"); }

@font-face {
  font-family: "TheSansExtraBold";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_800_.eot"); }

@font-face {
  font-family: "TheSansExtraBold";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/TheSans_800_.woff") format("woff"); }

@font-face {
  font-family: "TheSansItalic";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/Ista_TheSans_5i.eot"); }

@font-face {
  font-family: "TheSansItalic";
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/thesans/Ista_TheSans_5i.woff") format("woff"); }

@font-face {
  font-family: 'VideoJS';
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.eot");
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.eot?#iefix") format("embedded-opentype"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.woff") format("woff"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.ttf") format("truetype"), url("/fileadmin/twt_customer/base/system/templates/fonts/videojs/vjs.svg#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Icons
 *
 */
@font-face {
  font-family: 'icomoon';
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/icon/icomoon.eot?efdns8");
  src: url("/fileadmin/twt_customer/base/system/templates/fonts/icon/icomoon.eot?efdns8#iefix") format("embedded-opentype"), url("/fileadmin/twt_customer/base/system/templates/fonts/icon/icomoon.ttf?efdns8") format("truetype"), url("/fileadmin/twt_customer/base/system/templates/fonts/icon/icomoon.woff?efdns8") format("woff"), url("/fileadmin/twt_customer/base/system/templates/fonts/icon/icomoon.svg?efdns8#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }

.icon, .fancybox-inner .checked li:before, .fancybox span:before, .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before,
.teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before, .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before,
.content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before,
.content .formular .form-button button:before, .formular .form-button .content button:before, .content .grid-100 .trail li a:after,
.content .grid-75 .trail li a:after, .content .grid-100 .trail li.first a,
.content .grid-75 .trail li.first a, .accordion dt a:before, .accordion dt.active a:before, .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before, .fancybox span, .fancybox-inner .csc .checked li:before, .download-teaser div div a:before, .mail:before,
.phone:before,
.web:before,
.address:before,
.fax:before, .content .outer-grid ul.history strong:after, .onepager ul.checked li:before, .postfix button:before, .styledSelect:before, .formular .has-success:before, .formular .help-block:before, .form-help-text:after, .form-step li:after, .powermail_tabmenu li:after, .onepager .ctype_gallery .visual-wrapper .visual-text .buttonlink:before, .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tsr input:before, .formular .form-input-tsr .onepager .ctype_gallery .visual-wrapper .visual-text input:before,
.onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tb input:before, .formular .form-input-tb .onepager .ctype_gallery .visual-wrapper .visual-text input:before,
.onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-button button:before, .formular .form-button .onepager .ctype_gallery .visual-wrapper .visual-text button:before, .util-pagination span:before, .util-prev:before,
.util-next:before, .visual-switch strong:before, .visual-switch a:before, .visual-buttons a:after, .directsearch button:after, .directsearch .toggle-search:after, .mainnavigation .submenu > li > a:after, .mainnavigation .submenu .submenu .mainnavigation-teaser a:before, .metanavigation-toggle a:after,
.metanavigation-dropdown a:after, li.metanavigation-worldwide > a:before, a.metanavigation-close:before, .metanavigation-layer .grid .grid-50 .metanavigation-login button:after, .metanavigation-layer .grid .grid-50 .buttonlink:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:after, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:after,
.metanavigation-layer .grid .grid-50 .formular .form-input-tb input:after, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:after,
.metanavigation-layer .grid .grid-50 .formular .form-button button:after, .formular .form-button .metanavigation-layer .grid .grid-50 button:after, .dl-trigger:before, .dl-menu .dl-sub:before, .dl-indentionlevel a:first-child:before, .footernavigation a:before, .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .content-wrapper::before, .description-helper-text:after {
  font-family: 'icomoon';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-logout:before {
  content: "\e900"; }

.icon-email21:before, .mail:before {
  content: "\e613"; }

.icon-phone16:before,
.phone:before {
  content: "\e614"; }

.icon-pin56:before,
.address:before {
  content: "\e615"; }

.icon-printer11:before,
.fax:before {
  content: "\e616"; }

.icon-error6:before, .formular .form-error .help-block:before,
.formular .has-error .help-block:before {
  content: "\e612"; }

.icon-dot_arrow_down:before, .dl-menu .dl-sub:before {
  content: "\e607"; }

.icon-home:before, .content .grid-100 .trail li.first a:before,
.content .grid-75 .trail li.first a:before,
.web:before, .dl-indentionlevel a:first-child:before {
  content: "\e611"; }

.icon-slider_outline:before, .util-pagination span:before, .visual-switch a:before {
  content: "\e601"; }

.icon-zoom:before, .fancybox span.first:before {
  content: "\e600"; }

.icon-search:before, .fancybox span:before, .directsearch .toggle-search:after, .dl-menuheader .directsearch button:after {
  content: "\e602"; }

.icon-accordion_meta_down:before, .accordion dt a:before, .metanavigation-toggle:not(.active) > a:after,
.metanavigation-dropdown:not(.active) > a:after {
  content: "\e603"; }

.icon-slider_left:before, .content .outer-grid ul.history li:nth-child(2n+2) strong:after, .form-help-text:after, .util-prev:before, .description-helper-text:after {
  content: "\e604"; }

.icon-slider_link_right:before, .userroles .grid-20 .csc .aboveleft-image + .content-wrapper:before,
.teaser-slider-primarycolor .grid-33 .csc .aboveleft-image + .content-wrapper:before, .content button:before, .content .buttonlink:before, .content .formular .form-input-tsr input:before, .formular .form-input-tsr .content input:before,
.content .formular .form-input-tb input:before, .formular .form-input-tb .content input:before,
.content .formular .form-button button:before, .formular .form-button .content button:before, .download-teaser div div a:before, .content .outer-grid ul.history li:nth-child(2n+1) strong:after, .form-help-above .form-help-text:after, .form-help-left:after, .form-step li:after, .powermail_tabmenu li:after,
.util-next:before, .directsearch button:after, .mainnavigation .submenu .submenu .mainnavigation-teaser a:before, .metanavigation-layer .grid .grid-50 .metanavigation-login button:after, .metanavigation-layer .grid .grid-50 .buttonlink:after, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:after, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:after,
.metanavigation-layer .grid .grid-50 .formular .form-input-tb input:after, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:after,
.metanavigation-layer .grid .grid-50 .formular .form-button button:after, .formular .form-button .metanavigation-layer .grid .grid-50 button:after, .footernavigation a:before, .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .content-wrapper::before, .form-rwm-accommodations .accordion dd fieldset .form-checkbox .form-help-text::after, .description-helper-above .description-helper-text:after, .description-helper-left:after {
  content: "\e605"; }

.icon-accordion_meta_up:before, .accordion dt.active a:before, .metanavigation-toggle.active > a:after,
.metanavigation-dropdown.active > a:after {
  content: "\e606"; }

.icon-arrow_open_down:before, .styledSelect:before {
  content: "\e608"; }

.icon-stage_arrow_left:before, .visual-buttons .switch-back:after {
  content: "\e609"; }

.icon-stage_arrow_right:before, .content .grid-100 .trail li a:after,
.content .grid-75 .trail li a:after, .postfix button:before, .visual-buttons .switch-forth:after, .mainnavigation .submenu > li > a:after {
  content: "\e60a"; }

.icon-arrow_open_up:before {
  content: "\e60b"; }

.icon-check_list:before, .fancybox-inner .checked li:before, .content .grid-75 ul.checked li:before, .content .grid-100 ul.checked li:before, .visual-wrapper .csc ul.checked li:before, .fancybox-inner .csc .checked li:before, .onepager ul.checked li:before, .formular .has-success:before {
  content: "\e60c"; }

.icon-world_meta:before, li.metanavigation-worldwide > a:before {
  content: "\e60d"; }

.icon-mobile_menu:before, .dl-trigger:before {
  content: "\e60e"; }

.icon-mobile_close:before, a.metanavigation-close:before, .dl-active:before {
  content: "\e60f"; }

.icon-slider_dot:before, .util-page.active-page span:before,
.util-page:hover span:before, .visual-switch strong:before {
  content: "\e610"; }

/* Components
/* ----------------------------- */
.formular .form-grid img.captcha-image {
  margin: 0; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  dropdown-content
 *
 */
/* dropdown menu */
.dropdown-content {
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 134px;
  max-height: 0;
  padding: 0;
  opacity: 0;
  background: #fff;
  z-index: 199;
  -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  -webkit-transition: opacity 0.6s ease;
  -moz-transition: opacity 0.6s ease;
  -ms-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease; }
  .dropdown-content.show {
    max-height: none;
    opacity: 1; }
  .dropdown-content nav {
    padding-bottom: 10px; }
    .dropdown-content nav a.disabled {
      color: #3e3e3e;
      cursor: default; }
  .dropdown-content a {
    display: block;
    padding: 7px 7px 7px 14px;
    font-size: 1.4em;
    color: #0a2864; }
    .dropdown-content a:link, .dropdown-content a:visited, .dropdown-content a:active {
      color: #0a2864; }
    .dropdown-content a:hover {
      color: #84b400; }
  @media screen and (max-width: 767px) {
    .dropdown-content a {
      padding: 7px 6px; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Form
 *
 */
form .grid {
  overflow: visible; }

.grid-50 input {
  width: 98%; }

input, textarea, select {
  font-size: 1.4em; }

input[type="text"],
input[type="password"],
input[type="email"],
input[type="date"],
input[type="number"] {
  box-sizing: border-box;
  height: 35px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #ced4e0;
  padding: 0 10px;
  margin: 0 0 20px;
  width: 100%;
  display: block;
  clear: both; }

input[type="checkbox"],
input[type="radio"] {
  display: inline-block; }

/* Label */
label,
.form-radiobutton b,
.form-checkbox b {
  font-size: 1.3em;
  display: block;
  margin-bottom: 5px; }

.form-radio-button b,
.form-checkbox b {
  margin-bottom: 10px; }

.form-radio-button input[disabled="disabled"] + label,
.form-checkbox input[disabled="disabled"] + label {
  color: #999; }

.form-radiolist > b {
  margin-bottom: 15px; }

input ~ label {
  display: inline-block; }

/* Textarea */
textarea {
  box-sizing: border-box;
  width: 100%;
  height: 200px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #ced4e0;
  padding: 10px 10px;
  margin: 5px 0 20px; }

.postfix input {
  float: left;
  width: calc(100% - 40px);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.postfix button {
  height: 35px;
  width: 37px;
  float: right;
  position: relative;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  padding: 10px 20px; }
  .postfix button:before {
    position: absolute;
    right: 12px; }
  .postfix button:active, .postfix button.active {
    background-color: #84b400; }

legend,
.form-headline {
  color: #0a2864;
  font-size: 2em;
  font-weight: bold;
  margin: 0 10px 10px 10px; }

/* Selects */
@media only screen {
  select {
    font-size: 1.5em;
    width: 100%;
    margin-bottom: 20px; }
  .content .grid-75 .select .help-block,
  .content .grid-100 .select .help-block {
    font-size: 1em; }
  .styledSelect, .options {
    display: none; } }

@media only screen and (min-width: 768px) {
  .select.select-50 {
    float: left;
    width: 48%; } }

@media only screen and (min-width: 1280px) {
  .s-hidden {
    visibility: hidden;
    padding-right: 10px; }
  select {
    margin-bottom: 0; }
  .content .grid-75 .select, .content .grid-100 .select {
    color: #000;
    cursor: pointer;
    display: inline-block;
    line-height: 35px;
    position: relative; }
    .content .grid-75 .select.select-50, .content .grid-100 .select.select-50 {
      width: 49%;
      margin-bottom: 20px; }
    .content .grid-75 .select.has-success:before, .content .grid-100 .select.has-success:before {
      top: 8px;
      right: 45px;
      pointer-events: none; }
    .content .grid-75 .select .help-block,
    .content .grid-100 .select .help-block {
      width: 100%;
      top: 25px;
      position: absolute; }
      .content .grid-75 .select .help-block:before, .content .grid-100 .select .help-block:before {
        top: -20px;
        right: 45px;
        pointer-events: none; }
    .content .grid-75 .select .styledSelect, .content .grid-100 .select .styledSelect {
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      border-radius: 3px;
      background: #0a2864;
      border: none;
      bottom: 0;
      color: #fff;
      font-size: 1.4em;
      left: 0;
      padding: 0 10px;
      position: absolute;
      right: 0;
      top: 0;
      z-index: 2; }
      .content .grid-75 .select .styledSelect:before, .content .grid-100 .select .styledSelect:before {
        font-size: 1.4em;
        float: right;
        position: relative;
        top: 9px; }
      .content .grid-75 .select .styledSelect:after, .content .grid-100 .select .styledSelect:after {
        border-right: 1px solid #6c7ea2;
        float: right;
        content: "";
        height: 35px;
        margin-right: 5px; }
      .content .grid-75 .select .styledSelect:active, .content .grid-75 .select .styledSelect.active, .content .grid-100 .select .styledSelect:active, .content .grid-100 .select .styledSelect.active {
        background-color: #84b400; }
        .content .grid-75 .select .styledSelect:active:after, .content .grid-75 .select .styledSelect.active:after, .content .grid-100 .select .styledSelect:active:after, .content .grid-100 .select .styledSelect.active:after {
          border-right: 1px solid #e6e9ef; }
    .content .grid-75 .select .loading + .styledSelect:before, .content .grid-100 .select .loading + .styledSelect:before {
      top: 2px; }
    .content .grid-75 .select .options, .content .grid-100 .select .options {
      border: 1px solid #9da9c1;
      background-color: #fff;
      max-height: 240px;
      overflow-x: auto;
      display: none;
      left: 0;
      list-style: none;
      margin: 0 0;
      padding: 1px 0 0;
      position: absolute;
      right: 0;
      top: 33px;
      z-index: 20; }
      .content .grid-75 .select .options.select-top, .content .grid-100 .select .options.select-top {
        top: auto;
        bottom: 33px; }
      .content .grid-75 .select .options li, .content .grid-100 .select .options li {
        background: none;
        line-height: 2.4;
        margin: 0;
        padding: 0 9px; }
        .content .grid-75 .select .options li:hover, .content .grid-100 .select .options li:hover {
          background-color: #6c7ea2;
          color: #fff; }
  .styledSelect, .options {
    display: block; } }

@media only screen and (max-width: 1281px) {
  .select.has-success:before,
  .select.has-error > .help-block:before {
    display: none; } }

.formular {
  /* Buttons */ }
  .formular fieldset {
    position: relative;
    background: #e6e9ef;
    padding: 20px 20px 5px 20px;
    margin-bottom: 5em; }
    .formular fieldset a {
      color: #0a2864; }
      .formular fieldset a:hover, .formular fieldset a:focus {
        text-decoration: underline; }
    .formular fieldset fieldset {
      padding: 0;
      margin-bottom: 0; }
  .formular .price-heat {
    background-image: url(../images/price_heat_bg.png);
    background-repeat: no-repeat;
    background-position: right 3em; }
  .formular .price-heat-small {
    background-image: url(../images/price_heat_small_bg.png);
    background-repeat: no-repeat;
    background-position: right 3em; }
  .formular .price-water {
    background-image: url(../images/price_water_bg.png);
    background-repeat: no-repeat;
    background-position: right 3em; }
  .formular .price-water-small {
    background-image: url(../images/price_water_small_bg.png);
    background-repeat: no-repeat;
    background-position: right 3em; }
  .formular .price-gas {
    background-image: url(../images/pulsonic.png);
    background-repeat: no-repeat;
    background-position: right 3em; }
  .formular legend {
    float: left;
    clear: both;
    width: 100%;
    margin: 0 0 1em 0;
    padding: 0; }
  .formular img {
    margin-bottom: 20px; }
  .formular .form-hint,
  .formular ul.form-list li,
  .formular ol.form-list li,
  .formular .csc-form-element-textblock {
    font-size: 1.3em; }
  .formular ol.form-list li {
    margin-bottom: 10px; }
  .formular ul.form-list li {
    margin-left: 15px;
    margin-bottom: 10px; }
  .formular .form-list {
    margin-bottom: 25px; }
  .formular .form-button-right {
    float: right; }
  .formular .buttonlink.form-button-left, .formular .form-input-tsr input.form-button-left,
  .formular .form-input-tb input.form-button-left,
  .formular .form-button button.form-button-left, .formular button.form-button-left {
    float: left;
    background-color: #6c7ea2;
    padding: 10px 20px 10px 31px; }
    .formular .buttonlink.form-button-left:hover, .formular .form-input-tsr input.form-button-left:hover,
    .formular .form-input-tb input.form-button-left:hover,
    .formular .form-button button.form-button-left:hover, .formular button.form-button-left:hover {
      background-color: #84b400; }
    .formular .buttonlink.form-button-left:before, .formular .form-input-tsr input.form-button-left:before,
    .formular .form-input-tb input.form-button-left:before,
    .formular .form-button button.form-button-left:before, .formular button.form-button-left:before {
      left: 12px;
      right: auto;
      float: left;
      content: "\e604"; }
  .formular .form-input,
  .formular .form-textarea,
  .formular .form-checkbox,
  .formular .form-submit,
  .formular .form-select,
  .formular .form-multiple-select,
  .formular .form-radiobutton,
  .formular .form-file,
  .formular .form-duplicate-button,
  .formular .csc-form-element-submit {
    position: relative;
    margin-bottom: 2.5em; }
  .formular .form-select select,
  .formular .form-multiple-select select {
    clear: both; }
  .formular .form-input label,
  .formular .form-textarea label,
  .formular .form-captcha label,
  .formular .form-captcha label,
  .formular .form-select > label,
  .formular .form-multiple-select > label,
  .formular .form-file label {
    display: inline-block;
    font-weight: normal;
    float: left; }
  .formular .form-radiobutton > div,
  .formular .form-checkbox > div {
    display: table;
    position: relative;
    max-width: 60%; }
    @media only screen and (min-width: 1280px) {
      .formular .form-radiobutton > div,
      .formular .form-checkbox > div {
        max-width: 90%; } }
    .formular .form-radiobutton > div > b,
    .formular .form-checkbox > div > b {
      float: left;
      padding-right: 30px; }
    .formular .form-radiobutton > div .form-help-link,
    .formular .form-checkbox > div .form-help-link {
      position: absolute;
      right: 0;
      left: auto; }
  .formular .form-radiobutton b,
  .formular .form-checkbox b {
    display: block;
    font-weight: normal; }
  .formular .form-checkbox > label,
  .formular .form-group.form-checkbox > label,
  .formular .form-radiolist.form-radiobutton > label {
    float: left;
    display: block;
    max-width: 85%;
    margin-bottom: 10px; }
  .formular .form-checkbox > input,
  .formular .form-radiolist > input {
    float: left;
    clear: left;
    margin-top: 2px;
    margin-right: 7px; }
  .formular .form-input input,
  .formular .form-captcha input,
  .formular .form-textarea textarea {
    width: 100%;
    margin-bottom: 0; }
  .formular .form-input input::-ms-clear,
  .formular .form-captcha input::-ms-clear {
    display: none;
    width: 0;
    height: 0; }
  .formular .form-select,
  .formular .form-multiple-select {
    font-size: 1.3em; }
    .formular .form-select > fieldset,
    .formular .form-multiple-select > fieldset {
      font-size: 0.76923076923077em; }
    .formular .form-select .select,
    .formular .form-multiple-select .select {
      width: 100%;
      min-height: 35px; }
    .formular .form-select > label,
    .formular .form-select > .help-block,
    .formular .form-select > .select .styledSelect,
    .formular .form-select .select .options li,
    .formular .form-multiple-select > label,
    .formular .form-multiple-select > .help-block,
    .formular .form-multiple-select > .select .styledSelect,
    .formular .form-multiple-select .select .options li {
      font-size: 1em; }
    .formular .form-select select,
    .formular .form-multiple-select select {
      display: block;
      font-family: Arial, Verdana, sans-serif;
      line-height: 1;
      width: 100%;
      font-size: 1em; }
  .formular .form-select.has-success:before,
  .formular .form-multiple-select.has-success:before,
  .formular .form-checkbox.has-success:before,
  .formular .form-radiobutton.has-success:before {
    content: ''; }
  .formular #form-file-upload {
    width: 60%; }
  .formular .indent {
    margin: 0 0 15px 40%; }
  .formular div.form-hidden,
  .formular input.form-hidden,
  .formular input[type="hidden"] {
    float: none;
    display: none; }
  .formular .form-input label span,
  .formular .form-textarea label span,
  .formular .form-checkbox span,
  .formular .form-radiobutton span,
  .formular .form-select span,
  .formular .form-multiple-select span,
  .formular .form-file span,
  .formular .form-hint span,
  .formular span.form-required {
    color: red; }
  .formular .form-input label small,
  .formular .form-textarea label small {
    font-size: 1em; }
  .formular .form-group > label {
    margin: 0 15px 0 0; }
  .formular .form-error-box {
    color: red;
    padding: 5px 20px 5px 5px;
    margin: 0 0 15px 30px;
    font-size: 1.3em; }
    .formular .form-error-box li {
      margin-bottom: 0.5em; }
    .content .formular .form-error-box ul li {
      background: none;
      padding-left: 0;
      font-size: 1.3em; }
  .formular .form-error label, .formular .form-error b {
    color: red; }
  .formular .form-error > input,
  .formular .form-error > textarea,
  .formular .has-error > input,
  .formular .has-error > textarea {
    border: 1px solid red; }
  .formular .form-error .help-block,
  .formular .has-error .help-block {
    color: red;
    clear: both; }
    .formular .form-error .help-block:before,
    .formular .has-error .help-block:before {
      z-index: 10; }
  .formular .form-error.form-validate-disable-error-icon .help-block:before,
  .formular .has-error.form-validate-disable-error-icon .help-block:before {
    content: ''; }
  .formular .has-success > input,
  .formular .has-success > textarea {
    border: 1px solid #84b400; }
  .formular .has-success:before {
    position: absolute;
    bottom: 10px;
    right: 15px;
    font-size: 1.5em;
    color: #84b400;
    z-index: 10; }
  .formular .help-block {
    position: relative;
    display: block;
    margin: 0.5em 0 0 0;
    font-size: 1.3em; }
    .formular .help-block:before {
      position: absolute;
      top: -30px;
      right: 15px; }
  .formular table td,
  .formular table th {
    position: relative; }
    .formular table td.has-success:before,
    .formular table th.has-success:before {
      display: none; }
    .formular table td input,
    .formular table th input {
      font-size: 1em; }

.form-input .help-block:before,
.form-input.has-success:before {
  background: #fff;
  width: 15px;
  text-align: right; }

.form-input.has-success:before {
  width: 25px; }

.form-target-hidden-01,
.form-target-hidden-02,
.form-target-hidden-03,
.form-target-hidden-04,
.form-target-hidden-05 {
  display: none;
  margin-top: 25px;
  clear: both; }
  .form-checkbox.form-group > .form-target-hidden-01, .form-checkbox.form-group >
  .form-target-hidden-02, .form-checkbox.form-group >
  .form-target-hidden-03, .form-checkbox.form-group >
  .form-target-hidden-04, .form-checkbox.form-group >
  .form-target-hidden-05 {
    padding-top: 15px; }
  .form-target-hidden-01 legend,
  .form-target-hidden-02 legend,
  .form-target-hidden-03 legend,
  .form-target-hidden-04 legend,
  .form-target-hidden-05 legend {
    font-size: 1.5em; }
  .form-target-hidden-01 > div:last-child:not(.form-added-content-01) > div,
  .form-target-hidden-02 > div:last-child:not(.form-added-content-01) > div,
  .form-target-hidden-03 > div:last-child:not(.form-added-content-01) > div,
  .form-target-hidden-04 > div:last-child:not(.form-added-content-01) > div,
  .form-target-hidden-05 > div:last-child:not(.form-added-content-01) > div {
    margin-bottom: 0; }

fieldset fieldset legend {
  font-size: 1.5em; }

#contactperson {
  display: block;
  margin-top: 25px;
  clear: both; }

.form-target-01:checked ~ .form-target-hidden-01,
.form-target-02:checked ~ .form-target-hidden-02,
.form-target-03:checked ~ .form-target-hidden-03,
.form-target-04:checked ~ .form-target-hidden-04,
.form-target-05:checked ~ .form-target-hidden-05,
select.form-target-01 ~ .form-target-hidden-01,
select.form-target-02 ~ .form-target-hidden-02,
select.form-target-03 ~ .form-target-hidden-03,
select.form-target-04 ~ .form-target-hidden-04,
select.form-target-05 ~ .form-target-hidden-05,
.form-target-sub-01:checked ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-01,
.form-target-sub-02:checked ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-02,
select.form-target-sub-01 ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-01,
select.form-target-sub-02 ~ fieldset[class*="form-target-hidden-"] .form-target-hidden-sub-02,
.form-add-button-01:checked ~ .form-added-content-01 {
  display: block; }

.form-target-hidden-sub-01,
.form-target-hidden-sub-02,
.form-added-content-01,
.form-added-content-02,
fieldset[class*="form-target-hidden-"].form-target-hidden-sub-01,
input[class*="form-target-"]:checked ~ fieldset[class*="form-target-hidden-"].form-target-hidden-sub-01,
fieldset[class*="form-target-hidden-"].form-target-hidden-sub-02,
input[class*="form-target-"]:checked ~ fieldset[class*="form-target-hidden-"].form-target-hidden-sub-02 {
  display: none; }

/*.formular input.form-add-button-01 {
  display: none;

  & + label {
    width: 100%;
    color: $primaryColor;
    font-weight: bold;
    cursor: pointer;

    span {
      color: $primaryColor;
    }

    &:hover,
    &:hover span {
      text-decoration: underline;
    }

    .form-remove-text {
      display: none;
    }

    &:before {
      content: '+ ';
    }
  }

  // aktiver Zustand
  &:checked + label {
    margin-bottom: 25px;

    .form-remove-text {
      display: inline-block;
    }

    .form-add-text {
      display: none;
    }

    &:before {
      content: '- ';
    }
  }
}*/
.form-add-button,
.form-remove-button {
  color: #0a2864;
  font-size: 1.3em;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  clear: both;
  display: table;
  margin: 0 0 10px 0;
  padding: 5px 0 2px 27px;
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_plus.gif) top left no-repeat;
  background-size: auto 25px; }
  .form-add-button:hover,
  .form-remove-button:hover {
    text-decoration: underline; }
  .form-add-button:last-child,
  .form-remove-button:last-child {
    margin-bottom: 0; }

.form-remove-button {
  background-image: url(/fileadmin/twt_customer/base/system/templates/images/ico_minus.gif); }
  .form-remove-button:hover {
    opacity: 0.4; }

.form-help-above {
  position: absolute;
  right: 25px; }
  .form-help-above .form-help-text {
    top: -15px;
    left: auto;
    right: 160%; }
    .form-help-above .form-help-text:after {
      top: 0;
      left: auto;
      right: -31px;
      text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); }

.form-help-link {
  position: relative;
  display: inline-block;
  top: -5px;
  left: 5px;
  margin-bottom: -5px;
  float: left;
  height: 25px;
  width: 25px;
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_faq.png) no-repeat;
  background-size: cover;
  text-indent: -9999px; }

.form-help-text {
  display: none !important;
  position: absolute !important;
  top: 0;
  left: 102%;
  background: #fff;
  width: 100%;
  min-width: 250px !important;
  max-width: 250px !important;
  min-height: 40px;
  padding: 15px 25px;
  -webkit-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  -moz-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  z-index: 15; }
  .form-help-text.form-help-top {
    top: auto;
    bottom: -40px; }
    .form-help-text.form-help-top:after {
      top: auto;
      bottom: 10px; }
  .form-grid-100.form-select > .form-help-text,
  .form-grid-100.form-checkbox.form-group > .form-help-text,
  .form-grid-100.form-multiple-select > .form-help-text {
    left: 52%; }
  .form-help-text p {
    font-size: 1.3em; }
    .form-select > .form-help-text p,
    .form-multiple-select > .form-help-text p {
      font-size: 1em; }
    .form-help-text p:last-child {
      margin-bottom: 0; }
  .form-help-text:after {
    color: #fff;
    position: absolute;
    left: -33px;
    top: 10px;
    font-size: 5em;
    line-height: 1;
    text-shadow: -2px 1px 1px rgba(62, 62, 62, 0.05);
    z-index: -1; }
    .form-select > .form-help-text:after,
    .form-multiple-select > .form-help-text:after {
      font-size: 3.84615384em; }
  .form-help-text.form-help-visible {
    display: block !important; }
  table .form-help-text p {
    font-size: 1em; }
  table .form-help-text:after {
    font-size: 3.84615384em; }

.content .form-help-text ul {
  margin-bottom: 25px; }
  .content .form-help-text ul li {
    font-size: 1.3em; }

/* IE9 Fix */
.form-select .form-help-text:after,
.form-multiple-select .form-help-text:after {
  font-size: 3.25rem \0; }

.form-select > .select .styledSelect:before,
.form-multiple-select > .select .styledSelect:before {
  font-size: 0.65rem \0; }

.form-help-left {
  left: auto;
  right: 102%; }
  .form-help-left:after {
    left: auto;
    right: -31px;
    text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); }

@media only screen and (max-width: 767px) {
  .formular .form-radiobutton > div,
  .formular .form-checkbox > div {
    width: 100%;
    max-width: none; }
  .form-help-text,
  .form-help-text.form-help-top {
    width: auto;
    max-width: none;
    min-width: 0;
    margin: 20px 0 10px 0;
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    clear: both; }
    .form-help-text:after,
    .form-help-text.form-help-top:after {
      display: none; } }

.form-grid img {
  margin-top: 10px; }

@media only screen and (min-width: 768px) {
  .form-grid {
    margin-left: -10px;
    margin-right: -10px; } }

.form-grid > div {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left; }
  @media only screen and (min-width: 768px) {
    .form-grid > div {
      padding: 0 10px; } }

@media only screen and (min-width: 768px) {
  .form-grid .form-hint {
    padding: 0 10px; } }

.form-grid-25 {
  width: 25%; }

.form-grid-33 {
  width: 33.3333333333%; }
  .form-grid-33 .form-grid-100.form-select > .select,
  .form-grid-33.form-select > .select {
    width: 100%;
    max-width: none;
    display: block; }

.form-grid-50 {
  width: 50%; }

.form-grid-75 {
  width: 75%; }

.form-grid-100 {
  width: 100%; }
  .form-grid-100.form-select > select,
  .form-grid-100.form-select > .select,
  .form-grid-100.form-multiple-select > select,
  .form-grid-100.form-multiple-select > .select {
    max-width: 50%;
    display: block;
    clear: both; }

@media only screen and (max-width: 767px) {
  .form-grid-25,
  .form-grid-33,
  .form-grid-50,
  .form-grid-75 {
    width: 100%;
    padding: 0; } }

.form-grid > .form-summary,
.form-summary {
  width: auto;
  float: none;
  margin: 0 10px 5em 10px;
  padding: 20px 20px 0 20px;
  background: #e6e9ef; }
  .form-grid > .form-summary h1,
  .form-summary h1 {
    font-size: 2em;
    margin-bottom: 10px; }
  .form-grid > .form-summary h2,
  .form-summary h2 {
    float: left; }
  .form-grid > .form-summary .editlink,
  .form-summary .editlink {
    float: right; }
  .form-grid > .form-summary dl, .form-grid > .form-summary ul,
  .form-summary dl,
  .form-summary ul {
    display: inline-block;
    width: 100%;
    clear: both;
    padding: 0; }
  .form-grid > .form-summary dl, .form-grid > .form-summary dt, .form-grid > .form-summary dd,
  .form-summary dl,
  .form-summary dt,
  .form-summary dd {
    margin: 0; }
  .form-grid > .form-summary dt,
  .form-summary dt {
    color: #0a2864;
    margin-bottom: 5px; }
  .form-grid > .form-summary dd,
  .form-summary dd {
    margin-bottom: 25px; }
  .form-grid > .form-summary ul,
  .form-summary ul {
    margin-bottom: 25px; }
  .form-grid > .form-summary p,
  .form-summary p {
    display: inline-block; }
  .form-grid > .form-summary a:not(.editlink),
  .form-summary a:not(.editlink) {
    color: #0a2864;
    text-decoration: none; }
    .form-grid > .form-summary a:not(.editlink):hover, .form-grid > .form-summary a:not(.editlink):focus,
    .form-summary a:not(.editlink):hover,
    .form-summary a:not(.editlink):focus {
      color: #84b400; }
  .formular .form-grid > .form-summary p, .formular .form-grid > .form-summary li, .formular
  .form-summary p, .formular
  .form-summary li {
    font-size: 1.3em; }
  .formular .form-grid > .form-summary ol li, .formular
  .form-summary ol li {
    margin-bottom: 10px; }
  .formular .form-grid > .form-summary ul li, .formular
  .form-summary ul li {
    margin-left: 15px;
    margin-bottom: 10px; }
  .formular .form-grid > .form-summary ol, .formular .form-grid > .form-summary ul, .formular
  .form-summary ol, .formular
  .form-summary ul {
    margin-bottom: 25px; }

.form-step, .powermail_tabmenu {
  padding: 0;
  margin: 0 0 2em 0;
  font-size: 1.3em;
  list-style-position: inside; }
  .form-step strong, .powermail_tabmenu strong {
    font-weight: normal; }
  .form-step li, .powermail_tabmenu li {
    outline: none;
    position: relative;
    float: left;
    background: #e6e9ef;
    margin-bottom: 2px;
    padding: 5px 6px 5px 21px; }
    .form-step li:after, .powermail_tabmenu li:after {
      position: absolute;
      right: -26px;
      font-size: 3.2em;
      top: -9px;
      z-index: 10;
      color: #e6e9ef;
      text-shadow: 2px 0 0 #fff; }
    .form-step li:first-child, .powermail_tabmenu li:first-child {
      padding-left: 10px; }
  .form-step .form-step-done, .powermail_tabmenu .form-step-done {
    background: #9da9c1;
    color: #fff; }
    .form-step .form-step-done:after, .powermail_tabmenu .form-step-done:after {
      color: #9da9c1; }
    .form-step .form-step-done a, .powermail_tabmenu .form-step-done a {
      color: #fff;
      text-decoration: none; }
      .form-step .form-step-done a:hover, .form-step .form-step-done a:focus, .powermail_tabmenu .form-step-done a:hover, .powermail_tabmenu .form-step-done a:focus {
        text-decoration: underline; }
  .form-step .form-step-current, .form-step .act, .powermail_tabmenu .form-step-current, .powermail_tabmenu .act {
    background: #6c7ea2;
    color: #fff; }
    .form-step .form-step-current:after, .form-step .act:after, .powermail_tabmenu .form-step-current:after, .powermail_tabmenu .act:after {
      color: #6c7ea2; }

.form-legend-small {
  font-size: 1.5em; }

.form-watermeter h2 {
  font-size: 1.5em; }

span.form-required {
  color: red; }

/* Text + Bild Elemente */
.formular .form-grid .csc .image-wrapper {
  margin-bottom: 20px; }
  .formular .form-grid .csc .image-wrapper > img {
    margin-bottom: 10px; }

.formular .accordion {
  margin-bottom: 2.5em; }

.formular.demande-de-devis hr {
  border-bottom: 20px solid #e6e9ef;
  margin: 0 -20px;
  height: 7em;
  background: #fff; }

.formular.demande-de-devis .form-grid-50.form-select.has-error .help-block:before {
  display: none; }

.formular.demande-de-devis .form-grid-50.form-select.has-success .help-block:before {
  display: none; }

/* Stile fuer die Formulare aus der Extension */
.csc-form-element {
  margin-bottom: 2.5em; }
  .csc-form-element input {
    margin-bottom: 0; }
  .csc-form-element label strong {
    display: block;
    color: red;
    font-weight: normal;
    margin: 5px 0; }
  .csc-form-element label em {
    text-indent: -9999px;
    position: relative;
    display: inline-block; }
    .csc-form-element label em:before {
      content: ' *';
      position: absolute;
      left: 5px;
      top: 0;
      display: block;
      text-indent: 0;
      color: red; }

.csc-form-element-radio + .csc-form-element-radio,
.csc-form-element-checkbox + .csc-form-element-checkbox {
  margin-top: -2.5em; }

.csc-form-element-submit {
  text-align: right; }
  .csc-form-element-submit input {
    background: #0a2864;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 1.4em;
    padding: 10px 20px;
    text-decoration: none;
    color: white;
    line-height: 1.2;
    border: none;
    margin: 0 0 15px;
    display: inline-block; }
    .csc-form-element-submit input:hover {
      background: #84b400; }

/* JS Form field controls */
.form-field-controls {
  margin: -3em 0 5em 0; }
  .form-field-controls .buttonlink, .form-field-controls .formular .form-input-tsr input, .formular .form-input-tsr .form-field-controls input,
  .form-field-controls .formular .form-input-tb input, .formular .form-input-tb .form-field-controls input,
  .form-field-controls .formular .form-button button, .formular .form-button .form-field-controls button {
    margin-right: 5px;
    padding: 10px 20px;
    color: #0a2864;
    background: #e6e9ef; }
    .form-field-controls .buttonlink span, .form-field-controls .formular .form-input-tsr input span, .formular .form-input-tsr .form-field-controls input span, .form-field-controls .formular .form-input-tb input span, .formular .form-input-tb .form-field-controls input span, .form-field-controls .formular .form-button button span, .formular .form-button .form-field-controls button span {
      display: inline-block;
      margin-right: 3px;
      font-weight: 700; }
    .form-field-controls .buttonlink:before, .form-field-controls .formular .form-input-tsr input:before, .formular .form-input-tsr .form-field-controls input:before,
    .form-field-controls .formular .form-input-tb input:before, .formular .form-input-tb .form-field-controls input:before,
    .form-field-controls .formular .form-button button:before, .formular .form-button .form-field-controls button:before {
      display: none; }
    .form-field-controls .buttonlink:hover, .form-field-controls .formular .form-input-tsr input:hover, .formular .form-input-tsr .form-field-controls input:hover,
    .form-field-controls .formular .form-input-tb input:hover, .formular .form-input-tb .form-field-controls input:hover,
    .form-field-controls .formular .form-button button:hover, .formular .form-button .form-field-controls button:hover {
      color: #84b400; }

/* JS File Upload */
#fieldset-uploads {
  margin-top: -50px;
  padding-top: 0; }
  #fieldset-uploads #uploadcounter {
    font-style: normal; }
  #fieldset-uploads .upload-filelist li {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important; }
  #fieldset-uploads .upload-filelist span {
    display: block;
    width: 100%;
    color: inherit;
    font-size: 13px;
    background: #fff;
    margin: 0;
    padding: 5px 10px;
    border-top: 1px dashed #0a2864;
    text-align: right;
    box-sizing: border-box; }
    #fieldset-uploads .upload-filelist span:first-child {
      border: none; }
    #fieldset-uploads .upload-filelist span a {
      font-size: 13px;
      margin-left: 10px;
      display: inline; }
  #fieldset-uploads .upload-filelist .fakefilefield {
    position: relative; }
    #fieldset-uploads .upload-filelist .fakefilefield button {
      width: 100%;
      margin: 0; }
      #fieldset-uploads .upload-filelist .fakefilefield button:before {
        display: none;
        content: ''; }
    #fieldset-uploads .upload-filelist .fakefilefield input[type=file] {
      opacity: 0;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 99;
      cursor: pointer; }
      #fieldset-uploads .upload-filelist .fakefilefield input[type=file]:hover + button {
        background: #84b400; }

.fakefilefield {
  position: relative; }
  .fakefilefield input[type=file] {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    cursor: pointer; }
  .fakefilefield button {
    width: 100%;
    margin: 0 0 10px 0; }
  .fakefilefield:hover button {
    background: #84b400; }

/* Honeypot */
.femanager_field_ieh-mail {
  position: absolute;
  left: -5000px; }

.form-eaw, .form-rwm, .form-twa {
  margin-bottom: 30px; }

.form-rwm #accommodations + .form-grid {
  margin-top: 45px; }

label p {
  font-size: 1em; }

.form-combobox {
  position: relative; }
  .form-combobox .combobox-list {
    width: 100%;
    max-height: 200px;
    position: absolute;
    top: 55px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    overflow: auto;
    border: 1px solid #ced4e0;
    background: #fff;
    display: none;
    padding-top: 5px;
    padding-left: 5px;
    box-sizing: border-box; }
    .form-combobox .combobox-list ul {
      list-style: none;
      padding: 0;
      margin: 0; }
      .form-combobox .combobox-list ul li {
        background: none;
        padding: 5px; }

/**
 * @package ista Internet Relaunch
 *
 * Content:
 * Powermail
 *
 */
.teaser-radio-group.form-radiobutton > div {
  display: inline-block;
  max-width: none; }

.teaser-radio-group .teaser-radio {
  margin: 0 30px 27px 0;
  width: calc(33% - 20px); }
  .teaser-radio-group .teaser-radio .grid-100 label.csc {
    min-height: inherit; }
  .teaser-radio-group .teaser-radio .grid-100 label {
    display: block; }
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image,
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image .image-wrapper,
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image .image-wrapper img {
      margin: 0;
      max-width: 100%;
      width: 100%; }
    .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper {
      background: rgba(10, 40, 100, 0.9);
      bottom: 3px;
      box-sizing: border-box;
      color: #fff;
      font-family: "TheSansBold", Arial, Verdana, sans-serif;
      height: 53px;
      margin-bottom: 0;
      padding: 5px 13px;
      position: absolute;
      width: 100%; }
      .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper p {
        font-size: 1.225em; }
      .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper::before {
        content: ""; }
    .teaser-radio-group .teaser-radio .grid-100 label:hover {
      opacity: 0.9;
      cursor: pointer; }
  .teaser-radio-group .teaser-radio input[type=radio],
  .teaser-radio-group .teaser-radio input[type=checkbox] {
    display: block;
    margin: 10px auto 0 auto; }
  .teaser-radio-group .teaser-radio:last-of-type {
    margin-right: 0; }

@media screen and (max-width: 768px) {
  .teaser-radio-group.form-radiobutton .teaser-radio {
    width: calc(50% - 20px); }
    .teaser-radio-group.form-radiobutton .teaser-radio:nth-child(odd) {
      margin-right: 0; } }

@media screen and (max-width: 320px) {
  .teaser-radio-group.form-radiobutton .teaser-radio {
    margin: 0 0 27px;
    width: 100%; }
    .teaser-radio-group.form-radiobutton .teaser-radio:last-of-type {
      margin-right: 0; } }

.grid-background .powermail_tabmenu li:not(.act) {
  background: #fff; }

.grid-background .powermail_tabmenu li:not(.act)::after {
  color: #fff; }

.formular.powermail_morestep fieldset.fieldset-iterator-followup {
  display: none; }

.formular.powermail_morestep .powermail_fieldwrap_submit.submit-type-next .form-button-right {
  float: none; }

.formular.powermail_morestep .powermail_fieldwrap_submit.submit-type-prev .form-button-left {
  float: right; }

.formular .powermail_progressbar {
  width: 100%;
  height: 5px;
  clear: both; }
  .formular .powermail_progressbar.disable {
    display: none; }
  .formular .powermail_progressbar > .powermail_progress {
    /* Missing 'r' in 'powermail_progess' is a built in feature in Powermail ;-) */
    background-color: #6c7ea2;
    width: 100%; }
    .formular .powermail_progressbar > .powermail_progress > .powermail_progess_inner {
      height: 5px;
      width: 100%;
      overflow: hidden;
      background: url("/typo3conf/ext/powermail/Resources/Public/Image/icon_loading.gif") repeat-x;
      opacity: 0.25; }

body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu {
  margin: 0 0 2em 0;
  list-style: decimal;
  list-style-position: inside; }
  body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li {
    background: #e6e9ef;
    padding: 5px 6px 5px 21px;
    display: list-item;
    color: #3e3e3e;
    border: 0; }
    body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li:first-child {
      padding-left: 10px; }
    body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li.act {
      background: #6c7ea2;
      cursor: default;
      color: #fff; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  logo-footer
 *
 */
body#country-de .logo-footer {
  width: 100%;
  max-width: 660px; }
  body#country-de .logo-footer img {
    width: 124px; }
  body#country-de .logo-footer .campaign {
    float: right;
    /* for transparent logos
       background-color: #fff;
      */ }
    body#country-de .logo-footer .campaign img {
      width: 124px; }
  body#country-de .logo-footer .campaign.campaign-2 {
    margin-right: 10px; }
  body#country-de .logo-footer .campaign-bigscreen,
  body#country-de .logo-footer .campaign-2 {
    display: inline; }
  body#country-de .logo-footer .campaign-smallscreen {
    display: none; }

@media screen and (max-width: 1178px) {
  body#country-de footer .logo-footer {
    max-width: none; } }

@media screen and (max-width: 767px) {
  body#country-de footer .campaign-bigscreen {
    display: none !important; }
  body#country-de footer .campaign-smallscreen {
    display: inline !important; }
    body#country-de footer .campaign-smallscreen img {
      width: 90px !important; } }

@media screen and (max-width: 415px) {
  body#country-de footer div.logo-footer {
    display: inline;
    max-width: 70px; }
    body#country-de footer div.logo-footer img {
      width: auto; }
  body#country-de footer .campaign,
  body#country-de footer .campaign-2 {
    display: none; } }

@media screen and (max-width: 680px) {
  body#country-de footer img {
    max-width: 65px; }
  body#country-de .campaign-smallscreen {
    display: none !important; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  microsite-smarthome
 *
 */
.onepager header {
  background-color: #ebebeb; }
  @media only screen and (max-width: 1023px) {
    .onepager header {
      background-color: #fff;
      border-color: #ebebeb; } }

.onepager .visual-text {
  width: 50%;
  max-width: none;
  top: 25%;
  left: 25%;
  text-align: center; }
  @media only screen and (max-width: 767px) {
    .onepager .visual-text {
      top: 12%; } }
  .onepager .visual-text h2,
  .onepager .visual-text div.looks_like_a_headline {
    margin-bottom: 0.5em;
    font-size: 6em; }
    @media only screen and (max-width: 1023px) {
      .onepager .visual-text h2,
      .onepager .visual-text div.looks_like_a_headline {
        font-size: 3.6em;
        line-height: 1.38888888888889; } }
    @media only screen and (max-width: 767px) {
      .onepager .visual-text h2,
      .onepager .visual-text div.looks_like_a_headline {
        font-size: 2.1em;
        line-height: 1.095238; } }
  .onepager .visual-text p {
    margin-bottom: 1em;
    font-size: 3.4em; }
    @media only screen and (max-width: 1023px) {
      .onepager .visual-text p {
        font-size: 2em; } }
    @media only screen and (max-width: 767px) {
      .onepager .visual-text p {
        font-size: 1.2em;
        line-height: 1.16666666; } }
  .onepager .visual-text .buttonlink, .onepager .visual-text .formular .form-input-tsr input, .formular .form-input-tsr .onepager .visual-text input,
  .onepager .visual-text .formular .form-input-tb input, .formular .form-input-tb .onepager .visual-text input,
  .onepager .visual-text .formular .form-button button, .formular .form-button .onepager .visual-text button {
    background: transparent;
    padding: 10px 31px 10px 20px;
    color: #0a2864;
    text-transform: uppercase;
    border: 1px solid #0a2864; }
    .onepager .visual-text .buttonlink:before, .onepager .visual-text .formular .form-input-tsr input:before, .formular .form-input-tsr .onepager .visual-text input:before,
    .onepager .visual-text .formular .form-input-tb input:before, .formular .form-input-tb .onepager .visual-text input:before,
    .onepager .visual-text .formular .form-button button:before, .formular .form-button .onepager .visual-text button:before {
      display: none; }
    .onepager .visual-text .buttonlink:hover, .onepager .visual-text .formular .form-input-tsr input:hover, .formular .form-input-tsr .onepager .visual-text input:hover,
    .onepager .visual-text .formular .form-input-tb input:hover, .formular .form-input-tb .onepager .visual-text input:hover,
    .onepager .visual-text .formular .form-button button:hover, .formular .form-button .onepager .visual-text button:hover {
      background: #0a2864;
      color: #fff; }

.onepager .ctype_gallery .visual-wrapper .visual-text {
  position: absolute !important;
  top: 15%;
  left: 50.25%;
  width: 49.75%;
  max-width: 568px;
  text-align: left; }
  .onepager .ctype_gallery .visual-wrapper .visual-text .buttonlink, .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tsr input, .formular .form-input-tsr .onepager .ctype_gallery .visual-wrapper .visual-text input,
  .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tb input, .formular .form-input-tb .onepager .ctype_gallery .visual-wrapper .visual-text input,
  .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-button button, .formular .form-button .onepager .ctype_gallery .visual-wrapper .visual-text button {
    color: #fff;
    background: #0a2864;
    border: none;
    text-transform: none; }
    .onepager .ctype_gallery .visual-wrapper .visual-text .buttonlink:hover, .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tsr input:hover, .formular .form-input-tsr .onepager .ctype_gallery .visual-wrapper .visual-text input:hover,
    .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tb input:hover, .formular .form-input-tb .onepager .ctype_gallery .visual-wrapper .visual-text input:hover,
    .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-button button:hover, .formular .form-button .onepager .ctype_gallery .visual-wrapper .visual-text button:hover {
      background: #84b400; }
    .onepager .ctype_gallery .visual-wrapper .visual-text .buttonlink:before, .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tsr input:before, .formular .form-input-tsr .onepager .ctype_gallery .visual-wrapper .visual-text input:before,
    .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-input-tb input:before, .formular .form-input-tb .onepager .ctype_gallery .visual-wrapper .visual-text input:before,
    .onepager .ctype_gallery .visual-wrapper .visual-text .formular .form-button button:before, .formular .form-button .onepager .ctype_gallery .visual-wrapper .visual-text button:before {
      position: absolute;
      right: 12px;
      top: 50%;
      margin-top: -7px;
      float: right;
      display: block; }

@media screen and (min-width: 1280px) {
  .onepager .visual-wrapper,
  .onepager .visual {
    height: 560px; } }

@media only screen and (min-width: 1024px) {
  .onepager .has-mediastage .content {
    top: 0;
    margin-bottom: 0; } }

.onepager .outer-grid .grid[style*="background-image"] > h1,
.onepager .outer-grid .grid[style*="background-image"] > h2,
.onepager .outer-grid .grid[style*="background-image"] > h3,
.onepager .outer-grid .grid[style*="background-image"] > h4,
.onepager .outer-grid .grid[style*="background-image"] > h5,
.onepager .outer-grid .grid[style*="background-image"] > h6,
.onepager .outer-grid .grid[style*="background-image"] div.looks_like_a_headline {
  padding-bottom: 350px; }
  @media only screen and (max-width: 767px) {
    .onepager .outer-grid .grid[style*="background-image"] > h1,
    .onepager .outer-grid .grid[style*="background-image"] > h2,
    .onepager .outer-grid .grid[style*="background-image"] > h3,
    .onepager .outer-grid .grid[style*="background-image"] > h4,
    .onepager .outer-grid .grid[style*="background-image"] > h5,
    .onepager .outer-grid .grid[style*="background-image"] > h6,
    .onepager .outer-grid .grid[style*="background-image"] div.looks_like_a_headline {
      padding: 30px 0; } }

.onepager .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 > .csc {
  background: none; }

.onepager {
  /** We got different dom structure on microsite so we have to adjust this (remove first, then set it to next level) **/
  /*.grid-background {
    .grid-100 {
      width: 50%;
      margin: 0 auto;
      float: initial;

      @media (max-width:$pre-tablet) {
        width: 80%;
      }

      .formular {
        fieldset {
          margin-bottom: 0;
        }
      }
    }
  }*/ }
  @media (max-width: 767px) {
    .onepager .metanavigation {
      display: none; } }
  .onepager .category-box > div > div {
    background: no-repeat center center;
    min-height: 0px;
    margin: 0px;
    padding: 0px;
    box-shadow: none; }
  .onepager .category-box > div > div > div {
    background: no-repeat center center;
    min-height: 215px;
    margin: 25px 0 30px 0;
    padding: 20px;
    box-shadow: 1px 1px 1px #e6e9ef; }
  .onepager .content > div {
    margin-bottom: 30px; }
  .onepager .form-locationfinder.formular fieldset {
    margin-bottom: 0px; }
  .onepager .grid-25 .aboveleft-image .image-wrapper, .onepager .grid-25 .aboveleft-image .image-wrapper img {
    width: 100%; }
  .onepager div.grid-background {
    background-image: none !important;
    background-color: #e6e9ef;
    /* Weird grid behaviour.. fixes 50 / 50 grids that follow up another 50/50 grid*/ }
    .onepager div.grid-background .grid-50 .grid.download-teaser {
      margin: 0 auto 15px auto; }
    .onepager div.grid-background .grid.outer-grid .grid-100 .grid {
      margin-bottom: 0px; }
      .onepager div.grid-background .grid.outer-grid .grid-100 .grid .grid-50 {
        background: none; }
  .onepager div.has-background-image .grid.outer-grid > h1, .onepager div.has-background-image .grid.outer-grid > h2, .onepager div.has-background-image .grid.outer-grid > h3, .onepager div.has-background-image .grid.outer-grid > h4, .onepager div.has-background-image .grid.outer-grid > h5, .onepager div.has-background-image .grid.outer-grid > h6, .onepager div.grid-background .grid.outer-grid > h1, .onepager div.grid-background .grid.outer-grid > h2, .onepager div.grid-background .grid.outer-grid > h3, .onepager div.grid-background .grid.outer-grid > h4, .onepager div.grid-background .grid.outer-grid > h5, .onepager div.grid-background .grid.outer-grid > h6 {
    padding-top: 30px; }
  .onepager .grid .grid {
    margin-bottom: 0px;
    background: none; }
  .onepager .grid .grid-50:not(.grid-empty), .onepager .grid .grid-33:not(.grid-empty), .onepager .grid .grid-25:not(.grid-empty) {
    padding: 20px 15px; }
  .onepager .grid .grid-50 .formular fieldset, .onepager .grid .grid-33 .formular fieldset, .onepager .grid .grid-25 .formular fieldset {
    padding: 0px;
    background: none; }
  .onepager .grid.teaser-slider-33 .grid-33 {
    padding: 0px; }
  .onepager .grid .grid-25 .ctype_textpic, .onepager .grid .grid-33 .ctype_textpic {
    text-align: center; }
    .onepager .grid .grid-25 .ctype_textpic.button-wrapper, .onepager .grid .grid-33 .ctype_textpic.button-wrapper {
      text-align: center;
      width: 100%;
      position: absolute;
      bottom: -15px; }
  @media only screen and (max-width: 1281px) {
    .onepager .grid > .grid-25 {
      display: block;
      width: 50%; } }
  @media only screen and (max-width: 767px) {
    .onepager .grid > .grid-25 {
      width: 100%;
      margin-bottom: 10px;
      padding: 0;
      float: none; } }
  .onepager div.has-background-image, .onepager div.grid-background {
    background-position: center;
    background-size: cover;
    /*&.cover {
      background-size: cover;
    }*/ }
    .onepager div.has-background-image .grid.outer-grid .grid-50:not(.grid-empty) > div, .onepager div.has-background-image .grid.outer-grid .grid-50:not(.grid-empty) > form, .onepager div.has-background-image .grid.outer-grid .grid-33:not(.grid-empty) > div, .onepager div.has-background-image .grid.outer-grid .grid-33:not(.grid-empty) > form, .onepager div.has-background-image .grid.outer-grid .grid-25:not(.grid-empty) > div, .onepager div.has-background-image .grid.outer-grid .grid-25:not(.grid-empty) > form, .onepager div.grid-background .grid.outer-grid .grid-50:not(.grid-empty) > div, .onepager div.grid-background .grid.outer-grid .grid-50:not(.grid-empty) > form, .onepager div.grid-background .grid.outer-grid .grid-33:not(.grid-empty) > div, .onepager div.grid-background .grid.outer-grid .grid-33:not(.grid-empty) > form, .onepager div.grid-background .grid.outer-grid .grid-25:not(.grid-empty) > div, .onepager div.grid-background .grid.outer-grid .grid-25:not(.grid-empty) > form {
      background-color: white;
      padding: 20px 15px; }
  .onepager .grid {
    /*.grid-50 {
      padding: 25px;
      width: 50%;

      @media (max-width:$pre-tablet) {
        width: 100%;
      }
    }*/ }
    .onepager .grid .abovecenter-image ~ .button-wrapper {
      text-align: center;
      width: 100%;
      position: absolute;
      bottom: -15px; }
    .onepager .grid .download-teaser {
      background-color: #e6e9ef;
      padding: 20px; }
      .onepager .grid .download-teaser h2 {
        margin-bottom: 0; }
      .onepager .grid .download-teaser .grid-33 {
        background: transparent; }
        @media only screen and (max-width: 767px) {
          .onepager .grid .download-teaser .grid-33 {
            text-align: center; }
            .onepager .grid .download-teaser .grid-33 img {
              display: inline !important; } }
    .onepager .grid .grid-100 > .grid[style*="background-image"]:first-child {
      background-size: cover;
      background-position: center;
      /*@media (max-width:$pre-tablet) {
        height: 450px;
      }*/ }
    @media (max-width: 767px) {
      .onepager .grid[style*="background-image"] > h1, .onepager .grid[style*="background-image"] > h2, .onepager .grid[style*="background-image"] > h3, .onepager .grid[style*="background-image"] > h4, .onepager .grid[style*="background-image"] > h5, .onepager .grid[style*="background-image"] > h6 {
        padding-bottom: 15px; } }
    .onepager .grid .grid-25 {
      /*margin-right: 2%;
      width: 23%;
      padding: 15px;*/ }
      @media (max-width: 767px) {
        .onepager .grid .grid-25 {
          width: 100%;
          box-sizing: border-box;
          margin-right: 0; } }
  .onepager .form-locationfinder {
    margin-top: 15px; }
    @media (max-width: 767px) {
      .onepager .form-locationfinder {
        text-align: center; } }
  .onepager .content-wrapper .teaser-wrapper h1 {
    font-size: 5.5em;
    margin-bottom: -60px; }
  .onepager .teaser-btn-wrapper {
    position: relative;
    top: 100px;
    left: 75px; }
    .onepager .teaser-btn-wrapper .teaser-btn {
      display: inline-block;
      margin-right: 10px; }
    @media (max-width: 767px) {
      .onepager .teaser-btn-wrapper {
        left: 0; } }
  .onepager .outer-grid .grid.grid-background .grid-50 .content-wrapper p {
    margin-left: -10px; }
  .onepager .outer-grid .grid.grid-background .grid-50 form h4 {
    margin-left: 20px; }

.onepager .outer-grid .grid[style*="background-image"] > h1,
.onepager .outer-grid .grid[style*="background-image"] > h2,
.onepager .outer-grid .grid[style*="background-image"] > h3,
.onepager .outer-grid .grid[style*="background-image"] > h4,
.onepager .outer-grid .grid[style*="background-image"] > h5,
.onepager .outer-grid .grid[style*="background-image"] > h6,
.onepager .outer-grid .grid[style*="background-image"] div.looks_like_a_headline {
  padding-bottom: 350px; }

@media only screen and (max-width: 767px) {
  .onepager .outer-grid .grid[style*="background-image"] > h1,
  .onepager .outer-grid .grid[style*="background-image"] > h2,
  .onepager .outer-grid .grid[style*="background-image"] > h3,
  .onepager .outer-grid .grid[style*="background-image"] > h4,
  .onepager .outer-grid .grid[style*="background-image"] > h5,
  .onepager .outer-grid .grid[style*="background-image"] > h6,
  .onepager .outer-grid .grid[style*="background-image"] div.looks_like_a_headline {
    padding: 30px 0; } }

.onepager .outer-grid .grid.grid-background:not(.teaser-slider-25):not(.teaser-slider-33):not(.userroles) .grid-33 > .csc {
  background: none; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  Slider
 *
 */
/*UtilCarousel Base Style*/
.grid > div.util-carousel {
  padding: 0; }

.util-carousel {
  display: none;
  position: relative;
  -ms-touch-action: pan-y;
  width: 100%; }
  .util-carousel .util-wrapper-holder {
    overflow: hidden;
    position: relative;
    width: 100%; }
  .util-carousel .util-wrapper {
    *zoom: 1;
    position: relative;
    display: none; }
    .util-carousel .util-wrapper:before, .util-carousel .util-wrapper:after {
      display: table;
      content: "";
      line-height: 0; }
    .util-carousel .util-wrapper:after {
      clear: both; }
  .util-carousel .util-item {
    float: left;
    box-sizing: border-box;
    padding: 0 15px; }
  .util-carousel .util-wrapper,
  .util-carousel .util-item {
    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
    -webkit-transform: translate3d(0, 0, 0); }

/* UtilCarousel Defualt Theme */
.util-pagination {
  position: absolute;
  width: 100%;
  text-align: center;
  margin-top: 56px;
  z-index: 1; }
  @media only screen and (max-width: 767px) {
    .util-pagination {
      margin-top: 20px; } }
  .userroles .util-pagination,
  .teaser-slider-primarycolor .util-pagination {
    margin-top: 10px; }
  .util-pagination span {
    display: block;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
    margin: 5px;
    color: #6c7ea2;
    font-size: 1.8em; }

.util-page {
  display: inline-block;
  cursor: pointer;
  zoom: 1;
  *display: inline; }

.util-navigation {
  margin-top: 46px;
  text-align: center; }
  @media only screen and (max-width: 767px) {
    .util-navigation {
      margin-top: 5px; } }
  .userroles .util-navigation,
  .teaser-slider-primarycolor .util-navigation {
    margin-top: 0; }
    @media only screen and (max-width: 767px) {
      .userroles .util-navigation,
      .teaser-slider-primarycolor .util-navigation {
        margin-top: -5px; } }

.util-prev,
.util-next {
  position: relative;
  display: inline-block;
  padding: 15px;
  color: #6c7ea2;
  border-radius: 3px;
  cursor: pointer;
  font-size: 13px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  transition: all 0.2s;
  z-index: 10;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .util-prev:before,
  .util-next:before {
    font-size: 1.4em; }
    @media only screen and (max-width: 1023px) {
      .util-prev:before,
      .util-next:before {
        font-size: 2.4em; } }

.util-prev {
  float: left; }
  @media only screen and (max-width: 767px) {
    .util-prev {
      padding-left: 0;
      left: -10px; } }

.util-next {
  float: right; }
  @media only screen and (max-width: 767px) {
    .util-next {
      padding-right: 0;
      right: -9px; } }

.util-disable,
.util-disable:hover {
  background-color: #bbbbbb;
  opacity: 0.4;
  cursor: default; }

/*UtilCarousel animations*/
.util-fade-in, .util-flip-in-x, .util-flip-in-y, .util-zoom-in {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

@-webkit-keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.util-fade-in {
  -webkit-animation-name: fade-in;
  animation-name: fade-in; }

@-webkit-keyframes flip-in-x {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg) scale(0.3);
    transform: perspective(400px) rotateX(90deg) scale(0.3);
    opacity: 0; }
  100% {
    -webkit-transform: perspective(400px) rotateX(0deg) scale(1);
    transform: perspective(400px) rotateX(0deg) scale(1);
    opacity: 1; } }

@keyframes flip-in-x {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg) scale(0.3);
    -ms-transform: perspective(400px) rotateX(90deg) scale(0.3);
    transform: perspective(400px) rotateX(90deg) scale(0.3);
    opacity: 0; }
  100% {
    -webkit-transform: perspective(400px) rotateX(0deg) scale(1);
    -ms-transform: perspective(400px) rotateX(0deg) scale(1);
    transform: perspective(400px) rotateX(0deg) scale(1);
    opacity: 1; } }

.util-flip-in-x {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flip-in-x;
  animation-name: flip-in-x; }

@-webkit-keyframes flip-in-y {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg) scale(0.3);
    transform: perspective(400px) rotateY(90deg) scale(0.3);
    opacity: 0; }
  100% {
    -webkit-transform: perspective(400px) rotateY(0deg) scale(1);
    transform: perspective(400px) rotateY(0deg) scale(1);
    opacity: 1; } }

@keyframes flip-in-y {
  0% {
    -moz-transform: perspective(400px) rotateY(90deg) scale(0.3);
    -ms-transform: perspective(400px) rotateY(90deg) scale(0.3);
    -webkit-transform: perspective(400px) rotateY(90deg) scale(0.3);
    transform: perspective(400px) rotateY(90deg) scale(0.3);
    opacity: 0; }
  100% {
    -moz-transform: perspective(400px) rotateY(0deg) scale(1);
    -ms-transform: perspective(400px) rotateY(0deg) scale(1);
    -webkit-transform: perspective(400px) rotateY(0deg) scale(1);
    transform: perspective(400px) rotateY(0deg) scale(1);
    opacity: 1; } }

.util-flip-in-y {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flip-in-y;
  animation-name: flip-in-y; }

@-webkit-keyframes zoom-in {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3);
    -ms-transform: scale(0.3);
    -webkit-transform: scale(0.3);
    transform: scale(0.3); }
  100% {
    opacity: 1;
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes zoom-in {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3);
    -ms-transform: scale(0.3);
    -webkit-transform: scale(0.3);
    transform: scale(0.3); }
  100% {
    opacity: 1;
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1); } }

.util-zoom-in {
  -webkit-animation-name: zoom-in;
  animation-name: zoom-in; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  visual-wrapper
 *  visual
 *  visual-text
 *  visual-controls
 *  visual-switch
 *  visual-buttons
 *  visual-show
 *  visual-hide
 *  visual-toggle-in
 *  visual-toggle-out
 *  no-csstransitions
 *
 */
.visual-wrapper {
  width: 100%;
  max-width: 100%;
  position: relative;
  background: #fff;
  margin-bottom: 45px;
  clear: both;
  float: none;
  display: table; }
  @media screen and (min-width: 1280px) {
    .visual-wrapper {
      height: 720px;
      overflow: hidden; } }
  @media only screen and (max-width: 767px) {
    .visual-wrapper {
      display: block; } }
  .visual-wrapper:after {
    clear: both; }
  .visual-wrapper .content-wrapper {
    float: right;
    position: relative;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px 20px 0 30px; }
    @media only screen and (max-width: 767px) {
      .visual-wrapper .content-wrapper {
        padding-top: 15px; } }
  .visual-wrapper .button-wrapper {
    position: absolute;
    top: 200px;
    left: 30px;
    z-index: 21;
    background: #fff;
    width: 80%; }
  .visual-wrapper .left-image,
  .visual-wrapper .right-image,
  .visual-wrapper .intext-left-image,
  .visual-wrapper .intext-right-image,
  .visual-wrapper .aboveleft-image,
  .visual-wrapper .abovecenter-image,
  .visual-wrapper .aboveright-image {
    float: left;
    display: block;
    max-width: 36%; }
    .visual-wrapper .left-image + .content-wrapper,
    .visual-wrapper .right-image + .content-wrapper,
    .visual-wrapper .intext-left-image + .content-wrapper,
    .visual-wrapper .intext-right-image + .content-wrapper,
    .visual-wrapper .aboveleft-image + .content-wrapper,
    .visual-wrapper .abovecenter-image + .content-wrapper,
    .visual-wrapper .aboveright-image + .content-wrapper {
      width: 64%;
      max-width: 64%;
      padding-left: 0; }
    .visual-wrapper .left-image .image-wrapper,
    .visual-wrapper .right-image .image-wrapper,
    .visual-wrapper .intext-left-image .image-wrapper,
    .visual-wrapper .intext-right-image .image-wrapper,
    .visual-wrapper .aboveleft-image .image-wrapper,
    .visual-wrapper .abovecenter-image .image-wrapper,
    .visual-wrapper .aboveright-image .image-wrapper {
      float: none;
      margin-right: 20px;
      margin-left: 0; }
      @media only screen and (max-width: 767px) {
        .visual-wrapper .left-image .image-wrapper,
        .visual-wrapper .right-image .image-wrapper,
        .visual-wrapper .intext-left-image .image-wrapper,
        .visual-wrapper .intext-right-image .image-wrapper,
        .visual-wrapper .aboveleft-image .image-wrapper,
        .visual-wrapper .abovecenter-image .image-wrapper,
        .visual-wrapper .aboveright-image .image-wrapper {
          margin-right: 10px; } }
    .visual-wrapper .left-image img,
    .visual-wrapper .right-image img,
    .visual-wrapper .intext-left-image img,
    .visual-wrapper .intext-right-image img,
    .visual-wrapper .aboveleft-image img,
    .visual-wrapper .abovecenter-image img,
    .visual-wrapper .aboveright-image img {
      max-height: 100%;
      width: auto;
      height: auto; }
    .visual-wrapper .left-image ~ .button-wrapper,
    .visual-wrapper .right-image ~ .button-wrapper,
    .visual-wrapper .intext-left-image ~ .button-wrapper,
    .visual-wrapper .intext-right-image ~ .button-wrapper,
    .visual-wrapper .aboveleft-image ~ .button-wrapper,
    .visual-wrapper .abovecenter-image ~ .button-wrapper,
    .visual-wrapper .aboveright-image ~ .button-wrapper {
      left: 36%;
      width: 64%; }
      @media only screen and (max-width: 1023px) {
        .visual-wrapper .left-image ~ .button-wrapper,
        .visual-wrapper .right-image ~ .button-wrapper,
        .visual-wrapper .intext-left-image ~ .button-wrapper,
        .visual-wrapper .intext-right-image ~ .button-wrapper,
        .visual-wrapper .aboveleft-image ~ .button-wrapper,
        .visual-wrapper .abovecenter-image ~ .button-wrapper,
        .visual-wrapper .aboveright-image ~ .button-wrapper {
          width: auto; } }
      @media only screen and (max-width: 767px) {
        .visual-wrapper .left-image ~ .button-wrapper,
        .visual-wrapper .right-image ~ .button-wrapper,
        .visual-wrapper .intext-left-image ~ .button-wrapper,
        .visual-wrapper .intext-right-image ~ .button-wrapper,
        .visual-wrapper .aboveleft-image ~ .button-wrapper,
        .visual-wrapper .abovecenter-image ~ .button-wrapper,
        .visual-wrapper .aboveright-image ~ .button-wrapper {
          left: 15px; } }

.visual {
  width: 100%; }
  .visual a.linkall-link {
    content: ' ';
    display: block;
    width: 100%;
    height: 100%;
    background: transparent;
    position: relative; }
  @media screen and (max-width: 1279px) {
    .visual {
      background: none !important; } }
  @media screen and (min-width: 1280px) {
    .visual {
      height: 720px;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center; } }
  .visual img {
    width: 100%;
    height: auto;
    -webkit-transition: all 1s linear;
    -moz-transition: all 1s linear;
    -ms-transition: all 1s linear;
    transition: all 1s linear; }
    @media screen and (min-width: 1280px) {
      .visual img {
        display: none; } }
  .visual h2, .visual div.looks_like_a_headline {
    font-size: 5em;
    line-height: 1.02;
    font-family: "TheSansExtraBold", Arial, Verdana, sans-serif;
    margin-bottom: 0.25em; }
    @media only screen and (max-width: 1023px) {
      .visual h2, .visual div.looks_like_a_headline {
        font-size: 3.6em;
        line-height: 1.38888888888889; } }
    @media only screen and (max-width: 767px) {
      .visual h2, .visual div.looks_like_a_headline {
        font-size: 2.1em;
        line-height: 1.095238; } }
  .visual p {
    font-size: 2.4em;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    color: #0a2864;
    margin-bottom: 0.5em; }
    @media only screen and (max-width: 1023px) {
      .visual p {
        font-size: 2em; } }
    @media only screen and (max-width: 767px) {
      .visual p {
        font-size: 1.2em;
        line-height: 1.16666666; } }
  .visual .button:before {
    margin-left: 2px; }

.visual-text {
  position: absolute;
  top: 15%;
  left: 50.25%;
  width: 49.75%;
  max-width: 568px; }
  @media only screen and (max-width: 1023px) {
    .visual-text {
      width: 45%; } }

.visual-controls {
  position: absolute;
  bottom: 310px;
  width: 100%;
  z-index: 20; }
  @media only screen and (max-width: 1023px) {
    .visual-controls {
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      padding: 22px 15px 28px 15px;
      position: relative;
      bottom: auto;
      top: -3px;
      background: #e6e9ef; } }
  @media only screen and (max-width: 767px) {
    .visual-controls {
      padding: 22px 15px 19px 15px; } }

.visual-switch {
  z-index: 25;
  position: relative;
  width: 40%;
  margin: -30px auto 0 auto;
  text-align: center; }
  @media only screen and (max-width: 1023px) {
    .visual-switch {
      margin-top: -35px; } }
  @media only screen and (max-width: 767px) {
    .visual-switch {
      margin-top: -10px;
      width: 75%; } }
  .visual-switch ul {
    margin: 0; }
  .visual-switch li {
    display: inline;
    text-align: center;
    font-size: 1.2em; }
  .visual-switch strong:before {
    color: #6c7ea2; }
  .visual-switch a {
    text-decoration: none; }
    .visual-switch a:before {
      color: #6c7ea2; }

.visual-buttons {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 1170px;
  width: 100%;
  height: 50px;
  margin: 0 auto;
  position: relative;
  top: 50%;
  list-style: none;
  z-index: 20;
  opacity: 0;
  -webkit-transition: opacity 0.5s linear;
  -moz-transition: opacity 0.5s linear;
  -ms-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear; }
  .visual-wrapper:hover .visual-buttons {
    opacity: 1; }
  .mobile .visual-buttons {
    opacity: 1; }
  @media only screen and (max-width: 767px) {
    .visual-buttons {
      height: 20px;
      margin: 0 auto; } }
  .visual-buttons li {
    position: absolute; }
    .visual-buttons li:first-child {
      left: 0; }
      @media screen and (min-width: 1024px) and (max-width: 1190px) {
        .visual-buttons li:first-child {
          padding-left: 20px;
          left: 1.25%; } }
      @media screen and (min-width: 768px) and (max-width: 1023px) {
        .visual-buttons li:first-child {
          padding-left: 5px;
          left: 1.25%; } }
    .visual-buttons li:last-child {
      right: 0; }
      @media screen and (min-width: 1024px) and (max-width: 1190px) {
        .visual-buttons li:last-child {
          padding-right: 20px;
          right: 1.25%; } }
      @media screen and (min-width: 768px) and (max-width: 1023px) {
        .visual-buttons li:last-child {
          padding-right: 5px;
          right: 1.25%; } }
  .visual-buttons a {
    text-decoration: none;
    color: #fff;
    font-size: 3em; }
    @media only screen and (max-width: 767px) {
      .visual-buttons a {
        font-size: 2em; } }
    .visual-buttons a:after {
      background: rgba(10, 40, 100, 0.25);
      padding: 5px 0;
      -moz-border-radius: 2px;
      -webkit-border-radius: 2px;
      border-radius: 2px; }
  .visual-buttons span {
    display: inline-block;
    text-indent: -9999px; }
  .visual-buttons .switch-back:after {
    padding-right: 3px; }
  .visual-buttons .switch-forth:after {
    padding-left: 3px; }

.visual-hide,
.visual-toggle-out {
  position: absolute;
  top: 0; }

.visual-show {
  position: relative;
  z-index: 20;
  opacity: 1; }

.visual-hide {
  opacity: 0;
  z-index: -1; }

.visual-toggle-in {
  position: relative;
  -webkit-animation: visualOpacity 1s 1 linear;
  -moz-animation: visualOpacity 1s 1 linear;
  animation: visualOpacity 1s 1 linear; }

.visual-toggle-out {
  -webkit-animation: visualOpacity 1s 1 linear reverse;
  -moz-animation: visualOpacity 1s 1 linear reverse;
  animation: visualOpacity 1s 1 linear reverse; }

@-webkit-keyframes visualOpacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-moz-keyframes visualOpacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes visualOpacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.no-csstransitions .visual-wrapper {
  position: relative;
  width: 100%;
  display: inline-block; }

.no-csstransitions .visual {
  display: block;
  clear: both;
  position: relative;
  top: 0;
  left: 0; }

.no-csstransitions .visual-hide {
  opacity: 0; }

.visual-wrapper .grid {
  position: relative; }
  @media only screen and (max-width: 767px) {
    .visual-wrapper .grid {
      top: -3px; } }

.content .visual-wrapper .grid-33 {
  background: #fff;
  margin: 0 1.25%;
  width: 30.833333333333%; }

.content .visual-wrapper .grid-50 {
  background: #fff;
  margin: 0 1.25%;
  width: 47.5%; }

.content .visual-wrapper .grid-50,
.content .visual-wrapper .grid-33 {
  padding: 0; }
  @media only screen and (max-width: 767px) {
    .content .visual-wrapper .grid-50,
    .content .visual-wrapper .grid-33 {
      width: 100%;
      margin: 0 0 2.5% 0; } }

.content .visual-wrapper .last {
  margin-right: 0; }

@media only screen and (max-width: 767px) {
  .content .visual-wrapper .content-wrapper {
    padding-top: 15px; } }

@media only screen and (min-width: 1024px) {
  .visual-wrapper .grid {
    overflow: hidden;
    z-index: 20;
    margin: 0 auto;
    bottom: 25px;
    padding: 0 20px; }
  .content .visual-wrapper .grid-33,
  .content .visual-wrapper .grid-50 {
    height: 265px;
    background: #fff; }
  .content .visual-wrapper .content-wrapper:after {
    content: "";
    display: block;
    height: 160px;
    width: 100%;
    position: absolute;
    left: 0;
    top: 170px;
    background: url(/fileadmin/twt_customer/base/system/templates/images/fade-out.png) repeat-x 0 0; }
  .visual-wrapper .image-wrapper {
    z-index: 21;
    overflow: hidden; }
    .visual-wrapper .image-wrapper img {
      max-height: 265px; } }

@media screen and (min-width: 1240px) {
  .visual-wrapper .grid {
    position: absolute;
    left: 50%;
    margin-left: -620px; } }

@media only screen and (max-width: 1023px) {
  .content .visual-wrapper .csc {
    padding-bottom: 55px; }
  .content .visual-wrapper .button-wrapper {
    top: auto;
    left: 15px;
    bottom: 20px; } }

@media screen and (min-width: 1081px) and (max-width: 1279px) {
  .visual-wrapper .grid {
    margin-top: -15%; } }

@media screen and (min-width: 1024px) and (max-width: 1080px) {
  .visual-wrapper .grid {
    margin: -5% auto 0 auto; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  directsearch
 *
 */
.directsearch {
  position: relative;
  float: right;
  min-height: 30px;
  background: #fff; }
  .directsearch fieldset {
    position: absolute;
    top: 35px;
    right: -20px;
    z-index: -10;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.5s linear;
    -moz-transition: opacity 0.5s linear;
    -ms-transition: opacity 0.5s linear;
    transition: opacity 0.5s linear; }
    @media screen and (min-width: 1024px) {
      .directsearch fieldset {
        width: 300px; } }
    .directsearch fieldset > div {
      position: relative;
      padding: 10px;
      margin-top: 4px;
      background: #fff;
      -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
      -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
      box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); }
    .directsearch fieldset:focus, .directsearch fieldset:hover {
      z-index: 1;
      opacity: 1;
      visibility: visible; }
  .directsearch input {
    float: left;
    font-size: 1.3em;
    max-width: 88%;
    height: auto;
    margin-bottom: 0;
    padding: 5px 5px 4px 5px;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border-color: #9da9c1; }
  .directsearch button {
    float: right;
    border: none;
    margin-bottom: 0;
    padding: 5px;
    background: #0a2864;
    max-width: 13%;
    height: auto; }
    .directsearch button:after {
      color: #fff; }
    .directsearch button span {
      float: left;
      text-indent: -9999px;
      display: inline-block; }
    .directsearch button::-moz-focus-inner {
      margin-top: -1px;
      padding: 0;
      border: 0; }
  .directsearch .toggle-search {
    width: 100%;
    min-height: 40px;
    display: block;
    position: relative;
    float: right;
    font-size: 2em;
    margin-bottom: 0;
    cursor: pointer;
    padding: 0 20px; }
    .directsearch .toggle-search span {
      text-indent: -9999px;
      display: inline-block; }
    .directsearch .toggle-search:after {
      color: #0a2864;
      float: right;
      margin-top: 9px; }
    .directsearch .toggle-search:hover:after, .directsearch .toggle-search.search-visible:after {
      color: #84b400; }
    .directsearch .toggle-search:hover ~ fieldset, .directsearch .toggle-search.search-visible ~ fieldset {
      z-index: 1;
      opacity: 1;
      visibility: visible;
      -webkit-transition: opacity 0.5s linear;
      -moz-transition: opacity 0.5s linear;
      -ms-transition: opacity 0.5s linear;
      transition: opacity 0.5s linear; }
  .directsearch .ui-autocomplete {
    max-width: 250px;
    top: 36px;
    font-size: 1.3em;
    z-index: 110; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  mainnavigation
 *  mainnavigation-fixed
 *  logo
 *
 */
.mainnavigation {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
  position: relative;
  z-index: 150;
  margin: 0;
  background: #fff; }
  .mainnavigation * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  .mainnavigation ul, .mainnavigation li {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1em; }
  .mainnavigation li {
    display: inline-block; }
  .mainnavigation a {
    width: 100%;
    height: 100%;
    display: block;
    text-decoration: none;
    color: #0a2864; }
  .mainnavigation ul {
    background: #fff; }
    .mainnavigation ul.mainmenu {
      background: transparent; }
      .mainnavigation ul.mainmenu > li {
        float: left;
        margin-right: 30px;
        position: relative; }
        .mainnavigation ul.mainmenu > li > a {
          padding: 10px 0;
          font-family: "TheSansBold", Arial, Verdana, sans-serif;
          text-transform: uppercase;
          font-size: 1.6em; }
        .mainnavigation ul.mainmenu > li.hover > a,
        .mainnavigation ul.mainmenu > li:hover > a,
        .mainnavigation ul.mainmenu > li.active > a {
          color: #84b400; }
        .mainnavigation ul.mainmenu > li.hover > .submenu,
        .mainnavigation ul.mainmenu > li:active > .submenu {
          visibility: visible; }
  .mainnavigation .submenu {
    min-width: 230px;
    position: absolute;
    top: 39px;
    visibility: hidden;
    -webkit-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
    -moz-box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25);
    box-shadow: 0 2px 2px rgba(62, 62, 62, 0.25); }
    .mainnavigation .submenu + .submenu {
      margin: 100% 0 0 0; }
    .mainnavigation .submenu > li > a:after {
      position: absolute;
      right: 5px; }
    .mainnavigation .submenu > li > a:only-child:after {
      content: ''; }
    .mainnavigation .submenu li {
      float: none;
      clear: both;
      display: block; }
      .mainnavigation .submenu li a {
        position: relative;
        padding: 10px 20px;
        font-size: 1.3em; }
      .mainnavigation .submenu li.hover, .mainnavigation .submenu li:hover {
        background: #84b400; }
        .mainnavigation .submenu li.hover > a, .mainnavigation .submenu li:hover > a {
          color: #fff; }
    .mainnavigation .submenu .submenu {
      width: 490px;
      position: absolute;
      z-index: -1;
      left: 100%;
      top: 0;
      background: #f9f9f9;
      border-left: 1px solid #6c7ea2; }
      .mainnavigation .submenu .submenu ul {
        width: 50%;
        float: left;
        background: #f9f9f9; }
      .mainnavigation .submenu .submenu .mainnavigation-teaser {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        position: absolute;
        right: 0;
        bottom: 0;
        width: 50%;
        padding-top: 10px;
        padding-left: 25px; }
        .mainnavigation .submenu .submenu .mainnavigation-teaser h4 {
          font-size: 1.6999999999em;
          line-height: 1;
          margin-bottom: 5px; }
        .mainnavigation .submenu .submenu .mainnavigation-teaser p, .mainnavigation .submenu .submenu .mainnavigation-teaser a {
          font-size: 1.3em;
          line-height: 1.4615384615;
          float: none;
          clear: both;
          display: block;
          margin-bottom: 10px; }
        .mainnavigation .submenu .submenu .mainnavigation-teaser a {
          padding: 0;
          color: #6c7ea2; }
          .mainnavigation .submenu .submenu .mainnavigation-teaser a + a:before {
            content: ''; }
          .mainnavigation .submenu .submenu .mainnavigation-teaser a:hover {
            text-decoration: underline; }
          .mainnavigation .submenu .submenu .mainnavigation-teaser a:after {
            display: none; }
        .mainnavigation .submenu .submenu .mainnavigation-teaser img {
          display: block;
          float: right;
          clear: both;
          height: auto;
          max-height: 180px; }
  @media screen and (max-width: 1023px) {
    .mainnavigation {
      display: none; } }
  .touch .mainnavigation {
    display: none; }

@media screen and (min-width: 1024px) {
  .mainnavigation-fixed {
    -webkit-transform: translateZ(0);
    width: 100%;
    position: fixed;
    top: 0;
    left: 0; } }

/* > logo */
strong.logo {
  width: 100%;
  min-height: 95px;
  display: block;
  font-size: 1em;
  margin: 0 auto 3px auto;
  padding-top: 30px;
  text-decoration: none;
  background: #fff url(../images/bg_header.gif) center no-repeat; }
  strong.logo img {
    width: 124px;
    height: auto; }
  @media screen and (max-width: 1023px) {
    strong.logo {
      background: none; } }
  @media screen and (max-width: 767px) {
    strong.logo {
      padding-top: 10px; } }

body#country-de strong.logo .wrapper, body#country-de strong.logo .metanavigation > ul, body#country-de strong.logo .metanavigation-tabs, body#country-de strong.logo .metanavigation-layer {
  position: relative; }

body#country-de strong.logo .campaign {
  position: absolute;
  right: 117px; }
  body#country-de strong.logo .campaign img {
    height: 100px;
    width: auto;
    margin-top: -17px; }
  @media only screen and (max-width: 767px) {
    body#country-de strong.logo .campaign {
      right: 25px; } }

body#country-de strong.logo .campaign-2 {
  position: absolute;
  right: 247px; }
  body#country-de strong.logo .campaign-2 img {
    height: 100px;
    width: auto;
    margin-top: -17px; }
  @media only screen and (max-width: 767px) {
    body#country-de strong.logo .campaign-2 {
      right: 165px; } }

@media screen and (max-width: 767px) {
  body#country-de strong.logo .campaign img {
    margin-top: -6px;
    height: 80px;
    width: auto; }
  body#country-de strong.logo .campaign-2 img {
    margin-top: -6px;
    height: 80px;
    width: auto; } }

@media screen and (max-width: 490px) {
  body#country-de strong.logo .campaign-2 img {
    display: none; } }

@media screen and (max-width: 1023px) {
  #navigation-sticky-wrapper {
    display: none; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  metanavigation
 *  metanavigation-tabs
 *  metanavigation-toggle
 *  metanavigation-dropdown
 *  metanavigation-layer
 *  metanavigation-close
 *  country-switch
 *
 */
.metanavigation {
  width: 100%;
  padding: 1px 0 0 0;
  background: #0a2864; }
  .metanavigation ul {
    list-style: none;
    font-size: 1em; }
  .metanavigation > ul {
    max-width: 1200px; }
  .metanavigation a, .metanavigation strong {
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-weight: normal;
    text-decoration: none; }

.metanavigation-tabs {
  -webkit-transition: padding 0.6s ease;
  -moz-transition: padding 0.6s ease;
  -ms-transition: padding 0.6s ease;
  transition: padding 0.6s ease;
  position: relative;
  overflow: hidden; }
  .metanavigation-tabs > li {
    float: left;
    margin-right: 10px; }
    @media screen and (min-width: 1171px) {
      .metanavigation-tabs > li:first-child {
        margin-left: 15px; } }
    @media screen and (min-width: 1171px) {
      .metanavigation-tabs > li:nth-last-child(3), .metanavigation-tabs > li.metanavigation-right:nth-last-child(3) {
        margin-right: 15px; } }
    .metanavigation-tabs > li.active > a, .metanavigation-tabs > li.active strong, .metanavigation-tabs > li:hover > a, .metanavigation-tabs > li:hover strong, .metanavigation-tabs > li:focus > a, .metanavigation-tabs > li:focus strong {
      background: #fff;
      -webkit-box-shadow: inset 0 0 0 rgba(255, 255, 255, 0);
      -moz-box-shadow: inset 0 0 0 rgba(255, 255, 255, 0);
      box-shadow: inset 0 0 0 rgba(255, 255, 255, 0); }
    .metanavigation-tabs > li.metanavigation-right {
      float: right;
      margin-right: 0;
      margin-left: 10px; }
    .metanavigation-tabs > li > a,
    .metanavigation-tabs > li > strong {
      display: block;
      padding: 7px 15px 7px 20px;
      font-size: 1.4em;
      color: #0a2864;
      background: rgba(255, 255, 255, 0.775);
      -webkit-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025);
      -moz-box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025);
      box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.025); }
    .metanavigation-tabs > li.metanavigation-dropdown > a {
      padding: 7px 7px 7px 14px; }
    @media screen and (max-width: 767px) {
      .metanavigation-tabs > li > a,
      .metanavigation-tabs > li > strong {
        padding: 7px; }
      .metanavigation-tabs > li.metanavigation-dropdown > a {
        padding: 7px; } }
  @media screen and (max-width: 1024px) {
    .metanavigation-tabs > li:first-child {
      display: none; } }
  @media only screen and (max-width: 767px) {
    .metanavigation-tabs > li:not(.metanavigation-right) {
      display: none; }
    .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) {
      display: block;
      margin-right: 0; }
      .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) > a {
        opacity: 0;
        width: 1px;
        max-height: 16px;
        overflow: hidden;
        padding-left: 0;
        padding-right: 0; }
        .metanavigation-tabs > .metanavigation-toggle:not(.metanavigation-right) > a:after {
          content: '';
          margin-left: 0; } }

.metanavigation-toggle a:after,
.metanavigation-dropdown a:after {
  margin-left: 5px; }

@media screen and (max-width: 767px) {
  .metanavigation-toggle a:after,
  .metanavigation-dropdown a:after {
    margin-left: 3px; } }

.metanavigation-dropdown {
  position: relative; }

/* button worldwide bekommt ein extra icon */
li.metanavigation-worldwide > a {
  position: relative;
  padding-left: 35px; }
  li.metanavigation-worldwide > a:before {
    position: absolute;
    left: 15px;
    top: 8px; }
  @media screen and (max-width: 767px) {
    li.metanavigation-worldwide > a {
      padding-left: 27px; }
      li.metanavigation-worldwide > a:before {
        left: 7px; } }

/* metanavigation layer */
.metanavigation-layer {
  max-width: 1200px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  z-index: -1;
  overflow: hidden;
  background: #0a2864;
  color: #fff;
  backface-visibility: hidden;
  -webkit-transition: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -ms-transition: opacity 0.5s;
  transition: opacity 0.5s; }
  .metanavigation-layer span.metanavigation-headline {
    padding-left: 15px;
    color: #fff; }
    @media screen and (max-width: 767px) {
      .metanavigation-layer span.metanavigation-headline {
        padding-left: 0;
        padding-right: 35px; } }
  .metanavigation-layer#country-layer span.metanavigation-headline {
    padding-left: 0; }
  .metanavigation-layer .grid {
    margin: 2em 0;
    max-width: 1200px; }
    .metanavigation-layer .grid.userroles {
      padding: 0; }
    @media screen and (max-width: 1170px) {
      .metanavigation-layer .grid {
        padding-left: 0;
        padding-right: 0; } }
  .metanavigation-layer > .grid > div,
  .metanavigation-layer > .grid > * {
    padding-left: 0;
    padding-right: 0; }
  .active .metanavigation-layer {
    opacity: 10;
    z-index: 1;
    max-height: 750px; }
  .metanavigation-layer .grid > h1, .metanavigation-layer .grid > h2, .metanavigation-layer .grid > h3, .metanavigation-layer .grid > h4, .metanavigation-layer .grid > h5, .metanavigation-layer .grid > h6, .metanavigation-layer .grid > div.looks_like_a_headline {
    color: #fff;
    padding-right: 35px; }
  .metanavigation-layer h3 {
    margin-bottom: 0.5em;
    font-size: 2.6em; }
  .metanavigation-layer ul {
    color: #fff; }
  .metanavigation-layer li {
    font-family: "TheSansBold", Arial, Verdana, sans-serif; }
  .metanavigation-layer a {
    color: #fff; }
    .metanavigation-layer a:hover {
      color: #84b400; }

/* Close Button fuer die Layer */
a.metanavigation-close {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 10px;
  z-index: 10; }
  a.metanavigation-close:before {
    font-size: 2em;
    color: rgba(255, 255, 255, 0.775); }
  a.metanavigation-close span {
    display: block;
    text-indent: -99999px; }

/* Laenderauswahl */
ul.country-switch {
  width: 20%;
  float: left;
  margin-bottom: 2.25em;
  padding: 0; }
  ul.country-switch > li {
    font-size: 1.6999999995em; }
    ul.country-switch > li > a {
      display: inline-block;
      margin-bottom: 0.5em; }
    ul.country-switch > li li {
      font-size: 0.823529em;
      float: left;
      border-right: 1px solid #fff;
      margin-right: 5px;
      padding-right: 5px; }
      ul.country-switch > li li:last-child {
        border-right: none;
        margin-right: 0;
        padding-right: 0; }
  ul.country-switch ul {
    display: none;
    float: none;
    clear: both;
    width: 100%;
    margin-bottom: 1em; }
  ul.country-switch .active-country,
  ul.country-switch .show-languages a {
    color: #84b400; }
    ul.country-switch .active-country:hover,
    ul.country-switch .show-languages a:hover {
      color: #fff; }
  ul.country-switch .show-languages {
    display: block; }
  @media screen and (max-width: 767px) {
    ul.country-switch {
      width: 50%; }
      ul.country-switch:nth-child(2n+1) {
        clear: left; } }

.metanavigation-layer .grid .grid-50 .metanavigation-login {
  width: 65%; }
  .metanavigation-layer .grid .grid-50 .metanavigation-login h3, .metanavigation-layer .grid .grid-50 .metanavigation-login a, .metanavigation-layer .grid .grid-50 .metanavigation-login button, .metanavigation-layer .grid .grid-50 .metanavigation-login legend {
    color: #fff; }
  .metanavigation-layer .grid .grid-50 .metanavigation-login a {
    float: right;
    font-size: 1.3em;
    text-decoration: underline; }
    .metanavigation-layer .grid .grid-50 .metanavigation-login a:hover, .metanavigation-layer .grid .grid-50 .metanavigation-login a:focus {
      color: #fff;
      text-decoration: none; }
  .metanavigation-layer .grid .grid-50 .metanavigation-login legend {
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 1.6999999999em;
    font-weight: normal;
    margin: 0 0 10px 0;
    max-width: 100%; }
  .metanavigation-layer .grid .grid-50 .metanavigation-login input {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 100%;
    margin-bottom: 10px;
    border: 1px solid #3e3e3e;
    padding: 10px;
    font-size: 1.3em;
    border-radius: 0;
    height: auto; }
    .metanavigation-layer .grid .grid-50 .metanavigation-login input:last-of-type {
      margin-bottom: 15px; }
  .metanavigation-layer .grid .grid-50 .metanavigation-login button {
    float: left;
    border: none;
    padding: 5px 15px;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-size: 1.3em;
    background: #9da9c1; }

.metanavigation-layer .grid .grid-50 a, .metanavigation-layer .grid .grid-50 button {
  color: #fff; }

.metanavigation-layer .grid .grid-50 h4,
.metanavigation-layer .grid .grid-50 .looks_like_a_headline {
  color: #fff;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-size: 1.6999999999em;
  font-weight: normal;
  margin: 0 0 10px 0; }

.metanavigation-layer .grid .grid-50 a {
  float: none;
  font-size: 1.3em;
  text-decoration: underline; }
  .metanavigation-layer .grid .grid-50 a:hover, .metanavigation-layer .grid .grid-50 a:focus {
    color: #fff;
    text-decoration: none; }

.metanavigation-layer .grid .grid-50 .buttonlink, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input,
.metanavigation-layer .grid .grid-50 .formular .form-input-tb input, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input,
.metanavigation-layer .grid .grid-50 .formular .form-button button, .formular .form-button .metanavigation-layer .grid .grid-50 button {
  float: left;
  border: none;
  padding: 5px 15px;
  margin-right: 40px;
  text-decoration: none;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-size: 1.3em;
  background: #9da9c1; }
  .metanavigation-layer .grid .grid-50 .buttonlink:hover, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:hover, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:hover,
  .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:hover, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:hover,
  .metanavigation-layer .grid .grid-50 .formular .form-button button:hover, .formular .form-button .metanavigation-layer .grid .grid-50 button:hover, .metanavigation-layer .grid .grid-50 .buttonlink:focus, .metanavigation-layer .grid .grid-50 .formular .form-input-tsr input:focus, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 input:focus,
  .metanavigation-layer .grid .grid-50 .formular .form-input-tb input:focus, .formular .form-input-tb .metanavigation-layer .grid .grid-50 input:focus,
  .metanavigation-layer .grid .grid-50 .formular .form-button button:focus, .formular .form-button .metanavigation-layer .grid .grid-50 button:focus {
    text-decoration: none; }

.metanavigation-layer .grid .grid-50 p .buttonlink, .metanavigation-layer .grid .grid-50 p .formular .form-input-tsr input, .formular .form-input-tsr .metanavigation-layer .grid .grid-50 p input,
.metanavigation-layer .grid .grid-50 p .formular .form-input-tb input, .formular .form-input-tb .metanavigation-layer .grid .grid-50 p input,
.metanavigation-layer .grid .grid-50 p .formular .form-button button, .formular .form-button .metanavigation-layer .grid .grid-50 p button {
  font-size: 1em; }

.metanavigation-layer .grid .grid-50 p.looks_like_a_headline {
  color: #fff;
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  font-size: 1.7em;
  margin: 0 0 10px 0; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  dl-menuheader
 *  dl-trigger
 *  dl-active
 *  dl-menu
 *  dl-submenu
 *  dl-subviewopen
 *  dl-subview
 *  dl-indentionlevel
 *  dl-back
 *  dl-animate-out
 *  dl-animate-in
 *  tx-solr-search-no-results
 *
 */
header, main, footer {
  -webkit-transition: margin-left 0.3s ease;
  -moz-transition: margin-left 0.3s ease;
  -ms-transition: margin-left 0.3s ease;
  transition: margin-left 0.3s ease; }
  @media only screen and (max-width: 1023px) {
    .dl-menu-opened header, .dl-menu-opened main, .dl-menu-opened footer {
      max-width: 100%;
      margin-left: -320px; } }
  .touch .dl-menu-opened header, .touch .dl-menu-opened main, .touch .dl-menu-opened footer {
    max-width: 100%;
    margin-left: -320px; }

.dl-menuheader {
  background: #0a2864; }
  .dl-menuheader .directsearch {
    width: 75%;
    display: none;
    background: none;
    float: right;
    margin: 10px 10px 0 0; }
    .dl-menuheader .directsearch fieldset {
      visibility: visible;
      z-index: 1;
      opacity: 1;
      position: static;
      -webkit-box-shadow: inset 0 0 0 #0a2864;
      -moz-box-shadow: inset 0 0 0 #0a2864;
      box-shadow: inset 0 0 0 #0a2864; }
    .dl-menuheader .directsearch div {
      padding: 0;
      background: none; }
    .dl-menuheader .directsearch input {
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      max-width: none;
      width: 100%;
      padding: 5px; }
    .dl-menuheader .directsearch button {
      position: absolute;
      right: 3px;
      top: 4px;
      /* desktop 18*/
      padding: 0;
      background: #fff;
      line-height: normal; }
      .dl-menuheader .directsearch button:after {
        color: #0a2864;
        font-size: 1.5em;
        line-height: 0.9; }
    .dl-menuheader .directsearch .toggle-search {
      display: none; }
    .dl-menu-opened .dl-menuheader .directsearch {
      display: block; }
    .dl-menuheader .directsearch .ui-autocomplete {
      width: 100%;
      max-width: none;
      left: 0;
      right: 0;
      top: 27px; }

.dl-trigger {
  display: none;
  margin: 40px 10px 0 0;
  font-size: 3.2em;
  color: #0a2864;
  float: right;
  cursor: pointer; }
  @media only screen and (max-width: 1023px) {
    .dl-trigger {
      display: block; }
      .navigationlayer-opened .dl-trigger {
        display: none; } }
  .touch .dl-trigger {
    display: block; }
  .touch .navigationlayer-opened .dl-trigger {
    display: none; }

.dl-active {
  margin: 10px 0 10px 20px;
  float: left;
  color: #fff; }
  .dl-active:before {
    font-size: 0.8em; }

.dl-trigger-open,
.dl-trigger-close {
  display: inline-block;
  text-indent: -9999px; }

.dl-menuwrapper {
  display: none;
  word-wrap: break-word; }
  .dl-menuwrapper a {
    text-decoration: none; }
  @media only screen and (max-width: 1023px) {
    .dl-menuwrapper {
      width: 0;
      height: 100%;
      position: absolute;
      top: 0;
      right: 0;
      z-index: 150;
      display: block;
      background: #fff;
      -webkit-transition: width 0.3s ease;
      -moz-transition: width 0.3s ease;
      -ms-transition: width 0.3s ease;
      transition: width 0.3s ease;
      -webkit-perspective: 1000px;
      -moz-perspective: 1000px;
      -ms-perspective: 1000px;
      perspective: 1000px;
      -webkit-perspective-origin: 50% 200%;
      -moz-perspective-origin: 50% 200%;
      -ms-perspective-origin: 50% 200%;
      perspective-origin: 50% 200%; }
      .dl-menuwrapper::-webkit-scrollbar {
        display: none; }
      .dl-menuwrapper ul {
        padding: 0;
        margin: 0;
        list-style: none;
        font-size: 1em; } }
  .touch .dl-menuwrapper {
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 150;
    display: block;
    background: #fff;
    -webkit-transition: width 0.3s ease;
    -moz-transition: width 0.3s ease;
    -ms-transition: width 0.3s ease;
    transition: width 0.3s ease;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -ms-perspective: 1000px;
    perspective: 1000px;
    -webkit-perspective-origin: 50% 200%;
    -moz-perspective-origin: 50% 200%;
    -ms-perspective-origin: 50% 200%;
    perspective-origin: 50% 200%; }
    .touch .dl-menuwrapper::-webkit-scrollbar {
      display: none; }
    .touch .dl-menuwrapper ul {
      padding: 0;
      margin: 0;
      list-style: none;
      font-size: 1em; }
  .dl-menu-opened .dl-menuwrapper {
    width: 320px;
    overflow: scroll;
    z-index: 161;
    position: fixed; }
    @media only screen and (max-width: 767px) {
      .dl-menu-opened .dl-menuwrapper {
        width: 100%;
        max-width: 768px; } }
    .dl-menu-opened .dl-menuwrapper:after {
      content: '';
      width: 5px;
      height: 100%;
      display: block;
      -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
      -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
      box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
      z-index: 1001;
      position: absolute;
      top: 0;
      left: -5px; }
  @media only screen and (max-width: 767px) {
    .dl-menuwrapper {
      max-width: 0;
      -webkit-transition: max-width 0.3s ease;
      -moz-transition: max-width 0.3s ease;
      -ms-transition: max-width 0.3s ease;
      transition: max-width 0.3s ease; } }

.dl-menu {
  width: 100%;
  position: absolute;
  z-index: 100;
  opacity: 0;
  top: 58px;
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -moz-transform: translateX(320px);
  -ms-transform: translateX(320px);
  -webkit-transform: translateX(320px);
  transform: translateX(320px); }
  .dl-menu.dl-menuopen {
    opacity: 1;
    pointer-events: auto;
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    overflow: initial; }
  .dl-menu li {
    position: relative; }
  .dl-menu a,
  .dl-menu span {
    margin: 0;
    font-size: 1.59999em;
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    font-weight: 400;
    left: 0;
    padding: 9px 0 10px 20px;
    display: block;
    box-sizing: border-box;
    width: auto;
    color: #0a2864;
    background: #e6e9f0;
    border-top: 1px solid #fff; }
  .dl-menu .dl-sub {
    left: auto;
    right: 0;
    top: 0;
    background: url(/fileadmin/twt_customer/base/system/templates/images/bg_border-submenu.png) left top repeat-y;
    position: absolute;
    height: 39px;
    padding: 0 0 0 5px;
    color: #9da9c1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
    .dl-menu .dl-sub:before {
      font-size: 2.4em; }
  .dl-menu li:not(.dl-back) a:active,
  .dl-menu a.dl-sub:active {
    background: #84b400;
    color: #fff; }

.dl-submenu {
  display: none; }

.dl-subviewopen > a {
  display: none; }

.dl-subview {
  opacity: 1; }
  .dl-menu > .dl-subview {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    margin: 0; }
  .dl-subview .dl-subviewopen .dl-submenu a.dl-sub,
  .dl-subview .dl-subview,
  .dl-subview .dl-subview .dl-submenu,
  .dl-subview .dl-subviewopen,
  .dl-subview .dl-subviewopen > .dl-submenu,
  .dl-subview .dl-subviewopen > .dl-submenu > li {
    display: block; }
  .dl-subview .dl-subviewopen .dl-submenu .dl-submenu,
  .dl-subview .dl-subviewopen a.dl-sub,
  .dl-subview li,
  .dl-subview li.dl-subview > a {
    display: none; }
  .dl-subview > a,
  .dl-subview > span {
    background: #fff;
    border: 0;
    padding: 30px 0 20px 20px; }

.dl-indentionlevel {
  padding: 15px 0 12px 20px; }
  .dl-indentionlevel a, .dl-indentionlevel span {
    display: inline;
    width: auto;
    padding: 0;
    border: 0;
    background: #fff;
    font-size: 1.2em;
    text-transform: uppercase; }
  .dl-indentionlevel a:first-child:before {
    color: #0a2864; }
  .dl-indentionlevel a:first-child span {
    text-indent: -9999px;
    display: inline-block; }
  .dl-indentionlevel a:not(:last-child):after {
    content: ' > '; }
  .dl-indentionlevel a:last-child {
    display: block;
    font-size: 1.89999999em;
    color: #84b400; }

.dl-back a {
  background: #9da9c1;
  color: #fff; }

.dl-animate-out {
  -webkit-animation: MenuOut2 0.3s ease-in-out;
  -moz-animation: MenuOut2 0.3s ease-in-out;
  animation: MenuOut2 0.3s ease-in-out; }

.dl-animate-in {
  -webkit-animation: MenuIn2 0.3s ease-in-out;
  -moz-animation: MenuIn2 0.3s ease-in-out;
  animation: MenuIn2 0.3s ease-in-out; }

@-webkit-keyframes MenuOut2 {
  0% { }
  100% {
    -moz-transform: translateX(320px);
    -ms-transform: translateX(320px);
    -webkit-transform: translateX(320px);
    transform: translateX(320px);
    opacity: 0; } }

@-moz-keyframes MenuOut2 {
  0% { }
  100% {
    -moz-transform: translateX(320px);
    -ms-transform: translateX(320px);
    -webkit-transform: translateX(320px);
    transform: translateX(320px);
    opacity: 0; } }

@keyframes MenuOut2 {
  0% { }
  100% {
    -moz-transform: translateX(320px);
    -ms-transform: translateX(320px);
    -webkit-transform: translateX(320px);
    transform: translateX(320px);
    opacity: 0; } }

@-webkit-keyframes MenuIn2 {
  0% { }
  100% {
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 1; } }

@-moz-keyframes MenuIn2 {
  0% { }
  100% {
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 1; } }

@keyframes MenuIn2 {
  0% { }
  100% {
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 1; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  sidenavigation
 *
 */
.sidenavigation {
  display: none;
  padding-right: 10px; }
  @media only screen and (min-width: 1024px) {
    .sidenavigation {
      display: block; }
      .sidenavigation ul {
        font-size: 1em;
        margin: 0;
        overflow: hidden;
        padding: 0;
        width: 100%; }
        .sidenavigation ul li {
          font-family: "TheSansBold", Arial, Verdana, sans-serif; }
          .sidenavigation ul li a, .sidenavigation ul li span {
            color: #84b400;
            font-size: 1.7em; }
          .sidenavigation ul li ul {
            font-size: 1em;
            margin: 12px 0 30px 0;
            padding: 0;
            list-style: none;
            width: 100%; }
            .sidenavigation ul li ul li {
              border-bottom: 1px dotted #9da9c1;
              font-size: 1em;
              margin: 0;
              padding: 7px 0;
              text-transform: uppercase; }
              .sidenavigation ul li ul li a, .sidenavigation ul li ul li strong {
                color: #0a2864;
                font-size: 1.3em;
                text-decoration: none;
                font-weight: normal; }
                .sidenavigation ul li ul li a.hover, .sidenavigation ul li ul li a:hover, .sidenavigation ul li ul li a.active, .sidenavigation ul li ul li strong.hover, .sidenavigation ul li ul li strong:hover, .sidenavigation ul li ul li strong.active {
                  color: #84b400; }
              .sidenavigation ul li ul li.first, .sidenavigation ul li ul li.last {
                border: none; }
              .sidenavigation ul li ul li.current strong {
                color: #84b400; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  footer
 *  logo-footer
 *  footernavigation
 *  socialnavigation
 *
 */
footer {
  position: relative;
  background: #0a2864;
  clear: both;
  overflow: hidden; }
  footer ul,
  footer ul:after {
    list-style: none;
    clear: none;
    margin: 0;
    padding: 0; }
  footer li {
    float: left;
    margin-right: 10px; }

.employer-branding-footer {
  float: left;
  height: 45px;
  margin: 45px 0 35px 25px; }
  .employer-branding-footer img {
    height: 100%;
    width: auto; }

.logo-footer,
.logo-footer-dk {
  width: 124px;
  margin: 35px 0 35px 0;
  float: left; }
  .logo-footer img,
  .logo-footer-dk img {
    width: 100%; }

.logo-footer-dk {
  width: 208px; }

.footernavigation {
  margin: 25px 0 15px 0;
  padding: 0;
  float: right;
  clear: none; }
  .footernavigation li {
    margin: 0 0 0 20px; }
  .footernavigation a {
    font-size: 0.867em;
    color: #fff;
    text-decoration: none; }
  .footernavigation strong {
    font-size: 0.867em;
    color: #84b400; }

.socialnavigation {
  margin-bottom: 30px;
  float: right;
  clear: right; }
  .socialnavigation li {
    margin: 10px 0 0 15px; }
  .socialnavigation img {
    width: 32px;
    height: 32px; }

@media only screen and (max-width: 767px) {
  footer .wrapper, footer .metanavigation > ul, footer .metanavigation-tabs, footer .metanavigation-layer {
    padding-bottom: 15px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap; }
  .logo-footer {
    -webkit-box-flex: 1 0;
    -moz-box-flex: 1 0;
    -webkit-flex: 1 0;
    -ms-flex: 1 0;
    flex: 1 0;
    width: 65px;
    max-width: 65px;
    margin: 15px 20px 0 0;
    -webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    -ms-flex-order: 1;
    -webkit-order: 1;
    order: 1; }
    .logo-footer .img {
      width: 80%; }
  .footernavigation {
    -webkit-box-flex: 1 100%;
    -moz-box-flex: 1 100%;
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
    -webkit-box-ordinal-group: 3;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 3;
    -webkit-order: 3;
    order: 3;
    float: none;
    clear: both;
    margin-top: 0; }
    .footernavigation li {
      margin: 0 20px 0 0; }
  .socialnavigation {
    -webkit-box-flex: 1 0;
    -moz-box-flex: 1 0;
    -webkit-flex: 1 0;
    -ms-flex: 1 0;
    flex: 1 0;
    -webkit-box-ordinal-group: 2;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 2;
    -webkit-order: 2;
    order: 2;
    margin: 20px 0 5px 0;
    max-width: 255px; }
    .socialnavigation li {
      margin: 0 0 5px 10px; }
    .socialnavigation img {
      width: 24px;
      height: 24px; } }

.body-lu .logo-footer img {
  background-color: #fff; }

@media screen and (max-width: 767px) {
  .body-ro .employer-branding-footer-wrap {
    position: absolute;
    margin-top: 40px; }
    .body-ro .employer-branding-footer-wrap .employer-branding-footer {
      margin: 15px 10px 10px 0; }
  .body-ro .footernavigation {
    margin-top: 60px; } }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Tobias Hofmeister <tobias.hofmeister@twt.de>
 *
 * Content:
 *
 */
.tab .tabs {
  margin-bottom: 9px; }
  .tab .tabs span {
    background: #fff;
    color: #000;
    padding: 10px;
    font-size: 1.5em;
    text-decoration: none;
    cursor: pointer; }
    .tab .tabs span:hover, .tab .tabs span.active {
      background: #e6e9ef; }

.tab .contents > div {
  display: none; }
  .tab .contents > div.active {
    display: block; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Thorsten Lukas <thorsten.lukas@twt.de>
 *
 * Content:
 * RWM
 *
 */
.form-rwm-start fieldset {
  background: none;
  padding: 0; }
  .form-rwm-start fieldset .form-radiobutton > div {
    display: inline-block;
    max-width: none;
    width: auto; }
    .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item {
      margin: 0 30px 27px 0;
      width: calc(33% - 20px); }
      .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a {
        display: block; }
        .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .aboveleft-image,
        .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .aboveleft-image .image-wrapper,
        .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .aboveleft-image .image-wrapper img {
          margin: 0;
          max-width: 100%;
          width: 100%; }
        .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .content-wrapper {
          background: rgba(10, 40, 100, 0.9);
          bottom: 3px;
          box-sizing: border-box;
          color: #fff;
          font-family: "TheSansBold", Arial, Verdana, sans-serif;
          height: 53px;
          margin-bottom: 0;
          padding: 5px 13px;
          position: absolute;
          width: 100%; }
          .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .content-wrapper p {
            font-size: 1.6em; }
          .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a .content-wrapper::before {
            bottom: 10px;
            float: right;
            font-size: 1.5em;
            position: absolute;
            right: 10px; }
        .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item .grid-100 a:hover {
          opacity: 0.9; }
      .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item:last-of-type {
        margin-right: 0; }

@media screen and (max-width: 768px) {
  .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item {
    width: calc(50% - 20px); }
    .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item:nth-child(even) {
      margin-right: 0; } }

@media screen and (max-width: 320px) {
  .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item {
    margin: 0 0 27px;
    width: 100%; }
    .form-rwm-start fieldset .form-radiobutton > div.rwm-util-item:last-of-type {
      margin-right: 0; } }

.form-rwm-accommodations .accordion dt {
  height: 55px;
  position: relative; }
  .form-rwm-accommodations .accordion dt a {
    display: block;
    font-size: 2.2em;
    height: 41px;
    line-height: 41px; }
    .form-rwm-accommodations .accordion dt a::before {
      position: relative;
      top: 8px; }
  .form-rwm-accommodations .accordion dt p {
    cursor: pointer;
    display: block;
    font-family: Arial, Verdana, sans-serif;
    font-size: 1.4em;
    height: 35px;
    left: 250px;
    line-height: 35px;
    margin: 0;
    padding: 0 2px;
    position: absolute;
    top: 10px;
    width: calc(100% - 379px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
    @media screen and (max-width: 768px) {
      .form-rwm-accommodations .accordion dt p {
        width: calc(100% - 225px);
        left: 175px; } }
  .form-rwm-accommodations .accordion dt.active p {
    display: none; }

.form-rwm-accommodations .accordion dd {
  margin-top: 0;
  padding-right: 20px;
  padding-bottom: 0;
  padding-left: 20px;
  position: relative; }
  .form-rwm-accommodations .accordion dd fieldset {
    padding: 10px 0 0 0; }
    .form-rwm-accommodations .accordion dd fieldset legend {
      display: none; }
    .form-rwm-accommodations .accordion dd fieldset .accommodation-name {
      display: none;
      left: 230px;
      position: absolute;
      top: -55px;
      width: calc(100% - 335px); }
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name input[type="text"],
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name input[type="password"],
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name input[type="email"],
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name input[type="date"],
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name input[type="number"] {
        margin: 0; }
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name .help-block {
        top: 0; }
        .form-rwm-accommodations .accordion dd fieldset .accommodation-name .help-block::before {
          top: -30px; }
      .form-rwm-accommodations .accordion dd fieldset .accommodation-name.has-success::before {
        right: 12px;
        top: 10px; }
    .form-rwm-accommodations .accordion dd fieldset input[type="text"],
    .form-rwm-accommodations .accordion dd fieldset input[type="password"],
    .form-rwm-accommodations .accordion dd fieldset input[type="email"],
    .form-rwm-accommodations .accordion dd fieldset input[type="date"],
    .form-rwm-accommodations .accordion dd fieldset input[type="number"] {
      margin: 0 0 25px; }
    .form-rwm-accommodations .accordion dd fieldset .help-block {
      top: -20px; }
    .form-rwm-accommodations .accordion dd fieldset .form-input.has-success::before {
      right: 25px;
      bottom: 35px; }
    .form-rwm-accommodations .accordion dd fieldset .form-checkbox {
      margin: 0 0 10px; }
      .form-rwm-accommodations .accordion dd fieldset .form-checkbox .form-help-text {
        display: none;
        left: auto;
        max-width: 250px;
        position: absolute;
        right: 15%;
        top: -28px; }
        .form-rwm-accommodations .accordion dd fieldset .form-checkbox .form-help-text.form-help-visible {
          display: block; }
        .form-rwm-accommodations .accordion dd fieldset .form-checkbox .form-help-text::after {
          left: auto;
          right: -31px; }
    .form-rwm-accommodations .accordion dd fieldset .form-number {
      position: relative; }
      .form-rwm-accommodations .accordion dd fieldset .form-number .help-block::before {
        right: 35px; }
      .form-rwm-accommodations .accordion dd fieldset .form-number.has-success::before {
        right: 42px;
        top: 32px; }
    .form-rwm-accommodations .accordion dd fieldset .form-select {
      position: relative; }
      .form-rwm-accommodations .accordion dd fieldset .form-select:last-child {
        margin-bottom: 2.5em; }
  .form-rwm-accommodations .accordion dd:last-child {
    top: 0; }
  .form-rwm-accommodations .accordion dd.active {
    overflow: visible; }
    .form-rwm-accommodations .accordion dd.active .accommodation-name {
      display: block; }

.form-rwm-accommodations .form-button-right {
  background: #0a2864; }
  .form-rwm-accommodations .form-button-right:hover {
    background: #84b400; }

@media screen and (max-width: 1280px) {
  .form-rwm-accommodations .accordion dd fieldset .form-select .help-block {
    top: -14px; } }

@media screen and (max-width: 768px) {
  .form-rwm-accommodations .accordion dd fieldset .accommodation-name {
    left: 135px;
    width: calc(100% - 165px); }
  .form-rwm-accommodations .accordion dd.active {
    padding-bottom: 2.5em; } }

.form-rwm-devices .rwm-margin-bottom {
  margin: 0 0 20px; }
  .form-rwm-devices .rwm-margin-bottom h3 {
    color: #0a2864; }
  .form-rwm-devices .rwm-margin-bottom a {
    color: #3e3e3e; }
    .form-rwm-devices .rwm-margin-bottom a:hover {
      color: #84b400; }
  .form-rwm-devices .rwm-margin-bottom .rwm-left {
    padding-left: 0; }
    .form-rwm-devices .rwm-margin-bottom .rwm-left .left-image .image-wrapper {
      padding: 0; }
      .form-rwm-devices .rwm-margin-bottom .rwm-left .left-image .image-wrapper img {
        margin: 0; }
    .form-rwm-devices .rwm-margin-bottom .rwm-left .left-image + .content-wrapper {
      padding-top: 0;
      padding-right: 0; }
  .form-rwm-devices .rwm-margin-bottom .rwm-right {
    padding-right: 0; }
    .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset {
      margin-bottom: 29px; }
      .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset legend {
        font-family: Arial, Verdana, sans-serif;
        font-weight: bold;
        margin: 0 0 0.5em; }
      .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset p {
        margin: 0 0 1.5em; }
      .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset h3 {
        font-family: Arial, Verdana, sans-serif;
        font-size: 1.5em;
        font-weight: bold;
        margin-bottom: 10px;
        text-transform: none; }
      .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .form-select {
        margin-bottom: 20px; }
      .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid {
        background: none;
        margin: 0 0 2em; }
        .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50 {
          background: none;
          padding-top: 0; }
          .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50 h3 {
            margin-bottom: 5px; }
          .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50:first-of-type {
            padding-left: 0; }
          .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50:last-of-type {
            padding-right: 0; }

.form-rwm-devices .form-button-right {
  background: #0a2864; }
  .form-rwm-devices .form-button-right:hover {
    background: #84b400; }

@media screen and (max-width: 1280px) {
  .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .form-select {
    margin-bottom: 0; } }

@media screen and (max-width: 768px) {
  .form-rwm-devices .rwm-margin-bottom .rwm-left,
  .form-rwm-devices .rwm-margin-bottom .rwm-right {
    padding: 0; }
  .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .form-select {
    margin: 0; }
  .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50:first-of-type, .form-rwm-devices .rwm-margin-bottom .rwm-right fieldset .grid .grid-50:last-of-type {
    padding: 0; } }

.form-radiobutton .selected:after {
  position: absolute;
  content: 'Y';
  bottom: 10px;
  right: 10px; }

.rwm-summary .grid {
  clear: both; }

.rwm-summary h3 {
  color: #0a2864; }

.rwm-summary div {
  background: transparent !important; }

.rwm-summary .grid-50,
.rwm-summary .grid-33 {
  padding: 0 !important; }

.form-rwm .grossTotal {
  display: block;
  font-size: 2em;
  font-weight: bold; }

.form-rwm .netTotal {
  display: block;
  font-size: 1.5em; }

.form-rwm .accommodation-summary {
  clear: both; }

.form-rwm button[disabled] {
  background: #c0c0c0 !important; }

.form-twa .hidden {
  display: none; }

.form-twa .hint {
  font-family: "TheSansBold", Arial, Verdana, sans-serif;
  color: #ff0000;
  margin-left: 5px; }

.form-twa fieldset legend {
  width: auto;
  padding-right: 35px;
  box-sizing: border-box; }

.form-twa fieldset .form-radiobutton input[type=number] {
  width: auto;
  display: inline; }

.form-twa fieldset .form-help-link {
  top: 0; }

.form-twa fieldset .form-help-text.form-help-top {
  bottom: -26px; }

.form-twa fieldset .form-help-text ul li {
  background: none;
  padding-left: 25px;
  position: relative; }
  .form-twa fieldset .form-help-text ul li:before {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    content: "\e60c";
    font-size: 1.5em;
    color: #84b400; }

@media only screen and (max-width: 767px) {
  .form-twa fieldset .form-help-above {
    position: static;
    right: auto; }
    .form-twa fieldset .form-help-above .form-help-link {
      position: absolute;
      top: 20px;
      right: 20px;
      left: auto; }
    .form-twa fieldset .form-help-above .form-help-text {
      margin: 0 0 20px 0;
      position: static;
      top: auto;
      right: auto;
      left: auto; } }

.form-twa table {
  width: 100%;
  margin-bottom: 15px; }
  .form-twa table th:last-child,
  .form-twa table td:last-child,
  .form-twa table th:nth-last-child(2),
  .form-twa table td:nth-last-child(2),
  .form-twa table th:nth-last-child(4),
  .form-twa table td:nth-last-child(4) {
    white-space: nowrap; }
  .form-twa table th:last-child,
  .form-twa table td:last-child,
  .form-twa table th:nth-last-child(2),
  .form-twa table td:nth-last-child(2) {
    text-align: right; }
  .form-twa table th {
    font-family: "TheSansBold", Arial, Verdana, sans-serif;
    border-top: 5px solid #e6e9ef; }
  .form-twa table .total th {
    text-align: right; }
  .form-twa table .foot-notes td {
    text-align: left;
    background-color: transparent;
    white-space: normal; }
    .form-twa table .foot-notes td p, .form-twa table .foot-notes td div {
      margin: 1em 0 0 0;
      font-size: 1em; }
  @media only screen and (max-width: 767px) {
    .form-twa table input[type=checkbox] {
      position: absolute; }
      .form-twa table input[type=checkbox] + label {
        padding-left: 25px; } }

/**
 * @package ista Internet Relaunch
 *
 * Content:
 * Powermail
 *
 */
.teaser-radio-group.form-radiobutton > div {
  display: inline-block;
  max-width: none; }

.teaser-radio-group .teaser-radio {
  margin: 0 30px 27px 0;
  width: calc(33% - 20px); }
  .teaser-radio-group .teaser-radio .grid-100 label.csc {
    min-height: inherit; }
  .teaser-radio-group .teaser-radio .grid-100 label {
    display: block; }
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image,
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image .image-wrapper,
    .teaser-radio-group .teaser-radio .grid-100 label .aboveleft-image .image-wrapper img {
      margin: 0;
      max-width: 100%;
      width: 100%; }
    .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper {
      background: rgba(10, 40, 100, 0.9);
      bottom: 3px;
      box-sizing: border-box;
      color: #fff;
      font-family: "TheSansBold", Arial, Verdana, sans-serif;
      height: 53px;
      margin-bottom: 0;
      padding: 5px 13px;
      position: absolute;
      width: 100%; }
      .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper p {
        font-size: 1.225em; }
      .teaser-radio-group .teaser-radio .grid-100 label .content-wrapper::before {
        content: ""; }
    .teaser-radio-group .teaser-radio .grid-100 label:hover {
      opacity: 0.9;
      cursor: pointer; }
  .teaser-radio-group .teaser-radio input[type=radio],
  .teaser-radio-group .teaser-radio input[type=checkbox] {
    display: block;
    margin: 10px auto 0 auto; }
  .teaser-radio-group .teaser-radio:last-of-type {
    margin-right: 0; }

@media screen and (max-width: 768px) {
  .teaser-radio-group.form-radiobutton .teaser-radio {
    width: calc(50% - 20px); }
    .teaser-radio-group.form-radiobutton .teaser-radio:nth-child(odd) {
      margin-right: 0; } }

@media screen and (max-width: 320px) {
  .teaser-radio-group.form-radiobutton .teaser-radio {
    margin: 0 0 27px;
    width: 100%; }
    .teaser-radio-group.form-radiobutton .teaser-radio:last-of-type {
      margin-right: 0; } }

.grid-background .powermail_tabmenu li:not(.act) {
  background: #fff; }

.grid-background .powermail_tabmenu li:not(.act)::after {
  color: #fff; }

.formular.powermail_morestep fieldset.fieldset-iterator-followup {
  display: none; }

.formular.powermail_morestep .powermail_fieldwrap_submit.submit-type-next .form-button-right {
  float: none; }

.formular.powermail_morestep .powermail_fieldwrap_submit.submit-type-prev .form-button-left {
  float: right; }

.formular .powermail_progressbar {
  width: 100%;
  height: 5px;
  clear: both; }
  .formular .powermail_progressbar.disable {
    display: none; }
  .formular .powermail_progressbar > .powermail_progress {
    /* Missing 'r' in 'powermail_progess' is a built in feature in Powermail ;-) */
    background-color: #6c7ea2;
    width: 100%; }
    .formular .powermail_progressbar > .powermail_progress > .powermail_progess_inner {
      height: 5px;
      width: 100%;
      overflow: hidden;
      background: url("/typo3conf/ext/powermail/Resources/Public/Image/icon_loading.gif") repeat-x;
      opacity: 0.25; }

body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu {
  margin: 0 0 2em 0;
  list-style: decimal;
  list-style-position: inside; }
  body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li {
    background: #e6e9ef;
    padding: 5px 6px 5px 21px;
    display: list-item;
    color: #3e3e3e;
    border: 0; }
    body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li:first-child {
      padding-left: 10px; }
    body:not(.layout-redesignonecol):not(.layout-redesigntwocol):not(.layout-redesignonepager) .tx-powermail ol.powermail_tabmenu > li.act {
      background: #6c7ea2;
      cursor: default;
      color: #fff; }

.decision-form {
  position: relative;
  background: #e6e9ef;
  padding: 20px 20px 5px 20px;
  margin-bottom: 50px; }
  .decision-form .decision-step .decision-step-header {
    position: relative; }
    .decision-form .decision-step .decision-step-header .decision-step-title {
      font-size: 2em;
      font-weight: bold;
      color: #0a2864;
      text-align: center;
      padding: 0 30px; }
    .decision-form .decision-step .decision-step-header .decision-step-description {
      padding: 0 30px; }
      .decision-form .decision-step .decision-step-header .decision-step-description p {
        text-align: center; }
    .decision-form .decision-step .decision-step-header .description-helper-above {
      position: absolute;
      top: 0;
      right: 0; }
    .decision-form .decision-step .decision-step-header .description-helper-link {
      top: 0;
      left: 0; }
  .decision-form .decision-step .decision-step-body {
    margin-bottom: 20px; }
  .decision-form .decision-step .decision-step-footer {
    text-align: center; }
    .decision-form .decision-step .decision-step-footer .decision-step-answer-list:not(.alternative-answer) .decision-step:not(:first-of-type) .option-link-action {
      display: none; }
    .decision-form .decision-step .decision-step-footer .decision-step-note {
      background: #ced4e0; }
      .decision-form .decision-step .decision-step-footer .decision-step-note p {
        padding-top: 1em; }
    .decision-form .decision-step .decision-step-footer .decision-step {
      float: none;
      display: inline-block;
      padding: 0 40px;
      position: relative; }
      @media only screen and (max-width: 767px) {
        .decision-form .decision-step .decision-step-footer .decision-step {
          display: block; } }
      .decision-form .decision-step .decision-step-footer .decision-step .description-helper-above {
        position: absolute;
        top: 0;
        right: 0; }
      .decision-form .decision-step .decision-step-footer .decision-step .description-helper-link {
        top: 0;
        left: 0; }
      .decision-form .decision-step .decision-step-footer .decision-step .description-helper-text {
        text-align: left; }
    .decision-form .decision-step .decision-step-footer .decision-step-back {
      position: relative;
      float: none;
      clear: both;
      padding: 0;
      text-align: left; }
      .decision-form .decision-step .decision-step-footer .decision-step-back button {
        background-color: transparent;
        padding: 10px 20px 10px 24px;
        text-decoration: underline;
        color: #3e3e3e;
        font-size: 1.5em;
        line-height: 1.333333333;
        font-family: "TheSansRegular", Arial, Verdana, sans-serif; }
        .decision-form .decision-step .decision-step-footer .decision-step-back button:hover {
          color: #84b400;
          text-decoration: none; }
        .decision-form .decision-step .decision-step-footer .decision-step-back button::before {
          display: none;
          left: 12px;
          right: auto;
          transform: scaleX(-1);
          color: #3e3e3e; }
          .decision-form .decision-step .decision-step-footer .decision-step-back button::before:hover {
            color: #84b400; }
  .decision-form .option-button-start,
  .decision-form .option-button-action {
    background-color: #0a2864; }
    .decision-form .option-button-start:hover,
    .decision-form .option-button-action:hover {
      background-color: #84b400; }

.description-helper-above {
  position: absolute;
  right: 25px; }
  .description-helper-above .description-helper-text {
    top: -15px;
    left: auto;
    right: 160%; }
    .description-helper-above .description-helper-text:after {
      top: 0;
      left: auto;
      right: -31px;
      text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); }

.description-helper-link {
  position: relative;
  display: inline-block;
  top: -5px;
  left: 5px;
  margin-bottom: -5px;
  float: left;
  height: 25px;
  width: 25px;
  background: url(/fileadmin/twt_customer/base/system/templates/images/ico_faq.png) no-repeat;
  background-size: cover;
  text-indent: -9999px; }

.description-helper-text {
  display: none;
  position: absolute;
  top: 0;
  left: 102%;
  background: #fff;
  width: 100%;
  min-width: 250px;
  max-width: 250px;
  min-height: 40px;
  padding: 15px 25px;
  -webkit-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  -moz-box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  box-shadow: 1px 2px 2px rgba(62, 62, 62, 0.25);
  z-index: 15; }
  .description-helper-text.description-helper-top {
    top: auto;
    bottom: -40px; }
    .description-helper-text.description-helper-top:after {
      top: auto;
      bottom: 10px; }
  .form-grid-100.form-select > .description-helper-text,
  .form-grid-100.form-multiple-select > .description-helper-text {
    left: 52%; }
  .description-helper-text p {
    font-size: 1.3em; }
    .form-select > .description-helper-text p,
    .form-multiple-select > .description-helper-text p {
      font-size: 1em; }
    .description-helper-text p:last-child {
      margin-bottom: 0; }
  .description-helper-text:after {
    color: #fff;
    position: absolute;
    left: -33px;
    top: 10px;
    font-size: 5em;
    line-height: 1;
    text-shadow: -2px 1px 1px rgba(62, 62, 62, 0.05);
    z-index: -1; }
    .form-select > .description-helper-text:after,
    .form-multiple-select > .description-helper-text:after {
      font-size: 3.84615384em; }
  .description-helper-text.description-helper-visible {
    display: block; }
  table .description-helper-text p {
    font-size: 1em; }
  table .description-helper-text:after {
    font-size: 3.84615384em; }

.content .description-helper-text ul {
  margin-bottom: 25px; }
  .content .description-helper-text ul li {
    font-size: 1.3em; }

/* IE9 Fix */
.form-select .description-helper-text:after,
.form-multiple-select .description-helper-text:after {
  font-size: 3.25rem \0; }

.form-select > .select .styledSelect:before,
.form-multiple-select > .select .styledSelect:before {
  font-size: 0.65rem \0; }

.description-helper-left {
  left: auto;
  right: 102%; }
  .description-helper-left:after {
    left: auto;
    right: -31px;
    text-shadow: 2px 1px 1px rgba(62, 62, 62, 0.05); }

ul.notification {
  border-top: 1px solid #0a2864;
  padding: 10px 0 0;
  list-style: none; }
  ul.notification li {
    background: none; }

.decision-tool-loader {
  position: relative;
  background: #e6e9ef;
  padding: 20px 20px 5px 20px;
  margin-bottom: 50px;
  text-align: center; }
  .decision-tool-loader img {
    padding-top: 50px; }

.monchauffage .teaserwall .teaserwall-teaserbox {
  right: 10%;
  top: 50px; }
  @media only screen and (min-width: 768px) and (max-width: 1279px) {
    .monchauffage .teaserwall .teaserwall-teaserbox {
      position: initial; } }
  .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-background-image img {
    width: 100%; }
  @media only screen and (max-width: 767px) {
    .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-background-image a {
      display: block;
      height: 100%; } }
  .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers {
    background: transparent;
    padding: 0; }
    .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid {
      background: white;
      width: 50%;
      box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15); }
      @media only screen and (min-width: 768px) and (max-width: 1279px) {
        .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid {
          float: left;
          width: 100%; }
          .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_textpic {
            float: left;
            width: 50%; }
          .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_header {
            text-align: center; } }
      @media screen and (max-width: 1686px) {
        .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid {
          float: left;
          width: 100%; }
          .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_textpic {
            float: left;
            width: 50%; }
          .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_header {
            text-align: center; } }
      .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_textpic:last-child a {
        background: #84b400; }
        .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-teasers .grid .ctype_textpic:last-child a:hover {
          background: #0a2864; }
  .monchauffage .teaserwall .teaserwall-teaserbox .teaserwall-teaserbox-newsletter {
    display: none; }

.monchauffage .teaserwall .teaserwall-footer-link-inner .grid {
  max-width: none;
  margin: 0 auto 10px auto; }

.monchauffage .teaserwall .ctype_movieplayer {
  text-align: center; }

.monchauffage .teaserwall iframe {
  width: 490px !important;
  height: 275px !important;
  border: 2px solid #0a2864; }
  @media only screen and (min-width: 768px) and (max-width: 1279px) {
    .monchauffage .teaserwall iframe {
      width: 358px !important;
      height: 200px !important; } }

.monchauffage #NewsletterRegistrationShortForm {
  width: 205px;
  float: right;
  padding-top: 10px; }
  .monchauffage #NewsletterRegistrationShortForm #email {
    width: 173px;
    height: 32px;
    float: left;
    clear: none;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 1.2em; }
  .monchauffage #NewsletterRegistrationShortForm #NewsletterRegistrationShortForm-Submit {
    width: 32px;
    height: 32px;
    float: right; }
  @media only screen and (max-width: 767px) {
    .monchauffage #NewsletterRegistrationShortForm {
      order: 3; } }

@media only screen and (max-width: 767px) {
  .monchauffage #trigger {
    display: none !important; } }

.form-contract-change-service fieldset.customer-summary p.form-hint {
  padding: 0; }

.form-contract-change-service .invalid-zipcode-cta {
  clear: both;
  display: none;
  margin: 0 0 2.5em 10px;
  padding: 10px;
  border: 2px solid red;
  color: red;
  background-color: white;
  width: 50%; }
  .form-contract-change-service .invalid-zipcode-cta p:first-of-type::before {
    content: "\e612";
    color: red;
    font-size: 1.0em;
    margin: 0 10px 0 0;
    font-family: 'icomoon'; }
  .form-contract-change-service .invalid-zipcode-cta p:last-of-type {
    margin: 0; }

.cross-selling-teaser-container {
  padding: 0 !important; }

.cross-selling-teaser {
  background-size: cover;
  padding: 50px 10px 10px 50%;
  box-sizing: border-box;
  max-height: 387px;
  min-height: 320px; }
  .cross-selling-teaser.twa {
    padding: 60px 10px 10px 55%;
    min-height: 380px; }
  .cross-selling-teaser .cross-selling-container {
    width: 100%; }
  .cross-selling-teaser p {
    color: #0a2864;
    font-weight: bold;
    font-size: 1.7em;
    margin: 0 0 1.5em 0; }
  .cross-selling-teaser .buttonlink, .cross-selling-teaser .formular .form-input-tsr input, .formular .form-input-tsr .cross-selling-teaser input,
  .cross-selling-teaser .formular .form-input-tb input, .formular .form-input-tb .cross-selling-teaser input,
  .cross-selling-teaser .formular .form-button button, .formular .form-button .cross-selling-teaser button {
    background-color: #84b400; }

@media screen and (max-width: 768px) {
  .cross-selling-teaser {
    background: #6c7ea2;
    background-image: none !important;
    padding-top: 20px;
    padding-left: 20px; }
    .cross-selling-teaser.twa {
      padding-left: 20px;
      min-height: 0; } }

.tx_twtfaq_container {
  margin-top: 50px; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 */
.redesign-update-notification__item {
  display: none; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 * Content:
 *  mediaQuery
 *  box-sizing
 *  background-gradient
 *  background-size
 *  border-radius
 *  box-shadow
 *  transform
 *  transform-style
 *  transition
 *  perspective
 *  perspective-origin
 *  keyframe
 *  animation
 *  flex-flow
 *  flexbox
 *  flex
 *  order
 *
 */
.clearfix:after, .csc:after, header:after, .content:after, .scroll-hint:after, .wrapper:after, .metanavigation-tabs:after, .metanavigation-layer:after, .content .grid-100 .trail:after,
.content .grid-75 .trail:after, .sitemap:after, .content .grid-75 .downloads li:after, .content .grid-100 .downloads li:after, .content .outer-grid ul.history:after, .grid:after, .formular fieldset:after, .formular .form-input:after,
.formular .form-textarea:after,
.formular .form-checkbox:after,
.formular .form-submit:after,
.formular .form-select:after,
.formular .form-multiple-select:after,
.formular .form-radiobutton:after,
.formular .form-file:after,
.formular .form-duplicate-button:after,
.formular .csc-form-element-submit:after, .form-help-above:after, .form-grid:after, .form-step:after, .powermail_tabmenu:after, .directsearch fieldset > div:after, .directsearch:after, .mainnavigation:after, strong.logo:after, .metanavigation ul:after, ul.country-switch ul:after, .dl-menuheader:after, .sidenavigation li:after, footer:after, .description-helper-above:after {
  display: block;
  clear: both;
  content: ''; }

/**
 * @package ista Internet Relaunch
 *
 * Frontend Refactor
 * @author Matthias Becker <matthias.becker@twt.de>
 *
 */
@media only screen and (max-width: 767px) {
  .fancybox-privacy-center {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100vh !important; } }

.fancybox-privacy-center .fancybox-skin {
  padding: 15px !important; }
  @media only screen and (max-width: 767px) {
    .fancybox-privacy-center .fancybox-skin {
      padding: 0 !important; } }

.fancybox-privacy-center .fancybox-inner {
  max-width: 750px;
  margin: 0 auto; }
  @media only screen and (max-width: 767px) {
    .fancybox-privacy-center .fancybox-inner {
      height: 100vh !important;
      width: 100% !important;
      max-width: 1024px !important; } }

.fancybox-privacy-center #ajaxContent {
  height: inherit;
  padding: 15px; }

#fancybox-loading {
  display: none; }

.tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description {
  margin-bottom: 1em;
  display: block;
  font-size: 1.6em;
  text-decoration: none; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description:hover, .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description:focus, .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description:active {
    text-decoration: none;
    color: #3e3e3e; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description span.hide {
    display: none; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description span i {
    border: solid black;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    margin: 0 0 0.1em .25em; }
    .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description span i.up {
      transform: rotate(-135deg);
      -webkit-transform: rotate(-135deg); }
    .tx_twtprivacyoptout_privacycontrolcenter.layout-new .toggle-description span i.down {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg); }

.tx_twtprivacyoptout_privacycontrolcenter.layout-new .imprint {
  margin-bottom: 70px;
  display: block;
  font-size: 1.6em; }

.tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-submit-button {
  margin-bottom: 1px;
  border-bottom: 14px solid transparent; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-submit-button button.accept-all {
    margin-left: 1em; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-submit-button button.save {
    color: #0a2864;
    background: none;
    border: 1px solid #0a2864; }
    .tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-submit-button button.save:hover {
      color: white;
      background: #0a2864; }

.tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-choice input[type=radio]:checked + span label {
  background: #f2f4f7;
  color: #444; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-choice input[type=radio]:checked + span label:before {
    border-color: #0a2864; }
  .tx_twtprivacyoptout_privacycontrolcenter.layout-new .privacy-control-center-choice input[type=radio]:checked + span label:after {
    background-color: #0a2864; }

.tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-introduction {
  margin-bottom: 20px; }

.tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice {
  margin-bottom: 20px;
  display: flex; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] {
    display: none; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span {
      padding-top: 10px;
      display: block;
      flex-grow: 1;
      position: relative; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::before, .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::after {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::before {
        border-top: 5px solid #e6e9ef; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::after {
        border-top: 5px solid #84b400; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span label {
        background: #f2f4f7;
        min-width: 130px;
        margin: 0;
        padding: 13px 15px 13px 40px;
        display: block;
        box-sizing: border-box;
        cursor: pointer;
        position: relative;
        font-size: 1.6em;
        font-family: "TheSansRegular", Arial, Verdana, sans-serif; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span label::before, .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span label::after {
          display: block;
          content: '';
          position: absolute;
          border-radius: 15px; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span label::before {
          width: 14px;
          height: 14px;
          top: 13px;
          left: 14px;
          border: 2px solid #0a2864; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span label::after {
          background: #fff;
          width: 10px;
          height: 10px;
          top: 17px;
          left: 18px;
          opacity: 0;
          transition: opacity 0.3s ease; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:first-child:checked + span::after {
      border-top: 5px solid #e6260c; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked ~ span::after {
      border-top-color: transparent; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked + span::after {
      border-top-color: #84b400;
      animation: privacyProgressHorizontal 0.3s ease; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked + span label {
      background: #84b400;
      color: #fff; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked + span label::before {
        border-color: #fff; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked + span label::after {
        opacity: 1; }
  @media only screen and (max-width: 767px) {
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice {
      display: block; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span {
        padding: 0 0 0 10px; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::before, .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::after {
          right: auto;
          bottom: 0; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::before {
          border-top: none;
          border-left: 5px solid #e6e9ef; }
        .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio] + span::after {
          border-top: none;
          border-left: 5px solid #84b400; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:first-child:checked + span::after {
        border-left: 5px solid #e6260c; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked ~ span::after {
        border-left-color: transparent; }
      .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-choice input[type=radio]:checked + span::after {
        border-left-color: #84b400;
        animation: privacyProgressVertical 0.3s ease; } }

.tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-category-info {
  padding-bottom: 20px; }

.tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-tab-content {
  display: none;
  overflow: hidden; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-tab-content h3 {
    margin-bottom: 15px; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-tab-content.active {
    display: block; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-tab-content .grid {
    margin: 0 -15px;
    padding: 0; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-tab-content ul {
    padding: 0; }

.tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button {
  background: #f9f9f9;
  padding-top: 10px;
  display: flex;
  justify-content: flex-end;
  right: 0;
  bottom: 0;
  left: 0; }
  .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button button {
    margin-bottom: 0;
    padding: 13px 20px;
    outline: 0;
    font-size: 16px; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button button[disabled] {
      background: #8c8c8c; }
    .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button button:hover, .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button button:focus {
      background-color: #84b400; }

body.browser-msie .tx_twtprivacyoptout_privacycontrolcenter {
  padding-bottom: 0; }
  body.browser-msie .tx_twtprivacyoptout_privacycontrolcenter .privacy-control-center-submit-button {
    position: static;
    right: auto;
    bottom: auto;
    left: auto; }

@keyframes privacyProgressHorizontal {
  0% {
    width: 0; }
  100% {
    width: 100%; } }

@keyframes privacyProgressVertical {
  0% {
    height: 0; }
  100% {
    height: 100%; } }

html.fancybox-lock.new-privacy-control-center {
  overflow: hidden !important;
  position: fixed !important;
  height: 100vh !important;
  width: 100vw !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none; }
  html.fancybox-lock.new-privacy-control-center body {
    overflow: hidden !important;
    position: fixed !important;
    height: 100vh !important;
    width: 100vw !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: none; }
  @media only screen and (max-width: 767px) {
    html.fancybox-lock.new-privacy-control-center .fancybox-privacy-center {
      min-height: 100vh !important;
      width: 100vw !important;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: none; } }

html.fancybox-lock.new-privacy-control-center.touch .fancybox-overlay-fixed {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none; }

html.fancybox-lock.new-privacy-control-center.touch .fancybox-inner {
  height: 100vh !important; }
  html.fancybox-lock.new-privacy-control-center.touch .fancybox-inner .tx_twtprivacyoptout_privacycontrolcenter {
    padding-bottom: 120px;
    height: auto !important; }

/**
 * @package ista Internet Relaunch
 *
 * @author Tobias Hofmeister <tobias.hofmeister@twt.de>
 *
 * Content:
 *  conformity
 *
 */
.content .tx_solr h1 {
  padding: 0 15px; }

.content .tx_solr .form-grid-100.form-select > select,
.content .tx_solr .form-grid-100.form-select > .select,
.content .tx_solr .form-grid-100.form-multiple-select > select,
.content .tx_solr .form-grid-100.form-multiple-select > .select {
  max-width: 100%; }

.content .tx_solr .form-select select[disabled] {
  background: #e8e8e8;
  cursor: default;
  color: #8c8c8c; }

.content .tx_solr .result-type-tx_twtconformity_domain_model_document .article-number .form-remove-button,
.content .tx_solr .result-type-tx_twtconformity_domain_model_document .article-number .form-add-button {
  display: inline;
  margin: 0;
  padding: 0 0 2px 16px; }
  .content .tx_solr .result-type-tx_twtconformity_domain_model_document .article-number .form-remove-button:hover,
  .content .tx_solr .result-type-tx_twtconformity_domain_model_document .article-number .form-add-button:hover {
    text-decoration: none; }

.content .tx_solr .result-type-tx_twtconformity_domain_model_document .languages {
  text-transform: uppercase; }

.remove-facet-option, .remove-facet-all {
  background-color: #6c7ea2;
  display: inline-block;
  height: 29px;
  float: left;
  color: #fff !important;
  text-decoration: none;
  border-radius: 2px;
  padding: 5px 50px 5px 10px;
  margin-right: 20px;
  margin-bottom: 20px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyBpZD0iRWJlbmVfMSIgZGF0YS1uYW1lPSJFYmVuZSAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2Ij48cGF0aCBzdHJva2U9IiNmZmYiIGZpbGw9IiNmZmYiIGQ9Ik0xNDguNDgsMTMwLjI4YTMuMTUsMy4xNSwwLDAsMSwwLTQuNTZMMTk3LjIzLDc3YTYuMjgsNi4yOCwwLDAsMCwwLTkuMWwtOS4xLTkuMWE3LDcsMCwwLDAtNC41NS0yLDUuOSw1LjksMCwwLDAtNC41NSwybC00OC43NSw0OC43NWEzLjE1LDMuMTUsMCwwLDEtNC41NiwwTDc3LDU4Ljc3YTYuMjgsNi4yOCwwLDAsMC05LjEsMGwtOS4xLDkuMWE2LjI4LDYuMjgsMCwwLDAsMCw5LjFsNDguNzUsNDguNzVhMy4xNSwzLjE1LDAsMCwxLDAsNC41Nkw1OC43NywxNzlhNi4yOCw2LjI4LDAsMCwwLDAsOS4xbDkuMSw5LjFhNi4yOCw2LjI4LDAsMCwwLDkuMSwwbDQ4Ljc1LTQ4Ljc1YTMuMTUsMy4xNSwwLDAsMSw0LjU2LDBMMTc5LDE5Ny4yM2E2LjI4LDYuMjgsMCwwLDAsOS4xLDBsOS4xLTkuMWE2LjI4LDYuMjgsMCwwLDAsMC05LjFaIi8+PC9zdmc+");
  background-position: 95% center;
  background-repeat: no-repeat;
  background-size: 20px; }
  .remove-facet-option:hover, .remove-facet-all:hover {
    background-color: #e6260c; }
  .remove-facet-option .facet-label, .remove-facet-all .facet-label {
    font-size: 10px;
    display: block; }
  .remove-facet-option .facet-value, .remove-facet-all .facet-value {
    font-size: 13px;
    display: block; }