body, div, p, form, fieldset, img, ul, li, h1, h2, h3, h4 {margin: 0; padding: 0; border: none}

body {background: #000; font-family: "Trebuchet MS", arial, tahoma, sans-serif; font-size: 11px; color: #666;}

h1 {position: absolute; left: 0; top: 0; width: 218px; height: 117px; z-index: 10;}
h1 span {display: none}
#mainLink { position: absolute; top: 0; left: 50%; z-index: 11; width: 218px; height: 117px; margin: 0 0 0 -480px; }
#mainLink a {display: block; width: 218px; height: 117px; background: url(../images/logo_a.png) top left no-repeat; cursor: hand}

h2 {color: red; font-size: 22px; font-weight: normal; height: 64px; padding: 16px 0 0 70px}
h2 span {display: block; font-size: 11px; color: #666}

a {color: red;}
a:hover {color: #000}

#boxTop {background: #000 url(../images/boxTop_tlo.png) top left repeat-x; height: 350px;}
#top {background: #000 url(../images/top_tlo.png) top left no-repeat; height: 350px; width: 960px; margin: 0 auto; position: relative;}
#top ul {position: relative; z-index: 2; top: 20px; left: 0; margin: 0 0 0 409px; width:531px; height: 50px;  padding: 0 0 0 14px; background: url(../images/menu_left_tlo.png) 0 10px no-repeat}
#top ul li {float: left; list-style-type: none; background: #000 url(../images/menu_tlo.png) top left repeat-x; margin: 10px 0 0 0;}
#top ul li a {display: block; width: 115px; padding: 2px 0 0 0; text-align: center; height: 28px; font-size: 16px; color: #FFF; text-decoration: none; font-weight: bold}
#top ul li a.selected {background: transparent url(../images/menu_a_tlo.png) 0 2px repeat-x;}
#top ul li a:hover {background: transparent url(../images/menu_a_tlo.png) 0 2px repeat-x;}
#top ul li.main {margin: 0; background: url(../images/menu_main_li_tlo.png) top left no-repeat}
#top ul li.main a {width: 71px; height: 50px; background: url(../images/menu_main_a_tlo.png) top left no-repeat}
#top ul li.main a.selected {background: none}
#top ul li.main a:hover {background: none}
#top ul li.main a.selected {background: none}
#top ul li.main a span {display: none}

#top .jezyki {position: absolute; top: 8px; right: 80px; height: 12px; z-index: 100}
#top .jezyki a {margin: 0 0 0 10px}

#boxContent {background: #FFF; padding: 20px 0; min-width: 960px}
#content { width: 960px; margin: 0 auto; position: relative; overflow: hidden}
.samo_tlo {background: #FFF url(../images/content_tlo.png) top left repeat-y;}
.tlo_z_tlem {background: #FFF url(../images/content_tlo_right.png) top left repeat-y;}
#left { float: left; width: 680px; position: relative; /*overflow: hidden;*/}
#content .left_dol_tlo {background: transparent url(../images/left_dol_tlo.png) top right no-repeat; width: 10px; height: 230px; position: absolute; left: 670px; bottom: 0}
#content .left_gora_tlo {background: transparent url(../images/left_gora_tlo.png) top right no-repeat; width: 10px; height: 230px; position: absolute; left: 670px; top: 0}
.left_main {float: left; width: 310px; margin: 0 10px 0 0; padding: 0 10px 0 0}
.right_main {float: right; width: 340px; margin: 0 10px 0 0;}
.right_main .mainPaniZosia {position: relative; height: 288px}
.right_main .mainPaniZosia #paniZosiaAnimacja {background: transparent; width: 132px; height: 288px; position: absolute; left: 0; top: 0; z-index: 2}
.right_main .mainPaniZosia a {display: block; position: relative; z-index: 1; background: #FFF url(../images/pani_zosia_chmurka.png) top left no-repeat; width: 184px; height: 228px; margin: 0 0 0 87px; padding: 15px 15px 15px 48px; color: #FFD687; text-decoration: none}
.right_main .mainPaniZosia a .wiecej {background: transparent url(../images/wiecej_bialy.png) 10px 4px no-repeat; padding: 0 0 0 22px; text-decoration: none; font-size: 9px;}
.right_main .mainPaniZosia a:hover .wiecej {background: transparent url(../images/wiecej_bialy.png) 10px -8px no-repeat;}
.right_main .mainPaniZosia a:hover {color: #FFF}
#content .left {float: left; width: 259px; margin: 0; padding: 0; position: relative; z-index: 10;}
#content .left ul {position: absolute; top: 80px; left: 0; width: 260px; background: transparent url(../images/left_ul_tlo.png) 25px 0 repeat-y; }
#content .left li {background: transparent url(../images/left_li_tlo.png) top left no-repeat; height: 23px; margin: 0 0 4px 0; list-style-type: none;}
#content .left li.ostatni {margin: 0}
#content .left li a {display: block; height: 21px; background: transparent url(../images/left_li_a_tlo.png) top left no-repeat; padding: 2px 0 0 42px;  font-size: 13px; color: #666; text-decoration: none}
#content .left li a.selected {background: none; font-weight: bold}
#content .left li a:hover {background: none; font-weight: bold}
#content .left .zamowieniePanWlodek {margin: 100px 0 0 0; position: relative; height: 430px; width: 240px;}
#content .left .zamowieniePanWlodek #panWlodekAnimacja {background: transparent; width: 240px; height: 261px; position: absolute; left: 20px; top: 144px; z-index: 2}
#content .left .zamowieniePanWlodek span {display: block; position: relative; z-index: 1; background: #FFF url(../images/pan_wlodek_chmurka.png) top left no-repeat; width: 198px; height: 114px; margin: 0; padding: 15px 15px 59px 15px; color: #FFD687; text-decoration: none}
#content .left .zamowieniePanWlodek p {margin: 0 0 10px 0}
#content .left .zamowieniePanWlodek a {color: #FFF; text-decoration: none}
#content .left .zamowieniePanWlodek a:hover {color: #000}

#content .right {float: right; width: 382px;  margin: 0 19px 0 0; padding: 14px 10px 10px 10px; background: url(../images/right_tlo.png) top left repeat-y; position: relative; min-height: 378px}
#content .right .gora_tlo {width: 402px; height: 10px; background: url(../images/gora_tlo.png) top left no-repeat; position: absolute; top: 0; left: 0}
#content .dol_tlo {width: 402px; height: 10px; background: url(../images/dol_tlo.png) bottom left no-repeat; font-size: 1px;  position: absolute; bottom: 0;left: 259px; z-index: 40}
#content .right h3 {font-size: 18px; font-weight: normal; padding: 0 0 20px 0}
#content .right h4 {font-size: 13px; margin: 0 0 10px 0}
#content .right p {padding: 0 0 10px 0}
#content .right ol {list-style-type: upper-roman; padding: 0 0 10px 30px}
#content .right ol li {font-weight: bold}
#content .right ul {padding: 0 0 10px 20px}
#content .right ul li {font-weight: normal}
#content .right table {background: #FFF; width: 382px; margin: 0 0 10px 0}
#content .right table th {background: #666; color: #FFF; text-align: left;  padding: 3px}
#content .right table td {background: #CCC; padding: 3px}


.punktowanie li {list-style-type: none; margin: 0;}
.punktowanie li a {display: block; padding: 5px 10px 5px 55px; text-decoration: none; color: #666; width: 245px}
.punktowanie li a:hover {background-color: #B4B4B4}
.punktowanie li a span.title {font-size: 18px; padding: 0 0 5px 0; display: block;}
.punktowanie li a:hover span.title{ color: #FFF}

.punktowanie .punktowanie_01 {background: transparent url(../images/punktowanie_01.png) 0 0 no-repeat;}
.punktowanie .punktowanie_02 {background: transparent url(../images/punktowanie_02.png) 0 0 no-repeat;}
.punktowanie .punktowanie_03 {background: transparent url(../images/punktowanie_03.png) 0 0 no-repeat;}
.punktowanie .punktowanie_04 {background: transparent url(../images/punktowanie_04.png) 0 0 no-repeat;}


.boxSzary {padding: 9px 10px 0 10px; background: #EBEBEB url(../images/boxSzary_top.png) top left no-repeat; width: 310px; margin: 10px 0 0 0}
.boxSzary h2 span { color: #333;}
.boxSzary a { color: #333; text-decoration: none; display: block; }
.boxSzary a:hover { color: #000; text-decoration: underline;}
.boxSzary a .wiecej {background: transparent url(../images/wiecej_czarny.png) 10px 4px no-repeat; padding: 0 0 0 22px; text-decoration: none; font-size: 9px;}
.boxSzary a:hover .wiecej {background: transparent url(../images/wiecej_czarny.png) 10px -8px no-repeat; padding: 0 0 0 22px; text-decoration: none;}
.boxSzary span.cena {background: none; text-align: right}
.boxSzary span.cena .kwota {font-size: 22px; color: red; vertical-align: middle; font-weight: bold}
.boxSzary a:hover span.cena {text-decoration: none}

.boxSzaryBottomTlo {width: 330px; height: 9px; background: #FFF url(../images/boxSzary_bottom.png) bottom left no-repeat; font-size: 1px;}


#right {float: left; width: 240px; padding: 0 0 0 20px;}
#right h2 {margin: 0 0 5px 0; padding: 0; font-size: 18px; color: #333; width: auto; height: auto;}
#right p {padding: 10px 0}
#right .space {display: block; height: 15px}

.film {width: 248px; margin: 0 0 0 -4px; position: relative}
.film .ramka {width: 248px; height: 190px; position: absolute; left: 0; top: 0; background: transparent url(../images/film_ramka.png) top left no-repeat}
.film .ramka_bottom {width: 230px; height: 9px; margin: 0 9px; position: absolute; left: 0; top: 181px; background: transparent url(../images/film_ramka_bottom.png) top left repeat-x; z-index: 4}
.film .ramka_big {width: 390px; height: 297px; position: absolute; left: 0; top: 0; background: transparent url(../images/film_ramka_big.png) top left no-repeat}
.film .ramka_bottom_big {width: 372px; height: 9px; margin: 0 9px; position: absolute; left: 0; top: 288px; background: transparent url(../images/film_ramka_bottom.png) top left repeat-x; z-index: 2}
.film .player {padding: 9px 0 0 9px; position: relative; z-index: 1}

#content .right h4.film_tytul {font-size: 9px; color: #AAA; margin: 0}
.film_tresc {border: 1px solid #CCC; background: #DDD; margin: 3px 0 20px 0; *margin: 7px 0 20px 0; padding: 5px; font-size: 9px; color: #999}

.miniatura {display: block; width: 120px; height:100px; position: relative}
.miniaturaLeft {float: left; margin: 0 10px 10px 0}
.miniaturaRight {float: right; margin: 0 0 10px 10px}
.miniatura .obraz_ramka_mini {position: absolute; width: 120px; height: 100px; left: 0; top: 0; background: transparent url(../images/obrazek_ramka_mini.png) left top no-repeat}

.plik {padding: 0 0 0 18px}
.plik_txt{background: url(../images/icons/txt.gif) left top no-repeat}
.plik_avi{background: url(../images/icons/avi.gif) left top no-repeat}
.plik_doc{background: url(../images/icons/doc.gif) left top no-repeat}
.plik_image{background: url(../images/icons/image.gif) left top no-repeat}
.plik_mp3{background: url(../images/icons/mp3.gif) left top no-repeat}
.plik_other{background: url(../images/icons/other.gif) left top no-repeat}
.plik_pdf{background: url(../images/icons/pdf.gif) left top no-repeat}
.plik_ppt{background: url(../images/icons/ppt.gif) left top no-repeat}
.plik_xls{background: url(../images/icons/xls.gif) left top no-repeat}
.plik_zip{background: url(../images/icons/zip.gif) left top no-repeat}


form p {clear: both; margin: 0 0 5px 0; overflow: auto}
form p label, form p .title_checkbox {float: left; width: 110px; padding: 3px 10px 0 0}
form p .pola {float: right}
form p .wybor label {float: none}
form p input, form p textarea, form p select { width: 231px; border: 1px solid #BBB; font-family: "Trebuchet MS", arial, tahoma, sans-serif; font-size: 11px; padding: 2px; color: #666}
form p textarea {height: 100px; overflow: auto}
form p select {width: 234px}
form p.submit {padding: 20px 0 0 0; *margin: 20px 0 0 0}
form p.submit input {float: none; display: block; width: 91px; height: 27px; background: url(../images/form_submit_tlo.png) left top no-repeat; border: none; font-weight: bold; color: #FFF}
form p input.file {border: none}
form p input.pierwszy {width: 13px}
form p input.drugi {width: 20px}
form p input.checkbox {width: auto}
form p span.tooltip{position: absolute; z-index: 1; padding: 4px 0 0 10px; *padding: 4px 0 0 7px}
form p span.tooltip span.tresc{position: absolute; display: block; top: 0; right: 4000px; background: #97BE0D; border: 1px solid #AAA; width: 231px; padding: 2px 2px 3px 2px; *padding: 3px 2px; color: #fff; font-size: 10px;}
form p span.tooltip:hover span.tresc{display: block; position: absolute; right: 24px; top: 0;}
form p span.tooltip:hover span.tresc span.arrow{display: block; width: 7px; height: 11px; position: absolute; right: -6px;	top: 4px; background: transparent url(../images/tooltip_arrow.png) left top no-repeat;}
form p .info {display: block; background: #BBB; padding: 5px; margin: 10px 25px 0 120px; font-size: 9px}
form p .error {display: block; padding: 5px 5px 5px 24px; margin: 10px 25px 0 120px; background: #FFC8C8 url(../images/icons/error.png) 5px 5px no-repeat; border: 1px solid red}
form p .errorPola {border: 1px solid red}


#content .weryfikacja p {padding: 0 0 0 150px; font-weight: bold}
#content .weryfikacja p span {float: left; margin: 0 0 0 -150px; font-weight: normal}
#content .weryfikacja p.zamow {padding: 20px 0 0 0; *margin: 20px 0 0 0}
#content .weryfikacja p.zamow a {float: none; display: block; width: 91px; height: 22px; background: url(../images/form_submit_tlo.png) left top no-repeat; border: none; font-weight: bold; color: #FFF; text-align: center; text-decoration: none; padding: 5px 0 0 0}

.dane_kontaktowe h3 {font-size: 13px; margin: 0 0 10px 0}
.dane_kontaktowe p {margin: 0 0 10px 0}


#right .wiecej {background: url(../images/separator.png) center top no-repeat; display: block; height: 26px; width: 240px; padding: 0}
#right .wiecej a {background: url(../images/separator_a.png) center top no-repeat; display: block; height: 26px; width: 240px;}
#right .wiecej a:hover {background: none}

#right .obrazek {margin: 0 0 0 -4px; position: relative; display: block; width: 248px; height: 108px}
#right .obrazek img {width: 230px; height: 90px; margin: 9px}
#right .obrazek .ramka {position: absolute; width: 248px; height: 108px; background: url(../images/obrazek_ramka.png) left top no-repeat; left: 0; top: 0}

#right ul {margin: 0 0 0 13px;}
#right li {list-style-type: none; padding: 0 0 10px 0}
#right li a {display: block}

.gwiazda {background: transparent url(../images/h2_gwiazda.png) top left no-repeat;}
.znak_zapytania {background: transparent url(../images/h2_znak_zapytania.png) top left no-repeat;}
.ogien_szary {background: transparent url(../images/h2_ogien_szary.png) top left no-repeat;}
.strzalka {background: transparent url(../images/h2_strzalka.png) top left no-repeat;}
#right .strzalka {height: 50px; padding: 0px 0 0 50px}
.formularz {background: transparent url(../images/h2_formularz.png) top left no-repeat;}
.lista {background: transparent url(../images/h2_lista.png) top left no-repeat;}
.lista_wpis {background: transparent url(../images/h2_lista_wpis.png) top left no-repeat;}
.mapka {background: transparent url(../images/h2_mapka.png) top left no-repeat;}
.cena {background: transparent url(../images/h2_cena.png) top left no-repeat;}

a .wiecej {background: transparent url(../images/wiecej.png) 10px 4px no-repeat; padding: 0 0 0 22px; text-decoration: none; font-size: 9px;}
a:hover .wiecej {background: transparent url(../images/wiecej.png) 10px -8px no-repeat; padding: 0 0 0 22px; text-decoration: none;}

#boxFooter {background: #212125 url(../images/boxFooter_tlo.png) top left repeat-x; border-bottom: 1px solid #68686E; min-width: 960px}
#footer {width: 960px; margin: 0 auto; padding: 20px 0;}
#footer a {color: #666}
#footer a:hover {color: red}
#footer h2 {color: #FFF; font-size: 18px; font-weight: normal; height: 50px; padding: 0 0 0 55px}

#footer .left {float: left; width: 262px; margin: 0 68px 0 0; padding: 0; background: none}
#footer .left ul {margin: 0 0 25px 0}
#footer .left ul li {list-style-type: none; margin: 0 0 10px 0;}
#footer .left ul li a {color: red; text-decoration: underline}
#footer .left ul li a:hover {color: #666; text-decoration: underline}
#footer .left p.adres {padding: 0 0 0 23px; background: url(../images/adres.png) 0 3px no-repeat}
#footer .left p.fax {padding: 0 20px 0 23px; background: url(../images/fax.png) 0 3px no-repeat; float: left}
#footer .left p.email {padding: 0 0 21px 23px; background: url(../images/email.png) 0 3px no-repeat; float: left;}
#footer .left p.telefon { padding: 9px 0 0 70px; background: url(../images/telefon.png) 0 0 no-repeat; width: 199px; height: 59px; text-align: right; margin: 0 0 0 -9px}
#footer .left p.telefon .infolinia {display: block; color: #FFF; font-size: 18px; }
#footer .left p.telefon .prefiks {font-size: 18px; font-weight: bold;}
#footer .left p.telefon .numer {font-size: 24px; color: red; font-weight: bold;}

#footer	.middle {float: left; width: 330px; margin: 0 20px 0 0; padding: 0;}
#footer .middle li {list-style-type: none; width: 318px; margin: 0 0 0 12px}
#footer .middle li a {display: block; padding: 0 0 0 28px; margin: 0 0 10px 0; width: 290px}

#footer	.right {float: left; width: 262px; margin: 0 0 0 18px; padding: 0; background: none}
#footer .right p {clear: both; margin: 0 0 10px 0}
#footer .right label {float: left; width: 90px; padding: 3px 0; margin: 0}
#footer .right label .wymagane {padding: 0 0 0 3px; color: red}
#footer .right input {width: 146px; padding: 2px;  margin: 0; background: #222; border: 1px solid #666; font-family: "Trebuchet MS", arial, tahoma, sans-serif; font-size: 11px; color: #FFF}
#footer .right input.checkbox {width: auto; border: none; background: transparent}
#footer .right .submit {padding: 20px 0 0 0; width: 262px}
#footer .right .submit input {float: none; display: block; width: 91px; height: 27px; background: url(../images/form_submit_tlo.png) left top no-repeat; border: none; font-weight: bold}
#footer .form_info {padding: 10px 0 0 0;}
#footer .form_info .wymagane {color: red}

#bottom {width: 960px; margin: 0 auto; padding: 10px 0}
#realizacja {float: left; width: 250px}
#realizacja a {color: #666; text-decoration: none; font-weight: bold}
#realizacja a:hover {color: red}
#keywords {float: right; width: 710px; font-size: 9px}

#animacja_top {position: absolute; top: 82px; left: 50%; margin: 0 0 0 -480px; z-index: 1;}
#animacja_top_2 {position: absolute; top: 0px; left: 50%; margin: 0 0 0 -480px; z-index: 1;}

#animacja_top_tekst {position: absolute; top: 186px; left: 50%; margin: 0 0 0 95px; z-index: 2;}

.clear {clear: both}
