/*------------------------------------------------------------------ [Inhalt] 0. Initialisierung 1. Body / body #container 2. Header / #header 3. Navigation / #navileft #naviright 4. Content / #content 5. Left column / #left 6. Right column / #right 7. Footer / #footer 8. Search / alle properties sind jeweils alphabetisch sortiert [Farben] blau --------- #287ACC --- typo head, links schwarz ------ #000 ------ typo p dunkelgrau --- #666 ------ h3 in marginspalten hellblau ----- #DBEEFF --- tabellenfond th hellerblau --- #F1F6FF --- tabellenfond td wechselnd mit weiß [Typo] Verdana -------------------------------------------------------------------*/ /*------------------------------------------------------------------ -0. Initialisierung -------------------------------------------------------------------*/ /* reset styles */ html, body, ul, ol, li, p, h1, h2, h3, h4 ,h5, h6, form, fieldset { margin: 0; padding: 0; border: 0; } /* hide from IE mac \*/ html {min-height: 100%; margin-bottom: 1px;} /* end hiding from IE mac */ #container {background-color: #FFF; margin-left: auto; margin-right: auto; text-align: left; width: 1000px;} /*------------------------------------------------------------------ -1. Body -------------------------------------------------------------------*/ body {background: url(../images/basics/bg-browser.jpg) repeat-x #AA100E; font: 11px/16px Verdana, Arial, Helvetica, sans-serif; margin: 0; padding: 0; text-align: center;} a img {border: none;} em {font-style: italic;} strong {color: #287ACC; font-weight: bold;} .smalltext {font-size: 9px; line-height: 1.2;} .blue {color: #287ACC; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height: 14px;} .icon {margin-top: 5px;} .iconcaption {float: left; padding-right: 10px; vertical-align: text-top;} #margin p img.iconcaption {-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .linklist {margin-top: -5px;} .linklist p {margin-top: -5px;} /* formular --------------------------------------------------*/ .row {clear: both; padding-top: 10px;} .row span.label {float: left; text-align: right; width: 150px;} .row span.formfield {float: right; text-align: left; width: 250px;} .formtoparea {background-color: #FFC; display: block;} .formbottomarea {background-color: #FC6;} .spacer {clear: both;} /* es gibt oben noch einen spacer, nicht klar, ob sich das widerspricht */ input {color: #000; font: 11px/13px Verdana, Arial, Helvetica, sans-serif; width: 230px;} textarea {color: #000; font: 11px/13px Verdana, Arial, Helvetica, sans-serif; width: 230px;} .checkbox {width: 20px;} .button {width: 100px;} /*------------------------------------------------------------------ -2. Header -------------------------------------------------------------------*/ #header {height: 200px; background: url(../images/basics/bg-header.jpg) no-repeat; width: 1000px;} #header a {text-decoration: none;} /*------------------------------------------------------------------ -3. Navigation -------------------------------------------------------------------*/ #navileft {float: left; margin-top: 85px; margin-right: 0; text-align: right; width: 409px;} #naviright {float: left; margin-top: 85px; width: 380px;} #headanimation {float: left; margin: 33px 45px 0px 37px; width: 112px;} .navi {color: #FC6; font-weight: bold;} .naviactive {color: #FFF; font-weight: bold;} a.navi, a.navi:visited {color: #FFCC66; text-decoration: none;} a.navi:hover {color: #F93; text-decoration: none;} a.naviactive {color: #F09;} /*------------------------------------------------------------------ -4. Content -------------------------------------------------------------------*/ #content {background: url(../images/basics/bg-content.gif) repeat-y; width: 1000px;} #content a {color: #287ACC; text-decoration: none;} #content a:link {border-bottom: 1px dotted #287ACC;} #content a:hover {border-bottom: none;} #content a:visited {color: #999;} #content a:link.imglink {border-bottom: none;} #content a:link.block {display: block; margin-top: 5px;} #content p.topspace {margin-top: 50px;} /* headline --------------------------------------------------*/ #top {width: 1000px;} #top h1 {color: #287ACC; font-size: 26px; line-height: 1.2; margin: 0px 150px 40px 150px; text-align: center;} #top h1 span {font-size: 16px; display: block; margin-bottom: 5px;} /* mittlere spalte --------------------------------------------------*/ #bodywide {float: left; width: 580px;} #bodywide p {width: 410px;} #body {float: left; width: 410px;} #body h2, #body h3, #body h4 {color: #287ACC; margin-bottom: 5px; text-align: left;} #body h2 {font-size: 16px; line-height: 1.3; margin-top: 25px;} #body h2.big {font-size: 20px;} #body h2.doubleh2 {margin-top: 5px; margin-bottom: 20px;} /* für h2 nach h2.big */ #body h2.overinfobox {margin-bottom: -30px;} #body h2:first-child, #body h3:first-child, #body h4:first-child {margin-top: 0} #body h3 {font-size: 12px; line-height: 1.2;} #body h3.topspace {margin-top: 25px;} #body h3.bottomspace {margin-bottom: 10px;} #body h4 {font-size: 11px; line-height: 1.3; margin: 20px 0 0;} #body h4.cinema {background-color: #DBEEFF; color: #287ACC; margin-bottom: 3px; width: 150px;} #body h3.intro {line-height: 1.4; margin-bottom: 15px;} #body h2 a:link, #body h3 a:link, #body h4 a:link {border-bottom: none;} #body h2 a:visited, #body h3 a:visited, #body h4 a:visited {color: #287ACC} #body p {margin-bottom: 10px;} #body p.credits {margin-top: 20px;} #body img {-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,.3); -moz-box-shadow: 2px 2px 6px rgba(0,0,0,.3); box-shadow: 2px 2px 6px rgba(0,0,0,.3);} #body img.logo, #body img.icon {-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} #body ul {list-style: none; margin-bottom: 10px; margin-top: 10px;} #body ul li {list-style: none; margin-bottom: 5px; margin-left: -40px;} #body > ul {margin-top: 0px;} #body ul.contentlist {margin-bottom: 20px;} #body ul.contentlist li {list-style: none; margin-bottom: 10px; margin-left: 0px; padding-top: 3px;} #body ul.contentlist li h3 {margin-bottom: 3px;} #body ul.filmlist li {list-style: none; margin-bottom: 0px; margin-left: 0px;} #body ul.materiallist {margin-bottom: 20px;} #body ul.materiallist li {list-style: none; margin-bottom: 30px; margin-left: 0px; padding-top: 3px;} #body ul.materiallist li h3 {margin-bottom: 3px;} #body .galleryrow {overflow: auto; margin-bottom: 10px;} #body .galleryimg {float: left; margin-right: 15px; width: 120px;} #body .galleryimg p {margin: 5px 0;} #body ol {margin-bottom: 10px; margin-left: 10px;} #body ol li {margin-bottom: 3px; margin-left: 10px;} #body ul.bullets {list-style: none; margin-bottom: 20px; margin-top: 5px;} #body ul.bullets li {list-style: square; margin-bottom: 5px; margin-left: -25px;} #body table {} #body th, #body td {} #body th {} #body td {} #body table.chronik {border-collapse: collapse; border-spacing: 5px;} #body table.chronik th, #body table.chronik td {border-top: 1px solid #999; padding-bottom: 20px; padding-left: 0px; text-align: left; vertical-align: top;} #body table.chronik th {color: #287ACC; font-weight: bold; width: 50px;} #body table.chronik td {width: 350px;} #body table.chronik td p {margin-bottom: 0px; margin-top: 10px;} #body table.termine {border-collapse: collapse; border-spacing: 5px; width: 410px;} #body table.termine th, #body table.termine td {border-top: 1px solid /*#999*/#CCC; padding: 2px 10px 2px 0; text-align: left; vertical-align: top;} #body table.termine th {background-color: #DBEEFF; color: #287ACC; font-weight: bold;} #body table.termine tbody tr.odd td {background-color: #F1F6FF;} #body table.whitelines th, #body table.whitelines td {border-top: 3px solid #FFF;} #body table td.bgone {background-color: #e2eaf6;} #body table td.bgtwo {background-color: #c8d7ed;} #body table td.bgthree {background-color: #aec6e5;} /*-- neu: bodyblöcke --*/ #body .bodyblock {float: left; margin-bottom: 40px; overflow: auto; width: 580px;} #body .bodyblock h2 {color: #287ACC; font-size: 14px; line-height: 16px; margin-bottom: 10px; text-align: left; width: 410px;} #body .bodyblock .maintext {float: left; text-align: left; width: 410px;} #body .bodyblock .margintext {float: right; text-align: left; width: 150px;} #body .bodyblock .margintext p {margin-bottom: 10px;} #body .leftcol {float: left; width: 190px;} #body .leftcol > p, #body .leftcol > ul {margin-top: 0px;} #body .rightcol {float: right; width: 190px;} #body .rightcol > p, #body .rightcol > ul {margin-top: 0px;} #body .minitype {font-size: 9px;} #body .infobox {background-color: #F1F6FF; border-bottom: 1px solid #DBEEFF; border-top: 1px solid #DBEEFF; clear: both; display: block; margin-bottom: 20px; padding: 2px 5px;} #body .infobox h4 {margin-top: 5px;} .highlight {background-color: #FFF7D9; border-bottom: 1px solid #FC6; border-top: 1px solid #FC6; margin-bottom: 10px; padding: 3px 0;} /* zusatz-klasse: infobox in beige */ #body .infoboxblue {background: url(../images/basics/bg-infobox.jpg) repeat-x #3987F0; clear: both; color: #FFF; margin: 40px 0; padding: 15px 20px;} #body .infoboxblue h2 {color: #FFF; margin: 0 0 10px;} #body .infoboxblue h3, #body .infoboxblue h4 {color: #FFF;} #body .infoboxblue p {margin-bottom: 20px;} #body .infoboxblue strong {color: #FFF;} #body .infoboxblue a:link {border-bottom: 1px dotted #FFF; color: #FFF; text-decoration: none;} #body .infoboxblue a:visited {border-bottom: 1px dotted #FFF; color: #FFF; text-decoration: none;} #body .infoboxblue a:hover {color: #FFF; text-decoration: none;} #body .infoboxblue img {float: left; margin: 5px 10px 10px 0;} #body .infoboxblue img.tight {float: left; margin: 5px 10px 0 0;} #body .infoboxblue + p img {margin-top: -30px;} /* für eventankündigung: großes foto direkt unter infos zum film */ #body .infoboxblue + p img.reset {margin-top: 0;} /* für eventankündigung: kleines foto direkt unter infos zum film normal im absatz zeigen */ #body .filmshortinfo {border-top: 1px solid #999; margin-bottom: 50px; padding-top: 5px;} #body .filmshortinfo h3 {font-size: 16px; line-height: 1.2; margin-bottom: 5px;} #body .filmshortinfo img {float: left; margin: 5px 10px 5px 0;} #body .leftcolcentered {float: left; text-align: center; width: 190px;} #body .rightcolcentered {float: right; text-align: center; width: 190px;} #body .logobox {margin: 10px 0 20px 0;} /* veraltet: s.u. .sponsors */ #body .logobox img {margin-right: 5px;} /* veraltet: s.u. .sponsors */ #body .sponsors {border: 1px solid #999; margin: 30px 0; padding: 15px;} #body .sponsors h3 {color: #000; font-style:italic; font-weight: normal; line-height: 1.3; margin: 0 0 10px 0;} #body .sponsors img {margin: 0 20px 20px 0;} #body .centerbox {margin-bottom: 20px; text-align: center;} #body img.leftoftwo {float: left; margin-right: 20px;} #body .imageleft {float: left; margin: 5px 15px 0 0;} #body .imageright {float: right; margin: 5px 0 0 15px;} #body img.withcaption {margin-bottom: 10px;} #body img.filmliste {float: left; margin-bottom: 10px; margin-right: 10px; vertical-align: top;} #body .clear {clear: both;} #body table.logoboard {border-spacing: 10px;} #body table.logoboard td {text-align: center; vertical-align: middle; width: 130px;} #body table.logoboard td.tabspacer {height: 10px;} #body .spacer {display: block; height: 20px;} #body .spacerpetit {display: block; height: 100px;} #body div.newsblock {margin-bottom: 15px; clear: both; overflow: auto;} #body div.newsblock p {margin-bottom: 5px;} #body div.newsblock h3 {margin-bottom: 5px;} #body div.newsblock div.left {float: left; width: 200px; overflow: hidden;} #body div.newsblock div.right {float: right; width: 200px; overflow: hidden;} /*#body div.newsblock > h2 {margin-top: 0}*/ #body .newsblock span.left {float: left; text-align: left; width: 200px; overflow: hidden;} #body .newsblock span.right {float: right; text-align: left; width: 200px;overflow: hidden;} #body .newsblock span.left span.one {float: left; text-align: left; width: 90px;overflow: hidden;} #body .newsblock span.left span.two {float: right; text-align: left; width: 100px;overflow: hidden;} #body .newsblock span.right span.one {float: left; text-align: left; width: 90px;overflow: hidden;} #body .newsblock span.right span.two {float: right; text-align: left; width: 100px;overflow: hidden;} /*#body .newsblock h2 {text-align: left;} #body .newsblock h3 {margin-bottom: 0px;} #body .newsblock p {margin-bottom: 10px;}*/ span.date {color: #666; display: block; font-weight: bold;} div.right > span.date, div.right h3:first-child {margin-top: -3px;} .sidebox {background: url(../images/basics/bg-box-bottom.gif) no-repeat;} .sideboxtop {background: url(../images/basics/bg-box-top.gif) no-repeat;} /* pressespiegel */ blockquote {background: url(../images/basics/bg-paper.jpg) no-repeat #FEFDF5; margin: 20px 0px; padding: 20px 10px 5px; position: relative; width: 360px;} blockquote span {background: url(../images/basics/quote.gif) no-repeat transparent; height: 30px; position: absolute; left: -30px; top: 25px; width: 30px;} blockquote strong {color: #F93;} blockquote p {margin-bottom: 5px;} blockquote p.author {color: #287ACC; font-style: italic; font-weight: bold; margin-top: -5px; padding-right: 30px; text-align: right;} blockquote p.author a {font-weight: normal;} blockquote.indent20 {margin-left: 20px;} /*------------------------------------------------------------------ -5. Left column -------------------------------------------------------------------*/ #left {float: left; width: 295px;} #subnavi {color: #287ACC; font: 11px/20px Verdana, Arial, Helvetica, sans-serif; font-size: 1.1em; line-height: 1.8; padding: 0 10px 0 50px;} #subnavi a.subnavi {border-bottom: none;} #subnavi a.subnavi:visited {color: #287ACC;} .subnavi {} .subnaviactive {font-weight: bold;} #subnavisukiwo {color: #287ACC; font: 11px/20px Verdana, Arial, Helvetica, sans-serif; padding: 0 0 0 50px;} #left img.sticker {margin: 5px 0 0 33px;} a.imglink {border: none;} #leftboxes {padding-left: 50px; width: 205px;} /* marginspalten links UND rechts */ .marginboxtop {background: url(../images/basics/bg-marginbox-top.gif) no-repeat top left; height: 10px;} .marginbox {background: url(../images/basics/bg-marginbox.gif) no-repeat bottom left; margin-bottom: 10px; padding: 0 15px 12px 10px;} .marginbox h2, .marginbox h3, .marginbox h4 {color: #666; font-size: 12px; line-height: 16px; margin-bottom: 2px;} .marginbox h4 {color: #888;} .marginbox p {margin-bottom: 5px;} .marginbox ul {margin-bottom: 10px;} .marginbox ul li {border-top: 1px solid #666; list-style: none; padding: 5px 0 7px 0;} .marginbox ul.filmlinklist li {border: none; padding-bottom: 2px;} #left .marginbox a:link.actionbtn, #right .marginbox a:link.actionbtn, #left .marginbox a:visited.actionbtn, #right .marginbox a:visited.actionbtn {background: url(../images/basics/btn-action-sprite.gif) no-repeat 0 0; border: none; color: #FFF; display: block; font: bold 12px/14px Verdana, Geneva, sans-serif; height: 25px; padding: 5px 10px 0 10px;} #left .marginbox a:hover.actionbtn, #right .marginbox a:hover.actionbtn {background: url(../images/basics/btn-action-sprite.gif) no-repeat 0 -35px;} /*------------------------------------------------------------------ -6. Right column -------------------------------------------------------------------*/ #right {float: left; width: 295px;} #margin {font: 11px/16px Verdana, Arial, Helvetica, sans-serif; padding: 0px 50px 0px 40px;} #margin > p {margin-top: 0px;} #margin p {margin: 0 0 10px 0;} #margin p.caption {line-height: 1.2; margin: -5px 0 20px 7px;} #margin p img {margin-left: 7px; margin-bottom: 5px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,.3); -moz-box-shadow: 2px 2px 6px rgba(0,0,0,.3); box-shadow: 2px 2px 6px rgba(0,0,0,.3);} #margin .marginbox p img {margin-left: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .icon {margin-top: 5px;} .iconcaption {float: left; padding-right: 10px; vertical-align: text-top;} .linklist {margin-top: -5px;} .linklist p {margin-top: -5px;} /*------------------------------------------------------------------ -7. Footer -------------------------------------------------------------------*/ #footer {clear: both; color: #287ACC; padding: 50px 0px 30px 0px; text-align: center; width: 1000px;} #footer a:link, #footer a:hover, #footer a:visited {border-bottom: none;} #footer a:visited {color: #287ACC;} #footer a:hover {border-bottom: 1px dotted #287ACC;} /* animation am fuss der seite --------------------------------------------------*/ #bottom {background: url(../images/basics/bg-footer.gif) no-repeat #AA100E; height: 120px; text-align: center; width: 1000px;} /*------------------------------------------------------------------ -8. Search -------------------------------------------------------------------*/