/* Farben DM Yellow: #fc0 DM Cyan: #4dd4ff DM TextCyan: #3eaacc DM DarkGrey: #262626 */ /* opening kludge to reset all */ html, body, body *, div, table, h1, h2, h3, h4, h5, h6, p, form, img, input, select { margin: 0; border: 0; padding: 0; font-size: 100.01%; } /* basics */ body { background: #fff url("/assets/images/pattern.gif") ; font-size: 62.5%; } /*body * { border: 1px solid red; }*/ h1 { font-size: 1.6em; } h2 { font-size: 1.3em; } h3 { font-size: 1.2em; } p { margin: 1em 0; } #page { width: 800px; margin: 10px auto; font: 1.2em/1.8em Verdana, Helvetica, sans-serif; } #header { background: #000; } #header img { display: block; margin: 0 auto; } #footer { background: #4dd4ff url("/assets/images/tile.gif"); height: 40px; } /* NAV ############################################################################################## */ #nav { height: 40px; background: url("/assets/images/nav.gif") no-repeat 0 -40px; position: relative;} ul#nav li { padding: 0; margin: 0; list-style-type: none; float: left; text-indent: -9999px; } ul#nav li a { border: 0; text-decoration: none; display: block; background: url("/assets/images/nav.gif") no-repeat; position: absolute; height: 40px; } ul#nav li a:hover { border-bottom: 6px solid #fc0; } ul#nav li#btn_start a { width: 42px; left: 10px;} ul#nav li#btn_start a:link, ul#nav li#btn_start a:visited { background-position: -10px 40px; } ul#nav li#btn_start a.selected, ul#nav li#btn_start a.selected:hover { background-position: -10px 0px; } ul#nav li#btn_biographien a { width: 98px; left: 77px;} ul#nav li#btn_biographien a:link, ul#nav li#btn_biographien a:visited { background-position: -77px 40px; } ul#nav li#btn_biographien a.selected, ul#nav li#btn_biographien a.selected:hover { background-position: -77px 0px; } ul#nav li#btn_repertoire a { width: 88px; left: 202px;} ul#nav li#btn_repertoire a:link, ul#nav li#btn_repertoire a:visited { background-position: -202px 40px; } ul#nav li#btn_repertoire a.selected, ul#nav li#btn_repertoire a.selected:hover { background-position: -202px 0px; } ul#nav li#btn_events a { width: 51px; left: 317px;} ul#nav li#btn_events a:link, ul#nav li#btn_events a:visited { background-position: -317px 40px; } ul#nav li#btn_events a.selected, ul#nav li#btn_events a.selected:hover { background-position: -317px 0px; } ul#nav li#btn_referenzen a { width: 90px; left: 395px;} ul#nav li#btn_referenzen a:link, ul#nav li#btn_referenzen a:visited { background-position: -395px 40px; } ul#nav li#btn_referenzen a.selected, ul#nav li#btn_referenzen a.selected:hover { background-position: -395px 0px; } ul#nav li#btn_cd a { width: 20px; left: 512px;} ul#nav li#btn_cd a:link, ul#nav li#btn_cd a:visited { background-position: -512px 40px; } ul#nav li#btn_cd a.selected, ul#nav li#btn_cd a.selected:hover { background-position: -512px 0px; } ul#nav li#btn_termine a { width: 62px; left: 556px;} ul#nav li#btn_termine a:link, ul#nav li#btn_termine a:visited { background-position: -556px 40px; } ul#nav li#btn_termine a.selected, ul#nav li#btn_termine a.selected:hover { background-position: -556px 0px; } ul#nav li#btn_galerie a { width: 57px; left: 645px;} ul#nav li#btn_galerie a:link, ul#nav li#btn_galerie a:visited { background-position: -645px 40px; } ul#nav li#btn_galerie a.selected, ul#nav li#btn_galerie a.selected:hover { background-position: -645px 0px; } ul#nav li#btn_kontakt a { width: 60px; left: 730px;} ul#nav li#btn_kontakt a:link, ul#nav li#btn_kontakt a:visited { background-position: -730px 40px; } ul#nav li#btn_kontakt a.selected, ul#nav li#btn_kontakt a.selected:hover { background-position: -730px 0px; } /* Textpattern "gibt ?=termine aus". Folglich funktioniert .selected nicht auf der Termine-Seite. */ #termine #btn_termine a { background-position: -556px 0px !important; } #termine #btn_start a { background-position: -10px 40px !important; } /* content area */ #content { background: #fff url("/assets/images/textbg.jpg") repeat-y 0 -50px; padding: 1em 1em 4em; } #content h1 { display: none; } #content ul { list-style: square; margin: 1em 0; text-align: left; } #content ul li { margin-left: 2em; } #left ul li { margin-left: 16px; } #content #left, #content #right { text-align: justify; } #content #left { float: left; width: 370px; margin-right: 30px; } #content #dummy { clear: both; } #content a { font-weight: bold; color: #000; text-decoration: none; padding: 0 2px; text-transform: uppercase; position: relative; left: -2px; } #content a:hover { color: #fff; background: #000; } #content strong { color: #3eaacc;} /* cd */ #cd #content #left img { position: relative; top: 5px; } #cd #content #left a:hover { background: transparent; } #cd #content #left a img { border: 1px solid #000; } #cd #content #left a:hover img { border: 1px solid #fff; } #cd #content #right { margin-left: 400px; } #cd #content #right h2 { position: relative; left: -1px; } #cd #content #right ul li { list-style: none; background: url("/assets/images/bullet.gif") no-repeat -1px 3px; } /* SAFARI 3 #################################################################################################### */ @media screen and (-webkit-min-device-pixel-ratio:0) { #cd #content #left img { position: relative; top: 6px !important; } } /* gallery */ #lbgallery { margin: 30px 0; padding: 10px 10px 0 10px; line-height: 40px; text-align: center; border-left: 20px solid #151515; border-right: 20px solid #151515; } #lbgallery a { margin: 10px 5px; } #lbgallery a img { border: 1px solid #000; } #lbgallery a:hover img { border: 1px solid #fff; } #galerie #content #lbgallery a:hover { background: transparent;} #galerie h2 { margin-top: 21px;} /* kontakt */ #kontakt #left { text-align: left; } #fblogo { margin-left: 110px; height: 100px; } #content #left a.email { text-transform: lowercase; } fieldset { border: 0; } label { width: 60px; text-align: right; display: block; float: left; margin-right: 10px; } input, textarea { width: 280px; border: 1px solid #000; background: #fff; } textarea { height: 200px; } #btn_submit { width: 80px; margin-left: 180px; } div.formrow { margin: 2em 0; } span.label { font-weight: bold; } span.error { display: block; font-size: 9px; color: #800; font-weight: bold; margin-left: 10px !important; } #kontakt #content { padding-bottom: 100px;} /* danke */ #danke #right { height: 500px; } /* referenzen */ #referenzen #right p.quote { font-style: italic; margin-bottom: 0; } #referenzen #right p.source { font-weight: bold; text-align: right; margin: 0 0 2em; } #referenzen #right, #referenzen #left { height: 550px;} /* termine */ div.termin h3 { background: url("/assets/images/bullet.gif") no-repeat 0px 6px; padding-left: 20px; margin: 18px 0 0; font-size: 1em; } div.termin p { padding-left: 20px; margin-top: 0; } div.termin { border-bottom: 1px dotted #262626; } #termine h2 { margin-top: 20px;} /* trade gothic headers */ #start1 { background: transparent url("/assets/images/headers/startpage1.gif") } #pressemappe { background: transparent url("/assets/images/headers/pressemappe.gif"); } #biographie1 { background: transparent url("/assets/images/headers/biographie1.gif") } #biographie2 { background: transparent url("/assets/images/headers/biographie2.gif") } #cd1 { background: transparent url("/assets/images/headers/cd1.gif") } #cd2 { background: transparent url("/assets/images/headers/cd2.gif") } #cd3 { background: transparent url("/assets/images/headers/cd3.gif") } #cd4 { background: transparent url("/assets/images/headers/cd4.gif") } #repertoire1 { background: transparent url("/assets/images/headers/repertoire1.gif") } #repertoire2 { background: transparent url("/assets/images/headers/repertoire2.gif") } #repertoire3 { background: transparent url("/assets/images/headers/repertoire3.gif") } #events1 { background: transparent url("/assets/images/headers/events1.gif") } #events2 { background: transparent url("/assets/images/headers/events2.gif") } #referenzen1 { background: transparent url("/assets/images/headers/referenzen1.gif") } #referenzen2 { background: transparent url("/assets/images/headers/referenzen2.gif") } #termine1 { background: transparent url("/assets/images/headers/termine1.gif"); text-indent: -9999px; position: relative; background-repeat: no-repeat; left: -1px; } #gallery1 { background: transparent url("/assets/images/headers/gallery1.gif"); text-indent: -9999px; position: relative; background-repeat: no-repeat; left: -1px; } #kontakt1 { background: transparent url("/assets/images/headers/kontakt1.gif") } #kontakt2 { background: transparent url("/assets/images/headers/kontakt2.gif") } #kontakt3 { background: transparent url("/assets/images/headers/kontakt3.gif") } #kontakt4 { background: transparent url("/assets/images/headers/kontakt4.gif") } #left h2, #right h2, #startpage h2 { text-indent: -9999px; position: relative; background-repeat: no-repeat; margin-top: 20px;} #left h2 { left: -1px; } #right h2 { left: 399px; } #startpage #pressekit { position: relative; top: 30px; } /* 404 */ #error-page h2 { font-size: 18px; font-weight: bold; padding: 20px 30px; } #error-page p { padding: 0 30px; } #error-page p strong { font-weight: bold; } #error-page ul#sitemap { list-style: none; margin: 30px 50px 0; } #error-page ul#sitemap li { margin-bottom: 5px; } #error-page ul#sitemap li a:link, #error-page ul li a:visited { font-weight: bold; color: #3CA4BD; text-decoration: none; } #error-page ul#sitemap li a:hover, #error-page ul li a:active { text-decoration: underline; } /* custom bullets */ #content #left ul li { list-style: none; background: url("/assets/images/bullet.gif") no-repeat 0px 6px; padding-left: 20px; position: relative; left: -17px; } #content #right ul li { list-style: none; background: url("/assets/images/bullet.gif") no-repeat 0px 6px !important; padding-left: 20px; position: relative; left: -20px; } /* Overrides for Mozilla (Safari ignores these) */ h2 { width: 370px; } #btn_submit { width: auto; height: auto; margin-top: 20px; }