html, body {height: 100%;}
body {background: url(img/bgpattern.png) repeat top center; margin: auto; text-align: center; font: 14px Arial;}

#wrapper {text-align: center; text-align: center; margin: auto;  min-height: 100%; background: url(img/bgpattern.png) repeat top center; }

#bonus-wrapper {padding: 270px 0 0 0; background: url(img/untitled2.png) no-repeat fixed bottom right; min-height: 100%;}

#buttons {position: absolute; top: 150px; left: 50%; margin-left: -70px;}

#heading li {display: inline; } 

/*. pane1 {position: absolute; top: -20px; left: 50%;  display: block; background: url(img/naglowek.png); width: 520px; height: 172px;} 
.pane2 {position: absolute; top: 80px; left: -194px; display: block; background: url(img/onas-off.jpg); width: 89px; height: 38px;} 
.pane3 {position: absolute; top: 80px; left: -110px; display: block; background: url(img/oferta-off.jpg); width: 105px; height: 38px;} !!!!!
.pane4 {position: absolute; top: 80px; left: -10px; display: block; background: url(img/portfolio-off.jpg); width: 125px; height: 38px;}
.pane5 {position: absolute; top: 80px; left: 115px; display: block; background: url(img/ludzie-off.jpg); width: 106px; height: 38px;}
.pane6 {position: absolute; top: 80px; left: 220px; display: block; background: url(img/kontakt-off.jpg); width: 105px; height: 38px;} */



.pane1 {position: absolute; top: -142px;  left: -190px; display: block; background: url(img/naglowek.png);}
 
.pane2 {position: absolute; top: 80px; left: -184px; display: block; background: url(img/onas-off.jpg); width: 89px; height: 38px;} 
.pane3 {position: absolute; top: 80px; left: -95px; display: block; background: url(img/oferta-off.jpg); width: 96px; height: 38px;} 
.pane4 {position: absolute; top: 80px; left: 5px; display: block; background: url(img/portfolio-off.jpg); width: 116px; height: 38px;}
.pane5 {position: absolute; top: 80px; left: 125px; display: block; background: url(img/ludzie-off.jpg); width: 97px; height: 38px;}
.pane6 {position: absolute; top: 80px; left: 222px; display: block; background: url(img/kontakt-off.jpg); width: 97px; height: 38px;} 


#heading li.pane2.active {background: url(img/onas-on.jpg) !important;}
#heading li.pane3.active {background: url(img/oferta-on.jpg) !important;}
#heading li.pane4.active {background: url(img/portfolio-on.jpg) !important;}
#heading li.pane5.active {background: url(img/ludzie-on.jpg) !important;}
#heading li.pane6.active {background: url(img/kontakt-on.jpg) !important;}

.pane {text-align: center; } 
.pane-welcome, .pane-onas, .pane-portfolio, .pane-oferta, .pane-ludzie, .pane-kontakt {width: 520px; margin-left: auto; margin-right: auto;}
.pane-kontakt {height: 520px;} /*  NIKNIE GDY BEDZIE FORMULARZ */

/* PANEL FACEBOOK */

#panel
{
	background: #ffffff;
	position: fixed;
	right: 2px;
	bottom: 5%;
 
}



/* LINKI */
.twitter a, p a, li a {color: #319aa7;}
.twitter a, p a:visited, li a:visited{color: #468890; text-decoration: none;}

strong {font-weight: bold; color: #111;}

/* ZAOKRÄ_GLONE ROGI */
.top-left {background: url('img/topleft.jpg') no-repeat; height: 10px; width: inherit; font-size: 2px;}
.top-right {background-image: url('img/topright.jpg'); height: 10px; width: 10px; font-size: 2px; float: right;}
.bottom-left {background: url('img/bottomleft.jpg') no-repeat; height: 10px; width: inherit; font-size: 2px;}
.bottom-right {background-image: url('img/bottomright.jpg'); height: 10px; width: 10px; font-size: 2px; float: right;}

/* NAGÅ_Ã_WKI STRON */
.slider {text-align:left; padding: 0px; font: 1em Arial; width: 520px; height: 217px; float: left;}
.slider h2 {color: white; background: url(img/dark50.png); margin: 10px 0 0 0; padding: 0 0 0 10px; font: 40px Arial; } /* small-caps  filter:alpha(opacity=80); opacity:0.8; */
.slider p {line-height: 1.3em; color: white; background-image: url(img/dark50.png);  float: right; padding: 5px;}
.pane-welcome .slider {background: #666 url(img/slider-glowna.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-welcome .slider h2 {width: 240px;}
.pane-welcome .slider p {margin: 40px 20px 0 0; width: 340px; height: 95px;}
.pane-onas .slider {background: #666 url(img/slider-spodek1.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-onas .slider h2 {width: 260px;}
.pane-onas .slider p {margin: 35px 10px 0 0; width: 315px; height: 60px;}
.pane-oferta .slider {background: #666 url(img/slider-dzieci.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-oferta .slider h2 {width: 215px;}
.pane-oferta .slider p {margin: 75px 20px 0 0; width: 340px; height: 70px;}
.pane-portfolio .slider {background: #666 url(img/slider-portfolio1.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-portfolio .slider h2 {width: 215px;}
.pane-portfolio .slider p {margin: 80px 20px 0 0; width: 310px; height: 60px;}
.pane-ludzie .slider {background: #666 url(img/slider-ludzie.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-ludzie .slider h2 {width: 215px;}
.pane-ludzie .slider p {margin: 80px 20px 0 0; width: 315px; height: 60px;}


.pane-kontakt .slider {background: #666 url(img/slider-palec.jpg) no-repeat; margin: 0 0 15px 0;}
.pane-kontakt .slider h2 {width: 215px;}
.pane-kontakt .slider p {margin: 80px 20px 0 0; width: 315px; height: 60px;}



/* STRONA GÅ_Ã_WNA */
.intro {text-align:left; padding: 0;  margin: 0px 0 10px 0; font: 1em Arial; width: 270px; float: left; background: #fff url(Ximg/divbg1.jpg) no-repeat bottom right;}
.intro h3 {padding: 0 5px 5px 10px; font: 26px Arial; color: #dd117b;}
.intro p {padding: 0 5px 0 5px; font: 1em Arial; margin: 5px 5px; line-height: 1.2em; text-align: left; }
.intro p.podpis {text-align: right; font-size: 1em; font-style: italic; margin-top: 15px;}
span.krecisie {font-weight: bold; color: #dd117b;}
span.events {font-weight: bold; color: #319aa7;}
.twitter {padding: 0; width: 240px; float: right; margin-bottom: 10px;}
.oferta.twitter li {margin-left: -5px; padding-left: 12px; padding-right: 5px; list-style-type: none; background: transparent url(img/bluedotsmall.png) no-repeat scroll 0 4px;}
.oferta.twitter li  a {display:none;}
a.sprawdznas {display:block;text-align:right;padding: 5px 5px 0 0;}
.sprawdznas img {margin: -10px 0 0 0;}






.partnerzy {overflow: hidden;}

.act6, .poka, .pmt, .system, .verde, .fajkier, .ihr, .iregion, .insilesia, .foto, .dgpl, .blank, .aegee, .inkubatory, .akwarium, .edunavigator {display: block; float:left; margin: 0px;}



.inkubatory {background: url(img/inkubatory.png) no-repeat; height: 110px; width: 170px;}
.inkubatory:hover {background: url(img/inkubatory.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.aegee {background: url(img/aegee.png) no-repeat; height: 110px; width: 170px;}
.aegee:hover {background: url(img/aegee.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.fajkier {background: url(img/fajkier.png) no-repeat; height: 110px; width: 170px; }
.fajkier:hover {background: url(img/fajkier.png) no-repeat 0 -110px; height: 110px; width: 170px; }

.pmt {background: url(img/pmt.jpg) no-repeat; height: 110px; width: 170px;}
.pmt:hover {background: url(img/pmt.jpg) no-repeat 0 -110px; height: 110px; width: 170px;}

.poka {background: url(img/poka.png) no-repeat; height: 110px; width: 170px;}
.poka:hover {background: url(img/poka.png) no-repeat 0 -110px; height: 110px; width: 170px;}


.act6 {background: url(img/act6.png) no-repeat; height: 110px; width: 170px;}
.act6:hover {background: url(img/act6.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.okomiasta {background: url(img/okomiasta.jpg) no-repeat; height: 109px; width: 170px;}
.okomiasta:hover {background: url(img/okomiasta.jpg) no-repeat 0 -109px; height: 109px; width: 97px;}

.ihr {background: url(img/instytuthr.png) no-repeat; height: 110px; width: 170px;}
.ihr:hover {background: url(img/instytuthr.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.system {background: url(img/quality.png) no-repeat; height: 110px; width: 170px;}
.system:hover {background: url(img/quality.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.edunavigator {background: url(img/edunavigator.png) no-repeat; height: 110px; width: 170px;}
.edunavigator:hover {background: url(img/edunavigator.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.verde {background: url(img/verde.png) no-repeat; height: 110px; width: 170px;}
.verde:hover {background: url(img/verde.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.foto {background: url(img/foto.png) no-repeat; height: 110px; width: 170px;}
.foto:hover {background: url(img/foto.png) no-repeat 0 -110px; height: 110px; width: 170px;}

.blank {background: #ffffff;) no-repeat; height: 110px; width: 170px;}
.blank:hover {background: #ffffff;) no-repeat 0 -110px; height: 110px; width: 170px;}

.insilesia {background: url(img/insilesia.png) no-repeat; height: 110px; width: 170px;}
.insilesia:hover {background: url(img/insilesia.png) no-repeat 0 -110px; height: 110px; width: 170px;}




/* O NAS */
.clear {clear:both;}
.atut {width: 510px;}
.atut p {text-align: left; padding: 0 5px;}
.atut h3 {text-align: left; padding: 5px; font: 22px Arial; color: #dd117b;}
.atut .top-right {position: relative; top: 19px; left: 0px; z-index: 1;}
.atut .bottom-right {position: relative; top: 86px; left: 0px; z-index: 1;}
.atut .text {background-color: #fff; position: relative; top: 19px; height: 96px; width: 415px; margin: 0 0 0 95px;}
.pomyslowosc {background: url(img/onas-notepad.jpg) no-repeat top left; height: 115px;}
.swierzosc {background: url(img/onas-choinka.jpg) no-repeat top left; height: 115px;}
.profesjonalizm {background: url(img/onas-profesjonalizm.jpg) no-repeat top left; height: 115px;}
.dyspozycyjnosc {background: url(img/onas-budzik2.jpg) no-repeat top left; height: 115px;}
.elastycznosc {background: url(img/onas-balet.jpg) no-repeat top left; height: 115px;}
.pasja {background: url(img/onas-pasja.jpg) no-repeat top left; height: 115px;}

/* OFERTA */
div.oferta {margin: 0 0 10px 0;}
.oferta div {background-color: #fff; text-align: left; }
.oferta h3 {font: 20px Arial; color: #dd117b; padding: 3px 5px 5px 5px; margin: 0;}
.oferta p {font: 14px Arial; padding: 2px 5px 2px 5px; margin: 0; }
.oferta ul {margin-left: 13px;}
.oferta li {margin: 6px 0 6px 0; list-style-type: none; padding: 0 0 0 15px; background: url(img/bluearrow.png) no-repeat 0 4px;}



/* LISTY NA PORTFOLIO I OFERTE */
.portfolio  p{padding-left: 10px;}
.portfolio ul {clear:both; padding-left: 10px;}
.portfolio li {margin: 0; list-style-type: none; padding: 6px 6px 6px 20px; background: url(img/bluearrow.png) no-repeat 4px 10px;} 
.portfolio li.link {margin: 0; list-style-type: none; padding: 6px 6px 6px 20px; background: url(img/mhand.png) no-repeat 4px 7px;} 
.portfolio li.klienci {margin: 0; list-style-type: none; padding: 10px 6px 6px 20px; background: url(img/mman.png) no-repeat 4px 7px; font: bold 14px Arial; } 
li.podlista {font-size: 0.8em; margin-top: -5px; list-style: none; background-image: none;}
li.podlista span {display:inline; width: 100px; padding: 0 10px 0 10px; background: url(img/bluedotsmall.png) no-repeat 0px 4px;}
li.podlista span:first-letter {font-weight: bold;}
li.podli {background: url(img/bluedotsmall.png) no-repeat 15px 10px; padding-left: 30px;}








.interferencje {display:block; background: url(img/zsp-logo.jpg) no-repeat; background-position: 0 40px;width: 250px; height: 200px; float:left;}
.interferencje-plakat {display:block; background: url(img/interferencje-plakat_s.jpg) no-repeat; border: solid 1px #aaa; width: 150px; height: 200px; float:right; margin-right: 30px;}

.maturowo {display:block; background: url(img/maturowo-logo.jpg) no-repeat; background-position: 0 0px;width: 250px; height: 200px; float:left;}
.maturowo-ref {display:block; background: url(img/referencje-maturowo_s.jpg) no-repeat; border: solid 1px #aaa; width: 150px; height: 200px; float:right; margin-left: 10px; margin-right: 30px;}

.capital {display:block; background: url(img/capital-logo.jpg) no-repeat; background-position: 0 0px;width: 240px; height: 84px; float:left;}
.capital-ref {display:block; background: url(img/referencje-capital_s.jpg) no-repeat; border: solid 1px #aaa; width: 150px; height: 200px; float:right; margin-right: 30px;}

.wb {display:block; background: url(img/wb-logo.jpg) no-repeat; background-position: 0 0px;width: 250px; height: 200px; float:left;}
.wb-ref {display:block; background: url(img/referencje-wb_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 0 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.ark {display:block; background: url(img/ark-logo.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 98px; float:left;}
.ark-ref {display:block; background: url(img/referencje-ark_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 0 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.sto {display:block; background: url(img/sto.jpg) no-repeat; background-position: 0 0px;width: 140px; height: 140px; float:left;}
.sto-ref {display:block; background: url(img/sto-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.postkarten {display:block; background: url(img/postkarten.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.postkarten-ref {display:block; background: url(img/postkarten-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.slask {display:block; background: url(img/slask.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.slask-ref {display:block; background: url(img/slask-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.wedel {display:block; background: url(img/wedel.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.wedel-ref {display:block; background: url(img/wedel-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.machala {display:block; background: url(img/machala.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.machala-ref {display:block; background: url(img/machala-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.sto2 {display:block; background: url(img/sto2.jpg) no-repeat; background-position: 0 0px;width: 130px; height: 248px; float:left;}
.sto2-ref {display:block; background: url(img/sto2-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.ekobrzmienia {display:block; background: url(img/ekobrzmienia.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.ekobrzmienia-ref {display:block; background: url(img/ekobrzmienia-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}

.europiknik {display:block; background: url(img/europiknik.jpg) no-repeat; background-position: 0 0px;width: 230px; height: 248px; float:left;}
.europiknik-ref {display:block; background: url(img/europiknik-referencje_s.jpg) no-repeat; border: solid 1px #aaa; background-position: 50 0px;width: 150px; height: 200px; float:right; margin-right: 30px;}



/* PORTFOLIO */
div.portfolio {margin: 0 0 10px 0; width: 520px;}
.portfolio div {background-color: #fff; text-align: left;}
.portfolio h3 {font: 18px Arial; color: #dd117b; padding: 0 5px 0 20px; margin: 0 0 5px 0;}
h4 {font-size: 1.05em; margin: -5px 0 7px 20px; padding: 0; font-style: italic; color: #dd117b;}
.portfolio p {font: 14px Arial; padding: 0 10px 0 10px; }
a.img {display:block; float: right; margin: 0 0 20px 0;}
a.img.su0 {height: 98px; width: 160px; background: #faf url(img/foto/su0s.jpg) no-repeat; }
a.img.su3 {height: 107px; width: 160px; background: #faf url(img/foto/su3s.jpg) no-repeat; }
a.img.su7 {height: 107px; width: 160px; background: #faf url(img/foto/su7s.jpg) no-repeat; }
a.img.su9 {height: 107px; width: 160px; background: #faf url(img/foto/su9s.jpg) no-repeat; }
a.img.su11 {height: 107px; width: 160px; background: #faf url(img/foto/su11s.jpg) no-repeat; }
a.img.su12 {height: 93px; width: 160px; background: #faf url(img/foto/su12s.jpg) no-repeat; }
a.img.ltc1 {height: 215px; width: 160px; background: #faf url(img/foto/ltc1s.jpg) no-repeat; }
a.img.ltc2 {height: 107px; width: 160px; background: #faf url(img/foto/ltc2s.jpg) no-repeat; }
a.img.ltc3 {height: 215px; width: 160px; background: #faf url(img/foto/ltc3s.jpg) no-repeat; }
a.img.gr1 {height: 107px; width: 160px; background: #faf url(img/foto/gr1s.jpg) no-repeat; }
a.img.rawa1 {height: 239px; width: 160px; background: #faf url(img/foto/rawa1s.jpg) no-repeat; }
a.img.netmet1 {height: 107px; width: 160px; background: #faf url(img/foto/warsztaty2s.jpg) no-repeat; }
a.img.netmet2 {height: 105px; width: 160px; background: #faf url(img/foto/catering2s.jpg) no-repeat; }
a.img.netmet3 {height: 106px; width: 160px; background: #faf url(img/foto/gym2s.jpg) no-repeat; }
a.img.netmet4 {height: 150px; width: 160px; background: #faf url(img/foto/happening1s.jpg) no-repeat; }

/* LUDZIE */
.ludzie {text-align: left; padding: 0; margin: 10px 0 0 0; font: 12px Arial; background-color: #fff; height: 88px; width: 395px; padding-left: 120px;}
.ludzie .bottom-right {position: relative; top: 78px; left: 0px;}
.ludzie h3 {color: #dd117b; font: 22px Arial;}
.ludzie h3 span {color: #222; font: 13px Verdana;}
.agata {background: #fff url(img/agata2_s.jpg) no-repeat top left;}
.kuba {background: #fff url(img/kuba_s.jpg) no-repeat top left;}
/*.skobel {background: #fff url(img/skobel_s.jpg) no-repeat top left;}*/
.szafraniec {background: #fff url(img/szafraniec_s.jpg) no-repeat top left;}
.magda {background: #fff url(img/magda_s.jpg) no-repeat top left;}
.karol {background: #fff url(img/karol_s.jpg) no-repeat top left;}
.maciek {background: #fff url(img/maciek_s.jpg) no-repeat top left;}
.asia {background: #fff url(img/asia_s.jpg) no-repeat top left;}


/* KONTAKT */
.pane-kontakt div {text-align: left; position: relative; left: -0px;}
.kontakt div {background-color: #fff; text-align: left;}
.kontakt h3 {font: 18px Arial; color: #dd117b; padding: 0 5px 0 20px; margin: 0 0 5px 0;}
h4 {font-size: 1.05em; margin: -5px 0 7px 20px; padding: 0; font-style: italic; color: #dd117b;}
.kontakt p {font: 14px Arial; padding: 0 10px 0 10px; }

.kontakt.wstep {width: 340px; float: left; background-color: #fff; margin: 0 10px 15px 0; }
.kontakt.wstep h2 {color: #dd117b; font: 26px Arial; padding: 0 10px; }
.kontakt.wstep p {text-align: justify; margin: 5px 10px 10px 10px;} /*przedÅ_użam diva*/
.dane {width: 140px; float: right; background-color: #333; padding: 10px; color: #eee; margin-right: 5px; font: 10px Verdana;}
.dane p {margin: 5px 0 0 0;}
.dane h3 {text-decoration: underline; font: bold 12px Verdana;}
.dane span {color: #eee; font: bold 10px Verdana;}
.formularz {clear: both; background-color: #fff; }
.formularz h3  {color: #dd117b; font: 24px Arial; padding: 0 5px;}

.formularz input, .formularz textarea {padding: 5px; margin: 0px 0px 10px 20px; border: 1px solid #ccc;}
.formularz input {width: 200px;}
.formularz textarea {height: 90px; width: 460px;}
.formularz textarea:focus, .formularz input:focus {border: 1px solid #dd117b;}
.formularz div.submit {text-align: center;}
.formularz input.submit-button {width: 100px; }
form {margin: 20px 0 20px 0;}
label { float: left; text-align: right; margin: 0 15px 0 20px; width: 100px; padding-top: 5px;}
label.wiadomosc {width: 460px; text-align: center; color: #dd117b; margin: 0 0px 5px 30px;}

/* STOPKA */<!DOCTYPE> 
.footer {font: 10px Verdana; color: #666; padding: 15px 0 15px 0; }
.footer a {color: #333;}
.footer a:hover {color: #777;}