/* CSS fuer Krefeld - Schoen hier Phase 2 NEU! Jetzt wirds noch schoener... */ /* Allgemeines */ * { border: 0; padding: 0; margin: 0; font-weight: normal; font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif; color: #000; } body { background: #fff; font-size: 1em; } h1 { color: #d22229; font-weight: bold; font-size: 2.2em; line-height: 1.3em; padding: 0.3em 0.813em 0 0.5em; } h1.home { color: #d22229; font-weight: bold; font-size: 2.7em; line-height: 1em; padding: 0.4em 0 0.5em 0.7em; } h2 { color: #000; font-weight: bold; font-size: 1.5em; line-height: 1.2em; padding: 0 0.813em 0.5em 0.813em; } h2.home { color: #000; font-weight: bold; font-size: 2.125em; line-height: 1.875em; padding: 0 0.813em 0.15em 1em; } h3 { color: #000; font-weight: bold; font-size: 1em; line-height: 1em; padding: 0 0.813em 0.813em 1.1em; } p { color: #000; font-size: 0.75em; line-height: 1.35em; padding: 0 3em 1em 1.5em; } p.home { color: #000; font-size: 1em; line-height: 1.4em; margin: 0 auto 1.5em 2em; padding: 0; width: 33.7em; } p.error, b.error { color: #d12229; } b { font-weight: bold; } /*+++++++++++++++++++++++++ general declarations +++++++++++++++++++++++++*/ .invisible { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; } .left { float:left; } .right { float:right; } .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix { min-width:0; } .clearfix { display:block; clear:both; } .required { cursor:help; } a#showWebsite { display:none; position:absolute; top:44em; left:40%; } span.small { font-size:0.9em; line-height:1.2em; } label { font-size: 0.75em; line-height: 1.25em; display: block; width: 9em; float: left; padding-top: 0.2em; margin-right:0.4em; } label.error { font-size: 0.75em; line-height: 0.875em; color: #d12229; display: block; width: 9em; float: left; background: url(/images/error.gif) right 0.3em no-repeat; } label.breit { width: 25em; float: none; margin: 1em 0 0 0; padding: 0; } input.textfeld { border:1px solid #000; background: #fff; font-size: 0.75em; width: 25em; height: 1.5em; margin-bottom: 0.4em; padding: 0.125em; } input.str { width: 18em !important; margin-right: 0.2em; } input.nr { width: 5.938em !important; } input.plz { width: 5.938em !important; margin-right: 0.2em; } input.stadt { width: 18em !important; } input.error { border: 1px solid #d22229 !important; background: #fff; font-size: 0.75em; width: 25em; height: 1.5em; margin-bottom: 0.4em; padding: 0.125em; } select.error { border: 1px solid #d22229 !important; background: #fff; font-size: 0.75em; width: 25em; height: 1.5em; margin-bottom: 0.4em; padding: 0.125em; } textarea.error { border: 1px solid #d22229; background: #fff; font-size: 0.75em; width: 25em; height: 1.5em; margin-bottom: 0.4em; padding: 0.125em; } textarea#summer_street_message, textarea#inquiry_message { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 19.938em; height: 3.7em; margin-bottom: 1.2em; padding: 0.125em; } textarea#summer_street_message { width:25em; border:1px solid #000; } textarea#jury_application_profile_cause, textarea#jury_application_profile_krefeld, textarea#jury_application_profile_aktion, textarea#jury_application_profile_freizeit { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 34.375em; height: 6.2em; margin-bottom: 0.938em; padding: 0.125em; } select#jury_application_gender { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 10em; height: 1.7em; margin-bottom: 0.313em; padding: 0.125em; } select#jury_application_dob_1i { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 5em; height: 1.7em; margin-bottom: 0.313em; padding: 0.125em; } select#jury_application_dob_2i { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 5em; height: 1.7em; margin-bottom: 0.313em; padding: 0.125em; } select#jury_application_dob_3i { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 5em; height: 1.7em; margin-bottom: 0.313em; padding: 0.125em; } select#summer_street_gender, select#inquiry_gender { border: 0.063em solid #000; background: #fff; font-size: 0.75em; width: 10em; height: 1.7em; margin-bottom: 0.313em; padding: 0.125em; } #spalte-mitte ul { list-style-type: disc; padding-left: 1.8em; margin-bottom: 1.563em; } #spalte-mitte ul li { font-size: 0.75em; line-height: 1.2em; } /* Layout */ #container { width: 62.7em; margin: 0 auto; } #container-background { width: 62.7em; position: absolute; z-index: 0; } #content { width: 62.7em; position: absolute; z-index: 5; } #logo { height: 9.813em; } #navigation { position: absolute; z-index: 10; left: 1.2em; } #navigation li { list-style-type: none; } #navigation li a:link, #navigation li a:visited { font-size: 1.2em; line-height: 1.55em; font-weight: bold; text-decoration: none; } #navigation li a:hover, #navigation li a:active, #navigation li a.aktiv { font-size: 1.2em; line-height: 1.55em; font-weight: bold; color: #f49e13; text-decoration: none; } #navigation-background { position: absolute; } #fotograf { position: absolute; top: 20em; left: 1.875em; width: 10em; font-size: 0.7em; line-height: 1.063em; } #fotograf a { text-decoration: underline; } #spalte-links { float: left; width: 8.625em; position: relative; } #spalte-mitte { float: left; width: 39.063em; } #spalte-rechts { float: left; width: 14.688em; } #footer { position: absolute; width: 61.563em; margin: 2em 0 0 0.625em; } #footer #copyright { float: left; font-weight: bold; font-size: 0.688em; margin: 0.625em 0 4.063em 0; } #footer #metanavigation { float: right; font-weight: bold; font-size: 0.688em; margin: 0.625em 0 4.063em 0; } #schatten-links { width: 0.938em; float: left; } #content-mitte { width: 37.2em; background: transparent url(../images/p2_content_bg_white.png); float: left; font-size: 1em; } #content-mitte-background { width: 37.188em; } #schatten-rechts { width: 0.9em; float: left; overflow: hidden; } #player { width: 18.875em; height: 10.625em; top: 1.813em; left: 0.5em; position: absolute; z-index: 60; } #slideshow { width: 35.375em; height: 24.563em; margin-left: 0.7em; position: relative; } /* Teaser */ #teaser-bewerben { background: #d12229; width: 13.938em; height: 12.438em; margin-bottom: 0.563em; } #teaser-bewerben h4 { padding: 1em 0.813em 0.563em 0.7em; color: #fff; font-size: 1.2em; line-height: 1.3em; } #teaser-bewerben p { padding: 0 0.813em 0.563em 1em; color: #fff; font-size: 0.813em; line-height: 1.2em; } #teaser-bewerben a { color: #fff; text-decoration: none; } #teaser-bewerben a.weiter { padding: 0 0.813em; color: #fff; font-size: 1em; line-height: 1em; text-decoration: none; } #teaser-rueckblick { background: transparent; width: 13.938em; height: 11.813em; margin-bottom: 0.563em; } #teaser-rueckblick h4 { padding: 1.125em 0.813em 0.563em 0.813em; color: #000; font-size: 1.2em; line-height: 1.625em; } #teaser-rueckblick p { padding: 0 0.813em 0.563em 1em; color: #000; font-size: 0.813em; line-height: 1.063em; } #teaser-rueckblick a { color: #000; text-decoration: none; } #teaser-rueckblick a.weiter { padding: 0 0.813em; color: #d12229; font-size: 1em; line-height: 1em; } #teaser-galerie { background: transparent; width: 14em; height: 11.875em; margin-bottom: 0.563em; } #teaser-galerie h4 { padding: 1.125em 0.813em 0.375em 0.7em; color: #000; font-size: 1.2em; line-height: 1.3em; font-weight: bold; } #teaser-galerie p { padding: 0 0.813em 0 1em; height: 5.7em; color: #000; font-size: 0.813em; line-height: 1.2em; } #teaser-galerie a { color: #000; text-decoration: none; } #teaser-galerie a.weiter { margin-top: 0.4em; padding: 0 0.813em 0 0.813em; color: #d12229; font-size: 1em; line-height: 1em; font-weight: bold; text-decoration: none; } #teaser-galerieExtern { background: transparent; width: 14em; height: 11.875em; margin-bottom: 0.563em; } #teaser-galerieExtern h4 { padding: 0.9em 0.813em 0.375em 0.7em; color: #000; font-size: 1.2em; line-height: 1.3em; font-weight: bold; width:7em; } #teaser-galerieExtern p { padding: 0 0.813em 0.8em 1em; color: #000; font-size: 0.813em; line-height: 1.2em; } #teaser-galerieExtern a { color: #000; text-decoration: none; } #teaser-galerieExtern a.weiter { padding: 0.7em 0.813em 0 0.813em; color: #d12229; font-size: 1em; line-height: 1em; font-weight: bold; text-decoration: none; } #teaser-guinness { background: #80c4cb; width: 34.813em; height: 8em; margin: 0.563em auto auto 0.938em; } #teaser-guinness h4 { padding: 0.5em 0.7em 0.8em 0.7em; color: #fff; font-size: 1.5em; line-height: 1.1em; font-weight: bold; } #teaser-guinness a { color: #fff; text-decoration: none; } #teaser-guinness a.weiter { padding: 0 0 0 1.1em; color: #fff; font-size: 1em; line-height: 1em; font-weight: bold; text-decoration: none; } #teaser-blog { background: #0e8995; width: 13.938em; height: 12.438em; margin-bottom: 0.563em; filter: alpha(opacity=90); -khtml-opacity: 0.9; -moz-opacity: 0.9; opacity: 0.9; } #teaser-blog h4 { padding: 1em 0.813em 0.563em 0.7em; color: #fff; font-size: 1.2em; line-height: 1.3em; } #teaser-blog p { padding: 0 0.813em 0.563em 1em; color: #fff; font-size: 0.813em; line-height: 1.2em; } #teaser-blog a { color: #fff; text-decoration: none; } #teaser-blog a.weiter { padding: 0 0.813em; color: #fff; font-size: 1em; line-height: 1em; text-decoration: none; } div.cntTeaser { width:13.938em; height:12.438em; margin-bottom:0.563em; } div.cntTeaser h4 { padding:1em 0.813em 0.563em 0.7em; color:#FFF; font-size:1.2em; line-height:1.3em; } div.cntTeaser h4 b { color:#FFF; } div.cntTeaser p { padding:0 0.813em 0.563em 1em; color:#FFF; font-size:0.813em; line-height:1.2em; } div.cntTeaser a { color:#FFF; text-decoration:none; } div.cntTeaser a.weiter { padding:0 1.813em 0 0.813em; color:#FFF; font-size:1em; line-height:1em; text-decoration:none; } #teaser-jury { background:url(../images/p2b_bg_teaser_jury.png); } #teaser-jury a.weiter { background:url(/images/p2_teaser_teilnehmen_pfeil.gif) no-repeat right 0.15em; } #teaser-content { float:left; width:16.2em; height:10em; margin:0 1em 1em 1.1em; background:url(../images/p2b_bg_teaser_content.png); } #teaser-content a.weiter { background:url(/images/p2b_teaser_content_pfeil.gif) no-repeat right 0.15em; } #teaser-examples { background:url(../images/p2b_bg_teaser_examples.png); } #teaser-examples a.weiter { background:url(/images/p2b_teaser_content_pfeil.gif) no-repeat right 0.15em; } #teaser-mitmachen { background:url(../images/p2b_bg_teaser_mitmachen.png); } #teaser-mitmachen a.weiter { background:url(/images/p2b_teaser_mitmachen_pfeil.gif) no-repeat right 0.15em; } /* =navMain ----------------------------------------------- Main Navigation ----------------------------------------------- */ ul#navMain { margin:0; } #navigation { position: absolute; z-index: 10; left: 1.2em; } ul#navMain li { list-style-type:none; } ul#navMain li a:link, ul#navMain li a:visited { padding:0.2em 0.7em; font-size:1.2em; line-height:1.45em; font-weight:bold; text-decoration:none; background:#FFF; } ul#navMain li a:hover, ul#navMain li a:focus, ul#navMain li a:active, ul#navMain li a.aktiv { font-size:1.2em; line-height:1.45em; color:#F49E13; } ul#navMain ul { padding:0.1em 0 0.1em 1em; background:#FFF; } ul#navMain ul li { font-size:0.75em; line-height:1.3em; } ul#navMain ul li a:link, ul#navMain ul li a:visited { padding:0.2em 0.8em; font-size:0.9em; line-height:1.2em; } ul#navMain ul li a:hover, ul#navMain ul li a:focus, ul#navMain ul li a:active, ul#navMain ul li a.aktiv { font-size:0.9em; line-height:1.2em; } #navigation-background { position: absolute; } /* =navMain ----------------------------------------------- */ /* =phase2b ----------------------------------------------- phase2b ----------------------------------------------- */ div#content-mitte-phase2b { float:left; width:37.1em; padding:0 0.938em; background:transparent url(../images/p2b_content_mitte_bg.png) repeat-y; } a.emphasis, a.emphasis:link, a.emphasis:visited, a.emphasis:hover, a.emphasis:focus, a.emphasis:active { padding-right:1.5em; font-weight:bold; color:#702679; text-decoration:none; background:url(../images/p2b_link_blog_pfeil.gif) no-repeat right 0.1em; } p.home a.emphasis, p.home a.emphasis:link, p.home a.emphasis:visited, p.home a.emphasis:hover, p.home a.emphasis:focus, p.home a.emphasis:active { margin-left:0.3em; } div.mitmachen h1 { padding:0.4em 0.813em 0 0.6em; } div.mitmachen p { margin:0; } div.faq h1 { color:#000; padding:0.4em 0.813em 0 0.5em; } div.faq div.cntContent { margin:0 1.1em; padding:1.1em 0 0; background:url(/images/p2b_bgForm.png); } div.faq div.cntContent p { margin-bottom:1.1em; } div.examples ol { position:relative; top:-1.1em; margin:0 0 1.1em 2.5em; } div.examples ol li { font-size:0.8em; } div.examples div.cntContent { margin:0 1.1em; padding:1.1em 0 0; background:url(/images/p2b_bgForm.png); } div.examples div.cntContent p { margin-bottom:1.1em; } div.tnb ol { margin:0 0 2em 2.5em; } div.tnb ol li { font-size:0.8em; margin-bottom:0.6em } div.formsubmit p { margin-bottom:2em; font-size:1em; font-weight:bold; } div.contact form { margin-bottom:1em; } /* =phase2b ----------------------------------------------- */ /* =mitmachenForm ----------------------------------------------- phase2b form ----------------------------------------------- */ div.mitmachenForm { padding:0 0.938em; background:url(../images/p2_content_schatten_links.png) repeat-y; } div.mitmachenForm h1 { font-size:1.5em; color:#000; padding:0.4em 0.813em 0.75em 0.75em; } div.mitmachenForm form { margin:0 1.1em; padding:1.1em 1.1em 0; background:url(/images/p2b_bgForm.png); } div.mitmachenForm form fieldset { margin-bottom:1.5em; } div.mitmachenForm form legend { font-weight:bold; margin-bottom:0.4em; } div.mitmachenForm form legend.error, div.mitmachenForm form legend.error span { color:#D12229; } div.mitmachenForm form p { padding:0 0 2.1em; } div.mitmachenForm form select#idea_gender { width:10em; height:1.7em; margin-bottom:0.313em; padding:0.125em; font-size:0.75em; background:#FFF; border:1px solid #000; } div.mitmachenForm form input { width:25em; height:1.5em; margin-bottom:0.4em; padding:0.125em; font-size:0.75em; background:#FFF; border:1px solid #000; } div.mitmachenForm form input.checkbox { float:left; margin-right:0.4em; padding:0; width:auto; border:none; background:transparent; } div.mitmachenForm form input.checkboxerror { border:0; } div.mitmachenForm form input.even { clear:left; } div.mitmachenForm form input.str { width:18em; margin-right:0.2em; } div.mitmachenForm form input.nr { width:5.938em } div.mitmachenForm form label.str { width:3.5em; } div.mitmachenForm form label.nr { width:5.5em; } div.mitmachenForm form input.plz { width:5.938em; margin-right:0.2em; } div.mitmachenForm form input.stadt { width:18em; } div.mitmachenForm form label.plz { width:2.2em; } div.mitmachenForm form label.stadt { width:6.8em; } div.mitmachenForm form label.checkbox { width:20em; padding:0.3em 0 0.8em; } div.mitmachenForm form label.checkboxerror { width:19.5em; padding-left:0.5em; color:#D22229; background:url(/images/error.gif) left 0.3em no-repeat; } div.mitmachenForm form label.fileUpload { width:auto; padding:0.3em 0.8em 0 0; } div.mitmachenForm form label.breit { width:43em; margin-bottom:0.5em; line-height:1em; } div.mitmachenForm form label strong { font-weight:bold; } div.mitmachenForm form label.error span, div.mitmachenForm form label.error strong { color:#D12229; } div.mitmachenForm form textarea { width:43em; height:9em; font-size:0.75em; background:#FFF; border:1px solid #000; } div.mitmachenForm form textarea.error { border:1px solid #D22229; } div.mitmachenForm form textarea.thinner { height:4.5em; } div.mitmachenForm form input.fileUpload { float:left; } div.mitmachenForm form div#files input#file_upload_button { float:right; width:auto; height:auto; padding:0; border:0; background:transparent; } div.mitmachenForm form div#files p.error { padding-left:0.5em; padding-bottom:0.5em; background:url(/images/error.gif) left 0.3em no-repeat; } div.mitmachenForm form div#files span.error { color:#D22229; } div.mitmachenForm form div.formSubmit { position:relative; left:-1.1em; width:35.9em; padding:1em 0; background:#FFF; } div.mitmachenForm form div.formSubmit p { float:left; width:28em; margin-right:15px; } div.mitmachenForm form div.formSubmit input { float:right; width:auto; height:auto; margin-right:1.1em; padding:0; border:0; } div.mitmachenForm form div.formSubmit input.checkbox { float:left; margin-right:0.4em; padding:0; } div.mitmachenForm form div.formSubmit label.checkbox { width:auto; } div.mitmachenForm form div.formSubmit label.checkboxtnberror { color:#D22229; } div.mitmachenForm form div.formSubmit a, div.mitmachenForm form div.formSubmit a:link, div.mitmachenForm form div.formSubmit a:visited, div.mitmachenForm form div.formSubmit a:hover, div.mitmachenForm form div.formSubmit a:focus, div.mitmachenForm form div.formSubmit a:active { float:left; display:block; margin:0.2em 0 0 0.3em; font-size:0.75em; line-height:1.1em; text-decoration:underline; } div.mitmachenForm form div.formSubmit a.error, div.mitmachenForm form div.formSubmit a.error:link, div.mitmachenForm form div.formSubmit a.error:visited, div.mitmachenForm form div.formSubmit a.error:hover, div.mitmachenForm form div.formSubmit a.error:focus, div.mitmachenForm form div.formSubmit a.error:active { color:#D22229; } div.mitmachenForm form ol { margin:0 0 2em 1.3em; } div.mitmachenForm form ol li { position:relative; font-size:0.8em; margin-bottom:0.2em; } div.mitmachenForm form ol li span.fileSize { position:absolute; left:20em; } div.mitmachenForm form ol li a { position:absolute; left:30em; } /* =mitmachenForm ----------------------------------------------- */ /* Voting: Ideenvorstellungs-Seite */ .idee h3 { font-size: 1.1em; color: #000; font-weight: bold; padding: 0.2em 0 0.3em 0.9em; } .ideenVorstellung { width: 35.25em; margin: 0 auto 1em auto; } .ideenVorstellung h3 { font-size: 1.1em; color: #fff; font-weight: bold; padding: 0.2em 0 0.3em 0.3em; } .ideenVorstellung p { font-size: 0.75em; line-height: 1.5em; padding: 1.19em 0.81em 1.69em 1.4em; } .subInfo { padding: 0.2em 0.5em; font-size: 0.75em; vertical-align: middle; line-heigth: 1em; } .subInfo div span a:link { font-size: 0.95em; text-decoration: none; } .subInfo div span a:link span, .subInfo div span a:visited span { text-decoration: underline; margin-top:-0.2em; } /* Voting: Abstimmungs-Seite */ #ideenFormular { width: 32em; background: #b2dbe0; padding: 1.5em; margin: 0 auto 1em auto; font-size: 1em; } #ideenFormular label { float: left; display: block; width: 10em; margin-bottom: 1.1em; padding: 0.4em 0 0 0; } #ideenFormular .ideenTextfeld { border: 1px solid #000; background: #fff; height: 2em; width: 18.50em; margin-bottom: 0.9em; } h4.idee { margin: 0 auto 1em 0.8em; font-weight: bold; } p.idee { margin-left: 0.8em; width: 45em; } /* Voting: Ergebnis-Seite */ .ergebnisBalken { height: 3.50em; background: #008997; margin: 0 auto 0.7em 1.2em; } .ergebnisBalken p { padding: 0.4em 0 0 0.5em; text-align: left; font-size: 1.50em; color: #fff; width: 4em; } .ergebnisKleiner { font-size: 0.75em; line-height: 1.3em; margin-bottom: 0.5em; } .ergebnisGroesser { font-size: 1em; line-height: 1.1em; margin-left: -0.3em; }