/* ColorBox, (c) 2011 Jack Moore, MIT license */
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url("../../assets/jquery/colorbox/1.6.1/images/loading.gif") no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
/* Hintergrundbilder.css */
body.ulf #hintergrundbild{background-image:url("../../files/img/Ulf_Studioset_Foto_Anastasia_Kapluggin_2000.jpg");background-position: 49% 8%}body.twenty_fifth #hintergrundbild{background-image:url("../../files/_css/css-img/JUBI_2020_back3_.jpg");background-position: 45% 6%}body.musiker #hintergrundbild{background-image:url("../../files/img/pressefotos/still_collins_presse3_2015.jpg");background-position: 20% 27%}body.sven #hintergrundbild{background-image:url("../../files/img/sven_2144.jpg");background-position: 80% 34%}body.katja #hintergrundbild{background-image:url("../../files/img/katja_2030.jpg");background-position: 0% 20%}body.uli #hintergrundbild{background-image:url("../../files/img/uli_2122.jpg");background-position: 55% 28%}body.wolfgang #hintergrundbild{background-image:url("../../files/img/wolfgang_1958.jpg");background-position: 10% 41%}body.christoph #hintergrundbild{background-image:url("../../files/img/chris_2001.jpg");background-position: 39% 22%}body.markus #hintergrundbild{background-image:url("../../files/img/markus_1967.jpg");background-position: 10% 20%}body.martin #hintergrundbild{background-image:url("../../files/img/martin_1976.jpg");background-position: 10% 18%}body.weitere #hintergrundbild{background-image:url("../../files/img/pressefotos/still_collins_presse3_2015.jpg");background-position: 20% 27%}body.sven #logo h2,body.ulf #logo h2,body.uli #logo h2,body.wolfgang #logo h2,body.christoph #logo h2,body.markus #logo h2,body.martin #logo h2,body.katja #logo h2{display:none}body.aktuelle_termine #hintergrundbild,body.termin_archiv #hintergrundbild{background-image:url("../../files/img/Still-Collins_20-_Beuel-2015-12-12_web__1874x896px.jpg");background-position: 39% 10%}body.still_collins_plus:not(.sf6):not(.sf7) #logo{top: 39.95vh;left: 1.55%;width: 98.45%}body.still_collins_plus #logo h1{background-image:url("../../files/img/logos/still_collins_plus_logo.svg");height: calc(5.5vw + 110px)}body.still_collins_plus #logo h2{display:none}body.best_of #hintergrundbild{background-image:url("../../files/img/walkmen_1200x800.jpg");background-position: 50% 0%}body.best_of #logo{display:none}body.grill_collins #hintergrundbild{background-image:url("../../files/img/Grill-Collins_2017-03-25_final_1900px_D81_3022_.jpg");background-position: 64% 0%}body.genesis_live_special #hintergrundbild{background-image:url("../../files/img/plakat_genesis.jpg");background-position: 50% 60%}body.genesis_live_special #logo{display:none}body.ballads #hintergrundbild{background-image:url("../../files/img/plakat_ballads_832x961.jpg");background-position: 50% 44%}body.ballads #logo{display:none}
/* ----- 	Reset    ----- */

* {
    margin: 0;
    padding: 0;
}

.invisible {
    display: none;
}


/* ----- 	Layout    ----- */

.mod_article {
    -webkit-transform: skewY(-1.5deg);
    -ms-transform: skewY(-1.5deg);
    transform: skewY(-1.5deg);
}

.mod_article {
    margin-top: -0.2rem;
}

.mod_article .centerer {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    overflow: hidden;           /* clearfix für gefloatete Inhalte */
    -webkit-transform: skewY(1.5deg);
    -ms-transform: skewY(1.5deg);
    transform: skewY(1.5deg);
}

body.pressetexte .mod_article .centerer {
    text-align: justify;
}

body.pressetexte .mod_article .centerer h1 {
    text-align: left;
}

body.impressumdatenschutz .mod_article .centerer {
    text-align: left;
}

@media (min-width: 1001px) {
    .mod_article .centerer {      /* vertikale Abstände an Bildschirmgröße anpassen */
        padding: 2.7% 5%;
    }
}

@media (max-width: 1000px) {
    .mod_article .centerer {
        padding: 27px 5% 20px 5%;
    }
}

.ce_text, .ce_headline, .ce_image, .ce_youtube, .video .centerer {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.ce_image {
    margin-top: 11px;
    margin-bottom: 11px;
}

.video .ce_youtube {
    padding-bottom: 44px;
}

.pressefotos .ce_image, .logos .ce_image {
    padding-top: 4.4%;
}

.ce_image img {                 /* responsive images */
    max-width: 100%;
    height: auto;
}

.ce_text + .ce_text {
    padding-top: 2vw;
}



/* -----    Spacer    ----- */

.home .spacer {
    height: 160px;
}

.spacer {
    height: 80px;
}

body.home:not(.sf6):not(.sf7) .spacer {
    height: 30vh;
}

body:not(.sf6):not(.sf7) .spacer {
    height: 15vh;
}


/* -----    YouTube  InlineMedia    ----- */

.ce_inlinemedia {
  position: relative;
  padding-bottom: 56.25%;
  /*padding-top: 30px;*/
  height: 0;
  overflow: hidden;
  margin-top: 30px;
  margin-bottom: 47px;
}

.ce_inlinemedia iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* -----    YouTube  Mediaelement    ----- */

.mejs-container {
    margin-top: 5px;
    margin-bottom: 27px;
}

.mejs-container .mejs-controls div {
    font-family: geomanistlight !important;
}

/*sorgt dafuer, dass der zweitäußerste Container immer das Seitenverhaeltnis 16:9 behaelt */
.mejs-container {
    width: 100% !important;
    height: auto !important;
    padding-top: 57%;
}

/* sorgt dafuer, dass das Vorschaubild und der Play-Button wieder mittig zentriert sind */
.mejs-overlay, .mejs-poster {
    width: 100% !important;
    height: 100% !important;
}

/* sorgt dafuer, dass das Video-Element, der übergeordnete DIV-Container vom Flash-Video
und das Flash-Video richtig skaliert werden */
.mejs-mediaelement video,
.mejs-mediaelement .me-plugin,
.mejs-mediaelement embed {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: 100% !important;
}


/* -----    Presse    ----- */

.ce_text.presse, .ce_text.dreispaltig {
    padding: 3.05% 2% 0 2%;
}

.ce_text.presse {
    color: #222;
    background-color: #fff;
}

.ce_text.dreispaltig {
    text-align: left;
}

@media (min-width: 971px) {
    .ce_text.presse, .ce_text.dreispaltig {
        display: inline-block;
        vertical-align: top;
        margin-top: 0.9%;
        margin-left: 1.39%;
        margin-right: 1.39%;
        margin-bottom: 2.28%;
        width: 25.63%;
    }

    .ce_text.presse  {
        min-height: 265px;
    }

    .ce_text.presse  h1 {
        min-height: 63px;
    }

    .ce_text.dreispaltig h1 {
    min-height: 89px;
    }
}

@media (max-width: 970px) {
    .ce_text.presse, .ce_text.dreispaltig {
        max-width: 492px;
        margin: 0 auto 27px auto;
    }
}

.ce_text.presse  h1 {
    font-size: 26px;
    line-height: 30px;
    margin-bottom: -10px;
}

.ce_text.presse p {
	font-size: 16px;
}

.ce_text.presse  a {
    color: #222;
    font-family: geomanistlight;
    font-size: 13px;
    display: block;
    margin-top: -9px;
}

.ce_text.dreispaltig h1 + p {
    padding-top: 0;
}

#container .ce_text.dreispaltig ul {
    padding-bottom: 22px;
}


/* -----    Termine    ----- */

.mod_eventmenu {
    padding-top: 22px;
}

.mod_eventlist {
    display: inline-block;
    padding-top: 7px;
    padding-bottom: 27px;
}

.mod_eventlist a, .mod_eventmenu a {
    text-decoration: none;
    position: relative;
}

.mod_eventlist a:hover, .mod_eventlist a:focus,
.mod_eventmenu a:hover, .mod_eventmenu a:focus {
    text-decoration: underline;
}

#container .mod_eventlist a[href^="http://"]:before,
#container .mod_eventlist a[href^="https://"]:before {
    content: "";
}

#container .mod_eventlist a[href^="http://"]:hover:before,
#container .mod_eventlist a[href^="https://"]:hover:before,
#container .mod_eventlist a[href^="http://"]:focus:before,
#container .mod_eventlist a[href^="https://"]:focus:before {
    speak: none;
    font-style: normal;
    font-weight: normal;
    content: "\279E  ";
    position: absolute;
    left: -0.9em;
}


.mod_eventlist span {
    display: inline-block;
    vertical-align: top;
}

.mod_eventlist .event {
    text-align: left;
    padding-top: 11px;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    overflow: hidden;
}

.tint .mod_eventlist .event {
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.mod_eventlist .date {
    width: 80px;
    /*text-align: center;*/
}

.mod_eventlist .time {
    width: 40px;
    padding-right: 10px;
    /*text-align: center;*/
    font-size: 13px;
    margin-top: 1px;
}

@media (min-width: 651px) {
    .mod_eventlist .time {
        padding-right: 10px;
    }

    .mod_eventlist .city {
        width: 200px;
    }
}

@media (max-width: 650px) {
    .mod_eventlist .time {
        padding-right: 110px;
    }

    .mod_eventlist .city {
        min-width: 230px;
    }
}

.mod_eventlist .venue_title {
    width: 230px;
}

.mod_eventlist .address, .mod_eventlist .teaser {
    display: block;
    font-size: 13px;
    line-height: 17px;
}

.mod_eventlist .teaser p {
    padding: 0;
}

.mod_eventlist .cal_title {
    width: 230px;
}

.no_cal_title .mod_eventlist .cal_title {
    display: none;
}

.mod_eventlist .cal_title a {
    font-family: geomanistlight;
}

.ticket_infos {
    float: right;
}

.mod_eventlist .ticket_infos, .mod_eventmenu {
    font-size: 13px;
    line-height: 21px;
}

.mod_eventlist .tickets, .mod_eventlist .sold_out {
    display: inline-block;
    width: 90px;
    border-radius: 40px;
    text-align: center;
}

.mod_eventlist .tickets a, .mod_eventmenu a {
    display: block;
    color: #000;
}

#container .mod_eventlist .tickets a:hover:before,
#container .mod_eventlist .tickets a:focus:before {
    left: 1em;
}

.mod_eventlist .tickets {
    /*background-color: #fff;*/
    background-color: currentColor;
    padding: 1px;
    margin-top: 1px;
}

.tint .mod_eventlist .tickets a {
    color: hsl(22, 37%, 35%);
}

.mod_eventlist .sold_out {
    border: 1px solid;
}

.mod_eventmenu ul {
    max-width: 930px;
}

.mod_eventmenu li {
    display: inline-block;
    list-style-type: none;
    width: 70px;
    margin-left: 8px;
    margin-right: 7px;
    margin-bottom: 22px;
    padding: 1px;
    border-radius: 40px;
    background-color: #fff;
    text-align: center;
    line-height: 21px;
}

.mod_eventmenu li.active {
    background-color: transparent;
    border: 1px solid;
    padding: 0;
}


/* -----    Linkliste    ----- */

.programme #programme .centerer, .musiker #musiker .centerer {
    max-width: 700px;
}

a.hyperlink_img {
    display: table;
    padding-top: 2%;
    padding-bottom: 2%;
    text-decoration: none;
}

.hyperlink_img img {
    display: table-cell;
    vertical-align: middle;
    max-width: 249px;
    height: auto;
    width: calc(12vw + 100px);
    border-radius: 50%;
}

.ce_hyperlink.eckig .hyperlink_img img {
    border-radius: 0;
}

.hyperlink_img p {
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    padding-left: 5vw;
    font-size: 26px;
    line-height: 1.16;
    text-decoration: underline;
}

@media (max-width: 500px) {
    .hyperlink_img p {
        font-size: calc(3vw + 11px);
    }
}


/* -----    Galerie    ----- */

.ce_gallery {
    padding-top: 3%;
    padding-bottom: 3%;
}

.ce_gallery > ul {
    font-size: 0;
    line-height: 0;
}

#container .ce_gallery li {
    display: inline-block;
    padding: 4px;
}

.pagination {
    padding-top: 20px;
}

.pagination p,
#container .pagination li.next, #container .pagination li.previous,
#container .pagination li.last, #container .pagination li.first {
    display: none;
}

.pagination li {
    margin-left: 7px;
    margin-right: 8px;
}

.pagination li .current, .pagination li a {
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    font-size: 13px;
    line-height: 25px;
    border-radius: 50%;
}

.pagination li .current {
    border: 1px solid;
}

.pagination li a {
    text-decoration: none;
    color: #000;
    background-color: #fff;
}

#cboxTitle, #cboxCurrent {
    display: none !important;
}


/* -----    Navi    ----- */

.mainnavi {
    font-size: 20px;
    line-height: 44px;
}

@media (min-width: 1001px) {
    .mainnavi .level_1 > li, .seknavi li {
        display: inline-block;
    }

    .mainnavi .level_1 > li {
        margin-left: 2%;
        margin-right: 2%;
    }
}

@media (max-width: 1000px) {
    .mainnavi .level_1 > li, .seknavi li {
        display: block;
    }
}

.mainnavi .level_1 > li, .seknavi a {
    position: relative;         /* Bezugspunkt für Submenüs und Pfeile */
}

.mainnavi .level_1 li a {
    display: block;
}

.level_2 {
    position: absolute;
    text-align: left;
    line-height: 33px;
    opacity: 0;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}



@media (min-width: 1001px) {
    .level_2 {
        -webkit-transform: scaleY(0);
        -ms-transform: scaleY(0);
        transform: scaleY(0);
    }

    #header .level_2 {
        -webkit-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        transform-origin: 0 0;
    }

    #footer .level_2 {
        -webkit-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
        transform-origin: 0 100%;
    }

    .level_2:hover,
    a.submenu:hover + .level_2,
    a.submenu:focus + .level_2,
    a.submenu:active + .level_2 {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1);
    }

    .level_2 {
        left: -30px;
        padding: 5px 30px;
    }

    #footer .level_2 {
        bottom: 44px;
    }

    #navitoggle, #navipad, .seknavi .langtoggle1 {
        display: none;
    }
}

@media (max-width: 1000px) {
    #footer {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow-y: scroll;
        /*-webkit-overflow-scrolling: touch;*/  /* verursacht Bug in iOS 8 */
        -webkit-transition: all 0.2s;
        transition: all 0.2s;
    }

    #navipad {
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
    }

    #footer .inside {
        display: inline-block;
        min-height: 91%;
        padding-top: 14px;
        padding-bottom: 28px;
        letter-spacing: 0.06em;
    }

    body:not(.sf6):not(.sf7) #footer .inside {
        padding-top: 3vh;
        padding-bottom: 6vh;
    }

    .mainnavi, .seknavi {
        width: 117px;
        padding-left: 10px;
        padding-left: 8vw;
        padding-right: 23px;
    }

    #footer a.programme, #footer a.pressefotos, #footer a.download, #footer a.tech_rider {
        letter-spacing: 0.02em;
    }

    .level_2 {
        left: 140px;
        top: -2px;
        padding: 8px 20px 10px 8px;
        border-radius: 0px 11px 11px 0px;
    }

    #footer, .level_2 {
        -webkit-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
        transform: scaleX(0);
    }

    a.submenu:hover:after, a.submenu:focus:after, a.submenu:active:after {
        content: "\2023";          /* \25B8 oder \203A */
        position: absolute;
        right: -15px;
    }

    #wrapper.active #footer, .level_2:hover,
    a.submenu:hover + .level_2,
    a.submenu:focus + .level_2,
    a.submenu:active + .level_2 {
        opacity: 1;
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
    }

    #navitoggle {
        position: fixed;
        top: 22px;
        left: 0;
        padding: 4px 15px 3px 5vw;
        border-radius: 0 11px 11px 0;
        white-space: nowrap;
    }

    body:not(.sf6):not(.sf7) #navitoggle {
        top: 5vh;
    }

    #navitoggle {
        font-family: geomanistbook;
        font-weight: normal;
        font-size: 18px;
        text-transform: uppercase;
    }

    #navitoggle #aniburger {
        font-size: 17px;
        margin-right: 4px;
    }

    #wrapper.active #navitoggle, .seknavi .langtoggle2 {
        display: none;
    }
}

.mainnavi .level_2 li, .level_2 a {
    display: block;
}

.mainnavi li {
    white-space: nowrap;
}

a.submenu:hover, a.submenu:focus, a.submenu:active {
    color: #888;
}

body.ios.safari {           /* Für iOS: Menü bei Tap auf Hintergrund schließen */
    cursor: pointer;
}

.seknavi {
    font-size: 13px;
    line-height: 40px;
}

@media (min-width: 1001px) {
    .seknavi li {
        margin-left: 0.8%;
        margin-right: 0.8%;
    }

    .seknavi li.sm {
	    margin-left: 1.2%;
	    margin-right: 1.2%;
	}

    .mod_changelanguage a {
        width: 64px;
    }
}

@media (max-width: 1000px) {
    .seknavi .separator {
        display: none;
    }

    .seknavi li.sm {
	    display: inline-block;
	}

	.seknavi li.facebook, .seknavi li.youtube {
		margin-right: 25px;
	}

	.seknavi li.instagram {
	    margin-right: -20px;
	}

    .seknavi li.langtoggle1, .seknavi li.facebook,
    .seknavi li.cd, .seknavi li.spreadshirt, .seknavi li.privacy { /* Seknavi-Links in Gruppen aufteilen */
        padding-top: 15px;
    }

    .seknavi li.privacy {
	    line-height: 20px;
	}
}

.mod_changelanguage a {
    display: inline-block;
    padding-right: 13px;
    padding-left: 13px;
    line-height: 23px;
    border-radius: 40px;
    background-color: #FFF;
    color: #000 !important;
}

/* -----    Logo + Untertitel    ----- */


#logo {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    filter: drop-shadow(0 0 1em rgb(0, 0, 0));
}

body:not(.sf6):not(.sf7) #logo {
    top: 50vh;
}

@media (max-width: 1000px) {
    #logo {
        margin-top: -70px;
    }
}

@media (max-width: 570px) {              /* für ältere Iphones */
    body.sf6 #logo, body.sf7 #logo {
        top: 23%;
        padding-top: 16%;
        margin-top: 0;
    }
}

#logo h1 {
    height: 50px;
    height: calc(3vw + 60px);
    margin-right: auto;
    margin-left: auto;
    background-image: url("../../files/img/logos/still_collins_logo.svg");
    /*background-image: url("../../files/_css/sc_logo_700x198.gif");*/
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#logo h2 {
    text-transform: uppercase;
    font-size: 20px;
    margin-top: 8px;
    text-shadow: 2px 2px 0.5vw rgba(0, 0, 0, 0.9);
}

.home #logo h2 {
    font-size: 16px;
}


/* -----    Hintergrundbild    ----- */

#hintergrundbild {
    position: fixed;
    top: 0;
    z-index: -1;
    width: 100%;
    margin: 0;
    transform: none;
    height: 480px;
    background-size: cover;
    background-position: 47% 30%;
    background-image: url("../../files/_css/css-img/bg2025_stillcollins_1800x1200.jpg");
}

body:not(.sf6):not(.sf7) #hintergrundbild {
    height: 100vh;
}

/* -----    Header + Footer    ----- */

#header, #footer {
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

@media (min-width: 1001px) {
    #header, #footer {
        text-align: center;
    }
}

@media (max-width: 1000px) {
    #header {
        display: none;
    }
}


#main {
    margin-top: 260px;
    margin-bottom: 176px;
}

body:not(.sf6):not(.sf7) #main {
    margin-top: 62vh;
}


/* ----- 	Colors    ----- */

html {
    background-color: #333;
}

.dark, .mod_article {
    background-color: hsla(209, 20%, 49%, 0.96); 	/* RAL 5014 Taubenblau */
}

body.test .dark, body.test .mod_article:not(.spacer) {
    background-color: hsla(209, 60%, 13%, 0.96);
    border: solid #fff;
    border-width: 0.2rem 0;
}

body.test .inverse, body.test .inverse a {
    color: hsla(20, 100%, 50%, 1);
}

.tint {
    color: #fff;
    background-color: hsla(22, 37%, 35%, 0.95);   /* RAL 8024 Beigebraun */
}

body.test .mod_article.tint {
    color: #fff;
    background-color: hsla(20, 100%, 50%, 0.9);
}

.tint a {
    color: #fff;
}

.mod_article.spacer {
    background-color: transparent;
}

@media (min-width: 1001px) {
    #header, #footer, .mainnavi .level_2 {
        background-color: #222;
        background-color: rgba(0, 0, 0, 0.8);
    }

    body.test #header, body.test #footer, body.test .mainnavi .level_2 {
        background-color: hsla(209, 46%, 17%, 0.96);
        background-color: hsla(209, 60%, 13%, 0.96);
    }
}

@media (max-width: 1000px) {
    #footer .inside, .mainnavi .level_2, #navitoggle {
        background-color: #222;
        background-color: rgba(0, 0, 0, 0.8);
    }

    body.test #footer .inside, body.test .mainnavi .level_2, body.test #navitoggle {
        background-color: hsla(209, 46%, 17%, 0.96);
        background-color: hsla(209, 60%, 13%, 0.96);
    }
}

.separator {
    color: #888;
}


/* ----- 	Typo    ----- */

html {
    font-family: geomanistlight, sans-serif;
    font-size: 16px;
    line-height: 1.375;
    letter-spacing: 0.01em;
}

@media (min-width: 1001px) and (max-width: 1400px) {
	html {
		font-size: calc(0.25vw + 13.5px);
	}
}

@media (min-width: 1401px) {
	html {
		font-size: 17px;
	}
}

.smalltext {
	font-size: 0.875rem;
}

html, a {
    color: #fff;
}

#container a[href^="http://"]:before,
#container a[href^="https://"]:before {
    speak: none;
    font-style: normal;
    font-weight: normal;
    content: "\279E  ";              /* \2192 */
    /*font-size: 0.8em;*/
}

#container .image_container a[href^="http://"]:before,
#container .image_container a[href^="https://"]:before {
	content: "";
}


@media (min-width: 1001px) {
    .seknavi a:not(.sm)[href^="http://"]:hover:before,
    .seknavi a:not(.sm)[href^="https://"]:hover:before,
    .seknavi a:not(.sm)[href^="http://"]:focus:before,
    .seknavi a:not(.sm)[href^="https://"]:focus:before  {
        speak: none;
        font-style: normal;
        font-weight: normal;
        content: "\279E  ";
        position: absolute;
        left: -0.9em;
        top: -0.85em;
    }
}


@media (max-width: 1000px) {
    #footer a:not(.sm)[href^="http://"]:before,
    #footer a:not(.sm)[href^="https://"]:before  {
        speak: none;
        font-style: normal;
        font-weight: normal;
        content: "\279E  ";
    }

    #footer .mod_changelanguage a:before {
        content: "";
    }
}

#header, #header a,
#footer, #footer a {
    text-decoration: none;
    font-family: geomanistbook;
}

#header a.sm, #footer a.sm {
    font-family: fa;
    font-size: 1.5em;
	line-height: 0.75;
	vertical-align: -13%;
}

#header li:not(.submenu) a:not(.sm):hover, #header li:not(.submenu) a:not(.sm):focus, #header li:not(.submenu) a:not(.sm):active,
#footer li:not(.submenu) a:not(.sm):hover, #footer li:not(.submenu) a:not(.sm):focus, #footer li:not(.submenu) a:not(.sm):active {
    text-decoration: underline;
}

#header .active, #footer .active,
#header .trail > a, #footer .trail > a {
    color: hsl(22, 37%, 35%);
}

body.test #header .active, body.test #footer .active,
body.test #header .trail > a, body.test #footer .trail > a {
    color: hsl(20, 100%, 50%);
}

p, .ce_download, .ce_downloads {
    padding-top: 0.687em;
    padding-bottom: 0.687em;
}

#container ul {
    display: inline-block;
    padding-bottom: 0.687rem;
}

#container li {
    list-style-type: none;
}

#container .ce_text li, #container .ce_downloads li {
    padding-bottom: 0.687rem;
    text-align: left;
}

strong, h2, h3 {
    font-family: geomanistbook;
    font-weight: normal;
    font-size: 1.125rem;
}

h2, h3 {
	padding-top: 0.625rem;
}

h2 {
	text-transform: uppercase;
}

a {
    font-family: geomanistbook;
    font-weight: normal;
}

h1:not(.logo) {
    font-family: geomanistbook;
    font-weight: normal;
    font-size: 2.375rem;
    line-height: 1.16;
    padding-bottom: 0.5rem;
}

/*@media (max-width: 500px) {
    h1:not(.logo) {
        font-size: calc(5vw + 13px);
    }
}*/


@font-face {
    font-family: 'geomanistultra';
    src: url('../../files/_fonts/geomanist-ultra-webfont.eot');
    src: url('../../files/_fonts/geomanist-ultra-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-ultra-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-ultra-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-ultra-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-ultra-webfont.svg#geomanistultra') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistblack';
    src: url('../../files/_fonts/geomanist-black-webfont.eot');
    src: url('../../files/_fonts/geomanist-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-black-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-black-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-black-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-black-webfont.svg#geomanistblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistbold';
    src: url('../../files/_fonts/geomanist-bold-webfont.eot');
    src: url('../../files/_fonts/geomanist-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-bold-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-bold-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-bold-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-bold-webfont.svg#geomanistbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistmedium';
    src: url('../../files/_fonts/geomanist-medium-webfont.eot');
    src: url('../../files/_fonts/geomanist-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-medium-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-medium-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-medium-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-medium-webfont.svg#geomanistmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistbook';
    src: url('../../files/_fonts/geomanist-book-webfont.eot');
    src: url('../../files/_fonts/geomanist-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-book-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-book-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-book-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-book-webfont.svg#geomanistbook') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanist_regularregular';
    src: url('../../files/_fonts/geomanist-regular-webfont.eot');
    src: url('../../files/_fonts/geomanist-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-regular-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-regular-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-regular-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-regular-webfont.svg#geomanist_regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistlight';
    src: url('../../files/_fonts/geomanist-light-webfont.eot');
    src: url('../../files/_fonts/geomanist-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-light-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-light-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-light-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-light-webfont.svg#geomanistlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistextralight';
    src: url('../../files/_fonts/geomanist-thin-webfont.eot');
    src: url('../../files/_fonts/geomanist-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-thin-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-thin-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-thin-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-thin-webfont.svg#geomanistextralight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'geomanistthin';
    src: url('../../files/_fonts/geomanist-thin-webfont.eot');
    src: url('../../files/_fonts/geomanist-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/_fonts/geomanist-thin-webfont.woff2') format('woff2'),
         url('../../files/_fonts/geomanist-thin-webfont.woff') format('woff'),
         url('../../files/_fonts/geomanist-thin-webfont.ttf') format('truetype'),
         url('../../files/_fonts/geomanist-thin-webfont.svg#geomanistthin') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'fa';
  src: url('../../files/_fonts/fontawesome-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}