/* ------------------------------------------------------------------------ */ /* bakery-films.de /* --- /* base.css /* v1.01 - 100608 1230 -----------------------------------------------------------------------------*/ /* GLOBAL RESET /* --- /* Sicheres Zurücksetzen der Formatierung aller Elemente -----------------------------------------------------------------------------*/ @import url("./reset.css"); /* defaults -----------------------------------------------------------------------------*/ html, body { height:100% } body { font:76%/140% Arial, Helvetica, Geneva, sans-serif;color:#000;background:url(../images/main_background.gif) repeat-x #f3f3ee } p { line-height:1.4em;margin-bottom:1.0em } table { width:100% } th, td { vertical-align:top; text-align:left } strong { font-weight:bold } * { text-transform:uppercase } em { font-style:italic } /* library -----------------------------------------------------------------------------*/ .hidden { position:absolute;top:-999em;left:-999em;z-index:0 } .to_front { z-index:1000 } .nowrap { white-space:nowrap } .float_left { float:left } .float_right { float:right } .align_left { text-align:left } .align_center { text-align:center } .align_right { text-align:right } .autoclear:after { content:".";display:block;height:0;clear:both;visibility:hidden } .autoclear { display:inline-table } /* Hides from IE-mac \*/ * html .autoclear { height:1% } .autoclear { display:block } /* End hide from IE-mac */ br.clear, .clear { clear:both;line-height:0;font-size:0;height:0;border:0 } .zero { overflow:hidden;margin:0;padding:0;line-height:0;font-size:0;height:0;border:0 } .no_transform, .no_transform p, .no_transform span, .no_transform a { text-transform:none } /* LINKS /* --- /* Allg. Styling der Links -----------------------------------------------------------------------------*/ a, a:link, a:visited , a:active, a:hover { cursor:pointer } a, a:link, a:visited { color:#454545 } a:hover { color:#000;text-decoration:underline } /* HEADLINES /* --- /* Allg. Styling der Überschriften -----------------------------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { color:#000;margin-bottom:1em } h1, h2, h3 { font-weight:bold } h4 { font-style:italic } h1, h2 { font-size:1.4em } /* EL:WRAPPER /* --- /* Das allumschließende Element -----------------------------------------------------------------------------*/ #wrapper { position:relative;min-width:975px;min-height:100%;margin:0 auto;/* Moderne Browser */ height:auto !important;/* Moderne Browser */ height:100%;/* IE */ } #wrapper { background:top center no-repeat transparent } #wrapper.home { background-image:url(../images/content_background_home.jpg) } #wrapper.housereel { background-image:url(../images/content_background_housereel.jpg) } #wrapper.directors { background-image:url(../images/content_background_directors.jpg) } #wrapper.contact, #wrapper.contact-hamburg { background-image:url(../images/content_background_contact.jpg) } #wrapper.contact.berlin, #wrapper.contact.hamburg { background-image:url(../images/content_background_contact-new.jpg) } #wrapper.contact.family-pics { background-image:url(../images/content_background_contact_family_pics.jpg) } #wrapper.about { background-image:url(../images/content_background_about.jpg) } #wrapper.making-of { background-image:url(../images/content_background_making_of.jpg) } #wrapper.imprint { background-image:url(../images/content_background_imprint.jpg) } #wrapper.newsletter { background-image:url(../images/content_background_newsletter.jpg) } #wrapper.dvd { background-image:url(../images/content_background_dvd.jpg) } /* EL:CONTENT /* --- /* Inhalt -----------------------------------------------------------------------------*/ #content { position:relative;height:460px;width:975px;margin:0 auto;color:#fff;font-size:10px;font-weight:bold;line-height:1.4em;/* overflow:hidden;*/ } div.column_50 { float:left;width:45%;margin-right:1em } div.gc, div.gc div { position:absolute } div.gc div { overflow:hidden } div.gc div.gc_content { color:#fff;left:0;overflow:visible;padding:10px;text-transform:none;top:0;width:auto } div.gc div.gc_content.no_padding { padding:0 } div.gc_content p { margin-bottom:1.4em } div.gc_content img { margin:10px 11px } div.gc_content a { color:#fff } div.gc.scroll, div.gc.movie_list { overflow:auto } div.gc ul.movie_list li { display:block;width:250px;height:60px;line-height:14px;margin-bottom:10px;background:url(../images/content_grey_rounded_right.gif) no-repeat top right transparent } div.gc ul.movie_list div._thumb { width:120px;height:60px;background:#f1f1f1;border:1px solid #e9e9e9 } div.gc ul.movie_list div._thumb img { display:block;width:120px;margin:0 } div.gc ul.movie_list div._link { margin-left:130px } div.gc ul.movie_list a, div.gc ul.movie_list a:hover { color:#fff } div.gc table.contact_list { width:100%;font-size:10px;font-weight:bold;line-height:1.4em;color:#454545 } div.gc .contact_list tr:hover, div.gc tr.active{ background:url(../images/nav_sub_list_background.gif) no-repeat right center transparent;color:#fff;cursor:pointer } div.gc .contact_list td { padding-left:2px;line-height:14px } div.gc .contact_list td:hover { background:url(../images/nav_sub_list_background.gif) no-repeat right center transparent } div.gc .contact_list td:first-child:hover { background:url(../images/nav_sub_list_background_pattern.gif) repeat-x 0 center transparent } #contact_pic { margin:0 } div.info { position:absolute;width:160px } div.info ul { margin:0 0 17px } div.info ul.right { text-align:right } div.info li { display:block;height:15px;margin:0 0 1px;padding:0 5px } div.info li.white , div.info span { color:#fff } div.info ul.right span { float:left } .home #content div.info { color:#f00 } .housereel h1, .housereel h2, .housereel h3, .housereel div.info { color:#94c600 } .housereel #content div.info { top:133px;left:40px } .housereel #content div.info.container_2 { top:21px;left:835px } .directors h1, .directors h2, .directors h3, .directors div.info { color:#ffde00 } .directors #content div.info { top:98px;left:50px;width:120px } .directors #content div.info.container_2 { top:41px;left:806px } .making-of h1, .making-of h2, .making-of h3, .making-of div.info { color:#106ba5 } .making-of div.info { top:133px;left:40px } .making-of div.info.container_2 { top:21px;left:835px } .about h1, .about h2, .about h3, .about #content div.info, .about #content div.gc_content { color:#ff8c21 } .about #content div.info { top:135px;left:120px } .contact #content div.info { color:#00b1c6;top:124px;left:62px;width:150px } .contact #content a.map { background:no-repeat 0 0 transparent;display:block;height:395px;margin-top:-33px;width:408px } .contact.berlin #content a.map { background-image:url('../images/content_contact_map_berlin.jpg') } .contact.hamburg #content a.map { background-image:url('../images/content_contact_map_hamburg.jpg') } .contact.family-pics #content div.info { color:#00b1c6;top:94px;left:62px;width:150px } .contact.family-pics #content div.info.container_2 { top:88px;left:788px } .contact.family-pics #content div.info a { color:#fff } .dvd h1, .dvd h2, .dvd h3, .dvd div.info, .newsletter h1, .newsletter h2, .newsletter h3, .newsletter div.info, .imprint h1, .imprint h2, .imprint h3, .imprint h4, .imprint div.info { color:#fff } .dvd #content div.info, .newsletter #content div.info, .imprint #content div.info { top:163px;left:85px;width:130px } div.msg { padding:5px 10px;margin-bottom:2em;border:1px solid;width:100% } div.msg.success { border-color:#696;background-color:#9c9 } div.msg.failure { border-color:#c99;background-color:#daa } /* EL:NAVIGATION /* --- /* Navigation -----------------------------------------------------------------------------*/ #navigation { position:relative;width:975px;margin:0 auto;z-index:9998;line-height:1 } #navigation, #navigation a { text-transform:uppercase } #logo { position:absolute;top:40px;left:0;width:125px;height:119px } #logo a { display:block;width:125px;height:119px } #logo h1 { background:url(../images/main_logo.gif) 0 9px no-repeat transparent;text-indent:-999em } #nav_line { position:absolute;top:22px;right:315px;width:630px;height:3px;background:url(../images/nav_line.gif) 0% 0% repeat-x transparent } #nav_line.housereel , #nav_line.cat_2 { width:520px } #nav_line.directors, #nav_line.cat_3 { width:410px } #nav_line.making-of, #nav_line.cat_4 { width:300px } #nav_line.about, #nav_line.cat_5 { width:190px } #nav_line.contact, #nav_line.cat_6 { width:80px } .nav_category { position:absolute;top:-5px;height:25px;width:100%;background:url(../images/nav_category_background.gif) repeat-x transparent;z-index:1000;text-indent:-999em } .nav_category li { float:left;position:relative } * html .nav_category li * { position:relative } .nav_category li, .nav_category ul { margin:0;padding:0;/* z-index:9999; */} .nav_category a { background:left top no-repeat transparent;display:block;width:110px;height:25px;color:#454545;font-weight:bold;text-indent:-999em;overflow:hidden } .nav_category li.first-child { padding-left:20px;background:url(../images/nav_category_rounded_left.gif) 0 5px no-repeat transparent } .nav_category li:hover ul, .nav_category li.ie-hover ul, .nav_category li ul.active { left:14px } .nav_category ul { z-index:9950 } .nav_category ul:hover { z-index:9999 } .nav_category li li { float:none;position:static;width:155px;padding-left:10px;background:left center no-repeat transparent } .nav_category li li a, .nav_category li li a:hover, .nav_category li li a:active { font-size:10px;height:auto;padding:2px 8px;text-indent:0;text-decoration:none;width:155px } .nav_category li li a.active, .nav_category li li a:hover { color:#fff;background:url(../images/nav_sub_list_background.gif) right center no-repeat transparent } .nav_category li ul, .nav_category li ul.ie-not-hover { position:absolute;top:25px;width:250px;left:-999em;line-height:1.4em;padding:5px 0 12px } .nav_category li ul { background:url(../images/nav_sub_list_cross_line_right.gif) -999em -999em no-repeat transparent } .nav_category li:hover ul.row_2, .nav_category li ul.row_2.active { left:-170px;padding-top:0 } .nav_category li ul.row_2.active.ie-not-hover { left:-999em } .nav_category ul.left { text-align:right;margin-left:-220px;background-image:url(../images/nav_sub_list_cross_line_left.gif);left:-999em } .nav_category ul li.left { text-align:right } .nav_category li:hover ul.left, .nav_category li.ie-hover ul.left, .nav_category li ul.left.active { left:160px } .nav_category ul.left li, .nav_category li.left { padding:0 26px 0 0;background-position:right center } .nav_category ul.left a { padding-right:8px } .nav_category .left a.active, .nav_category .left a:hover { background:url(../images/nav_sub_list_background_left.gif) left center no-repeat transparent } .nav_category li ul.left.ie-not-hover { left:-999em;background-position:-999em -999em } .nav_category a.cat_1 { background-image:url(../images/nav_category_cat_1.gif) } .nav_category a.cat_2 { background-image:url(../images/nav_category_cat_2.gif) } .nav_category a.cat_3 { background-image:url(../images/nav_category_cat_3.gif) } .nav_category a.cat_4 { background-image:url(../images/nav_category_cat_4.gif) } .nav_category a.cat_5 { background-image:url(../images/nav_category_cat_5.gif) } .nav_category a.cat_6 { background-image:url(../images/nav_category_cat_6.gif) } .nav_category a.active, .nav_category a:hover { background-position:left -25px } .nav_category ul.cat_1 li { background-image:url(../images/nav_sub_list_cat_1.gif) } .nav_category ul.cat_2 li { background-image:url(../images/nav_sub_list_cat_2.gif) } .nav_category ul.cat_3 li { background-image:url(../images/nav_sub_list_cat_3.gif) } .nav_category ul.cat_4 li { background-image:url(../images/nav_sub_list_cat_4.gif) } .nav_category ul.cat_5 li { background-image:url(../images/nav_sub_list_cat_5.gif) } .nav_category ul.cat_6 li { background-image:url(../images/nav_sub_list_cat_6.gif) } .nav_category ul.cat_6 { width:100px } .nav_main { position:absolute;top:15px;right:0px;overflow:hidden } .nav_main ul { float:right;width:100px;padding-left:5px;background:url(../images/nav_main_border_left.gif) 0 0 no-repeat transparent;color:#454545 } .nav_main li.headline { font-size:7px;font-weight:bold;margin:0 0 1em;line-height:10px;width:100px } .nav_main li#main_navigation.headline, .nav_main li#essentials.headline, .nav_main li#extras.headline { background:0 3px no-repeat transparent;text-indent:-999em } .nav_main li#main_navigation.headline { background-image:url(../images/nav_main_label_navigation.gif) } .nav_main li#essentials.headline { background-image:url(../images/nav_main_label_essentials.gif) } .nav_main li#extras.headline { background-image:url(../images/nav_main_label_extras.gif) } .nav_main a { font-size:10px;font-weight:bold;line-height:1.4em;white-space:nowrap } .nav_main a.icon { display:block;height:14px;margin:0 0 6px;padding-left:18px;line-height:14px;background:url(../images/nav_main_icons.gif) 0 0 no-repeat transparent } .nav_main a.icon.cat_1 { background-position:0 0 } .nav_main a.icon.cat_2 { background-position:0 -14px } .nav_main a.icon.cat_3 { background-position:0 -28px } .nav_main a.icon.cat_4 { background-position:0 -42px } .nav_main a.icon.cat_5 { background-position:0 -56px } .nav_main a.icon.cat_6 { background-position:0 -70px } .nav_main a.icon.imprint { background-position:0 -84px } .nav_main a.icon.newsletter { background-position:0 -98px } .nav_main a.icon.deutsch { background-position:0 -112px } .nav_main a.icon.english { background-position:0 -126px } .nav_main a.icon.bingo { background-position:0 -140px } .nav_main a.icon.invaders { background-position:0 -154px } .nav_main a.icon.tetris { background-position:0 -168px } /* EL:FOOTER /* --- /* - -----------------------------------------------------------------------------*/ #footer { clear:both;height:20px;padding:10px 0 20px;color:#999;font-size:10px;text-align:center;overflow:hidden;display:none } #footer ul { display:block } #footer li { display:inline } #footer li a { color:#999;padding:0 5px } #footer li a:hover { border:none;/* background:#c0c0c0;*/ } /* FORM /* --- /* - -----------------------------------------------------------------------------*/ form div.legend { position:relative;padding:2px .5em 3px;margin-bottom:1em;color:#fff;width:370px;font-weight:bold } form div.details { position:relative;white-space:nowrap;overflow:hidden } form input.text, form input.password, form textarea, form select, form label { display:block;width:256px;float:left;margin-bottom:3px;font-size:1em } form input, form textarea, form select { text-transform:none } form input.radio { margin-left:10px } form select { width:auto } form label { text-align:right;height:18px;line-height:18px;width:95px;padding-right:10px;color:#fff;background:url(../images/content_grey_rounded_left.gif) no-repeat left center transparent } form label.radio { display:inline;float:none;text-align:left;width:auto;background:none;line-height:1.4em;vertical-align:top } form span.hint { font-size:.9em;color:#eee;margin-left:148px } form p, form br { clear:left } .gc_content form p { margin-bottom:.5em } form p.buttons { margin-top:10px;padding:2px 0 } .submit input { width:100px;font-size:1em;height:15px;cursor:pointer } .submit input, .submit input:focus, .button, .button:focus { background:url(../images/btn_submit.gif) no-repeat left top transparent;border:0;color:#fff;margin:.1em;padding:0 .3em .1em } .submit input:hover, .button:hover { background-position:left bottom } #wrapper.dvd form input.text, #wrapper.dvd form input.password, #wrapper.dvd form textarea, #wrapper.dvd form select { width:195px } #wrapper.dvd form div.legend { width:300px } #wrapper.dvd div.gc_content { padding:10px 5px }