﻿*{margin:0;padding:0}
body{font-family:"Arial",serif;background-image:url(images/background.png)}
#wrapper{width:900px;margin:20px auto}
*{margin:0;padding:0}
header{position:relative;margin:10px auto;padding:1px}
header #title{width:400px;height:100px;position:absolute;top:10px;left:10px}
header #title h1{font-size:28px;color:#000;margin:5px 0;font-family: 'Josefin Sans', sans-serif;line-height:1;letter-spacing:10px; font-weight:200;}
header #title h1 a{color:#000;text-decoration:none}
header #title h1 a:visited{color:#000;text-decoration:none}
header #title h1 span{font-size:18px;font-family: 'Josefin Sans', sans-serif;line-height:1;letter-spacing:3px;margin:0 0 0 0px; display:block;}
header #title2{position:absolute;top:15px;right:10px;width:350px;height:100px}
header #title2 #slog1{font-size:24px;font-family: 'Nothing You Could Do', cursive;letter-spacing:4px}
header #title2 #slog2{font-size:22px;padding:0 0 0 160px;font-family: 'Nothing You Could Do', cursive;letter-spacing:3px}
header nav{margin:120px auto 0;width:auto;border-top:1px solid grey;border-bottom:1px solid grey}
header nav ul{display:inline-block}
header nav li{list-style:none;float:left}
header nav li a{text-decoration:none;padding:7px 38px;font-family: 'Josefin Sans';font-size:16px;color:#000;font-weight:200;display:block}
header nav li a:hover{color:grey}
#baner{width:auto;margin:5px auto}
#baners{position:relative}
#baners img{display:block}
#baner #baners p{font-family:calibri,'Helvetica Neue',Helvetica,sans-serif;font-size:16px;color:#FFF;}
#tresc{width:auto;margin:230px auto 10px;overflow:hidden;padding:5px 10px}
#tresc article{width:60%;float:left}
#tresc aside{width:40%;float:right}
#tresc article div{width:auto;padding:5px}
#tresc article div h2{width:auto;border-bottom:1px solid grey;margin:5px 0 20px}
#tresc article div h2 span{margin:0 0 0 10px;font-size:15px;color:#000}
#tresc article div p{font-size:15px;  font-family:calibri; color:#444444}
#tresc article div a{font-size:16px;font-family:calibri;color:grey}
#tresc aside div{width:auto;padding:5px}
#tresc aside div h2{width:auto;border-bottom:1px solid grey;margin:5px 0 20px}
#tresc aside div h2 span{margin:0 0 0 10px;font-size:15px;color:#000}
#tresc aside div article{width:340px;overflow:hidden;margin:0 0 10px}
#tresc aside div article img{display:block;float:left;margin:0 0 8px;padding:0 5px 0 0}
#tresc aside div article h3{background:#AAA;width:auto;margin:2px 0 6px;padding:5px 0 5px 5px}
#tresc aside div article h3 span{font-size:13px;color:#fff;margin:0 0 0 3px} 
#tresc article h3{font-size:15px; color:#191919;}      
#tresc aside div article p{font-size:13px;font-family:calibri;color:#545353;margin:5px}
#tresc aside div article p a{color:grey;display:block}
#tresc aside div article p a:hover{color:silver}
footer{margin:20px auto}
footer div{width:auto;border-top:1px solid grey;border-bottom:1px solid grey;padding:10px 0;overflow:hidden}
footer div article{width:33%;float:left}
footer div article a{display:block;margin:0 auto}
footer nav{margin:10px auto}
footer nav ul{display:inline-block;margin:0 0 0 20px}
footer nav li{list-style:none;float:left}
footer nav li a{display:block;font-size:11px;color:#000;padding:2px 5px}
footer nav li a:hover{color:grey}
footer article p{text-align:center;font-size:13px}
footer #spawanePL a{background-image:url(images/spawane-pl.png);
background-repeat:no-repeat;width:250px;height:80px;transition:.5s all;-moz-transition:.5s all;-webkit-transition:.5s all}
/* footer #polkut a:hover{background-image:url(images/polkut_logo1.png);transition:.5s all;-moz-transition:.5s all;-webkit-transition:.5s all}*/
footer #came a{background-image:url(images/came_logo.png);background-repeat:no-repeat;width:301px;height:100px;transition:.5s all;-moz-transition:.5s all;-webkit-transition:.5s all}footer #came a:hover{background-image:url(images/came_logo1.png);transition:.5s all;-moz-transition:.5s all;-webkit-transition:.5s all}footer #joniec a{background-image:url(images/joniec_logo.png);background-repeat:no-repeat;width:278px;height:80px;transition:.5s all}footer #joniec a:hover{background-image:url(images/joniec_logo1.png);transition:.5s all;-moz-transition:.5s all;-webkit-transition:.5s all}#galeria_zdjec{width:auto;margin:20px 0 20px 20px;text-align:left;overflow:hidden}#galeria_zdjec .zdjecia{width:120px;height:86px;float:left;margin:5px}#galeria_zdjec .zdjecia img{border:1px solid #fff}#galeria_zdjec .zdjecia img:hover{border:1px solid silver}#tresc #kontakt{width:100%;overflow:hidden}#tresc #kontakt #kontakttresc,#tresc #kontakt #kontaktmapa{float:left}#tresc #kontakt #kontaktmapa{margin:20px 0 0 70px}#tresc #kontakt p{font-size:17px;color:grey}#tresc #kontakt p a{color:#000}#tresc #kontakt p a:hover{color:grey}#tresc article#ofertas{width:100%}#tresc #oferta{width:auto;overflow:hidden}#tresc .ogrodzeniaOferta{width:auto;float:left}#tresc .ogrodzeniaOferta p{text-align:center}#tresc .ogrodzeniaOferta a{color:#000;text-decoration:none}#tresc .ogrodzeniaOferta a:hover{color:grey;text-decoration:underline}#tresc .ogrodzeniaOferta .ofertazdj{width:250px;height:130px;margin:20px 10px 2px}#tresc .ogrodzeniaOferta .ofertazdj a{display:block}#tresc .ogrodzeniaOferta #jeden{background-image:url(images/ogrodzenia_panelowe_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #dwa{background-image:url(images/ogrodzenia_siatkowe_oferta.JPG);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #trzy{background-image:url(images/klinkier_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #cztery{background-image:url(images/ogrodzenia_lupane_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #piec{background-image:url(images/ogrodzenie_betonowe_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #szesc{background-image:url(images/ogrodzenia_drewniane_oferta.JPG);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #siedem{background-image:url(images/ogrodzenia_kute_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #osiem{background-image:url(images/gabiony_oferta.JPG);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #dziewiec{background-image:url(images/bramy_oferta.JPG);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #dziesiec{background-image:url(images/kamien_oferta.jpg);background-repeat:no-repeat}#tresc .ogrodzeniaOferta #jedenascie{background-image:url(images/podmurowka_oferta.jpg);background-repeat:no-repeat}@media only screen and (max-width:1000px){#wrapper{width:96%}header #title2{position:absolute;top:100px;right:50px;width:450px;height:100px}header nav{margin:190px auto 0;width:auto;border-top:1px solid grey;border-bottom:1px solid grey}header nav li a{text-decoration:none;padding:7px 25px}#baner{display:none}#tresc{margin:30px auto 10px}#tresc article{width:auto;float:left}#tresc aside{width:auto;float:left;clear:both;margin:30px auto}#tresc aside div article{width:340px;margin:0 40px 20px 0;float:left}footer div article{clear:both;width:80%;margin:10px auto}}@media only screen and (max-width:640px){header #title{width:250px;height:100px;position:absolute;top:10px;left:10px}header #title h1{font-size:38px}header #title h2{font-size:16px}header #title2{display:none}header nav{margin:100px auto 0;width:auto}header nav li{list-style:none;float:none}header nav li a{text-decoration:none;padding:20px;display:block}#tresc aside div article img{display:none}#tresc aside div article{width:95%;margin:0 10px 20px 0;float:left}#tresc #kontakt #kontaktmapa{display:none}}