/* jQuery Modal */
.jquery-modal.blocker {
    z-index: 1000;
    background-color: rgba(128, 128, 128, 0.8);
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
    transition: 0.4s;
}
.jquery-modal > .modal {
    box-shadow: 0 0 1em rgba(0,0,0, 0.6);
}
@media only screen and (max-width: 800px) {
    /* keine vertikale Zentrierung */
    .jquery-modal.blocker::before {
        content: normal;
    }
}

/* 	===========================
	Cookie-Consent
 	===========================  */

#cookiesettings {
    width: 96%;
    max-width: 900px;
    padding-bottom: 30px;
    border-radius: 0;
}
.settings-wrap h4+p {
  margin-top: 0;
}
fieldset.cookiesettings-options {
  font-size: 18px;
  line-height: 26px;
  padding: 0;
  border: 0;
  margin: 0;
}
.cookiesettings-options .option {
    margin: 10px 0;
    position: relative;
}
.cookiesettings-options label {
    display: block;
    padding-left: 35px;
    cursor: pointer;
}
.cookiesettings-options input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.cookiesettings-options .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border-radius: 4px;
    border: 2px solid #888;
    pointer-events: none;
}
.cookiesettings-options input:checked ~ .checkmark {
    background-color: #009fe3;
    border-color: #009fe3;
}
.cookiesettings-options .checkmark:after {
  content: "";
  position: absolute;
    left: 5px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    box-sizing: inherit;
}
.cookiesettings-options input:disabled ~ .checkmark {
  background-color: #ccc;
  border-color: #ccc;
}
.cookiesettings-options input:disabled + label {
  cursor: default;
}

.cookiesettings-details {
  font-size: 0.9em;
  margin-bottom: 30px;
}
.settings-wrap .submit-container {
  text-align: center;
  margin-top: 1em;
}
.settings-wrap button {
    cursor: pointer;
    background: #fff;
    color: inherit;
    text-align: center;
    border: 2px solid transparent;
    border-radius: 4px;
    padding: 8px 30px;
    font-size: 18px;
    font-weight: 700;
    transition: 0.25s;
}
.settings-wrap button:not(:first-child) {
  margin-left: 10px;
}
.settings-wrap button.button-primary {
  background: #009fe3;
  color: #fff;
}.settings-wrap button.button-primary:hover {
  background: #0090cd;
}
.settings-wrap button.button-secondary {
  border-color: #888;
}.settings-wrap button.button-secondary:hover {
  background: #888;
  color: #fff;
}

@media (min-width: 720px) {
    .cookiesettings-options {
        display: flex;
        flex-wrap: wrap;
    }
    .cookiesettings-options .option {
        min-width: 150px;
        width: 33.33%;
    }
}
@media (max-width: 900px) {
    #cookiesettings {
        padding-left: 5vw;
        padding-right: 5vw;
    }
    .settings-wrap button[type=submit] {
        width: 20em;
        max-width: 100%;
        margin: 1em 0 0;
    }
}


/* 	===========================
	Cookie-Meldung
 	===========================  */
#cookie-alert {
    position: relative;
    z-index: 1;
    background-color: #2A79B4;
    color: #eee;
    font-size: 14px;
    line-height: normal;
}
#cookie-alert .inner {
    width: 90%;
    max-width: 1400px;
    padding: 12px 0 10px;
    margin: 0 auto;
}
button#close-alert {
    float: right;
    background-color: #236596;
    color: #fff;
    padding: 5px 20px;
    border: 1px solid #174364;
    border-radius: 4px;
    margin: 3px 0 3em 16px;
    cursor: pointer;
}
#close-alert:hover {
    background-color: #174364;
}

/* 	===========================
	NDA
 	===========================  */
#nda-alert {
    background-color: #eee;
    /*color: #888;*/
    text-transform: none;
    font-family: Nimbus, "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align: center;
}
#nda-alert .inner {
    padding: 0.5em 0;
}
#nda-alert [class *= "ti-"] {
    color: #e50000;
}

/* 	===========================
	Meldung alter Jahrgang
 	===========================  */
#old-year-alert {
    position: relative;
    z-index: 1;
    background-color: #666;
    color: #eee;
    font-size: 15px;
    line-height: normal;
    min-height: 78px;
    overflow: hidden;
    border-bottom: 8px solid #e50000;
    transition: min-height 0.3s;
}
#old-year-alert.closed {
    height: 0;
    min-height: 0;
}
#old-year-alert.hover-enabled:hover {
    height: 78px;
}
#old-year-alert .inner {
    width: 90%;
    max-width: 1400px;
    padding: 12px 0 10px;
    margin: 0 auto;
}
#old-year-alert img {
    float: right;
    margin-left: 16px;
    cursor: pointer;
}
#old-year-alert.hover-enabled img {
    display: none;
}
#old-year-alert button {
    float: right;
    background-color: #444;
    color: #fff;
    padding: 5px 20px;
    border: 1px solid #222;
    border-radius: 4px;
    margin: 1px 0 8px 1.2em;
    cursor: pointer;
}
#old-year-alert button:hover {
    background-color: #222;
}

/* 	===========================
	bikeLocal
 	===========================  */

#data-availability,
.bike-available-button {
    order: 1;
}
#data-availability a,
.bike-available-button a {
    background: #ccc;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    padding: 0.3em 1.2em;
    border: 0;
    border-radius: 1em;
    text-decoration: none;
    transition: 0.4s;
}
#data-availability a.is-available,
.bike-available-button a.is-available {
    background: #000;
    padding-inline: 0.8em;
}
#data-availability a.selected-bike-size,
.bike-available-button a.selected-bike-size {}
#data-availability a:hover,
.bike-available-button a:hover {
    background: #e50000;
}
.bike-has-discount #data-availability a.is-available,
.bike-has-discount .bike-available-button a.is-available,
.has-discount .bike-available-button a.is-available {
    background: #e50000;
}
.bike-has-discount #data-availability a.is-available:hover,
.bike-has-discount .bike-available-button a.is-available:hover,
.has-discount .bike-available-button a.is-available:hover{
    background: #000;
}

/* Modal */
#bike-local-modal,
div.bike-local-modal {
    width: 100%;
    max-width: 1400px;
    height: 95%;
    padding: 0;
}
#bike-local-modal iframe,
.bike-local-modal iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

/* bikeLocal Button in Bike-Card */
.bike .bike-available-button {
    transform: translateY(-25%); 
    padding-bottom: 20px;
}
.bike .bike-available-button a:not(.is-available) {
    /* only show Button, when bike is available */
    visibility: hidden;
}
@media (hover:hover) {
    .bike .bike-available-button {
        transform: translateY(-50%); 
        transition: 0.3s;
        opacity: 0;
    }
    .bike:hover .bike-available-button {
        transform: translateY(-25%); 
        opacity: 1;
    }
}


.button {
    color: #999;
    display: inline-block;
    font-size: 1rem;
    text-decoration: none;
    white-space: nowrap;
    padding-right: 20px;
    -webkit-transition: 0.2s;
            transition: 0.2s;
}
.button:hover {
    color: #e50000;
}
a.button::after,
a .button::after,
.button a::after {
    /*
    » › ❯ ⟩ ⧽ ▹ → ➝ ▸ ➤
    */
    content: "⟩";
    content: "\e649";
    font-family: themify;
    font-size: 0.875em;
    position: absolute;
    margin-left: 0.5em;
    -webkit-transition: margin 0.2s;
            transition: margin 0.2s;
}
a.button:hover::after,
a .button:hover::after,
.button a:hover::after {
    margin-left: 0.8em;
}
.button.bg-red,
.button.bg-black,
.button.bg-gray {
    color: #fff;
    font-weight: 600;
    padding: 0.5em 60px 0.5em 40px;
}
.button.bg-red { background: url(../../img/design/button-red.svg) no-repeat right top !important; }
.button.bg-black { background: url(../../img/design/button-black.svg) no-repeat right top !important; }
.button.bg-gray { background: url(../../img/design/button-gray.svg) no-repeat right top !important; }

.button.formsubmit {
    background-color: #333;
    color: #fff;
    width: 100%;
    padding-top: 8px;
    padding-right: 30px;
    border-radius: 5px;
}
.button.formsubmit:hover {
    background-color: #000;
}

.button a {
    text-decoration: none;
}

#headercontrols form {
    margin-bottom: 0
}
form#bikeSearch {
}
#search-container:hover #bikeSearch {
    display: block;
}
.js form#bikeSearch {
    display: block;
    /*position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;*/
}
#bikeSearch .form-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    font-size: 1rem;
    width: 90%;
    max-width: 500px;
    margin: 0 auto;
    opacity: 0;
    -webkit-transition: opacity 0.4s 0.2s;
            transition: opacity 0.4s 0.2s;
}
.search-active form#bikeSearch {
    z-index: 0;
}
.search-active #bikeSearch .form-inner {
    opacity: 1;
}

#bikeSearch input,
#bikeSearch button {
    vertical-align: middle;
    line-height: normal;
    padding: 0.6em 1em;
    border: 0;
    border-radius: 0;
}
input#query {
    display: inline;
    -webkit-box-flex: 82%;
    -webkit-flex: 82% 1 1;
        -ms-flex: 82% 1 1;
            flex: 82% 1 1;
    box-shadow: none;
}
input#searchBike {
    box-sizing: content-box;
    -webkit-box-flex: 18%;
    -webkit-flex: 18% 1 0;
        -ms-flex: 18% 1 0;
            flex: 18% 1 0;
}
/*#query::-webkit-input-placeholder {
    color: #383838;
}
#query:-o-placeholder {
    color: 383838;
}
#query:placeholder {
    color: #383838;
}*/
form#bikeSearch {
    overflow: hidden;
    background-color: rgba(245,245,245,0.95);
    padding-top: 17px;
    padding-bottom: 17px;
    transition: 0.4s;
}
.js form#bikeSearch {
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
}
.search-active form#bikeSearch {
    height: 70px;
    padding-top: 17px;
    padding-bottom: 17px;
}
input#query {
    background-color: #fff;
}
input#query:focus {
    outline: 0;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.15);
}
button#searchBike {
    background-color: #ddd;
    white-space: nowrap;
    padding-top: 0.3em;
    padding-bottom: 0.3em;
}
button#searchBike .ti-search {
    position: relative;
    top: 3px;
    left: 2px;
    font-size: 20px;
}
button#searchBike span {
    display: inline-block;
    text-indent: -999em;
}
#search-close,
li#search-container {
    display: none;
}
.js #search-close,
.js li#search-container{
    display: block;
}
.js #search-close {
    width: 46px;
    flex-shrink: 0;
    background: url(../../img/design/btn-close-grey.svg) no-repeat left;
    cursor: pointer;
}

/* Contao-Suchergebnisse */
#cms-search-results > div {
    max-width: 56em;
}
.cms-search-result {
    margin-block: 3em;
}
.cms-search-result h3 {
    margin: 0;
}
.cms-search-result h3 a {
    display: block;
    text-decoration: none;
    padding-block: 0.8rem;
}
.cms-search-result:hover h3 a {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.4em;
}
.cms-search-result h3 a:hover {
    text-decoration-color: currentColor;
    text-decoration-color: #e50000;
}
.cms-search-result p.context {
    margin-top: 0;
}

/* Startseite */
#start .headersection {
  background: transparent;
}
#start #container {
    background-color: #333;
    background: #333 url(../../img/design/bg_mood.jpg) no-repeat 50% 20% / cover;
}
#start .slick-slider {
    margin-bottom: 0;
}
#slider2016 .slick-track {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
#slider2016 a {
    display: block;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100%;
    height: auto;
}
#slider2016.pinned a:not(:first-child) {
    margin-top: 20px;
}
#slider2016 .layout_latest {
    font-size: 0.85em;
}
#slider2016 .text {
    position: relative;
    top: -20px;
    z-index: 1;
    line-height: 1.25;
    padding: 10px 15px;
    max-width: 480px;
    margin: calc(56.25vw - 2.5em) 3% 0;
    opacity: 0;
    -webkit-transition: 0.6s 0.6s;
            transition: 0.6s 0.6s;
}
#slider2016 .slider-ohne-text .text {
    display: none;
}
#slider2016 .slick-active .text,
#container2 #slider2016 .text {
    opacity: 1;
    top: 0;
}
/*#slider2016 .text::before {
    background-color: #000;
    bottom: 0;
    box-shadow: 0 0 25px 10px #000;
    content: "";
    left: 0;
    opacity: 0.15;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}*/
#slider2016 .text h4 {  /* Dachzeile */
    color: #fff;
    font-size: 1.1em;
    font-weight: 400;
    margin: 0 0 18px;
    text-shadow: 2px 0 16px rgba(0,0,0, .5);
}
/*#slider2016 .text h4::after {
    content: "//";
    display: inline-block;
    color: #e50000;
    letter-spacing: -0.16em;
    text-shadow: none;
    -webkit-transform: skewX(-14deg);
        -ms-transform: skewX(-14deg);
            transform: skewX(-14deg);
    margin-left: 0.333em;
}*/
#slider2016 .text h2 {  /* Headline */
    font-size: 7vw;
    line-height: 1.1;
    margin: 0;
}
#slider2016 .text h3 {  /* Subline */
    font-size: 1.333em;
    font-weight: 600;
    margin: 28px 0 0;
}
/* Buttons für Slider */
#slider-buttons.desktop-only {
    /* unsichtbar unterhalb von 740px */
}

#start #container2 h1 {
    font-weight: normal;
}
@media (min-width: 450px) {
    #slider2016 .text h2 {
        font-size: 2em;
    }
}
@media (orientation: landscape) and (max-width: 719px) {
    #slider2016 .text {
        margin: calc(53vw - 8em) 3% 0;
    }
    #slider2016 .text h2 {
        color: #fff;
    }
    #slider2016 a {
        background-size: 100% !important;
    }
}
@media (min-width: 720px) {
    #slider2016 a {
        background-position: left;
        background-size: cover;
    }
    #slider2016 .text {
        color: #fff;
        margin: 60px 3%;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.33);
    }
    #slider2016 .text h2 {
    }
}
@media (min-width: 900px) {
    #slider2016 .text h2 {
        font-size: 2.235294em;
    }
}

/* aktuelles Thema */
.linkteaser .ce_hyperlink {
    width: 100%;
    text-align: center;
}

/* Hauptkategorien als Startseiteninhalt */
.startcategories { overflow: hidden; }

/* link to highlights between start page text and main categories */
#page .ce_text.highlights {
}

#page .ce_text.highlights a {
    display: block;
    margin: 1em 0;
    padding: 0.25em 0.5em;
    border-radius: 0.1em;
    background: #000000;
    color: white;
    /* max-width: 20em; */
    background: #f63333;
    font-size: 150%;
    border-radius: 0.02em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}

#page .ce_text.highlights a::after {
    content: " ▶";
}


/* 3 Teaserkacheln auf Startseite */
.linkteaser {
    background-color: #f0f0f0;
}

/* 3 Top-News auf Startseite (entfernt) */
.startnews {
    background-color: #4b4b4b;
    color: #fff;
}
.startnews h1 {
    font-size: 2em;
    margin: 0.2em 0 0;
}
.startnews h1 a {
    text-decoration: none;
}
.startnews h1 span {
    vertical-align: -0.045em;
    line-height: 1;
}
#startnews .news-item {
    position: relative;
    color: #E9E9E9;
    padding-bottom: 2.4em;
}
#startnews h2 {
    margin-top: 1.5em;
    margin-bottom: 0.4em;
}
#startnews header {
    display: none; /* wird nur auf Übersichtsseite gezeigt */
}
.news-item a {
    text-decoration: none;
}
.news-item .image_container {
    text-align: center;
}
#startnews p.more {
    position: absolute;
    right: 0.25em;
    bottom: 0;
    margin: 0;
    color: #bbb;
}
.news-item a:hover span.button {
    color: #e50000;
}
.news-item a:hover .button::after {
    margin-left: 0.8em;
}

/* 4 Events auf Startseite */
.startevents h1 {
    margin-top: 2em;
}
#startevents {}
#startevents .event {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    line-height: 1.2;
    text-align: center;
}
#startevents h2 {
    margin-bottom: 0.5em;
}
#startevents a {
    color: #999;
    text-decoration: none;
}
#startevents .image_container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    height: 80px;
}
#startevents img {
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
    -webkit-filter: gray;
            filter: gray;
    -webkit-transition: -webkit-filter 0.3s, filter 0.3s;
            transition: filter 0.3s;
}
#startevents .event:hover img {
    -webkit-filter: grayscale(0);
            filter: grayscale(0);
    -webkit-filter: none;
            filter: none;
}
#startevents p.time {
    font-weight: 600;
    margin-bottom: 0;
}
#startevents p.location {
    font-weight: 600;
    margin-top: 0;
}
#startevents .teaser {
    /*display: none;*/
    font-size: 15px;
    /*text-align: justify;*/
}
#startevents .external {
    font-size: 15px;
}
#startevents .event:hover .external a,
#startevents a:hover {
    color: #e50000;
}
#start p#claim-bottom {
    margin-top: 60px;
}


/* Bike-Seite */
#bike-header {
    padding-top: 22px; /* Platz für fixierte Navi */
}
#bike-header > div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
}
#bike-header > div > div {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
        -ms-flex-order: 4;
            order: 4;
}
#bike #bikename {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
}
#bike-header h1 {
    display: inline-block; /* shrink-2-fit */
	line-height: 0.9;
	padding: 10px 0 8px 0.95em;
    margin-top: 0;
    margin-bottom: 6px;
}
#bike-header h1::before {
    position: absolute;
    margin-left: -0.95em;
    margin-top: 0.1em;
}
#bike-header .bike_version {
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 200;
    letter-spacing: 0.02em;
    display: inline-block;
}
/*#bike-header h1 a.custom-icon {
    display: inline-block;
    background: url(../../img/design/custom-bikes-h25.svg) no-repeat left 3px;
    text-indent: -999em;
    width: 38px;
    margin-left: -2px;
}*/

#bikeslider {
    text-align: center;
    min-width: 1px; /* bugfix für FF 34+ . Ansonsten wird Bild nicht verkleinert */
    margin-bottom: 50px;
}
#bikeslider figure {
    margin: 0 auto;
    outline: 0;
}
#bikeslider figure a {
    cursor: -webkit-zoom-in;
    cursor: zoom-in;
    outline: 0;
}
#bikeslider img {
    margin: 0 auto;
    padding-top: 20px;
    max-height: 85vw; /* Hochformnat/Topview */
}
#bikeslider img[src*="angled"],
#bikeslider img[src*="rear"],
#bikeslider img[src*="_top"],
#bikeslider img[src*="_fk"] {
    padding-top: 0;
}
#bikeslider figcaption {
    position: absolute;
    bottom: 0;
    font-size: 14px;
    font-weight: 300;
    text-align: center;
    width: inherit;
}
#bikeslider figcaption:not(:empty) {
    /* als Störer/Hinweis */
    /*padding-bottom: 0;*/
    bottom: 13%;
    font-size: 24px;
    background: rgba(255,255,255,0.75);
}
.slick-prev, .slick-next {
    z-index: 1;
    width: 35px;
    height: 42px;
}
button.slick-disabled {
    cursor: default;
}
.slick-prev::before, .slick-next::before {
    color: #999;
    font-family: themify;
    font-size: 36px;
}
.slick-prev::before {
    content: "\e64a";
}
.slick-next::before {
    content: "\e649";
}
.slick-dots li button::before {
    font-size: 8px;
}
.slick-dots li.slick-active button::before {
    color: #e50000;
}
.slick-dots li:only-child {
    display: none;
}
@media (max-width: 599px){
  .slick-prev, .slick-next {
      display: none !important;
  }
}

/* Bikedaten als Tabelle */
#bikedata {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    -webkit-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
	  font-size: 14px;
}
#bikedata > div {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}
#data-core {
    margin-bottom: 1rem;
}
#bikedata table {}
#bikedata td,
#bikedata th {
    padding: 3px 1em 3px 0;
}
#bikedata th {
}

/* Farbbullets */
#bikedata .bike-color {
    display: inline-block;
    padding: 3px 0;
    margin:  3px 0;
    cursor: pointer;
}
@media (hover: hover) {
    #bikedata .bike-color { margin: 0; }
}
#bikedata .bike-color:only-child {
    cursor: unset;
}
#bikedata .bike-color:first-child { padding-top: 0; margin-top: 0; }
#bikedata .bike-color:last-child  { padding-bottom: 0; margin-bottom: 0; }
#bikedata .bike-color span {
    display: inline-block;
    width: 17px;
    height: 17px;
    vertical-align: -4px;
    border-radius: 50%;
    margin-right: 0.2em;
    transition: 0.3s;
}
#bikedata .bike-color:not(:only-child):hover span {
    transform: scale(1.2);
}

/* Größenbutton */
#data-size {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    min-width: 40%;
}
#data-size button {
    background: #ccc;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    padding: 0.3em 1.2em;
    border: 0;
    border-radius: 1em;
    cursor: help;
    transition: 0.4s;
}
#data-size button:hover {
    background: #e50000;
}

/* Preise als Definitionsliste */
#data-price {
    margin-top: 1em;
    margin-bottom: 1em;
}
#bikedata h4 {
    font-size: 1em;
    line-height: 1.2;
    margin: 3px 0;
}
#bikedata dl {
    line-height: 1.2;
    margin: 0;
}
#bikedata dt {
    font-weight: 300;
    margin-top: 6px;
}
#bikedata dd {
    font-size: 20px;
    margin: 0;
}
/* Custompreise */
#data-customprice .button {
    padding-left: 0;
}
#data-customprice dl {
    position: absolute;
    z-index: 20;
    visibility: hidden;
    background-color: #eee;
    color: #000;
    margin-top: -5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    width: 240px;
}
#data-customprice:hover dl {
    visibility: visible;
}
#data-customprice dt,
#data-customprice dd {
    padding: 5px 0 2px;
    margin: 0;
}
#data-customprice dt:nth-of-type(even),
#data-customprice dd:nth-of-type(even) {
    background-color: #f5f5f5;
}
#data-customprice dt {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
            flex: 1 1 50%;
    padding-left: 15px;
}
#data-customprice dd {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 15%;
        -ms-flex: 1 1 15%;
            flex: 1 1 15%;
    font-size: inherit;
    text-align: right;
    padding-right: 15px;
}

/* Konfi-Button auf Bikeseite */
#data-conf {
    text-align: center;
    margin-bottom: 40px;
}
#data-conf .button {
    position: relative;
    color: inherit;
    font-size: 1em;
    font-weight: normal;
    padding-top: 0.45em;
    padding-right: 2.5em;
    margin-top: 3px;
}
#data-conf .button span {
    display: block;
}
#data-conf .conf-logo {
    text-indent: 101%;
    line-height: 0;
    overflow: hidden;
    padding-bottom: 17%;
    background: url("../../img/design/line-custom-bikes.svg") no-repeat bottom / 100%;
}
#data-conf .button::after {
    position: absolute;
    right: 0;
    top: calc(50% - 0.45em);
    font-size: 1.8em;
    color: #bbb;
    transition: .3s;
}
#data-conf .button:hover::after {
    right: -5px;
}
@media (max-width: 799px) {
    #data-conf {
        width: calc(100% + 5vw);
        margin-left: -5vw;
    }
    #data-conf a,
    #data-conf span {
        padding-left: 5vw;
    }
}
@media (max-width: 739px) {
    #bikedata {
        -webkit-box-align: center;
            -ms-flex-align: center;
                    -ms-grid-row-align: center;
                align-items: center;
        margin-bottom: 30px;
    }
    #bikedata > div {
        margin-top: 1em;
        margin-bottom: 1em;
    }
}

/* Bike-Beschreibung */
#bikedescription {
    margin-bottom: 1.5em;
}
#bikedescription h2 {
    margin: 0;
}
#bikedescription p {
    margin-bottom: 0;
}
/* Highlights/Bulletpoints */
ul#highlights,
.highlights ul {
    font-weight: 600;
    padding: 0;
    margin-bottom: 0;
    /*margin-left: -16px;*/
}
#highlights li,
.highlights li {
    background: rgba(0, 0, 0, 0) url("../../img/design/bullet-highlights.svg") no-repeat scroll 0 0.25em;
    list-style: none;
    padding-left: 16px;
}

/* Bike-Tasks Buttonleiste */
#bike-tasks > div {
    padding-top: 10px;
}
ul#nav-bikeTasks {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-size: 14px;
    text-align: center;
    padding: 0;
    margin: 0;
}
#nav-bikeTasks li {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 110px;
        -ms-flex: 0 1 110px;
            flex: 0 1 110px;
    display: inline-block;
    margin: 10px;
}
#nav-bikeTasks a {
    text-decoration: none;
    padding-top: 10px;
    -webkit-transition: color 0.2s;
            transition: color 0.2s;
}
#nav-bikeTasks a:hover {
    color: #e50000;
}
#nav-bikeTasks a::before {
    content: "";
    display: block;
    background-color: #eee;
    color: #ccc;
    font-family: themify;
    font-size: 36px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 0 0 2px #fff;
    width: 64px;
    height: 64px;
    line-height: 64px;
    border-radius: 50%;
    margin: 0 auto 10px;
    -webkit-transition: 0.2s;
            transition: 0.2s;
}
.Explorer #nav-bikeTasks a::before {
    pointer-events: all;
}

/*#nav-bikeTasks .konf  a::before { background: #eee url(../../img/design/custom-bikes-h25.svg) no-repeat center; }*/
/*#nav-bikeTasks .konf  a::before { content: "\e6e0"; }*/ /* palette */
#nav-bikeTasks .konf span {
    padding-bottom: 6px;
    background: url("../../img/design/custom-bikes-bar.svg") no-repeat bottom / 100%;
}
#nav-bikeTasks .konf  a::before { content: "\e686"; } /* panel */
/*#nav-bikeTasks .like  a::before { content: "\e670"; }*/ /* thumb-up */
#nav-bikeTasks .mark  a::before { content: "\e6dd"; } /* pin2 */
#nav-bikeTasks .size  a::before { content: "\e616"; } /* ruler-alt */
#nav-bikeTasks .print a::before { content: "\e681"; } /* printer */
#nav-bikeTasks .deal  a::before { content: "\e691"; } /* map-alt */
#nav-bikeTasks .prev  a::before { content: "\e64a"; font-size: 28px; } /* angle-left */
#nav-bikeTasks .next  a::before { content: "\e649"; font-size: 28px; } /* angle-right */
#nav-bikeTasks .comp  a::before { content: "\e63f";   /* exchange-vertical */
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
}

#nav-bikeTasks .like  a::before {
    content: url(../../img/design/icon-facebook-outline.svg);
    background: #e5e5e5;
    opacity: 0.65;
}
#nav-bikeTasks .like  a:hover::before {
    background: #eee;
    opacity: 1;
}

#nav-bikeTasks a:hover::before {
    -webkit-transform: scale(1.2,1.2);
        -ms-transform: scale(1.2,1.2);
            transform: scale(1.2,1.2);
    color: #aaa;
}
#nav-bikeTasks .comp  a:hover::before {
    -webkit-transform: scale(1.2,1.2) rotate(90deg);
        -ms-transform: scale(1.2,1.2) rotate(90deg);
            transform: scale(1.2,1.2) rotate(90deg);
}
@media screen and (min-width: 1025px) {
    #nav-bikeTasks span.bike-name {
        opacity: 0;
        -webkit-transition: 0.2s;
                transition: 0.2s;
    }
    #nav-bikeTasks li:hover span.bike-name {
        opacity: 1;
    }
}

/* Bikeseite Technik-Features */
#bike-features {
}
.grid {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    margin: 0 -19px 0 -20px;
    /*justify-content: space-around;*/
}
.grid > * {
    margin: 20px 19px 20px 20px;
}
#bike-features a {
    text-decoration: none;
}
#bike-features article {
    background-color: #fff;
    width: 300px;
    height: 230px;
    overflow: hidden;
}
#bike-features article:nth-of-type(odd)
#bike-features article.odd {
    clear: both;
}
#bike-features .ce_text {
    position: relative;
}
#bike-features img {
    vertical-align: middle;
    opacity: 1;
    height: 188px;
    object-fit: cover;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /></filter></svg>#filter');
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
    -webkit-transition: 0.4s;
            transition: 0.4s;
}
#bike-features article:hover img {
    opacity: 0.15;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" /></filter></svg>#filter');
    -webkit-filter: grayscale(0);
            filter: grayscale(0);
}
#bike-features article h2 {
    position: absolute;
    bottom: 159px;
    z-index: 1;
    font-family: Kanit, sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 16px;
    text-transform: uppercase;
    background-color: #fff;
    background-color: rgba(255,255,255,1);
    width: 100%;
    padding: 12px 13px 12px 15px;
    border-top: 1px solid #ddd;
    margin: 0;
    -webkit-transition: background-color 0.4s;
            transition: background-color 0.4s;
}
#bike-features article:hover h2 {
    background-color: transparent;
    background-color: rgba(255,255,255,0);
    border-top: 0;
}
#bike-features article .text {
    position: relative;
    height: 200px;
    padding: 12px 15px;
    -webkit-transition: all 0.4s;
            transition: all 0.4s;
}
#bike-features article:hover .text {
    margin-top: -170px;
    padding-top: 22px;
}
#bike-features article .teasertext {
    margin-top: 32px;
}
#bike-features p.more {
    margin-top: 28px;
}
#bike-features span.button,
#tech .teaser span.button,
.associated-bikes a.button {
    background-color: #999;
    background-color: rgba(0,0,0,0.4);
    color: #fff;
    font-size: 14px;
    text-decoration: none;
    padding: 5px 28px 5px 16px;
}
#bike-features span.button:hover,
#tech .teaser span.button:hover,
.associated-bikes a.button:hover {
    background-color: #888;
    background-color: rgba(0,0,0,0.5);
}

/* Technik Lightbox */
#cboxLoadedContent {
    color: #222;
    font-size: 1em;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}
#cboxLoadedContent .mod_article {
    width: 640px;
    padding: 20px 20px 5px;
}
#cboxLoadedContent .mod_article h1 {
    font-family: Kanit, sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase;
    margin-bottom: 16px;
}
#cboxLoadedContent .mod_article h2 {
    font-family: Kanit, sans-serif;
    font-size: 17px;
    letter-spacing: 0.02em;
    line-height: normal;
    margin-top: 1em;
    margin-bottom: 0.3em;
}

#cboxLoadedContent table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin-top: 0.5em;
}
#cboxLoadedContent th, #cboxLoadedContent td {
    border-left: 1px dotted #ccc;
    padding: 4px 8px;
}
#cboxLoadedContent tr.even td {
    background-color: #f6f6f6;
}

#cboxLoadedContent .back {
    display: none;
}
#bike #cboxTitle {
    visibility: hidden;
}
#bike #cboxLoadedContent .ce_text figure.image_container {
    margin-bottom: 14px;
}
#cboxContent nav.slider-control {
    display: none;
}

/* Technik Lightbox mit Lightcase (Contao 4.x) */
@media screen and (min-width: 641px) {
  html:not([data-lc-type=error]) #lightcase-content .lightcase-contentInner .lightcase-inlineWrap { padding: 0; }
}
#lightcase-case {
  font: inherit;
}
.lightcase-inlineWrap {
    color: #222;
    font-size: 1em;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}
.lightcase-inlineWrap .mod_article {
    max-width: 640px;
    padding: 20px 20px 5px;
}
.lightcase-inlineWrap .mod_article h1 {
    font-family: Kanit, sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.lightcase-inlineWrap .mod_article h2 {
    font-family: Kanit, sans-serif;
    font-size: 17px;
    letter-spacing: 0.02em;
    line-height: normal;
    margin-top: 1em;
    margin-bottom: 0.3em;
}

.lightcase-inlineWrap table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin-top: 0.5em;
}
.lightcase-inlineWrap th, .lightcase-inlineWrap td {
    border-left: 1px dotted #ccc;
    padding: 4px 8px;
}
.lightcase-inlineWrap tr.even td {
    background-color: #f6f6f6;
}

.lightcase-inlineWrap .back {
    display: none;
}
.lightcase-inlineWrap nav.slider-control {
    display: none;
}
#bike .lightcase-inlineWrap .ce_text figure.image_container {
    margin-bottom: 14px;
}
#bike #lightcase-sequenceInfo::before {
  content: "Feature ";
}

/* Ausstattung */
#bike-specs {
}
p.warning-delivery {
    padding-left: 30px;
    position: relative;
    margin-bottom: 1em !important;
}
.warning-delivery .icon {
    position: absolute;
    top: -4px;
    left: -3px;
    font-size: 1.5em;
    color: #777;
    width: 30px;
    text-align: center;
}

#bike-specs .grid {
    margin-bottom: 20px;
}
#bike-specs .grid > div,
#bike-specs .grid > section {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 325px;
        -ms-flex: 1 1 325px;
            flex: 1 1 325px;
}
#bike-specs table {
    font-size: 15px;
    width: 100%;
}
#bike-specs caption {
    text-align: left;
    text-transform: uppercase;
    padding-bottom: 0.2em;
}
#bike-specs th,
#bike-specs td {
    padding: 0.3em 1.5em 0.1em 0;
    border-top: 1px solid #aaa;
}
#bike-specs th {
    font-weight: 600;
    width: 9em;
}
#bike-specs td:nth-child(2) {
    width: 24px;
    box-sizing: content-box;
}
#bike-specs td.art_name {
    padding-right: 0;
}
#bike-specs p {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    font-size: 15px;
    margin: 0;
}

.art-group {
    font-size: 15px;
}
.art-group h3 {
    font-weight: 300;
    font-size: 1em;
    text-transform: uppercase;
    margin: 0 0 0.2em 30px;
}
.art-group dl {
    position: relative;
    border-top: 1px solid #ccc;
    margin: 0;
    padding: 7px 24px 3px 30px;
}
.art-group dt {
    display: inline;
    font-weight: bold;
}
.art-group dt img {
    position: absolute;
    left: 0;
    margin-top: 2px;
}
dt:before {
    content: "";
    display: block;
}
dd.art-name {
    display: inline;
    margin-left: 0.25em;
}
dd.tech-info {
    font-size: 14px;
    margin-left: 0;
}
.tech-info ul {
    padding-left: 2em;
    margin: 0.3333em 0;
    list-style: square;
}
dl.hasextra {
    cursor: pointer;
}
dl.closed:after {
    content: "+";
}
dl.open:after {
    content: "\2212"; /* minus */
}
dl.hasextra:after {
    color: #aaa;
    font-family: "Times New Roman";
    font-size: 1.2em;
    position: absolute;
    right: 0;
    top: 5.5px;
    text-align: center;
    width: 1em;
    height: 1em;
    line-height: 1em;
    border: 1px solid #aaa;
    border-radius: 50%;
}
dl.hasextra:hover:after {
    color: #000;
    border-color: #444;
}

/* Schalter für Anzeigen/Verbergen aller Techinfo-Details */
#bike-specs .header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
#bike-specs h2 {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
ul.toggle-techinfo {
    display: none;
    position: relative;
    width: 44px;
    padding: 0;
    border: 1px solid #bbb;
    border-radius: 12px;
    overflow: hidden;
    margin: 0 1em;
}
ul.toggle-techinfo:after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #ddd;
    position: absolute;
    left: 2px;
    top: 2px;
    pointer-events: none;
    transition: 0.15s;
}
ul.expanded:after {
    left: 22px;
    background-color: #999;
}
.expanded .hide,
.collapsed .show {
    display: none;
}
ul.toggle-techinfo button {
    visibility: hidden;
}
.toggle-techinfo li {
    display: block;
    height: 22px;
    cursor: pointer;
}

/* Galerie-Karussell auf Bikeseiten aus Contao */
#bike-gallery .photo-video-carousel {
    margin-left: -20px;
    margin-right: -20px;
}
#bike-gallery .slick-slide {
    padding: 0 20px;
}
#bike-gallery .slick-prev {
    left: -18px;
}
#bike-gallery .slick-next {
    right: -18px;
}
/* Zentrierung bei wenigen Slides */
#bike-gallery .slick-track {
    margin: auto;
}
#bike-gallery .video-thumb {
    position: relative;
    width: 100%;
    padding-bottom: 62.8%; /* 414/260 */
    background: #000;
    overflow: hidden;
}
#bike-gallery .video-thumb img {
    position: absolute;
    top: 0;
    left: -6%;
    width: 112%;
    max-width: 112%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
#bike-gallery a:hover .video-thumb img {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
#bike-gallery .video-thumb:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../../img/design/video-play.svg) no-repeat center;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
#bike-gallery a:hover .video-thumb:after {
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

/* Photoswipe Hintergrund */
#bike .pswp__bg { background: #fff; }
#bike .pswp__img--placeholder--blank { background: #eee; }

.pswp__container {
}
.pswp__zoom-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.video-wrapper,
.responsive {
    position: relative;
    width: 100%;
    max-width: 1400px;
    padding-bottom: 56.25%; /* 16/9 */
}
.video-wrapper iframe,
.responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
@media (min-width: 1400px) {
    .video-wrapper,
    .responsive {
        padding-bottom: 788px;
    }
}


/* Gometrie */

#bike-geometry {
    overflow: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    color: #000;
}
p.geochart { text-align: center; }
.geochart button.oz-trigger {
    background: #fff;
    font-family: Kanit, sans-serif;
    padding: 0.5em 2em;
    border: 0;
    border-radius: 1em;
    margin: 3em 0 1.5em;
    cursor: help;
    transition: 0.3s;
}
.geochart .oz-trigger:hover {
    color: #e50000;
}
.size-disclaimer {
    font-size: 14px;
    max-width: 32em;
    display: block;
    margin: 0 auto 2em;
}

.tablewrapper {
    padding: 0 5%;
    margin: 0 -5%;
    overflow: auto; /* horizontales Scrollen auf kleinen Bildschirmen */

}
table#geometrie {
    font-size: 14px;
    margin: 0 -10px;
}
#geometrie thead,
#geometrie tfoot {
    letter-spacing: 0.04em;
    line-height: 2.2;
    font-weight: bold;
}
#geometrie tr {
}
#geometrie thead th {
    border-top: 0;
}
#geometrie tfoot {
}
#geometrie tbody th {
	  font-weight: normal;
}

#geometrie td,
#geometrie th {
	  padding: 6px 5px 2px;
    vertical-align: bottom;
    border-top: 1px solid #fff;
    white-space: nowrap;
}
td.value,
th.value {
    text-align: center;
}
#geometrie td:first-child,
#geometrie th:first-child {
    padding-left: 10px;
}
#geometrie .messpunkt {
    color: #e50000 !important;
    padding-right: 8px;
}
p.messweise {
    text-align: right;
    max-width: 40em;
    margin-left: auto;
}
#geometrie .messweise {
    font-weight: 300;
    padding-left: 14px;
	  padding-right: 10px;
}

/* Hervorhebung bei Imagemap-Hover und Zeilen-Hover*/
#geometrie tbody tr.marked,
#geometrie tbody tr.marked,
#geometrie tbody tr:hover,
#geometrie tbody tr:hover {
	  background-color: #fff;
}

/* Hervorhebung bei Spalten-Hover (JS) */
td.highlight,
th.highlight {
    background-color: #fff;
}

/* Kategorie-Sticker */
.sticker {}

.sticker .toggler {
    align-items: center;
}
.sticker .toggler .ui-icon {
    margin-right: 30px;
    order: 1;
}
.sticker .toggler img {
    margin-right: 30px;
    order: 0;
}
.sticker .toggler .hgroup {
    order: 2;
}
/*.sticker .toggler p {
    order: 3;
    flex: 1;
    text-align: right;
}*/
.sticker .toggler h1 {
    margin: 0;
}
.sticker .toggler h3 {
    margin: 0.25em 0 0;
}
.sticker .accordion {
    padding-top: 2em;
}
.sticker .text > h3 {
    margin-top: 1rem;
}
.sticker ul {
  padding-left: 1.8em;
}
.sticker .ce_table {
  page-break-inside: avoid;
  margin: 0 0 1em 1.8em;
}
.sticker th, .sticker td {
    padding: 6px 10px 2px;
    border-bottom: 1px solid #999;
}
.sticker table .row_last > * {
    border-bottom: 0;
}
.sticker table .col_first {
    padding-left: 0;
}
.sticker table .col_last {
    padding-right: 0;
}
.gefahr {
    background: #f5f5f5 url(../../img/basic/sticker/icn-danger.svg) no-repeat 20px center;
    background-size: 65px;
    padding: 1em;
    padding-left: 110px;
    margin: 1em 0;
}
.gefahr > *,
.gefahr h3,
.gefahr p {
    margin: 0;
}

/* Bestellnummern */
#artnums h3 {
    width: 161px;
}
table.artnums {
    width: 100%;
}
.artnums td,
.artnums th {
    text-align: center;
    padding: 4px 12px;
}
.artnums td:first-child,
.artnums th:first-child {
    padding-left: 0;
    text-align: right;
    width: 45%;
}
.artnums td:last-child,
.artnums th:last-child {
    padding-right: 0;
    text-align: left;
    width: 45%;
}
.artnums td {
    border-top: 1px solid #ccc;
}
.artnums th {
    font-weight: 600;
    white-space: nowrap;
}

/* Manuals, Montageanleitungen */
.section#manual {
    overflow: hidden;
}
.accordionbox.manuals {
    overflow: visible;
}
.manuals .accordion {
    margin-left: -7.5mm;
    margin-right: -7.5mm;
}
.manuals button {
    margin-left: 7.5mm;
    margin-bottom: 1em;
    /*padding-left: 0;
    padding-right: 0;*/
    background: #fff;
    border: 0;
    border-radius: 1em;
    outline: 0;
}
.manuals button:hover {
    color: #e50000;
}
.manuals iframe {
    position: relative;
    display: block;
    width: 297mm;
    max-width: 100%;
    height: 210mm;
    background: #fff;
    margin: auto;
    border: 0;
}
.manuals svg {
    width: 100%;
}

/* Testzitate, Testreports */
#bike-tests {
}
#bike-tests .grid {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.testreport {
    text-align: center;
    width: 454px;
    max-width: 100vw;
    margin-top: 0;
}
.testreport figure {
    min-height: 85px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.testreport img {
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
    -webkit-filter: gray;
            filter: gray;
    -webkit-transition: -webkit-filter 0.3s, filter 0.3s;
            transition: filter 0.3s;
}
#bike-tests:hover .testreport img {
    -webkit-filter: grayscale(0);
            filter: grayscale(0);
    -webkit-filter: none;
            filter: none;
}

.testreport h3 {
    margin-top: 16px;
    margin-bottom: 0;
}
.mag_date {
    color: #e50000;
    font-size: 14px;
    font-weight: 300;
    margin-top: 0;
}
#bike-tests:hover .mag_date {
    color: inherit;
    -webkit-transition: color 0.3s;
            transition: color 0.3s;
}
.testreport blockquote {
    text-align: left;
    margin: 0;
}
.testreport blockquote::before {
    content: "\201E"; /* „ */
    color: #ddd;
    font-size: 40px;
    font-weight: bold;
    line-height: 0;
    margin-left: -1px;
    margin-right: 7px;
    position: relative;
    bottom: 7px;
}
.testreport blockquote::after {
    content: "\201C"; /* “ */
    color: #ddd;
    font-size: 40px;
    font-weight: bold;
    line-height: 0;
    margin-left: 7px;
    position: relative;
    top: 15px;
}
/* Testzitate als Slick-Slider */
#bike-tests .grid {
    display: block;
    margin: 0 0 20px;
}
#bike-tests .slick-list {
    margin: 0 -20px;
}
#bike-tests .slick-track {
    margin-left: auto;
    margin-right: auto;
}
.slick-slide:focus {
    outline: none;
}
#bike-tests .slick-slide {
    width: auto;
    padding: 0 20px;
}
#bike-tests .slick-prev { left: -38px;  margin: 0; }
#bike-tests .slick-next { right: -38px; margin: 0; }

/* Kategorieseiten */
body#cat {
}
.cat header {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: #666;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
    padding: 5.9% 0;
}
.y2023 .cat header {
    padding: 8% 0;
}
.cat header.left { background-position: 30% center; }
.cat header.right { background-position: 70% center; }

.cat header:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background: #000;
    opacity: 0;
    transition: 0.4s;
}

.cat header > div {
    position: relative;
    width: 100%;
    max-width: 1400px;
    padding: 0 4%;
    margin: 0 auto;
}
.cat header h1,
.cat header h2,
.cat header p {
    /*width: 786px;*/
    width: 696px;
    max-width: 100%;
}
.cat header.right > div > * {
    margin-left: auto;
}
.cat header h1 {
    font-size: 10vw;
    letter-spacing: 0.02em;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.2);
    margin: 0 0 30px;
}
.cat header h2 {
    font-family: Kanit, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}
@media (min-width: 480px) {
    .cat header h1 {
        font-size: 2.7em;
    }
}
.cat header p {
    font-size: 18px;
    font-weight: 600;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
    margin: 0;
    /* padding-left: 90px; ab Tablet */
    position: relative;
    z-index: 1;
}
.cat header p::before { /* unscharfer dunkler Texthintergrund */
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background-color: #000;
    box-shadow: 0 0 50px 25px #000;
    opacity: 0.05;
}
.cat header .readmore-btn {
    font-weight: bold;
    cursor: pointer;
}
.cat header .readmore-btn:hover {
    /*border-bottom: 1px solid;*/
}
.cat header .readless-txt {
    margin-right: 0.5em;
}
.cat header .readmore-txt {
    display: none;
}
.cat header.read {
    cursor: pointer;
}
.cat header.hover:before {
    opacity: 0.25;
}
.cat header.read:before {
    opacity: 0.5;
}
.cat header.read .readmore-btn {
    display: none;
}
.cat header.read .readless-txt {
    margin-right: 0;
}
.cat header.read .readmore-txt {
    display: inline;
}

/* responsive Header my24 */
.cat header.cat_responsive {
    background: #f0f0f0;
    color: #222;
    padding: 0;
}
.cat header.cat_responsive:before {
    content: normal;
}
.cat header.cat_responsive img {
    display: block;
    width: 100%;
    max-height: 360px;
    object-fit: cover;
}
.cat header.cat_responsive > div {
    position: relative;
    z-index: 2;
    padding: 0 4% 1em;
}
.cat header.cat_responsive > div > * {
    width: unset;
    max-width: none;
}
.cat header.cat_responsive h1 {
    margin-top: 0.67em;
}
.cat header.cat_responsive h2+h1 {
    margin-top: 0;
}
.cat header.cat_responsive * {
    text-shadow: none;
}
@media (min-width: 880px) {
    .cat header.cat_responsive img {
        max-height: none;
    }
}
@media (min-width: 1080px) {
    /* Text über Bild */
    .cat header.cat_responsive {
        background: #444;
        color: #fff;
    }
    .cat header.cat_responsive img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-position: center;
    }
    .cat header.cat_responsive.left img {
        object-position: left;
    }
    .cat header.cat_responsive.right img {
        object-position: right;
    }
    .cat header.cat_responsive::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        background: #000;
        opacity: 0;
        transition: 0.4s;
    }
    .cat header.cat_responsive.read:before {
        opacity: 0.5;
    }
    .cat header.cat_responsive > div {
        padding-block: 5%;
        aspect-ratio: 1400/500;
        display: flex;
        flex-direction: column;
        justify-content: center;
        transition: 0.4s;
    }
    .cat header.cat_responsive.read > div {
        aspect-ratio: 1400/600;
    }
    .cat header.cat_responsive.right > div > * {
        margin-left: auto;
    }
    .cat header.cat_responsive h1, .cat header.cat_responsive p {
        width: 696px;
        max-width: 65%;
        text-shadow: 1px 1px 12px rgb(0 0 0 / 15%);
    }
    .cat header.cat_responsive p {
        /*font-weight: 600;*/
        text-shadow: 1px 1px 4px rgb(0 0 0 / 30%);
    }
    .cat header.cat_responsive p::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: -1;
        background-color: #000;
        box-shadow: 0 0 40px 40px #000;
        opacity: 0.10;
    }
}
@media (min-width: 1280px) {
    .cat header.cat_responsive p {
        font-size: 19px;
    }
}
@media (min-width: 1400px){
    .cat header.cat_responsive {
        min-height: 500px;
    }
}

/* bikewear Übersicht */
.wear-overview .wear {
}
.wear-overview .wear > a {
    position: relative;
    left: 0;
    -webkit-transition: left 0.2s;
            transition: left 0.2s;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    text-decoration: none;
    margin: 40px 0;
}
.wear a > * {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
}
.wear .overview_img {
    max-width: 320px;
    min-width: 1px;
    margin-right: 3.5%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.wear .overview_img img {
    min-width: 1px;
}
.wear .text {
    max-width: 600px;
    margin-left: 3.5%;
}
.wear h1 {
    font-size: 24px;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0.4em;
}
.wear > a:hover {
    left: 10px;
}
.wear:hover > a::after {
    color: #e50000;
}


/* Bikes in Kategorie-Listen */
.bikes-overview.grid {
    align-items: flex-start;
}
.bikes-overview .bike {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 365px;
        -ms-flex: 1 1 365px;
            flex: 1 1 365px;
    text-align: center;
    margin: 0;
    transition: 0.3s;
    /* position for new marker that needs to be absolute relative to this */
    position: relative;
    /* less than menu, but we need to reset the stacking context */
    z-index: 7;
}
/* am Ende des Grids als Auffüller */
.bikes-overview .bike.fill {
    padding: 0;
}

.bikes-overview .bike > a {
    display: block;
    transition: left 0.2s;
    text-decoration: none;
    padding: 20px 19px 20px 20px;
}
.bike a > * {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
}
.bike .overview_img {
    container-type: inline-size;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 30px;
    /* push above highlights/.new overlay */
    z-index: 50;
    position: relative;
}
/* Bike mit reduziertem Preis */
.bike.has-discount .overview_img::after {
    content: "SALE \0025";
    position: absolute;
    background-color: #e50000;
    color: #fff;
    left: 50%;
    bottom: 74%;
    bottom: clamp(130px, 43cqw, 194px);
    margin-left: -140px;
    margin-left: clamp(-177px, -39cqw, -110px);
    font-size: 0.9rem;
    font-family: 'Kanit';
    font-weight: 300;
    border-radius: 8px;
    padding: 3px 8px;
    transform: translate(-50%, 50%) rotate(352deg);
}

.bike .overview_img img {
    transition: 0.3s;
    transform-origin: 50% 90%;
}
@supports (object-fit: scale-down) {
    .bike .overview_img img {
        width: 100%;
        height: 240px;
        object-fit: scale-down;
        object-position: 50% 100%;
    }
}

.bike .subtitle {
    font-size: 0.85em;
    letter-spacing: 0.03em;
    text-align: center;
    margin-top: -0.5em;
}
.subtitle.custom {}

.bike .text {
    max-width: 600px;
}
.bike h1 {
    font-size: 6vw;
    font-weight: 500;
}
.bike h3.version_name {
    /*color: #e50000;*/
    font-size: 0.875em;
    font-weight: 300;
    letter-spacing: 0.05em;
    margin-top: -1rem;
    margin-bottom: 0.8em;
}
@media (min-width: 400px) {
    .bike h1 {
        font-size: 24px;
    }
}
.bike h1 .icn-custom {
    display: inline-block;
    width: 1.25em;
    height: 1em;
    background: url(../../img/design/custom-bikes-h25.svg) no-repeat bottom/contain;
    vertical-align: -2px;
}
.bike .new {
    display: block;
    position: absolute;
    left: 1em;
    top: 2em;
    /* max-width: 6em; */
    /* height: 0; */
    padding: 0.2em 0.3em;
    color: #ffffff;
    background: #000;
    border-radius: 0.1em;
    font-size: 75%;
    font-weight: bold;
    text-align: center;
  transform: rotate(352deg);
  /* push below bike picture overlay */
  z-index: 10;
}
.bike:not(.fill):hover {
    background: #f5f5f5;
}
.bike:hover > a img {
    transform: scale(1.05);
}

.bike ul.highlights {
    list-style: none;
    text-align: left;
    padding: 0;
    margin: 0;
    margin-left: 3.5%;
}
.bike .highlights li {
    overflow: hidden;
    height: 0;
    opacity: 0;
    transition: opacity 0.5s;
}
.bike .highlights li:first-child {
    margin-top: -1em;
}
@media (min-width: 1200px), (min-width:768px) and (orientation:portrait) {
    .bike .highlights li:first-child {
        height: auto;
        opacity: 1;
        margin-top: 0;
    }
}
body.listDetails-show .bike li {
    height: auto;
    opacity: 1;
    margin-top: 0;
}

/* ohne JS: */
.toggleListDetails {
  display: none;
}

ul.toggle-button {
    position: relative;
    padding: 0;
    margin: 0;
}
/* Knopf */
ul.toggle-button:after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 2px;
    pointer-events: none;
    transition: 0.15s;
    margin-left: -20px;
    box-shadow: 0 2px 4px rgba(0,0,0, 0.16)
}

ul.toggle-button button {
    text-indent: -999em;
    width: 44px;
    height: 22px;
    background: #ddd ;
    padding: 0;
    border: 0;
    border-radius: 12px;
    overflow: hidden;
    margin: 0 1em;
    outline: 0;
    cursor: pointer;
    vertical-align: 1px;
    transition: 0.3s 0.3s;
}
.toggle-button li {
    display: inline-block;
    height: 22px;
    font-size: 0.937em;
    text-transform: uppercase;
}
.toggle-button li span:hover {
    opacity: 1 !important;
}
.toggle-button li span {
    display: inline-block;
    width: 7em;
    max-width: 30vw;
    letter-spacing: 0.05em;
}
.toggle-button .hide { text-align: right; }
.toggle-button .show { text-align: left; }


.listDetails-show .toggle-button:after {
    margin-left: 2px;
}

.listDetails-hide .toggleListDetails .hide button,
.listDetails-show .toggleListDetails .show button {
    display: none;
}
.listDetails-show .toggleListDetails button {
    background: #bbb;
}
.listDetails-hide .toggleListDetails .show span,
.listDetails-show .toggleListDetails .hide span {
    cursor: pointer;
    opacity: 0.4;
}


/* Farbauswahl */
.bike ul.colors {
    padding: 0;
    margin: -15px 0 10px;
}
.bike .colors li {
    display: inline-block;
    padding: 2px;
    border: 1px solid #fff;
    border-radius: 50%;
    transition: 0.3s;
    margin: 0 3px;
}
.bike .colors li:not(.active) {
    cursor: pointer;
}
.bike .colors li:not(.active):hover {
    transform: scale(1.2);
}
.bike .colors li.active {
    border-color: #888;
    cursor: default;
}
/*.bike .colors li:only-child {
    cursor: inherit;
}*/
.bike .colors li span {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    text-indent: 101%;
    overflow: hidden;
}
@media (hover:hover) {
    .bike .colors li {
        margin: 0;
    }
    .bike .colors li span {
        width: 17px;
        height: 17px;
    }
}

.bike p.price {
    margin-bottom: 0;
}
.pri-opt {}
.pri-price { font-size: 1.33em; margin-left: 0.2em; }
.pri-curr {}
.pri-price-before-reduction {
    color: #e50000;
    text-decoration-color: #e50000;
    font-size: 1.1em;
}

.bike-has-discount dl.price dt::after {
    content: "SALE %";
    display: inline-block;
    background: #000;
    color: #fff;
    font-weight: 400;
    padding-inline: 0.25em;
    border-radius: 0.2em;
    margin-left: 0.5em;
    margin-bottom: 0.5em;
}

/*  ===========================
    Compare Bikes
    ===========================  */
form#compare {
    min-height: 60em;
    padding-bottom: 15px;
    margin-bottom: 0;
}
table#comparison {
    margin: 36px auto 15px;
}
#comparison tbody {
    font-size: 15px;
    max-width: 1320px;
}
#comparison tbody td,
#comparison tbody th {
    vertical-align: top;
    padding-top: 3px;
    padding-bottom: 3px;
}
#comparison .left,
#comparison .right {
    width: 50%;
}
#comparison .left {
    text-align: right;
}
#comparison .right {
    text-align: left;
    padding-right: 15px;
}
#comparison tbody th {
    box-sizing: content-box;
    width: 24px;
    min-width: 24px;
    padding: 5px 12px 2px 40px;
}
#comparison .hgroup {
    font-family: Kanit, sans-serif;
    text-transform: uppercase;
}
#comparison .left h2,
#comparison .left h3 {
    text-align: right;
}
#comparison .right h2,
#comparison .right h3 {
    text-align: left;
}
#comparison h2 {
    font-size: 28px;
    font-weight: 500;
    line-height: 0.9;
    padding: 10px 0;
    margin-top: 0
}
#comparison h3 {
    font-size: 16px;
    font-weight: 300;
    margin: 0;
}
#comparison .bike_version {
    font-size: 15px;
    letter-spacing: 0.03em;
    margin-top: -2em;
    margin-bottom: 1.5em;
}
.lt8 #comparison h3 {
    font-size: 18px;
}
#comparison h3 a {
    display: block;
    padding: 7px 0 4px;
    text-decoration: none;
}
#comparison h3 a:hover {
    opacity: 0.6;
}
#comparison .center,
#comparison tr.art-group td,
#comparison tbody th {
    text-align: center;
}
tr#images td {
    vertical-align: bottom;
}
tr#images img {
    width: 100%;
}
#comparison tbody th {
    box-sizing: content-box;
    width: 24px;
    min-width: 24px;
    padding: 5px 12px 2px 40px;
}
tr#prices {
}
tr#prices td {
    padding-top: 20px;
}
tr#prices dd {
    margin-left: 0;
}

#comparison .art-group h4 {
    font-size: 1em;
    font-weight: 600;
    line-height: 2;
    padding-top: 10px;
    border-top: 1px solid #aaa;
    margin: 1em 0 0 0;
}
tr#select-form td {
    padding: 40px 0;
}
td.center {
    text-align: center;
}
/*#select-form input,
#select-form select {
    height: 30px;
}
#select-form input {
    font-size: 0.9em;
    padding: 3px 4px 0;
    border: 1px solid #bbb;
    border-radius: 4px;
}*/
.js #select-form input[type=submit] {
    display: none;
}

div.chosen-container {
    font-size: 15px;
    margin-right: 0;
    width: 16em;
}
div.chosen-container .chosen-results {
    height: 80vh;
    max-height: 30em;
}
div.chosen-container .chosen-results li {
    white-space: nowrap;
}
td.left .chosen-search input {
    text-align: right;
}

#select-form select {
}
#comparison tr.different span.diff {
	/* highlight diffs always, better in general and really needed for mobile devices without mouse hover */
    color: #a11;
}
#comparison tr.different:hover span.diff {
	/* still make highlights better visible for desktop users */
    color: #e50000;
    /*font-style: italic;*/
}
#comparison option.selected {
    color: #e50000;
}
#compare p.footnote {
    font-size: 14px;
    margin-bottom: 0;
}

#compare tr.hasextra {
    cursor: pointer;
}
#compare tr.closed th:after {
    content: "+";
}
#compare tr.open th:after {
    content: "\2212"; /* minus */
}
#compare tr.hasextra th { position: relative; }
#compare tr.hasextra th:after {
    color: #aaa;
    font-family: "Times New Roman";
    font-size: 1.2em;
    position: absolute;
    left: 12px;
    top: 3px;
    text-align: center;
    width: 1em;
    height: 1em;
    line-height: 1em;
    border: 1px solid #aaa;
    border-radius: 50%;
}
#compare tr.hasextra:hover th:after {
    color: #000;
    border-color: #444;
}
#compare tr.hasextra.different-extrainfo:hover th:after {
    color: #e50000;
    border-color: #e50000;
}

#compare .extrainfo ul {
    font-size: 14px;
    padding-left: 1em;
    margin: 0.333em 0;
    list-style: none;
}
#compare .left ul {
    padding-right: 1em;
}

/* Accordion */
section.accordionbox,
.section.ce_accordion {
    position: relative;
    overflow: hidden;
}
.mod_faqpage .accordionbox {
    max-width: 720px;
    margin: 2px auto;
}
.accordionbox .toggler,
.ce_accordion .toggler {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    outline: 0;
    cursor: pointer;
    /* kein ui-theme */
    background: none;
    border: none;
    color: inherit;
}
.toggler div h1 {
    margin-bottom: 0;
}
.toggler div h1+* {
    margin-top: 0;
}
.mod_faqpage .toggler {
    background-color: #fff;
    background-color: #ebebeb;
    padding: 0 1em;
    transition: background-color 0.4s;
}
.mod_faqpage .toggler:hover {
    background-color: #f5f5f5;
}
.mod_faqpage .toggler h3 {
    font-size: 1.1em;
    font-weight: normal;
    line-height: normal;
    padding: 0.12em 0;
    margin-top: 0.33em;
    margin-bottom: 0;
}
.mod_faqpage .ui-state-active {
    background-color: #f5f5f5;
    background-color: #fff;
    color: #e50000;
}
.accordionbox .ui-icon,
.ce_accordion .ui-icon {
    margin-right: 1em;
    -webkit-transition: 0.3s;
            transition: 0.3s;
    /* kein ui-theme */
    background: none;
    text-indent: 0;
    margin-top: 0;
    width: auto;
    height: auto;
}
.accordionbox .ui-icon::before,
.ce_accordion .ui-icon::before {
    content: "\e64b";
    font-family: themify;
    font-size: 1.3333em;
}
.accordionbox .toggler.ui-state-active .ui-icon,
.ce_accordion .toggler.ui-state-active .ui-icon {
    -webkit-transform: scaleY(-1);
        -ms-transform: scaleY(-1);
            transform: scaleY(-1);
}
.accordionbox .toggler:hover .ui-icon,
.ce_accordion .toggler:hover .ui-icon {
    color: #e50000;
}
.toggler > h1 {
    font-size: 1.3333em;
    font-weight: 300;
}
.lt8 .toggler > h1 {
    font-weight: normal;
}
.accordion {
	  overflow: hidden;
    /* kein ui-theme */
    color: inherit;
    border: 0;
}
.mod_faqpage .accordion {
    line-height: normal;
    padding-top: 0.85em;
    margin-left: 3.35em;
}

/* Liste mit Raster aus bis zu 8 Bikes */
ul.boxes {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
    padding: 0 0 20px;
    margin: 0 -20px;
}
.boxes li {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 20%;
        -ms-flex: 1 1 20%;
            flex: 1 1 20%;
    list-style: none;
    display: inline-block;
    text-align: center;
    background-color: #fff;
    min-width: 200px;
    padding: 10px;
    margin: 20px;
}
.boxes li img {
    margin: 20px 0 10px;
}
.boxes li figcaption {
    font-family: Kanit, sans-serif;;
    text-transform: uppercase;
}
.boxes li figcaption .version_name {
    display: block;
    margin-bottom: -1.3333em;
}
.boxes li p {
    font-size: 15px;
	  font-weight: bold;
    margin-bottom: 0;
}
.boxes li p a {
    font-weight: normal;
    padding: 4px;
}
.boxes li p a:nth-of-type(1) { cursor: nw-resize; }
.boxes li p a:nth-of-type(2) { cursor: ne-resize; }

/* gemerkte Bikes */
#marked_bikes .bike {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
#marked_bikes .bike > a {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-bottom: 0;
}
.bikes-overview .tasks {
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
    padding-top: 0.7em;
    border-top: 1px solid #ccc;
    margin: 0 20px 20px;
}
.bikes-overview .tasks p {
    display: inline-block;
    white-space: nowrap;
    margin: 0 2em 0 0;
}
.bikes-overview .tasks a {
    text-decoration: none;
    background: transparent;
}
.bikes-overview .tasks a:hover {
    color: #e50000;
}
.bikes-overview .tasks a::before {
    display: inline-block;
    color: #e50000;
    font-family: themify;
    font-size: 1.1em;
    vertical-align: middle;
    margin-right: 0.25em;
}
.tasks p.marked-at {
    display: block;
}
p.unmark a::before {
    content: "\e646";
}
p.compare-marked a::before {
    content: "\e63f";
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
}

/* Suchergebnisse */
#search-result > div:nth-child(odd) {
    background-color: #ebebeb;
}
#search-result .cat_description {
    margin-bottom: 30px;
}
#search-result .cat_description h1 {
    font-size: 1em;
}
#search-result .cat_description a {
    text-decoration: none;
}
#search-result .cat_description a:hover {
    color: #e50000;
}
#search-result img {
    /*background-color: #fff;*/
    padding: 12px 12px 6px;
}

/* 	===========================
	Dealermap
 	===========================  */

div#hl-form-wrap {
}
h1#hl-dealermap {
    margin-top: 0;
}
#map-form .address {
    margin-bottom: 20px;
}
#map-form fieldset {
    padding: 8px 0;
	  border: 0 none;
    margin: 0;
}
#map-form label {
	margin-right: 3px;
}
#toggle-mode input {
    margin-right: 8px;
}
#toggle-mode label:nth-of-type(1) {
    margin-right: 20px;
}
fieldset#map-search {
    padding-bottom: 0
}
#map-search span {
    display: block;
    font-size: 15px;
    margin: 0 0 10px 0;
}
#map-address,
#map-shop,
#map-limit,
#map-dist {
    line-height: 30px;
    padding: 0 6px 0 12px;
    background-color: #f0f0f0;
    border: 1px solid transparent;
}
#map-shop,
#map-dist {
    height: 2em;
}
#map-address:hover,
#map-address:focus,
#map-shop:hover,
#map-shop:focus,
#map-limit:hover,
#map-limit:focus,
#map-dist:hover,
#map-dist:focus {
    border-color: #999;
    outline: 0;
}
.input-compact {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}
.input-compact label {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
}
#map-address {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    -webkit-transition: background-color 0.4s;
            transition: background-color 0.4s;
    /*border-right: 0;*/
    border-radius: 4px 0 0 4px;
}
#map-shop {
    width: 200px;
}
input.mark {
    background-color: #ff7 !important;
}
.input-compact button {
    border: 0;
    background: #f0f0f0;
    padding: 0 10px;
    cursor: pointer;
    text-indent: -999em;
    width: 40px;
    transition: .25s;
}
button.btn-reset {
    /*color: #bbb;*/
    background: url("../../img/design/icn-reset.svg") no-repeat center/auto 14px;
    opacity: 0.33;
    margin-left: -40px;
}
button.btn-reset:hover {
    opacity: 0.6;
}
button.btn-geolocation {
    background: #999 url("../../img/design/icn-target-white.svg") no-repeat center/auto 20px;
    color: #fff;
}
button.btn-geolocation:hover {
    background-color: #777;
}
#map-submit {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    background: #000 url(../../img/design/icn-search-white.svg) no-repeat center/auto 21px;
    height: 32px;
    border-radius: 0 4px 4px 0;
}
#map-submit:hover {
    background-color: #e50000;
}
input#map-reverse-geocoding {
    margin-right: 0.5em;
    vertical-align: text-top;
}
#map-form br,
#map-list br {
	clear: both;
}
#map-canvas {
    position: relative;
}
#map-ajax-loader {
	width: 100%;
	height: 100%;
}
#map-canvas[style] {
    height: 435px;
    max-height: 100vh;
}
#map-ajax-loader {
	z-index: 10000;
	position: absolute;
	background: #fff url(../../img/basic/ajax-loader.gif) center no-repeat;
}
#map-canvas img {
    max-width: none;
}
#map-canvas > form {
    text-align: center;
    background: #ddd url("../../img/dealermap/placeholder.jpg") no-repeat center / cover;
}
#map-canvas > form button {
    background: #fff;
    color: inherit;
    font-weight: 600;
    border: 0;
    border-radius: 1em;
    padding: 0.4em 1.6em;
    margin: 2em;
    cursor: pointer;
    transition: .3s;
}
#map-canvas > form button:hover {
    transform: scale(1.08);
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}
#map-info {
    font-size: 15px;
    font-family: Nimbus, "Helvetica Neue", Arial, Helvetica, sans-serif;
    line-height: 1.25;
}
.lt8 #map-info { font-family: Arial, sans-serif; }
#map-info h3 {
    font-size: 1em;
    font-weight: bold;
    padding: 0.4em 0;
    margin: 0;
}
#map-info p {
    margin: 0 0 0.5em 0;
    white-space: nowrap;
}
#map-info a::before {
    color: #e50000;
}
#map-list {
	padding: 0;
}
#map-list li {
    list-style: none;
    border-bottom: #ccc 1px solid;
    padding-top: 1em;
    padding-bottom: 0.7em;
    margin: 0;
}

#map-list-template {
	display: none;
}

#map-list li.hover {
	background-color: #f6f6f6 !important;
}
#map-list li.hover strong {
    color: #e50000;
}
#map-list li.hover .map-leasing,
#map-info .map-leasing {
    color: #61B000;
}
#map-list p {
    margin: 0 0 0.5em;
}

span.far-away {
	color: #D72;
}

#map-list a {
	text-decoration: none;
    white-space: nowrap;
}
#map-list a:hover {
	color: #e50000;
}
.map-email::before,
.map-website::before,
.map-tel::before,
.map-lageplan::before,
.map-anfahrt::before,
.map-leasing::before {
    font-family: themify;
    font-size: 15px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.75em;
}
.map-email::before {
    content: "\e75a";
}
.map-website::before {
    content: "\e732";
}
.map-tel::before {
    content: "\e621";
}
.map-lageplan::before {
    content: "\e690";
}
.map-anfahrt::before {
    content: "\e65a";
    content: "\e62c";
}
.map-leasing::before {
    content: "\e63b"; /* ti-flag-alt */
}
.map-leasing { white-space: nowrap; }

@media (min-width: 400px) {
  /* Liste 2-spaltig */
  #map-list li {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
  }
  #map-list p {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 50%;
          -ms-flex: 1 1 50%;
              flex: 1 1 50%;
      -webkit-box-ordinal-group: 2;
      -webkit-order: 1;
          -ms-flex-order: 1;
              order: 1;
  }
  #map-list .row1,
  #map-list .row4 { -webkit-flex-basis: 40%; -ms-flex-preferred-size: 40%; flex-basis: 40%; }
  #map-list .row2,
  #map-list .row3 { -webkit-flex-basis: 60%; -ms-flex-preferred-size: 60%; flex-basis: 60%; overflow: hidden; text-overflow: ellipsis; }
  #map-list .row3 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; }
  #map-list .row4 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; }
}

@media (min-width: 600px) {
  /* Label neben Eingabefeld */
  .input-compact {
      -webkit-flex-wrap: nowrap;
          -ms-flex-wrap: nowrap;
              flex-wrap: nowrap;
  }
  .input-compact label {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 auto;
          -ms-flex: 0 0 auto;
              flex: 0 0 auto;
      -webkit-align-self: center;
          -ms-flex-item-align: center;
              align-self: center;
      margin-right: 6px !important;
  }
  #map-submit {
      width: 70px;
  }
}

@media (min-width: 750px) {
  /* Liste 4-spaltig */
  #map-list li {
      -webkit-flex-wrap: nowrap;
          -ms-flex-wrap: nowrap;
              flex-wrap: nowrap;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center;
  }
  #map-list p { padding-left: 1em; }
  #map-list .row1 { padding-left: 0; }
  #map-list .row3,
  #map-list .row4 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; }
  #map-list .row1 { -webkit-box-flex: 0; -webkit-flex: 0 2 180px; -ms-flex: 0 2 180px; flex: 0 2 180px; }
  #map-list .row2 { -webkit-box-flex: 0; -webkit-flex: 0 1 310px; -ms-flex: 0 1 310px; flex: 0 1 310px; }
  #map-list .row3 { -webkit-box-flex: 0; -webkit-flex: 0 1 340px; -ms-flex: 0 1 340px; flex: 0 1 340px; }
  #map-list .row4 { -webkit-box-flex: 0; -webkit-flex: 0 2 120px; -ms-flex: 0 2 120px; flex: 0 2 120px; }
}

@media (min-width: 950px) {
  /* Überschrift und Formular nebeneinander */
  div#hl-form-wrap {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
  }
  h1#hl-dealermap {
      margin-right: 30px;
      max-width: 30%;
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 250px;
          -ms-flex: 1 1 250px;
              flex: 1 1 250px;
  }
  #map-form {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 700px;
          -ms-flex: 1 1 700px;
              flex: 1 1 700px;
  }
}


/* 	===========================
	Contact
 	===========================  */

#contactpage > div {
    padding-bottom: 0;
}
form#contact {
    max-width: 600px;
    margin: 1em auto 0;
}
#contact .submit {
    width: 100%;
}
#contact .button {
    padding: 0 30px 0 0;
    border-radius: 5px;
}
#contact .button::after {
    margin-top: 0.6em;
}
@media screen and (min-width: 500px) {
  #contact div.w50 {
      float: left;
      width: 50%;
  }
  #contact div.w50:nth-of-type(odd) {
      padding-right: 10px;
  }
  #contact div.w50:nth-of-type(even) {
      padding-left: 10px;
  }
  .tabs li {
      float: left;
      width: 200px;
      max-width: 33.3%;
  }
}

.tabs {
    margin-top: 2em;
}
.tabs ul {
    padding: 0;
    margin: 0;
    overflow: hidden;
}
.tabs li {
    list-style: none;
    margin-top: 1px;
}
.tabs a,
.tabs span {
    display: block;
    background-color: #ccc;
    color: #fff;
    text-align: center;
    text-decoration: none;
    padding: 0.5em 0 0.2em;
    margin-right: 1px;
}
.tabs a:hover {
    background-color: #bbb;
}
.tabs li.active a,
.tabs li.active span {
    background-color: #ebebeb;
    color: #000;
}

#contactpage2 {
    margin-bottom: 80px;
}

/* Login Händlerbereich */
.centered {
    display: table;
    margin: auto;
}
#loginout .centered {
    width: 100%;
    max-width: 500px;
}
#loginout form,
#loginout table {
    width: 100%;
}
#loginout td,
#loginout th {
    padding: 8px 0;
}

/* 	===========================
	Downloads
 	===========================  */

.downloads h1 {
    margin-top: 0;
}
.downloads header {
    position: relative;
}
p.logout.button {
    position: absolute;
    right: 0;
    top: 0;
    margin: 0;
}

@media screen and (min-width: 640px) {
  .flex-container {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center;
  }
}
#dl-welcome,
ul.download {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 66.667%;
        -ms-flex: 1 1 66.667%;
            flex: 1 1 66.667%;
}

/* Liste von Verzeichnissen/Dateien in Download */
ul.download {
	  font-weight: bold;
    padding: 0;
    margin: 0;
}
ul.download ul{
    margin-top: 0.6em;
    padding-left: 0;
}
ul.download li{
	list-style-type: none;
}
li.dir {
    padding: 10px 30px;
    border: 1px solid #ccc;
    margin: 1.3em 0;
}
ul.download a {
    font-weight: normal;
    text-decoration: none;
    padding: 2px 17px;
}
ul.download a:hover {
	  color: #e50000;
}
li.file a {
	  background: url(../../img/design/file.gif) no-repeat left center;
}
li.file a[target="_blank"] {
    background-image: url(../../img/design/external.gif);
}
li.file a:hover {
	  background-image: url(../../img/design/file-hover.gif);
}
li.file a[target="_blank"]:hover {
    background-image: url(../../img/design/external-hover.gif);
}
li.dir + li.file,
li.file + li.dir {
    margin-top: 1.3em;
}
span.dir-info {
    color: #919191;
    font-weight: normal;
    text-transform: none;
    margin-left: 0.7em;
}
p.readme {
	  color: #e50000;
}
.download li.accordionbox {
    padding: 0;
    border: 0;
    margin: 1px 0;
}
.download .toggler {
    background: #f0f0f0;
    padding: 10px 30px;
}
.download .accordion {
    padding: 0 0 20px 30px;
}

#dl-header {
    margin-right: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 33.333%;
        -ms-flex: 1 1 33.333%;
            flex: 1 1 33.333%;
}
#nav-downloads {
    padding-top: 1em;
    border-top: 1px solid #ccc;
    margin: 2.5em 0;
}
#nav-downloads li {
	  padding: 1px 0;
}
#nav-downloads a {
    display: block;
	  padding: 3px 0;
}
#nav-downloads a:hover {
	  color: #e50000;
}
#nav-downloads li.active a {
    color: #e50000;
    font-weight: 600;
    cursor: default;
}

#nav-downloads li li {
    padding-left: 1em;
}
#nav-downloads li.active li a {
    color: #333;
    cursor: pointer;
    font-weight: normal;
}
#nav-downloads li.active li a:hover {
    color: #e50000;
}
#nav-downloads  li.active li.active a {
    color: #e50000;
    font-weight: 600;
    cursor: default;
}


/* 	====================================
	  Technik-Features / Lexikon / Glossar
 	  ====================================  */

#tech .tech > div {
    overflow: hidden;
}
.tech h1 {
    margin-top: 0;
}
#tech-main {
    float: right;
    width: 65.6565656%;
}
#tech #left {
    float: left;
    width: 31.313131%;
    min-width: 200px;
    padding-top: 28px;
    margin-bottom: 20px;
    margin-left: 0;
}
@media screen and (min-device-height:700px) {
    #tech #left.fixed {
        position: fixed;
        top: 0;
        bottom: 0;
        z-index: 1;
        background-color: #fff;
        box-sizing: content-box;
        width: 20em;
        max-width: 28.5%;
        padding-left: 40px;
        margin-left: -40px;
        margin-bottom: 0;
        overflow: auto;
    }
}
ul#nav-tech {
    font-size: 13px;
    line-height: 1.25;
    padding-left: 0;
}
#nav-tech li {
    list-style: none;
}
#nav-tech a {
    display: block;
    text-decoration: none;
    color: #888;
}
.touch #nav-tech a {
    padding: 0.3em 0;
}
#nav-tech a:hover,
#nav-tech a.active {
    color: inherit;
}
#nav-tech a.active { font-weight: bold; }

#tech-main > a {
    display: block;
    outline: 0 none;
}
#tech article.teaser {
    margin: 0;
    background-color: #000;
}
#tech .teaser .ce_text {
    padding: 15px 0;
    overflow: hidden;
    background-color: #fff;
    transition: opacity 0.4s;
}
#tech .teaser:hover .ce_text {
    opacity: 0.96;
}
#tech .teaser .image_container {
    float: left;
    width: 47.6923%;
}
#tech .teaser img {
    width: 100%;
    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /></filter></svg>#filter');
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
}
#tech .teaser:hover img {
    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" /></filter></svg>#filter');
    -webkit-filter: grayscale(0);
            filter: grayscale(0);
}
#tech .teaser h2 {
    letter-spacing: 0.03em;
    line-height: 1.1;
    padding: 18px 0 14px;
    border-top: 2px solid #000;
    border-bottom: 1px solid #888;
    margin-top: 0;
    margin-bottom: 15px;
}
#tech .teaser h2,
#tech .teaser .text {
    float: right;
    width: 47.6923%;
}
#tech .teaser .text {}
#tech .teaser p.more {
    margin-top: 12px;
}
#tech .teaser span.button {}

/* Lightbox Overlay */
.associated-bikes h3 {
    text-transform: none;
    margin: 0;
}
.associated-bikes p.more {
    margin: 0 0 20px;
}
.associated-bikes ul.boxes {
    width: 633px;
    padding: 0 0 8px 7px;
    margin: 0 -20px;
}
.associated-bikes .boxes li {
    background-color: #000;
    font-size: 11px;
    text-transform: uppercase;
    min-width: 156px;
    padding: 0;
    margin: 0;
    flex-grow: 0;
}
.associated-bikes .boxes a {
    display: block;
    background-color: #fff;
    text-decoration: none;
    padding: 10px;
    padding-bottom: 1.5em;
}
.associated-bikes .boxes a:hover {
    opacity: 0.95;
}
.associated-bikes .boxes li img {
    width: 125px;
}
.associated-bikes .boxes figcaption {
    font: inherit;
    padding: 0;
}
.associated-bikes .boxes .version_name {
    display: block;
    margin-bottom: -1.3333em;
}
.associated-bikes .boxes .version_name:empty {
    display: none;
}

/* 	===========================
	Avisota Newsletter
 	===========================  */

/* an- und abmelden */

.nl-subscription label {
    display: block;
    font-size: 81.48%;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 2em;
}
.mod_avisota_subscribe select {
    width: 100%;
}
.mod_avisota_subscribe .submit_container {
    margin-top: 0.8em;
}
.mod_avisota_subscribe .submit_container input.subscribe {
      width: 100%;
      height: 2em;
      border-radius: 4px;
      background-color: #333;
      color: #fff;
      letter-spacing: 0.02em;
}
.mod_avisota_subscribe .submit_container input.subscribe:hover {
    background-color: #000;
}

@media screen and (min-width: 670px) {
  .nl-subscription form {
      text-align: center;
      margin: 2em 0 1em;
  }
  .nl-subscription .formbody {
      display: inline-block; /*shrink-to-fit */
      position: relative;
      padding-bottom: 80px;
      word-spacing: 8px;
  }
  .nl-subscription .widget {
      margin: 10px 0;
  }
  .submit_container {
      margin: 1em 0;
  }
  .nl-subscription label {
      display: inline;
      position: absolute;
      margin-top: 4px;
  }
  .nl-subscription .text,
  .nl-subscription .select {
      width: 15em;
      margin-left: 130px;
  }
  .nl-subscription br {
      display: none;
  }
  .nl-subscription select {
      display: inline;
  }
  .mod_avisota_subscribe label[for=ctrl_email] {
      bottom: 45px;
      left: 0;
  }
  .mod_avisota_subscribe input#ctrl_email {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 68%;
      height: 40px;
      margin-left: 0;
      border-right: 0;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
  }
  .mod_avisota_subscribe .submit_container {
      position: absolute;
      right: 0;
      bottom: 0;
      width: 32%;
      height: 40px;
      margin: 0;
  }
  .mod_avisota_subscribe .submit_container input.subscribe {
      height: 100%;
      border-radius: 0 4px 4px 0;
  }
}
.accordion-page#newsletter-archiv {
    background-color: #ebebeb;
}
#nl-datenschutz {
    max-width: 594px;
    margin-left: auto;
    margin-right: auto;
}

/* Reader */
.mod_article#de-newsletter-online-lesen {
    background-color: #ebebeb;
    padding: 0;
    margin: 0;
}
.mod_avisota_message_reader {
    font-size: 15px;
}
.mce_salutation,
.anrede {
    display: none;
}
div.mod_avisota_message_reader > h2 {
    line-height: 50px;
    margin-left: 20px;
}
.mod_avisota_message_reader p.info {
    font-size: 14px;
    margin-left: 20px;
}
.cell_header,
.cell_main {
    background-color: #fff;
    width: 100%;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}
.cell_main {
    border: 30px solid #fff;
    border-width: 15px 30px;
}
@media screen and (min-width: 680px) {
  .mod_avisota_message_reader .image_container.float_left img,
  .mod_avisota_message_reader .image_container.float_right img {
      max-width: 300px;
  }
  .mod_avisota_message_reader td {
      vertical-align: middle;
  }
}
@media screen and (min-width: 950px) {
  .cell_header,
  .cell_main {
      margin-left: 210px;
  }
  div.mod_avisota_message_reader > h2 {
      position: absolute;
      width: 200px;
      top: 40px;
  }
  .mod_avisota_message_reader p.info {
      float: left;
      padding-top: 20px;
  }
}
@media screen and (min-width: 1100px) {
  .cell_header,
  .cell_main {
      margin-left: auto;
      margin-right: auto;
  }
}
.cell_header img {
    width: 100%;
}

.mod_avisota_message_reader table {
    border: 0;
    margin: 0;
}
.mod_avisota_message_reader td {
    padding: 0;
    border: 0;
}
.mod_avisota_message_reader .image_container.float_left,
.mod_avisota_message_reader .image_container.float_right {
    padding: 0;
    margin: 0;
}

.mod_avisota_message_reader .slash {
    color: #cc0000;
    font-family: Impact,'Arial Black',Arial;
    font-size: 14px;
    font-style: italic;
    margin-right: 4px;
}
.mod_avisota_message_reader .box {
    background-color: #ebebeb;
    padding: 10px 10px 1px;
}
.mod_avisota_message_reader p {
    margin: 0.8em 0;
}
.mod_avisota_message_reader h2 {
    color: #202020;
    display: block;
    font-size: 16px;
    font-weight: bold;
    line-height: normal;
    margin: 0;
    text-align: left;
    text-transform: uppercase;
}
.mod_avisota_message_reader h3 {
    color: #202020;
    display: block;
    font-size: 15px;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 10px;
    text-align: left;
    text-transform: uppercase;
}
.mod_avisota_message_reader p a {
    background-color: #000000;
    color: #ffffff;
    font-weight: normal;
    padding: 3px 7px;
    text-decoration: none;
}
.mod_avisota_message_reader p a:hover {
    background-color: #666;
}
.cell_main .mce_text {
    margin: 20px 0 35px;
}
.mce_text ol {
    padding-left: 40px;
    margin: 1em 0;
}
.mce_text ol li {
    font-weight: bold;
    padding: 4px 0;
}
.mce_text ol li a {
    display: block;
    font-weight: normal;
    text-decoration: none;
}
.mce_text ol li a:hover {
    color: #777;
}

/* Newsletterarchiv */
.mod_avisota_message_list p.info {
    background: url("../../img/design/icon-time.gif") no-repeat left;
    padding: 0 0 0 24px;
}
.mod_avisota_message_list div.description {
    background: url("../../img/design/icon-letter.gif") no-repeat left;
    padding: 0 0 0 21px;
}
#main .mod_avisota_message_list p.info,
.mod_avisota_message_list div.description {
    display: inline-block;
    margin-right: 2em;
    overflow: visible;
}
.mod_avisota_message_list ul {
    list-style: none;
    padding-left: 0;
    margin-top: 20px;
}
.mod_avisota_message_list li {
    padding: 1em 0;
    border-top: 1px solid #ccc;
}
.mod_avisota_message_list .subject {
    font-size: 18px;
    letter-spacing: 0.04em;
    line-height: 2;
    text-transform: uppercase;
}

/* 	============================
	Bikewear, Zubehör, Accessoires
 	==============================  */

#cat_505 .bikes-overview p {
    white-space: normal;
}

.prod {
    max-width: 900px;
    margin: 40px auto 60px;
}
.prod-image {
    text-align: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 43%;
        -ms-flex: 1 1 43%;
            flex: 1 1 43%;
    min-width: 1px;
    padding: 0 10%;
}
.prod-image img {
    max-height: 70vw;
}
.prod .text {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 57%;
        -ms-flex: 1 1 57%;
            flex: 1 1 57%;
}
.prod table {
    max-width: 500px;
}
.prod td, .prod th {
    padding: 0.25em 0;
}
.prod th {
    padding-right: 1em;
}
.prod .nolink a { text-decoration: none; }

@media screen and (min-width: 540px) {
    .prod {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    .prod-image {
        padding: 0 40px 0 0;
    }
    .prod-image img {
        max-height: 360px;
    }
}

/*****************************************************************************/
/* Styles for the HTML popups											     */
/* Remove these if you are not using Highslide HTML						     */
/*****************************************************************************/
.highslide-maincontent {
	display: none;
}
.highslide-html {
	background-color: white;
}
.mobile .highslide-html {
	border: 1px solid silver;
}
.highslide-html-content {
	display: none;
	width: 400px;
	padding: 0 5px 5px 5px;
}
.highslide-header {
	padding-top: 6px;
}
.highslide-header ul {
	margin: 0;
	padding: 0;
	text-align: right;
}
.highslide-header ul li {
	display: inline;
	padding-left: 1em;
}
.highslide-header ul li.highslide-previous, .highslide-header ul li.highslide-next {
	display: none;
}
.highslide-close a {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(../../img/basic/closeX.png) no-repeat;
    text-align: left;
    text-indent: -9999em;
}
.highslide-close a:hover {
    background-position: bottom;
}
.highslide-header a {
	font-weight: bold;
	color: gray;
	text-transform: uppercase;
	text-decoration: none;
}
.highslide-header a:hover {
	color: black;
}
.highslide-header .highslide-move a {
	cursor: move;
}
.highslide-footer {
	height: 16px;
}
.highslide-footer .highslide-resize {
	display: block;
	float: right;
	margin-top: 5px;
	height: 11px;
	width: 11px;
	background: url(../../img/basic/resize.gif) no-repeat;
}
.highslide-footer .highslide-resize span {
	display: none;
}
.highslide-body {
    font-size: 15px;
    padding: 5px 10px;
    max-width: calc(100vw - 20px);
}
.highslide-body .button,
.highslide-body h4 {
    display: block;
    text-align: center;
}
.highslide-body th {
    font-weight: 300;
    padding-right: 1em;
}
.highslide-body td {
    font-weight: 600;
}
.highslide-resize {
	cursor: nw-resize;
}

/* Skala Größenberater */
.skala {
    position: relative;
}
.zeiger {
    display: block;
    position: absolute;
    left: 280px;
    top: 0;
    bottom: 0;
    width: 1px;
    background-color: #e50000;
}