.div {	border:1px red solid; 	}

body {	margin:0;  word-spacing:0.1em;  letter-spacing:0.07em;  font-family: Arial, Helvetica;    }
.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;	}


.turkoosi {	background-color:hsl(240,100%,78%);		background-color:rgb(144,144,255);	}
.sininen {	background-color:hsl(240,100%,57%);		background-color:rgb(37,59,255);	}
.aniliini {	background-color:hsl(300,100%,53%);		background-color:rgb(255,15,255);	}

.taustahaalea {	background-color:hsla(240,100%,78%, 0.2);	}
.taustalikivalkea {	background-color:hsla(240,100%,78%, 0.07);  	}

.ingressilapinakyva {	 background-color:hsla(240,100%,78%, 0.5);   background-color:hsl(240,100%,89%);  }




/*    perustekstit	==============================================================================================================	*/

h1 {	margin:66px 3% 0 3%; padding:0;  font-size:222%;  font-weight:normal;       }
h2 {	text-align:center; font-size:199%;  padding:77px 3% 0 3%;  margin:0;  width:100%;  font-weight:normal;  word-spacing:0.14em;  letter-spacing:0.07em;  display:table;   }
h3 {	margin:44px 0 11px 0;  padding:0;  font-size:133%;     }
p {	margin:22px 0 0 0;  padding:0;  font-size:133%;  line-height:155%;   }
.pampula {	padding:0px 0px 0px 44px;  margin:5px 0 5px 1%;   font-size:133%;  background-image:url(kuvat/pallomusta.png);  background-size:0.5em;  background-position:0 0.45em;  background-repeat:no-repeat;  line-height:155%;   }
.pampulavalkea {	padding:0px 0px 0px 44px;  margin:5px 0 5px 1%;   font-size:133%;  color:hsl(0,0%,100%);  background-image:url(kuvat/pallovalkea.png);  background-size:0.5em;  background-position:0 0.45em;  background-repeat:no-repeat;  line-height:155%;   }
.pampulapieni {	padding:0px 0px 0px 33px;  margin:0px 0 0px 1%;   font-size:99%;  background-image:url(kuvat/pallomusta.png);  background-size:0.4em;  background-position:0 0.56em;  background-repeat:no-repeat;  line-height:155%;   }
.leveeotsikko {	text-align:center; font-size:199%;  padding:77px 5% 0 5%; margin:0 auto;  font-style:italic;  font-weight:normal;  word-spacing:0.14em;  letter-spacing:0.07em;
		max-width:36em; font-family:"Abyssinica SIL", "Liberation Serif", FreeSerif, Serif; }
.leveelause {	text-align:center; font-size:133%;  padding:33px 5% 0 5%; margin:0;  font-style:italic;  font-weight:normal;  word-spacing:0.14em;  letter-spacing:0.07em;
		zzfont-family:"Abyssinica SIL", "Liberation Serif", FreeSerif, Serif; }
.isokirjain {	font-size:222%; padding-right:0.05em; 	}


/*    alueet	==============================================================================================================	*/

.sivualue {	width:100%;  display:table; 	}
.aluelevee {	width:100%;  display:table; 	}

.alueimage {	width:100%;  position:relative;  display:flex;  flex-wrap:wrap;  background-color:hsl(240,100%,78%);
		background-image:url(kuvat/imagekuva.jpg); background-size:1920px;  background-position:50% 40%;  background-repeat:no-repeat;     }
.imagevasen {	padding:44px 44px 0 44px;  width:calc(100% - 33em);  position:relative;     }
.imageoikea {	margin:0;  padding:44px 44px 44px 44px;  width:33em;   background:linear-gradient( hsl(240,100%,78%) , hsl(240,100%,88%) );    }




/*    logo ingressi	==============================================================================================================	*/

.logolohko { 	width:100%;  margin:0 auto 3em auto;  background:hsla(0,100%,100%, 1);  border-radius:22px; display:table;   }
.logokuva {	width:80%; max-width:444px; margin:44px auto 38px auto;    }
.imageslogan {	width:100%;  padding:0 5%;  font-size:222%;  text-align:center;    
		text-shadow:1px 1px hsl(0,0,0); color:hsl(0, 100%, 100%);  word-spacing:0.2em;  letter-spacing:0.1em;  
		position:absolute;  bottom:22px;  left:0;  	 }





/*    yhteydet	==============================================================================================================	*/

.yhteysotsikko {	color:hsl(0,0%,10%);  font-size:222%;  margin-top:0.8em;  padding:11px 0 0 0;   word-spacing:0.14em;  letter-spacing:0.07em;    }
.yhteystieto {	color:hsl(0,0%,10%);  font-size:144%;  margin-top:0.8em;  padding:11px 0 0 0;   word-spacing:0.14em;  letter-spacing:0.07em;    }
.yhteystieto2 {	color:hsl(0,0%,10%);  font-size:144%;  margin-top:0em;  padding:0px 0 0 0;   word-spacing:0.14em;  letter-spacing:0.07em;    }
.yhteystietopieni {	color:hsl(0,0%,10%);  font-size:111%;  margin-top:0.8em;  padding:11px 0 0 0;   word-spacing:0.14em;  letter-spacing:0.07em;    }


.linkkilohko {		width:100%;  max-width:33em;  margin:44px auto;  font-size:1em;  display:table; 	}
.linkkinappi {		width:10em;  margin:0.5em 2em 0.5em 0;  float:left;   }
.linkkiteksti:link { 	color:hsl(0,0%,100%);      }
.linkkiteksti:visited { 	color:hsl(0,0%,100%);     }
.linkkiteksti:hover { 	color:hsl(0,0%,100%);   background-color:hsl(222,100%,66%);  }
.linkkiteksti {	 	padding: 0.5em 0em;  border-radius:1em;  text-align: center;  display: block;   
			background-color:hsl(300,100%,53%);  text-decoration: none; }


.tekstilinkki:link {	color:hsl(222,100%,40%);   text-decoration:underline; }  
.tekstilinkki:visited {	color:hsl(222,100%,40%); text-decoration:underline; }
.tekstilinkki:hover {	color:hsl(300,80%,20%);   text-decoration:none; }




/*    boxit	==============================================================================================================	*/



.alueingressi {	padding:111px 5% 0 5%;  font-size:111%;  width:100%;  display:flex;  flex-wrap:wrap;  justify-content:space-between;   	}
.ingressivasen  {	width:49.6%;  padding:11px 3% 33px 5%;  border-radius:22px 0 0 22px;  background-color:hsla(240,100%,78%, 0.5);  	 }
.ingressioikea  {	width:49.6%;  padding:11px 3% 33px 5%;  border-radius:0 22px 22px 0;  background-color:hsla(240,100%,78%, 0.5);    	}


.boxialue2 {	padding:66px 9% 0 9%;   margin:0px 0 0 0; width:100%;  display:flex; justify-content:space-between;  flex-wrap:wrap;	}
.boxi2 {		width:48%;       }

.boxialue4 {	padding:66px 17% 0 17%;   margin:0px; width:100%;  display:flex; justify-content:space-between;  flex-wrap:wrap;	}
.boxi4 {		width:15%;       }
.minikuva {	width:100%;  border-radius:50%; 	}







/*    harvinaiset	==============================================================================================================	*/

.taustakuva1 {	position:relative;  border-radius:22px;  background-image:url(kuvat/taustakuva1.jpg);  background-size:cover;  background-position:77% 66%;   min-height:555px;  }
.taustakuva3 {	border-radius:22px;  background-image:url(kuvat/taustakuva3.jpg);  background-size:cover;  background-position:50% 50%;   min-height:333px;  }
.kuvateksti1 {	position:absolute;  left:0px;  bottom:0px; padding:17px 33px;  border-radius: 0 0 0 22px;  width:333px; font-size:122%;  background-color:hsl(240,100%,89%); 	}

.boxi51 {		width:55%;  border-radius:22px 0 0 22px;  background-image:url(kuvat/taustakuva2.jpg);  background-size:cover;  background-position:0 0;   min-height:444px;  }
.boxi52 {		width:45%;  padding:11px 3% 33px 5%;  border-radius:0 22px 22px 0;  background-color:hsla(240,100%,78%, 0.5); 	}
.kapeemuoto {	width:30%;  padding-right:55px; 	}
.leveemuoto {	width:70%;	}

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

.alalause {	padding:33px 5%;  margin:0;  text-align:center; font-size:133%;  line-height:144%;  background:linear-gradient( hsl(240,100%,78%) , hsl(240,100%,95%) );  }

.nnkele {	 	bottom:4px;  right:4px;  position:fixed;   }
.nnk:link { 	background-image:url(kuvat/nnkoy255.png);   }
.nnk:visited { 	background-image:url(kuvat/nnkoy255.png);     }
.nnk:hover { 	background-image:url(kuvat/nnkoy255.png);  background-color:hsl(240,100%,57%);   }
.nnk {	 	background-color:hsl(300,100%,53%);	  
		height:50px;  width:50px;  background-size:30px;  border-radius:50%;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }
iframe {		border-radius:22px; 	}



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


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

.alueingressi {	padding:99px 3% 0 3%;    	}
.ingressivasen  {	width:100%;  padding:11px 3% 0 5%;  border-radius:22px 22px 0 0;    }
.ingressioikea {	width:100%;  padding:11px 3% 33px 5%;  border-radius:0 0 22px 22px;   }
.oikeaensin {	flex-direction:column-reverse; 	}


.boxialue2 {	padding:66px 3% 0 3%;  }
.rako1200 {	padding:0px 15% 0 15%;   	}
.boxi2 {		width:100%;     }

.boxi51 {		border-radius:22px 22px 0 0;	}
.boxi52 {		border-radius:0 0 22px 22px;	}

		



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



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

.imagevasen {	padding:44px 1%;  width:100%;  position:relative;  height:444px;      }
.imageoikea {	margin:22px auto 0 auto;  padding:0px 44px 44px 44px;  width:100%;  max-width:444px;  border-radius:22px 22px 0 0;     }


.alueingressi {	padding:77px 3% 0px 3%;    	}


.alueyhteys {	padding:66px 3%;   	}
.yhteysboxivasen {	padding:0 3%;  margin:0;  width:50%; float:left;	}
.yhteysboxioikea {	padding:0 3%;  margin:0;  width:50%; float:right; 	}
.yhteystekstilohko{	padding:0;  width:100%;     }
.yhteyskarttalohko {	width:100%;  margin:66px 0 0 0;     }

.rako1200 {	padding:0px 3% 0 5%;   	}
.boxialue4 {	padding:66px 11% 0 11%;	}

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


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



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












/*	kestotietoa 	*/
/*	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++	*/
/*	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++	*/

.vaaleaotsikko {	color:hsl(0,0%,100%);    }
.valkea {	color:hsl(0,0%,100%);    }
.muasta {	color:hsl(0,0%,0%);    }

.ypad99 { 	padding-top:99px; }
.ypad66 { 	padding-top:66px; }
.ypad33 { 	padding-top:33px; }
.ypad11 { 	padding-top:11px; }
.ypad0a { 	padding-top:0; }
.apad66 { 	padding-bottom:66px; }
.apad33 { 	padding-bottom:33px; }
.apad11 { 	padding-bottom:11px; }
.apad0 { 		padding-bottom:0; }

.ymarg99 { 	margin-top:99px; }
.ymarg66 { 	margin-top:66px; }
.ymarg33 { 	margin-top:33px; }
.ymarg11 { 	margin-top:11px; }
.ymarg0 { 	margin-top:0; }
.amarg66 { 	margin-bottom:66px; }
.amarg33 { 	margin-bottom:33px; }
.amarg11 { 	margin-bottom:11px; }
.amarg0 { 	margin-bottom:0; }

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

.haiveviivamalli { 	height:1px;  width:77%;  margin:33px auto; background: linear-gradient( 90deg, transparent , hsl(0,0%,100%) , transparent );   }
.liukupystymalli { 	background:linear-gradient( hsl(111,80%,40%) , hsl(111,80%,100%) ); }
.taustakuvamalli {	background-image:url(kuvat/taustakuva.jpg);  background-size:cover;  background-position:0 0;   min-height:555px;  }

.levee100 {	width:100%; }
.yhdessa {	white-space: nowrap;   }
.fontti {    	font-family:'Alfa Slab One'; 	}
.levee100 {	width:100%;  }
.erotin {		width:100%;  height:1px;  display:block;  }
.eimarginaalia {	margin-right:0;   }








/*	oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo	*/
/*	======================================================================	*/
/*	========================================================================================================================	*/
/*	========================================================================================================================	*/
/*    perustekstit	==============================================================================================================	*/
/*    alueet	==============================================================================================================	*/
/*    logo ingressi	==============================================================================================================	*/
/*    navigointi	==============================================================================================================	*/
/*    boxit	==============================================================================================================	*/
/*    erikoisboxit	==============================================================================================================	*/
/*    capi	==============================================================================================================	*/
/*    yhteydet	==============================================================================================================	*/
/*    harvinaiset	==============================================================================================================	*/

@media screen and (max-width :111px)	{	/*	oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo	*/
	}	/*	oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo	*/	
/*	CSS: portaat 1480, 1230, 900, 700, 500-300, FF sallii tarkistuksen 450px näytöllä 	*/

/*	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++	*/
/*	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++	*/