/* =============================================================================
                                                                       OGOLNE
============================================================================= */
body, html{
  width: 100%;
  padding: 0px; margin: 0px;
  background: rgb(207,214,233) url(graf/tlo_top.png) repeat-x 0px 0px;
  color: rgb(60,61,62);
  font: normal 11px tahoma, arial, geneva, sans-serif;
}

img{ display: block; border: none; }
form{ margin: 0px; padding:0px;}

a{ color: rgb(38,53,108)} 
a:hover{ background-color: rgb(38,53,108); color: #FFF; }

a img{ border: 2px rgb(185,194,222) solid; }
a:hover img{ border-color: rgb(238,240,248); }

img.prawa{ float: right; padding: 10px 0px 10px 20px;}
img.lewa{ float: left;  padding: 10px 20px 10px 0px;}
.strong, strong{ font-weight: bold; }
.center{ text-align: center};
.clr{ clear: both; }
.malpa { display: inline; padding: 0px 2px; }

.wrong, .ok{ text-align: center; font-weight: bold; padding: 5px 0px; }
.wrong{ color: rgb(204,0,0); border: 1px rgb(204,0,0) solid;}
.ok{ color: rgb(0,102,51);  border: 1px rgb(0,102,51) solid;}

.pod_oknem{ float: right; width: 290px; height: 220px; }
/* ====== =======================================================================
                                                                       WRAPER
============================================================================= */

#whole{ background: url(graf/falka_top.png) no-repeat 0px -1px; }
#top{
  width: 970px;
  margin: 0px auto;
  height: 134px;
}
div.okno_abs{ float:right; width: 287px; height: 118px; padding-top: 16px; } 
div.okno_abs img{  position: absolute; }

#logo{
  float: left;
  width: 320px; height: 66px;
  padding: 22px 0px 0px; margin: 0px;
  overflow: hidden;
}
h1#logo a{
  display: block;
  padding-top: 90px;
  background: url(graf/logo1.gif) no-repeat left top;
}
h1#logo a:hover{
  opacity: 0.7; 
  filter: alpha(opacity=70);
}

ul#menu{
  float: left;
  width: 600px;
  background: rgb(38,53,108);
  list-style: none;
  padding: 0px; margin: 11px 0px 0px;
}
ul#menu li{ display:block; float: left;}
ul#menu a{
  color: #FFF;  /* rgb(247,224,23); */
  display: block; float: left;
  padding: 11px 27px 10px;
  font-weight: bold;
  border-right: 1px rgb(77,90,137) solid;
  text-decoration: none;
  text-transform: uppercase;
  background-color: rgb(38,53,108); 
}
ul#menu a:hover, ul#menu a.active{ background-color: rgb(77,90,137); color: #FFF; text-decoration: none; }

#zajawka, #content{
  background: url(graf/tlo_zajawka_duza.jpg) no-repeat 0 0;
  width: 950px;
  margin: 1px auto 0px;
  padding-left: 20px;
}
#content .certyfikaty{ float: left; width: 659px; padding-bottom: 10px; }
#content .certyfikaty a{ display: block; float: left;  margin: 0px 7px 5px 0px; }

#content h2{ font-size: 14px; padding: 10px 0px 6px; margin: 0px; }
#content h3{ font-size: 13px; padding: 8px 0px 4px; margin: 0px; }

#content ul{
  list-style: none;
  margin: 0px; padding: 10px 0px 20px;
}
#content li{
  padding: 0px 0px 6px 15px;
  background: url(graf/mark_content.gif) no-repeat 0px 1px;
}

#zajawka{
  line-height: 1.4em;
}

#zajawka .ofirmie, #zajawka .oferta{
  float: left;
  width: 350px;
  margin: 0px; padding: 0px 15px 0px 0px;
  background: url(graf/separator_zajawka.png) no-repeat right 50px;
}
#zajawka .kontakt{
  float: left;
  margin: 0px; padding: 0px 15px 20px 0px;
  background: url(../img/woj.gif) no-repeat 160px 160px;
}
#zajawka .kontakt h1{ padding: 0px; margin: 0px; }
#zajawka .kontakt h2{ padding: 15px 0px 0px; margin: 0px; font-size: 1.1em; clear: both;}
#zajawka .kontakt div.biuro{ float: left; width: 180px; }
#zajawka .kontakt div.biuro p{ margin: 0; padding: 6px 0px 6px;}

#zajawka a.mapka{ float: left; margin: 10px 20px; }
#zajawka .ofirmie p, #zajawka .oferta p, #zajawka .kontakt p{ margin: 0px; padding: 10px 0px 4px; }
#zajawka .oferta ul a{ font-weight: bold; }


#zajawka .reklama{
  float: left;
  width: 250px; height: 210px;
  margin: 10px 0px 0px; padding: 25px 5px 0px 20px;
  background:  url(graf/reka_tel.jpg) no-repeat right bottom;
}
#zajawka .reklama img.napis{ padding-top: 20px; }
#zajawka .reklama img.telefon{ padding-top: 14px; }


#belka{
  width: 970px;
  margin: 1px auto 0px; padding-bottom: 10px;
  background: rgb(42,47,49) url(../img/belka-cien.jpg) no-repeat right top;
  color: rgb(240,240,240);
  clear: both;
}
#belka p{ padding: 8px 0px 0px; margin: 0px; }

#belka .kontakt{
  float: left;
  width: 285px;
  padding: 0px 15px 0px 20px;
}                                           
#belka .kontakt a img{ float: right; border: none; margin-top: 12px; }
#belka .kontakt img.h{ }
#belka .kontakt p{ padding: 6px 0px 0px; margin: 0; font-size: 0.9em; }
#belka .kontakt p strong{ font-size: 1.1em;}


#belka .newsletter{
  float: left;
  width: 220px;
  padding: 0px 20px 0px;
}
#belka .newsletter div{ padding: 15px 0px 0px;}
#belka .newsletter p{ line-height: 1.4em;}  
#belka .newsletter input.text{ float: left; border: none; width: 160px; }
#belka .newsletter input.submit{ float: right; }

#belka .promocje{
  float: right;
  width: 350px; height: 30px;
  padding: 0px 20px 0px;
  background: url(../img/promocja.gif) no-repeat 20px 0px;
}
#belka .promocje h2{ margin: 0px; padding: 7px 0px 0px 17px; font-size: 14px; background: url(graf/mark_promo.gif) no-repeat 0px 9px; }
#belka .promocje img{ padding-bottom: 10px;}



#stopka{
  clear: both; width: 930px;
  margin: 0px auto 0px;
  padding: 15px 20px;
  color: rgb(90,91,92);
  background: url(graf/tlo_stopka.png) no-repeat 30px 0px;
  border-top: 1px rgb(222,225,233) solid;
}
#stopka .wykonanie{
  float: right;
  height: 20px; width: 57px;
  overflow: hidden;
  position:relative;top: -5px;
}
#stopka .wykonanie a{
  display: block;
  padding-top: 30px;
  background: url(../img/flink_pl.gif) no-repeat 0px 0px;
}
#stopka .wykonanie a:hover{ background-position: 0px -40px; }


#bottom{
  width: 970px;
  margin: 1px auto 0px; padding-bottom: 10px;
  clear: both;
  line-height: 1.4em;
}
#bottom a{
  font-weight: bold;
}
#bottom .oferta{
  float: left;
  width: 550px; /* 280px */
  padding: 0px 10px 0px 20px;
}
#bottom .oferta_cd{
  float: left;
  width: 350px;
  padding: 30px 20px 0px;
}
#bottom ul, #zajawka .oferta ul{
  list-style: none;
  margin: 0px; padding: 10px 0px;
}
#bottom li, #zajawka .oferta li{
  padding: 0px 0px 6px 15px;
  background: url(graf/mark_oferta.gif) no-repeat 0px 1px;
}
#bottom img.naroznik{
  float: right; padding-top: 10px;
}

#zajawka div.formularz_kontakt{
  float: left;
  width: 240px;
  padding: 20px 20px 15px;
  background: url(graf/separator_zajawka.png) no-repeat left 50px;
}
#zajawka div.formularz_kontakt label{
  display: block;
  width: 100%; padding-bottom: 2px;
}
#zajawka div.formularz_kontakt input{ width: 100%; border: 1px rgb(229,229,229) solid; }
#zajawka div.formularz_kontakt textarea{ width: 100%; border: 1px rgb(229,229,229) solid; }
#zajawka div.formularz_kontakt input.submit{ display: block; width: auto; margin: 6px auto 0px; background-color: rgb(251,192, 0); color: #FFF;  font-weight: bold; border: none; }

#cennik { float: left; width: 640px; }
#cennik div{ float: left; padding: 5px 10px; text-align: center; }
#cennik div.clr{ clear: left; padding: 0px; }
#cennik img{ margin: 0px auto; }

#cennik_opis{ float: right; width: 290px; height: 220px; }