/*
---------------------------------------------
 Design & Code (c) Wild Moose Justyna Walczak
---------------------------------------------
*/

.clear { clear: both; height: 1%;}
.clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clear { display: inline-block;}
/* Hides from IE-mac \*/
* html .clear { height: 1%;}
.clear { display: block;}
/* End hide from IE-mac */

* { margin: 0; padding:0; border: 0;}

html { width: 100%; height: 100%;}
body { font-family: Verdana, Helvetica, Arial sans-serif; font-size: 62.5%; background: #909090 url(img/tlo-pod-logo1.jpg) repeat-x;}

p          { margin: 20px 5px 10px 5px; font-size: 12px; line-height: 1.6em;}
a, a:hover { text-decoration: none;}
ul         { list-style-type: none;}
h1, h2, h3, h4, h5, h6, .panel_szary .panel_boxy div strong, .menu, .terminarz, .zamowienia, .oferta  { font-family: Georgia, "Times New Roman", Times, serif;}

h1, h2, h3, h4, h5, h6 { margin: 20px 0px; font-weight: normal; color: #fff;}
h1 { font-size: 22px; line-height: 40px;}
h2 { font-size: 18px;}

.kontener { width: 100%; height: auto; margin: 0; text-align: center;}
.top      { height: 88px; background: #fff url(img/top-po-logo.jpg) repeat-x;}
.bg_sr    { background: /*#909090*/ url(img/tlo-szarosc.jpg) 0 71px repeat-x;}
.top, .logo, .mini_menu, .srodek, .panel_boxy, .stopka { width: 970px; margin: 0 auto; position: relative; text-align: left;}

.logo        { height: 56px; background: transparent url(img/logo.jpg) 0% 100% no-repeat;}
.logo strong { display: block; padding: 25px 0 0px 460px; color: #000; text-transform: uppercase; font-size: 14px; line-height: 36px; position: relative;}
.mini_menu         { height: 30px; background-color: #b93f3f; text-align: right; margin: 2px 0;}
.mini_menu a       { margin: 0 10px; line-height: 32px; font-size: 12px; color: #fff; font-family: Georgia, "Times New Roman", Times, serif;}
.mini_menu a:hover { color: #f5e0e0;}
.menu        { height: 71px; background: #b93f3f url(img/menu_bg.jpg) repeat-x; z-index: 20px;}
.menu a      { padding: 30px 20px; color: #fff; text-align: left; letter-spacing: 0.1em;}
.menu a span { line-height: 18px;}

.index_sr       { position: relative; height: 406px; background: transparent url(img/srodek.jpg) 50% 100% no-repeat;}
p.slogan        { position: absolute; top: 120px; right: 30px; color: #fff; font-size: 30px; font-family: "Times New Roman", serif;}
p.slogan strong { color: #131313; font-weight: normal;}
p.slogan span   { margin-left: 40px; font-size: 38px; display: block}

.panel_szary { height: 195px; padding: 10px 0px; color:#fff; background: #717171 url(img/szary_poziom_sep.jpg) repeat-x;}
.panel_szary .panel_boxy { width: 960px; margin: 0 auto;}
.panel_szary .panel_boxy div { width: 280px; float: left; padding: 10px 20px;}
.panel_szary .panel_boxy div.sep { background: transparent url(img/panel_box_sep.jpg) 100% 0% no-repeat;}
.panel_szary .panel_boxy div a { color: #fff;}
.panel_szary .panel_boxy div a:hover { text-decoration: underline;}
.panel_szary .panel_boxy div p { margin: 10px auto; padding: 0px 20px; text-align: left;}
.panel_szary .panel_boxy div p strong { margin: 10px auto; display: block; font-size: 11px; text-transform: uppercase; font-weight: normal;}
.panel_szary .panel_boxy div p strong.max { font-size: 14px; font-weight: bold;}

.panel_szary .panel_boxy div.szybka_naw a { height: 49px; line-height: 49px; display: block; background: transparent url(img/szary_poziom_sep.jpg) repeat-x 100% 100%; text-align: left; font-size: 14px;}
.panel_szary .panel_boxy div.szybka_naw a:hover { text-decoration: none; color: #d7d7d7;}

.szybka_naw a span { display: block; text-transform: uppercase; background-color: transparent; background-repeat: no-repeat; background-position: 100% 50%; font-size: 14px;}
.szybka_naw a span.terminarz { background-image: url(img/terminarz.jpg);}
.szybka_naw a span.zamowienia { background-image: url(img/zamowienia.jpg);}
.szybka_naw a span.oferta { background-image: url(img/pelna_oferta.jpg);}

.szybka_naw a:hover span.terminarz { background-image: url(img/terminarz_h.jpg);}
.szybka_naw a:hover span.zamowienia { background-image: url(img/zamowienia_h.jpg);}
.szybka_naw a:hover span.oferta { background-image: url(img/pelna_oferta_h.jpg);}


.panel_jasny { height: auto; padding-bottom: 10px; color: #bababa; background-color: #f5f5f5;}
.panel_jasny .panel_boxy div { width: 280px; height: 100%; float: left; padding: 10px 20px;}
.panel_jasny .panel_boxy div a { font-size: 11px; color: #bababa;}
.panel_jasny .panel_boxy div a:hover { text-decoration: underline;}


.panel_jasny .panel_boxy div p { height: 80px; margin: 10px auto; padding: 0px 0px; text-align: left; font-size: 10px;}
.panel_jasny .panel_boxy div p.sep { background: transparent url(img/jasny_poziom_sep.jpg) 100% 100% repeat-x;}
.panel_jasny .panel_boxy div p strong { margin: 0px auto; display: block; font-size: 10px; color: #bababa; text-transform: none; font-weight: bold;}

.stopka { padding: 2px 0 0; background: transparent url(img/jasny_poziom_sep.jpg) 100% 0% repeat-x;}
.stopka p { display: block; color: #bababa; font-size: 10px;}
.stopka p a { color: #bababa; font-size: 11px;}
.stopka p.l { width: 50%; float: left; text-align: left;}
.stopka p.l a {  margin: 0 5px;}
.stopka p.r { width: 40%; float: right; text-align: right;}

/*-----------------------------------------------------
ZAWARTOŚĆ
-----------------------------------------------------*/
.srodek { width: 970px; margin: 0 auto; position: relative; color: #fff;}
.grupa_menu { height: 40px; margin: 20px 0 0; background-color: #b93f3f;}
.grupa_menu a { display: block; float: left; margin: 5px; padding: 5px 15px; color: #fff; line-height: 20px; font-size: 14px;}
.grupa_menu a:hover, .grupa_menu a.on { background-color: #d05454;}

/*-----------------------------------------------------
JEDNA KOLUMNA
-----------------------------------------------------*/
.akc td { text-align: center;}
.akc a { margin: 5px auto; display: block;}
.akc a img { margin: 0 auto; border: 5px solid #bbbbbb;}
.akc a:hover img { border: 5px solid #f5f5f5;}
.akc a span { display: block; padding: 10px 5px; color: #ebebeb; font-size: 12px;}
.akc a:hover span { color: #fff;}

.terminy { width: 968px; margin: 10px auto; padding: 1px; background-color: #bbbbbb;}
.terminy td { width: 484px; background-color: #f5f5f5; color: #616161;}
.terminy img { float: left; margin: 0; padding: 0;}
.terminy div { float: right; width: 290px; padding: 10px 5px;}
.terminy strong { font-size: 14px;}
.terminy em { margin-left: 5px; font-size: 11px;}
.terminy strong.data { display: block; font-size: 15px; color: #000;}
.terminy h2 { margin-left: 20px; color: #717171;}


.kol { width: 950px; float: none; margin: 0 auto; padding: 0px 10px 20px; position: relative;}
.kol table { width: 620px; margin: 0; padding: 0; border: 0; font-size: 12px;}

.foto { width: 950px; margin: 0; padding: 0; position: relative;}	
.opis_foto  { width: 300px; float: left; margin: 0; padding: 20px 0 0; position: relative; text-align: justify;}
.opis_foto h2 { text-align: left;}

.pr  { width: 620px; float: right;  margin: 0 auto 20px; padding: 20px 0 0; position: relative; text-align: left;}
#stage     { width: 620px; height: 290px; margin: 0 auto; padding: 0; overflow: auto; overflow-x: hidden; overflow-y: hidden; position: relative;}	
#myList    { width: 5000px; border: 0; margin: 0; padding: 0;}
#myList li { list-style: none; margin: 0; padding: 0 25px; border:0; margin-right: 0px; float:left; width: 555px; height: 260px; position: relative; text-align: center;/*  z-index: 30; */}

#myList li img { margin: 0 auto;}

#buttons { width: 600px; position: absolute; bottom: 145px; left: 0; z-index: 3;}
.slider-buttons a,
.slider-buttons a:hover { width: 14px; height: 14px; display: block; background-color: transparent; background-position: center; background-repeat: no-repeat;}
.slider-buttons { width: 20px/*480px*/; height: 14px; line-height: 24px;}

#previous { background-image: url(img/arow-prev.gif); position: absolute; top: 0px; z-index: 3; left: 5px; cursor: pointer;}
#previous:hover { background-image: url(img/arow-prev-h.gif);}
#next { background-image: url(img/arow-next.gif); position: absolute; top: 0px; z-index: 3; right: 5px; cursor: pointer;}
#next:hover { background-image: url(img/arow-next-h.gif);}

#myList li .opcje { width: 140px; height: 16px; margin: 20px auto 0; text-align: center;}
.opcje a { display: block; float: left; width: 47px; height: 12px; padding: 0; margin: 0 10px; color: #fff; text-align: right;}
.opcje a:hover { color: red;}
.pdf { background: transparent url(img/pdf.gif) no-repeat;}
.zoom { background: transparent url(img/zoom.gif) no-repeat;}

.kol .tab { width: 620px; margin: 0; padding: 0; border: 0; font-size: 12px;}
.kol .tab .span { background-color: #828282;}
.kol .tab td, .kol .tab th { padding: 5px;}
.kol .tab td { border-bottom: 1px solid #cfcfcf;}
.kol .tab th { background-color: #616161;}
.kol .tab th a { color: #fff;}
.kol .tab th a:hover { text-decoration: underline;}

.kol .akc { width: 950px; margin: 10px auto;}
/**/

h2 .pdf { width: 47px; height: 12px; padding-left: 25px; margin: 0 10px; font-size: 12px; color: #fff; text-align: right; background: transparent url(img/pdf.gif) no-repeat;}
h2 .pdf:hover { color: red;}

.kol .lista { margin: 0 5px;}
.kol .lista li { line-height: 1.8em; font-size: 12px;}
.kol .lista li ul li { margin-left: 12px;}
.kol p span { display: block; font-size: 12px; background-color: #717171; padding: 5px;}

#kontakt .kolle { width: 460px; float: left; margin: 0; padding: 0px 10px 10px 5px;}
#kontakt .kolpr { width: 460px; float: left; margin: 0; padding: 0 10px;}
#kontakt .kolpr .mapa { width: 460px; border: 5px solid #9f9f9f; margin: 0;}

/*-----------------------------------------------------
TRZY KOLUMNY
-----------------------------------------------------*/
.kol1 { width: 340px; height: 100%; padding: 0 0 10px; margin: 0; float: left; text-align: justify;}
.kol2 { width: 350px; height: 100%; padding: 50px 0 10px; margin: 0; float: left; text-align: center;}
.kol3 { width: 220px; height: 100%; padding: 0 0 10px; margin: 0; float: left;}
.opcje_wiecej { width: 220px;}
.opcje_wiecej li { padding-left: 30px; background-color: transparent; background-position: 0 50%; background-repeat: no-repeat; border-bottom: 1px solid #aaaaaa; line-height: 30px; color: #eaeaea;}
.opcje_wiecej li a { color: #eaeaea;}
.opcje_wiecej li a:hover { color: #fff;}
.pdf { background-image: url(img/pdf.gif);}
.zoom { background-image: url(img/zoom.gif);}
.table { background-image: url(img/table.gif);}
.film { display: block; height: 50px; padding-left: 115px; background: transparent url(img/bg_film.jpg) no-repeat;}
.film a { color: #fff; line-height: 50px;}

/*karuzela na maszynie*/
.foto_karuzela { height: 180px; padding: 10px 0px; color: #fff; background: #717171 url(img/bg_karuzela.jpg) repeat-x;}
.karuzela      { width: 970px; display: block; margin: 0 auto; position: relative;}
#stage1     { width: 940px; height: 180px; margin: 0 auto; padding: 0 10px; overflow: auto; overflow-x: hidden; overflow-y: hidden; position: relative;}	
#stage1 #myList    { width: 2000px;}
#stage1 #myList li { padding: 0; margin-right: 25px; width: 210px; height: 150px;}
#stage1 #buttons   { width: 940px; position: absolute; bottom: 90px; right: 0;}
#stage1 .slider-buttons { width: 480px;}

/*-----------------------------------------------------
KONTAKT
-----------------------------------------------------*/
#kontakt .kolle { width: 460px; float: left; margin: 0; padding: 0px 10px 10px 5px;}
#kontakt .kolpr { width: 460px; float: left; margin: 0; padding: 0 10px;}
#kontakt .kolpr .mapa { width: 450px; border: 5px solid #9f9f9f; margin: 0;}

form      { display: block; padding-bottom: 20px;}
form input,
form textarea,
form label    { float: left; font-size: 12px;}
form input,
form textarea { width: 300px; margin-bottom: 5px; padding: 5px; border-width: 1px; border-color: #797979 #797979 #9f9f9f #9f9f9f; border-style: solid;}
form textarea { height: 80px;}
form label    { display: block; width: 56px; margin: 0 10px 0 0; padding: 6px 0 0 0; color: #fff; text-align: right;}
form p        { clear: both;}
form .submit  { width: 80px; margin-left: 66px; padding: 5px; background-color: #9f9f9f; color: #fff; font-weight: bold; cursor: pointer;}
#kontakt .kolle span { font-size: 13px;}
.dziekujemy { margin: 20px 60px 20px 10px; font-size: 13px;}

.dane { width: 380px; height: 370px; background-color: #ccaa6d;}
.dane div { display: block;  margin: 30px 0 0 20px;}
.dane h1,
.dane p  { color: #fff; padding-bottom: 10px;}
.br     { border-bottom: 1px solid #dfcaa4;}
.dane a { color: #67532e;}
.dane a:hover { color: #fff;}

p.minip { height: 200px;}