#special-button, #special-button-editor {
    /*    display: none;*/
}

#special-button > img {
    width: 100%;
    height: 100%;
}

.page-home #special-button {
    right: 26px;
    display: block;
    position: absolute;
    right: 14px;
    top: 27px;
    width: 64px;
    height: 64px;
    background-repeat: no-repeat;
    z-index: 9999999;
    background-size: cover;
    border-radius: 50%;
}

#special-button {
    display: none;
}

.page-home #special-button-editor {
    display: block;
}

.home-timeline-events-container {
    display: none;    
}
.home-timeline-events-container ul{
    display: none;    
}

.mce-content-body .cb-tex-image-container img, .cb-tex-image-container img {
    width: 100%;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}


a:hover,
a.active {
    color: #ACACAC;
}

p {
    line-height: 120%;
    margin: 1em 0;
    font-size: 19.2px;
}
p i,
p em {
    font-family: 'Sabon LT W01 Italic', serif;
    line-height: 120%;
}
p b,
p strong {
    /*    font-family: 'Sabon Next W01 Bold', serif;*/
    font-family: 'Sabon', serif;
    font-weight: 700;
}
p a {
    /*    font-family: 'Sabon Next W01 Bold', serif;*/
    text-transform: none;
    font-family: 'Sabon', serif;
    font-weight: 700;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Futura-condensed-bold';
}


h2#blog-headline {
    font-size: 24px;
    font-family: 'Futura-Condensed-Bold';
    font-weight: 400;
}

.loader {
    background-image: url('images/content-loader.gif');
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    margin: 3em 0;
}

/* auto-resizing images */
.scaling-image {
    display: block;
    margin: 1em 0;
    background-color: #ECECED;
    background-image: url('images/image-loader.gif');
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}
.scaling-image img {
    display: block;
    background-color: #FFFEF8;
}

/* separators */
.vertical-separator-left,
.vertical-separator-right {
    position: relative;
    background-image: url('images/vertical-separator.png');
    background-repeat: no-repeat;
    background-color: #FFFEF8;
    min-height: 100px;
}
.vertical-separator-left {
    background-position: left bottom;
}
.vertical-separator-right {
    background-position: right bottom;
}
.vertical-separator-arrow-left,
.vertical-separator-arrow-right {
    display: block;
    position: absolute;
    top: 50%;
    margin: -7px 0px 0px 0px;
    width: 7px;
    height: 14px;
    background-image: url('images/vertical-separator-arrows.png');
    background-repeat: no-repeat;
    z-index: 1;
}
.vertical-separator-arrow-left {
    left: -6px;
    background-position: 0px 0px;
}
.vertical-separator-arrow-right {
    right: -6px;
    background-position: -7px 0px;
}
.horizontal-separator-arrow-top,
.horizontal-separator-arrow-bottom {
    display: none;
    position: absolute;
    left: 50%;
    margin: 0px 0px 0px -7px;
    width: 14px;
    height: 7px;
    background-image: url('images/horizontal-separator-light-arrows.png');
    background-repeat: no-repeat;
    z-index: 1;
}
.horizontal-separator-arrow-top {
    top: -6px;
    background-position: 0px 0px;
}
.horizontal-separator-arrow-bottom {
    bottom: -6px;
    background-position: 0px -7px;
}

/* collapsible */

.collapsible > .content {
    margin: 1em 0 3em 0;
}
.collapsible > h1 a {
    font-family: 'Sabon Next W01 Bold', serif;
}
.collapsible.collapsed > .content {
    display: none;
}

/* date selector */
.date-selector-placeholder {
    margin: 0 0 3em 0;

    /*
     * This height needs to exactly match the height of the selector to ensure
     * that the selector does not hide the content when scrolling to the very
     * top.
     */
    /*    height: 14em;*/
}
.page-home .date-selector-placeholder {
    height: 8em;
}
.date-selector-wrap .date-selector,
.date-selector-wrap .date-selector .days-wrap,
.date-selector-wrap .date-selector .months-wrap {
    /*
     * Make sure to adjust the height of the placeholder as well when changing
     * this.
     */
    height: 8.1em;
    margin-top: 0.2em;
}
.date-selector-wrap .date-selector .days-wrap .fade-top,
.date-selector-wrap .date-selector .days-wrap .fade-bottom,
.date-selector-wrap .date-selector .months-wrap .fade-top,
.date-selector-wrap .date-selector .months-wrap .fade-bottom {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 50px;
    z-index: 2;
    background-repeat: repeat-x;
}
.date-selector-wrap .date-selector .days-wrap .fade-top,
.date-selector-wrap .date-selector .months-wrap .fade-top {
    top: -1px; /* account for smartphone calculation inaccuracies */
    background-position: center top;
    background-image: url('images/fade-top.png');
}
.date-selector-wrap .date-selector .days-wrap .fade-bottom,
.date-selector-wrap .date-selector .months-wrap .fade-bottom {
    bottom: -1px; /* account for smartphone calculation inaccuracies */
    background-position: center bottom;
    background-image: url('images/fade-bottom.png');
}
.date-selector-wrap {
    position: fixed;
    top: 52px;
    z-index: 2;
    background-color: #FFFEF8;
    width: 38em;
}

.date-selector-wrap > header {
    margin: 1em 0 1.4em 0;
    text-align: center;
}
.date-selector-wrap > header a {
    font-size: 2em;
}
.date-selector-wrap .date-selector {
    width: 36em;
    margin: auto;
    text-transform: uppercase;
}


body.page-home-barrierefrei .date-selector-wrap {
    z-index: 100;
}

body.page-home-barrierefrei .date-selector-wrap .date-selector {
    display: flex;
    justify-content: center;
}

body.page-home-barrierefrei .date-selector-wrap .date-selector .filters {
    text-align: center;
}

body.page-home-barrierefrei .date-selector-wrap .months-link-list {
    margin-top: 10px;
}

.date-selector-wrap .date-selector .filters,
.date-selector-wrap .date-selector .days-wrap,
.date-selector-wrap .date-selector .months-wrap {
    float: left;
}
.date-selector-wrap .date-selector .filters {
    width: 9.6em;
    text-align: right;
    padding: 1.65em 0 0 0;
}
.date-selector-wrap .date-selector ul.filters,
.date-selector-wrap .date-selector ul.filters li {
    line-height: 110%;
}
.date-selector-wrap .date-selector .filters a {
    /*    font-family: 'FuturaW01-MediumCondens', sans-serif;*/
    font-weight: 100;
}
.date-selector-wrap .date-selector .filters a.active {
    font-family: 'Futura', sans-serif;
    color: #303030;
    font-weight: 600;
}
.date-selector-wrap .date-selector .filters a.cancel {
    display: none;
}
.date-selector-wrap .date-selector .days-wrap,
.date-selector-wrap .date-selector .months-wrap {
    position: relative;
    /*    font-family: 'FuturaW01-BoldCondensed 774890', sans-serif;*/
    font-family: 'Futura', sans-serif;
    overflow: hidden;
    margin-left: 1em;
}
.date-selector-wrap .date-selector .days-wrap .scroll-position-wrap,
.date-selector-wrap .date-selector .months-wrap .scroll-position-wrap {
    position: absolute;
    top: 0;
    font-size: 8.5em;
    line-height: 1em;
    z-index: 1;
}
.date-selector-wrap .date-selector .days-wrap .days,
.date-selector-wrap .date-selector .months-wrap .months {
    font-size: 0.8em;
    cursor: all-scroll;
    font-weight: 600;
}
.date-selector-wrap .date-selector .days-wrap .days:hover,
.date-selector-wrap .date-selector .months-wrap .months:hover {
    color: #ACACAC;
}
.date-selector-wrap .date-selector .days-wrap {
    width: 10.4em;
    text-align: right;
}
.date-selector-wrap .date-selector .days-wrap .scroll-position-wrap {
    right: 0;
}
.date-selector-wrap .date-selector .months-wrap {
    width: 18em;
    text-align: left;
}
.date-selector-wrap .date-selector .months-wrap .scroll-position-wrap {
    left: 0;
}
.date-selector-wrap .date-selector-handheld-controls {
    display: none;
}
.date-selector-wrap .months-link-list{
    display: inline-block;
    /*    margin-left: 1.5em;*/
    margin-bottom: 1em;
    width: 38em;
}

.date-selector-wrap .months-link-list > li {
    display: inline;
    margin-right: 0.5em;
}
.date-selector-wrap .months-link-list > li > a {
    /*    font-family: 'FuturaW01-MediumCondens', sans-serif;*/
    text-transform: uppercase;
    color: #ACACAC;
}
.date-selector-wrap .months-link-list > li > a.active {
    /*    font-family: 'FuturaW01-MediumCondens', sans-serif;*/
    text-decoration: underline;
    color: #303030;
}

body.page-home-barrierefrei .date-selector-wrap .months-link-list {
    margin-top: 30px;
}


body.page-home-barrierefrei .date-selector-wrap .months-link-list > li > a {
    color: #000;
}

.home-timeline-event-title {
    position: relative;
    display: inline-flex;
}

.overview-date-n-flags {
    position: relative;
    display: inline-block;
}

a.i-cal-icon {
    background: url(../../media/images/theaterbremen_kalender_icon.svg);
    display: inline-block;
    width: 21px;
    height: 20px;
    margin-left: 5px;
    vertical-align: middle;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    right: -28px;
    font-size: 0;
}

body.page-home-barrierefrei a.i-cal-icon{
    position: relative;
    right: initial;
}

body.page-home-barrierefrei h2.date{
    display: inline-block;
    font-family: 'Sabon', serif!important;
    text-transform: initial;
    font-weight: 500!important;
}

/* events */
article.event {
    margin: 0.5em 0 2em 0;
}
article.event > h1 {
    margin: 0.3em 0;
}
article.event p.info {
    text-align: center;
}
p.info.overview-info {
    margin: 0;
    margin-top: -4px;
}
p.special-notice {
    font-family: 'Sabon', serif;
}
article.event.highlighted {
    background-color: #E6E6E6;
    padding: 10px 10px 1px 0px;
}
/* layer */
body > .layer {
    position: absolute;
    top: 0;
    left: 2em;
    right: 2em;
    margin: 2em 0;
    background-color: #FFFEF8;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    z-index: 100;
    border: 1px solid #D5D4CF;
}
body > .layer > .close-button-wrap {
    text-align: right;
    padding: 0.9em;
    text-transform: uppercase;
}
body > .layer > .content {
    padding: 1em 0;
    margin: auto;
    text-align: center;
    border: 0;
}

/* cb-tm insts */
.tm-inst > h1 {
    font-family: 'Sabon LT W01 Roman',​serif;
    margin: 1em 0;
}

/* cb-tm threads */
.tm-thread ul li {
    margin: 1em 0;
}
.tm-thread ul li .scaling-image {
    margin: 0.5em 0;
}
.tm-thread ul li a {
    display: block;
    text-transform: none;
}

/* event detail and article video */
.article-video-wrap,
.production-video-wrap,
.player-viewport-wrap{
    position: relative;
    width: 100%;
    /*    padding-bottom: 56.25%;*/
    transition: padding 0.6s;
}

.production-video-wrap {
    margin-bottom: 30px;
}

@media screen and (min-width: 1024px) {
    .home-timeline-events-container {
        padding-bottom: 1.6em;
        text-transform: uppercase;
        background: #FFFEF8;
        margin-top: -1px;
        padding-top: 15px;
        display: block; 
    }

    .home-timeline-events-container ul{
        display: block;    
    }

    .home-timeline-event-title span:first-of-type {
        font-weight: 600;
    }
    .header-center-inner-container {
        width: 36em;
        margin: auto;
        position: relative;
    }
    .page-home #special-button {
        display: block;
        position: absolute;
        right: 51px;
        top: 27px;
        width: 64px;
        height: 64px;
        background-repeat: no-repeat;
        z-index: 9999999;
        background-size: cover;
        border-radius: 50%;
        /*        background-image: url(../../media/images/4tagetanz/4TageTanz_98px.png);*/
    }

    #special-button > img {
        width: 100%;
        height: 100%;
    }
    .date-selector-placeholder {
        height: 14em;
    }
    .page-home .date-selector-placeholder {
        height: 26em;
    }
    .page-home .date-selector-placeholder.timeline-closed {
        height: 21em;
    }
    .date-selector-wrap .date-selector .days-wrap {
        width: 6.4em;
    }
    body > .layer > .content {
        width: 36em;
        margin: auto;
    }
    .mce-content-body .cb-tex-image-container img,
    .cb-tex-image-container img {
        /*        width: auto;*/
    }
}

@media screen and (min-width: 1024px) {
    .page-home #special-button {
        top: 54px;
    }
    .date-selector-wrap {
        top: 80px;
    }
    .article-video-wrap,
    .production-video-wrap,
    .player-viewport-wrap{
        /*        padding-bottom: 56.25%;*/
    }
}
article.video .video-js,
article.video .video-js video,
article.magazine .video-js,
article.magazine .video-js video,
#einfuehrung .video-js,
#einfuehrung .video-js video,
#audiodeskription .video-js,
#audiodeskription .video-js video,
#videos .video-js,
#videos .video-js video{
    padding: 0 !important;
    display: flex;
    /*    position:absolute !important;
        top: -9999px;
        bottom: -9999px;
        left: -9999px;
        right: -9999px;*/
    /*    position: relative !important;*/
    /*    height:100% !important;*/
    margin: auto !important;
    width: 100% !important;
    justify-content: center;
    align-items: center;
}

.video-wrap {
    /*    width: 83%;*/
    margin: auto;
}
.page-home .video-wrap {
    width: 83%;
    margin: auto;
}

/* videojs */
.video-js{
    color: #303030;
}
.video-js, .video-js video {
    width: 100% !important;
    /*    height: 100% !important;*/
}
.video-js.vjs-has-started video {
    width: 100% !important;
    height: 100% !important;
}
.vjs-default-skin .vjs-big-play-button:before {
    content: '';
}
.vjs-poster{
    background-size: cover;
}
.vjs-control-bar{

}
.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
    width: 100px !important;
    height: 100px !important;
    border: 0;
    background:url(../../media/images/play_icon.png) no-repeat center;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    font-size: 38px;
    color: rgb(255, 255, 255);
    z-index: 50;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
}
.vjs-default-skin .vjs-big-play-button:before {
    content: '';
}
.vjs-default-skin:hover .vjs-big-play-button,
.vjs-default-skin .vjs-big-play-button:focus {
    border: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

@media screen and (min-width: 1024px) {
    .date-selector-wrap {
        width: 68vw;
        left: 0;
        right: 0;
        margin: auto;
        transition: all .4s ease;
    }

    .date-selector-wrap.sticky{
        top: 0px;
    }
}

@media screen and (min-width: 1300px) {
    .page-home #special-button  {
        width: 78px;
        height: 78px;
    }
}

@media only screen and (min-width: 1824px) {
    .page-home #special-button  {
        width: 98px;
        height: 98px;
        right: 36px;
        top: 39px;
    }

}