.div {	border:1px red solid; 	}
 
/*
Kuvia 29+1kpl, sanoja 1.400
*/

body {	margin:0;  word-spacing:0.1em;  letter-spacing:0.07em;  
font-family: Arial, Helvetica, Tahoma, "Liberation Sans", "DejaVu Sans", "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%) ); }



.perusvari {	background-color:hsl(220,100%,31%);	color:rgb(255, 106, 0); }

.sininen {	background-color:hsl(220,100%,31%);  }
.vihree {		background-color:hsl(100, 100%,30%);	color:rgb(51, 153, 0); }
.punainen {	background-color:hsl(0, 82%,48%);	color:rgb(222, 22, 22); }
.valkoinen {	background-color:hsl(0,100%,100%);	color:rgb(255, 255, 255); }
.musta {		background-color:hsl(0,100%,0%);	color:rgb(0, 0, 0); }




/*    perustekstit    */

h1 { 	padding:111px 3% 0 3%;  margin:0; font-size:199%;  color:hsl(0,0%,0%); font-weight:normal;  text-align:center; letter-spacing:0.12em; text-transform:uppercase;   }
h2 { 	padding:66px 3% 0 3%;  margin:0; font-size:155%;  color:hsl(0,0%,0%); font-weight:normal;  text-align:center; letter-spacing:0.12em; text-transform:uppercase;   }
p {		padding:22px 0 0 0;  margin:0; font-size:122%; color:hsl(0,0%,0%);  line-height:144%;    }
.pamp {		font-size:111%;   padding:0px 0px 0px 44px;  margin:11px 0 0 0;  background-image:url(kuvat/pallomusta.png);  background-size:0.5em;  background-position:0 0.3em;  background-repeat:no-repeat;    }



/*   ylin alue    */

.nnkele {	 	bottom:11px;  left:11px;  position:fixed;   }
.nnk:link { 	background-image:url(kuvat/nnkoy255.png);   }
.nnk:visited { 	background-image:url(kuvat/nnkoy255.png);     }
.nnk:hover { 	background-image:url(kuvat/nnkoy0.png);  background-color:hsl(220,100%,77%);  }
.nnk {	 	background-color:hsl(220,100%,31%);  border-radius:7px; height:50px;  width:50px;  background-size:30px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }



/*    lohkot    */

.sivualue {  	border-width:44px 0 0 0;  border-color:hsl(220,100%,31%);  border-style:solid;  width:100%; display:table;  }

.alueimage {  	border-width:2px 0 0 0;  border-color:hsl(0,0%,100%);  border-style:solid;  width:100%; display:table;
		background-image:url(kuvat/imagekuva.jpg);  width:100%;  background-position:50% 40%;  background-repeat:no-repeat;  background-size:1920px;  } 
.alueingressi {	width:100%;  margin:177px 0 0 0;  padding:33px 7%;  background-color:hsla(220,100%,77%, 0.6);  display:table;   	}
.ingrvasen  {	width:30%;   margin:11px 0 0 0;  float:left;    }
.ingrslogan {	color:hsl(0,0%,100%);  padding:0;  margin:0;  font-size:199%;  font-weight:bold;  line-height:155%;   text-align:center; 
		letter-spacing:0.12em;  text-shadow:2px 1px hsl(0,0%,0%);  font-family:Quicksand, "Abyssinica SIL", "Liberation Serif", FreeSerif, Serif;  }
.ingroikea  {	width:60%;  margin:11px 0 0 10%;  float:left;   }
.ingrteksti {	padding:0;   margin:0px 0 0 0px;  font-weight:bold; font-size:155%;  line-height:166%;
		font-family:Quicksand, "Abyssinica SIL", "Liberation Serif", FreeSerif, Serif;     }




/*    alueet    */

.aluevakio {	padding: 0 7%;  position:relative;  width:100%;  display:table; }
.aluelevee {	padding:0;  width:100%;  display:table; }

.logolohko { 	border-radius:22px; margin:111px 0 0 11%;  padding: 44px 5%;  width:500px;  background-color:hsla(0,100%,100%, 1);  }
.logokuva {	width:90%;  max-width:400px;  margin:0 auto 0 auto; 	}
.logoteksti {	font-size:199%;  margin:11px 0 0 0;  
		color:hsl(220,100%,31%);  text-align:center; word-spacing:0.2em;  letter-spacing:0.1em;    }


.boxialue2 {	margin:99px 0 0 0;  padding:0 11%;   width:100%;  display:flex;  justify-content:space-between;  } 
.boxi2 {		width:45%;  padding:0 0 0 0;  position:relative;   }
.boxikuva2 {	border-radius:22px; width:100%;  	}

.alinalue {	padding:33px 77px; width:100%;  text-align:center;  background-color:hsl(220,100%,77%);	}
.alinteksti {	font-size:111%;  padding:1em 1em;  margin:0;  font-size:88%;  white-space:nowrap;  display:inline;  	}









/*    yhteydet    */


.yhteysalue3 {	margin:66px 0 0 0;  padding: 0 5% 66px 5%;   width:100%;  display:flex;  justify-content:space-around;    flex-wrap:wrap; 
		background-image:url(kuvat/taustagrafiikka.jpg); background-position:50% 50%;  background-size:cover; 	 } 
.yhteysboxi {	width:30%;  margin:66px 0 0 0;  border-radius:22px;  padding:33px 0 33px 0;  background-color:hsl(0,0%,100%); 	}
.yhteysboxi1 {	margin:77px 0 0 0;	}
.yhteysboxi2 {	margin:77px 0 0 0;	}
.yhteysboxi3 {	margin:77px 0 0 0;  	}

.yhteysotsikko {	font-size:133%;  padding:0px 5% 22px 11%;  margin:0;  font-weight:bold;   	}
.yhteysteksti {	font-size:111%;  padding:5px 5% 0px 11%;  margin:0;  	}
.yhteysrako {	margin-top:1em; 	}
.karttateksti {	font-size:99%;  padding:11px 5% 0px 11%;  text-align:center;   	}



/*    harvinaiset    */









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

.leveeotsikko { 	font-size:166%;  }
p { 		font-size:111%;  }
.ingrteksti {	font-size:133%;   }
.pamp	 {	font-size:111%;    }
.ingrslogan {	font-size:188%;   }

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

.imageslogan {	width:100%;  margin:333px 0 55px 0;  padding:0 66px; text-align:center; float:none;   }
.logolohko { 	left:calc(50% - 250px);  top:144px; }

.ingrvasen  {	width:100%;    float:none;    }
.ingroikea {	width:100%;  margin:33px 0 0 0;  float:none;    }

	
.boxialue2 {	flex-direction:column;  	}
.boxi2 {		width:100%;     	}
.boxi22 {		margin:66px 0 0 0;     	}
	
.boxialue3 {	flex-direction:column;  	}
.boxi3 {		width:100%;    	}
.boxi33 {		margin:66px 0 0 0;     	}

.boxialue4 {	width:106%;  margin-left:-3%;   } 
.boxi4 {		width:44%;  margin:66px 3% 0 3%;   }
.riviboxi4 {	width:44%;     }

.boxiw {		margin:66px auto 0 auto;  width:100%;  max-width:666px;       }

.boxilevee123 {	width:100%;   border-radius:22px 22px 0 0;    }
.boxikapee123 {	width:100%;   border-radius: 0 0 22px 22px;   }
.slogan123 {	font-size:166%;    } 	
		
/*    yhteydet    */



.yhteysboxi {	width:100%;  margin:66px 0 0 0;  	}
.yhteysboxi1 {	width:46%;  margin:77px 2% 0 2%;  	}
.yhteysboxi2 {	width:46%;  margin:77px 2% 0 2%;  	}
.yhteysboxi3 {	width:96%;  margin:33px 2% 0 2%; 	}


.haiveviiva {	margin:55px auto 33px auto;  }
.tausta31 {  	height:444px;   } 
.tausta41 {  	height:444px;   } 

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











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


h1 { 		font-size:166%;   }
h2 { 		font-size:144%;  }
p {	 	font-size:111%;  }
.ingrslogan {	font-size:144%;   }

.logolohko { 	width:90%;  margin:44px auto 0 auto;   }
.logokuva {	width:80%;  max-width:400px; margin:11px auto 0 auto; 	}
.alueingressi {	padding-top:11px;   	}
.ingrvasen  {	margin:66px 0 0 0;     }
.ingroikea  {	width:96%;  margin:33px auto 0 auto;  padding-top:11px;  padding-bottom:22px;      }

.kuultootsikko2 {	font-size:144%;   	}
.boxiotsikko2 {	font-size:144%;   	}
.boxialue4 {	width:100%;  margin-left:0;   } 
.boxi4 {		width:100%;  margin:66px 0 0 0;   }

.caption { 	width:100%;  }
.slogan  {	font-size:133%; 	}	
.alueimage {  	height:555px;   } 



.yhteysboxi {	   	}
.yhteysboxi1 {	width:98%; margin:77px 0 0 0;	}
.yhteysboxi2 {	width:98%; margin:22px 0 0 0;	}
.yhteysboxi3 {	width:98%; margin:22px 0 0 0; }




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









/*	=================================================================================================================================================================	*/
/*	=================================================================================================================================================================	*/

/*	vakiomääritteitä	*/

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

.ypadiso { 	padding-top:66px; }
.ypadpieni { 	padding-top:33px; }
.ypadnolla { 	padding-top:0; }
.apadiso { 	padding-bottom:66px; }
.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; }

.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%; }