/* BIKE AID Design Tokens
   ---------------------------------------------------------------------------------------------------------------------
   Eine Quelle fuer Farben, Typo, Abstaende, Schatten und Ebenen — fuer beide Themes.

   Warum: screen.css (117 KB) und dark.css (27 KB) pflegten dieselben Farben doppelt. #00386a stand 49x im Code,
   #9f2321 38x, #1d5c8e 29x. Jede neue Komponente musste zweimal gebaut werden, und Dark Mode driftete strukturell
   auseinander.

   ZWEI EBENEN, und die Unterscheidung ist wichtig:

     1. PRIMITIVE (--ba-blue-600, --ba-grey-200, --ba-white …)
        Die reine Palette. In beiden Themes derselbe Wert. Ein Austausch von Hex gegen ein Primitive aendert
        garantiert nichts am Rendering — deshalb arbeitet Welle 4.2 ausschliesslich damit.

     2. SEMANTIK (--ba-bg, --ba-text, --ba-surface, --ba-border …)
        Rollen statt Farben. Diese schalten unter [data-theme="dark"] um. Ein Primitive gegen eine Rolle zu
        tauschen ist eine bewusste Entscheidung pro Selektor — das ist Welle 4.3, zusammen mit dem Zusammenfalten
        von dark.css.

   Wer neue Komponenten baut, nimmt die SEMANTIK. Die Primitive sind nur die Vorratskammer.

   Namenskonvention --ba-* wie in docs/html/cockpit.css, damit Cockpit und Frontend dieselbe Sprache sprechen.
   Reihenfolge: MUSS vor bootstrap.min.css und screen.css geladen werden (siehe header.tpl) — beide landen im
   selben kombinierten Bundle, ein var() ohne Fallback ist deshalb sicher.
   --------------------------------------------------------------------------------------------------------------------- */

:root {
    /* ==================================================================================================================
       EBENE 1 — PRIMITIVE. Themeunabhaengig. Werte aus dem Bestand, nichts neu erfunden.
       ================================================================================================================== */

    /* Neutral */
    --ba-white:             #ffffff;
    --ba-black:             #000000;

    /* Blau — die Markenachse */
    --ba-blue-900:          #00386a;   /* Fliesstext, Ueberschriften (49x im Bestand) */
    --ba-blue-700:          #104774;   /* Dunkle sekundaere Aktionen */
    --ba-blue-600:          #1d5c8e;   /* Hauptblau: Buttons, Links (29x) */
    --ba-blue-500:          #4789be;   /* Sekundaer, Hervorhebungen (27x) */
    --ba-blue-300:          #76a0c4;   /* Hover */

    /* Rot + Gold — Logofarben */
    --ba-red-600:           #9f2321;   /* Destruktiv, Anmelde-CTA, Akzentlinien (38x) */
    --ba-red-300:           #ff8784;   /* Dasselbe Rot fuer dunklen Grund (stand schon in dark.css) */
    --ba-gold-500:          #f5c200;   /* Logostern, Fokusring, Nav-Pills im Dunkeln */

    /* Gruen — Erfolg */
    --ba-green-600:         #0b9a00;

    /* Grau */
    --ba-grey-900:          #333333;
    --ba-grey-700:          #555555;
    --ba-grey-500:          #999999;
    --ba-grey-300:          #d0d0d0;
    --ba-grey-200:          #e5e5e5;
    --ba-grey-100:          #f0f0f0;
    --ba-grey-50:           #f5f5f5;
    --ba-grey-25:           #f9f9f9;

    /* Blaugrau — Labels und Sekundaertext */
    --ba-slate-600:         #4f6173;
    --ba-slate-500:         #6f8294;
    --ba-tint-50:           #f4f7fb;

    /* Dunkle Palette — ebenfalls Primitive, nur eben die dunklen Werte */
    --ba-night-900:         #0f1923;
    --ba-night-800:         #11202f;
    --ba-night-700:         #142030;
    --ba-night-600:         #1a2535;
    --ba-night-500:         #1a3050;
    --ba-night-border:      #2a3a50;
    --ba-night-border-alt:  #3a4a60;
    --ba-night-text:        #c8d8e8;
    --ba-night-text-bright: #e0eaf5;
    --ba-night-text-muted:  #a8bcd0;
    --ba-night-text-subtle: #6a8aa6;
    --ba-night-blue:        #2d6a9f;
    --ba-night-link:        #7ab3d9;
    --ba-night-link-hover:  #a8cfe8;

    /* ==================================================================================================================
       EBENE 2 — SEMANTIK. Schaltet unter [data-theme="dark"] um.
       ================================================================================================================== */

    /* Flaechen */
    --ba-bg:                var(--ba-grey-25);    /* Seitenhintergrund */
    --ba-surface:           var(--ba-white);      /* Karten, Panels, Navbar */
    --ba-surface-2:         var(--ba-grey-50);    /* Wells, abgesetzte Bloecke */
    --ba-surface-3:         var(--ba-grey-100);   /* Eingelassene Bereiche */
    --ba-surface-tint:      var(--ba-tint-50);    /* Blaustichige Flaeche (Sidebar, Hinweise) */

    /* Text */
    --ba-text:              var(--ba-grey-900);
    --ba-text-strong:       var(--ba-blue-900);
    --ba-text-soft:         var(--ba-grey-700);   /* Bio-/Fliesstext im Roster */
    --ba-text-muted:        var(--ba-slate-500);
    --ba-text-label:        var(--ba-slate-600);  /* Kleine Labels auf dem Saison-Pass */
    --ba-text-subtle:       var(--ba-grey-500);
    --ba-text-on-brand:     var(--ba-white);      /* Auf farbigem Grund — bleibt immer weiss */

    /* Raender */
    --ba-border:            var(--ba-grey-200);
    --ba-border-strong:     var(--ba-grey-300);
    --ba-border-brand:      var(--ba-blue-500);

    /* Marke in Rollen */
    --ba-primary:           var(--ba-blue-600);
    --ba-primary-alt:       var(--ba-blue-500);
    --ba-primary-deep:      var(--ba-blue-700);
    --ba-primary-hover:     var(--ba-blue-300);
    --ba-accent:            var(--ba-gold-500);
    --ba-danger:            var(--ba-red-600);
    /* Rot als TEXT, nicht als Flaeche. Getrennt, weil #9f2321 auf dunklem
       Grund nur 2.01:1 erreicht — als Flaechenfarbe mit weisser Schrift
       traegt dasselbe Rot dagegen unveraendert. */
    --ba-accent-text:       var(--ba-red-600);
    --ba-success:           var(--ba-green-600);

    /* Interaktion */
    --ba-link:              var(--ba-blue-600);
    --ba-link-hover:        var(--ba-blue-900);
    --ba-focus-ring:        var(--ba-gold-500);

    /* Status-Flaechen */
    --ba-warning-bg:        #fcf8e3;
    --ba-warning-text:      #8a6d3b;
    --ba-error-bg:          #f2dede;
    --ba-error-text:        #a94442;

    /* ==================================================================================================================
       Typografie, Raster, Form — themeunabhaengig
       ================================================================================================================== */

    --ba-font-body:         'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --ba-font-heading:      'Roboto Slab', Georgia, 'Times New Roman', serif;
    --ba-text-sm:           14px;
    --ba-text-base:         16px;
    --ba-text-lg:           18px;
    --ba-weight-light:      300;
    --ba-weight-regular:    400;
    --ba-weight-bold:       700;
    --ba-leading:           1.6;

    /* Fluid-Groessen (Welle 4.5, Roadmap #7)
       -----------------------------------------------------------------------------------------------------------------
       Nur dort, wo der Bestand tatsaechlich zwei Groessen hatte: eine fuer
       Mobil, eine fuer Desktop, umgeschaltet bei 767px. Aus dem Sprung wird
       eine glatte Interpolation zwischen 375px und 1440px.

       Der Mobilwert ist der Boden, der Desktopwert die Decke -- es schrumpft
       also nichts, was heute schon klein ist, und es waechst nichts ueber das
       hinaus, was heute schon steht. Nur die Strecke dazwischen wird stetig
       statt als Stufe.

       Die Roadmap schlug zusaetzlich h1/h2/h3 vor, mit kleineren Untergrenzen
       als heute. Nicht uebernommen: diese drei haben gar keine Mobilvariante,
       eine Fluid-Kurve wuerde sie auf kleinen Geraeten also erstmals
       verkleinern. Das ist eine Geschmacksfrage, keine Konsolidierung.

       Formel: Untergrenze + (Differenz / Viewport-Spanne). Der rem-Anteil im
       Mittelteil ist Absicht -- reines vw ignoriert die Schriftgroesse, die
       Leute im Browser eingestellt haben.

       ACHTUNG, 1rem = 10px, nicht 16px.
       Bootstrap 3 setzt html { font-size: 10px } und skaliert body erst wieder
       auf 16px. rem bezieht sich aber auf die WURZEL, nicht auf body. Wer hier
       mit 16px rechnet, landet um Faktor 1,6 daneben -- genau das ist beim
       ersten Anlauf dieser Welle passiert (60px waren ploetzlich 37,5px).
       ----------------------------------------------------------------------------------------------------------------- */
    /* 35px auf Mobil, 45px ab Desktop */
    --ba-text-pagetitle:    clamp(3.5rem, 3.1479rem + 0.939vw, 4.5rem);
    /* 50px auf Mobil, 60px ab Desktop (Hero auf der Startseite) */
    --ba-text-hero:         clamp(5rem, 4.6479rem + 0.939vw, 6rem);

    /* Abstaende — 8px-Raster (Bootstrap-3-Basis) */
    --ba-space-xs:          4px;
    --ba-space-sm:          8px;
    --ba-space-md:          16px;
    --ba-space-lg:          24px;
    --ba-space-xl:          32px;
    --ba-space-2xl:         48px;

    /* Radien */
    --ba-radius-sm:         2px;
    --ba-radius:            4px;    /* Panels, Karten, Buttons — Bootstrap-Standard */
    --ba-radius-pill:       20px;   /* Mobile Nav-Pills */
    --ba-radius-nav:        30px;   /* Navbar-Container */

    /* Schatten — aus den im Bestand verwendeten Werten zusammengefasst */
    --ba-shadow-sm:         0 4px 5px rgba(0, 0, 0, 0.08);
    --ba-shadow:            0 6px 18px rgba(15, 40, 70, 0.08);
    --ba-shadow-lg:         0 8px 20px rgba(0, 0, 0, 0.12);

    /* Ebenen — der Bestand nutzte 1/2/3/9/10/100/999/1000/9999 ohne System */
    --ba-z-base:            1;
    --ba-z-raised:          10;
    --ba-z-sticky:          100;    /* Mobile Subnav, Affix */
    --ba-z-navbar:          1000;
    --ba-z-overlay:         1030;   /* Suchfeld, Dropdowns ueber der Navbar */
    --ba-z-modal:           1050;
    --ba-z-toast:           1080;   /* Toasts, Cookie-Sheet — ueber allem */

    /* Uebergaenge */
    --ba-transition-fast:   0.2s ease;
    --ba-transition:        0.3s ease;

    /* Breakpoints — als Dokumentation. @media kann keine Variablen lesen,
       aber diese vier Werte sind ab Welle 4.4 der verbindliche Satz:
         max-width:  480 / 767 / 991 / 1199
         min-width:  768 / 992 / 1200 */
    --ba-bp-xs:             480px;
    --ba-bp-sm:             768px;
    --ba-bp-md:             992px;
    --ba-bp-lg:             1200px;
}

/* Dark Mode — nur die SEMANTIK wird umgehaengt, die Primitive bleiben, wie sie sind.
   Umgeschaltet ueber [data-theme="dark"] auf <html> (Inline-Script in header.tpl, localStorage 'bikeaid-theme').
   Ab Welle 4.3 ist das hier die einzige Stelle, an der die Dark-Farben stehen.
   --------------------------------------------------------------------------------------------------------------------- */
[data-theme="dark"] {
    --ba-bg:                var(--ba-night-700);
    --ba-surface:           var(--ba-night-600);
    --ba-surface-2:         var(--ba-night-800);
    --ba-surface-3:         var(--ba-night-900);
    --ba-surface-tint:      var(--ba-night-500);

    --ba-text:              var(--ba-night-text);
    --ba-text-strong:       var(--ba-night-text-bright);
    --ba-text-soft:         var(--ba-night-text);
    --ba-text-muted:        var(--ba-night-text-muted);
    --ba-text-label:        var(--ba-night-text-muted);
    --ba-text-subtle:       var(--ba-night-text-subtle);
    /* --ba-text-on-brand bleibt weiss: farbige Flaechen bleiben farbig */

    --ba-border:            var(--ba-night-border);
    --ba-border-strong:     var(--ba-night-border-alt);

    /* Das Hauptblau ist auf dunklem Grund zu leise, deshalb aufgehellt.
       Gold traegt unveraendert. Rot ebenfalls — aber nur als Flaeche
       (--ba-danger). Als Textfarbe wird es aufgehellt, sonst steht der
       Saison-Pass bei 2.01:1. */
    --ba-primary:           var(--ba-night-blue);
    --ba-accent-text:       var(--ba-red-300);
    --ba-link:              var(--ba-night-link);
    --ba-link-hover:        var(--ba-night-link-hover);

    /* Status gedaempft, damit Warnungen nicht leuchten */
    --ba-warning-bg:        #3a2a08;
    --ba-warning-text:      #f5d59a;
    --ba-error-bg:          #3a1614;
    --ba-error-text:        #ff8784;

    /* Schatten brauchen auf dunklem Grund mehr Deckung */
    --ba-shadow-sm:         0 4px 5px rgba(0, 0, 0, 0.20);
    --ba-shadow:            0 6px 18px rgba(0, 0, 0, 0.22);
    --ba-shadow-lg:         0 8px 24px rgba(0, 0, 0, 0.30);
}
/*!
 * Bootstrap v3.3.4 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 *//*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{color:#000;background:#ff0}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{height:0;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input{line-height:normal}input[type=checkbox],input[type=radio]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid silver}legend{padding:0;border:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */@media print{*,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="javascript:"]:after,a[href^="#"]:after{content:""}blockquote,pre{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}img,tr{page-break-inside:avoid}img{max-width:100%!important}h2,h3,p{orphans:3;widows:3}h2,h3{page-break-after:avoid}select{background:#fff!important}.navbar{display:none}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table td,.table th{background-color:#fff!important}.table-bordered td,.table-bordered th{border:1px solid #ddd!important}}@font-face{font-family:'Glyphicons Halflings';src:url(../fonts/glyphicons-halflings-regular.eot);src:url(../fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'),url(../fonts/glyphicons-halflings-regular.woff2) format('woff2'),url(../fonts/glyphicons-halflings-regular.woff) format('woff'),url(../fonts/glyphicons-halflings-regular.ttf) format('truetype'),url(../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg')}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glyphicon-asterisk:before{content:"\2a"}.glyphicon-plus:before{content:"\2b"}.glyphicon-eur:before,.glyphicon-euro:before{content:"\20ac"}.glyphicon-minus:before{content:"\2212"}.glyphicon-cloud:before{content:"\2601"}.glyphicon-envelope:before{content:"\2709"}.glyphicon-pencil:before{content:"\270f"}.glyphicon-glass:before{content:"\e001"}.glyphicon-music:before{content:"\e002"}.glyphicon-search:before{content:"\e003"}.glyphicon-heart:before{content:"\e005"}.glyphicon-star:before{content:"\e006"}.glyphicon-star-empty:before{content:"\e007"}.glyphicon-user:before{content:"\e008"}.glyphicon-film:before{content:"\e009"}.glyphicon-th-large:before{content:"\e010"}.glyphicon-th:before{content:"\e011"}.glyphicon-th-list:before{content:"\e012"}.glyphicon-ok:before{content:"\e013"}.glyphicon-remove:before{content:"\e014"}.glyphicon-zoom-in:before{content:"\e015"}.glyphicon-zoom-out:before{content:"\e016"}.glyphicon-off:before{content:"\e017"}.glyphicon-signal:before{content:"\e018"}.glyphicon-cog:before{content:"\e019"}.glyphicon-trash:before{content:"\e020"}.glyphicon-home:before{content:"\e021"}.glyphicon-file:before{content:"\e022"}.glyphicon-time:before{content:"\e023"}.glyphicon-road:before{content:"\e024"}.glyphicon-download-alt:before{content:"\e025"}.glyphicon-download:before{content:"\e026"}.glyphicon-upload:before{content:"\e027"}.glyphicon-inbox:before{content:"\e028"}.glyphicon-play-circle:before{content:"\e029"}.glyphicon-repeat:before{content:"\e030"}.glyphicon-refresh:before{content:"\e031"}.glyphicon-list-alt:before{content:"\e032"}.glyphicon-lock:before{content:"\e033"}.glyphicon-flag:before{content:"\e034"}.glyphicon-headphones:before{content:"\e035"}.glyphicon-volume-off:before{content:"\e036"}.glyphicon-volume-down:before{content:"\e037"}.glyphicon-volume-up:before{content:"\e038"}.glyphicon-qrcode:before{content:"\e039"}.glyphicon-barcode:before{content:"\e040"}.glyphicon-tag:before{content:"\e041"}.glyphicon-tags:before{content:"\e042"}.glyphicon-book:before{content:"\e043"}.glyphicon-bookmark:before{content:"\e044"}.glyphicon-print:before{content:"\e045"}.glyphicon-camera:before{content:"\e046"}.glyphicon-font:before{content:"\e047"}.glyphicon-bold:before{content:"\e048"}.glyphicon-italic:before{content:"\e049"}.glyphicon-text-height:before{content:"\e050"}.glyphicon-text-width:before{content:"\e051"}.glyphicon-align-left:before{content:"\e052"}.glyphicon-align-center:before{content:"\e053"}.glyphicon-align-right:before{content:"\e054"}.glyphicon-align-justify:before{content:"\e055"}.glyphicon-list:before{content:"\e056"}.glyphicon-indent-left:before{content:"\e057"}.glyphicon-indent-right:before{content:"\e058"}.glyphicon-facetime-video:before{content:"\e059"}.glyphicon-picture:before{content:"\e060"}.glyphicon-map-marker:before{content:"\e062"}.glyphicon-adjust:before{content:"\e063"}.glyphicon-tint:before{content:"\e064"}.glyphicon-edit:before{content:"\e065"}.glyphicon-share:before{content:"\e066"}.glyphicon-check:before{content:"\e067"}.glyphicon-move:before{content:"\e068"}.glyphicon-step-backward:before{content:"\e069"}.glyphicon-fast-backward:before{content:"\e070"}.glyphicon-backward:before{content:"\e071"}.glyphicon-play:before{content:"\e072"}.glyphicon-pause:before{content:"\e073"}.glyphicon-stop:before{content:"\e074"}.glyphicon-forward:before{content:"\e075"}.glyphicon-fast-forward:before{content:"\e076"}.glyphicon-step-forward:before{content:"\e077"}.glyphicon-eject:before{content:"\e078"}.glyphicon-chevron-left:before{content:"\e079"}.glyphicon-chevron-right:before{content:"\e080"}.glyphicon-plus-sign:before{content:"\e081"}.glyphicon-minus-sign:before{content:"\e082"}.glyphicon-remove-sign:before{content:"\e083"}.glyphicon-ok-sign:before{content:"\e084"}.glyphicon-question-sign:before{content:"\e085"}.glyphicon-info-sign:before{content:"\e086"}.glyphicon-screenshot:before{content:"\e087"}.glyphicon-remove-circle:before{content:"\e088"}.glyphicon-ok-circle:before{content:"\e089"}.glyphicon-ban-circle:before{content:"\e090"}.glyphicon-arrow-left:before{content:"\e091"}.glyphicon-arrow-right:before{content:"\e092"}.glyphicon-arrow-up:before{content:"\e093"}.glyphicon-arrow-down:before{content:"\e094"}.glyphicon-share-alt:before{content:"\e095"}.glyphicon-resize-full:before{content:"\e096"}.glyphicon-resize-small:before{content:"\e097"}.glyphicon-exclamation-sign:before{content:"\e101"}.glyphicon-gift:before{content:"\e102"}.glyphicon-leaf:before{content:"\e103"}.glyphicon-fire:before{content:"\e104"}.glyphicon-eye-open:before{content:"\e105"}.glyphicon-eye-close:before{content:"\e106"}.glyphicon-warning-sign:before{content:"\e107"}.glyphicon-plane:before{content:"\e108"}.glyphicon-calendar:before{content:"\e109"}.glyphicon-random:before{content:"\e110"}.glyphicon-comment:before{content:"\e111"}.glyphicon-magnet:before{content:"\e112"}.glyphicon-chevron-up:before{content:"\e113"}.glyphicon-chevron-down:before{content:"\e114"}.glyphicon-retweet:before{content:"\e115"}.glyphicon-shopping-cart:before{content:"\e116"}.glyphicon-folder-close:before{content:"\e117"}.glyphicon-folder-open:before{content:"\e118"}.glyphicon-resize-vertical:before{content:"\e119"}.glyphicon-resize-horizontal:before{content:"\e120"}.glyphicon-hdd:before{content:"\e121"}.glyphicon-bullhorn:before{content:"\e122"}.glyphicon-bell:before{content:"\e123"}.glyphicon-certificate:before{content:"\e124"}.glyphicon-thumbs-up:before{content:"\e125"}.glyphicon-thumbs-down:before{content:"\e126"}.glyphicon-hand-right:before{content:"\e127"}.glyphicon-hand-left:before{content:"\e128"}.glyphicon-hand-up:before{content:"\e129"}.glyphicon-hand-down:before{content:"\e130"}.glyphicon-circle-arrow-right:before{content:"\e131"}.glyphicon-circle-arrow-left:before{content:"\e132"}.glyphicon-circle-arrow-up:before{content:"\e133"}.glyphicon-circle-arrow-down:before{content:"\e134"}.glyphicon-globe:before{content:"\e135"}.glyphicon-wrench:before{content:"\e136"}.glyphicon-tasks:before{content:"\e137"}.glyphicon-filter:before{content:"\e138"}.glyphicon-briefcase:before{content:"\e139"}.glyphicon-fullscreen:before{content:"\e140"}.glyphicon-dashboard:before{content:"\e141"}.glyphicon-paperclip:before{content:"\e142"}.glyphicon-heart-empty:before{content:"\e143"}.glyphicon-link:before{content:"\e144"}.glyphicon-phone:before{content:"\e145"}.glyphicon-pushpin:before{content:"\e146"}.glyphicon-usd:before{content:"\e148"}.glyphicon-gbp:before{content:"\e149"}.glyphicon-sort:before{content:"\e150"}.glyphicon-sort-by-alphabet:before{content:"\e151"}.glyphicon-sort-by-alphabet-alt:before{content:"\e152"}.glyphicon-sort-by-order:before{content:"\e153"}.glyphicon-sort-by-order-alt:before{content:"\e154"}.glyphicon-sort-by-attributes:before{content:"\e155"}.glyphicon-sort-by-attributes-alt:before{content:"\e156"}.glyphicon-unchecked:before{content:"\e157"}.glyphicon-expand:before{content:"\e158"}.glyphicon-collapse-down:before{content:"\e159"}.glyphicon-collapse-up:before{content:"\e160"}.glyphicon-log-in:before{content:"\e161"}.glyphicon-flash:before{content:"\e162"}.glyphicon-log-out:before{content:"\e163"}.glyphicon-new-window:before{content:"\e164"}.glyphicon-record:before{content:"\e165"}.glyphicon-save:before{content:"\e166"}.glyphicon-open:before{content:"\e167"}.glyphicon-saved:before{content:"\e168"}.glyphicon-import:before{content:"\e169"}.glyphicon-export:before{content:"\e170"}.glyphicon-send:before{content:"\e171"}.glyphicon-floppy-disk:before{content:"\e172"}.glyphicon-floppy-saved:before{content:"\e173"}.glyphicon-floppy-remove:before{content:"\e174"}.glyphicon-floppy-save:before{content:"\e175"}.glyphicon-floppy-open:before{content:"\e176"}.glyphicon-credit-card:before{content:"\e177"}.glyphicon-transfer:before{content:"\e178"}.glyphicon-cutlery:before{content:"\e179"}.glyphicon-header:before{content:"\e180"}.glyphicon-compressed:before{content:"\e181"}.glyphicon-earphone:before{content:"\e182"}.glyphicon-phone-alt:before{content:"\e183"}.glyphicon-tower:before{content:"\e184"}.glyphicon-stats:before{content:"\e185"}.glyphicon-sd-video:before{content:"\e186"}.glyphicon-hd-video:before{content:"\e187"}.glyphicon-subtitles:before{content:"\e188"}.glyphicon-sound-stereo:before{content:"\e189"}.glyphicon-sound-dolby:before{content:"\e190"}.glyphicon-sound-5-1:before{content:"\e191"}.glyphicon-sound-6-1:before{content:"\e192"}.glyphicon-sound-7-1:before{content:"\e193"}.glyphicon-copyright-mark:before{content:"\e194"}.glyphicon-registration-mark:before{content:"\e195"}.glyphicon-cloud-download:before{content:"\e197"}.glyphicon-cloud-upload:before{content:"\e198"}.glyphicon-tree-conifer:before{content:"\e199"}.glyphicon-tree-deciduous:before{content:"\e200"}.glyphicon-cd:before{content:"\e201"}.glyphicon-save-file:before{content:"\e202"}.glyphicon-open-file:before{content:"\e203"}.glyphicon-level-up:before{content:"\e204"}.glyphicon-copy:before{content:"\e205"}.glyphicon-paste:before{content:"\e206"}.glyphicon-alert:before{content:"\e209"}.glyphicon-equalizer:before{content:"\e210"}.glyphicon-king:before{content:"\e211"}.glyphicon-queen:before{content:"\e212"}.glyphicon-pawn:before{content:"\e213"}.glyphicon-bishop:before{content:"\e214"}.glyphicon-knight:before{content:"\e215"}.glyphicon-baby-formula:before{content:"\e216"}.glyphicon-tent:before{content:"\26fa"}.glyphicon-blackboard:before{content:"\e218"}.glyphicon-bed:before{content:"\e219"}.glyphicon-apple:before{content:"\f8ff"}.glyphicon-erase:before{content:"\e221"}.glyphicon-hourglass:before{content:"\231b"}.glyphicon-lamp:before{content:"\e223"}.glyphicon-duplicate:before{content:"\e224"}.glyphicon-piggy-bank:before{content:"\e225"}.glyphicon-scissors:before{content:"\e226"}.glyphicon-bitcoin:before{content:"\e227"}.glyphicon-btc:before{content:"\e227"}.glyphicon-xbt:before{content:"\e227"}.glyphicon-yen:before{content:"\00a5"}.glyphicon-jpy:before{content:"\00a5"}.glyphicon-ruble:before{content:"\20bd"}.glyphicon-rub:before{content:"\20bd"}.glyphicon-scale:before{content:"\e230"}.glyphicon-ice-lolly:before{content:"\e231"}.glyphicon-ice-lolly-tasted:before{content:"\e232"}.glyphicon-education:before{content:"\e233"}.glyphicon-option-horizontal:before{content:"\e234"}.glyphicon-option-vertical:before{content:"\e235"}.glyphicon-menu-hamburger:before{content:"\e236"}.glyphicon-modal-window:before{content:"\e237"}.glyphicon-oil:before{content:"\e238"}.glyphicon-grain:before{content:"\e239"}.glyphicon-sunglasses:before{content:"\e240"}.glyphicon-text-size:before{content:"\e241"}.glyphicon-text-color:before{content:"\e242"}.glyphicon-text-background:before{content:"\e243"}.glyphicon-object-align-top:before{content:"\e244"}.glyphicon-object-align-bottom:before{content:"\e245"}.glyphicon-object-align-horizontal:before{content:"\e246"}.glyphicon-object-align-left:before{content:"\e247"}.glyphicon-object-align-vertical:before{content:"\e248"}.glyphicon-object-align-right:before{content:"\e249"}.glyphicon-triangle-right:before{content:"\e250"}.glyphicon-triangle-left:before{content:"\e251"}.glyphicon-triangle-bottom:before{content:"\e252"}.glyphicon-triangle-top:before{content:"\e253"}.glyphicon-console:before{content:"\e254"}.glyphicon-superscript:before{content:"\e255"}.glyphicon-subscript:before{content:"\e256"}.glyphicon-menu-left:before{content:"\e257"}.glyphicon-menu-right:before{content:"\e258"}.glyphicon-menu-down:before{content:"\e259"}.glyphicon-menu-up:before{content:"\e260"}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#337ab7;text-decoration:none}a:focus,a:hover{color:#23527c;text-decoration:underline}a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}figure{margin:0}img{vertical-align:middle}.carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail a>img,.thumbnail>img{display:block;max-width:100%;height:auto}.img-rounded{border-radius:6px}.img-thumbnail{display:inline-block;max-width:100%;height:auto;padding:4px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.img-circle{border-radius:50%}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}[role=button]{cursor:pointer}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-family:inherit;font-weight:500;line-height:1.1;color:inherit}.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small{font-weight:400;line-height:1;color:#777}.h1,.h2,.h3,h1,h2,h3{margin-top:20px;margin-bottom:10px}.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small{font-size:65%}.h4,.h5,.h6,h4,h5,h6{margin-top:10px;margin-bottom:10px}.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small{font-size:75%}.h1,h1{font-size:36px}.h2,h2{font-size:30px}.h3,h3{font-size:24px}.h4,h4{font-size:18px}.h5,h5{font-size:14px}.h6,h6{font-size:12px}p{margin:0 0 10px}.lead{margin-bottom:20px;font-size:16px;font-weight:300;line-height:1.4}@media (min-width:768px){.lead{font-size:21px}}.small,small{font-size:85%}.mark,mark{padding:.2em;background-color:#fcf8e3}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-nowrap{white-space:nowrap}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-muted{color:#777}.text-primary{color:#337ab7}a.text-primary:hover{color:#286090}.text-success{color:#3c763d}a.text-success:hover{color:#2b542c}.text-info{color:#31708f}a.text-info:hover{color:#245269}.text-warning{color:#8a6d3b}a.text-warning:hover{color:#66512c}.text-danger{color:#a94442}a.text-danger:hover{color:#843534}.bg-primary{color:#fff;background-color:#337ab7}a.bg-primary:hover{background-color:#286090}.bg-success{background-color:#dff0d8}a.bg-success:hover{background-color:#c1e2b3}.bg-info{background-color:#d9edf7}a.bg-info:hover{background-color:#afd9ee}.bg-warning{background-color:#fcf8e3}a.bg-warning:hover{background-color:#f7ecb5}.bg-danger{background-color:#f2dede}a.bg-danger:hover{background-color:#e4b9b9}.page-header{padding-bottom:9px;margin:40px 0 20px;border-bottom:1px solid #eee}ol,ul{margin-top:0;margin-bottom:10px}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;margin-left:-5px;list-style:none}.list-inline>li{display:inline-block;padding-right:5px;padding-left:5px}dl{margin-top:0;margin-bottom:20px}dd,dt{line-height:1.42857143}dt{font-weight:700}dd{margin-left:0}@media (min-width:768px){.dl-horizontal dt{float:left;width:160px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}}abbr[data-original-title],abbr[title]{cursor:help;border-bottom:1px dotted #777}.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:10px 20px;margin:0 0 20px;font-size:17.5px;border-left:5px solid #eee}blockquote ol:last-child,blockquote p:last-child,blockquote ul:last-child{margin-bottom:0}blockquote .small,blockquote footer,blockquote small{display:block;font-size:80%;line-height:1.42857143;color:#777}blockquote .small:before,blockquote footer:before,blockquote small:before{content:'\2014 \00A0'}.blockquote-reverse,blockquote.pull-right{padding-right:15px;padding-left:0;text-align:right;border-right:5px solid #eee;border-left:0}.blockquote-reverse .small:before,.blockquote-reverse footer:before,.blockquote-reverse small:before,blockquote.pull-right .small:before,blockquote.pull-right footer:before,blockquote.pull-right small:before{content:''}.blockquote-reverse .small:after,.blockquote-reverse footer:after,.blockquote-reverse small:after,blockquote.pull-right .small:after,blockquote.pull-right footer:after,blockquote.pull-right small:after{content:'\00A0 \2014'}address{margin-bottom:20px;font-style:normal;line-height:1.42857143}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,"Courier New",monospace}code{padding:2px 4px;font-size:90%;color:#c7254e;background-color:#f9f2f4;border-radius:4px}kbd{padding:2px 4px;font-size:90%;color:#fff;background-color:#333;border-radius:3px;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,.25);box-shadow:inset 0 -1px 0 rgba(0,0,0,.25)}kbd kbd{padding:0;font-size:100%;font-weight:700;-webkit-box-shadow:none;box-shadow:none}pre{display:block;padding:9.5px;margin:0 0 10px;font-size:13px;line-height:1.42857143;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}.pre-scrollable{max-height:340px;overflow-y:scroll}.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}.row{margin-right:-15px;margin-left:-15px}.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{float:left}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-pull-12{right:100%}.col-xs-pull-11{right:91.66666667%}.col-xs-pull-10{right:83.33333333%}.col-xs-pull-9{right:75%}.col-xs-pull-8{right:66.66666667%}.col-xs-pull-7{right:58.33333333%}.col-xs-pull-6{right:50%}.col-xs-pull-5{right:41.66666667%}.col-xs-pull-4{right:33.33333333%}.col-xs-pull-3{right:25%}.col-xs-pull-2{right:16.66666667%}.col-xs-pull-1{right:8.33333333%}.col-xs-pull-0{right:auto}.col-xs-push-12{left:100%}.col-xs-push-11{left:91.66666667%}.col-xs-push-10{left:83.33333333%}.col-xs-push-9{left:75%}.col-xs-push-8{left:66.66666667%}.col-xs-push-7{left:58.33333333%}.col-xs-push-6{left:50%}.col-xs-push-5{left:41.66666667%}.col-xs-push-4{left:33.33333333%}.col-xs-push-3{left:25%}.col-xs-push-2{left:16.66666667%}.col-xs-push-1{left:8.33333333%}.col-xs-push-0{left:auto}.col-xs-offset-12{margin-left:100%}.col-xs-offset-11{margin-left:91.66666667%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-0{margin-left:0}@media (min-width:768px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}table{background-color:transparent}caption{padding-top:8px;padding-bottom:8px;color:#777;text-align:left}th{text-align:left}.table{width:100%;max-width:100%;margin-bottom:20px}.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{padding:8px;line-height:1.42857143;vertical-align:top;border-top:1px solid #ddd}.table>thead>tr>th{vertical-align:bottom;border-bottom:2px solid #ddd}.table>caption+thead>tr:first-child>td,.table>caption+thead>tr:first-child>th,.table>colgroup+thead>tr:first-child>td,.table>colgroup+thead>tr:first-child>th,.table>thead:first-child>tr:first-child>td,.table>thead:first-child>tr:first-child>th{border-top:0}.table>tbody+tbody{border-top:2px solid #ddd}.table .table{background-color:#fff}.table-condensed>tbody>tr>td,.table-condensed>tbody>tr>th,.table-condensed>tfoot>tr>td,.table-condensed>tfoot>tr>th,.table-condensed>thead>tr>td,.table-condensed>thead>tr>th{padding:5px}.table-bordered{border:1px solid #ddd}.table-bordered>tbody>tr>td,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>td,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>thead>tr>th{border:1px solid #ddd}.table-bordered>thead>tr>td,.table-bordered>thead>tr>th{border-bottom-width:2px}.table-striped>tbody>tr:nth-of-type(odd){background-color:#f9f9f9}.table-hover>tbody>tr:hover{background-color:#f5f5f5}table col[class*=col-]{position:static;display:table-column;float:none}table td[class*=col-],table th[class*=col-]{position:static;display:table-cell;float:none}.table>tbody>tr.active>td,.table>tbody>tr.active>th,.table>tbody>tr>td.active,.table>tbody>tr>th.active,.table>tfoot>tr.active>td,.table>tfoot>tr.active>th,.table>tfoot>tr>td.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>thead>tr.active>th,.table>thead>tr>td.active,.table>thead>tr>th.active{background-color:#f5f5f5}.table-hover>tbody>tr.active:hover>td,.table-hover>tbody>tr.active:hover>th,.table-hover>tbody>tr:hover>.active,.table-hover>tbody>tr>td.active:hover,.table-hover>tbody>tr>th.active:hover{background-color:#e8e8e8}.table>tbody>tr.success>td,.table>tbody>tr.success>th,.table>tbody>tr>td.success,.table>tbody>tr>th.success,.table>tfoot>tr.success>td,.table>tfoot>tr.success>th,.table>tfoot>tr>td.success,.table>tfoot>tr>th.success,.table>thead>tr.success>td,.table>thead>tr.success>th,.table>thead>tr>td.success,.table>thead>tr>th.success{background-color:#dff0d8}.table-hover>tbody>tr.success:hover>td,.table-hover>tbody>tr.success:hover>th,.table-hover>tbody>tr:hover>.success,.table-hover>tbody>tr>td.success:hover,.table-hover>tbody>tr>th.success:hover{background-color:#d0e9c6}.table>tbody>tr.info>td,.table>tbody>tr.info>th,.table>tbody>tr>td.info,.table>tbody>tr>th.info,.table>tfoot>tr.info>td,.table>tfoot>tr.info>th,.table>tfoot>tr>td.info,.table>tfoot>tr>th.info,.table>thead>tr.info>td,.table>thead>tr.info>th,.table>thead>tr>td.info,.table>thead>tr>th.info{background-color:#d9edf7}.table-hover>tbody>tr.info:hover>td,.table-hover>tbody>tr.info:hover>th,.table-hover>tbody>tr:hover>.info,.table-hover>tbody>tr>td.info:hover,.table-hover>tbody>tr>th.info:hover{background-color:#c4e3f3}.table>tbody>tr.warning>td,.table>tbody>tr.warning>th,.table>tbody>tr>td.warning,.table>tbody>tr>th.warning,.table>tfoot>tr.warning>td,.table>tfoot>tr.warning>th,.table>tfoot>tr>td.warning,.table>tfoot>tr>th.warning,.table>thead>tr.warning>td,.table>thead>tr.warning>th,.table>thead>tr>td.warning,.table>thead>tr>th.warning{background-color:#fcf8e3}.table-hover>tbody>tr.warning:hover>td,.table-hover>tbody>tr.warning:hover>th,.table-hover>tbody>tr:hover>.warning,.table-hover>tbody>tr>td.warning:hover,.table-hover>tbody>tr>th.warning:hover{background-color:#faf2cc}.table>tbody>tr.danger>td,.table>tbody>tr.danger>th,.table>tbody>tr>td.danger,.table>tbody>tr>th.danger,.table>tfoot>tr.danger>td,.table>tfoot>tr.danger>th,.table>tfoot>tr>td.danger,.table>tfoot>tr>th.danger,.table>thead>tr.danger>td,.table>thead>tr.danger>th,.table>thead>tr>td.danger,.table>thead>tr>th.danger{background-color:#f2dede}.table-hover>tbody>tr.danger:hover>td,.table-hover>tbody>tr.danger:hover>th,.table-hover>tbody>tr:hover>.danger,.table-hover>tbody>tr>td.danger:hover,.table-hover>tbody>tr>th.danger:hover{background-color:#ebcccc}.table-responsive{min-height:.01%;overflow-x:auto}@media screen and (max-width:767px){.table-responsive{width:100%;margin-bottom:15px;overflow-y:hidden;-ms-overflow-style:-ms-autohiding-scrollbar;border:1px solid #ddd}.table-responsive>.table{margin-bottom:0}.table-responsive>.table>tbody>tr>td,.table-responsive>.table>tbody>tr>th,.table-responsive>.table>tfoot>tr>td,.table-responsive>.table>tfoot>tr>th,.table-responsive>.table>thead>tr>td,.table-responsive>.table>thead>tr>th{white-space:nowrap}.table-responsive>.table-bordered{border:0}.table-responsive>.table-bordered>tbody>tr>td:first-child,.table-responsive>.table-bordered>tbody>tr>th:first-child,.table-responsive>.table-bordered>tfoot>tr>td:first-child,.table-responsive>.table-bordered>tfoot>tr>th:first-child,.table-responsive>.table-bordered>thead>tr>td:first-child,.table-responsive>.table-bordered>thead>tr>th:first-child{border-left:0}.table-responsive>.table-bordered>tbody>tr>td:last-child,.table-responsive>.table-bordered>tbody>tr>th:last-child,.table-responsive>.table-bordered>tfoot>tr>td:last-child,.table-responsive>.table-bordered>tfoot>tr>th:last-child,.table-responsive>.table-bordered>thead>tr>td:last-child,.table-responsive>.table-bordered>thead>tr>th:last-child{border-right:0}.table-responsive>.table-bordered>tbody>tr:last-child>td,.table-responsive>.table-bordered>tbody>tr:last-child>th,.table-responsive>.table-bordered>tfoot>tr:last-child>td,.table-responsive>.table-bordered>tfoot>tr:last-child>th{border-bottom:0}}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5}label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700}input[type=search]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input[type=checkbox],input[type=radio]{margin:4px 0 0;margin-top:1px \9;line-height:normal}input[type=file]{display:block}input[type=range]{display:block;width:100%}select[multiple],select[size]{height:auto}input[type=file]:focus,input[type=checkbox]:focus,input[type=radio]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}output{display:block;padding-top:7px;font-size:14px;line-height:1.42857143;color:#555}.form-control{display:block;width:100%;height:34px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}.form-control::-moz-placeholder{color:#999;opacity:1}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control{background-color:#eee;opacity:1}.form-control[disabled],fieldset[disabled] .form-control{cursor:not-allowed}textarea.form-control{height:auto}input[type=search]{-webkit-appearance:none}@media screen and (-webkit-min-device-pixel-ratio:0){input[type=date],input[type=time],input[type=datetime-local],input[type=month]{line-height:34px}.input-group-sm input[type=date],.input-group-sm input[type=time],.input-group-sm input[type=datetime-local],.input-group-sm input[type=month],input[type=date].input-sm,input[type=time].input-sm,input[type=datetime-local].input-sm,input[type=month].input-sm{line-height:30px}.input-group-lg input[type=date],.input-group-lg input[type=time],.input-group-lg input[type=datetime-local],.input-group-lg input[type=month],input[type=date].input-lg,input[type=time].input-lg,input[type=datetime-local].input-lg,input[type=month].input-lg{line-height:46px}}.form-group{margin-bottom:15px}.checkbox,.radio{position:relative;display:block;margin-top:10px;margin-bottom:10px}.checkbox label,.radio label{min-height:20px;padding-left:20px;margin-bottom:0;font-weight:400;cursor:pointer}.checkbox input[type=checkbox],.checkbox-inline input[type=checkbox],.radio input[type=radio],.radio-inline input[type=radio]{position:absolute;margin-top:4px \9;margin-left:-20px}.checkbox+.checkbox,.radio+.radio{margin-top:-5px}.checkbox-inline,.radio-inline{position:relative;display:inline-block;padding-left:20px;margin-bottom:0;font-weight:400;vertical-align:middle;cursor:pointer}.checkbox-inline+.checkbox-inline,.radio-inline+.radio-inline{margin-top:0;margin-left:10px}fieldset[disabled] input[type=checkbox],fieldset[disabled] input[type=radio],input[type=checkbox].disabled,input[type=checkbox][disabled],input[type=radio].disabled,input[type=radio][disabled]{cursor:not-allowed}.checkbox-inline.disabled,.radio-inline.disabled,fieldset[disabled] .checkbox-inline,fieldset[disabled] .radio-inline{cursor:not-allowed}.checkbox.disabled label,.radio.disabled label,fieldset[disabled] .checkbox label,fieldset[disabled] .radio label{cursor:not-allowed}.form-control-static{min-height:34px;padding-top:7px;padding-bottom:7px;margin-bottom:0}.form-control-static.input-lg,.form-control-static.input-sm{padding-right:0;padding-left:0}.input-sm{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-sm{height:30px;line-height:30px}select[multiple].input-sm,textarea.input-sm{height:auto}.form-group-sm .form-control{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.form-group-sm .form-control{height:30px;line-height:30px}select[multiple].form-group-sm .form-control,textarea.form-group-sm .form-control{height:auto}.form-group-sm .form-control-static{height:30px;min-height:32px;padding:5px 10px;font-size:12px;line-height:1.5}.input-lg{height:46px;padding:10px 16px;font-size:18px;line-height:1.3333333;border-radius:6px}select.input-lg{height:46px;line-height:46px}select[multiple].input-lg,textarea.input-lg{height:auto}.form-group-lg .form-control{height:46px;padding:10px 16px;font-size:18px;line-height:1.3333333;border-radius:6px}select.form-group-lg .form-control{height:46px;line-height:46px}select[multiple].form-group-lg .form-control,textarea.form-group-lg .form-control{height:auto}.form-group-lg .form-control-static{height:46px;min-height:38px;padding:10px 16px;font-size:18px;line-height:1.3333333}.has-feedback{position:relative}.has-feedback .form-control{padding-right:42.5px}.form-control-feedback{position:absolute;top:0;right:0;z-index:2;display:block;width:34px;height:34px;line-height:34px;text-align:center;pointer-events:none}.input-lg+.form-control-feedback{width:46px;height:46px;line-height:46px}.input-sm+.form-control-feedback{width:30px;height:30px;line-height:30px}.has-success .checkbox,.has-success .checkbox-inline,.has-success .control-label,.has-success .help-block,.has-success .radio,.has-success .radio-inline,.has-success.checkbox label,.has-success.checkbox-inline label,.has-success.radio label,.has-success.radio-inline label{color:#3c763d}.has-success .form-control{border-color:#3c763d;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-success .form-control:focus{border-color:#2b542c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168}.has-success .input-group-addon{color:#3c763d;background-color:#dff0d8;border-color:#3c763d}.has-success .form-control-feedback{color:#3c763d}.has-warning .checkbox,.has-warning .checkbox-inline,.has-warning .control-label,.has-warning .help-block,.has-warning .radio,.has-warning .radio-inline,.has-warning.checkbox label,.has-warning.checkbox-inline label,.has-warning.radio label,.has-warning.radio-inline label{color:#8a6d3b}.has-warning .form-control{border-color:#8a6d3b;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-warning .form-control:focus{border-color:#66512c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b}.has-warning .input-group-addon{color:#8a6d3b;background-color:#fcf8e3;border-color:#8a6d3b}.has-warning .form-control-feedback{color:#8a6d3b}.has-error .checkbox,.has-error .checkbox-inline,.has-error .control-label,.has-error .help-block,.has-error .radio,.has-error .radio-inline,.has-error.checkbox label,.has-error.checkbox-inline label,.has-error.radio label,.has-error.radio-inline label{color:#a94442}.has-error .form-control{border-color:#a94442;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.has-error .form-control:focus{border-color:#843534;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483}.has-error .input-group-addon{color:#a94442;background-color:#f2dede;border-color:#a94442}.has-error .form-control-feedback{color:#a94442}.has-feedback label~.form-control-feedback{top:25px}.has-feedback label.sr-only~.form-control-feedback{top:0}.help-block{display:block;margin-top:5px;margin-bottom:10px;color:#737373}@media (min-width:768px){.form-inline .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.form-inline .form-control{display:inline-block;width:auto;vertical-align:middle}.form-inline .form-control-static{display:inline-block}.form-inline .input-group{display:inline-table;vertical-align:middle}.form-inline .input-group .form-control,.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn{width:auto}.form-inline .input-group>.form-control{width:100%}.form-inline .control-label{margin-bottom:0;vertical-align:middle}.form-inline .checkbox,.form-inline .radio{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.form-inline .checkbox label,.form-inline .radio label{padding-left:0}.form-inline .checkbox input[type=checkbox],.form-inline .radio input[type=radio]{position:relative;margin-left:0}.form-inline .has-feedback .form-control-feedback{top:0}}.form-horizontal .checkbox,.form-horizontal .checkbox-inline,.form-horizontal .radio,.form-horizontal .radio-inline{padding-top:7px;margin-top:0;margin-bottom:0}.form-horizontal .checkbox,.form-horizontal .radio{min-height:27px}.form-horizontal .form-group{margin-right:-15px;margin-left:-15px}@media (min-width:768px){.form-horizontal .control-label{padding-top:7px;margin-bottom:0;text-align:right}}.form-horizontal .has-feedback .form-control-feedback{right:15px}@media (min-width:768px){.form-horizontal .form-group-lg .control-label{padding-top:14.33px}}@media (min-width:768px){.form-horizontal .form-group-sm .control-label{padding-top:6px}}.btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;border:1px solid transparent;border-radius:4px}.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn.focus,.btn:focus,.btn:hover{color:#333;text-decoration:none}.btn.active,.btn:active{background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn.disabled,.btn[disabled],fieldset[disabled] .btn{pointer-events:none;cursor:not-allowed;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none;opacity:.65}.btn-default{color:#333;background-color:#fff;border-color:#ccc}.btn-default.active,.btn-default.focus,.btn-default:active,.btn-default:focus,.btn-default:hover,.open>.dropdown-toggle.btn-default{color:#333;background-color:#e6e6e6;border-color:#adadad}.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default{background-image:none}.btn-default.disabled,.btn-default.disabled.active,.btn-default.disabled.focus,.btn-default.disabled:active,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled],.btn-default[disabled].active,.btn-default[disabled].focus,.btn-default[disabled]:active,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default.active,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover{background-color:#fff;border-color:#ccc}.btn-default .badge{color:#fff;background-color:#333}.btn-primary{color:#fff;background-color:#337ab7;border-color:#2e6da4}.btn-primary.active,.btn-primary.focus,.btn-primary:active,.btn-primary:focus,.btn-primary:hover,.open>.dropdown-toggle.btn-primary{color:#fff;background-color:#286090;border-color:#204d74}.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary{background-image:none}.btn-primary.disabled,.btn-primary.disabled.active,.btn-primary.disabled.focus,.btn-primary.disabled:active,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled],.btn-primary[disabled].active,.btn-primary[disabled].focus,.btn-primary[disabled]:active,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary,fieldset[disabled] .btn-primary.active,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:active,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover{background-color:#337ab7;border-color:#2e6da4}.btn-primary .badge{color:#337ab7;background-color:#fff}.btn-success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.btn-success.active,.btn-success.focus,.btn-success:active,.btn-success:focus,.btn-success:hover,.open>.dropdown-toggle.btn-success{color:#fff;background-color:#449d44;border-color:#398439}.btn-success.active,.btn-success:active,.open>.dropdown-toggle.btn-success{background-image:none}.btn-success.disabled,.btn-success.disabled.active,.btn-success.disabled.focus,.btn-success.disabled:active,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled],.btn-success[disabled].active,.btn-success[disabled].focus,.btn-success[disabled]:active,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success,fieldset[disabled] .btn-success.active,fieldset[disabled] .btn-success.focus,fieldset[disabled] .btn-success:active,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover{background-color:#5cb85c;border-color:#4cae4c}.btn-success .badge{color:#5cb85c;background-color:#fff}.btn-info{color:#fff;background-color:#5bc0de;border-color:#46b8da}.btn-info.active,.btn-info.focus,.btn-info:active,.btn-info:focus,.btn-info:hover,.open>.dropdown-toggle.btn-info{color:#fff;background-color:#31b0d5;border-color:#269abc}.btn-info.active,.btn-info:active,.open>.dropdown-toggle.btn-info{background-image:none}.btn-info.disabled,.btn-info.disabled.active,.btn-info.disabled.focus,.btn-info.disabled:active,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled],.btn-info[disabled].active,.btn-info[disabled].focus,.btn-info[disabled]:active,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info,fieldset[disabled] .btn-info.active,fieldset[disabled] .btn-info.focus,fieldset[disabled] .btn-info:active,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover{background-color:#5bc0de;border-color:#46b8da}.btn-info .badge{color:#5bc0de;background-color:#fff}.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}.btn-warning.active,.btn-warning.focus,.btn-warning:active,.btn-warning:focus,.btn-warning:hover,.open>.dropdown-toggle.btn-warning{color:#fff;background-color:#ec971f;border-color:#d58512}.btn-warning.active,.btn-warning:active,.open>.dropdown-toggle.btn-warning{background-image:none}.btn-warning.disabled,.btn-warning.disabled.active,.btn-warning.disabled.focus,.btn-warning.disabled:active,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled],.btn-warning[disabled].active,.btn-warning[disabled].focus,.btn-warning[disabled]:active,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning,fieldset[disabled] .btn-warning.active,fieldset[disabled] .btn-warning.focus,fieldset[disabled] .btn-warning:active,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover{background-color:#f0ad4e;border-color:#eea236}.btn-warning .badge{color:#f0ad4e;background-color:#fff}.btn-danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.btn-danger.active,.btn-danger.focus,.btn-danger:active,.btn-danger:focus,.btn-danger:hover,.open>.dropdown-toggle.btn-danger{color:#fff;background-color:#c9302c;border-color:#ac2925}.btn-danger.active,.btn-danger:active,.open>.dropdown-toggle.btn-danger{background-image:none}.btn-danger.disabled,.btn-danger.disabled.active,.btn-danger.disabled.focus,.btn-danger.disabled:active,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled],.btn-danger[disabled].active,.btn-danger[disabled].focus,.btn-danger[disabled]:active,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger,fieldset[disabled] .btn-danger.active,fieldset[disabled] .btn-danger.focus,fieldset[disabled] .btn-danger:active,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover{background-color:#d9534f;border-color:#d43f3a}.btn-danger .badge{color:#d9534f;background-color:#fff}.btn-link{font-weight:400;color:#337ab7;border-radius:0}.btn-link,.btn-link.active,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link{background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover{border-color:transparent}.btn-link:focus,.btn-link:hover{color:#23527c;text-decoration:underline;background-color:transparent}.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover{color:#777;text-decoration:none}.btn-group-lg>.btn,.btn-lg{padding:10px 16px;font-size:18px;line-height:1.3333333;border-radius:6px}.btn-group-sm>.btn,.btn-sm{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-group-xs>.btn,.btn-xs{padding:1px 5px;font-size:12px;line-height:1.5;border-radius:3px}.btn-block{display:block;width:100%}.btn-block+.btn-block{margin-top:5px}input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-block{width:100%}.fade{opacity:0;-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear}.fade.in{opacity:1}.collapse{display:none}.collapse.in{display:block}tr.collapse.in{display:table-row}tbody.collapse.in{display:table-row-group}.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease;-webkit-transition-duration:.35s;-o-transition-duration:.35s;transition-duration:.35s;-webkit-transition-property:height,visibility;-o-transition-property:height,visibility;transition-property:height,visibility}.caret{display:inline-block;width:0;height:0;margin-left:2px;vertical-align:middle;border-top:4px dashed;border-right:4px solid transparent;border-left:4px solid transparent}.dropdown,.dropup{position:relative}.dropdown-toggle:focus{outline:0}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:160px;padding:5px 0;margin:2px 0 0;font-size:14px;text-align:left;list-style:none;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #ccc;border:1px solid rgba(0,0,0,.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,.175);box-shadow:0 6px 12px rgba(0,0,0,.175)}.dropdown-menu.pull-right{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.dropdown-menu>li>a{display:block;padding:3px 20px;clear:both;font-weight:400;line-height:1.42857143;color:#333;white-space:nowrap}.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover{color:#262626;text-decoration:none;background-color:#f5f5f5}.dropdown-menu>.active>a,.dropdown-menu>.active>a:focus,.dropdown-menu>.active>a:hover{color:#fff;text-decoration:none;background-color:#337ab7;outline:0}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>a:hover{color:#777}.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>a:hover{text-decoration:none;cursor:not-allowed;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.open>.dropdown-menu{display:block}.open>a{outline:0}.dropdown-menu-right{right:0;left:auto}.dropdown-menu-left{right:auto;left:0}.dropdown-header{display:block;padding:3px 20px;font-size:12px;line-height:1.42857143;color:#777;white-space:nowrap}.dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:990}.pull-right>.dropdown-menu{right:0;left:auto}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{content:"";border-top:0;border-bottom:4px solid}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:100%;margin-bottom:2px}@media (min-width:768px){.navbar-right .dropdown-menu{right:0;left:auto}.navbar-right .dropdown-menu-left{right:auto;left:0}}.btn-group,.btn-group-vertical{position:relative;display:inline-block;vertical-align:middle}.btn-group-vertical>.btn,.btn-group>.btn{position:relative;float:left}.btn-group-vertical>.btn.active,.btn-group-vertical>.btn:active,.btn-group-vertical>.btn:focus,.btn-group-vertical>.btn:hover,.btn-group>.btn.active,.btn-group>.btn:active,.btn-group>.btn:focus,.btn-group>.btn:hover{z-index:2}.btn-group .btn+.btn,.btn-group .btn+.btn-group,.btn-group .btn-group+.btn,.btn-group .btn-group+.btn-group{margin-left:-1px}.btn-toolbar{margin-left:-5px}.btn-toolbar .btn-group,.btn-toolbar .input-group{float:left}.btn-toolbar>.btn,.btn-toolbar>.btn-group,.btn-toolbar>.input-group{margin-left:5px}.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){border-radius:0}.btn-group>.btn:first-child{margin-left:0}.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn:last-child:not(:first-child),.btn-group>.dropdown-toggle:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.btn-group>.btn-group{float:left}.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group>.btn-group:first-child:not(:last-child)>.btn:last-child,.btn-group>.btn-group:first-child:not(:last-child)>.dropdown-toggle{border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:last-child:not(:first-child)>.btn:first-child{border-top-left-radius:0;border-bottom-left-radius:0}.btn-group .dropdown-toggle:active,.btn-group.open .dropdown-toggle{outline:0}.btn-group>.btn+.dropdown-toggle{padding-right:8px;padding-left:8px}.btn-group>.btn-lg+.dropdown-toggle{padding-right:12px;padding-left:12px}.btn-group.open .dropdown-toggle{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn-group.open .dropdown-toggle.btn-link{-webkit-box-shadow:none;box-shadow:none}.btn .caret{margin-left:0}.btn-lg .caret{border-width:5px 5px 0;border-bottom-width:0}.dropup .btn-lg .caret{border-width:0 5px 5px}.btn-group-vertical>.btn,.btn-group-vertical>.btn-group,.btn-group-vertical>.btn-group>.btn{display:block;float:none;width:100%;max-width:100%}.btn-group-vertical>.btn-group>.btn{float:none}.btn-group-vertical>.btn+.btn,.btn-group-vertical>.btn+.btn-group,.btn-group-vertical>.btn-group+.btn,.btn-group-vertical>.btn-group+.btn-group{margin-top:-1px;margin-left:0}.btn-group-vertical>.btn:not(:first-child):not(:last-child){border-radius:0}.btn-group-vertical>.btn:first-child:not(:last-child){border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn:last-child:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:4px}.btn-group-vertical>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group-vertical>.btn-group:first-child:not(:last-child)>.btn:last-child,.btn-group-vertical>.btn-group:first-child:not(:last-child)>.dropdown-toggle{border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn-group:last-child:not(:first-child)>.btn:first-child{border-top-left-radius:0;border-top-right-radius:0}.btn-group-justified{display:table;width:100%;table-layout:fixed;border-collapse:separate}.btn-group-justified>.btn,.btn-group-justified>.btn-group{display:table-cell;float:none;width:1%}.btn-group-justified>.btn-group .btn{width:100%}.btn-group-justified>.btn-group .dropdown-menu{left:auto}[data-toggle=buttons]>.btn input[type=checkbox],[data-toggle=buttons]>.btn input[type=radio],[data-toggle=buttons]>.btn-group>.btn input[type=checkbox],[data-toggle=buttons]>.btn-group>.btn input[type=radio]{position:absolute;clip:rect(0,0,0,0);pointer-events:none}.input-group{position:relative;display:table;border-collapse:separate}.input-group[class*=col-]{float:none;padding-right:0;padding-left:0}.input-group .form-control{position:relative;z-index:2;float:left;width:100%;margin-bottom:0}.input-group-lg>.form-control,.input-group-lg>.input-group-addon,.input-group-lg>.input-group-btn>.btn{height:46px;padding:10px 16px;font-size:18px;line-height:1.3333333;border-radius:6px}select.input-group-lg>.form-control,select.input-group-lg>.input-group-addon,select.input-group-lg>.input-group-btn>.btn{height:46px;line-height:46px}select[multiple].input-group-lg>.form-control,select[multiple].input-group-lg>.input-group-addon,select[multiple].input-group-lg>.input-group-btn>.btn,textarea.input-group-lg>.form-control,textarea.input-group-lg>.input-group-addon,textarea.input-group-lg>.input-group-btn>.btn{height:auto}.input-group-sm>.form-control,.input-group-sm>.input-group-addon,.input-group-sm>.input-group-btn>.btn{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-group-sm>.form-control,select.input-group-sm>.input-group-addon,select.input-group-sm>.input-group-btn>.btn{height:30px;line-height:30px}select[multiple].input-group-sm>.form-control,select[multiple].input-group-sm>.input-group-addon,select[multiple].input-group-sm>.input-group-btn>.btn,textarea.input-group-sm>.form-control,textarea.input-group-sm>.input-group-addon,textarea.input-group-sm>.input-group-btn>.btn{height:auto}.input-group .form-control,.input-group-addon,.input-group-btn{display:table-cell}.input-group .form-control:not(:first-child):not(:last-child),.input-group-addon:not(:first-child):not(:last-child),.input-group-btn:not(:first-child):not(:last-child){border-radius:0}.input-group-addon,.input-group-btn{width:1%;white-space:nowrap;vertical-align:middle}.input-group-addon{padding:6px 12px;font-size:14px;font-weight:400;line-height:1;color:#555;text-align:center;background-color:#eee;border:1px solid #ccc;border-radius:4px}.input-group-addon.input-sm{padding:5px 10px;font-size:12px;border-radius:3px}.input-group-addon.input-lg{padding:10px 16px;font-size:18px;border-radius:6px}.input-group-addon input[type=checkbox],.input-group-addon input[type=radio]{margin-top:0}.input-group .form-control:first-child,.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group>.btn,.input-group-btn:first-child>.dropdown-toggle,.input-group-btn:last-child>.btn-group:not(:last-child)>.btn,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.input-group-addon:first-child{border-right:0}.input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:first-child>.btn-group:not(:first-child)>.btn,.input-group-btn:first-child>.btn:not(:first-child),.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group>.btn,.input-group-btn:last-child>.dropdown-toggle{border-top-left-radius:0;border-bottom-left-radius:0}.input-group-addon:last-child{border-left:0}.input-group-btn{position:relative;font-size:0;white-space:nowrap}.input-group-btn>.btn{position:relative}.input-group-btn>.btn+.btn{margin-left:-1px}.input-group-btn>.btn:active,.input-group-btn>.btn:focus,.input-group-btn>.btn:hover{z-index:2}.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group{margin-right:-1px}.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group{margin-left:-1px}.nav{padding-left:0;margin-bottom:0;list-style:none}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav>li>a:focus,.nav>li>a:hover{text-decoration:none;background-color:#eee}.nav>li.disabled>a{color:#777}.nav>li.disabled>a:focus,.nav>li.disabled>a:hover{color:#777;text-decoration:none;cursor:not-allowed;background-color:transparent}.nav .open>a,.nav .open>a:focus,.nav .open>a:hover{background-color:#eee;border-color:#337ab7}.nav .nav-divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.nav>li>a>img{max-width:none}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{float:left;margin-bottom:-1px}.nav-tabs>li>a{margin-right:2px;line-height:1.42857143;border:1px solid transparent;border-radius:4px 4px 0 0}.nav-tabs>li>a:hover{border-color:#eee #eee #ddd}.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover{color:#555;cursor:default;background-color:#fff;border:1px solid #ddd;border-bottom-color:transparent}.nav-tabs.nav-justified{width:100%;border-bottom:0}.nav-tabs.nav-justified>li{float:none}.nav-tabs.nav-justified>li>a{margin-bottom:5px;text-align:center}.nav-tabs.nav-justified>.dropdown .dropdown-menu{top:auto;left:auto}@media (min-width:768px){.nav-tabs.nav-justified>li{display:table-cell;width:1%}.nav-tabs.nav-justified>li>a{margin-bottom:0}}.nav-tabs.nav-justified>li>a{margin-right:0;border-radius:4px}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover{border:1px solid #ddd}@media (min-width:768px){.nav-tabs.nav-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover{border-bottom-color:#fff}}.nav-pills>li{float:left}.nav-pills>li>a{border-radius:4px}.nav-pills>li+li{margin-left:2px}.nav-pills>li.active>a,.nav-pills>li.active>a:focus,.nav-pills>li.active>a:hover{color:#fff;background-color:#337ab7}.nav-stacked>li{float:none}.nav-stacked>li+li{margin-top:2px;margin-left:0}.nav-justified{width:100%}.nav-justified>li{float:none}.nav-justified>li>a{margin-bottom:5px;text-align:center}.nav-justified>.dropdown .dropdown-menu{top:auto;left:auto}@media (min-width:768px){.nav-justified>li{display:table-cell;width:1%}.nav-justified>li>a{margin-bottom:0}}.nav-tabs-justified{border-bottom:0}.nav-tabs-justified>li>a{margin-right:0;border-radius:4px}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover{border:1px solid #ddd}@media (min-width:768px){.nav-tabs-justified>li>a{border-bottom:1px solid #ddd;border-radius:4px 4px 0 0}.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover{border-bottom-color:#fff}}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.nav-tabs .dropdown-menu{margin-top:-1px;border-top-left-radius:0;border-top-right-radius:0}.navbar{position:relative;min-height:50px;margin-bottom:20px;border:1px solid transparent}@media (min-width:768px){.navbar{border-radius:4px}}@media (min-width:768px){.navbar-header{float:left}}.navbar-collapse{padding-right:15px;padding-left:15px;overflow-x:visible;-webkit-overflow-scrolling:touch;border-top:1px solid transparent;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}.navbar-collapse.in{overflow-y:auto}@media (min-width:768px){.navbar-collapse{width:auto;border-top:0;-webkit-box-shadow:none;box-shadow:none}.navbar-collapse.collapse{display:block!important;height:auto!important;padding-bottom:0;overflow:visible!important}.navbar-collapse.in{overflow-y:visible}.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse{padding-right:0;padding-left:0}}.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse{max-height:340px}@media (max-device-width:480px)and (orientation:landscape){.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse{max-height:200px}}.container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header{margin-right:-15px;margin-left:-15px}@media (min-width:768px){.container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header{margin-right:0;margin-left:0}}.navbar-static-top{z-index:1000;border-width:0 0 1px}@media (min-width:768px){.navbar-static-top{border-radius:0}}.navbar-fixed-bottom,.navbar-fixed-top{position:fixed;right:0;left:0;z-index:1030}@media (min-width:768px){.navbar-fixed-bottom,.navbar-fixed-top{border-radius:0}}.navbar-fixed-top{top:0;border-width:0 0 1px}.navbar-fixed-bottom{bottom:0;margin-bottom:0;border-width:1px 0 0}.navbar-brand{float:left;height:50px;padding:15px 15px;font-size:18px;line-height:20px}.navbar-brand:focus,.navbar-brand:hover{text-decoration:none}.navbar-brand>img{display:block}@media (min-width:768px){.navbar>.container .navbar-brand,.navbar>.container-fluid .navbar-brand{margin-left:-15px}}.navbar-toggle{position:relative;float:right;padding:9px 10px;margin-top:8px;margin-right:15px;margin-bottom:8px;background-color:transparent;background-image:none;border:1px solid transparent;border-radius:4px}.navbar-toggle:focus{outline:0}.navbar-toggle .icon-bar{display:block;width:22px;height:2px;border-radius:1px}.navbar-toggle .icon-bar+.icon-bar{margin-top:4px}@media (min-width:768px){.navbar-toggle{display:none}}.navbar-nav{margin:7.5px -15px}.navbar-nav>li>a{padding-top:10px;padding-bottom:10px;line-height:20px}@media (max-width:767px){.navbar-nav .open .dropdown-menu{position:static;float:none;width:auto;margin-top:0;background-color:transparent;border:0;-webkit-box-shadow:none;box-shadow:none}.navbar-nav .open .dropdown-menu .dropdown-header,.navbar-nav .open .dropdown-menu>li>a{padding:5px 15px 5px 25px}.navbar-nav .open .dropdown-menu>li>a{line-height:20px}.navbar-nav .open .dropdown-menu>li>a:focus,.navbar-nav .open .dropdown-menu>li>a:hover{background-image:none}}@media (min-width:768px){.navbar-nav{float:left;margin:0}.navbar-nav>li{float:left}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}}.navbar-form{padding:10px 15px;margin-top:8px;margin-right:-15px;margin-bottom:8px;margin-left:-15px;border-top:1px solid transparent;border-bottom:1px solid transparent;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(255,255,255,.1)}@media (min-width:768px){.navbar-form .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.navbar-form .form-control{display:inline-block;width:auto;vertical-align:middle}.navbar-form .form-control-static{display:inline-block}.navbar-form .input-group{display:inline-table;vertical-align:middle}.navbar-form .input-group .form-control,.navbar-form .input-group .input-group-addon,.navbar-form .input-group .input-group-btn{width:auto}.navbar-form .input-group>.form-control{width:100%}.navbar-form .control-label{margin-bottom:0;vertical-align:middle}.navbar-form .checkbox,.navbar-form .radio{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.navbar-form .checkbox label,.navbar-form .radio label{padding-left:0}.navbar-form .checkbox input[type=checkbox],.navbar-form .radio input[type=radio]{position:relative;margin-left:0}.navbar-form .has-feedback .form-control-feedback{top:0}}@media (max-width:767px){.navbar-form .form-group{margin-bottom:5px}.navbar-form .form-group:last-child{margin-bottom:0}}@media (min-width:768px){.navbar-form{width:auto;padding-top:0;padding-bottom:0;margin-right:0;margin-left:0;border:0;-webkit-box-shadow:none;box-shadow:none}}.navbar-nav>li>.dropdown-menu{margin-top:0;border-top-left-radius:0;border-top-right-radius:0}.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu{margin-bottom:0;border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.navbar-btn{margin-top:8px;margin-bottom:8px}.navbar-btn.btn-sm{margin-top:10px;margin-bottom:10px}.navbar-btn.btn-xs{margin-top:14px;margin-bottom:14px}.navbar-text{margin-top:15px;margin-bottom:15px}@media (min-width:768px){.navbar-text{float:left;margin-right:15px;margin-left:15px}}@media (min-width:768px){.navbar-left{float:left!important}.navbar-right{float:right!important;margin-right:-15px}.navbar-right~.navbar-right{margin-right:0}}.navbar-default{background-color:#f8f8f8;border-color:#e7e7e7}.navbar-default .navbar-brand{color:#777}.navbar-default .navbar-brand:focus,.navbar-default .navbar-brand:hover{color:#5e5e5e;background-color:transparent}.navbar-default .navbar-text{color:#777}.navbar-default .navbar-nav>li>a{color:#777}.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>li>a:hover{color:#333;background-color:transparent}.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>.active>a:hover{color:#555;background-color:#e7e7e7}.navbar-default .navbar-nav>.disabled>a,.navbar-default .navbar-nav>.disabled>a:focus,.navbar-default .navbar-nav>.disabled>a:hover{color:#ccc;background-color:transparent}.navbar-default .navbar-toggle{border-color:#ddd}.navbar-default .navbar-toggle:focus,.navbar-default .navbar-toggle:hover{background-color:#ddd}.navbar-default .navbar-toggle .icon-bar{background-color:#888}.navbar-default .navbar-collapse,.navbar-default .navbar-form{border-color:#e7e7e7}.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:focus,.navbar-default .navbar-nav>.open>a:hover{color:#555;background-color:#e7e7e7}@media (max-width:767px){.navbar-default .navbar-nav .open .dropdown-menu>li>a{color:#777}.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover{color:#333;background-color:transparent}.navbar-default .navbar-nav .open .dropdown-menu>.active>a,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover{color:#555;background-color:#e7e7e7}.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover{color:#ccc;background-color:transparent}}.navbar-default .navbar-link{color:#777}.navbar-default .navbar-link:hover{color:#333}.navbar-default .btn-link{color:#777}.navbar-default .btn-link:focus,.navbar-default .btn-link:hover{color:#333}.navbar-default .btn-link[disabled]:focus,.navbar-default .btn-link[disabled]:hover,fieldset[disabled] .navbar-default .btn-link:focus,fieldset[disabled] .navbar-default .btn-link:hover{color:#ccc}.navbar-inverse{background-color:#222;border-color:#080808}.navbar-inverse .navbar-brand{color:#9d9d9d}.navbar-inverse .navbar-brand:focus,.navbar-inverse .navbar-brand:hover{color:#fff;background-color:transparent}.navbar-inverse .navbar-text{color:#9d9d9d}.navbar-inverse .navbar-nav>li>a{color:#9d9d9d}.navbar-inverse .navbar-nav>li>a:focus,.navbar-inverse .navbar-nav>li>a:hover{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:focus,.navbar-inverse .navbar-nav>.active>a:hover{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.disabled>a,.navbar-inverse .navbar-nav>.disabled>a:focus,.navbar-inverse .navbar-nav>.disabled>a:hover{color:#444;background-color:transparent}.navbar-inverse .navbar-toggle{border-color:#333}.navbar-inverse .navbar-toggle:focus,.navbar-inverse .navbar-toggle:hover{background-color:#333}.navbar-inverse .navbar-toggle .icon-bar{background-color:#fff}.navbar-inverse .navbar-collapse,.navbar-inverse .navbar-form{border-color:#101010}.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a:focus,.navbar-inverse .navbar-nav>.open>a:hover{color:#fff;background-color:#080808}@media (max-width:767px){.navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header{border-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu .divider{background-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a{color:#9d9d9d}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover{color:#444;background-color:transparent}}.navbar-inverse .navbar-link{color:#9d9d9d}.navbar-inverse .navbar-link:hover{color:#fff}.navbar-inverse .btn-link{color:#9d9d9d}.navbar-inverse .btn-link:focus,.navbar-inverse .btn-link:hover{color:#fff}.navbar-inverse .btn-link[disabled]:focus,.navbar-inverse .btn-link[disabled]:hover,fieldset[disabled] .navbar-inverse .btn-link:focus,fieldset[disabled] .navbar-inverse .btn-link:hover{color:#444}.breadcrumb{padding:8px 15px;margin-bottom:20px;list-style:none;background-color:#f5f5f5;border-radius:4px}.breadcrumb>li{display:inline-block}.breadcrumb>li+li:before{padding:0 5px;color:#ccc;content:"/\00a0"}.breadcrumb>.active{color:#777}.pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}.pagination>li{display:inline}.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#337ab7;text-decoration:none;background-color:#fff;border:1px solid #ddd}.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px}.pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px}.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{color:#23527c;background-color:#eee;border-color:#ddd}.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{z-index:2;color:#fff;cursor:default;background-color:#337ab7;border-color:#337ab7}.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd}.pagination-lg>li>a,.pagination-lg>li>span{padding:10px 16px;font-size:18px}.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span{border-top-left-radius:6px;border-bottom-left-radius:6px}.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}.pagination-sm>li>a,.pagination-sm>li>span{padding:5px 10px;font-size:12px}.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span{border-top-left-radius:3px;border-bottom-left-radius:3px}.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}.pager{padding-left:0;margin:20px 0;text-align:center;list-style:none}.pager li{display:inline}.pager li>a,.pager li>span{display:inline-block;padding:5px 14px;background-color:#fff;border:1px solid #ddd;border-radius:15px}.pager li>a:focus,.pager li>a:hover{text-decoration:none;background-color:#eee}.pager .next>a,.pager .next>span{float:right}.pager .previous>a,.pager .previous>span{float:left}.pager .disabled>a,.pager .disabled>a:focus,.pager .disabled>a:hover,.pager .disabled>span{color:#777;cursor:not-allowed;background-color:#fff}.label{display:inline;padding:.2em .6em .3em;font-size:75%;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25em}a.label:focus,a.label:hover{color:#fff;text-decoration:none;cursor:pointer}.label:empty{display:none}.btn .label{position:relative;top:-1px}.label-default{background-color:#777}.label-default[href]:focus,.label-default[href]:hover{background-color:#5e5e5e}.label-primary{background-color:#337ab7}.label-primary[href]:focus,.label-primary[href]:hover{background-color:#286090}.label-success{background-color:#5cb85c}.label-success[href]:focus,.label-success[href]:hover{background-color:#449d44}.label-info{background-color:#5bc0de}.label-info[href]:focus,.label-info[href]:hover{background-color:#31b0d5}.label-warning{background-color:#f0ad4e}.label-warning[href]:focus,.label-warning[href]:hover{background-color:#ec971f}.label-danger{background-color:#d9534f}.label-danger[href]:focus,.label-danger[href]:hover{background-color:#c9302c}.badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;background-color:#777;border-radius:10px}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.btn-group-xs>.btn .badge,.btn-xs .badge{top:0;padding:1px 5px}a.badge:focus,a.badge:hover{color:#fff;text-decoration:none;cursor:pointer}.list-group-item.active>.badge,.nav-pills>.active>a>.badge{color:#337ab7;background-color:#fff}.list-group-item>.badge{float:right}.list-group-item>.badge+.badge{margin-right:5px}.nav-pills>li>a>.badge{margin-left:3px}.jumbotron{padding:30px 15px;margin-bottom:30px;color:inherit;background-color:#eee}.jumbotron .h1,.jumbotron h1{color:inherit}.jumbotron p{margin-bottom:15px;font-size:21px;font-weight:200}.jumbotron>hr{border-top-color:#d5d5d5}.container .jumbotron,.container-fluid .jumbotron{border-radius:6px}.jumbotron .container{max-width:100%}@media screen and (min-width:768px){.jumbotron{padding:48px 0}.container .jumbotron,.container-fluid .jumbotron{padding-right:60px;padding-left:60px}.jumbotron .h1,.jumbotron h1{font-size:63px}}.thumbnail{display:block;padding:4px;margin-bottom:20px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:border .2s ease-in-out;-o-transition:border .2s ease-in-out;transition:border .2s ease-in-out}.thumbnail a>img,.thumbnail>img{margin-right:auto;margin-left:auto}a.thumbnail.active,a.thumbnail:focus,a.thumbnail:hover{border-color:#337ab7}.thumbnail .caption{padding:9px;color:#333}.alert{padding:15px;margin-bottom:20px;border:1px solid transparent;border-radius:4px}.alert h4{margin-top:0;color:inherit}.alert .alert-link{font-weight:700}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:5px}.alert-dismissable,.alert-dismissible{padding-right:35px}.alert-dismissable .close,.alert-dismissible .close{position:relative;top:-2px;right:-21px;color:inherit}.alert-success{color:#3c763d;background-color:#dff0d8;border-color:#d6e9c6}.alert-success hr{border-top-color:#c9e2b3}.alert-success .alert-link{color:#2b542c}.alert-info{color:#31708f;background-color:#d9edf7;border-color:#bce8f1}.alert-info hr{border-top-color:#a6e1ec}.alert-info .alert-link{color:#245269}.alert-warning{color:#8a6d3b;background-color:#fcf8e3;border-color:#faebcc}.alert-warning hr{border-top-color:#f7e1b5}.alert-warning .alert-link{color:#66512c}.alert-danger{color:#a94442;background-color:#f2dede;border-color:#ebccd1}.alert-danger hr{border-top-color:#e4b9c0}.alert-danger .alert-link{color:#843534}@-webkit-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-o-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}.progress{height:20px;margin-bottom:20px;overflow:hidden;background-color:#f5f5f5;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);box-shadow:inset 0 1px 2px rgba(0,0,0,.1)}.progress-bar{float:left;width:0;height:100%;font-size:12px;line-height:20px;color:#fff;text-align:center;background-color:#337ab7;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,.15);box-shadow:inset 0 -1px 0 rgba(0,0,0,.15);-webkit-transition:width .6s ease;-o-transition:width .6s ease;transition:width .6s ease}.progress-bar-striped,.progress-striped .progress-bar{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);-webkit-background-size:40px 40px;background-size:40px 40px}.progress-bar.active,.progress.active .progress-bar{-webkit-animation:progress-bar-stripes 2s linear infinite;-o-animation:progress-bar-stripes 2s linear infinite;animation:progress-bar-stripes 2s linear infinite}.progress-bar-success{background-color:#5cb85c}.progress-striped .progress-bar-success{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-info{background-color:#5bc0de}.progress-striped .progress-bar-info{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-warning{background-color:#f0ad4e}.progress-striped .progress-bar-warning{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.progress-bar-danger{background-color:#d9534f}.progress-striped .progress-bar-danger{background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:-o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent)}.media{margin-top:15px}.media:first-child{margin-top:0}.media,.media-body{overflow:hidden;zoom:1}.media-body{width:10000px}.media-object{display:block}.media-right,.media>.pull-right{padding-left:10px}.media-left,.media>.pull-left{padding-right:10px}.media-body,.media-left,.media-right{display:table-cell;vertical-align:top}.media-middle{vertical-align:middle}.media-bottom{vertical-align:bottom}.media-heading{margin-top:0;margin-bottom:5px}.media-list{padding-left:0;list-style:none}.list-group{padding-left:0;margin-bottom:20px}.list-group-item{position:relative;display:block;padding:10px 15px;margin-bottom:-1px;background-color:#fff;border:1px solid #ddd}.list-group-item:first-child{border-top-left-radius:4px;border-top-right-radius:4px}.list-group-item:last-child{margin-bottom:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}a.list-group-item{color:#555}a.list-group-item .list-group-item-heading{color:#333}a.list-group-item:focus,a.list-group-item:hover{color:#555;text-decoration:none;background-color:#f5f5f5}.list-group-item.disabled,.list-group-item.disabled:focus,.list-group-item.disabled:hover{color:#777;cursor:not-allowed;background-color:#eee}.list-group-item.disabled .list-group-item-heading,.list-group-item.disabled:focus .list-group-item-heading,.list-group-item.disabled:hover .list-group-item-heading{color:inherit}.list-group-item.disabled .list-group-item-text,.list-group-item.disabled:focus .list-group-item-text,.list-group-item.disabled:hover .list-group-item-text{color:#777}.list-group-item.active,.list-group-item.active:focus,.list-group-item.active:hover{z-index:2;color:#fff;background-color:#337ab7;border-color:#337ab7}.list-group-item.active .list-group-item-heading,.list-group-item.active .list-group-item-heading>.small,.list-group-item.active .list-group-item-heading>small,.list-group-item.active:focus .list-group-item-heading,.list-group-item.active:focus .list-group-item-heading>.small,.list-group-item.active:focus .list-group-item-heading>small,.list-group-item.active:hover .list-group-item-heading,.list-group-item.active:hover .list-group-item-heading>.small,.list-group-item.active:hover .list-group-item-heading>small{color:inherit}.list-group-item.active .list-group-item-text,.list-group-item.active:focus .list-group-item-text,.list-group-item.active:hover .list-group-item-text{color:#c7ddef}.list-group-item-success{color:#3c763d;background-color:#dff0d8}a.list-group-item-success{color:#3c763d}a.list-group-item-success .list-group-item-heading{color:inherit}a.list-group-item-success:focus,a.list-group-item-success:hover{color:#3c763d;background-color:#d0e9c6}a.list-group-item-success.active,a.list-group-item-success.active:focus,a.list-group-item-success.active:hover{color:#fff;background-color:#3c763d;border-color:#3c763d}.list-group-item-info{color:#31708f;background-color:#d9edf7}a.list-group-item-info{color:#31708f}a.list-group-item-info .list-group-item-heading{color:inherit}a.list-group-item-info:focus,a.list-group-item-info:hover{color:#31708f;background-color:#c4e3f3}a.list-group-item-info.active,a.list-group-item-info.active:focus,a.list-group-item-info.active:hover{color:#fff;background-color:#31708f;border-color:#31708f}.list-group-item-warning{color:#8a6d3b;background-color:#fcf8e3}a.list-group-item-warning{color:#8a6d3b}a.list-group-item-warning .list-group-item-heading{color:inherit}a.list-group-item-warning:focus,a.list-group-item-warning:hover{color:#8a6d3b;background-color:#faf2cc}a.list-group-item-warning.active,a.list-group-item-warning.active:focus,a.list-group-item-warning.active:hover{color:#fff;background-color:#8a6d3b;border-color:#8a6d3b}.list-group-item-danger{color:#a94442;background-color:#f2dede}a.list-group-item-danger{color:#a94442}a.list-group-item-danger .list-group-item-heading{color:inherit}a.list-group-item-danger:focus,a.list-group-item-danger:hover{color:#a94442;background-color:#ebcccc}a.list-group-item-danger.active,a.list-group-item-danger.active:focus,a.list-group-item-danger.active:hover{color:#fff;background-color:#a94442;border-color:#a94442}.list-group-item-heading{margin-top:0;margin-bottom:5px}.list-group-item-text{margin-bottom:0;line-height:1.3}.panel{margin-bottom:20px;background-color:#fff;border:1px solid transparent;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px rgba(0,0,0,.05)}.panel-body{padding:15px}.panel-heading{padding:10px 15px;border-bottom:1px solid transparent;border-top-left-radius:3px;border-top-right-radius:3px}.panel-heading>.dropdown .dropdown-toggle{color:inherit}.panel-title{margin-top:0;margin-bottom:0;font-size:16px;color:inherit}.panel-title>.small,.panel-title>.small>a,.panel-title>a,.panel-title>small,.panel-title>small>a{color:inherit}.panel-footer{padding:10px 15px;background-color:#f5f5f5;border-top:1px solid #ddd;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.list-group,.panel>.panel-collapse>.list-group{margin-bottom:0}.panel>.list-group .list-group-item,.panel>.panel-collapse>.list-group .list-group-item{border-width:1px 0;border-radius:0}.panel>.list-group:first-child .list-group-item:first-child,.panel>.panel-collapse>.list-group:first-child .list-group-item:first-child{border-top:0;border-top-left-radius:3px;border-top-right-radius:3px}.panel>.list-group:last-child .list-group-item:last-child,.panel>.panel-collapse>.list-group:last-child .list-group-item:last-child{border-bottom:0;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel-heading+.list-group .list-group-item:first-child{border-top-width:0}.list-group+.panel-footer{border-top-width:0}.panel>.panel-collapse>.table,.panel>.table,.panel>.table-responsive>.table{margin-bottom:0}.panel>.panel-collapse>.table caption,.panel>.table caption,.panel>.table-responsive>.table caption{padding-right:15px;padding-left:15px}.panel>.table-responsive:first-child>.table:first-child,.panel>.table:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child,.panel>.table:first-child>thead:first-child>tr:first-child{border-top-left-radius:3px;border-top-right-radius:3px}.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:first-child,.panel>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table:first-child>thead:first-child>tr:first-child th:first-child{border-top-left-radius:3px}.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:last-child,.panel>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table:first-child>thead:first-child>tr:first-child th:last-child{border-top-right-radius:3px}.panel>.table-responsive:last-child>.table:last-child,.panel>.table:last-child{border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child{border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:first-child,.panel>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:first-child{border-bottom-left-radius:3px}.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:last-child{border-bottom-right-radius:3px}.panel>.panel-body+.table,.panel>.panel-body+.table-responsive,.panel>.table+.panel-body,.panel>.table-responsive+.panel-body{border-top:1px solid #ddd}.panel>.table>tbody:first-child>tr:first-child td,.panel>.table>tbody:first-child>tr:first-child th{border-top:0}.panel>.table-bordered,.panel>.table-responsive>.table-bordered{border:0}.panel>.table-bordered>tbody>tr>td:first-child,.panel>.table-bordered>tbody>tr>th:first-child,.panel>.table-bordered>tfoot>tr>td:first-child,.panel>.table-bordered>tfoot>tr>th:first-child,.panel>.table-bordered>thead>tr>td:first-child,.panel>.table-bordered>thead>tr>th:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:first-child,.panel>.table-responsive>.table-bordered>thead>tr>td:first-child,.panel>.table-responsive>.table-bordered>thead>tr>th:first-child{border-left:0}.panel>.table-bordered>tbody>tr>td:last-child,.panel>.table-bordered>tbody>tr>th:last-child,.panel>.table-bordered>tfoot>tr>td:last-child,.panel>.table-bordered>tfoot>tr>th:last-child,.panel>.table-bordered>thead>tr>td:last-child,.panel>.table-bordered>thead>tr>th:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:last-child,.panel>.table-responsive>.table-bordered>thead>tr>td:last-child,.panel>.table-responsive>.table-bordered>thead>tr>th:last-child{border-right:0}.panel>.table-bordered>tbody>tr:first-child>td,.panel>.table-bordered>tbody>tr:first-child>th,.panel>.table-bordered>thead>tr:first-child>td,.panel>.table-bordered>thead>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th,.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,.panel>.table-responsive>.table-bordered>thead>tr:first-child>th{border-bottom:0}.panel>.table-bordered>tbody>tr:last-child>td,.panel>.table-bordered>tbody>tr:last-child>th,.panel>.table-bordered>tfoot>tr:last-child>td,.panel>.table-bordered>tfoot>tr:last-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th{border-bottom:0}.panel>.table-responsive{margin-bottom:0;border:0}.panel-group{margin-bottom:20px}.panel-group .panel{margin-bottom:0;border-radius:4px}.panel-group .panel+.panel{margin-top:5px}.panel-group .panel-heading{border-bottom:0}.panel-group .panel-heading+.panel-collapse>.list-group,.panel-group .panel-heading+.panel-collapse>.panel-body{border-top:1px solid #ddd}.panel-group .panel-footer{border-top:0}.panel-group .panel-footer+.panel-collapse .panel-body{border-bottom:1px solid #ddd}.panel-default{border-color:#ddd}.panel-default>.panel-heading{color:#333;background-color:#f5f5f5;border-color:#ddd}.panel-default>.panel-heading+.panel-collapse>.panel-body{border-top-color:#ddd}.panel-default>.panel-heading .badge{color:#f5f5f5;background-color:#333}.panel-default>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#ddd}.panel-primary{border-color:#337ab7}.panel-primary>.panel-heading{color:#fff;background-color:#337ab7;border-color:#337ab7}.panel-primary>.panel-heading+.panel-collapse>.panel-body{border-top-color:#337ab7}.panel-primary>.panel-heading .badge{color:#337ab7;background-color:#fff}.panel-primary>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#337ab7}.panel-success{border-color:#d6e9c6}.panel-success>.panel-heading{color:#3c763d;background-color:#dff0d8;border-color:#d6e9c6}.panel-success>.panel-heading+.panel-collapse>.panel-body{border-top-color:#d6e9c6}.panel-success>.panel-heading .badge{color:#dff0d8;background-color:#3c763d}.panel-success>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#d6e9c6}.panel-info{border-color:#bce8f1}.panel-info>.panel-heading{color:#31708f;background-color:#d9edf7;border-color:#bce8f1}.panel-info>.panel-heading+.panel-collapse>.panel-body{border-top-color:#bce8f1}.panel-info>.panel-heading .badge{color:#d9edf7;background-color:#31708f}.panel-info>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#bce8f1}.panel-warning{border-color:#faebcc}.panel-warning>.panel-heading{color:#8a6d3b;background-color:#fcf8e3;border-color:#faebcc}.panel-warning>.panel-heading+.panel-collapse>.panel-body{border-top-color:#faebcc}.panel-warning>.panel-heading .badge{color:#fcf8e3;background-color:#8a6d3b}.panel-warning>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#faebcc}.panel-danger{border-color:#ebccd1}.panel-danger>.panel-heading{color:#a94442;background-color:#f2dede;border-color:#ebccd1}.panel-danger>.panel-heading+.panel-collapse>.panel-body{border-top-color:#ebccd1}.panel-danger>.panel-heading .badge{color:#f2dede;background-color:#a94442}.panel-danger>.panel-footer+.panel-collapse>.panel-body{border-bottom-color:#ebccd1}.embed-responsive{position:relative;display:block;height:0;padding:0;overflow:hidden}.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}.embed-responsive-16by9{padding-bottom:56.25%}.embed-responsive-4by3{padding-bottom:75%}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.05);box-shadow:inset 0 1px 1px rgba(0,0,0,.05)}.well blockquote{border-color:#ddd;border-color:rgba(0,0,0,.15)}.well-lg{padding:24px;border-radius:6px}.well-sm{padding:9px;border-radius:3px}.close{float:right;font-size:21px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;filter:alpha(opacity=20);opacity:.2}.close:focus,.close:hover{color:#000;text-decoration:none;cursor:pointer;filter:alpha(opacity=50);opacity:.5}button.close{-webkit-appearance:none;padding:0;cursor:pointer;background:0 0;border:0}.modal-open{overflow:hidden}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;display:none;overflow:hidden;-webkit-overflow-scrolling:touch;outline:0}.modal.fade .modal-dialog{-webkit-transition:-webkit-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out;-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);-o-transform:translate(0,-25%);transform:translate(0,-25%)}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}.modal-open .modal{overflow-x:hidden;overflow-y:auto}.modal-dialog{position:relative;width:auto;margin:10px}.modal-content{position:relative;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #999;border:1px solid rgba(0,0,0,.2);border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);box-shadow:0 3px 9px rgba(0,0,0,.5)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;background-color:#000}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}.modal-header{min-height:16.43px;padding:15px;border-bottom:1px solid #e5e5e5}.modal-header .close{margin-top:-2px}.modal-title{margin:0;line-height:1.42857143}.modal-body{position:relative;padding:15px}.modal-footer{padding:15px;text-align:right;border-top:1px solid #e5e5e5}.modal-footer .btn+.btn{margin-bottom:0;margin-left:5px}.modal-footer .btn-group .btn+.btn{margin-left:-1px}.modal-footer .btn-block+.btn-block{margin-left:0}.modal-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}@media (min-width:768px){.modal-dialog{width:600px;margin:30px auto}.modal-content{-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal-sm{width:300px}}@media (min-width:992px){.modal-lg{width:900px}}.tooltip{position:absolute;z-index:1070;display:block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:12px;font-weight:400;line-height:1.4;filter:alpha(opacity=0);opacity:0}.tooltip.in{filter:alpha(opacity=90);opacity:.9}.tooltip.top{padding:5px 0;margin-top:-3px}.tooltip.right{padding:0 5px;margin-left:3px}.tooltip.bottom{padding:5px 0;margin-top:3px}.tooltip.left{padding:0 5px;margin-left:-3px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;text-decoration:none;background-color:#000;border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-left .tooltip-arrow{right:5px;bottom:0;margin-bottom:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-right .tooltip-arrow{bottom:0;left:5px;margin-bottom:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#000}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#000}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom-left .tooltip-arrow{top:0;right:5px;margin-top:-5px;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom-right .tooltip-arrow{top:0;left:5px;margin-top:-5px;border-width:0 5px 5px;border-bottom-color:#000}.popover{position:absolute;top:0;left:0;z-index:1060;display:none;max-width:276px;padding:1px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-weight:400;line-height:1.42857143;text-align:left;white-space:normal;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #ccc;border:1px solid rgba(0,0,0,.2);border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,.2);box-shadow:0 5px 10px rgba(0,0,0,.2)}.popover.top{margin-top:-10px}.popover.right{margin-left:10px}.popover.bottom{margin-top:10px}.popover.left{margin-left:-10px}.popover-title{padding:8px 14px;margin:0;font-size:14px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}.popover-content{padding:9px 14px}.popover>.arrow,.popover>.arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.popover>.arrow{border-width:11px}.popover>.arrow:after{content:"";border-width:10px}.popover.top>.arrow{bottom:-11px;left:50%;margin-left:-11px;border-top-color:#999;border-top-color:rgba(0,0,0,.25);border-bottom-width:0}.popover.top>.arrow:after{bottom:1px;margin-left:-10px;content:" ";border-top-color:#fff;border-bottom-width:0}.popover.right>.arrow{top:50%;left:-11px;margin-top:-11px;border-right-color:#999;border-right-color:rgba(0,0,0,.25);border-left-width:0}.popover.right>.arrow:after{bottom:-10px;left:1px;content:" ";border-right-color:#fff;border-left-width:0}.popover.bottom>.arrow{top:-11px;left:50%;margin-left:-11px;border-top-width:0;border-bottom-color:#999;border-bottom-color:rgba(0,0,0,.25)}.popover.bottom>.arrow:after{top:1px;margin-left:-10px;content:" ";border-top-width:0;border-bottom-color:#fff}.popover.left>.arrow{top:50%;right:-11px;margin-top:-11px;border-right-width:0;border-left-color:#999;border-left-color:rgba(0,0,0,.25)}.popover.left>.arrow:after{right:1px;bottom:-10px;content:" ";border-right-width:0;border-left-color:#fff}.carousel{position:relative}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner>.item{position:relative;display:none;-webkit-transition:.6s ease-in-out left;-o-transition:.6s ease-in-out left;transition:.6s ease-in-out left}.carousel-inner>.item>a>img,.carousel-inner>.item>img{line-height:1}@media all and (transform-3d),(-webkit-transform-3d){.carousel-inner>.item{-webkit-transition:-webkit-transform .6s ease-in-out;-o-transition:-o-transform .6s ease-in-out;transition:transform .6s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}.carousel-inner>.item.active.right,.carousel-inner>.item.next{left:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.carousel-inner>.item.active.left,.carousel-inner>.item.prev{left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right{left:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev{display:block}.carousel-inner>.active{left:0}.carousel-inner>.next,.carousel-inner>.prev{position:absolute;top:0;width:100%}.carousel-inner>.next{left:100%}.carousel-inner>.prev{left:-100%}.carousel-inner>.next.left,.carousel-inner>.prev.right{left:0}.carousel-inner>.active.left{left:-100%}.carousel-inner>.active.right{left:100%}.carousel-control{position:absolute;top:0;bottom:0;left:0;width:15%;font-size:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6);filter:alpha(opacity=50);opacity:.5}.carousel-control.left{background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,.0001)));background-image:linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);background-repeat:repeat-x}.carousel-control.right{right:0;left:auto;background-image:-webkit-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.0001)),to(rgba(0,0,0,.5)));background-image:linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);background-repeat:repeat-x}.carousel-control:focus,.carousel-control:hover{color:#fff;text-decoration:none;filter:alpha(opacity=90);outline:0;opacity:.9}.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev{position:absolute;top:50%;z-index:5;display:inline-block}.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev{left:50%;margin-left:-10px}.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next{right:50%;margin-right:-10px}.carousel-control .icon-next,.carousel-control .icon-prev{width:20px;height:20px;margin-top:-10px;font-family:serif;line-height:1}.carousel-control .icon-prev:before{content:'\2039'}.carousel-control .icon-next:before{content:'\203a'}.carousel-indicators{position:absolute;bottom:10px;left:50%;z-index:15;width:60%;padding-left:0;margin-left:-30%;text-align:center;list-style:none}.carousel-indicators li{display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;background-color:#000 \9;background-color:rgba(0,0,0,0);border:1px solid #fff;border-radius:10px}.carousel-indicators .active{width:12px;height:12px;margin:0;background-color:#fff}.carousel-caption{position:absolute;right:15%;bottom:20px;left:15%;z-index:10;padding-top:20px;padding-bottom:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6)}.carousel-caption .btn{text-shadow:none}@media screen and (min-width:768px){.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev{width:30px;height:30px;margin-top:-15px;font-size:30px}.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev{margin-left:-15px}.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next{margin-right:-15px}.carousel-caption{right:20%;left:20%;padding-bottom:30px}.carousel-indicators{bottom:20px}}.btn-group-vertical>.btn-group:after,.btn-group-vertical>.btn-group:before,.btn-toolbar:after,.btn-toolbar:before,.clearfix:after,.clearfix:before,.container-fluid:after,.container-fluid:before,.container:after,.container:before,.dl-horizontal dd:after,.dl-horizontal dd:before,.form-horizontal .form-group:after,.form-horizontal .form-group:before,.modal-footer:after,.modal-footer:before,.nav:after,.nav:before,.navbar-collapse:after,.navbar-collapse:before,.navbar-header:after,.navbar-header:before,.navbar:after,.navbar:before,.pager:after,.pager:before,.panel-body:after,.panel-body:before,.row:after,.row:before{display:table;content:" "}.btn-group-vertical>.btn-group:after,.btn-toolbar:after,.clearfix:after,.container-fluid:after,.container:after,.dl-horizontal dd:after,.form-horizontal .form-group:after,.modal-footer:after,.nav:after,.navbar-collapse:after,.navbar-header:after,.navbar:after,.pager:after,.panel-body:after,.row:after{clear:both}.center-block{display:block;margin-right:auto;margin-left:auto}.pull-right{float:right!important}.pull-left{float:left!important}.hide{display:none!important}.show{display:block!important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none!important}.affix{position:fixed}@-ms-viewport{width:device-width}.visible-lg,.visible-md,.visible-sm,.visible-xs{display:none!important}.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block{display:none!important}@media (max-width:767px){.visible-xs{display:block!important}table.visible-xs{display:table}tr.visible-xs{display:table-row!important}td.visible-xs,th.visible-xs{display:table-cell!important}}@media (max-width:767px){.visible-xs-block{display:block!important}}@media (max-width:767px){.visible-xs-inline{display:inline!important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block!important}}@media (min-width:768px)and (max-width:991px){.visible-sm{display:block!important}table.visible-sm{display:table}tr.visible-sm{display:table-row!important}td.visible-sm,th.visible-sm{display:table-cell!important}}@media (min-width:768px)and (max-width:991px){.visible-sm-block{display:block!important}}@media (min-width:768px)and (max-width:991px){.visible-sm-inline{display:inline!important}}@media (min-width:768px)and (max-width:991px){.visible-sm-inline-block{display:inline-block!important}}@media (min-width:992px)and (max-width:1199px){.visible-md{display:block!important}table.visible-md{display:table}tr.visible-md{display:table-row!important}td.visible-md,th.visible-md{display:table-cell!important}}@media (min-width:992px)and (max-width:1199px){.visible-md-block{display:block!important}}@media (min-width:992px)and (max-width:1199px){.visible-md-inline{display:inline!important}}@media (min-width:992px)and (max-width:1199px){.visible-md-inline-block{display:inline-block!important}}@media (min-width:1200px){.visible-lg{display:block!important}table.visible-lg{display:table}tr.visible-lg{display:table-row!important}td.visible-lg,th.visible-lg{display:table-cell!important}}@media (min-width:1200px){.visible-lg-block{display:block!important}}@media (min-width:1200px){.visible-lg-inline{display:inline!important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block!important}}@media (max-width:767px){.hidden-xs{display:none!important}}@media (min-width:768px)and (max-width:991px){.hidden-sm{display:none!important}}@media (min-width:992px)and (max-width:1199px){.hidden-md{display:none!important}}@media (min-width:1200px){.hidden-lg{display:none!important}}.visible-print{display:none!important}@media print{.visible-print{display:block!important}table.visible-print{display:table}tr.visible-print{display:table-row!important}td.visible-print,th.visible-print{display:table-cell!important}}.visible-print-block{display:none!important}@media print{.visible-print-block{display:block!important}}.visible-print-inline{display:none!important}@media print{.visible-print-inline{display:inline!important}}.visible-print-inline-block{display:none!important}@media print{.visible-print-inline-block{display:inline-block!important}}@media print{.hidden-print{display:none!important}}/* CSS @ MBecker2015 */

/* Self-hosted Google Fonts (DSGVO — no external requests to Google)
--------------------------------------------------------------------------------------------------------------------- */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    font-stretch: 100%;
    font-display: swap;
    src: url('/media/fonts/open-sans-v44-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-stretch: 100%;
    font-display: swap;
    src: url('/media/fonts/open-sans-v44-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-stretch: 100%;
    font-display: swap;
    src: url('/media/fonts/open-sans-v44-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto Slab';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('/media/fonts/roboto-slab-v36-latin.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto Slab';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/media/fonts/roboto-slab-v36-latin.woff2') format('woff2');
}

/* Common
--------------------------------------------------------------------------------------------------------------------- */
html {
    overflow-x: clip;
}
body {
    overflow-x: clip;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--ba-blue-900);
}
@media (max-width: 767px) {
    body {
        font-family: sans-serif;
    }
}
p {
    line-height: 26px;
}
h1, h2, h3, h4 {
    line-height: normal;
    font-family: 'Roboto Slab';
    font-weight: 300;
    /* Deutsche Komposita ("Mitgliederversammlung" = 342px bei 30px) sind
       breiter als eine schmale Spalte und liefen sonst in die Sidebar.
       hyphens:auto trennt sauber (html lang="de"), break-word ist der
       Notnagel, wenn selbst die Silbe nicht passt. */
    -webkit-hyphens: auto;
    hyphens: auto;
    overflow-wrap: break-word;
}
h1, h1 a {
    font-size: 30px;
    font-weight: 300;
}
h1.pagetitle {
    display: block;
    margin: 0 0 50px;
    padding-bottom: 20px;
    font-size: var(--ba-text-pagetitle);
    border-bottom: 4px double var(--ba-grey-200);
}
h2, h2 a{
    font-size: 22px;
    font-weight: 300;
}
h3, h3 a {
    font-size: 20px;
    font-weight: 400;
}
h4, h4 a {
    font-size: 16px;
    font-weight: 700;
}
small {
    font-size: 14px;
}
.text-muted {
    color: var(--ba-text-subtle);
}
.dl-horizontal dt {
    text-align: left;
    white-space: normal;
    overflow: hidden;
}
.dl-horizontal dd {
    margin: 0;
    padding: 0 0 10px 180px;
}
hr {
    clear: both;
    margin: 40px 0;
    height: 3px;
    border-top: 1px solid var(--ba-grey-200);
    border-right: 0;
    border-bottom: 1px solid var(--ba-grey-200);
    border-left: 0;
}
.l-start hr {
    margin: 45px 0;
}
.badge {
    background: var(--ba-blue-500);
}
@media (max-width: 767px) {
    .dl-horizontal dd {
        padding: 0 0 10px 0 !important;
    }
    h1.pagetitle {
        margin: 0 0 20px;
    }
    .l-start hr {
        margin: 30px 0;
    }
}
.notice {
    box-shadow: 0 0 120px rgba(0, 0, 0, 1);
    left: 0;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 999;
}
.notice.alert-danger a {
    color: #a94442;
    display: block;
}
.notice.alert-error {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
.notice.alert-notice {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.notice .btn-close > span {
    position: relative;
    top: -2px;
    font-size: 26px;
    margin: 0 0 0 10px;
    vertical-align: middle;
}

/* Links + Buttons
------------------------------------ */
a:link, a:visited,
input[type="submit"].btn {
    color: var(--ba-red-600);
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
a:hover, a:focus, a:active {
    color: var(--ba-blue-600);
    text-decoration: none;
}

/* Accessibility: Focus Rings (Design #14)
--------------------------------------------------------------------------------------------------------------------- */
/* Keyboard-only focus ring: Logo-Gold, consistent across all interactive elements */
*:focus-visible {
    outline: 3px solid var(--ba-gold-500) !important;
    outline-offset: 3px !important;
    border-radius: 3px;
}
/* Buttons/inputs already have a border-radius — tighten offset */
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline-offset: 2px !important;
}

/* Default Button */
.btn-default,
.btn.btn-secondary {
    position: relative;
    overflow: hidden;
    z-index: 100;
    background: var(--ba-blue-500);
    border: 0 none;
    border-radius: 5px;
}
.btn-default {
    color: var(--ba-text-on-brand) !important;
}
.btn-default:hover,
.btn-default:focus,
.btn.btn-secondary:hover,
.btn.btn-secondary:focus,
.open > .dropdown-toggle.btn-default,
.dropdown .btn-default:hover {
    background: var(--ba-blue-600);
    color: var(--ba-text-on-brand);
}
input[type="submit"].btn {
    border: 0 none;
}

.component-event-detail .btn-green {
    background: var(--ba-green-600);
    box-shadow: 0 4px 0 #0b6200;
}

.component-event-list .btn-participate {
    border: 2px solid var(--ba-red-600) !important;
    background: var(--ba-red-600) !important;
    color: var(--ba-text-on-brand) !important;
}

.component-event-list .btn-withdraw {
    border: 2px solid var(--ba-green-600) !important;
    background: var(--ba-green-600) !important;
    color: var(--ba-text-on-brand) !important;
}

    /* Secondary Button */
.btn.btn-secondary {
    background: 0 none;
    border: 2px solid var(--ba-blue-500);
    color: var(--ba-blue-500);
}
.btn.btn-secondary:hover {
    border: 2px solid transparent;
}

/* Big Red */
.btn-primary {
    padding: 10px 60px;
    border: 0 none;
    background: var(--ba-red-600);
    box-shadow: 0 4px 0 #630200;
    font-size: 18px;
    font-weight: 300;
    color: var(--ba-text-on-brand) !important;
    text-transform: uppercase;
}
/* Lange Beschriftungen ("Mitgliedsantrag herunterladen") sprengten auf
   Handybreite die 60px-Seitenpolster plus Bootstraps white-space:nowrap --
   der Text lief abgeschnitten aus dem Button. Mobil umbrechen lassen. */
@media (max-width: 767px) {
    .btn-primary {
        max-width: 100%;
        padding-left: 24px;
        padding-right: 24px;
        white-space: normal;
    }
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    margin: 4px 0 -4px;
    background: #871514;
    box-shadow: none;
}
.sidebar .btn {
    width: 100%;
}

@media (max-width: 767px) {
    .btn {
        width: 100%;
    }
}

/* Images + Thumbnails
------------------------------------ */
.sidebar img {
    width: 100%;
    height: auto;
}
.thumbnail {
    border-radius: 4px;
    border: 0 none;
    padding: 0;
}
.img-responsive {
    border-radius: 4px;
}
.thumbnail.pull-left {
    margin: 8px 15px 15px 0;
}
.thumbnail.pull-right {
    margin: 8px 15px 0 15px;
}
.thumbnail.pull-above {
    margin: 0 0 15px;
}
.thumbnail.pull-below {
    margin: 15px 0 0;
}
.thumbnail.caption {
    margin-top: -4px;
    padding: 5px;
    border-radius: 0 0 4px 4px;
    background: var(--ba-grey-25);
}
@media (max-width: 767px) {
    .img-responsive {
        width: 100%;
        height: auto;
    }
}
@media (max-width: 650px) {
    .thumbnail.pull-left,
    .thumbnail.pull-right {
        float: none;
        margin: 8px 0 15px 0;
        width: 100%;
        height: auto;
    }
}

/* Wells
------------------------------------ */
.well {
    background: 0 none;
    border: 2px solid #ececec;
    box-shadow: none;
}
.well h2 {
    margin-top: 0;
}

/* CBox
------------------------------------ */
#cboxOverlay {
    background: -moz-linear-gradient(top, rgba(0,0,0,0.29) 0%, rgba(0,0,0,1) 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.29)), color-stop(100%,rgba(0,0,0,1))) !important;
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.29) 0%,rgba(0,0,0,1) 100%) !important;
    background: -o-linear-gradient(top, rgba(0,0,0,0.29) 0%,rgba(0,0,0,1) 100%) !important;
    background: -ms-linear-gradient(top, rgba(0,0,0,0.29) 0%,rgba(0,0,0,1) 100%) !important;
    background: linear-gradient(to bottom, rgba(0,0,0,0.29) 0%,rgba(0,0,0,1) 100%) !important;
}

/* Structure
--------------------------------------------------------------------------------------------------------------------- */
.container {
    position: relative;
}
.component,
.sidebar {
    margin-bottom: 30px;
}
.l-start {
    margin: 160px 0 0;
}
.l-content {
    position: relative;
    z-index: 2;
    background: var(--ba-white);
}
.l-footer {
    padding-top: 20px;
    background: var(--ba-white);
}
.visible-xxs {
    display: none;
}
@media (max-width: 991px) {
    .l-content {
        padding-top: 30px;
    }
}
@media (max-width: 480px) {
    .col-xxs {
        float: none;
        width: 100%;
    }
    .visible-xxs {
        display: block;
    }
}

/* Top (Logo, Navi, etc.)
--------------------------------------------------------------------------------------------------------------------- */
.navbar {
    position: fixed;
    z-index: 999;
    width: 100%;
    top: 50px;
    background: 0 none;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.navbar .navbar-collapse {
    padding: 0;
}
.navbar .container {
    position: relative;
    padding-right: 0;
    height:60px;
    background: rgba(255,255,255,0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 12px rgba(0,0,0,0.12);
    border-radius: 30px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.event-button {
    position: absolute;
    left: 120px;
    top: 14px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.affix .event-button {
    left: 80px;
    right: auto;
    top: 14px;
}
/* Affix: show calendar as compact icon-only button */
.affix .event-btn-text {
    display: none;
}
.affix .event-btn-icon {
    display: inline;
}
.affix .event-button .btn {
    padding: 6px 9px;
    line-height: 1;
}
.event-button .btn {
    background: var(--ba-red-600);
    color: var(--ba-text-on-brand);
}
.event-btn-icon {
    display: none;
}
@media (max-width: 1199px) {
    .event-button {
        left: 100px;
    }
    .affix .event-button {
        top: 14px;
        right: 244px;
    }
}
@media (max-width: 991px) {
    .event-btn-text {
        display: none;
    }
    .event-btn-icon {
        display: inline;
    }
    .event-button .btn {
        padding: 6px 9px;
        line-height: 1;
    }
}
@media (max-width: 560px) {
    .navbar-left-cluster {
        left: 70px;
    }
}

/* Logo
------------------------------------ */
.logo img {
    margin: -30px 0 0 -22px;
    width:100px;
    height: 109px;
    transform: rotate(-10deg);
    transition: all 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.logo:hover img {
    transform: rotate(0deg);
}

/* Navigation
------------------------------------ */
.navbar-nav {
    margin-right:10px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.navbar-nav > li > a {
    padding: 20px 15px;
    text-transform: uppercase;
    font-weight: 300;
    color: var(--ba-red-600);
}
.navbar-nav > li.active > a {
    color: var(--ba-blue-600);
    font-weight: bold;
}
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li > a:active {
    color: var(--ba-blue-600);
    background: 0 none;
}
#navbar li:has(> a[href$="/shop"]),
#navbar li:has(> a[href$="/shop/"]),
.mobile-mainnav li:has(> a[href$="/shop"]),
.mobile-mainnav li:has(> a[href$="/shop/"]) {
    display: none;
}
.navbar-toggle {
    margin: 0;
    padding: 12px 6px;
    color: var(--ba-black);
    line-height: 1;
}
.user-avatar-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid var(--ba-grey-700);
    color: var(--ba-text);
    background: transparent;
}
.user-avatar-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.navbar-icon-group {
    float: right;
    display: flex;
    align-items: center;
}
#navbar-cart {
    display: flex;
    align-items: center;
    padding: 18px 12px;
    color: var(--ba-black);
    line-height: 1;
    text-decoration: none;
}
#dark-mode-toggle {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    margin: 13px 2px;
    border: none;
    background: none;
    cursor: pointer;
    line-height: 1;
    color: #333;
    opacity: 0.65;
    transition: opacity 0.2s ease, color 0.2s ease;
}
#dark-mode-toggle:hover {
    opacity: 1;
    background: none;
}
#dark-mode-toggle svg {
    width: 24px;
    height: 24px;
    display: block;
}
#navbar-cart:hover {
    opacity: 0.7;
}

/* Login
------------------------------------ */
.navbar .login {
    margin-right: 15px;
}
.navbar .login > .btn {
    border-radius: 4px 20px 20px 4px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.navbar .dropdown {
    margin-top: 15px;
}
.navbar .dropdown-menu {
    top: 60px;
    min-width: 200px;
}
.navbar .dropdown-menu .arrow {
    height: auto;
    position: absolute;
    right: 20px;
    top: -7px;
    width: 16px;
}
.navbar .dropdown form {
    position: inherit;
    width: 200px;
}
.navbar .dropdown .form-group {
    margin: 5px 10px 10px;
}
.navbar .dropdown ul .form-group a {
    margin-top: 5px;
    padding: 0;
    font-size: 12px;
}
.navbar .dropdown-menu .btn {
    width: 90%;
}
@media (max-width: 991px) {
    .navbar .login {
        float: none;
        width: 100%;
        margin: 0;
    }
    .navbar .dropdown-toggle,
    .navbar .arrow {
        display: none;
    }
    .navbar .dropdown form {
        width: 100%;
    }
    .navbar .dropdown-menu {
        display: block;
        position: relative;
        margin: 0;
        padding: 0;
        width: 100%;
        border: 0 none;
        border-radius: 0;
        top: 0;
        left: 0;
        box-shadow: none;
        background: 0 none;
    }
    .navbar .dropdown .form-group {
        margin: 5px 0 10px;
    }
}

/* Login - User logged in
------------------------------------ */
.navbar .dropdown.user {
    margin: 0;
}
.navbar .user .dropdown-menu {
    top: 75px;
}
.navbar .dropdown.user button {
    border-radius: 50%;
    width: 60px;
    height: 60px;
    border: 2px solid var(--ba-blue-500);
    background-image: url("/media/images/default/no-biker-image.svg");
    background-repeat: no-repeat ;
    background-position: center center;
    background-size: cover;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.navbar .dropdown.user button:hover {
    opacity: 0.8;
}
.navbar .dropdown ul a,
.navbar .dropdown ul span {
    display: block;
    padding: 5px 10px;
}
.navbar .dropdown ul .btn {
    color: var(--ba-text-on-brand);
    margin: 5px 10px;
}
@media (max-width: 991px) {
    .navbar .user {
        float: none;
        width: 100%;
        margin: 0;
    }
    .navbar .user .dropdown-menu {
        border-top: 1px solid var(--ba-grey-200);
        font-weight: bold;
        margin-top: 5px;
        padding: 5px 15px 10px;
        top: 0;
    }
    .navbar .user .dropdown-menu .btn {
        width: 100% !important;
        margin: 4px 0 !important;
    }
}

/* Search
------------------------------------ */
.navbar form {
    position: absolute;
    top: -43px;
    right: 0;
    width: 300px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.navbar form button {
    position: absolute;
    height: 34px;
    width: 34px;
    top: 0;
    right: 10px;
    border: 0 none;
    background: 0 none;
}
.navbar form button:hover {
    background: var(--ba-grey-50);
}
.navbar form button img {
    width: 16px;
}

/* Search toggle — collapsed by default on all screen sizes */
.navbar form.search:not(.search-open) {
    width: 44px;
    overflow: hidden;
}
.navbar form.search.search-open {
    width: 430px;
    overflow: visible;
    z-index: 10;
}
.navbar form.search:not(.search-open) .form-control {
    opacity: 0;
    pointer-events: none;
}
.navbar form.search .form-control {
    transition: opacity 200ms ease;
}
/* Desktop: eigener weisser Grund, weil das aufgeklappte Feld links ueber
   die Hauptnavigation laeuft. 290px in beiden Scroll-Zustaenden - die
   Suche sitzt jetzt immer in der Leiste, nicht mehr im Streifen darueber. */
@media (min-width: 992px) {
    .navbar form.search.search-open {
        width: 290px;
        background: var(--ba-white);
        border-radius: 20px;
        box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    }
}
/* Tablet/mobile open widths (form sits inside the white container) */
@media (max-width: 991px) {
    .navbar form.search.search-open {
        width: 220px;
    }
}
@media (max-width: 480px) {
    .navbar form.search.search-open {
        width: 160px;
    }
}

/* Flags
   Nur noch kosmetische Basis-Styles: die Positionierung (Desktop-Zeile ab
   1200px, md-Streifen 992-1199px) steht gesammelt im Block "Utility-Icons"
   weiter unten; auf Mobile uebernimmt .navbar-left-cluster.
------------------------------------ */
.lang {
    display: flex;
    align-items: center;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
/* Trigger: aktives Kuerzel + Chevron (UCI-Pattern), 34px-Box wie die
   uebrigen Utility-Icons. Ueberschreibt die .navbar .dropdown-Regeln,
   die fuers Login gedacht sind (margin-top 15px, Menue top 60px). */
.navbar .lang.dropdown {
    margin-top: 0;
}
.lang-toggle {
    display: flex;
    align-items: center;
    gap: 3px;
    height: 34px;
    padding: 5px 8px;
    border: none;
    background: none;
    cursor: pointer;
    line-height: 1;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    opacity: 0.75;
    transition: opacity 0.2s ease, color 0.2s ease;
}
.lang-toggle:hover,
.lang.open .lang-toggle {
    opacity: 1;
}
.lang-chevron {
    width: 12px;
    height: 12px;
}
.navbar .lang .dropdown-menu {
    top: 100%;
    left: auto;
    right: 0;
    min-width: 0;
    margin: 2px 0 0;
    padding: 4px;
    border-radius: 8px;
}
/* .navbar davor noetig: .navbar .dropdown ul a (Login-Dropdown) hat sonst
   die hoehere Spezifitaet und erzwingt display:block. */
.navbar .lang .dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    white-space: nowrap;
    line-height: 1.2;
}
.navbar .lang .dropdown-menu img {
    width: 24px;
    height: 14px;
    display: block;
    border-radius: 2px;
}
/* Mobil macht die Login-Regel (.navbar .dropdown-menu: display block,
   position relative, ohne Rahmen) jedes Navbar-Dropdown dauerhaft auf -
   fuer das Sprachmenue hier zurueckdrehen: zu bis .open, klappt absolut
   unter dem Trigger aus. */
@media (max-width: 991px) {
    .navbar .lang .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: auto;
        width: auto;
        margin: 2px 0 0;
        padding: 4px;
        background: var(--ba-white);
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 8px;
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    }
    .navbar .lang.open .dropdown-menu {
        display: block;
    }
}

/* Affix
------------------------------------ */
.navbar.affix {
    top: -1px;
}
.navbar.affix .container {
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius: 0 0 30px 4px;
}
.navbar.affix .logo img {
    margin: 0 0 0 -5px;
    width: 50px;
    height: 50px;
    transform: none;
}
.navbar.affix .dropdown.user button {
    border-radius: 50% 0 50% 50%
}
.navbar.affix .login > .btn {
    border-radius: 4px 0 20px 4px;
}

/* Mobile Navigation
------------------------------------ */
@media (max-width: 1199px) {
    /* Bootstrap-md (992-1199px): Container ist nur 970px breit. Logo + Menue
       + reservierter Rechtsrand + Login muessen in EINE Zeile passen, sonst
       bricht die float-right .navbar-collapse um und das Menue malt aus der
       60px hohen Pill heraus ueber den Seiteninhalt. */
    /* Platzhalter: Die md-Regeln fuer Nav-Rand und Paddings stehen
       zustandsunabhaengig im Block "Utility-Icons" weiter unten. */
}

/* Utility-Icons (Suche, Sprache, Dark Mode, Cart) - Desktop
   Ab 992px sitzt die komplette Icon-Reihe rechts in der Navbar-Zeile neben
   dem Login, in BEIDEN Scroll-Zustaenden an identischer Position - nichts
   springt beim Scrollen, und der Streifen ueber der Leiste bleibt auf
   Desktop leer:
   [Sprache 234] [Suche 184] [Mond 140] [Cart 96] [Login] - je 6px Abstand
   Die Sprache steht bewusst LINKS aussen: sie erscheint nur auf Start,
   /racing und der EN-Seite. Stuende sie mittendrin, klaffte ueberall sonst
   eine Luecke im Cluster - so beginnt die Reihe dort einfach weiter rechts.
   Alle Boxen sind 34px hoch und stehen auf top 14px, also mittig in der
   60px hohen Pill - dadurch fluchten die optischen Mitten exakt.
--------------------------------------------------------------------------- */
@media (min-width: 992px) {
    .lang {
        position: absolute;
        height: 34px;
        margin: 0;
        top: 14px;
        right: 234px;
    }
    #dark-mode-toggle,
    #navbar-cart {
        position: absolute;
        float: none;
        margin: 0;
        padding: 5px 7px;
        top: 14px;
    }
    #dark-mode-toggle {
        right: 140px;
    }
    #navbar-cart {
        right: 96px;
    }
    /* Kein width hier: die Suche ist per Default eingeklappt (44px) und nur
       .search-open zieht sie auf. Ein festes width haette den zugeklappten
       Zustand auf 190px totes Feld aufgeblasen. */
    .navbar form.search {
        top: 14px;
        right: 184px;
    }
    /* Der Event-Button zeigt auf Desktop durchgaengig nur sein
       Kalender-Icon - im Affix-Zustand und unter 992px tat er das ohnehin
       schon. Mit ausgeschriebenem "Biketreffs & Termine" passen Button,
       sieben Nav-Items, Icon-Reihe und Login nicht nebeneinander, dann
       waechst die rechts gefloatete Nav nach links unter den Button und
       verdeckt HOME. So bleibt die Nav bei ihren Basis-Paddings. */
    .event-btn-text {
        display: none;
    }
    .event-btn-icon {
        display: inline;
    }
    .event-button .btn {
        padding: 6px 9px;
        line-height: 1;
    }
    /* Nur die Hauptnavigation in #navbar: die mobile Scroll-Leiste
       (.mobile-mainnav .navbar-nav) haette den Rechtsrand sonst als toten
       Scrollweg mitgeschleppt. */
    .navbar #navbar .navbar-nav {
        margin-right: 215px;
        margin-left: 30px;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    /* Bootstrap-md: Container nur 970px statt 1170px - hier reicht es
       trotz Icon-Button nicht fuer die Basis-Paddings. */
    .navbar #navbar .navbar-nav {
        margin-right: 209px;
        margin-left: 20px;
    }
    .navbar #navbar .navbar-nav > li > a {
        padding-left: 5px;
        padding-right: 5px;
        font-size: 13px;
    }
}
@media (max-width: 991px) {
    .navbar {
        top: -1px;
    }
    .navbar .container,
    .navbar.affix .container{
        padding: inherit;
        height: auto;
        min-height: 60px;
        /* Randlos wie die Subnav darunter: Bootstraps .container ist ab 768px
           auf 750px fixiert und zentriert - dann lief der Seiteninhalt links
           und rechts neben der Leiste durch, waehrend die Subnav ueber die
           volle Breite ging. */
        width: 100%;
        max-width: none;
        /* Oben gerade: die Leiste klebt auf Mobile immer am Viewport-Rand
           (top:-1px), da ist keine Luft zum Runden - die Oberecken waren nur
           Kerben, in denen der Hintergrund durchblitzte. Desktop macht es im
           Affix-Zustand genauso. Die Rundung traegt die Unterkante. */
        border-radius: 0 0 30px 30px;
    }
    .navbar form {
        right: -10px;
    }
    .navbar form,
    .navbar-toggle {
        margin-right: 10px;
    }
    /* lang position handled by .navbar-left-cluster on mobile */
    .logo {
        margin-left: 10px;
    }
    .navbar .logo img,
    .navbar.affix .logo img {
        margin: 0 0 0 10px !important;
        width: 50px;
        height: 55px;
        transform: none;
    }
    .navbar-collapse {
        float: none !important;
        margin: 0 !important;
        padding: 20px !important;
        width: 100% !important;
        background: rgba(255,255,255,0.88);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
        border-radius: 0 0 4px 4px;
        overflow-x: hidden;
    }
    .navbar-nav > li ul {
        display: none;
    }
    .navbar-nav > li.active ul {
        display: block;
        margin: 0 0 0 15px;
        padding: 0 0 0 20px;
        border-left: 2px solid var(--ba-blue-500);
    }
    .navbar-nav > li.active ul li {
        list-style: none;
        padding: 5px 0;
    }
    .navbar-nav > li.active ul li a {
        font-weight: 300;
    }
    .navbar-nav > li.active ul li.active a {
        color: var(--ba-link);
    }
    .navbar form.search,
    .navbar.affix form.search {
        top: 14px;
        right: 140px;
    }
}
/* Mobile/tablet: calendar icon + flags as one flex group after logo */
@media (max-width: 991px) {
    .navbar-left-cluster {
        position: absolute;
        left: 80px;
        top: 14px;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .navbar-left-cluster .event-button,
    .navbar-left-cluster .lang {
        position: static;
        top: auto;
        left: auto;
        right: auto;
    }
}
@media (max-width: 767px) {
    .navbar {
        position: fixed;
    }
    .navbar .container,
    .navbar.affix .container{
        border-radius: 0 0 30px 30px;
        padding-left: 14px;
        padding-right: 14px;
    }
    .navbar form {
        top: 14px;
        right: 140px;
        width: 165px;
    }
}
@media (max-width: 480px) {
    .navbar form {
        width: 105px;
    }
    .navbar form button {
        height: 32px;
        right: 5px;
        top: 1px;
        width: 34px;
    }
}
/* Scroll-aware navbar (mobile/tablet)
--------------------------------------------------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .navbar {
        transition: transform 0.3s ease;
    }
    .navbar-scroll-hidden .navbar {
        transform: translateY(-100%);
    }
    /* Freeze container appearance in non-affix state on mobile */
    .navbar.affix .container {
        background: rgba(255,255,255,0.75);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }
    /* Prevent affix margin from indenting mobile nav pills */
    .navbar.affix .mobile-mainnav .navbar-nav {
        margin-left: 0;
        margin-right: 0;
    }
}
.mobile-subnav-wrap {
    transition: top 0.3s ease;
}
.navbar-scroll-hidden .mobile-subnav-wrap {
    top: 0;
}

/* Bootstrap Navigation Breakpoint override
--------------------------------------------------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .l-start .l-content.start {
        margin-top: 0;
    }
    .navbar-header {
        float: none;
    }
    .navbar form, .navbar-toggle {
        margin-right: 0;
    }
    .navbar-toggle {
        display: flex;
        align-items: center;
        margin-right: 5px;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-nav {
        float: none!important;
    }
    .navbar-nav > li {
        float: none;
    }
    .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

/* Navigation Sidebar
--------------------------------------------------------------------------------------------------------------------- */
.sidebar .nav {
    margin-bottom: 50px;
}
.sidebar .nav:empty {
    margin-bottom: 0;
}
.sidebar .nav ul {
    padding: 0;
}
.sidebar .nav li {
    list-style: none;
    border-bottom: 1px solid #d6d6d6;
}
.sidebar .nav li:last-child {
    border-bottom: 0;
}
.sidebar .nav li a {
    display: block;
    margin: 5px 0;
    padding: 5px 0;
}
.sidebar .nav li.active a {
    color: var(--ba-blue-600);
}
.sidebar .nav li a:hover {
    background: 0 none;
}
.sidebar .nav li a:hover,
.sidebar .nav li a:focus,
.sidebar .nav li a:active {
    color: var(--ba-blue-600);
    background: 0 none;
}

/* Footer
--------------------------------------------------------------------------------------------------------------------- */
.l-footer {
    position: relative;
    z-index: 1;
}
footer {
    position: relative;
    padding: 25px 0;
    height: 110px;
    background: var(--ba-blue-900);
    color: var(--ba-blue-300);
}
footer .nav {
    margin-bottom: 10px;
    text-align: right;
}
footer .nav li {
    display: inline-block;
}
footer .nav li a {
    padding:0 15px;
    border-right:1px solid #85add0;
    line-height: 14px;
    color: var(--ba-text-on-brand);
}
footer .nav li:last-child a {
    border: 0 none;
}
footer .nav li a:hover,
footer .nav li a:focus,
footer .nav li a:active {
    color: var(--ba-blue-300);
    background: 0 none;
}
footer p.text-right {
    margin-right: 15px;
}
footer .social input {
    display: inline-block;
    vertical-align: top;
    width: auto;
}
footer .social input[type="email"] {
    border-radius: 4px 0 0 4px;
    margin-right: -5px;
}
footer .social input[type="submit"] {
    padding: 7px 12px;
    border-radius: 0 4px 4px 0;
}
footer .social .newsletter {
    display: inline-block;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 15px;
    padding-right: 15px;
    height: 34px;
}
footer .social a {
    margin-right: 5px;
}
footer .social img {
    width: 24px;
    height: auto;
    margin-top: -5px;
}
@media (max-width: 1199px) {
    footer {
        height: auto;
    }
    footer .social .newsletter {
        display: block;
        margin-bottom: 10px;
    }
}
@media (max-width: 991px) {
    footer .social .newsletter input {
        width: 50%;
    }
}
@media (max-width: 767px) {
    footer .social,
    footer .nav,
    footer p.text-right {
        width: 100%;
        text-align: center;
    }
    footer .social .newsletter {
        margin: 0 0 20px 0;
        padding: 0;
        height: auto;
    }
    footer .social .newsletter input {
        width: 100%;
        border-radius: 4px;
        margin: 0;
    }
    footer .nav {
        margin: 15px 0;
        padding: 15px 0;
        border-top: 1px solid var(--ba-blue-300);
    }
    footer .social a {
        margin: 10px;
    }
    footer .nav li {
        display: block;
        margin: 20px 0;
    }
    footer .nav li a {
        border: 0 none;
    }
}

/* Standard Components
--------------------------------------------------------------------------------------------------------------------- */
/* Text
------------------------------------ */
.sidebar .component-text img {
    width: 100%;
    height: auto;
}

/* Suche
------------------------------------ */
.component-search .btn,
.component-fulltext-simple .btn{
    width: 100%;
}
.results.list-unstyled > li {
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

/* Pagination
------------------------------------ */
.pager .btn {
    width: auto;
}
.pager .disabled .btn {
    border-color: var(--ba-border);
}
.pager li > a, .pager li > span {
    border: 0 none;
    border-radius: 4px;
}
.pager li span {
    padding: 5px 14px;
    border: 2px solid var(--ba-grey-200);
    color: var(--ba-text-subtle);
    font-size: 14px;
}
.pager i {
    font-style: normal;
}
@media (max-width: 480px) {
    .pager li {
        display: table-cell;
        vertical-align: middle;
        width: 1%;
    }
    .pager li span {
        font-size: 13px;
        padding: 5px;
    }
    .pager i {
        display: none;
    }
}


/* Standard Gallery
------------------------------------ */
.flexslider .slides img {
    height: auto;
}
.flex-caption {
    padding: 9px;
    color: var(--ba-grey-500);
    font-size: 14px;
}
.flex-direction-nav a {
    top: 50% !important;
}

/* Downloads
------------------------------------ */
.component-common-download-preview img {
    width: 100px;
    height: auto;
    margin: 0 15px 20px 0;
}

/* Address
------------------------------------ */
.map-badge {
    border-radius: 5px;
}
.map-badge.thumbnail.show {
    height: 250px;
    border-radius: 5px;
}

/* Contact-Person
------------------------------------ */
.sidebar .component-contact .thumbnail {
    margin: 8px 0;
}

/* Jumbotron
--------------------------------------------------------------------------------------------------------------------- */
.component-jumbotron,
.component-jumbotron .image {
    /*padding: 0 0 35%;*/
    height: 545px;
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.component-jumbotron {
    position: relative;
    overflow: hidden;
    z-index: 1;
    /* #11 — Ambient Mesh Gradient Fallback (shows when no hero image is set) */
    background-image:
        radial-gradient(ellipse at 20% 50%, rgba(71, 137, 190, 0.9) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 20%, rgba(106, 168, 212, 0.7) 0%, transparent 55%),
        radial-gradient(ellipse at 60% 80%, rgba(10, 58, 92, 0.85) 0%, transparent 50%),
        radial-gradient(ellipse at 40% 10%, rgba(29, 92, 142, 0.75) 0%, transparent 45%);
    background-color: #0e4272;
    background-size: 250% 250%, 250% 250%, 250% 250%, 250% 250%;
    background-position: 0% 50%, 100% 0%, 50% 100%, 0% 0%;
}
/* Der Gradient ist nur der Fallback: liegt ein Hero-Bild an, deckt .image ihn
   vollflaechig ab (position: fixed, background-size: cover). Die Animation lief
   trotzdem endlos weiter und hat background-position auf einem 545 px hohen
   Vollbreiten-Element neu gemalt — unsichtbar, nicht GPU-kompositierbar, und
   die Seite kam nie zur Ruhe (WebPageTest visualComplete 4200 ms bei
   fullyLoaded 1249 ms). Deshalb nur noch dort, wo man sie sieht. */
.component-jumbotron:not(.has-hero) {
    animation: heroMeshShift 14s ease infinite;
}
@keyframes heroMeshShift {
    0%   { background-position: 0% 50%,   100% 0%,   50% 100%, 0% 0%; }
    25%  { background-position: 50% 0%,   0% 100%,  100% 50%, 100% 100%; }
    50%  { background-position: 100% 50%, 50% 0%,    0% 0%,   50% 50%; }
    75%  { background-position: 50% 100%, 100% 50%, 50% 0%,    0% 100%; }
    100% { background-position: 0% 50%,   100% 0%,  50% 100%, 0% 0%; }
}
@media (prefers-reduced-motion: reduce) {
    /* Selektor muss die Spezifitaet von .component-jumbotron:not(.has-hero) erreichen,
       sonst gewinnt die Animation gegen den Abschalter. */
    .component-jumbotron:not(.has-hero) { animation: none; }
}
.l-start .component-jumbotron {
    margin: -160px 0 0;
}
.component-jumbotron .image {
    position: fixed;
    width: 100%;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
/* Das Hero-Bild ist jetzt ein <img> statt eines CSS-Hintergrunds (srcset,
   fetchpriority, Auffindbarkeit im HTML). object-fit bildet background-size:
   cover / background-position: center nach. Descendant-Selektor, nicht ">",
   weil render_attachment das Bild in einen <a> packt, wenn am Attachment ein
   Link haengt. */
.component-jumbotron .image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
img.rounding {
    position: absolute;
    width: 110%;
    bottom: -1px;
    left: -5%;
    right: 0;
}
@media (max-width: 991px) {
    .component-jumbotron,
    .component-jumbotron .image {
        height: 450px;
    }
}
@media (max-width: 767px) {
    .component-jumbotron,
    .component-jumbotron .image {
        height: 380px;
    }
}

/* Jumbotron for pages with small header e.g. article-detail (fultext_small_header.tpl)
--------------------------------------------------------------------------------------------------------------------- */
.small-header,
.big-header {
    position: relative;
    min-height: 240px;
    background-image:
        radial-gradient(ellipse at 20% 50%, rgba(71, 137, 190, 0.9) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 20%, rgba(106, 168, 212, 0.7) 0%, transparent 55%),
        radial-gradient(ellipse at 60% 80%, rgba(10, 58, 92, 0.85) 0%, transparent 50%),
        radial-gradient(ellipse at 40% 10%, rgba(29, 92, 142, 0.75) 0%, transparent 45%);
    background-color: #0e4272;
    background-size: 250% 250%, 250% 250%, 250% 250%, 250% 250%;
    background-position: 0% 50%, 100% 0%, 50% 100%, 0% 0%;
    animation: heroMeshShift 14s ease infinite;
}
@media (prefers-reduced-motion: reduce) {
    .small-header, .big-header { animation: none; }
}
.small-header .component-jumbotron,
.small-header .component-jumbotron .image {
    height: 260px;
}
@media (max-width: 991px) {
    .small-header .component-jumbotron,
    .small-header .component-jumbotron .image  {
        height: 200px;
    }
}
@media (max-width: 767px) {
    .small-header .component-jumbotron,
    .small-header .component-jumbotron .image  {
        height: 230px;
    }
}


/* New Biker Welcome
--------------------------------------------------------------------------------------------------------------------- */
.component-welcome {
    position: relative;
    z-index: 1;
    margin: -575px 0 0;
    padding: 0;
    height: 940px;
    width:100%;
    background: var(--ba-blue-500) url("/media/images/default/bg-welcome.jpg") no-repeat center center;
    background-size: cover;
    color: var(--ba-text-on-brand);
}
.component-welcome .content {
    position: relative;
    margin: 200px 0 15px;
    padding-bottom: 50px;
    width: 60%;
    border: 0 none;
    background: rgba(255,255,255,0);
    text-shadow: 0 1px 1px rgba(0,0,0,0.7);
}
.component-welcome .scroll {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 125px;
    width: 57px;
    height: 24px;
    background: url("/media/images/default/arrow-down.png") no-repeat center center;
    transition: all 300ms ease-in-out;
}
.component-welcome .scroll.affix {
    opacity: 0;
    transform: translateY(50px);
}
.component-welcome h1 {
    margin-top: 0;
    font-size: var(--ba-text-hero);
    -webkit-animation: welcome 2s;
    animation: welcome 2s;
}
.component-welcome p {
    -webkit-animation: welcome 2.5s;
    animation: welcome 2.5s;
}
.component-welcome h3,
.component-welcome ul {
    -webkit-animation: welcome 3s;
    animation: welcome 3s;
}
.component-welcome a.btn {
    display: inline-block;
    width: auto;
    -webkit-animation: welcome 3.8s;
    animation: welcome 3.8s;
}
@-webkit-keyframes welcome {
    0% {opacity: 0; -webkit-transform:scale(0.8) translate(0, 100px);}
    30% {opacity: 0; -webkit-transform:scale(3);}
    50% {-webkit-transform:scale(0.9);}
    100% {opacity: 1; -webkit-transform:scale(1) translate(0, 0);}
}
@keyframes welcome {
    0% {opacity: 0; transform:scale(0.8) translate(0, 100px);}
    30% {opacity: 0; transform:scale(3);}
    50% {transform:scale(0.9);}
    100% {opacity: 1; transform:scale(1) translate(0, 0);}
}
@-webkit-keyframes welcome-button {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes welcome-button {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
.component-welcome .mask {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top:0;
    left: 0;
    background: var(--ba-blue-900);
    opacity: 0.2;
}
.component-welcome li {
    display: inline-block;
    position: relative;
    vertical-align: top;
    padding: 0 0 10px 30px;
    width: 100%;
}
.component-welcome li img {
    position: absolute;
    margin: 0 5px 5px 0;
    left: 0;
    width: 20px;
}
.component-welcome .content .btn-primary {
    position: relative;
    margin-right: 15px;
    bottom: 0;
    left: 0;
    font-weight: 400;
    width: auto;
}
.component-welcome .btn-secondary {
    padding: 10px;
    color: var(--ba-text-on-brand);
    background: var(--ba-blue-500);
}
@media (max-width: 1199px) {
    .component-welcome .scroll {
        display: none;
    }
}
@media (max-width: 991px) {
    .component-welcome {
        padding: 0;
    }
    .component-welcome .content {
        margin: 290px 0;
        width: 100%;
    }
}
@media (max-width: 767px) {
    .component-welcome {
        height: auto;
    }
    .component-welcome .content {
        margin: 210px 0 50px;
        padding-top: 220px;
    }
}
@media (max-width: 500px) {
    .component-welcome a.btn {
        width: 100% !important;
        margin-bottom: 15px;
        white-space: normal;
    }
}

/* Article Component
--------------------------------------------------------------------------------------------------------------------- */
/* ===================================================================
   Archiv: Jahres-Filter (2026-08-29)
   Dropdown ueber der Artikelliste, siehe
   views/frontend/component/article/multi/archive.tpl
   =================================================================== */
.component-article-archive .archive-year-filter {
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--ba-border);
}
.component-article-archive .archive-year-filter label {
    margin-right: 8px;
    margin-bottom: 0;
    font-weight: normal;
    color: var(--ba-text-muted);
}
.component-article-archive .archive-year-filter select {
    display: inline-block;
    width: auto;
    min-width: 140px;
}
.component-article-archive .archive-year-filter-noscript {
    margin-bottom: 24px;
    line-height: 2;
}

/* Article Teasers (Startpage)
------------------------------------ */
.component-article-archive .highlight small {
    display: block;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--ba-grey-200);
}
.component-article-archive .articles {
    position: relative;
    margin-bottom: 20px;
    height: 360px;
}
.component-article-archive .item {
    position: relative;
    margin-bottom: 30px;
    padding: 0 10px;
}
.component-article-archive .item .flag {
    position: absolute;
    z-index: 1;
    top: 242px;
    left: 10px;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.component-article-archive .teaser-image {
    position: relative;
    height: 250px;
    border-radius: 4px;
    background-size: cover;
    background-position: center center;
    background-color: var(--ba-grey-50);
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.component-article-archive .image {
    position: relative;
    overflow: hidden;
    margin-bottom: 15px;
}
.component-article-archive .item h2 {
    position: relative;
    z-index: 0;
    height: 80px;
    margin: 0;
    padding: 10px;
    overflow: hidden;
    top: -15px;
    border-radius: 0 0 4px 4px;
    background: #ecf3f9;
    line-height: 28px;
}
.component-article-archive .item h2 a {
    font-size: 20px;
    color: var(--ba-blue-900);
}
.component-article-archive .item h2 img {
    position: absolute;
    right: 0;
    bottom: 0;
}
.component-article-archive .item:hover .teaser-image {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
}
.component-article-archive .item a small {
    position: absolute;
    padding: 3px 5px;
    border-radius: 0 4px 0 0;
    bottom: 0;
    left: 0;
    background: var(--ba-blue-500);
    color: var(--ba-text-on-brand);
}
.component-article-archive .teaser {
    display: none;
}
@media (min-width: 992px) and (max-width: 1199px) {
    .component-article-archive .teaser-image {
        height: 200px;
    }
    .component-article-archive .item .flag {
        top: 192px;
    }
}
@media (max-width: 991px) {
    .component-article-archive .highlight img {
        width: 100%;
        height: auto;
    }
}
@media (max-width: 767px) {
    .component-article-archive .highlight a {
        display: block;
        position: relative;
    }
    .component-article-archive .highlight img {
        border-radius: 5px 5px 0 0;
        border-bottom: 4px solid var(--ba-blue-500);
    }
    .component-article-archive .highlight .flag {
        width: 20px;
        height: 20px;
    }
    .component-article-archive .highlight .flag img {
        margin: -13px 0 0 0;
        border: 0 none;
    }
}

/* Article Teaser Subpage
------------------------------------*/
@media (min-width: 992px) {
    .l-sub .component-article-archive .col-md-4 {
        width: 50%;
    }
}
.l-sub .component-article-archive .teaser {
    display: none;
}
.l-sub .component-article-archive .teaser-image {
    height: 200px;
    width: 100%;
}
.l-sub .component-article-archive .item .flag {
    top: 192px;
}

/* Spotify-style Mobile Article Layout (Homepage xs/sm only)
--------------------------------------------------------------------------------------------------------------------- */
.l-start .spotify-layout {
}
.l-start .spotify-section {
    margin-bottom: 28px;
    padding-bottom: 4px;
    border-bottom: 1px solid #ebebeb;
}
.l-start .spotify-section:last-child {
    border-bottom: none;
}
.l-start .spotify-section-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 0 8px;
}
.l-start .spotify-section-title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--ba-blue-900);
}
.l-start .spotify-section-more {
    font-size: 13px;
    color: var(--ba-blue-500);
    white-space: nowrap;
    flex-shrink: 0;
}
.l-start .spotify-row {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding: 0 0 12px;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-mask-image: linear-gradient(to right, black calc(100% - 48px), transparent 100%);
    mask-image: linear-gradient(to right, black calc(100% - 48px), transparent 100%);
}
.l-start .spotify-row.scrolled-end {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 48px);
    mask-image: linear-gradient(to right, transparent 0%, black 48px);
}
.l-start .spotify-row.no-overflow {
    -webkit-mask-image: none;
    mask-image: none;
}
.l-start .spotify-row::-webkit-scrollbar {
    display: none;
}
/* Scrollleiste nur am Zeigergeraet (2026-08-29).
   Zieht jemand ein Desktop-Fenster auf Mobilbreite, greift das
   Spotify-Layout -- dort sahen die Reihen ohne sichtbare Leiste
   abgeschnitten aus, weil macOS Overlay-Scrollbars benutzt und der
   Mask-Fade allein als Hinweis nicht reicht. Optik wie beim
   "Live on the road"-Karussell (.social-strip--sidewinder).
   Am echten Touchgeraet bleibt es ohne Leiste: dort ist Wischen die
   erwartete Geste, und hover/pointer trennt das zuverlaessiger als
   eine Breitenabfrage -- ein schmales Desktop-Fenster und ein Handy
   sind gleich breit, aber nicht gleich bedienbar. */
@media (hover: hover) and (pointer: fine) {
    .l-start .spotify-row {
        scrollbar-width: thin;
        scrollbar-color: var(--ba-grey-300) transparent;
    }
    .l-start .spotify-row::-webkit-scrollbar {
        display: block;
        height: 6px;
    }
    .l-start .spotify-row::-webkit-scrollbar-thumb {
        background: var(--ba-grey-300);
        border-radius: 3px;
    }
}
.l-start .spotify-card {
    display: flex;
    flex-direction: column;
    flex: 0 0 calc(50% - 21px);
    max-width: calc(50% - 21px);
    scroll-snap-align: start;
    text-decoration: none;
    color: inherit;
}
.l-start .spotify-card:hover,
.l-start .spotify-card:focus {
    text-decoration: none;
    color: inherit;
    opacity: 0.85;
}
.l-start .spotify-card-image {
    width: 100%;
    aspect-ratio: 3 / 4;
    border-radius: 8px;
    background-color: var(--ba-grey-100);
    margin-bottom: 8px;
    overflow: hidden;
}
.l-start .spotify-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.l-start .spotify-card-placeholder {
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.l-start .spotify-card-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--ba-blue-900);
    line-height: 1.35;
    padding: 0 2px;
}
.l-start .spotify-card-date {
    font-size: 11px;
    color: var(--ba-grey-500);
    padding: 3px 2px 0;
}

/* Article Archive
------------------------------------ */
.component-article-archive h2,
.component-standard-article-archive h2 {
    margin-top: 0;
}
.component-article-archive .item,
.component-standard-article-archive .item {
    margin-bottom: 50px;
}
@media (max-width: 480px) {
    .component-article-archive .item img,
    .component-standard-article-archive .item img {
        margin-bottom: 15px;
    }
    .component-standard-article-archive a {
        display: block;
        position: relative;
    }
    .component-standard-article-archive a img {
        border-bottom: 4px solid var(--ba-blue-500);
        border-radius: 5px 5px 0 0;
    }
    .component-standard-article-archive a .flag {
        position: absolute;
        left: -2.5px;
        bottom: -30px;
    }
    .component-standard-article-archive a .flag img {
        border: 0 none;
    }
}

/* Article Detail
------------------------------------ */
.component-article-show h1 {
    display: block;
    margin: 0 0 35px;
    padding-bottom: 30px;
    border-bottom: 4px double var(--ba-grey-200);
    font-size: 35px;
}
.component-article-show .image-container {
    position: relative;
    display: block;
    overflow: hidden;
    margin-bottom: 40px;
    height: 370px;
    border-radius: 4px;
}
.component-article-show .image-container img {
    width: 100%;
    height: auto;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.component-article-show .image-container img:hover {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
}
.component-article-show .gallery-container .btn {
    display: block;
    position: relative;
    z-index: 1;
    margin: -55px auto 40px;
    max-width: 220px;
}
@media (max-width: 767px) {
    .component-article-show .image-container {
        height: auto;
    }
}

/* Account
--------------------------------------------------------------------------------------------------------------------- */
/* Forms
------------------------------------ */
.component-form .form-group {
    display: inline-block;
    position: relative;
    width: 49%;
    vertical-align: top;
}
.btn-info {
    position: absolute;
    z-index: 9999;
    top: 0;
    right: 20px;
}
.sidebar .form-group {
    width: 100%;
}
.component-form .form-group .control-group {
    width: 100%;
}
.submit-area .control-group {
    width: 100%;
}
.component-form .membership .control-group {
    width: 100%;
}
.formo-radios.control-group {
    width: 100%;
}
label.radio {
    margin-left: 20px;
}
.form-group .wide {
    width: 66%;
    display: inline-block;
}
.form-group .small {
    display: inline-block;
    width: 30%;
}

/* Password forgotten
------------------------------------ */
.component-account-password-forgotten .btn {
    margin-top: 30px;
}

/* Overview
------------------------------------ */
.component-account-overview dt {
    width: 250px;
    text-align: left;
}
.component-account-overview .btn-primary {
    width: 100%;
}
.component-account-overview .guest .btn {
    padding: 10px;
    width: 100%;
    font-size: 14px;
}
.component-account-overview .formo-checkbox {
    position: relative;
}
.component-account-overview .formo-checkbox label {
    padding-left: 25px;
}
.component-account-overview .formo-checkbox input {
    position: absolute;
    top: 3px;
    left: 0;
}
@media (max-width: 767px) {
    .component-account-overview .btn {
        margin: 5px 0;
    }
}

/* Profile Settings
------------------------------------ */
.component-profile-settings .formo-checkbox,
.component-profile-settings .control-group.checkbox {
    width: 100%;
}
.component-profile-settings .checkbox label {
    padding-left: 25px;
    text-align: left;
}
.component-profile-settings .btn-delete-image {
    margin-right: 15px;
}
.component-profile-settings input[type="checkbox"] {
    margin: 0;
    top: 5px;
}
.component-profile-settings .btn-info {
    position: absolute;
    padding: 2px 8px;
    top: -4px;
    right: 0;
    color: var(--ba-blue-500);
    background: var(--ba-white);
    border: 2px solid var(--ba-blue-500);
    font-weight: bold;
}
.component-profile-settings .textarea {
    width: 100%;
}
.well-filedrop {
    border: 2px solid #c7dbeb;
    background: #ecf3f8;
}
.well-filedrop .alert-danger {
    margin-bottom: 0;
}
.well-filedrop .table {
    margin-bottom: 0;
}
.well-filedrop .table tr {
    margin-top: 15px;
}

/* Dropzone-Zustaende (2026-07-27)
   Vorher gab es im Frontend keine einzige .dz-*-Regel. Dropzone setzte seine
   Klassen korrekt, nur sah man davon nichts: kein Hover beim Ziehen, keine
   Vorschau, keine Fehlermeldung. Der Upload lief -- unsichtbar. */
.well-filedrop {
    transition: border-color var(--ba-transition-fast), background var(--ba-transition-fast);
}
.well-filedrop.dz-drag-hover {
    border-color: var(--ba-blue-600);
    border-style: dashed;
    background: var(--ba-surface-tint);
}
.well-filedrop .dz-message {
    margin: 0 0 var(--ba-space-md);
    text-align: center;
    font-weight: var(--ba-weight-bold);
    color: var(--ba-text-strong);
}
.well-filedrop.dz-drag-hover .dz-message {
    color: var(--ba-blue-600);
}
.dz-clickable {
    cursor: pointer;
}

/* Der Preview-Container ersetzt die Klasse `hide`, die vorher fest im Template
   stand und die Vorschau dauerhaft ausblendete. Ohne Vorschau ist er 0 hoch --
   der Abstand haengt deshalb an .dz-preview und nicht am Container, sonst bliebe
   auf jeder Seite eine 16px-Luecke stehen. (`#previews:empty` waere wirkungslos:
   der Container enthaelt Whitespace-Textknoten und matcht :empty nie.) */
.well-filedrop .dz-preview {
    margin-top: var(--ba-space-md);
    padding: var(--ba-space-sm) 0;
    border-top: 1px solid var(--ba-border);
}
.well-filedrop .dz-preview:first-child {
    border-top: 0;
    margin-top: var(--ba-space-md);
}
.well-filedrop .dz-preview [data-dz-thumbnail] {
    max-width: 100%;
    height: auto;
}
.well-filedrop .dz-preview .progress {
    margin-bottom: 0;
}
/* Fehlertext nur zeigen, wenn Dropzone auch einen Fehler gemeldet hat --
   sonst steht ein leeres <strong> im Layout und reisst Abstand auf. */
.well-filedrop .dz-preview [data-dz-errormessage] {
    display: none;
}
.well-filedrop .dz-preview.dz-error [data-dz-errormessage] {
    display: block;
    margin-top: var(--ba-space-xs);
    color: var(--ba-error-text);
}
.well-filedrop .dz-preview.dz-error .progress {
    display: none;
}
.well-filedrop .dz-preview.dz-success .progress-bar {
    background-color: var(--ba-green-600);
}

.component-profile-settings .body-height {
    width: 25%;
}
.component-profile-settings .body-weight {
    width: 24%;
}

/* Member Application finish
------------------------------------ */
.component-member-application-finish li {
    position: relative;
    padding-lefT: 40px;
    margin-bottom: 30px;
}
.component-member-application-finish li span {
    background: var(--ba-blue-500);
    color: var(--ba-text-on-brand);
    border-radius: 50%;
    top: -3px;
    left: 0;
    padding: 2px 10px;
    position: absolute;
}

/* Biker
--------------------------------------------------------------------------------------------------------------------- */
/* List
------------------------------------ */
.component-biker-list .item {
    margin-bottom: 50px;
    height: 200px;
}
.component-biker-list .item .thumbnail {
    margin-right: 20px;
}

/* Detail
------------------------------------ */
.component-biker-detail .biker-images img {
    width: 100%;
    height: auto;
}
.component-biker-detail .profile-pic .thumbnail {
    margin: 0 0 20px 20px;
}

/* Registration
------------------------------------ */
.component-biker-registration .formo-checkbox .control-label {
    padding-left: 20px;
}

/* Partner
--------------------------------------------------------------------------------------------------------------------- */
.component-partner {
    position: relative;
    z-index: 9;
    background: var(--ba-white);
}
.component-partner-footer {
    margin-top: 15px;
    text-align: center;
    background: var(--ba-white);
}
.component-partner-footer img {
    width: 95px;
    height: auto;
    margin: 0 6px;
    opacity: 0.5;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.component-partner-footer a:hover img {
    opacity: 1;
}
/* Scroll-Fade-In
--------------------------------------------------------------------------------------------------------------------- */
.fade-in-target {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.fade-in-target.fade-in-visible {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .fade-in-target {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* Card Hover-Lift
--------------------------------------------------------------------------------------------------------------------- */
.component-link-image,
.component-link-horizontal,
.component-partner-list .item .thumbnail {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.component-link-image:hover,
.component-link-horizontal:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}
.component-partner-list .item .thumbnail:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.10);
}

/* Partner-List
--------------------------------------------------------------------------------------------------------------------- */
.component-partner-list .item {
    height: 130px;
}
.component-partner-list .item .thumbnail {
    -webkit-display: flex;
    display: flex;
    align-items: center;
    height: 130px;
}
.component-partner-list .item .thumbnail a {
    margin: 0 auto;
}

/* Donations
--------------------------------------------------------------------------------------------------------------------- */
/* Sidebar
------------------------------------ */
.sidebar .component-donations-counter {
    display: block;
    margin: inherit;
    border: 2px solid #ececec;
    border-radius: 4px;
    background: var(--ba-white);
    color: var(--ba-blue-700);
}
.sidebar .component-donations-counter:hover {
    background: var(--ba-grey-25);
}
.sidebar .component-donations-counter .counter {
    background-size: 140% 60%;
}
.sidebar .component-donations-counter .col {
    float: none;
    width: 100%;
}
.sidebar .component-donations-counter p {
    display: none;
}
.sidebar .component-donations-counter .donation {
    font-size: 40px;
}
.sidebar .counter h2 {
    margin: 0 0 35px;
}
.sidebar .component-donations-counter h2,
.sidebar .component-donations-counter p,
.sidebar .component-donations-counter .donation {
    color: var(--ba-blue-700);
}

/* Footer
------------------------------------ */
.component-donations-counter {
    display: block;
    position: relative;
    z-index: 9;
    margin: 0;
    background: var(--ba-blue-500);
    background-size: cover;
    color: var(--ba-text-on-brand);
}
.component-donations-counter:hover {
    background: #2a6ea5;
}
.component-donations-counter .counter {
    margin: 0 auto;
    padding: 20px 15px 30px;
    max-width: 1170px;
    background: url("/media/images/default/mountains.png") no-repeat center bottom;
}
.component-donations-counter .donation {
    margin-top: -25px;
    font-size: 80px;
    font-weight: 300;
}
.component-donations-counter h2,
.component-donations-counter p,
.component-donations-counter .donation {
    color: var(--ba-text-on-brand);
}
@media (max-width: 991px) {
    .component-donations-counter .donation {
        margin-top: 0;
    }
    .component-donations-counter {
        text-align: center;
    }
}
@media (max-width: 767px) {
    .component-donations-counter .donation {
        font-size: 65px;
        margin-top: 0;
    }
}

/* BikeAid Gallery
--------------------------------------------------------------------------------------------------------------------- */
.component-album .item {
    position: relative;
    height: 340px;
    overflow: hidden;
}
.component-album .image {
    position: relative;
    height: 240px;
    border-radius: 4px;
    border-bottom: 4px solid var(--ba-blue-500);
    overflow: hidden;
}
.component-album .album-image {
    height: 240px;
    background-size: cover;
    background-position: center center;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
.component-album .flag {
    left: 13px;
    position: absolute;
    top: 232px;
}
.component-album .item:hover .album-image {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}
.component-album .item h2 {
    margin-top: 15px;
}

/* Übersicht
------------------------------------ */
.component-gallery-show .image-grid {
    text-align: center;
}
.component-gallery-show .item {
    display: inline-block;
    overflow: hidden;
    padding: 5px 2px;
    width: 33%;
    max-height: 230px;
    vertical-align: top;
}
.component-gallery-list .item img {
    max-width: 230px;
    margin-right: 20px;
}
.component-gallery-show .title {
    padding: 15px;
    background: var(--ba-blue-700);
    color: var(--ba-text-on-brand);
    border-bottom: 5px solid var(--ba-white);
}
.component-gallery-show .title a {
    display: block;
    margin-bottom: 10px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--ba-white);
    color: var(--ba-text-on-brand);
}
.component-gallery-show .title img {
    width: 20px;
    height: 20px;
}
.component-gallery-show .title h1 {
    margin: 0;
}
.component-gallery-show img {
    width: 100%;
    height: auto;
    border-radius: 0;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.1s ease-in-out 0s;
}
.component-gallery-show .caption {
    display: none;
}
.component-gallery-show img:hover {
    opacity: 0.8;
}
@media (max-width: 991px) {
    .component-gallery-show .item {
        width: 32%;
    }
}
@media (max-width: 767px) {
    .component-gallery-show .item {
        width: 49%;
    }
}
@media (max-width: 480px) {
    .component-gallery-show .item {
        width: 100%;
    }
}
/* Swipe Hint (mobile gallery)
------------------------------------ */
.component-gallery {
    position: relative;
}
.component-gallery .swipe-hint {
    display: none;
}
@keyframes swipe-hint-fade {
    0%   { opacity: 0; }
    15%  { opacity: 1; }
    70%  { opacity: 1; }
    100% { opacity: 0; }
}
@media (max-width: 767px) {
    .component-gallery .swipe-hint {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
        z-index: 10;
        padding: 0 10px;
        pointer-events: none;
        opacity: 0;
    }
    .component-gallery .swipe-hint.swipe-hint-animate {
        animation: swipe-hint-fade 2.5s ease-out forwards;
        animation-delay: 0.4s;
    }
    .component-gallery .swipe-hint-arrow {
        width: 38px;
        height: 38px;
        background: rgba(0, 0, 0, 0.38);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--ba-text-on-brand);
        font-size: 26px;
        line-height: 1;
    }
}
/* Toast Notifications (#8)
------------------------------------ */
.toast-snackbar {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    z-index: 9999;
    min-width: 280px;
    max-width: 520px;
    border-radius: 10px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.22);
    padding: 13px 16px 13px 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    color: var(--ba-text-on-brand);
    animation: toast-in 0.35s cubic-bezier(0.21, 1.02, 0.73, 1) forwards;
}
@keyframes toast-in {
    from { opacity: 0; transform: translateX(-50%) translateY(16px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.toast-snackbar.toast-out {
    animation: toast-out 0.3s ease forwards;
}
@keyframes toast-out {
    to { opacity: 0; transform: translateX(-50%) translateY(16px); }
}
.toast-snackbar.toast-notice  { background: #37474f; }
.toast-snackbar.toast-success { background: #2e7d32; }
.toast-snackbar.toast-danger  { background: #c62828; }
.toast-snackbar.toast-info    { background: #1565c0; }
.toast-snackbar.toast-warning { background: #e65100; }
.toast-message {
    flex: 1;
}
.toast-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.75);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    padding: 0 0 0 6px;
    flex-shrink: 0;
}
.toast-close:hover {
    color: var(--ba-text-on-brand);
}
@media (max-width: 767px) {
    .toast-snackbar {
        bottom: 16px;
        min-width: 0;
        width: calc(100% - 32px);
        max-width: none;
    }
}
/* Events
--------------------------------------------------------------------------------------------------------------------- */
/* Calendar
------------------------------------ */
.component-calendar table {
    margin: 0;
}
.component-calendar table tbody {
    border: 0 none;
}
.component-calendar table tr td {
    padding: 8px 0;
    border: 0 none;
    text-align: center;
    vertical-align: middle;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.1s ease-in-out 0s;
}
.component-calendar table tr td a {
    color: var(--ba-blue-500);
}
.component-calendar table tr td.today,
.component-calendar table tr td:hover {
    background: #c7dbeb;
    border-radius: 4px;
}
.component-calendar table tr td.today a {
    color: #103a5c;
}
.component-calendar .headline-current-month {
    text-align: center;
}
.button-previous-month,
.button-next-month {
    width: 20px;
    height: 20px;
    display: block;
    background: url("/media/images/default/arrow-left.svg") no-repeat center center;
}
.button-next-month {
    float: right;
    background: url("/media/images/default/arrow-right.svg") no-repeat center center;
}
/* Calendar serach */
.component-calendar .searchterm,
.component-calendar .category {
    width: 100%;
}
.component-calendar .col-xs-5 {
    width: 43%;
}
.component-calendar .col-xs-5.from {
    padding-right: 0;
}
.component-calendar .col-xs-5.to {
    padding-left: 0;
}
.component-calendar .col-xs-5 input {
    padding: 5px;
}
.component-calendar label {
    float: left;
    padding: 5px;
}
@media (max-width: 991px) {
    .component-calendar .form-control {
        width: 100%;
    }
    .component-calendar .col-xs-5 {
        width: 47.5%;
    }
}
@media (max-width: 767px) {
    .component-calendar .col-xs-5 {
        width: 46.5%;
    }
}
@media (max-width: 500px) {
    .component-calendar .col-xs-5.from,
    .component-calendar .col-xs-5.to,
    .component-calendar label {
        width: 100%;
        padding: 0 15px;
    }
    .component-calendar label {
        float: none;
        text-align: center;
    }
}

/* List
------------------------------------ */
.component-event-list {
    position: relative;
    top: 20px;
}
.component-event-list .item {
    border-bottom: 1px solid var(--ba-grey-200);
    margin-bottom: 30px;
    padding-bottom: 30px;
    position: relative;
}
.component-event-list h3 {
    margin-top: 0;
}
.component-event-list .item .infos {
    position: absolute;
    padding: 2px 8px;
    width: 100%;
    top: -20px;
    left: 0;
    background: var(--ba-blue-500);
    border-radius: 4px 4px 0 0;
}
.component-event-list .item .specs {
    margin-bottom: 10px;
}
.component-event-list .item .infos .badge {
    float: right;
    padding: 0;
    line-height: normal;
}
.component-event-list .item .infos .category {
    font-size: 12px;
    font-weight: bold;
    color: var(--ba-text-on-brand);
}
.component-event-list .item .image {
    height: 85px;
    width: 100%;
    /*border: 1px solid #ddd;*/
    border-radius: 4px;
    /*background: #f7f7f7 url("/media/images/default/no-image.svg") no-repeat center center / 35% auto;*/
}
.component-event-list .specs .date,
.component-event-list .specs .location {
    display: inline-block;
    margin-right: 10px;
}
.component-event-list .item span img {
    margin: -2px 3px 0 0;
}
.btn-event-list.visible-xs {
    margin-top: 15px;
}
.component-event-list .more-info,
.component-event-list .add-ical,
.component-event-list .btn-add-user {
    float: right;
    margin: 0 0 8px 8px;
    padding: 5px 6px;
}
.component-event-list .item input.btn.btn-logged-in[type="submit"] {
    height: 35px;
    width: 37px;
    margin: 0 0 8px 8px;
    background: var(--ba-red-600) url("/media/images/default/icon-add-user-white.png") no-repeat center center !important;
}

/* Event-image by category if no image is set */

.component-event-list .item .image.MTB-Tour {
    
}
.component-event-list .item .image.Technik-Training {
    
}
.component-event-list .item .image.MTB-Camp {
    
}
.component-event-list .item .image.RR-Training {
    
}
.component-event-list .item .image.Charity {
    
}
.component-event-list .item .image.Versammlung {
    
}
.component-event-list .item .image.MTB-Rennen {
    
}
.component-event-list .item .image.RR-Rennen {
    
}
.component-event-list .item .image.Flüchtlingsprojekt {
    
}
.component-event-list .item .image.Calendar.Pro {
    
}
.component-event-list .item .image.Partner-Veranstaltung {
    
}
.component-event-list .item .image.CTF {
    
}
.component-event-list .item .image.Ladies.Only {
    
}
.component-event-list .item .image.Kids.Only {
    
}
.component-event-list .item .image.E-MTB {
    
}



@media (min-width: 650px) {
    .component-event-list .btn {
        width: auto;
    }
}
@media (max-width: 650px) {
    .component-event-list .item .date {
        width: 100%;
    }
    .component-event-list .specs span {
        display: block;
    }
    .component-event-list .col-xs-6 {
        width: 100%;
    }
}

/* Eventlist Sidebar
--------------------------------------- */
.sidebar .component-eventhighlight-sidebar .btn {
	width: auto;
	margin-top: 5px;
	padding: 2px 8px;
	font-size: 12px;
}
.sidebar .component-eventhighlight-sidebar .pager li a, .sidebar .component-eventhighlight-sidebar .pager li span {
	font-size: 12px;
	padding: 5px 6px;
	margin: 0;
}
.sidebar .component-eventhighlight-sidebar .pager li a i {
	display: none;
}

/* Details
------------------------------------ */
.component-event-detail dt {
    padding: 10px 0 0;
}
.component-event-detail dd {
    margin: 0;
    padding: 10px 0 10px 200px;
}
.component-event-detail .panel-group .caption {
    display: none;
}
.component-event-detail .panel-title a {
    display: block;
}
.component-event-detail .well {
    margin-bottom: 0;
    border-bottom: 0 none;
    border-radius: 4px 4px 0 0;
}
.component-event-detail .btn {
    width: 100%;
}
.further-dates {
    left: 200px;
    margin: 0;
    position: relative;
}
.further-dates a.btn {
    width: auto;
}
.further-dates .dropdown-menu > li > a {
    padding: 5px;
}
.further-dates .dropdown-menu {
    padding: 10px;
    width: 195px;
}
.further-dates .dropdown-menu li {
    padding: 3px;
}
.component-event-detail .panel-heading {
    background: var(--ba-grey-25);
}
.component-event-detail .contact-panel {
    border-radius: 0;
    border-bottom: 0 none;
}
.component-event-detail .map-panel {
    border-radius: 0 0 4px 4px;
    margin: 0 !important;
}

/* Map Panel */
.map-panel .panel-body {
    padding: 0;
}
.map-panel .panel-body a {
    display: inline-block;
    vertical-align: middle;
    padding: 5px 15px;
}
.map-panel .map-badge {
    height: auto;
}
.map-panel .map-badge .map-holder .map {
    height: 300px !important;
}
iframe body {
    margin: 0;
}

/* Detail Related Events */
.component-related-events h3,
.component-related-events h3 a {
    font-size: 16px;
    margin-bottom:0;
}
.component-related-events .item {
    border-bottom: 1px solid var(--ba-grey-100);
    padding-bottom: 15px;
    margin-bottom: 20px;
}
.component-related-events .item:last-of-type {
    border-bottom: 0 none;
    padding: 0;
}

/* Detail Sidebar */
.participant {
    display: inline-block;
    position: relative;
    width: 31%;
}
.component-event-detail-sidebar .select2 {
    margin-top: 20px;
}
.component-event-detail-sidebar .select2-selection__arrow {
    /*display: none;*/
}
.component-event-detail-sidebar .select2-container--default .select2-selection--single {
    border-radius: 0;
}
.participant-list {
    overflow: hidden;
    margin: 0 0 20px;
    max-height: 200px;
    text-align: center;
}
.participant-list a.label-delete {
    position: absolute;
    top: 0;
    right: 0;
    color: white;
    border-radius: 10px;
    display: inline-block;
    padding: 5px 7px;
}
.participant-list.active {
    height: auto;
    max-height: none;
}
.participant-list a.biker {
    color: var(--ba-blue-900);
    display: inline-block;
    margin-bottom: 10px;
    padding: 0;
    background: 0 none;
    border: 0 none;
    vertical-align: top;
    text-align: left;
}
.participant-list a.biker:hover, .participant-list a.biker:visited {
    color: var(--ba-blue-900);
}
.participant-list img {
    width: 60px;
    height: 60px;
    border: 1px solid #eee;
}
.participant-list a.biker em {
	display: table-cell;
	vertical-align: middle;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	text-align: center;
	font-size: 18px;
	font-style: normal;
	font-weight: 300;
	background: url('/media/images/default/no-biker-image-male.svg') no-repeat 0 0;
}
.participant-list a.biker em.gender_2 {
	background-image: url('/media/images/default/no-biker-image-female.svg');
}
.mail-button {
    margin-top: 10px;
}

/* Highlights in Sidebar */
.component-eventhighlight li:last-child hr {
    display: none;
}

/* Sold-out */
.sold-out {
    color: var(--ba-text-on-brand);
}

/* Mobile */
@media (max-width: 991px) {
    .participant-list button {
        width: auto;
    }
}
@media (max-width: 767px) {
    .further-dates {
        left: 0;
    }
}

/* Forum
--------------------------------------------------------------------------------------------------------------------- */
.component-eventhighlight-sidebar .well {
    background: #f3f3f3;
    bordeR: 0 none;
}
.component-eventhighlight-sidebar .well h3 {
    margin: 3px 0 0;
    font-size: 15px;
    line-height: 18px;
}
.component-eventhighlight-sidebar .well a {
    font-size: 15px;
    color: var(--ba-blue-900);
}
.component-eventhighlight-sidebar .well p {
    margin: 0;
}
.component-eventhighlight-sidebar .well img {
    width: 15px;
    margin-top: -3px;
}

    /* Forum
    --------------------------------------------------------------------------------------------------------------------- */
/* Board
------------------------------------ */
.component-forum .pagetitle .btn {
    margin: 17px 0 0;
}
.component-forum .heads,
.component-forum .item {
    display: table;
    width: 100%;
}
.component-forum .heads div,
.component-forum .item div {
    display: table-cell;
    vertical-align: middle;
}
.component-forum .heads {
    border-radius: 5px;
    background: var(--ba-blue-500);
    padding: 10px;
}
.component-forum .item {
    padding: 10px;
    border-bottom: 1px solid var(--ba-grey-100);
}
.component-forum .heads div {
    color: var(--ba-text-on-brand);
}
.component-forum .board {
    width: 30%;
}
.component-forum .thread-amount {
    width: 15%;
    text-align: right;
    padding-right: 40px;
}
.component-forum .action {
    width: 30%;
}

/* Threadlist
------------------------------------ */
.component-forum .thread {
    width: 30%;
}
.component-forum .posts {
    width: 15%;
}
.component-forum .created-by {
    width: 20%;
}
.component-forum .last-reply {
    width: 30%;
}

/* Show Thread
------------------------------------ */
.component-forum .thread-item .heads {
    position: relative;
    padding: 17px 20px 0 70px;
    height: 55px;
    border-radius: 25px 0 0 25px;
    background: var(--ba-grey-100);
}
.component-forum .heads .user-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 55px;
    height: 55px;
}
.component-forum .thread-item .comment {
    padding: 20px;
}
.component-forum .respond textarea {
    height: 150px;
    margin-bottom: 15px;
    width: 100%;
}

.component-forum .comment p small {
    font-size: 10px !important;
}

.component-forum .highlight {
    border-radius: 5px;
    background-color: #fcf8e3 !important;
}
.component-forum .highlight .heads {
    border-radius: 5px 5px 0 0 !important;
    background: #fff2b0 none repeat scroll 0 0 !important;
}
.component-forum .comment-edit {
    margin: 0 3px;
}

.component-forum .thread-delete,
.component-forum .thread-edit {
    margin-right: 10px !important;
    color: white;
}

/* Forum Mobile
------------------------------------ */
@media (max-width: 767px) {
    .component-forum .heads div,
    .component-forum .item div {
        display: block;
        width: 100%;
        text-align: left;
    }
    .component-forum .btn {
        margin: 20px 0;
    }
    .thread-item {
        clear: both;
    }
}

/* Form Builder
------------------------------------ */
.form-horizontal .form-group {
    margin: 0;
}
.form-horizontal .form-group label {
    text-align: left;
}
.component-form .form-group {
    margin-bottom: 15px;
}
.component-form.formbuilder .control-group {
    margin-bottom: 15px;
}
.component-form .control-group {
    display: inline-block;
    position: relative;
    width: 49%;
    vertical-align: top;
}
.component-form .control-group label {
    display: block;
    font-weight: 400;
}
.form-control {
    display: block;
    width: 97%;
    height: 34px;
    padding: 5px 12px;
    font-size: 15px;
    line-height: 1.428571429;
    color: var(--ba-grey-700);
    border: 1px solid #ddd;
    box-shadow: none;
}
input[type="file"] {
    padding: 0;
}
.component-form .form-control:focus {
    box-shadow: 0 0 3px #ccc;
}
/* iOS Safari zoomt beim Fokussieren von Feldern mit font-size < 16px in die
   Seite hinein und bleibt nach dem Ausfuellen gezoomt haengen. 16px
   unterbindet den Auto-Zoom komplett. Nur mobil -- am Desktop bleibt die
   kompaktere 15px-Optik. */
@media (max-width: 991px) {
    .form-control {
        font-size: 16px;
    }
}
/* Datepicker-Felder sind auf Touch-Geraeten readonly (Tastatur soll nicht
   ueber dem Kalender aufgehen, siehe application.tjs) -- Bootstrap stylt
   readonly aber grau wie disabled. Das Feld ist bedienbar, also normal
   weiss und mit Zeige-Cursor darstellen. */
input.datepicker[readonly] {
    background-color: var(--ba-surface, #fff);
    cursor: pointer;
}
/* Bootstrap-Datepicker (Geburtsdatum im Mitgliedsantrag): Standardzellen
   sind am Handy kaum treffbar. Auf Touch-Breiten auf >=40px Touch-Target
   und 16px Schrift anheben. */
@media (max-width: 991px) {
    .datepicker.dropdown-menu {
        font-size: 16px;
    }
    .datepicker.dropdown-menu td,
    .datepicker.dropdown-menu th {
        width: 40px;
        height: 40px;
    }
}
.field.control-group.formo-checkboxes {
    width: 100%;
}
.component-form .control-group.formo-checkbox,
.component-form .control-group.formo-radios {
    width: 100%;
}
.component-form .formo-checkbox,
.component-form .control-group.checkbox {
    width: 100%;
}
.component-form .control-group.formo-checkbox input,
.component-form .control-group.formo-radios input {
    position: absolute;
    margin: 0;
    top: 6px;
    width: auto;
    height: auto;
}
.component-form .control-group.formo-radios input {
    left: -20px;
}
.component-form .control-group.formo-textarea {
    display: block;
    width: 96.2%;
}
.component-form .control-group textarea {
    width: 100%;
    height:200px;
}
.hp-layout,
.sidebar .hp-layout {
    display: none !important;
}
.required {
    color: var(--ba-red-600);
}
.error input,
.error textarea,
.error select {
    border: 1px solid var(--ba-red-600) !important;
    box-shadow: 0 0 3px var(--ba-red-600) !important;
}
.error .opt-label {
    color: var(--ba-red-600) !important;
}
.component-form.formbuilder .formo-checkbox label {
    padding-left: 20px;
}

/* Submit */
.component-form input[type="submit"] {
    width: auto;
    position: relative;
    overflow: hidden;
    z-index: 100;
    background: var(--ba-blue-500);
    color: var(--ba-text-on-brand);
    border: 0 none;
    border-radius: 5px;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}

.component-form input[type="submit"]:hover {
    background: var(--ba-blue-600);
    color: var(--ba-text-on-brand);
}
@media (max-width: 767px) {
    .component-form .form-group {
        display: block;
        width: 100%;
    }
    .component-form .control-group {
        width: 100%;
    }
    .btn-form-help {
        width: auto;
    }
    .component-form input[type="submit"] {
        width: 100%;
    }
}

/* Sceditor */

.sceditor-button {
    padding: 0 !important;
}

/* Sitemap
--------------------------------------------------------------------------------------------------------------------- */
.component-sitemap .nav {
    width: 100%;
}
.component-sitemap .nav li {
    float: none;
}
.component-sitemap .nav > li > a {
    margin: 15px 0 20px;
    display: block;
    font-size: 24px;
    background: var(--ba-grey-25);
    border-radius: 5px;
    color: var(--ba-link);
}
.component-sitemap .nav > li > a:hover {
    background: var(--ba-grey-100);
}
.component-sitemap .nav li ul li {
    list-style-type: square;
}
.component-sitemap .nav li ul {
    display: block !important;
}

/* Event Highlight - Start
--------------------------------------------------------------------------------------------------------------------- */
.component-events-start {
    padding: 50px 0 100px 0;
    background: url("/media/images/default/bg-event-start.jpg") no-repeat top center;
    background-size: cover;
    margin: 0;
}
.component-events-start a,
.component-events-start span,
.component-events-start div {
    color: var(--ba-text-on-brand);
}
.component-events-start .item {
    padding-bottom: 20px;
    border-bottom-width: 2px;
    border-color: var(--ba-text-on-brand);
    background: rgba(255,255,255, 0.2);
    transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.component-events-start .item .specs {
    margin: 0;
}
.component-events-start path {
    fill: var(--ba-white);
}
.component-events-start .item:hover {
    transform: scale(1.03);
    background: rgba(255,255,255, 0.3);
}
.component-events-start .item.highlight .date {
    position: absolute;
    padding: 6px 20px 10px;
    top: 0;
    left: 0;
    border-radius: 0 0 4px 0;
    background: var(--ba-white);
    font-family: 'Roboto Slab', sans-serif;
    color: var(--ba-blue-500);
}
.component-events-start .item.highlight .date span {
    vertical-align: text-bottom;
    margin-right: -5px;
    font-size: 25px;
    line-height: 28px;
    color: var(--ba-blue-600);
}
.component-events-start .item.highlight .category {
    position: absolute;
    width: 210px;
    top: 10px;
    right: 20px;
    text-align: right;
}
.component-events-start .item.highlight h2 {
    margin-top: 40px;
}
.component-events-start .badge.users {
    position: absolute;
    padding-right: 15px;
    top: 0;
    right: 0;
    border-radius: 0 0 0 5px;
    color: #666;
    font-size: 11px;
    background: var(--ba-white);
}

/* Old Webkit Browsers — entfernt am 2026-07-26
   ---------------------------------------------------------------------------------------------------------------------
   Hier stand ein Block

       @media screen and (min-width:-100px) and (-webkit-min-device-pixel-ratio:0) {
           _::-moz-svg-foreign-content, .logo { ... }
       }

   der in KEINEM Browser griff:

   - (-webkit-min-device-pixel-ratio:0) trifft nur Chrome und Safari.
   - _::-moz-svg-foreign-content ist ein Firefox-Hack. In einer Selektorliste
     verwirft ein ungueltiger Selektor die ganze Regel -- in Chrome fiel damit
     alles weg, was die Query eingeschlossen hatte.
   - In Firefox war die Liste gueltig, aber die Query traf nicht zu.
   - Dazu enthielt er /... in doppelten Klammern: unaufgeloeste
     Smarty-Syntax in einer statisch ausgelieferten CSS-Datei, also ohnehin kein
     gueltiges url().

   Der Kommentar sprach von "Old Webkit Browsers" -- gemeint waren offenbar
   Geraete um 2012. Aufgefallen ist der Block bei der Breakpoint-Konsolidierung,
   weil min-width:-100px als Bedingung immer wahr ist.
   --------------------------------------------------------------------------------------------------------------------- */


/* Edit Page / Article Link
--------------------------------------------------------------------------------------------------------------------- */
a.edit-page,
a.edit-article,
a.delete-article,
a.delete-event {
    position: absolute;
    background: #a0211b;
    right: 0;
    top: -30px;
    color: var(--ba-text-on-brand);
    font-weight: normal;
}
a.delete-article,
a.delete-event {
    right: inherit;
    left: 0;
}
a.edit-article {
    right: 130px;
}
/* Zweiter Badge: Direktlink in das Modul, das den Seiteninhalt pflegt
   (Racing-Roster, FAQ, Partner). a.edit-page liegt absolut auf right:0 --
   ohne Versatz lägen beide Badges übereinander. Wächst nach links, taugt
   also für unterschiedlich lange Beschriftungen. */
a.edit-content {
    right: 135px;
}
a.edit-page:hover,
a.edit-article:hover {
    background: #781611;
}

/* Lightbox Custom
--------------------------------------------------------------------------------------------------------------------- */
#colorbox, #cboxOverlay, #cboxWrapper, #cboxContent {
    overflow: visible !important;
}
#cboxCurrent {
    bottom: -40px !important;
    left: 0 !important;
    color: var(--ba-text-on-brand) !important;
}
#cboxNext,
#cboxPrevious {
    position: absolute !important;
    width: 70px !important;
    height: 95% !important;
    bottom: 4% !important;
    font-size: 0 !important;
    transition: all 0.2s ease-in-out 0s;
    -webkit-transition: all 0.2s ease-in-out 0s;
}
#cboxNext {
    left: inherit !important;
    right: 0 !important;
    background: url("/media/images/default/icon-next.png") no-repeat center center !important;
    text-indent: 100px !important;
    opacity: 0.5;
}
#cboxPrevious {
    left: 0 !important;
    right: inherit !important;
    background: url("/media/images/default/icon-prev.png") no-repeat center center !important;
    text-indent: -100px !important;
    opacity: 0.5;
}
#cboxPrevious:hover,
#cboxNext:hover {
    opacity: 1;
}
#cboxClose {
    font-size: 0 !important;
    width: 50px !important;
    height: 50px !important;
    top: 10px !important;
    bottom: inherit !important;
    right: 10px !important;
    background: url("/media/images/default/icon-close.png") no-repeat center center !important;
    text-indent: 140px;
}

.cropper-container img {
    max-width: 100%;
}

/* Marked */

.cmp-marked-article .btn {
    width: 100%;
}
.cmp-marked-article mark {
    background: var(--ba-red-600);
    padding: 1px 5px;
    color: var(--ba-text-on-brand);
}
/*.grecaptcha-badge {*/
    /*display: none!important;*/
/*}*/



footer .nav li a, .cc-compliance>.cc-btn{
    z-index: 1;
}




/* Social Media Icons -- MOBILE
--------------------------------------------------------------------------------------------------------------------- */

.social-icons-sm {
    list-style: none;
    padding: 16px 12px;
}
.social-icons-sm .social-link {
    margin-bottom: 20px;
}
.social-icons-sm .social-link a {
    display: flex;
    align-items: center;
}
.social-icons-sm .social-link a img {
    max-width: 29px;
    max-height: 29px;
    width: 100%;
    margin-right: 14px;
}
@media (max-width: 767px) {
    .social-icons-sm {
        padding: 16px 0;
    }
}




/* Social Media Icons -- DESKTOP
--------------------------------------------------------------------------------------------------------------------- */

.social-icons-large {
    display: none;
    position: absolute;
    top: 30vh;
    right: 0;
    z-index: 3;
    flex-direction: column;
    align-items: flex-end;
    overflow: visible;
}

.social-icons-large .social-box {
    padding: 16px;
    background: rgba(234, 234, 234, 0.9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: all .2s linear;
}

.social-icons-large .social-box:hover {
    padding: 16px 26px 16px 16px;
}

.social-icons-large .social-box img {
    width: 29px;
    height: 100%;
}

/* Facebook Bereich */
.social-icons-large .social-box.fb-wrap {
    position: relative;
    display: flex;
    align-items: center;
    border-radius: 20px 0 0 0;
}

.social-icons-large .social-box.fb-wrap .fb-links {
    width: 258px;
    margin-right: -278px;
    margin-left: 20px;
    transition: all .4s ease-in-out;
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.social-icons-large .social-box.fb-wrap:hover .fb-links {
    margin-right: 20px;
}

.social-icons-large .social-box.fb-wrap:hover .fb-links a:hover {
    color: var(--ba-red-600);
}

.social-icons-large .social-box.fb-wrap:hover .fb-links a span {
    position: relative;
}

.social-icons-large .social-box.fb-wrap:hover .fb-links a span::before {
    position: absolute;
    content: '';
    bottom: -20px;
    height: 0;
    width: 100%;
    background: var(--ba-red-600);
    transition: all .2s linear;
}

.social-icons-large .social-box.fb-wrap:hover .fb-links a:hover span::before {
    height: 6px;
}

.social-icons-large .social-box.fb-wrap:hover .fb-links span {
    margin: 0 5px;
}

/* Instagram Bereich */
.social-icons-large .social-box.ig-wrap {
    position: relative;
    display: flex;
    align-items: center;
    margin: 6px 0;
}

.social-icons-large .social-box.ig-wrap .ig-links {
    width: 258px;
    margin-right: -278px;
    margin-left: 20px;
    transition: all .4s ease-in-out;
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.social-icons-large .social-box.ig-wrap:hover .ig-links {
    margin-right: 20px;
}

.social-icons-large .social-box.ig-wrap:hover .ig-links a:hover {
    color: var(--ba-red-600);
}

.social-icons-large .social-box.ig-wrap:hover .ig-links a span {
    position: relative;
}

.social-icons-large .social-box.ig-wrap:hover .ig-links a span::before {
    position: absolute;
    content: '';
    bottom: -20px;
    height: 0;
    width: 100%;
    background: var(--ba-red-600);
    transition: all .2s linear;
}

.social-icons-large .social-box.ig-wrap:hover .ig-links a:hover span::before {
    height: 6px;
}

.social-icons-large .social-box.ig-wrap:hover .ig-links span {
    margin: 0 5px;
}

/* Strava Bereich */
.social-icons-large .social-box.strava-wrap {
    border-radius: 0 0 0 20px;
}

@media (min-width: 992px) {
    .social-icons-large {
        display: flex;
    }
}

@media (min-width: 1300px) {
    .social-icons-large {
        position: fixed;
    }
}

/* Navbar Sub-Navigation Dropdowns (desktop)
--------------------------------------------------------------------------------------------------------------------- */
@media (min-width: 992px) {
    .navbar-nav > li {
        position: relative;
    }
    .navbar-nav > li > ul {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        background: var(--ba-white);
        min-width: 220px;
        padding: 0;
        margin: 0;
        list-style: none;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        border: 1px solid #d6d6d6;
    }
    .navbar-nav > li:hover > ul {
        display: block;
    }
    .navbar-nav > li > ul > li {
        border-bottom: 1px solid #eee;
    }
    .navbar-nav > li > ul > li:last-child {
        border-bottom: 0;
    }
    .navbar-nav > li > ul > li a {
        display: block;
        padding: 10px 20px;
        color: var(--ba-text);
        white-space: nowrap;
    }
    .navbar-nav > li > ul > li a:hover {
        color: var(--ba-link);
        background: var(--ba-grey-50);
        text-decoration: none;
    }
    .navbar-nav > li > ul > li.active a {
        color: var(--ba-link);
        font-weight: 600;
    }
    /* Hide nested empty uls (forum etc.) */
    .navbar-nav > li > ul > li > ul {
        display: none;
    }
    /* Dropdown arrow indicator for items with children */
    .navbar-nav > li.has-subnav > a:after {
        content: " \25BE";
        font-size: 11px;
        opacity: 0.6;
    }
}

/* Mobile Subnav Strip (xs/sm only)
--------------------------------------------------------------------------------------------------------------------- */
.navbar-menu-open .mobile-subnav {
    display: none !important;
}
/* Rundung gehoert an die Aussenkante des Kopfblocks, nicht zwischen die
   beiden buendig anliegenden Leisten. Greift nur, solange die Subnav
   tatsaechlich oben klebt (Klasse aus page.js): dann endet die Navbar
   gerade und die Subnav traegt die runde Unterkante. Im Fluss - und auf
   Seiten ohne Subnav - bleibt die Navbar-Pill rundum rund und die Subnav
   eine schlichte Leiste. */
@media (max-width: 991px) {
    body.subnav-stuck .navbar .container,
    body.subnav-stuck .navbar.affix .container {
        border-radius: 0;
    }
    body.subnav-stuck .mobile-subnav-wrap {
        border-radius: 0 0 30px 30px;
        overflow: hidden;
    }
}
.mobile-subnav-wrap {
    position: sticky;
    /* Sticky-Offset = echte Navbar-Höhe minus 1px (die Navbar sitzt auf
       top:-1px). Buendig, KEINE Luft: jeder Spalt laesst den Seiteninhalt
       zwischen Hauptnavigation und Subnav durchscrollen.
       --navbar-height wird in page.js per ResizeObserver gemessen und gesetzt.
       Fallback 132px für die Phase vor dem ersten JS-Tick. */
    top: calc(var(--navbar-height, 132px) - 2px);
    z-index: 1000;
}
.mobile-subnav-wrap::before,
.mobile-subnav-wrap::after {
    content: '';
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 1;
}
.mobile-subnav-wrap::before {
    left: 0;
    background: linear-gradient(to left, transparent, var(--ba-white));
    opacity: 0;
}
.mobile-subnav-wrap::after {
    right: 0;
    background: linear-gradient(to right, transparent, var(--ba-white));
}
.mobile-subnav-wrap.scrolled-start::before {
    opacity: 1;
}
.mobile-subnav-wrap.scrolled-end::after {
    opacity: 0;
}
/* Scrollbalken der beiden Nav-Streifen ausblenden: auf Touch wischt man
   ohnehin, mit Maus uebersetzt page.js das vertikale Rad ueber dem Streifen
   in horizontales Scrollen. Der Hinweis, dass rechts noch etwas kommt,
   kommt aus den Fade-Gradienten. */
.mobile-mainnav,
.mobile-subnav {
    scrollbar-width: none;          /* Firefox */
    -ms-overflow-style: none;       /* alte Edge/IE */
}
.mobile-mainnav::-webkit-scrollbar,
.mobile-subnav::-webkit-scrollbar {
    display: none;                  /* WebKit/Blink */
}
.mobile-subnav {
    background: var(--ba-white);
    border-bottom: 1px solid #d6d6d6;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    text-align: center;
}
.mobile-subnav .nav {
    display: inline-flex;
    flex-wrap: nowrap;
    padding: 0 10px;
    margin: 0;
    list-style: none;
}
.mobile-subnav .nav li {
    display: inline-block;
    list-style: none;
    border-bottom: none;
}
.mobile-subnav .nav li a {
    display: block;
    padding: 12px 16px;
    color: var(--ba-link);
    font-size: 14px;
    white-space: nowrap;
    border-bottom: 3px solid transparent;
}
.mobile-subnav .nav li a:hover {
    color: var(--ba-blue-600);
    text-decoration: none;
    background: none;
    opacity: 0.75;
}
.mobile-subnav .nav li.active a {
    color: var(--ba-link);
    border-bottom-color: var(--ba-blue-600);
    font-weight: 600;
}

/* Mobile Main Nav Strip (xs/sm only)
--------------------------------------------------------------------------------------------------------------------- */
.navbar-menu-open .mobile-mainnav {
    display: none !important;
}
.mobile-mainnav-wrap {
    position: relative;  /* inside the navbar container — no sticky needed */
    z-index: auto;
    clear: both;
    width: 100%;
    border-radius: 0 0 22px 22px;
    overflow: hidden;
}
.mobile-mainnav {
    background: transparent;
    border-bottom: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    text-align: left;
    /* overflow-x:auto zwingt overflow-y auf auto — der Glow der aktiven Pill
       wuerde an der Containerkante hart abgeschnitten. Padding schafft den
       Platz, der negative Margin haelt das Layout an der alten Stelle. */
    padding: 14px 0;
    margin: -14px 0 -4px;
    --pill-fade-l: 0px;
    --pill-fade-r: 28px;
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0,
        var(--ba-black) var(--pill-fade-l),
        var(--ba-black) calc(100% - var(--pill-fade-r)),
        transparent 100%
    );
            mask-image: linear-gradient(
        to right,
        transparent 0,
        var(--ba-black) var(--pill-fade-l),
        var(--ba-black) calc(100% - var(--pill-fade-r)),
        transparent 100%
    );
}
.mobile-mainnav-wrap.scrolled-start .mobile-mainnav { --pill-fade-l: 28px; }
.mobile-mainnav-wrap.scrolled-end   .mobile-mainnav { --pill-fade-r: 0px; }
.mobile-mainnav .nav {
    display: inline-flex;
    flex-wrap: nowrap;
    /* Links kein Padding: die erste Pill soll buendig unter der linken
       Logo-Kante beginnen. Rechts bleibt Platz fuer den Fade. */
    padding: 0 16px 0 0;
    margin: 0;
    list-style: none;
    gap: 6px;
}
.mobile-mainnav .nav li {
    display: inline-block;
    list-style: none;
    border-bottom: none;
}
.mobile-mainnav .nav li a {
    display: block;
    padding: 7px 14px;
    color: var(--ba-red-600);
    font-size: 14px;
    white-space: nowrap;
    background: var(--ba-surface);
    border: 1.5px solid var(--ba-grey-300);
    border-radius: 20px;
    text-transform: uppercase;
    font-weight: 300;
}
.mobile-mainnav .nav li a:hover {
    color: var(--ba-red-600);
    text-decoration: none;
    background: none;
    opacity: 0.75;
}
.mobile-mainnav .nav li.active > a {
    color: var(--ba-text-on-brand);
    background-color: var(--ba-primary);
    border: 1.5px solid var(--ba-blue-600);
    border-radius: 20px;
    font-weight: 600;
    /* Gestaffelte Layer statt einem 12px-Schatten: ein einzelner Gaussian
       reisst am Radius sichtbar ab. Wachsender Radius bei fallender Alpha
       laeuft weich in den dunklen Hintergrund aus.
       Groesster Blur 24px = 12px Reichweite, passt in die 14px Luft, die das
       Padding am Scroll-Container laesst — sonst clippt overflow ihn wieder. */
    box-shadow:
        0 0 3px rgba(29, 92, 142, 0.40),
        0 0 8px rgba(29, 92, 142, 0.26),
        0 0 16px rgba(29, 92, 142, 0.15),
        0 0 24px rgba(29, 92, 142, 0.07);
}

/* Search result highlights */
.component-fulltext-simple mark {
    background: rgba(29, 92, 142, 0.15);
    color: inherit;
    border-radius: 2px;
    padding: 0 2px;
    font-style: normal;
}

/* Back to top button */
#back-to-top {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 9999;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: var(--ba-blue-600);
    color: var(--ba-text-on-brand);
    font-size: 22px;
    line-height: 44px;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
    transition: opacity 0.3s ease, background 0.2s ease;
    padding: 0;
}
#back-to-top:hover {
    background: #215d8c;
    opacity: 0.85;
}
@media (max-width: 767px) {
    #back-to-top {
        bottom: 16px;
        right: 16px;
    }
}

/* Floating Labels (#4)
--------------------------------------------------------------------------------------------------------------------- */
.formo-input.control-group,
.formo-password.control-group,
.formo-textarea.control-group {
    position: relative;
    padding-top: 18px;
}

.formo-input > .control-label,
.formo-password > .control-label,
.formo-textarea > .control-label {
    position: absolute;
    top: 27px;
    left: 13px;
    font-size: 14px;
    color: var(--ba-grey-500);
    font-weight: 400;
    pointer-events: none;
    transition: top 0.18s ease, font-size 0.18s ease, color 0.18s ease;
    z-index: 2;
    margin: 0;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 26px);
}

.formo-input.fl-active > .control-label,
.formo-input.fl-filled > .control-label,
.formo-password.fl-active > .control-label,
.formo-password.fl-filled > .control-label,
.formo-textarea.fl-active > .control-label,
.formo-textarea.fl-filled > .control-label {
    top: 3px;
    font-size: 11px;
    color: var(--ba-blue-600);
}

.formo-input.fl-active .form-control,
.formo-password.fl-active .form-control,
.formo-textarea.fl-active .form-control {
    border-color: var(--ba-blue-600);
}

/* Reading progress bar (article pages) */
#reading-progress-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 6px;
    background: linear-gradient(to right, var(--ba-blue-600), var(--ba-blue-500));
    z-index: 1000;
    transition: width 0.08s linear;
    pointer-events: none;
}

/* ============================================================
   Welle 1 — Mock-Pluspunkte aus BIKE AID Design System
   ============================================================ */

/* #2 Event-Status-Tags — farbige Pills je Kategorie-Slug
------------------------------------------------------- */
.component-event-list .item .category {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 12px;
    background: #ececec;
    color: var(--ba-grey-700);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.component-event-list .item .category img {
    width: 12px;
    height: 12px;
    margin: 0;
}
.component-event-list .item .category.category-mtb            { background: #e8f3df; color: #3a6e1c; }
.component-event-list .item .category.category-pro-cycling,
.component-event-list .item .category.category-pro            { background: #fce4e3; color: var(--ba-red-600); }
.component-event-list .item .category.category-ctf-rtf,
.component-event-list .item .category.category-ctf            { background: #fdf0d4; color: #8a5f00; }
.component-event-list .item .category.category-rr,
.component-event-list .item .category.category-rennrad        { background: #e6eef6; color: var(--ba-link); }
.component-event-list .item .category.category-community      { background: #ecf3f9; color: var(--ba-link); }
.component-event-list .item .category.category-partner-mitglieder,
.component-event-list .item .category.category-partner-foerderer { background: #f1ece6; color: #6b4a00; }

/* #4 Play-Overlay — ▶-Kreis auf Video-Artikel-Teasern
------------------------------------------------------- */
.component-article-archive .image .play-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0);
    transition: background 0.2s ease;
    pointer-events: none;
    border-radius: 4px;
}
.component-article-archive .item:hover .image .play-overlay {
    background: rgba(0, 0, 0, 0.15);
}
.component-article-archive .image .play-overlay .circ {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ba-blue-900);
    font-size: 22px;
    padding-left: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* #6 Pagination-Bar — Restyle des bestehenden .pager
------------------------------------------------------- */
.component-pagination .pager {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 40px 0;
    padding: 0;
    border-top: none;
    list-style: none;
}
.component-pagination .pager li {
    display: inline-block;
    margin: 0;
}
.component-pagination .pager li > a,
.component-pagination .pager li > span {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid var(--ba-grey-300);
    border-radius: 4px;
    background: var(--ba-white);
    color: var(--ba-grey-900);
    font-size: 13px;
    line-height: 1.4;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.component-pagination .pager li > a:hover {
    background: var(--ba-grey-50);
    color: var(--ba-blue-900);
    border-color: var(--ba-blue-600);
    text-decoration: none;
}
.component-pagination .pager li > span {
    color: var(--ba-grey-500);
    border-color: transparent;
    background: transparent;
}
.component-pagination .pager li.disabled > a,
.component-pagination .pager li.disabled > a:hover {
    opacity: 0.4;
    pointer-events: none;
    background: var(--ba-surface);
    color: var(--ba-text);
    border-color: var(--ba-border-strong);
}
.component-pagination .pager li.previous > a i,
.component-pagination .pager li.next > a i {
    font-style: normal;
}

/* #8 Scroll-Indicator — animierter ↓-Pfeil im Hero
------------------------------------------------------- */
.big-header .scroll-indicator {
    position: absolute;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: 42px;
    height: 22px;
    z-index: 3;
    animation: bounce 2s ease infinite;
    opacity: 0.9;
    pointer-events: none;
}
.big-header .scroll-indicator svg {
    width: 100%;
    height: 100%;
    stroke: var(--ba-white);
    fill: none;
}
@keyframes bounce {
    0%, 100% { transform: translate(-50%, 0); }
    50%      { transform: translate(-50%, 8px); }
}
@media (prefers-reduced-motion: reduce) {
    .big-header .scroll-indicator { animation: none; }
}

/* #9 Member Role Badges — Mitglieds-Status-Pills
------------------------------------------------------- */
.member-roles {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.role-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 12px;
    background: #e6eef6;
    color: var(--ba-blue-900);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.role-badge--pro { background: var(--ba-red-600); color: var(--ba-text-on-brand); }
.role-badge--ctf { background: #f5d59a; color: #6b4a00; }
.role-badge--mtb { background: #e8f3df; color: #3a6e1c; }
/* ============================================================
   Welle 2 — Saison-Pass + Profile Pill-Tabs
   ============================================================ */
.saison-pass-wrap { padding-bottom: 30px; margin-top: 10px; }
.saison-pass {
    position: relative;
    display: grid;
    /* Dritte Spalte auf `auto`: ohne den frueheren 130px-Fortschrittsring braucht
       die Kennzahl keine feste 220px-Spalte mehr und liess sonst Leerraum stehen. */
    grid-template-columns: 140px 1fr auto;
    gap: 28px;
    align-items: center;
    background: linear-gradient(135deg, var(--ba-white) 0%, var(--ba-tint-50) 100%);
    border: 1px solid #d8e1ea;
    border-left: 6px solid var(--ba-red-600);
    border-radius: 6px;
    padding: 28px 32px;
    box-shadow: 0 2px 12px rgba(0,56,106,0.06);
    overflow: hidden;
}
.saison-pass .sp-stamp {
    position: absolute; right: -30px; top: -30px; opacity: 0.06;
    width: 240px; transform: rotate(12deg);
    pointer-events: none;
}
.saison-pass .sp-stamp img { width: 100%; height: auto; }

.sp-photo { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.sp-photo-disc {
    width: 110px; height: 110px; border-radius: 50%;
    background: var(--ba-blue-900); color: var(--ba-text-on-brand);
    display: flex; align-items: center; justify-content: center;
    font-family: 'Roboto Slab', serif; font-weight: 300; font-size: 42px;
    box-shadow: 0 0 0 4px var(--ba-white), 0 0 0 6px var(--ba-red-600);
    letter-spacing: -1px;
    text-transform: uppercase;
}
.sp-photo-disc.has-img { padding: 0; overflow: hidden; background: var(--ba-white); }
.sp-photo-disc.has-img img {
    width: 100%; height: 100%;
    object-fit: cover; border-radius: 50%;
    display: block;
}
.sp-since { font-size: 11px; color: var(--ba-text-muted); text-transform: uppercase; letter-spacing: 0.6px; font-weight: 600; }

.sp-eyebrow { font-size: 11px; color: var(--ba-accent-text); font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 6px; }
.sp-name {
    font-family: 'Roboto Slab', serif; font-weight: 300;
    font-size: 38px; color: var(--ba-text-strong); margin: 0 0 14px;
    line-height: 1;
}
.sp-roles { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.sp-role {
    font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 12px;
    background: #e6eef6; color: var(--ba-blue-900); text-transform: uppercase; letter-spacing: 0.4px;
    display: inline-block;
}
.sp-role.pro { background: var(--ba-red-600); color: var(--ba-text-on-brand); }
.sp-meta { display: flex; gap: 22px; flex-wrap: wrap; font-size: 12px; color: var(--ba-text-label); }
.sp-meta strong { color: var(--ba-text-strong); font-weight: 700; margin-right: 4px; }

/* Ohne den frueheren Fortschrittsring steht die Zahl im Fluss, nicht mehr
   absolut in der Ringmitte. */
.sp-stat {
    text-align: center;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.sp-stat-num {
    font-family: 'Roboto Slab', serif; font-weight: 200;
    font-size: 50px; color: var(--ba-accent-text); line-height: 1;
}
.sp-stat-lbl { font-size: 11px; color: var(--ba-text-label); line-height: 1.35; margin-top: 6px; font-weight: 600; }
.sp-stat-next { font-size: 11px; color: var(--ba-accent-text); font-weight: 700; margin-top: 4px; letter-spacing: 0.3px; }

@media (max-width: 767px) {
    .saison-pass { grid-template-columns: 1fr; text-align: center; padding: 22px 18px; gap: 20px; }
    .saison-pass .sp-stamp { width: 160px; right: -24px; top: -24px; }
    .saison-pass .sp-photo, .saison-pass .sp-id, .saison-pass .sp-stat { justify-content: center; align-items: center; }
    .saison-pass .sp-roles, .saison-pass .sp-meta { justify-content: center; }
    .sp-name { font-size: 30px; }
}

/* ----- Profile Pill-Tabs ----- */
.profile-tabs .pt-tabs {
    display: flex; gap: 8px; margin: 0 0 28px;
    flex-wrap: wrap;
}
.profile-tabs .pt-tab {
    border: 0; cursor: pointer;
    padding: 9px 22px;
    border-radius: 999px;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px; font-weight: 700;
    letter-spacing: 0.3px;
    background: #eef3f8; color: var(--ba-text-label);
    transition: background .15s, color .15s, transform .1s;
}
.profile-tabs .pt-tab:hover { background: #e2ebf3; color: var(--ba-text-strong); }
.profile-tabs .pt-tab:active { transform: scale(0.97); }
.profile-tabs .pt-tab.is-active { background: var(--ba-blue-900); color: var(--ba-text-on-brand); }
.profile-tabs .pt-panel { display: none; }
.profile-tabs .pt-panel.is-active { display: block; }
.profile-tabs .pt-lede {
    font-size: 14px; color: var(--ba-text-label); max-width: 560px;
    margin: -6px 0 28px;
}

/* ----- FAQ (Tab "Hilfe" + Einsteiger-Hinweis im Konto-Tab) ----- */
.faq-list { max-width: 720px; }
.faq-item {
    border-bottom: 1px solid var(--ba-border);
    padding: 0;
}
.faq-item:first-child { border-top: 1px solid var(--ba-border); }
.faq-nudge .faq-item:last-child { border-bottom: 0; }
.faq-item > summary {
    cursor: pointer;
    list-style: none;
    padding: 14px 34px 14px 0;
    position: relative;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px; font-weight: 700;
    color: var(--ba-text-strong);
}
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary::after {
    content: '+';
    position: absolute; right: 6px; top: 50%;
    transform: translateY(-50%);
    font-size: 20px; font-weight: 400; line-height: 1;
    color: var(--ba-blue-500);
    transition: transform .15s;
}
.faq-item[open] > summary::after { content: '–'; }
.faq-item > summary:hover { color: var(--ba-blue-500); }
.faq-answer {
    padding: 0 34px 16px 0;
    font-size: 14px; line-height: 1.6;
    color: var(--ba-text-label);
}
.faq-answer a { text-decoration: underline; }

.faq-nudge {
    position: relative;
    border: 1px solid var(--ba-border-strong);
    border-left: 3px solid var(--ba-red-600);
    background: var(--ba-surface-tint);
    padding: 22px 24px 10px;
    margin: 0 0 32px;
    border-radius: 2px;
}
.faq-nudge[hidden] { display: none; }
.faq-nudge-title {
    font-size: 18px; margin: 0 0 4px;
}
.faq-nudge-sub {
    font-size: 13px; color: var(--ba-text-label);
    margin: 0 0 14px; max-width: 520px;
}
.faq-nudge .faq-list { max-width: none; }
.faq-nudge-close {
    position: absolute; top: 10px; right: 10px;
    width: 30px; height: 30px;
    border: 0; background: transparent;
    font-size: 22px; line-height: 1;
    color: var(--ba-text-label); cursor: pointer;
    border-radius: 50%;
}
.faq-nudge-close:hover { background: #e2ebf3; color: var(--ba-text-strong); }

/* ============================================================
   Welle 2.5 — Profile-Page-Inhalt (Benefits / Termine / Footer)
   ============================================================ */

/* ----- Konto: Pic-Placeholder neben Daten ----- */
.kontouebersicht .konto-row {
    display: flex; gap: 50px; flex-wrap: wrap; align-items: flex-start;
}
.kontouebersicht .konto-row-main { flex: 1; min-width: 280px; }
.kontouebersicht .pic-placeholder {
    width: 140px; height: 160px; background: #ecf3f9; border: 1px solid #c7dbeb;
    display: flex; align-items: center; justify-content: center;
    color: var(--ba-blue-500); font-size: 40px; font-family: 'Roboto Slab', serif; font-weight: 700;
    border-radius: 2px;
    text-transform: uppercase;
}
/* ----- Kontaktdaten: label-lose Werte-Liste ----- */
.kontouebersicht .konto-facts {
    list-style: none; padding: 0; margin: 0 0 20px;
}
.kontouebersicht .konto-facts li {
    color: var(--ba-text); font-size: 15px; line-height: 1.55; padding: 1px 0;
}
.kontouebersicht .konto-facts .kf-mail {
    font-weight: 600; color: var(--ba-text-strong);
}

/* ----- Benefits-Grid ----- */
.benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.benefit-card {
    position: relative;
    background: var(--ba-surface);
    border: 1px solid #e2ebf3;
    border-radius: 10px;
    padding: 22px 22px 18px;
    display: flex; flex-direction: column; gap: 8px;
    transition: border-color .2s, transform .15s, box-shadow .2s;
}
.benefit-card:hover { border-color: #c0d5e7; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(15,40,70,0.08); }
.benefit-card .bc-icon {
    width: 36px; height: 36px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #e7f4ec; color: #1a8a3a;
    font-size: 22px; font-weight: 300; line-height: 1;
}
.benefit-card.upgrade .bc-icon { background: #fff4e0; color: #b97300; }
.benefit-card .bc-status {
    position: absolute; top: 22px; right: 22px;
    font-size: 10px; font-weight: 700; letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #1a8a3a;
}
.benefit-card.upgrade .bc-status { color: #b97300; }
.benefit-card h3 {
    font-family: 'Roboto Slab', serif; font-weight: 400;
    font-size: 18px; line-height: 1.25; margin: 4px 0 0; color: var(--ba-text-strong);
}
.benefit-card p {
    font-size: 13px; line-height: 1.55; color: var(--ba-text-label);
    margin: 0; flex: 1;
}
.benefit-card .bc-cta {
    font-size: 12px; font-weight: 700; color: var(--ba-red-600);
    letter-spacing: 0.3px; cursor: pointer; margin-top: 6px;
    text-decoration: none;
}
.benefit-card .bc-cta:hover { color: var(--ba-blue-600); }

/* ----- Termine: Event-Cards (My Calendar) ----- */
.mc-strip {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px;
}
.mc-strip.in-tab { margin-top: 8px; }
.mc-card {
    position: relative;
    background: var(--ba-surface); border: 1px solid #e3e9ef; border-radius: 4px;
    padding: 14px 14px 12px; display: flex; gap: 12px;
    text-decoration: none; transition: box-shadow .15s, transform .15s;
    color: inherit;
}
.mc-card:hover { box-shadow: 0 4px 14px rgba(0,56,106,0.1); transform: translateY(-2px); text-decoration: none; }
.mc-card.next { border-color: var(--ba-red-600); border-width: 2px; }

.mc-date {
    flex: 0 0 auto; width: 50px; text-align: center;
    background: var(--ba-tint-50); border-radius: 3px; padding: 6px 0;
    display: flex; flex-direction: column; gap: 0;
}
.mc-card.next .mc-date { background: var(--ba-red-600); color: var(--ba-text-on-brand); }
.mc-date .d { font-family: 'Roboto Slab', serif; font-weight: 300; font-size: 24px; line-height: 1; color: var(--ba-text-strong); }
.mc-date .m { font-size: 10px; text-transform: uppercase; letter-spacing: 0.8px; font-weight: 700; color: var(--ba-text-muted); margin-top: 2px; }
.mc-card.next .mc-date .d, .mc-card.next .mc-date .m { color: var(--ba-text-on-brand); }

.mc-body { flex: 1; min-width: 0; }
.mc-tag {
    display: inline-block; font-size: 9px; font-weight: 700;
    letter-spacing: 0.6px; text-transform: uppercase;
    padding: 2px 6px; border-radius: 2px; margin-bottom: 4px;
}
.mc-tag.pro { background: var(--ba-red-600); color: var(--ba-text-on-brand); }
.mc-tag.ctf { background: var(--ba-gold-500); color: #5a4400; }
.mc-tag.mtb { background: var(--ba-blue-500); color: var(--ba-text-on-brand); }

.mc-body h3 {
    font-family: 'Open Sans', sans-serif; font-weight: 700;
    font-size: 13px; color: var(--ba-text-strong); margin: 0 0 6px; line-height: 1.3;
}
.mc-loc { font-size: 11px; color: var(--ba-text-muted); display: flex; gap: 4px; align-items: center; margin-bottom: 6px; }
.mc-loc svg { width: 11px; height: 11px; flex: 0 0 auto; }

.mc-status { font-size: 11px; color: var(--ba-text-label); margin-bottom: 8px; display: flex; align-items: center; gap: 5px; }
.mc-status .dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.mc-status .dot.ok { background: #1a8a3a; }
.mc-status .dot.wait { background: var(--ba-gold-500); }

.mc-actions { display: flex; gap: 4px; flex-wrap: wrap; }
.mc-act {
    font-size: 10px; font-weight: 700; padding: 4px 7px; border-radius: 2px;
    background: var(--ba-tint-50); color: var(--ba-blue-900); cursor: pointer;
    text-transform: uppercase; letter-spacing: 0.4px;
    text-decoration: none;
}
.mc-act.primary { background: var(--ba-blue-900); color: var(--ba-text-on-brand); }
.mc-act.danger { background: transparent; color: var(--ba-red-600); }
.mc-act:hover { filter: brightness(0.95); text-decoration: none; }

.mc-card.add {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: transparent; border: 2px dashed var(--ba-border-strong); color: var(--ba-text-muted);
    text-align: center; padding: 18px;
}
.mc-card.add:hover { border-color: var(--ba-link-hover); color: var(--ba-link-hover); transform: none; box-shadow: none; }
.mc-add-icon { font-size: 36px; line-height: 1; font-weight: 200; margin-bottom: 6px; }
.mc-add-text { font-size: 12px; font-weight: 700; }
.mc-add-sub { font-size: 11px; margin-top: 2px; opacity: 0.7; }

/* ----- QR-Ticket-Teaser pro Event-Karte (Account → Termine) ----- */
.mc-status .dot { background: #c2ccd6; }
.mc-card.is-past { opacity: 0.62; }
.mc-card.is-past:hover { transform: none; box-shadow: none; }
.mc-ticket {
    display: flex; align-items: center; gap: 10px;
    margin: 4px 0 10px; padding: 8px;
    border: 1px solid #e3e8ee; border-radius: 8px;
    background: #f7f9fb; text-decoration: none;
}
.mc-ticket:hover { border-color: var(--ba-blue-900); background: #eef3f8; text-decoration: none; }
.mc-qr {
    width: 76px; height: 76px; flex: 0 0 auto; display: block;
    background: var(--ba-white); padding: 4px; border-radius: 4px; border: 1px solid #eef1f5;
}
.mc-ticket-cta {
    font-size: 12px; font-weight: 700; color: var(--ba-blue-900);
    display: flex; align-items: center; gap: 6px;
    text-transform: uppercase; letter-spacing: 0.4px;
}
.mc-ticket-arrow { font-size: 15px; line-height: 1; }

/* ----- Profile-Footer: Aktivität + Impact ----- */
.profile-footer {
    display: grid; grid-template-columns: 1fr;
    gap: 18px; margin-top: 36px;
}
.el-card {
    background: var(--ba-surface); border: 1px solid #e3e9ef; border-radius: 4px;
    padding: 22px 24px;
}
.el-title {
    font-family: 'Roboto Slab', serif; font-weight: 300;
    font-size: 20px; color: var(--ba-text-strong); margin: 0 0 16px;
    padding-bottom: 10px; border-bottom: 2px solid var(--ba-red-600);
    display: inline-block;
}
.impact-num {
    font-family: 'Roboto Slab', serif; font-weight: 200;
    font-size: 64px; color: var(--ba-accent-text); line-height: 1;
    letter-spacing: -2px;
}
.impact-sub { font-size: 12px; color: var(--ba-text-muted); font-weight: 600; }
.pt-note { font-size: 12px; color: var(--ba-text-muted); margin-top: 16px; }

/* ----- Welle-2.5 Responsive ----- */
@media (max-width: 991px) {
    .benefits-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
    .profile-footer { grid-template-columns: 1fr; }
    .kontouebersicht .konto-row { gap: 24px; }
    .kontouebersicht .konto-row-aside { width: 100%; display: flex; justify-content: center; }
}
@media (max-width: 600px) {
    .benefits-grid { grid-template-columns: 1fr; }
    .mc-strip { grid-template-columns: 1fr; }
}

/* ----- Einstieg zur QR-Flaeche auf dem Saison-Pass (oben rechts) -----
   Hiess bis 2026-07-29 .sp-pdf und fuehrte auf einen href="#". Es gibt bewusst
   keinen PDF-Download fuer den Pass: er entsteht nur durch einen Seitenaufruf
   und ist damit immer der Token der laufenden Saison. Das Offline-Druckstueck
   ist das Event-Ticket aus der Mail. */
.sp-qr-link {
    position: absolute; top: 14px; right: 14px; z-index: 2;
    min-height: 38px; border-radius: 19px;
    display: inline-flex; align-items: center; gap: 7px;
    padding: 0 14px 0 11px;
    background: var(--ba-white); color: var(--ba-blue-900);
    border: 1px solid #d8e1ea;
    box-shadow: 0 1px 4px rgba(0,56,106,0.10);
    transition: all 0.18s ease-in-out;
    text-decoration: none;
    font-size: 12px; font-weight: 700; letter-spacing: 0.4px; text-transform: uppercase;
}
.sp-qr-link svg { width: 19px; height: 19px; display: block; flex: 0 0 auto; }
.sp-qr-link:hover, .sp-qr-link:focus {
    background: var(--ba-blue-900); color: var(--ba-text-on-brand); border-color: var(--ba-blue-900);
    text-decoration: none;
}
@media (max-width: 767px) {
    /* Auf schmalen Schirmen wandert der Knopf unter den Kartenkopf: oben rechts
       sitzt dort der Logo-Stempel, und die Karte ist einspaltig zentriert. */
    .sp-qr-link { position: static; margin: 0 auto 4px; }
}

/* ============================================================
   Welle 2.5 Fix — Profile-Page Layout
   - Header rendert normal (Hero-Bild + weiße rounding-Welle wie auf
     den übrigen Seiten); nur der Scroll-Indikator entfällt hier
   - zieht Inhalts-Spalte auf volle Breite (Sidebar versteckt)
   ============================================================ */
.l-sub:has(.component-account-overview) .big-header .scroll-indicator {
    display: none;
}
.l-sub:has(.component-account-overview) .l-content .col-md-8,
.l-sub:has(.component-account-overview) .l-content .col-lg-8 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
.l-sub:has(.component-account-overview) .l-content .col-lg-1,
.l-sub:has(.component-account-overview) .l-content .sidebar {
    display: none;
}
.component-account-overview {
    max-width: 1100px;
    margin: 0 auto;
}

/* ============================================================
   Social-Media-Strip auf Startseite (Helper_Socialmedia_Feed)
   ============================================================ */
.social-strip {
    margin: 30px 0 24px;
    width: 100%;
}
.social-strip__rail {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 4px 10px;
    border-bottom: 1px solid #eaeaea;
    margin-bottom: 14px;
}
.social-strip__label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ba-blue-600);
}
.social-strip__cta {
    font-size: 12px;
    color: #d62976;
    text-decoration: none;
}
.social-strip__cta:hover {
    color: #962fbf;
    text-decoration: underline;
}

/* Sidewinder = horizontal scroll */
.social-strip--sidewinder .social-strip__grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(240px, 1fr);
    gap: 14px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 8px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}
.social-strip--sidewinder .sp-card {
    scroll-snap-align: start;
}
.social-strip--sidewinder .social-strip__grid::-webkit-scrollbar {
    height: 6px;
}
.social-strip--sidewinder .social-strip__grid::-webkit-scrollbar-thumb {
    background: var(--ba-grey-300);
    border-radius: 3px;
}

/* Inline = 3er-Reihe wie ein .col-md-4-Grid */
.social-strip--inline .social-strip__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
@media (max-width: 991px) {
    .social-strip--inline .social-strip__grid {
        grid-template-columns: 1fr;
    }
}

/* Social-Hub: Sparten-Filter als Pill-Toggles */
.social-hub__filter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 24px;
}
.social-hub__pill {
    display: inline-block;
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 1.2;
    color: var(--ba-red-600);
    background: var(--ba-surface);
    border: 1.5px solid var(--ba-grey-300);
    border-radius: 20px;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.social-hub__pill:hover { opacity: 0.75; }
.social-hub__pill.is-active {
    color: var(--ba-text-on-brand);
    background-color: var(--ba-primary);
    border-color: var(--ba-primary);
    font-weight: 600;
}
.social-hub__pill--all { font-weight: 600; }
.social-hub__pill--all.is-active {
    background-color: var(--ba-blue-900);
    border-color: var(--ba-blue-900);
}
@media (max-width: 767px) {
    .social-hub__filter { gap: 5px; margin-bottom: 18px; }
    .social-hub__pill { font-size: 12px; padding: 6px 12px; }
}

/* Component_Social_Strip: ein Channel als Karussell auf beliebiger Seite
   (Team-Landingpages). Nutzt strip.tpl, hier nur Wrapper-Feinheiten. */
.social-strip-section {
    margin: 40px 0 10px;
}
.social-strip-section__title {
    font-size: 26px;
    margin: 0 0 14px;
    color: var(--ba-blue-900);
}
.social-strip-section__more {
    margin: 12px 0 0;
    font-size: 13px;
    font-weight: 700;
}

/* Karten */
.sp-card {
    display: flex;
    flex-direction: column;
    background: var(--ba-white);
    border: 1px solid #ececec;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
    min-width: 0;
}
.sp-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
    border-color: #dcdcdc;
    text-decoration: none;
}

.sp-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
}
.sp-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--ba-grey-100);
    flex-shrink: 0;
}
.sp-id {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}
.sp-handle {
    font-size: 13px;
    font-weight: 600;
    color: #222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sp-meta {
    font-size: 11px;
    color: #888;
}
.sp-platform-tag {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 10px;
    flex-shrink: 0;
}
.sp-platform-tag--instagram {
    background: linear-gradient(45deg, #feda75, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5);
    color: var(--ba-text-on-brand);
}
.sp-platform-tag--facebook {
    background: #1877f2;
    color: var(--ba-text-on-brand);
}

.sp-media {
    aspect-ratio: 1 / 1;
    background-size: cover;
    background-position: center;
    background-color: var(--ba-surface-2);
}
.sp-facebook .sp-media {
    aspect-ratio: 16 / 10;
}
.sp-media--text {
    display: flex;
    align-items: center;
    justify-content: center;
}
.sp-grad-instagram {
    background: linear-gradient(135deg, #feda75 0%, #fa7e1e 30%, #d62976 60%, #962fbf 100%);
}
.sp-grad-facebook {
    background: linear-gradient(135deg, #1877f2 0%, #0a4ea8 100%);
}
.sp-quote-mark {
    font-family: Georgia, serif;
    font-size: 80px;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1;
    margin-top: -12px;
}

.sp-body {
    padding: 12px 14px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.sp-caption {
    font-size: 13px;
    line-height: 1.4;
    color: var(--ba-grey-900);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sp-stats {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: #777;
    margin-top: auto;
    padding-top: 4px;
    border-top: 1px solid #f3f3f3;
}
.sp-stat {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
/* Platform-Icon (Facebook/Instagram) — inline in der Meta-Zeile, links vom Datum. */
.sp-meta {
    display: flex;
    align-items: center;
    gap: 5px;
}
.sp-platform-icon {
    width: 13px;
    height: 13px;
    object-fit: contain;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .social-strip {
        margin: 20px 0 14px;
    }
    .social-strip--sidewinder .social-strip__grid {
        grid-auto-columns: minmax(200px, 75%);
        margin: 0 -15px;
        padding: 0 15px 8px;
    }
    .social-strip__rail {
        padding: 0 0 8px;
        border-bottom: none;
        margin-bottom: 8px;
    }
    .social-strip__label {
        font-family: 'Roboto Slab', serif;
        font-size: 18px;
        font-weight: 700;
        letter-spacing: normal;
        text-transform: none;
        color: var(--ba-blue-900);
    }
}

/* Team-Roster (Racing Riders)
--------------------------------------------------------------------------------------------------------------------- */
.team-roster-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
.team-roster-col {
    padding: 10px;
    display: flex;
}
.team-roster-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: var(--ba-white);
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.team-roster-card:hover,
.team-roster-card:focus {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    text-decoration: none;
}
.team-roster-card-archived {
    opacity: 0.7;
}
/* Karte ohne Default-Page: kein Link, also auch kein Hover-Lift und kein
   Zeiger-Cursor -- sonst verspricht die Karte einen Klick, der nichts tut. */
.team-roster-card-unlinked {
    cursor: default;
}
.team-roster-card-unlinked:hover,
.team-roster-card-unlinked:focus {
    transform: none;
    box-shadow: none;
}
.team-roster-card-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f0f2f5;
}
.team-roster-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Oben ausrichten, nicht mittig: die Fahrer-Portraits sind hochkant, ein
       zentrierter 1:1-Ausschnitt zeigt das Trikot statt des Gesichts. */
    object-position: 50% 0;
    display: block;
}
.team-roster-card-body {
    padding: 14px 16px 16px;
}
.team-roster-card-name {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.25;
    color: var(--ba-blue-900);
}
.team-roster-card-meta {
    margin-bottom: 10px;
}
.team-roster-card-city {
    margin: 0 0 4px;
    color: var(--ba-grey-700);
    font-size: 13px;
    line-height: 1.4;
}
/* Funktionsbezeichnung ("Sportlicher Leiter") auf Betreuer-Karten -- etwas
   kraeftiger als der Wohnort, weil sie dort die Hauptinformation ist. */
.team-roster-card-position {
    margin: 0 0 4px;
    color: var(--ba-grey-900);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}
.team-roster-card-bio {
    margin: 0;
    color: var(--ba-grey-700);
    font-size: 13px;
    line-height: 1.5;
}
.team-roster-badge {
    display: inline-block;
    margin: 0 4px 4px 0;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: var(--ba-blue-900);
    color: var(--ba-text-on-brand);
    border-radius: 3px;
}
.team-roster-badge-discipline { background: var(--ba-blue-900); }
.team-roster-badge-season     { background: #6c757d; }
.team-roster-badge-nat        { background: #495057; }
.team-roster-badge-club       { background: #6c757d; }
/* Betreuer-Badge in Vereinsrot -- unterscheidet Staff auf einen Blick von den
   Disziplin-Badges der Fahrer (Team-Bereiche 2026-08). */
.team-roster-badge-staff      { background: var(--ba-red-600); }
.team-roster-pagination {
    margin-top: 24px;
    text-align: center;
}

/* Redaktionelle Tabellen in Text-Komponenten (z. B. Rennkalender der
   Team-Bereiche): CKEditor liefert nacktes <table> ohne Klassen, ohne dieses
   Styling kleben die Spalten aneinander. */
.component-text table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0 20px;
    font-size: 14px;
}
.component-text table th {
    text-align: left;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.05em;
    background: var(--ba-blue-900);
    color: var(--ba-text-on-brand);
    padding: 9px 14px;
}
.component-text table td {
    padding: 9px 14px;
    border-top: 1px solid #e3e3e3;
    font-variant-numeric: tabular-nums;
}
.component-text table tbody tr:nth-child(even) {
    background: #f4f7fa;
}

/* Teams-Hub: 3 Kacheln (Pro / Development / MTB) auf /teams.
   Markup liegt als HTML in einer Component_Text (Seite 330), die Klassen
   kommen aus dem Team-Bereiche-Entwurf 2026-08. Statisches Kachel-Grid,
   bewusst kein Karussell: bei drei Kacheln gibt es nichts zu sliden. */
.teams-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
    margin: 10px 0 30px;
}
.teams-hub-tile {
    display: flex;
    flex-direction: column;
    background: var(--ba-white);
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    overflow: hidden;
    color: inherit;
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.teams-hub-tile:hover,
.teams-hub-tile:focus {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    text-decoration: none;
    color: inherit;
}
.teams-hub-tile-image {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f0f2f5;
}
.teams-hub-tile-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.25s ease;
}
.teams-hub-tile:hover .teams-hub-tile-image img {
    transform: scale(1.05);
}
.teams-hub-tile-body {
    display: block;
    padding: 16px 18px 18px;
    background: #ecf3f9;
    flex: 1;
}
.teams-hub-tile-body strong {
    display: block;
    margin: 0 0 6px;
    font-family: "Roboto Slab", Georgia, serif;
    font-weight: 400;
    font-size: 21px;
    color: var(--ba-blue-900);
}
.teams-hub-tile-text {
    display: block;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ba-grey-700);
}
.teams-hub-tile-cta {
    display: block;
    margin-top: 10px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ba-red-600);
}
.teams-hub-tile:hover .teams-hub-tile-cta {
    color: var(--ba-blue-600);
}

/* Team-Roster Detail
------------------------------------ */
.team-roster-detail-header {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 24px;
}
.team-roster-detail-image {
    flex: 0 0 240px;
    max-width: 240px;
}
.team-roster-detail-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    display: block;
}
.team-roster-detail-headline {
    flex: 1 1 300px;
}
.team-roster-detail-headline h1 {
    margin-top: 0;
}
.team-roster-detail-meta {
    margin: 8px 0 14px;
}
.team-roster-detail-bio {
    color: var(--ba-grey-700);
    line-height: 1.6;
}
.team-roster-detail-block {
    background: #fafbfc;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    padding: 16px 20px;
    margin-bottom: 20px;
}
.team-roster-detail-block h2 {
    margin-top: 0;
    font-size: 18px;
    color: var(--ba-blue-900);
}
/* Steckbrief-Kacheln (Optik aus dem Team-Bereiche-Entwurf 2026-08; ersetzen
   die frueheren dl-Karten "Persoenliches"/"Sportliches" in show.tpl). */
.team-roster-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 14px;
    max-width: 720px;
    margin: 0 0 24px;
}
.team-roster-stat {
    background: #fafbfc;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    padding: 12px 14px;
}
.team-roster-stat-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ba-grey-700);
}
.team-roster-stat-value {
    font-size: 17px;
    font-family: "Roboto Slab", Georgia, serif;
    font-weight: 400;
    color: var(--ba-blue-900);
    line-height: 1.4;
}
.team-roster-detail-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.team-roster-detail-links li a {
    display: inline-block;
    padding: 6px 12px;
    background: var(--ba-blue-900);
    color: var(--ba-text-on-brand);
    border-radius: 3px;
    text-decoration: none;
    font-size: 13px;
}
.team-roster-detail-links li a:hover,
.team-roster-detail-links li a:focus {
    background: #002a52;
    color: var(--ba-text-on-brand);
    text-decoration: none;
}
.team-roster-detail-pictures {
    margin-top: 24px;
}
.team-roster-detail-pictures img {
    width: 100%;
    height: auto;
    border-radius: 3px;
    margin-bottom: 16px;
}

/* ============================================================
   Welle 2.3 — Mitglieder-Verzeichnis (Tabelle) + Profileinstellungen
   ============================================================ */

/* ----- Verzeichnis: Tabelle statt Karten -----
   Das Verzeichnis ist ein Werkzeug zum Mitfahrer-Finden. Da zaehlt, dass man
   viele Zeilen ueberfliegen und vergleichen kann -- nicht Bildflaeche. */
.component-biker-list .bl-lede {
    color: var(--ba-text-muted);
    font-size: var(--ba-text-sm);
    margin-bottom: var(--ba-space-lg);
}
.biker-table-wrap { margin-top: var(--ba-space-lg); }
.biker-table { width: 100%; }
.biker-table thead th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--ba-slate-500);
    border-bottom: 2px solid var(--ba-border);
    white-space: nowrap;
}
.biker-table td { vertical-align: middle; }
.biker-table tbody tr:hover { background: var(--ba-surface-tint); }

.biker-table .bt-link {
    display: flex;
    align-items: center;
    gap: var(--ba-space-sm);
    text-decoration: none;
    color: inherit;
}
.biker-table .bt-link:hover { text-decoration: none; }
.biker-table .bt-avatar {
    flex: 0 0 auto;
    width: 36px; height: 36px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--ba-grey-100);
    display: block;
}
.biker-table .bt-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.biker-table .bt-avatar--none { box-shadow: inset 0 0 0 1px var(--ba-border); }
.biker-table .bt-names { display: flex; flex-direction: column; line-height: 1.3; }
.biker-table .bt-names strong { color: var(--ba-blue-900); }
.biker-table .bt-realname { font-size: 12px; color: var(--ba-text-muted); }
.biker-table .bt-setup {
    align-self: flex-start;
    margin-top: 2px;
    font-size: 10px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.5px;
    color: var(--ba-slate-600);
}

/* Disziplin- und Tages-Marken. Auch auf der Detailseite benutzt. */
.bt-tag, .bt-day {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: var(--ba-radius-pill);
    margin: 0 4px 3px 0;
    white-space: nowrap;
}
.bt-tag { background: #e6eef6; color: var(--ba-blue-900); }
.bt-day { background: var(--ba-grey-100); color: var(--ba-slate-600); min-width: 30px; text-align: center; }

.biker-table .bt-region,
.biker-table .bt-club { font-size: 13px; color: var(--ba-text); }
/* Beitrittsjahr: eine vierstellige Zahl, die nur beim Vergleichen ueber Zeilen
   hinweg etwas sagt -- deshalb Tabellenziffern und rechtsbuendig. */
.biker-table .bt-since {
    font-size: 13px;
    color: var(--ba-text-muted);
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}
/* Ziele stehen in der Namensspalte, nicht in einer eigenen: Freitext hat keine
   Spaltenbreite. Eine Zeile, danach Ellipse -- der ganze Text im Profil. */
.biker-table .bt-goals {
    font-size: 12px;
    color: var(--ba-text-muted);
    max-width: 32ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 767px) {
    /* Verein raus, bevor die Tabelle scrollt: die Disziplin ist die Angabe, nach
       der man sucht, der Verein die am ehesten verzichtbare. Beitrittsjahr und
       Ziel-Anriss aus demselben Grund -- beides ist Beiwerk zur Person und steht
       vollstaendig auf der Profilseite. */
    .biker-table .bt-club, .biker-table thead th.bt-club,
    .biker-table .bt-since, .biker-table thead th.bt-since { display: none; }
    .biker-table .bt-goals { display: none; }
}

.bd-setup { color: var(--ba-text); }
.bd-goals { color: var(--ba-text); }

/* ----- Profileinstellungen: Feldgruppen ----- */
.component-profile-settings .ps-block {
    border: 0;
    margin: 0 0 var(--ba-space-xl);
    padding: 0;
}
.component-profile-settings .ps-block legend {
    font-family: var(--ba-font-heading);
    font-weight: var(--ba-weight-light);
    font-size: 20px;
    color: var(--ba-blue-900);
    border: 0;
    border-bottom: 2px solid var(--ba-red-600);
    display: inline-block;
    width: auto;
    padding-bottom: 8px;
    margin-bottom: var(--ba-space-md);
}
.component-profile-settings .ps-hint {
    color: var(--ba-text-muted);
    font-size: var(--ba-text-sm);
    margin-bottom: var(--ba-space-md);
}
/* Mehrfachauswahlen. Formo rendert:
     .formo-checkboxes > label.control-label + .controls > label > input + span
   Nebeneinander statt untereinander -- sieben Wochentage in einer Spalte sind
   eine Wand. */
.component-profile-settings .ps-choices { margin-bottom: var(--ba-space-md); }
.component-profile-settings .ps-choices .control-label {
    display: block;
    font-weight: var(--ba-weight-bold);
    margin-bottom: 6px;
}
.component-profile-settings .ps-choices .controls {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin: 0;
}
.component-profile-settings .ps-choices .controls label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: var(--ba-weight-regular);
    margin: 0;
    cursor: pointer;
    white-space: nowrap;
}
.component-profile-settings .ps-choices .controls input[type="checkbox"] { margin: 0; }
.component-profile-settings .ps-choices--days .controls { gap: 6px 14px; }

/* ----- Profileinstellungen: Hauptschalter ----- */
/* is_public entscheidet ueber die vier Schalter darunter. Als gleich
   aussehende erste Listenzeile war das nicht abzulesen. */
.component-profile-settings .ps-master {
    background: var(--ba-surface-tint);
    border-left: 3px solid var(--ba-red-600);
    padding: 14px 16px;
    margin-bottom: var(--ba-space-md);
}
.component-profile-settings .ps-master .control-group.checkbox { margin: 0; }
.component-profile-settings .ps-master .control-label {
    font-weight: var(--ba-weight-bold);
    font-size: 16px;
    color: var(--ba-blue-900);
}
.component-profile-settings .ps-master-note {
    margin: 6px 0 0 25px;   /* 25px = das padding-left der Checkbox-Labels */
    color: var(--ba-text-muted);
    font-size: var(--ba-text-sm);
}
/* Die untergeordneten Schalter ruecken ein und haengen an einer Linie -- sie
   gehoeren sichtbar unter den Hauptschalter, nicht neben ihn. */
.component-profile-settings .ps-subs {
    padding-left: 16px;
    border-left: 1px solid var(--ba-border);
    transition: opacity .2s ease;
}
/* Nur gedimmt, nicht deaktiviert: siehe Kommentar in settings.tpl. */
.component-profile-settings .ps-subs.is-inactive { opacity: .55; }

/* ----- Profileinstellungen: mitlaufende Speichern-Leiste ----- */
.component-profile-settings .ps-savebar-sentinel { height: 1px; }
.component-profile-settings .ps-savebar {
    position: sticky;
    bottom: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--ba-space-md);
    margin-top: var(--ba-space-md);
    padding: 12px 0;
    background: var(--ba-surface);
    border-top: 1px solid var(--ba-border);
}
/* Schatten nur, solange die Leiste wirklich klebt -- an ihrem Endplatz unter
   dem letzten Feld waere er ein Strich ohne Anlass. */
.component-profile-settings .ps-savebar.is-stuck {
    box-shadow: 0 -6px 14px rgba(0, 0, 0, 0.08);
}
.component-profile-settings .ps-savebar-note {
    color: var(--ba-text-muted);
    font-size: var(--ba-text-sm);
    line-height: 1.3;
}
.component-profile-settings .ps-savebar .submit { margin: 0; flex: 0 0 auto; }

@media (max-width: 767px) {
    /* #back-to-top sitzt fix auf bottom/right 16px und ist 44px breit; ohne
       diese Reserve liegt es genau auf dem Speichern-Button. */
    .component-profile-settings .ps-savebar { padding: 8px 60px 8px 0; }
    /* Auf kleinen Schirmen frisst die Leiste sonst zu viel Hoehe -- der Button
       allein sagt schon, was er tut. */
    .component-profile-settings .ps-savebar-note { display: none; }
}

/* ----- Profileinstellungen: Feldhinweise als Fragezeichen ----- */
/* Die Erklaerungen standen als Fliesstext unter jedem Feld und machten das
   Formular fast doppelt so lang, obwohl man sie genau einmal liest. Jetzt
   stecken sie in einem Popover -- gleicher Mechanismus wie `.opt-help` im
   Mitgliedsantrag, andere Optik (graue Fuellung statt Konturkreis). */
.component-profile-settings .ps-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--ba-grey-100);
    color: var(--ba-slate-600);
    font-size: 11px;
    font-weight: var(--ba-weight-bold);
    line-height: 1;
    text-decoration: none;
    cursor: help;
    transition: background .15s ease, color .15s ease;
}
.component-profile-settings .ps-help:hover,
.component-profile-settings .ps-help:focus {
    background: var(--ba-blue-600);
    color: var(--ba-text-on-brand);
    text-decoration: none;
}
/* Am Feld haengt es oben rechts -- spiegelbildlich zum Floating Label, das
   links in derselben Zeile sitzt. `position: relative` auf die Gruppe, die
   steht sonst auf static.
   top: 18px ist der Abstand von der Gruppen- zur Feldoberkante. Gemessen, nicht
   geraten: er liegt bei Text-Input und Textarea gleich und aendert sich mit der
   Viewport-Breite nicht (geprueft bei 1200px und 375px).
   .ps-field markiert die Gruppen mit Fragezeichen -- nur dort braucht das Feld
   rechts Platz. Das Feld ist wegen der Altlast `.form-control { width: 97% }`
   schmaler als die Gruppe; auf breiten Schirmen liegt das Fragezeichen komplett
   in dieser Luecke, auf schmalen (dort sind es nur ~10px) ragt es ueber die
   Feldecke. Deshalb zusaetzlich padding-right, damit der Text nie darunter
   laeuft. */
.component-profile-settings .form-group { position: relative; }
.component-profile-settings .ps-field > .ps-help {
    position: absolute;
    top: 18px;
    right: 0;
    z-index: 2;
}
.component-profile-settings .ps-field .form-control { padding-right: 26px; }
/* In einer Checkbox-Zeile ist oben rechts kein Platz -- dort laeuft es im
   Textfluss mit. */
.component-profile-settings .ps-help--inline {
    position: static;
    margin-left: 4px;
    vertical-align: middle;
}
/* Checkbox-Zeile mit Fragezeichen. Ohne flex faellt das Fragezeichen auf die
   naechste Zeile: `.formo-checkbox` steht weiter oben in dieser Datei auf
   width:100% und ist damit blockbreit. Die absolut gesetzte Checkbox (Bootstrap
   positioniert sie gegen `.checkbox`) bleibt davon unberuehrt, sie ist aus dem
   Fluss. */
.component-profile-settings .ps-check {
    display: flex;
    align-items: baseline;
    gap: 4px;
}
.component-profile-settings .ps-check > .field { width: auto; }
.component-profile-settings .ps-inline-note {
    display: block;
    margin: 2px 0 0 25px;   /* 25px = das padding-left der Checkbox-Labels */
    color: var(--ba-text-muted);
    font-size: var(--ba-text-sm);
}
.component-profile-settings .ps-inline-note strong { color: var(--ba-text); }


/* Mitgliedsantrag (2026-08-01)
----------------------------------------------------------------------------------------------------------------------
   Verdichtung und buendige Feldkanten. Bewusst auf die Komponente begrenzt --
   Registrierung, Profileinstellungen und Passwortformular behalten ihr Layout. */

.component-biker-member-application h2 {
    font-size: 18px;
    margin: 26px 0 12px;
    padding-top: 14px;
    border-top: 1px solid #e5e5e5;
    letter-spacing: .01em;
}
.component-biker-member-application h2:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}
.component-biker-member-application .form-group { margin-bottom: 10px; }

/* Zweispaltiges Raster. align-items:start ersetzt .wide/.small, die als
   inline-block ohne vertical-align an der Textbasislinie hingen -- sobald ein
   Nachbarfeld sein Floating-Label hob, sass das Feld daneben tiefer. */
.component-biker-member-application .fld-row {
    display: grid;
    gap: 10px;
    margin-bottom: 10px;
    align-items: start;
}
.component-biker-member-application .fld-row > * { min-width: 0; }
.component-biker-member-application .fld-2   { grid-template-columns: 1fr 1fr; }
.component-biker-member-application .fld-3-1 { grid-template-columns: 3fr 1fr; }
.component-biker-member-application .fld-1-3 { grid-template-columns: 1fr 3fr; }

@media (max-width: 600px) {
    .component-biker-member-application .fld-row { grid-template-columns: 1fr; }
}

/* Zwei Altlasten weiter oben in dieser Datei machen das Feld schmaler als
   seine Zelle und hinterlassen eine breite Luecke rechts daneben:
     .component-form .control-group { width: 49% }  -- Zweispalten-Hack, nur
        innerhalb .form-group per 100% neutralisiert
     .form-control { width: 97% }
   Im Raster gibt die Spalte die Breite vor, das Feld fuellt sie ganz. */
.component-biker-member-application .fld-row > .control-group { width: 100%; }
.component-biker-member-application .form-control { width: 100%; }

.component-biker-member-application .form-control {
    height: 44px;
    line-height: 1.4;
}
.component-biker-member-application textarea.form-control { height: auto; }
.component-biker-member-application .control-group { margin-bottom: 0; }

/* Selects in dieselbe Floating-Label-Struktur holen. Weiter oben bekommen nur
   .formo-input/.formo-password/.formo-textarea das padding-top:18px fuer den
   Labelstreifen; ein .formo-select war dadurch 18px niedriger als ein Input
   daneben. Ein Select hat immer einen Wert, sein Label sitzt also fest oben. */
.component-biker-member-application .formo-select.control-group {
    position: relative;
    padding-top: 18px;
}
.component-biker-member-application .formo-select > .control-label {
    position: absolute;
    top: 3px;
    left: 13px;
    z-index: 2;
    margin: 0;
    font-size: 11px;
    line-height: 1.2;
    font-weight: var(--ba-weight-regular);
    color: #1d5c8e;
    pointer-events: none;
}

/* Hilfe-Knopf inline hinter dem Feld statt absolut positioniert.
   .btn-info steht weiter oben auf position:absolute; top:0; right:20px und
   liegt damit ueber dem Feldinhalt. */
.component-biker-member-application .fld-help-wrap { position: relative; }
.component-biker-member-application .opt-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    border-radius: 50%;
    border: 1px solid currentColor;
    font-size: 11px;
    line-height: 1;
    font-weight: var(--ba-weight-bold);
    opacity: .65;
    cursor: help;
    vertical-align: middle;
    text-decoration: none;
}
.component-biker-member-application .opt-help:hover,
.component-biker-member-application .opt-help:focus { opacity: 1; }
.component-biker-member-application .fld-help-wrap .opt-help {
    position: absolute;
    top: 0;
    right: 0;
}

/* Mitgliedschafts-Optionen als Karten */
.component-biker-member-application .formo-radios .controls {
    display: grid;
    gap: 8px;
    margin: 4px 0 12px;
}
.component-biker-member-application .formo-radios label.radio {
    display: block;
    position: relative;
    /* margin-left:20px steht weiter oben global auf label.radio und wuerde die
       Karte einruecken statt den Knopf. */
    margin: 0;
    padding: 12px 14px 12px 40px;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.component-biker-member-application .formo-radios label.radio:hover { border-color: #4789be; }
.component-biker-member-application .formo-radios label.radio input[type="radio"] {
    position: absolute;
    top: 15px;
    left: 15px;
    margin: 0;
}
.component-biker-member-application .fee-strike { opacity: .5; margin-right: 6px; }
.component-biker-member-application .fee-youth { color: #0b9a00; }

/* Zusatzpakete */
.component-biker-member-application .pkg { display: grid; gap: 8px; }
.component-biker-member-application .pkg-item {
    position: relative;
    padding: 10px 40px 10px 14px;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}
.component-biker-member-application .pkg-item:hover { border-color: #4789be; }
.component-biker-member-application .pkg-item .control-group { margin: 0; }

/* Die Checkbox steht global auf position:absolute und liegt sonst genau auf
   dem ersten Buchstaben der Beschriftung. */
.component-biker-member-application .pkg-item .formo-checkbox > .control-label { padding-left: 26px; }
.component-biker-member-application .pkg-item .formo-checkbox input[type="checkbox"] {
    left: 2px;
    top: 3px;
    margin: 0;
}
.component-biker-member-application .pkg-item .opt-help {
    position: absolute;
    top: 12px;
    right: 12px;
    margin: 0;
}

/* Beitragsuebersicht */
.component-biker-member-application .fee-box {
    margin: 18px 0 8px;
    padding: 12px 14px;
    border-radius: 4px;
    border: 1px solid #e5e5e5;
    background: rgba(29, 92, 142, .08);
    font-size: 14px;
}
.component-biker-member-application .fee-box dl {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 16px;
    margin: 0;
}
.component-biker-member-application .fee-box dt { font-weight: var(--ba-weight-regular); }
.component-biker-member-application .fee-box dd {
    margin: 0;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.component-biker-member-application .fee-box .fee-total {
    border-top: 1px solid #e5e5e5;
    margin-top: 6px;
    padding-top: 6px;
    font-weight: var(--ba-weight-bold);
}

.component-biker-member-application .submit-row { margin-top: 20px; }


/* Shop-Bestseller-Karussell (2026-08-29)
---------------------------------------------------------------------------------------------------------------------
   Kachelreihe im content-Container von /shop, getragen von FlexSlider. Struktur
   uebernommen vom Racing-Roster (.team-roster-card weiter oben); eigene Klassen,
   weil die Bildproportion und die Hover-Semantik andere sind -- der Roster
   richtet sein Portrait oben aus, ein Produktfoto gehoert mittig.
   --------------------------------------------------------------------------------------------------------------- */

.component-shop-bestseller { margin-bottom: 30px; }

.component-shop-bestseller .shop-bestseller-headline {
    margin: 0 0 18px;
    color: var(--ba-text-strong);
}

/* Das FlexSlider-Theme (media/css/flexslider/style.css) legt auf .flexslider
   einen weissen 4px-Rahmen mit Schlagschatten und 60px Bottom-Margin. Das ist
   fuer eine einzelne Bildbuehne gedacht -- um eine Kachelreihe zeichnet es
   einen weissen Kasten, im Dark Mode einen leuchtenden. */
.component-shop-bestseller .flexslider {
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0 0 18px;
}

/* Bis zu drei Kacheln sind gleichzeitig sichtbar -- Pfeile, die nichts
   bewegen, sind schlimmer als keine. */
.component-shop-bestseller.has-few-items .flex-direction-nav { display: none; }

/* Die Pfeile des Themes sind bis zum Hover unsichtbar UND ausserhalb des
   Rahmens geparkt (style.css: opacity 0, left/right -36px). Auf einer
   Bildbuehne ist das dezent, auf einer Produktreihe verschweigt es, dass rechts
   noch Artikel stehen. Hier also dauerhaft sichtbar. */
.component-shop-bestseller .flex-direction-nav .flex-prev { opacity: 0.8; left: 5px; }
.component-shop-bestseller .flex-direction-nav .flex-next { opacity: 0.8; right: 5px; }
.component-shop-bestseller .flex-direction-nav a:hover { opacity: 1; }

/* Flexbox auf .slides gibt allen Kacheln einer Reihe dieselbe Hoehe -- ohne das
   endet jede Karte dort, wo ihr Text aufhoert, und die Preiszeilen stehen
   treppenfoermig. FlexSlider setzt Breite und float per Inline-Style; die
   bleiben gueltig, flex-shrink muss aber aus, sonst quetscht der Flex-Container
   die Kacheln zusammen.
   Das display:block ist zusaetzlich der Rettungsanker fuer den Fall, dass die
   CSS laedt und das JS nicht: style.css versteckt .slides > li per Default,
   ohne diese Regel waere die Reihe dann komplett leer statt nur ungeslidet. */
.component-shop-bestseller .slides { display: flex; align-items: stretch; }
.component-shop-bestseller .slides > li {
    display: block;
    flex: 0 0 auto;
    height: auto;
}

.shop-bestseller-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--ba-surface);
    border: 1px solid var(--ba-border);
    border-radius: 4px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.shop-bestseller-card:hover,
.shop-bestseller-card:focus {
    transform: translateY(-3px);
    /* Schatten-Token statt eigenem rgba: im Dark Mode braucht er mehr Deckung,
       und genau das macht --ba-shadow dort schon. */
    box-shadow: var(--ba-shadow);
    text-decoration: none;
    color: inherit;
}

/* Weiss, nicht die uebliche Platzhalter-Flaeche: die owayo-Renderings sind
   PNGs mit TRANSPARENTEM Hintergrund (Alpha 127 in der Ecke), das Grau von
   --ba-surface-3 schien also durch und sah aus wie ein Grauschleier im Bild.
   Freisteller brauchen einen hellen Grund -- auch im Dark Mode, sonst
   verschwinden weisse Schriftzuege auf den Trikots. */
.shop-bestseller-card-image {
    position: relative;
    margin: 6px 6px 0;
    border-radius: 3px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--ba-white);
}
/* Spezifitaet 0,3,0 -- muss ".flexslider .slides img { height: auto }" weiter
   oben in dieser Datei schlagen, sonst laeuft das Bild aus dem Quadrat. */
.component-shop-bestseller .shop-bestseller-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.shop-bestseller-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    border-radius: 3px;
    background: var(--ba-primary);
    color: var(--ba-text-on-brand);
    font-size: 11px;
    font-weight: var(--ba-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.shop-bestseller-card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 12px 14px 14px;
}
.shop-bestseller-card-title {
    margin: 0 0 6px;
    font-size: 16px;
    line-height: 1.25;
    color: var(--ba-text-strong);
}
.shop-bestseller-card-teaser {
    margin: 0 0 10px;
    color: var(--ba-text-soft);
    font-size: 13px;
    line-height: 1.4;
}

/* Preisblock ans Kartenende, damit er ueber unterschiedlich lange Titel hinweg
   auf einer Linie steht. */
.shop-bestseller-price { margin: auto 0 2px; }
.shop-bestseller-price-regular {
    color: var(--ba-text);
    font-size: 15px;
    font-weight: var(--ba-weight-bold);
    font-variant-numeric: tabular-nums;
}
.shop-bestseller-price-regular.is-struck {
    text-decoration: line-through;
    color: var(--ba-text-muted);
    font-weight: var(--ba-weight-regular);
    font-size: 13px;
}

.shop-bestseller-price-member {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
}
.shop-bestseller-price-member-label {
    color: var(--ba-text-muted);
    font-size: 12px;
}
.shop-bestseller-price-member-value {
    color: var(--ba-text-strong);
    font-size: 17px;
    font-weight: var(--ba-weight-bold);
    font-variant-numeric: tabular-nums;
}
/* --ba-danger, NICHT --ba-accent-text: Letzteres hellt im Dark Mode zu
   --ba-red-300 auf -- richtig fuer Rot als Schrift, falsch als Flaeche hinter
   weisser Schrift. Steht so in tokens.css. */
.shop-bestseller-saving {
    padding: 2px 6px;
    border-radius: 3px;
    background: var(--ba-danger);
    color: var(--ba-text-on-brand);
    font-size: 11px;
    font-weight: var(--ba-weight-bold);
    white-space: nowrap;
}

.shop-bestseller-card-shop {
    margin: 8px 0 0;
    color: var(--ba-text-subtle);
    font-size: 12px;
}

.shop-bestseller-cta { margin: 0; }


/* Shop-Rabattcodes im Benefits-Tab (2026-08-29)
---------------------------------------------------------------------------------------------------------------------
   Karten neben den Zusatzpaketen (.benefits-grid weiter oben), aber eigene
   Klassen: hier ist der Code die Hauptinformation und muss abtippbar sein,
   dort ein Status.
   --------------------------------------------------------------------------------------------------------------- */

.pt-subhead {
    margin: 0 0 4px;
    font-size: 20px;
    color: var(--ba-text-strong);
}

.discount-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
    margin: 12px 0 28px;
}

/* Akzentlinie in Rot -- die Konvention des Bestands (tokens.css zu
   --ba-red-600: "Destruktiv, Anmelde-CTA, Akzentlinien"). Blau ist hier
   Text- und Flaechenfarbe, nicht die Kante. */
.discount-card {
    padding: 14px 16px;
    background: var(--ba-surface);
    border: 1px solid var(--ba-border);
    border-left: 3px solid var(--ba-danger);
    border-radius: 4px;
}

.dc-shop {
    margin-bottom: 6px;
    color: var(--ba-text-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.dc-code {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* Monospace und weite Laufweite: der Code wird abgetippt, und 0/O sowie 1/l
   sind in der Fliesstextschrift nicht zu unterscheiden. */
.dc-code-value {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 18px;
    font-weight: var(--ba-weight-bold);
    letter-spacing: 0.08em;
    color: var(--ba-text-strong);
    user-select: all;
}

.dc-copy {
    padding: 3px 10px;
    border: 1px solid var(--ba-border-strong);
    border-radius: 3px;
    background: var(--ba-surface-2);
    color: var(--ba-text-soft);
    font-size: 12px;
    line-height: 1.6;
    cursor: pointer;
}
.dc-copy:hover { border-color: var(--ba-primary); color: var(--ba-primary); }
.dc-copy.is-done { border-color: var(--ba-success); color: var(--ba-success); }

.dc-note {
    margin: 8px 0 0;
    color: var(--ba-text-soft);
    font-size: 13px;
    line-height: 1.4;
}

.dc-until {
    margin: 4px 0 0;
    color: var(--ba-text-subtle);
    font-size: 12px;
}


/* Container "content_wide" (2026-08-29)
---------------------------------------------------------------------------------------------------------------------
   Volle Breite ueber Inhalt UND Sidebar, direkt unter dem Header. Ausgegeben in
   views/page/default/fulltext.tpl, im Seiten-Editor sichtbar ueber
   config/templates.php. Bewusst mit derselben .container-Breite wie der Rest --
   randlos ueber den Viewport waere ein anderes Layout, nicht dasselbe eine
   Spalte breiter.
   --------------------------------------------------------------------------------------------------------------- */

.l-content-wide {
    padding-top: 30px;
}
.l-content-wide + .l-content {
    padding-top: 10px;
}
/* Dark Mode — BikeAid Frontend
   Activated by: [data-theme="dark"] on <html>
   Toggled by: #dark-mode-toggle + localStorage('bikeaid-theme')
   screen.css bleibt unangetastet — nur Overrides hier.
--------------------------------------------------------------------------------------------------------------------- */

/* Smooth transitions on theme switch
--------------------------------------------------------------------------------------------------------------------- */
body,
.navbar .container,
.navbar-collapse,
.l-content,
.l-footer,
.mobile-subnav,
.mobile-mainnav,
.component-partner,
.component-partner-footer,
.sidebar .component-donations-counter,
.component-eventhighlight-sidebar .well,
.navbar-nav > li > ul,
.dropdown-menu {transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* Dark Mode Toggle Button
   Layout (Position, Groesse, Paddings) steht komplett in screen.css beim
   Block "Utility-Icons" - hier nur der Mond/Sonne-Switch und die Farben.
--------------------------------------------------------------------------------------------------------------------- */
/* Light mode: Mond sichtbar, Sonne versteckt */
#dark-mode-toggle .icon-moon { display: block; }
#dark-mode-toggle .icon-sun  { display: none;  }

/* Dark mode: Sonne sichtbar, Mond versteckt */
[data-theme="dark"] #dark-mode-toggle {color: var(--ba-night-text);
    opacity: 0.75;
}
[data-theme="dark"] #dark-mode-toggle .icon-moon {display: none;
}
[data-theme="dark"] #dark-mode-toggle .icon-sun  {display: block;
}

/* Sprachwechsler (UCI-Pattern, Layout in screen.css) */
[data-theme="dark"] .lang-toggle {color: var(--ba-night-text);
}
[data-theme="dark"] .lang .dropdown-menu a {color: var(--ba-night-text);
}

/* Dark Mode Farb-Overrides
--------------------------------------------------------------------------------------------------------------------- */

/* HTML / Body */
[data-theme="dark"] {background-color: var(--ba-night-900);
    color-scheme: dark;
}
/* Der Wert faerbt zwei Dinge: den Overscroll-Bereich und — via Safari 26+ —
   die iOS-Statusleiste. Safari hat theme-color abgeschafft und nimmt seit 26
   die background-color von <body>; fixed Pseudo-Elemente werden dabei
   nachweislich ignoriert, <html> ebenfalls.
   Bewusst der Content-Ton (--ba-night-600, wie .l-content) und nicht die
   Erscheinung des Navbar-Glases (#334d5e ueber dem Hero): Safari sampelt nur
   einmal beim Laden, ein fester Wert kann also nur zu EINER Flaeche passen.
   Der Content gewinnt, weil man ihn beim Scrollen fast immer sieht — die
   Navbar dagegen nur am Seitenanfang.
   Folge: nach dem Theme-Toggle zieht die Statusleiste erst beim naechsten
   Aufruf nach. */
[data-theme="dark"] body {background-color: var(--ba-night-600);
    color: var(--ba-night-text);
}

/* Typografie */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4 {color: var(--ba-night-text-bright);
}
[data-theme="dark"] h1 a,
[data-theme="dark"] h2 a,
[data-theme="dark"] h3 a,
[data-theme="dark"] h4 a {color: var(--ba-night-text-bright);
}
[data-theme="dark"] h1.pagetitle {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .component-article-show h1 {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] hr {border-top-color: var(--ba-night-border);
    border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] p small {color: var(--ba-night-text-subtle);
}

/* Links */
[data-theme="dark"] a:link,
[data-theme="dark"] a:visited,
[data-theme="dark"] input[type="submit"].btn {color: var(--ba-white);
}
[data-theme="dark"] a:hover,
[data-theme="dark"] a:focus,
[data-theme="dark"] a:active {color: #5788BA;
}

/* Navbar Container */
[data-theme="dark"] .navbar .container {background-color: rgba(20,32,48,0.72);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 12px rgba(0,0,0,0.5);
    border-radius: 4px 30px 30px 4px;
}
@media (max-width: 991px) {
    [data-theme="dark"] .navbar .container,
    [data-theme="dark"] .navbar.affix .container {border-radius: 0 0 30px 30px;
        background-color: rgba(20,32,48,0.72);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
}
}
[data-theme="dark"] .navbar.affix .container {background-color: rgba(20,32,48,0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
[data-theme="dark"] .navbar-toggle {color: var(--ba-night-text);
}
[data-theme="dark"] .user-avatar-circle {border-color: var(--ba-night-text);
}

/* Navbar Nav Links */
[data-theme="dark"] .navbar-nav > li > a {color: var(--ba-white);
}
[data-theme="dark"] .navbar-nav > li.active > a,
[data-theme="dark"] .navbar-nav > li > a:hover,
[data-theme="dark"] .navbar-nav > li > a:focus,
[data-theme="dark"] .navbar-nav > li > a:active {color: var(--ba-night-link);
    background: none;
}
[data-theme="dark"] .navbar-nav > li.active ul {border-left-color: var(--ba-blue-500);
}
[data-theme="dark"] .navbar-nav > li.active ul li a {color: var(--ba-night-text);
}

/* Mobile Navbar Collapse — nur wenn offen oder animierend; kein box-shadow (würde beim Schließen als Streifen aufblitzen) */
@media (max-width: 991px) {
    [data-theme="dark"] .navbar-collapse.in,
    [data-theme="dark"] .navbar-collapse.collapsing {background-color: rgba(20,32,48,0.88);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
}
}

/* Navbar Cart */
[data-theme="dark"] #navbar-cart {color: var(--ba-night-text);
}

/* Navbar Search */
[data-theme="dark"] .navbar form button:hover {background-color: var(--ba-night-700);
}
[data-theme="dark"] .navbar form .form-control {background-color: var(--ba-night-700);
    border-color: var(--ba-night-border);
    color: var(--ba-night-text);
}
[data-theme="dark"] .navbar form.search-open {background: var(--ba-night-600);
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

/* Desktop Dropdown Subnav */
[data-theme="dark"] .navbar-nav > li > ul {background-color: var(--ba-night-600);
    border-color: var(--ba-night-border);
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}
[data-theme="dark"] .navbar-nav > li > ul > li {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .navbar-nav > li > ul > li a:hover {background-color: var(--ba-night-700);
}

/* Login Dropdown */
[data-theme="dark"] .navbar .dropdown-menu {background-color: var(--ba-night-600);
    border-color: var(--ba-night-border);
}
[data-theme="dark"] .navbar .user .dropdown-menu {border-top-color: var(--ba-night-border);
}

/* Main Content Area */
[data-theme="dark"] .l-content {background-color: var(--ba-night-600);
}
[data-theme="dark"] .l-footer {background-color: var(--ba-night-600);
}

/* Sidebar Navigation */
[data-theme="dark"] .sidebar .nav li {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .sidebar .nav li a {color: var(--ba-white);
}
[data-theme="dark"] .sidebar .nav li.active a,
[data-theme="dark"] .sidebar .nav li a:hover,
[data-theme="dark"] .sidebar .nav li a:focus,
[data-theme="dark"] .sidebar .nav li a:active {color: #5788BA;
}

/* Wells */
[data-theme="dark"] .well {border-color: var(--ba-night-border);
    background-color: var(--ba-night-700);
}
/* Welcome-Komponente: transparent lassen wie im Light Mode (Foto soll durchscheinen) */
[data-theme="dark"] .component-welcome .content.well {background: rgba(255,255,255,0);
    border-color: transparent;
    box-shadow: none;
}
[data-theme="dark"] .component-welcome .btn-secondary,
[data-theme="dark"] .component-welcome .btn-secondary:link,
[data-theme="dark"] .component-welcome .btn-secondary:visited {color: var(--ba-white);
}

/* Bootstrap Panels */
[data-theme="dark"] .panel {background-color: var(--ba-night-600);
    border-color: var(--ba-night-border);
}
[data-theme="dark"] .panel-heading {background-color: var(--ba-night-700) !important;
    border-bottom-color: var(--ba-night-border);
    color: var(--ba-night-text-bright);
}
[data-theme="dark"] .panel-body {background-color: var(--ba-night-600);
}
[data-theme="dark"] .panel-footer {background-color: var(--ba-night-700);
    border-top-color: var(--ba-night-border);
}

/* Formulare */
[data-theme="dark"] .form-control,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] input[type="url"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {background-color: var(--ba-night-700);
    border-color: var(--ba-night-border);
    color: var(--ba-night-text);
}
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {background-color: var(--ba-night-700);
    border-color: var(--ba-blue-500);
    color: var(--ba-night-text);
    box-shadow: 0 0 3px rgba(71,137,190,0.4);
}
[data-theme="dark"] .well-filedrop {background-color: var(--ba-night-700);
    border-color: var(--ba-night-border);
}
[data-theme="dark"] .component-profile-settings .btn-info {background-color: var(--ba-night-600);
}

/* Tabellen */
[data-theme="dark"] table {color: var(--ba-night-text);
}
[data-theme="dark"] .table > thead > tr > th,
[data-theme="dark"] .table > tbody > tr > th {background-color: var(--ba-night-700);
    border-bottom-color: var(--ba-night-border);
    color: var(--ba-night-text-bright);
}
[data-theme="dark"] .table > tbody > tr > td,
[data-theme="dark"] .table > tfoot > tr > td {border-top-color: var(--ba-night-border);
    color: var(--ba-night-text);
}
[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {background-color: var(--ba-night-700);
}
[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(even) {background-color: var(--ba-night-600);
}
[data-theme="dark"] .table-bordered,
[data-theme="dark"] .table-bordered > thead > tr > th,
[data-theme="dark"] .table-bordered > tbody > tr > td {border-color: var(--ba-night-border);
}
[data-theme="dark"] .table-hover > tbody > tr:hover {background-color: #1e2f45;
}

/* Pager / Pagination */
[data-theme="dark"] .pager li span {border-color: var(--ba-night-border);
    color: var(--ba-night-text-subtle);
}

/* Thumbnail Caption */
[data-theme="dark"] .thumbnail.caption {background-color: var(--ba-night-700);
}

/* Artikel-Teaser */
[data-theme="dark"] .component-article-archive .item h2 {background-color: var(--ba-night-600);
}
[data-theme="dark"] .component-article-archive .highlight h1 a,
[data-theme="dark"] .component-article-archive .item h2 a,
[data-theme="dark"] .component-article-archive p a {color: var(--ba-white);
}
[data-theme="dark"] .component-article-archive .highlight h1 a:hover,
[data-theme="dark"] .component-article-archive .highlight h1 a:focus,
[data-theme="dark"] .component-article-archive .item h2 a:hover,
[data-theme="dark"] .component-article-archive .item h2 a:focus,
[data-theme="dark"] .component-article-archive p a:hover,
[data-theme="dark"] .component-article-archive p a:focus {color: #5788BA;
}
[data-theme="dark"] .component-article-archive .teaser-image {background-color: var(--ba-night-700);
}
[data-theme="dark"] .component-article-archive .highlight small {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .results.list-unstyled > li {border-bottom-color: var(--ba-night-border);
}

/* Spotify Mobile Layout — Dark Mode */
[data-theme="dark"] .l-start .spotify-section {border-bottom-color: #1e2e3e;
}
[data-theme="dark"] .l-start .spotify-section-title {color: var(--ba-night-text);
}
[data-theme="dark"] .l-start .spotify-section-more {color: #5788ba;
}
[data-theme="dark"] .l-start .spotify-card-image {background-color: var(--ba-night-700);
}
[data-theme="dark"] .l-start .spotify-card-title {color: var(--ba-white);
}

/* Sitemap */
[data-theme="dark"] .component-sitemap .nav > li > a {background-color: var(--ba-night-600);
    color: var(--ba-night-link);
}
[data-theme="dark"] .component-sitemap .nav > li > a:hover {background-color: var(--ba-night-700);
}

/* Events */
[data-theme="dark"] .component-event-list .item {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .component-related-events .item {border-bottom-color: var(--ba-night-border);
}

/* Kalender */
[data-theme="dark"] .component-calendar table tr td.today,
[data-theme="dark"] .component-calendar table tr td:hover {background-color: var(--ba-night-500);
}

/* Event Sidebar Highlights */
[data-theme="dark"] .component-eventhighlight-sidebar .well {background-color: var(--ba-night-600);
    border-color: var(--ba-night-border);
}
[data-theme="dark"] .component-eventhighlight-sidebar .well h3 {color: var(--ba-white);
}

/* Forum */
[data-theme="dark"] .component-forum .item {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .component-forum .thread-item .heads {background-color: var(--ba-night-600);
}
[data-theme="dark"] .component-forum .highlight {background-color: #1e2e45 !important;
}
[data-theme="dark"] .component-forum .highlight .heads {background-color: #1e3550 !important;
}

/* Teilnehmerliste */
[data-theme="dark"] .participant-list img {border-color: var(--ba-night-border);
}
[data-theme="dark"] .participant-list a.biker,
[data-theme="dark"] .participant-list a.biker:hover,
[data-theme="dark"] .participant-list a.biker:visited {color: var(--ba-night-text);
}

/* Partner / Sponsoren */
[data-theme="dark"] .component-partner {background-color: var(--ba-night-600);
}
[data-theme="dark"] .component-partner-footer {background-color: var(--ba-night-600);
}

/* Spendenzähler Sidebar */
[data-theme="dark"] .sidebar .component-donations-counter {background-color: var(--ba-night-600);
    border-color: var(--ba-night-border);
    color: var(--ba-night-text);
}
[data-theme="dark"] .sidebar .component-donations-counter h2,
[data-theme="dark"] .sidebar .component-donations-counter p,
[data-theme="dark"] .sidebar .component-donations-counter .donation {color: var(--ba-night-text);
}

/* Suchergebnis-Markierung */
[data-theme="dark"] .component-fulltext-simple mark {background-color: rgba(122,179,217,0.2);
}

/* Mobile Subnav Strip */
[data-theme="dark"] .mobile-subnav {background-color: var(--ba-night-600);
    border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .mobile-subnav .nav li.active a {border-bottom-color: var(--ba-night-link);
}
[data-theme="dark"] .mobile-subnav-wrap::before {background: linear-gradient(to left, transparent, var(--ba-night-600));
}
[data-theme="dark"] .mobile-subnav-wrap::after {background: linear-gradient(to right, transparent, var(--ba-night-600));
}

/* Mobile Main Nav Strip */
[data-theme="dark"] .mobile-mainnav .nav li a {color: var(--ba-white);
    background: var(--ba-night-600);
    border-color: var(--ba-night-border-alt);
}
[data-theme="dark"] .mobile-mainnav .nav li.active > a {color: var(--ba-white);
    /* Tragend, nicht redundant: die Regel darueber setzt background auf ALLE
       Pills mit gleicher Spezifitaet wie screen.css und laedt spaeter — ohne
       diese Zeile faellt der aktive Pill auf Grau zurueck. */
    background-color: var(--ba-primary);
    border-color: var(--ba-night-blue);
    /* Gestaffelt wie im Light-Theme (screen.css), nur kraeftiger — auf dem
       dunklen Grund faellt ein harter Schatten-Abriss staerker auf.
       Radien identisch, damit nichts am Scroll-Container geclippt wird. */
    box-shadow:
        0 0 3px rgba(45, 106, 159, 0.50),
        0 0 8px rgba(45, 106, 159, 0.32),
        0 0 16px rgba(45, 106, 159, 0.18),
        0 0 24px rgba(45, 106, 159, 0.09);
}
/* Social Icons Desktop */
[data-theme="dark"] .social-icons-large .social-box {background-color: rgba(20,32,48,0.9);
}
[data-theme="dark"] .social-icons-large .social-box.fb-wrap:hover .fb-links a:hover,
[data-theme="dark"] .social-icons-large .social-box.ig-wrap:hover .ig-links a:hover {color: #e08080;
}

/* Reading progress bar — dark mode */
[data-theme="dark"] #reading-progress-bar {background: linear-gradient(to right, var(--ba-blue-500), #6aaee0);
}

/* .big-header / .small-header: auf Body-Hintergrund setzen, damit der Navbar-Container sichtbar abhebt */
[data-theme="dark"] .big-header,
[data-theme="dark"] .small-header {background-color: var(--ba-night-900);
}

/* Rounding SVG — white fill umfärben auf Content-Hintergrund (var(--ba-night-600))
   Filter-Kette: brightness→sepia→saturate→hue-rotate→brightness */
[data-theme="dark"] img.rounding {filter: brightness(0.21) sepia(1) saturate(2) hue-rotate(175deg) brightness(0.56);
}

/* Footer */
[data-theme="dark"] footer {background-color: #080e16;
}

/* Cookie Consent */
[data-theme="dark"] #cookieconsent-container {background-color: #080e16 !important;
}

/* Pagination */
[data-theme="dark"] .pagination > li > a,
[data-theme="dark"] .pagination > li > span {background-color: var(--ba-night-600);
    border-color: #2e4060;
    color: #a8c4e0;
}
[data-theme="dark"] .pagination > li > a:hover,
[data-theme="dark"] .pagination > li > span:hover,
[data-theme="dark"] .pagination > li > a:focus,
[data-theme="dark"] .pagination > li > span:focus {background-color: #243347;
    border-color: var(--ba-blue-500);
    color: var(--ba-gold-500);
}
[data-theme="dark"] .pagination > .active > a,
[data-theme="dark"] .pagination > .active > span,
[data-theme="dark"] .pagination > .active > a:hover,
[data-theme="dark"] .pagination > .active > span:hover {background-color: var(--ba-blue-600);
    border-color: var(--ba-blue-600);
    color: var(--ba-white);
}
[data-theme="dark"] .pagination > .disabled > a,
[data-theme="dark"] .pagination > .disabled > span {background-color: #111923;
    border-color: #1e2d40;
    color: #3a4e63;
}

/* Floating Labels (#4) */
[data-theme="dark"] .formo-input > .control-label,
[data-theme="dark"] .formo-password > .control-label,
[data-theme="dark"] .formo-textarea > .control-label {color: #888;
}
[data-theme="dark"] .formo-input.fl-active > .control-label,
[data-theme="dark"] .formo-input.fl-filled > .control-label,
[data-theme="dark"] .formo-password.fl-active > .control-label,
[data-theme="dark"] .formo-password.fl-filled > .control-label,
[data-theme="dark"] .formo-textarea.fl-active > .control-label,
[data-theme="dark"] .formo-textarea.fl-filled > .control-label {color: var(--ba-blue-500);
}
[data-theme="dark"] .formo-input.fl-active .form-control,
[data-theme="dark"] .formo-password.fl-active .form-control,
[data-theme="dark"] .formo-textarea.fl-active .form-control {border-color: var(--ba-blue-500);
}

/* ============================================================
   Welle 1 — Dark-Mode-Pendants
   ============================================================ */

/* Event-Status-Tags */
[data-theme="dark"] .component-event-list .item .category {background: var(--ba-night-border);
    color: var(--ba-night-text);
}
[data-theme="dark"] .component-event-list .item .category.category-mtb            {background: #1f3a1a; color: #a8d99a;
}
[data-theme="dark"] .component-event-list .item .category.category-pro-cycling,
[data-theme="dark"] .component-event-list .item .category.category-pro            {background: #4a1816; color: #f5b3b3;
}
[data-theme="dark"] .component-event-list .item .category.category-ctf-rtf,
[data-theme="dark"] .component-event-list .item .category.category-ctf            {background: #3a2a08; color: #f5d59a;
}
[data-theme="dark"] .component-event-list .item .category.category-rr,
[data-theme="dark"] .component-event-list .item .category.category-rennrad        {background: var(--ba-night-500);
}
[data-theme="dark"] .component-event-list .item .category.category-community      {background: var(--ba-night-600);
}
[data-theme="dark"] .component-event-list .item .category.category-partner-mitglieder,
[data-theme="dark"] .component-event-list .item .category.category-partner-foerderer {background: #2a2418; color: #d8c79a;
}

/* Pagination-Bar */
[data-theme="dark"] .component-pagination .pager li > a {background: var(--ba-night-600);
    color: var(--ba-night-text);
    border-color: var(--ba-night-border-alt);
}
[data-theme="dark"] .component-pagination .pager li > a:hover {background: var(--ba-night-700);
    color: var(--ba-night-link);
    border-color: var(--ba-blue-500);
}
[data-theme="dark"] .component-pagination .pager li > span {color: #888;
}

/* Role-Badges */
[data-theme="dark"] .role-badge {background: var(--ba-night-500);
    color: var(--ba-night-text);
}
[data-theme="dark"] .role-badge--pro {background: #4a1816; color: #f5b3b3;
}
[data-theme="dark"] .role-badge--ctf {background: #3a2a08; color: #f5d59a;
}
[data-theme="dark"] .role-badge--mtb {background: #1f3a1a; color: #a8d99a;
}

/* ============================================================
   Welle 2 — Saison-Pass + Profile Pill-Tabs (Dark Mode)
   ============================================================ */
[data-theme="dark"] .saison-pass {background: linear-gradient(135deg, var(--ba-night-600) 0%, var(--ba-night-800) 100%);
    border-color: var(--ba-night-border);
    border-left-color: var(--ba-red-600);
}
/* .sp-name, .sp-meta, .sp-meta strong, .sp-since: kein Override mehr noetig —
   screen.css nutzt dort --ba-text-strong / --ba-text-label / --ba-text-muted,
   die tokens.css im Dark Mode selbst umhaengt. */
[data-theme="dark"] .sp-stat-lbl {color: #e8eef5;
}
[data-theme="dark"] .sp-role {background: var(--ba-night-500); color: var(--ba-night-text);
}
[data-theme="dark"] .sp-role.pro {background: var(--ba-red-600); color: var(--ba-white);
}
[data-theme="dark"] .sp-qr-link {background: var(--ba-night-500); color: var(--ba-night-text);
    border-color: var(--ba-night-border);
}
[data-theme="dark"] .sp-qr-link:hover,
[data-theme="dark"] .sp-qr-link:focus {background: var(--ba-blue-500); color: var(--ba-white);
    border-color: var(--ba-blue-500);
}

[data-theme="dark"] .profile-tabs .pt-tab {background: var(--ba-night-600);
}
[data-theme="dark"] .profile-tabs .pt-tab:hover {background: #243245;
}
[data-theme="dark"] .profile-tabs .pt-tab.is-active {background: var(--ba-blue-500); color: var(--ba-white);
}

/* ----- FAQ (Tab "Hilfe" + Einsteiger-Hinweis) ----- */
[data-theme="dark"] .faq-item {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .faq-item:first-child {border-top-color: var(--ba-night-border);
}
[data-theme="dark"] .faq-item > summary::after {color: var(--ba-night-link);
}
[data-theme="dark"] .faq-item > summary:hover {color: var(--ba-night-link);
}
[data-theme="dark"] .faq-nudge {background: var(--ba-night-700); border-color: var(--ba-night-border);
    border-left-color: var(--ba-red-600);
}
[data-theme="dark"] .faq-nudge-close:hover {background: var(--ba-night-600);
}

/* ============================================================
   Welle 2.5 — Profile-Page-Inhalt (Dark Mode)
   ============================================================ */
[data-theme="dark"] .kontouebersicht .pic-placeholder {background: var(--ba-night-700); border-color: var(--ba-night-border); color: var(--ba-night-link);
}

/* Benefits */
[data-theme="dark"] .benefit-card {background: var(--ba-night-600); border-color: #283649;
}
[data-theme="dark"] .benefit-card:hover {border-color: #3a5170;
}
[data-theme="dark"] .benefit-card .bc-icon {background: rgba(26,138,58,0.18);
}
[data-theme="dark"] .benefit-card.upgrade .bc-icon {background: rgba(245,194,0,0.15); color: var(--ba-gold-500);
}
[data-theme="dark"] .benefit-card.upgrade .bc-status {color: var(--ba-gold-500);
}

/* Termine */
[data-theme="dark"] .mc-card {background: var(--ba-night-600); border-color: var(--ba-night-border);
}
[data-theme="dark"] .mc-date {background: var(--ba-night-800);
}
/* .mc-date .d und .mc-body h3 kommen ueber --ba-text-strong. */
[data-theme="dark"] .mc-act {background: var(--ba-night-border); color: #cfe0f0;
}
[data-theme="dark"] .mc-act.primary {background: var(--ba-blue-500); color: var(--ba-white);
}
[data-theme="dark"] .mc-act.danger {background: transparent; color: #ff8784;
}
[data-theme="dark"] .mc-status .dot {background: #44566e;
}
[data-theme="dark"] .mc-ticket {background: var(--ba-night-800); border-color: var(--ba-night-border);
}
[data-theme="dark"] .mc-ticket:hover {background: #16273a; border-color: var(--ba-blue-500);
}
[data-theme="dark"] .mc-ticket-cta {color: #7fb4e0;
}
[data-theme="dark"] .mc-qr {background: var(--ba-white); border-color: var(--ba-white);
}

/* Footer */
[data-theme="dark"] .el-card {background: var(--ba-night-600); border-color: var(--ba-night-border);
}
/* .el-title (--ba-text-strong) und .pt-note (--ba-text-muted) schalten
   inzwischen ueber die Tokens; .pt-note wird dadurch sogar heller. */

/* Dark: Social-Strip */
[data-theme="dark"] .social-strip__rail {border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .social-strip__label {color: var(--ba-gold-500);
}
@media (max-width: 767px) {
    [data-theme="dark"] .social-strip__label {color: var(--ba-night-text);
}
}
[data-theme="dark"] .social-strip__cta {color: #ff79b0;
}
[data-theme="dark"] .social-strip__cta:hover {color: #ffb3d4;
}
[data-theme="dark"] .sp-card {background: var(--ba-night-600);
    border-color: var(--ba-night-border);
    color: #d8e0ea;
}
[data-theme="dark"] .sp-card:hover {border-color: #3d5170;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] .sp-handle {color: var(--ba-white);
}
[data-theme="dark"] .sp-meta {color: #8a9aae;
}
[data-theme="dark"] .sp-caption {color: #cdd5e0;
}
[data-theme="dark"] .sp-stats {color: #8a9aae;
    border-top-color: var(--ba-night-border);
}

/* Dark: Social-Hub Pills */
[data-theme="dark"] .social-hub__pill {background: var(--ba-night-600);
    color: #cfe0f0;
    border-color: var(--ba-night-border-alt);
}
[data-theme="dark"] .social-hub__pill:hover {opacity: 0.85;
}
[data-theme="dark"] .social-hub__pill.is-active {color: var(--ba-white);
    box-shadow: 0 0 12px rgba(45, 106, 159, 0.4);
}
[data-theme="dark"] .social-hub__pill--all.is-active {background-color: var(--ba-blue-600);
    border-color: var(--ba-blue-600);
    box-shadow: 0 0 12px rgba(29, 92, 142, 0.55);
}

/* Component_Social_Strip Wrapper — Dark Mode
--------------------------------------------------------------------------------------------------------------------- */
[data-theme="dark"] .social-strip-section__title {color: #4ea7e8;
}

/* Text-Komponenten-Tabellen — Dark Mode
--------------------------------------------------------------------------------------------------------------------- */
[data-theme="dark"] .component-text table th {background: var(--ba-night-blue);
}
[data-theme="dark"] .component-text table td {border-top-color: #2c3138;
}
[data-theme="dark"] .component-text table tbody tr:nth-child(even) {background: #142030;
}

/* Teams-Hub Kacheln — Dark Mode
--------------------------------------------------------------------------------------------------------------------- */
[data-theme="dark"] .teams-hub-tile {background: #1e2227;
    border-color: #2c3138;
}
[data-theme="dark"] .teams-hub-tile:hover,
[data-theme="dark"] .teams-hub-tile:focus {box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .teams-hub-tile-image {background: #11151a;
}
[data-theme="dark"] .teams-hub-tile-body {background: #142030;
}
[data-theme="dark"] .teams-hub-tile-body strong {color: #4ea7e8;
}
[data-theme="dark"] .teams-hub-tile-text {color: #a8b0b8;
}
[data-theme="dark"] .teams-hub-tile-cta {color: #e2e5ea;
}
[data-theme="dark"] .teams-hub-tile:hover .teams-hub-tile-cta {color: #5788ba;
}

/* Team-Roster (Racing Riders) — Dark Mode
--------------------------------------------------------------------------------------------------------------------- */
[data-theme="dark"] .team-roster-card {background: #1e2227;
    border-color: #2c3138;
    color: #d8dde3;
}
[data-theme="dark"] .team-roster-card:hover,
[data-theme="dark"] .team-roster-card:focus {box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .team-roster-card-image {background: #11151a;
}
[data-theme="dark"] .team-roster-card-name {color: #4ea7e8;
}
[data-theme="dark"] .team-roster-card-city,
[data-theme="dark"] .team-roster-card-bio {color: #a8b0b8;
}
[data-theme="dark"] .team-roster-badge-discipline {background: var(--ba-night-blue);
}
[data-theme="dark"] .team-roster-badge-season,
[data-theme="dark"] .team-roster-badge-nat,
[data-theme="dark"] .team-roster-badge-club {background: #3a4048;
    color: #e2e5ea;
}
[data-theme="dark"] .team-roster-card-position {color: #d8dde3;
}
[data-theme="dark"] .team-roster-detail-block {background: #1e2227;
    border-color: #2c3138;
}
[data-theme="dark"] .team-roster-detail-block h2,
[data-theme="dark"] .team-roster-detail-headline h1 {color: #4ea7e8;
}
[data-theme="dark"] .team-roster-detail-bio {color: #a8b0b8;
}
[data-theme="dark"] .team-roster-stat {background: #1e2227;
    border-color: #2c3138;
}
[data-theme="dark"] .team-roster-stat-label {color: #a8b0b8;
}
[data-theme="dark"] .team-roster-stat-value {color: #4ea7e8;
}
[data-theme="dark"] .team-roster-detail-links li a {background: var(--ba-night-blue);
}
[data-theme="dark"] .team-roster-detail-links li a:hover,
[data-theme="dark"] .team-roster-detail-links li a:focus {background: var(--ba-blue-600);
}

/* ============================================================
   Welle 2.3 — Mitglieder-Verzeichnis + Profileinstellungen (Dark Mode)
   ============================================================ */
[data-theme="dark"] .biker-table thead th {color: var(--ba-night-text-muted);
    border-bottom-color: var(--ba-night-border);
}
[data-theme="dark"] .biker-table tbody tr:hover {background: var(--ba-night-600);
}
[data-theme="dark"] .biker-table .bt-names strong {color: var(--ba-white);
}
[data-theme="dark"] .biker-table .bt-realname {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .biker-table .bt-setup {color: var(--ba-night-text-subtle);
}
[data-theme="dark"] .biker-table .bt-avatar {background: var(--ba-night-700);
}
[data-theme="dark"] .biker-table .bt-avatar--none {box-shadow: inset 0 0 0 1px var(--ba-night-border);
}
[data-theme="dark"] .biker-table .bt-region,
[data-theme="dark"] .biker-table .bt-club {color: var(--ba-night-text);
}
[data-theme="dark"] .bt-tag {background: var(--ba-night-500); color: var(--ba-night-text-bright);
}
[data-theme="dark"] .bt-day {background: var(--ba-night-700); color: var(--ba-night-text);
}
[data-theme="dark"] .component-biker-list .bl-lede {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .biker-table .bt-since,
[data-theme="dark"] .biker-table .bt-goals {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .bd-setup,
[data-theme="dark"] .bd-goals {color: var(--ba-night-text);
}
[data-theme="dark"] .component-profile-settings .ps-block legend {color: var(--ba-white);
}
[data-theme="dark"] .component-profile-settings .ps-hint {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .component-profile-settings .ps-master {background: var(--ba-night-700);
    border-left-color: var(--ba-red-600);
}
[data-theme="dark"] .component-profile-settings .ps-master .control-label {color: var(--ba-night-text-bright);
}
[data-theme="dark"] .component-profile-settings .ps-master-note,
[data-theme="dark"] .component-profile-settings .ps-savebar-note {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .component-profile-settings .ps-subs {border-left-color: var(--ba-night-border);
}
[data-theme="dark"] .component-profile-settings .ps-help {background: var(--ba-night-500);
    color: var(--ba-night-text-bright);
}
[data-theme="dark"] .component-profile-settings .ps-help:hover,
[data-theme="dark"] .component-profile-settings .ps-help:focus {background: var(--ba-blue-600);
    color: var(--ba-white);
}
[data-theme="dark"] .component-profile-settings .ps-inline-note {color: var(--ba-night-text-muted);
}
[data-theme="dark"] .component-profile-settings .ps-inline-note strong {color: var(--ba-night-text);
}
/* Die Leiste liegt auf .l-content, muss also deren Flaeche treffen -- sonst
   scheint der Formularinhalt beim Scrollen durch. */
[data-theme="dark"] .component-profile-settings .ps-savebar {background: var(--ba-night-600);
    border-top-color: var(--ba-night-border);
}
[data-theme="dark"] .component-profile-settings .ps-savebar.is-stuck {box-shadow: 0 -6px 14px rgba(0,0,0,0.45);
}


/* Popover (2026-08-01)
----------------------------------------------------------------------------------------------------------------------
   Bootstrap-Popover hat eine fest helle Flaeche, erbt aber die
   Dark-Mode-Textfarbe -- hellgrau auf weiss, praktisch unlesbar. Bis hierher
   gab es in dieser Datei keine .popover-Regel. */

[data-theme="dark"] .popover {
    background: #142030;
    border-color: #2a3a50;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}
[data-theme="dark"] .popover-title {
    background: #1a2535;
    border-bottom-color: #2a3a50;
    color: #e0eaf5;
}
[data-theme="dark"] .popover-content { color: #c8d8e8; }

[data-theme="dark"] .popover.top    > .arrow::after { border-top-color:    #142030; }
[data-theme="dark"] .popover.bottom > .arrow::after { border-bottom-color: #1a2535; }
[data-theme="dark"] .popover.left   > .arrow::after { border-left-color:   #142030; }
[data-theme="dark"] .popover.right  > .arrow::after { border-right-color:  #142030; }
[data-theme="dark"] .popover.top    > .arrow { border-top-color:    #2a3a50; }
[data-theme="dark"] .popover.bottom > .arrow { border-bottom-color: #2a3a50; }
[data-theme="dark"] .popover.left   > .arrow { border-left-color:   #2a3a50; }
[data-theme="dark"] .popover.right  > .arrow { border-right-color:  #2a3a50; }


/* Mitgliedsantrag (2026-08-01) */

[data-theme="dark"] .component-biker-member-application h2 { border-top-color: #2a3a50; }
[data-theme="dark"] .component-biker-member-application .formo-select > .control-label { color: #76a0c4; }
[data-theme="dark"] .component-biker-member-application .formo-radios label.radio,
[data-theme="dark"] .component-biker-member-application .pkg-item,
[data-theme="dark"] .component-biker-member-application .fee-box,
[data-theme="dark"] .component-biker-member-application .fee-box .fee-total { border-color: #2a3a50; }
[data-theme="dark"] .component-biker-member-application .fee-youth { color: #4ec94a; }

/* Shop-Bestseller + Rabattcodes (2026-08-29)
   Hier steht bewusst NICHTS. Beide Bloecke in screen.css benutzen
   ausschliesslich Tokens (--ba-surface, --ba-border, --ba-text-*, --ba-shadow,
   --ba-danger), und die schaltet tokens.css unter [data-theme="dark"] schon um.
   Eine Kopie der Farben an dieser Stelle waere ein zweiter Ort fuer denselben
   Fakt -- und genau so war hier der Rohwert #4ea7e8 hereingeraten, den es in
   tokens.css gar nicht gibt.

   Einzige Sonderregel ist die Bildflaeche: sie steht auf --ba-white und muss in
   BEIDEN Themes hell bleiben, weil die Produktbilder Freisteller mit
   transparentem Hintergrund sind. Das erledigt screen.css von selbst --
   --ba-white ist ein Primitive und schaltet nicht um. */
@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {

        /* Desktop: Artikel-Cards (auf mobile via hidden-xs hidden-sm ausgeblendet) */
        .l-start .item,
        /* Mobile: Spotify-Rows — Header bleibt immer sichtbar, nur Cards sliden rein */
        .l-start .spotify-row {
            animation: sa-reveal linear both;
            animation-timeline: view();
            animation-range: entry 0% entry 100%;
        }

        /* Desktop: 30% */
        @keyframes sa-reveal {
            from { opacity: 0; transform: translateY(45px) scale(0.85); }
            to   { opacity: 1; transform: translateY(0)   scale(1); }
        }

        /* Mobile: 10%, ease-out damit opacity früher aufholt */
        @media (max-width: 767px) {
            .l-start .item,
            .l-start .spotify-row {
                animation-timing-function: ease-out;
            }
            @keyframes sa-reveal {
                from { opacity: 0; transform: translateY(15px) scale(0.95); }
                to   { opacity: 1; transform: translateY(0)    scale(1); }
            }
        }

    }
}
/* ============================================================
   Cookie Consent — Bottom-Sheet Style
   ============================================================ */

#cc-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0);
  transition: background 0.35s ease;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

#cc-overlay.cc-visible {
  background: rgba(0, 0, 0, 0.45);
  pointer-events: auto;
}

#cc-sheet {
  width: 100%;
  max-width: 640px;
  background: #fff;
  border-radius: 20px 20px 0 0;
  padding: 28px 24px 36px;
  box-shadow: 0 -6px 40px rgba(0, 0, 0, 0.18);
  transform: translateY(100%);
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  outline: none;
}

#cc-overlay.cc-visible #cc-sheet {
  transform: translateY(0);
}

/* Drag handle indicator */
#cc-sheet::before {
  content: '';
  display: block;
  width: 40px;
  height: 4px;
  background: #d0d0d0;
  border-radius: 2px;
  margin: 0 auto 22px;
}

.cc-body {
  text-align: center;
  margin-bottom: 22px;
}

.cc-icon {
  font-size: 2.25rem;
  line-height: 1;
  margin-bottom: 12px;
}

.cc-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #1d5c8e;
  margin: 0 0 10px;
  line-height: 1.3;
}

.cc-message {
  font-size: 0.875rem;
  color: #555;
  line-height: 1.55;
  margin: 0;
}

.cc-privacy-link {
  color: #1d5c8e;
  text-decoration: underline;
  white-space: nowrap;
}

.cc-privacy-link:hover {
  color: #153f63;
}

/* Buttons */
.cc-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cc-btn {
  width: 100%;
  padding: 13px 20px;
  border: none;
  border-radius: 12px;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.1s ease, background 0.15s ease;
  line-height: 1;
}

.cc-btn:active {
  transform: scale(0.97);
}

.cc-btn-all {
  background: #1d5c8e;
  color: #fff;
  order: -1;
}

.cc-btn-all:hover {
  background: #174d79;
}

.cc-btn-necessary {
  background: #f0f0f0;
  color: #444;
}

.cc-btn-necessary:hover {
  background: #e2e2e2;
}

@media (min-width: 480px) {
  .cc-buttons {
    flex-direction: row-reverse;
  }

  .cc-btn {
    flex: 1;
  }

  .cc-btn-all {
    order: 0;
  }
}

/* ============================================================
   Dark Mode
   ============================================================ */
[data-theme="dark"] #cc-sheet {
  background: #1a2739;
  box-shadow: 0 -6px 40px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] #cc-sheet::before {
  background: #3a4f66;
}

[data-theme="dark"] .cc-title {
  color: #f5c200;
}

[data-theme="dark"] .cc-message {
  color: #a0b4c8;
}

[data-theme="dark"] .cc-privacy-link {
  color: #7db3d9;
}

[data-theme="dark"] .cc-privacy-link:hover {
  color: #a0cbeb;
}

[data-theme="dark"] .cc-btn-all {
  background: #1d5c8e;
}

[data-theme="dark"] .cc-btn-all:hover {
  background: #174d79;
}

[data-theme="dark"] .cc-btn-necessary {
  background: #253748;
  color: #cdd8e3;
}

[data-theme="dark"] .cc-btn-necessary:hover {
  background: #2f4560;
}

@media print {
  #cc-overlay { display: none; }
}