/* =Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, figure, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    clear: both;
}

ol, ul {
    list-style: none;
}

blockquote {
    quotes: none;
}

blockquote:before, blockquote:after {
    content: none;
}

del {
    text-decoration: line-through;
}

table {
    border-spacing: 0;
}


a img {
    border: none;
}

img {
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

img.tabgif {
    height: 5px;
}

figure img {
    max-width: 100%;
    height: auto;
}

/* =Fonts
-------------------------------------------------------------- */

/* merriweather-regular - latin */
@font-face {
    font-family: 'Merriweather';
    font-style: normal;
    font-weight: 400;
    src: url('/assets/fonts/merriweather-v30-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/merriweather-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/merriweather-v30-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/merriweather-v30-latin-regular.svg#Merriweather') format('svg'); /* Legacy iOS */
    font-display: swap;
}
/* merriweather-italic - latin */
@font-face {
    font-family: 'Merriweather';
    font-style: italic;
    font-weight: 400;
    src: url('/assets/fonts/merriweather-v30-latin-italic.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/merriweather-v30-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/merriweather-v30-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-italic.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/merriweather-v30-latin-italic.svg#Merriweather') format('svg'); /* Legacy iOS */
    font-display: swap;
}
/* merriweather-700 - latin */
@font-face {
    font-family: 'Merriweather';
    font-style: normal;
    font-weight: 700;
    src: url('/assets/fonts/merriweather-v30-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/merriweather-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/merriweather-v30-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-700.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/merriweather-v30-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/merriweather-v30-latin-700.svg#Merriweather') format('svg'); /* Legacy iOS */
    font-display: swap;
}

/* source-sans-pro-200 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 200;
    src: url('/assets/fonts/source-sans-pro-v21-latin-200.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/source-sans-pro-v21-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/source-sans-pro-v21-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-200.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/source-sans-pro-v21-latin-200.svg#SourceSansPro') format('svg'); /* Legacy iOS */
    font-display: swap;
}
/* source-sans-pro-300 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: url('/assets/fonts/source-sans-pro-v21-latin-300.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/source-sans-pro-v21-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/source-sans-pro-v21-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-300.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/source-sans-pro-v21-latin-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
    font-display: swap;
}
/* source-sans-pro-regular - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: url('/assets/fonts/source-sans-pro-v21-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/source-sans-pro-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/source-sans-pro-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/source-sans-pro-v21-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
    font-display: swap;
}
/* source-sans-pro-700 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 700;
    src: url('/assets/fonts/source-sans-pro-v21-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/assets/fonts/source-sans-pro-v21-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/assets/fonts/source-sans-pro-v21-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-700.woff') format('woff'), /* Modern Browsers */
    url('/assets/fonts/source-sans-pro-v21-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
    url('/assets/fonts/source-sans-pro-v21-latin-700.svg#SourceSansPro') format('svg'); /* Legacy iOS */
    font-display: swap;
}


body {
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
}

h1,
.news-text,
.forum-eintrag-text,
.movie-content-text,
.hauptkritik .forum-eintrag-sprechblase h3,
.filmtitel,
.filmbewertungen-bewertung {
    font-family: "Merriweather", Georgia, serif;
}

.serif {
    font-family: "Merriweather", Georgia, serif;
}

.font1 {
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
}
.font2 {
    font-family: "Merriweather", Georgia, serif;
}


.hauptkritik .review-category,
.filmtitel span,
.filmblock i,
.movieline,
h3.news-zwischentitel-linie,
.news-text small,
.news-text h2,
.news-text h3,
.news-text h4,
.news-text h5,
h1.serif span,
.zusatzinfo,
.forum-eintrag-text small {
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
}

@font-face {
    font-family: "uncut";
    src: url("/assets/fonts/uncut5.eot");
    src: url("/assets/fonts/uncut5.eot?#iefix") format("embedded-opentype"),
    url("/assets/fonts/uncut5.woff") format("woff"),
    url("/assets/fonts/uncut5.ttf") format("truetype"),
    url("/assets/fonts/uncut5.svg#uncut") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;

}

/*noinspection CssNoGenericFontName*/
[data-icon]:before {
    font-family: "uncut" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;

    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none;
}

/*noinspection CssNoGenericFontName*/
[class^="icon-"]:before,
[class*=" icon-"]:before {
    font-family: "uncut" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a [class^="icon-"]:before,
a [class*=" icon-"]:before {
    text-decoration: none;
}

.icon-icon-fb:before {
    content: "\66";

}

.icon-icon-tw:before {
    content: "\74";
}

.icon-icon-yt:before {
    content: "\79";
}

.icon-icon-gp:before {
    content: "\67";
}

.icon-icon-ig:before {
    content: "\69";
}

.icon-zoom-in:before {
    content: "\2b";
}

.icon-zoom-out:before {
    content: "\2d";
}

.icon-award:before {
    content: "\6f";
}

.icon-arrows-in:before {
    content: "\6d";
}

.icon-arrows-out:before {
    content: "\78";
}

.icon-bubble:before {
    content: "\6b";
}

.icon-star-full:before {
    content: "\2a";
}

.icon-star-empty:before {
    content: "\30";
}

.icon-star-half:before {
    content: "\35";
}

.icon-new-post:before {
    content: "\62";
}

.icon-forum:before {
    content: "\63";
}

.forum-icon {
    font-family:"uncut";
    text-decoration:none;
    padding:0 0 0 0.25em;
    color:#666666;
}
a.forum-icon:hover {
    text-decoration:none;
    color:#C00;
}


.button-bar span.icon {
    background: none;
    border: none;
    margin: 0;
    padding: 3px 9px 0 4px;
    color: #7d9cbc;
}


/* =Struktur
-------------------------------------------------------------- */

/* Page24 */

.site-header {
    background: linear-gradient(180deg, #0c588d, #09699a, #0f7aa5, #1d8baf, #2d9cb9, #3fadc1);
    width: 100%;
    z-index: 9;
    transition: .3s;
}
.site-header-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
}
.site-main {
    min-height: calc(100vh - 39rem);
    display:flex;
    align-items: stretch;
}
.site-main-left,
.site-main-right {
    display:none;
}

.site-main-center {
    width: 100%;
    background:#fff;
}

@media screen and (min-width: 62.5rem) {
    .site-header-center {
        width: 62.5rem;
        margin: 0 auto;
    }
    .site-main {
        background: #c9dce0;
    }
    .site-main-center {
        display:block;
    }
    .site-main-left,
    .site-main-right {
        display:flex;
        flex: 1;
        background: url("/assets/pic/filmstreifen.svg") repeat-y right top;
        background-size: 2rem 4rem;
        position: relative;
    }
    .site-main-right {
        background-position-x: left;
    }
    .site-main-left:before,
    .site-main-right:before {
        display:block;
        position: absolute;
        width: 100%;
        height:20rem;
        background: linear-gradient(to bottom, rgba(34, 84, 129, .2) 0%, rgba(34, 84, 129, 0) 100%);
        content:'';
        z-index: 3;
    }
   #r89-desktop-hpa-btf-left-big-0-wrapper,
   #r89-desktop-hpa-btf-right-big-0-wrapper,
   #r89-desktop-hpa-btf-left-small-0-wrapper,
   #r89-desktop-hpa-btf-right-small-0-wrapper {
        z-index:4;
    }
    .site-main-left:after,
    .site-main-right:after {
        display:block;
        position: absolute;
        width: .75rem;
        height:100%;
        background: linear-gradient(to right, rgba(34, 84, 129, .1) 0%, rgba(34, 84, 129, 0) 100%);
        content:'';
        z-index: 3;
    }
    .site-main-left:after {
        background: linear-gradient(to left, rgba(34, 84, 129, .1) 0%, rgba(34, 84, 129, 0) 100%);
        right:0;
    }
    .site-main-center {
        flex: 0 0 62.5rem;
    }

}

/* Page */

.page-header-logo {
    flex: 0 0 114px;
}

.page-header-special {
    position: absolute;
    text-align: center;
    right: 20%;
    width: 50%;
    top: 3rem;
}

@media only screen and (min-width: 400px) {
    .page-header-special {
        right: 20%;
        width: 60%;
        top: 1rem;
    }
}

@media only screen and (min-width: 640px) {
    .page-header-nav {
        position: relative;
    }

    .page-header-special {
        right: 20%;
        top: 1.5rem;
        width: 80%;
    }
}

#content {
    background: #fff;
    position: relative;
}

.content-area {
    padding-bottom: 2em;
}

.content-full {
    width: 100%;
}
.content100,
.content90,
.content85,
.content80 {
    padding: 0 3.75%;
}
.content-footer {
    background-color: #DEE7EF;
    width: 100%;
}
.content-footer-area {
    padding: 1.5rem 0 1rem;
}

.content-footer-linkbox {
    padding: 1rem 3.75%;
}
.content-footer-linkbox h4 {
    color: rgb(34, 84, 129);
    font-size:1.25rem;
}
.content-footer-linkbox li {
    padding: 0 0 .25rem 0;
}
.content-footer-linkbox a {
    display: block;
    background-color: rgba(116,141,168,.2);
    border-radius: 4px;
    padding:4px 10px;
}
.content-footer-linkbox a:hover {
    background-color: rgba(116,141,168,1);
    color:#fff;
}
@media only screen and (min-width: 25rem) {

    .content-footer-linkbox-2 h4,
    .content-footer-linkbox-4 h4{
        text-align: center;
    }

    .content-footer-linkbox ul{
        width: 100%;
        display: flex;
        justify-content: space-between;
        flex-flow: wrap;
    }
    .content-footer-linkbox li {
        padding: 0 0 .25rem 0;
        flex: 0 0 48.5%;
    }
    .content-footer-linkbox a{
        text-align: center;
    }
}
@media only screen and (min-width: 35rem) {

    .content-footer-linkbox h4 {
        text-align: center;
    }
    .content-footer-linkbox li {
        padding: 0 0 .25rem 0;
    }
    .content-footer-linkbox-3 li,
    .content-footer-linkbox-4 li,
    .content-footer-linkbox-5 li {
        flex: 0 0 32%;
    }
    .content-footer-linkbox a {
        text-align: center;
    }
}
@media only screen and (min-width: 40rem) {

    .content-footer-linkbox-4 li {
        flex: 0 0 24%;
    }
    .content-footer-linkbox-5 li {
        flex: 0 0 19%;
    }
}


.suche {
    position: absolute;
    right: 0;
    top: 0;
}

.suche #searchstr {
    cursor: pointer;
    height: 20px;
    margin: 12px 14px 12px 0;
    padding: 3px 12px;
    width: 98px;
    position: relative;
    background: #588cae url(../pic/lupe.png) no-repeat 60px 0;
    border: none;
    border-radius: 13px;
    transition: all 300ms ease 0s;
    box-shadow: none;
    color: #dde1e8;
}

.suche #searchstr:focus {
    width: 140px;
    cursor: text;
    background: #fff url(../pic/lupe.png) no-repeat 170px 0;
    box-shadow: -12px 0 12px 3px rgba(46, 80, 128, 1);
    color: #333;
    outline: 0 none;
}

.suche .suchen-button {
    display: none;
}

.subnav {
    position: relative;
    left: 0;
    width: 165px;
    margin-top: 175px;
    margin-left: 13px;
}

.button-links {
    margin-bottom: 20px;
    margin-left: 14px;
    position: relative;
    top: -40px;
    background: rgba(0, 0, 0, 0.2);
    width: 170px;
    overflow: hidden;
}

.button-links a {
    text-decoration: none;
    color: #fff;
}

.button-links a b,
.button-links a strong {
    text-decoration: underline;
}

.button-links-text {
    width: 148px;
    padding: 7px 10px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 14px;
    line-height: 18px;
}


@media only screen and (min-width: 606px) {
    .content80 {
        padding: 0;
        width: 560px;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 640px) {

    .page-header-logo {
        flex: 0 0 200px;
    }

}

@media only screen and (min-width: 770px) {
    .content85 {
        padding: 0;
        width: 660px;
        margin: 0 auto;
    }
}

@media only screen and (min-width: 790px) {
    .content90,
    .content100 {
        padding: 0 2em;
    }
}

@media only screen and (min-width: 870px) {
    .content90 {
        padding: 0;
        width: 750px;
        margin: 0 auto;
    }

}


/* Footer */

.site-footer {
    width: 100%;
    background:#243949;
    padding: 2rem 0 6rem;
}
@media screen and (min-width: 62.5rem) {
    .site-footer-center {
        width: 52.5rem;
        padding: 0 25px;
        margin: 0 auto;
    }
}

.footer-spalten {
    display:flex;
    flex-direction: column;
    padding-bottom:10px;
}
.footer-spalte {
   flex: 0 0 100%;
    padding: 0 1rem 1.5rem;
}

@media screen and (min-width: 62.5rem) {
    .footer-spalten {
        flex-direction: row;
        justify-content: space-between;
    }
    .footer-spalte {
        flex: 0 0 32%;
        padding: 0;
    }
}

.site-footer h3 {
    font-size: 1.75rem;
    font-weight: bold;
}

.footer-spalte h3 a {
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
}

.footer-spalte h3 a:hover {
    color: rgba(255, 255, 255, 1);
}

.footer-spalte li {
    padding: 1px 0;
}

.site-footer a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
}

.site-footer a:hover {
    color: rgba(255, 255, 255, 1);
    text-decoration: underline;
}

.footer-links {
    float: left;
    width: 45%;
    margin-top: 3em;
}

ul.social-links {
    display: flex;
    justify-content: center;
    list-style: none;
}
.social-links li {
    width:1.375rem;
    height:1.375rem;
    margin:.5rem 1rem;
}
.social-links a {
    position: relative;
    display: block;
    width:2.375rem;
    height:2.375rem;
}
.social-links a:before {
    position: absolute;
    left: .625rem;
    top: .625rem;
    width:0;
    height:0;
    border-radius: 50%;
    background:rgba(255,255,255,1);
    display: block;
    content:'';
    z-index: 0;
    transition: all 0.2s;
}
.social-links a:hover:before {
    left:-.5rem;
    top:-.5rem;
    width:2.375rem;
    height:2.375rem;
    background:rgba(255,255,255,.8);
}

.social-links svg {
    width:1.375rem;
    height:1.375rem;
    position: relative;
    z-index: 1;
}
.social-links a svg path{
    color:rgba(255,255,255,0.5);
}
.social-links a:hover svg path{
    color:rgba(0,0,0,1);
}

.footer-basics {
    width: 100%;
    clear: both;
    padding: 0.5rem 0;
    margin: 0.5rem 0 0 0;
    text-align: center;
}


/* =Basics
-------------------------------------------------------------- */

body {
    font-size: 1em;
    line-height: 1.4;
    font-weight: 400;
    color: #222;
    background-color: #0c588d;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
}
@media screen and (min-width: 35em) {
    body {
        background: #b9d1d6;
    }
}

a {
    color: #000
}

a:hover {
    color: #C00;
    text-decoration: underline;
}

::selection {
    background-color: #368;
    color: #fff;
}

h1 {
    font-size: 2rem;
    line-height: 1.3;
    font-weight: normal;
    border-bottom: 1px solid #B8D1E9;
    padding-bottom: 0.25rem;
    margin-bottom: 0.75rem;
}

h1.serif {
    font-weight: bold;
    line-height: 1.2;
    border-bottom: none;
}

h1.serif span {
    font-size: 1.75rem;
    font-weight: 200;
}

h1 a {
    color: #333;
    text-decoration: none;
}

h2 {
    font-size: 1.625rem;
    line-height: 1.2;
    color: #585f76;
    margin-bottom: 12px;
}
h2.h2zweizeilig span{font-size:1.25rem;}
h2.rot {color: #CC0000;}

h3 {
    font-size: 1.375rem;
    line-height: 1.2;
    color: #585f76;
    margin-bottom: 12px;
}

h4 {
    font-size: 1.25rem;
    line-height: 1.2;
    color: #585f76;
    margin-bottom: 10px;
}
h4 span {
    font-weight: 300;
}

h4.ohne a {
    color: #b1b8cd;
    text-decoration: none;
}

h4.ohne a:hover {
    color: #368;
    text-decoration: none;
}

h5 {
    font-size: 1.125rem;
    line-height: 1.2;
    font-weight: 700;
}

h2.zwischentitel-rot {
    color: #cc0000;
    font-size: 18px;
    font-weight: bold;
    margin-top: 20px;
    clear: none;
}
.hgroup2 h2 {
    margin-bottom:0;
}

@media only screen and (min-width: 600px) {

    h1 {
        font-size: 2.25rem;
    }

    h1.serif span {
        font-size: 2rem;
    }

    h2 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.5rem;
    }

    h4 {
        font-size: 1.25rem;
    }

    h5 {
        font-size: 1.25rem;
    }

}

@media only screen and (min-width: 800px) {

    h1 {
        font-size: 2.25rem;
    }

    h1.serif span {
        font-size: 2rem;
    }

    h2 {
        font-size: 2.25rem;
    }

    h3 {
        font-size: 1.75rem;
    }

    h4 {
        font-size: 1.5rem;
    }

    h5 {
        font-size: 1.25rem;
    }

}

.rot {
    color: #C00;
}
.blau {
    color: #368;
}
.text-hide {
    background: url("/pic/text-hide.gif") repeat center center;
    background-size: 50px 50px;
    color:#000;
}

hr {
    height: 0;
    width: 100%;
    margin-top: 12px;
    border-top: 2px dotted #B8D1E9;
    border-right-width: 0;
    border-bottom-width: 0;
    border-left-width: 0;
    clear: both;
}

hr.small-line {
    height: 0;
    width: 100%;
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px dotted #B8D1E9;
    border-right-width: 0;
    border-bottom-width: 0;
    border-left-width: 0;
    clear: both;
}

hr.linie-eng {
    height: 0;
    width: 100%;
    margin-top: 5px;
    padding-top: 5px;
    border-top: 2px dotted #B8D1E9;
    border-right-width: 0;
    border-bottom-width: 0;
    border-left-width: 0;
    clear: both;
}

hr.full-line {
    height: 0;
    width: 100%;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #B8D1E9;
    border-right-width: 0;
    border-bottom-width: 0;
    border-left-width: 0;
    clear: both;
}

.linkeseite {
    float: left;
}

.rechteseite {
    float: right;
}

.clear {
    clear: both;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.center {
    text-align: center;
}

.dreispaltig {
    display: flex;
    justify-content: space-between;
}

.dreispaltig > div {
    flex: 31%;
}

.cols4 > div {
   padding-bottom:1.5rem;
}

@media screen and (min-width: 35em) {
    .cols4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .cols4 > div {
        flex: 0 0 48%;
    }
}
@media screen and (min-width: 60em) {
    .cols4 > div {
        flex: 0 0 23.5%;
    }
}


.noborder {
    border: none;
}

.link {
    color: #000;
    text-decoration: underline;
}

.lineone {
    line-height: 1em;
}
.wide-box {
    background: #f8fafb;
    background: linear-gradient(to bottom, #f8fafb 0%, #e3eaf1 100%);
    border: 1px solid #d1dde9;
    padding: 5px;
    margin-bottom: 15px;
}

@media screen and (min-width: 47em) {

    .content-left {
        width: 430px;
        float: left;
    }

    .sidebar {
        width: 200px;
        float: right;
    }

}


/* =Navigation
-------------------------------------------------------------- */

.navigation  {
    width:100%;
    height:3em;
}

.navigation input {
    display: none;
}

.navigation nav > ul > li ul{
    display:none;
}
.navigation nav > ul > li.shortcuts ul{
    display:block;
}
.navigation nav > ul > li ul li{
    padding: 0 0 0 2rem;
}
.navigation nav > ul > li ul a{
    font-size:1rem;
}

body.news .navigation nav > ul > li:nth-child(1) ul{ display:block; }
body.filme .navigation nav > ul > li:nth-child(2) ul{ display:block; }
body.stars .navigation nav > ul > li:nth-child(3) ul{ display:block; }
body.quiz .navigation nav > ul > li:nth-child(4) ul{ display:block; }
body.community .navigation nav > ul > li:nth-child(5) ul{ display:block; }
body.specials .navigation nav > ul > li:nth-child(6) ul{ display:block; }
body.programm .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.graz .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.wien .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.linz .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.klagenfurt .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.innsbruck .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.salzburg .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.st-poelten .navigation nav > ul > li:nth-child(7) ul{ display:block; }
body.kinoprogramm .navigation nav > ul > li:nth-child(7) ul{ display:block; }


.navigation3 ul{
    overflow:hidden;
    padding-bottom:0.5em;
    font-size:0.875em;
}
.navigation3 li{
    padding:0 1em 0 0;
    float:left;
}
.navigation3 a{
    text-decoration:none;
}
.navigation3 a:hover{
    text-decoration:underline;
}
.navigation3 .aktiv{
    text-transform:uppercase;
    font-weight:bold;
}

/* (bis 640px) */
@media screen and (max-width: 39.99em) {

    .navigation label {
        position: absolute;
        top: 3.125em;
        right: 1.5em;
        height: 1.5em;
        width: 2em;
        z-index: 99;
    }
    .navigation input + label span {
        position: absolute;
        width: 100%;
        height: 0.25em;
        top: 50%;
        left: 0;
        display: block;
        background: #fff;
        transition: .4s;
    }
    .navigation input + label span:first-child {
        top: 0;
    }
    .navigation input + label span:last-child {
        top: 100%;
    }

    .navigation body label:hover {
        cursor: pointer;
    }

    .navigation input:checked + label span {
        opacity: 0;
        top: 50%;
    }
    .navigation input:checked + label span:first-child {
        opacity: 1;
        background: #000;
        transform: rotate(45deg);
    }
    .navigation input:checked + label span:last-child {
        opacity: 1;
        background: #000;
        transform: rotate(-45deg);
    }

    .navigation nav {
        background: rgba(255, 255, 255, 1);
        position: absolute;
        top: 0;
        left:-130%;
        width: 100%;
        padding:1em;
        z-index:97;
        transition: left .4s;
        border-bottom: 2px solid #B8D1E9;
        box-shadow: 0 0 8px 0 rgba(0,0,0,0.3);
    }

    .navigation input:checked ~ nav {
        left:0;
    }

    .navigation input:checked ~ nav > ul > li {
        display:block;
    }

    .navigation nav > ul{
        width:80%;
    }
    .navigation nav > ul > li{
        border-top: solid 1px #999;
    }

    .navigation nav > ul > li a{
        font-size:19px;
        display:block;
        padding:0.25rem;
        text-decoration:none;
    }
    .navigation nav > ul > li.shortcuts {
        padding-top:1rem;
    }
    .navigation nav > ul > li span:after{
        content:'Shortcuts';
        font-size:1rem;
        padding:1rem 0 0.25rem 0.25rem;
        color:#999;
    }
    .navigation nav > ul > li ul{
        margin-bottom:0.5rem;
    }

}


/* (640px) */
@media screen and (min-width: 40em) {


    .page-header-nav {
        flex: 1 1 auto;
    }

    body.news .navigation nav > ul > li:nth-child(1) ul{ display:flex; }
    body.filme .navigation nav > ul > li:nth-child(2) ul{ display:flex; }
    body.stars .navigation nav > ul > li:nth-child(3) ul{ display:flex; }
    body.quiz .navigation nav > ul > li:nth-child(4) ul{ display:flex; }
    body.community .navigation nav > ul > li:nth-child(5) ul{ display:flex; }
    body.specials .navigation nav > ul > li:nth-child(6) ul{ display:flex; }
    body.programm .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.graz .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.wien .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.linz .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.klagenfurt .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.villach .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.innsbruck .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.salzburg .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.st-poelten .navigation nav > ul > li:nth-child(7) ul{ display:flex; }
    body.kinoprogramm .navigation nav > ul > li:nth-child(7) ul{ display:flex; }

    body.news .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.filme .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.stars .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.quiz .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.community .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.specials .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.programm .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.graz .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.wien .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.linz .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.klagenfurt .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.villach .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.innsbruck .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.salzburg .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.st-poelten .navigation nav > ul > li.shortcuts ul{ display:none; }
    body.kinoprogramm .navigation nav > ul > li.shortcuts ul{ display:none; }

    body.news .navigation nav > ul > li:nth-child(1) > a,
    body.filme .navigation nav > ul > li:nth-child(2) > a,
    body.stars .navigation nav > ul > li:nth-child(3) > a,
    body.quiz .navigation nav > ul > li:nth-child(4) > a,
    body.community .navigation nav > ul > li:nth-child(5) > a,
    body.specials .navigation nav > ul > li:nth-child(6) > a,
    body.programm .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.graz .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.wien .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.linz .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.klagenfurt .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.villach .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.innsbruck .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.salzburg .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.st-poelten .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }
    body.kinoprogramm .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }


    body.kinoprogramm .navigation nav > ul > li:nth-child(7) > ul li:nth-child(1) a{ font-weight:700; }
    body.wien .navigation nav > ul > li:nth-child(7) > ul li:nth-child(2) a{ font-weight:700; }
    body.graz .navigation nav > ul > li:nth-child(7) > ul li:nth-child(3) a{ font-weight:700; }
    body.linz .navigation nav > ul > li:nth-child(7) > ul li:nth-child(4) a{ font-weight:700; }
    body.salzburg .navigation nav > ul > li:nth-child(7) > ul li:nth-child(5) a{ font-weight:700; }
    body.innsbruck .navigation nav > ul > li:nth-child(7) > ul li:nth-child(6) a{ font-weight:700; }
    body.st-poelten .navigation nav > ul > li:nth-child(7) > ul li:nth-child(7) a{ font-weight:700; }
    body.klagenfurt .navigation nav > ul > li:nth-child(7) > ul li:nth-child(8) a{ font-weight:700; }


    .navigation label {
        display:none;
    }
    .navigation nav {
        display: block;
        top: 5rem;
        position: relative;
        background:none;
    }
    .navigation input ~ nav > ul {
        display:flex;
        justify-content:space-between;


    }
    .navigation input ~ nav > ul li{
        float:left;
        font-size:1rem;
        margin:0;

    }
    .navigation input ~ nav > ul li a{
        color:rgba(255,255,255,0.9);
        font-weight:400;
        text-decoration:none;
    }
    .navigation input ~ nav > ul li a:hover{
        color:rgba(255,255,255,1);
        text-decoration:underline;
    }
    .navigation input ~ nav > ul li ul li a{
        font-weight:300;
        color: rgba(255,255,255,1);
    }


    .navigation nav > ul > li.shortcuts{
        width:0;
    }
    .navigation nav > ul > li.shortcuts ul {
        display: flex;
    }

    .navigation nav > ul > li ul{
        position:absolute;
        top:2.375em;
        left:0;
        width:95%;
        border-top:solid 1px rgba(255,255,255,0.3);
        justify-content:center;
        flex-wrap: wrap;
    }
    .navigation nav > ul > li ul li{
        margin:0;
        padding:0;
    }
    .navigation nav > ul > li ul a{
        padding:0 0.5em;
        color:rgba(255,255,255,0.6);
        font-size: 0.875rem;
        text-decoration:none;
    }
    .navigation nav > ul > li ul a:hover{
        color:rgba(255,255,255,1);
    }

    .suche {
        right: 0.25rem;
        top: 0.25rem;
    }

}

/* (800px) */
@media screen and (min-width: 50em) {

    .page-header-nav {
        padding-left:2%;
    }


    .navigation input ~ nav > ul li a{
        font-size:1.25rem;
        position:relative;
    }

    body.news .navigation nav > ul > li:nth-child(1) > a:after,
    body.filme .navigation nav > ul > li:nth-child(2) > a:after,
    body.stars .navigation nav > ul > li:nth-child(3) > a:after,
    body.quiz .navigation nav > ul > li:nth-child(4) > a:after,
    body.community .navigation nav > ul > li:nth-child(5) > a:after,
    body.specials .navigation nav > ul > li:nth-child(6) > a:after,
    body.programm .navigation nav > ul > li:nth-child(7) > a:after,
    body.graz .navigation nav > ul > li:nth-child(7) > a:after {
        display: block;
        content: '';
        background: url(../pic/nav-aktiv.png) no-repeat center top;
        top: 12px;
        width: 100%;
        height: 10px;
    }
    .navigation nav > ul > li ul a{
        font-size: 1rem;
    }

    body.stars-uebersicht .navigation nav > ul > li ul li:nth-child(1) > a{ color:#fff; position:relative;}

    body.stars-uebersicht .navigation nav > ul > li ul li:nth-child(1) > a:after {
        display: block;
        content: '';
        background: url(../pic/nav-aktiv.png) no-repeat center top;
        top: 14px;
        width: 100%;
        height: 12px;
    }

}

@media screen and (min-width: 62.5em) {
    .navigation nav > ul > li ul {
        padding-top: 0.625rem;
    }
}


/* =Teile
-------------------------------------------------------------- */

.liste-klein {
    margin-top: 2px;
    border-top: 1px dotted #B8D1E9;
}

.liste-klein li {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 2px;
    padding-bottom: 2px;
    padding-left: 0;
    border-bottom: 1px dotted #B8D1E9;
}

.liste-klein li a {
    text-decoration: none;
}

.linklinie {
    text-decoration: none;
    display: inline-block;
    border-bottom: solid 1px #b7c6d7;
}

.linklinie:hover {
    border-bottom: solid 1px #727e94;
    text-decoration: none;
}

.backlink {
    clear: both;
    text-align: center;
    margin: 14px 0 5px;
}

.backlink a {
    background: url(../pic/uncutbuttons.png) no-repeat 0 -12px;
    padding-left: 30px;
    font-size: 22px;
    color: #879ac0;
    text-decoration: none;
    margin: 0 auto;
}

.backlink a:hover {
    text-decoration: underline;
}

.nextlink {
    clear: both;
    text-align: center;
    margin: 14px 0 5px;
}

.nextlink a {
    font-size: 22px;
    color: #879ac0;
    text-decoration: none;
    margin: 0 auto;
}

.nextlink span {
    background: url(../pic/uncutbuttons.png) no-repeat right -56px;
    width: 55px;
    height: 29px;
    display: inline-block;
}

.nextlink a:hover {
    text-decoration: underline;
}

.nextlink-left {
    text-align: left;
    margin: 0;
}

.nextlink a {
    font-size: 20px;
}

a.linkleft {
    background: url(../pic/uncutbuttons.png) no-repeat 0 -12px;
    padding-left: 30px;
    font-size: 22px;
    color: #879ac0;
    text-decoration: none;
    margin: 0 auto;
}

a.linkleft:hover {
    text-decoration: underline;
}

a.linkright {
    font-size: 22px;
    color: #879ac0;
    text-decoration: none;
    margin: 0 auto;
    position: relative;
    padding-right: 36px;
}

a.linkright:after {
    background: url(../pic/uncutbuttons.png) no-repeat 0 -62px;
    width: 30px;
    height: 30px;
    right: 0;
    top: 0;
    content: '';
    position: absolute;
}

a.linkright:hover {
    text-decoration: underline;
}

.infobalken {
    overflow: hidden;
    position: relative;
    background: #edf0f5;
    background: linear-gradient(to bottom, #edf0f5 0%, #dfe4ed 100%);
    margin-bottom: 16px;

}

.infobalken-titel {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 1px;
    font-size: 44px;
    font-weight: 200;
    color: #fff;
    text-align: right;
    width: 300px;
}

.infobalken-bild {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
}

.infobalken-block-50 {
    position: relative;
    z-index: 1;
    left: 60px;
    top: 9px;
    min-height: 50px;
    line-height: 16px;
}

.infobalken-block-60 {
    position: relative;
    z-index: 1;
    left: 70px;
    padding-top: 8px;
    min-height: 46px;
    line-height: 20px;
    width: 480px;
    padding-bottom: 6px;
}

.infobalken-block-70 {
    position: relative;
    z-index: 1;
    left: 80px;
    padding-top: 8px;
    min-height: 56px;
    line-height: 20px;
    width: 480px;
    padding-bottom: 6px;
}

.infobalken-block-header {
    font-size: 16px;
    font-weight: 700;
}

.infobalken-block-header h4 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 0;
}

.infobalken-block-text {
    font-size: 14px;
    line-height: 18px;
}

.infobalken2 {
    font-size: 0.9375rem;
    padding: 0.5rem 0.5rem;
    margin: 1.75rem 0;
    line-height: 1.3;
    border-top: 1px solid #b3bfcf;
    border-bottom: 1px solid #b3bfcf;
    display: flex;
}

.infobalken2-bild {
    padding-right: 1rem;
}

.infobalken2-bild img {
    max-width: 10em;
    width: 10em;
}

.infoblock-a {
    background-color: #ECF1F5;
    border-bottom: 1px solid #B7D1EA;
    border-top: 1px solid #B7D1EA;
    margin-bottom: 24px;
}

.warnung {
    color: #900;
    border: solid 1px #900;
    display: block;
    border-radius: 0.5em;
    padding: 0.75em;
    margin: 1em 0;
    font-size: 1.25rem;
    line-height: 1.2;
    background: rgba(153, 0, 0, 0.2);
}

.warnung a {
    color: #000;
}

#content .warnung p:last-child {
    margin: 0;
    padding: 0;
}


/* =Bloecke */

.block100 {
    width: 100%;
}

.block90 {
    width: 90%;
}

.block80 {
    width: 80%;
}

.block-top {
    margin-top: 1.25em;
}

.block-bottom {
    margin-bottom: 1.25em;
}


.spalte21 {
    width: 320px;
    float: left;
    margin-right: 20px;
}

.spalte22 {
    width: 320px;
    float: left;
}

.grauezeile {
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
    color: #aaa;
    height: 22px;
    overflow: hidden;
    width: 100%;
    text-transform: uppercase;
}

.grauezeile span {
    display: block;
    width: 800px;
}


/* =Reiter */

.reiter {
    margin-top: 20px;
    background: #ffffff;
    background: linear-gradient(to bottom, #ffffff 0%, #cad8e5 100%);
    overflow: hidden;
    padding: 0 2.25rem;
    position: relative;
}

.reiter:before {
    content: '';
    right: 0;
    width: 40px;
    height: 100%;
    position: absolute;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);

}

.reiter:after {
    content: '';
    left: 0;
    width: 40px;
    height: 100%;
    position: absolute;
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);

}

.reiter ul {
    float: left;
    position: relative;
    left: 50%;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
}

.reiter ul li {
    float: left;
    position: relative;
    right: 50%;
    font-weight: 700;
    font-size: 1.25rem;
}

.reiter ul a {
    width: auto;
    display: block;
    padding: 4px 4px 3px 5px;
    text-decoration: none;
    border-top: 1px solid transparent;
}


.reiter ul a:hover {
    background: #adc1d5;
    color: #000;
}

.reiter ul .aktiv a {
    background: #fff;
    color: #990000;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 0 solid #FFF;
    border-left: 1px solid #000;
    -webkit-box-shadow: 0 -3px 3px 0 rgba(0, 0, 0, 0.27);
    -moz-box-shadow: 0 -3px 3px 0 rgba(0, 0, 0, 0.27);
    box-shadow: 0 -3px 3px 0 rgba(0, 0, 0, 0.27);
}

/* =Tabbed Reiter */

.tabbed {
    margin: 1rem 0 .5rem;
    padding-bottom: 1rem;
}

.tabbed [type="radio"] {
    display: none;
}

.tabs {
    display: flex;
    align-items: stretch;
    list-style: none;
    padding: 0 .75rem;
    border-bottom: 1px solid rgba(117, 136, 206, 1);
}
.tab > label {
    display: block;
    margin-bottom: -1px;
    margin-right:.5rem;
    padding: .375rem .625rem;
    border: 1px solid rgba(117, 136, 206, .4);
    border-bottom-color: rgba(117, 136, 206, 1);
    border-radius: .25rem .25rem 0 0;
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 66%, #cad8e5 100%);
    color: #666;
    cursor: pointer;
    font-weight: normal;
}
.tab:hover label {
    border-left: 1px solid rgba(117, 136, 206, .7);
    border-top: 1px solid rgba(117, 136, 206, .7);
    border-right: 1px solid rgba(117, 136, 206, .7);
    background: #fff;
    color: #000;
}

.tab-content {
    display: none;
    padding-top:1rem;
}

.tabbed [type="radio"]:nth-of-type(1):checked ~ .tabs .tab:nth-of-type(1) label,
.tabbed [type="radio"]:nth-of-type(2):checked ~ .tabs .tab:nth-of-type(2) label,
.tabbed [type="radio"]:nth-of-type(3):checked ~ .tabs .tab:nth-of-type(3) label,
.tabbed [type="radio"]:nth-of-type(4):checked ~ .tabs .tab:nth-of-type(4) label,
.tabbed [type="radio"]:nth-of-type(5):checked ~ .tabs .tab:nth-of-type(5) label {

    border-color: rgba(117, 136, 206, 1);
    border-bottom-color: #fff;
    background: #fff;
    color: #000;
    font-weight: bold;
}

.tabbed [type="radio"]:nth-of-type(1):checked ~ .tab-content:nth-of-type(1),
.tabbed [type="radio"]:nth-of-type(2):checked ~ .tab-content:nth-of-type(2),
.tabbed [type="radio"]:nth-of-type(3):checked ~ .tab-content:nth-of-type(3),
.tabbed [type="radio"]:nth-of-type(4):checked ~ .tab-content:nth-of-type(4) {
    display: block;
}

/* =Tabbed 2 (UL in DIV) */

.tabbed-row {
    position: relative;
}
.tabbed-row:before {
    height:1px;
    width: 100%;
    background: rgba(117, 136, 206, 1);
    position: absolute;
    bottom:14px;
    right:0;
    content:'';
}
.tabbed-row:after {
    height: 100%;
    width: 1.5rem;
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    position: absolute;
    top:0;
    right:0;
    content:'';
}

.tabbed-row div {
     width:100%;
     overflow-x: scroll;
     overflow-y: hidden;
     -webkit-overflow-scrolling: touch;
     scrollbar-width: none;
    position: relative;
    padding-bottom: 10px;
}
.tabbed-row div ul{
    display: flex;
    align-items: stretch;
    margin: .5rem 0 .25rem;
    overflow:hidden;
    width: max-content;
    min-width: 100%;
}

.tabbed-row div{
    &::-webkit-scrollbar {
        display: none;
    }
}
.tabbed-row li {
    display: flex;
    flex:0 0 auto;
    align-items: stretch;
    list-style: none;
    padding: 0 0 0 .25rem;
    min-width: 80px;
}
.tabbed-row li:first-child {
    padding-left: .5rem;
}
.tabbed-row a,
.tabbed-row span{
    display: block;
    margin-right:.25rem;
    width: 100%;
    padding: .375rem .75rem;
    border: 1px solid rgba(117, 136, 206, .4);
    border-bottom-color: rgba(117, 136, 206, 1);
    border-radius: .25rem .25rem 0 0;
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 66%, #cad8e5 100%);
    color: #666;
    cursor: pointer;
    font-weight: normal;
    text-decoration: none;
}
.tabbed-row a:hover{
    border-left: 1px solid rgba(117, 136, 206, .7);
    border-top: 1px solid rgba(117, 136, 206, .7);
    border-right: 1px solid rgba(117, 136, 206, .7);
    background: #fff;
    color: #000;
}
.tabbed-row .aktiv a{
    border-left: 1px solid rgba(117, 136, 206, .7);
    border-top: 1px solid rgba(117, 136, 206, .7);
    border-right: 1px solid rgba(117, 136, 206, .7);
    border-bottom-color: #fff;
    background: #fff;
}



/* =Tabellen */

.tabelle1 {
    width: 100%;
    border-top: 1px solid #c0d0e0;
    border-spacing: 0;
}

.tabelle1 th {
    background-color: #c0d0e0;
    margin: 0;
    padding: 2px 10px;
    text-align: left;
    color: #6c788d;
}

.tabelle1 th a {
    font-weight: 300;
}

.tabelle1 td {
    background-color: #ecf1f5;
    border-bottom: 1px solid #c0d0e0;
    margin: 0;
    padding: 5px 10px;
}

.tabelle2 {
    width: 100%;
    border-top: 1px solid #c0d0e0;
    border-spacing: 0;
}

.tabelle2 th {
    background-color: #c0d0e0;
    margin: 0;
    padding: 2px 10px;
    color: #6c788d;
}

.tabelle2 th a {
    font-weight: 300;
}

.tabelle2 td {
    background-color: #ecf1f5;
    margin: 0;
    border-top: solid 5px #fff;
    padding: 2px 10px;
    text-align: center;
    vertical-align: middle;
}

.tabelle2 td.left {
    text-align: left;
}

.tabelle2 td strong {
    text-align: left;
    font-size: 1.25em;
    font-weight: normal;
}

.tabelle-icon,
.tabelle2 td.tabelle-icon {
    padding: 0;
    width: 40px;
}


/* =Tabelle 3 (Preislisten) */

.tabelle3 {
    width: 100%;
    border-top: 1px solid #2C79A3;
    border-bottom: 2px solid #2C79A3;
}
.tabelle3 tr td {
    border-bottom: 1px dotted #2C79A3;
}
.tabelle3 tr:last-child td{
    border-bottom: none;
}
.tabelle3 tr.last td{
    border-bottom: 2px solid #2C79A3;
}
.tabelle3 td {
    padding: .25rem 0 .25rem .25rem;
    vertical-align: bottom;
}
.tabelle3 td:last-child {
    padding: .25rem .25rem .25rem .5rem;
    text-align: right;
    color:#000;
}
.tabelle3 tr.leer td {
    border-bottom: 1px solid #2C79A3;
    height:1.5rem;
    text-align:left;
    padding:0;
}
.tabelle3 tr.leer td h3{
    font-size:1.25rem;
    margin: 0;
    padding:.75rem 0 0;
    line-height: 1;
    position: relative;
    bottom:-.1875rem;
}



.timeline {
    width: 100%;
    border-spacing: 0;
}

.timeline th {
    margin: 0;
    border-bottom: 1px solid #c0d0e0;
    text-align: left;
    color: #b1b8cd;
    font-size: 12px;
    font-weight: normal;
    padding: 2px 5px 0;
}

.timeline th:nth-child(1) {
    text-align: center;
}

.timeline td {
    border-bottom: 1px solid #c0d0e0;
    margin: 0;
    padding: 5px 5px 7px;
    vertical-align: top;
}

.timeline td:nth-child(1) {
    font-size: 20px;
    width: 45px;
}

.timeline td:nth-child(1) a {
    color: #b1b8cd;
}

.timeline-mobile {
    margin-bottom: 24px;
}

@media only screen and (max-width: 640px) {
    .timeline-mobile b:after {
        content: 'Der direkte Klick auf die Beginnzeiten funktioniert leider auf den meisten Handys nicht!';
        font-size: 12px;
        font-weight: normal;
    }
}

/* =Listen */

ol {
    list-style: decimal;
    padding-left: 22px;
}

ol li {
    line-height: 20px;
    margin-bottom: 3px;
}

#content ol li {
    margin-bottom: 7px;
}


li.nostyle {
    list-style-type: none;
}

ul.liste1 {
    border-top: 1px solid #B7D1EA;
}

.liste1 li {
    border-bottom: 1px solid #B7D1EA;
}

.liste2 {
    padding-top: 2px;
    border-top: 1px dotted #B8D1E9;
}

.liste2 li {
    line-height: 18px;
    margin-bottom: 2px;
    padding-bottom: 2px;
    padding-left: 0;
    border-bottom: 1px dotted #B8D1E9;
}

ul.linkliste {
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 2rem;
}

ul.linkliste li {
    margin-top: 3px;
    margin-bottom: 5px;
}

ul.linkliste li a {
    display: block;
    background: url(../pic/linkpfeil.gif) no-repeat 0 6px;
    padding-left: 45px;
    transition: all 0.2s;
}

ul.linkliste li a:hover {
    background: url(../pic/linkpfeil.gif) no-repeat 5px 6px;
}

ul.liste5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul.liste5 li {
    margin-bottom: .625rem;
    flex: 0 0 48.5%;
}
@media only screen and (min-width: 30rem) {
    ul.liste5 li {
        flex: 0 0 31.5%;
    }
}
@media only screen and (min-width: 35rem) {
    ul.liste5 li {
        flex: 0 0 23%;
        flex: 0 0 23%;
    }
}
@media only screen and (min-width: 40rem) {
    ul.liste5 li {
        flex: 0 0 18.5%;
    }
}

ul.liste5quadrat a {
    display: block;
    position: relative;
    height: 125px;
    width: 125px;
    overflow: hidden;
    color: #fff;
    text-decoration: none;
}

ul.liste5quadrat li img {
    position: absolute;
}

ul.liste5quadrat li div {
    position: absolute;
    width: 105px;
    padding: 3px 10px;
    bottom: -100px;
    background: rgba(0, 0, 0, 0.5);
    transition: all 300ms ease 0s;
}

ul.liste5quadrat li a:hover div {
    bottom: 0;
}

ul.contentliste {
    list-style: disc;
    padding: 0 0 0 22px;
}

ul.contentliste li {
    padding: 5px 0;
}


/* = Liste mit Icon */

.iconliste li {
    background-color: #dee7ef;
    margin-bottom: 8px;
    display: table;
    width: 100%;
    line-height: 18px;
}

.iconliste-icon {
    display: table-cell;
    width: 64px;
}

.iconliste-icon img {
    height: 64px;
    width: 64px;
}

.iconliste-text {
    display: table-cell;
    vertical-align: middle;
    padding: 2px 8px 2px 13px;
    min-height: 42px;
}

.iconliste-endzahl {
    display: table-cell;
    width: 40px;
    vertical-align: middle;
    text-align: center;
    font-size: 26px;
    font-weight: 200;
    color: rgba(114, 126, 148, 0.7);
    border-left: 3px dotted #FFF;
}

.iconliste-zeiten {
    display: table-cell;
    width: 50px;
    vertical-align: middle;
    text-align: center;
    border-left: 3px dotted #FFF;
}

li.iconliste-titel {
    background-color: #fff;
    margin-bottom: 0;
}

li.iconliste-titel h3 {
    color: #cc0000;
    font-size: 18px;
    font-weight: bold;
    margin-top: 20px;
}

/* = Bilderliste Raster */

.bilderliste-raster {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.bilderliste-raster li {
    margin-bottom: 1em;
    flex: auto;
}

.bilderliste-raster li.placeholder {
    width: 114px;
    margin-bottom: 0;
}


/* =Formulare */


.formularzeile {
    padding: 1rem 0;
}

.formularzeile label {
    font-weight: 600;
    font-size: 1.5rem;
    color: #879ac0;
}

.formularzeile label span {
    font-weight: normal;
    font-size: .875rem;
}

.formularzeile input,
.formularzeile textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 5px 1%;
    border: 2px solid #B3BFCC;
    -webkit-border-radius: .5rem;
    border-radius: .5rem;
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, 0.1);
    font-size: 1.125rem;
    line-height: 1.3;
    font-family: Arial, Helvetica, sans-serif;
}

.zeichenanzahl {
    text-align: right;
    font-size: .75rem;
    padding-right: 3px;
    color: #879ac0;
}


.eingabefeld {
    cursor: text;
    margin: 10px;
    padding: 5px 10px;
    background: #fff;
    border: 1px solid #55749b;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    box-shadow: none;
    color: #55749b;
    font-size: 18px;
    outline: 0 none;
    float: left;
}

.login-name {
    color: #55749b;
    font-size: 18px;
    float: left;
    margin-top: 15px;
}

ul.radio-liste li {
    margin: 6px 0 8px 10px;
    font-size: 18px;
}

ul.radio-liste li input {
    margin-right: 6px;
}

.eingabezeile {
    display: flex;
    margin-bottom: .75rem;
}

.eingabezeile label, .eingabezeile input {
    align-items: center;
    margin: 0;
    padding: .25rem 12px;
    height: 1.5rem;
    border: 2px solid #B3BFCC;
}

.eingabezeile label {
    -webkit-border-radius: .25rem 0 0 .25rem;
    border-radius: .25rem 0 0 .25rem;
    background: #B3BFCC;
    color: #fff;
    font-size: 20px;
    line-height: 24px;
}

.eingabezeile input {
    -webkit-border-radius: 0 .25rem .25rem 0;
    border-radius: 0 .25rem .25rem 0;
    border-left: none;
    -webkit-box-shadow: inset 0 0 .25rem .125rem rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 0 .25rem .125rem rgba(0, 0, 0, 0.1);
    font-size: 1rem;
    line-height: 24px;
    flex-grow:1;
    min-width:7rem;
}

.eingabezeile1 label {
    flex: 0 0 7rem;
}
.eingabezeile2 label {
    flex: 0 0 9rem;
    font-size:1rem;
}

.eingabezeile-checkbox {
    display: flex;
    align-items: flex-start;
    width: 100%;
}
.eingabezeile-checkbox input{
    flex: 0 0 1.5rem;
    width: 1.5rem;
}

.checkbox {
    display: block;
    position: relative;
    padding: 10px 0 0 35px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkbox {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
}

.checkbox:hover input ~ .checkmark {
    background-color: #ccc;
}

.checkbox input:checked ~ .checkmark {
    background-color: #55749b;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.checkbox input:checked ~ .checkmark:after {
    display: block;
}

.checkbox .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


.messages-error {
    font-size: 20px;
    color: #900;
}

/* =Bilder */

figcaption.fotocredit {
    color: #999;
    font-size: 11px;
    line-height: 14px;
    padding: .25rem 1rem 0 0;
    text-align: right;
}

/* =buttons */

.button-bar {
    overflow: hidden;
}

.button-bar a, .button-bar span {
    display: inline-block;
    margin: 0 .1875rem .1875rem 0;
    padding: .25rem .625rem;
    border: 1px solid #d1dde9;
    background: #f8fafb;
    text-decoration: none;
    -webkit-border-radius: .1875rem;
    border-radius: .1875rem;
}

.button-bar a:hover {
    border: 1px solid #abc0d5;
    background: #dbe4e9;
    text-decoration: none;
}

.button-bar span b,
.button-bar span strong {
    color: #000;
}

.button {
    -webkit-border-radius: .25rem;
    border-radius: .25rem;
}

.button:hover {
    border: 1px solid #abc0d5;
    background: #dbe4e9;
    text-decoration: none;
}

.button1 {
    padding: 2px 8px;
    font-size: 16px;
}

.button2 {
    padding: 4px 12px;
    font-size: 18px;
}

.button3,
.button-bar .button3{
    padding: 4px 12px;
    font-size: 1.25rem;
    color: #fff;
    background-color: #7094b7;
    border: 1px solid #7094b7;
}

.button3:hover,
.button-bar .button3:hover{
    color: #fff;
    background-color: #369;
    border: 1px solid #369;
}

.button3a {
    padding: 4px 12px;
    font-size: 18px;
    color: #7094b7;
    background-color: #dbe4e9;
    border: 1px solid #7094b7;
}

.button3a:hover {
    color: #369;
    background-color: #dbe4e9;
    border: 1px solid #369;
}


.button-big {
    background: #f8fafb;
    background: linear-gradient(to bottom, #f8fafb 0%, #e3eaf1 100%);
    border: 1px solid #d1dde9;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 10px;
    font-size: 1.25em;
    text-align: center;
}

.button-big a {
    text-decoration: none;
}


/* =Lightbox */

/*noinspection CssNoGenericFontName*/
.zoom-in {
    text-decoration: none;
    font-family: "uncut";
    font-size: 18px;
    line-height: 1.8;
    width: 20px;
    float: right;
    text-align: right;
    position: relative;
    right: 5px;
    top: -10px;
}

.zoom-in a {
    text-decoration: none;
    color: #757575;
}

.zoom-in a:hover {
    color: #C00;
}

/* =Kritikenliste */

ul.kritiken {
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.kritiken li {
    flex: 0 0 48%;
    padding-bottom: 3%;
    position: relative;
}

@media only screen and (min-width: 40rem) {

    .kritiken li {
        flex: 0 0 32%;
    }
}

.kritiken li a {
    text-decoration: none;
}

.kritiken-bild {
    width: 100%;
}

.kritiken-von {
    font-size: 0.75em;
    line-height: 1.1;
    color: #999;
}

.kritiken-bild figure {
    padding-top: 45%;
    background-size: cover;
}

.kritiken h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0.25em 0 0 0;
    color: #000;
    line-height: 1.2;
}

.kritiken a:hover h4 {
    color: #c00;
}

.kritiken li:first-child {
    flex: 0 0 100%;
    margin: 0 0 1.75em 0;
    padding-bottom: 0;
}

.kritiken li:first-child .kritiken-bild figure {
    padding-top: 35.4%;
}

.kritiken li:first-child h4 {
    position: absolute;
    bottom: 0.65em;
    left: 1em;
    font-size: 1.25em;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
}

.kritiken li:first-child .kritiken-von {
    position: absolute;
    bottom: 1.25em;
    right: 1em;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
}


ul.kritiken4 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.kritiken4 li {
    width: 48%;
    margin: 0 0 1.25em 0;
    position: relative;
}

.kritiken4 li a {
    text-decoration: none;
}

.kritiken4 h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0.25em 0 0 0;
    color: #000;
    line-height: 1.2;
}

.kritiken4 a:hover h4 {
    color: #c00;
}

@media only screen and (min-width: 40rem) {

    .kritiken4 li {
        width: 24%;
    }
}

/* =Specialfelder */

.coffee {
    background: #ecf1f5;
    padding:.75rem 1.25rem;
    margin:.75rem 0;
    font-size:1rem;
    line-height: 1.3;
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
}
.coffee img{
    margin-top:.75rem;
}



/* =Content
-------------------------------------------------------------- */

#content {

}

#content p {
    margin-top: 2px;
   margin-bottom: 10px;
    line-height: 27px;
}

#content td p {
    padding-bottom: 0;
}

.sommer87 a {
    display: inline-block;
    background: rgb(44, 83, 158);
    background: linear-gradient(to bottom, rgba(44, 83, 158, 1) 0%, rgba(35, 69, 127, 1) 100%);
    margin: 12px 0 6px 0;
    padding: 3px 8px;
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    color: #fccd4d;
    text-decoration: none;
    transition: all 0.3s ease;
    -webkit-transform: rotateZ(-5deg);
    -ms-transform: rotateZ(-5deg);
    transform: rotateZ(-5deg);
}

.sommer87 a:hover {
    box-shadow: inset 0 0 0 22px #53a7ea;
    -webkit-transform: rotateZ(-2deg);
    -ms-transform: rotateZ(-2deg);
    transform: rotateZ(-2deg);
}

.sommer87 a strong {
    color: #de4df6;
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
    font-size: 28px;
}

.sommer87 a:hover strong {
    color: #9500a8;
}

.breadcrumb {
    font-size: 0.75em;
    color: #333;
    border-bottom: 1px solid #b7d1ea;
    padding: 0.5rem;
    margin-bottom: 1.25rem;
}
.breadcrumb-margin {
    margin-bottom: 0;
}

.breadcrumb ul {
    overflow: hidden;
}

.breadcrumb ul li {
    float: left;
    position: relative;
    padding-right: 1.5em;
}

.breadcrumb ul li:after {
    display: block;
    position: absolute;
    content: '';
    height: 7px;
    width: 7px;
    top: 4px;
    right: 8px;
    border-top: 2px solid #ccc;
    border-right: 2px solid #ccc;
    transform: rotate(45deg);
}

.breadcrumb ul li:last-child:after {
    display: none;
}

.breadcrumb ul li a {
    color: #888;
    text-decoration: none;
}

.breadcrumb ul li a:hover {
    color: #000;
    text-decoration: underline;
}


/* =Homepage
-------------------------------------------------------------- */

.home-aktuelles {
    margin-bottom: 20px;
    width: 100%;
    overflow: hidden;
    height: 212px;
}

.home-headerbox {
    display: block;
    width: 212px;
    height: 212px;
    overflow: hidden;
    position: relative;
    float: left;
    margin-right: 12px;
}

.home-headerbox3 {
    margin-right: 0;
}

.home-headerbox img {
    position: absolute;
    top: 0;
    left: 0;
    width: 212px;
    height: 222px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.home-headerbox:hover img {
    top: -10px;
}

.home-headerbox .home-headerbox-bottom {
    position: absolute;
    top: 142px;
    left: 0;
    width: 212px;
    height: 80px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);

}

.home-headerbox .home-headerbox-titel {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 192px;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    font-size: 22px;
    font-weight: 700;
    padding: 10px;
}

.home-headerbox:hover .home-headerbox-titel {
    bottom: 7px;
}

.sidebar-box {
    background: #f8fafb;
    background: linear-gradient(to bottom, #f8fafb 0%, #e3eaf1 100%);
    border: 1px solid #d1dde9;
    padding: 10px;
    margin-bottom: 15px;
}

.sidebar-box h3 {
    color: #727e94;
    font-size: 24px;
    font-weight: 200;
    margin-bottom: 12px;
}

.sidebar-box h3 a {
    color: #727e94;
    text-decoration: none;
}

.sidebar-box h3 a:hover {
    color: #000;
}

.home-block {
    clear: both;
    margin-top: 27px;
}

/* =Fernsehtipps */

.fernsehtipps  {
    line-height: 1.2;
    padding:.75rem 0;
    margin-bottom:1.5rem;
}
.fernsehtipps-home  {
    background-color: rgba(51, 102, 153, .12);
}
.fernsehtipps h3{
    font-size:1.25rem;
    font-weight: bold;
    margin:0;
    padding: 0 0 .25rem 0;
}
.fernsehtipps h3 a{
    color: rgba(51, 102, 153, .7);
    text-decoration: none;
}
.fernsehtipps h3 a:hover{
    color: rgba(51, 102, 153, .9);
}
.fernsehtipps  {
    line-height: 1.2;
}
.fernsehtipps ul {
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.fernsehtipps ul li{
    flex: 0 0 31%;
}

@media screen and (min-width: 30em) {
    .fernsehtipps ul li{
        flex: 0 0 15.5%;
    }
}

.fernsehtipps .tv-poster{
    display:block;
    overflow:hidden;
    position: relative;
}
.fernsehtipps .tv-poster span{
    position: absolute;
    bottom: -100%;
    left: 0;
    width: 92%;
    padding:.25rem 4%;
    background:rgba(0,0,0,.7);
    transition: all 0.2s;
    font-size:.75rem;
    color:#fff;
}
.fernsehtipps a:hover .tv-poster span{
    bottom: 0;
}
.fernsehtipps a{
    text-decoration: none;
}
.fernsehtipps .tv-date{
    text-align: center;
    color:#000;
}
.fernsehtipps .tv-date span{
    color: #727e94;
    font-weight: bold;
}
.fernsehtipps .tv-channel{
    color: #727e94;
    font-size:.875rem;
    padding-bottom:.25rem;
    text-align: center;
}
.fernsehtipps .tv-more{
    text-align: right;
    margin-top:.25rem;
    padding:.25rem 0;
    border-top: solid 1px #d1dde9;
}
.fernsehtipps .tv-more a{
    color: rgba(51, 102, 153, .5);
}
.fernsehtipps .tv-more a:hover{
    color: rgba(51, 102, 153, .9);
}

.fernsehtipps .tv-more span {
    background: url(../pic/uncutbuttons.png) no-repeat 0 -41px;
    background-size: 32px auto;
    width: 30px;
    height: 14px;
    display: inline-block;
    transition: all 0.2s;
}
.fernsehtipps .tv-more a:hover span {
    background: url(../pic/uncutbuttons.png) no-repeat 5px -41px;
    background-size: 32px auto;
}

/* =Suchseite
-------------------------------------------------------------- */

.suchseite-header {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.suchseite-header #suchfeld {
    cursor: text;
    height: 20px;
    margin: 10px;
    padding: 10px 20px;
    position: relative;
    background: #DEE7EF;
    border: 1px solid #55749b;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    box-shadow: none;
    color: #55749b;
    font-size: 18px;
    outline: 0 none;
    width: 300px;
}

.suchseite-header #suchen-button {
    height: 20px;
    background: #fff;
    border: none;
    box-shadow: none;
    color: #55749b;
    font-size: 18px;
    outline: 0 none;
}

.suchseite-header #suchen-button:hover {
    color: #000;
}

.suchergebnis {
    overflow: hidden;
}

.suchergebnis .spalte1,
.suchergebnis .spalte2 {
    width: 100%;
}


@media screen and (min-width: 50em) {
    .suchergebnis .spalte1 {
        float: left;
        width: 48.5%;
        margin-right: 3%;
    }

    .suchergebnis .spalte2 {
        float: left;
        width: 48.5%;
    }
}


.suchergebnis h3 {
    text-align: center;
    line-height: 15px;
    margin-top: 20px;
}

.suchergebnis .seitennavigation {
    border-top: 1px dotted #55749b;
    border-bottom: 1px dotted #55749b;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-top: 3px;
}

h2.keinergebnis {
    font-size: 60px;
    color: #c00;
    padding: 30px;
    text-align: center;
}


/* =News
-------------------------------------------------------------- */
h1{text-align: center;}

.newsliste-home li, .newsliste li {
    margin-bottom: 1.5rem;
    padding: 0.7rem 0;
    border-bottom: 2px dotted #B8D1E9;
    display: flex;
}
.newsliste-home12 li:nth-child(2) {
    margin-bottom: .5rem;
    border-bottom: none;
}
.newsliste li:first-child {
    margin-top: 1.5rem;
}

.newsliste-bild {
    flex: 0 0 80px;
    width: 80px;
}
.newsliste-image {
    flex: 0 0 220px;
}
.newsliste-image a {
    width:100%;
    height: 0;
    position:relative;
    padding-bottom:56.25%;
    display:block;
    overflow:hidden;
}
.newsliste-image a span{
    display: block;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    background-repeat: no-repeat;
}
.newsliste-image a span:first-child{
    filter: blur(7px);
    width:120%;
    height:120%;
    top:-10%;
    left:-10%;
    opacity: .7;
}
.newsliste-image a span:last-child{

}

@media screen and (min-width: 40em) {

    .newsliste-bild {
        flex: 0 0 100px;
        width: 100px;
    }
}

.newsliste-rechts {
    padding-left: 30px;
}


.newsliste-kategorie{
    font-size: .875rem;
    line-height: 1.2;
}
.newsliste-kategorie span{
    color: #C00;
    display: inline-block;
    padding-right:.75rem;
}

.newsliste-keinekategorie .newsliste-kategorie{
    display: none;
}

.newsliste-datum, .newsliste-forum {
    font-size: 12px;
    line-height: 16px;
    color: #8C8C8C;
}

.newsliste-datum {
    float: left;
}

.newsliste-forum {
    float: right
}

.newsliste h2 {
    margin: 0;
    padding: 0 0 .25rem 0;
    font-size: 1.5rem;
    line-height: 1.2;
    font-weight: bold;
}

.newsliste-home h2 {
    margin: 0;
    padding: 0;
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
}

.newsliste h2 a {
    color: #269;
    text-decoration:none;
}

.newsliste h2 a:hover {
    color: #000;
    text-decoration: underline;
}


.newsliste-text {
    color: #000;
    line-height: 1.3;
}
.newsliste-meta {
    max-width:18rem;
    font-size: .75rem;
    line-height: 1;
    padding: 1rem 0;
    margin-top:0rem;
    color: #757575;
    position: relative;
}
.newsliste-meta .forum-icon{
    padding-right:.25rem;
    opacity: .5;
}
.newsliste-meta:after {
    position: absolute;
    top:0;
    left:0;
    content:'';
    display: block;
    width:100%;
    height: 1px;
    background: linear-gradient(to right, #ddd, #fff);
}

.newsliste-meta span {
    color: #aaa;
}

@media screen and (max-width: 32em) {

    .newsliste-responsive li {
        flex-direction: column;
    }
    .newsliste-image {
        flex: 0 0 100%;
    }
    .newsliste-responsive .newsliste-image a{
        padding-bottom:10rem;
    }
    .newsliste-responsive .newsliste-rechts{
        padding-left: 0;
        padding-top:.75rem;
    }
}
@media screen and (max-width: 24em) {

    .newsliste-responsive .newsliste-image a{
        padding-bottom:56.25%;
    }
}

/* =Neweintrag */

.news-header {
    font-size: 0.875em;
    color: #666666;
    overflow: hidden;
    margin-bottom: 10px;
}

.news-header a {
    color: #666666;
}

.news-header-kategorie {
    float: left;
}

.news-header-datum {
    float: right;
}

.news-bild {
    background: #dae0e5;
    background: linear-gradient(to right, #f2f4f6 0%, #f2f4f6 66%, #c2cbd4 100%);
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
}

.news-bild img,
.news-bild-unten img {
    max-width: 100%;
    height: auto;
}

.news-bild-kategorie {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 3px;
    font-size: 50px;
    font-weight: 200;
    color: #fff;
    text-align: right;
    width: 650px;
}

.news-bild-bild {
    z-index: 2;
    position: relative;
}

h1.news-titel {
    font-weight: 700;
    border-bottom: none;
    margin-bottom: 5px;
    margin-top: 10px;
    padding-bottom: 5px;
}

h1.news-titel a {
    color: #369;
    text-decoration: none;
}

h1.news-titel a:hover {
    text-decoration: underline;
}

.news-titelbereich {
    padding-bottom:1rem;
}

.news-vorspann {
    font-size: 1.625rem;
    font-weight: 300;
    line-height: 1.3;
    margin: .75rem 0 1.5rem 0;
    padding: .5rem 0;
}

.news-autor {
    display: flex;
    border-top: solid 1px #B8D1E9;
    border-bottom: solid 1px #B8D1E9;
    padding:.25rem 0;
    margin: 0 0 1.5rem;
}
.news-autor-bild {
    width:1.5rem;
    height: 1.5rem;
    border-radius: .75rem;
    overflow: hidden;
}
.news-autor-name{
    padding: 0 0 0 .5rem;
    color:#555;
}
.news-autor-name a{
    color:#555;
}

.news-text {
    line-height: 1.7;
    margin-bottom: 3rem;
}

.news-text a {
    color: #369;
}

.news-text a:hover {
    color: #C00;
}

.news-text small {
    font-size: 12px;

}

.news-text iframe {
    width: 100%;
    height: 320px;
}
.video16zu9 {
    width: 100%;
    height:0;
    padding-bottom: 56.25%;
    position: relative;
}
.video16zu9 iframe {
    width: 100%;
    height:100%;
    position:absolute;
    left:0;
    top:0;
}

.news-text .autor {
    font-size: .875rem;
    color:#7d9dbe;
    font-style: italic;
}
.news-text .autor a{
    color:#7d9dbe;
}
.news-text figure.standard,
.news-text figure.wide,
.news-text figure.wide800 {
    text-align: center;
    padding:1rem 0 0 0;
    margin-bottom:-.5rem;
}

@media screen and (min-width: 45rem) {
    .news-text figure.wide,
    .news-text figure.wide800 {
        position:relative;
        width:calc(100vw - 120px);
        top:0;
        left:calc((-100vw + 680px) / 2);
    }
}
@media screen and (min-width: 65.5rem) {
    .news-text figure.wide {
        width:960px;
        left:-200px;
    }
}
@media screen and (min-width: 920px) {
    .news-text figure.wide800 {
        width:800px;
        left:-120px;
    }
}

.news-text figure figcaption {
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
    color: #999;
    font-size: 11px;
    line-height: 14px;
    padding: .25rem 1rem 0 0;
    text-align: right;
}

.news-foto-gross-beschreibung {
    margin: 15px;
    text-align: center;
}

ul.newstext-liste {
    list-style: disc inside;
}

ul.newstext-liste li {
    padding: 5px 0 5px 24px;
}

ul.newstext-liste2 {
    list-style: disc outside;
}
ul.newstext-liste2 li {
    padding: .25rem 0 .25rem 0;
}

.news-shuffle ul {
    list-style: none;
    overflow: hidden;
}

.news-shuffle li {
    float: left;
    margin: 0 13px 13px 0;
    width: 120px;
}

.news-shuffle li .image {
    display: block;
    background: #DEE7EF;
    width: 120px;
    height: 120px;
}

.news-shuffle li a .title {
    font-size: 14px;
    line-height: 14px;
    margin-top: 12px;
    width: 120px;
}

.newsgallery {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.newsgallery li {
    flex: 0 0 5.5em;
}

.newsgallery li a {
    display: block;
    margin: 0 0.25em 1em 0.25em;
    border: 1px solid #fff;
}

.newsgallery li a:hover {
    border: 1px solid #000;
}


.kolumne-person1, .kolumne-person2, .kolumne-person3 {
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.3);
    width: 490px;
    position: relative;
    padding: 15px;
    margin: 15px 0;
}


.kolumne-person1, .kolumne-person3 {
    color: #985647;
    background: rgb(255, 255, 255);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 40%, rgba(232, 229, 223, 1) 100%);
}

.kolumne-person1:after {
    background: url(../pic/kolumnen-bilder.png) no-repeat 0 0;
    position: absolute;
    height: 100px;
    width: 150px;
    right: -140px;
    top: 0;
    content: '';
}

.kolumne-person2 {
    color: #284284;
    background: rgb(255, 255, 255);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 40%, rgba(220, 225, 235, 1) 100%);
    margin-left: 140px;
}

.kolumne-person2:after {
    background: url(../pic/kolumnen-bilder.png) no-repeat 0 -100px;
    position: absolute;
    height: 100px;
    width: 150px;
    left: -140px;
    top: 0;
    content: '';
}

h4.news-filmtitel {
    font-weight: bold;
    position: relative;
    border-bottom: 1px dotted #B8D1E9;
    margin-bottom: 10px;
    padding-bottom: 3px;
}


h4.news-filmtitel a {
    color: #369;
}

h4.news-filmtitel a:hover {
    color: #C00;
}

h4.news-filmtitel img {
    float: right;
}

h3.news-zwischentitel-linie {
    font-size: 18px;
    font-weight: bold;
    display: block;
    color: #CC0000;
    margin: 0 0 5px;
    padding: 10px 0 2px;
    border-bottom: 1px dotted #C7CFD7;
}
strong.zusatzinfo {
    color: #369;
    font-weight: normal;
    line-height: 1.2;
    display:inline-block;
    padding:.25rem 1rem .5rem;
    margin:.5rem;
    border-left: solid 3px #d1dde9;
    border-right: solid 3px #d1dde9;
}
blockquote.zitat {
    color: rgba(51, 102, 153,.7);
    font-weight: normal;
    line-height: 1.5;
    padding:.75rem 1.5rem .75rem;
    margin:.5rem 0 0 0;
    border-top: solid 2px #d1dde9;
    border-bottom: solid 2px #d1dde9;
    font-style: italic;
    font-size: 1.25rem;
}
blockquote.zitat small{
    color: #888;
    display:block;
    font-size:.875rem;
    font-style: normal;
    text-align: right;
}
blockquote.zitat small a{
    color: #888;
}

@media screen and (min-width: 60em) {
    h4.news-filmtitel {
        width: 100%;
    }

    h4.news-filmtitel img {
        float: none;
        position: absolute;
        right: -140px;
    }
}


/* =Filme
-------------------------------------------------------------- */


.filmliste-zeile {
    position: relative;
    padding: 4px 5px 3px 8px;
}

.filmliste-zeile:hover {
    background: #ecf1f5;
}

.filmliste-bewertung {
    position: absolute;
    right: 8px;
    top: 5px;
    font-size: 14px;
    z-index: 1;
}

.filmliste-flyout {
    position: absolute;
    z-index: 2;
    right: 0;
    display: none;
    top: -90px;
    background: #FFF;
    padding: 12px;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
}

.filmliste-flyout-info {
    text-align: center;
    font-size: 12px;
    padding-top: 4px;
}

.filmliste-flyout-bewertung {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
}

.filmliste-flyout:before {
    content: '';
    position: absolute;
    left: -23px;
    top: 89px;
    background: url(../pic/schatten.png) no-repeat -251px -78px;
    height: 35px;
    width: 23px;
}

.filmliste-flyout:after {
    content: '';
    position: absolute;
    left: -14px;
    top: 89px;
    height: 0;
    width: 0;
    border-top: 15px solid transparent;
    border-right: 15px solid #fff;
    border-bottom: 15px solid transparent;
}


.filmliste-zeile:hover .filmliste-flyout {
    display: block;
}

ul.trailerliste {

}

ul.trailerliste li img {
    width:100%;
    height:auto;
}

ul.trailerliste li a {
    text-decoration: none;
    display: block;
    margin-bottom: 18px;
    position: relative;
}

ul.trailerliste a h4:before {
    position: absolute;
    display: block;
    content: '';
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: url(../pic/trailerbutton.png) no-repeat center top;
    opacity: 0.7;
}

ul.trailerliste a:hover h4:before {
    opacity: 1;
}

ul.trailerliste h4 {
    font-size: 14px;
    line-height: 17px;
    padding: 0;
    margin: 3px 0 0 0;
    color: #333;
}

ul.trailerliste li a:hover h4 {
    color: #000;
}

ul.trailerliste span {
    font-size: 13px;
    color: #ce4848;
}

ul.trailerliste li a:hover span {
    color: #ce4848;
}

ul.trailerliste2 {
    overflow: hidden;
}

ul.trailerliste2 li {
    width: 85px;
    height: 120px;
    margin: 0 7px 7px 0;
    float: left;
    position: relative;
}

ul.trailerliste2 li.last {
    width: 108px;
    margin-right: 0;
}

ul.trailerliste2 li.last a {
    display: block;
    width: 108px;
    height: 84px;
    padding-top: 36px;
    color: #879ac0;
    background-color: #dee7ef;
    text-align: center;
    font-size: 20px;
    line-height: 22px;
}

ul.trailerliste2 li.last a:hover {
    color: #369;
    background-color: #cad8e4;
}


ul.trailerliste2 li a {
    text-decoration: none;
    display: block;
    position: relative;
}

ul.trailerliste2 a div {
    position: absolute;
    display: block;
    height: 120px;
    width: 85px;
    left: 0;
    top: 0;
    background: url(../pic/trailerbutton.png) no-repeat;
    background-size: 85px 120px;
    opacity: 0.7;
}

ul.trailerliste2 a:hover div {
    opacity: 1;
}

ul.trailerliste2 a h5 {
    position: absolute;
    display: none;
    font-size: 13px;
    line-height: 20px;
    font-weight: normal;
    color: #000;
    height: 30px;
    width: 220px;
    left: 0;
    bottom: -32px;
}

ul.trailerliste2 a:hover h5 {
    display: block;
}


/* =Filmliste mit Bild 16:9 */

ul.filmlistebild {
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
ul.filmlistebild li {
    flex: 0 0 100%;
}

@media only screen and (min-width: 24rem) {
    ul.filmlistebild li {
        flex: 0 0 48.5%;
    }
}
@media only screen and (min-width: 40rem) {
    ul.filmlistebild li {
        flex: 0 0 32%;
    }
}

.filmlistebild li {
    position: relative;
    padding-bottom:1.5rem;
}

.filmlistebild li a {
    text-decoration: none;
}



.filmlistebild figure {
    width: 100%;
    padding-bottom: 56.25%;
    background-size: cover;
}

.filmlistebild h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0.25em 0 .125rem 0;
    color: #000;
    line-height: 1.1;
}
.filmlistebild span {
    display: block;
    font-size: 0.75em;
    line-height: 1.1;
    color: #999;
}

.filmlistebild a:hover h4 {
    color: #c00;
}


/* =Filmseite */

.filmseite-fotoheader {
    margin-bottom: 0.5em;
}

.filmseite-fotoheader-leer {
    background: #ecf1f5;
    width: 100%;
    min-height: 1rem;
    margin-bottom: 1.5em;
}

.fotoheadersmall {
    background: #ecf1f5;
    text-align: center;
    position: relative;
}

.fotoheadersmall:after {
    background: rgba(255, 255, 255, 0.75);
    position: absolute;
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 3;
}

.fotoheadersmall a, .fotoheadersmall img {
    z-index: 4;
    position: relative;
}

.filmseite-fotoheader small {
    display: block;
    text-align: right;
    color: #aaa;
    font-size: 0.75rem;
    line-height: 1.1;
    padding: 0.125rem 0.75rem;
}

.filmtitel-bild h1.filmtitel {
    text-shadow: none;
    opacity: 0.4;
}

.filmtitel-bild img {
    position: absolute;
    top: 0;
}

.filmtitel-bild60 {
    height: 60px;
}

.filmtitel-box span {
    display: block;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    text-shadow: none;
}

.filmtitel-left60 h1.filmtitel {
    font-size: 22px;
    line-height: 24px;
}


.filmseite-infoblock1 {
    display: flex;
    margin-bottom: 1.5em;
}

.filmseite-infoblock1-links {
    flex: 0 0 6em;
}

.filmseite-infoblock1-rechts {
    margin-left: 1em;
}

.filmseite-infoblock-ot1 {
    font-size: .75em;
    color: #b1b8cd;
}

.filmseite-infoblock-ot2 {
    font-size: 1.125em;
}

.filmseite-infoblock-regie {
    margin-top: 0.5rem;
}

.filmseite-infoblock-cast {
    font-size: 1rem;
}

.filmseite-infoblock-cast a {
    text-decoration: none;
}


@media screen and (min-width: 40em) {
    .filmseite-infoblock1-links {
        flex: 0 0 7.8125em;
    }

    .filmseite-infoblock1-rechts {
        margin-left: 1.25em;
    }
}

/* =Filmseite Alternativtitel*/

.filmseite-alternativtitel input {
    display:none;
}

.filmseite-alternativtitel label {
    color:#aaa;
    font-size: 0.75em;
    line-height: 1;
}
.filmseite-alternativtitel label:hover {
    text-decoration: underline;
}
.filmseite-alternativtitel input + label span:first-child:after {
 content:' anzeigen';
}
.filmseite-alternativtitel input + label span:last-child {
    display: none;
}

.filmseite-alternativtitel input:checked + label {
    color: #b1b8cd;
}

.filmseite-alternativtitel input:checked + label span:first-child:after {
    display: none;
}
.filmseite-alternativtitel input:checked + label span:last-child {
    display: inline-block;
}

.filmseite-alternativtitel div {
    display:none;
    padding-bottom:.5rem;
}
.filmseite-alternativtitel input:checked ~ div {
    display:block;
}


/* =Filmseite Schauspielerliste */

.filmseite-infoblock-spalte1-header {
    padding-left: 3rem;
    font-size: 1.25rem;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.5);
}

.filmseite-infoblock-spalte1-footer {
    padding-left: 3em;
}

.castlist li {
    display: flex;
    width: 100%;
}

.castlist-image,
.castlist-and {
    width: 2.5em;
    height: 2.5em;
    overflow: hidden;
    border-radius: 50%;
    flex: 0 0 2.5em;
    margin: 0.125rem 0;
}

.castlist-and a {
    display: block;
    width: 2.5em;
    height: 2.5em;
    background: #a5acc5 url("../pic/and.gif") no-repeat center center;
    background-size: 100% 100%;
    text-indent: -9999px;
}

.castlist-and a:hover {
    background: #a5acc5 url("../pic/and.gif") no-repeat center center;
    background-size: 110% 110%;
}

.castlist-name {
    font-weight: 700;
    text-decoration: none;
}

.castlist-name.actors-link {
    color: rgba(0, 0, 0, 0.5);
}

.castlist-name:hover {
    text-decoration: underline;
}

.castlist-role {
    color: rgba(0, 0, 0, 0.5);
    font-size: 0.75rem;
}

.castlist-content {
    padding: 0.25em 0 0.25em 0.625em;
    border-top: 1px dotted #b7d1ea;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.castlist li:last-child .castlist-content {
    border-bottom: 1px dotted #b7d1ea;
}


.filmseite-infoblock {
    border-top: 1px solid #b7d1ea;
    border-bottom: 1px solid #b7d1ea;
    margin-bottom: 24px;
    padding: 0.75em 0;
}

.table-filminfo {
    width: 100%;
}

.table-originaltitel td {
    margin: 0;
    padding: 4px 2px 2px;
    vertical-align: top;
}

.table-filminfo td {
    border-top: 1px solid #b7d1ea;
    margin: 0;
    padding: 2px;
    line-height: 22px;
    vertical-align: top;
}

.w70 {
    width: 70px;
}

.w245 {
    width: 245px;
}

.filmseite-infoblock .noborder {
    border-top: 0 solid #b7d1ea;
}

.table-filminfo .infoblock-klein-regie {
    border-top: 0 solid #b7d1ea;
    border-bottom: 1px solid #b7d1ea;
}

.filmseite-infoblock-poster {
    float: left;
    width: 150px;
}

.filmseite-infoblock-poster img {
    margin: 8px;
}

.filmseite-infoblock-originaltitel {
    float: left;
    width: 510px;
}

.filmseite-infoblock-spalte1 {
    float: left;
    width: 100%;
    margin-bottom: 1em;
}

.filmseite-infoblock-spalte2 {
    float: right;
    width: 100%;
}

@media only screen and (min-width: 600px) {
    .filmseite-infoblock-spalte1,
    .filmseite-infoblock-spalte2 {
        margin: 0;
        width: 47%;
    }
}

.filmseite-kein-inhalt {
    clear: both;
    position: relative;
    border-top: 1px solid #b9d1d6;
    border-bottom: 1px solid #b9d1d6;
    margin: 2em 0;
    padding: 1em 0 1em 2em;
    width: 70%;
}

.filmseite-kein-inhalt:before {
    position: absolute;
    display: block;
    content: '!';
    font-size: 52px;
    font-weight: 900;
    color: #b9d1d6;
    left: 0;
    top: 0.5em;
}

.trailerlink a {
    background: #d2b9bc url(../pic/trailerlink.png) no-repeat 3px 3px;
    font-size: 17px;
    line-height: 21px;
    text-decoration: none;
    display: block;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #d2b9bc;
    width: 64px;
    padding: 1px 9px 0 36px;
    margin: 4px 0 8px 0;
}

.trailerlink a:hover {
    background: #e1d7db url(../pic/trailerlink.png) no-repeat 5px 3px;
    border: 1px solid #bf0404;
    padding: 1px 5px 0 38px;
}

.film-programmlink{
    margin-bottom: 1.25rem;
}
.film-programmlink > div{
    border-radius: .25rem;
    margin-bottom: .25rem;
    padding:.25rem .5rem .125rem;
    display: flex;
}
.film-programmlink > div > div:first-child{
    flex: 0 0 7.9rem;
    display: flex;
}
.film-programmlink > div > div:last-child{
    flex: 1;
    display: flex;
    flex-wrap: wrap;
}
.film-programmlink-soon{
    background:rgba(206, 167, 101, .7);
}
.film-programmlink-now{
    background:rgba(120, 207, 97, .6);
}
.film-programmlink em{
    display:inline-block;
    width:1.375rem;
    height:1.375rem;
    margin-right:.25rem;
}
.film-programmlink-soon em{
    background:url("/assets/pic/icon-calendar-time.svg") no-repeat center center;
    background-size:cover;
}
.film-programmlink-now em{
    background:url("/assets/pic/icon-calendar-time-green.svg") no-repeat center center;
    background-size:cover;
}
.film-programmlink span{
    display:block;
    padding-right:.5rem;
}

.film-programmlink a.button{
    padding: 0 .75rem 1px;
    margin-right:.25rem;
    margin-bottom:.125rem;
    border-radius: .75rem;
    color:#fff;
    background:rgba(0,0,0,.25);
    border:none;
    text-transform: uppercase;
    text-decoration: none;
}
.film-programmlink a.button:hover{
    background:rgba(0,0,0,.4);
    border:none;
}
.filmseite-tv {
    border-radius: .25rem;
    margin-bottom: 1.25rem;
    padding:.25rem .5rem .25rem;
    background:rgba(108, 134, 163, .4);
    display: flex;
}
.filmseite-tv .tv-bild{
    width:2rem;
    height:2rem;
    margin-right:.5rem;
    background:url("/assets/pic/icon-tv.svg") no-repeat center center;
    background-size:cover;
    flex: 0 0 2.5rem;
}
.filmseite-tv .tv-text{
   flex: 1;
}
.filmseite-tv .tv-bild img{
    display: none;
}

.filmseite-fotos {
    background: #d4dce5;
    margin-bottom: 15px;
    position: relative;
}

.filmseite-fotos-titel {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 1px;
    font-size: 44px;
    font-weight: 200;
    color: #fff;
    text-align: right;
    width: 300px;

}

.filmseite-fotos-foto {
    position: absolute;
    width: 424px;

}

.filmseite-fotos-link {
    position: absolute;
    left: 440px;
    top: 26px;
    font-weight: 400;

}

.filmseite-fotos-credits {
    position: absolute;
    width: 150px;
    left: 440px;
    bottom: 12px;
    font-size: 13px;
    line-height: 15px;
    z-index: 2;
    color: #999999;
}


.filmseite-fotoleiste {
    width: 100%;
    overflow: hidden;
}

.filmseite-fotoleiste img {
    width: 100%;
    height: auto;
}

.filmseite-fotoleiste small {
    display: block;
    text-align: right;
    color: #999;
    font-size: 13px;
    line-height: 15px;
    padding: 3px 4px 0 0;
}

.filmseite-fotoleiste-link {
    width: 100%;
    display: block;
    position: relative;
    overflow: hidden;
}

.filmseite-fotoleiste-link:before {
    position: absolute;
    right: -100px;
    bottom: -100px;
    display: block;
    content: 'weitere Bilder';
    text-align: center;
    font-size: 16px;
    padding-top: 70px;
    height: 70px;
    width: 140px;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background: rgb(142, 146, 155);
    background: -moz-linear-gradient(top, rgba(142, 146, 155, 1) 0%, rgba(213, 220, 234, 1) 20%, rgba(213, 220, 234, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(142, 146, 155, 1) 0%, rgba(213, 220, 234, 1) 20%, rgba(213, 220, 234, 1) 100%);
    background: linear-gradient(to bottom, rgba(142, 146, 155, 1) 0%, rgba(213, 220, 234, 1) 20%, rgba(213, 220, 234, 1) 100%);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.filmseite-fotoleiste-link:hover:before {
    right: -75px;
    bottom: -75px;
    padding-top: 0;
    height: 140px;
    color: rgba(0, 0, 0, 1);
}

.filmseite-fotoleiste-link:after {
    position: absolute;
    right: 0.125rem;
    bottom: -0.3125rem;
    display: block;
    content: '+';
    color: rgba(0, 0, 0, 0.4);
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    transition: all 0.4s;
}

.filmseite-fotoleiste-link:hover:after {
    color: rgba(0, 0, 0, 1);
    text-decoration: none;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.filmseite-fotoleiste ul {
    position: relative;
    top: -10px;
    list-style: none;
    overflow: hidden;
}

.filmseite-fotoleiste ul li {
    float: left;
    margin-left: 14px;
}

.filmseite-fotoleiste ul li a {
    font-weight: bold;
}


.filmseite-bilderliste {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

.filmseite-bilderliste div ul {
    display: flex;
    justify-content: space-around;
    background: #ecf1f5;
}

.filmseite-bilderliste .bilderanzahl1 ul,
.filmseite-bilderliste .bilderanzahl2 ul,
.filmseite-bilderliste .bilderanzahl3 ul,
.filmseite-bilderliste .bilderanzahl4 ul,
.filmseite-bilderliste .bilderanzahl5 ul {
    justify-content: center;
}

.filmseite-bilderliste li a {
    display: block;
    margin: 0 2px;
}

.filmseite-bilderliste > div:first-child li:first-child {
    margin-left: 2px;
}

.filmseite-bilderliste > div:last-child li:last-child {
    margin-right: 2px;
}

.filmseite-bilderliste img {
    width: 100%;
    Height: auto;
}

.bilderliste1 ul li {
    width: 16.66666%;
}

.bilderliste2 ul li {
    width: 33.333333%;
}

.bilderliste3 ul li {
    width: 50%;
}

.bilderliste1 > div {
    width: 100%;
}

.bilderliste2 > div {
    width: 50%;
}

.bilderliste3 > div {
    width: 33.33333%;
}

@media screen and (max-width: 40em) {
    .bilderliste1 div ul {
        flex-wrap: wrap;
    }

    .bilderliste1 > div:first-child li:first-child {
        margin-bottom: 4px;
    }

    .bilderliste1 > div:last-child li:last-child {
        margin-right: 0;
    }

    .bilderliste1 ul li {
        width: 33%;
    }
}

.filmseite-bilderliste div div {
    width: 100%;
    text-align: center;
    padding: 0.25em 0;
    font-size: 14px;
    text-transform: uppercase;
}

.filmseite-bilderliste a {
    font-weight: bold;
}

.infoblock-klein {
    font-size: 14px;
    line-height: 22px;
    font-weight: bold;
    color: #a8abb1;
    padding-right: 10px;
}

.movie-content {
    margin-bottom: 20px;
}

h4.movie-content-title {
    font-size: 28px;
    line-height: 30px;
    color: #445a92;
    font-weight: 200;
    margin-bottom: 10px;
}

.movie-content-text {
    line-height: 1.7;
    margin-bottom: 0.5rem;
}

.movie-content-text small {
    display: block;
    font-size: 12px;
    color: #7d9dbe;
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
    padding-top: 0.25em;
}

.movie-content-info {
    font-size: 0.9375rem;
    padding: 0.5rem 1.5rem;
    max-width: 500px;
    margin: 0.75rem 0;
    line-height: 1.3;
    border-top: 1px solid #b3bfcf;
    border-bottom: 1px solid #b3bfcf;
}

.movie-content-author {
    font-size: 12px;
    color: #7d9dbe;
}

.movie-content-author a {
    color: #7d9dbe;
    text-decoration: none;
}

.movie-content-author a:hover {
    color: #000;
    text-decoration: underline;
}

.review-category {
    font-size: 12px;
    line-height: 14px;
    font-weight: bold;
    background: #B3BFCC;
    padding: 1px 1px 1px 2px;
    margin-top: 2px;
    margin-bottom: 4px;
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
}

.filmbewertung {
    border: 1px solid #999;
    padding: 3px 10px 3px 3px;
    width: 154px;
    float: right;
}

.filmplakat-poster {
    margin-bottom: 20px;
}

@media only screen and (min-width: 660px) {
    .filmplakat-poster {
        width: 424px;
        float: left;
    }

    .filmplakat-info {
        width: 200px;
        float: left;
        margin: 14px 0 20px 20px;
    }
}

.filmseite-trailer iframe {
    width: 100%;
    height: 50vw;
    margin-bottom: 10px;
}

@media only screen and (min-width: 1048px) {
    .filmseite-trailer iframe {
        height: 524px;
    }
}

.linkbereich {
    overflow: hidden;
}

.linkbereich h2 {
    float: left;
    margin-right: 20px;
}

.linkbereich ul.links {
    float: left;
    margin-right: 20px;
}

.linkbereich ul.links li {
    margin-bottom: 3px;
}



/* Filmreihen*/

.filmreihen {
    display: flex;
    flex-wrap: wrap;
}

.filmreihen h5 {
   padding-right:.5rem;
    line-height: 1.5rem;
}

.filmreihen  input  {
    display:none;
}
.filmreihen label {
   line-height: 1.5rem;
}
.filmreihen label span{
    text-decoration: underline;
}
.filmreihen label:hover {
    color:#cc0000;
}

.filmreihen input:checked + label  {
    display:none;
}
.filmreihen .foldout {
    width: 100%;
}

.filmreihen .filmliste-kurz { display:block;}
.filmreihen .filmliste-lang {display:none;}

.filmreihen input:checked ~ .foldout .filmliste-kurz {display:none;}
.filmreihen input:checked ~ .foldout .filmliste-lang {display:block;}

.filmreihen ul {
    padding:.125rem 0;
}

.filmreihen li {
    display: flex;
}
.filmreihen li span{
    line-height: 1.375rem;
}
.filmreihen .pfeil {
    width: 1.25rem;
}
.filmreihen .pfeil1 {
    background:url("/assets/pic/pfeil1.svg") no-repeat center .40625rem;
    background-size: 80% auto;
}



/* =Szenenbilder */

.szenenbild {
    text-align: center;
    margin-top: 10px;
}

.szenenbild div {
    text-align: left;
}

.szenenbild-foto {
    display: inline-block;
    position: relative;
    max-width: 100%;
    margin-bottom: 7px;
}

.szenenbild-foto img {
    display: inline-block;
    max-width: 100%;
}

.szenenbild-foto img[src] {
    height: auto;
}

.szenenbild-marker {
    position: absolute;
    height: 1px;
    width: 1px;
}

@keyframes marker {
    from {
        height: 8px;
        width: 8px;
        left: -4px;
        top: -4px;
    }
    to {
        height: 12px;
        width: 12px;
        left: -6px;
        top: -6px;
    }
}

.szenenbild-marker:before {
    position: absolute;
    height: 2px;
    width: 2px;
    border-radius: 50%;
    box-shadow: 0 0 14px 4px #000;
    content: "";
    display: block;
    left: -1px;
    top: -1px;
}

.szenenbild-marker:after {
    position: absolute;
    height: 2px;
    width: 2px;
    background: #c00;
    border-radius: 50%;
    content: "";
    display: block;
    left: -1px;
    animation: marker 1s linear 0s infinite alternate;
}

.szenenbild-block {
    margin: 3px 0;
    padding: 5px 0;
    border-bottom: 2px dotted #B8D1E9;
}

.szenenbild ul li {
    margin: 3px 0 3px 0;
}

.szenenbild-marker--container {
    position: absolute;
}

/* marker label
 */
.szenenbild-marker--container::before {
    position: absolute;
    top: -2em;
    content: attr(data-title);
    color: white;
    background-color: rgba(0, 0, 0, .85);
    padding: .5em;
    line-height: 1em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 15em;
    cursor: default;
}

.szenenbild-marker--container.szenenbild-marker--label-align-right::before {
    right: 2rem;
}

.szenenbild-marker--container.szenenbild-marker--hidden::before,
.szenenbild-marker--container.szenenbild-marker--label-hidden::before {
    display: none;
}


/*
 * marker
 */
.szenenbild-marker {
    position: relative;
    width: 4rem;
    height: 4rem;
    margin-left: -2rem;
    margin-top: -2rem;
}

.szenenbild-marker--hidden .szenenbild-marker {
    opacity: 0;
}

.szenenbild-marker::before,
.szenenbild-marker::after {
    margin-left: 2rem;
    margin-top: 2rem;
}


/*
 * person list link
 */
.szenenbild-block .szenenbild-block-link--selected {
    color: #c00;
    text-decoration: underline;
}


/* =Filmkritiken */

.review-category {
    background: #fcf3d0;
    padding: 5px 10px 4px 5px;
    margin-top: 2px;
    margin-bottom: 4px;
    font: bold 16px/16px "Source Sans Pro", Arial, Helvetica, sans-serif;
    color: #d6a20b;
    border-top: 1px solid #d6a20b;
    border-bottom: 1px solid #d6a20b;
}

.kritikderwoche {
    background: #fcf3d0 url(../pic/kritiken.png) no-repeat 0 -3px;
    padding-left: 68px;
}

.berlinale {
    background: #fcf3d0 url(../pic/kritiken.png) no-repeat 0 -33px;
    padding-left: 26px;
}

.diagonale {
    background: #ffe6e8 url(../pic/kritiken.png) no-repeat -4px -93px;
    padding-left: 36px;
    border-top: 1px solid #fe071b;
    border-bottom: 1px solid #fe071b;
    color: #fe071b;
}

/* =Forum
-------------------------------------------------------------- */
.forum {
    margin-bottom: 20px;
    width: 100%;
    background: #FFF;
}

.forum ul li {
    overflow: hidden;
}

.forum-eintrag-sprechblase {
    float: left;
    width: 66%;
    border: 1px solid #b1c0cf;
    border-radius: 8px;
    margin-top: 20px;
    padding: 15px;
    position: relative;
    min-height: 95px;
    background-color: #fff;
}

.antworten .forum-eintrag-sprechblase {
    min-height: 62px;
}

.forum-eintrag-bewertung {
    float: right;
    width: 130px;
    margin-left: 5px;
    margin-bottom: 5px;
}

.forum-eintrag-sprechblase h3 {
    display: inline;
    color: #486077;
    font-weight: 700;
    font-size: 22px;
}

.forum-eintrag-text {
    line-height: 1.6;
    color: #222;
}
.forum-eintrag-text small {
    font-size:.875rem;
    color:#879ac0;
    display: block;
    border-top:solid 1px #b1c0cf;
    padding-top:.25rem;
    margin-top:.5rem;
}

.forum-eintrag-text img {
    max-width: 100%;
    height: auto;
}

.hauptkritik .forum-eintrag-text {
    line-height: 1.8;
    color: #333;
}


.forum-eintrag-sprechblase:before {
    content: '';
    position: absolute;
    right: -15px;
    top: 16px;
    height: 0;
    width: 0;
    border-top: 15px solid transparent;
    border-left: 15px solid #b1c0cf;
    border-bottom: 15px solid transparent;
}

.forum-eintrag-sprechblase:after {
    content: '';
    position: absolute;
    right: -13px;
    top: 16px;
    height: 0;
    width: 0;
    border-top: 15px solid transparent;
    border-left: 15px solid #fff;
    border-bottom: 15px solid transparent;
}


.forum ul li ul li .forum-eintrag-sprechblase {
    width: 390px;
    margin-left: 50px;
}

.forum-eintrag-userblock {
    float: right;
    width: 24%;
    margin-top: 1.25em;
}

.forum-eintrag-userbild a img {
    background-color: #dee7ef;
}

.forum-eintrag-username {
    font-weight: 700;
    word-break: break-all;
    hyphens: auto;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
}

.forum-eintrag-name {
    font-size: 14px;
}

.forum-eintrag-datum {
    font-size: 14px;
}

.forum-antworten {
    margin-top: 5px;
    clear: both;
    text-align: right;
    width: 424px;
}

.forum-antworten a {
    font-size: 16px;
    text-decoration: none;
}

.forum ul li ul {
    clear: both;
}

.forum .antworten li {
    background: url(../pic/forum-baum.gif) no-repeat 0 0;
}

.forum .antworten .last {
    background: url(../pic/forum-baum.gif) no-repeat -700px 0;
}

@media only screen and (max-width: 640px) {
    .forum ul li ul li .forum-eintrag-sprechblase {
        width: 60%;
        margin-left: 20px;
    }
}

.hauptkritik .forum-eintrag-sprechblase {
    width: 100%;
    border: none;
    padding: 0;
    position: relative;
    min-height: 62px;
    margin: 20px 0 15px;
}

.hauptkritik .forum-eintrag-sprechblase:before, .hauptkritik .forum-eintrag-sprechblase:after {
    display: none;
    background: none;
}

.hauptkritik .forum-eintrag-sprechblase h3 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2em;

}

.hauptkritik .forum-eintrag-userblock {
    width: 100%;
    margin-top: 20px;
}

.hauptkritik .review-category {
    background: none;
    border-bottom: 1px solid #B8D1E9;
    border-top: 1px solid #B8D1E9;
    margin: 8px 0 15px;
    padding: 6px 0 6px 20px;
    text-transform: uppercase;
    color: #9aa6bb;
}

.hauptkritik .forum-antworten {
    display: none;
}

.forum-eintrag-userbeschreibung {
    font-size: 14px;
    border-top: 1px solid #B8D1E9;
}

.forum-eintrag-top-filme {
    font-size: 14px;
    border-bottom: 1px solid #B8D1E9;
    border-top: 1px solid #B8D1E9;
}


.hauptkritik-bild small {
    color: #999;
    display: block;
    font-size: 13px;
    line-height: 15px;
    padding: 3px 4px 0 0;
    text-align: right;
}

.hauptkritik-bild small a {
    color: #999;
}

.hauptkritik-film {
    border-bottom: 1px solid #B8D1E9;
    border-top: 1px solid #B8D1E9;
    margin: 10px 0;
    padding: 10px 0;
    display: flex;
}

.hauptkritik-film-1 {
    width: 110px;
    flex: 0 0 110px;
}

.hauptkritik-film-2 {
    font-size: 14px;
    line-height: 1.4;
}

.hauptkritik-film h4 {
    color: #879ac0;
    margin: 0;
    padding: 0 0 5px 0;
}

.hauptkritik-film h4 a {
    color: #879ac0;
}

.hauptkritik-film a {
    color: #666;
}

.hauptkritik-film .trailerlink a {
    margin: 4px 0 8px 0;
}


@media only screen and (min-width: 480px) {

    .hauptkritik .forum-eintrag-sprechblase {
        float: left;
        width: 66%;
    }

    .hauptkritik .forum-eintrag-userblock {
        width: 140px;
    }
}



/* =Kritikenliste */

.kritiken-bild {
    width: 100%;
}

.kritiken-von {
    font-size: 0.75em;
    line-height: 1.1;
    color: #999;
}

.kritiken-bild figure {
    padding-top: 45%;
    background-size: cover;
}

.kritiken h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0.25em 0 0 0;
    color: #000;
    line-height: 1.2;
}

.kritiken a:hover h4 {
    color: #c00;
}

.kritiken li:first-child {
    width: 100%;
    margin: 0 0 1.25em 0;
}

.kritiken li:first-child .kritiken-bild figure {
    padding-top: 35.4%;
}

.kritiken li:first-child h4 {
    position: absolute;
    bottom: 0.65em;
    left: 1em;
    font-size: 1.25em;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
}

.kritiken li:first-child .kritiken-von {
    position: absolute;
    bottom: 1.25em;
    right: 1em;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
}


ul.kritiken4 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.kritiken4 li {
    width: 48%;
    margin: 0 0 1.25em 0;
    position: relative;
}

.kritiken4 li a {
    text-decoration: none;
}

.kritiken4 h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0.25em 0 0 0;
    color: #000;
    line-height: 1.2;
}

.kritiken4 a:hover h4 {
    color: #c00;
}

@media only screen and (min-width: 40rem) {

    .kritiken4 li {
        width: 24%;
    }
}


/* =Stars
-------------------------------------------------------------- */


.starseite-headerleiste {
    background: #ecf1f5;
    width: 100%;
    min-height: 0.5rem;
    margin-bottom: 1.5em;
}

.starseite-bild {
    margin-bottom: 15px;
    text-align: center;
}

.table-starinfo {
    margin-bottom: 15px;
    width: 100%;
    border-collapse: collapse;
}

.table-starinfo tr:first-child td {
    border-top: 1px solid #b7d1ea;
}

.table-starinfo td {
    border-top: 0 solid #b7d1ea;
    border-bottom: 1px solid #b7d1ea;
    margin: 0;
    padding: 2px;
    line-height: 22px;
    vertical-align: top;
}

.starseite-bilderstapel-bilder {
    background: url(../pic/stargalerie_bg.jpg);
    height: 100px;
    width: 200px;
    margin: 0 auto;
}

.starseite-bilderstapel-bilder img {
    margin: 10px 30px;
}

.alter-text {
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 16px;
}

.alter-text b {
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
    padding-right: 60px;
    color: rgba(114, 126, 148, 0.8);
    background: url(../pic/uncutbuttons.png) no-repeat right -110px;
    display: block;
    height: 30px;
    text-align: right;
}

.alter-top {
    font-size: 13px;
    float: right;
    width: 40px;
    text-align: center;
    text-transform: uppercase;
    color: rgba(114, 126, 148, 0.7);
    margin-top: 28px;
}

.iconliste-award {
    display: table-cell;
    width: 20px;
    vertical-align: middle;
    text-align: center;
}

/*noinspection CssNoGenericFontName*/
.iconliste-award a {
    font-size: 34px;
    line-height: 42px;
    font-family: "uncut";
    text-decoration: none;
    color: #babdc3;
}

.iconliste-award a.gewonnen {
    color: #d5b71d;
}

.iconliste-award a:hover {
    color: #8e959c;
}

.iconliste-award a.gewonnen:hover {
    color: #c39d10;
}

.awardlist {
    display: table;
}

.awardlist li {
    display: table-row;
}

.awardlist div {
    display: table-cell;
    padding-top: 3px;
    vertical-align: top;
    border-top: solid 1px #dfe6f4;
}

.awardlist li:first-child div {
    border-top: none;
}

.awardlist .awardlist1 {
    width: 40px;
    font-weight: bold;
}

.awardlist .awardlist2 {
    width: 10px;
}

/*noinspection CssNoGenericFontName*/
.awardlist .awardlist2 span:before {
    content: 'o';
    font-family: "uncut";
    font-size: 20px;
    color: #babdc3;
}

.awardlist .awardlist2 .gewonnen:before {
    color: #d5b71d;
}

.awardlist .awardlist3 {
    width: auto;
}

.kalenderliste {
    overflow: hidden;
}

.kalenderliste li {
    width: 32%;
    float: left;
    margin: 0 2% 1em 0;
    background: #f8fafb;
    background: linear-gradient(to bottom, #f8fafb 0%, #e3eaf1 100%);
}

.kalenderliste li:nth-child(3n+3) {
    margin-right: 0;
}

.kalenderliste h3 {
    text-align: center;
    font-size: 2em;
    margin: 0.25em 0;
}

.kalenderliste ul {
    overflow: hidden;
    padding: 0.25em;
}

.kalenderliste li li:nth-child(1n) {
    width: 13%;
    float: left;
    margin: 0 1.5% 0.25em 0;
    background: #f8fafb;
    border: none;
}

.kalenderliste li li:nth-child(7n+7) {
    margin-right: 0;
}

.kalenderliste li li a {
    display: block;
    background: #f8fafb;
    border: 1px solid #d1dde9;
    text-align: center;
    text-decoration: none;
    font-size: 1.125em;
    padding: 0.125em 0;
}

.kalenderliste li li a:hover {
    border: 1px solid #000;
}

.kalendernav {
    clear: both;
    float: left;
    height: 6em;
    overflow: hidden;
    width: 100%;
}

.kalendernav nav {
    float: left;
    left: 50%;
    position: relative;
}

.kalendernav .tag-vorher,
.kalendernav .tag-aktuell,
.kalendernav .tag-nachher {
    height: 3.5em;
    padding: 0.5em;
    text-align: center;
    display: block;
    background: #fff;
    text-decoration: none;
    font-size: 0.875em;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    float: left;
    border: 1px solid #d1dde9;
    position: relative;
    right: 50%;
    top: 10px;
}

.kalendernav .tag-aktuell {
    width: 5em;
    height: 5em;
    top: 0;
    border: 1px solid #879ac0;
}

.kalendernav span {
    display: block;
}

.kalendernav .tag {
    font-size: 2.25em;
    line-height: 1;
    font-weight: bold;
    margin-top: 0.125rem;
}

.kalendernav .tag-aktuell .tag {
    font-size: 2.75em;
    color: #000;
    margin-top: 0.5rem;
}

.kalendernav a:hover {

}

.bilderstreifen {
    margin: 1em 0;
}

.bilderstreifen li {
    margin-bottom: 1em;
    overflow: hidden;
}

.bilderstreifen-bild {
    max-width: 424px;
    margin-right: 16px;
    float: left;
    background-color: #ecf1f5;
}

.bilderstreifen-bildlink {
    position: relative;
    display: block;
}

/*noinspection CssNoGenericFontName*/
.bilderstreifen-bildlink:hover:after {
    position: absolute;
    display: block;
    font-family: "uncut" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\2b";
    color: #fff;
    text-shadow: 0 0 3px #000000;
    height: 20px;
    width: 20px;
    bottom: 0;
    right: 0;
}


.bilderstreifen-text {
    width: 220px;
    float: left;
    border-top: 1px solid #b8d1e9;
}

.bilderstreifen-text-beschreibung {
    font-size: 16px;
    line-height: 1.2;
    padding: 0 0 0.5em 0;
}

.bilderstreifen-personen {
    font-size: 14px;
    padding-bottom: 0.5em;
    border-bottom: none;
}

.bilderstreifen-zusatztext {
    line-height: 1.2;
    font-size: 16px;
    padding-bottom: 0.5em;
}

.bilderstreifen-credit {
    margin: 12px 0 3px 0;
    padding: 5px 0;
    font-size: 12px;
    line-height: 1.2;
    border-top: 1px dotted #B8D1E9;
    border-bottom: 1px dotted #B8D1E9;
}


/* =Quiz
-------------------------------------------------------------- */

.quiz-archiv {
    position: relative;
}

.quiz-archiv-bild {
    position: absolute;
    border: 4px solid #FFF;
    right: 20px;
    top: 50px;
    width: 80px;
    -webkit-box-shadow: 0 0 7px 0 #5E5E5E;
    box-shadow: 0 0 7px 0 #5E5E5E;
    -moz-transform: rotate(-4deg);
    -webkit-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    transform: rotate(-4deg);
}

/* (640px) */
@media screen and (min-width: 40em) {
    .quiz-archiv-bild {
        width: auto;
    }

}

.quiz-gewinner {
    margin-top: 20px;
}

.quiz-gewinner h4 {
    font-size: 20px;
}

.quiz-gewinner ul {
    overflow: hidden;
}

.quiz-gewinner ul li {
    float: left;
    margin: 0 10px 10px 0;
    position: relative;
}

.quiz-gewinner a .quiz-gewinner-eintrag-name {
    display: none;
    position: absolute;
    width: 200px;
}

.quiz-gewinner a:hover .quiz-gewinner-eintrag-name {
    display: block;
    color: #666;
}

.quiz-frage {
    border-top: 2px dotted #b8d1e9;
    margin-top: 1rem;
    padding-top: 1rem;
}

.quiz-frage h3 {
}

.quiz-frage .antwortlink {
    display: block;
    width: 150px;
    height: 50px;
    margin-left: 370px;
    padding-left: 30px;
    background: rgba(0, 0, 0, 0) url(../pic/uncutbuttons.png) no-repeat scroll 0 -50px;
    color: #879ac0;
    font-size: 22px;
    line-height: 50px;
    text-decoration: none;
}


/* =Community
-------------------------------------------------------------- */


.login {
    margin: 1.25em auto;
    background-color: #DEE7EF;
    border: 1px solid #B3BFCC;
    border-radius: 5px;
    padding: 1.25em;
}

.login h3 {
    font-size: 30px;
    font-weight: 200;
    color: #2a4d7d;
}


/* =Community User
-------------------------------------------------------------- */


.user-top {
    height: 230px;
    width: 100%;
    position: relative;
}

.user-top-header {
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.user-top-ueberlagerung {
    width: 100%;
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    background: url(../pic/userseite-ueberlagerung.png) repeat-x;
    background-size: auto 270px;

}

.user-top-name {
    width: 95%;
    position: absolute;
    left: 2.5%;
    bottom: 5%;
    font-size: 3rem;
    color: #2a4d7d;
}

.user-top-name h1 {
    text-shadow: 1px 1px 2px rgba(255, 255, 255, 1);
}

.user-top-bild {
    height: 100px;
    width: 100px;
    position: absolute;
    right: 2.5%;
    top: 1rem;
    background-color: #dee7ef;
    box-shadow: 1px 1px 8px 0 rgba(50, 50, 50, 0.75);
}

@media screen and (min-width: 47em) {

    .user-top-bild {
        height: 200px;
        width: 200px;
    }

}

.user-header2 {
    width: 100%;
    position: relative;
}

.user-header2-titelbild {
    width: 100%;
}

.user-header2-titelbild img {
    width: 100%;
    height: 9rem;
}

.user-header2-name {
    height: 60px;
    width: 95%;
    position: absolute;
    left: 2.5%;
    bottom: 10%;
    font-size: 3rem;
    color: #2a4d7d;
    border-bottom: 1px solid #B8D1E9;
}

.user-header2-name a {
    text-decoration: none;
}

.user-header2-bild {
    height: 80px;
    width: 80px;
    position: absolute;
    right: 2.5%;
    top: 1rem;
    box-shadow: 1px 1px 8px 0 rgba(50, 50, 50, 0.75);
}

.user-special-badge {
    display:inline-block;
    margin: 0 0 0 .25rem;
    padding:.125rem .5rem;
    position: relative;
    bottom:.25rem;
    border: 1px solid #d1dde9;
    border-radius:4px;
    font-size:.75rem;
    color:#269;
    background:#fff;
    font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
    text-transform: uppercase;
}


.filmbewertungen {
    overflow: hidden;
}

.filmbewertungen li {
    float: left;
    width: 90px;
    margin-left: 5px;
}

.filmbewertungen li:first-child {
    margin-left: 0;
}

.filmbewertungen-titel {
    font-size: 0.75rem;
    line-height: 1.8;
    width: 90px;
    height: 22px;
    overflow: hidden;
}

.filmbewertungen-titel a {
    text-decoration: none;
    display: block;
    width: 150px;
}

.filmbewertungen-bewertung {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    border-top: 1px solid #B7D1EA;
    border-bottom: 1px solid #B7D1EA;
    padding-top: 2px;
    padding-bottom: 6px;
}

.user-forumseintrag-film {
    display: flex;
}

.user-forumseintrag-film-1 {
    flex: 0 0 9.5em;
}

/* =Kinos
-------------------------------------------------------------- */

.kinoliste {
    padding: .75rem 0;
}
.kinoliste li {
    padding: .75rem 0 1rem;
    border-bottom: 2px dotted #B8D1E9;
}
.kinoliste li:last-child {
    border-bottom: none;
}
.kinoliste li a{
    display: flex;
}
.kinoliste .bild {
    flex: 0 0 100px;
    transition: all 0.4s;
}
@media screen and (min-width: 30em) {
    .kinoliste .bild {flex: 0 0 120px;}
}
@media screen and (min-width: 40em) {
    .kinoliste .bild {flex: 0 0 140px;}
}
@media screen and (min-width: 60em) {
    .kinoliste .bild {flex: 0 0 160px;}
}
.kinoliste .bild img {
    margin-top:.25rem;
    transition: all 0.3s;
}
.kinoliste .text {
    flex: 1;
    padding-left:1.25rem;
}
.kinoliste a,
.kinoliste a .text,
.kinoliste a h3 {
    text-decoration: none;
    color:#000;
}
.kinoliste a .text h3{
    color:#C00;
    font-size:1.5rem;
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    padding:0;
    margin: 0;
    text-decoration: underline;
}
.kinoliste .text div h3{
    display:inline-block;
    margin-right:.5rem;
}
.kinoliste a:hover .text h3{
    color:#f00;
}
.kinoliste a:hover .bild img{
    -webkit-box-shadow: 0 5px 150px 0 rgba(0,0,0,0.3);
    box-shadow: 0 5px 10px 0 rgba(0,0,0,0.3);
}

.kinoliste-small li {
    padding: .25rem 0 .5rem;
}
.kinoliste-small .bild {
    flex: 0 0 80px;
    transition: all 0.4s;
}
@media screen and (min-width: 30em) {
    .kinoliste-small .bild {flex: 0 0 100px;}
}
@media screen and (min-width: 40em) {
    .kinoliste-small .bild {flex: 0 0 120px;}
}
@media screen and (min-width: 60em) {
    .kinoliste-small .bild {flex: 0 0 140px;}
}





.kino-headerbild {
    background-color: #DEE7EF;
}
.kino-infobox {
    background-color: #DEE7EF;
    margin: 1rem 0;
    display: flex;
    border-radius: .125rem;
    flex-direction: column-reverse;
}
.kino-logo {
    text-align: center;
    padding:1rem;
    margin-bottom: .75rem;
    border-style: dotted;
    border-color: #fff;
    border-image-slice: 30% 30%;
    border-image-repeat: round;
    border-width: 0 0 .75rem 0;
}
.kino-logo img{
    max-width: 8rem;
}
.kino-adresse {
    padding:1rem;
}
.kino-fotos {
    width: 100%;
    margin: 1rem 0;
}
.kino-fotos ul {
    display:flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.kino-fotos ul li{
    flex:0 0 100%;
}
.kino-weitere {
    padding: 1rem 0;
}

@media screen and (min-width: 30em) {
    .kino-infobox {
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
    }
    .kino-logo{
        border-width: 0 0 0 .75rem;
        margin:0;
    }
    .kino-logo div{
        display:flex;
        width:100%;
        height: 100%;
        align-items: center;
        justify-content: center;
    }
    .kino-logo img{
        width: 100%;
    }
    .kino-infobox > div:first-child {

    }
    .kino-infobox > div:last-child {
        flex: 0 0 25%;
    }
    .kino-fotos ul li{
        flex:0 0 33.33333%;
    }
}


/* =Kinoprogramm Region
-------------------------------------------------------------- */

.region-header {
    width: 100%;
    position: relative;
    top:-1.25rem;
    height: 11rem;
    margin-bottom:1rem;
    background-color: #101721;
    background-repeat: repeat-x;
    background-position: center;
    background-size:auto 100%;
}
.region-header-small {
     height: 6.25rem;
}
.region-header h1{
    border:none;
    overflow: hidden;
    text-indent: -9999px;
}
.region-header-homelink{
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    width: 100%;
    height: 6.25rem;
}
.region-header-small-wien .region-header-homelink:hover{
    background: url("/assets/pic/region/header-wien-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-graz .region-header-homelink:hover{
    background: url("/assets/pic/region/header-graz-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-linz .region-header-homelink:hover{
    background: url("/assets/pic/region/header-linz-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-klagenfurt .region-header-homelink:hover{
    background: url("/assets/pic/region/header-klagenfurt-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-villach .region-header-homelink:hover{
    background: url("/assets/pic/region/header-villach-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-innsbruck .region-header-homelink:hover{
    background: url("/assets/pic/region/header-innsbruck-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-salzburg .region-header-homelink:hover{
    background: url("/assets/pic/region/header-salzburg-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-st-poelten .region-header-homelink:hover{
    background: url("/assets/pic/region/header-stpoelten-small-glow.png") no-repeat center center; background-size: auto 100%;
}
.region-header-small-lieboch .region-header-homelink:hover{
    background: url("/assets/pic/region/header-lieboch-small-glow.png") no-repeat center center; background-size: auto 100%;
}

.region-header-wien {
    background-image: url("/assets/pic/region/header-wien-large-2x.jpg");
}
.region-header-graz {
    background-image: url("/assets/pic/region/header-graz-large-2x.jpg");
}
.region-header-linz {
    background-image: url("/assets/pic/region/header-linz-large-2x.jpg");
}
.region-header-klagenfurt {
    background-image: url("/assets/pic/region/header-klagenfurt-large-2x.jpg");
}
.region-header-villach {
    background-image: url("/assets/pic/region/header-villach-large-2x.jpg");
}
.region-header-innsbruck {
    background-image: url("/assets/pic/region/header-innsbruck-large-2x.jpg");
}
.region-header-salzburg {
    background-image: url("/assets/pic/region/header-salzburg-large-2x.jpg");
}
.region-header-st-poelten {
    background-image: url("/assets/pic/region/header-stpoelten-large-2x.jpg");
}
.region-header-lieboch {
    background-image: url("/assets/pic/region/header-lieboch-large-2x.jpg");
}




.region-header-small-wien {
    background-image: url("/assets/pic/region/header-wien-small.jpg");
}
.region-header-small-graz {
    background-image: url("/assets/pic/region/header-graz-small.jpg");
}
.region-header-small-linz {
    background-image: url("/assets/pic/region/header-linz-small.jpg");
}
.region-header-small-klagenfurt {
    background-image: url("/assets/pic/region/header-klagenfurt-small.jpg");
}
.region-header-small-villach {
    background-image: url("/assets/pic/region/header-villach-small.jpg");
}
.region-header-small-innsbruck {
    background-image: url("/assets/pic/region/header-innsbruck-small.jpg");
}
.region-header-small-salzburg {
    background-image: url("/assets/pic/region/header-salzburg-small.jpg");
}
.region-header-small-st-poelten {
    background-image: url("/assets/pic/region/header-stpoelten-small.jpg");
}
.region-header-small-lieboch {
    background-image: url("/assets/pic/region/header-lieboch-small.jpg");
}


@supports (background-image: url('/assets/pic/region/header-graz-small-1x.webp')) {
    .region-header-small-wien {
        background-image: image-set(
                url('/assets/pic/region/header-wien-small-1x.webp') 1x,
                url('/assets/pic/region/header-wien-small-2x.webp') 2x
        );
    }
    .region-header-small-graz {
        background-image: image-set(
                url('/assets/pic/region/header-graz-small-1x.webp') 1x,
                url('/assets/pic/region/header-graz-small-2x.webp') 2x
        );
    }
    .region-header-small-linz {
        background-image: image-set(
                url('/assets/pic/region/header-linz-small-1x.webp') 1x,
                url('/assets/pic/region/header-linz-small-2x.webp') 2x
        );
    }
    .region-header-small-klagenfurt {
        background-image: image-set(
                url('/assets/pic/region/header-klagenfurt-small-1x.webp') 1x,
                url('/assets/pic/region/header-klagenfurt-small-2x.webp') 2x
        );
    }
    .region-header-small-villach {
        background-image: image-set(
                url('/assets/pic/region/header-villach-small-1x.webp') 1x,
                url('/assets/pic/region/header-villach-small-2x.webp') 2x
        );
    }
    .region-header-small-innsbruck {
        background-image: image-set(
                url('/assets/pic/region/header-innsbruck-small-1x.webp') 1x,
                url('/assets/pic/region/header-innsbruck-small-2x.webp') 2x
        );
    }
    .region-header-small-salzburg {
        background-image: image-set(
                url('/assets/pic/region/header-salzburg-small-1x.webp') 1x,
                url('/assets/pic/region/header-salzburg-small-2x.webp') 2x
        );
    }
    .region-header-small-st-poelten {
        background-image: image-set(
                url('/assets/pic/region/header-stpoelten-small-1x.webp') 1x,
                url('/assets/pic/region/header-stpoelten-small-2x.webp') 2x
        );
    }
    .region-header-small-lieboch {
        background-image: image-set(
                url('/assets/pic/region/header-lieboch-small-1x.webp') 1x,
                url('/assets/pic/region/header-lieboch-small-2x.webp') 2x
        );
    }
}

.region-header-tabs {
    position: absolute;
    bottom:0;
    display: flex;
    width:100%;
    justify-content: center;
}

.region-header-tabs > li {
    padding: 0 .25rem;
}
.region-header-tabs span,
.region-header-tabs a {
    display:block;
    padding:.125rem .75rem;
    line-height: 1.4;
    border-radius: .375rem .375rem 0 0;
    background:rgba(255,255,255,.6);
    text-decoration: none;
}
.region-header-tabs a:hover {
    background:rgba(255,255,255,.8);
    color:#000;
}
.region-header-tabs a.active:hover {
    background:rgba(255,255,255,1);
    color:#CC0000;
}
.region-header-tabs .active,
.region-header-tabs .active a:hover {
    background:rgba(255,255,255,1);
}



/* =Kinoprogramm
-------------------------------------------------------------- */


.iconliste-zeiten .showtimes-icon {
    width: 1.75rem;
    height: 1.75rem;
    background: url("../pic/uhr.svg") no-repeat center center;
    background-size: cover;
    margin: 0.25rem auto 0 auto;
}

.iconliste-zeiten .showtimes-text {
    font-size: 0.75rem;
    font-weight: 500;
    color: #000;
}

.iconliste-zeiten a {
    opacity: 0.4;
    display: block;
    text-align: center;
    text-decoration: none;
}

.iconliste-zeiten a:hover {
    opacity: 1;
}


.kinoprogramm-vorschauliste li {
    background-color: #DDE8EF;
    margin-bottom: 5px;
    display: table;
    width: 100%;
}

.kinoprogramm-vorschauliste li .iconliste-text {
    padding: 4px 4px 4px 12px;
    font-weight: bold;
}

.kinoprogramm-vorschauliste .showtimes-icon {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0.25rem auto;
}

.kinoprogramm-vorschauliste .showtimes-text {
    display: none;
}

/* =Kinoprogramm */

:root {
    --color-week1: #689ad9;
    --color-week2: #59bf7a;
    --color-week2dark: #4fb25c;
    --color-week3: #b4525d;
}

nav.kinoprogramm-navigation {
    width:100%;
}

.kinoprogramm-navigation-tage ul a,
.kinoprogramm-navigation-tage ul em,
.kinoprogramm-navigation-tage ul strong{
    text-decoration: none;
    text-align: center;
    line-height: 1;
    color:#000;
}
.kinoprogramm-navigation-tage ul em,
.kinoprogramm-navigation-tage ul strong {
    display: block;
}
.kinoprogramm-navigation-tage ul li a{
    text-decoration: none;
}
.kinoprogramm-navigation-tage ul em{
    font-size:.875rem;
    font-style: normal;
    text-decoration: none;
    color:var(--color-week1);
    padding-bottom:.125rem;
}
.kinoprogramm-navigation-tage ul strong{
    font-size:1.125rem;
}
.kinoprogramm-navigation-tage ul li{
    min-width: 5.25rem;
}
.kinoprogramm-navigation-tage ul span em,
.kinoprogramm-navigation-tage ul span strong {
    color:#aaa;
}

.kinoprogramm-navigation-woche {
    line-height: 1.1;
}
.kinoprogramm-navigation-woche span{
    font-size:.75rem;
}
.kinoprogramm-navigation-woche td {
    border-top: solid .25rem var(--color-week1);
    padding: .375rem;
}
.kinoprogramm-navigation-woche tr td:nth-child(2) {
    border-top: solid .25rem var(--color-week2);
    margin-left:1rem;
}

.kinoprogramm-navigation-tage.wochentag-1 ul li:nth-child(n+5) em,
.kinoprogramm-navigation-tage.wochentag-2 ul li:nth-child(n+4) em,
.kinoprogramm-navigation-tage.wochentag-3 ul li:nth-child(n+3) em,
.kinoprogramm-navigation-tage.wochentag-4 ul li:nth-child(n+2) em,
.kinoprogramm-navigation-tage.wochentag-5 ul li:nth-child(n+8) em,
.kinoprogramm-navigation-tage.wochentag-6 ul li:nth-child(n+7) em,
.kinoprogramm-navigation-tage.wochentag-7 ul li:nth-child(n+6) em
{
    color:var(--color-week2dark);
}
.kinoprogramm-navigation-tage.wochentag-1 ul li:nth-child(n+12) em,
.kinoprogramm-navigation-tage.wochentag-2 ul li:nth-child(n+11) em,
.kinoprogramm-navigation-tage.wochentag-3 ul li:nth-child(n+10) em,
.kinoprogramm-navigation-tage.wochentag-4 ul li:nth-child(n+9) em,
.kinoprogramm-navigation-tage.wochentag-5 ul li:nth-child(n+15) em,
.kinoprogramm-navigation-tage.wochentag-6 ul li:nth-child(n+14) em,
.kinoprogramm-navigation-tage.wochentag-7 ul li:nth-child(n+13) em
{
    color:var(--color-week3);
}



.kinoprogramm-seite {
    padding-top:2rem;
}

.kinoprogramm-sidebar {
    font-size: 12px;
    line-height: 17px;
    padding: 10px 0;
}

@media screen and (min-width: 42em) {

    .kinoprogramm-seite {
        display: flex;
    }

    .kinoprogramm {
        flex-grow:1;
    }

    .kinoprogramm-sidebar {
        flex: 0 0 10rem;
        padding-left:2rem;
    }

}

.programmblock-liste,
.programmblock-ohne {
    margin: .25rem 0 2rem .5rem;
    border-top: solid 1px #B8D1E9;
    border-left: solid 1px #B8D1E9;
    border-right: solid 1px #B8D1E9;
}
.programmblock-ohne {
    border-top: dotted 1px #B8D1E9;
    border-left: dotted 1px #B8D1E9;
    border-right: dotted 1px #B8D1E9;
}
@media screen and (min-width: 42em) {
    .programmblock-liste,
    .programmblock-ohne {
        margin-left: 2rem;
    }
}
@media screen and (min-width: 47em) {
    .programmblock-kino {
        width: calc(100% - 10rem);
    }
}
@media screen and (min-width: 65em) {
    .programmblock-kino {
        width: calc(100%);
    }
}
.programmblock .programmblock-liste {
    margin-left: 0;
}

.programmblock > li {
    position: relative;
    border-bottom: solid 1px #B7D1EA;
}
.programmblock-ohne > li {
    border-bottom: dotted 1px #B7D1EA;
    color:#999;
}
.programmblock-ohne > li:hover,
.programmblock > li.nolink:hover{
    background: none;
}
.programmblock a{
    padding-right: .375rem;
    text-decoration: none;
}

.programmblock em {
    font-style: normal;
}
.programmblock em span {
    color: #93a2c7;
    font-size: .875rem;
}

.programmblock span a {
    padding-right: 0;
}

.programmblock input {
    display:none;
}
.programmblock label,
.programmblock .space {
    width:100%;
    position: relative;
    display: block;
    padding: .25rem .5rem;
    box-sizing: border-box;
}
.programmblock .space-right {
    padding: 0 1rem 0 0;
    display:flex;
}

.space-right-1 {
   flex: 0 0 2.5rem;
}
.space-right-1 ~ .space-right-2 {
    padding-top: 3px;
}
.programmblock input:checked + label .space-right-1 {
    display: none;
}

.programmblock .space-nolink strong{
    color:#888;
}
.programmblock label:hover {
    background: #ecf1f5;
}
.programmblock input:checked + label,
.programmblock input:checked + label:hover,
.programmblock .programm-acordeon {
    background: #ecf1f5;
}

.programmblock label:after {
    display:block;
    width:0;
    height: 0;
    border-top:9px solid #B3BFCC;
    border-left:5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 0 solid transparent;
    top:.625rem;
    right:.375rem;
    position: absolute;
    content:'';
    transform: rotate(-90deg);
    transition: .2s;
}
.programmblock input:checked + label:after {
    transform: rotate(0);
}
.programmblock input ~ .programm-acordeon  {
    display:none;
}

.programmblock input:checked ~ .programm-acordeon {
    display:flex;
}

.programmblock input:checked ~ label .programm-zeile-box {
    display:none !important;
}

.programm-acordeon{

}
.programm-acordeon-close{
    position: absolute;
    top:0;
    right:0;
    width:1.5rem;
    height: 1.75rem;
    margin:0;
    padding:0;
}

.programmblock .programm-acordeon-close label {
    display:block;
    width:1.5rem;
    height:1.75rem;
    margin:0;
    padding:0;
}
.programmblock .programm-acordeon-close label:after {
    display:none;
}
.programmblock .programm-acordeon-close label:hover {
    background: none;
}

.programmblock .movie-icon {
    height: 2.25rem;
    width: auto;
    display: inline-block;
    margin: -.25rem .25rem -.25rem -.5rem;
}

.programm-acordeon-poster{
    padding:.25rem .5rem .5rem .5rem;
    flex: 0 0 5.5rem;
}
.programm-acordeon-text{
    padding:.25rem 1rem .5rem 0;
    margin:.25rem .5rem 0 0;
    flex-grow:1;
    border-top:dotted 1px #B7D1EA;
}
.programm-acordeon-text h4{
    margin:0;
    padding:0;
    font-size:1.375rem;
}

.programm-acordeon ul{
    padding: .5rem 0 0;
}
.programm-acordeon li a{
    display: block;
    position: relative;
    padding: 0 0 .75rem 1.75rem;
    line-height:1.1;
}
.programm-acordeon li a small{
    color:rgba(0,0,0,.375);
    line-height:1;
}
.programm-acordeon li a:hover small{
    color:rgba(0,0,0,.8);
}
.programm-acordeon li a:before{
    display: block;
    position: absolute;
    width:1.25rem;
    height:.75rem;
    content:'';
    background: url("/pic/pfeil.svg") no-repeat center center;
    background-size: 100% auto;
    top:.125rem;
    left:0;
    opacity: .5;
    transition: .1s;
}
.programm-acordeon li a:hover:before{
    left:.375rem;
    opacity: 1;
}

.kinoname h2 {
    font-size: 1.5rem;
    font-weight:bold;
    margin: 0 .25rem .25rem 0;
    padding:0;
}
.kinoname h2 a{
    text-decoration: none;
    color: #CC0000;
}
.kinoname h2 a:hover{
    text-decoration: underline;
    color: #a30000;
}
.kinoname > div{
    display:inline-block;
    padding-left:.5rem;
}
@media screen and (min-width: 30em) {
    .kinoname h2,
    .kinoname > div{
        display:inline-block;
        padding:0;
    }
}

.kinoid-11,
.kinoid-16,
.kinoid-51,
.kinoid-52,
.kinoid-53,
.kinoid-63,
.kinoid-66,
.kinoid-67,
.kinoid-68,
.kinoid-84,
.kinoid-85,
.kinoid-86,
.kinoid-87,
.kinoid-88{
    position:relative;
    margin-left:3.25rem;
}
.kinoid-11:before,
.kinoid-16:before,
.kinoid-51:before,
.kinoid-52:before,
.kinoid-53:before,
.kinoid-63:before,
.kinoid-66:before,
.kinoid-67:before,
.kinoid-68:before,
.kinoid-84:before,
.kinoid-85:before,
.kinoid-86:before,
.kinoid-87:before,
.kinoid-88:before{
    display: block;
    position: absolute;
    left:-3.25rem;
    top:.125rem;
    content:'';
    background:url("/assets/pic/open-air.svg") no-repeat center center;
    background-size:cover;
    width: 3rem;
    height:1.5rem;
}

/* =Kinoprogramm Filmliste */

.programm-filmliste {
    border-top: 1px solid #B7D1EA;
    margin-bottom:1rem;
}
.programm-filmliste ~ h2 {
    font-size:1.75rem;
    margin:3.7rem 0 .75rem;
    color:#c00;
}

.programm-filmliste li {
    border-bottom: 1px solid #B7D1EA;
    display:flex;
    width: 100%;
    align-items: center;
}
.programm-filmliste li a{
    text-decoration: none;
}
.programm-filmliste li a:hover{
    color:#000;
}
.programm-filmliste .zeiten {
    display:flex;
    align-items: center;
    flex:1;
}
.programm-filmliste .zeiten > div:nth-child(1) {
    flex: 0 0 2.5rem;
}
.programm-filmliste .zeiten > div:nth-child(1) span{
    display:block;
    width:100%;
    height: 0;
    padding-bottom:80%;
    position: relative;
}
.programm-filmliste a.zeiten > div:nth-child(1) img{
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.2s;
    transform-origin: center center;
    width: 2rem;
    height: auto;
}
@media screen and (min-width: 47em) {
    .programm-filmliste .zeiten > div:nth-child(1) {
        flex: 0 0 4rem;
    }
    .programm-filmliste .zeiten > div:nth-child(1) span{
        padding-bottom:62%;
    }
    .programm-filmliste a.zeiten > div:nth-child(1) img{
        top: .25rem;
        left: .75rem;
    }

    .programm-filmliste a.zeiten:hover > div:nth-child(1) img{
        transform: scale(1.875);
        z-index: 99;
    }

}


.programm-filmliste .zeiten > div:nth-child(2) {
    flex: 1;
    padding: .375rem 0;
    line-height: 1.2;
}
.programm-filmliste .zeiten > div:nth-child(3) {
    flex: 0 0 3.25rem;
}
.programm-filmliste .info {
    flex: 0 0 4rem;
}
.programm-filmliste .zeiten div:nth-child(3),
.programm-filmliste .info {
    margin: .25rem 0 .25rem .5rem;
    padding: .125rem .625rem;
    border: 1px solid #d1dde9;
    background: #f8fafb;
    border-radius: .1875rem;
    font-size:.875rem;
}
.programm-filmliste a.zeiten:hover div:nth-child(3),
.programm-filmliste a.info:hover {
    border: 1px solid #369;
    background:rgba(51, 102, 153, .2);
}
.programm-filmliste i {
    display: inline-block;
    width:.875rem;
    height: .875rem;
    background:url("/assets/pic/uhr.svg") no-repeat center center;
    background-size: cover;
    top:.125rem;
    left:-.3755rem;
    position: relative;
    opacity: .5;
}
.programm-filmliste .info i {
    background:url("/assets/pic/info.svg") no-repeat center center;
    background-size: cover;
}
.programm-filmliste a:hover i {
    opacity: 1;
}

/* =Kinoprogramm  zeitlich*/

table.zeitlich {
    border-bottom: 1px solid #B7D1EA;
    width: 100%;
}
table.zeitlich a{
   text-decoration: none;
}
table.zeitlich td{
    border-top: 1px solid #B7D1EA;
    vertical-align: top;
    padding:.125rem 0;
}
table.zeitlich tr td:first-child{
    width:3rem;
}
table.zeitlich .zeit-1 td{
    color:#666;
    border-top: 1px dotted #B7D1EA;
}
table.zeitlich .zeit-doppelt > td:first-child{
    border-top: none;
}
table.zeitlich .zeit-2 {
}
table.zeitlich span {
    font-size:.875rem;
}

/* =Programm für einen Film  */
.programm-film li {
    display:flex;
    border-top: 2px dotted #B8D1E9;
}
.programm-film li:last-child {
    border-bottom: 2px dotted #B8D1E9;
}

.programm-film-datum {
    flex: 0 0 100px;
    padding: 1rem 0;
}

.datumsblock-wochentag {
    font-size: 14px;
    line-height: 14px;
    text-align: center;
    font-weight: 700;
}

.datumsblock-tag {
    font-size: 60px;
    line-height: 62px;
    color: #369;
    font-weight: 700;
    text-align: center;
}

.datumsblock-monat {
    font-size: 14px;
    line-height: 10px;
    color: #666;
    text-align: center;
}

.programm-film-zeiten {
    border-left: 2px dotted #B8D1E9;
    padding: .75rem .5rem .75rem 1.5rem;
}

.programm-film-keinevortellung .programm-film-datum {
    padding: .375rem 0;
    line-height: 1;
    opacity: .6;
}
.programm-film-keinevortellung .datumsblock-tag {
    font-size:40px;
    line-height: 1;
}
.programm-film-keinevortellung .programm-film-zeiten {
    display: flex;
    align-items: center;
    padding-left:2rem;
}
.programm-film-keinevortellung .programm-film-zeiten > div{
    padding: 0;
    margin:0;
}


.programm-film-heute .programm-film-datum {
    position: relative;
    padding-top:0;
}
.programm-film-heute .programm-film-datum:after {
    position: absolute;
    display: block;
    content:'';
    top:-2px;
    left:-2px;
    width: 100%;
    height: 100%;
    border: solid 2px #C00;
}
.programm-film-heute .datumsblock-wochentag {
    text-transform: uppercase;
    color:#fff;
    background: #C00;
    padding:.25rem 0;
}

.programm-film-kino {
    font-size: 22px;
    line-height: 28px;
}

.programm-film-kino a {
    color: #d2798a;
    text-decoration: none;
}

.programm-film-kino a:hover {
    color: #c00;
    text-decoration: underline;
}

.programm-film-zeiten-eintrag {
    margin-bottom: 5px;
    padding: 0;
}

.programm-film-zeiten-eintrag span {
    font-weight: 300;
}

.programm-film-navigation li {
    border-top: 1px dotted #B7D1EA;
    padding: 3px 8px;
}


.programm-zeile-box {
    position: absolute;
    right: 0;
    top: -90px;
    background: #FFF;
    padding: 12px;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
    z-index: 99;
}

.programm-zeile-box:before {
    content: '';
    position: absolute;
    left: -23px;
    top: 89px;
    background: url(../pic/schatten.png) no-repeat -251px -78px;
    height: 35px;
    width: 23px;
}

.programm-zeile-box:after {
    content: '';
    position: absolute;
    left: -14px;
    top: 89px;
    height: 0;
    width: 0;
    border-top: 15px solid transparent;
    border-right: 15px solid #fff;
    border-bottom: 15px solid transparent;
}

@media screen and (min-width: 47em) {
    .programm-zeile-box {
        right: -162px;
    }

}

.programm-zeile-box-link a{
    display: block;
    box-sizing: border-box;
    text-align: center;
    margin: .25rem .1875rem .25rem 0;
    padding: .125rem .625rem;
    border: 1px solid #d1dde9;
    background: #f8fafb;
    text-decoration: none;
    border-radius: .1875rem;
}
.programm-zeile-box-link a.link2{
    margin-top: 0;
    margin-bottom: 0;
}
.programm-zeile-box-link a:hover{
    border: 1px solid #B7D1EA;
    background: #fff;
}

.special-box {
    padding: .25em .5rem;
    margin: .25rem 0;
    color:#333;
    background: #faeded;
}

.special-box strong,
.special-box span {
    color: #cc0000;
}

.special-box a  {
    text-decoration: underline;
}

.special-box strong a {
    font-size: 1.25rem;
    color: #cc0000;
}
@media screen and (min-width: 50em) {
    .tag-1 {width: 340px;}
    .tag-2 {width: 252px;}
    .tag-3 {width: 164px;}
    .tag-4 {width: 80px;}
    .tag-5 {width: 598px;}
    .tag-6 {width: 629px;}
    .tag-7 {width: 428px;}
}


.zeitlich tr td:first-child {
    padding: 0 .5rem .125rem 0;
}

/* =Admin
-------------------------------------------------------------- */

.admin-panel {
    position: fixed;
    top: 0;
    background: rgba(0, 0, 0, 0.6);
    -webkit-border-bottom-right-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    border-bottom-right-radius: 10px;
}

.admin-panel ul {
    overflow: hidden;
}

.admin-panel ul li {
    float: left;
}

.admin-panel a {
    display: block;
    padding: 4px 12px 4px 12px;
    font-size: 18px;
    color: #fff;
    text-decoration: none;
}

.admin-panel a:hover {
    color: red;
    text-decoration: underline;
}


/* =Graz
-------------------------------------------------------------- */


.text10 {
    font-size: 14px;
    line-height: 14px;
    color: #666666;
}

.text12 {
    color: #666666;
}

.text14 {
    font-size: 18px;
    line-height: 22px;
    color: #666666;
}

.text16 {
    font-size: 20px;
    line-height: 24px;
    color: #666666;
}

.titel16 {
    font-size: 20px;
    line-height: 24px;
    color: #CC0000;
}

.black12bold {
    font-weight: bold;
    color: #000000
}

.rot-12b {
    font-weight: bold;
    color: #CC0000
}

.rot-14b {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
    color: #CC0000
}

.rot-16b {
    font-size: 20px;
    line-height: 26px;
    font-weight: bold;
    color: #CC0000
}

.pro-film {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold
}

.info10 {
    font-size: 12px;
    color: #FFFFFF;
}


.linkweiss {
    color: #FFFFFF
}

.info-titel {
    font-size: 22px;
    line-height: 26px;
    font-weight: bold;
    color: #336699
}

.info-text {
    color: #FFFFFF;
    line-height: 13px
}

.info-link {
    color: #FFFFFF
}

.info-link:hover {
    color: #000000;
    text-decoration: none;
    background-color: #FFFFFF
}

.tab-hblau {
    background-color: #DEE7EF;
    color: #666666;
    padding: 2px;
}

.tab-blau {
    background-color: #B3BFCC;
    color: #000000;
    padding: 2px;
}


.grau14bold {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
    color: #666666
}

.film11 {
    font-size: 14px;
    line-height: 18px;
    color: #FFFFFF;
    text-decoration: none
}

.film11:hover {
    font-size: 14px;
    color: #FFFFFF;
    text-decoration: underline;
    background-color: #7497B9
}

.titel-blau {
    font-size: 18px;
    font-weight: bold;
    color: #336699
}

.linieunten-voll {
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 1px solid #2C79A3;
}
.linieoben-voll {
    border-top: 1px solid #2C79A3;
}

.linieunten-strichliert {
    padding-top: 3px;
    padding-bottom: 3px;
    border-bottom: 1px dotted #2C79A3;
}


/* =Old
-------------------------------------------------------------- */

.size-five {
    font-size: 5px;
    line-height: 10px;
}

.feldweiss {
    background-color: #FFF;
}

.feldweiss-top {
    background-color: #FFF;
    border-top-width: 5px;
    border-top-style: solid;
    border-top-color: #000;
}

.feldweiss-bottom {
    background-color: #FFF;
    border-bottom-width: 5px;
    border-bottom-style: solid;
    border-bottom-color: #000;
}


.grau12bold {
    font-weight: bold;
    color: #666666
}

.grau14bold {
    font-size: 18px;
    font-weight: bold;
    color: #666666
}

.grau12 {
    color: #666666
}

.schwarz12 {
    color: #000000
}

.schwarz12bold {
    font-weight: bold;
    color: #000000
}

.info-titel {
    font-size: 22px;
    font-weight: bold;
    color: #336699
}

.info-text {
    color: #FFFFFF;
    line-height: 13px
}

.grau10 {
    font-size: 14px;
    line-height: 14px;
    color: #666666
}

.grau10bold {
    font-size: 14px;
    font-weight: bold;
    color: #666666
}

.schwarz10 {
    font-size: 12px;
    color: #000000
}

.cred1 {
    text-align: right;
}

.cred2 {
    font-weight: bold;
    text-align: left;
}

.cred3 {
    text-align: center;
}

.bildtext {
    font-size: 12px;
    color: #CCCCCC;
    background-color: #000000;
    text-align: center
}

.zeile5 {
    font-size: 3px
}

.news-titel {
    color: #336699
}

.rot14bold {
    font-size: 18px;
    font-weight: bold;
    color: #CC0000
}

.formular200 {
    color: #000000;
    width: 200px
}

.formular150 {
    color: #000000;
    width: 150px
}

.formular40 {
    color: #000000;
    width: 40px
}

.linkweiss {
    color: #FFFFFF
}

.info-link {
    color: #FFFFFF;
    text-decoration: underline;
}

.info-link:hover {
    color: #000000;
    text-decoration: underline;
    background-color: #FFFFFF
}

.pro-film {
    font-size: 18px;
    font-weight: bold
}

.redaktion {
    font-size: 12px;
    line-height: 14px;
    color: #CC0000
}

.tab-grau {
    background-color: #E6E6E6;
    padding: 2px;
}

.titel-blau {
    font-size: 24px;
    font-weight: bold;
    color: #336699
}

.weiss10 {
    font-size: 12px;
    line-height: 14px;
    color: #FFFFFF
}

.blau14 {
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;
    color: #336699
}

.credlink {


    font-weight: bold;
    color: #FFFFFF;
}

.cred1un {
    text-align: right;
    color: #999
}

.cred2un {
    font-weight: bold;
    text-align: left;
    color: #999
}

.posterlink {
    color: #FFFFFF;
}

.posterlink:hover {
    color: #000000;
}

.text10gruen {
    font-size: 12px;
    line-height: 14px;
    color: #006633;
}

.text10rot {
    font-size: 12px;
    line-height: 14px;
    color: #990000;
}

.hell16 {
    font-size: 20px;
    font-weight: bold;
    color: #A4ACBD;
}

.cred2link {
    font-weight: bold;
    text-align: left;
    color: #333;
    text-decoration: none;
}

.cred2link:hover {
    font-weight: bold;
    text-align: left;
    color: #000;
    text-decoration: underline;
}

.cred2unlink {
    font-weight: bold;
    text-align: left;
    color: #333;
    text-decoration: none;
}

.cred2unlink:hover {
    font-weight: bold;
    text-align: left;
    color: #000;
    text-decoration: underline;
}

.actors-link {
    color: #000000;
    text-decoration: none;
}

.actors-link:hover {
    color: #000000;
    text-decoration: underline;
}

.tr-hover-0 {
    background-color: #E6E6E6;
}

.tr2-hover-0 {
    background-color: #B3BFCC;
}

.kasterl-off {
    background-color: #B3C0CC;
    background-image: url(../pic/tabfeld-hgverlauf.gif);
    border-top: 1px solid #939FA9;
    border-right: 1px solid #939FA9;
    border-bottom: 0 solid #939FA9;
    border-left: 1px solid #939FA9;
}

.kasterl-on {
    background-color: #939FA9;
    border: 1px solid #939FA9;
    font-weight: bold;
    color: #FFFFFF;
}

.news-idatum {
    font-size: 12px;
    color: #8C8C8C;
}

.news-ititel {
    font-size: 18px;
    font-weight: bold;
    color: #336699;
}

.rot12 {
    color: #CC0000
}

.rot12bold {
    font-weight: bold;
    color: #CC0000
}

.userinfo-linie {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #C1CCD4;
}

.zwischentitel-linie {
    font-size: 14px;
    color: #336699;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #336699;
    display: block;
    width: 100%;
    margin-bottom: 5px;
    margin-top: 3px;
}

/* DVD im Forum */

.dvd-kritik {
    display: block;
    width: 100%;
    font-size: 0.875em;
    line-height: 0.875em;
    padding-top: 0.5em;
    border-top: 1px dashed #919EA8;
    margin-top: 0.5em;
}

.dvd-kritik a {
    display: inline;
    color: #000000;
    background: url(../pic/pfeil1.gif) no-repeat;
    padding-left: 17px;
    float: right;
    padding-top: 0;
    padding-bottom: 3px;
}

.dvd-kritik a:hover {
    color: #990000;
    background: url(../pic/pfeil2.gif) no-repeat;
}


/* Filmblock fuer Listendarstellung */

.filmblock {
    background-color: #DBE8EF;
    display: block;
    background-repeat: no-repeat;
    text-decoration: none;
    min-height: 44px;
    line-height: 18px;
    margin: 0 0 5px;
    padding: 6px 4px 0 60px;
    background-size: 50px 50px;
}

.filmblock b,
.filmblock strong {
    font-size: 18px;
    font-weight: bold;
    color: #000000;
    text-decoration: underline;
}

.filmblock i {
    color: #666666;
    text-decoration: none;
    font-style: normal;
    font-size: 14px;
}

a.filmblock:hover i {
    text-decoration: none;
}

.filmblock:hover {
    background-color: #AEC0CC;
}

.filmblock:hover b,
.filmblock:hover strong {
    color: #990000;
}

.filmblock:hover i {
    color: #333333;
}

.movieline {
    font-size: 14px;
}

.moviephotoblock {
    margin: 0.75em 0;
}

.moviephotoblock small {
    color: #999;
    display: block;
    font-size: 11px;
    line-height: 14px;
    padding: 2px 4px 0 0;
    text-align: right;
}

.moviephotoblock small a {
    color: #999;
}

.moviephotoblock h4 {
    font-weight: bold;
    border-bottom: 1px dotted #B8D1E9;
    margin: 0;
    padding: 0.25rem 0;
}

.news-trenntitel {
    font-size: 18px;
    font-weight: bold;
    color: #CC0000;
    display: block;
    padding: 10px 0 0;
    border-top-width: 4px;
    border-top-style: dashed;
    border-top-color: #C7CFD7;
}

@media print {
    .header,
    .page-footer {
        display: none;
    }

}

/* >>>>> >>>>> >>>>>    emoji picker styles  >>>>> >>>>> >>>>> */
.emoji-btn {
    cursor: pointer;
}
.emoji-btn:hover {
    text-decoration: none;
}

.emoji-con {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.emoji-con .emoji-btn {
    position: absolute;
    right: .35em;
}

.emoji-con--comment .emoji-btn {
    top: .5em;
}
/* <<<<< <<<<< <<<<<    emoji picker styles   <<<<< <<<<< <<<<< */


/* >>>>> >>>>> >>>>>    old system styles   >>>>> >>>>> >>>>> */
/*body.news .navigation nav > ul > li:nth-child(1) ul{ display:block; }*/
/*body.filme .navigation nav > ul > li:nth-child(2) ul{ display:block; }*/
/*body.stars .navigation nav > ul > li:nth-child(3) ul{ display:block; }*/
/*body.quiz .navigation nav > ul > li:nth-child(4) ul{ display:block; }*/
/*body.community .navigation nav > ul > li:nth-child(5) ul{ display:block; }*/
/*body.specials .navigation nav > ul > li:nth-child(6) ul{ display:block; }*/
/*body.graz .navigation nav > ul > li:nth-child(7) ul{ display:block; }*/

/*body.news .navigation nav > ul > li:nth-child(1) ul{ display:flex; }*/
/*body.filme .navigation nav > ul > li:nth-child(2) ul{ display:flex; }*/
/*body.stars .navigation nav > ul > li:nth-child(3) ul{ display:flex; }*/
/*body.quiz .navigation nav > ul > li:nth-child(4) ul{ display:flex; }*/
/*body.community .navigation nav > ul > li:nth-child(5) ul{ display:flex; }*/
/*body.specials .navigation nav > ul > li:nth-child(6) ul{ display:flex; }*/
/*body.graz .navigation nav > ul > li:nth-child(7) ul{ display:flex; }*/

/*body.news .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.filme .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.stars .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.quiz .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.community .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.specials .navigation nav > ul > li.shortcuts ul{ display:none; }*/
/*body.graz .navigation nav > ul > li.shortcuts ul{ display:none; }*/

/*body.news .navigation nav > ul > li:nth-child(1) > a,*/
/*body.filme .navigation nav > ul > li:nth-child(2) > a,*/
/*body.stars .navigation nav > ul > li:nth-child(3) > a,*/
/*body.quiz .navigation nav > ul > li:nth-child(4) > a,*/
/*body.community .navigation nav > ul > li:nth-child(5) > a,*/
/*body.specials .navigation nav > ul > li:nth-child(6) > a,*/
/*body.graz .navigation nav > ul > li:nth-child(7) > a{ font-weight:700; }*/

/*body.news .navigation nav > ul > li:nth-child(1) > a:after,*/
/*body.filme .navigation nav > ul > li:nth-child(2) > a:after,*/
/*body.stars .navigation nav > ul > li:nth-child(3) > a:after,*/
/*body.quiz .navigation nav > ul > li:nth-child(4) > a:after,*/
/*body.community .navigation nav > ul > li:nth-child(5) > a:after,*/
/*body.specials .navigation nav > ul > li:nth-child(6) > a:after,*/
/*body.graz .navigation nav > ul > li:nth-child(7) > a:after {*/
/*    display: block;*/
/*    content: '';*/
/*    background: url(../pic/nav-aktiv.png) no-repeat center top;*/
/*    top: 12px;*/
/*    width: 100%;*/
/*    height: 10px;*/
/*}*/
/* <<<<< <<<<< <<<<<    old system styles   <<<<< <<<<< <<<<< */