/* Author: Leszek Krolikowski - http://lymorn.com/ Project: Noti Contract For: Szlanga - http://szlanga.com */ /* http://meyerweb.com/eric/tools/css/reset/ */ /* v1.0 | 20080212 */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {background: transparent; border: 0; margin: 0; outline: 0; padding: 0; vertical-align: baseline;} body {line-height: 1;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} /* remember to define focus styles! */ :focus {outline: 0;} /* remember to highlight inserts somehow! */ ins {text-decoration: none;} del {text-decoration: line-through;} /* tables still need 'cellspacing="0"' in the markup */ table {border-collapse: collapse; border-spacing: 0;} /* ---------- GLOBAL ----------- */ body {background: #7F7F73; font: 11px Arial, Helvativa,"Trebuchet MS", Trebuchet, Tahoma, Verdana, Geneva, sans-serif; color: #FFF;} h2, h3 ,h4 ,h5, h6 {color: #DEDEDE; font-weight: bold; text-transform: uppercase;} h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, h2 a:focus, h3 a:focus, h4 a:focus, h5 a:focus, h6 a:focus, h2 a, h3 a, h4 a, h5 a, h6 a {color: #DEDEDE; border-bottom: none;} h2, h6, .h2, /*{font-size: 1.4545em; line-height: 1.125em; padding: 0 0 1.125em;}*/ h3, .h3 {font-size: 1.2727em; line-height: 1.1428em; padding: 0 0 1.1428em;} h4, .h4 {font-size: 1.1818em; line-height: 1.2307em; padding: 1.2307em 0;} h5, .h5 {font-size: 1.0909em; line-height: 1.3333em; padding: 1.3333em 0;} p {line-height: 1.4545em; padding: 0 0 1.4545em;} a {color: #C5C7B2; text-decoration: none;} a:focus, a:hover {color: #fff;} a.more {float: right; font-weight: bold;} a.more:hover, a.more:focus {} img {vertical-align: bottom;} img.alignleft {margin: 0.27em 1.6363em 0.6363em 0;} img.alignright {margin: 0.27em 0 0.6363em 1.6363em;} img.aligncenter {clear: both; margin: 0 auto;} .alignleft {float: left !important; clear: left;} .alignright {float: right !important; clear: right;} .aligncenter {float: none; margin: auto;} ul, li {list-style: none;} .align-left {text-align: left !important;} .align-right {text-align: right !important;} .align-center {text-align: center !important;} .important {font-weight: bold !important; color: #e00000 !important;} hr, .hr {height: 0; border: 0px dotted #7F7F73; border-top: 1px dotted #C5C7B2; margin: 0 0 1.6363em; clear: both;} /* ---------- MAIN BLOCKS ---------- */ #whole {min-width: 984px;} #top_area {clear: both; padding: 0 0 0 8px; border-bottom: 2px solid #C5C7B2; height: 416px; position: relative;} #middle_area {clear: both; padding: 0 0 0 8px; overflow: hidden;} #bottom_area {clear: both; padding: 0 0 0 8px; border-top: 2px solid #C5C7B2;} /* ---------- TOP AREA ---------- */ #header {width: 232px; float: left; padding: 24px;} #header h1 {padding: 48px 0 0;} #header h1 a {display: block; width: 161px; height: 70px; background: url("../gfx/logo_noti-contract.gif") no-repeat 0 0;} #header h1 a span {display: none;} #main-navigation {width: 232px; position: absolute; bottom: 0; left: 0; padding: 24px 24px 24px 32px; border-top: 2px solid #C5C7B2;} #main-navigation ul {} #main-navigation li {display: block; list-style: none; line-height: 16px; height: 16px; float: left; clear: both;} #main-navigation a {color: #B2B2A3; font-size: 1.4545em; font-weight: bold; text-transform: uppercase; display: block; height: 14px; background: url("../gfx/bg_navigation.gif") no-repeat 0 0;} #main-navigation a span {display: none;} #main-navigation ul ul {margin: 0 0 0 1.6363em;} #main-navigation ul ul a:focus, #main-navigation ul ul a:hover {color: #fff;} #main-navigation ul ul a span {display: inline; white-space: nowrap; position: relative;} #main-navigation a:focus, #main-navigation a:hover, #main-navigation .current a:focus, #main-navigation .current a:hover {color: #fff;} #main-navigation .current a {color: #fff;} #main-navigation .current .current {background: none;} #main-navigation .current li a {color: #B2B2A3;} #main-navigation .current .current a {color: #fff;} #main-navigation .e1 a {width: 42px; background-position: 0 0;} #main-navigation .e2 a {width: 150px; background-position: 0 -16px;} #main-navigation .e3 a {width: 56px; background-position: 0 -32px;} #main-navigation .e4 a {width: 97px; background-position: 0 -48px;} #main-navigation .e5 a {width: 84px; background-position: 0 -64px;} #main-navigation .e6 a {width: 85px; background-position: 0 -80px;} #main-navigation .e7 a {width: 68px; background-position: 0 -96px;} #main-navigation .e1 a:focus, #main-navigation .e1 a:hover, #main-navigation .e1.current a {background-position: -200px 0;} #main-navigation .e2 a:focus, #main-navigation .e2 a:hover, #main-navigation .e2.current a {background-position: -200px -16px;} #main-navigation .e3 a:focus, #main-navigation .e3 a:hover, #main-navigation .e3.current a {background-position: -200px -32px;} #main-navigation .e4 a:focus, #main-navigation .e4 a:hover, #main-navigation .e4.current a {background-position: -200px -48px;} #main-navigation .e5 a:focus, #main-navigation .e5 a:hover, #main-navigation .e5.current a {background-position: -200px -64px;} #main-navigation .e6 a:focus, #main-navigation .e6 a:hover, #main-navigation .e6.current a {background-position: -200px -80px;} #main-navigation .e7 a:focus, #main-navigation .e7 a:hover, #main-navigation .e7.current a {background-position: -200px -96px;} #cover {width: 694px; height: 416px; float: left; border-left: 2px solid #C5C7B2; border-right: 0px solid #C5C7B2;} #cover img {} .slides li {display: block; position: relative; border-right: 2px solid #C5C7B2;} #flash-container {border-right: 2px solid #C5C7B2; height: 416px; overflow: hidden;} #flash-container object {vertical-align: bottom;} a.slide_nav {display: block; position: absolute; z-index: 100; top: 0; height: 48px; width: 50%; padding-top: 368px; background: url("../gfx/blank.gif") repeat 0 0;;} a.slide_nav {opacity: 0.5;} a.slide_nav:hover {opacity: 1;} a.slide_nav b {display: block; width: 48px; height: 48px;} a.slide_nav span {display: none;} .slide_prev {left: 0;} .slide_next {right: 0;} .slide_prev b {float: left; background: url("../gfx/bg_slide_prev-trans.png") no-repeat 0 100%;} .slide_next b {float: right; background: url("../gfx/bg_slide_next-trans.png") no-repeat 100% 100%;} .slide_title {position: absolute; bottom: 24px; left: 64px; right: 64px; z-index: 95; margin: 0; padding: 0; text-align: center; font-size: 1.0909em; font-weight: bold; text-transform: uppercase; line-height: 24px; color: #fff;} /* .slide_prev:hover {background: url("../gfx/bg_slide_prev.png") no-repeat 0 100%;} .slide_next:hover {background: url("../gfx/bg_slide_next.png") no-repeat 100% 100%;} a.slide_nav {display: block; width: 50%; position: absolute; top: 0; bottom: 0; z-index: 100; padding: 368px 0 0;} a.slide_nav b {display: block; width: 48px; height: 48px; } a.slide_nav, .slide_title {position: absolute; bottom: 24px; left: 64px; right: 64px; z-index: 95; margin: 0; padding: 0; text-align: center; font-size: 1.0909em; font-weight: bold; text-transform: uppercase; line-height: 24px; background: #0f0 url("../gfx/bg_black50-trans.png") repeat 0 0; color: #fff;} .slide_title {opacity: 0.5;} a.slide_nav:hover, .slides li:hover .slide_title {opacity: 1;} a.slide_nav span {display: none;} .slide_prev {left: 0; background: url("../gfx/bg_slide_prev-trans.png") no-repeat 0 100%;} .slide_next {right: 0; background: url("../gfx/bg_slide_next-trans.png") no-repeat 100% 100%;} .slide_prev b {float: left; background: url("../gfx/bg_slide_prev-trans.png") no-repeat 0 100%;} .slide_next b {float: right; background: url("../gfx/bg_slide_next-trans.png") no-repeat 100% 100%;} */ /* ---------- MAINPAGE ----------- */ #content {width: 512px; float: left; margin: 0 0 0 -2px; padding: 24px 0 24px 24px; border-left: 2px solid #C5C7B2;} #content img {} #content .noborder {border: none;} #content ul, #content ol {margin: 0 0 1.6363em;} #content li {margin-left: 1.6363em; line-height: 1.4545em;} #content ol li {list-style: decimal;} #content ul li {list-style: square;} #sidebar {width: 388px; float: left; padding: 24px; border-right: 2px solid #C5C7B2;} #sidebar ul {} #sidebar ul ul {margin: 0 0 0 1.6363em;} #sidebar li {list-style: none; line-height: 1.4545em;} #sidebar li li {} #sidebar a {color: #B2B2A3;} #sidebar a:focus, #sidebar a:hover, #sidebar .current a:focus, #sidebar .current a:hover {color: #fff;} #sidebar .current a {color: #fff;} #sidebar .current .current {background: none;} #sidebar .current li a {color: #B2B2A3;} #sidebar .current .current a {color: #fff;} #sidebar .box, #sidebar .jScrollPaneContainer {float: left;} #navigation {width: 232px; padding: 0 26px 0 0;} #navigation li {height: 13px; line-height: 13px; float: left; clear: both;} #navigation a {font-size: 1.0909em; text-transform: uppercase; font-weight: bold; display: block; height: 12px; background: url("../gfx/bg_navigation.gif") no-repeat 0 0;} #navigation a span {display: none;} #navigation .e1 a {width: 42px; background-position: 0 -120px;} #navigation .e2 a {width: 129px; background-position: 0 -133px;} #navigation .e3 a {width: 151px; background-position: 0 -146px;} #navigation .e4 a {width: 150px; background-position: 0 -159px;} #navigation .e5 a {width: 137px; background-position: 0 -172px;} #navigation .e1 a:focus, #navigation .e1 a:hover, #navigation .e1.current a {background-position: -200px -120px;} #navigation .e2 a:focus, #navigation .e2 a:hover, #navigation .e2.current a {background-position: -200px -133px;} #navigation .e3 a:focus, #navigation .e3 a:hover, #navigation .e3.current a {background-position: -200px -146px;} #navigation .e4 a:focus, #navigation .e4 a:hover, #navigation .e4.current a {background-position: -200px -159px;} #navigation .e5 a:focus, #navigation .e5 a:hover, #navigation .e5.current a {background-position: -200px -172px;} #sub-navigation {width: 130px; height: 14.5454em; margin-right: -100px; overflow: auto;} /* ---------- BOTTOM AREA --------- */ #additional-links {width: 426px; float: left; padding: 0 0 60px 12px;} #additional-links ul {} #additional-links li {display: block; float: left; padding: 12px; border-right: 2px solid #C5C7B2;} #additional-links a {display: block; height: 12px; background: url("../gfx/bg_footer_noti-links.gif") no-repeat 0 0;} #additional-links a span {display: none;} #additional-links {} #additional-links .e1 a {width: 24px; background-position: 0 0;} #additional-links .e2 a {width: 72px; background-position: -25px 0;} #additional-links .e3 a {width: 75px; background-position: -100px 0;} #footer {float: left; padding: 12px 2px 12px 24px;} #footer p {float: left; padding: 0; margin: 0 0.6363em 0 0; line-height: 12px; color: #DEDEDE;} #footer p.copyrights {} #footer p.design {} #footer p.created {} #footer p.powered {display: none;} #footer p.developed {display: none;} #footer a {color: #DEDEDE;} /* ---------- Scroll Pane --------- */ .jScrollPaneContainer {position: relative; overflow: hidden; z-index: 1;} .jScrollPaneTrack {position: absolute; cursor: pointer; right: 0; top: 0; height: 100%;} .jScrollPaneDrag {position: absolute; background: url("../gfx/bg_scroll-arrows.gif") no-repeat -28px 0; cursor: pointer; overflow: hidden; opacity: 0.5;} .jScrollPaneDragTop {position: absolute; top: 0; left: 0; overflow: hidden;} .jScrollPaneDragBottom {position: absolute; bottom: 0; left: 0; overflow: hidden;} a.jScrollArrowUp {display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; height: 10px; background: url("../gfx/bg_scroll-arrows.gif") no-repeat 0 0; opacity: 0.5;} a.jScrollArrowDown {display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; height: 10px; background: url("../gfx/bg_scroll-arrows.gif") no-repeat -14px 0; opacity: 0.5;} .jScrollPaneDrag:hover, a.jScrollArrowUp:hover, a.jScrollArrowDown:hover {opacity: 1;} a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/} a.jScrollArrowUp {height: 10px;} a.jScrollArrowDown {height: 10px;}