/* hipp.de - structure.css Table of Contents Global Reset Body Wrapper Structure & Shadow Box Grids Header Header Main Navigation Header Sub Navigation Box Header Styles Product Navigation Forms MISC COLOR Matrix --------------------------- always left to right - representing sprite colors: lightcyan | cyan | magenta | orangered | purple | midnightblue | green CSS Template for Color Matrix: -------------------------- body.lightcyan { background-position: 0 0; } body.lightcyan { background-position: 0 0; } body.cyan { background-position: 0 0; } body.cyan { background-position: 0 0; } body.magenta { background-position: 0 0; } body.magenta { background-position: 0 0; } body.orangered { background-position: 0 0; } body.orangered { background-position: 0 0; } body.purple { background-position: 0 0; } body.purple { background-position: 0 0; } body.midnightblue { background-position: 0 0; } body.midnightblue { background-position: 0 0; } body.green { background-position: 0 0; } body.green { background-position: 0 0; } */ /* Global Reset */ /**********************************************************/ html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, em, img, small, strike, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } ul, ol {list-style: none} ul.pagination {clear: both; padding-bottom:30px; } h1 { font-weight:normal; } /* Body */ /**********************************************************/ body { font-family:Verdana,Helvetica,Arial,sans-serif; font-size:11px; color:#444; background: #9EC278 url(../images/bg_body.png) 0 0 repeat-x; margin-top:25px; } /* Wrapper Structure & Shadow Box */ /**********************************************************/ .hWrapper { background:transparent url(../images/bg_htop_shadow.png) no-repeat scroll 0 0; height:auto !important; margin:0 auto; min-height:638px; position:relative; width:972px; } .hContainer { background:transparent url(../images/bg_container_shadow10000.png) no-repeat scroll 0 0; padding:26px 6px 16px 26px; height:auto !important; min-height:638px; position:relative; width:940px; } .hBottom { width: 972px; height:50px; background: transparent url(../images/bg_hbottom_shadow.png) 0 0 no-repeat; } /* Grids */ /**********************************************************/ div.testview { background-color:black!important; color:#fff; min-height:50px; } /* debug */ div.g1, div.gPanel, div.gContentFull, div.gContentHalf, /* @@@@@@@@@@@@ 30.06.2009 !!!!!! */ div.gRail { float:left; display:inline; position:relative; margin:0 20px 15px 0; } div.g1 { width:920px; } div.gPanel, div.gPanel .gRail { width:220px; } div.gContentFull { width:680px; /*padding-bottom:30px;*/ } div.gContentHalf { width:490px; /*padding-bottom:30px;*/ } div.gRail { width:170px; } div .gPanel div.csc-textpic-clear { margin-bottom:20px; } /* div.gContentFull { min-height: 300px; height: auto !important; height: 300px; margin:0; } */ /* Meta Area above Header - LoginField and SearchField */ /**********************************************************/ div.metaRow { position: absolute; top:-15px; left:265px; width:701px; height:20px; } div.metaRow, div.metaRow a { color:#707070; font-size:9px; } div.metaRow em { font-style:normal; font-weight:bold; padding-right:10px; } div.metaRow div.loginField { position:relative; float:left; display:inline; padding-right:13px; height:20px; } div.metaRow div.searchField { float:right; } div.metaRow div.loginField a { background:transparent url(../images/arrow.gif) no-repeat scroll 0 0; color: #707070 !important; background-position: 0 3px; text-decoration: none; } div.metaRow div.loginField em a{ background:none} div.metaRow div.searchField form {position:relative; top:-3px;} div.metaRow div.loginField a.register { text-decoration:none; font-weight:normal; padding-right:10px;} div.metaRow div.loginField a.login { text-decoration:none; font-weight:normal; } div.metaRow div.loginField a:hover { text-decoration:underline; } /* Header */ /**********************************************************/ div#header div.gPanel, div#header div.gContentFull { height:87px; margin:0 20px 0 0; float:left; overflow:hidden; } div#header a.logo { width:220px; display:block; text-align:center; text-decoration:none; } div#header a.logo img { margin:0 auto; } div#header a.logo span { display:block; color:#0d2e6b; font-size:11px; margin-top:10px; } /* Header Main Navigation */ /**********************************************************/ div#header div.gContentFull ul.mainNav li { float:left; position:relative; display:inline; padding:0px 4px 10px 0px; } div#header div.gContentFull ul.mainNav li.last { padding:0 0 10px 0px; } /* Typo3 TS Notiz: Daran denken: ATagParams = class="first" |*| class="in_between" |*| class="last" Funktions Darstellung Notiz: Die Header Navigation ist nur auf der Startseite bei 100% Nach wählen des Bereichs ist nur noch der gewählte Bereich 100% und die anderen Buttons haben 50% (hover status) und der mouseover von den inactiven 50% ist dann 100% Prozent */ div#header ul.mainNav li a { display:block; float:left; display:inline; font-size:1.07em; text-decoration:none; font-weight:bold; color:#fff; height:30px; margin:0; padding:0 14px 0 0; cursor:pointer; position:relative; background:transparent url(../images/nav_sprite_header_neu.png) no-repeat scroll right 0; } div#header ul.mainNav li a span { padding: 8px 0 8px 13px; line-height: 14px; display: block; white-space: nowrap; background:transparent url(../images/nav_sprite_header_neu.png) no-repeat left 0; } /* Color Matrix */ div#header ul.mainNav li.lightcyan a { background-position: right -535px; } div#header ul.mainNav li.lightcyan a span { background-position: left -535px; } div#header ul.mainNav li.lightcyan a:hover, body.startpage div#header ul.mainNav li.lightcyan a:hover { background-position: right -268px; } div#header ul.mainNav li.lightcyan a:hover span, body.startpage div#header ul.mainNav li.lightcyan a:hover span { background-position: left -268px; } div#header ul.mainNav li.lightcyan a.navOn, body.startpage div#header ul.mainNav li.lightcyan a { background-position: right 0; } div#header ul.mainNav li.lightcyan a.navOn span, body.startpage div#header ul.mainNav li.lightcyan a span { background-position: left 0; } div#header ul.mainNav li.cyan a { background-position: right -535px; } div#header ul.mainNav li.cyan a span { background-position: left -535px; } div#header ul.mainNav li.cyan a:hover, body.startpage div#header ul.mainNav li.cyan a:hover { background-position: right -299px; } div#header ul.mainNav li.cyan a:hover span, body.startpage div#header ul.mainNav li.cyan a:hover span { background-position: left -299px; } div#header ul.mainNav li.cyan a.navOn, body.startpage div#header ul.mainNav li.cyan a { background-position: right -31px; } div#header ul.mainNav li.cyan a.navOn span, body.startpage div#header ul.mainNav li.cyan a span { background-position: left -31px; } div#header ul.mainNav li.magenta a { background-position: right -535px; } div#header ul.mainNav li.magenta a span { background-position: left -535px; } div#header ul.mainNav li.magenta a:hover, body.startpage div#header ul.mainNav li.magenta a:hover { background-position: right -330px; } div#header ul.mainNav li.magenta a:hover span, body.startpage div#header ul.mainNav li.magenta a:hover span { background-position: left -330px; } div#header ul.mainNav li.magenta a.navOn, body.startpage div#header ul.mainNav li.magenta a { background-position: right -62px; } div#header ul.mainNav li.magenta a.navOn span, body.startpage div#header ul.mainNav li.magenta a span { background-position: left -62px; } div#header ul.mainNav li.orangered a { background-position: right -535px; } div#header ul.mainNav li.orangered a span { background-position: left -535px; } div#header ul.mainNav li.orangered a:hover, body.startpage div#header ul.mainNav li.orangered a:hover { background-position: right -361px; } div#header ul.mainNav li.orangered a:hover span, body.startpage div#header ul.mainNav li.orangered a:hover span { background-position: left -361px; } div#header ul.mainNav li.orangered a.navOn, body.startpage div#header ul.mainNav li.orangered a { background-position: right -93px; } div#header ul.mainNav li.orangered a.navOn span, body.startpage div#header ul.mainNav li.orangered a span { background-position: left -93px; } div#header ul.mainNav li.purple a { background-position: right -535px; } div#header ul.mainNav li.purple a span { background-position: left -535px; } div#header ul.mainNav li.purple a:hover, body.startpage div#header ul.mainNav li.purple a:hover { background-position: right -392px; } div#header ul.mainNav li.purple a:hover span, body.startpage div#header ul.mainNav li.purple a:hover span { background-position: left -392px; } div#header ul.mainNav li.purple a.navOn, body.startpage div#header ul.mainNav li.purple a { background-position: right -124px; } div#header ul.mainNav li.purple a.navOn span, body.startpage div#header ul.mainNav li.purple a span { background-position: left -124px; } div#header ul.mainNav li.midnightblue a { background-position: right -535px; } div#header ul.mainNav li.midnightblue a span { background-position: left -535px; } div#header ul.mainNav li.midnightblue a:hover, body.startpage div#header ul.mainNav li.midnightblue a:hover { background-position: right -423px; } div#header ul.mainNav li.midnightblue a:hover span, body.startpage div#header ul.mainNav li.midnightblue a:hover span { background-position: left -423px; } div#header ul.mainNav li.midnightblue a.navOn, body.startpage div#header ul.mainNav li.midnightblue a { background-position: right -155px; } div#header ul.mainNav li.midnightblue a.navOn span, body.startpage div#header ul.mainNav li.midnightblue a span { background-position: left -155px; } div#header ul.mainNav li.orange a { background-position: right -535px; } div#header ul.mainNav li.orange a span { background-position: left -535px; } div#header ul.mainNav li.orange a:hover, body.startpage div#header ul.mainNav li.orange a:hover { background-position: right -485px; } div#header ul.mainNav li.orange a:hover span, body.startpage div#header ul.mainNav li.orange a:hover span { background-position: left -485px; } div#header ul.mainNav li.orange a.navOn, body.startpage div#header ul.mainNav li.orange a { background-position: right -217px; } div#header ul.mainNav li.orange a.navOn span, body.startpage div#header ul.mainNav li.orange a span { background-position: left -217px; } div#header ul.mainNav li.green a { background-position: right -535px; } div#header ul.mainNav li.green a span { background-position: left -535px; } div#header ul.mainNav li.green a:hover, body.startpage div#header ul.mainNav li.green a:hover { background-position: right -454px; } div#header ul.mainNav li.green a:hover span, body.startpage div#header ul.mainNav li.green a:hover span { background-position: left -454px; } div#header ul.mainNav li.green a.navOn, body.startpage div#header ul.mainNav li.green a { background-position: right -186px; } div#header ul.mainNav li.green a.navOn span, body.startpage div#header ul.mainNav li.green a span { background-position: left -186px; } /* Active Arrow */ div#header ul.mainNav { height:39px; padding-left:0px; padding-right:0px; width:690px; } div#header ul.mainNav li a.navOn b { background:transparent url(../images/icon_active_header-work.gif) no-repeat scroll 0 0px; color:#000000; height:5px; left:47%; position:absolute; width:8px; height:5px; } div#header ul.mainNav li.lightcyan a.navOn b { background-color:#009EE1; } /* .contenttable tr.tr-even, .contenttable tr.tr-last { background-color:#009ee0; } */ div#header ul.mainNav li.cyan a.navOn b { background-color:#59A627; } div#header ul.mainNav li.magenta a.navOn b { background-color:#E3007A; } div#header ul.mainNav li.orangered a.navOn b { background-color:#EB690B; } div#header ul.mainNav li.purple a.navOn b { background-color:#572381; } div#header ul.mainNav li.midnightblue a.navOn b { background-color:#00519E; } div#header ul.mainNav li.green a.navOn b { background-color:#009036; } div#header ul.mainNav li.orange a.navOn b { background-color:#eb690b; } /* Header Sub Navigation */ /**********************************************************/ div#header ul.submainNav { padding:8px 0 0 10px; height:30px; min-height:30px; position:relative; } div#header ul.submainNav li { float:left; display:inline; font-size:12px; } div#header ul.submainNav li a { font-size:12px; font-weight:bold; color:#524d49; text-decoration:none;} div#header ul.submainNav li a.active { } div#header ul.submainNav li.divider { margin-left:8px; margin-right:8px; color:#707070; } /* COLOR Matrix --------------------------- always left to right - representing sprite colors: lightcyan | cyan | magenta | orangered | purple | midnightblue | green */ /**********************************************************/ /* Link Colors */ /* body a.active { color:#009ee0 !important; } */ body.lightcyan a.active { color:#009ee0!important; } body.cyan a.active { color:#59a627!important; } body.magenta a.active { color:#e3007a!important; } body.orangered a.active { color:#eb690b!important; } body.purple a.active { color:#572381!important; } body.midnightblue a.active { color:#00519e!important; } body.green a.active { color:#009036!important; } body.orange a.active { color:#f2963f!important; } /* Gruppen Farben @@@@@@@@@@@@@@@@@@@@@@@@ */ /**********************************************************/ .groupColor-x a { /* color:red; */ } .groupColor-x-bg { /* background-color:red; */ } .groupColor-x ul.seal a { /* background-color:red; */ } .groupColor-x ul.sealvertical a { /* background-color:red; */ } .groupColor-y a { /* color:blue; */ } .groupColor-y-bg { /* background-color:blue; */ } .groupColor-y ul.seal a { /* background-color:blue; */ } .groupColor-y ul.sealvertical a { /* background-color:blue; */ } /* etc */ /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div a.active { color:#009ee0!important; } body.lightcyan a.active, body.lightcyan a.active2, body.lightcyan .link { color:#009ee0!important; } body.cyan a.active, body.cyan a.active2, body.cyan .link { color:#59a627!important; } body.magenta a.active, body.magenta a.active2, body.magenta.link { color:#e3007a!important; } body.orangered a.active, body.orangered a.active2, body.orangered .link2, body div.orangered a { color:#eb690b!important; } body.purple a.active, body.purple a.active2, body.purple .link { color:#572381!important; } body.midnightblue a.active, body.midnightblue a.active2, body.midnightblue .link { color:#00519e!important; } body.green a.active, body.green a.active2, body.green .link { color:#009036!important; } body.orange a.active, body.orange a.active2, body.orange .link { color:#f2963f!important; } /* Internal Link Style */ /* Color Matrix - for Arrow Icon inside of Product Navigation Rows */ .internal-link, .external-link-new-window, .teaserContent a, .filelinks a, a.mail, .crosslinklist ul li, .teaserBox .bigGradient a, .teaserBox .mediumGradient a { padding-left:5px; background: transparent url(../images/icon_sprite_productnavi_active_arrow.png) no-repeat 0 0; font-weight:bold; text-decoration:none; line-height:15px; padding-left:10px; } .teaserBox .crosslinklist ul li { display:block; background-position:0px 4px; margin-bottom:5px; } .teaserBox .crosslinklist ul li a { text-decoration:none; font-weight:normal; color:#444444; background: transparent url(../images/transparent.png) no-repeat 0 0; margin-left:0; padding-left:0; } .teaserBox .crosslinklist ul li a:hover { text-decoration:underline; overflow:hidden; } body .teaserBox a.noImage { background:none; padding:0; } /* @@@@@ Bernd !!! .internal-link, .external-link-new-window, .teaserContent h3.teaser a { */ .teaserContent h3.teaser a { background:none; padding:0; float:none; } .imageBorder { text-align:right; margin-bottom:10px; } a.internal-link:hover, a.external-link-new-window:hover {text-decoration:underline;} body.lightcyan a.internal-link,body a.internal-link, body.lightcyan a.external-link-new-window, body a.external-link-new-window,body.lightcyan .teaserContent a,body .teaserContent a, body.lightcyan .filelinks a,body .filelinks a, body.lightcyan a.mail,body a.mail, body.lightcyan ul.pagination li div a.internal-link, body.lightcyan ul.pagination li div.up2, body.lightcyan .teaserBox a { background-position: 0 3px; } body.cyan a.internal-link, body.cyan a.external-link-new-window, body.cyan .teaserContent a, body.cyan .filelinks a, body.cyan a.mail, body.cyan ul.pagination li div a.internal-link, body.cyan ul.pagination li div.up2, body.cyan .teaserBox a { background-position: 0 -97px; } body.magenta a.internal-link, body.magenta a.external-link-new-window, body.magenta .teaserContent a, body.magenta .filelinks a, body.magenta a.mail, body.magenta ul.pagination li div a.internal-link, body.magenta ul.pagination li div.up2, body.magenta .teaserBox a { background-position: 0 -197px; } body.orangered a.internal-link, body.orangered a.external-link-new-window, body.orangered .teaserContent a, body.orangered .filelinks a, body.orangered a.mail, body.orangered ul.pagination li div a.internal-link, body.orangered ul.pagination li div.up2, body.orangered .teaserBox a { background-position: 0 -297px; } body.purple a.internal-link, body.purple a.external-link-new-window, body.purple .teaserContent a, body.purple .filelinks a, body.purple a.mail, body.purple ul.pagination li div a.internal-link, body.purple ul.pagination li div.up2, body.purple .teaserBox a { background-position: 0 -397px; } body.midnightblue a.internal-link, body.midnightblue a.external-link-new-window, body.midnightblue .teaserContent a, body.midnightblue .filelinks a, body.midnightblue a.mail, body.midnightblue ul.pagination li div a.internal-link, body.midnightblue ul.pagination li div.up2, body.midnightblue .teaserBox a { background-position: 0 -497px; } body.green a.internal-link, body.green a.external-link-new-window, body.green .teaserContent a, body.green .filelinks a, body.green a.mail, body.green ul.pagination li div a.internal-link, body.green ul.pagination li div.up2, body.green .teaserBox a { background-position: 0 -597px; } body.orange a.internal-link, body.orange a.external-link-new-window, body.orange .teaserContent a, body.orange .filelinks a, body.orange a.mail, body.orange ul.pagination li div a.internal-link, body.orange ul.pagination li div.up2, body.orange .teaserBox a { background-position: 0 -697px; } /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div.lightcyan a.internal-link, body div.lightcyan .crosslinklist ul li { background-position: 0 3px; } div.cyan a.internal-link, div.cyan .crosslinklist ul li { background-position: 0 -97px; } div.magenta a.internal-link, div.magenta .crosslinklist ul li { background-position: 0 -197px; } div.orangered a.internal-link, body div.orangered div.crosslinklist ul li { background-position: 0 -297px; } div.purple a.internal-link, div.purple .crosslinklist ul li { background-position: 0 -397px; } div.midnightblue a.internal-link, div.midnightblue .crosslinklist ul li { background-position: 0 -497px; } div.green a.internal-link, div.green .crosslinklist ul li { background-position: 0 -597px; } div.orange a.internal-link, div.orange .crosslinklist ul li { background-position: 0 -697px; } /* Header Gradient Second Level Navigation */ /* Color Matrix for Gradient ie. 2 Lvl Navigation uses it */ div.colorHeaderL { /*padding-left:2px; position:relative;*/ } div.colorHeaderR { padding-right:2px; background: transparent url(../images/nav_sprite_2level.png) no-repeat; background-position: 0 -1000px; height:30px; } body.lightcyan div.colorHeaderR { background-position: 0 0; } body.cyan div.colorHeaderR { background-position: 0 -30px; } body.magenta div.colorHeaderR { background-position: 0 -60px; } body.orangered div.colorHeaderR { background-position: 0 -90px; } body.purple div.colorHeaderR { background-position: 0 -120px; } body.midnightblue div.colorHeaderR { background-position: 0 -150px; } body.green div.colorHeaderR { background-position: 0 -180px; } body.orange div.colorHeaderR { background-position: 0 -210px; } /* H2 Box Header Styles */ div.gPanel div.subHeadBig { height: 30px; padding-right:2px; background: transparent url(../images/bg_sprite_h2_box_header.png) no-repeat scroll right 0; } div.gPanel div.subHeadBig h2 { font-size:12px; font-weight:bold; height: 21px; padding:9px 0 0 10px; margin-right:2px; color:#fff; background: transparent url(../images/bg_sprite_h2_box_header.png) no-repeat scroll left 0; } div.gPanel div.subHeadBig h2 a { color:#ffffff; text-decoration:none; } /* Color Matrix for big H2 Header ie. Product Panel */ body.lightcyan div.gPanel div.subHeadBig, body.lightcyan div.gPanel { background-position: right -30px; } body.lightcyan div.gPanel div.subHeadBig h2 { background-position: 0 0; margin-right:0px; } body.cyan div.gPanel div.subHeadBig, body.cyan div.gPanel { background-position: right -90px; } body.cyan div.gPanel div.subHeadBig h2 { background-position: 0 -60px; margin-right:0px;} body.magenta div.gPanel div.subHeadBig { background-position: right -150px; } body.magenta div.gPanel div.subHeadBig h2 { background-position: 0 -120px; margin-right:0px;} body.orangered div.gPanel div.subHeadBig { background-position: right -210px; } body.orangered div.gPanel div.subHeadBig h2 { background-position: 0 -180px; margin-right:0px;} body.purple div.gPanel div.subHeadBig { background-position: right -270px; } body.purple div.gPanel div.subHeadBig h2 { background-position: 0 -240px; margin-right:0px; } body.midnightblue div.gPanel div.subHeadBig { background-position: right -330px; } body.midnightblue div.gPanel div.subHeadBig h2 { background-position: 0 -300px; margin-right:0px; } body.green div.gPanel div.subHeadBig { background-position: right -390px; } body.green div.gPanel div.subHeadBig h2 { background-position: 0 -360px; margin-right:0px; } body.orange div.gPanel div.subHeadBig { background-position: right -450px; } body.orange div.gPanel div.subHeadBig h2 { background-position: 0 -420px; margin-right:0px; } /* H3 Box Header Styles */ div.gPanel div.subHeadSmall { } div.gPanel div.subHeadSmall h3, div.gRail div.subHeadSmall h3 { font-size:11px; font-weight:bold; padding:2px 0px 0px 10px; color:#fff!important; height:18px; min-height:18px; margin-bottom:1px; } div.gRail div.subHeadSmall h3 { background: transparent url(../images/bg_sprite_box_rechts_header2.png) no-repeat 0 0; } div.gPanel div.subHeadSmall h3 { background: transparent url(../images/bg_sprite_box_links_header.png) no-repeat 0 0; } /* div.gRail div.subHeadSmall { height:17px; min-height:17px; font-size:11px; font-weight:bold; padding:2px 0px 1px 10px; margin:0 0px 0px 0; color:#fff!important; background: transparent url(../images/bg_sprite_box_rechts_header.png) no-repeat 0 0; margin-bottom:1px; } */ div.subHeadSmall div.content { margin-bottom:10px; } /* Color Matrix for small H3 Header ie. Teaser Boxes in Right-Rail Column */ body.lightcyan div.subHeadSmall h3 { background-position: 0 0; } body.cyan div.subHeadSmall h3 { background-position: 0 -20px; } body.magenta div.subHeadSmall h3 { background-position: 0 -40px; } body.orangered div.subHeadSmall h3 { background-position: 0 -60px; } body.purple div.subHeadSmall h3 { background-position: 0 -80px; } body.midnightblue div.subHeadSmall h3 { background-position: 0 -100px; } body.green div.subHeadSmall h3 { background-position: 0 -120px; } body.orange div.subHeadSmall h3 { background-position: 0 -140px; } /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div.lightcyan div.subHeadSmall h3 { background-position: 0 0; } div.cyan div.subHeadSmall h3 { background-position: 0 -20px; } div.magenta div.subHeadSmall h3 { background-position: 0 -40px; } div.orangered div.subHeadSmall h3 { background-position: 0 -60px; } div.purple div.subHeadSmall h3 { background-position: 0 -80px; } div.midnightblue div.subHeadSmall h3 { background-position: 0 -100px; } div.green div.subHeadSmall h3 { background-position: 0 -120px; } div.orange div.subHeadSmall h3 { background-position: 0 -140px; } /* Special Teaser */ /**********************************************************/ /* */ div.subHeadImage { text-align:center; border:1px solid #fff; border-width:0 0 1px 0; padding:10px 0 10px 0; } body.lightcyan div.subHeadImage { background-color:#7fcef0; } body.cyan div.subHeadImage { background-color:#a3d188; } body.magenta div.subHeadImage { background-color:#f17fbc; } body.orangered div.subHeadImage { background-color:#f5b485; } body.purple div.subHeadImage { background-color:#ab91c0; } body.midnightblue div.subHeadImage { background-color:#7fa8ce; } body.green div.subHeadImage { background-color:#7fc79a; } body.orange div.subHeadImage { background-color:#f5b485; } /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div.lightcyan div.subHeadImage { background-color:#7fcef0; } div.cyan div.subHeadImage { background-color:#a3d188; } div.magenta div.subHeadImage { background-color:#f17fbc; } div.orangered div.subHeadImage { background-color:#f5b485; } div.purple div.subHeadImage { background-color:#ab91c0; } div.midnightblue div.subHeadImage { background-color:#7fa8ce; } div.green div.subHeadImage { background-color:#7fc79a; } div.orange div.subHeadImage { background-color:#f5b485; } /* Product Navigation */ /**********************************************************/ div.productNavi { margin-bottom:10px; } div.productNavi div.contentBorder, div.productNavi form { padding:10px; border:1px solid #d4d0c7; border-width:0 1px 1px 1px; } div.productNavi ul { position:relative; } div.productNavi ul li { position:relative; margin-bottom:1px; } div.productNavi ul li a { background: transparent url(../images/bg_sprite_navi.png) repeat-x 0 0; display:block; color:#524d49; font-weight:bold; text-decoration:none; padding:3px 15px 4px 10px; } /* Color Matrix for Product Rows in Product Navigation */ div.productNavi ul li.activ a { color:#ffffff; background: transparent url(../images/bg_sprite_navi.png) repeat-x 0 0; } div.productNavi ul li.activ ul li a:hover { text-decoration:underline; } body.lightcyan div.productNavi ul li a { background-position: 0 -40px; } body.lightcyan div.productNavi ul li.activ a { background-position: 0 0px; } body.cyan div.productNavi ul li a { background-position: 0 -120px; } body.cyan div.productNavi ul li.activ a { background-position: 0 -80px; } body.magenta div.productNavi ul li a { background-position: 0 -200px; } body.magenta div.productNavi ul li.activ a { background-position: 0 -160px; } body.orangered div.productNavi ul li a { background-position: 0 -280px; } body.orangered div.productNavi ul li.activ a { background-position: 0 -240px; } body.purple div.productNavi ul li a { background-position: 0 -360px; } body.purple div.productNavi ul li.activ a { background-position: 0 -320px; } body.midnightblue div.productNavi ul li a { background-position: 0 -440px; } body.midnightblue div.productNavi ul li.activ a { background-position: 0 -400px; } body.green div.productNavi ul li a { background-position: 0 -520px; } body.green div.productNavi ul li.activ a { background-position: 0 -480px; } body.orange div.productNavi ul li a { background-position: 0 -600px; } body.orange div.productNavi ul li.activ a { background-position: 0 -560px; } div.productNavi ul li li { border: 1px solid #e6f7fe; border-width:1px 0 0 0;} body.lightcyan div.productNavi ul li li {border-color:#ebf6fd;} body.cyan div.productNavi ul li li {border-color:#e3f0fb;} body.magenta div.productNavi ul li li {border-color:#fae2ed;} body.orangered div.productNavi ul li li {border-color:#fdeadb;} body.purple div.productNavi ul li li {border-color:#e5deed;} body.midnightblue div.productNavi ul li li {border-color:#dee3ef;} body.green div.productNavi ul li li {border-color:#e1ede1;} body.orange div.productNavi ul li li {border-color:#fef3df;} div.productNavi ul li li a { background:none; font-weight:normal; } div.productNavi ul li.activ li a { color:#524d49; background:none; font-weight:normal; } div.productNavi ul li.activ ul.menu-level2 li { /* background:url(../images/bullet-cyan.gif); */ /*margin-right: 24px;*/ } div.productNavi ul li.activ ul.menu-level3 li{ padding-left:10px; } div.productNavi ul.menu-level3 li.menu-level3-current-active a{ font-weight:bold; } /* Color Matrix - for Arrow Icon inside of Product Navigation Rows */ div.productNavi ul li li a.active, div.productNavi ul li li a.active2 { background: transparent url(../images/icon_sprite_productnavi_active_arrow.png) no-repeat 0 0; font-weight:bold; } body.lightcyan div.productNavi ul li li a.active, body.lightcyan div.productNavi ul li li a.active2 { background-position: 0 6px; } body.cyan div.productNavi ul li li a.active, body.cyan div.productNavi ul li li a.active2 { background-position: 0 -94px; } body.magenta div.productNavi ul li li a.active, body.magenta div.productNavi ul li li a.active2 { background-position: 0 -194px; } body.orangered div.productNavi ul li li a.active, body.orangered div.productNavi ul li li a.active2 { background-position: 0 -294px; } body.purple div.productNavi ul li li a.active, body.purple div.productNavi ul li li a.active2 { background-position: 0 -394px; } body.midnightblue div.productNavi ul li li a.active, body.midnightblue div.productNavi ul li li a.active2 { background-position: 0 -494px; } body.green div.productNavi ul li li a.active, body.green div.productNavi ul li li a.active2 { background-position: 0 -594px; } body.orange div.productNavi ul li li a.active, body.orange div.productNavi ul li li a.active2 { background-position: 0 -694px; } div.productNavi ul li.activ ul { display:block; } /* Color Matrix - for + Plus and - Minus Icon inside of Product Navigation Rows */ div.productNavi ul li em.ifsub { display:block; position:absolute; width:6px; height:6px; right:10px; top:7px; overflow:hidden; background: transparent url(../images/icon_sprite_productnavi_plus_minus.png) no-repeat 0 0; } div.productNavi ul li.activ em { background: transparent url(../images/icon_sprite_productnavi_plus_minus.png) no-repeat 0 -42px!important; } body.lightcyan div.productNavi ul li em { background-position: 0 0; } body.cyan div.productNavi ul li em { background-position: 0 -6px; } body.magenta div.productNavi ul li em { background-position: 0 -12px; } body.orangered div.productNavi ul li em { background-position: 0 -18px; } body.purple div.productNavi ul li em { background-position: 0 -24px; } body.midnightblue div.productNavi ul li em { background-position: 0 -30px; } body.green div.productNavi ul li em{ background-position: 0 -36px; } body.orange div.productNavi ul li em{ background-position: 0 -42px; } /* IE6/IE7 Whitespace fixes - could be easier but i dont want to use a fixed width here */ * html div.productNavi ul li { height:1%; } * html div.productNavi ul li a { display:inline-block; } * html div.productNavi ul li a { display:block; } /* Additional CSS for Dynamic Slide Effects */ .open {} div.productNavi ul.closed { display:none; } div.productNavi ul li.closed { display:none; } div.productNavi ul li .newpage img { margin-right:5px; width:23px; height:10px; } /* Teaser Box */ /**********************************************************/ div.teaserBox { /*margin-bottom:20px;*/ position:relative; overflow:hidden; margin-bottom:20px; } div.teaserBox div.content{ line-height:15px; padding:10px 10px 0 10px; margin-bottom:0px; } div.teaserBox div.content img { padding-bottom:10px; } div.teaserBox div.content div.linkSection { margin-top:5px; } div.teaserBox div.content select {width:200px; margin-bottom: 10px;} div.content select option.optlevel1 { font-weight:bold; } div.content select option.optlevel2 { padding-left:10px; } div.teaserBox div.content p { clear:both; } ul.arrow li { padding-left:10px; margin-bottom:5px; background: transparent url(../images/icon_sprite_productnavi_active_arrow.png) no-repeat 0 0; font-weight:bold; } .lightcyan ul.arrow li, .lightcyan .crosslinklist ul li { background-position: 0 3px; } .cyan ul.arrow li, .cyan .crosslinklist ul li { background-position: 0 -97px; } .magenta ul.arrow li, .magenta .crosslinklist ul li { background-position: 0 -197px; } .orangered ul.arrow li, .orangered .crosslinklist ul li { background-position: 0 -297px; } .purple ul.arrow li, .purple .crosslinklist ul li { background-position: 0 -397px; } .midnightblue ul.arrow li, .midnightblue .crosslinklist ul li { background-position: 0 -497px; } .green ul.arrow li, .green .crosslinklist ul li { background-position: 0 -597px; } .orange ul.arrow li, .orange .crosslinklist ul li { background-position: 0 -697px; } div.teaserBox ul.arrow li a {font-size:11px; color:#444; font-weight:normal;} /* Teaser Box Verlauf 120px - bigGradient */ /**********************************************************/ div.bigGradient { min-height: 120px; height: auto !important; height: 120px; background: transparent url(../images/verlauf_220X120px.png) no-repeat 0 0; } body.lightcyan div.bigGradient, body.lightcyan .teaserBox .gradientLeft, body div.lightcyan div.bigGradient { background-position: 0 0; } body.cyan div.bigGradient, body.cyan .teaserBox .gradientLeft, body div.cyan div.bigGradient { background-position: -220px 0; } body.magenta div.bigGradient, body.magenta .teaserBox .gradientLeft, body div.magenta div.bigGradient { background-position: -440px 0 } body.orangered div.bigGradient, body.orangered .teaserBox .gradientLeft, body div.orangered div.bigGradient { background-position: -660px 0; } body.purple div.bigGradient, body.purple .teaserBox .gradientLeft, body div.purple div.bigGradient { background-position: -880px 0; } body.midnightblue div.bigGradient, body.midnightblue .teaserBox .gradientLeft, body div.midnightblue div.bigGradient { background-position: -1100px 0; } body.green div.bigGradient, body.green .teaserBox .gradientLeft, body div.green div.bigGradient { background-position: -1320px 0;} body.orange div.bigGradient, body.orange .teaserBox .gradientLeft, body div.orange div.bigGradient { background-position: -1540px 0;} /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ /* div.lightcyan div.bigGradient { background-position: 0 0; } div.cyan div.bigGradient { background-position: -170px 0; } div.magenta div.bigGradient { background-position: -340px 0; } div.orangered div.bigGradient { background-position: -510px 0; } div.purple div.bigGradient { background-position: -681px 0; } div.midnightblue div.bigGradient { background-position: -851px 0; } div.green div.bigGradient { background-position: -1021px 0;} */ div.mediumGradient { min-height: 60px; height: auto !important; height: 60px; background: transparent url(../images/bg_sprite_gradient_60px.png) no-repeat 0 0; } body.lightcyan div.mediumGradient { background-position: 0 0; } body.cyan div.mediumGradient { background-position: -1020px 0; } body.magenta div.mediumGradient { background-position: -340px 0; } body.orangered div.mediumGradient { background-position: -510px 0; } body.purple div.mediumGradient { background-position: -681px 0; } body.midnightblue div.mediumGradient { background-position: -851px 0; } body.green div.mediumGradient { background-position: -1020px 0;} body.orange div.mediumGradient { background-position: -1190px 0;} /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div.lightcyan div.mediumGradient { background-position: 0 0; } div.cyan div.mediumGradient { background-position: -170px 0; } div.magenta div.mediumGradient { background-position: -340px 0; } div.orangered div.mediumGradient { background-position: -510px 0; } div.purple div.mediumGradient { background-position: -681px 0; } div.midnightblue div.mediumGradient { background-position: -851px 0; } div.green div.mediumGradient { background-position: -1020px 0;} div.orange div.mediumGradient { background-position: -1190px 0;} div.smallGradient { min-height: 30px; height: auto !important; height: 30px; background: transparent url(../images/bg_sprite_gradient_30px.png) no-repeat 0 0; } body.lightcyan div.smallGradient { background-position: 0 0; } body.cyan div.smallGradient { background-position: -170px 0; } body.magenta div.smallGradient { background-position: -340px 0; } body.orangered div.smallGradient { background-position: -510px 0; } body.purple div.smallGradient { background-position: -681px 0; } body.midnightblue div.smallGradient { background-position: -851px 0; } body.green div.smallGradient { background-position: -1020px 0;} /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ div.lightcyan div.smallGradient { background-position: 0 0; } div.cyan div.smallGradient { background-position: -170px 0; } div.magenta div.smallGradient { background-position: -340px 0; } div.orangered div.smallGradient { background-position: -510px 0; } div.purple div.smallGradient { background-position: -681px 0; } div.midnightblue div.smallGradient { background-position: -851px 0; } div.green div.smallGradient { background-position: -1020px 0; } /* * TeaserBox Gradient links */ .teaserBox .gradientLeft h1 { } .teaserBox .gradientLeft { background:transparent url(../images/bg_sprite_gradient_40px.png) no-repeat scroll 0 0; height:auto !important; margin-bottom:10px; width:auto !important; } /* * TeaserBox BabyClub */ .teaserBoxBabyClub { border-color:#D4D0C7; border-style:solid; border-width:1px; padding:10px; } /* Forms */ /**********************************************************/ form {} fieldset {} label {} input {} input.text { border:1px solid #ccc; } /* Searchfield GPANEL */ /**********************************************************/ div.gPanel form { /* padding:10px 0 10px 10px; */ } div.gPanel form.searchField input.text { width:164px; } div.gPanel form button { border:none; cursor:pointer; width:28px; height:20px; text-indent:-9000em; } div.gPanel form button { background: transparent url(../images/bg_sprite_button_searchfield.png) no-repeat 0 0; } div.gPanel form button:hover { background: transparent url(../images/bg_sprite_button_searchfield.png) no-repeat 0 0; } /* Color Matrix for Search Button */ body.lightcyan div.gPanel form button { background-position: 0 0; } body.lightcyan div.gPanel form button:hover { background-position: 0 -20px; } body.cyan div.gPanel form button { background-position: 0 -40px; } body.cyan div.gPanel form button:hover { background-position: 0 -60px; } body.magenta div.gPanel form button { background-position: 0 -100px; } body.magenta div.gPanel form button:hover { background-position: 0 -80px; } body.orangered div.gPanel form button { background-position: 0 -140px; } body.orangered div.gPanel form button:hover { background-position: 0 -120px; } body.purple div.gPanel form button { background-position: 0 -180px; } body.purple div.gPanel form button:hover { background-position: 0 -160px; } body.midnightblue div.gPanel form button { background-position: 0 -220px; } body.midnightblue div.gPanel form button:hover { background-position: 0 -200px; } body.green div.gPanel form button { background-position: 0 -260px; } body.green div.gPanel form button:hover { background-position: 0 -240px; } div.gPanel form.searchField a { display:block; margin-top:4px; color:#444; text-decoration:none; } /* Searchfield META ROW */ /**********************************************************/ div.metaRow div.searchField fieldset input { color:#707070; font-size:10px; padding:3px 1px 0 4px; width:160px; } div.metaRow div.searchField fieldset button { font-size:10px; border:none; cursor:pointer; width:16px; height:16px; text-indent:-9000em; } body.lightcyan div.metaRow div.searchField fieldset button { background-position: 0 0; } body.lightcyan div.metaRow div.searchField fieldset button:hover { background-position: 0 -20px; } body.cyan div.metaRow div.searchField fieldset button { background-position: 0 -40px; } body.cyan div.metaRow div.searchField fieldset button:hover { background-position: 0 -60px; } body.magenta div.metaRow div.searchField fieldset button { background-position: 0 -100px; } body.magenta div.metaRow div.searchField fieldset button:hover { background-position: 0 -80px; } body.orangered div.metaRow div.searchField fieldset button { background-position: 0 -140px; } body.orangered div.metaRow div.searchField fieldset button:hover { background-position: 0 -120px; } body.purple div.metaRow div.searchField fieldset button { background-position: 0 -180px; } body.purple div.metaRow div.searchField fieldset button:hover { background-position: 0 -160px; } body.midnightblue div.metaRow div.searchField fieldset button { background-position: 0 -220px; } body.midnightblue div.metaRow div.searchField fieldset button:hover { background-position: 0 -200px; } body.green div.metaRow div.searchField fieldset button { background-position: 0 -260px; } body.green div.metaRow div.searchField fieldset button:hover { background-position: 0 -240px; } div.metaRow div.searchField fieldset button { background: transparent url(../images/bg_sprite_smallbutton_searchfield.png) no-repeat 0 0; } div.metaRow div.searchField fieldset button:hover { background: transparent url(../images/bg_sprite_smallbutton_searchfield.png) no-repeat 0 0; } /* Color Matrix for Search Button */ body.lightcyan div.metaRow div.searchField fieldset button { background-position: 0 0; } body.lightcyan div.metaRow div.searchField fieldset button:hover { background-position: 0 -16px; } body.cyan div.metaRow div.searchField fieldset button { background-position: 0 -32px; } body.cyan div.metaRow div.searchField fieldset button:hover { background-position: 0 -48px; } body.magenta div.metaRow div.searchField fieldset button { background-position: 0 -64px; } body.magenta div.metaRow div.searchField fieldset button:hover { background-position: 0 -80px; } body.orangered div.metaRow div.searchField fieldset button { background-position: 0 -96px; } body.orangered div.metaRow div.searchField fieldset button:hover { background-position: 0 -112px; } body.purple div.metaRow div.searchField fieldset button { background-position: 0 -128px; } body.purple div.metaRow div.searchField fieldset button:hover { background-position: 0 -144px; } body.midnightblue div.metaRow div.searchField fieldset button { background-position: 0 -160px; } body.midnightblue div.metaRow div.searchField fieldset button:hover { background-position: 0 -176px; } body.green div.metaRow div.searchField fieldset button { background-position: 0 -192px; } body.green div.metaRow div.searchField fieldset button:hover { background-position: 0 -208px; } /* Content Styles */ /**********************************************************/ div.headerImage {margin-bottom:20px;} h1 { font-size:18px; margin-bottom:15px; line-height:22px; } h3 { font-size:12px; margin-bottom:6px; line-height:16px; font-weight:bold; } h4 { font-size:11px; margin-bottom:10px; line-height:15px; font-weight:bold; color:#444;} /* Headline Color Matrix */ /**********************************************************/ /* Link Colors */ body h1, body.lightcyan h1, body h3, body.lightcyan h3, div h1, div.lightcyan h1, div h3, div.lightcyan h3, body a.internal-link, body.lightcyan a.internal-link, body a.external-link-new-window, body.lightcyan a.external-link-new-window, body .content .bodytext a, body.lightcyan .content .bodytext a, body .teaserArea .teaserContent a, body.lightcyan .teaserArea .teaserContent a, body .filelinks a, body.lightcyan .filelinks a, body a.mail body.lightcyan a.mail, body.lightcyan .teaserBox a, body.lightcyan .areaColor, span.lightcyanColor a, body.lightcyan ul.productGroupContainer div.product h2 a, body .lightcyan div.linkSection a.internal-link { color:#009ee0; } body.cyan h1, body.cyan h3, div.cyan h1, div.cyan h3, body.cyan a.internal-link, body.cyan a.external-link-new-window, body.cyan .content .bodytext a, body.cyan .filelinks a, body.cyan a.mail, body.cyan .teaserArea .teaserContent a, body.cyan .teaserBox a, body.cyan .areaColor, span.cyanColor a, body.cyan ul.productGroupContainer div.product h2 a, body .cyan div.linkSection a.internal-link { color:#59a627; } body.magenta h1, body.magenta h3, div.magenta h1, div.magenta h3, body.magenta a.internal-link, body.magenta a.external-link-new-window, body.magenta .content .bodytext a, body.magenta .filelinks a, body.magenta a.mail, body.magenta .teaserArea .teaserContent a, body.magenta .teaserBox a, body.magenta .areaColor, span.magentaColor a, body.magenta ul.productGroupContainer div.product h2 a, body .magenta div.linkSection a.internal-link { color:#e3007a; } body.orangered h1, body.orangered h3, div.orangered h1, div.orangered h3, body.orangered a.internal-link, body.orangered a.external-link-new-window, body.orangered .content .bodytext a, body.orangered .filelinks a, body.orangered a.mail, body.orangered .teaserArea .teaserContent a, body.orangered .teaserBox a, body.orangered .areaColor, span.orangeredColor a, body.orangered ul.productGroupContainer div.product h2 a, body .orangered div.linkSection a.internal-link { color:#eb690b; } body.purple h1, body.purple h3, div.purple h1, div.purple h3, body.purple a.internal-link, body.purple a.external-link-new-window, body.purple .content .bodytext a, body.purple .filelinks a, body.purple a.mail, body.purple .teaserArea .teaserContent a, body.purple .teaserBox a, body.purple .areaColor, body.purple .areaColor, span.purpleColor a, body.purple ul.productGroupContainer div.product h2 a, body .purple div.linkSection a.internal-link { color:#572381; } body.midnightblue h1, body.midnightblue h3, div.midnightblue h1, div.midnightblue h3, body.midnightblue a.internal-link, body.midnightblue a.external-link-new-window, body.midnightblue .content .bodytext a, body.midnightblue .filelinks a, body.midnightblue a.mail, body.midnightblue .teaserArea .teaserContent a, body.midnightblue .teaserBox a, body.midnightblue .areaColor, span.midnightblueColor a, body.midnightblue ul.productGroupContainer div.product h2 a, body .midnightblue div.linkSection a.internal-link { color:#00519e; } body.green h1, body.green h3, div.green h1, div.green h3, body.green a.internal-link, body.green a.external-link-new-window, body.green .content .bodytext a, body.green .filelinks a, body.green a.mail, body.green .teaserArea .teaserContent a, body.green .teaserBox a, body.green .areaColor, span.greenColor a, body.green ul.productGroupContainer div.product h2 a, body .green div.linkSection a.internal-link { color:#009036; } body.orange h1, body.orange h3, div.orange h1, div.orange h3, body.orange a.internal-link, body.orange a.external-link-new-window, body.orange .content .bodytext a, body.orange .filelinks a, body.orange a.mail, body.orange .teaserArea .teaserContent a, body.orange .teaserBox a, body.orange .areaColor, span.orangeredColor a, body.orange ul.productGroupContainer div.product h2 a, body .orange div.linkSection a.internal-link { color:#eb690b; } /* div version basicly the same but we need this for a higher css specifity if we want to declare a box to be a special color territory */ .content .bodytext a.active {color:red!important} /* Teaser Area Styles */ /**********************************************************/ div.tx-jppageteaser-pi1 {float: left;} div.teaserArea ul { } div.teaserArea ul li { margin-bottom:20px; clear:both; overflow:hidden; } div.teaserArea a.teaserImgLink, div.teaserArea ul a {display:block; float:left; display:inline;} div.teaserArea a.teaserImgLink img {display:block;} div.teaserArea div.teaserContent { float:left; display:inline; padding-left:20px; width:300px; line-height:15px; } div.teaserArea div.teaserContent a:hover { text-decoration:underline; } div.teaserArea div.teaserContent p { line-height:15px; } /* Text Content */ /**********************************************************/ div.content { margin-bottom:20px; clear:both; } /* div.content p { margin-bottom:10px; line-height:15px; } */ /* div.textContent { margin-bottom:10px; clear:both; } */ /* div.textContent { margin-bottom:30px; line-height:15px; } @@@@@@@@@ */ div.textContent { /*margin-bottom:30px;*/ line-height:15px; } div.textContent p { margin-bottom:10px; } /* div.textContent div.csc-textpic { margin-bottom:20px; clear:both; }*/ /* Product Group */ /**********************************************************/ ul.productGroupContainer {} ul.productGroupContainer .productColumn { background: transparent url(../images/line_productgroup_bottom.gif) no-repeat 0 bottom; overflow:hidden; padding-bottom:10px; } ul.productGroupContainer .last {background:none;} ul.productGroupContainer .cellColum { background: transparent url(../images/line_productgroup_middle.gif) repeat-y 0 0; } ul.productGroupContainer .cellColum { position:relative; width:490px; min-height: 185px; height: auto !important; height: 185px; margin-top:10px; /*overflow:hidden;*/ } ul.productGroupContainer .first-cell { float:left; width:235px; margin:0 10px 0 0; padding:10px 0 10px 0; text-align:center; } ul.productGroupContainer .second-cell { float:left; width:235px; margin:0 0 0 10px; padding:10px 0 10px 0; text-align:center; } /* Color Matrix for Product Info Headline */ /* body.lightcyan li div.productInfo h3 { background-position: 0 0; } body.cyan li div.productInfo h3 { background-position: 0 -32px; } body.magenta li div.productInfo h3 { background-position: 0 -64px; } body.orangered li div.productInfo h3 { background-position: 0 -96px; } body.purple li div.productInfo h3 { background-position: 0 -128px; } body.midnightblue li div.productInfo h3 { background-position: 0 -160px; } body.green li div.productInfo h3 { background-position: 0 -192px; } */ ul.productGroupContainer div.product img { margin-bottom:8px; } ul.productGroupContainer div.product h2 { font-size:14px; font-weight:bold; margin-bottom:6px; } ul.productGroupContainer div.product h2 a { font-size:14px; font-weight:bold; text-decoration:none; } ul.productGroupContainer div.product h2 a:hover { text-decoration:underline; } ul.productGroupContainer div.product p { font-size:11px; line-height:15px; display:block; } ul.productGroupContainer div.product div.productInfo { overflow:hidden; } * html ul.productGroupContainer div.product div.productInfo { height:1%; } /* ie6 */ ul.productGroupContainer div.product ul.seal { float:right; } ul.productGroupContainer div.product ul.seal img { margin:0; } ul.productGroupContainer div.product ul.seal li { margin-bottom:1px; } ul.productGroupContainer div.product ul.seal a ul.productGroupContainer div.product ul.seal a { display:block; height:32px; width:40px; } ul.floatLeft div.product ul.seal li { margin:1px; float:right; display:inline; } /* Product Container */ /**********************************************************/ ul.productContainer li h3 { color:#444444; } ul.productContainer div.productTop { display:inline; float:left; } ul.productContainer div.productVisual { width:200px; display:inline; float:left; margin-right:10px; } ul.productContainer div.productVisual .smallimage { } ul.productContainer div.productVisual .smallimage img { clear:left; /* border:1px solid #eee; */ } ul.productContainer div.productVisual a.image { /* display:block; float:left; clear:left; border:1px solid #eee; text-align:center; margin-bottom:4px; */ } ul.productContainer div.productVisual div.addInfo { clear:both; overflow:hidden; padding-top:4px; } ul.productContainer div.productVisual div.addInfo ul.preview { position:relative; display:block; font-size:10px; font-style:normal; } ul.productContainer div.productVisual div.addInfo ul.preview li { text-decoration:none; } ul.productContainer div.productVisual div.addInfo ul.preview li a { color:#707070; text-decoration:none; } ul.productContainer div.productVisual ul.seal { float:right; } ul.productContainer div.productVisual ul.seal img { margin:0; } ul.productContainer div.productVisual ul.seal li { margin-bottom:1px; margin-right:1px; } ul.productContainer div.productVisual ul.seal a { display:block; height:32px; width:40px; } div.product ul.seal a { display:block; height:32px; width:40px; } ul.productContainer ul.sealvertical { float:right; } ul.productContainer ul.sealvertical img { margin:0; } ul.productContainer ul.sealvertical li { margin:1px; float:left; } ul.productContainer ul.sealvertical a { display:block; height:32px; width:40px; } ul.productContainer { padding-bottom:30px; } ul.productContainer div.productVisual div.bigimage { display:none; } ul.productContainer div.productInfo { float:left; display:inline; width:276px; padding-left:1px; } ul.productContainer div.productHeader { display:inline; width:280px; } ul.productContainer li ul.csc-bulletlist { padding-left:10px; padding-top:10px; } ul.productContainer li ul.csc-bulletlist li { padding-left:20px; background-position: 5px 6px; } ul.productContainer li ul.csc-bulletlist li.omega3 { background:transparent url(../images/icon_omega3.gif) no-repeat scroll 2px 0px !important; } ul.productContainer li .allergenarm { background:transparent url(../images/icon_allergenarm.gif) no-repeat scroll 2px 2px !important; } ul.productContainer li .bio { background:transparent url(../images/icon_bio.gif) no-repeat scroll 1px 2px !important; } ul.productContainer li ul.morelinks { padding-left:16px; padding-top:20px; } ul.productContainer li ul.morelinks li { padding-bottom:10px; } /* !!!!!!!!!!!! TODO !!!!!!!!!! */ /* body.lightcyan ul.productContainer div.productInfo h3 {background-position: -922px -0px;} body.cyan ul.productContainer div.productInfo h3 {background-position: -920px 0px;} body.magenta ul.productContainer div.productInfo h3 {background-position: -1840px 0px;} body.orangered ul.productContainer div.productInfo h3 {background-position: -2760px 0px;} body.purple ul.productContainer div.productInfo h3 {background-position: -3680px 0px;} body.midnightblue ul.productContainer div.productInfo h3 {background-position: -3680px 0px;} body.green ul.productContainer div.productInfo h3 {background-position: -5520px 0px;} */ /* Round Corners */ .round { display:block; } .round1 { /* background:#9F0000 none repeat scroll 0 0; border-left:1px solid #870000; border-right:1px solid #870000; */ margin-left:3px; margin-right:3px; padding-left:1px; padding-right:1px; } .round2 { margin-left:1px; margin-right:1px; padding-left:1px; padding-right:1px; } .round3 { margin-left:1px; margin-right:1px; } .round4 { } .round5 { } .round * { display:block; font-size:0.01em; height:1px; overflow:hidden; } ul.productContainer div.productInfo h3 { margin-bottom:0px; padding-top:4px; min-height: 32px; height: auto !important; height: 32px; padding-left:10px; vertical-align:text-bottom; } ul.productContainer div.productInfo h3 div { padding-top: 10px; color: #444444; background-image: url(../images/product-header-background.gif); height:22px; } ul.productContainer div.productInfo h3 a { text-decoration:none; color:#642; } /* Footer */ /**********************************************************/ div#footer { font-weight: normal; clear:both; font-size:10px; text-align:center; margin-right:20px; padding-top:15px; border-top: 1px #cccccc solid; } div#footer ul li { width:auto; margin:0 auto; display:inline; list-style-type: none; padding:0 2px 0 2px; color:#707070; } * html div#footer ul li { padding:0 1px 0 2px; } /* ie6 */ div#footer ul li { /* background:transparent url(../images/icon_list_pipe.gif) no-repeat right 2px; */ } div#footer ul li a { padding-right:2px; font-size:10px; color:#707070; text-decoration:none; } div#footer ul li a:hover { text-decoration:underline; } div#footer ul li.first { padding-left:0; } div#footer ul li.last { padding-right:0; background:none; } div#footer ul.pageOptions { margin-bottom:15px; font-weight:bold; } div#footer ul.miscLinks { margin-bottom:5px; } /* pageOptions icons */ div#footer ul.pageOptions a { background: transparent url(../images/sprite_footer_icons.png) 0 0 no-repeat; padding-left:15px; } div#footer ul.pageOptions a.print { background-position:0 -42px; } div#footer ul.pageOptions a.tip { background-position:0 0; } div#footer ul.pageOptions a.mark { background-position:0 -89px; } div#printFooter { display:none; } /* MISC */ /**********************************************************/ div.block-closed {display:none;} a:focus { outline: none; } .fr {float:right;} .fl {float:left;} .clear {clear:both;} .block {display:block;} body h1.templateExample { margin-bottom:20px; font-size:22px; font-weight:bold; color:black!important; } .show {display:block!important;} .hide {display:none!important; } .clearfix:after { content: " "; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; font-size:0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } .breadcrumb { font-size:12px; font-weight:bold; margin-bottom:20px; } .breadcrumb a { padding-right: 16px; } /******************************************************* * Spezielle TYPO3 Content Elemente * ******************************************************* lightcyan | cyan | magenta | orangered | purple | midnightblue | green */ ul.csc-bulletlist li, .csc-textpic-text ul li /*.babyclub ul li*/ { position:relative; overflow:hidden; padding-left:10px; line-height:15px; padding-bottom:4px; } body.lightcyan ul.csc-bulletlist li, body.lightcyan .csc-textpic-text ul li { background: url(../images/bullet-lightcyan.gif) no-repeat; background-position: 0px 4px; } body.cyan ul.csc-bulletlist li, body.cyan .csc-textpic-text ul li { background: url(../images/bullet-cyan.gif) no-repeat; background-position: 0px 4px; } body.magenta ul.csc-bulletlist li, body.magenta .csc-textpic-text ul li { background: url(../images/bullet-magenta.gif) no-repeat; background-position: 0px 4px; } body.orangered ul.csc-bulletlist li, body.orangered .csc-textpic-text ul li { background: url(../images/bullet-orangered.gif) no-repeat; background-position: 0px 4px; } body.purple ul.csc-bulletlist li, body.purple .csc-textpic-text ul li /* body.purple .babyclub ul li */ { background: url(../images/bullet-purple.gif) no-repeat; background-position: 0px 4px; } body.midnightblue ul.csc-bulletlist li, body.midnightblue .csc-textpic-text ul li { background: url(../images/bullet-midnightblue.gif) no-repeat; background-position: 0px 4px; } body.green ul.csc-bulletlist li, body.green .csc-textpic-text ul li { background: url(../images/bullet-green.gif) no-repeat; background-position: 0px 4px; } body.orange ul.csc-bulletlist li, body.orange .csc-textpic-text ul li { background: url(../images/bullet-orange.gif) no-repeat; background-position: 0px 4px; } /* * Tabellen */ body.lightcyan table.contenttable-2 tr.tr-even,body.lightcyan table.contenttable-2 caption { background-color:#ebf6fd; } body.cyan table.contenttable-2 tr.tr-even,body.cyan table.contenttable-2 caption { background-color:#e6f2df; } body.magenta table.contenttable-2 tr.tr-even,body.magenta table.contenttable-2 caption { background-color:#fae2ed; } body.orangered table.contenttable-2 tr.tr-even,body.orangered table.contenttable-2 caption { background-color:#fdeabd; } body.purple table.contenttable-2 tr.tr-even,body.purple table.contenttable-2 caption { background-color:#e5deed; } body.midnightblue table.contenttable-2 tr.tr-even,body.midnightblue table.contenttable-2 caption { background-color:#dee3ef; } body.green table.contenttable-2 tr.tr-even,body.green table.contenttable-2 caption { background-color:#e1ede1; } /* Gitternetz Tabelle */ body.orangered table.contenttable-1 tr td { /*border: */ } /* Zebra Tabelle */ table.contenttable{ width: 490px; border-collapse:collapse; } table.contenttable caption { caption-side: top; text-align: left; font-size: 14px; font-weight: bold; padding:4px; padding-bottom:6px; } table.contenttable-2 caption { border-bottom: 1px solid #fff; /* background: url(../images/table_top.gif) no-repeat top left; */ } .contenttable tr.tr-0 { margin: 0 0 20px 20px; padding: 0; } table.contenttable-1 tr td { border: 1px solid #D4D0C7; } table.contenttable-2 tr.tr-last { margin: 0 0 20px 20px; padding: 0; /* background: url(../images/table_bottom.gif) no-repeat bottom left; */ /* background-image: url(../images/table_bottom.gif) no-repeat; */ } table.contenttable tr.tr-0 td { padding-top:4px; padding-bottom:4px; padding-left:8px; padding-right:4px; } table.contenttable tr.tr-0 td.td-0 { background-image: url(../images/table_top.gif); background-repeat: no-repeat; background-position: left top; } table.contenttable tr.tr-0 td.td-last { background-image: url(../images/table_top.gif); background-repeat: no-repeat; background-position: right top; } table.contenttable tr td { font-size:11px; /*line-height:15px;*/ min-height:8px; padding: 4px; padding-top:8px; padding-bottom:8px; padding-left:10px; padding-right:10px; } /* Tabelle Formulare */ table.formular { border-collapse:separate; /*border-spacing:2px;*/ /*margin:4px;*/ /* width: 430px; */ } table.formular tr td { border: 1px solid transparent; /*padding:4px;*/ } table.formular input { border:1px solid #cccccc; } table.formular input[type=text], table.formular input.input_style { width:258px; } table.formular input[type=radio] { } table.formular select { width:262px; border:1px solid #cccccc; } table.formular input.middle { width:200px; } table.formular input.short { width:50px; } table.formular #kommentar, table.formular input.big, table.formular textarea.big { width:410px; } textarea, input, select{ font-family:Verdana,Helvetica,Arial,sans-serif; font-size:11px; color:#444; } table.formular tr td.caption { width:150px; } /* Handlersuche Tabelle */ table.table-merchants { margin-top: 20px; border-collapse:collapse; width: 490px; } table.table-merchants tr td { padding-left: 16px; padding-top: 4px; padding-bottom: 4px; } table.table-merchants tr.odd { background-color: #cbeffd; } table.table-merchants tr.even { background-color: #e4f7fd; } /* * CSS styled content */ .csc-textpic-caption { color:#707070; float:left; font-size:10px; font-style:normal; } .csc-textpic-caption a { color:#707070; } div.csc-textpic-center div.csc-textpic-imagewrap .csc-textpic-image { display:inline; margin-left:0px; } div.csc-textpic div.csc-textpic-imagewrap .csc-textpic-image { margin-bottom:0px; } /* Hipp Box Bereichsfarbe */ .boxcontent { padding:10px; } div.subcontent-unit-border .boxcontent a:hover { cursor:pointer; } body.startpage div.subcontent-unit-border .boxcontent { background: #ebf6fd; } body.lightcyan div.subcontent-unit-border .boxcontent { background-color:#ebf6fd; } body.cyan div.subcontent-unit-border .boxcontent { background-color:#e6f2df; } body.magenta div.subcontent-unit-border .boxcontent { background-color:#fae2ed; } body.orangered div.subcontent-unit-border .boxcontent { background-color:#fdeadb; } body.purple div.subcontent-unit-border .boxcontent { background-color:#e5deed; } body.midnightblue div.subcontent-unit-border .boxcontent { background-color:#dee3ef; } body.green div.subcontent-unit-border .boxcontent { background-color:#e1ede1; } .line1, .line2, .line3, .line4 {display:block; overflow:hidden; font-size:1px;} .line1, .line2, .line3 {height:1px;} body.startpage .line2,body.startpage .line3 { background:#ebf6fd; } body.lightcyan .line2,body.lightcyan .line3 { background:#ebf6fd; } body.cyan .line2,body.cyan .line3 { background:#e6f2df; } body.magenta .line2,body.magenta .line3 { background:#fae2ed; } body.orangered .line2,body.orangered .line3 { background:#fdeadb; } body.purple .line2,body.purple .line3 { background:#e5deed; } body.midnightblue .line2,body.midnightblue .line3 { background:#dee3ef; } body.green .line2,body.green .line3 { background:#e1ede1; } .line1 {margin:0 3px; background:#ffffff;} .line2 {margin:0 2px; border-width:0 2px 0 2px;} .line3 {margin:0 1px;} /* default styles for extension "tx_cssfilelist" */ .filelinks div { line-height:15px; /*padding-left:25px; background:url('/typo3/gfx/fileicons/default.gif') left top no-repeat;*/ margin-bottom:10px; } .filelinks .filelink { float:left; clear:both; display:block; background:none !important; background-repeat: no-repeat !important; padding-left:0px; width:490px; } .filelinks .filelink .dlimage, .filelinks .filelink .dlimage a { float:left; padding-left:0px; } .filelinks .filelink .dlimage img { /*border:1px solid #cccccc;*/ } .filelinks .filelink .dltext { background:none; float: right; width: 350px; padding-left: 0px; } .filelinks .filelink .dltext a.headerlink { /*margin-left:20px;*/ } .filelinks .filelink .dltext .form-btn { margin: 10px 0; } .filelinks .last { background-image:none !important; border-bottom:1px solid #cccccc; padding:10px 0; } .filelinks span{display:block;} .filelinks .filecount{display:block; margin-bottom:5px;} .filelinks a{font-weight:bold; text-decoration:none; } /* Icons begin */ /* .filelinks .ai{background-image:url('/typo3/gfx/fileicons/ai.gif')!important;} .filelinks .ani{background-image:url('/typo3/gfx/fileicons/ani.gif')!important;} .filelinks .au{background-image:url('/typo3/gfx/fileicons/au.gif')!important;} .filelinks .avi{background-image:url('/typo3/gfx/fileicons/avi.gif')!important;} .filelinks .bmp{background-image:url('/typo3/gfx/fileicons/bmp.gif')!important;} .filelinks .cdr{background-image:url('/typo3/gfx/fileicons/cdr.gif')!important;} .filelinks .css{background-image:url('/typo3/gfx/fileicons/css.gif')!important;} .filelinks .csv{background-image:url('/typo3/gfx/fileicons/csv.gif')!important;} .filelinks .doc{background-image:url('/typo3/gfx/fileicons/doc.gif')!important;} .filelinks .dtd{background-image:url('/typo3/gfx/fileicons/dtd.gif')!important;} .filelinks .eps{background-image:url('/typo3/gfx/fileicons/eps.gif')!important;} .filelinks .exe{background-image:url('/typo3/gfx/fileicons/exe.gif')!important;} .filelinks .fh3{background-image:url('/typo3/gfx/fileicons/fh3.gif')!important;} .filelinks .flash{background-image:url('/typo3/gfx/fileicons/flash.gif')!important;} .filelinks .folder{background-image:url('/typo3/gfx/fileicons/folder.gif')!important;} .filelinks .gif{background-image:url('/typo3/gfx/fileicons/gif.gif')!important;} .filelinks .htm{background-image:url('/typo3/gfx/fileicons/htm.gif')!important;} .filelinks .html{background-image:url('/typo3/gfx/fileicons/html.gif')!important;} .filelinks .ico{background-image:url('/typo3/gfx/fileicons/ico.gif')!important;} .filelinks .inc{background-image:url('/typo3/gfx/fileicons/inc.gif')!important;} .filelinks .java{background-image:url('/typo3/gfx/fileicons/java.gif')!important;} .filelinks .jpg{background-image:url('/typo3/gfx/fileicons/jpg.gif')!important;} .filelinks .js{background-image:url('/typo3/gfx/fileicons/js.gif')!important;} .filelinks .max{background-image:url('/typo3/gfx/fileicons/max.gif')!important;} .filelinks .mid{background-image:url('/typo3/gfx/fileicons/mid.gif')!important;} .filelinks .mov{background-image:url('/typo3/gfx/fileicons/mov.gif')!important;} .filelinks .mpeg{background-image:url('/typo3/gfx/fileicons/mpeg.gif')!important;} .filelinks .mpg{background-image:url('/typo3/gfx/fileicons/mpg.gif')!important;} .filelinks .pcd{background-image:url('/typo3/gfx/fileicons/pcd.gif')!important;} .filelinks .pcx{background-image:url('/typo3/gfx/fileicons/pcx.gif')!important;} .filelinks .pdf{background-image:url('/typo3/gfx/fileicons/pdf.gif')!important;} .filelinks .png{background-image:url('/typo3/gfx/fileicons/png.gif')!important;} .filelinks .ps{background-image:url('/typo3/gfx/fileicons/ps.gif')!important;} .filelinks .psd{background-image:url('/typo3/gfx/fileicons/psd.gif')!important;} .filelinks .rtf{background-image:url('/typo3/gfx/fileicons/rtf.gif')!important;} .filelinks .sgml{background-image:url('/typo3/gfx/fileicons/sgml.gif')!important;} .filelinks .swf{background-image:url('/typo3/gfx/fileicons/swf.gif')!important;} .filelinks .sxc{background-image:url('/typo3/gfx/fileicons/sxc.gif')!important;} .filelinks .sxw{background-image:url('/typo3/gfx/fileicons/sxw.gif')!important;} .filelinks .tga{background-image:url('/typo3/gfx/fileicons/tga.gif')!important;} .filelinks .tif{background-image:url('/typo3/gfx/fileicons/tif.gif')!important;} .filelinks .ttf{background-image:url('/typo3/gfx/fileicons/ttf.gif')!important;} .filelinks .txt{background-image:url('/typo3/gfx/fileicons/txt.gif')!important;} .filelinks .wav{background-image:url('/typo3/gfx/fileicons/wav.gif')!important;} .filelinks .wrl{background-image:url('/typo3/gfx/fileicons/wrl.gif')!important;} .filelinks .xls{background-image:url('/typo3/gfx/fileicons/xls.gif')!important;} .filelinks .xml{background-image:url('/typo3/gfx/fileicons/xml.gif')!important;} .filelinks .xsl{background-image:url('/typo3/gfx/fileicons/xsl.gif')!important;} .filelinks .zip{background-image:url('/typo3/gfx/fileicons/zip.gif')!important;} */ /* Icons end */ .filelinks a:hover{text-decoration:underline;} .filelinks .pdf .dltext { /*background:url('/typo3/gfx/fileicons/pdf.gif') 0% top no-repeat;*/ } /* * Google Maps */ /* Example Layout */ .all-examples { width: 90%; margin:0 auto; } .example { width: 70%; margin:0 auto; } .example #address, .example #point, .example #query { width: 60%; } .example .jmap { height: 300px; margin:0 auto; } #preview{ position:absolute; background:#CCC; padding:1px; display:none; color:#fff; } .error { background-color:#FCE5F2; } .regiform .error{ background-color:#f19da0; } /* Babyclub Bilder rechtsbuendig */ .babyclub img, .basic img { float:right; margin-left:10px !important; } .babyclub dl { display:inline; float:right; width:150px; } .babyclub dd { float:none; text-align:center; color:#707070; font-size:10px; } .bold {font-weight:bold; } .paddingleft {padding-left:20px;} ul.pagination li, ul.pagination li div { float:left; } ul.pagination li div.prev { width:190px; } ul.pagination li div.prev a.internal-link { background:transparent url(../images/icon_sprite_productnavi_active_arrow-left.png) no-repeat scroll 0 0; } ul.pagination li div.up a.internal-link { background:transparent url(../images/icon_sprite_productnavi_overview.png) no-repeat scroll 0 0; } ul.pagination li div.up {} ul.pagination li div.up2 { background:transparent url(../images/icon_sprite_productnavi_overview.png) no-repeat scroll 0 0; margin-left:2px; width:10px; padding-right:140px; } ul.pagination li div.next { } ul.pagination li.right { text-align:right; } /* ul.pagination .arrowup { } */ /* * Buttons */ span.form-btn, span.purple-btn, span.green-btn { float: left; display: inline; height: 20px; line-height: 20px; padding-left:4px; background-repeat: no-repeat; background: transparent url("../images/bg_sprite_button_big.png"); } span.form-btn input, span.form-btn a, span.purple-btn a, span.green-btn a { font-size:11px; font-weight:bold; color:#ffffff; height: 20px; line-height: 20px; padding: 0 6px 2px 4px; border: 0; cursor: pointer; width: auto; background-repeat: no-repeat; background-color: transparent; background: transparent url("../images/bg_sprite_button_big.png") no-repeat scroll right top; text-decoration:none; } span.form-btn a.internal-link, span.purple-btn a:hover, span.green-btn a:hover { text-decoration:none; } div.buttonright { padding-top:10px; padding-bottom:10px; float:right; } #IE6root body div.teaserBox span.form-btn { height: 1%; overflow: visible; } #IE6root body div.teaserBox span.form-btn input { height: 1%; overflow: visible; } body span.form-btn a, body span.purple-btn a, body span.form-btn a.internal-link, body span.green-btn a { line-height:20px; padding:4px 4px 3px 2px; color:#ffffff; } * html body span.form-btn a, * html body span.purple-btn a, * html body span.form-btn a.internal-link, * html body span.gree-btn a { line-height:20px; /*padding:4px 4px 3px 2px;*/ color:#ffffff; } body span.form-btn a.bigbutton { padding:4px 16px 3px 16px; } * html body span.form-btn a.bigbutton { padding:4px 30px 3px 16px; } body.lightcyan span.form-btn { background-position: 0 -0px; } body.lightcyan span.form-btn input, body.lightcyan span.form-btn a { background-position:right -0px; } body.cyan span.form-btn { background-position: 0 -20px; } body.cyan span.form-btn input, body.cyan span.form-btn a { background-position:right -20px; } body.magenta span.form-btn { background-position: 0 -40px; } body.magenta span.form-btn input, body.magenta span.form-btn a { background-position:right -40px; } body.orangered span.form-btn { background-position: 0 -60px; } body.orangered span.form-btn input, body.orangered span.form-btn a { background-position:right -60px; } body.purple span.form-btn, body span.purple-btn { background-position: 0 -80px; } body.purple span.form-btn input, body.purple span.form-btn a, body span.purple-btn a { background-position:right -80px; } body span.green-btn { background-position: 0 -20px; } body span.green-btn a { background-position:right -20px; } body.midnightblue span.form-btn { background-position: 0 -100px; } body.midnightblue span.form-btn input, body.midnightblue span.form-btn a { background-position:right -100px; } body.green span.form-btn { background-position: 0 -120px; } body.green span.form-btn input, body.green span.form-btn a { background-position:right -120px; } body.orange span.form-btn { background-position: 0 -60px; } body.orange span.form-btn input, body.orange span.form-btn a { background-position:right -60px; } /* * Tagcloud */ .teaserBox .tagcloud span a { text-decoration:none; } .teaserBox .tagcloud span a:hover { text-decoration:underline; } div.tagcloud { min-height:81px; padding-bottom:0; line-height: 18px; } div.tagcloud span { line-height:18px; } /* * IE6 Optimation */ /******************************** * BabyClub / Alte Seite *******************************/ table.table2 {border-collapse:collapse} table.table2 td {vertical-align:top} .schrift_produkte { color:#00A6EB; font-weight:bold; } .schrift_club { color:#601585; font-weight:bold; } .bg_club_20 { background-color:#DFD0EF; } strong { font-weight:bold; } .schrift_rot { color:#CC0000; font-weight:bold; } .dick { font-weight:bold; } /* user message boxes */ .message-ok, .message-error, .message-warning{ padding:12px; font-weight:bold; margin-bottom:20px; overflow:visible; position:relative; } .message-ok{ background:transparent url(../images/msgOK.gif) no-repeat scroll 8px 5px; padding-left:45px; border: 1px solid #CCCCCC; color:#009035; } .message-warning{ background:transparent url(../images/msgWarning.gif) no-repeat scroll 8px 5px; padding-left:45px; border: 1px solid #CCCCCC; color:#FDBA48; } .message-error{ background:transparent url(../images/msgNotOK_.gif) no-repeat scroll 3px 10px; padding-left:30px; border: 1px solid #CCCCCC; color:#CE0000; } table.tabledebug { border:1px solid #00c; } table.tabledebug td { border:1px solid #c00; } table.zero { border-collapse:collapse; } table.zero td { vertical-align:bottom; border:none; margin:0; padding:0; line-height:0; } table.zero td img {padding:0;margin:0;} .seiteEmpfehlen { background: url(../images/seite_empfehlen_header.gif) no-repeat; height:110px; } .clubHeader { position:relative; width:680px; height:290px; background: url(../../redakteure/startseiten/bild_header_clubhome.jpg) no-repeat; } .clubHeader .welcome { position:absolute; width:300px; height:200px; top:130px; left:35px; z-index:999; } /* Produktsuche */ .gContentHalf select#alter_id, .gContentHalf select#sortiment_id, .gContentHalf select#stuhl_id { width:250px; } a.smallheader{ font-size:11px!important; } /* * RTE * Zum Ausprobieren im Firefox Cache leeren und STRNG-F5 drücken. */ .grau { color:#707070; font-size:10px; } .weinrot { color:#CC0000; } #babyIstDa{ border:1px solid green; background-color:#D8ECCE; margin-bottom:20px; padding:10px; padding-top:30px; padding-bottom:30px; text-align:center; font-weight:bold; font-size:17px; } /* * 404 Handling */ .handle404 { background: url(../images/bild_fehlermeldung.jpg); width:920px; height:420px; text-align:center; } .produktsucheliste{ background: transparent url(../images/bg_produkt_suche.gif) repeat-x 0 0; padding:8px; margin-bottom:0px!important; padding-bottom:0px; } .produktsucheliste-found{ margin-bottom:10px; } .produktsucheliste-found a.internal-link-search{ text-decoration:none; color:#444444; } .produktsucheliste-found a.internal-link-search:hover{ text-decoration:underline; } .produktsucheliste-found a.aktiv{ font-weight:bold; color:#59A627; } /* Printversion für Sitemap */ .printversion { clear:both; background:none!important; background-color:#ffffff; /* left:0px; */ } body.printversion .hWrapper, body.printversion .hContainer { width:auto !important; height:auto !important; } body.printversion .gContentFull, body.printversion .g1 { width:auto; } #sitemap ul { } #sitemap ul ul { margin-left:10px; } #sitemap ul ul ul { margin-left:10px; } #sitemap ul li { margin-top:20px; } #sitemap ul ul li { margin-top:10px; } #sitemap ul ul ul li { margin-top:0px; } .highlightColor, a.highlightColor{ color:#CC0000!important; } .fotow-but-login{ background:url(../images/button_login.gif) no-repeat 0 0; display: inline; width:53px; height:20px; border:none; line-height:20px; } .fotow-but-upload{ background:url(../images/button_vorschau_hochladen.gif) no-repeat 0 0; width:259px; height:20px; border:none; } table.noplaces{ border-collapse:collapse; } table.noplaces td{ border:none; } /* Fottowettbewerb */ .fotowett-list-item{ width:113px; height:113px; border:1px solid #CCCCCC; text-align:center; margin-bottom:10px; } .fotowett-list-item table{ width:112px; height:112px; } .fotowett-list-item table td{ text-align:center; vertical-align:middle; width:112px; height:112px; } .fotowett-list-item-winner{ width:148px; height:148px; border:1px solid #CCCCCC; text-align:center; margin-bottom:10px; margin-top:10px; } .fotowett-list-item-winner table{ width:146px; height:140px; } .fotowett-list-item-winner table td{ text-align:center; vertical-align:middle; width:146px; height:146px; } /* TAGWOLKE */ .wolke span { line-height:19px; } .wolke-11{font-size: 11px;} .wolke-12{font-size: 12px;} .wolke-14 { font-size: 14px;} .wolke-18{font-size: 18px;} .wolke-abstand{margin-right: 5px;} .wolke span a { text-decoration:none; } .wolke span a:hover { text-decoration:underline; } /* NeuAnmeldung Babyclub @ 30.06.2010 Ozan */ .anmeldunglabels { text-align:right;padding-right:10px; height:25px; width:140px;} .anmeldungradio { border:none!important; } .anmeldungsfeld { background: #e6deec; padding: 10px; width:430px;} .anmeldungsinput { padding-left:5px; height:18px; border-top: 2px solid #a9a9a9!important;background-color:white; margin-bottom:4px;} div.invalid { position:absolute; z-index:9999; left:460px; width:200px; margin-top:-35px; padding:5px; border:1px solid #e79b9b; background:#e67f80; text-align:center; font-size:10px; background:#e67f80; } input.invalid{ background-color:#e67f80; } div.success { background:url("../images/checkedForm.gif") no-repeat scroll 0 0 transparent; padding-left:16px; left:434px; margin-top:-22px; border:none; width:20px; height:20px; } #xxwarning, #xxsummary{ border: 1px solid red; } #layerBabysanft { height: 420px; left: -275px; position: absolute; top: -70px; width: 540px; z-index: 2; } #layerMuttertag { position: absolute; width: 425px; height: 365px; left: -340px; top: -88px; z-index: 2; } #layerVatertag { position: absolute; width: 470px; height: 470px; left: -370px; top: -20px; z-index: 2; } #layerNudelsauce { position: absolute; width: 675px; height: 430px; left: -300px; top: -50px; z-index: 2; } /* * BabyClub Box (Login/Logout über linkem Menu) */ #babyClubBox { position:relative; width:220px; height:68px; background:url("../images/babyClubBox/hg_babyclub.gif") no-repeat scroll 0 0 transparent; margin-bottom: 20px; } #babyClubBox #firstBtn { position: absolute; top:50px; left:55px; } #babyClubBox #secondBtn { position: absolute; top:50px; right:10px; } hr { border:0; height:1px; color:#cccccc; background-color:#cccccc; } .textContent sup{ bottom: 5px; font-size: 11px; position: relative; }