@charset "UTF-8";
html, body {
  width: 100%;
  height: 100%; }

body {
  visibility: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 400 !important;
  font-size: 16px !important; }
  body #page {
    max-width: 1200px;
    margin: 0 auto; }
    body #page > .sub-info {
      position: relative;
      background: white;
      height: 46px;
      width: 100%; }
      body #page > .sub-info .page-title {
        position: absolute;
        left: 11.3333333333%;
        top: 15px;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 16px !important;
        text-transform: uppercase;
        color: #00AFE6;
        letter-spacing: 1.5px; }
      body #page > .sub-info .breadcrumb {
        position: absolute;
        right: 10.3333333333%;
        top: 15px; }
        body #page > .sub-info .breadcrumb .mod_breadcrumb ul li {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 400 !important;
          font-size: 12px !important;
          float: left;
          letter-spacing: 1px; }
          body #page > .sub-info .breadcrumb .mod_breadcrumb ul li:after {
            content: ">";
            margin: 0 6px; }
          body #page > .sub-info .breadcrumb .mod_breadcrumb ul li.last:after {
            content: "";
            margin: 0; }
          body #page > .sub-info .breadcrumb .mod_breadcrumb ul li a {
            color: #4A4A4A; }
            body #page > .sub-info .breadcrumb .mod_breadcrumb ul li a:hover {
              color: #00AFE6; }
    body #page > .content {
      padding: 30px 0;
      background: #EDF0EF;
      background-image: url("/files/spangler/hintergrund/background.jpg");
      background-position: center bottom;
      background-repeat: no-repeat; }
    body #page > .content .float_right {
        float: right; }
    body #page > .content .float_left {
        float: left; }
    body #page > .content .flow {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between; }
      body #page > .content .teaser {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 78.3333333333%;
        margin: 0 auto;
        margin-bottom: 30px; }
        body #page > .content .teaser.t2 > div {
          position: relative;
          background: white;
          overflow: hidden;
          width: 455px;
          height: 200px; }
          body #page > .content .teaser.t2 > div .image {
            position: relative; }
            body #page > .content .teaser.t2 > div .image figure figcaption {
              text-transform: uppercase;
              letter-spacing: 1px;
              bottom: 4px; }
          body #page > .content .teaser.t2 > div .text {
            position: absolute;
            top: 0;
            right: 16px;
            width: 200px; }
            body #page > .content .teaser.t2 > div .text h1, body #page > .content .teaser.t2 > div .text h2, body #page > .content .teaser.t2 > div .text h3, body #page > .content .teaser.t2 > div .text h4, body #page > .content .teaser.t2 > div .text h5, body #page > .content .teaser.t2 > div .text h6 {
              font-family: 'Source Sans Pro', sans-serif;
              font-weight: 600 !important;
              font-size: 16px !important;
              background: transparent;
              color: #00AFE6;
              text-transform: uppercase;
              margin: 24px 0 10px; }
              body #page > .content .teaser.t2 > div .text h1:after, body #page > .content .teaser.t2 > div .text h2:after, body #page > .content .teaser.t2 > div .text h3:after, body #page > .content .teaser.t2 > div .text h4:after, body #page > .content .teaser.t2 > div .text h5:after, body #page > .content .teaser.t2 > div .text h6:after {
                content: " ";
                display: block;
                width: 20px;
                height: 1px;
                background: gray;
                margin-top: 10px; }
            body #page > .content .teaser.t2 > div .text p {
              color: #4A4A4A;
              font-family: 'Source Sans Pro', sans-serif;
              font-weight: 400 !important;
              font-size: 16px !important;
              line-height: 21px; }
              body #page > .content .teaser.t2 > div .text p .fade {
                position: absolute;
                bottom: 0;
                right: 0;
                height: 50px;
                width: 100%;
                background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));
                background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), white);
                background: -o-linear-gradient(top, rgba(255, 255, 255, 0), white);
                background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white); }
        body #page > .content .teaser.t4 > div {
          position: relative;
          background: white;
          overflow: hidden;
          width: 212px;
          height: 150px; }
          body #page > .content .teaser.t4 > div .mod_article h1, body #page > .content .teaser.t4 > div .mod_article h2, body #page > .content .teaser.t4 > div .mod_article h3, body #page > .content .teaser.t4 > div .mod_article h4, body #page > .content .teaser.t4 > div .mod_article h5, body #page > .content .teaser.t4 > div .mod_article h6 {
            position: absolute;
            z-index: 99;
            bottom: 0;
            left: 0;
            font-family: 'Source Sans Pro', sans-serif;
            font-weight: 700 !important;
            font-size: 16px !important;
            color: white;
            text-transform: uppercase;
            background: #00AFE6;
            padding: 8px 21px;
            letter-spacing: 1px; }
          body #page > .content .teaser.t4 > div .mod_article img {
            width: 100%;
            height: auto;
            -ms-transform: scale(1, 1) translate(0, 0);
            /* IE 9 */
            -webkit-transform: scale(1, 1) translate(0, 0);
            /* Safari */
            transform: scale(1, 1) translate(0, 0);
            -webkit-transition: -webkit-transform 0.5s;
            transition: -webkit-transform 0.5s;
            -o-transition: transform 0.5s;
            transition: transform 0.5s;
            transition: transform 0.5s, -webkit-transform 0.5s; }
          body #page > .content .teaser.t4 > div .mod_article:hover img {
            -ms-transform: scale(1.1, 1.1) translate(0, 0);
            /* IE 9 */
            -webkit-transform: scale(1.1, 1.1) translate(0, 0);
            /* Safari */
            transform: scale(1.1, 1.1) translate(0, 0); }
      body #page > .content .katalog {
        overflow: hidden;
        width: 78.3333333333%;
        margin: 0 auto;
        margin-bottom: 26px; }
        body #page > .content .katalog img {
          width: 100%;
          height: auto; }
      body #page > .content .gruende {
        position: relative;
        margin: 0 auto;
        margin-bottom: 26px;
        width: 78.3333333333%; }
        body #page > .content .gruende .mod_article {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-flow: row;
                  flex-flow: row;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
          -webkit-box-align: stretch;
              -ms-flex-align: stretch;
                  align-items: stretch;
          -webkit-box-pack: justify;
              -ms-flex-pack: justify;
                  justify-content: space-between;
          overflow: hidden;
          background: rgba(255, 255, 255, 0.9); }
          body #page > .content .gruende .mod_article .ce_headline {
            display: block;
            width: 100%;
            font-family: 'Source Sans Pro', sans-serif;
            font-weight: 600 !important;
            font-size: 32px !important;
            text-align: center;
            color: #00AFE6;
            margin: 14px 0 20px 0; }
            body #page > .content .gruende .mod_article .ce_headline:before, body #page > .content .gruende .mod_article .ce_headline:after {
              content: "";
              display: inline-block;
              height: 1px;
              width: 25%;
              background: #00AFE6;
              white-space: nowrap;
              -ms-transform: translate(0, -8px);
              /* IE 9 */
              -webkit-transform: translate(0, -8px);
              /* Safari */
              transform: translate(0, -8px); }
            body #page > .content .gruende .mod_article .ce_headline:before {
              margin-right: 2.1276595745%; }
            body #page > .content .gruende .mod_article .ce_headline:after {
              margin-left: 2.1276595745%; }
          body #page > .content .gruende .mod_article .ce_text {
            position: relative;
            width: 25.3%;
            margin: 0 4%;
            padding-bottom: 100px;
            text-align: justify; }
            body #page > .content .gruende .mod_article .ce_text:nth-child(2) figure img {
              margin-left: 24%; }
            body #page > .content .gruende .mod_article .ce_text:nth-child(3) figure img {
              margin-left: 32%; }
            body #page > .content .gruende .mod_article .ce_text:nth-child(4) figure img {
              margin-left: 34%; }
            body #page > .content .gruende .mod_article .ce_text h1, body #page > .content .gruende .mod_article .ce_text h2, body #page > .content .gruende .mod_article .ce_text h3, body #page > .content .gruende .mod_article .ce_text h4, body #page > .content .gruende .mod_article .ce_text h5, body #page > .content .gruende .mod_article .ce_text h6 {
              font-family: 'Source Sans Pro', sans-serif;
              font-weight: 700 !important;
              font-size: 16px !important;
              text-transform: uppercase;
              color: #00AFE6;
              margin: 10px 0;
              letter-spacing: 0.4px;
              text-align: left; }
            body #page > .content .gruende .mod_article .ce_text p {
              font-family: 'Source Sans Pro', sans-serif;
              font-weight: 400 !important;
              font-size: 16px !important;
              line-height: 24px;
              color: #4A4A4A;
              -webkit-hyphens: auto;
                  -ms-hyphens: auto;
                      hyphens: auto; }
              body #page > .content .gruende .mod_article .ce_text p a {
                position: absolute;
                bottom: 24px;
                display: block;
                width: 100%;
                text-align: center;
                font-family: 'Source Sans Pro', sans-serif;
                font-weight: 600 !important;
                font-size: 16px !important;
                color: white;
                background: #00AFE6;
                padding: 8px 0; }
                body #page > .content .gruende .mod_article .ce_text p a:hover {
                  background: #27bff2; }
      body #page > .newsletter {
        background: #EDF0EF;
        padding: 20px 0;
        text-align: center; }
        body #page > .newsletter p {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 16px !important;
          margin-bottom: 4px; }
          body #page > .newsletter p.small {
            margin: 0 0 10px 0;
            font-size: 12px !important;
            font-weight: 600 !important; }
        body #page > .newsletter > div {
          width: 50%;
          margin: 0 auto;
          overflow: hidden; }
          body #page > .newsletter > div .widget-text input {
            border-radius: 0 !important;
            border: 0 !important;
            text-align: center; }
          body #page > .newsletter > div .widget-text .widget-submit {
            width: 216px;
            margin-left: 12px; }
            body #page > .newsletter > div .widget-text .widget-submit button {
              padding: 14px 0;
              width: 100% !important;
              font-weight: 700;
              text-transform: uppercase; }
            body #page > .newsletter > div .widget-text .widget-submit div.grecaptcha-badge {
              z-index: 999; }
  body .invisible {
    display: none; }
  body figure {
    position: relative;
    margin: 0; }
    body figure figcaption {
      position: absolute;
      bottom: 6px;
      left: 0;
      color: white;
      background: #00AFE6;
      font-weight: 700 !important;
      padding: 8px 14px; }
  body ul {
    list-style-type: none; }
  body p, body ul, body h1, body h2, body h3, body h4, body h5, body h6 {
    margin: 0;
    padding: 0; }
  body a {
    text-decoration: none !important; }
    body a:link {
      color: #00AFE6; }
  body button {
    border-radius: 0 !important; }
    body button.blue {
      background: #00AFE6 !important; }
      body button.blue:hover {
        background: #27bff2 !important; }
  body p {
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto; }
  body strong {
    font-weight: 700;
    margin-left: 1px; }
  body em, body i {
    font-style: italic; }
  body hr {
    border: 1px solid #00AFE6;
    max-width: 940px;
    margin-left: 0;
    text-align: left; }
  body div.grau hr {
    border: 1px solid #4A4A4A; }
  body div.saison_motiv {
    background: transparent;
    background-image: url("/files/spangler/hintergrund/background.png"); }
  body .mod_article {
    clear: both; }
  body .ui.cookie.nag {
    position: fixed;
    top: auto;
    bottom: 0;
    background: #00AFE6; }
    body .ui.cookie.nag span {
      color: white;
      letter-spacing: 0.1em; }
      body .ui.cookie.nag span a {
        color: white;
        text-decoration: underline !important; }
    body .ui.cookie.nag > .close.icon {
      color: white;
      opacity: 0.8;
      font-size: 1.5em; }

body.no-image #page > .content {
  background-image: none; }

body.homepage #page > .content {
  padding: 30px 0 10px 0; }

.sidebar {
  background: #00AFE6; }
  .sidebar .logo {
    margin-top: 20px;
    text-align: center; }
  .sidebar nav {
    border-top: 1px solid white;
    margin-top: 10px; }
    .sidebar nav ul li {
      position: relative; }
      .sidebar nav ul li.active {
        background: #e10e1c !important; }
      .sidebar nav ul li a {
        display: block;
        width: 100%;
        color: white;
        border-bottom: 1px solid white;
        padding: 10px 20px; }
      .sidebar nav ul li .opener {
        display: none;
        position: absolute;
        right: 0;
        top: 4px;
        height: 30px;
        width: 30px; }
        .sidebar nav ul li .opener i {
          cursor: pointer;
          color: white;
          padding: 8px; }
        .sidebar nav ul li .opener.open i:before {
          content: "\f078" !important; }
      .sidebar nav ul li.submenu ul {
        display: none; }
      .sidebar nav ul li.submenu > .opener {
        display: block; }
      .sidebar nav ul li ul.open {
        display: block; }
        .sidebar nav ul li ul.open li {
          background: #009ecf; }
          .sidebar nav ul li ul.open li a {
            padding-left: 30px; }
        .sidebar nav ul li ul.open ul.open li {
          background: #0086b0; }
          .sidebar nav ul li ul.open ul.open li a {
            padding-left: 40px; }

header {
  position: relative;
  z-index: 99;
  height: 100px;
  background: -webkit-gradient(linear, left top, left bottom, from(#E0F4F9), to(white));
  background: -webkit-linear-gradient(top, #E0F4F9, white 100%);
  background: -o-linear-gradient(top, #E0F4F9, white 100%);
  background: linear-gradient(to bottom, #E0F4F9, white 100%);
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); }
  header div.hamburger {
    display: none;
    position: absolute;
    top: 10px;
    left: 10px;
    width: 30px;
    height: 30px; }
  header .logo {
    position: absolute;
    top: 13px;
    left: 8%; }
  header .topbar {
    position: absolute;
    z-index: 99;
    top: 0;
    right: 10.4166666667%;
    background: #BEEAF7;
    width: 456px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start; }
    header .topbar div {
      padding: 8px 0 10px 26px;
      background-repeat: no-repeat;
      background-position-y: 10px; }
    header .topbar .tel {
      padding: 0; }
      header .topbar .tel a {
        color: #4A4A4A;
        display: block;
        height: 38px;
        overflow: hidden;
        padding: 8px 0 10px 26px;
        background-repeat: no-repeat;
        background-position-y: 10px;
        background-image: url("/files/spangler/icons/telefon.svg"); }
    header .topbar .search {
      background-image: url("/files/spangler/icons/lupe.svg");
      cursor: pointer; }
    header .topbar .newsletter {
      background-image: url("/files/spangler/icons/mail.svg");
      background-position-y: 12px;
      cursor: pointer; }
    header .topbar + .search {
      position: absolute;
      top: -40px;
      right: 10.4166666667%;
      width: 456px;
      height: 40px;
      background: transparent;
      -webkit-transition: margin-top 0.4s;
      -o-transition: margin-top 0.4s;
      transition: margin-top 0.4s; }
      header .topbar + .search .ui.search {
        width: 100%; }
        header .topbar + .search .ui.search input {
          width: 100%;
          padding: 4px;
          border-color: #BEEAF7;
          border-radius: 0 !important; }
      header .topbar + .search.active {
        margin-top: 80px; }
  header .mainMenu {
    position: absolute;
    top: 58px;
    right: 9%; }

.mainMenu {
  background: transparent;
  height: auto; }
  .mainMenu nav ul {
    position: relative;
    right: -54px;
    width: 100%; }
    .mainMenu nav ul li {
      float: left;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 18px !important;
      text-transform: uppercase;
      border-bottom: 2px solid #00AFE6; }
      .mainMenu nav ul li:last-child {
        padding-right: 0; }
      .mainMenu nav ul li a {
        display: block;
        padding: 10px;
        color: #494949; }
        .mainMenu nav ul li a:hover {
          background-color: #00AFE6;
          color: white; }
      .mainMenu nav ul li.active > a, .mainMenu nav ul li.trail > a {
        background-color: #00AFE6;
        color: white; }
      .mainMenu nav ul li ul.level_2 {
        position: absolute;
        width: auto;
        right: auto;
        top: 38px;
        display: none;
        -webkit-box-shadow: 0 1px 3px #888;
                box-shadow: 0 1px 3px #888; }
        .mainMenu nav ul li ul.level_2 li {
          width: auto;
          float: none;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 400 !important;
          font-size: 16px !important;
          border-bottom: 0;
          padding: 0;
          text-transform: none;
          white-space: nowrap; }
          .mainMenu nav ul li ul.level_2 li a {
            display: block;
            padding: 10px;
            width: auto;
            background: white; }
            .mainMenu nav ul li ul.level_2 li a.active, .mainMenu nav ul li ul.level_2 li a.trail {
              color: #00AFE6; }
            .mainMenu nav ul li ul.level_2 li a:hover {
              background-color: #00AFE6;
              color: white; }
      .mainMenu nav ul li.busreisen ul.level_2 {
        display: none;
        background: white;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-flow: column;
                flex-flow: column;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        width: 600px;
        height: 204px;
        right: 54px;
        padding: 10px 10px 6px; }
        .mainMenu nav ul li.busreisen ul.level_2 li a {
          position: relative;
          padding: 12px; }
          .mainMenu nav ul li.busreisen ul.level_2 li a div:empty {
            position: absolute;
            top: 4px;
            left: 4px;
            width: 36px;
            height: 36px;
            background: white;
            border-radius: 20px !important; }
          .mainMenu nav ul li.busreisen ul.level_2 li a span {
            margin-left: 34px; }
        .mainMenu nav ul li.busreisen ul.level_2 li.active > a, .mainMenu nav ul li.busreisen ul.level_2 li.trail > a {
          background-color: #00AFE6;
          color: white; }
        .mainMenu nav ul li.busreisen ul.level_2 li.badereisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.badereisen div:empty {
          background-color: #DE7637;
          background-image: url("/files/spangler/icons/reisen/svg/badereisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.freizeitparks div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.freizeitparks div:empty {
          background-color: #009D7A;
          background-image: url("/files/spangler/icons/reisen/svg/freizeitparks.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.kurzreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.kurzreisen div:empty {
          background-color: #7FA51B;
          background-image: url("/files/spangler/icons/reisen/svg/kurzreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.musicals div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.musicals div:empty {
          background-color: #B71B54;
          background-image: url("/files/spangler/icons/reisen/svg/musicals.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.rundreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.rundreisen div:empty {
          background-color: #0092CE;
          background-image: url("/files/spangler/icons/reisen/svg/rundreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.staedtereisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.staedtereisen div:empty {
          background-color: #945F99;
          background-image: url("/files/spangler/icons/reisen/svg/staedtereisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.tagesfahrten div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.tagesfahrten div:empty {
          background-color: #00599A;
          background-image: url("/files/spangler/icons/reisen/svg/tagesfahrten.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.gruppenreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.gruppenreisen div:empty {
          background-color: #0E5E62;
          background-image: url("/files/spangler/icons/reisen/svg/gruppenreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.weihnachten div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.weihnachten div:empty {
          background-color: #C5112B;
          background-image: url("/files/spangler/icons/reisen/svg/weihnachten.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.wellness div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.wellness div:empty {
          background-color: #CF94B5;
          background-image: url("/files/spangler/icons/reisen/svg/wellness.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.silvester div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.silvester div:empty {
          background-color: #F2B600;
          background-image: url("/files/spangler/icons/reisen/svg/silvester.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.flugreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.flugreisen div:empty {
          background-color: #FFCC00;
          background-image: url("/files/spangler/icons/reisen/svg/flugreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.kreuzfahrten div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.kreuzfahrten div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/kreuzfahrten.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.hotel div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.hotel div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/hotel.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.family div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.family div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/family.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.studienreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.studienreisen div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/studienreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.fernreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.fernreisen div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/fernreisen.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.linienfluege div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.linienfluege div:empty {
          background-color: #22819F;
          background-image: url("/files/spangler/icons/reisen/svg/linienfluege.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.busanmietung div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.busanmietung div:empty {
          background-color: #CCC;
          background-image: url("/files/spangler/icons/reisen/svg/busanmietung.svg");
          background-size: 24px;
          background-repeat: no-repeat;
          background-position: center center; }
        .mainMenu nav ul li.busreisen ul.level_2 li.rundreisen div:empty,
        .mainMenu nav ul li.busreisen ul.level_2 li.active.rundreisen div:empty {
          background-size: 40px;
          background-position: center 2px; }
      .mainMenu nav ul li.busreisen:hover ul.level_2 {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
    .mainMenu nav ul li:hover ul.level_2 {
      display: block; }

body.homepage .mainMenu nav ul li {
  border-bottom: 0; }

body.homepage .mainMenu nav ul ul.level_2 {
  top: 36px; }

footer .logo {
  margin-top: 30px;
  text-align: center; }

footer .menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  margin: 0 auto;
  margin-top: 30px;
  width: 78.3333333333%; }
  footer .menu .f1, footer .menu .f2, footer .menu .f3, footer .menu .f4, footer .menu .f5, footer .menu .f6 {
    -ms-flex-item-align: start;
        align-self: flex-start; }
    footer .menu .f1 ul li, footer .menu .f2 ul li, footer .menu .f3 ul li, footer .menu .f4 ul li, footer .menu .f5 ul li, footer .menu .f6 ul li {
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 400 !important;
      font-size: 18px !important;
      text-transform: uppercase; }
      footer .menu .f1 ul li a, footer .menu .f1 ul li strong, footer .menu .f2 ul li a, footer .menu .f2 ul li strong, footer .menu .f3 ul li a, footer .menu .f3 ul li strong, footer .menu .f4 ul li a, footer .menu .f4 ul li strong, footer .menu .f5 ul li a, footer .menu .f5 ul li strong, footer .menu .f6 ul li a, footer .menu .f6 ul li strong {
        color: #494949; }
        footer .menu .f1 ul li a:hover, footer .menu .f1 ul li strong:hover, footer .menu .f2 ul li a:hover, footer .menu .f2 ul li strong:hover, footer .menu .f3 ul li a:hover, footer .menu .f3 ul li strong:hover, footer .menu .f4 ul li a:hover, footer .menu .f4 ul li strong:hover, footer .menu .f5 ul li a:hover, footer .menu .f5 ul li strong:hover, footer .menu .f6 ul li a:hover, footer .menu .f6 ul li strong:hover {
          color: #00AFE6; }
    footer .menu .f1 ul ul, footer .menu .f2 ul ul, footer .menu .f3 ul ul, footer .menu .f4 ul ul, footer .menu .f5 ul ul, footer .menu .f6 ul ul {
      margin-top: 10px; }
      footer .menu .f1 ul ul li, footer .menu .f2 ul ul li, footer .menu .f3 ul ul li, footer .menu .f4 ul ul li, footer .menu .f5 ul ul li, footer .menu .f6 ul ul li {
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 13px !important;
        text-transform: none;
        margin-bottom: 10px; }
  footer .menu .f3 {
    margin-left: -30px; }
  footer .menu .f6 {
  margin-left: -30px; }

footer .f7 {
  display: none; }
  footer .f7 nav {
    text-align: center; }
    footer .f7 nav ul {
      display: inline-block; }
      footer .f7 nav ul li {
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 13px !important;
        float: left;
        text-transform: none; }
        footer .f7 nav ul li a {
          color: #494949; }
        footer .f7 nav ul li:after {
          content: "•";
          margin: 0 6px; }
        footer .f7 nav ul li:last-child:after {
          content: none; }

footer .social {
  position: relative;
  margin: 0 auto 20px auto;
  width: 78.3333333333%;
  height: 40px;
  text-align: center; }
  footer .social div:empty {
    position: absolute;
    top: 20px;
    background: #969696;
    width: 100%;
    height: 2px; }
  footer .social .icons {
    position: relative;
    z-index: 99;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 160px;
    background: white;
    margin: 0 auto; }
    footer .social .icons a:first-child {
      margin-right: 10px; }

footer .toTheTop {
  text-align: center;
  margin: 0 auto 20px auto; }
  footer .toTheTop div {
    margin: 0 auto;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    cursor: pointer;
    width: 41px;
    height: 41px;
    background-image: url("/files/codiso/css/slider_nav_backward.svg") !important; }

.swiper {
  height: 500px;
  background: transparent;
  width: 100%; }
  .swiper .swiper-container {
    width: 100%;
    height: 100%; }
  .swiper .swiper-slide {
    position: relative;
    color: #fff;
    width: 100% !important;
    background: black; }
    .swiper .swiper-slide .image {
      position: absolute;
      width: 100%;
      height: 100%;
      /* For WebKit*/
      /* Mozilla*/
      /* Opera*/
      background-size: cover;
      /* Generic*/
      background-position: center;
      opacity: 0.8; }
    .swiper .swiper-slide .description {
      position: absolute;
      top: 216px;
      left: 10.8333333333%; }
      .swiper .swiper-slide .description h1, .swiper .swiper-slide .description h2 {
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); }
      .swiper .swiper-slide .description h1 {
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 36px !important;
        text-transform: uppercase;
        letter-spacing: 3px; }
      .swiper .swiper-slide .description h2 {
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 700 !important;
        font-size: 19px !important;
        font-style: italic;
        line-height: 24px; }
      .swiper .swiper-slide .description div:empty {
        background: #00AFE6;
        height: 2px;
        width: 56px;
        margin: 16px 0; }
    .swiper .swiper-slide .boxes {
      position: absolute;
      top: 376px;
      left: 10.8333333333%;
      width: 78.3333333333%; }
      .swiper .swiper-slide .boxes .begin-date-box,
      .swiper .swiper-slide .boxes .end-date-box,
      .swiper .swiper-slide .boxes .price-box {
        position: absolute;
        background: white;
        width: 212px;
        height: 90px; }
        .swiper .swiper-slide .boxes .begin-date-box .title,
        .swiper .swiper-slide .boxes .end-date-box .title,
        .swiper .swiper-slide .boxes .price-box .title {
          position: absolute;
          text-transform: uppercase;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 700 !important;
          font-size: 14px !important;
          color: #00AFE6;
          left: 14px;
          top: 14px; }
        .swiper .swiper-slide .boxes .begin-date-box .day,
        .swiper .swiper-slide .boxes .end-date-box .day,
        .swiper .swiper-slide .boxes .price-box .day {
          position: absolute;
          top: 48px;
          left: 14px;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 400 !important;
          font-size: 38px !important;
          color: #494949; }
        .swiper .swiper-slide .boxes .begin-date-box .month-year,
        .swiper .swiper-slide .boxes .end-date-box .month-year,
        .swiper .swiper-slide .boxes .price-box .month-year {
          position: absolute;
          top: 54px;
          left: 60px;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 400 !important;
          font-size: 21px !important;
          font-style: italic;
          color: #494949; }
        .swiper .swiper-slide .boxes .begin-date-box .price,
        .swiper .swiper-slide .boxes .end-date-box .price,
        .swiper .swiper-slide .boxes .price-box .price {
          position: absolute;
          top: 48px;
          left: 14px;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 700 !important;
          font-size: 36px !important;
          color: #00AFE6; }
      .swiper .swiper-slide .boxes .begin-date-box {
        left: 0; }
      .swiper .swiper-slide .boxes .end-date-box {
        left: 25.7446808511%; }
      .swiper .swiper-slide .boxes .price-box {
        left: 51.4893617021%; }
      .swiper .swiper-slide .boxes .buttons {
        position: absolute;
        left: 77.2340425532%;
        width: 214px;
        height: 90px; }
        .swiper .swiper-slide .boxes .buttons button {
          padding: 0;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 700 !important;
          font-size: 13px !important;
          text-transform: uppercase;
          display: block;
          height: 40px; }
          .swiper .swiper-slide .boxes .buttons button:first-child {
            margin-bottom: 10px; }
    .swiper .swiper-slide.standard .gradient {
      position: absolute;
      width: 100%;
      height: 100%;
      background: -webkit-linear-gradient(top, transparent 50%, rgba(0, 175, 230, 0.8) 100%);
      background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), to(rgba(0, 175, 230, 0.8)));
      background: -o-linear-gradient(top, transparent 50%, rgba(0, 175, 230, 0.8) 100%);
      background: linear-gradient(to bottom, transparent 50%, rgba(0, 175, 230, 0.8) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00afe6',GradientType=0 );
      mix-blend-mode: multiply; }
    .swiper .swiper-slide.standard .description {
      top: 150px; }
      .swiper .swiper-slide.standard .description h1 {
        display: inline-block;
        background: #00AFE6;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 700 !important;
        font-size: 36px !important;
        letter-spacing: 2px;
        text-shadow: none;
        line-height: 36px;
        margin-bottom: 10px;
        padding: 4px 8px;
        width: auto !important; }
      .swiper .swiper-slide.standard .description h2 {
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 30px !important;
        font-style: normal;
        margin-top: 70px; }
        .swiper .swiper-slide.standard .description h2 ul li {
          background-image: url("/files/spangler/icons/checkbox-checked.svg");
          background-position: left center;
          background-repeat: no-repeat;
          padding-left: 46px;
          line-height: 50px;
          letter-spacing: 1px; }
    .swiper .swiper-slide.standard .boxes .buttons button {
      position: absolute;
      bottom: 0;
      margin: 0; }
  .swiper .swiper-pagination-bullet {
    opacity: 0.5; }
  .swiper .swiper-pagination-bullet-active {
    opacity: 1; }
  .swiper .swiper-button-prev,
  .swiper .swiper-button-next {
    width: 41px;
    height: 41px;
    background-size: 41px 41px; }
  .swiper .swiper-button-prev {
    left: 20px;
    background-image: url("/files/codiso/css/slider_nav_backward.svg") !important; }
  .swiper .swiper-button-next {
    right: 20px;
    background-image: url("/files/codiso/css/slider_nav_forward.svg") !important; }
  .swiper .ui.dimmer .content .center {
    position: relative;
    cursor: pointer; }
    .swiper .ui.dimmer .content .center i.close.icon {
      position: absolute;
      top: 6px;
      right: 0px;
      z-index: 999;
      font-size: 3em; }
      .swiper .ui.dimmer .content .center i.close.icon:before {
        content: "\00d7" !important; }
      .swiper .ui.dimmer .content .center i.close.icon:hover {
        color: #00AFE6; }
    .swiper .ui.dimmer .content .center:hover i.close.icon {
      color: #00AFE6; }

.cookiebar {
  display: none;
  position: fixed;
  z-index: 99;
  top: auto;
  left: 0;
  bottom: 0;
  width: 100%;
  background: #00AFE6;
  text-align: center;
  padding: 20px; }
  .cookiebar span {
    color: white;
    letter-spacing: 0.1em; }
    .cookiebar span a {
      color: white;
      text-decoration: underline !important; }
  .cookiebar > .close.icon {
    position: absolute;
    top: 10px;
    right: 10px;
    color: white;
    opacity: 0.8;
    font-size: 1.5em; }

.cmu_template_search {
  background: transparent;
  -webkit-transition: margin-top 0.4s;
  -o-transition: margin-top 0.4s;
  transition: margin-top 0.4s; }
  .cmu_template_search .ui.search {
    width: 100%; }
    .cmu_template_search .ui.search input {
      width: 100%;
      padding: 4px;
      border-color: #BEEAF7;
      border-radius: 0 !important; }
  .cmu_template_search.active {
    margin-top: 40px !important; }

#u1632 {
  cursor: pointer; }

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
  padding: 0 0;
  display: inline-block;
  cursor: pointer;
  -webkit-transition-property: opacity, -webkit-filter;
  transition-property: opacity, -webkit-filter;
  -o-transition-property: opacity, filter;
  transition-property: opacity, filter;
  transition-property: opacity, filter, -webkit-filter;
  -webkit-transition-duration: 0.15s;
       -o-transition-duration: 0.15s;
          transition-duration: 0.15s;
  -webkit-transition-timing-function: linear;
       -o-transition-timing-function: linear;
          transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
    opacity: 0.7; }

.hamburger-box {
  width: 24px;
  height: 21px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -1.5px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 24px;
    height: 3px;
    background-color: #00AFE6;
    border-radius: 0;
    position: absolute;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: 0.15s;
         -o-transition-duration: 0.15s;
            transition-duration: 0.15s;
    -webkit-transition-timing-function: ease;
         -o-transition-timing-function: ease;
            transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -9px; }
  .hamburger-inner::after {
    bottom: -9px; }

/*
   * 3DX
   */
.hamburger--3dx .hamburger-box {
  -webkit-perspective: 48px;
          perspective: 48px; }

.hamburger--3dx .hamburger-inner {
  -webkit-transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {
    -webkit-transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dx.is-active .hamburger-inner {
  background-color: transparent;
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg); }
  .hamburger--3dx.is-active .hamburger-inner::before {
    -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
            transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--3dx.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
            transform: translate3d(0, -9px, 0) rotate(-45deg); }

/*
   * 3DX Reverse
   */
.hamburger--3dx-r .hamburger-box {
  -webkit-perspective: 48px;
          perspective: 48px; }

.hamburger--3dx-r .hamburger-inner {
  -webkit-transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .hamburger--3dx-r .hamburger-inner::before, .hamburger--3dx-r .hamburger-inner::after {
    -webkit-transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dx-r.is-active .hamburger-inner {
  background-color: transparent;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg); }
  .hamburger--3dx-r.is-active .hamburger-inner::before {
    -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
            transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--3dx-r.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
            transform: translate3d(0, -9px, 0) rotate(-45deg); }

/*
   * 3DY
   */
.hamburger--3dy .hamburger-box {
  -webkit-perspective: 48px;
          perspective: 48px; }

.hamburger--3dy .hamburger-inner {
  -webkit-transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .hamburger--3dy .hamburger-inner::before, .hamburger--3dy .hamburger-inner::after {
    -webkit-transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dy.is-active .hamburger-inner {
  background-color: transparent;
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg); }
  .hamburger--3dy.is-active .hamburger-inner::before {
    -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
            transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--3dy.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
            transform: translate3d(0, -9px, 0) rotate(-45deg); }

/*
   * 3DY Reverse
   */
.hamburger--3dy-r .hamburger-box {
  -webkit-perspective: 48px;
          perspective: 48px; }

.hamburger--3dy-r .hamburger-inner {
  -webkit-transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .hamburger--3dy-r .hamburger-inner::before, .hamburger--3dy-r .hamburger-inner::after {
    -webkit-transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dy-r.is-active .hamburger-inner {
  background-color: transparent;
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg); }
  .hamburger--3dy-r.is-active .hamburger-inner::before {
    -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
            transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--3dy-r.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
            transform: translate3d(0, -9px, 0) rotate(-45deg); }

/*
   * Arrow
   */
.hamburger--arrow.is-active .hamburger-inner::before {
  -webkit-transform: translate3d(-4.8px, 0, 0) rotate(-45deg) scale(0.7, 1);
          transform: translate3d(-4.8px, 0, 0) rotate(-45deg) scale(0.7, 1); }

.hamburger--arrow.is-active .hamburger-inner::after {
  -webkit-transform: translate3d(-4.8px, 0, 0) rotate(45deg) scale(0.7, 1);
          transform: translate3d(-4.8px, 0, 0) rotate(45deg) scale(0.7, 1); }

/*
   * Arrow Right
   */
.hamburger--arrow-r.is-active .hamburger-inner::before {
  -webkit-transform: translate3d(4.8px, 0, 0) rotate(45deg) scale(0.7, 1);
          transform: translate3d(4.8px, 0, 0) rotate(45deg) scale(0.7, 1); }

.hamburger--arrow-r.is-active .hamburger-inner::after {
  -webkit-transform: translate3d(4.8px, 0, 0) rotate(-45deg) scale(0.7, 1);
          transform: translate3d(4.8px, 0, 0) rotate(-45deg) scale(0.7, 1); }

/*
   * Arrow Alt
   */
.hamburger--arrowalt .hamburger-inner::before {
  -webkit-transition: top 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt .hamburger-inner::after {
  -webkit-transition: bottom 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt.is-active .hamburger-inner::before {
  top: 0;
  -webkit-transform: translate3d(-4.8px, -6px, 0) rotate(-45deg) scale(0.7, 1);
          transform: translate3d(-4.8px, -6px, 0) rotate(-45deg) scale(0.7, 1);
  -webkit-transition: top 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -o-transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

.hamburger--arrowalt.is-active .hamburger-inner::after {
  bottom: 0;
  -webkit-transform: translate3d(-4.8px, 6px, 0) rotate(45deg) scale(0.7, 1);
          transform: translate3d(-4.8px, 6px, 0) rotate(45deg) scale(0.7, 1);
  -webkit-transition: bottom 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -o-transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

/*
   * Arrow Alt Right
   */
.hamburger--arrowalt-r .hamburger-inner::before {
  -webkit-transition: top 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt-r .hamburger-inner::after {
  -webkit-transition: bottom 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt-r.is-active .hamburger-inner::before {
  top: 0;
  -webkit-transform: translate3d(4.8px, -6px, 0) rotate(45deg) scale(0.7, 1);
          transform: translate3d(4.8px, -6px, 0) rotate(45deg) scale(0.7, 1);
  -webkit-transition: top 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -o-transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

.hamburger--arrowalt-r.is-active .hamburger-inner::after {
  bottom: 0;
  -webkit-transform: translate3d(4.8px, 6px, 0) rotate(-45deg) scale(0.7, 1);
          transform: translate3d(4.8px, 6px, 0) rotate(-45deg) scale(0.7, 1);
  -webkit-transition: bottom 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  -o-transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
  transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

/*
   * Boring
   */
.hamburger--boring .hamburger-inner, .hamburger--boring .hamburger-inner::before, .hamburger--boring .hamburger-inner::after {
  -webkit-transition-property: none;
  -o-transition-property: none;
  transition-property: none; }

.hamburger--boring.is-active .hamburger-inner {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg); }
  .hamburger--boring.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0; }
  .hamburger--boring.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg); }

/*
   * Collapse
   */
.hamburger--collapse .hamburger-inner {
  top: auto;
  bottom: 0;
  -webkit-transition-duration: 0.13s;
       -o-transition-duration: 0.13s;
          transition-duration: 0.13s;
  -webkit-transition-delay: 0.13s;
       -o-transition-delay: 0.13s;
          transition-delay: 0.13s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--collapse .hamburger-inner::after {
    top: -18px;
    -webkit-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
    -o-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
  .hamburger--collapse .hamburger-inner::before {
    -webkit-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--collapse.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
          transform: translate3d(0, -9px, 0) rotate(-45deg);
  -webkit-transition-delay: 0.22s;
       -o-transition-delay: 0.22s;
          transition-delay: 0.22s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--collapse.is-active .hamburger-inner::after {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
    -o-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
  .hamburger--collapse.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg);
    -webkit-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Collapse Reverse
   */
.hamburger--collapse-r .hamburger-inner {
  top: auto;
  bottom: 0;
  -webkit-transition-duration: 0.13s;
       -o-transition-duration: 0.13s;
          transition-duration: 0.13s;
  -webkit-transition-delay: 0.13s;
       -o-transition-delay: 0.13s;
          transition-delay: 0.13s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--collapse-r .hamburger-inner::after {
    top: -18px;
    -webkit-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
    -o-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
  .hamburger--collapse-r .hamburger-inner::before {
    -webkit-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--collapse-r.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, -9px, 0) rotate(45deg);
          transform: translate3d(0, -9px, 0) rotate(45deg);
  -webkit-transition-delay: 0.22s;
       -o-transition-delay: 0.22s;
          transition-delay: 0.22s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--collapse-r.is-active .hamburger-inner::after {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
    -o-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
  .hamburger--collapse-r.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Elastic
   */
.hamburger--elastic .hamburger-inner {
  top: 1.5px;
  -webkit-transition-duration: 0.275s;
       -o-transition-duration: 0.275s;
          transition-duration: 0.275s;
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
       -o-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
          transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  .hamburger--elastic .hamburger-inner::before {
    top: 9px;
    -webkit-transition: opacity 0.125s 0.275s ease;
    -o-transition: opacity 0.125s 0.275s ease;
    transition: opacity 0.125s 0.275s ease; }
  .hamburger--elastic .hamburger-inner::after {
    top: 18px;
    -webkit-transition: -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.hamburger--elastic.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, 9px, 0) rotate(135deg);
          transform: translate3d(0, 9px, 0) rotate(135deg);
  -webkit-transition-delay: 0.075s;
       -o-transition-delay: 0.075s;
          transition-delay: 0.075s; }
  .hamburger--elastic.is-active .hamburger-inner::before {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s;
    opacity: 0; }
  .hamburger--elastic.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -18px, 0) rotate(-270deg);
            transform: translate3d(0, -18px, 0) rotate(-270deg);
    -webkit-transition-delay: 0.075s;
         -o-transition-delay: 0.075s;
            transition-delay: 0.075s; }

/*
   * Elastic Reverse
   */
.hamburger--elastic-r .hamburger-inner {
  top: 1.5px;
  -webkit-transition-duration: 0.275s;
       -o-transition-duration: 0.275s;
          transition-duration: 0.275s;
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
       -o-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
          transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  .hamburger--elastic-r .hamburger-inner::before {
    top: 9px;
    -webkit-transition: opacity 0.125s 0.275s ease;
    -o-transition: opacity 0.125s 0.275s ease;
    transition: opacity 0.125s 0.275s ease; }
  .hamburger--elastic-r .hamburger-inner::after {
    top: 18px;
    -webkit-transition: -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.hamburger--elastic-r.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, 9px, 0) rotate(-135deg);
          transform: translate3d(0, 9px, 0) rotate(-135deg);
  -webkit-transition-delay: 0.075s;
       -o-transition-delay: 0.075s;
          transition-delay: 0.075s; }
  .hamburger--elastic-r.is-active .hamburger-inner::before {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s;
    opacity: 0; }
  .hamburger--elastic-r.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -18px, 0) rotate(270deg);
            transform: translate3d(0, -18px, 0) rotate(270deg);
    -webkit-transition-delay: 0.075s;
         -o-transition-delay: 0.075s;
            transition-delay: 0.075s; }

/*
   * Emphatic
   */
.hamburger--emphatic {
  overflow: hidden; }
  .hamburger--emphatic .hamburger-inner {
    -webkit-transition: background-color 0.125s 0.175s ease-in;
    -o-transition: background-color 0.125s 0.175s ease-in;
    transition: background-color 0.125s 0.175s ease-in; }
    .hamburger--emphatic .hamburger-inner::before {
      left: 0;
      -webkit-transition: top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      transition: top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      -o-transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335); }
    .hamburger--emphatic .hamburger-inner::after {
      top: 9px;
      right: 0;
      -webkit-transition: top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      transition: top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      -o-transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  .hamburger--emphatic.is-active .hamburger-inner {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s;
    -webkit-transition-timing-function: ease-out;
         -o-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
    background-color: transparent; }
    .hamburger--emphatic.is-active .hamburger-inner::before {
      left: -48px;
      top: -48px;
      -webkit-transform: translate3d(48px, 48px, 0) rotate(45deg);
              transform: translate3d(48px, 48px, 0) rotate(45deg);
      -webkit-transition: left 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      -o-transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }
    .hamburger--emphatic.is-active .hamburger-inner::after {
      right: -48px;
      top: -48px;
      -webkit-transform: translate3d(-48px, 48px, 0) rotate(-45deg);
              transform: translate3d(-48px, 48px, 0) rotate(-45deg);
      -webkit-transition: right 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      -o-transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }

/*
   * Emphatic Reverse
   */
.hamburger--emphatic-r {
  overflow: hidden; }
  .hamburger--emphatic-r .hamburger-inner {
    -webkit-transition: background-color 0.125s 0.175s ease-in;
    -o-transition: background-color 0.125s 0.175s ease-in;
    transition: background-color 0.125s 0.175s ease-in; }
    .hamburger--emphatic-r .hamburger-inner::before {
      left: 0;
      -webkit-transition: top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      transition: top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      -o-transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335); }
    .hamburger--emphatic-r .hamburger-inner::after {
      top: 9px;
      right: 0;
      -webkit-transition: top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      transition: top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335);
      -o-transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
      transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in, -webkit-transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  .hamburger--emphatic-r.is-active .hamburger-inner {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s;
    -webkit-transition-timing-function: ease-out;
         -o-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
    background-color: transparent; }
    .hamburger--emphatic-r.is-active .hamburger-inner::before {
      left: -48px;
      top: 48px;
      -webkit-transform: translate3d(48px, -48px, 0) rotate(-45deg);
              transform: translate3d(48px, -48px, 0) rotate(-45deg);
      -webkit-transition: left 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      -o-transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }
    .hamburger--emphatic-r.is-active .hamburger-inner::after {
      right: -48px;
      top: 48px;
      -webkit-transform: translate3d(-48px, -48px, 0) rotate(45deg);
              transform: translate3d(-48px, -48px, 0) rotate(45deg);
      -webkit-transition: right 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      -o-transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
      transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }

/*
   * Slider
   */
.hamburger--slider .hamburger-inner {
  top: 1.5px; }
  .hamburger--slider .hamburger-inner::before {
    top: 9px;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: transform, opacity;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-timing-function: ease;
         -o-transition-timing-function: ease;
            transition-timing-function: ease;
    -webkit-transition-duration: 0.15s;
         -o-transition-duration: 0.15s;
            transition-duration: 0.15s; }
  .hamburger--slider .hamburger-inner::after {
    top: 18px; }

.hamburger--slider.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
          transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--slider.is-active .hamburger-inner::before {
    -webkit-transform: rotate(-45deg) translate3d(-3.4285714286px, -6px, 0);
            transform: rotate(-45deg) translate3d(-3.4285714286px, -6px, 0);
    opacity: 0; }
  .hamburger--slider.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -18px, 0) rotate(-90deg);
            transform: translate3d(0, -18px, 0) rotate(-90deg); }

/*
   * Slider Reverse
   */
.hamburger--slider-r .hamburger-inner {
  top: 1.5px; }
  .hamburger--slider-r .hamburger-inner::before {
    top: 9px;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: transform, opacity;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-timing-function: ease;
         -o-transition-timing-function: ease;
            transition-timing-function: ease;
    -webkit-transition-duration: 0.15s;
         -o-transition-duration: 0.15s;
            transition-duration: 0.15s; }
  .hamburger--slider-r .hamburger-inner::after {
    top: 18px; }

.hamburger--slider-r.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, 9px, 0) rotate(-45deg);
          transform: translate3d(0, 9px, 0) rotate(-45deg); }
  .hamburger--slider-r.is-active .hamburger-inner::before {
    -webkit-transform: rotate(45deg) translate3d(3.4285714286px, -6px, 0);
            transform: rotate(45deg) translate3d(3.4285714286px, -6px, 0);
    opacity: 0; }
  .hamburger--slider-r.is-active .hamburger-inner::after {
    -webkit-transform: translate3d(0, -18px, 0) rotate(90deg);
            transform: translate3d(0, -18px, 0) rotate(90deg); }

/*
   * Spring
   */
.hamburger--spring .hamburger-inner {
  top: 1.5px;
  -webkit-transition: background-color 0s 0.13s linear;
  -o-transition: background-color 0s 0.13s linear;
  transition: background-color 0s 0.13s linear; }
  .hamburger--spring .hamburger-inner::before {
    top: 9px;
    -webkit-transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spring .hamburger-inner::after {
    top: 18px;
    -webkit-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spring.is-active .hamburger-inner {
  -webkit-transition-delay: 0.22s;
       -o-transition-delay: 0.22s;
          transition-delay: 0.22s;
  background-color: transparent; }
  .hamburger--spring.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 9px, 0) rotate(45deg);
            transform: translate3d(0, 9px, 0) rotate(45deg); }
  .hamburger--spring.is-active .hamburger-inner::after {
    top: 0;
    -webkit-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 9px, 0) rotate(-45deg);
            transform: translate3d(0, 9px, 0) rotate(-45deg); }

/*
   * Spring Reverse
   */
.hamburger--spring-r .hamburger-inner {
  top: auto;
  bottom: 0;
  -webkit-transition-duration: 0.13s;
       -o-transition-duration: 0.13s;
          transition-duration: 0.13s;
  -webkit-transition-delay: 0s;
       -o-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spring-r .hamburger-inner::after {
    top: -18px;
    -webkit-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear;
    -o-transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear; }
  .hamburger--spring-r .hamburger-inner::before {
    -webkit-transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spring-r.is-active .hamburger-inner {
  -webkit-transform: translate3d(0, -9px, 0) rotate(-45deg);
          transform: translate3d(0, -9px, 0) rotate(-45deg);
  -webkit-transition-delay: 0.22s;
       -o-transition-delay: 0.22s;
          transition-delay: 0.22s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spring-r.is-active .hamburger-inner::after {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear;
    -o-transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear; }
  .hamburger--spring-r.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Stand
   */
.hamburger--stand .hamburger-inner {
  -webkit-transition: background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
  transition: background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
  -o-transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--stand .hamburger-inner::before {
    -webkit-transition: top 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--stand .hamburger-inner::after {
    -webkit-transition: bottom 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--stand.is-active .hamburger-inner {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
  background-color: transparent;
  -webkit-transition: background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
  -o-transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--stand.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transition: top 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--stand.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transition: bottom 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Stand Reverse
   */
.hamburger--stand-r .hamburger-inner {
  -webkit-transition: background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
  transition: background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
  -o-transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear;
  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear, -webkit-transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--stand-r .hamburger-inner::before {
    -webkit-transition: top 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--stand-r .hamburger-inner::after {
    -webkit-transition: bottom 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--stand-r.is-active .hamburger-inner {
  -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
          transform: rotate(-90deg);
  background-color: transparent;
  -webkit-transition: background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
  -o-transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear;
  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear, -webkit-transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--stand-r.is-active .hamburger-inner::before {
    top: 0;
    -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transition: top 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--stand-r.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transition: bottom 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Spin
   */
.hamburger--spin .hamburger-inner {
  -webkit-transition-duration: 0.22s;
       -o-transition-duration: 0.22s;
          transition-duration: 0.22s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin .hamburger-inner::before {
    -webkit-transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
    -o-transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin .hamburger-inner::after {
    -webkit-transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.is-active .hamburger-inner {
  -webkit-transform: rotate(225deg);
      -ms-transform: rotate(225deg);
          transform: rotate(225deg);
  -webkit-transition-delay: 0.12s;
       -o-transition-delay: 0.12s;
          transition-delay: 0.12s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
    -o-transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg);
    -webkit-transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Spin Reverse
   */
.hamburger--spin-r .hamburger-inner {
  -webkit-transition-duration: 0.22s;
       -o-transition-duration: 0.22s;
          transition-duration: 0.22s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin-r .hamburger-inner::before {
    -webkit-transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
    -o-transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin-r .hamburger-inner::after {
    -webkit-transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin-r.is-active .hamburger-inner {
  -webkit-transform: rotate(-225deg);
      -ms-transform: rotate(-225deg);
          transform: rotate(-225deg);
  -webkit-transition-delay: 0.12s;
       -o-transition-delay: 0.12s;
          transition-delay: 0.12s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin-r.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
    -o-transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin-r.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Squeeze
   */
.hamburger--squeeze .hamburger-inner {
  -webkit-transition-duration: 0.075s;
       -o-transition-duration: 0.075s;
          transition-duration: 0.075s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
       -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--squeeze .hamburger-inner::before {
    -webkit-transition: top 0.075s 0.12s ease, opacity 0.075s ease;
    -o-transition: top 0.075s 0.12s ease, opacity 0.075s ease;
    transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
  .hamburger--squeeze .hamburger-inner::after {
    -webkit-transition: bottom 0.075s 0.12s ease, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.12s ease, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--squeeze.is-active .hamburger-inner {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transition-delay: 0.12s;
       -o-transition-delay: 0.12s;
          transition-delay: 0.12s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
       -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--squeeze.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.075s ease, opacity 0.075s 0.12s ease;
    -o-transition: top 0.075s ease, opacity 0.075s 0.12s ease;
    transition: top 0.075s ease, opacity 0.075s 0.12s ease; }
  .hamburger--squeeze.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg);
    -webkit-transition: bottom 0.075s ease, -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s ease, -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
   * Vortex
   */
.hamburger--vortex .hamburger-inner {
  -webkit-transition-duration: 0.2s;
       -o-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
       -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex .hamburger-inner::before, .hamburger--vortex .hamburger-inner::after {
    -webkit-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
    -webkit-transition-delay: 0.1s;
         -o-transition-delay: 0.1s;
            transition-delay: 0.1s;
    -webkit-transition-timing-function: linear;
         -o-transition-timing-function: linear;
            transition-timing-function: linear; }
  .hamburger--vortex .hamburger-inner::before {
    -webkit-transition-property: top, opacity;
    -o-transition-property: top, opacity;
    transition-property: top, opacity; }
  .hamburger--vortex .hamburger-inner::after {
    -webkit-transition-property: bottom, -webkit-transform;
    transition-property: bottom, -webkit-transform;
    -o-transition-property: bottom, transform;
    transition-property: bottom, transform;
    transition-property: bottom, transform, -webkit-transform; }

.hamburger--vortex.is-active .hamburger-inner {
  -webkit-transform: rotate(765deg);
      -ms-transform: rotate(765deg);
          transform: rotate(765deg);
  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
       -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex.is-active .hamburger-inner::before, .hamburger--vortex.is-active .hamburger-inner::after {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s; }
  .hamburger--vortex.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0; }
  .hamburger--vortex.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg); }

/*
   * Vortex Reverse
   */
.hamburger--vortex-r .hamburger-inner {
  -webkit-transition-duration: 0.2s;
       -o-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
       -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex-r .hamburger-inner::before, .hamburger--vortex-r .hamburger-inner::after {
    -webkit-transition-duration: 0s;
         -o-transition-duration: 0s;
            transition-duration: 0s;
    -webkit-transition-delay: 0.1s;
         -o-transition-delay: 0.1s;
            transition-delay: 0.1s;
    -webkit-transition-timing-function: linear;
         -o-transition-timing-function: linear;
            transition-timing-function: linear; }
  .hamburger--vortex-r .hamburger-inner::before {
    -webkit-transition-property: top, opacity;
    -o-transition-property: top, opacity;
    transition-property: top, opacity; }
  .hamburger--vortex-r .hamburger-inner::after {
    -webkit-transition-property: bottom, -webkit-transform;
    transition-property: bottom, -webkit-transform;
    -o-transition-property: bottom, transform;
    transition-property: bottom, transform;
    transition-property: bottom, transform, -webkit-transform; }

.hamburger--vortex-r.is-active .hamburger-inner {
  -webkit-transform: rotate(-765deg);
      -ms-transform: rotate(-765deg);
          transform: rotate(-765deg);
  -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
       -o-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
          transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
  .hamburger--vortex-r.is-active .hamburger-inner::before, .hamburger--vortex-r.is-active .hamburger-inner::after {
    -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
            transition-delay: 0s; }
  .hamburger--vortex-r.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0; }
  .hamburger--vortex-r.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg); }

.cmu_template_hamburger {
  background: transparent; }

.cmu_template_sideBar .logo {
  margin: 20px 0;
  text-align: center; }

.ui.inverted.menu {
  background: #00AFE6; }

nav {
  margin-bottom: 20px; }
  nav.icons ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row;
            flex-flow: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between; }
    nav.icons ul li {
      margin: 0 0 20px 0; }
      nav.icons ul li.filler {
        background: transparent;
        display: block;
        width: 212px;
        height: 1px;
        margin: 0; }
      nav.icons ul li a {
        z-index: 1;
        position: relative;
        display: block;
        width: 212px;
        height: 200px;
        background-color: #00afe6;
        text-align: center;
        color: white;
        letter-spacing: 1.5px;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 700 !important;
        font-size: 16px !important;
        text-transform: uppercase; }
        nav.icons ul li a > .image {
          opacity: 0.5;
          position: absolute;
          top: 0;
          left: 0;
          z-index: -1;
          width: 100%;
          height: 200px;
          background-repeat: no-repeat;
          background-position: center center;
          background-size: cover; }
        nav.icons ul li a > .icon {
          position: relative;
          top: 24px;
          width: 100%;
          height: 100px;
          background-repeat: no-repeat;
          background-position: center center;
          -ms-transform: scale(1, 1) translate(0, 0);
          /* IE 9 */
          -webkit-transform: scale(1, 1) translate(0, 0);
          /* Safari */
          transform: scale(1, 1) translate(0, 0);
          -webkit-transition: -webkit-transform 0.5s;
          transition: -webkit-transform 0.5s;
          -o-transition: transform 0.5s;
          transition: transform 0.5s;
          transition: transform 0.5s, -webkit-transform 0.5s; }
        nav.icons ul li a > span {
          position: relative;
          top: 40px; }
        nav.icons ul li a > .line {
          position: relative;
          top: 42px;
          background: white;
          height: 1px;
          width: 44px;
          margin: 12px auto; }
        nav.icons ul li a:hover div.icon {
          -ms-transform: scale(1.1, 1.1) translate(0, 0);
          /* IE 9 */
          -webkit-transform: scale(1.1, 1.1) translate(0, 0);
          /* Safari */
          transform: scale(1.1, 1.1) translate(0, 0); }
    nav.icons ul li.badereisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/badereisen.png"); }
    nav.icons ul li.badereisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/badereisen.svg"); }
    nav.icons ul li.freizeitparks a div.image {
      background-image: url("/files/spangler/icons/reisen/images/freizeitparks.png"); }
    nav.icons ul li.freizeitparks a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/freizeitparks.svg"); }
    nav.icons ul li.kurzreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/kurzreisen.png"); }
    nav.icons ul li.kurzreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/kurzreisen.svg"); }
    nav.icons ul li.musicals a div.image {
      background-image: url("/files/spangler/icons/reisen/images/musicals.png"); }
    nav.icons ul li.musicals a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/musicals.svg"); }
    nav.icons ul li.rundreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/rundreisen.png"); }
    nav.icons ul li.rundreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/rundreisen.svg"); }
    nav.icons ul li.staedtereisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/staedtereisen.png"); }
    nav.icons ul li.staedtereisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/staedtereisen.svg"); }
    nav.icons ul li.tagesfahrten a div.image {
      background-image: url("/files/spangler/icons/reisen/images/tagesfahrten.png"); }
    nav.icons ul li.tagesfahrten a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/tagesfahrten.svg"); }
    nav.icons ul li.gruppenreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/gruppenreisen.png"); }
    nav.icons ul li.gruppenreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/gruppenreisen.svg"); }
    nav.icons ul li.weihnachten a div.image {
      background-image: url("/files/spangler/icons/reisen/images/weihnachten.png"); }
    nav.icons ul li.weihnachten a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/weihnachten.svg"); }
    nav.icons ul li.wellness a div.image {
      background-image: url("/files/spangler/icons/reisen/images/wellness.png"); }
    nav.icons ul li.wellness a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/wellness.svg"); }
    nav.icons ul li.silvester a div.image {
      background-image: url("/files/spangler/icons/reisen/images/silvester.png"); }
    nav.icons ul li.silvester a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/silvester.svg"); }
    nav.icons ul li.flugreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/flugreisen.png"); }
    nav.icons ul li.flugreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/flugreisen.svg"); }
    nav.icons ul li.kreuzfahrten a div.image {
      background-image: url("/files/spangler/icons/reisen/images/kreuzfahrten.png"); }
    nav.icons ul li.kreuzfahrten a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/kreuzfahrten.svg"); }
    nav.icons ul li.hotel a div.image {
      background-image: url("/files/spangler/icons/reisen/images/hotel.png"); }
    nav.icons ul li.hotel a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/hotel.svg"); }
    nav.icons ul li.family a div.image {
      background-image: url("/files/spangler/icons/reisen/images/family.png"); }
    nav.icons ul li.family a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/family.svg"); }
    nav.icons ul li.studienreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/studienreisen.png"); }
    nav.icons ul li.studienreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/studienreisen.svg"); }
    nav.icons ul li.fernreisen a div.image {
      background-image: url("/files/spangler/icons/reisen/images/fernreisen.png"); }
    nav.icons ul li.fernreisen a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/fernreisen.svg"); }
    nav.icons ul li.linienfluege a div.image {
      background-image: url("/files/spangler/icons/reisen/images/linienfluege.png"); }
    nav.icons ul li.linienfluege a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/linienfluege.svg"); }
    nav.icons ul li.busanmietung a div.image {
      background-image: url("/files/spangler/icons/reisen/images/busanmietung.png"); }
    nav.icons ul li.busanmietung a div.icon {
      background-image: url("/files/spangler/icons/reisen/svg/busanmietung.svg"); }
    nav.icons ul li.urlaub-in-deutschland a div.image {
      background-image: url("/files/spangler/icons/reisen/images/urlaub-in-deutschland.png"); }

.cmu_busse_nav nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row;
          flex-flow: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .cmu_busse_nav nav ul li.filler {
    background: transparent;
    display: block;
    width: 212px;
    height: 1px; }
  .cmu_busse_nav nav ul li a {
    position: relative;
    display: block;
    width: 212px;
    height: 200px;
    margin: 0 0 30px 0;
    text-align: center;
    color: white;
    letter-spacing: 1.5px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700 !important;
    font-size: 16px !important;
    text-transform: uppercase; }
    .cmu_busse_nav nav ul li a div.image {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 200px;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: cover; }
    .cmu_busse_nav nav ul li a div.gradient {
      position: absolute;
      bottom: 0;
      background: rgba(0, 175, 230, 0.9);
      /* For browsers that do not support gradients */
      background: -webkit-linear-gradient(transparent, rgba(0, 175, 230, 0.9));
      /* For Safari 5.1 to 6.0 */
      background: -o-linear-gradient(transparent, rgba(0, 175, 230, 0.9));
      /* For Opera 11.1 to 12.0 */
      /* For Firefox 3.6 to 15 */
      background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 175, 230, 0.9)));
      background: linear-gradient(transparent, rgba(0, 175, 230, 0.9));
      /* Standard syntax */
      height: 80px;
      width: 100%; }
      .cmu_busse_nav nav ul li a div.gradient span {
        display: block;
        padding-top: 26px; }
      .cmu_busse_nav nav ul li a div.gradient div.line {
        background: white;
        height: 1px;
        width: 44px;
        margin: 12px auto; }

.cmu_template_reiseSuche,
.reise_suche {
  position: relative;
  z-index: 999;
  background: white;
  margin: 0 auto 30px auto;
  width: 78.3333333333%; }
  .cmu_template_reiseSuche .segments,
  .reise_suche .segments {
    margin: 0 !important;
    height: 70px;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    border-radius: 0 !important; }
    .cmu_template_reiseSuche .segments .segment,
    .reise_suche .segments .segment {
      position: relative;
      padding: 0; }
      .cmu_template_reiseSuche .segments .segment:last-child,
      .reise_suche .segments .segment:last-child {
        -webkit-box-flex: 2;
            -ms-flex-positive: 2;
                flex-grow: 2; }
      .cmu_template_reiseSuche .segments .segment .title,
      .reise_suche .segments .segment .title {
        position: absolute;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 700 !important;
        font-size: 14px !important;
        color: #00AFE6;
        left: 14px;
        top: 6px; }
      .cmu_template_reiseSuche .segments .segment .input,
      .reise_suche .segments .segment .input {
        position: absolute;
        left: 14px;
        top: 30px;
        width: 100%; }
        .cmu_template_reiseSuche .segments .segment .input input,
        .reise_suche .segments .segment .input input {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 18px !important;
          color: #c1c1c1; }
      .cmu_template_reiseSuche .segments .segment button,
      .reise_suche .segments .segment button {
        position: absolute;
        top: 14px;
        right: 8px;
        width: 200px;
        height: 42px;
        padding: 0.6em 1em;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 600 !important;
        font-size: 20px !important; }
        .cmu_template_reiseSuche .segments .segment button.blue,
        .reise_suche .segments .segment button.blue {
          background: #00AFE6; }
      .cmu_template_reiseSuche .segments .segment .ui.search,
      .reise_suche .segments .segment .ui.search {
        position: absolute;
        top: 34px; }
        .cmu_template_reiseSuche .segments .segment .ui.search .title,
        .reise_suche .segments .segment .ui.search .title {
          position: inherit;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 21px !important;
          color: #c1c1c1; }
        .cmu_template_reiseSuche .segments .segment .ui.search input,
        .reise_suche .segments .segment .ui.search input {
          border-radius: 0px;
          border: 0;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 18px !important;
          padding: 0 1em;
          color: #c1c1c1; }
          .cmu_template_reiseSuche .segments .segment .ui.search input::-webkit-input-placeholder,
          .reise_suche .segments .segment .ui.search input::-webkit-input-placeholder {
            color: #c1c1c1; }
          .cmu_template_reiseSuche .segments .segment .ui.search input:-ms-input-placeholder,
          .reise_suche .segments .segment .ui.search input:-ms-input-placeholder {
            color: #c1c1c1; }
          .cmu_template_reiseSuche .segments .segment .ui.search input::-ms-input-placeholder,
          .reise_suche .segments .segment .ui.search input::-ms-input-placeholder {
            color: #c1c1c1; }
          .cmu_template_reiseSuche .segments .segment .ui.search input::placeholder,
          .reise_suche .segments .segment .ui.search input::placeholder {
            color: #c1c1c1; }
        .cmu_template_reiseSuche .segments .segment .ui.search.focus input,
        .reise_suche .segments .segment .ui.search.focus input {
          color: #4A4A4A; }
        .cmu_template_reiseSuche .segments .segment .ui.search .results .result .content .title,
        .reise_suche .segments .segment .ui.search .results .result .content .title {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 16px !important;
          color: #4A4A4A; }
          .cmu_template_reiseSuche .segments .segment .ui.search .results .result .content .title:hover,
          .reise_suche .segments .segment .ui.search .results .result .content .title:hover {
            color: #00AFE6; }
      .cmu_template_reiseSuche .segments .segment .ui .dropdown,
      .reise_suche .segments .segment .ui .dropdown {
        top: 6px;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 600 !important;
        font-size: 18px !important;
        color: #c1c1c1; }
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .divider,
        .reise_suche .segments .segment .ui .dropdown .divider {
          margin: 0; }
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox .box::before,
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox label::before,
        .reise_suche .segments .segment .ui .dropdown .checkbox .box::before,
        .reise_suche .segments .segment .ui .dropdown .checkbox label::before {
          border-color: #00AFE6 !important; }
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox label,
        .reise_suche .segments .segment .ui .dropdown .checkbox label {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 400 !important;
          font-size: 16px !important;
          color: #4A4A4A !important; }
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox input:checked ~ .box:after,
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox input:checked ~ label:after,
        .reise_suche .segments .segment .ui .dropdown .checkbox input:checked ~ .box:after,
        .reise_suche .segments .segment .ui .dropdown .checkbox input:checked ~ label:after {
          color: #00AFE6; }
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox input:checked ~ .box:hover:after,
        .cmu_template_reiseSuche .segments .segment .ui .dropdown .checkbox input:checked ~ label:hover:after,
        .reise_suche .segments .segment .ui .dropdown .checkbox input:checked ~ .box:hover:after,
        .reise_suche .segments .segment .ui .dropdown .checkbox input:checked ~ label:hover:after {
          color: #00AFE6; }
      .cmu_template_reiseSuche .segments .segment .ui.form .ui.left.icon,
      .reise_suche .segments .segment .ui.form .ui.left.icon {
        width: auto; }
        .cmu_template_reiseSuche .segments .segment .ui.form .ui.left.icon input#reservation,
        .reise_suche .segments .segment .ui.form .ui.left.icon input#reservation {
          width: 214px;
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 600 !important;
          font-size: 18px !important;
          padding: 0 0 0 24px !important;
          margin: 5px 0 0 0;
          border: none; }
        .cmu_template_reiseSuche .segments .segment .ui.form .ui.left.icon i.icon,
        .reise_suche .segments .segment .ui.form .ui.left.icon i.icon {
          width: auto;
          top: 2px; }

.mod_article .reise_suche {
  width: 100%; }

.date-picker-wrapper {
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 400 !important;
  font-size: 18px !important;
  background: white;
  -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15) !important;
          box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15) !important;
  top: 67px !important; }
  .date-picker-wrapper:before {
    -webkit-box-shadow: -1px -1px 0 0 #d4d4d5 !important;
            box-shadow: -1px -1px 0 0 #d4d4d5 !important;
    -webkit-transform: rotate(45deg) !important;
        -ms-transform: rotate(45deg) !important;
            transform: rotate(45deg) !important;
    top: -6px; }
  .date-picker-wrapper .month-wrapper {
    border-radius: 0;
    border-color: #00AFE6; }
    .date-picker-wrapper .month-wrapper .real-today {
      border: 1px solid #00AFE6 !important;
      background-color: transparent !important; }
    .date-picker-wrapper .month-wrapper .first-date-selected,
    .date-picker-wrapper .month-wrapper .last-date-selected {
      background-color: #00AFE6 !important; }
    .date-picker-wrapper .month-wrapper div.day.toMonth.valid:before, .date-picker-wrapper .month-wrapper div.day.toMonth.valid:after {
      display: none !important; }
  .date-picker-wrapper .default-top,
  .date-picker-wrapper .normal-top {
    font-size: 13px; }
  .date-picker-wrapper .date-range-length-tip {
    background: white !important;
    padding: 2px 6px; }
    .date-picker-wrapper .date-range-length-tip:after {
      border-top-color: white !important; }
  .date-picker-wrapper th.month-name {
    font-size: 15px;
    letter-spacing: 0.04em; }
  .date-picker-wrapper tr.week-name th {
    font-size: 16px;
    width: 10%; }

.main {
  overflow: hidden;
  width: 78.3333333333%;
  margin: 0 auto; }
  .main .mod_article h1, .main .mod_article h2, .main .mod_article h3, .main .mod_article h4, .main .mod_article h5, .main .mod_article h6,
  .main .mod_newsreader h1,
  .main .mod_newsreader h2,
  .main .mod_newsreader h3,
  .main .mod_newsreader h4,
  .main .mod_newsreader h5,
  .main .mod_newsreader h6 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700 !important;
    font-size: 24px !important;
    color: #00AFE6;
    margin: 10px 0;
    letter-spacing: 0.4px;
    text-align: left; }
  .main .mod_article h2, .main .mod_article h3, .main .mod_article h4, .main .mod_article h5, .main .mod_article h6,
  .main .mod_newsreader h2,
  .main .mod_newsreader h3,
  .main .mod_newsreader h4,
  .main .mod_newsreader h5,
  .main .mod_newsreader h6 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700 !important;
    font-size: 20px !important; }
  .main .mod_article p, .main .mod_article li,
  .main .mod_newsreader p,
  .main .mod_newsreader li {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 24px;
    color: #4A4A4A;
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto; }
  .main .mod_article p.info + .ce_text,
  .main .mod_newsreader p.info + .ce_text {
    margin-top: 20px; }
  .main .mod_article div.pagination,
  .main .mod_newsreader div.pagination {
    clear: both; }
  .main .mod_article .ce_text,
  .main .mod_newsreader .ce_text {
    margin-bottom: 30px; }
    .main .mod_article .ce_text ul li,
    .main .mod_newsreader .ce_text ul li {
      list-style: disc !important;
      margin-left: 20px; }
    .main .mod_article .ce_text a:link, .main .mod_article .ce_text a:visited,
    .main .mod_newsreader .ce_text a:link,
    .main .mod_newsreader .ce_text a:visited {
      text-decoration: underline !important;
      color: #00AFE6;
      font-weight: 700; }
  .main .mod_article .ce_gallery,
  .main .mod_newsreader .ce_gallery {
    margin-bottom: 24px; }
    .main .mod_article .ce_gallery ul,
    .main .mod_newsreader .ce_gallery ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-flow: row;
              flex-flow: row;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between; }
      .main .mod_article .ce_gallery ul li,
      .main .mod_newsreader .ce_gallery ul li {
        margin-bottom: 6px; }
        .main .mod_article .ce_gallery ul li.filler,
        .main .mod_newsreader .ce_gallery ul li.filler {
          background: transparent;
          display: block;
          margin-bottom: 0; }
  .main .mod_article .ce_table,
  .main .mod_newsreader .ce_table {
    border-bottom: 1px solid #00AFE6;
    margin-bottom: 20px; }
    .main .mod_article .ce_table table,
    .main .mod_newsreader .ce_table table {
      border-radius: 0 !important; }
      .main .mod_article .ce_table table th,
      .main .mod_newsreader .ce_table table th {
        border-radius: 0 !important;
        background: #00AFE6;
        color: white;
        text-transform: uppercase; }
      .main .mod_article .ce_table table td,
      .main .mod_newsreader .ce_table table td {
        color: #4A4A4A; }
  .main .mod_article.flow > *,
  .main .mod_newsreader.flow > * {
    width: 50%; }
    .main .mod_article.flow > *.no-flow,
    .main .mod_newsreader.flow > *.no-flow {
      width: 100%; }
  .main .pagination {
    text-align: center;
    margin-bottom: 20px; }
    .main .pagination p {
      display: none; }
    .main .pagination ul li {
      display: inline-block; }
      .main .pagination ul li a,
      .main .pagination ul li span {
        display: block;
        min-width: 40px;
        padding: 10px;
        background: white;
        border: 1px solid #00AFE6;
        text-align: center; }
      .main .pagination ul li a:hover,
      .main .pagination ul li span {
        background: #00AFE6;
        color: white; }
  .main .mod_search h1 a, .main .mod_search h2 a, .main .mod_search h3 a, .main .mod_search h4 a, .main .mod_search h5 a, .main .mod_search h6 a {
    text-decoration: none !important; }
    .main .mod_search h1 a:link, .main .mod_search h2 a:link, .main .mod_search h3 a:link, .main .mod_search h4 a:link, .main .mod_search h5 a:link, .main .mod_search h6 a:link {
      color: #00AFE6; }
    .main .mod_search h1 a:visited, .main .mod_search h2 a:visited, .main .mod_search h3 a:visited, .main .mod_search h4 a:visited, .main .mod_search h5 a:visited, .main .mod_search h6 a:visited {
      color: #00AFE6; }
  .main .mod_search h1 .relevance, .main .mod_search h2 .relevance, .main .mod_search h3 .relevance, .main .mod_search h4 .relevance, .main .mod_search h5 .relevance, .main .mod_search h6 .relevance {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400 !important;
    font-size: 14px !important;
    color: #494949; }
  .main .mod_search > div {
    padding-bottom: 10px;
    border-bottom: 1px solid #494949; }
    .main .mod_search > div.first {
      padding-top: 0;
      border-top: 1px solid #494949; }
  .main .mod_search p.header {
    clear: both;
    padding: 10px 0 30px 0; }
  .main .mod_search mark {
    background: #00AFE6 !important;
    padding: 0 4px;
    color: white; }
  .main .mod_search form .widget {
    width: 50%;
    float: left; }
    .main .mod_search form .widget.widget-submit {
      text-transform: uppercase;
      width: auto;
      margin-left: 10px; }
      .main .mod_search form .widget.widget-submit button {
        padding-top: 10px !important;
        padding-bottom: 10px !important; }
    .main .mod_search form .widget input {
      border: 0 !important; }

.cmu_section_teaser21,
.cmu_section_teaser22 {
  background: white;
  overflow: hidden; }
  .cmu_section_teaser21 .image h1, .cmu_section_teaser21 .image h2, .cmu_section_teaser21 .image h3, .cmu_section_teaser21 .image h4, .cmu_section_teaser21 .image h5, .cmu_section_teaser21 .image h6,
  .cmu_section_teaser22 .image h1,
  .cmu_section_teaser22 .image h2,
  .cmu_section_teaser22 .image h3,
  .cmu_section_teaser22 .image h4,
  .cmu_section_teaser22 .image h5,
  .cmu_section_teaser22 .image h6 {
    position: absolute;
    z-index: 99;
    bottom: 0;
    left: 0;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600 !important;
    font-size: 16px !important;
    color: white;
    text-transform: uppercase;
    background: #00AFE6;
    padding: 8px 21px;
    letter-spacing: 1px; }
  .cmu_section_teaser21 .text,
  .cmu_section_teaser22 .text {
    position: absolute;
    top: 0;
    right: 16px;
    width: 200px; }
    .cmu_section_teaser21 .text h1, .cmu_section_teaser21 .text h2, .cmu_section_teaser21 .text h3, .cmu_section_teaser21 .text h4, .cmu_section_teaser21 .text h5, .cmu_section_teaser21 .text h6,
    .cmu_section_teaser22 .text h1,
    .cmu_section_teaser22 .text h2,
    .cmu_section_teaser22 .text h3,
    .cmu_section_teaser22 .text h4,
    .cmu_section_teaser22 .text h5,
    .cmu_section_teaser22 .text h6 {
      position: absolute;
      top: 0;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 600 !important;
      font-size: 16px !important;
      background: transparent;
      color: #00AFE6;
      text-transform: uppercase;
      margin: 24px 0 0; }
      .cmu_section_teaser21 .text h1:after, .cmu_section_teaser21 .text h2:after, .cmu_section_teaser21 .text h3:after, .cmu_section_teaser21 .text h4:after, .cmu_section_teaser21 .text h5:after, .cmu_section_teaser21 .text h6:after,
      .cmu_section_teaser22 .text h1:after,
      .cmu_section_teaser22 .text h2:after,
      .cmu_section_teaser22 .text h3:after,
      .cmu_section_teaser22 .text h4:after,
      .cmu_section_teaser22 .text h5:after,
      .cmu_section_teaser22 .text h6:after {
        content: " ";
        display: block;
        width: 20px;
        height: 1px;
        background: gray;
        margin-top: 14px; }
    .cmu_section_teaser21 .text p,
    .cmu_section_teaser22 .text p {
      position: absolute;
      top: 70px;
      color: #4A4A4A;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 400 !important;
      font-size: 16px !important;
      line-height: 21px; }

.cmu_section_teaser41,
.cmu_section_teaser42,
.cmu_section_teaser43,
.cmu_section_teaser44 {
  background: white;
  overflow: hidden; }
  .cmu_section_teaser41 .mod_article h1, .cmu_section_teaser41 .mod_article h2, .cmu_section_teaser41 .mod_article h3, .cmu_section_teaser41 .mod_article h4, .cmu_section_teaser41 .mod_article h5, .cmu_section_teaser41 .mod_article h6,
  .cmu_section_teaser42 .mod_article h1,
  .cmu_section_teaser42 .mod_article h2,
  .cmu_section_teaser42 .mod_article h3,
  .cmu_section_teaser42 .mod_article h4,
  .cmu_section_teaser42 .mod_article h5,
  .cmu_section_teaser42 .mod_article h6,
  .cmu_section_teaser43 .mod_article h1,
  .cmu_section_teaser43 .mod_article h2,
  .cmu_section_teaser43 .mod_article h3,
  .cmu_section_teaser43 .mod_article h4,
  .cmu_section_teaser43 .mod_article h5,
  .cmu_section_teaser43 .mod_article h6,
  .cmu_section_teaser44 .mod_article h1,
  .cmu_section_teaser44 .mod_article h2,
  .cmu_section_teaser44 .mod_article h3,
  .cmu_section_teaser44 .mod_article h4,
  .cmu_section_teaser44 .mod_article h5,
  .cmu_section_teaser44 .mod_article h6 {
    position: absolute;
    z-index: 99;
    bottom: 0;
    left: 0;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600 !important;
    font-size: 16px !important;
    color: white;
    text-transform: uppercase;
    background: #00AFE6;
    padding: 8px 21px;
    letter-spacing: 1px; }
  .cmu_section_teaser41 .mod_article img,
  .cmu_section_teaser42 .mod_article img,
  .cmu_section_teaser43 .mod_article img,
  .cmu_section_teaser44 .mod_article img {
    -ms-transform: scale(1, 1) translate(0, 0);
    /* IE 9 */
    -webkit-transform: scale(1, 1) translate(0, 0);
    /* Safari */
    transform: scale(1, 1) translate(0, 0);
    -webkit-transition: -webkit-transform 0.5s;
    transition: -webkit-transform 0.5s;
    -o-transition: transform 0.5s;
    transition: transform 0.5s;
    transition: transform 0.5s, -webkit-transform 0.5s; }
  .cmu_section_teaser41 .mod_article:hover img,
  .cmu_section_teaser42 .mod_article:hover img,
  .cmu_section_teaser43 .mod_article:hover img,
  .cmu_section_teaser44 .mod_article:hover img {
    -ms-transform: scale(1.1, 1.1) translate(-10px, -10px);
    /* IE 9 */
    -webkit-transform: scale(1.1, 1.1) translate(-10px, -10px);
    /* Safari */
    transform: scale(1.1, 1.1) translate(-10px, -10px); }

.cmu_section_gruende {
  background: rgba(255, 255, 255, 0.9);
  overflow: hidden; }
  .cmu_section_gruende .ce_headline {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600 !important;
    font-size: 32px !important;
    text-align: center;
    color: #00AFE6;
    width: 110%;
    margin: 14px 0 20px -5%; }
    .cmu_section_gruende .ce_headline:before, .cmu_section_gruende .ce_headline:after {
      content: "";
      display: inline-block;
      height: 1px;
      width: 25%;
      background: #00AFE6;
      white-space: nowrap;
      -ms-transform: translate(0, -8px);
      /* IE 9 */
      -webkit-transform: translate(0, -8px);
      /* Safari */
      transform: translate(0, -8px); }
    .cmu_section_gruende .ce_headline:before {
      margin-right: 20px; }
    .cmu_section_gruende .ce_headline:after {
      margin-left: 20px; }
  .cmu_section_gruende .ce_text {
    float: left;
    width: 25%;
    margin: 0 4%;
    text-align: justify; }
    .cmu_section_gruende .ce_text h1, .cmu_section_gruende .ce_text h2, .cmu_section_gruende .ce_text h3, .cmu_section_gruende .ce_text h4, .cmu_section_gruende .ce_text h5, .cmu_section_gruende .ce_text h6 {
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 16px !important;
      text-transform: uppercase;
      color: #00AFE6;
      margin: 10px 0;
      letter-spacing: 0.4px;
      text-align: left; }
    .cmu_section_gruende .ce_text p {
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 400 !important;
      font-size: 16px !important;
      line-height: 24px;
      color: #4A4A4A;
      -webkit-hyphens: auto;
          -ms-hyphens: auto;
              hyphens: auto; }
      .cmu_section_gruende .ce_text p a {
        position: absolute;
        bottom: 24px;
        display: block;
        width: 25%;
        text-align: center;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 600 !important;
        font-size: 16px !important;
        color: white;
        background: #00AFE6;
        padding: 8px 0; }
        .cmu_section_gruende .ce_text p a:hover {
          background: #27bff2; }

.flow .filler {
  background: transparent;
  width: 24vw;
  max-width: 290px;
  height: 1px; }

.flow .travel-card,
.flow .report-card {
  cursor: pointer;
  position: relative;
  background: white;
  width: 24vw;
  max-width: 290px;
  height: 450px;
  overflow: hidden;
  margin: 0 0 3vh 0; }
  .flow .travel-card .image,
  .flow .report-card .image {
    position: absolute;
    top: 0;
    width: 100%;
    height: 270px;
    background-position: center center;
    background-size: cover; }
  .flow .travel-card .icon.badereisen,
  .flow .report-card .icon.badereisen {
    background-color: #DE7637;
    background-image: url("/files/spangler/icons/reisen/svg/badereisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.freizeitparks,
  .flow .report-card .icon.freizeitparks {
    background-color: #009D7A;
    background-image: url("/files/spangler/icons/reisen/svg/freizeitparks.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.kurzreisen,
  .flow .report-card .icon.kurzreisen {
    background-color: #7FA51B;
    background-image: url("/files/spangler/icons/reisen/svg/kurzreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.musicals,
  .flow .report-card .icon.musicals {
    background-color: #B71B54;
    background-image: url("/files/spangler/icons/reisen/svg/musicals.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.rundreisen,
  .flow .report-card .icon.rundreisen {
    background-color: #0092CE;
    background-image: url("/files/spangler/icons/reisen/svg/rundreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.staedtereisen,
  .flow .report-card .icon.staedtereisen {
    background-color: #945F99;
    background-image: url("/files/spangler/icons/reisen/svg/staedtereisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.tagesfahrten,
  .flow .report-card .icon.tagesfahrten {
    background-color: #00599A;
    background-image: url("/files/spangler/icons/reisen/svg/tagesfahrten.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.gruppenreisen,
  .flow .report-card .icon.gruppenreisen {
    background-color: #0E5E62;
    background-image: url("/files/spangler/icons/reisen/svg/gruppenreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.weihnachten,
  .flow .report-card .icon.weihnachten {
    background-color: #C5112B;
    background-image: url("/files/spangler/icons/reisen/svg/weihnachten.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.wellness,
  .flow .report-card .icon.wellness {
    background-color: #CF94B5;
    background-image: url("/files/spangler/icons/reisen/svg/wellness.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.silvester,
  .flow .report-card .icon.silvester {
    background-color: #F2B600;
    background-image: url("/files/spangler/icons/reisen/svg/silvester.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.flugreisen,
  .flow .report-card .icon.flugreisen {
    background-color: #FFCC00;
    background-image: url("/files/spangler/icons/reisen/svg/flugreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.kreuzfahrten,
  .flow .report-card .icon.kreuzfahrten {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/kreuzfahrten.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.hotel,
  .flow .report-card .icon.hotel {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/hotel.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.family,
  .flow .report-card .icon.family {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/family.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.studienreisen,
  .flow .report-card .icon.studienreisen {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/studienreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.fernreisen,
  .flow .report-card .icon.fernreisen {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/fernreisen.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.linienfluege,
  .flow .report-card .icon.linienfluege {
    background-color: #22819F;
    background-image: url("/files/spangler/icons/reisen/svg/linienfluege.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.busanmietung,
  .flow .report-card .icon.busanmietung {
    background-color: #ccc;
    background-image: url("/files/spangler/icons/reisen/svg/busanmietung.svg");
    background-size: 44px;
    background-repeat: no-repeat;
    background-position: center center; }
  .flow .travel-card .icon.rundreisen,
  .flow .report-card .icon.rundreisen {
    background-size: 64px;
    background-position: center 7px; }
  .flow .travel-card .icon,
  .flow .report-card .icon {
    position: absolute;
    top: 10px;
    right: 5%;
    width: 60px;
    height: 60px;
    background: red;
    border-radius: 60px !important; }
    .flow .travel-card .icon.badereisen,
    .flow .report-card .icon.badereisen {
      background-size: 38px; }
  .flow .travel-card .info,
  .flow .report-card .info {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 180px; }
    .flow .travel-card .info .id,
    .flow .report-card .info .id {
      position: absolute;
      bottom: 0;
      left: 10px;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 600 !important;
      font-size: 16px !important;
      color: #e10e1c; }
    .flow .travel-card .info .title,
    .flow .report-card .info .title {
      position: absolute;
      top: 10px;
      width: 100%;
      padding: 0 10px;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 24px !important;
      color: #00AFE6;
      text-align: center;
      line-height: 28px; }
    .flow .travel-card .info .location,
    .flow .travel-card .info .name,
    .flow .report-card .info .location,
    .flow .report-card .info .name {
      position: absolute;
      bottom: 60px;
      width: 100%;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 200 !important;
      font-size: 20px !important;
      color: #494949;
      text-align: center;
      line-height: 24px; }
    .flow .travel-card .info .price,
    .flow .report-card .info .price {
      position: absolute;
      bottom: 20px;
      width: 100%;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 32px !important;
      color: #00AFE6;
      text-align: center; }

.flow .report-card .image {
  height: 350px; }

.flow .report-card .info {
  bottom: 0;
  height: 100px; }
  .flow .report-card .info .name {
    bottom: 8px; }

.flow .agency-card {
  position: relative;
  width: 48%;
  max-width: 460px;
  height: 236px;
  margin: 0 0 30px 0;
  padding: 8px 20px;
  overflow: hidden;
  background: white;
  background-image: url("/files/spangler/icons/vogel.svg");
  background-position: 95% 12%;
  background-size: 74px 64px;
  background-repeat: no-repeat; }
  .flow .agency-card p {
    margin-bottom: 10px; }
  .flow .agency-card .address p {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400 !important;
    font-size: 18px !important; }
  .flow .agency-card .contact {
    position: absolute;
    bottom: -20px; }
    .flow .agency-card .contact p {
      padding-left: 30px;
      background-repeat: no-repeat;
      background-position-y: 2px; }
      .flow .agency-card .contact p:first-child {
        background-image: url("/files/spangler/icons/mail.svg");
        background-position-y: 4px; }
      .flow .agency-card .contact p:nth-child(2) {
        background-image: url("/files/spangler/icons/telefon.svg"); }
      .flow .agency-card .contact p:last-child {
        background-image: url("/files/spangler/icons/telefax.svg"); }
  .flow .agency-card .open {
    position: absolute;
    left: 54%;
    bottom: -20px; }
    .flow .agency-card .open h3, .flow .agency-card .open h4, .flow .agency-card .open h5, .flow .agency-card .open h6 {
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 16px !important;
      color: #4A4A4A; }

.employee-card {
  position: relative;
  background: white;
  padding: 30px 50px;
  margin-bottom: 30px;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 20px;
  color: #494949; }
  .employee-card div.clear {
    clear: both; }
  .employee-card .image {
    float: left;
    width: 160px;
    height: 160px;
    background-position: center center;
    background-size: contain;
    border-radius: 80px !important; }
  .employee-card .container {
    float: right;
    width: 78%;
    min-height: 10px; }
    .employee-card .container .headline {
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 700 !important;
      font-size: 16px !important; }
    .employee-card .container .person {
      width: 100%;
      min-height: 10px; }
      .employee-card .container .person .contact {
        float: left;
        width: 50%;
        min-height: 10px; }
        .employee-card .container .person .contact > .name {
          font-family: 'Source Sans Pro', sans-serif;
          font-weight: 700 !important;
          font-size: 18px !important;
          text-transform: uppercase;
          color: #00AFE6;
          letter-spacing: 1px; }
        .employee-card .container .person .contact > .email {
          padding-left: 30px;
          background-image: url("/files/spangler/icons/mail.svg");
          background-repeat: no-repeat;
          background-position-y: 2px;
          margin-top: 50px; }
        .employee-card .container .person .contact > .tel {
          padding-left: 30px;
          background-image: url("/files/spangler/icons/telefon.svg");
          background-repeat: no-repeat;
          margin-top: 10px; }
      .employee-card .container .person .addon {
        float: right;
        width: 50%; }
        .employee-card .container .person .addon .cat .cats {
          margin-top: 10px; }
          .employee-card .container .person .addon .cat .cats div {
            display: inline-block;
            width: 40px;
            height: 40px;
            margin-right: 10px;
            background-size: 24px;
            background-repeat: no-repeat;
            background-position: center center;
            border-radius: 20px !important; }
          .employee-card .container .person .addon .cat .cats div.badereisen {
            background-color: #DE7637;
            background-image: url("/files/spangler/icons/reisen/svg/badereisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.freizeitparks {
            background-color: #009D7A;
            background-image: url("/files/spangler/icons/reisen/svg/freizeitparks.svg"); }
          .employee-card .container .person .addon .cat .cats div.kurzreisen {
            background-color: #7FA51B;
            background-image: url("/files/spangler/icons/reisen/svg/kurzreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.musicals {
            background-color: #B71B54;
            background-image: url("/files/spangler/icons/reisen/svg/musicals.svg"); }
          .employee-card .container .person .addon .cat .cats div.rundreisen {
            background-color: #0092CE;
            background-image: url("/files/spangler/icons/reisen/svg/rundreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.staedtereisen {
            background-color: #945F99;
            background-image: url("/files/spangler/icons/reisen/svg/staedtereisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.tagesfahrten {
            background-color: #00599A;
            background-image: url("/files/spangler/icons/reisen/svg/tagesfahrten.svg"); }
          .employee-card .container .person .addon .cat .cats div.gruppenreisen {
            background-color: #0E5E62;
            background-image: url("/files/spangler/icons/reisen/svg/gruppenreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.weihnachten {
            background-color: #C5112B;
            background-image: url("/files/spangler/icons/reisen/svg/weihnachten.svg"); }
          .employee-card .container .person .addon .cat .cats div.wellness {
            background-color: #CF94B5;
            background-image: url("/files/spangler/icons/reisen/svg/wellness.svg"); }
          .employee-card .container .person .addon .cat .cats div.silvester {
            background-color: #F2B600;
            background-image: url("/files/spangler/icons/reisen/svg/silvester.svg"); }
          .employee-card .container .person .addon .cat .cats div.flugreisen {
            background-color: #FFCC00;
            background-image: url("/files/spangler/icons/reisen/svg/flugreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.kreuzfahrten {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/kreuzfahrten.svg"); }
          .employee-card .container .person .addon .cat .cats div.hotel {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/hotel.svg"); }
          .employee-card .container .person .addon .cat .cats div.family {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/family.svg"); }
          .employee-card .container .person .addon .cat .cats div.studienreisen {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/studienreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.fernreisen {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/fernreisen.svg"); }
          .employee-card .container .person .addon .cat .cats div.linienfluege {
            background-color: #22819F;
            background-image: url("/files/spangler/icons/reisen/svg/linienfluege.svg"); }
          .employee-card .container .person .addon .cat .cats div.rundreisen {
            background-size: 48px;
            background-position: center 2px; }
          .employee-card .container .person .addon .cat .cats + .cats {
            margin-top: 4px; }
        .employee-card .container .person .addon .cat + .report {
          margin-top: 14px; }
        .employee-card .container .person .addon .report a {
          position: relative;
          display: block; }
          .employee-card .container .person .addon .report a img {
            margin-top: 6px; }
          .employee-card .container .person .addon .report a div.grey.circular.label {
            position: absolute;
            top: 0;
            left: 16px;
            background-color: #00AFE6 !important; }
    .employee-card .container .note {
      margin-top: 20px; }

.content-float-50 .ce_text {
  float: left;
  width: 50% !important;
  min-height: 180px; }
  .content-float-50 .ce_text.first {
    float: none;
    min-height: auto; }

.layout_warning {
  position: relative;
  background: white;
  background-image: url("/files/spangler/icons/warning.svg");
  background-position: 20px 20px;
  background-repeat: no-repeat;
  padding: 20px 20px 20px 90px;
  margin-bottom: 20px;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 400 !important;
  font-size: 16px !important; }
  .layout_warning h1 *, .layout_warning h2 *, .layout_warning h3 *, .layout_warning h4 *, .layout_warning h5 *, .layout_warning h6 * {
    color: #FF6260 !important; }
  .layout_warning .ce_text {
    margin: 0 !important; }
    .layout_warning .ce_text * {
      color: #FF6260 !important; }
  .layout_warning .ui.circular {
    position: absolute;
    top: 50px;
    left: 10px;
    background: #FF6260; }

.mod_article .baustellen_banner {
  position: relative;
  background: white;
  background-image: url("/files/spangler/icons/warning.svg");
  background-position: 20px 8px;
  background-repeat: no-repeat;
  padding: 20px 20px 20px 90px;
  margin-bottom: 20px;
  cursor: pointer; }
  .mod_article .baustellen_banner p {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400 !important;
    font-size: 24px !important;
    color: #FF6260 !important; }
  .mod_article .baustellen_banner i {
    position: absolute;
    right: 10px;
    top: 24px;
    font-size: 26px;
    color: #FF6260 !important; }

body.linienverkehr .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row;
          flex-flow: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
  body.linienverkehr .content .linien {
    width: 250px; }
    body.linienverkehr .content .linien li {
      position: relative;
      background: white;
      width: 100%;
      overflow: hidden;
      height: 50px;
      margin-bottom: 10px; }
      body.linienverkehr .content .linien li .line {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 50px;
        height: 50px;
        color: white;
        font-size: 34px;
        font-weight: 700;
        text-align: center;
        padding-top: 13px; }
        body.linienverkehr .content .linien li .line.l-10 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-410 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-20 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-420 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-25 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-425 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-30 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-430 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-35 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-435 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-44 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-X44 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-N14 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-45 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-445 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-46 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-446 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-50 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-450 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-55 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-455 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-60 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-460 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-70 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-470 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-80 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-480 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-90 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-490 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-425 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-X425 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-441 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-X441 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-SOB {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-S6 {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-S2G {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-S2U {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-MBDA {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-KH {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-KK {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-EK {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-PO {
          background: #c1c1c1; }
        body.linienverkehr .content .linien li .line.l-MBDA {
          font-size: 15px; }
        body.linienverkehr .content .linien li .line.l-SOB, body.linienverkehr .content .linien li .line.l-S2G, body.linienverkehr .content .linien li .line.l-S2U, body.linienverkehr .content .linien li .line.l-N14, body.linienverkehr .content .linien li .line.l-425, body.linienverkehr .content .linien li .line.l-441, body.linienverkehr .content .linien li .line.l-X44, body.linienverkehr .content .linien li .line.l-410, body.linienverkehr .content .linien li .line.l-420, body.linienverkehr .content .linien li .line.l-X425, body.linienverkehr .content .linien li .line.l-430, body.linienverkehr .content .linien li .line.l-435, body.linienverkehr .content .linien li .line.l-X44, body.linienverkehr .content .linien li .line.l-445, body.linienverkehr .content .linien li .line.l-446, body.linienverkehr .content .linien li .line.l-450, body.linienverkehr .content .linien li .line.l-455, body.linienverkehr .content .linien li .line.l-460, body.linienverkehr .content .linien li .line.l-470, body.linienverkehr .content .linien li .line.l-480, body.linienverkehr .content .linien li .line.l-490 {
          font-size: 24px; }
        body.linienverkehr .content .linien li .line.l-KH, body.linienverkehr .content .linien li .line.l-KK, body.linienverkehr .content .linien li .line.l-EK, body.linienverkehr .content .linien li .line.l-PO {
          font-size: 30px; }
          body.linienverkehr .content .linien li .line.l-KH + .text .title, body.linienverkehr .content .linien li .line.l-KK + .text .title, body.linienverkehr .content .linien li .line.l-EK + .text .title, body.linienverkehr .content .linien li .line.l-PO + .text .title, body.linienverkehr .content .linien li .line.l-X441, body.linienverkehr .content .linien li .line.l-X425 {
            font-size: 20px !important; }
      body.linienverkehr .content .linien li .text {
        position: relative;
        padding-left: 56px; }
        body.linienverkehr .content .linien li .text .title {
          padding-top: 6px;
          font-weight: 700;
          font-size: 24px;
          color: #c1c1c1; }
        body.linienverkehr .content .linien li .text .description {
          padding-top: 0;
          font-size: 12px;
          white-space: nowrap;
          color: #c1c1c1; }
        body.linienverkehr .content .linien li .text .fade {
          position: absolute;
          bottom: 0;
          right: 0;
          height: 20px;
          width: 70%;
          background: -webkit-gradient(linear, right top, left top, from(white), to(rgba(255, 255, 255, 0)));
          background: -webkit-linear-gradient(right, white, rgba(255, 255, 255, 0));
          background: -o-linear-gradient(right, white, rgba(255, 255, 255, 0));
          background: linear-gradient(to left, white, rgba(255, 255, 255, 0)); }
      body.linienverkehr .content .linien li.active .line.l-10, body.linienverkehr .content .linien li:hover .line.l-10 {
        background: #FF0000; }
      body.linienverkehr .content .linien li.active .line.l-410, body.linienverkehr .content .linien li:hover .line.l-410 {
        background: #FF0000; }
      body.linienverkehr .content .linien li.active .line.l-20, body.linienverkehr .content .linien li:hover .line.l-20 {
        background: #00A046; }
      body.linienverkehr .content .linien li.active .line.l-420, body.linienverkehr .content .linien li:hover .line.l-420 {
        background: #00A046; }
      body.linienverkehr .content .linien li.active .line.l-25, body.linienverkehr .content .linien li:hover .line.l-25 {
        background: #E96814; }
      body.linienverkehr .content .linien li.active .line.l-425, body.linienverkehr .content .linien li:hover .line.l-425 {
        background: #E96814; }
      body.linienverkehr .content .linien li.active .line.l-30, body.linienverkehr .content .linien li:hover .line.l-30 {
        background: #005AC8; }
      body.linienverkehr .content .linien li.active .line.l-30, body.linienverkehr .content .linien li:hover .line.l-430 {
        background: #005AC8; }
      body.linienverkehr .content .linien li.active .line.l-35, body.linienverkehr .content .linien li:hover .line.l-35 {
        background: #B31F2B; }
      body.linienverkehr .content .linien li.active .line.l-435, body.linienverkehr .content .linien li:hover .line.l-435 {
        background: #B31F2B; }
      body.linienverkehr .content .linien li.active .line.l-44, body.linienverkehr .content .linien li:hover .line.l-44 {
        background: #E3357A; }
      body.linienverkehr .content .linien li.active .line.l-X44, body.linienverkehr .content .linien li:hover .line.l-X44 {
        background: #E3357A; }
      body.linienverkehr .content .linien li.active .line.l-N14, body.linienverkehr .content .linien li:hover .line.l-N14 {
        background: #E58DC0; }
      body.linienverkehr .content .linien li.active .line.l-45, body.linienverkehr .content .linien li:hover .line.l-45 {
        background: #F0E100; }
      body.linienverkehr .content .linien li.active .line.l-445, body.linienverkehr .content .linien li:hover .line.l-445 {
        background: #F0E100; }
      body.linienverkehr .content .linien li.active .line.l-46, body.linienverkehr .content .linien li:hover .line.l-46 {
        background: #14B5C7; }
      body.linienverkehr .content .linien li.active .line.l-446, body.linienverkehr .content .linien li:hover .line.l-446 {
        background: #14B5C7; }
      body.linienverkehr .content .linien li.active .line.l-50, body.linienverkehr .content .linien li:hover .line.l-50 {
        background: #87DFE9; }
      body.linienverkehr .content .linien li.active .line.l-450, body.linienverkehr .content .linien li:hover .line.l-450 {
        background: #87DFE9; }
      body.linienverkehr .content .linien li.active .line.l-55, body.linienverkehr .content .linien li:hover .line.l-55 {
        background: #00A1A0; }
      body.linienverkehr .content .linien li.active .line.l-455, body.linienverkehr .content .linien li:hover .line.l-455 {
        background: #00A1A0; }
      body.linienverkehr .content .linien li.active .line.l-60, body.linienverkehr .content .linien li:hover .line.l-60 {
        background: #01691A; }
      body.linienverkehr .content .linien li.active .line.l-460, body.linienverkehr .content .linien li:hover .line.l-460 {
        background: #01691A; }
      body.linienverkehr .content .linien li.active .line.l-70, body.linienverkehr .content .linien li:hover .line.l-70 {
        background: #5EB648; }
      body.linienverkehr .content .linien li.active .line.l-470, body.linienverkehr .content .linien li:hover .line.l-470 {
        background: #5EB648; }
      body.linienverkehr .content .linien li.active .line.l-80, body.linienverkehr .content .linien li:hover .line.l-80 {
        background: #B2C933; }
      body.linienverkehr .content .linien li.active .line.l-480, body.linienverkehr .content .linien li:hover .line.l-480 {
        background: #B2C933; }
      body.linienverkehr .content .linien li.active .line.l-90, body.linienverkehr .content .linien li:hover .line.l-90 {
        background: #DC891F; }
      body.linienverkehr .content .linien li.active .line.l-490, body.linienverkehr .content .linien li:hover .line.l-490 {
        background: #DC891F; }
      body.linienverkehr .content .linien li.active .line.l-X425, body.linienverkehr .content .linien li:hover .line.l-X425 {
        background: #C52833; }
      body.linienverkehr .content .linien li.active .line.l-441, body.linienverkehr .content .linien li:hover .line.l-441 {
        background: #0677A1; }
      body.linienverkehr .content .linien li.active .line.l-X441, body.linienverkehr .content .linien li:hover .line.l-X441 {
        background: #0677A1; }
      body.linienverkehr .content .linien li.active .line.l-SOB, body.linienverkehr .content .linien li:hover .line.l-SOB {
        background: #935D3B; }
      body.linienverkehr .content .linien li.active .line.l-S6, body.linienverkehr .content .linien li:hover .line.l-S6 {
        background: #9338B9; }
      body.linienverkehr .content .linien li.active .line.l-S2G, body.linienverkehr .content .linien li:hover .line.l-S2G {
        background: #4D4483; }
      body.linienverkehr .content .linien li.active .line.l-S2U, body.linienverkehr .content .linien li:hover .line.l-S2U {
        background: #4D4483; }
      body.linienverkehr .content .linien li.active .line.l-MBDA, body.linienverkehr .content .linien li:hover .line.l-MBDA {
        background: #9C2500; }
      body.linienverkehr .content .linien li.active .line.l-KH, body.linienverkehr .content .linien li:hover .line.l-KH {
        background: #00AFE6; }
      body.linienverkehr .content .linien li.active .line.l-KK, body.linienverkehr .content .linien li:hover .line.l-KK {
        background: #00AFE6; }
      body.linienverkehr .content .linien li.active .line.l-EK, body.linienverkehr .content .linien li:hover .line.l-EK {
        background: #00AFE6; }
      body.linienverkehr .content .linien li.active .line.l-PO, body.linienverkehr .content .linien li:hover .line.l-PO {
        background: #00AFE6; }
      body.linienverkehr .content .linien li.active .text .title,
      body.linienverkehr .content .linien li.active .text .description, body.linienverkehr .content .linien li:hover .text .title,
      body.linienverkehr .content .linien li:hover .text .description {
        color: #494949; }
  body.linienverkehr .content .main {
    width: 58.3333333333%; }
    body.linienverkehr .content .main #transportation svg {
      width: 100%;
      height: 100%;
      background: transparent; }
    body.linienverkehr .content .main #transportation .legend {
      background: white; }
      body.linienverkehr .content .main #transportation .legend nav {
        margin-bottom: 0; }
        body.linienverkehr .content .main #transportation .legend nav ul {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-flow: row;
                  flex-flow: row;
          -webkit-box-pack: space-evenly;
              -ms-flex-pack: space-evenly;
                  justify-content: space-evenly;
          text-align: center; }
          body.linienverkehr .content .main #transportation .legend nav ul li {
            display: block;
            background: #c1c1c1;
            color: white;
            padding: 2px 4px;
            margin-right: 1px;
            font-size: 14px !important;
            min-width: 29px; }
            body.linienverkehr .content .main #transportation .legend nav ul li:last-child {
              margin-right: 0; }
        body.linienverkehr .content .main #transportation .legend nav div {
          display: none; }
      body.linienverkehr .content .main #transportation .legend div {
        padding: 10px; }
        body.linienverkehr .content .main #transportation .legend div strong {
          color: #00AFE6; }
    body.linienverkehr .content .main #transportation.interactive .legend nav {
      margin-bottom: 20px; }
      body.linienverkehr .content .main #transportation.interactive .legend nav ul li {
        cursor: pointer; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-10:hover {
          background: #FF0000; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-410:hover {
          background: #FF0000; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-20:hover {
          background: #00A046; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-420:hover {
          background: #00A046; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-25:hover {
          background: #E96814; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-425:hover {
          background: #E96814; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-30:hover {
          background: #005AC8; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-430:hover {
          background: #005AC8; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-35:hover {
          background: #B31F2B; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-435:hover {
          background: #B31F2B; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-44:hover {
          background: #E3357A; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-X44:hover {
          background: #E3357A; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-N14:hover {
          background: #E58DC0; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-45:hover {
          background: #F0E100; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-445:hover {
          background: #F0E100; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-46:hover {
          background: #14B5C7; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-446:hover {
          background: #14B5C7; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-50:hover {
          background: #87DFE9; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-450:hover {
          background: #87DFE9; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-55:hover {
          background: #00A1A0; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-455:hover {
          background: #00A1A0; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-60:hover {
          background: #01691A; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-460:hover {
          background: #01691A; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-70:hover {
          background: #5EB648; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-470:hover {
          background: #5EB648; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-80:hover {
          background: #B2C933; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-480:hover {
          background: #B2C933; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-90:hover {
          background: #DC891F; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-490:hover {
          background: #DC891F; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-X425:hover {
          background: #C52833; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-441:hover {
          background: #0677A1; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-X441:hover {
          background: #0677A1; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-SOB:hover {
          background: #935D3B; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-S6:hover {
          background: #9338B9; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-S2G:hover {
          background: #4D4483; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-S2U:hover {
          background: #4D4483; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-MBDA:hover {
          background: #9C2500; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-KH:hover {
          background: #00AFE6; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-KK:hover {
          background: #00AFE6; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-EK:hover {
          background: #00AFE6; }
        body.linienverkehr .content .main #transportation.interactive .legend nav ul li.l-PO:hover {
          background: #00AFE6; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-10.active {
      background: #FF0000; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-410.active {
      background: #FF0000; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-20.active {
      background: #00A046; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-420.active {
      background: #00A046; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-25.active {
      background: #E96814; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-425.active {
      background: #E96814; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-30.active {
      background: #005AC8; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-430.active {
      background: #005AC8; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-35.active {
      background: #B31F2B; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-435.active {
      background: #B31F2B; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-44.active {
      background: #E3357A; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-X44.active {
      background: #E3357A; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-N14.active {
      background: #E58DC0; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-45.active {
      background: #F0E100; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-445.active {
      background: #F0E100; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-46.active {
      background: #14B5C7; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-446.active {
      background: #14B5C7; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-50.active {
      background: #87DFE9; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-450.active {
      background: #87DFE9; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-55.active {
      background: #00A1A0; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-455.active {
      background: #00A1A0; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-60.active {
      background: #01691A; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-460.active {
      background: #01691A; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-70.active {
      background: #5EB648; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-470.active {
      background: #5EB648; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-80.active {
      background: #B2C933; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-480.active {
      background: #B2C933; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-90.active {
      background: #DC891F; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-490.active {
      background: #DC891F; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-X425.active {
      background: #C52833; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-441.active {
      background: #0677A1; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-X441.active {
      background: #0677A1; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-SOB.active {
      background: #935D3B; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-S6.active {
      background: #9338B9; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-S2G.active {
      background: #4D4483; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-S2U.active {
      background: #4D4483; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-MBDA.active {
      background: #9C2500; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-KH.active {
      background: #00AFE6; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-KK.active {
      background: #00AFE6; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-EK.active {
      background: #00AFE6; }
    body.linienverkehr .content .main #transportation .legend nav ul li.l-PO.active {
      background: #00AFE6; }
    body.linienverkehr .content .main .download {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-flow: row;
              flex-flow: row;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between; }
      body.linienverkehr .content .main .download .download-element {
        background: white;
        text-align: center;
        margin-bottom: 20px;
        width: 340px; }
        body.linienverkehr .content .main .download .download-element a {
          display: block;
          margin: 0 auto;
          background-size: 40px 40px;
          background-repeat: no-repeat;
          padding: 13px 0 14px 0; }
        body.linienverkehr .content .main .download .download-element.fahrzeiten a {
          width: 240px;
          padding: 13px 20px 14px 74px;
          background-position: 20px 6px;
          background-image: url("/files/spangler/icons/fahrzeiten.svg"); }
        body.linienverkehr .content .main .download .download-element.fahrpreise a {
          width: 240px;
          padding: 13px 20px 14px 74px;
          background-position: 20px 6px;
          background-image: url("/files/spangler/icons/fahrpreise.svg"); }
        body.linienverkehr .content .main .download .download-element a:link, body.linienverkehr .content .main .download .download-element a:visited {
          font-size: 32px;
          color: #4A4A4A; }

body.linienverkehr.all-active .content .linien li .line.l-10 {
  background: #FF0000; }

body.linienverkehr.all-active .content .linien li .line.l-410 {
  background: #FF0000; }

body.linienverkehr.all-active .content .linien li .line.l-20 {
  background: #00A046; }

body.linienverkehr.all-active .content .linien li .line.l-420 {
  background: #00A046; }

body.linienverkehr.all-active .content .linien li .line.l-25 {
  background: #E96814; }

body.linienverkehr.all-active .content .linien li .line.l-425 {
  background: #E96814; }

body.linienverkehr.all-active .content .linien li .line.l-30 {
  background: #005AC8; }

body.linienverkehr.all-active .content .linien li .line.l-430 {
  background: #005AC8; }

body.linienverkehr.all-active .content .linien li .line.l-35 {
  background: #B31F2B; }

body.linienverkehr.all-active .content .linien li .line.l-435 {
  background: #B31F2B; }

body.linienverkehr.all-active .content .linien li .line.l-44 {
  background: #E3357A; }

body.linienverkehr.all-active .content .linien li .line.l-X44 {
  background: #E3357A; }

body.linienverkehr.all-active .content .linien li .line.l-N14 {
  background: #E58DC0; }

body.linienverkehr.all-active .content .linien li .line.l-45 {
  background: #F0E100; }

body.linienverkehr.all-active .content .linien li .line.l-445 {
  background: #F0E100; }

body.linienverkehr.all-active .content .linien li .line.l-46 {
  background: #14B5C7; }

body.linienverkehr.all-active .content .linien li .line.l-446 {
  background: #14B5C7; }

body.linienverkehr.all-active .content .linien li .line.l-50 {
  background: #87DFE9; }

body.linienverkehr.all-active .content .linien li .line.l-450 {
  background: #87DFE9; }

body.linienverkehr.all-active .content .linien li .line.l-55 {
  background: #00A1A0; }

body.linienverkehr.all-active .content .linien li .line.l-455 {
  background: #00A1A0; }

body.linienverkehr.all-active .content .linien li .line.l-60 {
  background: #01691A; }

body.linienverkehr.all-active .content .linien li .line.l-460 {
  background: #01691A; }

body.linienverkehr.all-active .content .linien li .line.l-70 {
  background: #5EB648; }

body.linienverkehr.all-active .content .linien li .line.l-470 {
  background: #5EB648; }

body.linienverkehr.all-active .content .linien li .line.l-80 {
  background: #B2C933; }

body.linienverkehr.all-active .content .linien li .line.l-480 {
  background: #B2C933; }

body.linienverkehr.all-active .content .linien li .line.l-90 {
  background: #DC891F; }

body.linienverkehr.all-active .content .linien li .line.l-490 {
  background: #DC891F; }

body.linienverkehr.all-active .content .linien li .line.l-X425 {
  background: #C52833; }

body.linienverkehr.all-active .content .linien li .line.l-441 {
  background: #0677A1; }

body.linienverkehr.all-active .content .linien li .line.l-X441 {
  background: #0677A1; }

body.linienverkehr.all-active .content .linien li .line.l-SOB {
  background: #935D3B; }

body.linienverkehr.all-active .content .linien li .line.l-S6 {
  background: #9338B9; }

body.linienverkehr.all-active .content .linien li .line.l-S2G {
  background: #4D4483; }

body.linienverkehr.all-active .content .linien li .line.l-S2U {
  background: #4D4483; }

body.linienverkehr.all-active .content .linien li .line.l-MBDA {
  background: #9C2500; }

body.linienverkehr.all-active .content .linien li .line.l-KH {
  background: #00AFE6; }

body.linienverkehr.all-active .content .linien li .line.l-KK {
  background: #00AFE6; }

body.linienverkehr.all-active .content .linien li .line.l-EK {
  background: #00AFE6; }

body.linienverkehr.all-active .content .linien li .line.l-PO {
  background: #00AFE6; }

body.linienverkehr.all-active .content .linien li .text .title,
body.linienverkehr.all-active .content .linien li .text .description {
  color: #494949; }

.main .mod_article .travel-info div.image {
  width: 100%;
  height: 400px;
  background-position: center;
  background-size: cover; }

.main .mod_article .travel-info div.tabs {
  overflow: hidden;
  background: #F7F7F7;
  border-radius: 0; }
  .main .mod_article .travel-info div.tabs a {
    text-transform: uppercase;
    color: #494949;
    padding: 1.2em; }
    .main .mod_article .travel-info div.tabs a.active, .main .mod_article .travel-info div.tabs a.active:hover {
      background: white;
      color: #00AFE6; }

.main .mod_article .travel-info div.tab ul.list {
  padding-left: 20px;
  list-style-type: disc; }

.main .mod_article .travel-info div.tab table.reiseverlauf tr td:first-child {
  white-space: nowrap; }

.main .mod_article .travel-info div.tab .timetable {
  padding: 0 20px;
  text-align: center; }
  .main .mod_article .travel-info div.tab .timetable h1, .main .mod_article .travel-info div.tab .timetable h2, .main .mod_article .travel-info div.tab .timetable h3, .main .mod_article .travel-info div.tab .timetable h4, .main .mod_article .travel-info div.tab .timetable h5, .main .mod_article .travel-info div.tab .timetable h6 {
    display: inline-block;
    padding: 14px 0 14px 80px;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
    font-size: 32px !important;
    text-transform: uppercase;
    background-image: url("/files/spangler/icons/abfahrtzeiten.svg");
    background-repeat: no-repeat; }
  .main .mod_article .travel-info div.tab .timetable table.striped tbody tr th {
    padding: .78571429em .78571429em;
    color: #00AFE6; }
  .main .mod_article .travel-info div.tab .timetable table.striped tbody tr:nth-child(2n) {
    background-color: #EEFBFF !important; }
  .main .mod_article .travel-info div.tab .timetable table.striped tbody tr td {
    color: #494949;
    border-top: 0 !important; }
    .main .mod_article .travel-info div.tab .timetable table.striped tbody tr td:first-child {
      width: 60% !important; }

.main .mod_article .travel-info div[data-tab] h1, .main .mod_article .travel-info div[data-tab] h2, .main .mod_article .travel-info div[data-tab] h3, .main .mod_article .travel-info div[data-tab] h4, .main .mod_article .travel-info div[data-tab] h5, .main .mod_article .travel-info div[data-tab] h6 {
  font-size: 16px !important;
  font-weight: 700 !important;
  margin-top: 30px; }
  .main .mod_article .travel-info div[data-tab] h1:first-child, .main .mod_article .travel-info div[data-tab] h2:first-child, .main .mod_article .travel-info div[data-tab] h3:first-child, .main .mod_article .travel-info div[data-tab] h4:first-child, .main .mod_article .travel-info div[data-tab] h5:first-child, .main .mod_article .travel-info div[data-tab] h6:first-child {
    margin-top: 0; }

.main .mod_article .travel-info div[data-tab=terminepreise] table, .main .mod_article .travel-info div[data-tab=terminpreise] table, .main .mod_article .travel-info div[data-tab=terminpreis] table {
  border-radius: 0; }
  .main .mod_article .travel-info div[data-tab=terminepreise] table tr td:first-child(), .main .mod_article .travel-info div[data-tab=terminpreise] table tr td:first-child(), .main .mod_article .travel-info div[data-tab=terminpreis] table tr td:first-child() {
    width: 90%; }
  .main .mod_article .travel-info div[data-tab=terminepreise] table.price tr td, .main .mod_article .travel-info div[data-tab=terminpreise] table.price tr td, .main .mod_article .travel-info div[data-tab=terminpreis] table.price tr td {
    font-size: 20px;
    font-weight: 700;
    color: #c1c1c1;
    border-left: 0; }
    .main .mod_article .travel-info div[data-tab=terminepreise] table.price tr td:last-child span, .main .mod_article .travel-info div[data-tab=terminpreise] table.price tr td:last-child span, .main .mod_article .travel-info div[data-tab=terminpreis] table.price tr td:last-child span {
      background: #00AFE6;
      color: white;
      padding: 6px 30px;
      border-radius: 20px; }
  .main .mod_article .travel-info div[data-tab=terminepreise] table.wish, .main .mod_article .travel-info div[data-tab=terminpreise] table.wish, .main .mod_article .travel-info div[data-tab=terminpreis] table.wish {
    background: #00AFE6;
    color: white;
    border: 0; }
    .main .mod_article .travel-info div[data-tab=terminepreise] table.wish tr td, .main .mod_article .travel-info div[data-tab=terminpreise] table.wish tr td, .main .mod_article .travel-info div[data-tab=terminpreis] table.wish tr td {
      font-weight: 700;
      border-top-color: white;
      border-left: 0; }
      .main .mod_article .travel-info div[data-tab=terminepreise] table.wish tr td:last-child, .main .mod_article .travel-info div[data-tab=terminpreise] table.wish tr td:last-child, .main .mod_article .travel-info div[data-tab=terminpreis] table.wish tr td:last-child {
        font-size: 18px;
        font-weight: 700;
        white-space: nowrap; }

body.error-404 {
  background: #f0f0f0; }
  body.error-404 #page {
    text-align: center;
    margin-top: 50px; }
    body.error-404 #page div {
      color: #00AFE6;
      font-family: 'Source Sans Pro', sans-serif;
      font-weight: 400 !important;
      font-size: 40px !important; }
      body.error-404 #page div.error {
        color: rgba(0, 175, 230, 0.8);
        background-image: url("/files/spangler/404/vogel_404.jpg");
        background-position: center top;
        background-repeat: no-repeat;
        background-size: contain;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 700 !important;
        font-size: 250px !important;
        min-height: 600px;
        letter-spacing: 20px; }
      body.error-404 #page div.link a {
        background: #00AFE6;
        font-family: 'Source Sans Pro', sans-serif;
        font-weight: 400 !important;
        font-size: 16px !important;
        letter-spacing: 2px;
        text-transform: uppercase;
        border-radius: 40px;
        padding: 20px;
        display: block;
        margin: 0 auto;
        width: 230px;
        color: white; }

body.ie.linienverkehr .content .main #transportation svg {
  height: 35em; }




.baustelle-hervorgehoben {
  background-color: #f6df6d!important;
}
.hinweis-icon {
  background-image:url("/files/spangler/icons/achtung.png");
}

@media screen and (min-width: 631px) {
  .view-mobile {
    display:none;
  }
}

@media screen and (max-width: 630px) {
  .view-desktop {
    display:none;
  }
}

.eventbusse img {
  width:100%;
  height:auto;
}

.height-banner-busanmietung {
  height:300px;
}


/* Formular Reiseanmeldung */

.anmeldung {
  margin:10px 0;
}

.anmeldung label {
  margin:0;
}

.anmeldung input {
  margin:0;
  width:100%;
  height:2em;
  border:1px solid #CCC;
}

.anmeldung textarea {
  width:100%;
  border:1px solid #CCC;
}

.anmeldung select {
  width:250px;
  margin:0 10px;
}

.anmeldung legend {
  padding:0 10px;
}

.anmeldung-radio legend {
  padding:0 10px;
}

.anmeldung-radio label {
  padding-left:3px;
  margin-right:15px;
}

.anmeldung-margin {
  margin-bottom:50px;
}

.anmeldung-margin-20 {
  margin-bottom:20px;
}

.anmeldung-margin-10 {
  margin-bottom:10px;
}

.anmeldung-button {
  background-color:#00AFE6!important;
}
.anmeldung-button button {
  background-color:#00AFE6!important;
}
.anmeldung-button:hover {
  background-color:#27bff2!important;
}


/* Formular 365€ Ticket */

.text-formular-klein {
  font-size: 14px !important;

}





* {
	 box-sizing: border-box;
}
 @-webkit-keyframes ticker {
	 0% {
		 -webkit-transform: translate3d(0, 0, 0);
		 transform: translate3d(0, 0, 0);
		 visibility: visible;
	}
	 100% {
		 -webkit-transform: translate3d(-200%, 0, 0);
		 transform: translate3d(-200%, 0, 0);
	}
}
 @keyframes ticker {
	 0% {
		 -webkit-transform: translate3d(0, 0, 0);
		 transform: translate3d(0, 0, 0);
		 visibility: visible;
	}
	 100% {
		 -webkit-transform: translate3d(-200%, 0, 0);
		 transform: translate3d(-200%, 0, 0);
	}
}
 .ticker-wrap {
	 overflow: hidden;
	 height: 4rem;
	 background-color: #a21c12;
	 padding-left: 100%;
	 box-sizing: content-box;
   margin: 3px 0 0 0;
}
 .ticker-wrap .ticker {
	 display: inline-block;
	 height: 4rem;
	 line-height: 4rem;
	 white-space: nowrap;
	 padding-right: 100%;
	 box-sizing: content-box;
	 -webkit-animation-iteration-count: infinite;
	 animation-iteration-count: infinite;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 -webkit-animation-name: ticker;
	 animation-name: ticker;
	 -webkit-animation-duration: 25s;
	 animation-duration: 25s;
}
 .ticker-wrap .ticker__item {
	 display: inline-block;
	 padding: 0 2rem;
	 font-size: 1.8rem;
   font-weight: 700;
	 color: white;
}


.image-scale img {
  width:100%!important;
  height:auto!important;
}


/* Anpassung Mobile Navi Linienverkehr */

.linienverkehr-mobile nav {
  width: 100%!important;
}
@media screen and (max-width: 906px) {
  .linienverkehr-mobile {
    display:inline-block!important;
  }
}
@media screen and (min-width: 906px) {
  .linienverkehr-mobile {
    display:none!important;
  }
}