html, body {
   font-family: 'trebuchet ms', helvetica, sans-serif;
   background-color: #EEEEEE;
   font-size: 17px;
   color: #003399;
 	margin: 0;
	padding: 0;
}

#kontener { width: 800px; height: auto;  margin:0 auto;	background-color: #DCDCDC; }

a {  color: #003399; text-decoration: none;  }
a:hover { color: #000000;  }
img { border: 0px ; }
h1 { font-size: 26px;}
h2, h3, h4, h5, h6 { font-size: 20px;}
span.sp01 {font-weight: bold; font-size: 19px;}
#strona {
	width: 790px;
	height:auto;
	float: left;
 	padding: 10px 5px 10px 5px;
	overflow: hidden;
   background-color: #DCDCDC;
}

.s0 {
    width: 100%;
	 height:auto;
	 float:left;
	 overflow: hidden;
	 text-align: left;
	 margin-bottom: 0px;
}

.s00 {
    width: 100%;
	 height:auto;
	 float: left;
	 overflow: hidden;
	 text-align: center;
	 margin-bottom: 10px;
}

.s0a {
    width: auto;
	 height:auto;
	 float:left;
}

.s2b {
    width: 385px;
	 height: 100px;
	 float:left;
	 overflow: hidden;
	 margin: 0px 5px 0px 5px;
	 padding: 10px 0px 30px 0px;
	 background-color: #CCCCCC;
}


@media only screen and (max-width: 950px) and (min-width: 750px) {
   #kontener { width: 750px; height: auto;}
   #strona { width: 740px; padding: 5px 5px 5px 5px;}
   img { max-width: 730px; }
	.s2b {width: 355px; margin: 5px 5px 0px 5px;}
}

@media only screen and (max-width: 750px) and (min-width: 450px) {
   #kontener { width: 450px; height: auto;}
   #strona { width: 450px; padding: 5px 0px 5px 0px;}
   img { max-width: 450px; }
	.s2b {width: 215px; margin: 5px 5px 0px 5px;}
}

@media only screen and (max-width: 450px) and (min-width: 300px) {
   #kontener { width: 300px; height: auto;}
   #strona { width: 300px; padding: 5px 0px 5px 0px;}
   img { max-width: 300px; }
   .s2b { width: 290px; height: auto; margin: 5px 5px 0px 5px;}

}

@media only screen and (max-width: 300px) {
   #kontener { width: 300px; }
   #strona { width: 300px; padding: 5px 0px 5px 0px;}
   img { max-width: 300px; }
   .s2b { width: 290px; height: auto; margin: 5px 5px 0px 5px;}

}