/* ---- RESET - Resets default browser CSS.  --------------- */

html {
    margin:0;
    padding:0;
    border:0;
  }
  
  body, div, span, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  a, abbr, acronym, address, code,
  del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, dialog, figure, footer, header,
  hgroup, nav, section {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }
  
  
  
  
  /*------------------
      DEFINITIONS
  -------------------*/
  
  :root {
      --dark-blue: #022e5f;
      --light-gray: #eff0f4;
      --midlight-gray: #dddee3;
      --dark-gray: #cecece;
      --red: #c21522;
      --border-color: #1a2537;
      --border-color2: #2f3b4f;
      --active-blue: #4669aa;
      --white: #ffffff;
      --black: #000000;
  
      --padding-top: 7%;
      --padding-bottom: 7%;
      --padding-left: 3%;
      --padding-right: 3%;
  
      --common-font: "hcap";
      --bold-font: "hcap-bold";
      --semibold-font: "hcap-semibold";
      --light-font: "hcap-light";
  
  }
  
  



/* ///// FONTS ///// */


@font-face {
    font-family: 'hcap';
    src: url('../css/fonts/bould-regular-webfont.woff2') format('woff2'),
         url('../css/fonts/bould-regular-webfont.woff')  format('woff');
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'hcap';
    src: url('../css/fonts/bould-regularitalic-webfont.woff2') format('woff2'),
         url('../css/fonts/bould-regularitalic-webfont.woff')  format('woff');
    font-weight: normal;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'hcap-light';
    src: url('../css/fonts/bould-light-webfont.woff2') format('woff2'),
         url('../css/fonts/bould-light-webfont.woff')  format('woff');
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'hcap-semibold';
    src: url('../css/fonts/bould-semibold-webfont.woff2') format('woff2'),
         url('../css/fonts/bould-semibold-webfont.woff')  format('woff');
    font-weight: normal;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'hcap-bold';
    src: url('../css/fonts/bould-bold-webfont.woff2') format('woff2'),
         url('../css/fonts/bould-bold-webfont.woff')  format('woff');
    font-weight: normal;
    font-style: normal;
  }
  
  
  #section1, #section2, #section3, #section4, #section5, #section6, #section7, #section8, #section9, #section10, #section11, #section12, #section13, #section14, #section15, #section16, #section17, #section18, #section19, #section20 {
      position: relative;
      display: block;
      width: 100%;
      float: left;
      margin-top: -40px;
  }
  
  article, aside, details, figcaption, figure, dialog,
  footer, header, hgroup, menu, nav, section {
      display:block;
  }
  body {
    line-height: 1.5;
    background: var(--light-gray);
  }
  
  
  body.smooth-scroll {
      overflow:hidden;
  }
  
  .smooth-scroll #content-scroll {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
  }
  
  .scroll-content, main {
      height: 100%;
  }
  
  .scrollbar-track {
      background: transparent!important;
  }
  
  
  
  
  
  blockquote:before, blockquote:after, q:before, q:after { content: ''; }
  blockquote, q { quotes: "" ""; }
  a img { border: none; }
  :focus { outline: 0; }
  img {
      width: 100%;
  }
  iframe {
      width: 100%;
  }
  
  .tooltip {
      display: none !important;
  }
  
  #content-scroll {
      height: 100%;
  }
  
  /* END Reset */
  
  
  
  
  /* ----------   ///// UBIQ /////  ---------------- */
  
  
  
  
  
  /*--------------------------------------------------
      Internet Explorer IE gesperrt
  ---------------------------------------------------*/	
  
  
  .not-IE {
      display: none;
  }
  
  .not-IE .logo img {
      width: 100%;
      margin: 0 0 20%;
      max-width: 200px;
  }
  
  .not-IE h4 {
      -webkit-text-fill-color: #fff;
      background: none;
      color: #fff;
  }
  
  .not-IE a {
      color: #ffffff;
      text-decoration: underline;
  }
  
  @media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {
      .not-IE {
          position: fixed;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          width: 100%;
          height: 100%;
          background: #000;
          z-index: 10004;
          color: #fff;
          display: flex !important;
          justify-content: center;
          align-items: center;
          width: 60%;
          padding: 0 20%;
      }
  }
  
  
  /*--------------------------------------------------
      03. Page Preloader
  ---------------------------------------------------*/	
  
      .preloader-wrap {
          width: 100%;
          height: 100%;
          position: fixed;
          top: 0; 
          bottom: 0;
          background: var(--border-color);
          z-index: 10003;
          text-align:center;
      }
      
      .preloader-bg {
          width: 100%;
          height: 100%;
          position: fixed;
          top: 0; 
          bottom: 0;
          background-image: url(../images/preloader-bg.jpg);
          background-size: cover;
          z-index: 2;
          text-align:center;
          opacity: 0.2;
      }
      
      .outer {
          display: table;
          width: 100%;
          height: 100%;
          z-index: 3;
      }
  
      .inner {
          display: table-cell;
          vertical-align: middle;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
      }
      
      .percentage {
          z-index: 100;
          color: var(--white);
          opacity:1;
          font-family: var(--semibold-font);
          font-size: min(max(1.5rem, 2.5vw), 2.5rem);
          line-height: 90px;
          margin-top: clamp(1em, 2vw, 2em);
      }
      
      .light-content .percentage {
          color:rgba(255,255,255,1);
      }
      
      .trackbar {
          width: 30vw;
          height: 1px;
          background: rgba(0,0,0,0.2);
          margin: 0 auto;
          position: relative;
          left:0;
          right:0;
          margin-top: clamp(0.5em, 1vw, 1em);
          opacity: 1;
      }
      
      .loadbar {
          width: 0%;
          height: 1px;
          background: #51667f; 
          position: absolute;
          top: 0px;
          left: 0;
          right:0;
          margin: 0 auto;
          overflow: hidden;
      }
      
      .hold-progress-bar {
          width: 0%;
          height: 3px;
          background: rgba(255,255,255,1); 
          position: absolute;
          top: 0px;
          left: 0;
          right:0;
          margin: 0 auto;
          overflow: hidden;
      }
      
      
      img.pageloader-R {
          position:relative;
          text-align:center;
          line-height: 50px;
          width: clamp(3.5em, 6vw, 6em);
          margin:0 auto;
      }
      
      img.pageloader-R:before {
          content:"(";
          position:absolute;
          height:10px;
          width:4px;
          top:32px;
          left:-6px;
          line-height:10px;
          font-size:10px;
          font-weight:700;
          color:#fff;
          -webkit-animation: movebefore 0.8s ease-out infinite;
          animation: movebefore 0.8s ease-out infinite;
      }
      
      @keyframes movebefore {
        0% {
          left:-6px;
          opacity:1;
        }
        
        100% {
          left:-12px;
          opacity:0
        }
      }
      
      .headphones:after {
          content:")";
          position:absolute;
          height:10px;
          width:4px;
          top:32px;
          right:-6px;
          line-height:10px;
          font-size:10px;
          font-weight:700;
          color:#fff;
          -webkit-animation: moveafter 0.8s ease-out infinite;
          animation: moveafter 0.8s ease-out infinite;
      }
      
      @keyframes moveafter {
        0% {
          right:-6px;
          opacity:1;
        }
        
        100% {
          right:-12px;
          opacity:0
        }
      }
      
      .headphones-text{
          font-size:10px;
          margin-top:20px;
      }
      
      
  
  
  
  /*--------------------------------------------------
      04. ANIMATIONEN
  ---------------------------------------------------*/
  
  .transition-fade {
    transition: 0.4s;
    opacity: 1;
    height: 100%;
  }
  
  html.is-animating .transition-fade {
    opacity: 0;
  }
  
  .swup-overlay {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1009;
      background: var(--border-color);
      width: 100%;
      height: 100%;
      -webkit-transform: translateX(-130%) skew(-10deg);
      -ms-transform: translateX(-130%) skew(-10deg);
      transform: translateX(-130%) skew(-10deg);
  }
  
  
  .swuplogo {
      width: 4vw;
      min-width: 3em;
      max-width: 4em;
      width: clamp(3em, 4vw, 4em);
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: 2;
  }
  
  @keyframes spin {
      from {
        transform: rotate(0);
      }
      to{
        transform: rotate(359deg);
      }
    }
  
  .spinner-box {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      width: clamp(5em, 6.5vw, 6.5em);
      height: clamp(5em, 6.5vw, 6.5em);
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: transparent;
      z-index: 1;
    }
  
    .circle-border {
      width: clamp(4.5em, 6vw, 6em);
      height: clamp(4.5em, 6vw, 6em);
      padding: clamp(1px, 0.07927vw, 2px);
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4669aa+0,022e5f+100 */
  background: rgb(70,105,170); /* Old browsers */
  background: -moz-linear-gradient(left,  rgba(70,105,170,1) 0%, rgba(2,46,95,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  rgba(70,105,170,1) 0%,rgba(2,46,95,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  rgba(70,105,170,1) 0%,rgba(2,46,95,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#022e5f',GradientType=1 ); /* IE6-9 */
  
      animation: spin .8s linear 0s infinite;
    }
    
    .circle-core {
      width: 100%;
      height: 100%;
      background-color: var(--border-color);
      border-radius: 50%;
    }
  
    
  
  
  
  
  .has-animation {
      opacity: 0.01;
      -webkit-transform: translateY(10px);
      transform: translateY(10px);
      transform-origin: 50% 0;
      will-change: transform;
  }
  
  .has-animation-left {
      opacity: 0.01;
      -webkit-transform: translateX(-80px);
      transform: translateX(-80px);
      transform-origin: 50% 0;
      will-change: transform;
  }
  
  .has-img-animation {
      opacity: 1;
      -webkit-transform: scaleY(0.8);
      transform: scaleY(0.8);
      transform-origin: bottom;
      will-change: transform;
      transition: 1s cubic-bezier(.075,.82,.165,1);
  }
  
  .has-animation-stagger {
      opacity: 0;
      -webkit-transform: translateX(300px);
      transform: translateX(300px);
  }
  
  .has-mask span > span {
      display: inline-block;
      margin: 0!important;
      line-height: 40px;
      height: 1.5;
      opacity: 0;
      -webkit-transform: translateY(60px);
      transform: translateY(60px);
  }
  
  p.has-mask span, p.has-mask span > span {
      line-height: 40px;
      height: 40px;
      margin-right: 10px;
  }
  
  figure.has-parallax {
      overflow: hidden;
      max-height: 45vw;
  }
  
  
  
  
  
  
  /* ///// LOGO ///// */
  
  .logo {
    position: absolute;
    top: 5em;
    left: 7%;
    width: 6vw;
    min-width: 2.9em;
    max-width: 7em;
    width: clamp(2.9em, 5vw, 6em);
    float: left;
    z-index: 2;
    transition: all ease 0.5s;
}

.logo-85 {
    position: absolute;
    top: 5em;
    left: 7%;
    width: 6vw;
    min-width: 3.8em;
    max-width: 8em;
    width: clamp(3.8em, 8vw, 8em);
    float: left;
    z-index: 2;
    transition: all ease 0.5s;
}
  
  .logo.fadein {
      position: relative;
      left: 7%;
      width: 6vw;
      min-width: 2em;
      max-width: 3em;
      width: clamp(2em, 6vw, 3em);
      float: left;
      transition: all ease 0.5s;
  }
  
  .logo.fadein.aktiv {
      top: 40px;
      transition: all ease 0.5s;
  }
  
  .logo-menu {
      position: absolute;
      width: 8vw;
      min-width: 3em;
      max-width: 7em;
      width: clamp(3em, 8vw, 7em);
      visibility: hidden;
      opacity: 0;
      top: 3em;
      left: 7%;
  }
  
  .logo img, .logo-85 img {
      width: 100%;
  }
  
  .logo a, .logo-85 a {
      width: 100%;
      border-bottom: none;
      float: left;
      line-height: 1;
  }
  
  .logo.dark {
      display: none;
  }
  
  .logo span {
      position: relative;
      display: inline-block;
      font-size: 7px;
      font-size: min(max(7px, 0.6vw), 11px);
      white-space: nowrap;
      color: #fff;
      text-transform: uppercase;
      left: 50%;
      transform: translate(-50%, 0);
  }
  
  
  
  /* ///// NAVIGATION ///// */
  
  #navigation {
      position: relative;
      display: block;
      float: right;
      width: auto;
  }
  
  ul.menu a.extern {
      position: relative;
      margin-right: 5em;
  }
  
  ul.menu a.extern:before {
      content: "";
      position: absolute;
      top: 50%;
      right: -1.5em;
      transform: translate(0, -50%);
      width: 12px;
      height: 12px;
      background-image: url(../images/extern-white.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }
  
  #submenu ul.menu a.extern:before {
      display: none;
  }
  
  .canvas {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.8);
      z-index: 13;
      opacity: 0;
      display: none;
  }
  
  .subnav-junioren-mobile ul.nav.menu.mod-list {
      margin-left: 0!important;
      padding: 0.5em 0;
  }
  
  .moduletable.subnav-junioren-mobile {
      display: none;
      background: var(--border-color);
      position: relative;
      float: left;
      width: 100%;
  }
  
  .subnav-junioren-mobile ul.menu li {
      padding: 0.25rem 0;
      text-align: center;
      display: flex;
      justify-content: center;
      text-transform: uppercase;
  }
  
  .subnav-junioren-mobile ul.menu a {
      font-size: 0.7rem;
      letter-spacing: 0.03rem;
  }
  
  .subnav-junioren-mobile ul.menu li.current a {
      font-family: 'hcap-bold';
  }
  
  .mobile-nav-button {
      display: none;
      position: relative;
      float: left;
      width: 100%;
      clear: both;
      font-size: 0.7rem;
      letter-spacing: 0.03rem;
      color: var(--white);
      background: var(--border-color);
      text-align: center;
      padding-top: clamp(1.2em, 1.4vw, 1.4em);
      padding-bottom: clamp(1.2em, 1.4vw, 1.4em);
      z-index: 999;
      border-top: 1px solid var(--white);
      text-transform: uppercase;
  }
  
  .mobile-nav-button:after {
      content: '';
      width: 12px;
      height: 10px;
      position: absolute;
      background-image: url(/templates/ubiqdesign/images/team-menu-arrow.svg);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      top: 50%;
      transform: translate(5px, -50%) rotate(0deg);
      transition: 0.5s all ease;
  }
  
  .mobile-nav-button.active:after {
      transform: translate(5px, -50%) rotate(-180deg);
  }


  /* ///// MENU GOTTARDO ARENA ///// */

  .top-bar {
    position: fixed;
    float: left;
    width: 100%;
    background: #1A2537;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    z-index: 1111;
    height: 50px;
}

.top-bar-item {
    position: relative;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

a.top-bar-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.top-bar-item span {
    font-family: 'hcap-semibold';
    color: var(--white);
    text-transform: uppercase;
    font-size: 14px;
    margin-right: 1rem;
}

.top-bar-item img {
    width: auto;
    height: 30px;
    object-fit: contain;
}

.gottardo-arena {
    position: relative;
    float: left;
    height: auto;
    display: flex;
    margin: 0 clamp(2rem, 4vw, 4rem);
}

.gottardo-arena img {
    height: 30px;
    float: left;
    margin: 0 20px;
}

img.gottardo-arena-header-logo {
    width: clamp(12rem, 30vw, 30rem);
}


  
  /* ///// HINWEIS ///// */
  
  
  #hinweis .newsflash {
      position: absolute;
      float: right;
      top: 20%;
      right: 7%;
      background: #5e8398;
      border-radius: 50%;
      z-index: 2;
      display: block;
      width: 200px;
      height: 200px;
      -ms-transform: rotate(7deg);
      -webkit-transform: rotate(7deg);
      transform: rotate(7deg);
      padding: 1%;
  }
  
  #hinweis .beitrag {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 85%;
  }
  
  #hinweis p, #hinweis a {
      color: #fff;
      line-height: 1.2;
      text-align: center;
  }
  
  
  
  /* ///// SLIDER OLD ///// */
  
  #slider {
      position: relative;
      display: block;
      float: left;	
      width: 100%;
      height: 100%;
      margin-bottom: 3vw;
      margin-bottom: clamp(1.5em, 3vw, 3em);
      overflow: hidden;
  }
  
  #newsslider {
      position: relative;
      display: block;
      float: left;	
      width: 100%;
      height: calc(100% - 10em);
  }
  
  #newsslider-edge {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      height: 1.7em;
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,ffffff+100&0.15+0,0+100 */
      background: -moz-linear-gradient(top,  rgba(0,0,0,0.15) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
      background: -webkit-linear-gradient(top,  rgba(0,0,0,0.15) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to bottom,  rgba(0,0,0,0.15) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26000000', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
  }
  
  #newsslider-edge.subpage {
      position: absolute;
  }
  
  
  
  #slider .newsflash {
      display: block;
  }
  
  #slider .moduletable, #slider .newsflash {
      height: 100%;
  }
  
  #slider .bild, #slider .hintergrundbild, #slider .bgimage {
      width: 100%;
      height: 100vh;
      margin: 0;
      overflow: hidden;
      display: flex;
      justify-content: center;
      align-items: center;
      background-size: cover;
      background-position: center bottom;
      transition: transform 3s ease;
      transform: scale(1);
  }
  
  .slide-inner iframe {
      transform: scale(1.07);
  }
  
  .newscaption {
      position: absolute;
      z-index: 7;
      color: var(--white);
      top: 45%;
      left: 12%;
      margin-left: 6em;
      /*transform: translate(0, -50%);*/
      width: 35%;
      border-left: solid 1px;
      padding: 0 0 0 2em;
      opacity: 0;
      transition: opacity 1s ease;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
  }
  
  .newscaption-new {
    position: absolute;
    z-index: 7;
    color: var(--white);
    top: 30%;
    left: 50%;
    margin-left: 2em;
    transform: translate(-50%, 0);
    width: 64em;
    border-left: solid 1px;
    padding: 0 0 0 2em;
    opacity: 0;
    transition: opacity 1s ease;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
  
  .newscaption h5 {
      font-size: min(max(1.6rem, 2.8vw), 2.8rem);
      line-height: 1.2;
      text-transform: uppercase;
  }
  
  .newscaption-new h5 {
      font-size: min(max(1.4rem, 2.4vw), 2.4rem);
      line-height: 1.2;
      text-transform: uppercase;
  }
  
  .swiper-slide-active .newscaption {
      opacity: 1;
      transition: opacity 1s ease 1s;
  }
  
  .swiper-slide-active .newscaption-new {
      opacity: 1;
      transition: opacity 1s ease 1s;
  }
  
  .newstitle {
      position: relative;
      z-index: 2;
      margin-bottom: 0.5em;
  }
  
  .newstitle h4, .newstitle h5 {
      color: var(--white);
      text-transform: uppercase;
  }
  
  .newsinfo {
      position: relative;
      display: flex;
      align-items: center;
      float: left;
      width: 100%;
      margin-bottom: 0.5em;
  }
  
  .articleBody .newsinfo {
      padding: 0 0 6px;
  }
  
  #slider #newsslider .swiper-button-prev {
      left: 0em;
  }
  
  #slider #newsslider .swiper-button-next {
      top: 5em;
      left: 0em;
      margin-left: 40px;
  }
  
  #slider #newsslider .swiper-button-prev, #slider #newsslider .swiper-button-next {
      position: absolute;
      top: 5em;
  }




  /* ///// SLIDER NEW ///// */
  
  #slider-new {
    position: relative;
    display: block;
    float: left;	
    width: 100%;
    height: 100%;
    margin-bottom: 3vw;
    margin-bottom: 0em;
    overflow: hidden;
}

#newsslider-new {
    position: relative;
    display: block;
    float: left;	
    width: 100%;
    height: 100%;
}



#slider-new .newsflash {
    display: block;
}

#slider-new .moduletable, #slider-new .newsflash {
    height: 100%;
}

#slider-new .bild, #slider-new .hintergrundbild, #slider-new .bgimage {
    width: 100%;
    height: 100vh;
    margin: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
    background-position: center bottom;
    transition: transform 3s ease;
    transform: scale(1);
}

#slider-new #newsslider-new .swiper-button-prev {
    left: 0em;
}

#slider-new #newsslider-new .swiper-button-next {
    top: 5em;
    left: 0em;
    margin-left: 40px;
}

#slider-new #newsslider-new .swiper-button-prev, #slider-new #newsslider-new .swiper-button-next {
    position: absolute;
    top: 5em;
}



  
.date {
    background: var(--white);
    color: var(--dark-blue);
    padding: 0px 13px;
    border-radius: 20px;
    margin-right: 1em;
    display: table;
    float: left;
    font-size: 0.8rem;
    font-family: var(--bold-font);
}

.swiper1preview-new .date {
    background: transparent;
    color: var(--white);
    font-family: var(--light-font);
    font-size: 0.7rem;
    margin-right: 0;
    padding: 0;
}
  
  .blog .date, .latestnews .date, .item-page.news .date, .moduletable.newsuebersicht .date, .event .date {
      background: var(--border-color);
      color: var(--white);
  }
  
  .latestnews .date, .latestnews .genre {
      font-size: min(max(0.7rem, 0.9vw), 0.9rem);
      padding: 2px 10px;
  }
  
  .genre, .mainpartners {
      position: relative;
      width: auto;
      display: block;
      float: left;
      text-transform: uppercase;
      font-size: 0.8rem;
      font-family: var(--bold-font);
  }
  
  .genre ul {
      list-style: none;
      margin-left: 0;
  }
  
  .genre li {
      float: left;
      margin-right: 8px;
  }
  
  
  .yw-icons {
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      width: 150px;
      margin-left: clamp(1em, 2vw, 2em);
  }
  
  .blog .yw-icons {
      margin-bottom: 0.5em;
      margin-left: 0em;
  }
  
  .blog .yw-icons img, .yw-icons img {
      height: clamp(7px, 0.8vw, 10px);
      width: auto !important;
      margin-left: clamp(8px, 1.2vw, 15px);
      margin-right: 5px;
  }
  
  .yw-icons p {
      font-size: 12px;
  }
  
  button.btn.btn-default.share, button.btn.btn-default.feedback, button.btn.btn-default.form, button.btn.btn-default.payment, button.btn.btn-default.subscribe, button.btn.btn-default.engage,
  button.btn[data-yawave-tool="share"], button.btn[data-yawave-tool="feedback"], button.btn[data-yawave-tool="form"], button.btn[data-yawave-tool="payment"], button.btn[data-yawave-tool="subscribe"], button.btn[data-yawave-tool="engage"] {
      position: relative;
      padding: 0;
      border: none;
      font-family: 'hcap-semibold';
      text-transform: uppercase;
      white-space: nowrap;
      margin: 0 0 0 7px;
      padding: 4px 10px 4px 30px;
      font-size: min(max(8px, 0.8vw), 10px);
      font-size: clamp(8px, 0.8vw, 10px);
      cursor: pointer;
      color: var(--white);
      background-color: var(--border-color);
      border-radius: 20px;
      background-size: 300%;
      background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      transition: all ease .5s;
  }
  
  button.btn.btn-default.share:hover, button.btn.btn-default.feedback:hover, button.btn.btn-default.form:hover, button.btn.btn-default.payment:hover, button.btn.btn-default.subscribe:hover, button.btn.btn-default.engage:hover,
  button.btn[data-yawave-tool="share"]:hover, button.btn[data-yawave-tool="feedback"]:hover, button.btn[data-yawave-tool="form"]:hover, button.btn[data-yawave-tool="payment"]:hover, button.btn[data-yawave-tool="subscribe"]:hover, button.btn[data-yawave-tool="engage"]:hover {
      background-position: 100%;
  }
  
  
  .yw-share button.btn.btn-default.share, .yw-share button.btn.btn-default.feedback, .yw-share button.btn.btn-default.form, button.btn.btn-default.payment:hover, button.btn.btn-default.subscribe:hover, button.btn.btn-default.engage:hover {
      margin: 0px 0 0 1em;
  }
  
  .yw-share {
      display: flex;
      align-items: center;
      margin: 0 0 0 auto;
  }
  
  button.btn.btn-default.share.white, button.btn.btn-default.feedback.white,
  button.btn[data-yawave-tool="share"].white, button.btn[data-yawave-tool="feedback"].white {
      color: var(--white);
      background: var(--border-color);
      padding: 4px 10px 4px 30px;
      border-radius: 10px;
  }
  
  button.btn.btn-default.share:before, button.btn.btn-default.feedback:before, button.btn.btn-default.form:before, button.btn.btn-default.payment:before, button.btn.btn-default.subscribe:before, button.btn.btn-default.engage:before,
  button.btn[data-yawave-tool="share"]:before, button.btn[data-yawave-tool="feedback"]:before, button.btn[data-yawave-tool="form"]:before, button.btn[data-yawave-tool="payment"]:before, button.btn[data-yawave-tool="subscribe"]:before, button.btn[data-yawave-tool="engage"]:before {
      position: absolute;
      content: "";
      top: 50%;
      transform: translate(0, -50%);
      left: 9px;
      height: 14px;
      width: 15px;
      background-size: contain;
      background-repeat: no-repeat;
  }
  
  button.btn.btn-default.share:before,
  button.btn[data-yawave-tool="share"]:before {
      background-image: url(../images/icons/icon-yw-share-white.svg);
  }
  
  button.btn.btn-default.feedback:before,
  button.btn[data-yawave-tool="feedback"]:before {
      background-image: url(../images/icons/icon-yw-feedback-white.svg);
  }
  
  button.btn.btn-default.form:before,
  button.btn[data-yawave-tool="form"]:before {
      background-image: url(../images/icons/icon-yw-form-white.svg);
  }
  
  button.btn.btn-default.payment:before,
  button.btn[data-yawave-tool="payment"]:before {
      background-image: url(../images/icons/icon-yw-payment-white.svg);
  }
  
  button.btn.btn-default.subscribe:before,
  button.btn[data-yawave-tool="subscribe"]:before {
      background-image: url(../images/icons/icon-yw-subscribe-white.svg);
  }
  
  button.btn.btn-default.engage:before,
  button.btn[data-yawave-tool="engage"]:before {
      background-image: url(../images/icons/icon-yw-engage-white.svg);
  }
  
  
  
  button.btn.btn-default.share.white:before,
  button.btn[data-yawave-tool="share"].white:before {
      background-image: url(../images/icons/icon-yw-share-white.svg);
  }
  
  button.btn.btn-default.feedback.white:before,
  button.btn[data-yawave-tool="feedback"].white:before {
      background-image: url(../images/icons/icon-yw-feedback-white.svg);
  }
  
  .slider-buttons {
          position: relative;
          display: flex;
          flex-wrap: wrap;
          align-items: center;
  }
  
  
  
  
  /* SLIDER GRADIENT EFFEKT */
  
  .slider-lighten {
      z-index: 2;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: #fff;
      mix-blend-mode: overlay;
      opacity: 0.4;
      transition: all .65s ease;
  }
  
  .slider-saturation {
      z-index: 2;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: #000;
      mix-blend-mode: hue;
      opacity: 0.5;
      transition: all .65s ease;
  }
  
  .gradient-overlay {
      z-index: 3;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: rgb(70,105,170);
      background: -moz-linear-gradient(top, rgba(70,105,170,1) 0%, rgba(30,45,75,1) 100%);
      background: -webkit-linear-gradient(top, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      background: linear-gradient(to bottom, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#1e2d4b',GradientType=0 );
      mix-blend-mode: soft-light;
      opacity: 0.8;
      transition: all .65s ease;
  }
  
  .gradient-bluetone {
      z-index: 3;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: rgb(70,105,170);
      background: -moz-linear-gradient(top, rgba(70,105,170,1) 0%, rgba(30,45,75,1) 100%);
      background: -webkit-linear-gradient(top, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      background: linear-gradient(to bottom, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#1e2d4b',GradientType=0 );
      opacity: 0.4;
      transition: all .65s ease;
  }
  
  .gradient-bluetone-new {
      z-index: 3;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4669aa+0,1e2d4b+50,0f1526+100 */
background: rgb(70,105,170); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(70,105,170,1) 0%, rgba(30,45,75,1) 50%, rgba(15,21,38,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(70,105,170,1) 0%,rgba(30,45,75,1) 50%,rgba(15,21,38,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(70,105,170,1) 0%,rgba(30,45,75,1) 50%,rgba(15,21,38,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#0f1526',GradientType=0 ); /* IE6-9 */

      opacity: 0.6;
      transition: all .65s ease;
  }
  
  .gradient-top {
      z-index: 4;
      position: absolute;
      width: 100%;
      height: 45%;
      top: 0;
      left: 0;
      background: -moz-linear-gradient(top, rgba(26,37,55,1) 0%, rgba(26,37,55,0) 100%);
      background: -webkit-linear-gradient(top, rgba(26,37,55,1) 0%,rgba(26,37,55,0) 100%);
      background: linear-gradient(to bottom, rgba(26,37,55,1) 0%,rgba(26,37,55,0) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a2537', endColorstr='#001a2537',GradientType=0 );
      transition: all .65s ease;
  }
  
  .gradient-top-new {
      z-index: 4;
      position: absolute;
      width: 100%;
      height: 20%;
      top: 0;
      left: 0;
      background: -moz-linear-gradient(top, rgba(26,37,55,1) 0%, rgba(26,37,55,0) 100%);
      background: -webkit-linear-gradient(top, rgba(26,37,55,1) 0%,rgba(26,37,55,0) 100%);
      background: linear-gradient(to bottom, rgba(26,37,55,1) 0%,rgba(26,37,55,0) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a2537', endColorstr='#001a2537',GradientType=0 );
      transition: all .65s ease;
      opacity: 0.7;
  }
  
  .gradient-bottom {
      z-index: 5;
      position: absolute;
      width: 100%;
      bottom: 0;
      left: 0;
      height: 50%;
      transition: all .65s ease;
  background: -moz-linear-gradient(top,  rgba(70,105,170,0) 0%, rgba(70,105,170,0.5) 40%, rgba(52,77,128,0.65) 60%, rgba(5,22,56,0.95) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgba(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgb(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004669aa', endColorstr='#051638',GradientType=0 );
  }
  
  .gradient-bottom-2 {
      z-index: 5;
      position: absolute;
      width: 100%;
      bottom: 0;
      left: 0;
      height: 80%;
      transition: all .65s ease;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1a2537+0,1a2537+100&0+0,1+100 */
    background: -moz-linear-gradient(top,  rgba(26,37,55,0) 0%, rgba(26,37,55,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(26,37,55,0) 0%,rgba(26,37,55,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(26,37,55,0) 0%,rgba(26,37,55,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001a2537', endColorstr='#1a2537',GradientType=0 ); /* IE6-9 */
  }

  .gradient-bottom-2-new {
    z-index: 5;
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 80%;
    transition: all .65s ease;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1a2537+0,1a2537+62,1a2537+100&0+0,1+62,1+100 */
    background: -moz-linear-gradient(top,  rgba(26,37,55,0) 0%, rgba(26,37,55,1) 62%, rgba(26,37,55,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(26,37,55,0) 0%,rgba(26,37,55,1) 62%,rgba(26,37,55,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(26,37,55,0) 0%,rgba(26,37,55,1) 62%,rgba(26,37,55,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001a2537', endColorstr='#1a2537',GradientType=0 ); /* IE6-9 */
}
  
  .gradient-bottom-new-1 {
      z-index: 5;
      position: absolute;
      width: 100%;
      bottom: 0;
      left: 0;
      height: 70%;
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4669aa+0,344d80+49,051638+100&0+0,0.6+49,1+100 */
background: -moz-linear-gradient(top,  rgba(70,105,170,0) 0%, rgba(37,57,96,0.6) 49%, rgba(5,22,56,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(70,105,170,0) 0%,rgba(537,57,96,0.6) 49%,rgba(5,22,56,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(70,105,170,0) 0%,rgba(37,57,96,0.6) 49%,rgba(5,22,56,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004669aa', endColorstr='#051638',GradientType=0 ); /* IE6-9 */

  }
  
  .gradient-bottom-new-2 {
    z-index: 6;
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 60%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eff0f4+0,1a2537+40,eff0f4+76,eff0f4+100&0+0,0.6+40,0.5+76,1+100 */
background: -moz-linear-gradient(top,  rgba(239,240,244,0) 0%, rgba(26,37,55,0) 40%, rgba(239,240,244,0.5) 76%, rgba(239,240,244,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(239,240,244,0) 0%,rgba(26,37,55,0) 40%,rgba(239,240,244,0.5) 76%,rgba(239,240,244,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(239,240,244,0) 0%,rgba(26,37,55,0) 40%,rgba(239,240,244,0.5) 76%,rgba(239,240,244,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00eff0f4', endColorstr='#eff0f4',GradientType=0 ); /* IE6-9 */

}
  
  
  
  /* END SLIDER GRADIENT EFFEKT */
  
  .swiper-controls {
      position: absolute;
      z-index: 7;
      top: 45%;
      /*transform: translate(0, -50%);*/
      left: 10%;
      width: auto;
      height: 8em;
  }

  .swiper-controls-new {
    position: absolute;
    z-index: 7;
    top: 30%;
    transform: translate(-50%, 0);
    left: 50%;
    width: auto;
    height: 8em;
    margin-left: -37em;
}
  
  .swiper-pagination .slices {
      font-size: 2.5rem;
      font-family: var(--semibold-font);
      line-height: 1;
      float: right;
      margin-right: 1em;
      margin-top: -4px;
  }
  
  .swiper-pagination .totals {
      position: absolute;
      top: 0px;
      right: 0px;
  }
  
  .swiper-pagination .totals span {
      margin: 0 5px;
  }
  
  .swiper-container.swiper1preview {
      position: absolute;
      z-index: 2;
      bottom: 3em;
      left: calc(10% - 30px);
      width: 55%;
      height: 2.6em;
      color: var(--white);
  }
  
  .swiper-container.swiper1preview-new {
    position: absolute;
    z-index: 2;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    width: 64em;
    height: 4.8em;
    color: var(--white);
    margin-top: 14em;
    overflow: visible;
}

a.button.whiteline.allnewsbutton {
    left: 50%;
    transform: translate(-50%,0);
    margin-top: 3em;
}
  
  .swiper1preview .swiper-slide {
      display: flex;
      align-items: center;
      opacity: 0.6;
      font-family: var(--semibold-font);
      font-size: 0.8rem;
      border-right: solid 1px var(--white);
      padding: 0 8px;
      margin: 0 8px;
      cursor: pointer;
      max-width: 12em;
  }

  .swiper1preview-new .swiper-slide {
    display: flex;
    align-items: flex-start;
    opacity: 1;
    font-family: var(--semibold-font);
    font-size: 0.8rem;
    border-right: solid 1px var(--white);
    padding: 0 15px;
    margin: 0 8px;
    cursor: pointer;
    max-width: 14em;
    flex-wrap: wrap;
}

.swiper1preview-new .swiper-slide p {
    opacity: 0.6;
    font-family: var(--semibold-font);
    font-size: min(max(0.7rem, 0.8vw), 0.8rem);
    width: 100%;
}
  
  .swiper1preview .swiper-slide:last-child {
      border-right: solid 0px;
  }
  
  .swiper1preview-new .swiper-slide:last-child {
      border-right: solid 0px;
  }
  
    .swiper1preview .swiper-slide-thumb-active {
      opacity: 1;
    }
  
    .swiper1preview-new .swiper-slide-thumb-active p {
      opacity: 1;
    }
  
    .swiper1preview .date {
      display: none;
  }
  
  
  
  /*--------------------------------------------------
      EMILY SWIPER SLIDER
  ---------------------------------------------------*/	
  
  
  /**
   * 4. Home Slider
   */
  
   .home-slider {
      padding-top: 0 !important;
  }
  .swiper-container {
      width: 100%;
      height: 100%;
  }
  .swiper-slide {
      overflow: hidden;
  }
  .swiper-slide-duplicate-active .overlay,
  .swiper-slide-active .overlay {
      opacity: .4;
  }
  .slide-inner {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      background: #000;
      -webkit-backface-visibility: hidden;
              backface-visibility: hidden;
  }
  .slide-inner--image {
      position: absolute;
      width: 100%;
      height: 100%;
      background-size: cover; 
      background-position: center;
      opacity: .2;
      transform: scale(1.07);
      -moz-transform: scale(1.07);
      -webkit-transition: opacity .6s ease-in-out, transform 2s ease .7s;
      -moz-transition: opacity .6s ease-in-out, transform 2s ease .7s;
      transition: opacity .6s ease-in-out, transform 2s ease .7s;
      filter: grayscale(40%);
  }
  
  @-moz-document url-prefix() {
      @media screen and (min-width: 2000px) and (orientation: landscape) {
          .slide-inner--image {
              background-size: 100%; /* Prozent anstatt Cover wegen Firefox Widescreen Problem analog Reussdelta */
            }
      }
  }
  
  
  .swiper-slide-duplicate-active .slide-inner--image,
  .swiper-slide-active .slide-inner--image {
      opacity: 1;
      transform: scale(1);
      -moz-transform: scale(1);
  }
  
  /* 4.1 Slider navigation buttons */
  
  
  .swiper-button-next, .swiper-button-prev {
      width: 45px;
      height: 25px;
      margin-top: -22px;
      background-size: 45px 25px;
      bottom: 3.3em;
      top: auto;
  }
  
  .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
      background-image: url(../images/arrow.svg);
  }
  
  .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
      background-image: url(../images/arrow.svg);
  }
  
  /*
  .swiper-button-prev,
  .swiper-button-next {
      text-transform: uppercase;
      color: #fff;
      letter-spacing: .2em;
      line-height: 2em;
      font-size: 12px;
      width: auto;
      height: 24px;
      background-image: none !important;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
  }
  .swiper-button-prev {
      padding-left: 6em;
      left: 0;
      -webkit-transition: padding-left .3s ease;
      -moz-transition: padding-left .3s ease;
      transition: padding-left .3s ease;
  }
  .swiper-button-next {
      padding-right: 6em;
      right: 0;
      -webkit-transition: padding-right .3s ease;
      -moz-transition: padding-right .3s ease;
      transition: padding-right .3s ease;
  }
  .swiper-button-prev::after {
      content: "";
      width: 4em;
      height: 1px;
      background-color: #fff;
      position: absolute;
      left: 0;
      top: calc(50% - 1px);
      -webkit-transition: width .3s ease;
      -moz-transition: width .3s ease;
      transition: width .3s ease;
  }
  .swiper-button-next::after {
      content: "";
      width: 4em;
      height: 1px;
      background-color: #fff;
      position: absolute;
      right: 0;
      top: calc(50% - 1px);
      -webkit-transition: width .3s ease;
      -moz-transition: width .3s ease;
      transition: width .3s ease;
  }
  .swiper-button-prev:hover {
      padding-left: 90px;
  }
  .swiper-button-prev:hover::after {
      width: 75px;
  }
  .swiper-button-next:hover {
      padding-right: 90px;
  }
  .swiper-button-next:hover::after {
      width: 75px;
  }
  */
  
  /* 4.2 Slider inner info */
  
  /*
  .slide-inner--info {
      opacity: 0;
      transition: opacity 1s ease;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      width: 25em;
  }
  .swiper-slide-active .slide-inner--info {
      opacity: 1;
      transition: opacity 1s ease 1s;
  }
  .slide-inner--info h1 {
      margin: 10px 0;
      text-transform: none;
      font-weight: 900;
      line-height: 1.5;
      color: #fff;
      font-size: 1.5rem;
  }
  .slide--info__link {
      text-transform: uppercase;
      color: #fff;
      text-decoration: none;
      border-bottom: solid 2px;
  }
  .swiper-slide--bottom {
      position: absolute;
      z-index: 2;
      bottom: 0;
      left: 0;
      right: 0;
      height: 90px;
      width: 100%;
      max-width: 1440px;
      margin: 0 auto;
  }
  */
  
  /* 4.3 Pagination */
  
  .expanded-timeline {
      position: absolute;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: right;
          -ms-flex-pack: right;
              justify-content: right;
      z-index: 3;
      bottom: 2.8em;
      right: 3em;
      width: 40vh;
  }
  /*.swiper-pagination {
      z-index: 4;
      width: 85%;
      left: 0;
      right: 0;
      height: 1px;
      background-color: rgba(255, 255, 255, .5);
  }
  
  .swiper-pagination {
      position: absolute;
      bottom: 2em;
      left: 10%;
      width: auto !important;
      margin: 0;
  }*/
  .swiper-pagination-bullet {
      position: relative;
      padding: 5px 10px;
      border-radius: 0;
      width: auto;
      height: 30px;
      text-align: center;
      line-height: 30px;
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: #87949b;
      opacity: 1;
      background: transparent;
      transition: all ease 0.5s;
  }
  .swiper-pagination-bullet-active {
      color: #fff;
      background: transparent;
      opacity: 1;
  }
  
  .swiper-pagination-bullet:hover {
      color: #fff;
  }
  
  .swiper-pagination-bullet:before {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0px;
      width: 0%;
      height: 1px;
      background-color: #fff;
      transition: all ease 0.5s;
  }
  
  .swiper-pagination-bullet:hover:before {
      width: 100%;
  }
  
  .swiper-pagination-bullet-active:before {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0px;
      width: 100%;
      height: 1px;
      background-color: #fff;
      transition: all ease 0.5s;
  }
  
  
  
  .swiper-pagination-progressbar-fill {
      background: #fff !important;
  }
  .expanded-timeline__counter span {
      text-align: center;
      margin-left: 1.8em;
      margin-right: 100%;
      padding: .4em 0;
      color: #fff;
      display: block;
  }
  .scroll-message {
      position: absolute;
      right: 0;
      color: #fff;
      opacity: .5;
      font-size: 12px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      text-align: center;
      letter-spacing: .15em;
  }
  
  
  
  
  
  
  /* ///// SPONSOR SLIDER ////// */
  
  #sponsorslider {
      position: relative;
      display: block;
      float: left;
      width: calc(90% - 36vw);
      width: calc(90% - clamp(15em, 36vw, 50em));
      left: calc(10% - 1em);
  }
  
  #sponsorslider .srcbild {
      filter: grayscale(100%);
      width: 5em;
      transition: all ease 0.4s;
  }
  
  #sponsorslider .srcbild:hover {
      filter: none;
  }
  
  #sponsorslider .srcbild img {
      height: auto;
      max-width: 5em;
      width: auto;
      max-height: 3.5em;
  }
  
  #sponsorslider .swiper-container:before {
      content: "";
      position: absolute;
      right: 0;
      top: 0;
      height: 100%;
      width: 10vw;
      width: clamp(4em, 10vw, 10em);
      background: -moz-linear-gradient(left, rgba(240,240,240,0) 0%, rgba(240,240,240,1) 100%);
      background: -webkit-linear-gradient(left, rgba(240,240,240,0) 0%,rgba(240,240,240,1) 100%);
      background: linear-gradient(to right, rgba(240,240,240,0) 0%,rgba(240,240,240,1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f0f0f0', endColorstr='#f0f0f0',GradientType=1 );
      z-index: 2;
  }
  
  #sponsorslider .swiper-wrapper {
      display: flex;
      align-items: center;
  }
  
  #sponsorslider .swiper-slide {
      margin: 10px 0 10px;
  }
  
  #sponsorslider .swiper-button-prev {
      bottom: 0px;
      left: 0px;
      width: clamp(20px, 1.189vw, 30px);
      height: clamp(14px, 0.8vw, 16px);
  }
  
  #sponsorslider .swiper-button-next {
      bottom: 0px;
      left: 0px;
      margin-left: clamp(40px, 1.9817vw, 50px);
      width: clamp(20px, 1.189vw, 30px);
      height: clamp(14px, 0.8vw, 16px);
  }




  /* ///// SPONSOR SLIDER NEW ////// */
  
  #sponsorslider-new {
    position: relative;
    display: block;
    width: 81%;
    margin: 0 auto;
}

#sponsorslider-new .srcbild {
    filter: grayscale(100%);
    width: 5em;
    transition: all ease 0.4s;
}

#sponsorslider-new .srcbild:hover {
    filter: none;
}

#sponsorslider-new .srcbild img {
    height: auto;
    max-width: 5em;
    width: auto;
    max-height: 3.5em;
}

#sponsorslider-new .swiper-wrapper {
    display: flex;
    align-items: center;
}

#sponsorslider-new .swiper-slide {
    margin: 10px 0 10px;
    display: flex;
    justify-content: center;
}

#sponsorslider-new .swiper-button-prev {
    bottom: 0px;
    left: 0px;
    width: clamp(20px, 1.189vw, 30px);
    height: clamp(14px, 0.8vw, 16px);
    display: none;
}

#sponsorslider-new .swiper-button-next {
    bottom: 0px;
    left: 0px;
    margin-left: clamp(40px, 1.9817vw, 50px);
    width: clamp(20px, 1.189vw, 30px);
    height: clamp(14px, 0.8vw, 16px);
    display: none;
}

#sponsorslider-new .mainpartners {
    display: none;
}
  
  
  
  
  
  
  /* ///// SPONSOR SLIDER FOOTER ////// */
  
  #sponsorslider-footer, #sponsorslider-footer-home {
      position: relative;
      display: block;
      float: left;
      width: 90%;
      padding: 7% 5% 10%;
  }
  
  #sponsorslider-footer-home {
      background-color: var(--white);
      padding: 12% 5% 10%;
  }
  
  #sponsorslider-footer .swiper-container, #sponsorslider-footer-home .swiper-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
  }
  
  #sponsorslider-footer .srcbild, #sponsorslider-footer-home .srcbild {
      width: auto;
      display: flex;
      justify-content: center;
  }
  
  #sponsorslider-footer .srcbild img, #sponsorslider-footer-home .srcbild img {
      height: 100%;
      width: clamp(6em, 10vw, 10em);
  }
  
  #sponsorslider-footer .swiper-wrapper, #sponsorslider-footer-home .swiper-wrapper {
      display: flex;
      align-items: center;
  }
  
  #sponsorslider-footer .swiper-slide, #sponsorslider-footer-home .swiper-slide {
      margin: 10px 0 20px;
  }
  
  #sponsorslider-footer a.button-filled, #sponsorslider-footer-home a.button-filled {
      padding: 7px 20px;
      margin: 3em 0 0;
  }
  
  
  
  
  /* ///// MENU SLIDER ///// */
  
  #slider-menu {
      position: fixed;
      display: block;
      z-index: 2;
      width: 46%;
      height: 100%;
      top: 0;
      right: 0;
      opacity: 0;
      visibility: hidden;
      z-index: 33;
      -webkit-box-shadow: -10px 0px 15px 2px rgba(0,0,0,0.4); 
      box-shadow: -10px 0px 15px 2px rgba(0,0,0,0.4);
  }
  
  #slider-menu.show {
      opacity: 1;
  }
  
  #slider-menu .moduletable, #slider-menu .newsflash {
      width: 100%;
      height: 100%;
  }
  
  #slider-menu .menu-slide-bg {
      width: 100%;
      height: 100%;
      background-size: cover;
  }
  
  
  
  /* ///// MENU ADRESSE / MENU SOCIAL MEDIA ///// */
  
  
  #menu-adresse {
      position: absolute;
      display: block;
      float: left;
      z-index: 2;
      left: 4%;
      bottom: 10%;
  }
  
  #menu-adresse a, #menu-adresse p {
      color: var(--white);
      font-size: 0.8em;
  }
  
  #menu-socialmedia {
      position: absolute;
      display: block;
      float: left;
      z-index: 1;
      bottom: 10%;
      left: 15%;
  }
  
  #menu-socialmedia.mobile {
      display: none;
  }
  
  #menu-socialmedia h4 {
      margin: 0.5em 0;
      color: var(--white);
  }
  
  
  
  /* ///// HEADS ///// */
  
  #heads {
      position: relative;
      display: block;
      float: left;	
      width: 100%;
      height: 37vw;
      min-height: 17em;
      max-height: 37em;
      height: clamp(17em, 37vw, 37em);
      background-size: cover;
      background-position: center center;
      overflow: hidden;
      z-index: 1;
  }
  
  #heads .custom {
      background-size: cover;
      background-position: center center;
      width: 100%;
      height: 100%;
      filter: grayscale(40%);
  }
  
  #heads .custom p {
      font-family: var(--title-font);
      font-size: 2rem;
      font-weight: 600;
  }
  
  #heads h2 {
      color: var(--white);
  }
  
  #heads .heads-title {
      position: absolute;
      top: 60%;
      left: 50%;
      transform: translate(-50%,-50%);
      white-space: nowrap;
      text-align: center;
      color: var(--white);
      z-index: 10;
  }
  
  #heads .heads-title.newspage {
      width: 90%;
  }
  
  #heads .heads-title.newspage h4 {
      color: var(--white);
      white-space: pre-wrap;
  }
  
  .heads-title p {
      font-size: min(max(0.8rem, 1.1vw), 1.1rem);
      text-transform: uppercase;
      white-space: nowrap;
      letter-spacing: 0.9625em;
      text-indent: 0.9625em;
      margin: 0;
  }
  
  #heads .moduletable {
      height: 100%;
  }
  
  #heads .moduletable.breadcrumb {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
  }
  
  #heads ul.breadcrumb.breadcrumb li {
      color: #fff;
      list-style: none;
      margin-left: 0px;
      text-transform: uppercase;
      font-size: 3vw;
      white-space: nowrap;
  }
  
  #heads ul.breadcrumb.breadcrumb {
      margin-left: 0px;
  }
  
  #heads ul.breadcrumb.breadcrumb li {
      display: none;
  }
  
  #heads ul.breadcrumb.breadcrumb li.active {
      display: block;
  }
  
  #heads-small {
    position: relative;
    display: block;
    float: left;	
    width: 100%;
    height: 12vw;
    min-height: 8em;
    max-height: 12em;
    height: clamp(8em, 12vw, 12em);
    background-image: none!important;
    background-color: var(--border-color);
    overflow: hidden;
    z-index: 1;
}
  
#heads-small-fixed {
  position: fixed;
  display: block;
  float: left;	
  width: 100%;
  height: 12vw;
  min-height: 8em;
  max-height: 12em;
  height: clamp(8em, 12vw, 12em);
  background-image: none!important;
  background-color: var(--border-color);
  overflow: hidden;
  z-index: 1;
}
  
  
  /* ///// SUBMENU ///// */
  
  
  #submenu {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      z-index: 11;
      justify-content: center;
      align-items: center;
      /* overflow: hidden; HCAP */
  }
  
  
  #submenu span.separator, #submenu span.navigoback {
      display: none;
  }
  
  #submenu .moduletable > ul.menu {
      position: static; /* Wichtig für overflow: scroll responsive */
      margin-left: 0;
      background-color: var(--border-color);
      width: 100%;
      flex-wrap: nowrap;
      display: flex;
      overflow-y: visible;
      white-space: nowrap;
      justify-content: center;
  }
  
  #untermenu .moduletable {
      display: flex;
      justify-content: center;
  }
  
  #submenu ul.menu a {
      position: relative;
      font-size: 1rem;
  }
  
  #submenu ul.menu li {
      padding: 0;
      float: left;
      overflow: hidden;
  }
  
  #submenu ul.menu li a {
      padding-top: 1.2em;
      padding-top: clamp(1.2em, 1.4vw, 1.4em);
      padding-bottom: 1.2em;
      padding-bottom: clamp(1.2em, 1.4vw, 1.4em);
      padding-left: 1em;
      padding-left: clamp(1em, 2vw, 3em);
      padding-right: 1em;
      padding-right: clamp(1em, 2vw, 3em);
      transition: all ease .5s;
      text-transform: uppercase;
      letter-spacing: 0.1rem;
      font-size: 0.7rem;
  }
  
  #submenu ul.menu > li.current > a {
      font-family: var(--bold-font);
  }
  
  #submenu ul.menu > li.current > a:before {
      position: absolute;
      content: "";
      top: 0;
      left: clamp(1em, 2vw, 3em);
      height: 4px;
      width: calc(100% - clamp(2em, 4vw, 6em));
      background: var(--white);
  }
  
  #submenu ul.menu > li.current > a:after {
      position: absolute;
      content: "";
      bottom: 0px;
      left: clamp(1em, 2vw, 3em);
      height: 4px;
      width: calc(100% - clamp(2em, 4vw, 6em));
      background: var(--white);
  }
  
  #submenu ul.menu li a:hover {
      background: var(--border-color2);
  }
  
  #submenu ul.menu li.current a:hover {
      background: transparent;
  }
  
  .arrow-left {
      position: absolute;
      top: 0;
      left: 0px;
      padding: 0 0 0 12px;
      height: 100%;
      z-index: 1;
      width: 20px;
      color: #fff;
      background: #0a0a0a;
      justify-content: flex-start;
      font-size: 18px;
      display: flex;
      align-items: center;
      border-right: solid 1px #0a0a0a;
      cursor: pointer;
      -webkit-box-shadow: 10px 0px 34px 10px rgba(0,0,0,1);
      -moz-box-shadow: 10px 0px 34px 10px rgba(0,0,0,1);
      box-shadow: 10px 0px 34px 10px rgba(0,0,0,1);
      display: none;
  }
  
  
  .arrow-right {
      position: absolute;
      top: 0;
      right: 0px;
      padding: 0 0 0 12px;
      height: 100%;
      z-index: 1;
      width: 20px;
      color: #fff;
      background: #0a0a0a;
      justify-content: flex-start;
      font-size: 18px;
      display: flex;
      align-items: center;
      border-left: solid 1px #0a0a0a;
      cursor: pointer;
      -webkit-box-shadow: -10px 0px 30px 10px rgba(0,0,0,1);
      -moz-box-shadow: -10px 0px 30px 10px rgba(0,0,0,1);
      box-shadow: -10px 0px 30px 10px rgba(0,0,0,1);
      display: none;
  }
  
  
  
  /* ///// SUB SUBMENU ///// */
  
  
  #subsubmenu {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      background-color: var(--light-gray);
      z-index: 0;
      justify-content: center;
      align-items: center;
      overflow: hidden;
      margin-bottom: -1px;
  }
  
  #subsubmenu span.separator {
      display: none;
  }
  
  #subsubmenu ul.menu a {
      color: var(--border-color);
      font-family: var(--light-font);
  }
  
  #subsubmenu ul.menu {
      position: relative;
      margin-left: 0;
      width: 100%;
      flex-wrap: nowrap;
      display: flex;
      overflow-y: hidden;
      overflow-x: auto;
      white-space: nowrap;
      justify-content: center;
  }
  
  #subsubmenu .gamecenter ul li, #submenu ul.nav-child.unstyled.small li {
      width: 33.33333%;
      flex: 0 33.33333%;
      text-align: center;
  }
  
  #submenu .subsub2 ul.nav-child.unstyled.small li {
      flex: 0 50%;
  }
  
  #subsubmenu .gamecenter ul li a, #submenu ul.nav-child.unstyled.small li a {
      color: var(--border-color);
      background: var(--light-gray);
      padding: 1.2em 1vw;
      padding: 1.2em clamp(0.3em, 1vw, 1em);
      width: 100%;
      width: calc(100% - 1vw);
      min-width: calc(100% - 0.3em);
      max-width: calc(100% - 1em);
      width: calc(100% - clamp(0.3em, 1vw, 1em));
      letter-spacing: 0.1rem;
      text-transform: uppercase;
      white-space: nowrap;
      font-size: min(max(0.7rem, 1.4vw), 2rem);
      -webkit-box-shadow: inset 15px -15px 15px 0px rgb(0,0,0,0.1);
      box-shadow: inset 15px -15px 15px 0px rgb(0,0,0,0.1);
  }
  
  #subsubmenu .gamecenter ul li.current a, #submenu ul.nav-child.unstyled.small li.current a {
      background: var(--white);
      -webkit-box-shadow: inset 0px 20px 15px -2px rgb(0,0,0,0.1);
      box-shadow: inset 0px 20px 15px -2px rgb(0,0,0,0.1);
  }
  
  #subsubmenu .gamecenter ul li a:hover, #submenu ul.nav-child.unstyled.small li a:hover {
      background: #dfdfdf;
  }
  
  #subsubmenu .gamecenter ul li.current a:hover, #submenu ul.nav-child.unstyled.small li.current a {
      background: var(--white);
      color: var(--border-color);
  }
  
  #submenu ul.nav-child.unstyled.small {
      position: absolute;
      display: block;
      display: flex;
      z-index: 1;
      left: 0;
      width: 100%;
      overflow: hidden;
  }
  
  
  
  /* ///// STADIO ///// */
  
  .capazita .grid {
      border-bottom: solid 1px var(--light-gray);
  }
  
  .capazita a {
      font-family: var(--common-font);
      color: var(--dark-blue);
  }
  
  
  
  /* SCHEMA NEU */
  
  .item-page.schema {
      overflow: hidden;
  }
  
  .livello1 {
      position: absolute;
      z-index: 2;
      width: 80%;
      height: 100%;
      top: 5%;
      left: 9%;
  }
  
  .livello2 {
      position: absolute;
      z-index: 3;
      top: 0%;
      left: 4%;
      width: 90%;
      height: 100%;
  }
  
  .schema-sektoren {
      position: absolute;
      z-index: 4;
      display: block;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      float: left;
      color: var(--white);
      font-family: var(--bold-font);
      text-shadow: 1px 1px 1px rgb(0 0 0 / 80%);
  }
  
  .sektoren {
      position: absolute;
  }
  
  .sektoren.dark {
      color: var(--dark-blue);
      text-shadow: none;
  }
  
  .sektorI {
      top: 8.5%;
      left: 34%;
  }
  
  .sektorH {
      top: 8.5%;
      left: 45%;
  }
  
  .sektorG {
      top: 8.5%;
      left: 56%;
  }
  
  .sektorF {
      top: 15%;
      left: 67%;
  }
  
  .sektorE1 {
      top: 19.5%;
      left: 75%;
  }
  
  .sektorE2 {
      top: 28.5%;
      left: 77%;
  }
  
  .sektorD {
      top: 39%;
      left: 73%;
  }
  
  .sektorC {
      top: 41%;
      left: 57%;
  }
  
  .sektorB {
      top: 41%;
      left: 44%;
  }
  
  .sektorA {
      top: 41%;
      left: 30%;
  }
  
  .sektorCurva {
      top: 25%;
      left: 10%;
      font-size: 0.8rem;
  }
  
  .sektorN {
      top: 2%;
      left: 34%;
  }
  
  .sektorM {
      top: 2%;
      left: 59%;
  }
  
  .sektorL {
      top: 23.5%;
      left: 78.3%;
  }
  
  .sektorO {
      top: 20.8%;
      left: 7.5%;
  }
  
  .sektoren.presse {
      font-size: 0.8rem;
      left: 45%;
      top: 0;
  }
  
  .legende {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin-top: 2em;  
  }
  
  .legende-livello0, .legende-livello1, .legende-livello2 {
      width: 100%;
      display: block;
      float: left;
  }
  
  .legende-titel {
      font-family: var(--bold-font);
      text-transform: uppercase;
      border-bottom: solid 1px var(--border-color);
      position: relative;
      padding: 15px 15px;
      cursor: pointer;
      transition: all ease 0.5s;
  }
  
  .legende-titel:after {
      position: absolute;
      content: "";
      right: 10px;
      top: 50%;
      transform: translate(0, -50%);
      width: 20px;
      height: 11px;
      background-image: url(../images/right-arrow.svg);
  }
  
  .legende-titel:hover, .legende-titel.active {
      background-color: var(--midlight-gray);
  }
  
  .legende-text {
      display: block;
      margin-bottom: 2em;
  }
  
  #main-col .legende-text ul {
      list-style-type: none;
      margin-left: 0;
  }
  
  
  .legende-text li {
      font-size: 0.9em;
      margin: 0px 0;
      padding: 8px 5px;
      border-bottom: solid 1px var(--dark-gray);
      transition: all ease 0.5s;
      cursor: pointer;
  }
  
  .legende-text li.active {
      background: rgb(70,105,170);
      background: -moz-linear-gradient(left, rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%);
      background: -webkit-linear-gradient(left, rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%);
      background: linear-gradient(to right, rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 );
      color: var(--white);
  }
  
  .legende-text li:hover {
      background-color: var(--midlight-gray);
  }
  
  .legende-text span {
      margin-right: 20px;
  }
  
  .numero {
      position: absolute;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: #558efa;
      color: var(--white);
      font-family: var(--bold-font);
      z-index: 5;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 0.8rem;
      text-shadow: none;
  }
  
  .numero.ping {
      width: 25px;
      height: 25px;
      background-color: #e61f54;
      -webkit-animation: pulsate-bck 1s ease-in-out infinite both;
      animation: pulsate-bck 1s ease-in-out infinite both;
  }
  
  
  /* ----------------------------------------------
   * Generated by Animista on 2021-9-16 18:57:6
   * Licensed under FreeBSD License.
   * See http://animista.net/license for more info. 
   * w: http://animista.net, t: @cssanimista
   * ---------------------------------------------- */
  
  /**
   * ----------------------------------------
   * animation pulsate-bck
   * ----------------------------------------
   */
   @-webkit-keyframes pulsate-bck {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
      50% {
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
      }
      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }
    @keyframes pulsate-bck {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
      50% {
        -webkit-transform: scale(0.9);
                transform: scale(0.9);
      }
      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }
    
  
    
  
  .numero.numero1 {
      left: 79%;
      top: 58%;
  }
  
  .numero.numero2a {
      top: 13%;
      left: 28%;
  }
  
  .numero.numero2b {
      top: 53%;
      left: 14%;
  }
  
  .numero.numero3 {
      left: 58%;
      top: 13%;
  }
  
  .numero.numero4 {
      left: 65%;
      top: 6%;
  }
  
  .numero.numero5 {
      top: 61%;
      left: 17%;
  }
  
  .numero.numero6 {
      left: 72%;
      top: 30%;
  }
  
  .numero.numero7 {
      left: 88%;
      top: 40%;
  }
  
  .numero.numero8 {
      left: 78%;
      top: 1%;
  }
  
  .numero.numero9a {
      top: 10%;
      left: 16%;
  }
  
  .numero.numero9b {
      top: 52%;
      left: 6%;
  }
  
  .numero.numero10 {
      top: 56%;
      left: 43%;
  }
  
  .numero.numero11a {
      top: 3%;
      left: 34%;
  }
  
  .numero.numero11b {
      top: 3%;
      left: 53.5%;
  }
  
  .numero.numero12 {
      top: 37%;
      left: 88%;
  }
  
  .numero.numero13 {
      top: 14%;
      left: 81%;
  }
  
  .numero.numero14 {
      top: 46%;
      left: 91%;
  }
  
  .numero.numero15 {
      left: 8%;
      top: 26.5%;
  }
  
  .numero.numero16 {
      top: 1%;
      left: 22%;
  }
  
  .numero.numero17 {
      top: 11%;
      left: 13%;
  }
  
  .numero.numero18a {
      left: 20%;
      top: 7%;
  }
  
  .numero.numero18b {
      top: 18%;
      left: 78%;
  }
  
  .numero.numero18c {
      top: 29%; 
      left: 81%;
  }
  
  .numero.numero18d {
    top: 42%;
    left: 82%;
}

.numero.numero18e {
    top: 3.5%; 
    left: 65%;
  }

.numero.numero18f {
    top: 33%;
    left: 7.5%;
  }

.numero.numero18g {
    top: 20%;
    left: 12%;
  }

  .numero.numero19 {
      top: 48%;
      left: 10%;
  }
  
  .numero.numero20 {
      top: 54%;
      left: 45%;
  }

  .numero.numero21 {
    top: 40%;
    left: 7%;
  }

  .numero.numero22a {
    top: 3%;
    left: 61%;
  }

  .numero.numero22b {
    top: 3%;
    left: 55%;
  }
  
  .numero.numero22c {
    top: 3%;
    left: 37%;
  }

  .numero.numero22d {
    top: 3%;
    left: 30%;
  }

  img.icon-schema {
      width: 15px;
      height: 15px;
      position: absolute;
  }
  
  img.icon-schema.disabili {
      left: 79%;
      top: 47%;
  }
  
  img.icon-schema.wc1 {
      top: 2%;
      left: 28%;
  }
  
  img.icon-schema.wc2 {
      top: 2%;
      left: 61%;
  }
  
  img.icon-schema.wc3 {
      top: 56%;
      left: 25%;
  }
  
  img.icon-schema.wc4 {
      top: 56%;
      left: 62%;
  }
  
  img.icon-schema.wc5 {
      top: 62%;
      left: 2%;
  }
  
  img.icon-schema.wc6 {
      top: 7%;
      left: 75%;
  }
  
  img.icon-schema.wc7 {
      top: 60%;
      left: 81%;
  }
  
  .sektoren.sektorGuest {
      top: 12%;
      left: 67%;
      font-size: 0.7rem;
  }
  
  .sektoren.vip {
      top: 54%;
      left: 31%;
      font-size: 0.7rem;
  }
  
  .eingang {
      position: absolute;
      font-size: 0.8rem;
      font-family: var(--bold-font);
      line-height: 1;
  }
  
  .eingang:after {
      content: "";
      position: absolute;
      top: 50%;
      right: -25px;
      transform: translateY(-50%);
      width: 17px;
      height: 11px;
      background-image: url(../images/schema/schema-arrow.svg);
      background-repeat: no-repeat;
  }
  
  .eingang.eingang1 {
      top: 29%;
      left: 0;
  }
  
  .eingang.eingang2 {
      top: 10%;
      left: 82%;
  }
  
  .eingang.eingang2:after {
      transform: rotate(180deg) translateY(50%);
      right: auto;
      left: -25px;
  }
  
  .eingang.eingang3 {
      top: 94%;
      left: 61%;
  }
  
  .eingang.eingang3:after {
      transform: rotate(90deg) translateY(50%);
      right: auto;
      left: 50%;
      top: -20px;
  }
  
  .eingang.eingang3:after {
      transform: rotate(
  -90deg) translate(50%, -50%);
      right: auto;
      left: 50%;
      top: -26px;
  }
  
  .eingang.eingang4 {
      top: 72%;
      left: 85%;
  }
  
  .eingang.eingang4:after {
      transform: rotate(180deg) translateY(50%);
      right: auto;
      left: -25px;
  }
  
  .linie {
      position: absolute;
      z-index: 2;
  }
  
  img.linie.linieL {
      width: 16%;
      left: 64.5%;
      top: 10%;
  }
  
  img.linie.linieO {
      width: 21%;
      left: 8.2%;
      top: 6.4%;
  }
  
  img.linie.VIP {
      width: 71%;
      top: 46%;
      left: 12.5%;
  }
  
  img.oneway1 {
      position: absolute;
      width: 50px;
      left: 0;
      bottom: -13px;
  }
  
  img.oneway2 {
      position: absolute;
      width: 50px;
      right: 0;
      top: -12px;
  }
  
  
  
  
  
  
  
  /* SCHEMA */
  
  .schema {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      height: auto;
  }
  
  .schemamap {
      position: absolute !important;
      display: block;
      float: left;
      width: 100%;
      height: 100%;
  }
  
  .checkpoint {
      position: absolute;
      width: clamp(14px, 2vw, 20px);
      height: clamp(14px, 2vw, 20px);
      padding: 2px;
      border-radius: 5px;
      align-items: center;
      justify-content: center;
      opacity: 0;
      display: none;
  }
  
  .checkpoint.active {
      opacity: 1;
      display: flex;
      -webkit-animation: fadeIn 0.65s ease forwards;
      animation: fadeIn 0.65s ease forwards;
    }
    
    @-webkit-keyframes fadeIn {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
    @keyframes fadeIn {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
  
  
  .schema p {
      font-family: var(--bold-font);
      font-size: min(max(0.65rem, 0.9vw), 0.9rem);
      margin: 0;
      text-align: center;
      color: #fff;
  }
  
  .schemalist {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin: 2em 0 0;
  }
  
  .schemalist img {
      width: clamp(16px, 2vw, 20px);
      height: clamp(16px, 2vw, 20px);
      padding: 2px;
      border-radius: 5px;
  }
  
  .schemalist-row {
      display: grid;
      float: left;
      width: 100%;
      align-items: center;
      grid-template-columns: 70px 1fr;
      border-bottom: solid 1px var(--dark-gray);
      min-height: 45px;
  
      opacity: 0;
      display: none;
  }
  
  .schemalist-row.active {
      opacity: 1;
      display: grid;
      -webkit-animation: fadeIn 0.65s ease forwards;
      animation: fadeIn 0.65s ease forwards;
    }
    
    @-webkit-keyframes fadeIn {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
    @keyframes fadeIn {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
  
  
  .schemalist-row .col-1 {
      font-family: var(--bold-font);
      margin: 0;
      text-align: left;
  }
  
  .schemalist-row .col-2 {
      margin: 0;
      text-align: left;
  }
  
  .schema-container {
      margin: 12% 0;
  }
  
  .schemafilter, .schemafilter-neu {
      position: relative;
      display: flex;
      float: left;
      width: 100%;
      flex-wrap: wrap;
  }
  
  .schemafilter .button, .newsfilter .button, .schemafilter-neu .button {
      padding: 7px 20px;
      font-size: min(max(0.65rem, 0.9vw), 0.9rem);
      cursor: pointer;
  }
  
  .schemafilter .button:before, .newsfilter .button:before, .schemafilter-neu .button:before {
      display: none;
  }
  
  .schemafilter .button.active, .newsfilter .button.active, .schemafilter-neu .button.active {
      color: var(--white);
      border: solid 1px var(--active-blue);
      text-decoration: none;
      background-position: 100%;
      transform: translateX(0rem);
  }
  
  
  
  
  /* HOSPITALITY */
  
  .blog .facts img, .article-leading .facts img {
      height: 3vw;
      min-height: 1.6em;
      max-height: 2.7em;
      height: clamp(1.6em, 3vw, 2.7em);
      width: auto;
      margin: 0 0 0.1em;
      margin: 0 0 clamp(0.1em, 0.5vw, 0.5em);
  }
  
  .facts h4 {
      font-size: 1.2rem;
      font-size: min(max(1.2rem, 1.8vw), 1.8rem);
      letter-spacing: 0;
      margin: 0;
  }
  
  .facts p {
      font-size: 0.7rem;
      font-size: min(max(0.7rem, 1.1vw), 1.1rem);
  }
  
  .angebot h5 {
      float: left;
  }
  
  .angebot p {
      margin: 0;
  }
  
  .vorteile li {
      list-style: none;
      border-bottom: solid 1px var(--dark-gray);
  }
  
  .moduletable.hospitality {
      position: relative;
      float: left;
      width: 100%;
  }
  
  .newsflash.hospitality {
      position: relative;
      float: left;
      width: 100%;
  }
  
  .hospitality .overview {
      margin-bottom: 1em;
  }
  
  .menu-section {
      position: relative;
      float: left;
      width: 45%;
      margin-right: 5%;
      margin-top: 2em;
  }
  
  .reservieren-section {
      position: relative;
      float: left;
      width: 100%;
      margin-top: 2em;
  }
  
  .info-section {
      position: relative;
      float: left;
      width: 100%;
      margin-top: 1em;
  }
  
  
  /* KONTAKT CONTATTO */
  
  .kontakt {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      padding-top: clamp(0.8em, 1vw, 1em);
  }
  
  
  
  /* ///// BUSINESS ////// */
  
  .factsfigures .overview {
      padding: 10%;
      width: 80%;
      border-radius: 10px;
      -webkit-box-shadow: 0px 0px 20px 3px rgb(0,0,0,0.1);
      box-shadow: 0px 0px 20px 3px rgb(0,0,0,0.1);
  }
  
  .blog .factsfigure img {
      height: clamp(1.6em, 2.4vw, 2.4em);
      width: auto;
      margin-bottom: clamp(0.8em, 1.2vw, 1.2em);
  }
  
  .factsfigure h4 {
      font-size: min(max(1.4rem, 2.4vw), 2.4rem);
      margin-bottom: clamp(0.2em, 0.6vw, 0.6em);
  }
  
  .factsfigure p {
      margin: 0;
  }
  
  
  /* PARTNER E SPONSOR */
  
  .blog.sponsor .overview {
      padding: 5% 10%;
      width: 80%;
      height: 80%;
      min-height: clamp(6em, 8vw, 10em);;
      display: grid;
      justify-content: center;
      align-items: center;
  }
  
  .blog.sponsor .item {
      overflow: hidden;
  }
  
  
  .blog.sponsor .srcbild img {
      max-width: clamp(10em, 14vw, 14em);;
  }
  
  
  
  /* ///// CLUB ///// */
  
  .person {
      border-bottom: solid 1px var(--dark-gray);
  }
  
  .person b {
      text-transform: uppercase;
  }
  
  .person p {
      margin: 0px;
  }
  
  .palmares {
      border-bottom: solid 1px var(--dark-gray);
  }
  
  .palmares b {
      text-transform: uppercase;
  }
  
  .palmares p {
      margin: 0px;
  }
  
  .factsfigures.hof img {
      width: clamp(4em, 6vw, 6em);
  }
  
  
  /* ////// EVENTI ////// */
  
  .galerie a.gallery {
      display: flex;
      flex: 0 31%;
      width: 31%;
      margin: 1% 1% 1% 0;
      float: left;
  }

  h4.event-title {
    float: left;
    width: 100%;
    clear: both;
    margin-top: 1rem;
}

.moduletable.vergangene-events {
    position: relative;
    float: left;
    width: 100%;
    margin-top: clamp(4rem, 6vw, 6rem);
}

.vergangene-events h3 {
    margin-bottom: 2rem;
}

.event img {
    object-fit: contain;
    object-position: left;
    height: auto;
    margin: 1rem 0;
}
  
  
  /* /////////////// HOME /////////////// */
  
  #hcap-live {
      position: relative;
      display: block;
      float: left;
      margin: 0 0 0 calc(10% - 1em);
      width: calc(81% - 26vw);
      width: calc(calc(81% - 1em) - clamp(18em, 26vw, 35em));
  }
  
  #hcap-live h2 {
      font-size: min(max(1.4rem, 2.5vw), 2.5rem);
      margin-bottom: 1em;
  }
  
  a.hcaplive {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      border-radius: 10px;
      overflow: hidden;
      -webkit-mask-image: -webkit-radial-gradient(white, black);
  }
  
  a.hcaplive .bgimage {
      width: 100%;
      height: 16.8vw;
      min-height: 15.8em;
      max-height: 22em;
      height: clamp(15.8em, 16.8vw, 22em);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
  
      -ms-transform: scale(1);
      -moz-transform: scale(1);
      -webkit-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1);
      transition: all ease 0.5s;
  }
  
  a.hcaplive h3 {
      position: absolute;
      z-index: 6;
      color: var(--white);
      text-transform: uppercase;
      font-size: min(max(0.9rem, 1.1vw), 1.1rem);
      line-height: 1.5;
      font-family: var(--semibold-font);
      bottom: 5em;
      left: 7%;
      width: 86%;
  }
  
  a.hcaplive .button {
      position: absolute;
      z-index: 6;
      left: 7%;
      bottom: 2em;
  }
  
  a.hcaplive:hover .bgimage {
      -ms-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -webkit-transform: scale(1.05);
      -o-transform: scale(1.05);
      transform: scale(1.05);
  }
  
  a.hcaplive:hover .button.whiteline {
      background-color: transparent;
      color: var(--white);
      border: solid 1px var(--active-blue);
      text-decoration: none;
      background-position: 100%;
      transform: translateX(0.5rem);
  }
  

  #hcap-live-new {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    /* margin-top: -15em; OHNE GAMECENTER */
    margin-top: clamp(3em, 3%, 5em); /*MIT GAMECENTER*/
    margin-bottom: clamp(2em, 5%, 10em);
    overflow: hidden;
}


#hcap-live-new .swiper-container {
    overflow: visible;
}

#hcap-live-new .newsflash {
    margin-left: 9%;
}

#hcap-live-new .swiper-button-prev {
    bottom: auto;
    top: 50%;
    left: 0%;
    background: var(--white);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-left: -37px;
}

#hcap-live-new .swiper-button-prev.swiper-button-disabled, #hcap-live-new .swiper-button-next.swiper-button-disabled {
    opacity: 0;
}

#hcap-live-new .swiper-button-next {
    bottom: auto;
    top: 50%;
    left: auto;
    right: 10%;
    background: var(--white);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: -13px;
}

#hcap-live-new .swiper-button-next:after {
    filter: invert(1);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

#hcap-live-new .swiper-button-prev:after {
    filter: invert(1);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
}

#hcap-live-new a.hcaplive .button {
    bottom: 1em;
}

#hcap-live-new a.hcaplive h3 {
    position: absolute;
    z-index: 6;
    color: var(--white);
    text-transform: uppercase;
    font-size: min(max(0.9rem, 1vw), 1.1rem);
    line-height: 1.2;
    font-family: var(--semibold-font);
    bottom: 4em;
    left: 7%;
    width: 86%;
    letter-spacing: 1px;
}


#fanzone-new-container {
    position: relative;
    display: flex;
    width: 82%;
    padding: 5% 9% 0 9%;
    float: left;
}

div#fanzone-new {
    position: relative;
    display: block;
    float: right;
    width: 70%;
    flex: 1 70%;
    background: var(--border-color);
    border-radius: 10px;
}

#fanzone-new .fanzone-year {
    position: absolute;
    top: 1em;
    right: 1em;
    width: 9%;
    height: 40%;
    background-image: url(../images/areatifosi_22_23.svg);
    background-size: contain;
    z-index: 2;
    background-repeat: no-repeat;
    background-position: right;
}

div#ranking-home-new {
    position: relative;
    display: block;
    float: left;
    width: 400px;
    flex: 1 400px;
    margin-right: 4%;
}



/* ////// SWISS DIGITAL HOCKEY BANNER ////// */

div#fanzone-new .moduletable {
    height: 100%;
}

.sdh-banner {
    position: relative;
    display: block;
    float: right;
    width: 100%;
    height: 100%;
    flex: 1 70%;
    background: var(--border-color);
    border-radius: 10px;
}

.sdh-banner .sdh-content {
    position: absolute;
    display: block;
    float: left;
    width: 45%;
    z-index: 4;
    margin: 0 0 0 6%;
    top: 50%;
    transform: translate(0,-50%);
}

.sdh-banner .sdh-content p {
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}

img.sdh-mockup {
    position: absolute;
    z-index: 2;
    height: 115%;
    width: auto;
    right: clamp(1em, 2vw, 20em);
    top: -5%;
}

.sdh-banner .sdh-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 70%;
    height: 100%;
    border-radius: 10px;
    z-index: 3;
    background: rgb(26,37,55);
    background: linear-gradient(90deg, rgba(26,37,55,1) 0%, rgba(26,37,55,0) 100%);
}

.sdh-banner .sdh-content span {
    color: var(--white);
    font-family: 'hcap-bold';
    font-size: min(max(1.8rem, 2.4vw), 2.4rem);
    line-height: 1.2;
    display: block;
}

.sdh-banner span.sdh-title-two {
    color: #FFCD01;
}

.sdh-banner .app-store {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-top: 2em;
}

img.app-store-img {
    width: clamp(8em, 10vw, 10em);
    height: auto;
    margin-right: 1em;
}
  

  /* ////// CAMPAGNA ////// */
  
    #campagna {
        position: relative;
        display: flex;
        float: left;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        position: relative;
        float: left;
        width: 100%;
        overflow: hidden;
    }

    #campagna .moduletable {
        width: 82%;
        padding: 5% 9% 0 9%;
    }

    #campagna .moduletable.desktop {
        display: block;
    }

    #campagna .moduletable.mobile {
        display: none;
    }

    #campagna img {
        border-radius: 10px;
    }



  /* ////// ASCONA ////// */

    .banner {
        width: 100%;
        height: clamp(35rem, 40vw, 40rem);
        position: relative;
        float: left;
    }

    img.bg {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .ascona-logo {
        position: absolute;
        top: 2rem;
        right: 2rem;
        width: clamp(6rem, 8vw, 10rem);
        height: clamp(6rem, 8vw, 10rem);
        border-radius: 0!important;
        object-fit: contain;
        object-position: top right;
    }

    .text {
        position: absolute;
        color: black;
        position: absolute;
        bottom: 2rem;
        right: 2rem;
        width: 40%;
        background: white;
        border-radius: 10px;
        padding: 2.5rem;
    }

    img.paolo {
        position: absolute;
        left: 0;
        bottom: 0;
        height: 110%;
        width: auto;
    }

    .banner h2 {
        font-size: min(max(1.4rem, 2.5vw), 2.5rem);
        max-width: 75%;
        margin-bottom: 1rem;
    }

    .banner .button-filled {
        padding: 8px 20px 8px 20px;
        float: left;
        margin-top: 1rem;
    }

    .text-paolo {
        position: absolute;
        top: 10%;
        left: 22%;
        color: white;
        font-family: var(--bold-font);
    }

    .header-landingpage {
        position: relative;
        float: left;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: 100%;
        height: clamp(30rem, 40vw, 40rem);
        background-image: url('/images/ascona-locarno/cover-landing.jpg');
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        border-radius: 10px;
    }

    .header-landingpage h2 {
        color: var(--white);
        text-transform: none;
    }

    .header-landingpage .ascona-logo {
        width: clamp(14rem, 18vw, 18rem);
    }

    .text-duke {
        position: relative;
        float: left;
        width: 100%;
        background: var(--light-gray);
        border-radius: 10px; 
    }

    .text-duke img.paolo {
        position: absolute;
        left: 10%;
        height: 125%;
        bottom: 0;
    }

    .ascona-video {
        position: relative;
        float: left;
        width: 100%;
        display: flex;
    }

    .ascona-video iframe {
        width: clamp(50rem, 60vw, 60rem);
        margin: 0 auto;
    }

    .ascona-links {
        position: relative;
        float: left;
        width: 80%;
        padding: 5% 10%;
        background: var(--light-gray);
        border-radius: 10px;
    }

    .ascona-links-items {
        width: 100%;
        position: relative;
        float: left;
    }

    .ascona-link img {
        height: clamp(14rem, 18vw, 18rem);
        object-fit: cover;
        border-radius: 10px;
    }

    .ascona-instagram {
        position: relative;
        float: left; 
        width: 80%;
        padding: 5% 10%;
    }

    a.ascona-link-title {
        font-family: 'hcap';
        font-size: min(max(1.1rem, 1.25vw), 1.25rem);
        color: var(--border-color);
    }

    .instagram-title {
        font-size: min(max(1.1rem, 1.25vw), 1.25rem);
        color: var(--border-color);
    }

    .text-right p {
        color: var(--border-color);
    }

    .mobile .text {
        bottom: -12rem;
        left: 50%;
        width: calc(90% - 4rem);
        right: auto;
        transform: translate(-50%, 0);
        padding: 2rem;
    }

    .mobile img.paolo {
        left: 10%;
    }
    
    .mobile .ascona-logo {
        width: clamp(10rem, 18vw, 18rem);
    }

    .mobile .banner {
        height: clamp(24rem, 30vw, 30rem);
        margin-bottom: 14rem;
    }

    .mobile .banner h2 {
        max-width: 85%;
    }




    /* ////// UHR DALE MCCOURT ////// */

    .header-mccourt {
        position: relative;
        float: left;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        width: 100%;
        height: clamp(15rem, 40vw, 40rem);
        background-image: url('/images/edizione-limitata-dale-mc-court/Titelbild.webp');
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        border-radius: 10px;
    }

    .header-mccourt h2 {
        color: var(--white);
        position: absolute;
        left: 10%;
        bottom: 15%;
        width: 50%;
        text-align: left;
        line-height: 1.25;
        font-size: min(max(1.2rem, 3vw), 4rem);
        max-width: 12em;
        -webkit-hyphens: none;
        -ms-hyphens: none;
        hyphens: none;
    }

    img.rounded {
        border-radius: 20px;
    }

    .article-leading.mccourt {
        background: var(--light-gray);
    }

    .vertical-line {
        border-right: solid 1px var(--border-color);
    }

    .hidden-text {
        display: none;
    }

    .content a.button {
        float: none;
        margin: 2em 0;
    }

    video#mccourt-video {
        position: relative;
        width: 100%;
        height: 60vh;
        border-radius: 15px;
        object-fit: cover;
        min-height: 45em;
    }

    .mute {
        position: absolute;
        z-index: 2;
        top: 2em;
        right: 3em;
        width: 6em;
        height: 6em;
        background: rgba(255,255,255,0.3);
        border-radius: 50%;
        backdrop-filter: blur(30px);
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
    }

    .audio-icon {
        position: absolute;
        z-index: 3;
        width: 2em;
        opacity: 1;
        -webkit-transform: scale3d(1none,1none,1none);
        transform: scale3d(1none,1none,1none);
        -webkit-transition: .3s cubic-bezier(.455, .03, .515, .955);
        transition: .3s cubic-bezier(.455, .03, .515, .955);
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
        filter: invert(1);
    }

    .audio-on.toggle, .audio-off.toggle {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }

    .audio-on, .audio-off {
        opacity: 0;
        -webkit-transform: scale(.5);
        -ms-transform: scale(.5);
        transform: scale(.5);
    }

    .mccourt-video {
        position: relative;
        display: block;
        float: left;
        width: 100%;
    }

    #menu-mccourt ul li {
        float: left;
        padding: 0 3em 0 0;
        text-transform: uppercase;
        text-align: center;
        line-height: 1;
        list-style-type: none;
    }

    #menu-mccourt ul li a {
        font-size: 0.7em;
        -webkit-hyphens: none;
        -ms-hyphens: none;
        hyphens: none;
        font-family: var(--bold-font);
        color: var(--white);
        letter-spacing: 0.1em;
    }

    #menu-mccourt ul li a:hover {
        color: var(--active-blue);
    }

    div#menu-mccourt {
        position: relative;
        display: block;
        float: left;
    }

    img.shopicon {
        width: 1.5em;
        margin-left: 2em;
    }




    /* GALLERIA MCCOURT */


    div#mccourt-galleria {
        position: relative;
        display: block;
        float: left;
        width: 113%;
        padding: 5em 0 7em 10%;
        padding: clamp(5em, 7%, 7em) 0 clamp(5em, 7%, 7em) 13%;
        background: var(--white);
        margin-left: -13%;
    }

#galleria-mccourt h3 {
    margin-bottom: clamp(2em, 4vw, 4em);;
}

.mccourtgallery {
    position: relative;
    display: block;
    float: left;
    width: 100%;
}

.mccourtgallery .swiper-controls {
    left: 0;
    height: 16px;
    transform: translate(0, -50%);
    margin-top: 1.5%;
}

.mccourtgallery .swiper-container {
    width: calc(100% - 10vw);
    width: calc(100% - clamp(50px, 10vw, 140px));
    height: 100%;
    margin-right: 0;
}

.mccourtgallery .swiper-slide {
    opacity: 0.6;
    transition: opacity ease 0.5s;
}

.mccourtgallery .swiper-slide.swiper-slide-active {
    opacity: 1;
}

.mccourtgallery .swiper-slide:hover {
    opacity: 1;
}

.mccourtgallery .swiper-slide:hover .shopware-slide-shadow {
    visibility: hidden;
}

.mccourtgallery .swiper-button-next {
    margin-left: 40px;
}

.mccourt-slide-shadow {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0.2);
    box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0.2);
    transition: all ease 0.5s;
}




  /* ////// SCHEMA ABBONAMENTI ////// */
  
  #schema-abbonamenti {
    position: relative;
    display: flex;
    float: left;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    width: 84%;
    padding: 5% 7% 5% 9%;
    background: var(--white);
}

  
  /* ////// ADVERTISING BANNERS ////// */

  /* /// NEW BANNERS 2022/2023 /// */

  .banner-container {
    position: relative;
    display: flex;
    justify-content: center;
    float: left;
    width: 82%;
    padding: 5% 9% 2em;
}

div#banner-big-1, div#banner-big-2 {
    position: relative;
    display: flex;
    float: left;
    width: 82%;
    padding: 0em 9% 0;
    overflow: hidden;
}

#banner-big-2 {
   margin-top: 2em;
}

.banner-container .moduletable, .banner-container .newsflash {
    width: 100%;
    height: 100%;
}

div#banner-small-1a, div#banner-small-1b, div#banner-small-2a, div#banner-small-2b {
    position: relative;
    display: flex;
    flex: 1 48%;
    /*height: clamp(6em, 10vw, 33em);*/
    height: 12vw;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    overflow: hidden;
}

div#banner-small-1a img, div#banner-small-1b img, div#banner-small-2a img, div#banner-small-2b img {
    border-radius: 10px;
}

div#banner-small-1a, div#banner-small-2a {
    margin-right: 2em;
}

div#banner-big-1 .moduletable, div#banner-big-2 .moduletable {
    width: 100%;
    height: clamp(5em, 15vw, 15vw);
    border-radius: 10px;
    overflow: hidden;
}

div#banner-big-2 .moduletable {
    height: 100%;
}

.banner-container .srcbild {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%,-50%);
    display: flex;
    justify-content: center;
    align-items: center;
}


/* ADVERTISING INDIVIDUAL STYLES */

div#sporttipp, div#sporttipp div, div#sporttipp iframe, div#sporttipp body {
    height: clamp(7em, 10vw, 14em) !important;
    border-radius: 10px;
}

.moduletable.postfinance {
    /*background: var(--black);*/
    border-radius: 10px;
}

.postfinance iframe {
    /*height: calc(100% - 1.4em) !important;*/
    height: 100%;
}

.postfinance .gwd-page-container {
    height: 100% !important;
}

.newsflash.postfinance {
    display: flex;
    align-items: center;
    height: 100%;
}

.moduletable.mysports {
    background: var(--black);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 1em;
    width: calc(100% - 2em);
}

.moduletable.morris {
    background: var(--white);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
}

.moduletable.morris img {
    padding: 2em;
    width: calc(100% - 4em);
}

.moduletable.mysports a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}



  /* /// END NEW BANNERS 2022/2023 /// */



  
  #banner1_a, #banner1_b {
      position: relative;
      display: flex;
      float: left;
      width: 80%;
      padding: 5% 10%;
      flex-wrap: wrap;
      justify-content: center;
      align-items: flex-start;
      background: var(--midlight-gray);
  }
  
  #banner1_a {
      margin-top: clamp(4em, 7%, 10em);
      padding: 5% 10% 0;
  }

  #banner3 {
    position: relative;
    display: flex;
    float: left;
    width: 80%;
    padding: 0% 10% 5% 10%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}

  #banner4,  #banner5 {
    position: relative;
    display: flex;
    float: left;
    width: 80%;
    padding: 0% 10% 5% 10%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}
  
  /* Postfinance Banner */
  
  #banner1_a iframe.desktop,
  #banner1_a .newsflash {
      max-width: 730px;
  }
  
  /* Postfinance Banner End */
  
  
  
  #banner1_a iframe.mobile, #banner1_b iframe.mobile, #banner-small-1a iframe.mobile, #banner-small-1b iframe.mobile {
      display: none;
      max-height: 50px;
  }
  
  #banner1_a iframe.desktop, #banner1_b iframe.desktop {
      max-height: 90px;
  }
  
  .gwd-pagedeck>.gwd-page {
      top: 50% !important;
      left: 50% !important;
      transform: translate(-50%, -50%) !important;
  }
  
  
  /* Postfinance Banner Mobile Spezialformat */
  @media screen and (max-width : 800px)  {
      #banner1_a iframe.desktop, #banner1_b iframe.desktop, #banner-small-1a iframe.desktop {
          display: none;
      }
  
      #banner1_a iframe.mobile, #banner1_b iframe.mobile, #banner-small-1a iframe.mobile {
          display: block;
      }

      div#banner-small-1a {
        height: 28vw;
    }
  }
  
  /*
  #banner1 iframe {
      width: clamp(18em, 26vw, 35em);
      height: 100%;
  }*/
  
  #banners {
      position: relative;
      display: flex;
      float: left;
      width: 90%;
      padding: 5%;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
  }
  
  #banners.gamecenter {
      padding: 0 5% 5%;
  }
  
  #banners .moduletable, #banners .newsflash {
    position: relative;
      width: 100%;
      max-width: 952px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
  }
  
  #banner1_a .moduletable, #banner1_a .newsflash, #banner1_b .moduletable, #banner1_b .newsflash {
    position: relative;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
  }
  
  #banners a,
  #banner1 a {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  #banners a.ads-space,
  #banner1 a.ads-space {
      padding: clamp(1em, 2vw, 2em);
      width: calc(100% - clamp(2em, 4vw, 4em));
  }
  
  .ads-margin {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin-bottom: clamp(2em, 4vw, 4em);
  }
  
  span.bannerhinweis {
      font-size: 0.55em;
      color: var(--dark-blue);
      text-transform: uppercase;
      margin-left: 8px;
      margin-bottom: 5px;
      width: calc(100% - 8px);
  }

  video.bannervideo {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}
  
  
  
  /* Postfinance (im index.html im Ordner ads alle fixen width ändern auf 100vw, alle height ändern auf 100%) */
  
  
  
  
  /* ////// FANZONE ////// */
  
  
  #areatifosi {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      /*margin-top: clamp(4em, 10%, 15em);*/
      margin-top: 0;
      margin-bottom: 6em;
      margin-bottom: 5%;
  }
  
  #areatifosi h2, #fanzone-new h2 {
      font-size: min(max(1.4rem, 2.5vw), 2.5rem);
      margin-bottom: 1em;
      color: var(--white);
  }
  
  #areatifosi p, #fanzone-new p {
      color: var(--white);
  }
  
  .fanzone-content {
      position: relative;
      display: block;
      float: left;
      margin: 10% 5% 10% 10%;
      width: 30%;
      z-index: 3;
  }

  #fanzone-new .fanzone-content {
    position: absolute;
    margin: 0;
    margin-left: 6%;
    top: 50%;
    transform: translate(0,-50%);
}
  
  .fanzone-bg {
      width: 60%;
      height: 100%;
      background-image: url(../images/HCAP_AreaTifosi_Campagna_Home_Web.jpg);
      background-size: cover;
      background-position: center;
      position: absolute;
      right: 0;
      top: 0;
      z-index: 1;
  }

  #fanzone-new .fanzone-bg {
    width: 100%;
    border-radius: 10px;
    background-position: center right;
}
  
  .fanzone-overlay {
      position: absolute;
      z-index: 2;
      width: 60%;
      height: 100%;
      top: 0;
      left: 0;
      /*background: -moz-linear-gradient(left, rgba(40,55,85,1) 0%, rgba(70,105,170,1) 67%, rgba(70,105,170,0) 100%);
      background: -webkit-linear-gradient(left, rgba(40,55,85,1) 0%,rgba(70,105,170,1) 67%,rgba(70,105,170,0) 100%);
      background: linear-gradient(to right, rgba(40,55,85,1) 0%,rgba(70,105,170,1) 67%,rgba(70,105,170,0) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#283755', endColorstr='#004669aa',GradientType=1 ); */
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,2d4979+79,2d4979+100&1+0,1+79,1+79,0+100 */
    background: -moz-linear-gradient(left,  rgba(40,55,85,1) 0%, rgba(45,73,121,1) 79%, rgba(45,73,121,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(40,55,85,1) 0%,rgba(45,73,121,1) 79%,rgba(45,73,121,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(40,55,85,1) 0%,rgba(45,73,121,1) 79%,rgba(45,73,121,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#283755', endColorstr='#002d4979',GradientType=1 ); /* IE6-9 */
  }

  #fanzone-new .fanzone-overlay {
    opacity: 1;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1a2537+0,1a2537+28,1a2537+100&1+0,1+28,0+100 */
background: -moz-linear-gradient(left,  rgba(26,37,55,1) 0%, rgba(26,37,55,1) 28%, rgba(26,37,55,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(26,37,55,1) 0%,rgba(26,37,55,1) 28%,rgba(26,37,55,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(26,37,55,1) 0%,rgba(26,37,55,1) 28%,rgba(26,37,55,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a2537', endColorstr='#001a2537',GradientType=1 ); /* IE6-9 */

    border-radius: 10px;
    width: 30%;
}
  

  .fanzone-secret-overlay {
      display: none!important;
      position: fixed;
      width: 100%;
      height: 100%;
      background: rgb(70,105,170) !important; /* Old browsers */
      background: -moz-linear-gradient(left,  rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%) !important; /* FF3.6-15 */
      background: -webkit-linear-gradient(left,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important; /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to right,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 ) !important; /* IE6-9 */
      color: var(--white);
      z-index: 9999;
  }


  .yawave-hide-content {
      display: block;
      position: fixed;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      background: var(--border-color);
      z-index: 1100;
      opacity: 1;
  }
  
  button.back-to-fanzone {
    margin: 2rem auto;
    float: none;
    }
  
  
  /* ////// SOCIAL HUB ////// */
  
  #socialhub {
    position: relative;
    float: left;
    display: block;
    width: 82%;
    padding-left: 9%;
    padding-right: 9%;
    padding-top: clamp(3em, 5%, 5em);
    padding-bottom: 0;
}
  
  #socialhub h2 {
      text-align: center;
      margin-bottom: 0;
      margin-bottom: clamp(0em, 1vw, 1em);
  }
  
  #socialhub .moduletable.mobile {
      display: none;
  }
  
  
  
  .flockler-posts:not(.flockler-grid-items) a.flockler-btn-load-more {
      margin-left: 50% !important;
      transform: translate(-50%, 0) !important;
      border-radius: 20px !important;
      width: 100px !important;
      padding: 7px 20px 7px 20px !important;
      background: rgb(70,105,170) !important; /* Old browsers */
      background: -moz-linear-gradient(left,  rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%) !important; /* FF3.6-15 */
      background: -webkit-linear-gradient(left,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important; /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to right,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 ) !important; /* IE6-9 */
  }
  
  .flockler-carousel_v2-item__wrapper {
      border-radius: 15px;
  }
  
  
  .flickity-prev-next-button {
      width: 25px;
      height: 25px;
  }
  
  .flickity-button {
      background: var(--border-color);
      color: var(--white);
  }
  
  .flickity-button:hover {
      background: var(--border-color);
  }
  
  .flockler-posts:not(.flockler-grid-items) {
      padding-bottom: 0 !important;
  }
  
  button.flickity-button svg {
      display: none;
  }
  
  button.flickity-button:before {
      position: absolute;
      content: '' !important;
      background-image: url(../images/slider-arrow.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transform: rotate(0deg) translate(-50%,-50%);
       -ms-transform: rotate(0deg) translate(-50%,-50%);
      -webkit-transform: rotate(0deg) translate(-50%,-50%);
      width: 18px;
      height: 10px;
      top: 50%;
      left: 50%;
  }
  
  button.flickity-button.flickity-prev-next-button.previous:before {
      transform: rotate(
  180deg
  ) translate(50%,50%);
      -ms-transform: rotate(180deg) translate(50%,50%);
      -webkit-transform: rotate(
  180deg
  ) translate(50%,50%);
  }
  
  
  
  
  /* ////// SHOP SLIDER ////// */
  
  #shop {
      position: relative;
      display: block;
      float: left;
      width: 90%;
      padding: 5em 0 7em 10%;
      padding: clamp(5em, 7%, 7em) 0 clamp(5em, 7%, 7em) 10%;
      background: var(--white);
  }
  
  #shop h3 {
      margin-bottom: clamp(2em, 4vw, 4em);;
  }
  
  .shopware-products {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  .shopware-products .swiper-controls {
      left: 0;
      height: 16px;
      transform: translate(0, -50%);
      margin-top: 1.5%;
  }
  
  .shopware-products .swiper-container {
      width: calc(100% - 10vw);
      width: calc(100% - clamp(50px, 10vw, 140px));
      height: 100%;
      margin-right: 0;
  }
  
  .shopware-products .swiper-slide.swiper-slide-active {
      opacity: 1;
  }
  
  .shopware-products .swiper-button-next {
      margin-left: 40px;
  }
  
  .swiper-button-prev.swiper-button-prev-8, .swiper-button-next.swiper-button-next-8 {
      bottom: 0;
      margin-top: 0;
  }
  
  a.button-filled.buy {
      padding: 7px 20px 7px 20px;
      margin: 0;
      position: absolute;
      z-index: 2;
      top: 50%;
      left: 0;
      opacity: 0;
      transform: translate(0, -50%);
      -moz-transform: translate(0, -50%);
      -webkit-transition: opacity .6s ease-in-out;
      -moz-transition: opacity .6s ease-in-out;
      transition: opacity .6s ease-in-out;
  }
  
  a.button-filled.buy:hover {
      transform: translate(0, -50%);
  }
  
  span.label-neu {
      position: absolute;
      background: var(--red);
      left: 15%;
      top: 4%;
      color: white;
      padding: 2px 15px 3px 15px;
      border-radius: 25px;
      text-transform: uppercase;
      font-family: var(--bold-font);
      font-size: 0.8rem;
      letter-spacing: 0.1rem;
  }
  
  .swiper-slide.swiper-slide-active a.button-filled.buy {
      opacity: 1;
  }
  
  a.shopware-slide {
      position: relative;
      display: block;
      float: left;
      overflow: hidden;
      width: 100%;
      height: 30vw;
      min-height: 25em;
      height: clamp(25em, 30vw, 35em);
      background-size: cover;
      background-position: center center;
  }
  
  
  .shopware-products .swiper-slide {
      opacity: 0.6;
      transition: opacity ease 0.5s;
  }
  
  .shopware-products .swiper-slide:hover {
      opacity: 1;
  }
  
  .shopware-products .swiper-slide:hover .shopware-slide-shadow {
      visibility: hidden;
  }
  
  .swiper-slide.swiper-slide-active .shopware-slide {
      width: calc(100% - 4vw);
      width: calc(100% - clamp(50px, 4vw, 60px));
      margin-left: auto;
      float: right;
  }
  
  
  .shopware-slide-shadow {
      position: absolute;
      z-index: 2;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -webkit-box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0.2);
      box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0.2);
      transition: all ease 0.5s;
  }
  
  .shopware-slide-shadow:hover {
      -webkit-box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0);
      box-shadow: inset 0px 0px 50vw 5px rgb(142,148,190,0);
  }
  
  .swiper-slide.swiper-slide-active .shopware-slide-shadow {
      width: calc(100% - 4vw);
      width: calc(100% - clamp(50px, 4vw, 60px));
      left: auto;    
      right: 0;
      border-radius: 10px 0px 0px 10px;
  }
  
  .shopware-products a.button-filled.shop {
      position: absolute;
      right: 7%;
      bottom: -6em;
  }
  
  
  
  
  
  
  /* ////// NEWSLETTER ////// */
  
  #newsletter {
      position: relative;
      float: left;
      display: block;
      width: 100%;
      padding-left: 0;
      padding-right: 0;
      margin-top: 2em;
      margin-top: clamp(3em, 5%, 10em);
      margin-bottom: 4em;
      margin-bottom: clamp(2em, 5%, 10em);
      background-color: var(--border-color);
      border-radius: 10px;
      overflow: hidden;
  }
  
  #newsletter-overlay {
      position: fixed;
      width: 80%;
      height: 100%;
      padding: 0 10%;
      background: var(--border-color);
      z-index: 1007;
      justify-content: center;
      align-items: center;
      display: none;
      top: 0;
  }
  
  #newsletter-overlay.show {
      display: flex;
  }
  
  #newsletter label, #newsletter h4, #newsletter p {
      color: var(--white);
  }
  
  #newsletter h2 {
      color: var(--white);
      font-size: 1.2rem;
      margin-bottom: 30px;
  }
  
  #newsletter h4 {
      margin-bottom: 1em;
  }
  
  .newsletter .col-4-2 {
      padding: 20%;
  }
  
  .newsletter .col-1-3 {
      position: relative;
      min-height: clamp(25em, 36vw, 36em);
  }
  
  .newsletter-image {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      background-size: cover;
      border-radius: 10px 0px 0px 10px;
  }
  
  .newsletter-content {
      position: absolute;
      top: 50%;
      left: 15%;
      z-index: 2;
      transform: translate(0, -50%);
      text-transform: uppercase;
      margin-top: -10px;
  }
  
  .newsletter-content p {
      position: relative;
      display: table;
      color: var(--white);
      font-family: var(--bold-font);
      font-size: 2rem;
      font-size: min(max(2rem, 5vw), 5rem);
  }
  
  .newsletter-content p:after {
      content: "";
      position: absolute;
      bottom: clamp(2px, 0.5vw, 5px);
      height: clamp(5px, 0.7vw, 10px);
      width: 100%;
      background: white;
      left: 0;
  }
  
  .newsletter input#fname, .newsletter input#lname, .newsletter input#email {
      background: #384355;
      color: var(--white);
      border: none;
      padding: 10px;
      width: calc(100% - 20px);
  }
  
  img.closeX {
      position: absolute;
      right: 2em;
      top: 2em;
      width: 1.4em;
      cursor: pointer;
      z-index: 2;
  }
  
  .success {
      display: none;
      position: relative;
      float: left;
      width: 100%;
      color: var(--white);
  }
  
  /* ///// HELSANA ///// */
  
  .helsana input {
      background: #384355;
      color: var(--white);
      border: none;
      padding: 10px;
      width: calc(100% - 20px);
  }
  
  form.helsana {
      margin-top: 1em;
  }
  
  .helsana input.send {
      width: auto;
      cursor: pointer;
      color: var(--blue);
      border-color: var(--blue);
  }
  
  .helsana input.send:hover {
      color: var(--white);
  }
  
  .disclaimer {
      margin-top: 4em;
  }
  
  .disclaimer p {
      font-style: italic;
  }
  
  .helsana .success {
      color: var(--black);
  }
  
  /* ///// TURNIER ///// */
  
  .turnier input {
      background: #384355;
      color: var(--white);
      border: none;
      padding: 10px;
      width: calc(100% - 20px);
  }
  
  select {
      position: relative;
      float: left;
      width: 100%;
      background: #384355;
      color: var(--white);
      border: none;
      padding: 10px;
      margin-bottom: 1.5rem;
  }
  
  form.turnier {
      margin-top: 10%;
  }
  
  .turnier input.send {
      width: auto;
      cursor: pointer;
      color: var(--blue);
      border-color: var(--blue);
  }
  
  .turnier input.send:hover {
      color: var(--white);
  }
  
  .turnier .success {
      color: var(--black);
  }
  
  /* ////// PLAYERS HOME SLIDER ////// */
  
  #players {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      background: var(--white);
  }
  
  .player-slider {
      position: relative;
      display: block;
      float: left;
      width: 80%;
      padding: 10% 10%;
      margin: 10% 0 0 0;
      overflow: visible;
      background-color: var(--light-gray);
      opacity: 0;
      -webkit-transition: opacity .6s ease-in-out;
      -moz-transition: opacity .6s ease-in-out;
      transition: opacity .6s ease-in-out;
  }
  
  #player .swiper-slide {
      overflow: visible;
  }
  
  .swiper-slide.swiper-slide-active .player-slider {
      opacity: 1;
  }
  
  #players .giocatore-facts {
      position: relative;
      top: auto;
      left: auto;
      transform: none;
      width: 50%;
      max-width: 600px;
      margin: 0;
      margin-bottom: 5%;
  }
  
  #players .giocatore-facts p, #players .giocatore-facts h3, #players .giocatore-facts h4, #players .giocatore-facts span {
      color: var(--border-color);
      margin: 0;
  }
  
  #players .prename, #players .name {
      color: var(--border-color);
  }
  
  #players .position {
      color: var(--red);
  }
  
  #players .number {
      color: var(--red);
      position: absolute;
      top: 30%;
      font-size: min(max(4rem, 12vw), 12rem);
      z-index: 3;
      left: 0;
  }
  
  #players .silhouette {
      position: absolute;
      width: 50%;
      height: 110%;
      right: 0;
      bottom: 0;
      z-index: 2;
      opacity: 0;
      -webkit-transition: opacity 1s ease-in-out;
      -moz-transition: opacity 1s ease-in-out;
      transition: opacity 1s ease-in-out;
  }
  
  #players .silhouette img {
      position: relative;
      height: 100%;
      width: auto;
      z-index: 2;
  }
  
  #players .swiper-slide.swiper-slide-active .silhouette {
      opacity: 1;
  }
  
  #players .silhouette.shadow {
      right: 2%;
      height: 105%;
      z-index: 1;
  }
  
  #players .silhouette.shadow img {
      opacity: 0.4;
  }
  
  #players .swiper-button-next {
      margin-left: 40px;
  }
  
  #players .swiper-controls {
      top: 28%;
      left: 10%;
      width: 80px;
      height: 26px;
  }
  
  img.player-slider-shadow {
      position: absolute;
      margin: 5% 0% 5% -57%;
      bottom: 0;
      z-index: 6;
  }
  
  
  
  
  
  /* ////// MULTIMEDIA ////// */

  #multimedia {
    position: relative;
    display: block;
    float: left;
    width: 80%;
    padding: clamp(3em, 7%, 7em) 10%;
    margin-top: clamp(3em, 7%, 7em);
    background-image: url(../images/multimedia-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom center;
}
  
  #multimedia h2, #multimedia p {
      color: var(--white);
  }
  
  #multimedia h2 {
      margin-bottom: 1.5em;
      margin-bottom: clamp(1.5em, 3vw, 3em);;
  }
  
  .videopreview-frame {
      position: relative;
      z-index: 2;
      cursor: pointer;
  }
  
  .videopreview-frame .overlay {
      position: absolute;
      display: block;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 2;
      border-radius: 15px;
      visibility: visible;
      background-color: rgba(0,0,0,0.5);
      transition: all ease 0.5s;
  }
  
  .videopreview-frame:hover .overlay {
      opacity: 0;
      visibility: hidden;
  }
  
  .videopreview iframe {
      position: relative;
      height: clamp(140px, 9.5vw, 240px) !important;
      z-index: 1;
  }
  
  .youtube-video-place {
      height: 9.5vw;
      height: clamp(140px, 9.5vw, 240px);
      border-radius: 15px;
      -webkit-box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.4); 
      box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.4);
  }
  
  .play-youtube-video {
      height: clamp(140px, 9.5vw, 240px);
      border-radius: 15px;
      background-size: cover;
      background-position: center;
  }
  
  #multimedia .moduletable.mobile {
      display: none;
  }
  
  .videopreview p {
      font-size: min(max(0.65rem, 0.9vw), 0.9rem);
  }
  
  img.play {
      position: absolute;
      z-index: 3;
      width: 20px;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      margin-left: 3px;
      margin-top: -3px;
      visibility: visible;
      transition: all ease 0.5s;
  }
  
  .videopreview-frame:hover img.play {
      visibility: hidden;
  }
  
  
  
  /* ///// INTROTEXT ///// */
  
  #introtext {
      position: relative;
      display: block;
      width: 100%;
      float: left;
  }
  
  
  
  
  /* ///// VIDEO ///// */
  
  video {
      position: absolute;
      z-index: 2;
      width: 100%;
      height: 100%;
      object-fit: cover;
  }
  
  
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      video {
          height:auto;
          width:100%;
          }
      }
      
      @supports (-ms-ime-align: auto) {
      video {
          height:auto;
          width:100%;
          }
      }
  
  
  


  /* ///// NEWSLETTER POPUP ///// */


      #newsletter-popup{
        align-items: center;
        margin: 70px auto;
        background: var(--border-color);
        border-radius: 5px;
        width: 40%;
        position: relative;
      }
      
      .newsletter-overlay{
        position: fixed;
        align-items: center;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(4, 16, 38, 0.8);
        transition: opacity 500ms;
        visibility: visible;
        opacity: 1;
        z-index: 99999;
        display: none;
      }

      #newsletter-popup .popup-close {
        color: #fff;
        height: 20px;
        width: 20px;
        position: absolute;
        top: 15px;
        right: 20px;
        text-align: center;
        text-decoration: none;
        line-height: 30px;
        font-family: var(--title-font);
        z-index: 2;
    }

      .newsletter-in {
        padding:30px 40px 40px;
      }
      #newsletter-popup img.popup-img {
        height: 100%;
        object-fit: cover;
    }

      #newsletter-popup label {
        color: var(--white);
    }

    #newsletter-popup input {
        margin-bottom: 10px;
    }

    #newsletter-popup h3 {
        color: var(--white);
        margin-bottom: 1em;
        font-family: var(--semibold-font);
    }

    @media screen and (max-width: 1366px){
        #newsletter-popup{
          width: 50%;
        }
      }
      
      @media screen and (max-width: 992px){
        #newsletter-popup{
          width: 70%;
        }
        .newsletter-in {
            padding: 20px 20px 30px;
        }
      }

      @media screen and (max-width: 600px){
        #newsletter-popup{
          width: 95%;
        }
        #newsletter-popup img.popup-img {
            height: 12em;
            object-position: 50% -90px;
        }
      }




      
  /* ///// PARALLAX ///// */
  
  .section-parallax {
      position: relative;
      width: 100%;
      height: 80vw;
      min-height: 40em;
      max-height: 80vh;
      height: clamp(40em, 80vw, 80vh);
      overflow: hidden;
  }
  
  .parallax-content {
      background-size: cover;
      position: relative;
      background-position: center;
      background-repeat: no-repeat;
      width: 100%;
      height: 120%;
  }
  
  #parallax p {
      position: absolute;
      color: #ffffff;
      font-size: 3vw;
      line-height: 1.2;
      top: 50%;
      transform: translate(0, -50%);
  }
  
  .videobg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url(../images/video-bg-neu.jpg);
      background-size: cover;
      background-position: center;
  }
  
  
  
  
  /* ///// ACCORDION ///// */
  
  #accordion {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  
  
  /* ///// NEWS ////// */
  
  #news {
      position: relative;
      display: block;
      float: right;
      width: 59%;
      padding: 5% 8% 20%;
  }
  
  #news-filter {
      position: relative;
      background: var(--white);
      width: 92%;
      float: left;
      padding: 2% 4% 2%;
  }
  
  .news-container, .moduletable.newsuebersicht {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  
  #news .newscontent:nth-child(1) {
      flex: 0 100%;
  }
  
  #news .newsflash {
      justify-content: flex-start;
  }
  
  #news .beitrag {
      position: relative;
      overflow: hidden;
  }
  
  #news h2.newsflash-title {
      width: calc(100% - 6em);
      margin-left: 1em;
      margin-bottom: 1em;
      float: left;
      padding-right: 5em;
      line-height: 1.2;
      hyphens: auto;
  }
  
  #news .introtext, #news .introtext-zeichenlimit {
      position: relative;
      display: block;
      width: calc(100% - 4em);
      margin-left: 2em;
      margin-right: 2em;
      float: left;
  }
  
  #news #beitrag p {
      display: inline;
  }
  
  .latestnews span {
      font-family: var(--bold-font);
      text-transform: uppercase;
      font-size: min(max(0.8rem, 0.9vw), 0.9rem);
      line-height: 1.2;
  }
  

  
  /* ///// KONTAKT ///// */
  
  #map {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin-top: 10%;
  }
  
  #kontaktformular {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      overflow: hidden;
  }
  

  .fox-container-module {
      margin-top: 2em;
  }
  
  
  div#fox-container-m293 .fox-form select, div#fox-container-m293 .fox-form textarea, div#fox-container-m293 .fox-form input[type="text"], div#fox-container-m293 .fox-form input[type="email"],
  div#fox-container-m294 .fox-form select, div#fox-container-m294 .fox-form textarea, div#fox-container-m294 .fox-form input[type="text"], div#fox-container-m294 .fox-form input[type="email"],
  div#fox-container-m210 .fox-form select, div#fox-container-m210 .fox-form textarea, div#fox-container-m210 .fox-form input[type="text"], div#fox-container-m210 .fox-form input[type="email"],
  div#fox-container-m296 .fox-form select, div#fox-container-m296 .fox-form textarea, div#fox-container-m296 .fox-form input[type="text"], .fox-form input[type="email"] {
      border-radius: 0px !important;
      color: var(--color1) !important;
      background-color: var(--midlight-gray) !important;
      padding: 20px !important;
      margin: 0px 0 15px !important;
      border: solid 0px var(--border-color) !important;
      width: 100% !important;
      font-size: min(max(1rem, 1.1vw), 1.1rem) !important;
  }
  
  div#fox-container-m293 .fox-item-dropdown .controls select,
  div#fox-container-m294 .fox-item-dropdown .controls select,
  div#fox-container-m210 .fox-item-dropdown .controls select,
 .fox-item-dropdown .controls select {
      border-radius: 0px;
      color: var(--color1);
      background-color: var(--white) !important;
      padding: 10px;
      margin: 0px 0 15px;
      border: solid 0px var(--border-color);
      width: 100%;
  }
  
  div#fox-container-m293 .chzn-container-single .chzn-single,
  div#fox-container-m294 .chzn-container-single .chzn-single,
  div#fox-container-m210 .chzn-container-single .chzn-single,
  .chzn-container-single .chzn-single {
      margin: 0px 0 15px;
  }
  
  div#fox-container-m293 .fox-form input[type="text"]:hover, div#fox-container-m293 .fox-form input[type="email"]:hover, div#fox-container-m293 .fox-form textarea:hover, div#fox-container-m293 .fox-form input[type="text"]:focus, div#fox-container-m293 .fox-form input[type="email"]:focus, div#fox-container-m293 .fox-form textarea:focus,
  div#fox-container-m294 .fox-form input[type="text"]:hover, div#fox-container-m294 .fox-form input[type="email"]:hover, div#fox-container-m294 .fox-form textarea:hover, div#fox-container-m294 .fox-form input[type="text"]:focus, div#fox-container-m294 .fox-form input[type="email"]:focus, div#fox-container-m294 .fox-form textarea:focus,
  div#fox-container-m210 .fox-form input[type="text"]:hover, div#fox-container-m210 .fox-form input[type="email"]:hover, div#fox-container-m210 .fox-form textarea:hover, div#fox-container-m210 .fox-form input[type="text"]:focus, div#fox-container-m210 .fox-form input[type="email"]:focus, div#fox-container-m210 .fox-form textarea:focus,
.fox-form input[type="text"]:hover, .fox-form input[type="email"]:hover, .fox-form textarea:hover, .fox-form input[type="text"]:focus, .fox-form input[type="email"]:focus, .fox-form textarea:focus {
      background-color: var(--white);
      color: var(--color1);;
  }
  
  div#fox-container-m293 .btn,
  div#fox-container-m294 .btn,
  div#fox-container-m210 .btn,
  button.btn.btn-primary.submit-button {
      position: relative !important;
      margin-bottom: 0 !important;
      text-align: left !important;
      vertical-align: middle !important;
      font-family: var(--bold-font) !important;
      text-transform: uppercase !important;
      cursor: pointer !important;
      text-shadow: none !important;
      background-color: transparent !important;
      background-image: none !important;
      background-repeat: no-repeat !important;
      background-size: 300% !important;
      background: rgb(70,105,170) !important;
      background: -moz-linear-gradient(left, rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%) !important;
      background: -webkit-linear-gradient(left, rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important;
      background: linear-gradient(to right, rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%) !important;
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 ) !important;
      border: solid 1px transparent !important;
      border-radius: 20px !important;
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0) !important;
      filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
      font-family: var(--bold-font) !important;
      color: var(--white) !important;
      background-color: transparent !important;
      padding: 4px 65px 5px 30px !important;
      margin: 5px 15px 5px 0 !important;
      transition: all ease .5s !important;
      display: table !important;
      font-size: min(max(0.75rem, 1vw), 1rem) !important;
      letter-spacing: 1px !important;
      line-height: 1 !important;
      float: left !important;
  }
  
  div#fox-container-m293 .btn:hover,
  div#fox-container-m294 .btn:hover,
  div#fox-container-m210 .btn:hover,
  .fox-container .btn:hover {
      color: var(--white);
      border: solid 1px var(--red);
      background: var(--red);
      text-decoration: none;
  }
  
  div#fox-container-m293 .fox-form-stacked .control-group,
  div#fox-container-m294 .fox-form-stacked .control-group,
  div#fox-container-m210 .fox-form-stacked .control-group,
 .fox-form-stacked .control-group {
      float: left;
      width: 100%;
  }
  
  div#fox-container-m293 .fox-form-stacked .control-label,
  div#fox-container-m294 .fox-form-stacked .control-label,
  div#fox-container-m210 .fox-form-stacked .control-label,
.fox-form-stacked .control-label {
      float: left;
      width: 100%;
      text-align: left;
      padding-right: 16px;
  }
  
  div#fox-container-m293 .controls, div#fox-container-m294 .controls, div#fox-container-m210 .controls, .fox-container .controls {
      width: 100%;
  }
  
  div#fox-container-m293 .control-group, div#fox-container-m294 .control-group, div#fox-container-m210 .control-group, .fox-container .control-group {
      margin-bottom: 0;
  }
  
  div#fox-container-m293 .btn:before, div#fox-container-m294 .btn:before, div#fox-container-m210 .btn:before, .fox-container .btn:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 16px;
      width: 18px;
      height: 18px;
      background-image: url(../images/icons/icon-login.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  
  div#fox-container-m293 .chzn-container-single .chzn-single, div#fox-container-m294 .chzn-container-single .chzn-single, div#fox-container-m210 .chzn-container-single .chzn-single, .chzn-container-single .chzn-single {
      background-image: var(--white);
      color: var(--color1);
      background-color: var(--white);
      width: 100%;
      padding: 0 5px;
      height: 26px;
      line-height: 26px;
  }
  
  .chzn-container-single .chzn-single {
      position: relative;
      display: block;
      overflow: hidden;
      padding: 0 0 0 8px;
      height: 25px;
      border: 0px solid var(--border-color);
      border-radius: 0px;
      background-color: var(--white);
      background: var(--white);
      background-clip: padding-box;
      box-shadow: none;
      color: var(--color1);
      text-decoration: none;
      white-space: nowrap;
      line-height: 24px;
  }
  
  div#fox-container-m293 .control-label, div#fox-container-m293 .control-label label, div#fox-container-m293 .fox-item-attachments .controls label,
  div#fox-container-m294 .control-label, div#fox-container-m294 .control-label label, div#fox-container-m294 .fox-item-attachments .controls label,
  div#fox-container-m210 .control-label, div#fox-container-m210 .control-label label, div#fox-container-m210 .fox-item-attachments .controls label,
  .fox-container .control-label, .fox-container .control-label label, .fox-item-attachments .controls label {
      display: inline-block;
      font-size: 1rem;
      color: var(--border-color) !important;
      font-size: min(max(1rem, 1.1vw), 1.1rem) !important;
      line-height: 1.5 !important;
      font-family: var(--common-font) !important;
      font-weight: normal !important;
      -moz-hyphens: auto !important;
      -o-hyphens: auto !important;
      -webkit-hyphens: auto !important;
      -ms-hyphens: auto !important;
      hyphens: auto !important;
  }
  
  /*
  div#fox-container-m293 .btn:hover:before, div#fox-container-m210 .btn:hover:before {
      background-image: url(../images/right-arrow-white.svg);
  }
  */
  
  #fox-container-m293 .btn:hover span, div#fox-container-m293 .btn span span,
  #fox-container-m294 .btn:hover span, div#fox-container-m294 .btn span span,
  #fox-container-m210 .btn:hover span, div#fox-container-m210 .btn span span,
  .fox-container .btn:hover span, .fox-container .btn span span {
      color: var(--white);
  }
  
  div#fox-container-m293 .btn:hover:before, div#fox-container-m294 .btn:hover:before, div#fox-container-m210 .btn:hover:before, .fox-container .btn:hover:before {
      background-color: var(--color1);
  }
  
  #fox-container-m293 .btn, div#fox-container-m293 .btn span,
  #fox-container-m294 .btn, div#fox-container-m294 .btn span,
  #fox-container-m210 .btn, div#fox-container-m210 .btn span,
  .fox-container .btn, .fox-container .btn span {
      color: var(--white) !important;
      text-transform: none;
      font-family: var(--bold-font);
      font-size: min(max(0.75rem, 1vw), 1rem);
      transition: all ease 0.5s;
  }
  
  div#fox-container-m293 .required:after, div#fox-container-m293 .asterisk:after,
  div#fox-container-m294 .required:after, div#fox-container-m294 .asterisk:after,
  div#fox-container-m210 .required:after, div#fox-container-m210 .asterisk:after,
  .fox-container .required:after, .fox-container .asterisk:after {
      content: "*";
      color: var(--red);
      font-weight: 200;
  }

.fox-form-inline div.fox-item-newsletter div.controls span:not(.required), .fox-form-inline div.fox-item-radio div.controls span:not(.required), .fox-form-inline div.fox-item-checkbox-group div.controls span:not(.required), div.fox-item-radio div.controls label, div.fox-item-checkbox-group div.controls label {
    display: inline-block;
    min-height: 20px;
    margin: 0;
    font-size: min(max(1rem, 1.1vw), 1.1rem) !important;
    line-height: 1.5 !important;
    min-width: 300px;
}
  
  label {
      letter-spacing: 0em;
  }
  
  img.fox-item-captcha-img-reload.fox-popover {
      width: auto;
  }
  
  img#fox-m293-captcha, img#fox-m210-captcha, img#fox-m296-captcha {
      width: auto;
  }

  div#fox-m296-captcha-box {
    margin: 3em 0;
}
  
  
  
  /* ///// FOOTER ///// */
  
  #footer, #footer-home {
      position: relative;
      display: block;
      float: left;
      width: 80%;
      padding: 15vw 10% 15vw 10%;
      padding: clamp(10em, 15vw, 18em) 10% clamp(10em, 15vw, 15em) 10%;
      background-image: url(../images/mountains.svg);
      background-size: cover;
      background-position: center top;
      background-repeat: no-repeat;
  }
  
  #footer-home {
      background-color: var(--white);
  }
  
  #footer-1, #footer-1-home {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  #footer p, #footer a, #footer li, #footer h4, #footer b, #footer-home p, #footer-home a, #footer-home li, #footer-home h4, #footer-home b {
      color: var(--white);
      font-size: 0.9rem;
  }
  
  #footer h4, #footer-home h4 {
      margin: 8px 0;
      line-height: 1.5;
  }
  
  #footer a.underline, #footer-home a.underline {
      text-decoration: underline;
  }
  
  #footer .moduletable, #footer-home .moduletable {
      float: left;
      width: 100%;
  }
  
  .social-icons {
      display: flex;
      flex-wrap: nowrap;
  }
  
  .social-icons img {
      height: 20px;
      width: auto;
      margin: 0 24px 0 0;
  }
  
  a.footer-logo {
      float: left;
      width: 8vw;
      min-width: 3em;
      max-width: 7em;
      width: clamp(3em, 8vw, 7em);
      height: auto;
  }
  
  img.newsletter-dummy {
      width: clamp(15em, 20vw, 20em);
  }
  
  
  
  
  /* ///// COPYRIGHT ///// */
  
  
  #copyright {
      position: relative;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      text-align: center;
      float: left;
      width: 100%;
      padding: 5em 0 0;
  }
  
  #copyright a {
      color: var(--white);
      text-decoration: none;
      margin: 0 20px 0 0;
      display: inline-block;
  }
  
  #copyright .copyright-1 a {
      margin: 0;
  }
  
  #copyright p, #copyright a {
      color: var(--white);
      font-size: min(max(0.55rem, 0.8vw), 0.8rem);;
      text-align: left;
  }
  
  #copyright ul.nav.menu.mod-list {
      visibility: visible !important;
      transform: none !important;
      opacity: 1 !important;
  }
  
  #copyright ul.menu li {
      width: auto;
  }
  
  .copyright-1 {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  .copyright-2 {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin: 0;
      text-align: left;
  }
  
  
  
  
  
  /* ///// SCROLL TO TOP BUTTON ///// */
  
  .scrolltotop {
      position: fixed;
      background-image: url(../images/scrolltotop.svg);
      background-size: contain;
      background-repeat: no-repeat;
      bottom: clamp(2em, 4vw, 4em);
      left: 0;
      right: clamp(1em, 2vw, 2em);
      margin-left: auto;
      z-index: 9;
      width: clamp(25px, 8vw, 40px);
      height: clamp(25px, 8vw, 40px);
      cursor: pointer;
      -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
      -moz-transition: -moz-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
      transition: transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
  }
  
  .scrolltotop.light {
      background-image: url(../images/scrolltotop.svg);
  }
  
  .scrolltotop.dark {
      background-image: url(../images/scrolltotop-white.svg);
  }
  
  .scrolltotop.hidden {
      -webkit-transform: translateX(200%);
      -moz-transform: translateX(200%);
      -ms-transform: translateX(200%);
      -o-transform: translateX(200%);
      transform: translateX(200%);
  }
  
  
  /* ///// STAFF GIOVANILE ///// */
  
  .staff .newsflash {
      position: relative;
      float: left;
      width: 100%;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
  }

  .article-leading.staff .moduletable {
    float: left;
    width: 100%;
    margin: 0 0 5%;
}
  
  .staff h3 {
    margin: 0 0 1em 2%;
  }
  
  /*
  .staff .beitrag {
        flex: 0 calc(25% - 1rem);
        margin-bottom: 2em;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }
    */


    .moduletable.immagine-squadra-giovanile {
        position: relative;
        background: var(--white);
        width: 78%;
        float: left;
        padding: 2% 12% 0%;
    }
  
  
  /* ///// JOOMLA NEWSFLASH ///// */
  
  
  .introtext-zeichenlimit {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin: 8px 0;
      font-size: 1rem;
      line-height: 1.5;
  }
  
  .intro-bg {
      width: 100%;
      height: 20vw;
      background-position: center center;
      background-size: cover;
  }
  
  .bgimage {
      position: relative;
      width: 100%;
      height: 26vw;
      min-height: 13em;
      max-height: 23em;
      height: clamp(13em, 26vw, 23em);
      background-position: center center;
      background-size: cover;
  }
  
  .overview .bgimage {
      height: 15vw;
      min-height: 10em;
      max-height: 15em;
      height: clamp(10em, 15vw, 15em);
  }
  
  .image {
      width: 100%;
      float: left;
  }
  
  .image img {
      width: 100%;
  }
  
  .newsbild {
      width: 100%;
      height: 15em;
      background-size: cover;
      background-position: center;
  }
  
  figure.newsflash-image img {
      width: 100%;
  }
  
  
  /* ///// JOOMLA BLOG ///// */
  
  .blog {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
  }
  
  .cat-children {
      display: none;
  }
  
  .blog #containerM, .blog #containerL, .newsflash.newsuebersicht {
      display: flex;
      flex-wrap: wrap;
  }
  
  .blog #containerM h3 {
      width: 98%;
      margin-left: 2%;
  }
  
  .blog h2 {
      font-family: var(--light-font);
      color: var(--border-color);
      font-size: min(max(1.2rem, 1.8vw), 1.8rem);
      font-weight: normal;
      text-transform: uppercase;
      letter-spacing: 2px;
      line-height: 1.1;
      margin-bottom: clamp(1em, 2vw, 2em);
  }
  
  .page-header {
      display: block;
      float: left;
      width: 100%;
  }
  
  .item.column-1:hover .bild, .newscontent:hover .bild {
      transform: scale(1.1);
  }
  
  .item.column-1:hover .bild-overlay, .newscontent:hover .bild-overlay {
      opacity: 0;
  }
  
  .intro-bg {
      width: 100%;
      height: 20vw;
      background-position: center center;
      background-size: cover;
      margin: 1em 0;
  }
  
  .items-leading.clearfix, .article-leading {
      position: relative;
      background: var(--white);
      width: 80%;
      float: left;
      padding: 2em 10%;
      padding: clamp(2em, 4vw, 4em) 10%;
  }

  .article-leading.compact {
    padding-top: clamp(1rem, 2vw, 2rem);
    padding-bottom: clamp(1rem, 2vw, 2rem);
    }
  
  .items-leading h2 {
      display: none;
  }
  
  .items-leading dd.create {
      display: none;
  }
  
  
  #team-filter {
      position: relative;
      background: var(--white);
      width: 78%;
      float: left;
      padding: 2% 12%;
  }
  
  .overview {
      position: relative;
      display: block;
      float: left;
      width: 90%;
      padding: 5%;
      background: var(--white);
      border-radius: 10px;
  }
  
  .article-leading-buttons {
      position: relative;
      background: var(--white);
      width: 80%;
      float: left;
      padding: 4% 10%;
  }
  
  .row-fluid {
      width: 100%;
  }
  
  .items-row {
      display: flex;
      flex: 0 100%;
      flex-wrap: wrap;
      margin: 0 0 1em;
  }
  
  .items-row .span12 {
      width: 100%;
  }
  
  .col-6 .items-row {
    display: flex;
    flex: 0 14%;
    flex-wrap: wrap;
    margin: 2%;
  }
  
  .col-4 .items-row {
    display: block;
    display: flex;
    width: 21%;
    flex: 0 21%;
    flex-wrap: wrap;
    margin: 2%;
  }
  
  .staff .beitrag {
    display: block;
    display: flex;
    width: 21%;
    flex: 0 21%;
    flex-wrap: wrap;
    margin: 2%;
  }
  
  .col-3 .items-row {
    display: flex;
    flex: 0 27%;
    flex-wrap: wrap;
    margin: 2%;
  }
  
  .col-2 .items-row {
    display: flex;
    flex: 0 46%;
    flex-wrap: wrap;
    margin: 2%;
  }
  
  .news-container .col-2 .items-row, .newsflash.newsuebersicht .overview {
      display: block;
      width: 46%;
      margin: 2%;
    }

    .newsflash.newsuebersicht .overview {
        flex: 0 42%;
        flex-wrap: wrap;
        padding: 2%;
    }
  
  .multiple-category-area {
      position: relative;
      display: flex;
      flex-wrap: wrap;
      float: left;
      margin: 2em 0;
  }
  
  .multiple-section {
      position: relative;
      display: flex;
      flex-wrap: wrap;
      width: 100%;
      float: left;
      margin: 0em 0;
  }
  
  
  @media screen and (max-width: 1600px) {
  .col-6 .items-row {
    flex: 0 30%;
  }
  }
  
  
  @media screen and (max-width: 1400px) {
  .col-5 #beitrag {
      display: flex;
      flex: 0 29%;
  }
  }
  
  
  @media screen and (max-width: 1200px) {
  .col-6 .items-row, .col-4 .items-row, .col-3 .items-row, .staff .beitrag {
    flex: 0 46%;
  }
  }
  
  @media screen and (max-width: 600px) {
  .col-6 .items-row, .col-4 .items-row, .col-3 .items-row, .col-2 .items-row, .staff .beitrag {
      width: 100%;
      flex: 0 100%;
      margin: 2% 0;
  }
  .news-container .col-2 .items-row {
      width: 100%;
      margin: 2% 0;
  }
  }
  
  .column-1, .column-2, .column-3 {
      padding: 0;
  }
  
  .blog img {
      width: 100%;
  }
  
  
  
  /* ///// JOOMLA BLOG AKTUELL ///// */
  
  
  #aktuell {
      position: relative;
      display: block;
      width: 60%;
      float: left;
      left: 120px;
      margin-top: 2%;
  }
  
  #aktuell p, .blog.aktuelles p {
      white-space: normal;
      text-align: left;
  }
  
  #aktuell h3 {
      margin-left: 2%;
  }
  
  .datum, dd.create {
      font-size: 13px;
      font-weight: bold;
      margin-bottom: 10px;
  }
  
  .aktuell-links {
      position: relative;
      display: block;
      float: left;
      margin: 3% 2%;
      width: 100%;
  }
  
  .blog.aktuelles .items-row {
      margin: 4% 6%;
      flex: 0 43%;
      border-bottom: solid 1px #d9d9d9;
      padding: 0% 0 4%;
  }
  
  .blog.aktuelles .items-row:nth-child(2n+1) {
      margin: 4% 2% 4% 0;
  }
  
  .blog.aktuelles .items-row:nth-child(-n+3) {
      margin-top: 2%;
  }
  
  
  
  /* ///// JOOMLA ARTIKEL ///// */
  
  .item-page {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin: 0;
  }
  
  /*
  .item-page.news {
      width: 90%;
      padding: clamp(2.4em, 5vw, 5em) 6% 0 4%;
  }*/
  
  .item-page.news {
      width: 100%;
      padding: 0;
  }
  
  .item-page.news .news-headline {
      position: relative;
      max-width: 730px;
      display: block;
      width: 100%;
      margin: clamp(1em, 3vw, 3em) 0 clamp(0.5em, 1vw, 1em);
      float: left;
      left: 50%;
      transform: translate(-50%, 0);
  }
  
  .item-page.news.playernews #heads, .item-page.news.playernews #newsslider-edge {
      display: none;
  }
  
  .articleBody {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin-bottom: 0;
  }
  
  .item-image img {
     width: 100%;
  }
  
  .item-page ul {
      margin-left: 18px;
  }
  
  .bild {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      height: 26vw;
      min-height: 15em;
      max-height: 23em;
      height: clamp(15em, 26vw, 23em);
      background-size: cover;
      background-position: center center;
      margin: 0;
      transition: all ease 0.5s;
  }

  .bild.junioren {
    height: clamp(30em, 40vw, 40em);
    max-height: fit-content;
}
  
  .bild-frame {
      position: relative;
      width: 100%;
      height: clamp(13em, 26vw, 23em);
      overflow: hidden;
      cursor: pointer;
  }

  .bild-frame.junioren {
        position: relative;
        width: 100%;
        height: clamp(30em, 40vw, 40em);
        overflow: hidden;
        cursor: pointer;
        margin-bottom: 2rem;
    }
  
  .bild-frame .bild {
      height: 100%;
  }
  
  .bild-frame:hover .bild {
      transform: scale(1.05);
  }
  
  a.bild-link {
      cursor: pointer;
  }
  
  .bild-overlay {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 1;
      z-index: 2;
      background: rgba(0,0,0,0.2);
      transition: all ease 0.5s;
  }
  
  .bild-frame:hover .bild-overlay {
      background: rgba(0,0,0,0.0);
  }
  
  .srcbild img {
      height: 100%;
      width: 100%;
  }
  
  .srcbild.sponsor {
      max-width: 200px;
  }
  
  div.fancybox {
      position: absolute;
      z-index: 10;
      width: 2em;
      height: 2em;
      right: 2em;
      bottom: 2em;
      background-image: url(../images/plus.svg);
      background-size: contain;
      background-repeat: no-repeat;
      left: auto;
      cursor: pointer;
      transition: all ease 0.5s;
  }
  
  a.fancybox:hover {
      transform: scale(1.1);
  }
  
  button.fancybox-button.fancybox-close-small, button.fancybox-button.fancybox-button--close {
      transform: none;
  }
  
  button.fancybox-button.fancybox-close-small:before, button.fancybox-button.fancybox-button--close:before {
      display: none;
  }
  
  
  
  
  p.counter.pull-right {
      display: none;
  }
  
  .news-container .pagination {
      position: relative;
      display: block;
      float: left;
      margin-top: 50px;
      margin-left: 8%;
  }
  
  .pagination li {
      list-style: none;
      float: left;
      position: relative;
      white-space: nowrap;
      /*background-color: var(--color2);*/ 
      margin-top: clamp(3px, 1vw, 7px); 
      margin-bottom: clamp(3px, 1vw, 7px);
      margin-left: 0;
      margin-right: clamp(2px, 2vw, 20px);
      display: table;
      text-transform: uppercase;
      font-size: min(max(0.65rem, 1vw), 1rem);
      letter-spacing: 1px;
      line-height: 1;
  }
  
  .pagination li a, .pagination li span {
      float: left;
      font-family: var(--bold-font);
      color: var(--dark-gray);
      padding: 7px 20px 7px 20px;
      border-radius: 20px;
      background-size: 300%;
      background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      transition: all ease .5s;
  }
  
  .pagination li a {
      border: solid 1px var(--border-color);
      color: var(--border-color);
  }
  
  .pagination li span {
      border: solid 1px var(--dark-gray);
  }
  
  .pagination li a:hover {
      color: var(--white);
      border: solid 1px var(--active-blue);
      text-decoration: none;
      background-position: 100%;
  }
  
  .pagination li:hover a {
      color: var(--white);
  }
  
  .pagination a {
      transition: all ease .5s;
  }
  
  .pagination a:hover {
      color: #fff;
  }
  
  .galerie {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      margin: 5% 0;
  }
  
  
  /* ////////// 360 GRAD PANORAMA //////////*/
  
  .roundshot {
      position: relative;
      float: left;
      width: 80%;
      margin: 0 10%;
      margin-bottom: 5%;
  }
  
  .roundshot-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 2;
      background: rgba(26, 37, 55, 0.7)
  }
  
  .roundshot-icon {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
      width: 2.5vw;
      height: 2.5vw;
      min-width: 30px;
      min-height: 30px;
      background-image: url(../images/icons/icon-roundshot.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
  }
  
  .roundshot-button {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
      color: var(--white);
      margin-top: 75px;
      border: 2px solid var(--white);
      text-align: center;
      text-transform: uppercase;
      padding: 5px 15px;
      cursor: pointer;
  }
  
  button.a-enter-vr-button {
      display: none;
  }
  
  .newsflash.abbonamenti {
      position: relative;
      float: left;
      width: 100%;
      margin-bottom: 10%;
  }
  
  .beitrag.abos {
      position: relative;
      float: left;
      width: 80%;
      margin: 0 10%;
  }
  
  .abos section {
      position: relative;
      float: left;
      width: 100%;
      margin-bottom: 2em;
  }
  
  table.abo {
      max-width: 600px;
  }
  
  table.abo.kategorien {
      max-width: 600px;
  }

  table.abo td {
    width: 50%;
}
  
  /* ////////// YAWAVE ////////// */
  
  table.nl-container {
      padding: calc(1em - 10px);
      display: inline-table;
      background-color: transparent !important;
  }
  
  table.nl-container .col.num12 {
      width: 100% !important;
      overflow: hidden;
  }
  
  .nl-container table {
      padding: 10px;
      display: block;
      float: left;
  }

  .bee-page-container {
    position: relative;
    display: block;
    width: 100% !important;
    overflow: hidden;
    max-width: 730px;
    margin: 0 auto;
    }

    .bee-row {
        padding: 0 10px;
    }

    .bee-social img {
        width: 25px;
    }

    .bee-heading {
        margin: 20px 0;
    }

    .bee-heading h1 {
        text-align: left !important;
    }

    .bee-page-container p {
        margin: 0;
    }

    .bee-social {
        position: relative;
        float: left;
        width: 100%;
        margin-top: 2rem;
        display: flex;
        justify-content: center;
    }

    .bee-button {
        float: left;
        clear: both;
        margin-top: 1rem;
    }
  

    .bee-block li {
        color: var(--border-color) !important;
        margin: 8px 0;
    }
  
  /*** YAWAVE VIDEO INNERHALB ARTIKEL ****/
  .item-page.news table {
      display: table;
  }
  
  
  .item-page.news .play-button_outer {
      position: absolute;
      top: 50%;
      right: 50%;
      transform: translate(50%,-50%);
  }
  
  
  /** END **/
  
  
  
  table.nl-container h1, table.nl-container h2, table.nl-container h3, table.nl-container h4, .bee-heading h1, .bee-heading h2, .bee-heading h3 {
      color: var(--border-color) !important;
      font-family: var(--common-font) !important;
      -moz-hyphens: auto !important;
      -o-hyphens: auto !important;
      -webkit-hyphens: auto !important;
      -ms-hyphens: auto !important;
      hyphens: auto !important;
      text-align: left !important;
      padding-left: 0px;
  }
  
  table.nl-container p, table.nl-container li, table.nl-container li span, .txtTinyMce-wrapper span, .bee-text-content p, .bee-text-content li span, .bee-text-content span {
      color: var(--border-color) !important;
      font-size: min(max(1rem, 1.1vw), 1.1rem) !important;
      line-height: 1.5 !important;
      font-family: var(--common-font) !important;
      font-weight: normal !important;
      -moz-hyphens: auto !important;
      -o-hyphens: auto !important;
      -webkit-hyphens: auto !important;
      -ms-hyphens: auto !important;
      hyphens: auto !important;
  }
  
  table.nl-container b, table.nl-container strong {
      -moz-hyphens: auto !important;
      -o-hyphens: auto !important;
      -webkit-hyphens: auto !important;
      -ms-hyphens: auto !important;
      hyphens: auto !important;
  }
  
  .img-container.center.autowidth {
      margin: 0 10px 2rem;
  }
  
  table.social_table img {
      width: 25px;
  }
  
  table.social_table {
      padding: 0 !important;
  }
  
  
  /*table.nl-container .col.num12, table.nl-container .block-grid {
      width: 100% !important;
      max-width: none !important;
  }*/
  
  
  
  
  
  /* GALERIE FIELD */
  
  .showtime.showtime-default {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  .showtime-default .showtime-image img {
      outline: solid 0px transparent;
      border: 0px solid #fff;
      -webkit-box-shadow: rgba(0, 0, 0, .13) 0 0px 14px, rgba(0, 0, 0, .12) 0 0 0 0px;
      box-shadow: rgba(0, 0, 0, .13) 0 0px 14px, rgba(0, 0, 0, .12) 0 0 0 0px;
  }
  
  .showtime-default .showtime-image a {
      width: 100%;
      -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
      line-height: 1;
      white-space: normal;
  }
  
  .showtime-default .showtime-gallery {
      width: 102%;
      margin-left: -1%;
  }
  
  
  
  
  /* DOWNLOADS */
  
  
  /* DOWNLOADS */
  
  .download-section {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  .download-section p {
      margin: 2px 0;
  }
  
  .download-section .grid.cols-3 {
      grid-template-columns: 100px 1fr clamp(140px, 20vw, 200px);
      border-bottom: solid 1px var(--dark-gray);
  }
  
  .download-section .grid.cols-2 {
      grid-template-columns: 1fr clamp(140px, 20vw, 200px);
      column-gap: 1em;
      border-bottom: solid 1px var(--dark-gray);
      margin-top: 0;
      width: 100%;
  }
  
  .article-leading .download-section {
      margin-top: 2em;
  }
  
  
  @media only screen and (max-width: 600px) {
  
      .download-section .grid.cols-s-1 {
          grid-template-columns: 1fr;
          border-bottom: solid 0px var(--dark-gray);
      }
  
      .download-section .row-gap-s-1 {
          row-gap: 0;
      }
  }
  
  
  .onlineschalter-titel {
      display: flex;
      align-items: center;
      width: calc(100% - 70px);
      padding: 10px 50px 10px 20px;
      float: left;
      font-size: 1rem;
      line-height: 1.5;
      color: #323e47;
  }
  
  .download-icon {
      position: relative;
      width: 80px;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      float: right;
      background: #afa456;
      height: 100%;
      color: #fff;
      text-align: center;
      font-size: 0.6rem;
      line-height: 2.5;
      transition: all ease 0.5s;
  }
  
  a.pdf .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 23px;
      height: 26px;
      background-image: url(../images/downloads/download-pdf.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.ipdf .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 23px;
      height: 26px;
      background-image: url(../images/downloads/download-ipdf.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.link .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 22px;
      height: 19px;
      background-image: url(../images/downloads/download-link.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.internlink .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 22px;
      height: 19px;
      background-image: url(../images/downloads/download-internlink.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.word .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 23px;
      height: 26px;
      background-image: url(../images/downloads/download-word.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.excel .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 23px;
      height: 26px;
      background-image: url(../images/downloads/download-excel.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.download .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 16px;
      height: 22px;
      background-image: url(../images/downloads/download-download.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  a.formular .download-icon:before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      width: 20px;
      height: 27px;
      background-image: url(../images/downloads/download-form.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease 0.5s;
  }
  
  
  
  /* END UBIQ */
  
  
  
  /* ----------   LAYOUT   ---------------- */
  
  html {
      height: 100%;
  }
  
  body {
      height: 100%;
      overflow-x: hidden;
  }
  
  body.rollout {
      overflow-y: hidden;
  }
  
  #mainWrapper {
      display: inline;
      float: left;
      width: 100%;
      height: 100%;
  }
  
  /* ///// HEADER ///// */
  
  #headnav {
    position: absolute;
    z-index: 1006;
    right: 4.5em;
    top: 5em;
    }
  
    #header-fadein {
        position: fixed;
        right: 0px;
        top: 50px;
        left: 0px;
        z-index: 13;
        background: var(--border-color);
        -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
        -moz-transition: -moz-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
        transition: transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
        border-top: 1px solid var(--border-color2);
    }
    
  #header-fadein.hidden {
      -webkit-transform: translateY(calc(-100% - 50px));
      -moz-transform: translateY(calc(-100% - 50px));
      -ms-transform: translateY(calc(-100% - 50px));
      -o-transform: translateY(calc(-100% - 50px));
      transform: translateY(calc(-100% - 50px));
    }
  
  #header-fadein #headnav {
      top: 50%;
      transform: translate(0, -50%);
  }
  
  #header-fadein .logo {
      position: relative;
      left: 5%;
      width: 6vw;
      max-width: 4em;
      min-width: 2.9em;
      width: clamp(2.9em, 6vw, 4em);
      float: left;
      transition: all ease 0.5s;
      top: 50%;
      margin: 7px 0;
      margin-top: clamp(7px, 1vw, 10px);
      margin-bottom: clamp(7px, 1vw, 10px);
  }
  
  #fastlinks {
      position: relative;
      display: block;
      float: left;
      margin: 0 4em 0 1em;
  }

  #fastlinks p {
    margin: 0;
}
  
  #fastlinks ul.menu li {
      float: left;
  }
  
  #fastlinks ul.menu a {
      display: table;
      font-family: var(--bold-font);
      color: var(--white);
      text-transform: uppercase;
      border: solid 1px var(--white);
      padding: 5px 50px 5px 20px;
      border-radius: 50px;
      margin: 0 15px;
      transition: all ease .5s;
      background-size: 300%;
      background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
  }
  
  #fastlinks ul.menu a:hover {
      background-color: transparent;
      border: solid 1px transparent;
      background-position: 100%;
      transform: scale(1.05);
  }
  
  #fastlinks ul.menu a.button-red, #fastlinks ul.menu a.button-tickets-red {
      border-color: var(--red);
      background-color: var(--red);
      background-size: 300%;
      border: solid 0px transparent;
      /*background-image: linear-gradient(270deg, rgba(182,42,52,1) 0%, rgba(138,31,39,1) 100%);*/
  }
  
  #fastlinks ul.menu a.button-red:hover, #fastlinks ul.menu a.button-tickets-red:hover {
      background-color: transparent;
      border: solid 0px transparent;
      background-position: 100%;
      transform: scale(1.05);
  }
  
  
  
  #fastlinks a.button-shop:before {
      content: "";
      position: absolute;
      top: 50%;
      right: 16px;
      transform: translate(0, -50%);
      width: 16px;
      height: 16px;
      background-image: url(../images/icons/icon-shop.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }
  
  #fastlinks a.button-spenglercup:before {
      content: "";
      position: absolute;
      top: 50%;
      right: 16px;
      transform: translate(0, -50%);
      width: 16px;
      height: 16px;
      background-image: url(../images/icons/icon-spenglercup.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }

  a.button-spenglercup {
    background: #53aabd;
    border: solid 1px #53aabd !important;
}
  
  #fastlinks a.button-tickets:before, #fastlinks a.button-tickets-red:before {
      content: "";
      position: absolute;
      top: 50%;
      right: 10px;
      transform: translate(0, -50%);
      width: 18px;
      height: 15px;
      background-image: url(../images/icons/icon-ticket.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }
  
  #fastlinks a.button-red:before {
      content: "";
      position: absolute;
      top: 50%;
      right: 16px;
      transform: translate(0, -50%);
      width: 20px;
      height: 20px;
      background-image: url(../images/icons/icon-fanzone.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }

  #fastlinks .moduletable {
    float: left;
    }

    #fastlinks a.button-filled, #fastlinks .button-filled {
        margin: 0 15px;
    }
  
  #language-switcher {
      position: relative;
      float: left;
  }
  
  #language-switcher a {
      color: var(--white);
      font-size: 1rem;
  }
  
  #language-switcher li a {
      font-family: var(--light-font);
  }
  
  #language-switcher li.lang-active a {
      font-family: var(--bold-font);
  }
  
  #language-switcher div.mod-languages ul.lang-inline li {
      position: relative;
      list-style: none;
  }
  
  #language-switcher div.mod-languages ul.lang-inline li:first-child:after {
      content: "/";
      color: var(--white);
      margin-left: 9px;
  }
  
  
  #header #container {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  
  .wideWrap {
      display: inline;
      float: left;
      width: 100%;
  }
  
  #breadcrumb {
      background: none repeat scroll 0 0 transparent;
      display: inline;
      float: left;
      width: 100%;
  }
  
  ul.breadcrumb {
      list-style: none;
      margin-left: 0;
      width: 100%;
      min-width: max-content;
      float: left;
  }
  
  .breadcrumb li {
      position: relative;
      float: left;
      margin: 0;
      padding: 2px 20px;
      line-height: 1;
  }
  
  #breadcrumb .moduletable::-webkit-scrollbar-track {
      border-radius: 0;
      height: 3px;
      background-color: #F5F5F5;
  }
  
  #breadcrumb .moduletable::-webkit-scrollbar {
      width: 3px;
      height: 3px;
      background-color: #414d57;
  }
  
  #breadcrumb .moduletable::-webkit-scrollbar-thumb {
      border-radius: 0px;
      background-color: #414d57;
  }
  
  #left-col {
      float: left;
  }
  
  
  #left-col ul.latestnews.mod-list {
      margin-left: 0;
  }
  
  ul.latestnews.mod-list li {
      list-style: none;
      border-bottom: solid 1px #d9d9d9;
      padding: 20px 0;
      line-height: 1.2;
  }
  
  
  #left-col-cont .moduletable {
      padding-bottom: 30px;
      margin-bottom: 20px;
  }
  
  #main-col {
      background: none repeat scroll 0 0 transparent;
      float: right;
  }
  
  #main-col-cont {
      background: none repeat scroll 0 0 transparent;
      padding: 0;
  }
  
  #right-col {
      float: right;
      width: 25%;
  }
  
  #right-col-cont .moduletable {
      padding-bottom: 30px;
      margin-bottom: 20px;
  }
  
  #content-top {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  #content-bottom {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      background: var(--white);
  }
  
  #debugRow { 
      display: inline;
      float: left;
  }
  
  .row-fluid {
      width: 100%;
      *zoom: 1;
  }
  .row-fluid:before,
  .row-fluid:after {
      display: table;
      content: "";
      line-height: 0;
  }
  .row-fluid:after {
      clear: both;
  }
  
  
  /* END LAYOUT */	
      
  
  /* ----------   TYPOGRAPHY  ---------------- */
  
  body {
      color: var(--border-color);
      font-size: 1rem;
      font-size: min(max(1rem, 1.1vw), 1.1rem);
      line-height: 1.5;
      font-family: var(--common-font);
      font-weight: normal;
      -moz-hyphens: auto;
      -o-hyphens: auto;
      -webkit-hyphens: auto;
      -ms-hyphens: auto;
      hyphens: auto;
  }
  
  p, span.field-value, span.field-label {
      margin: 8px 0;
      font-size: 1rem;
      font-size: min(max(1rem, 1.1vw), 1.1rem);
      line-height: 1.5;
      white-space: pre-wrap;
      -moz-hyphens: auto;
      -o-hyphens: auto;
      -webkit-hyphens: auto;
      -ms-hyphens: auto;
      hyphens: auto;
      -webkit-text-size-adjust: 100%; /* Für Text, damit er auf mobilen Geräten nicht grösser erscheint */
  }
  
  p.p1 {
      white-space: normal;
  }
  
  
  strong, b {
      font-family: var(--bold-font);
      font-weight: normal;
  }
  
  a {
      color: var(--black);
      font-family: var(--bold-font);
      text-decoration: none;
      cursor: pointer;
      transition: all ease .5s;
  }
  
  a:hover {
      text-decoration: none;
      color: var(--color2);
  }
  
  a[href^="tel"] {
    color: inherit; /* Inherit text color of parent element. */
    text-decoration: none; /* Remove underline. */
    /* Additional css `propery: value;` pairs here */
  }

  .item-page a {
    color: var(--active-blue);
  }
  
  
  
  /* ////// BUTTONS ////// */
  
  
  /* BUTTON STANDARD */
  
  .button, a.button, p.button, a.readmore, button.goback, a.button-filled, .button-filled, input.send {
      position: relative;
      border: solid 1px var(--border-color);
      font-family: var(--semibold-font);
      color: var(--color1);
      white-space: nowrap;
      /*background-color: var(--color2);*/ 
      padding: 7px 45px 7px 20px;
      margin: 2px;
      margin-top: clamp(3px, 1vw, 7px); 
      margin-bottom: clamp(3px, 1vw, 7px);
      margin-left: 0;
      margin-right: clamp(2px, 2vw, 20px);
      border-radius: 20px;
      transition: all ease .5s;
      display: table;
      text-transform: uppercase;
      font-size: 0.75rem;
      font-size: min(max(0.6rem, 0.9vw), 0.9rem);
      letter-spacing: 0.5px;
      line-height: 1;
      float: left;
      background-size: 300%;
      background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      cursor: pointer;
      overflow: hidden;
  }
  .button:before, a.button:before, p.button:before, a.readmore:before, button.goback:before, input.send:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 15px;
      width: 20px;
      height: 11px;
      background-image: url(../images/right-arrow.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  .button:hover, a.button:hover, a.readmore:hover, button.goback:hover {
      color: var(--white);
      border: solid 1px var(--active-blue);
      text-decoration: none;
      background-position: 100%;
      transform: scale(1.05);
  }
  button:hover:before, .button:hover:before, a.button:hover:before, a.readmore:hover:before, button.goback:hover:before {
      background-image: url(../images/right-arrow-white.svg);
  }
  
  
  /* BLAUER BUTTON */
  
  a.button-filled, .button-filled {
      color: var(--white);
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4669aa+0,283755+100;HCAP+Blue */
      background: rgb(70,105,170); /* Old browsers */
      background: -moz-linear-gradient(left,  rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%); /* FF3.6-15 */
      background: -webkit-linear-gradient(left,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to right,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 ); /* IE6-9 */
      border: solid 0px var(--active-blue);
      transition: all ease .5s;
      padding: 8px 45px 8px 20px;
      border: solid 0px transparent;
  }
  
  a.button-filled:hover, .button-filled:hover {
      transform: scale(1.05);
  }
  
  
  
  /* WEISSER BUTTON */
  
  .button.white, a.button.white, p.button.white {
      border: solid 1px var(--white);
      color: var(--black);
      background-color: var(--white);
  }
  button.white:before, a.button.white:before, p.button.white:before, a.readmore.white:before, button.white.goback:before {
      background-image: url(../images/right-arrow-black.svg);
  }
  button.white:hover, a.button.white:hover {
      background-color: var(--black);
      color: var(--white);
      border: solid 1px var(--black);
  }
  button.white:hover:before, a.button.white:hover:before, a.readmore.white:hover:before, button.white.goback:hover:before {
      background-image: url(../images/right-arrow.svg);
  }
  
  
  /* TRANSPARENTER BUTTON MIT WEISSEM RAHMEN */
  
  
  .button.whiteline, a.button.whiteline {
      border: 1px solid var(--white);
      color: var(--white);
      background-color: transparent;
      cursor: pointer;
  }
  
  input.send {
      border: 1px solid var(--white);
      color: var(--white);
      background-color: transparent;
      padding: 7px 20px 7px 20px;
      background-size: 300%;
      background-image: linear-gradient(
  120deg
  , transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
  }
  
  .button.whiteline:before, a.button.whiteline:before, p.button.whiteline:before, a.readmore.whiteline:before, button.whiteline.goback:before, input.send:before {
      background-image: url(../images/right-arrow-white.svg);
  }
  .button.whiteline:hover, a.button.whiteline:hover {
      background-color: transparent;
      color: var(--white);
      border: solid 1px var(--active-blue);
  }
  .button.whiteline:hover:before, a.button.whiteline:hover:before, a.readmore.whiteline:hover:before, button.whiteline.goback:hover:before, input.send:hover:before {
      background-image: url(../images/right-arrow-white.svg);
  }
  
  input.send:hover {
      border: solid 1px var(--border-color);
      background-position: 100%;
      transform: scale(1.05);
  }
  
  
  /* EXTERNER BUTTON */
  
  button.extern, a.button.extern {
      border: solid 1px var(--border-color);
      color: var(--black);
      transition: all ease .5s;
      background-size: 300%;
      background-image: linear-gradient(
  120deg
  , transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
      padding: 7px 35px 7px 20px;
  }
  button.extern:before, a.button.extern:before, p.button.extern:before, a.readmore.extern:before, button.extern.goback:before {
      background-image: url(../images/link-dark.svg);
      transition: all ease .5s;
      right: 6px;
  }
  a.button.extern:hover {
      background-color: transparent;
      border: solid 1px transparent;
      color: var(--white);
      background-position: 100%;
      transform: scale(1.05);
  }
  
  button.extern:hover:before, a.button.extern:hover:before, button.extern:hover:before, a.button.extern:hover:before {
      background-image: url(../images/link.svg);
  }
  
  
  /* EXTERNER TRANSPARENTER BUTTON MIT WEISSEM RAHMEN */
  
  button.extern-whiteline, a.button.extern-whiteline {
      border: solid 1px var(--white);
      color: var(--black);
      padding: 7px 35px 5px 10px;
      margin: 5px 15px 5px 0;
  }
  button.extern-whiteline:before, a.button.extern-whiteline:before, p.button.extern-whiteline:before, a.readmore.extern-whiteline:before, button.extern-whiteline.goback:before {
      background-image: url(../images/link.svg);
  }
  button.extern-whiteline:hover, a.button.extern-whiteline:hover {
      background: var(--white);
      color: #000;
      border: solid 1px var(--white);
      text-decoration: none;
  }
  button.extern-whiteline:hover:before, a.button.extern-whiteline:hover:before {
      background-image: url(../images/link-black.svg);
  }
  
  
  /* DOWNLOAD BUTTON */
  
  a.button.download:before {
      right: 16px;
      width: 16px;
      height: 16px;
      background-image: url(../images/icons/icon-download.svg);
  }
  
  a.button.download:hover:before {
      background-image: url(../images/icons/icon-download-hover.svg);
  }
  
  
  /* TICKET BUTTON */
  
  a.button.ticket:before {
      right: 16px;
      width: 18px;
      height: 14px;
      background-image: url(../images/icons/icon-ticket-dark.svg);
  }
  
  a.button.ticket:hover:before {
      background-image: url(../images/icons/icon-ticket.svg);
  }
  
  
  /* RESERVIEREN BUTTON */
  
  a.button-filled.reservieren:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 14px;
      width: 21px;
      height: 9px;
      background-image: url(../images/icons/icon-reservieren.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  
  
  /* READMORE FILLED BUTTON */

  a.button-filled.readmore:before, .button-filled.readmore:before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translate(0,-50%) rotate(90deg);
    right: 17px;
    width: 16px;
    height: 8px;
    background-image: url(../images/right-arrow-white.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease .5s;
}

.button-filled.readmore.active:before {
    transform: translate(0,-50%) rotate(-90deg);
}


  /* SHOP FILLED BUTTON */

a.button-filled.shop:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(0, -50%);
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/icon-shop.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
  
  
  
  /* EMAIL BUTTON */
  
  a.button.email:before {
      right: 16px;
      width: 18px;
      height: 14px;
      background-image: url(../images/icons/icon-email.svg);
  }
  
  a.button.email:hover:before {
      background-image: url(../images/icons/icon-email-hover.svg);
  }
  
  
  /* REGISTRY BUTTON */
  
  a.button-filled.registry {
      border: solid 0px var(--red);
          /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7d1e28+0,c82832+100 */
      background: rgb(125,30,40); /* Old browsers */
      background: -moz-linear-gradient(left,  rgba(125,30,40,1) 0%, rgba(200,40,50,1) 100%); /* FF3.6-15 */
      background: -webkit-linear-gradient(left,  rgba(125,30,40,1) 0%,rgba(200,40,50,1) 100%); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to right,  rgba(125,30,40,1) 0%,rgba(200,40,50,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d1e28', endColorstr='#c82832',GradientType=1 ); /* IE6-9 */
      opacity: 0.4;
      pointer-events: none;
  }
  
  a.button-filled.registry:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 16px;
      width: 18px;
      height: 18px;
      background-image: url(../images/icons/icon-registry.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  
  
  /* LOGIN BUTTON */
  
  a.button-filled.fanzone, .button-filled.fanzone {
      border: solid 0px var(--active-blue);
  }
  
  a.button-filled.fanzone:before, .button-filled.fanzone:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 16px;
      width: 18px;
      height: 18px;
      background-image: url(../images/icons/icon-login.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }

  a.button-filled.fanzone-fastlink:before, .button-filled.fanzone-fastlink:before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translate(0,-50%);
    right: 16px;
    width: 18px;
    height: 18px;
    background-image: url(../images/icons/icon-fanzone.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease .5s;
}


  /* TWITTER BUTTON */
  
  a.button-filled.liveticker, .button-filled.liveticker {
    color: var(--border-color);
    background: transparent;
    transition: all ease .5s;
    padding: 8px 40px 8px 15px;
    border: solid 1px var(--border-color);
    opacity: 0.3;
    pointer-events: none;
    }

.swiper-slide.swiper-slide-active.livegame  a.button-filled.liveticker, .button-filled.liveticker {
        color: var(--white);
        background: #1D9BF0;
        transition: all ease .5s;
        border: solid 0px transparent;
        opacity: 1;
        pointer-events: visible;
    }

    .livegame a.button-filled.liveticker, .button-filled.liveticker {
        filter: none;
    }

a.button-filled.liveticker:hover, .button-filled.liveticker:hover {
    transform: scale(1.05);
}

a.button-filled.liveticker:before, .button-filled.liveticker:before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translate(0,-50%);
    right: 13px;
    width: 18px;
    height: 15px;
    background-image: url(../images/icons/icon-twitter.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: all ease .5s;
    filter: invert(1);
}

.swiper-slide.swiper-slide-active.livegame a.button-filled.liveticker:before, .button-filled.liveticker:before {
    filter: none;
}
  
  
  
  /* EMPTY TICKETLINK */
  
  a.button.noticketlink {
      opacity: 0.4;
      cursor: default;
      pointer-events: none;
  }
  
  a.button.noticketlink:hover {
      color: var(--color1);
      border: solid 1px var(--border-color);
      text-decoration: none;
      background-position: 0%;
      transform: none;
  }
  
  
  
  /* PLAYER PROFILE */
  
  a.button-filled.playerprofile {
      position: absolute;
      bottom: 12%;
      left: 10%;
      z-index: 7;
  }
  
  a.button-filled.playerprofile:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 16px;
      width: 18px;
      height: 18px;
      background-image: url(../images/icons/icon-playerprofile.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  
  
  
  /* PLAYER PROFILE */
  
  a.button-filled.youtube {
      margin-left: 50%;
      transform: translate(-50%, 0);
      margin-top: 4em;
      margin-top: clamp(4em, 10vw, 10em);
  }
  
  a.button-filled.youtube:before {
      content: "";
      position: absolute;
      top: 50%;
      transform: translate(0,-50%);
      right: 14px;
      width: 20px;
      height: 15px;
      background-image: url(../images/icons/icon-youtube.svg);
      background-size: contain;
      background-repeat: no-repeat;
      transition: all ease .5s;
  }
  
  
  a.button-filled.shop:before {
      content: "";
      position: absolute;
      top: 50%;
      right: 16px;
      transform: translate(0, -50%);
      width: 16px;
      height: 16px;
      background-image: url(../images/icons/icon-shop.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }
  
  
  /* NEWSLETTER */
  
  .button.whiteline.newsletter:before, a.button.whiteline.newsletter:before {
      background-image: url(../images/icons/icon-newsletter.svg);
      right: 16px;
      width: 16px;
      height: 16px;
  }
  
  
  
  
  /* / ALL */
  
  a.button.whiteline.all {
      left: 50%;
      transform: translate(-50%, 4vw);
      transform: translate(-50%, clamp(2em, 4vw, 4em));
  }
  
  
  
  /* REVERSE */
  
  a.button.reverse { 
      padding: 7px 20px 7px 45px;
  }
  
  a.button.reverse:before { 
      left: 15px;
      width: 20px;
      height: 13px;
      transform: rotate(180deg) translate(0,50%);
  }
  
  
  .button.news {
      margin-top: 2em;
      margin-left: 50%;
      transform: translate(-50%, 0);
  }
  
  .button.news:hover {
      transform: translate(-50%, 0) scale(1);
  }
  
  
  
  
  
  /* BUTTON HOVER EFFEKT WIE BEI REUSSDELTA - folgenden Code einfügen: <a href="" class="button"><div class="button-over"></div><div class="button-content">Planung & Konstruktion</div></a> */
  /*
  .button-over {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1);
      transition: transform .6s cubic-bezier(.165,.84,.44,1);
      transition: transform .6s cubic-bezier(.165,.84,.44,1),-webkit-transform .6s cubic-bezier(.165,.84,.44,1);
      overflow: hidden;
      pointer-events: none;
  }
  
  .button-over:after, .button-over:before {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: var(--black);
  }
  
  .button-over:before {
      -webkit-transform: translate3d(-100%,0,0);
      transform: translate3d(-100%,0,0);
      opacity: 0;
  }
  
  .button-over:after {
      -webkit-transform: translate3d(100%,0,0);
      transform: translate3d(100%,0,0);
  }
  
  .button:hover .button-over:before, .button:hover .button-over:after {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
  }
  
  .button:hover .button-over:after, .button:hover .button-over:before {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
  }
  
  .button:hover .button-over:after {
      transition: none;
      opacity: 0;
  }
  
  .button-over:after, .button:hover .button-over:before {
      transition: -webkit-transform .7s cubic-bezier(.165,.84,.44,1);
      transition: transform .7s cubic-bezier(.165,.84,.44,1);
      transition: transform .7s cubic-bezier(.165,.84,.44,1),-webkit-transform .7s cubic-bezier(.165,.84,.44,1);
      opacity: 1;
  }
  
  .button-content {
      position: relative;
      transition: all .7s cubic-bezier(.165,.84,.44,1);
  }
  
  .button:hover .button-content {
      color: var(--white);
  }
  
  a.button:hover:before {
      background-color: var(--white);
  }
  */
  
  /* ENDE HOVER EFFEKT */
  
  
  
  input.button.goback {
      display: none;
  }
  
  .gobackpage input.button.goback {
      display: block;
      margin: 5% 0;
  }
  
  .video-button:before {
      content: "";
      position: absolute;
      left: 5px;
      top: 50%;
      transform: translate(0, -50%);
      width: 38px;
      height: 38px;
      background-image: url(../images/play.svg);
  }
  
  dd.field-entry.editor span {
      margin: 8px 0;
      font-size: 1.1rem;
      line-height: 1.5;
      white-space: normal;
      -moz-hyphens: auto;
      -o-hyphens: auto;
      -webkit-hyphens: auto;
      -ms-hyphens: auto;
      hyphens: auto;
      -webkit-text-size-adjust: 100%; /* Für Text, damit er auf mobilen Geräten nicht grösser erscheint */
  }
  
  li {
      -webkit-text-size-adjust: 100%; /* Für Text, damit er auf mobilen Geräten nicht grösser erscheint */
  }
  
  h1 {
      font-family: var(--title-font);
      color: var(--border-color);
      font-size: min(max(1.4rem, 3vw), 4rem);
      font-weight: normal;
      letter-spacing: 1px;
      line-height: 1.1;
      -moz-hyphens: none;
      -o-hyphens: none;
      -webkit-hyphens: none;
      -ms-hyphens: none;
      hyphens: none;
  }
  
  h2 {
      font-family: var(--bold-font);
      color: var(--border-color);
      font-size: min(max(1.6rem, 3vw), 4rem);
      font-weight: normal;
      text-transform: uppercase;
      letter-spacing: 1px;
      line-height: 1.1;
  }
  
  h3 {
      font-family: var(--light-font);
      color: var(--border-color);
      font-size: min(max(1.2rem, 1.8vw), 1.8rem);
      font-weight: normal;
      text-transform: uppercase;
      letter-spacing: 2px;
      line-height: 1.1;
  }
  
  h4 { /* Wird verwendet */
      font-family: var(--bold-font);
      color: var(--border-color);
      font-size: min(max(1rem, 1.4vw), 1.4rem);
      font-weight: normal;
      text-transform: uppercase;
      letter-spacing: 1px;
      line-height: 1.1;
      margin: 8px 0;
  }
  
  h5 {
      font-family: var(--bold-font);
      color: var(--border-color);
      font-size: min(max(1rem, 1.1vw), 1.1rem);
      font-weight: normal;
      letter-spacing: 0;
      line-height: 1.5;
  }
  
  
  /* END TYPOGRAPHY */
  
  
  
  
  
  
  
  /* ----------   TABELLEN ---------------- */
  
  
  
      table {
          width: 100%;
          border-collapse: separate;
          border-spacing: 0;
      }
      caption, th, td {
          text-align: left;
          font-weight: normal;
          padding: 0px 5px 0px 5px;
          float:none !important;
      }
      table, thead, tbody, th, td, tr { 
          vertical-align: middle;
          border-collapse: collapse;
          position: relative;
          border: solid 0px var(--light-gray);
      }
      tbody {
          display: table-row-group;
          vertical-align: middle;
          border-color: inherit;
      }
      tr {
          display: table-row;
      }
      td {
          display: table-cell;
          padding: 0;
      }
  
  
      th {
          padding: 0;
      }
  
      
      table.legende {
          width: 190px;
          font-size: 0.8rem;
          margin-top: clamp(3em, 5vw, 5em);
          margin-bottom: clamp(2em, 3vw, 3em);
      }
  
      .medical-report table.legende thead tr {
          color: var(--border-color);
          background: transparent;
      }
  
  
  
  /* /////// TABELLE MIT CLASS .liste /////// */
  
  table.liste tr:nth-child(even) {
      background: #ededed;
  }
  
  /*
  table.liste td img, td img {
      width: 15px;
      height: 14px;
  }
  */
  
  /* RESPONSIVE */
  @media screen and (max-width : 1200px)  {
  table.liste, table.liste thead, table.liste tbody, table.liste th, table.liste td, table.liste tr { 
      display: flex;
      float: left;
      flex-wrap: wrap;
  }
  table.liste thead tr { 
      position: absolute;
      top: -9999px;
      left: -9999px;
  }
  table.liste tr {
      flex: 0 40%;
      padding: 2%;
      border: solid 1px #dedede;
      margin: 2%;
  }
  table.liste tr:nth-child(2n+1) {
      margin: 2% 2% 2% 0;
  }
  table.liste td { 
      position: relative;
      font-size: 1rem;
      width: 100%;
      padding: 0;
      border-bottom: none;
  }
  table.liste tr:nth-child(even) {
      background: transparent;
  }
  table.liste td {
      font-size: 1rem;
      align-items: center;
  }
  table.liste td:nth-child(1) {
      font-weight: bold;
  }
  }
  
  @media screen and (max-width : 500px)  {
  table.liste tr, table.liste tr:nth-child(2n+1) {
      flex: 0 100%;
      margin: 2% 2% 2% 0;
  }
  }
  
  
  
  /* /////// TABELLE ALS UL UND LI mit Class table /////// */
  
  ul.table {
      position: relative;
      float: left;
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      margin-left: 0;
      list-style-type: none;
  }
  
  ul.table li {
      width: calc(25% - 1em);
      float: left;
      padding: 0.5em;
      font-size: 0.9rem;
      margin: 0;
      line-height: 1.5;
      border-bottom: solid 1px var(--border-color);
      background: transparent;
  }
  
  @media screen and (max-width : 1600px)  {
      ul.table li {
          width: calc(33% - 1em);
      }
  }
  @media screen and (max-width : 1300px)  {
      ul.table li {
          width: calc(50% - 1em);
      }
  }
  @media screen and (max-width : 900px)  {
      ul.table li {
          font-size: 0.8rem;
      }
  }
  @media screen and (max-width : 450px)  {
      ul.table li {
          font-size: 0.7rem;
      }
  }
  
  
  
  
  /* ///// STANDARD FIELDS TABELLE ///// */
  
  dl.fields-container ul {
      position: relative;
      display: block;
      float: left;
      width: 100%;
      list-style-type: none;
  }
  
  dd.field-entry {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  dl.fields-container ul li {
      margin: 0;
      padding: 10px 0;
      border-bottom: solid 1px #dedede;
  }
  
  
  /* ///// REPEATABLE FIELD TABELLE ///// */
  
  .repeatable-2 ul, .repeatable-3 ul, .repeatable-4 ul {
      display: flex;
      float: left;
      flex-wrap: wrap;
      border: solid 0.1vw #ececec;
      width: 100%;
  }
  
  .repeatable-2 li, .repeatable-3 li, .repeatable-4 li {
      list-style: none;
      margin: 0;
      padding: 2%;
      float: left;
      border-top: solid 0.1vw #ececec;
  }
  
  .repeatable-2 li {
      flex: 1 42%;
      width: 42%;
  }
  
  .repeatable-3 li {
      flex: 1 29%;
      width: 29%;
  }
  
  .repeatable-4 li {
      flex: 1 20%;
      width: 20%;
  }
  
  .repeatable-2 li:nth-child(odd) {
      font-weight: bold;
      border-right: solid 0.1vw #ececec;
  }
  
  .repeatable-3 li:nth-child(3n + 1), .repeatable-3 li:nth-child(3n + 2) {
      border-right: solid 0.1vw #ececec;
  }
  
  .repeatable-4 li:nth-child(4n + 1), .repeatable-4 li:nth-child(4n + 2), .repeatable-4 li:nth-child(4n + 3) {
      border-right: solid 0.1vw #ececec;
  }
  
  .repeatable-2 li:nth-child(-n+2), .repeatable-3 li:nth-child(-n+3), .repeatable-4 li:nth-child(-n+4) {
      border-top: none;
  }
  
  
  dd.field-entry.col-4:before,
  dd.field-entry.col-5:before {
      position: absolute;
      content: "";
      right: 0;
      top: 0;
      height: 100%;
      width: 60px;
      background: rgb(255,255,255);
      background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
      z-index: 2;
  }
  
  dd.field-entry.col-4 span.field-value,
  dd.field-entry.col-5 span.field-value {
      position: relative;
      overflow-x: scroll;
  }
  
  dd.field-entry.col-4 span.field-value ul,
  dd.field-entry.col-5 span.field-value ul {
      min-width: 700px;
  }
  
  dd.field-entry.col-5 span.field-value::-webkit-scrollbar-track {
      border-radius: 0;
      height: 3px;
      background-color: #F5F5F5;
  }
  
  dd.field-entry.col-5 span.field-value::-webkit-scrollbar {
      width: 3px;
      height: 3px;
      background-color: #414d57;
  }
  
  dd.field-entry.col-5 span.field-value::-webkit-scrollbar-thumb {
      border-radius: 0px;
      background-color: #414d57;
  }
  
  
   #system-message dd.error ul {
      margin-left: 0;
      background-position: 5px 40%;
  }
  
  
  
  /* END TABELLEN */
  
  
  
  
  
  /* ----------   MISC ELEMENTS ---------------- */
  
  label {
      float: left;
      min-width: 122px;
  }
  
  #main-col ul, #main-col ol {
      margin-left: 18px;
  }
  /*
  .articleBody ul, .articleBody ol {
      margin-left: 17px;
      margin-top: 20px;
  
  .articleBody li {
      margin-top: 15px;
  }
  }*/
  
  ul.actions {
      margin-left: 0;
  }
      
  ul.actions li {
      display: inline;
      list-style: none outside none;
      padding: 0;
  }
  
  
  
  
  fieldset.filters {margin: 10px 0;}
  
  div.current {
      border: 1px solid #CCCCCC;
      clear: both;
      padding: 10px;
  }
  
  dl.tabs dt {
      background: none repeat scroll 0 0 #F0F0F0;
      border-left: 1px solid #CCCCCC;
      border-right: 1px solid #CCCCCC;
      border-top: 1px solid #CCCCCC;
      color: #666666;
      float: left;
      margin-right: 3px;
      padding: 4px 10px;
  }
  
  dl.tabs dt.open {
      background: none repeat scroll 0 0 #F9F9F9;
      border-bottom: 1px solid #F9F9F9;
      color: #000000;
      z-index: 100;
  }
  
  .panel {
      border: 1px solid;
      margin-top: -1px;
  }
  
  
  .contentpane {
      margin:10px;
  }
  
  
  .system-unpublished, tr.system-unpublished {
      background: transparent !important;
      border-top: 0px solid #c4d3df !important;
      border-bottom: 0px solid #c4d3df !important;
  }
  
  /* END MISC ELEMENTS */
  
  
  
  /* //////////////////////////////////////////////////////////// ACCORDION //////////////////////////////////////////////////////////// */
  
  .accordion {
    width: 100%;
    float: left;
  }
  .accordion__item {
    width: 100%;
    float: left;
  }
  .accordion__title {
    position: relative;
    background: transparent;
    padding: 20px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    border-bottom: solid 1px var(--dark-gray);
  }
  .accordion__title:after {
    position: absolute;
    content: " ";
    right: 15px;
    width: 20px;
    height: 11px;
    background-image: url(../images/right-arrow.svg);
    top: 50%;
    transform: translate(0, -50%);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
  }
  .is-open .accordion__title:after {
    transform: translate(0, -50%) rotate(90deg);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
  }
  .accordion__body {
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease-in-out;
  }
  .accordion__item.is-open {
    background-color: var(--white);
  }
  .accordion__content {
    padding: 15px;
  }
  .accordion__title p {
    white-space: nowrap;
  }
  



  /* //////////////////////////////////////////////////////////// TABS //////////////////////////////////////////////////////////// */



  .tab-control, .tab-control-2, .tab-control-3 {
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-radius: 25px;
  }
  
  ul.tabs, ul.tabs-2, ul.tabs-3 {
    position: relative;
    margin: 0px 0 -10px 0;
    padding: 0px;
    list-style: none;
    z-index: 1;
  }
  ul.tabs li, ul.tabs-2 li, ul.tabs-3 li {
    position: relative;
    background: none;
    font-size: min(max(0.75rem, 0.9vw), 0.9rem);
    color: var(--color1);
    display: inline-block;
    padding: 7px 30px 17px;
    border-radius: 10px;
    cursor: pointer;
    margin: 0;
    z-index: 1;
    font-family: "hcap-semibold";
    text-transform: uppercase;
  background: rgb(180,180,180); /* Old browsers */
  background: -moz-linear-gradient(left,  rgba(180,180,180,1) 0%, rgba(220,220,220,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  rgba(180,180,180,1) 0%,rgba(220,220,220,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  rgba(180,180,180,1) 0%,rgba(220,220,220,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4b4b4', endColorstr='#dcdcdc',GradientType=1 ); /* IE6-9 */
  
  }
  
  ul.tabs li.current, ul.tabs-2 li.current, ul.tabs-3 li.current {
    background: rgb(70,105,170); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(70,105,170,1) 0%, rgba(40,55,85,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(70,105,170,1) 0%,rgba(40,55,85,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#283755',GradientType=1 ); /* IE6-9 */
    z-index: 2;
    color: var(--white);
  }
  
  ul.tabs li:not(:first-child), ul.tabs-2 li:not(:first-child), ul.tabs-3 li:not(:first-child) {
    margin: 0 0 0 -20px;
  }
  
  /*
  ul.tabs li:first-child {
    border-radius: 25px 0 0 0;
  }*/
  
  .tab-content, .tab-content-2, .tab-content-3 {
    position: relative;
    display: none;
    background: var(--white);
    padding: 15px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 20px 20px rgba(0,0,0,0.05); 
    -moz-box-shadow: 0px 0px 20px 20px rgba(0,0,0,0.05);
    box-shadow: 0px 0px 20px 20px rgba(0,0,0,0.05);
    z-index: 2;
    visibility: hidden;
  }
  
  .tab-content.current, .tab-content-2.current, .tab-content-3.current {
    display: block;
    border: none;
    padding: 5%;
    border: solid 1px var(--color3);
    visibility: visible;
  }
  
  .tab-content-3.current {
      position: relative;
      display: block;
      float: left;
      width: 90%;
  }




  /* //////////////////////////////////////////////////////////// PORTFOLIO //////////////////////////////////////////////////////////// */

  .portfolio.newsflash {
    display: block;
}

.portfolio .col-3 {
    width: 29%;
}

.portfolioFilter {
  padding: 15px 0;
  margin: 0 0;
}

.portfolioFilter a {
    text-decoration: none;
    padding: 5px 10px;
    padding: 5px clamp(10px, 3vw, 25px);;
    margin: 5px 1px;
    display: inline-block;
    border: solid 1px var(--active-blue);
    border-radius: 30px;
    transition: all ease 0.5s;
    width: auto;
    font-family: var(--bold-font);
    font-size: 0.9rem;
    font-size: min(max(0.65rem, 1.1vw), 0.9rem);
    text-align: center;
    text-transform: uppercase;
    hyphens: none;
}

.portfolioFilter a.current, .portfolioFilter a:hover {
    position: relative;
    color: var(--white);
    background: var(--border-color);
    transition: all ease 0.5s;
}


.portfolioContainer {
  border: 0px solid #eee;
  border-radius: 3px;
}

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  transition-property: transform, opacity;
}

.portfolio .bild-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    color: #fff;
    background: rgba(0,122,160,1);
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all ease 0.5s;
}

.portfolio .beitrag:hover .bild-overlay {
    opacity: 1;
}





/* /////// GP BAUING INDIVIDUEL /////// */

.portfolio .col-3:nth-child(10n-6), .portfolio .col-3:nth-child(10n) {
    width: 62%;
}

.portfolio .col-3:nth-child(10n-6) .titel, .portfolio .col-3:nth-child(10n) .titel {
    padding: 2%;
}


.portfolio .titel h4, .portfolio .titel p {
    color: #646363;
    font-size: 0.8rem;
    margin: 0;
    font-family: "config-regular";
    text-transform: none;
}

.portfolio .beitrag {
    background: #f2f2f2;
}

.portfolio .titel {
    padding: 4%;
    position: relative;
    display: block;
    float: left;
}

.portfolio .bild {
    margin: 0;
}

.portfolio a.button {
    margin-left: auto;
    color: #f2f2f2;
    background: transparent;
    border: solid 1px #f2f2f2;
}

.portfolio a.button:hover {
    color: #646363;
    background: #f2f2f2;
    border: solid 1px #f2f2f2;
}

.portfolio a.button:before {
    background-image: url(../images/slider-arrow-hell.svg);
}

.portfolio a.button:hover:before {
    background-image: url(../images/slider-arrow-dunkel.svg);
}




  /* //////////////////////////////////////////////////////////// CONTENT AUSKLAPPEN //////////////////////////////////////////////////////////// */

  #facts {
    position: relative;
    width: 100%;
    float: left;
    display: none;
}

#introtext-readmore {
    position: relative;
    float: left;
}

.introtext-rest {
    float: left;
}

#introtext-readmore:before {
    content: '';
    display: inline-block;
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 50px;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
}

#introtext-readmore.aktiv:before {
    display: none;
}

.nichtanzeigen {
    display: none;
}

#toggle {
    position: relative;
    color: #867f79;
    transition: all ease .5s;
    display: inline-block;
    font-size: 1rem;
    letter-spacing: 1px;
    margin: 20px 0;
    background: transparent;
    border: none;
    padding: 0;
    font-weight: 600;
}

#toggle:before {
    content: "";
    position: absolute;
    top: 2px;
    right: -22px;
    border: solid #867f79;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

#toggle.aktiv:before {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
    top: 8px;
}




  /* //////////////////////////////////////////////////////////// NEWSFLASH LOADMORE //////////////////////////////////////////////////////////// */

  .newscontent {
    display: none;
      margin: 2%;
      flex: 0 46%;
      background: #fff;
  }
  
  #loadmore-area {
      position: relative;
      display: block;
      float: left;
      width: 100%;
  }
  
  #loadMore {
      background: #e93846;
      color: #fff;
      border: solid 1px #e93846;
      border-radius: 30px;
      padding: 10px 30px;
      margin-top: 3em;
      transition: all ease .5s;
      display: table;
      margin-left: auto;
      margin-right: auto;
      transition: .3s;
  }
  
  #loadMore:hover {
      background: transparent;
      color: #e93846;
      border: solid 1px #e93846;
  }
  
  .noContent {
    color: #000 !important;
    background-color: transparent !important;
    pointer-events: none;
  }




  /* //////////////////////////////////////////////////////////// NAVIGATION //////////////////////////////////////////////////////////// */


/* ///// NAVIGATION ///// */

#navigation {
    position: fixed;
    display: none;
    float: left;
    opacity: 1;
    width: 86%;
    background: var(--border-color);
    padding: 20px 7%;
    /*min-height: 40rem;*/
    top: 0;
    left: 0;
    transform: translate(0, -80px);
    z-index: 14;
    opacity: 1;
    visibility: visible;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
    box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
    height: 0;
}

#navigation.animate {
    height: 100vh;
    transition: height .8s cubic-bezier(.86,0,.07,1);
}

#content-scroll.openmenu {
    touch-action: none;
}

#navigation:after {
  content: '';
  display: block;
}

/*#navigation.animate {
	display: block;
	opacity: 1;
  	visibility: visible;
}*/

#responsive-navigation {
    position: relative;
    display: block;
    float: left;
    z-index: 2;
}

#responsive-navigation:after {
  content: '';
  display: block;
}

#navigation .moduletable_menu {
    position: absolute;
    display: block;
    float: left;
    width: 45%;
    top: 50%;
    z-index: 3;
    opacity: 0;
    transform: translate(0, -50%);
}

.menu-wrapper.responsive {
    display: none;
}

.menu-wrapper {
    position: absolute;
    width: 80px;
    height: 80px;
    margin: auto;
    cursor: pointer;
    float: left;
    top: -30px;
    right: -30px;
    z-index: 1112;
}
  
.menu-wrapper.fadeup {
    position: fixed;
    top: 50px;
    right: 3em;
    height: auto;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
    -moz-transition: -moz-transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
    transition: transform 0.5s cubic-bezier(0.86, 0, 0.07, 1);
}

.menu-wrapper.fadeup.hidden {
    -webkit-transform: translateY(calc(-100% - 50px));
    -moz-transform: translateY(calc(-100% - 50px));
    -ms-transform: translateY(calc(-100% - 50px));
    -o-transform: translateY(calc(-100% - 50px));
    transform: translateY(calc(-100% - 50px));
  }
  
  .burger {
    position: relative;
    display: block;
    width: 40px;
    height: 50px;
    z-index: 1;
    margin: 34px auto auto;
  }

  .menu-wrapper.fadeup .burger {
    margin-top: 28px;
    margin-top: clamp(21px, 4vw, 28px);
    }
  
  .burger.scrolled {
    margin-top: 30px;
  }
  
  .burger span {
    margin: 0 auto;
    position: absolute;
  }
  
  .burger span:before,
  .burger span:after {
    position: absolute;
    content: '';
  }
  
  .burger span:before,
  .burger span:after {
    width: 40px;
    height: 4px;
    background-color: #fff;
    display: block;
    transition: all .5s ease-in-out;
  }
  
  
  .burger span:before {
    margin: -5px 0 0;
  }
  
  .burger span:after {
    margin: 6px 0 0;
  }
  
  .collapse span {
    transition-duration: 0s;
    transition-delay: .3s;
  }
  
  .collapse.open span {
    background-color: rgba(255, 255, 255, 0);
    transition-delay: .3s;
  }
  
  .collapse span:before {
    transition-property: margin, transform;
    transition-duration: .3s;
    transition-delay: .3s, 0;
  }
  
  .collapse.open span:before {
    margin-top: 0;
    transform: rotate(45deg);
    transition-delay: 0, .3s;
  }
  
  .collapse span:after {
    transition-property: margin, transform;
    transition-duration: .3s;
    transition-delay: .3s, 0;
  }
  
  .collapse.open span:after {
    margin-top: 0;
    transform: rotate(-45deg);
    transition-delay: 0, .3s;
  }
  
  
  .menu-text p {
    white-space: nowrap;
    line-height: initial;
    hyphens: none;
    margin: auto;
    left: 50%;
    transform: translate(-50%, 0);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 4px;
    font-weight: bold;
    color: #ffffff;
    transition: all .5s ease-in-out;
    margin-left: 2px;
  }
  
  .menu-text p.close {
    font-size: 9px;
    margin-top: 5px;
    letter-spacing: 2px;
  }
  
  .menu-text {
    position: relative;
    display: block;
    height: 20px;
    overflow: hidden;
    top: -32px;
  }
  
  .menu,
  .close {
    position: absolute;
  }
  
  .menu {
    top: 0;
  }
  
  .open + .menu-text .menu {
    top: -20px;
    opacity: 0;
  }
  
  .close {
    top: 20px;
    opacity: 0;
  }
  
  .open + .menu-text .close {
    top: 0;
    opacity: 1;
  }

  .anchor {
    margin-top: -200px;
  }



@media only screen and (max-width: 801px) {

    #navigation {
        display: none;
    }
}
    
    
    #Nav {
        float: left;
        padding: 5px 0;
    }
    
    ul.menu {
        position: relative;
        margin-left: 0;
    }

    #navigation ul.menu {
        opacity: 1;
        transform: translateY(0px);
    }
    
    ul.menu li {
        position: static;
        display: table;
        background: none repeat scroll 0 0 transparent;
        list-style: none outside none;
        margin: 0px 0px 0 0px;
        padding: 0 0px;
    }
/*
    #navigation ul.menu li {
        opacity: 0;
        transform: translateY(-20px);
    }

    #navigation ul.menu li ul.nav-child.unstyled.small li {
        opacity: 1;
        transform: none;
    }
*/

    
    #navigation ul.nav-child.unstyled.small {
        opacity: 1;
        display: none;
        position: absolute;
        left: 0;
        font-size: 0.8em;
        margin-left: 0;
    }
    
    ul.menu a, span.separator {
        position: relative;
        display: inline-block;
        font-family: inherit;
        color: var(--white);
        font-size: 0.9rem;
        text-decoration: none;
        letter-spacing: 1px;
        margin: 0;
        padding: 2px 0;
        transition: all ease .5s;
        cursor: pointer;
        font-weight: bold;
    }

    #navigation ul.menu a, #navigation span.separator {
        font-size: min(max(0.8rem, 1.2vw), 1.2rem);
        padding: 4px 0;
        font-family: var(--bold-font);
        text-transform: uppercase;
    }

    /*
    ul.menu a:hover, span.separator:hover, li.active.divider.deeper.parent span.separator:hover {
        text-decoration: none;
        color: #98bdd4;
    }*/
    
    /*li.current.item-101 a {
        background: #98bdd4;
        color: #323e47;
    }*/

    
    #navigation li.active.divider.deeper.parent span.separator {
        position: relative;
    }
    
    /*#navigation li.deeper.parent > a {
        pointer-events: none; 
    } verhindert den a-Tag, wenn nicht als separator eingerichtet */
    
    #navigation ul.menu li.divider.deeper.parent.open > span.separator,
    #navigation ul.menu li.deeper.parent.open > a {
        color: var(--active-blue);
    }
    
    #navigation ul.menu li.divider.deeper.parent.open > span.separator:before,
    #navigation ul.menu li.deeper.parent.open > a:before {
        background-image: url(../images/menu-arrow-active.svg);
    }
    
    #navigation ul.menu li.divider.deeper.parent.open.focus > span.separator,
    #navigation ul.menu li.deeper.parent.open.focus > a {
        color: var(--active-blue);
    }
    
    #navigation ul.menu li.divider.deeper.parent.open.focus > span.separator:before, #navigation ul.menu li.divider.deeper.parent.open.focus-open > span.separator:before,
    #navigation ul.menu li.deeper.parent.open.focus > a:before, #navigation ul.menu li.deeper.parent.open.focus-open > a:before {
        background-image: url(../images/menu-arrow-active.svg);
    }

    #navigation ul.menu li ul.nav-child.unstyled.small li.active.divider.deeper.parent.open > span,
    #navigation ul.menu li ul.nav-child.unstyled.small li.current.active.open > a {
        color: var(--active-blue);
    }
    
    #navigation li.divider.deeper.parent.open-submenu span.separator,
    #navigation li.deeper.parent.open-submenu > a {
        box-shadow: 0px 0px 0px #444d56 inset;
        border-bottom: solid 1px #444d56;
    }
    
    
    ul.nav.menu.navbar li:hover ul.nav-child.unstyled.small ul {
        padding-top: 0vw;
    }
    
    ul.menu li ul.nav-child.unstyled.small li {
        float: none;
        width: auto;
        margin: 0px 0px 0px 0px;
        white-space: normal;
    }
    
    
    #navigation ul.menu li ul.nav-child.unstyled.small li a, #navigation ul.menu li ul.nav-child.unstyled.small li span.separator {
        position: relative;
        display: block;
        float: none;
        font-family: var(--common-font);
        font-size: min(max(0.8rem, 1vw), 1.1rem);
        text-transform: none;
        margin: 0px 0px 0px 0px;
        padding: 5px 0;
        border-right: 0px;
        white-space: normal;
        hyphens: auto;
        letter-spacing: 1px;
    }
        
    #navigation-fadein ul.menu li ul.nav-child.unstyled.small li a:hover, #navigation-fadein ul.nav-child.unstyled.small li.current.active a {
        color: #fff;
    }
    
    #navigation-fadein ul.menu li ul.nav-child.unstyled.small li a {
        font-size: 0.6em;
    }
    

    #navigation ul.menu li a:hover,
    #navigation ul.menu li span:hover,
    #navigation ul.menu li ul.nav-child.unstyled.small li a:hover, ul.menu li span.separator:hover, 
    #navigation li.active.divider.deeper.parent span.separator:hover,
    #navigation ul.menu li ul.nav-child.unstyled.small li.active.divider.deeper.parent.open > span:hover,
    #navigation ul.menu li ul.nav-child.unstyled.small li.current.active.open a:hover,
    #navigation ul.menu a.extern:hover {
        color: var(--active-blue);
    }

    #navigation ul.menu li span.separator:hover:before,
    #navigation ul.menu li.deeper.parent:hover > a:before {
        background-image: url(../images/menu-arrow-active.svg);
    }

    #navigation ul.menu a.extern:hover:before {
        background-image: url(../images/extern-active.svg);
    }

    
    #navigation ul.menu li ul.nav-child.unstyled.small li.active.divider.deeper.parent.open-submenu ul li span.separator:hover,
    #navigation ul.menu li ul.nav-child.unstyled.small li.active.divider.deeper.parent.open-submenu ul li a:hover {
        color: #000;
        background: #97bed4; 
    }
    
    #navigation li.divider.deeper.parent.focus > span.separator,
    #navigation li.deeper.parent.focus > a {
        color: var(--active-blue);
    }

    #navigation ul.menu li.divider.deeper.parent.focus span.separator:hover:before,
    #navigation ul.menu li.deeper.parent.focus a:hover:before {
        background-image: url(../images/menu-arrow-active.svg);
    }

    #navigation ul.menu li.divider.deeper.parent.focus li.divider.deeper.parent span.separator:hover:before,
    #navigation ul.menu li.deeper.parent.focus li.deeper.parent a:hover:before {
        background-image: url(../images/menu-arrow-active.svg);
    }

    #navigation ul.menu li.divider.deeper.parent.focus li.divider.deeper.parent.focus span.separator:hover:before,
    #navigation ul.menu li.deeper.parent.focus li.deeper.parent.focus a:hover:before {
        background-image: url(../images/menu-arrow-active.svg);
    }

    #navigation ul.menu li.deeper.parent.focus li.deeper.parent.focus a.extern:hover:before {
        background-image: url(../images/extern-active.svg);
    }


    #navigation ul.menu li.divider.deeper.parent.focus-open span.separator,
    #navigation ul.menu li.deeper.parent.focus-open > a {
        color: var(--active-blue);
    }

    #navigation ul.menu li .focus-open span {
        color: var(--active-blue); 
    }
    
    ul.menu li span.separator {
        position: relative;
    }
    
    ul.menu li span.separator:before,
    #navigation ul.menu li.deeper.parent > a:before {
        top: 50%;
        right: -1vw;
        right: clamp(-25px, -1vw, -10px);
        margin-left: 0px !important;
        content: "";
        height: 1.12vw;
        min-height: 8px;
        max-height: 14px;
        width: 0.65vw;
        min-width: 4px;
        max-width: 8px;
        height: clamp(8px, 1.12vw, 14px);
        width: clamp(4px, 0.65vw, 8px);
        position: absolute;
        background-image: url(../images/menu-arrow.svg);
        background-repeat: no-repeat;
        transform: rotate(-0deg) translate(0, -50%);
        pointer-events: none;
        transition: all ease 0.5s;
    }
    
    #navigation ul.menu li.divider.deeper.parent.focus > span.separator:before,
    #navigation ul.menu li.deeper.parent.focus > a:before {
        background-image: url(../images/menu-arrow-active.svg);
    }
    
    #responsive-navigation span.separator:before,
    #responsive-navigation li.deeper.parent:before {
        top: 20px;
        right: 15px;
    }
    
    #header-fadein span.separator:before,
    #header-fadein li.deeper.parent:before {
        top: 15px;
        background-image: url(../images/menu-arrow-fadein.svg);
    }
    
    ul.nav.menu.navbar li {
        color: #000;
        transition: all ease 0.5s;
    }
    
    ul.nav.menu.navbar li:hover {
        color: #e75d17;
    }
    
    li.default.current.active {
        color: #e75d17;
    }
    
    
    /* ///// SUB SUB MENU ///// */
    
    /*
    
    ul.menu li ul.nav-child.unstyled.small li ul li {
    display: none;
    }
    
    ul.menu li ul.nav-child.unstyled.small li:hover ul li {
        display: block;
    }
    
    */
    
    
    #navigation ul.menu li ul.nav-child.unstyled.small {
        top: 0px;
        left: 15vw;
        left: clamp(14em, 15vw, 20em);
        padding: 0 4%;
        height: 100%;
        border-left: solid 1px #2e394b;
        max-width: 13em;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul {
        width: 100%;
        left: 15vw;
        left: clamp(18em, 15vw, 24em);
        top: 0px;
        padding: 0 10%;
    }
    
    
    #navigation span.nav-header {
        display: block;
        font-family: "seedorf";
        font-weight: bold;
        color: #98bdd4;
        border-bottom: solid 0px;
        font-size: 1rem;
        margin: 0px 0px 10px 0px;
        padding: 10px;
        border-right: 0px;
        white-space: nowrap;
        letter-spacing: 1px;
    }
    

    span.navigoback {
        position: relative;
        color: #fff;
        padding: 3px 15px 3px 35px;
        margin-bottom: 20px;
        width: fit-content;
        border: solid 1px var(--white);
        border-radius: 30px;
        font-size: 0.7rem;
        cursor: pointer;
        display: none;
    }

    #right-col span.navigoback {
        display: none;
    }

    span.navigoback:before {
        top: 50%;
        left: 16px;
        margin-left: 0px !important;
        content: "";
        height: 12px;
        width: 7px;
        position: absolute;
        background-image: url(../images/menu-arrow.svg);
        background-repeat: no-repeat;
        transform: rotate(
    -180deg
    ) translate(0, 50%);
        pointer-events: none;
    }





  /* //////////////////////////////////////////////////////////// NAVIGATION SEITE //////////////////////////////////////////////////////////// */

  #right-col ul.menu li {
    float: none;
	width: 100%;
}

#right-col ul.menu a, #right-col span.separator {
    position: relative;
    width: calc(100% - 60px);
    font-size: 0.9rem;
    display: flex;
    margin: 0 40px;
    padding: 12px 10px 12px 10px;
    border-bottom: solid 1px #444d56;
    color: #fff;
    background: transparent;
    transition: all ease .5s;
}

#right-col ul.nav-child.unstyled.small ul.menu a,
#right-col ul.nav-child.unstyled.small span.separator {
    padding: 12px 0px 12px 10px;
    margin: 0 40px 0 40px;
    color: #98bdd4;
    font-weight: bold;
}

#right-col ul.nav-child.unstyled.small li ul {
    padding: 12px 10px 12px 0px;
}

#right-col span.nav-header {
    display: none;
    margin-left: 40px;
}

#right-col ul.menu li ul a, #right-col li ul span.separator {
    border-bottom: solid 1px #323e47;
}

#right-col ul.menu a:hover, #right-col span.separator:hover {
    background: rgba(150,190,212,0.4);
}

#right-col span.separator:before {
    top: 50%;
    right: 10px;
    margin-left: 0px !important;
    content: "";
    height: 16px;
    width: 12px;
    position: absolute;
    background-image: url(../images/navigation-seite-arrow.svg);
    background-repeat: no-repeat;
    pointer-events: none;
	transform: rotate(0deg) translate(0,-50%);
}

#right-col ul.nav-child.unstyled.small span.separator:before {
    right: 10px;
}

#right-col ul.menu span.separator.aktiv:before {
    transform: rotate(180deg) translate(0,50%);
}

#right-col li.current a {
    color: #aea355;
}


#right-col ul.nav-child.unstyled.small {
    position: relative;
    padding: 20px 40px 20px 20px;
    background: #414d57;
}

#right-col ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
    margin-left: 40px;
}

#right-col ul.menu li ul.nav-child.unstyled.small li {
    border-bottom: 0px;
}

#right-col ul.menu li ul.nav-child.unstyled.small li a ,
#right-col ul.menu li ul.nav-child.unstyled.small li span {
    min-width: auto;
    white-space: pre-wrap;
    margin: 0 0px 0 20px;
    width: calc(100% - 30px);
}

#right-col ul.menu li ul.nav-child.unstyled.small li ul li a ,
#right-col ul.menu li ul.nav-child.unstyled.small li ul li span {
    min-width: auto;
    white-space: pre-wrap;
    margin: 0 0px 0 0px;
    width: calc(100% - 10px);
}


/*
#right-col li.active.divider.deeper.parent span.separator {
        background: #f6ec21;
}
*/


@media screen and (max-width : 1600px)  {


    #right-col ul.menu a, #right-col span.separator {
        margin: 0 20px;
        padding: 12px 30px 12px 10px;
    }

    #right-col ul.menu li ul.nav-child.unstyled.small li a, #right-col ul.menu li ul.nav-child.unstyled.small li span {
        margin: 0 0px 0 0px;
        width: calc(100% - 30px);
        padding: 12px 30px 12px 10px;
    }

    #right-col ul.menu li ul.nav-child.unstyled.small li ul li a, #right-col ul.menu li ul.nav-child.unstyled.small li ul li span {
        width: calc(100% - 20px);
    }
    
    #right-col ul.nav-child.unstyled.small {
        padding: 10px 30px 20px 20px;
    }

    #right-col ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        margin-left: 20px;
    }
    

}



@media screen and (min-width : 900px) and (max-width : 1100px)  {

    #right-col ul.menu a, #right-col span.separator {
        margin: 0 0px;
        width: calc(100% - 40px);
    }

    #right-col ul.nav-child.unstyled.small {
        padding: 1px 20px 20px 10px;
        margin: 0;
    }

    #right-col ul.nav-child.unstyled.small span.separator:before {
        right: 0;
    }
    
    #right-col ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        margin-left: 0;
    }

}



@media screen and (max-width : 900px)  {

    #right-col ul.menu a, #right-col span.separator {
        margin: 0 0px;
        padding: 12px 30px 12px 10px;
    }

}


@media screen and (max-width : 650px)  {

    #right-col ul.menu a, #right-col span.separator {
        font-size: 0.8rem;
    }

}




  /* //////////////////////////////////////////////////////////// RESPONSIVE MENU //////////////////////////////////////////////////////////// */

  /* RESPONSIVE NAVIGATION */


@media screen and (max-width : 1100px)  {


    #navigation {
        width: 0%;
        padding: 0;
        left: auto;
        right: 0;
        transform: translate(114%, 0px);
        -webkit-box-shadow: -12px 0px 20px 0px rgba(0,0,0,0.4);
        -moz-box-shadow: -12px 0px 20px 0px rgba(0,0,0,0.4);
        box-shadow: -12px 0px 20px 0px rgb(0,0,0,0.4);
        height: 100vh;
        overflow-y: scroll;
        overflow-x: hidden;
        z-index: 1000;
    }

    .navigation-container {
        position: relative;
        display: block;
        float: left;
        width: 100%;
        padding: 0 0 40%;
    }
    
    #navigation ul.nav.menu.mod-list {
        padding: 5em 5% 10%;
        height: 100%;
        /*height: 100vh;*/ /* Wichtig für Protection */
    }

    #navigation .moduletable_menu {
        width: 100%;
        position: relative;
        transform: none;
        top: auto;
        margin-top: 0;
    }

    #navigation {
        padding: 0 0;
    }

    ul.menu li span.separator:before {
        right: 15px;
    }
    
    
    #navigation ul.menu li, #navigation ul.menu li ul.nav-child.unstyled.small li {
        width: 100%;
        font-size: 1.1rem;
    }
    
    ul.menu li ul.nav-child.unstyled.small li a, ul.menu li ul.nav-child.unstyled.small li span.separator {
        min-width: auto;
        width: 100%;
        font-size: 0.8rem;
        color: #ffffff;
        font-weight: normal;
        margin: 0px 0px 0px 0px;
        padding: 10px 0;
    }
    
    #navigation ul.menu a, #navigation span.separator {
        width: calc(100% - 20px);
        display: block;
        padding: 10px;
        border-bottom: solid 1px var(--border-color2);
        font-weight: normal;
        font-size: 0.8rem;
    }

    ul.menu li span.separator:before, #navigation ul.menu li.deeper.parent > a:before {
        right: 10px;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small, #navigation ul.menu li ul.nav-child.unstyled.small li ul, #navigation ul.menu li ul.nav-child.unstyled.small li ul li ul {
        position: fixed;
        top: 0;
        right: 0;
        left: auto;
        height: 100vh;
        max-width: none;
        padding: 10em 20px;
        margin: 0;
        background: #323e47;
        -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
        -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
        box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.4);
        display: block;
        visibility: hidden;
        right: -120%;
        overflow-y: auto;
        -webkit-transition: all 0.4s cubic-bezier(.42, 0, .58, 1);
        transition: all 0.4s cubic-bezier(.42, 0, .58, 1);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small.slidein, #navigation ul.menu li ul.nav-child.unstyled.small li ul.slidein, #navigation ul.menu li ul.nav-child.unstyled.small li ul li ul.slidein {
        right: 0;
        left: auto;
        display: block;
        visibility: visible;
        height: 100vh;
    }
    
    
    #navigation ul.nav.menu.mod-list.protect, #navigation ul.nav-child.unstyled.small.slidein.protect {
        transition: all ease 0.3s;
    }
    
    
    .protectarea {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: var(--border-color);
        opacity: 0.8;
        z-index: 1;
        transition: all ease 0.5s;
        display: none;
    }
    
    ul.nav-child.unstyled.small.slidein.aktiv.protect > .protectarea,
    ul.nav.menu.mod-list.protect > .protectarea {
        display: block;
    }
    
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul { /* Wichtig, damit die drei untenstehenden Breiten möglich sind. Ansonsten ist die Breite zu kurz */
        max-width: 100%;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small {
        width: calc(100% - 70px);
        background: #202d42;
        z-index: 1;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        width: calc(100% - 100px);
        background: #222f44;
        z-index: 2;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        width: calc(100% - 130px);
        background: var(--border-color);
        z-index: 3;
    }
    
    
    span.navigoback {
        display: block;
    
    }

    
    ul.menu li span.separator:before {
        top: 50%;
        right: 10px;
        margin-left: 0px !important;
        content: "";
        height: 12px;
        width: 16px;
        position: absolute;
        background-image: url(../images/menu-arrow.svg);
        background-repeat: no-repeat;
        transform: rotate(-0deg) translate(0, -50%);
        pointer-events: none;
    }
    
    ul.menu li ul.nav-child.unstyled.small li a:hover, ul.menu li span.separator:hover, li.active.divider.deeper.parent span.separator:hover, ul.menu li ul.nav-child.unstyled.small li.active.divider.deeper.parent.open > span:hover, ul.menu li ul.nav-child.unstyled.small li.current.active.open a:hover {
        color: #fff;
        background: transparent;
        box-shadow: none;
    }
    
    #navigation ul.menu > li.divider.deeper.parent.open > span.separator {
        box-shadow: none;
        border-bottom: solid 1px var(--border-color2);
        color: var(--active-blue);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li a, #navigation ul.menu li ul.nav-child.unstyled.small li span.separator {
        border-bottom: solid 1px var(--border-color2);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul li a, #navigation ul.menu li ul.nav-child.unstyled.small li ul li span.separator {
        border-bottom: solid 1px var(--border-color2);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul li ul li a, #navigation ul.menu li ul.nav-child.unstyled.small li ul li ul li span.separator {
        border-bottom: solid 1px var(--border-color2);
    }

    #navigation ul.menu li ul.nav-child.unstyled.small li a, #navigation ul.menu li ul.nav-child.unstyled.small li span.separator {
        padding: 10px 0;
        width: 100%;
    }
    
    #navigation span.nav-header {
        padding: 10px 0;
    }
    
    ul.menu > li > span.separator:hover {
        /* box-shadow: 0px -3px 0px #97bed4 inset; */
        border-bottom: solid 1px #444d56;
    }
    
    ul.menu li ul.nav-child.unstyled.small li a, ul.menu li ul.nav-child.unstyled.small li span.separator {
        white-space: pre-wrap;
    }
    
    
    }
    
    
    
    
    
    @media screen and (max-width : 360px)  { /* iPhoneX */
    
    
        #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
            width: calc(100% - 100px);
        }
        
        #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
            width: calc(100% - 80px);
        }
        
        #navigation ul.menu li ul.nav-child.unstyled.small {
            width: calc(100% - 60px);
        }
    
        #navigation span.nav-header {
            font-size: 0.8rem;
        }
    }
    
    
    
    @media screen and (max-width : 350px)  { /* iPhone5 */
    
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        width: calc(100% - 85px);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small li ul, #navigation ul.menu li ul.nav-child.unstyled.small li ul.nav-child.unstyled.small {
        width: calc(100% - 70px);
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small {
        width: calc(100% - 55px);
    }
    
    #navigation span.nav-header {
        font-size: 0.8rem;
    }

    #navigation ul.nav.menu.mod-list {
        padding-top: 5em;
    }
    
    #navigation ul.menu li ul.nav-child.unstyled.small, #navigation ul.menu li ul.nav-child.unstyled.small li ul, #navigation ul.menu li ul.nav-child.unstyled.small li ul li ul {
        height: calc(100% - 10em);
        padding: 8em 20px;
    }
    
    span.navigoback {
        padding: 2px 15px 2px 45px;
        margin-bottom: 15px;
    }
    
    ul.menu li ul.nav-child.unstyled.small li a, ul.menu li ul.nav-child.unstyled.small li span.separator {
        padding: 7px 0;
        font-size: 0.7rem;
    }
    
    #newsslider {
        height: calc(100% - 4.5em);
    }

    #newsslider-edge {
        height: 1em;
    }
    
    
    }



  /* //////////////////////////////////////////////////////////// SLICK SLIDER //////////////////////////////////////////////////////////// */

  .slider {
    display: none;
 float: left;
 width: 100%;
 margin: 0px auto;
 top: 0px;
}

.slider p {
 -webkit-text-size-adjust:none; /* FIX PROBLEM FONT-SIZE ON OS SAFARI MOBILE */
}

.slick-initialized .slider {
 display: block; /* FIX PROBLEM BILDER WERDEN ERST ANGEZEIGT, WENN SIE FERTIG GELADEN SIND */
}

#slideshow-area .image {
 height: 100%;
}

#slideshow-area .introimage {
position: absolute;
width: 100%;
height: 100%;
top: 0;
background-size: cover;
background-position: center center;
z-index: 1;
}

.slick-slide {
margin: 0px 5px;
}

.carousel .slick-slide {
margin: 0px 5px;
}

.carousel .slick-list {
margin: 0px -10px 0px 2px;
}

.slick-slide img {
width: 100%;
}

.slick-prev:before,
.slick-next:before {
color: black;
}


.slick-slide {
transition: all ease-in-out .3s;
opacity: 1;
}

.slick-active {
opacity: 1;
}

.slick-current {
opacity: 1;
}




/* Slider */
.slick-slider
{
position: relative;

display: block;
box-sizing: border-box;

-webkit-user-select: none;
-moz-user-select: none;
 -ms-user-select: none;
     user-select: none;

-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
 touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}

.slick-list
{
position: relative;

display: block;
overflow: hidden;

padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
 -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
}

.slick-track {
position: relative;
top: 0;
left: 0;
display: flex;
align-items: center;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;

content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}

.slick-slide
{
display: none;
float: left;

height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;

height: auto;

border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}



/* Icons */
@font-face
{
font-family: 'slick';
font-weight: normal;
font-style: normal;

src: url('../css/fonts/slick.eot');
src: url('../css/fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('../css/fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;

position: absolute;
top: 50%;

display: block;

width: 25px;
height: 45px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);

cursor: pointer;

color: transparent;
border: none;
outline: none;
background: transparent;
z-index: 1;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}

.slick-prev:before {
content: '' !important;
background-image: url(../images/slider-arrow.svg);
background-size: contain;
background-repeat: no-repeat;
transform: rotate(180deg);
-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
width: 40px;
height: 40px;
top: 0;
left: 0;
position: absolute;
}
.slick-next:before {
content: '' !important;
background-image: url(../images/slider-arrow.svg);
background-size: contain;
background-repeat: no-repeat;
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
width: 40px;
height: 40px;
top: 0;
left: 0;
position: absolute;
}

.slick-prev
{
left: -25px;
}
.slideshow .slick-prev
{
left: 25px;
}
[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;
}
.slick-prev:before
{
content: '←';
}
[dir='rtl'] .slick-prev:before
{
content: '→';
}

.slick-next
{
right: -25px;
}
.slideshow .slick-next
{
right: 25px;
}
[dir='rtl'] .slick-next
{
right: auto;
left: -25px;
}
.slick-next:before
{
content: '→';
}
[dir='rtl'] .slick-next:before
{
content: '←';
}

/* Dots */
.slick-dotted.slick-slider
{
margin-bottom: 30px;
}

.slick-dots
{
position: absolute;
bottom: -25px;

display: block;

width: 100%;
padding: 0;
margin: 0;

list-style: none;

text-align: center;
}
.slick-dots li
{
position: relative;

display: inline-block;

width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;

cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;

display: block;

width: 20px;
height: 20px;
padding: 5px;

cursor: pointer;

color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before
{
font-family: 'slick';
font-size: 6px;
line-height: 20px;

position: absolute;
top: 0;
left: 0;

width: 20px;
height: 20px;

content: '•';
text-align: center;

opacity: .25;
color: black;

-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}






  /* //////////////////////////////////////////////////////////// SLICK LIGHTBOX //////////////////////////////////////////////////////////// */

  .slick-lightbox{position:fixed;top:0;left:0;z-index:9999;width:100%;height:100%;background:black;-webkit-transition:opacity 0.5s ease;transition:opacity 0.5s ease}.slick-lightbox .slick-loading .slick-list{background-color:transparent}.slick-lightbox .slick-prev{left:15px}.slick-lightbox .slick-next{right:15px}.slick-lightbox-hide{opacity:0}.slick-lightbox-hide.slick-lightbox-ie{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0)}.slick-lightbox-hide-init{position:absolute;top:-9999px;opacity:0}.slick-lightbox-hide-init.slick-lightbox-ie{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0)}.slick-lightbox-inner{position:fixed;top:0;left:0;width:100%;height:100%}.slick-lightbox-slick-item{text-align:center;overflow:hidden}.slick-lightbox-slick-item:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em}.slick-caption-bottom .slick-lightbox-slick-item .slick-lightbox-slick-item .slick-lightbox-slick-caption{position:absolute;bottom:0;left:0;text-align:center;width:100%;margin-bottom:20px}.slick-caption-dynamic .slick-lightbox-slick-item .slick-lightbox-slick-item .slick-lightbox-slick-caption{display:block;text-align:center}.slick-lightbox-slick-item-inner{display:inline-block;vertical-align:middle;max-width:90%;max-height:90%}.slick-lightbox-slick-img{margin:0 auto;display:block;max-width:90%;max-height:90%}.slick-lightbox-slick-caption{margin:10px 0 0;color:white}.slick-lightbox-close{position:absolute;top:15px;right:15px;display:block;height:20px;width:20px;line-height:0;font-size:0;cursor:pointer;background:transparent;color:transparent;padding:0;border:none}.slick-lightbox-close:focus{outline:none}.slick-lightbox-close:before{font-family:"slick";font-size:20px;line-height:1;color:white;opacity:0.85;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:'×'}


  img.slick-lightbox-slick-img {
      width: auto;
  }




  /* //////////////////////////////////////////////////////////// SWIPER //////////////////////////////////////////////////////////// */

/**
 * Swiper 5.3.1
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://swiperjs.com
 *
 * Copyright 2014-2020 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: February 8, 2020
 */

 @font-face {
    font-family: 'swiper-icons';
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal;
  }
  :root {
    --swiper-theme-color: #007aff;
  }
  .swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    /* Fix of Webkit flickering */
    z-index: 1;
  }
  .swiper-container-vertical > .swiper-wrapper {
    flex-direction: column;
  }
  .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
  }
  .swiper-container-android .swiper-slide,
  .swiper-wrapper {
    transform: translate3d(0px, 0, 0);
  }
  .swiper-container-multirow > .swiper-wrapper {
    flex-wrap: wrap;
  }
  .swiper-container-multirow-column > .swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column;
  }
  .swiper-container-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto;
  }
  .swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
  }
  .swiper-slide-invisible-blank {
    visibility: hidden;
  }
  /* Auto Height */
  .swiper-container-autoheight,
  .swiper-container-autoheight .swiper-slide {
    height: auto;
  }
  .swiper-container-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height;
  }
  /* 3D Effects */
  .swiper-container-3d {
    perspective: 1200px;
  }
  .swiper-container-3d .swiper-wrapper,
  .swiper-container-3d .swiper-slide,
  .swiper-container-3d .swiper-slide-shadow-left,
  .swiper-container-3d .swiper-slide-shadow-right,
  .swiper-container-3d .swiper-slide-shadow-top,
  .swiper-container-3d .swiper-slide-shadow-bottom,
  .swiper-container-3d .swiper-cube-shadow {
    transform-style: preserve-3d;
  }
  .swiper-container-3d .swiper-slide-shadow-left,
  .swiper-container-3d .swiper-slide-shadow-right,
  .swiper-container-3d .swiper-slide-shadow-top,
  .swiper-container-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
  }
  .swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  .swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  }
  /* CSS Mode */
  .swiper-container-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    /* For Firefox */
    -ms-overflow-style: none;
    /* For Internet Explorer and Edge */
  }
  .swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none;
  }
  .swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start;
  }
  .swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: x mandatory;
  }
  .swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: y mandatory;
  }
  :root {
    --swiper-navigation-size: 44px;
    /*
    --swiper-navigation-color: var(--swiper-theme-color);
    */
  }
  .swiper-button-prev, .swiper-button-next {
    position: absolute;
    bottom: 5px;
    width: 30px;
    height: 16px;
    margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color));
  }
  .swiper-button-prev.swiper-button-disabled,
  .swiper-button-next.swiper-button-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
  }
  .swiper-button-prev:after,
  .swiper-button-next:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
  }
  .swiper-button-prev:after,
  .swiper-container-rtl .swiper-button-next:after {
    content: 'prev';
  }
  .swiper-button-prev:after, .swiper-button-next:after {
    content: '' !important;
    background-image: url(../images/slider-arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    width: 30px;
    height: 16px;
    top: 0;
    left: 0;
    position: absolute;
  }
  
  .swiper-button-prev-2:after, .swiper-button-next-2:after, .swiper-button-prev-3:after, .swiper-button-next-3:after, .swiper-button-prev-7:after, .swiper-button-next-7:after, .swiper-button-prev-8:after, .swiper-button-next-8:after, .swiper-button-prev-9:after, .swiper-button-next-9:after {
    background-image: url(../images/slider-arrow-dark.svg);
  }
  
  .swiper-button-prev:after {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
  }
  .swiper-button-next:after,
  .swiper-container-rtl .swiper-button-prev:after {
    content: 'next';
  }
  
  .swiper-button-prev.swiper-button-white,
  .swiper-button-next.swiper-button-white {
    --swiper-navigation-color: #ffffff;
  }
  .swiper-button-prev.swiper-button-black,
  .swiper-button-next.swiper-button-black {
    --swiper-navigation-color: #000000;
  }
  .swiper-button-lock {
    display: none;
  }
  :root {
    /*
    --swiper-pagination-color: var(--swiper-theme-color);
    */
  }
  .swiper-pagination {
    position: relative;
    text-align: center;
    transition: 300ms opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    color: var(--white);
    font-size: 0.8rem;
  }
  .swiper-pagination.swiper-pagination-hidden {
    opacity: 0;
  }
  /* Common Styles */
  
  /* Bullets */
  .swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0;
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(0.33);
    position: relative;
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1);
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1);
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(0.66);
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(0.33);
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(0.66);
  }
  .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(0.33);
  }
  .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: 0.2;
  }
  button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }
  .swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
  }
  .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
  }
  .swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0px, -50%, 0);
  }
  .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block;
  }
  .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
  }
  .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: 200ms transform, 200ms top;
  }
  .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px;
  }
  .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
  }
  .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 200ms transform, 200ms left;
  }
  .swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 200ms transform, 200ms right;
  }
  /* Progress */
  .swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.25);
    position: absolute;
  }
  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
  }
  .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top;
  }
  .swiper-container-horizontal > .swiper-pagination-progressbar,
  .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
  }
  .swiper-container-vertical > .swiper-pagination-progressbar,
  .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
  }
  .swiper-pagination-white {
    --swiper-pagination-color: #ffffff;
  }
  .swiper-pagination-black {
    --swiper-pagination-color: #000000;
  }
  .swiper-pagination-lock {
    display: none;
  }
  /* Scrollbar */
  .swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1);
  }
  .swiper-container-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%;
  }
  .swiper-container-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%;
  }
  .swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0;
  }
  .swiper-scrollbar-cursor-drag {
    cursor: move;
  }
  .swiper-scrollbar-lock {
    display: none;
  }
  .swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  .swiper-zoom-container > img,
  .swiper-zoom-container > svg,
  .swiper-zoom-container > canvas {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
  .swiper-slide-zoomed {
    cursor: move;
  }
  /* Preloader */
  :root {
    /*
    --swiper-preloader-color: var(--swiper-theme-color);
    */
  }
  .swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s infinite linear;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent;
  }
  .swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff;
  }
  .swiper-lazy-preloader-black {
    --swiper-preloader-color: #000;
  }
  @keyframes swiper-preloader-spin {
    100% {
      transform: rotate(360deg);
    }
  }
  /* a11y */
  .swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
  }
  .swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out;
  }
  .swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
  }
  .swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none;
  }
  .swiper-container-fade .swiper-slide-active,
  .swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
  }
  .swiper-container-cube {
    overflow: visible;
  }
  .swiper-container-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
  }
  .swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none;
  }
  .swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0;
  }
  .swiper-container-cube .swiper-slide-active,
  .swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
  }
  .swiper-container-cube .swiper-slide-active,
  .swiper-container-cube .swiper-slide-next,
  .swiper-container-cube .swiper-slide-prev,
  .swiper-container-cube .swiper-slide-next + .swiper-slide {
    pointer-events: auto;
    visibility: visible;
  }
  .swiper-container-cube .swiper-slide-shadow-top,
  .swiper-container-cube .swiper-slide-shadow-bottom,
  .swiper-container-cube .swiper-slide-shadow-left,
  .swiper-container-cube .swiper-slide-shadow-right {
    z-index: 0;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
  }
  .swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.6;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index: 0;
  }
  .swiper-container-flip {
    overflow: visible;
  }
  .swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    z-index: 1;
  }
  .swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none;
  }
  .swiper-container-flip .swiper-slide-active,
  .swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
  }
  .swiper-container-flip .swiper-slide-shadow-top,
  .swiper-container-flip .swiper-slide-shadow-bottom,
  .swiper-container-flip .swiper-slide-shadow-left,
  .swiper-container-flip .swiper-slide-shadow-right {
    z-index: 0;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
  }

  



  /* //////////////////////////////////////////////////////////// POPUP VIDEO //////////////////////////////////////////////////////////// */

  /* Magnific Popup CSS */
.mfp-bg {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1042;
    overflow: hidden;
    position: fixed;
    background: #0b0b0b;
    opacity: 0.8; }
  
  .mfp-wrap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1043;
    position: fixed;
    outline: none !important;
    -webkit-backface-visibility: hidden; }
  
  .mfp-container {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    padding: 0 8px;
    box-sizing: border-box; }
  
  .mfp-container:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle; }
  
  .mfp-align-top .mfp-container:before {
    display: none; }
  
  .mfp-content {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 1045; }
  
  .mfp-inline-holder .mfp-content,
  .mfp-ajax-holder .mfp-content {
    width: 100%;
    cursor: auto; }
  
  .mfp-ajax-cur {
    cursor: progress; }
  
  .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: -moz-zoom-out;
    cursor: -webkit-zoom-out;
    cursor: zoom-out; }
  
  .mfp-zoom {
    cursor: pointer;
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in;
    cursor: zoom-in; }
  
  .mfp-auto-cursor .mfp-content {
    cursor: auto; }
  
  .mfp-close,
  .mfp-arrow,
  .mfp-preloader,
  .mfp-counter {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none; }
  
  .mfp-loading.mfp-figure {
    display: none; }
  
  .mfp-hide {
    display: none !important; }
  
  .mfp-preloader {
    color: #CCC;
    position: absolute;
    top: 50%;
    width: auto;
    text-align: center;
    margin-top: -0.8em;
    left: 8px;
    right: 8px;
    z-index: 1044; }
    .mfp-preloader a {
      color: #CCC; }
      .mfp-preloader a:hover {
        color: #FFF; }
  
  .mfp-s-ready .mfp-preloader {
    display: none; }
  
  .mfp-s-error .mfp-content {
    display: none; }
  
  button.mfp-close,
  button.mfp-arrow {
    overflow: visible;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    display: block;
    outline: none;
    padding: 0;
    z-index: 1046;
    box-shadow: none;
    touch-action: manipulation; }
  
  button::-moz-focus-inner {
    padding: 0;
    border: 0; }
  
  .mfp-close {
    width: 44px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 0;
    top: 0;
    text-decoration: none;
    text-align: center;
    opacity: 0.65;
    padding: 0 0 18px 10px;
    color: #FFF;
    font-style: normal;
    font-size: 28px;
    font-family: Arial, Baskerville, monospace; }
    .mfp-close:hover,
    .mfp-close:focus {
      opacity: 1; }
    .mfp-close:active {
      top: 1px; }
  
  .mfp-close-btn-in .mfp-close {
    color: #333; }
  
  .mfp-image-holder .mfp-close,
  .mfp-iframe-holder .mfp-close {
    color: #FFF;
    right: -6px;
    text-align: right;
    padding-right: 6px;
    width: 100%; }
  
  .mfp-counter {
    position: absolute;
    top: 0;
    right: 0;
    color: #CCC;
    font-size: 12px;
    line-height: 18px;
    white-space: nowrap; }
  
  .mfp-arrow {
    position: absolute;
    opacity: 0.65;
    margin: 0;
    top: 50%;
    margin-top: -55px;
    padding: 0;
    width: 90px;
    height: 110px;
    -webkit-tap-highlight-color: transparent; }
    .mfp-arrow:active {
      margin-top: -54px; }
    .mfp-arrow:hover,
    .mfp-arrow:focus {
      opacity: 1; }
    .mfp-arrow:before,
    .mfp-arrow:after {
      content: '';
      display: block;
      width: 0;
      height: 0;
      position: absolute;
      left: 0;
      top: 0;
      margin-top: 35px;
      margin-left: 35px;
      border: medium inset transparent; }
    .mfp-arrow:after {
      border-top-width: 13px;
      border-bottom-width: 13px;
      top: 8px; }
    .mfp-arrow:before {
      border-top-width: 21px;
      border-bottom-width: 21px;
      opacity: 0.7; }
  
  .mfp-arrow-left {
    left: 0; }
    .mfp-arrow-left:after {
      border-right: 17px solid #FFF;
      margin-left: 31px; }
    .mfp-arrow-left:before {
      margin-left: 25px;
      border-right: 27px solid #3F3F3F; }
  
  .mfp-arrow-right {
    right: 0; }
    .mfp-arrow-right:after {
      border-left: 17px solid #FFF;
      margin-left: 39px; }
    .mfp-arrow-right:before {
      border-left: 27px solid #3F3F3F; }
  
  .mfp-iframe-holder {
    padding-top: 40px;
    padding-bottom: 40px; }
    .mfp-iframe-holder .mfp-content {
      line-height: 0;
      width: 100%;
      max-width: 900px; }
    .mfp-iframe-holder .mfp-close {
      top: -40px; }
  
  .mfp-iframe-scaler {
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-top: 56.25%; }
    .mfp-iframe-scaler iframe {
      position: absolute;
      display: block;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
      background: #000; }
  
  /* Main image in popup */
  img.mfp-img {
    width: auto;
    max-width: 100%;
    height: auto;
    display: block;
    line-height: 0;
    box-sizing: border-box;
    padding: 40px 0 40px;
    margin: 0 auto; }
  
  /* The shadow behind the image */
  .mfp-figure {
    line-height: 0; }
    .mfp-figure:after {
      content: '';
      position: absolute;
      left: 0;
      top: 40px;
      bottom: 40px;
      display: block;
      right: 0;
      width: auto;
      height: auto;
      z-index: -1;
      box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
      background: #444; }
    .mfp-figure small {
      color: #BDBDBD;
      display: block;
      font-size: 12px;
      line-height: 14px; }
    .mfp-figure figure {
      margin: 0; }
  
  .mfp-bottom-bar {
    margin-top: -36px;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    cursor: auto; }
  
  .mfp-title {
    text-align: left;
    line-height: 18px;
    color: #F3F3F3;
    word-wrap: break-word;
    padding-right: 36px; }
  
  .mfp-image-holder .mfp-content {
    max-width: 100%; }
  
  .mfp-gallery .mfp-image-holder .mfp-figure {
    cursor: pointer; }
  
  @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
    /**
         * Remove all paddings around the image on small screen
         */
    .mfp-img-mobile .mfp-image-holder {
      padding-left: 0;
      padding-right: 0; }
    .mfp-img-mobile img.mfp-img {
      padding: 0; }
    .mfp-img-mobile .mfp-figure:after {
      top: 0;
      bottom: 0; }
    .mfp-img-mobile .mfp-figure small {
      display: inline;
      margin-left: 5px; }
    .mfp-img-mobile .mfp-bottom-bar {
      background: rgba(0, 0, 0, 0.6);
      bottom: 0;
      margin: 0;
      top: auto;
      padding: 3px 5px;
      position: fixed;
      box-sizing: border-box; }
      .mfp-img-mobile .mfp-bottom-bar:empty {
        padding: 0; }
    .mfp-img-mobile .mfp-counter {
      right: 5px;
      top: 3px; }
    .mfp-img-mobile .mfp-close {
      top: 0;
      right: 0;
      width: 35px;
      height: 35px;
      line-height: 35px;
      background: rgba(0, 0, 0, 0.6);
      position: fixed;
      text-align: center;
      padding: 0; } }
  
  @media all and (max-width: 900px) {
    .mfp-arrow {
      -webkit-transform: scale(0.75);
      transform: scale(0.75); }
    .mfp-arrow-left {
      -webkit-transform-origin: 0;
      transform-origin: 0; }
    .mfp-arrow-right {
      -webkit-transform-origin: 100%;
      transform-origin: 100%; }
    .mfp-container {
      padding-left: 6px;
      padding-right: 6px; } }

      



  /* //////////////////////////////////////////////////////////// COUNTDOWN PRESAISON //////////////////////////////////////////////////////////// */

  @import url("https://fonts.googleapis.com/css2?family=Red+Hat+Text:wght@400;500;700&display=swap");
:root {
  --grayish-blue: hsl(237, 18%, 59%);
  --soft-red: hsl(345, 95%, 68%);
  --blue500: hsl(236, 21%, 26%);
  --blue600: hsl(235, 16%, 14%);
  --blue700: hsl(234, 17%, 12%);
}


.counter-wrapper .counter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-top: 3%;
  border-top: solid 1px var(--dark-gray);
  padding-top: 5%;
}
.counter-wrapper .header {
  font-family: var(--semibold-font);
  color: var(--border-color);
  text-align: center;
  font-size: min(max(0.75rem, 0.8vw), 0.8rem);
  letter-spacing: 0;
  word-spacing: 4px;
  text-transform: uppercase;
}
.counter-wrapper .count {
  color: var(--white);
  display: flex;
  justify-content: center;
  gap: 1vw;
  margin-bottom: 0vw;
}
.counter-wrapper .count .sec {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
}
.counter-wrapper .count .sec h2 {
  color: var(--border-color);
  font-size: 0.8vw;
  background: var(--light-gray);
  padding: 0.5vw 1.25vw;
  border-radius: 0.4vw;
  margin-top: 1em;
}
.counter-wrapper .count .sec p {
  font-size: min(max(0.5rem, 0.65vw), 0.65rem);
  text-transform: uppercase;
  color: var(--border-color);
  letter-spacing: 0.05vw;
}

#gamecenter-home .counter .buttons {
  margin-top: 1em;
}

#gamecenter-home .counter .buttons {
  display: none;
}


.counter a.button-filled.gamecenter {
  margin-right: 0;
  font-size: clamp(0.75em, 0.75vw, 0.75em);
}



  /* //////////////////////////////////////////////////////////// COUNTDOWN PRESAISON NEW //////////////////////////////////////////////////////////// */

#countdown-new {
    position: relative;
    z-index: 2;
    width: 80%;
    border-radius: 0;
    float: left;
    display: block;
    margin-left: 50%;
    transform: translate(-50%, 0);
    margin-top: 2em;
    margin-bottom: clamp(1em, 2%, 2em);
}

  @import url("https://fonts.googleapis.com/css2?family=Red+Hat+Text:wght@400;500;700&display=swap");
:root {
  --grayish-blue: hsl(237, 18%, 59%);
  --soft-red: hsl(345, 95%, 68%);
  --blue500: hsl(236, 21%, 26%);
  --blue600: hsl(235, 16%, 14%);
  --blue700: hsl(234, 17%, 12%);
}

.counter-wrapper-new .counter {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 10px 0 0;
}
.counter-wrapper-new .header {
    font-family: var(--semibold-font);
    color: var(--border-color);
    text-align: center;
    font-size: min(max(1rem, 1.2vw), 1.2rem);
    letter-spacing: 0;
    word-spacing: 4px;
    text-transform: uppercase;
}
.counter-wrapper-new .count {
    color: var(--white);
    display: flex;
    justify-content: center;
    gap: clamp(2em, 6vw, 6em);
    margin-bottom: 0vw;
    margin-top: 0.5em;
}
.counter-wrapper-new .count .sec {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
}

.counter-wrapper-new .count .sec:after {
    content: "";
    position: absolute;
    top: clamp(5px, 2vw, 10px);
    right: -3vw;
    width: 1px;
    height: clamp(1em, 2vw, 2em);
    background-color: var(--border-color);
}

.counter-wrapper-new .count .sec:last-child:after {
    display: none;
}

.counter-wrapper-new .count .sec h2 {
    color: var(--border-color);
    font-size: min(max(1.5rem, 3vw), 3rem);
    background: transparent;
    padding: 0;
    border-radius: 0.4vw;
}
.counter-wrapper-new .count .sec p {
  font-size: min(max(0.5rem, 0.65vw), 0.65rem);
  text-transform: uppercase;
  color: var(--border-color);
  letter-spacing: 0.05vw;
}





      

  /* //////////////////////////////////////////////////////////// SQUADRA //////////////////////////////////////////////////////////// */


  .squadra-container {
    position: relative;
    display: block;
    float: left;
    width: 100%;
}

.squadra-container h3 {
    margin-bottom: 1em;
}

.squadra-image {
    height: clamp(12em, 16vw, 16em);;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.giocatore-head {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    overflow: hidden;
}

.giocatore-head .grid.cols-2 {
    grid-template-columns: 10em 1fr;
    grid-template-columns: clamp(8em, 12vw, 10em) 1fr;
    align-items: end;
}

.grid.cols-2.squadra {
    grid-template-columns: 4vw 1fr;
    grid-template-columns: clamp(2.8em, 4vw, 4em) 1fr;
    margin-top: 1em;
}

.giocatore-head  .gradient-bottom {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,283755+25,283755+88,283755+100&0+0,0.6+25,0.9+88,1+100 */
background: -moz-linear-gradient(top,  rgba(40,55,85,0) 0%, rgba(40,55,85,0.6) 25%, rgba(40,55,85,0.9) 88%, rgba(40,55,85,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(40,55,85,0) 0%,rgba(40,55,85,0.6) 25%,rgba(40,55,85,0.9) 88%,rgba(40,55,85,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(40,55,85,0) 0%,rgba(40,55,85,0.6) 25%,rgba(40,55,85,0.9) 88%,rgba(40,55,85,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00283755', endColorstr='#283755',GradientType=0 ); /* IE6-9 */

}


.giocatore-head .player-pagination {
    position: absolute;
    z-index: 2;
    bottom: 6%;
    left: 10%;
    list-style: none;
    color: var(--white);
    z-index: 6;
}

.player-pagination .pagenav {
    list-style: none;
    margin-top: 0;
}

.giocatore-head .pagenav .swiper-button-next {
    margin-left: 40px;
}

.giocatore-head .pagenav .swiper-button-prev {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.giocatore-head .gradient-bottom {
    height: 35%;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,283755+100&0+0,1+100 */
    background: -moz-linear-gradient(top,  rgba(70,105,170,0) 0%, rgba(70,105,170,0.5) 40%, rgba(52,77,128,0.65) 60%, rgba(5,22,56,0.95) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgba(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgb(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004669aa', endColorstr='#051638',GradientType=0 );
}

.player-pagination a, .player-pagination p {
    color: var(--white);
    font-size: min(max(0.65rem, 1.1vw), 1.1rem);
}

.player-pagination li.previous, .player-pagination li.next {
    margin-top: 30px;
}

.primasquadra .pagination {
    display: none;
}

.primasquadra a.goback {
    margin-top: 2em;
    position: absolute;
    top: -3em;
    left: 17px;
    white-space: nowrap;
    font-size: 0.8rem;
}

.primasquadra a.goback:after {
    content: '' !important;
    background-image: url(../images/slider-arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transform: rotate(180deg) translateY(50%);
    -ms-transform: rotate(180deg) translateY(50%);
    -webkit-transform: rotate(180deg) translateY(50%);
    width: 16px;
    height: 9px;
    top: 50%;
    left: -25px;
    position: absolute;
}

.giocatore-head .silhouette {
    position: absolute;
    bottom: 0;
    height: 80%;
    width: auto;
    right: 12%;
    z-index: 2;
}
.giocatore-head .silhouette img {
    position: relative;
    height: 100%;
    width: auto;
    z-index: 2;
}
.silhouette.shadow {
    z-index: 1;
}

.giocatore-head .silhouette.shadow {
    height: 80%;
    margin-right: -2%;
    opacity: 0.6;
}

.silhouette.shadow img {
    filter: grayscale(100%) brightness(0%) blur(30px);
    -webkit-filter: grayscale(100%) brightness(0%) blur(40px);
    z-index: 1;
}

.giocatore-head .player-buttons {
    position: absolute;
    right: 8%;
    bottom: 18%;
    z-index: 6;
}

.giocatore-head .button-filled {
    float: none;
}

.giocatore-head .button-filled.shop:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(0, -50%);
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/icon-shop.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.giocatore-head .button-filled.instagram:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(0, -50%);
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/icon-instagram.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.giocatore-facts {
    position: absolute;
    z-index: 6;
    top: 60%;
    left: 14%;
    transform: translate(0, -50%);
    width: 24em;
}

.giocatore-facts p, .giocatore-facts h3, .giocatore-facts h4, .giocatore-facts span {
    color: var(--white);
    margin: 0;
}

.giocatore-name-number {
    margin-bottom: 0.8em;
    margin-bottom: clamp(0.8em, 2vw, 2em);
}

.number {
    font-size: min(max(3rem, 7vw), 8rem);
    color: var(--white);
    font-family: var(--bold-font);
    line-height: 1;
    margin-top: -0.05em;
}

.squadra-number {
    font-size: min(max(1.2rem, 2vw), 2rem);
    color: var(--red);
    font-family: var(--bold-font);
    line-height: 1;
    margin-top: -0.05em;
}

.number span {
    position: absolute;
    font-size: 0.6em;
    left: -0.6em;
    font-family: var(--common-font);
}

.prename {
    font-size: min(max(1.0rem, 1.6vw), 1.6rem);
    color: var(--white);
    text-transform: uppercase;
    font-family: var(--bold-font);
    line-height: 1.2;
}

.squadra-prename {
    font-size: min(max(0.9rem, 1.6vw), 1.1rem);
    color: var(--border-color);
    text-transform: uppercase;
    font-family: var(--bold-font);
    line-height: 1.2;
}

.name {
    font-size: min(max(1.6rem, 3.4vw), 3.4rem);
    color: var(--white);
    text-transform: uppercase;
    font-family: var(--bold-font);
    line-height: 1.2;
    white-space: nowrap;
}

.squadra-name {
    font-size: min(max(1.2rem, 1.5vw), 1.5rem);
    color: var(--border-color);
    text-transform: uppercase;
    font-family: var(--bold-font);
    line-height: 1.2;
    white-space: nowrap;
}

.position {
    font-size: min(max(0.8rem, 1.3vw), 1.3rem);
    text-transform: uppercase;
    color: var(--white);
}


.giocatore-content-section {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    background: var(--border-color);
    color: var(--white);
}

.giocatore-content {
    position: relative;
    display: block;
    float: left;
    width: 80%;
    padding: 5% 10%;
}

.giocatore-content .grid.cols-2 {
    grid-template-columns: 1fr 22vw;
    grid-template-columns: 1fr clamp(10em, 22vw, 22em);
}

.giocatore-content h3 {
    color: var(--white);
    margin-bottom: 1em;
    margin-bottom: clamp(1em, 2vw, 2em);
}

.giocatore-content a {
    color: var(--white);
}

.giocatore-content .stats-entry {
    margin-top: 0;
    box-shadow: 8px 8px 8px 0px #151e2c inset, -8px -8px 8px 0px #24354d inset;
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    width: calc(86% - 1vw);
    width: calc(86% - clamp(0.4em, 1vw, 1em));
    padding: 5%;
    margin: 2%;
    border: solid 1px var(--active-blue);
}

.giocatore-content span.stats-value {
    font-family: var(--bold-font);
    font-size: min(max(1.8rem, 4vw), 4rem);
}

.giocatore-content .srcbild img {
    width: 15vw;
    min-width: 10em;
    max-width: 13em;
    width: clamp(10em, 15vw, 13em);
    height: auto;
}

.elitepro a {
    color: var(--white);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.elitepro img {
    margin-bottom: 0.5em;
}

#elitepro-frame {
    width: 90%;
    padding: 10px;
    height: 70vh;
}

#elitepro-frame iframe {
    overflow: scroll;
    height: 2000px;
}

a.fancybox-player {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.swiper-container.swiper6:before {
    content: "";
    position: absolute;
    width: 12vw;
    min-width: 6em;
    max-width: 12em;
    width: clamp(6em, 12vw, 12em);
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,283755+100&1+0,0+100 */
background: -moz-linear-gradient(left,  rgba(40,55,85,1) 0%, rgba(40,55,85,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(40,55,85,1) 0%,rgba(40,55,85,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(40,55,85,1) 0%,rgba(40,55,85,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#283755', endColorstr='#00283755',GradientType=1 ); /* IE6-9 */
}

.swiper-container.swiper6:after {
    content: "";
    position: absolute;
    width: 12vw;
    min-width: 6em;
    max-width: 12em;
    width: clamp(6em, 12vw, 12em);
    height: 100%;
    top: 0;
    right: 0;
    z-index: 2;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,283755+100&0+0,1+100 */
background: -moz-linear-gradient(left,  rgba(40,55,85,0) 0%, rgba(40,55,85,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(40,55,85,0) 0%,rgba(40,55,85,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(40,55,85,0) 0%,rgba(40,55,85,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00283755', endColorstr='#283755',GradientType=1 ); /* IE6-9 */

}

.swiper-container.swiper6 .swiper-controls {
    left: 0;
    width: 100%;
    height: 100%;
    transform: translate(0, -50%);
}

.swiper-container.swiper6 .swiper-button-prev, .swiper-container.swiper6 .swiper-button-next {
    position: absolute;
    bottom: auto;
    width: 30px;
    top: 50%;
    transform: translate(0, -50%);
    z-index: 3;
    margin-top: 0;
}

.swiper-container.swiper6 .swiper-button-prev {
    left: 2em;
}
.swiper-container.swiper6 .swiper-button-next {
    right: 2em;
}



@media screen and (max-width : 1400px)  {

    .giocatore-head .silhouette {
        right: 6%;
    }

    .giocatore-head .player-buttons {
        right: 3%;
    }

}


@media screen and (max-width : 1200px)  {

.squadra-image {
    height: 30vw;
    min-height: 10em;
    max-height: 30em;
    height: clamp(10em, 30vw, 30em);
}

.ascona-links, .ascona-instagram {
    width: 90%;
    padding: 5%;
}

}


@media screen and (max-width : 900px)  {

    /* ////// STARTSEITE ////// */

    #hcap-live-new .swiper-button-next {
        margin-right: 14px;
    }

    /* ////// UNTERSEITEN ////// */
   
    .giocatore-content .grid.cols-2 {
        grid-template-columns: 1fr;
    }

    .giocatore-head .silhouette {
    left: 50%;
    transform: translate(-50%, 0);
    right: auto;
}

.giocatore-head .player-pagination {
    bottom: 3%;
    left: auto;
    right: 10%;
}

.giocatore-facts {
    top: auto;
    left: 10%;
    transform: none;
    width: 24em;
    bottom: 3em;
}

.giocatore-head .gradient-bottom {
    height: 50%;
}

.giocatore-head .button-filled {
    bottom: 22%;
}

.primasquadra a.goback {
    left: -17px;
}

.giocatore-head .row-gap-1 {
    row-gap: 0;
}

}


@media screen and (max-width : 800px)  {

    .giocatore-facts {
        bottom: 10em;
    }

    .giocatore-head .player-buttons {
        bottom: 5em;
        left: 10%;
    }

    .giocatore-head .gradient-bottom {
        height: 55%;
        background: -moz-linear-gradient(top,  rgba(70,105,170,0) 0%, rgba(70,105,170,0.5) 40%, rgba(52,77,128,0.65) 60%, rgba(5,22,56,0.95) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgba(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(70,105,170,0) 0%,rgba(70,105,170,0.5) 40%,rgb(52,77,128,0.65) 60%,rgba(5,22,56,0.95) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004669aa', endColorstr='#051638',GradientType=0 );

    }

    .giocatore-head .silhouette {
        height: 87%;
    }

    .giocatore-head .player-pagination {
        bottom: 1.3em;
        left: 5%;
        width: 95%;
        right: auto;
    }

    .primasquadra a.goback {
        left: auto;
        right: 10%;
        margin-top: 0;
        top: 2.3em;
    }

}


@media screen and (max-width : 600px)  {

    .squadra-image {
        height: 65vw;
        min-height: 10em;
        max-height: 23em;
        height: clamp(10em, 65vw, 23em);
    }

}


      

  /* //////////////////////////////////////////////////////////// ASTA / AUKTION //////////////////////////////////////////////////////////// */



  /* ///// AUKTION ///// */
  
  #pjWrapperPHPAuction_theme1 .pjAs-head .btn-home {
    text-decoration: none;
    display: inline-block;
    background-color: var(--white) !important;
    color: var(--border-color) !important;
    border-color: var(--border-color) !important;
    border-radius: 30px;
    width: 35px !important;
    height: 35px !important;
    transition: all ease 0.5s;
    width: auto;
    font-family: var(--bold-font) !important;
    font-size: 0.9rem !important;
    font-size: min(max(0.65rem, 1.1vw), 0.9rem);
    text-align: center;
    text-transform: uppercase;
    hyphens: none;
    background-image: url(../images/icons/pj-home-blue.svg);
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
}


#pjWrapperPHPAuction_theme1 .input-group-addon {
    background-color: var(--white);
}

#pjWrapperPHPAuction_theme1 .pjAs-head .btn-home:hover {
    background-image: url(../images/icons/pj-home-white.svg);
    background-color: var(--border-color) !important;
}

#pjWrapperPHPAuction_theme1 .form-group .form-control {
    height: 43px;
    background-color: var(--white) !important;
    border: 1px solid #bcc1c7 !important;
    border-radius: 3px;
    color: #48494a;
    font-size: 16px;
    padding-right: 12rem;
}

#pjWrapperPHPAuction_theme1 .form-control {
    height: 36px !important;
    padding: 0px;
    background-color: var(--white) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--border-color);
    font-size: 14px;
}


#pjWrapperPHPAuction_theme1 .pjAsCategorySelector {
    text-decoration: none;
    margin: 0px 0;
    padding: 7px 0 !important;
    width: 100% !important;
    display: inline-block;
    border: solid 1px var(--active-blue) !important;
    border-radius: 30px;
    transition: all ease 0.5s;
    width: auto;
    font-family: var(--bold-font) !important;
    font-size: 14px !important;
    text-align: center;
    text-transform: uppercase;
    hyphens: none;
}

#pjWrapperPHPAuction_theme1 .form-group .input-group-addon {
    display: none;
}

#pjWrapperPHPAuction_theme1 .input-group-addon {
    color: #23426e;
}

#pjWrapperPHPAuction_theme1 .btn-default { 
    background-color: var(--white) !important;
    color: var(--border-color) !important;
    border-color: var(--border-color) !important;
    height: 35px !important;
    text-decoration: none;
    margin: 0px 5px;
    padding: 7px 15px !important;
    display: inline-block;
    border: solid 1px var(--active-blue) !important;
    border-radius: 30px;
    transition: all ease 0.5s;
    width: auto;
    font-family: var(--bold-font) !important;
    font-size: 14px !important;
    text-align: center;
    text-transform: uppercase;
    hyphens: none;
}

#pjWrapperPHPAuction_theme1 .btn-default.active {
    background-color: var(--border-color) !important;
    color: var(--white) !important;
}


.pjAs-btn-languages img {
    width: 18px;
}
#pjWrapperPHPAuction_theme1 .caret {
    margin-left: 2px;
}

#pjWrapperPHPAuction_theme1 .pjAs-btn-languages img {
    display: inline-block;
    margin-top: -2px !important;
    margin-right: 2px !important;
}

#pjWrapperPHPAuction_theme1 .badge {
    height: 30px !important;
    padding: 8px 11px 0 !important;
    font-size: 0.9rem !important;
    border-radius: 40px !important;
}

#pjWrapperPHPAuction_theme1 .pjButton-secondary {
    background-color: transparent !important;
    border-color: #192537 !important;
    font-size: 18px;
    padding: 0px 30px;
    font-family: var(--bold-font);
    color: #192537;
    text-transform: uppercase;
    border-radius: 50px;
    transition: all ease .5s;
    background-size: 300%;
    background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);
}

#pjWrapperPHPAuction_theme1 .pjButton-secondary:hover {
    color: #ffffff;
    border: none !important;
    background-position: 100%;
    transform: scale(1.05);
}

#pjWrapperPHPAuction_theme1 .btn-primary {
    border-color: var(--red) !important;
    background-color: var(--red) !important;
    height: 37px !important; 
    border-radius: 40px !important;
    padding: 8px 20px 0 !important;
    margin: 5px;
    font-family: var(--bold-font);
    font-weight: bold !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    transition: all ease .5s;
    background-size: 300%;
    background-image: linear-gradient(120deg, transparent 50%, rgba(70,105,170,1) 0%,rgba(30,45,75,1) 100%);


}

#pjWrapperPHPAuction_theme1 .btn-primary:hover {
    background-color: transparent;
    border: none !important;
    background-position: 100%;
    transform: scale(1.05);
}

#pjWrapperPHPAuction_theme1 .pjAs-bid-item-bids .pjAs-bid-placed {
    color: #23426e !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-bid-item-actions p a{
    color: #23426e !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-bid-item-actions p a:hover {
    color: #1A2644 !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-item-bade {
    border-color: #23426e !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-login-aside .pjAsMenuItem {
    color: #23426e !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-bid-item-name {
    font-size: 32px !important;
}

#pjWrapperPHPAuction_theme1 .btn-link {
    font-size: 15px;
    border-radius: 5px;
    padding: 3px 8px 3px;
    color: #4A545B;
}

#pjWrapperPHPAuction_theme1 .btn-link:hover {
    color: #23426e;
}

#pjWrapperPHPAuction_theme1 .pagination > li > a, #pjWrapperPHPAuction_theme1 .pagination > li > span {
    border-color: var(--border-color) !important;
    color: var(--border-color) !important;
}

#pjWrapperPHPAuction_theme1 .pjAs-head .dropdown-menu, #pjWrapperPHPAuction_theme1 .pagination > .active > a, #pjWrapperPHPAuction_theme1 .btn-home:hover, #pjWrapperPHPAuction_theme1 .pjAs-btn-languages.open .btn-default {
    color: var(--white) !important;
    background-color: var(--border-color);
}

#pjWrapperPHPAuction_theme1 .pagination > li > a:hover, #pjWrapperPHPAuction_theme1 .pagination > li > span:hover {
    color: var(--white) !important;
}

#pjWrapperPHPAuction_theme1 .btn:not(.btn-link):not(.btn-close) {
    border: 1px solid var(--border-color);
}

#pjWrapperPHPAuction_theme1 .pjButton-secondary {
    border-color: var(--border-color) !important;
    font-size: 14px !important;
    padding: 5px 30px !important;
}





@media screen and (max-width : 479px)  {

    #pjWrapperPHPAuction_theme1 .pjAs-head .pjAs-btn-languages {
        right: 15px !important;
        top: -104px !important;
    }

    #pjWrapperPHPAuction_theme1 .pjAsCategorySelector {
        font-size: 12px !important;
    }

    #pjWrapperPHPAuction_theme1 .btn-default {
        font-size: 12px !important;
    }

}






  /* //////////////////////////////////////////////////////////// RESPONSIVE //////////////////////////////////////////////////////////// */



  /*@media (prefers-color-scheme: dark) {

    .logo {
        display: none;
    }

    .logo.dark {
        display: block;
    }

    .hamburger .line1, .hamburger .line2, .hamburger .line1, .hamburger .line2, #sticky-fadein .hamburger .line1, #sticky-fadein .hamburger .line2 {
        background-color: var(--white);
    }

    body {
        background-color: var(--black);
    }

    .menu-text {
        color: var(--white);
    }

}*/



@media screen and (min-width : 2300px)  {

    img.sdh-mockup {
        right: 10vw;
    }

}


@media screen and (min-width : 1901px)  {
    a.hcaplive .bgimage {
        height: 15.1vw;
        min-height: 15em;
        max-height: 18.3em;
        height: clamp(15em, 15.1vw, 18.3em);
    }

    #hcap-live-new a.hcaplive .bgimage {
        height: 19.1vw;
        min-height: 17em;
        max-height: 22.3em;
        height: clamp(17em, 19.1vw, 22.3em);
    }

    span.label-neu {
        left: 12%;
    }

    .counter-wrapper .count .sec h2 {
        font-size: 1.5em;
        margin-top: 0.5em;
    }

    .counter-wrapper .count {
        gap: 1em;
    }

}


@media screen and (min-width : 1801px)  {

    #headnav, #gamecenter-home, #ranking-home {
        right: 7%;
    }

    .menu-wrapper.fadeup {
        right: 5%;
    }

    img.sdh-mockup {
        right: 7vw;
    }
    
    }
    



@media screen and (max-width : 1800px)  {

    /* ///// CONTAINER AND TYPO ///// */
    
    #sponsorslider {
        width: calc(94% - 36vw);
        width: calc(94% - clamp(15em, 36vw, 50em));
        left: calc(6% - 1em);
    }

    #hcap-live {
        margin: 0 0 0 calc(6% - 1em);
        width: calc(87% - 26vw);
        width: calc(calc(87% - 1em) - clamp(18em, 26vw, 35em));
    }

    .swiper-container.swiper1preview {
        left: calc(6% - 30px);
        width: 61%;
    }

    .fanzone-content {
        margin: 15% 5%;
    }

    #fanzone-new .fanzone-overlay {
        width: 70%;
    }

    #shop {
        width: 95%;
        padding: 4em 0 4em 5%;
        padding: clamp(3em, 10%, 15em) 0 clamp(4em, 10%, 15em) 5%;
    }

    
    /* ///// HEADER ///// */
    
    
    /* ///// NAVIGATION ///// */
    
    
    /* ///// SLIDER ///// */
    

    /* ///// STARTSEITE ///// */
    

    #hcap-live-new a.hcaplive .bgimage {
        height: 19.1vw;
        min-height: 17em;
        max-height: 22.3em;
        height: clamp(17em, 19.1vw, 22.3em);
    }

    #hcap-live-new .swiper-button-next {
        margin-right: -15px;
    }

    /* ///// UNTERSEITEN ///// */
    
    
    /* ///// FOOTER ///// */
    
    
    /* ///// DIVERSES ///// */
    
    }


@media screen and (max-width : 1600px)  {


/* ///// HEADER ///// */

    #fastlinks {
        margin: 0 3.4em 0 0;
    }

    #fastlinks ul.menu a {
        padding: 3px 36px 3px 15px;
        margin: 0 7px;
        font-size: 0.8rem;
    }

    #fastlinks ul.menu a.button-shop {
        padding: 2px 36px 2px 15px;
    }

    #fastlinks .button-filled {
        padding: 6px 36px 6px 15px;
        font-size: 0.8rem;
    }

    #fastlinks a.button-shop:before {
        right: 13px;
        width: 13px;
        height: 13px;
    }

    #fastlinks a.button-tickets:before {
        right: 14px;
        width: 14px;
        height: 12px;
    }

    #fastlinks a.button-red:before {
        right: 15px;
        width: 15px;
        height: 15px;
    }

    a.button-filled.readmore:before, .button-filled.readmore:before {
        right: 13px;
    }

    #language-switcher {
        margin: 0 1em 0 0;
    }

    .button-filled.fanzone-fastlink:before {
        right: 11px;
    }



/* ///// SLIDER ///// */

.swiper1preview-new .swiper-wrapper .swiper-slide {
    flex: 1 100%;
}

.newscaption-new {
    width: 48em;
}

.swiper-controls-new {
    margin-left: -28em;
}

.swiper1preview .swiper-slide {
    padding: 0 6px;
    margin: 0 6px;
}

#newsslider {
    height: calc(100% - 8em);
}

#newsslider-edge {
    height: 1.2em;
}

#gamecenter-home {
    bottom: 2em;
}

#sponsorslider .srcbild, #sponsorslider .srcbild img, #sponsorslider-new .srcbild, #sponsorslider-new .srcbild img {
    width: 4em;
}

.swiper-button-prev, .swiper-button-next {
    width: 25px;
    height: 15px;
}

.swiper-button-prev:after, .swiper-button-next:after {
    width: 25px;
    height: 14px;
}

#sponsorslider .swiper-button-next {
    margin-left: 40px;
}

#sponsorslider .swiper-slide {
    margin: 5px 0 15px;
}


/* ///// HOME ///// */

span.label-neu {
    left: 20%;
}


}



@media screen and (max-width : 1500px)  {

/* ///// CONTAINER AND TYPO ///// */



/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */



/* ///// STARTSEITE ///// */

.aufstellung-title.neu img.clublogo {
    top: 14px;
}

#fanzone-new .fanzone-bg {
    background-position: 75% 50%;
}

/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1400px)  {

/* ///// CONTAINER AND TYPO ///// */

.mainpartners {
    font-size: 0.65rem;
}

.date {
    padding: 0 10px;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */

.swiper1preview .date {
    display: block;
    margin-bottom: 0;
    font-size: 0.65rem;
}

.swiper1preview .swiper-slide {
    max-width: 100%;
    width: calc(50% - 41px) !important;
    margin: 3px 10px;
    padding: 0px 10px 3px;
    border-right: none;
    white-space: nowrap;
}

.swiper-container.swiper1preview {
    height: auto;
    width: 55%;
    bottom: 1.5em;
    left: calc(6% - 38px);
}

.swiper-container.swiper1preview .swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
}




/* ///// STARTSEITE ///// */

ul.tabs li {
    padding: 7px 30px 17px;
}

/* ///// UNTERSEITEN ///// */

.mute {
    right: 2em;
    width: 5em;
    height: 5em;
}

/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1300px)  {

/* ///// CONTAINER AND TYPO ///// */


.items-leading.clearfix, .article-leading, .giocatore-content, .article-leading-buttons {
    width: 90%;
    padding: 2em 5%;
    padding: clamp(2em, 4vw, 4em) 5%;
}

div#mccourt-galleria {
    width: 105%;
    padding: 5em 0 7em 5%;
    padding: clamp(5em, 7%, 7em) 0 clamp(5em, 7%, 7em) 5%;
    margin-left: -5%;
}

#team-filter {
    width: 90%;
    padding: 2% 5%;
}

.moduletable.immagine-squadra-giovanile {
    width: 90%;
    padding: 5% 5% 0%;
}

#schema-abbonamenti {
    width: 90%;
    padding: 0em 5%;
    padding: clamp(0em, 4vw, 4em) 5%;
}


/* ///// HEADER ///// */

#headnav {
    position: absolute;
    z-index: 1006;
    right: 4em;
}

.logo span {
    white-space: pre-wrap;
    left: 0;
    transform: none;
    width: 75px;
    margin-top: 1vw;
}

.menu-wrapper.fadeup {
    right: 2em;
}


#fastlinks ul.menu a {
    padding: 3px 34px 3px 13px;
    margin: 0 6px;
}

#fastlinks .button-filled {
    margin: 0 6px;
}

div.mod-languages li {
    margin-left: 3px;
    margin-right: 3px;
}

#language-switcher div.mod-languages ul.lang-inline li:first-child:after {
    margin-left: 5px;
}

.top-bar {
    height: 42px;
}

#header-fadein {
    top: 42px;
}

#header-fadein.hidden {
    -webkit-transform: translateY(calc(-100% - 42px));
    -moz-transform: translateY(calc(-100% - 42px));
    -ms-transform: translateY(calc(-100% - 42px));
    -o-transform: translateY(calc(-100% - 42px));
    transform: translateY(calc(-100% - 42px));
}

.menu-wrapper.fadeup {
    top: 42px;
}

.top-bar-item span {
    font-size: 12px;
}

.gottardo-arena img {
    height: 26px;
    margin: 0 14px;
}

.top-bar-item img {
    height: 26px;
}


/* ///// NAVIGATION ///// */

.menu-wrapper {
    width: 70px;
}

#navigation .moduletable_menu {
    width: 53%;
}

ul.menu li span.separator:before {
    right: -15px;
    height: 11px;
    width: 6px;
}


/* ///// SLIDER ///// */

.swiper-container.swiper1preview {
    width: 62%;
}

/* ///// STARTSEITE ///// */

#gamecenter-home, #ranking-home {
    right: 2.8em;
}

.videopreview iframe, .youtube-video-place, img.play-youtube-video, .play-youtube-video {
    height: 19.5vw !important;
    height: clamp(90px, 19.5vw, 260px) !important;
}

#hcap-live-new .swiper-button-next, #hcap-live-new .swiper-button-prev {
    width: 40px;
    height: 40px;
}

#hcap-live-new .swiper-button-prev:after, #hcap-live-new .swiper-button-next:after {
    width: 20px;
    height: 11px;
}

#hcap-live-new .swiper-button-prev {
    margin-left: -26px;
}

#hcap-live-new .swiper-button-next {
    margin-right: -11px;
}

.fanzone-content, #fanzone-new .fanzone-content {
    width: 50%;
}

div#ranking-home-new {
    width: 350px;
    flex: 1 350px;
    margin-right: 2%;
}

#fanzone-new .fanzone-bg {
    background-position: 86% 50%;
}


/* ///// UNTERSEITEN ///// */

.roundshot {
    width: 90%!important;
    margin: 0 5%!important;
    margin-bottom: 10%!important;
}

.beitrag.abos {
    position: relative;
    float: left;
    width: 90%;
    margin: 0 5%;
}



/* ///// SCHEMA ///// */

.numero {
    width: 15px;
    height: 15px;
    font-size: 0.65rem;
}

.sektoren.presse, .sektorCurva, .eingang, .sektoren.sektorGuest, .sektoren.vip {
    font-size: 0.6rem;
}

.sektoren {
    font-size: 0.7rem;
}

.eingang.eingang1 {
    top: 29%;
    left: -4%;
}

.eingang:after {
    right: -14px;
    width: 10px;
    height: 7px;
}

.eingang.eingang2:after, .eingang.eingang4:after {
    left: -15px;
}

.eingang.eingang3:after {
    top: -10px;
}

.eingang.eingang2 {
    top: 10%;
    left: 86%;
}

.sektorCurva {
    top: 23%;
    left: 12%;
}

.sektorF {
    top: 17%;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1200px)  {

/* ///// CONTAINER AND TYPO ///// */

.parallaxParent {
    height: 50vw;
}


/* ///// HEADER ///// */

#language-switcher a {
    font-size: 0.8rem;
}

div.mod-languages li {
    margin-left: 2px;
    margin-right: 2px;
}

#language-switcher div.mod-languages ul.lang-inline li:first-child:after {
    margin-left: 4px;
}

.logo, .logo-85 {
    left: 3em;
}

/* ///// NAVIGATION ///// */


#navigation {
    width: calc(100% - 3em);
    padding: 20px 0 0 3em;
}

.logo-menu {
    left: 3em;
}

#slider-menu {
    width: 46%;
}

#navigation .moduletable_menu {
    width: calc(50% - 3em);
}

#menu-mccourt ul li {
    padding: 0 2em 0 0;
}

#menu-mccourt ul li a {
    font-size: 0.6em;
}

/* ///// SLIDER ///// */

.swiper-container.swiper1preview-new {
    width: 55em;
}

.newscaption-new {
    width: 40em;
}

.swiper-controls-new {
    margin-left: -23.5em;
}

/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 1100px)  {

/* ///// CONTAINER AND TYPO ///// */




/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */

.logo-menu {
    display: none;
}

#slider-menu {
    display: none;
}

#navigation .moduletable_menu {
    width: 100%;
    position: relative;
    transform: none;
    top: auto;
}

#navigation {
    padding: 0 0;
}

#navigation ul.menu li ul.nav-child.unstyled.small li a, #navigation ul.menu li ul.nav-child.unstyled.small li span.separator {
    font-size: min(max(0.9rem, 1vw), 1.1rem);
}

ul.menu li span.separator:before {
    right: 15px;
}

ul.menu a.extern:before {
    right: 11px;
}

#menu-socialmedia {
    display: none;
}

#menu-socialmedia.mobile {
    position: relative;
    display: block;
    width: 88%;
    bottom: auto;
    left: auto;
    margin-left: 6%;
    margin-bottom: 6%;
}

#menu-socialmedia h4 {
    font-size: 0.65rem;
}

.social-icons img {
    height: 13px;
}

#menu-adresse {
    position: relative;
    width: 88%;
    left: auto;
    bottom: auto;
    margin-left: 6%;
}

#menu-adresse a, #menu-adresse p {
    color: var(--white);
    font-size: 0.65rem;
}


/* ///// SLIDER ///// */

#newsslider {
    height: calc(100% - 7em);
}


#slideshow-area .introimage, #slideshow-area .image {
    height: 100%; /* Slider so hoch wie Bildschirm) */
    overflow: hidden; /* Slider so hoch wie Bildschirm) */
    position: absolute; /* Slider so hoch wie Bildschirm) */
    top: 0; /* Slider so hoch wie Bildschirm) */
    left: 0; /* Slider so hoch wie Bildschirm) */
    bottom: 0; /* Slider so hoch wie Bildschirm) */
    right: 0; /* Slider so hoch wie Bildschirm) */
}

#slider .moduletable, #slider .newsflash, .slider, #slider .slick-track, #slider .slick-slide, #slider #slideshow-area, #slider .slick-list.draggable {
    height: 100%; /* Slider so hoch wie Bildschirm) */
}

#slider .hintergrundbild {
    height: 100%; /* Slider so hoch wie Bildschirm) */
}

.swiper1preview {
    display: none;
}

.swiper-button-prev-3, .swiper-button-next-3 {
    display: none;
}

#sponsorslider .srcbild, #sponsorslider .srcbild img, #sponsorslider-new .srcbild, #sponsorslider-new .srcbild img {
    max-width: 5em;
    max-height: 5em;
}


/* ///// STARTSEITE ///// */

#gamecenter-home {
    width: clamp(20em, 26vw, 30em);
    bottom: 2em;
}

#ranking-home {
    width: clamp(20em, 26vw, 30em);
}

#sponsorslider {
    width: calc(96% - 36vw);
    width: calc(96% - clamp(27em, 36vw, 50em));
}

#multimedia {
    width: calc(100% - 2em);
    padding: clamp(3em, 7%, 7em) 1em;
}

#hcap-live-new .swiper-button-next {
    margin-right: 17px;
}

#socialhub {
    padding-left: 1em;
    padding-right: 1em;
    width: calc(100% - 2em);
}

.flockler-grid-item__wrapper {
    border-radius: 10px 10px 10px 10px !important;
}

.newsletter .col-4-2 {
    padding: 15%;
}

span.label-neu {
    font-size: min(max(0.75rem, 1vw), 1rem);
    left: 22%;
}

.fanzone-bg {
    position: relative;
}

#fanzone-new .fanzone-content {
    background: var(--border-color);
    width: 92%;
    padding: 1em 4%;
    position: relative;
    bottom: auto;
    margin: 0;
    left: auto;
    border-radius: 0px 0px 10px 10px;
    top: auto;
    transform: none;
}

#fanzone-new .fanzone-overlay {
    display: none;
}

#fanzone-new .fanzone-bg {
    background-image: url(../images/HCAP_AreaTifosi_Campagna_Home_Web_mobile.jpg);
    background-position: center center;
    height: 15em;
    border-radius: 10px 10px 0 0;
}


#fanzone-new .fanzone-year {
    width: 10%;
    height: 29%;
}

/* ///// UNTERSEITEN ///// */

.silhouette.hideonmobile {
    display: none;
}

.text-duke img.paolo {
    position: absolute;
    left: 5%;
    height: 80%;
    bottom: 0;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

a.lightbox {
    width: 2em;
    height: 2em;
    right: 2em;
    bottom: 2em;
}

}


@media screen and (max-width : 1000px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */

div#menu-mccourt {
    display: none;
}




/* ///// SLIDER ///// */

#sponsorslider {
    width: calc(94% - 36vw);
    width: calc(94% - clamp(24em, 36vw, 50em));
}

.swiper-container.swiper1preview-new {
    width: 45em;
}

.swiper1preview-new .swiper-slide {
    padding: 0 9px;
    margin: 0 5px;
}

.newscaption-new {
    width: 35em;
    margin-left: 4em;
}

.swiper-controls-new {
    margin-left: -19.5em;
}

.swiper-pagination .slices {
    font-size: 2.0rem;
    margin-right: 1.2em;
}

/* ///// STARTSEITE ///// */

.counter-wrapper-new .count .sec:after {
    top: 7px;
}


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 900px)  {


/* ///// CONTAINER AND TYPO ///// */

#main-col {
    width: 100% !important;
}

#left-col {
    width: 90% !important;
    margin: 15% 5% 0;
    padding: 0 !important;
}

.pagination {
    margin-left: 3%;
}

.button, a.button, p.button, a.readmore, button.goback, a.button-filled, .button-filled, input.send {
    padding: 7px 35px 7px 15px;
}

.button:before, a.button:before, p.button:before, a.readmore:before, button.goback:before, input.send:before {
    right: 10px;
    width: 15px;
    height: 8px;
}

a.button.matchblatt:after {
    right: 12px;
}


/* ///// HEADER ///// */

#fastlinks {
    margin: 0 60px 0 0;
}

#fastlinks .moduletable {
    display: block;
}

#fastlinks ul.menu a.button-shop {
    display: none;
}

#fastlinks .moduletable.fastlink {
    display: none;
    margin-right: 20px;
}

#language-switcher {
    margin: 0 1em 0 0;
}

/* ///// NAVIGATION ///// */

#submenu .moduletable > ul.menu {
    justify-content: center;
    overflow-x: scroll;
}

#submenu .moduletable > ul.menu li.current a:before, #submenu .moduletable > ul.menu li.current a:after {
    height: 2px;
}

#submenu .moduletable > ul.menu li.current a.extern:before {
    height: 12px;
}

#submenu .moduletable > ul.menu li a, #subsubmenu .gamecenter ul li a, #submenu .moduletable > ul.menu ul.nav-child.unstyled.small li a {
    letter-spacing: 0.03rem;
}

.menu-wrapper.fadeup .menu-text {
    display: none;
}

.menu-wrapper.fadeup .burger {
    margin-top: 26px;
    margin-top: clamp(26px, 3.4vw, 28px);
}

/* ///// SLIDER ///// */

#sponsorslider .swiper-button-prev, #sponsorslider .swiper-button-next {
    bottom: 6px;
}


/* ///// STARTSEITE ///// */

.parallaxParent {
    height: 60vw;
}

#hcap-live {
    width: calc(100% - 2em);
    max-width: none;
    margin: 10% 1em 0;
}

#hcap-live-new .newsflash {
    margin-left: 1em;
}

#fanzone-new-container {
    width: calc(100% - 2em);
    padding: 5% 1em 0 1em;
}

#campagna {
    max-width: none;
}

#campagna .moduletable {
    width: calc(100% - 2em);
    margin: 0;
    padding: 5% 1em 0%;
}

#campagna .moduletable.desktop {
    display: none;
}

#campagna .moduletable.mobile {
    display: block;
}

.banner-container {
    width: calc(100% - 2em);
    padding: 5% 1em 2em;
    flex-wrap: wrap;
}

div#banner-big-1, div#banner-big-2 {
    width: calc(100% - 2em);
    padding: 0 1em 2em;
}

div#banner-small-1a, div#banner-small-1b, div#banner-small-2a, div#banner-small-2b {
    flex: 1 100%;
}

div#banner-small-1a, div#banner-small-2a {
    margin-right: 0;
    margin-bottom: 0.5em;
}


#banner1_a, #banner1_b {
    padding: 5% 1em;
    width: calc(100% - 2em);
}

div#banner-small-1a, div#banner-small-1b {
    margin-right: 0;
}

div#banner-small-1a, div#banner-small-1b, div#banner-small-1a img, div#banner-small-1b img, div#banner-small-2a img, div#banner-small-2b img, div#banner-small-1a video.bannervideo, div#banner-small-1b video.bannervideo, div#banner-small-2a video.bannervideo, div#banner-small-2b video.bannervideo, div#banner-big-1 .moduletable, div#banner-big-2 .moduletable, div#sporttipp, div#sporttipp div, div#sporttipp iframe, div#sporttipp body {
    border-radius: 5px;
}

.banner-container .srcbild {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    transform: none;
}

.moduletable.mysports a {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
}

.player-slider {
    width: 100%;
    margin: clamp(6em, 20%, 20em) 0 0 0;
    padding: 0 0 10%;
}

#players .giocatore-facts {
    width: 80%;
    margin: 0;
    margin-bottom: 0;
    bottom: auto;
    padding: 10% 10%;
    background: var(--light-gray);
}

#players .swiper-slide .silhouette {
    position: relative;
    height: 80vw;
    width: 100%;
    margin-left: 50%;
    bottom: auto;
    margin-top: -10%;
    transform: translate(-50%, 0);
    right: auto;
}

#players .silhouette img {
    margin-left: 50%;
    transform: translate(-50%, 0);
}

#players .silhouette.shadow {
    position: absolute;
    top: 5%;
    right: 0;
    z-index: 1;
    margin-left: 0;
    left: 55%;
}

#players .swiper-controls {
    top: 15%;
    left: 5%;
}

.shopware-products .swiper-container {
    width: 100%;
}

.shopware-products .swiper-controls {
    transform: none;
    bottom: -3em;
}

.mccourtgallery .swiper-container {
    width: 100%;
}

.mccourtgallery .swiper-controls {
    transform: none;
    bottom: -3em;
}

img.player-slider-shadow {
    position: absolute;
    margin: 0;
    bottom: 12%;
    z-index: 6;
    left: 50%;
    transform: translate(-50%, 0);
}

a.button-filled.playerprofile {
    position: relative;
    bottom: auto;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: 10%;
}

#players .number {
    top: 34%;
    font-size: min(max(4rem, 18vw), 12rem);
    left: 11%;
}

/* ////// COUNTDOWN ///// */

.counter-wrapper .header {
    font-size: 1rem;
}

.counter-wrapper .count {
    gap: 1rem;
    margin-bottom: 1rem;
}

.counter-wrapper .count .sec h2 {
    font-size: 2rem;
    padding: 1rem 2rem;
    border-radius: 1rem;
    margin-top: 2rem;
}

.counter-wrapper .count .sec p {
    font-size: 0.8rem;
    letter-spacing: 1px;
} 


/* ///// UNTERSEITEN ///// */

.news-container .pagination {
    margin-left: 5%;
}

.vertical-line {
    border-right: solid 0px var(--border-color);
}

video#mccourt-video {
    height: 35vh;
    min-height: 25em;
}

/* ///// SCHEMA ///// */

.eingang.eingang1 {
    top: 29%;
    left: -1%;
}

.eingang.eingang2 {
    top: 10%;
    left: 82%;
}

.sektorF {
    top: 15%;
    left: 67%;
}

/* ///// DIVERSES ///// */

}


@media screen and (max-width : 900px)  {

/* ///// CONTAINER AND TYPO ///// */


a.fancybox {
    width: 1.5em;
    height: 1.5em;
    right: 1.5em;
    bottom: 1.5em;
}

.newscaption h5 {
    font-size: min(max(1.6rem, 4.2vw), 4rem);
}



/* ///// HEADER ///// */

#header {
    padding: 20px 0 20px 0;
}

#container-header {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}


/* ///// NAVIGATION ///// */

#sticky {
    top: 40px;
}

#sticky-fadein {
    top: -37px;
}

#sticky-fadein.active {
    top: 37px;
}

/* ///// SLIDER ///// */

#newsslider {
    height: calc(100% - 7em);
}

#sponsorslider {
    width: 86%;
    left: 7%;
}


#sponsorslider .srcbild, #sponsorslider .srcbild img, #sponsorslider-new .srcbild, #sponsorslider-new .srcbild img {
    max-width: 4em;
    max-height: 4em;
}

.swiper-button-prev-3, .swiper-button-next-3 {
    display: block;
}

#hinweis .moduletable {
    top: 14%;
    width: 120px;
    height: 120px;
}

#hinweis p, #hinweis a {
    font-size: 0.8rem;
}

.newscaption {
    width: 50%;
    bottom: 3em;
    top: auto;
    left: 10%;
}

.swiper-controls {
    top: auto;
    bottom: 5.4em;
    left: 7%;
    height: auto;
}

#slider #newsslider .swiper-button-prev, #slider #newsslider .swiper-button-next {
    top: 5em;
}

#gamecenter-home {
    display: none;
}

#gamecenter-home.mobile {
    display: block;
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    width: calc(100% - 2em);
    max-width: none;
    padding: 0 1em;
    margin: 3em 0 0;
}

#ranking-home {
    width: calc(100% - 2em);
    max-width: none;
    right: auto;
    margin: 2em 1em;
    float: left;
}

#sponsorslider .swiper-container:before {
    display: none;
}


/* ///// STARTSEITE ///// */

.factsfigures .overview {
    -webkit-box-shadow: 0px 0px 10px 3px rgb(0 0 0 / 10%);
    box-shadow: 0px 0px 10px 3px rgb(0 0 0 / 10%);
}


/* ///// UNTERSEITEN ///// */

.text-duke {
    width: 90%;
    padding: 0 5%;
}

.text-duke img.paolo {
    left: 0;
}


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

a.scrolltotop {
    width: 35px;
    height: 29px;
}

}



@media screen and (max-width : 800px)  {

#socialhub .moduletable.desktop {
    display: none;
}

#socialhub .moduletable.mobile {
    display: block;
}

#socialhub {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

span.label-neu {
    left: 18%;
}

#submenu .item-302 ul.nav-child.unstyled.small, #submenu .item-291 ul.nav-child.unstyled.small {
    display: none!important;
}

.mobile-nav-button {
    display: block;
}

/* ///// SLIDER ///// */

.swiper-container.swiper1preview-new {
    display: none;
}

.newscaption-new {
    left: 50%;
    width: 86%;
    margin-left: 0;
    padding: 0;
    border-left: none;
    top: auto;
    bottom: 28em;
}

.swiper-controls-new {
    top: auto;
    bottom: 25em;
    height: auto;
    transform: none;
    left: 7%;
    margin-left: 0;
}


/* ///// STARTSEITE ///// */

#hcap-live-new .swiper-button-next {
    margin-right: 14px;
    right: 15%;
}

#hcap-live-new .swiper-button-prev {
    margin-left: 0;
    left: auto;
    right: 15%;
    margin-right: 14px;
    margin-top: -75px;
}

#fanzone-new .fanzone-bg {
    height: 14em;
}

/* SPORTTIPP mit Spezialformat */
div#banner-big-1 .moduletable, div#banner-small-1b, div#banner-big-1, div#sporttipp, div#sporttipp div, div#sporttipp iframe, div#sporttipp body {
    height: auto !important;
    max-height: 100%;
}

}



@media screen and (max-width : 700px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */

/* ///// NAVIGATION ///// */

.menu-wrapper {
    height: 70px;
}

.menu-wrapper.fadeup {
    right: 1.5em;
}

.burger {
    width: 32px;
}

.burger span:before {
    margin: -4px 0 0;
    height: 4px;
    width: 32px;
}

.burger span:after {
    width: 32px;
}

.menu-text {
    top: -34px;
    height: 15px;
}

.menu-text p, .menu-text p.close {
    font-size: 8px;
    letter-spacing: 3px;
}

#fastlinks {
    margin: 0 40px 0 0;
}

/* ///// SLIDER ///// */


/* ///// STARTSEITE ///// */

.fanzone-content {
    padding: 15% 5%;
    width: 90%;
    margin: 0;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4669aa+0,375082+100 
background: rgb(70,105,170); 
background: -moz-linear-gradient(top,  rgba(70,105,170,1) 0%, rgba(55,80,130,1) 100%); 
background: -webkit-linear-gradient(top,  rgba(70,105,170,1) 0%,rgba(55,80,130,1) 100%); 
background: linear-gradient(to bottom,  rgba(70,105,170,1) 0%,rgba(55,80,130,1) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#375082',GradientType=0 ); */

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#283755+0,1a2537+100 */
background: rgb(40,55,85); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(45,73,121,1) 0%, rgba(26,37,55,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(45,73,121,1) 0%,rgba(26,37,55,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(45,73,121,1) 0%,rgba(26,37,55,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#283755', endColorstr='#1a2537',GradientType=0 ); /* IE6-9 */

}

.fanzone-overlay {
    /*width: 100%;
    height: 60%;
    background: -moz-linear-gradient(top,  rgba(70,105,170,1) 0%, rgba(55,80,130,1) 79%, rgba(55,80,130,0) 100%); 
    background: -webkit-linear-gradient(top,  rgba(70,105,170,1) 0%,rgba(55,80,130,1) 79%,rgba(55,80,130,0) 100%); 
    background: linear-gradient(to bottom,  rgba(70,105,170,1) 0%,rgba(55,80,130,1) 79%,rgba(55,80,130,0) 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4669aa', endColorstr='#00375082',GradientType=0 ); */
    display: none;
}

.fanzone-bg {
    width: 100%;
    position: relative;
    height: 70vw;
    float: left;
}

#fanzone-new-container {
    flex-wrap: wrap;
}

div#fanzone-new {
    width: 100%;
    flex: 1 100%;
    margin-top: 2em;
    margin-bottom: 2em;
}

div#ranking-home-new {
    width: 100%;
    flex: 1 100%;
    margin-right: 0;
    margin-bottom: 1em;
}

#fanzone-new .fanzone-bg {
    height: 23em;
}

#fanzone-new .fanzone-content {
    position: relative;
}

.sdh-banner .sdh-content {
    position: relative;
    width: 50%;
    margin: 0;
    top: auto;
    transform: none;
    padding: 10% 6%;
}


/* ///// UNTERSEITEN ///// */

.text-duke img.paolo {
    position: relative;
    left: 0;
    height: auto;
    bottom: 0;
    width: 80%;
}

.header-landingpage h2 {
    max-width: 80%;
}

.mute {
    right: 2em;
    width: 4em;
    height: 4em;
}

/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


@media screen and (max-width : 600px)  {

/* ///// CONTAINER AND TYPO ///// */

.button, a.button, p.button, a.readmore, button.goback, a.button-filled, .button-filled {
    padding: 7px 35px 7px 15px;
}

.button:before, a.button:before, p.button:before, a.readmore:before, button.goback:before {
    right: 11px;
    width: 17px;
    height: 10px;
}

a.button-filled.registry:before, a.button-filled.fanzone:before, a.button-filled.fanzone-fastlink:before, .button-filled.fanzone:before, .button-filled.fanzone-fastlink:before, .button-filled.shop:before, .button.whiteline.newsletter:before, a.button.whiteline.newsletter:before, .giocatore-head .button-filled.shop:before, .giocatore-head .button-filled.instagram:before, a.button.email:before, a.button.download:before {
    right: 11px;
}

a.button-filled.youtube:before, a.button-filled.playerprofile:before, a.button-filled.reservieren:before, .button:before, a.button:before, p.button:before, a.readmore:before, button.goback:before, button.extern:before, a.button.extern:before, p.button.extern:before, a.readmore.extern:before, button.extern.goback:before {
    right: 9px;
}

.overview .bgimage {
    height: clamp(10em, 50vw, 20em);
}

.bild-frame {
    height: clamp(10em, 50vw, 20em);
}

/* ///// HEADER ///// */

.logo, .logo-85 {
    top: 3em;
    left: 1.5em;
}

.menu-wrapper.fadeup {
    right: 0.5em;
}

#headnav {
    right: 2.4em;
    top: 3.5em;
}

#fastlinks .moduletable.fastlink {
    margin-right: 5px;
}

#fastlinks a.button-filled, #fastlinks .button-filled {
    margin: 0 10px 0 15px;
    padding: 5px 30px 5px 12px;
}

a.button-filled.fanzone-fastlink:before, .button-filled.fanzone-fastlink:before {
    width: 14px;
    height: 14px;
}

#language-switcher div.mod-languages ul {
    line-height: 1;
}

#campagna .moduletable {
    padding: 5% 1em 5%;
}

.top-bar {
    height: 34px;
}


#header-fadein {
    top: 34px;
}

#header-fadein.hidden {
    -webkit-transform: translateY(calc(-100% - 34px));
    -moz-transform: translateY(calc(-100% - 34px));
    -ms-transform: translateY(calc(-100% - 34px));
    -o-transform: translateY(calc(-100% - 34px));
    transform: translateY(calc(-100% - 34px));
}

.menu-wrapper.fadeup {
    top: 34px;
}

.top-bar-item img {
    height: 20px;
}

.gottardo-arena img {
    height: 24px;
    margin: 0 0px;
}

.top-bar-item span {
    font-size: 12px;
    margin-right: 12px;
    hyphens: none;
    word-break: keep-all;
    white-space: nowrap;
}

.gottardo-arena {
    margin: 0 20px;
}

.girls {
    position: relative;
    margin-right: 10px;
}

.giovani {
    position: relative;
    margin-left: 10px;
}


/* ///// NAVIGATION ///// */

#language-switcher {
    margin: 3px 0.5em 0 0;
}

#fastlinks {
    margin: 0 30px 0 0;
}

#fastlinks ul.menu a {
    font-size: 0.7rem;
    letter-spacing: 0.5px;
}

#fastlinks a.button-tickets:before, #fastlinks a.button-tickets-red:before {
    right: 9px;
    width: 15px;
    height: 13px;
}

/* ///// SLIDER ///// */


#sponsorslider .srcbild, #sponsorslider .srcbild img, #sponsorslider-new .srcbild, #sponsorslider-new .srcbild img {
    width: 4em;
}


#slider-new {
    /*height: 46em;*/
    overflow: visible;
}


/* ///// STARTSEITE ///// */


.newsletter-content {
    position: relative;
    top: auto;
    left: auto;
    z-index: 2;
    transform: none;
    text-transform: uppercase;
    padding: 10%;
}

.newsletter .col-4-2 {
    padding: 10%;
}

.newsletter .col-1-3 {
    min-height: auto;
}

#hcap-live-new .swiper-button-next, #hcap-live-new .swiper-button-prev {
    display: none;
}

.newsletter-image {
    border-radius: 10px 10px 0 0;
}


/* ///// COUNTDOWN ///// */

.counter-wrapper .count .sec h2 {
    font-size: 1.25rem;
    padding: 15px 20px;
    border-radius: 1rem;
    margin-top: 1rem;
}

.counter-wrapper .header {
    font-size: 0.9em;
}

.counter-wrapper .count {
    gap: 0.5em;
    margin-bottom: 1rem;
}

.counter-wrapper .count .sec p {
    font-size: 0.75em;
    letter-spacing: 2px;
}


/* ///// UNTERSEITE ///// */

.article-leading.staff .moduletable {
    float: left;
    width: 100%;
    margin: 0 0 15%;
}

.staff h3 {
    margin: 0 0 1em 0;
}


/* ///// SCHEMA ///// */

.eingang:after {
    right: 0;
    width: 10px;
    height: 7px;
    top: auto;
}

.eingang.eingang2:after, .eingang.eingang4:after {
    left: 0;
    top: -5px;
}

.eingang.eingang2 {
    top: 15%;
    left: 84%;
    width: 46px;
}

.eingang.eingang1 {
    top: 26%;
    left: 5%;
    width: 43px;
}

.eingang.eingang4 {
    top: 72%;
    left: 83%;
    width: 55px;
}

.sektorO {
    top: 19.8%;
    left: 6.5%;
}

.sektorF {
    top: 17%;
}

/* ///// FOOTER ///// */

#footer, #footer-home {
    width: 80%;
    padding: 35% 10% 15% 10%;
}

a.footer-logo {
    width: 18vw;
    min-width: 6em;
    max-width: 7em;
    width: clamp(6em, 18vw, 7em);
}

/* ///// DIVERSES ///// */

ul.repeatable-2 li {
    flex: 1 100%;
}

ul.repeatable-2 li, ul.repeatable-3 li, ul.repeatable-4 li {
    padding: 1%;
}

}


@media screen and (max-width : 500px)  {

/* ///// CONTAINER AND TYPO ///// */

.center {
    text-align: left;
}

.parallaxParent {
    height: 80vw;
}

/* ///// HEADER ///// */


/* ///// NAVIGATION ///// */

.menu-text p, .menu-text p.close {
    letter-spacing: 2px;
}

/* ///// SLIDER ///// */

#newsslider-edge {
    height: 1.3em;
}

#newsslider {
    height: calc(100% - 5.5em);
}

.swiper-button-prev-3, .swiper-button-next-3 {
    display: none;
}

#sponsorslider .swiper-slide {
    margin: 0px 0;
}

#sponsorslider .srcbild, #sponsorslider .srcbild img, #sponsorslider-new .srcbild, #sponsorslider-new .srcbild img {
    width: 100%;
    max-width: 3em;
    max-height: 3em;
}

.swiper-controls {
    top: auto;
    bottom: 1.5em;
    height: auto;
    left: 7%;
}

#slider-new {
    margin-bottom: 4em;
}

#slider-new #newsslider-new .swiper-button-prev, #slider-new #newsslider-new .swiper-button-next {
    top: 3.5em;
}

#slider-new .swiper-pagination .slices {
    font-size: 1.4rem;
    margin-right: 1.7em;
}

.newscaption {
    left: 7%;
    width: 86%;
    margin-left: 0;
    padding: 0;
    border-left: none;
    top: auto;
    bottom: 6em;
}

/*
.newscaption-new {
    bottom: 25em;
}
*/

/* Neu */
.newscaption-new {
    bottom: 20em;
}
/* Neu */

/*
.swiper-controls-new {
    bottom: 23em;
}
*/

/* Neu */
.swiper-controls-new {
    bottom: 17em;
}
/* Neu */

#slider #newsslider .swiper-button-prev, #slider #newsslider .swiper-button-next {
    top: 2em;
    left: 6em;
}

.swiper-button-prev, .swiper-button-next {
    width: 30px;
    height: 16px;
}

.swiper-button-prev:after, .swiper-button-next:after {
    width: 30px;
    height: 16px;
}

#gamecenter-home-new .swiper-button-prev, #gamecenter-home-new .swiper-button-next {
    width: 25px;
    height: 14px;
}

#gamecenter-home-new .swiper-button-prev:after, #gamecenter-home-new .swiper-button-next:after {
    width: 25px;
    height: 14px;
}


#slider #newsslider .swiper-button-next {
    margin-left: 55px;
}

.swiper-pagination .slices {
    font-size: 1.8rem;
    margin-top: 0px;
    margin-right: 1.2em;
}


/* ///// STARTSEITE ///// */

#gamecenter-home.mobile {
    margin: 1em 0 0;
}

.fanzone-bg {
    height: 90vw;
}

.fanzone-overlay {
    height: 70%;
}

#fanzone-new .fanzone-bg {
    height: 17em;
}

img.sdh-mockup {
    height: 65%;
    right: min(2vw, 4em);
    top: auto;
    bottom: -10%;
}

.sdh-banner .sdh-content {
    width: 88%;
    margin: 0 0 30% 0;
}

#multimedia .moduletable.mobile {
    display: block;
}

#multimedia .moduletable.desktop {
    display: none;
}

.shopware-products a.button-filled.shop {
    right: 5%;
    bottom: -4.5em;
    margin: 0;
}

#players .swiper-slide .silhouette {
    height: 100vw;
}

#players .number {
    top: 38%;
}

.shopware-products .swiper-slide.swiper-slide-active { /* Wichtig für halbe Ansicht des zweiten Artikels */
    min-width: 80%;
}

span.label-neu {
    left: 23%;
}

.games-container {
    position: relative;
    float: left;
    max-height: 100%;
    overflow: scroll;
}



/* ///// UNTERSEITEN ///// */

video#mccourt-video {
    height: auto;
    min-height: 100%;
    object-fit: contain;
}

.mute {
    top: 1em;
    right: 1em;
    width: 3em;
    height: 3em;
}

.audio-icon {
    width: 1.5em;
}


/* ///// SCHEMA ///// */

.livello0 {
    width: 115%;
    margin-left: 50%;
    transform: translate(-50%, 0);
}

.livello1 {
    width: 86%;
    left: auto;
    margin-left: 50%;
    transform: translate(-50%, 0);
}

.livello2 {
    width: 104%;
    left: auto;
    margin-left: 50%;
    transform: translate(-50%, 0);
    top: -1%;
}

.numero {
    width: 13px;
    height: 13px;
    font-size: 0.6rem;
}

.sektoren {
    font-size: 0.6rem;
}

.sektoren.presse, .sektorCurva, .eingang, .sektoren.sektorGuest, .sektoren.vip {
    font-size: 0.5rem;
}

img.icon-schema {
    width: 15px;
    height: 15px;
}

img.oneway1, img.oneway2 {
    width: 40px;
}

.eingang.eingang1 {
    top: 29%;
    left: 5%;
}

.mobile .banner {
    height: clamp(18rem, 30vw, 30rem);
    margin-bottom: 24rem;
}

.mobile .text {
    bottom: -24rem;
}

/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

.newsflash.newsuebersicht .overview {
    flex: 100%;
    padding: 5%;
}

}


@media screen and (max-width : 450px)  {

/* ///// CONTAINER AND TYPO ///// */


/* ///// HEADER ///// */

#heads-small {
    min-height: 6em;
    max-height: 12em;
    height: clamp(6em, 6vw, 8em);
}

.header-landingpage .ascona-logo {
    width: clamp(10rem, 16vw, 16rem);
}

.header-landingpage {
    height: clamp(20rem, 40vw, 40rem);
}

.gottardo-arena img {
    height: 18px;
    margin: 4px 0px;
}

.top-bar-item img {
    display: none;
}

.top-bar-item span {
    font-size: 10px;
    margin-right: 8px;
}


/* ///// NAVIGATION ///// */


/* ///// SLIDER ///// */

.mainpartners {
    font-size: 0.55rem;
}

/* ///// STARTSEITE ///// */


.sdh-banner .app-store {
    flex-direction: column;
}

img.app-store-img {
    width: 11em;
    margin-right: 0;
    margin-bottom: 0.5em;
}

/* ///// COUNTDOWN ///// */

.counter-wrapper .count .sec h2 {
    font-size: 1em;
    padding: 15px 15px;
    border-radius: 12px;
    margin-top: 1rem;
    min-width: 16px;
    text-align: center;
}

.counter-wrapper .count .sec p {
    font-size: 0.5em;
    letter-spacing: 1px;
}

.counter-wrapper .header {
    font-size: min(max(0.75rem, 0.9vw), 0.9rem);
    letter-spacing: 0px;
}


/* ///// UNTERSEITEN ///// */

.aufstellung-title.neu img.clublogo {
    top: 13px;
}

.aufstellung-right, .aufstellung-left {
    font-size: 0.9rem;
    width: 88%;
    padding: 6%;
}

.aufstellung td {
    padding: 0 3px;
}

/* ///// FOOTER ///// */

#sponsorslider-footer, #sponsorslider-footer-home {
    padding: 20% 5% 20%;
}

#footer, #footer-home {
    width: 80%;
    padding: 45% 10% 15% 10%;
}

/* ///// DIVERSES ///// */

}


@media screen and (max-width : 350px)  {

/* ///// CONTAINER AND TYPO ///// */

.button, a.button, p.button, a.readmore, button.goback, a.button-filled, .button-filled, input.send {
    padding: 7px 35px 7px 14px;
}

.button:before, a.button:before, p.button:before, a.readmore:before, button.goback:before, input.send:before {
    right: 12px;
    width: 15px;
    height: 8px;
}

button.btn.btn-default.share:before, button.btn.btn-default.feedback:before {
    left: 9px;
    height: 10px;
    width: 12px;
}

button.btn.btn-default.share, button.btn.btn-default.feedback {
    margin: 0 0 0 4px;
    padding: 4px 10px 4px 25px;
}


/* ///// HEADER ///// */

#heads h2 {
    font-size: 1.2rem;
}

.menu-wrapper {
    width: 55px;
}

#fastlinks {
    margin: 0 10px 0 0;
}

#fastlinks a.button-filled, #fastlinks .button-filled {
    margin: 0 7px 0 7px;
    padding: 5px 25px 5px 10px;
}

a.button-filled.fanzone-fastlink:before, .button-filled.fanzone-fastlink:before {
    width: 12px;
    height: 12px;
    right: 7px;
}


/* ///// NAVIGATION ///// */

#subsubmenu .gamecenter ul li a, #submenu ul.nav-child.unstyled.small li a {
    padding: 1.2em 0.4em;
    width: calc(100% - 0.8em);
}

/* ///// SLIDER ///// */



/* ///// STARTSEITE ///// */


/* ///// UNTERSEITEN ///// */


/* ///// FOOTER ///// */


/* ///// DIVERSES ///// */

}


/* NEW SLIDER FLAT SCREENS */

@media screen and (min-width: 2200px) and (min-aspect-ratio: 4/2) {

    .swiper-container.swiper1preview-new {
        top: 22%;
    }

    a.button.whiteline.allnewsbutton {
        margin-top: 2em;
    }

    .newscaption-new, .swiper-controls-new {
        top: 28%;
    }

}

@media screen and (min-width: 2200px)  and (min-aspect-ratio: 5/2) {

    #slider-new {
        height: 60em;
    }

}

@media screen and (min-width: 2200px)  and (max-height: 1000px) {

    #slider-new {
        height: 60em;
    }

}

@media screen and (max-width: 2199px) and (min-width: 800px) and (min-aspect-ratio: 1/1) {

    .swiper-container.swiper1preview-new {
        top: 25%;
    }

    a.button.whiteline.allnewsbutton {
        margin-top: 2em;
    }

    .newscaption-new, .swiper-controls-new {
        top: 28%;
    }

    #gamecenter-home-new {
        bottom: 4%;
    }

}

@media screen and (min-width: 2200px) and (min-aspect-ratio: 1/1) {

    .swiper-container.swiper1preview-new {
        top: 28%;
    }

}

@media screen and (max-width: 2199px) and (min-width: 500px) and (max-height: 950px) {

    #slider-new {
        height: 58em;
    }

    #gamecenter-home-new {
        bottom: 2em;
    }

}




/* SMARTPHONE QUER */
@media screen and (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {

    #slider, #slider .slider, #slideshow-area .image, #slider .hintergrundbild {
        height: 60vw;
        min-height: 30em;
    }
    #slider #newsslider .swiper-button-prev, #slider #newsslider .swiper-button-next {
        top: 4.8em;
    }
    
    .newscaption h5 {
    font-size: min(max(1.4rem, 3vw), 4rem);
}
    
.newscaption-new h5 {
font-size: min(max(1.4rem, 3vw), 4rem);
}
    
    }



@media screen and (min-width: 1025px) and (max-width: 2000px) and (max-height: 1080px) and (orientation: landscape) {

#newsslider {
    height: calc(100% - 8em);
}
#newsslider-edge {
    height: 1.2em;
}
#sponsorslider .srcbild img {
    width: 4em;
}
#gamecenter-home {
    bottom: 2em;
}

}



@media screen and (min-width: 1024px) and (max-height: 900px) and (orientation: landscape) {

    #slider .newscaption, #slider .swiper-controls, #slider .swiper-controls-new {
        top: 40%;
    }

    #slider .newscaption-new {
        top: 40%;
    }

    #heads {
        height: clamp(17em, 30vw, 30em);
    }

    .tab-content.current, .tab-content-2.current {
        padding: 3% 5%;
    }

    #gamecenter-home .gamescore {
        font-size: min(max(1.4rem, 1.6vw), 2.5rem);
    }

    .hometeam, .guestteam {
        min-height: clamp(1.4em, 1.7vw, 3em);
    }

    #gamecenter-home .guestteam img.clublogo {
        right: clamp(-16px, -2vw, -40px);
    }

    #gamecenter-home .hometeam img.clublogo {
        left: clamp(-16px, -2vw, -40px);
    }

    #gamecenter-home img.clublogo {
        height: clamp(44px, 3.6vw, 70px);
    }

    ul.tabs li, ul.tabs-2 li, ul.tabs-3 li {
        padding: 5px 30px 14px;
    }

    .items-leading.clearfix, .article-leading {
        padding: 2% 5%;
    }

    #subsubmenu .gamecenter ul li a, #submenu ul.nav-child.unstyled.small li a {
        padding: 0.8em 1em;
        font-size: min(max(0.6rem, 1.4vw), 1.4rem);
    }

}




@media screen and (min-width: 1100px) and (max-height: 1050px) and (orientation: landscape) {
    
 #newsslider {
    height: calc(100% - 6.5em);
}

.newscaption h5 {
    font-size: min(max(1.4rem, 2.5vw), 4rem);
}

.newscaption {
    width: 45%;
}

#sponsorslider .srcbild img {
    width: 3.8em;
}

#sponsorslider .swiper-slide {
    margin: 0px 0 15px;
}

#sponsorslider .swiper-button-prev:after, #sponsorslider .swiper-button-next:after {
    width: 20px;
    height: 10px;
}

.swiper1preview .swiper-slide {
    margin: 1px 10px;
}

#newsslider-edge {
    height: 1.0em;
}

#header-fadein .logo {
    width: clamp(2.9em, 4vw, 4em);
}

.menu-wrapper.fadeup .burger {
    margin-top: 21px;
    margin-top: clamp(21px, 1.7vw, 25px);
}

.logo-menu {
    width: clamp(3em, 6vw, 6em);
}

.items-leading.clearfix, .article-leading, .giocatore-content, .article-leading-buttons {
    width: 80%;
    padding: 2em 10%;
    padding: clamp(2em, 4vw, 4em) 10%;
}

.menu-wrapper.fadeup .burger {
    margin-top: 21px;
    margin-top: clamp(21px, 1.7vw, 25px);
}
 
}



@media screen and (min-width: 900px) and (max-height: 1099px) {
    


}