* {
margin: 0; 
padding: 0;
 }
 
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
   display: block;
}

audio, canvas, embed, keygen, meter, progress, video {
	display: inline-block;
}

[hidden] {
	display: none;
}
 html { 
  background: url(sd.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

html, body {
	width: 100%;
    height: 100%;
}

#procent {
right: 0px;
top:30%;
height:102px;
width:124px;
margin:0;
padding:0;
position:absolute;
}

#w3 {
right: 0px;
top:45%;
height:102px;
width:120px;
margin:0;
padding:0;
position:absolute;
}

.logo{
margin: 50px auto;
width: 230px;
height: 300px;
}

h1 /* stowarzyszenie przyjaciół */
{
	font-size: 40px;
	color: white;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	text-align: center;
}

nav{
margin: 0 auto;
width: 633px;
min-height: 150px;
height: auto !important;
height: 100%;
}

.box{
margin: 5px;
float: left;
width: 148px;
height: 148px;
background-color: #efefef;
text-align: left;
}


.box p {
	color: #4f582b;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 17px;
	padding: 0 0 0 5px;
}

.wrapper {
width:100%; 
min-height: 100%;
height: 900px;
margin: 0 auto;
text-align: center;
}

.contain {
	margin: 0 auto;
	width: 640px; 
	min-height: 100%;
	height: auto !important;
	height: 100%;
	text-align: left;
}

.contain P {
	color: #606060;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 16px;
	padding: 0 0 30px 0;
	line-height: 24px;
}


.top {
width:100%; 
height: 25px;
background-color: #5c5f22;
}

aside{
margin: 0 auto;
width: 640px;
height: 25px;
background-color: #5c5f22;
}

aside ul {/* wygląd elementu - ul */
list-style-type: none;
text-decoration: none;
 }
 
aside ul p {
color:  #ff7800;
}

aside ul li a { /* wygląd elementów - a */
display: inline;
float: right;
font-family: 'Dosis', sans-serif;
font-weight: 100;
font-size: 16px;
margin: 2px 16px 0 0;
text-decoration:none;
text-align:center;
color:#efefef;
 }

aside ul li a:hover {/* wygląd elementu - a - w momencie najechania na niego kursorem myszki */
color:white;
}

.button{
margin: 60px 5px 0 5px;
float: left;
width:  69px;
height: 69px;
background-color: #efefef;
text-align: left;
}

.button p {  /* tytuły boxów*/
	display: block;
	color: #4f582b;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	font-size: 12px;
	padding: 0 0 0 3px;
}

.button img{
margin: -13px 0 0 0;
}

.center {
margin: 0 auto;
width: 680px;
min-height: 100%;
height: auto !important;
}

.herby {
margin: 0 auto;
width: 900px; 
height: 170px;
text-align: left;
}

.herby a
{
text-decoration: none;
}

.herby p{
	color: #606060;
	line-height: 20px;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 15px;
}


#event{
margin: 30px 0 0 7px;
padding: 4px 0 5px 0;
float: left;
width: 620px;
height: 36px;
text-align:center;
background-color:#F0E3D2;
font-family: 'Lato', sans-serif;
font-weight: 800;
font-size: 30px;
}

#event a{
text-decoration:none;
color: #6C300E;
}

#event2{
float: left;
margin: 30px 0 0 5px;
padding: 4px 0 5px 0;
float: left;
width: 622px;
height: 51px;
text-align:center;
border-style: solid;
border-width: 1px;
border-color: #ffffff;
}

#event3{
float: left;
margin: 30px 0 0 5px;
padding: 4px 0 5px 0;
float: left;
width: 622px;
height: 51px;
text-align:center;
border-style: solid;
border-width: 1px;
border-color: #ffffff;
}


#event2 p{
	text-align:center;
	color: #ffffff;
font-family: 'Fjalla One', sans-serif;
font-weight: 400;
font-size: 33px;
padding: 7px 0 0 0;
}

#event3 p{
	text-align:center;
	color: #ffffff;
font-family: 'Rock Salt', cursive;
font-weight: 400;
font-size: 31px;
padding: 0 0 0 0;
margin: -12px 0 0 0;
}




#event1{
float: left;
margin: 30px 0 0 5px;
padding: 0px 0 5px 0;
float: left;
width: 622px;
height: 51px;
text-align:center;
background-repeat: no-repeat;
border-style: solid;
border-width: 1px;
border-color: #000000;
}



#event_title{
width: 280px;
float: left;
text-decoration:none;
color: #ffffff;
font-family: 'Lato', sans-serif;
font-weight: 600;
font-size: 20px;
margin: 0 100px 0 0;
}

#event2 img{
float: left;
margin: 3px 0 0 60px;
width: 500px;
}

#event_text{
float: left;
width: 254px;
font-family: 'Lato', sans-serif;
font-weight: 300;
font-weight:300;
font-size: 20px;
padding: 2px 0 10px 0;	
color: #ffffff;

}


#gmina_police{
float: left;
margin: 0 10px 0 0;
width: 70px; 
height: 85px;
}
#gmina_police2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 70px; 
height: 50px;
}

#powiat_policki{
float: left;
background: url('img/powiat.png') no-repeat center top;
margin: 0 10px 0 0;
width: 70px; 
height: 85px;;
}

#powiat_policki2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 70px; 
height: 50px;
}

#marketing_milionera{
float: left;
margin: 0 10px 0 0;
width: 90px; 
height: 85px;
}

#marketing_milionera2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 90px; 
height: 50px;
}

#odkrywca{
float: left;
margin: 0 10px 0 0;
width: 150px; 
height: 85px;
}

#odkrywca2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 150px; 
height: 50px;
}

#wirtualne_police{
float: left;
margin: 0 10px 0 0;
width: 150px; 
height: 85px;
}
#wirtualne_police2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 150px; 
height: 50px;
}

#gm_plast{
float: left;
margin: 0 10px 0 0;
width: 150px; 
height: 85px;
}

#gm_plast2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 150px; 
height: 50px;
}

#trans_net{
float: left;
margin: 0 10px 0 0;
width: 150px; 
height: 85px;
}
#trans_net2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 150px; 
height: 50px;
}

#sama_rama{
float: left;
margin: 0 ;
width: 100px; 
height: 85px;
}
#sama_rama2{
text-align: center;
line-height: 17px;
margin: 0 10px 0 0;
float: left;
width: 90px; 
height: 50px;
}

footer{
width:100%; 
height: 200px;
background-color: #efefef;
text-align: center;
margin: 0 0 0 0;
}

footer p {
	color: #606060;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	font-size: 17px;
	text-align: left;
	text-align: center;
	padding: 5px 0 0 0;
}

.copyright{
width: 100%;
height: 21px;
text-align: center;
background-color: #5c5f22;
}

.copyright p{
	color: #81834a;
	font-family: 'Lato', sans-serif;
	font-weight: 600;
	font-size: 10px;
	padding: 4px 0 0 0;
}

.push {
height: 200px; /*klasa .push musi mieć tę samą wysokość co klasa .footer */
}