*{box-sizing: border-box;}
header
{
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  font:inherit;
  vertical-align:baseline;
}

body{
	font-size: 30px; 
	background-color: #DFE4EE;
	font-family: 'Basic', sans-serif;
	margin: 0;}

a
{
text-decoration: none;
}
#container
{
position: relative; margin: 0 auto;
width: 921px;

}


#orzel, #header, #ala, #about, #services, #price
{width: 287px; height: 177px}

.floa, .flob, .floc
{
float: left;
margin: 10px;
}
.floa a{display: block;}
#orzel, #header, #ala, #middle, #about, #services, #price, .contact div, .contact div p i 
{
display: table-cell;
vertical-align: middle;
text-align: center;
}

/*gora*/
#orzel 
{
background-color: #FFF;
	}
#orzel img
{
max-width: 85%;

}

#ala
{
	background-color: #FFF; color: #3B5998;
	}
#header span, #ala span {font-size: 22px;}


/*kontakt */
#contact
{
width: 287px; height: 544px;
}

.contact, .contact2
{
	float: left;
	
	background-color: #0E4B7E; color: #FFF;
	font-size: 0.9em;
}

.contact2 
{
margin-top: 20px;
float: right;
}

.contact div, .contact2 div
{
	width: 287px; height: 177px;
}
.contact:first-of-type {margin-bottom: 20px;}
.adress
{
color: #B7B7B7;
font-size: 0.7em;
}
.adress span, .contact a { color: #FFF;}
.contact p{display: none;}
.contact:hover p
{
	display: block;
	position: absolute; margin: -37px 0px 10px 0px;
	width: 287px; height: 177px; 
	opacity: 0.65;
	background-color: #000;
	color: #FFF;
	font-size: 0.6em;	
	padding-top: 25px
 }
.contact p i 
{
color: #FF5252;
width: 287px; height: 134px;
font-size: 1.7em;
}
/*środek*/ 
#middle
{
text-align: justify;
width: 594px; height: 374px;
background-color: #FFF;
color: #000;
font-size: 0.75em;
}
#middle > p {padding: 0px 25px;}

	/*strona glowna */
.ital
{
font-size: 0.75em;
font-style: italic;
color: #3B5998;
text-align:  right;
word-spacing: 15px;
}

#middle span {color: #3B5998;}

	/*uslugi*/
.opcja
{
width: 272px; float: left;
text-align: center;
}
.opcja h2
{
font-weight: normal;
font-size: 1.0em;
width: 200px; margin: 0 auto;
background-color: #FFF;
padding: 5px;
}
.opis
{
width: 544px;
height: 347px;
}
#opis
{
	width: 594px; 
	max-height: 790px;
font-size: 0.95em;
background-color: #EBEBEB;
float: left;
padding-right: 25px;
}
#opis ul {list-style-type: square;}
#opis p
{
padding: 0 15px;
}
.opcja a, #opis a 
{
color: #D83C3C;
}
.opcja a:hover h2{ background-color: #B7B7B7;}
#zaznaczenie {background-color: #EBEBEB;}
	/*kontakt*/
.dane
{
float: left;
width: 297px; height: 117px;
font-size: 0.75em;
padding: 10px 25px;
}

.dane a:hover
{
color: #8A8B8E;
}

iframe
{
margin-bottom:-20px; 
width: 594px; height: 245px;
}

.miasto
{
font-size: 1.4em;
}

	/*o firmie*/
.ofirmie
{
font-size: 0.85em;
}	
	
	
/*"stopka"*/
#about:hover, #ala:hover, #price:hover, #services:hover, #header:hover, #orzel:hover{ color: #000;background-color: #DFE4EE; border-style: dashed; border-color: #000; border-width: 2px; }
#orzel:hover img{max-width: 87%; }
#about {background-color: #000; color: #fff;}
#header, #services, #price
{
color: #000;
background-color: #B7B7B7;
}
#header a {color:  #000;}
	
	@media screen and (max-width:590px){
#elastic {
width: 287px; height: 544px; 
float: left;
margin-bottom: 45px;
margin-right: 10px;
}
#middle
{
text-align: justify;
width: 287px; 
background-color: #FFF;
color: #000;
font-size: 0.65em;
}
ul{margin-bottom: 20px;}
.opis
{
width: 267px; 
}
#opis
{
	width: 267px; 
	font-size: 0.75em;
background-color: #EBEBEB;
float: left;
padding-right: 10px;
}
#opis ul
{
margin-left: -20px;
list-style-type: square;
}
#contact{float: left;width: 267px; height: 544px; margin-bottom: 40px;}
#container {width: 287px;position: relative; margin: 0 auto;}
.floc
{
float: left; margin-top: 10px;
}
iframe
{

width: 268px; height: 305px;
}
.contact div, .contact2 div
{
	width: 267px; height: 177px;
}
.contact:hover p
{
	display: block;
	position: absolute; margin: -37px 0px 10px 0px;
	width: 267px; height: 177px; 
	opacity: 0.65;
	background-color: #000;
	color: #FFF;
	font-size: 0.6em;	
	padding-top: 25px
 }
.contact p i 
{
color: #FF5252;
width: 267px; height: 134px;
font-size: 1.7em;
}
.dane
{
float: left;
width: 267px; height: 117px;
font-size: 0.75em;
padding: 10px 25px;
}
	}


@media screen and (min-width: 590px) and (max-width:925px){
#elastic {
width: 287px; height: 544px; 
float: left;
margin-bottom: 45px;
}
#contact{float: right;width: 287px; height: 544px;}
#container {width: 594px;position: relative; margin: 0 auto;}
.floc
{
float: right; margin-top: 10px;
}
#middle
{
text-align: justify;
width: 574px; height: 374px;
background-color: #FFF;
color: #000;
font-size: 0.75em;
}
.dane
{
float: left;
width: 287px; height: 117px;
font-size: 0.75em;
padding: 10px 25px;
}
iframe
{
margin-bottom: -20px;
width: 574px; height: 245px;
}
#services, #prices
{width: 267px;}
#opis
{
	width: 574px; 
	max-height: 290px;
font-size: 0.95em;
background-color: #EBEBEB;
float: left;
padding-right: 25px;
}
																			}


