/*11.11. pois leveydet pikseleinä ja img*/

body
{
margin:0;
padding:0;
background-color: #E9EDF0;
/*width:100%; */ /* jos tässä 100% ni menee ryuudun reunasta reunaan*/
width: 1000px; /*jos tässä on % niin ei toimi IE puhelimessa*/
margin-left:auto;
margin-right:auto;
position:relative;
}

DIV 
{
/*width:100%*/
}

H1, H5
{
color:#FFFFFF;
}

.alkuSivu
{
margin:0;
padding:0;
background-color: #024E80;
/*width: inherit;*/
width: 100%;
padding-bottom:5px;
}

.keskiSivu
{
margin:0;
padding:0;
background-color: #32739D;
width: 100%;
padding-bottom:5px;
padding-top:5px;
}

.loppuSivu
{
margin:0;
padding:0;
padding-bottom: 5px;
padding-top:5px;
background-color: #FFFFFF;
width: 100%;
}

p
{
font-family: Arial;
/*font-size: 1.2 em;*/
color: black; /*VÄRI SINISEKSI*/
/*text-align:justify; /*tasaa reunat*/
}

p.center
{
text-align:center;
}

IMG /*jos kuvaa ei määritely tulee just ennen h1*/
{
float: right;
padding: 10%;
}

.sivu
{
 	margin-left:auto;
	margin-right:auto;
  position:relative;
  width: 90%;
	//width: 900px; /* tää ei tule taustaan vain keskellä olevaan tekstiin*/
	padding-left: 20px; /*8.10.12*/
	padding-right: 20px;
}	

ul
{
clear:both;
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
font-weight:bold;
color: #FFFFFF; /*tav tex*/
background-color: #024E80;
text-align:center;
/*text-transform:uppercase;*/
padding:5px;
width: 18%;
//width:170px;
float: left;
}

.nav
{
color:#FFFFFF;
display:block;
}

a:link,a:visited
{

text-decoration:none;
}

a
{
text-decoration: none;
}

a:link {
background-color:inherit;
color: inherit;
}   
a:visited {
background-color:inherit;
color: inherit;
} 
a:hover {
background-color:#FFFFFF;
color: black;
}   
a:active {
background-color:#FFFFFF;
color: black;
}  

a.sivunLinkki
{
clear:both;
color: black;
text-decoration: underline;
}

/*puhelimet:Nokia Lumia & iPod*/
/*IE EI LUE TÄTÄ -lukee ainakin osittain*/
@media screen and (max-width: 500px)
{

body
{
/*width: 100%;*/
}

.sivu
{
/*width:98%;*/
}

}


/*tablets*/
//@media screen and (max-width: 770px)
//{
//.sivu
//{
/*width:95%;*/
//} 
//}/* end tablets*/




/*tablets*/
@media screen and (max-width: 799px)
//{

/*img.multiSize
{
display: inline;
padding-left:10px;
padding-right:10px;
max-width: 80%;
}*/

/*img
{
width: 20%;
display: inline;
padding-top: 5px;
}*/

//}/* end tablets*/

/*puhelimet:Nokia Lumia & iPod*/
@media screen and (max-width: 500px)
{

body
{
max-width:100%;
}

img
{
max-width:25%;
float: none;
padding: 5px;
}

.alkuSivu
{
width: 100%;
}

.keskiSivu
{
width: 100%;
}

.loppuSivu
{
width: 100%;
}

H1 H2 H3 /*fontit pitäis määritellä myös alkuun*/
{
font-size: 130%; /*ei lue tätä*/
}

p
{
font-size: 1.2em; /*samalla pitää laittaa siten kaikki muutkin fontit ja tausta*/
}

.sivu
{
max-width:95%;
}


}


