/* list view (leuchttisch) */
.mediathek .videoPreviews {
    padding: 0;
    margin: 0;
}
.mediathek .videoPreviews li {
    float: left;
    list-style-type: none;
    width: 218px;
    height: 260px;
    margin: 0 0 0 23px;
    color: #57585A;
}
#content #main .mediathek .videoPreviews li.firstInRow,
.mediathek .videoPreviews li.firstInRow {
    margin-left: 0 !important; /* overruling selector '#content #main ol li' with an important on margin */
}
.mediathek .videoPreviews li .caption {
    display: block;
}
.mediathek .videoMeta {
    text-align: right;
    padding-bottom: 4px;
    font-size: 12px;
    color: #57585A;
}
.mediathek-teaser .videoMeta {
    padding-bottom: 0;
}
.mediathek .videoMeta .date {
    display: block;
    float: left;
    font-weight: bold;
}
.mediathek .videoPreviews li .imageWrapper a {
    display: block;
}
.mediathek .videoPreviews li .videoTitle {
    display: block;
    font-weight: bold;
    font-style: normal;
    padding-top: 5px;
}
.mediathek .videoPreviews li .videoTitle a {
    color: #9C0000;
}
.mediathek .videoPreviews li .imageWrapper {
    position: relative;
}
/*.ie-play-button,*/
/*.mediathek .videoPreviews li .imageWrapper a:before {*/
    /*background: url("/images/video_play_icon.png") no-repeat scroll 50% 50% transparent;*/
    /*content: " ";*/
    /*display: block;*/
    /*height: 100%;*/
    /*left: 0;*/
    /*margin: 5px 0 0 -2px;*/
    /*position: absolute;*/
    /*top: 0;*/
    /*width: 100%;*/
    /*z-index: 10;*/
/*}*/

/* using video js button instead */
.vjs-icon-play:before, .video-js .vjs-big-play-button:before, .video-js .vjs-play-control:before {
    color: #fff;
}

.ie-play-button-small,
.mediathek .videoTeasers li .imageWrapper a:before {
    background-image: url("/images/video_play_icon_small.png")
}

.mediathek .lightTable {
    margin: 41px 0;
}

/* detail view */
.videoArea .videoWrapper {
    margin: 10px auto;
    width: 548px;
}
.detail .mediathek .caption,
.detail .mediathek h2 {
    color: #57585A;
    margin: 32px 0 36px 0;
}

/* teaser like on homepage */
.mediathek-teaser {
    margin-bottom: 20px;
    border-bottom: 4px solid #D7DBDC;
}
.mediathek-teaser .videoTeasers {
    padding: 0 0 18px 0;
    border-bottom: 1px dotted #000;
    clear: both;
    overflow: hidden;
}
.mediathek-teaser .videoTeasers li {
    height: 240px;
    overflow: hidden;
    width: 143px;
}
.mediathek-teaser .moreLinkhtml {
    clear: both;
    display: block;
    float: none;
    line-height: 21px;
    padding: 10px 0;
    width: 100%;
}

/* headline on homepage */
.mediathek-teaser h2.meta {
    margin: 14px 0 10px;
}

/* max height and max width for preview images */
.videoTeasers .imageWrapper {
    background-color: #D7DBDC;
    width: 143px;
    height: 80px;
}

.videoTeasers .imageWrapper img {
    width: auto;
    height: 80px;
    display: block;
    margin: 0 auto;
}

.lightTable .imageWrapper {
    background-color: #D7DBDC;
    width: 218px;
    height: 123px;
}

.lightTable .imageWrapper img {
    width: auto;
    height: 123px;
    display: block;
    margin: 0 auto;
}

/* media center (mediathek) in accordion context */
#content #main .listArea .wrapper .mediathek-teaser .preview {
    width: auto;
    clear: both;
    overflow: hidden;
    height: auto;
    margin: 0 !important;
    padding: 10px 0 15px 5px;
    float: none;
}
#main .listArea .wrapper .mediathek-teaser .preview .imageWrapper {
    position: relative;
    width: 143px;
    float: left;
    height: 80px;
}
#main .listArea .wrapper .mediathek-teaser .videoTeasers {
    border-bottom: 0 none;
    padding: 0;
    margin: 16px -10px 0 -10px;
}
#main .listArea .wrapper .mediathek-teaser .preview .videoTitle,
#main .listArea .wrapper .mediathek-teaser .preview .videoMeta,
#main .listArea .wrapper .mediathek-teaser .preview .caption {
    font-size: 13px;
    padding: 0 5px;
}
#main .listArea .wrapper .mediathek-teaser .preview .videoMeta {
    padding: 0;
    width: 305px;
    float: right;
}
#main .listArea .wrapper .mediathek-teaser .preview .videoTitle,
#main .listArea .wrapper .mediathek-teaser .preview .caption {
    line-height: 16px;
    margin: 5px 0 0 143px;
}
#main .listArea .wrapper .mediathek-teaser .preview .videoTitle {
    margin-top: 5px;
}
#main .listArea .wrapper .mediathek-teaser .preview .playTime {
    padding: 0 5px;
}