.div {	border:1px red solid; 	}

body {	margin:0;  word-spacing:0.12em;  letter-spacing:0.1em; 
	font-family:Georgia, Verdana, "Lucida Sans", Tahoma, "Palatino Linotype", "Liberation Sans", "DejaVu Sans", "Bitstream Vera Sans", Arial, Helvetica, "sans-serif";   }
.kursiivifonttienvarasto { 	font-family:"Abyssinica SIL", "Liberation Serif", FreeSerif, Serif;	 }

td { 	padding:0;  vertical-align:top;  }
table { 	border-collapse:collapse;  empty-cells:show;}
img {	border:0;  display:block; }
* {	box-sizing:border-box; 	}
html {	scroll-behavior:smooth;	}


.liukusavypysty { 	background:linear-gradient( hsl(111,80%,40%) , hsl(111,80%,100%) ); }


.keltainen {	background-color:hsl(55,100%,50%);	color:rgb(255,234,0);  	}
.vihrea	 {	background-color:hsl(88,96%,33%);	 	}




/*    perustekstit    */

h2 {		margin:22px 0 0 0;  padding:0; font-size:155%;  font-style:normal;  color:hsl(0,0%,0%);  line-height:145%;    }
h3 {		margin:22px 0 0 0;  padding:0; font-size:133%;  font-style:normal;  color:hsl(0,0%,0%);  line-height:145%;    }
p {		padding:11px 0 0 0;  margin:0; font-size:111%; color:hsl(0,0%,0%);  line-height:145%;    }
.pamp {		font-size:111%;   padding:0px 0px 0px 44px;  margin:11px 0 0 1px;  background-image:url(kuvat/pallomusta.png);  background-size:0.4em;  background-position:0 0.4em;  background-repeat:no-repeat;  line-height:145%;  }
 
.leveeotsikko {	text-align:center; font-size:222%;  background-color:hsl(55,100%,50%);  color:hsl(0,0%,0%);  
		padding:33px 3%;  margin:0;  width:100%;  font-weight: normal;  display: table;   }
.leveeteksti {	text-align:center; font-size:144%;  color:hsl(88,96%,38%);  font-style:italic;
		padding:33px 3% 0 3%;  margin:0;  width:100%;  font-weight: normal;    }


/*    logo ja navigointi    */

.sivu {		width:100%;  max-width:1920px;  margin-left:auto;  margin-right:auto; 	}
.alueylin {	padding:0; background-color:hsla(0,0%,100%, 0.7);  width:100%;  display:table;  position:relative; 	}

.kielilinkkilohko {		margin:50px 0 0 5%;  width:60px;  float:left; display:table; }
.kieliele {		line-height:0;  width:100%;  padding:8px 0; display:block; }
.kielilinkki:link {		text-decoration: none; }  
.kielilinkki:visited {	text-decoration: none; }
.kielilinkki:hover {	text-decoration: none;  opacity:0.5;  }
.kielilinkki {		width:100%; display:block;  }
.kielilippu {		width:100%;  	}

.logolohko { 	margin:0 0 0 33px;  width:300px;  background-color:hsl(0,0%,100%); float:left;  display:table; }
.logokuva {	width:220px;  margin:40px auto;    	}

.imageslogan {	width:30em;  padding:22px 3%;  font-style:italic;  font-size:144%; 
color:hsl(88,96%,28%);  
color:hsl(0,0%,33%);
line-height:145%; text-align:right; float:right;   }

nav {		bottom:3em;  right:4%;  width:45em;  font-size:1em;  z-index:1111;  position:absolute;   }
ul { 		width:100%; list-style-type:none;  margin:0;  padding:0;  position:absolute; 	   }
li { 		display:inline-block;  float:left; text-align:center; 	 }			
li a { 		width:14em;  min-width:4em;  margin:0 1em 0 0;  padding:0.5em;  
		background:hsl(55,100%,50%); color:hsl(0,0%,0%); 
		text-decoration:none;  text-align:center;  display:block;   }	
li:hover a { 	background:hsl(88,96%,44%);  color:hsl(0,0%,0%);  }								
li ul { 		display:none; }											
ul li a:hover + .hidden, .hidden:hover { 	display:block; }
							
.nnvlink { 			display:none;	 }										
input[type=checkbox]{     		display:none;    -webkit-appearance:none; }				
input[type=checkbox]:checked ~ #menu{  	display:block;	 }	


.nnkele {	 	bottom:14px;  right:4px;  position:fixed;   }
.nnk:link { 	background-image:url(kuvat/nnkoy0.png);   }
.nnk:visited { 	background-image:url(kuvat/nnkoy0.png);     }
.nnk:hover { 	background-image:url(kuvat/nnkoy0.png);  background-color:hsl(88,96%,44%);  }
.nnk {	 	border:1px hsl(0,0%,100%) solid; background-color:hsl(55,100%,50%);   height:50px;  width:50px;  background-size:30px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }








/*    alueet    */

.aluevakio {	padding-left:7%;  padding-right:7%;  width:100%;  display:table; }
.apadiso { 	padding-bottom:44px; }

.boxialue2 {	margin:44px 0 0 0;  width:100%;  display:flex;  justify-content:space-between;  } 
.boxi2 {		width:45%;  padding:0;  position:relative;   }
.boxiotsikko2 {	padding:11px 0 0 0;  font-size:144%;   line-height:145%;  font-weight:bold;   }
.kuultoalue {	width:100%;  position:relative; 	}
.boxikuva2 {	width:100%;	}
.kuultootsikko2 {	margin:0px;  padding:1em 1em;  font-size:177%;  text-align:center;  background-color:hsla(0,100%,100%, 0.8);  
		width:100%;  position:absolute;  top:0;   	}
.kuvateksti2 {	padding:12px 3% 0 3%;  font-size:99%;  line-height:145%; }
.tausta1 {	background-image:url(kuvat/tausta1.jpg);  min-height:111px; background-repeat:no-repeat;  background-size:cover;    }
.tausta2 {	background-image:url(kuvat/tausta2.jpg);  min-height:111px; background-repeat:no-repeat;  background-size:cover;    }
.taustateksti1 {	padding:1em 2em;  font-size:222%;  text-align:center;  color:hsl(0,0%,100%);  text-shadow:1px 1px hsl(88,96%,38%);  
		line-height:145%;  text-align:center; position:relative;  top:50%;  transform:translateY(-50%);	}


.boxialue3 {	margin:44px 0 0 0;  width:100%;  display:flex;  justify-content:space-between;  } 
.boxi3 {		width:30%;  padding:0;    }
.boxiotsikko3 {	padding:11px 0 0 0;  font-size:133%;   line-height:145%;   }
.boxikuva3 {	width:100%;	}

.boxialue123 {	margin:22px 0 0 0;  width:100%;  display:flex;  justify-content:space-between;  } 
.boxi13 {		width:25%;  padding:0;    }
.boxi23 {		width:70%;  padding:0;    }
.boxiotsikko3 {	padding:11px 0 0 0;  font-size:133%;   line-height:145%;   }
.boxiraami {	margin-top:33px;  padding:11px 3% 22px 9%; border:1px hsl(0,0%,22%) dotted;  border-radius:33px;  max-width:33em; 	}


.boxialue4 {	margin:44px 0 0 0;  width:100%; display:flex;  justify-content:space-around;  flex-wrap:wrap;  	}
.boxi4 {		padding:0 0% 22px 0%; width:20%;  	}
.boxi4 h2 {	padding: 22px 0 0 0;  margin:0;  font-size: 122%;   }
.boxi4 p {	padding: 11px 0 0 0;  margin:0;  font-size: 111%;   line-height:145%;   }
.pamp4 {		padding:0px 0px 0px 22px;  margin:11px 0 0 0;  background-image:url(kuvat/pallomusta.png);  background-size:0.3em;  background-position:0 0.5em;  background-repeat:no-repeat;    }

.boxi41 {		background-image:url(kuvat/boxi41.jpg);  background-position:50% 50%;  background-size:cover;  }
.boxi44 {		background-image:url(kuvat/boxi44.jpg);  background-position:50% 50%;  background-size:cover;  }



.yhteysalue {	padding:44px 11%;  width:100%;  display:flex;  justify-content:space-between;  flex-wrap:wrap; 
		background-image:url(kuvat/yhteyskuva.jpg);  background-position:50% 20%;  background-size:1920px;  } 
.yhteysboxi {	width:700px;  max-width:100%;  margin:11px auto;  padding:22px 2% 33px 11%; background-color:hsla(55,100%,50%, 0.97); color:hsl(0,0%,0%);  }
.yhteysotsikko {	font-size:122%;  padding:11px 0 0 0;  margin:0;  font-weight:bold;   	}
.yhteysteksti {	font-size:111%;  padding:7px 0 0 0;  margin:0;  	}
.yhteysrako {	margin-top:17px; 	}




/*    lohkot    */

.capiylin {  	background-image:url(kuvat/capiylin.jpg);  height:666px; background-position:50% 50%; 
		position:relative;  background-attachment:fixed;  background-repeat:no-repeat;  background-size:1920px;  } 
.capi2 { 		background-image:url(kuvat/capi2.jpg);  height:444px;  background-position:50% 50%; 
		position:relative;  background-attachment:fixed;  background-repeat:no-repeat;  background-size:1920px;  }
.capi3 { 		background-image:url(kuvat/capi3.jpg);  height:444px;  background-position:50% 50%; 
		position:relative;  background-attachment:fixed;  background-repeat:no-repeat;  background-size:1920px;  }

.caption { 	position:absolute; left:0;  bottom:0;  width:100%;  text-align:center;      }
.capislogan {	padding:0;   font-size:222%;  width:100%;  padding:1em; color:hsl(0,0%,22%);  
		background:hsl(55,100%,50%);   	}
.imagecaption { 	margin:222px 0 0 0; width:100%;  text-align:center; color:hsl(0,0%,100%); }



/*    harvinaiset    */

.haiveviiva {	width:55%;   background:linear-gradient(90deg, transparent, hsl(0,0%,50%), transparent );   
		margin:0 auto; height:1px;  display:table;    }

.ylapadding {	padding-top:55px; 		}
.alapadding {	padding-bottom:55px; 	}
.ylamatala {	margin-top:33px; 		}
.alamatala {	margin-bottom:33px; 	}





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

nav {		bottom:3em;  right:2%;  width:45em;  font-size:1em;  z-index:1111;  position:absolute;   }
.boxi4 {		padding:11px 2% 33px 5%;  width:50%;  	}
.boxi41 {		background-image:url(kuvat/boxi41.jpg);  background-position:50% 50%;  background-size:cover;  }
.boxi44 {		background-image:url(kuvat/boxi44.jpg);  background-position:50% 50%;  background-size:cover;  }


				}	/*	========================================	*/



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

.imageslogan {	width:100%; text-align:center;  float:none;  display:table;      }


.leveeotsikko { 	font-size:177%;  } 



nav {		top:14px;  right:4px;  width:90%;  max-width:250px;  background:transparent;  height:auto;  }
ul {		margin-top:66px;  width:100%;  position:absolute;  display:none; }
li {		margin:0;	float:none;  margin:0;   }
ul li a {		padding:2em 0;  margin:0;     }
li a { 		background-color:hsl(55,100%,50%);   border-width: 0 0 1px 0;  border-color:hsla(220,100%,88%, 0.6);  border-style:solid;  }
li:hover a {	background-color:hsl(88,96%,44%); }
ul li, li a {  	width:100%;  text-align:center;   }


.nnv:link {	background-image:url(kuvat/nnv0.png);       }
.nnv:visited {	background-image:url(kuvat/nnv0.png);        }
.nnv:hover {	background-image:url(kuvat/nnv0.png);  background-color:hsl(88,96%,44%);     }
.nnv {	 	float:right;  
		background-image:url(kuvat/nnv0.png); background-color:hsl(55,100%,50%); 
		height:50px;  width:50px;  background-size:30px;  margin-bottom:0px;   
		background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }


.aluevakio {	padding-left:3%;  padding-right:3%;  }

.boxialue2 {	flex-direction:column;   } 
.boxi2 {		width:100%;    }
.pilari900 {	margin-top:0;  	}
.pilariv {	padding-bottom:0;	}
.pilario {	padding-top:0;  margin-top:0;	}

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

.boxialue123 {	flex-direction:column;   } 
.boxi13 {		width:100%;  padding:0;    }
.boxi23 {		width:100%;  padding:0;    }
.boxiraami {	margin-top:22px;  padding:22px 33px 44px 15%; border:1px hsl(0,0%,22%) dotted;  border-radius:33px;  	}


.yhteysalue {	padding:111px 5%;  }
.yhteysboxi {	width:48%;  padding:22px 2% 33px 5%;  }



				}	/*	========================================	*/







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

.yhteysalue {	padding:111px 5%;   } 
.yhteysboxi {	width:70%;  margin: 11px auto; padding:22px 2% 33px 11%;  }

				}	/*	========================================	*/







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

.kielilinkkilohko {	margin:30px 0 0 5%;  width:60px;  float:left; display:table; }

.logolohko { 	margin:0 0 0 22px;  width:calc(95% - 82px);   float:left;  display:table; }
.logokuva {	width:220px;   margin-left:9%;  float:left; 	}

h2 {		font-size:144%;      }

.boxialue2 {	margin:44px 0 0 0;   } 
.yhteysboxi {	width:100%;  padding:22px 2% 22px 11%;  }


.capiylin {  	height:999px;   } 


.boxi4 {		padding:0 2% 0 5%;  width:100%;  min-height:222px;   	}
.boxi41 {		margin-bottom:22px;    	}
.boxi44 {		margin-top:33px;    	}
				}	/*	========================================	*/







/*	vakiomääritteitä	*/

.ypadiso { 	padding-top:66px; }
.ypadpieni { 	padding-top:33px; }
.ypadnolla { 	padding-top:0; }

.apadpieni { 	padding-bottom:33px; }
.apadnolla { 	padding-bottom:0; }

.ymargiso { 	margin-top:66px; }
.ymargpieni { 	margin-top:33px; }
.ymargnolla { 	margin-top:0; }
.amargiso { 	margin-bottom:66px; }
.amargpieni { 	margin-bottom:33px; }
.amargnolla { 	margin-bottom:0; }

.apad66 {		padding-bottom:66px; 	}
.ypad0 {		padding-top:0; 	}


.vasemmalle {	text-align:left; }
.keskelle {	text-align:center; }
.oikealle {	text-align:right; }
.kuvakeskelle {	margin-left:auto;  margin-right:auto; }
.valkea {		color:hsl(0,0%,100%); 	}
.levee100 {	width:100%; }