.div {	border:1px red solid; 	}

body {	background-color:rgb(255,255,255);  margin:0;  color:rgb(0,0,0);  word-spacing:0.1em;  letter-spacing:0.07em;  
		font-family: "Lucida Sans", Tahoma, "Palatino Linotype", "Liberation Sans", "DejaVu Sans", "Bitstream Vera Sans", Arial, Helvetica, "sans-serif";   }
td { 		padding:0;  vertical-align:top;  }
table { 	border-collapse:collapse;  empty-cells:show;}
img {		border:0;  display:block; }
* 	{	box-sizing:border-box; 	}

.tummin	 {		color:	rgb(15,96,117);    } 
.tummempi {		color:	rgb(21,134,163);   }
.perussininen {	color:	rgb(25,157,191);   }
.vaaleampi {		color:	rgb(27,170,196);   }
.vaalein {		color:	rgb(31,180,219);   }
.harmaanvaalea {	color:	rgb(139,210,255);   }


h1 {			padding:66px 5% 33px 5%; margin:0;  font-size:222%;  color:rgb(0,109,153);  font-weight:normal;  text-align:center;       }
h2 {			padding:1em 0;  		margin:55px 0 0 0;  font-size:144%; color:rgb(0,0,0);    }
h3 {			padding:0;  		margin:55px 0 11px 0;  font-size:122%; color:rgb(0,0,0);     }
p {			padding:22px 0 0 0;  	margin:0;  font-size:111%;  line-height:155%;   }
.isoteksti {	font-size: 133%;  line-height:155%;   }
.pampula {		padding:0px 0px 0px 7%;  margin:11px 0 0 0;   font-size: 111%;  background-image:url(kuvat/pallomusta.png);  background-size:0.4em;  background-position: 0 0.56em;  background-repeat: no-repeat;  line-height:155%;   }

.apuotsikko {	padding-top:33px; 	}
.leveeotsikko {	font-size:177%;  color:rgb(234,252,255);  padding: 19px 11px 14px 11px;  text-align:center;  margin: 99px 0 0 0;  width:100%;  
			background-color:rgb(25,157,191);   font-weight: normal;  word-spacing: 0.14em;  letter-spacing: 0.07em;  display: table;   }

.alateksti {	background-color:rgb(244,244,244); padding: 11px 5%;  margin: 0;  font-size: 94%;  line-height:144%;   }



/*    alueet    .......................................................................................................................................................        */

.sivu {		width:100%;  display:table;  padding-bottom:77px; border-width:0 0 22px 0;  border-color:rgb(25,157,191); border-style:solid; 	}
.aluelevee {	width:100%;  display:table; 	}
.aluevakio {	width:100%;  padding: 0 11%;  display: table; }



/*    logo   .......................................................................................................................................................        */

.alueimage {	width:100%;  display:flex;  border-width:22px 0 0 0;  border-color:rgb(25,157,191); border-style:solid;    }
.logolohko { 	width:30%;  margin:11px 0;  background-color:rgb(25,157,191);   display:table;       }
.logokuva {	width:100%;       }
.imagelohko { 	width:35%;    display:table;       }
.imagekuva {	width:80%;  margin:22px auto;        }
.imagelohko1 { 	       }
.imagelohko2 { 	      }



/*    navigointi    .......................................................................................................................................................        */

nav {		margin:0; height:3em;  width:100%;  background-color:rgb(25,157,191); display:table; position:relative; 	    }
ul {			position: absolute;  top:0;  left:calc(50% - 18em);   
			list-style-type:none;  margin: 0;  padding:0;    }
li {			display:inline-block;  float:left;	font-weight:bold;  letter-spacing: 0.1em;    }
li a {		width:12em;  height:3em; padding: 1em 1em 1em 1em;  text-align:center; color:rgb(255,255,255);  
			text-decoration:none;  display:block;  }
li:hover a {	background:rgb(0,0,0); color:rgb(255,255,255);  }
li ul {		display:none;  }
li ul li {		display:block;  float:none;  }
ul li a:hover + .hidden, .hidden:hover {	display:block; }
.nnv {					display:none;   }
input[type=checkbox]{				display:none;  -webkit-appearance: none; }
input[type=checkbox]:checked ~ #menu{	display:block;  }

.nnkele {	 	bottom: 0px;  right: 0px;  position: fixed;   }
.nnk:link { 	background-image: url(kuvat/nnk255.png);   }
.nnk:visited { 	background-image: url(kuvat/nnk255.png);     }
.nnk:hover { 	background-image: url(kuvat/nnk255.png); background-color:rgb(0,0,0);    }
.nnk {	 	border:1px white solid;  background-color:rgb(25,157,191);   height:50px;  width:50px;  background-size:30px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }




.tekstilinkki:link {	color: rgb(49,79,149);   text-decoration: underline; }  
.tekstilinkki:visited {	color: rgb(155,155,155); text-decoration: underline; }
.tekstilinkki:hover {	color: rgb(255,145,0);   text-decoration: none; }



.alueingressi {	padding: 0 7%;  display:flex;  justify-content:space-between; 	}
.ingressibx  {		width:45%;   margin:66px 0 0 0;      }
.ingressibx p {	padding:0;  margin:11px 0px;  font-size:122%;    line-height:155%;    }


.boxialue2{		width:100%;  padding: 0 11%;  display: flex; justify-content:space-between; 	}
.boxi2 {		margin:66px 0 0 0; width:45%;       }
.boxikuva2 {	width:100%;   	}
.boxi21 {		width:60%;       }
.boxi22 {		width:20%;       }

.boxi201 {		display:flex;  border:1px rgb(111,111,111) dotted;  }
.laatikkovasen {	width:50%;  padding-bottom:22px; background-color:rgba(111,111,111, 0.1);   	}
.laatikko1 {	color:rgb(255,255,255);  background-color:rgb(111,111,111);  font-weight:bold;  padding: 11px 22px; 	}
.laatikko2 {	font-weight:bold;  padding: 22px 22px; 	}
.laatikko3 {	padding: 11px 22px; 	}
.laatikkooikea {	width:50%;  	}

.boxialue3{	width:100%;  padding: 0 11%;   display: flex; justify-content:space-between; 	}
.boxi3 {		margin:66px 0 0 0;  padding:0 0 0 0;  width:30%;  border:1px rgb(111,111,111) dotted;	     }
.boxi3 p {	padding:11px 22px 22px 22px;      }

.yhteysboxi {	border:1px rgb(25,157,191) dotted;  padding:0;  background-color:rgba(25,157,191, 0.1); 	}
.yhteysboxi h3 {	padding:22px 22px 22px 33px;  margin:0;  background-color:rgba(25,157,191, 0.2); 	}
.yhteysboxi p {	padding:0px 22px 0 33px; 	}
iframe {	border-width:0;  	}








@media screen and (max-width: 1500px) 	{	/*	------------------------------------------------------------------------------------------------------------------------	*/



						 	}	/*	--------------------    */




@media screen and (max-width : 1200px)	{	/*	------------------------------------------------------------------------------------------------------------------------	*/




.boxi22 {		width:30%;       }
					
.alueyhteys {	flex-direction:column;   	}
.yhteyslohko {	padding-left:11%;  width:100%;  max-width:666px;  margin-left:auto;  margin-right:auto;    }
.karttalohko {	width:100%;  max-width:666px;  margin-left:auto;  margin-right:auto;    }

						 	}	/*	--------------------    */





      
@media screen and (max-width : 900px)	{	/*	------------------------------------------------------------------------------------------------------------------------	*/

.aluevakio {	padding: 0 7%;  }
.alueimage {	border-width:22px 0;      }
.logolohko { 	width:50%;          }
.imagelohko { 	width:50%;           }
.imagekuva {	width:90%;  margin:22px auto 0 auto;        }
.imagelohko1 { display:none;	       }
.imagelohko2 { 	      }

.alueingressi {	flex-direction:column;	}
.ingressibx  {		width:100%;   margin:66px 0 0 0;      }
.allekkain {		margin-top:0; 	}

nav {		margin: 0; width:90%;  max-width:333px;  background-color:transparent; position:absolute;  top:36px;  right:4px;  z-index:111;   }
ul {			position:static;  display:none; }
li {			margin-left:0;  margin-right:0px;	float:right; }
ul li a {		background:linear-gradient( rgb(25,157,191) , rgb(27,170,196) ); padding: 2em 1em;  height:auto;  border-width: 1px 0 0 0;  border-color: rgb(155,155,155);  border-style:solid;   }
li:hover ul a {	height:auto;  	}

.nnv:link {	background-image: url(kuvat/nnv255.png);        }
.nnv:visited {	background-image: url(kuvat/nnv255.png);        }
.nnv:hover {	background-image: url(kuvat/nnv255.png); background-color:rgb(0,0,0);    }
.nnv {	 	background-image: url(kuvat/nnv255.png); border:1px white solid;   float:right; background-color:rgb(25,157,191);   height:40px;  width:40px;  background-size:25px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }

ul li, li a {  width:100%;  text-align:center;  }

.nnk {	 	height:40px;  width:40px;  background-size:25px;  margin:4px;   }


.boxialue2{	flex-direction:column; padding: 0 7%;  	}
.boxi2 {		width:100%;       }
.boxi22 {		max-width:444px;  margin-left:auto;  margin-right:auto;       }

.boxialue3{	flex-direction:column; padding: 0 7%; 	}
.boxi3 {		width:100%;       }





/*    yhteydet    */

.yhteyslohko {	    }
.karttalohko {	     }



						 	}	/*	--------------------    */











      
@media screen and (max-width : 700px)	{	/*	------------------------------------------------------------------------------------------------------------------------	*/

.aluevakio {	padding: 0 2%;  }
.boxialue2{	padding: 0 2%;  }
.boxialue3{	padding: 0 2%;  }
.alueimage {	width:100%;  flex-direction:column;   }
.logolohko { 	width:100%;           }
.logokuva {	width:100%; max-width:300px;  margin:11px auto;       }
.imagelohko { 	width:100%;          }
.imagekuva {	width:80%;  margin:22px auto;        }

.alueylin {		background: rgb(234,252,255);  }
.ilmoitusalue{	width:100%;  margin:0 0 22px 0; float:none; 	}

.alueimage {	height:auto; padding: 0 0 33px 0;      }

.boxi201 {		flex-direction:column;  }
.laatikkovasen {	width:100%;  	}
.laatikkooikea {	width:100%;  	}
						 	}	/*	--------------------    */










/*	kestotietoa           --------------------------------------------------------------------------------------------   */

.levee100 {		width:100%;  }
.erotin {		width: 100%;  height: 1px;  display: block;  }
.eimarginaalia {	margin-right: 0;   }

.vasemmalle {	text-align: left; }
.keskelle {		text-align: center; }
.oikealle {		text-align: right; }
.kuvakeskelle {	margin-left: auto;  margin-right: auto; }

.vahvennettu {	font-weight: bold;  }
.yhdessa {		white-space: nowrap;   }

.punainen { 	color: rgb(200,0,0);  } 

.rako6000 {	margin-top: 60px; }
.rako5000 {	margin-top: 50px; }
.rako4000 {	margin-top: 40px; }
.rako3000 {	margin-top: 30px; }
.rako2000 {	margin-top: 20px; }
.rako1000 {	margin-top: 10px; }

.rako000200  {	margin-bottom: 200px; }
.rako0040 {		margin-bottom: 40px; }
.rako0030 {		margin-bottom: 30px; }
.rako0020 {		margin-bottom: 20px; }

.rako4040 {	margin-top: 40px;  margin-bottom: 40px; }
.rako3030 {	margin-top: 30px;  margin-bottom: 30px; }
.rako2020 {	margin-top: 20px;  margin-bottom: 20px; }

.sisus6000 {	padding-top: 60px; }
.sisus5000 {	padding-top: 50px; }
.sisus4000 {	padding-top: 40px; }
.sisus3000 {	padding-top: 30px; }
.sisus2000 {	padding-top: 20px; }

.sisus0050 {	padding-bottom: 50px; }
.sisus0040 {	padding-bottom: 40px; }
.sisus0030 {	padding-bottom: 30px; }
.sisus0020 {	padding-bottom: 20px; }

.sisus6060 {	padding-top: 60px;  padding-bottom: 60px; }
.sisus5050 {	padding-top: 50px;  padding-bottom: 50px; }
.sisus4040 {	padding-top: 40px;  padding-bottom: 40px; }
.sisus3030 {	padding-top: 30px;  padding-bottom: 30px; }
.sisus2020 {	padding-top: 20px;  padding-bottom: 20px; }

.sisus6040 {	padding-top: 60px;  padding-bottom: 40px; }
.sisus5030 {	padding-top: 50px;  padding-bottom: 30px; }
.sisus4020 {	padding-top: 40px;  padding-bottom: 20px; }
.sisus3010 {	padding-top: 30px;  padding-bottom: 10px; }

.sisus2060 {	padding-top: 20px;  padding-bottom: 60px; }
.sisus2050 {	padding-top: 20px;  padding-bottom: 50px; }
.sisus2040 {	padding-top: 20px;  padding-bottom: 40px; }
.sisus2030 {	padding-top: 20px;  padding-bottom: 30px; }

.sisus6000 {	padding-top: 60px;  }
.sisus5000 {	padding-top: 50px;  }
.sisus4000 {	padding-top: 40px;  }
.sisus3000 {	padding-top: 30px;  }
.sisus2000 {	padding-top: 20px;  }
.sisus1000 {	padding-top: 10px;  }
.sisus0000 {	padding-top: 0;  }

.marginaali8000 { margin-left: 80px;    }
.marginaali4000 { margin-left: 40px;    }
.marginaali3000 { margin-left: 30px;    }
.marginaali2000 { margin-left: 20px;    }

.sisennys8000 { padding-left: 80px;   }
.sisennys4000 { padding-left: 40px;   }
.sisennys3000 { padding-left: 30px;    }
.sisennys2000 { padding-left: 20px;    }

.nega3000 {	margin-top: -30px; }
.nega2000 {	margin-top: -20px; }
.nega1000 {	margin-top: -10px; }
.nega0500 {	margin-top: -5px; }