/* ------------------------------------------------------------------------------------ * Project: www.kanadaria.de * Agency: e8media - agentur fuer digitale kommunikation | www.e8media.de * Code by: Marco Naetlitz [naetlitz@e8media.de] * Screendesign by: Stefan Weber [weber@e8media.de] * Created Jan 2008 * ------------------------------------------------------------------------------------ */ * { margin: 0; padding: 0; outline: 0; } body { background: #209cd2 url("/img/gfx/bodyRepeatBackground.jpg") repeat-x left top; font-family: Verdana, helvetica, sans-serif; font-size: 11px; line-height: 18px; color: #1a1a1a; } /* ---------------- Seiten-Struktur ------------------------------- */ img#logo { border: none; margin: 100px 0 0 20px; } /* Bildet die Wasserblase ab. Der -Hintergrund ist repeat-x, damit die Seite variabel nach x+ ist */ div#bg { position: absolute; display: block; width: 100%; background: url("/img/gfx/wasserBlase.jpg") no-repeat left top; height: 868px; z-index: 0; top: 0; left: 0; } div#spalte1 /* Wiederholung nach unten */ { position: absolute; top: 0; left: 0; width: 733px; z-index: 10; min-height: 868px; background: url('/img/gfx/spalte1Strech.jpg') repeat-y left top; } div#spalte1grafix /* Grafik überlagert repeat-Background */ { position: relative; width: 733px; min-height: 868px; background: url('/img/gfx/spalte1Static.jpg') no-repeat left top; } div#spalte1foot { position: relative; width: 733px; height: 200px; background: #209cd2 url('/img/gfx/spalte1Foot.jpg') no-repeat left top; } div#brace /* Klammer um die 2 rechten Spalten, damit nur die rechteste umbricht, wenn das Fenster zu klein ist */ { width: auto; position: absolute; left: 733px; top: 0; z-index: 10; } div#spalte2 { position: relative; z-index: 10; float: left; width: 232px; background: url('/img/gfx/spalte2Strech.jpg') repeat-y left top; } div#spalte2grafix { width: 232px; min-height: 868px; padding-top: 100px; padding-bottom: 15px; background: url('/img/gfx/spalte2Static.jpg') no-repeat left top; } div#spalte2foot { width: 232px; height: 7px; overflow: hidden; background: url('/img/gfx/spalte2Foot.jpg') no-repeat left top; } div#spalte3 { position: relative; float: left; width: 231px; z-index: 10; } div#spalte3strech { width: 231px; background: url('/img/gfx/spalte3Strech.png') repeat-y left top; } div#spalte3grafix { width: 231px; background: url('/img/gfx/spalte3Static.png') no-repeat left top; padding-bottom: 15px; } div#spalte3foot { width: 231px; height: 14px; overflow: hidden; background: url('/img/gfx/spalte3Foot.png') no-repeat left top; } /* ---------------- Header --------------------------------------- */ div#header { width: 733px; height: 272px; } /* ---------------- Bread-Crumb----------------------------------- */ div#header div.breadCrumb { position: absolute; top: 252px; left: 16px; z-index: 2; font-size: 0.9em; color: #787878; background-color: #cfe0f0; width: 710px; line-height: 240%; text-indent: 18px; } div#header div.breadCrumb a, div#header div.breadCrumb a:active, div#header div.breadCrumb a:visited, div#header div.breadCrumb a:hover, div#header div.breadCrumb a:focus { color: #787878; text-decoration: none; } /* ---------------- 3-Ebene-Navigation --------------------------- */ div#right_content ul#subnavi_1 { display: block; list-style: none; margin-top: -1px; } div#right_content ul#subnavi_1 li { display: block; border-top: 1px solid #dceded; } div#right_content ul#subnavi_1 li a, div#right_content ul#subnavi_1 li a:active, div#right_content ul#subnavi_1 li a:focus, div#right_content ul#subnavi_1 li a:visited { background: url('/img/gfx/li_bullet.gif') no-repeat left center; display: block; line-height: 20px; height: 20px; color: #0790cc; text-indent: 20px; text-decoration: none; } div#right_content ul#subnavi_1 li a:hover { text-decoration: underline; } div#right_content ul#subnavi_1 li.active a { font-weight: bold; } /* ---------------- Navigaition ---------------------------------- */ div#header div.navCont { position: absolute; width: 711px; top: 224px; left: 16px; background: url('/img/gfx/navContRepeatBackground.jpg') repeat-x left top; height: 28px; z-index: 20; } div#header div.navCont ul { margin: 0; padding: 0; list-style: none; z-index: 20; } div#header div.navCont ul li { position: relative; width: auto; margin: 0; padding: 0; float: left; z-index: 20; } div#header div.navCont ul li a, div#header div.navCont ul li a:active, div#header div.navCont ul li a:visited, div#header div.navCont ul li a:hover { color: #fff; font-size: 11px; font-weight: bold; display: block; padding: 0 10px 0 10px; border-right: 1px solid #fff; line-height: 26px; text-decoration: none; z-index: 20; } div#header div.navCont ul li a.first { text-indent: 8px; } div#header div.navCont ul li.active a, div#header div.navCont ul li.active a:active, div#header div.navCont ul li.active a:visited, div#header div.navCont ul li.active a:hover { background-color: #cbe2f6; color: #0790cc; border-bottom: 1px solid #cbe2f6; } div#header div.navCont ul li ul { margin: 0; padding: 0; list-style: none; display: block; position: absolute; display: none; visibility: hidden; } div#header div.navCont ul li:hover ul, div#header div.navCont ul li.hoverIt ul { display: block; visibility: visible; } div#header div.navCont ul li ul li { margin: 0; padding: 0; float: none; width: 160px; border-top: 1px #fff solid; display: block; height: 21px; } div#header div.navCont ul li ul.xl li { width: 180px; } div#header div.navCont ul li ul li a, div#header div.navCont ul li ul li a:active, div#header div.navCont ul li ul li a:visited, div#header div.navCont ul li.active ul li a, div#header div.navCont ul li.active ul li a:active, div#header div.navCont ul li.active ul li a:visited { border: none; font-size: 11px; margin: 0; padding-top: 0; background-color: #0790cc; display: block; font-weight: normal; line-height: 21px; height: 21px; color: #fff; } div#header div.navCont ul li ul li a:hover, div#header div.navCont ul li.active ul li a:hover { font-size: 11px; font-weight: normal; line-height: 21px; height: 21px; background-color: #cbe2f6; color: #0790cc; } div#header div.navCont ul li ul li.active a, div#header div.navCont ul li ul li.active a.active:active, div#header div.navCont ul li ul li.active a.active:visited, div#header div.navCont ul li ul li.active a.active:hover, div#header div.navCont ul li.active ul li.active a, div#header div.navCont ul li.active ul li.active a.active:active, div#header div.navCont ul li.active ul li.active a.active:visited, div#header div.navCont ul li.active ul li.active a.active:hover { border: none; background-color: #0790cc; font-weight: bold; color: #fff; } /* ---------------- video player ------------------------------- */ div#main_content div#flash_player_border { background: url("/img/bg_cltv.gif") no-repeat; padding: 59px 49px; height: 347px; width: 582px; margin: -13px 0 0 35px; }