.div {	border:1px red solid; 	}

body {	background-color:hsl(0,0%,100%);  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; 	}
html {	scroll-behavior:smooth;  }
 
.asiakkaanvari .zznnk {	background-color:hsl(247, 100%,41%);	color:rgb(25, 0,209);  	}
.logovari {		background-color:hsl(240, 100%,30%);	color:rgb(0, 0,155);	}
.logotumma {						color:rgb(0, 0,111);		}
.logovaalea {						color:rgb(55, 55,155);	}
.logohaalea {						color:rgb(199, 199,255);	}
.punainen {		background-color:hsl(0, 100%,54%);	color:rgb(255, 22,22);	}
.vihrea {			background-color:hsl(120,100%,35%);	color:rgb(0, 225,0);	}
.ingressivari {		background-color:hsl(210, 100%,96%);	background-color:rgb(233, 244,255);	}
.zzingressiteksti {		color:hsl(252, 100%,25%);		color:rgb(25, 0,125); }


h1 {		padding:66px 5% 33px 5%; margin:0 auto;  max-width:1333px; font-size:133%;  color:hsl(0,0%,0%); font-weight:normal;  text-align:center;       }
h2 {		padding:44px 0 0 0; margin:0 0 0 0;  font-size:144%; color:hsl(247,100%,41%);    }
.paaotsikko {	padding:44px 0 0 0; margin:0 0 0 0;  font-size:144%; color:hsl(247,100%,41%);  font-weight:bold;  text-align:left;   }
.otsikko {	padding:44px 0 0 0; margin:0 0 0 0;  font-size:144%; color:hsl(247,100%,41%);    }
h3 {		padding:44px 0 0 0; margin:0 0 0 0;  font-size:122%;     }
p {		padding:22px 0 0 0; margin:0;  font-size:122%;  line-height:155%;   }
.kuvateksti {	padding:22px 4% 0 4%; margin:0;  font-size:111%;  text-align:center; line-height:155%;   }
.leveeotsikko {	padding:44px 3% 0 3%; margin:0 0 0 0;  font-size:144%; color:hsl(247,100%,41%);  text-align:center;  }
.pampula {	padding:0px 0px 0px 7%;  margin:9px 0 4px 0;  font-size:122%;  background-image:url(kuvat/pallomusta.png);  background-size:0.4em;  background-position:0 0.5em;  background-repeat:no-repeat;  line-height:155%;   }
.apuslogan {	padding:66px 55px 0 55px;  font-size:155%;  color:hsl(0,0%,0%);  font-weight:normal;  font-style:italic;  text-align:center;  line-height:155%; }
.apuslogan2 {	padding:0px 55px 55px 55px;  max-width:1111px; color:hsl(0,0%,0%);   font-weight:normal;  margin-left:auto;  margin-right:auto; font-size:133%;  text-align:center;  line-height:155%;  }
.apuslogan3 {	padding:66px 55px 0 55px;  max-width:1111px; font-weight:normal;   margin-left:auto;  margin-right:auto;  font-size:155%;  
		color:hsl(0,0%,0%);  font-style:italic;  text-align:center;  line-height:155%; }


.voimakas {	padding:22px 0 0 0;  font-size:133%;  line-height:155%;   }
.raamit {		border:1px hsl(240,100%,30%) solid;  background-color:hsl(0,0%,100%);  padding:22px 33px; margin:33px 0;  text-align:center; font-size:133%;  line-height:155%;   }


.sivu {		width:100%;  max-width:1920px; display:table; 	}
.aluevakio {	padding:0 7%;  width:100%;  display:table   	}
.alueimage {	width:100%;    background-image:url(kuvat/imagekuva.jpg);  
		background-position:50% 10%;  background-size:cover;  display:table;    }
.taustavari {	background-color:hsl(210,100%,96%);   }



.logolohko { 	width:600px;  margin:55px 0 55px 7%;  background-color:hsl(0,0%,100%); border-radius:33px; float:left; display:table;    }
.logokuva { 	width:90%;  margin:22px auto 22px auto;  	  }

.linkkilohko { 	width:100%;  margin:11px 0 22px 0;  padding:0 22px; font-size:1em; display:table; }
.linkkinappi {	float:left;  display:inline;	}
.linkkinappi1 {	width:28%;	}
.linkkinappi2 {	width:28%;	}
.linkkinappi3 {	width:44%;	}

.linkkiteksti:link { 	color:hsl(0,0%,100%); 
			background:linear-gradient(  hsl(229,100%,24%) , hsla(229,100%,24%, 0.2) );   }
.linkkiteksti:visited { 	color:hsl(0,0%,100%); background:linear-gradient(  hsl(229,100%,24%) , hsla(229,100%,24%, 0.2) ); border-radius:1.5em; }
.linkkiteksti:hover { 	color:hsl(0,0%,100%);   background:hsl(120,100%,35%);   	}
.linkkiteksti { 		padding:0.5em 0;  display:block; text-align:center;  text-decoration:none; }

.yhteyslinkkiele {	margin:0 0 22px 55px; 	}



.paivystyslohko { 	color:hsl(0,0%,100%);  width:400px; margin:0 0 0 0;  padding:27px 44px 33px 44px;  float:right;  
		border-radius:0 0 0 33px;  background-color:hsl(247,100%,41%);  display:table;   } 
.paivystysteksti {	font-size:133%;  text-align:center;  font-weight:bold;  line-height:155%;     }
.paivystysele {	 font-size:177%;  margin-top:11px; text-align:center;   word-spacing:0.1em;  letter-spacing:0.09em;  }
.paivystysnumero:link {	color:hsl(0,0%,100%);   text-decoration:none; }  
.paivystysnumero:visited {	color:hsl(0,0%,100%);  text-decoration:none; }
.paivystysnumero:hover {	color:hsl(0,0%,100%);   text-decoration:underline; }


.tekstilinkki:link {	color:hsl(247,100%,41%);    text-decoration:underline; }  
.tekstilinkki:visited {	color:hsl(247,100%,41%);  text-decoration:underline; }
.tekstilinkki:hover {	color:hsl(120,100%,35%);   text-decoration:none; }




.imageslogan {	width:100%;  padding:0.2em 5% 0.2em 5%;  margin:444px 0 22px 0;  
		color:hsl(247,100%,41%); font-size:222%;  font-style:italic;  text-align:center;  
		background:linear-gradient(90deg, hsla(0,0%,100%, 0) ,  hsla(0,0%,100%, 1) 20% , hsla(0,0%,100%, 1) 80% , hsla(0,0%,100%, 0)  );   }






/*    boxit    .......................................................................................................................................................        */


.alueingressi {	padding-top:33px; padding-bottom:33px;  background-color:hsl(210,100%,96%);  width:100%;  display:table   	}
.ingressibxv  {	width:50%;   margin:66px 0 33px 0;  float:left;    }
.ingressiteksti {	padding:7px 5%;  font-size:155%;  color:hsl(252,100%,25%);	 line-height:155%;    }
.ingressibxo {	width:50%;  margin:66px 0 33px 0;   float:left;      }

.ingressirivi {	border:1px hsl(0,0%,55%) dotted;  border-radius:1em; text-align:center; width:94%;  max-width:66em;  margin: 0 auto;  padding:11px;  display:table  	}
.ingressipampula {	padding:0 0 0 33px;  margin:0 22px;   font-size:166%;  color:hsl(0,0%,55%);  display:inline-block;	
		background-image:url(kuvat/neliovihrea.png);  background-size:0.4em;  background-position:0 0.66em;  background-repeat:no-repeat;  line-height:155%;   }


.boxialue2 {	width:100%;  display:flex; justify-content:space-between; 	}
.boxi2 {		margin:66px 0 0 0; width:45%;      }
.boxikuva2 {	width:100%;    border-radius:22px; 	}
.otsikkotausta {  	font-size:144%;  margin:0;  padding: 1em 2em;  border-radius:22px 22px 0 0; 
		background-color:hsl(247,100%,41%);  color:rgb(231,234,239);  width:100%;  text-align:center;  	}
.boxikuvaotsikolla {	border-radius:0 0 22px 22px;	}

.boxialue3{	width:100%;  display:flex; justify-content:space-between; 	}
.boxi3 {		margin:66px 0 0 0; width:30%;       }
.boxikuva3 {	width:100%;  border-radius:22px; 	}


.boxialue4{	width:90%;  max-width:999px;  margin:0 auto; display:flex; justify-content:space-between;  flex-wrap:wrap;	}
.boxi4 {		margin:44px 0 0 0; width:130px;       }
.boxikuva4 {	width:100%; 	}



.yhteysalue{	width:100%;  display:flex; justify-content:space-between;  	}
.yhteyselev {	margin:66px 0 0 0;  width:30%;  padding:0 0 33px 0;      }
.yhteystieto  {	padding:7px 0;  margin:0;  font-size:133%;   	}
.yhteystieto2  {	font-size:99%;   	}
.yhteysotsikko {	margin-bottom:33px; font-size:155%;  color:hsl(247,100%,41%);  font-weight:bold;   }
.yhteysrako {	margin-top:22px;  	}

.yhteyseleo {	margin:66px 0 0 0; width:65%;   background-image:url(kuvat/yhteyskuva.jpg);  background-size:cover;  
		background-position:50% 10%;  background-repeat:no-repeat;    }
.luotettavakumppani {	width:111px; 	}

.karttakuva {	width:222px;  height:222px;  float:right; margin:55px; 
		background-image:url(kuvat/kartta222.png);  background-size:cover;  background-position:0 0;  background-repeat:no-repeat;	}

.luelisaa:link {	color:hsl(247,100%,41%);   text-decoration:none; }  
.luelisaa:visited {	color:hsl(247,100%,41%);  text-decoration:none; }
.luelisaa:hover {	color:hsl(120,100%,35%);   text-decoration:none; }



.nnkele {	 	bottom:4px;  right:4px;  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:hsl(120,100%,35%);    }
.nnk {	 	background-color:hsl(247,100%,41%);  border-radius:8px;  height:50px;  width:50px;  background-size:30px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  }

		
.tukes {	}
.haiveviiva { 	height:1px;  width:77%;  margin:66px auto 0 auto;  background:linear-gradient( 90deg, transparent , hsl(0,0%,77%) , transparent );   }
.haiveviiva2 { 	height:1px;  width:77%;  margin:0 auto 66px auto;  background:linear-gradient( 90deg, transparent , hsl(0,0%,77%) , transparent );   }
.haiveviiva3 { 	height:1px;  width:77%;  margin:0 auto 0 auto;  background:linear-gradient( 90deg, transparent , hsl(0,0%,77%) , transparent );   }
.haiveviiva4 { 	height:1px;  width:77%;  margin:33px auto 33px auto;  background:linear-gradient( 90deg, transparent , hsl(0,0%,77%) , transparent );   }
.aluealin {	margin-top:66px; width:100%;  background:linear-gradient(  hsl(247,100%,55%) , hsl(247,100%,41%) );   display:table;   }
.alateksti {	padding:22px 22px;  margin:0;  font-size:111%;  color:hsl(210,100%,96%);  text-align:center;  line-height:155%; 	}

.alaslogan  {	padding:11px 66px;  margin:0;  font-size:99%;  color:hsl(0,0%,33%);  text-align:center;  line-height:155%; 	}



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

.boxialueapampula {		flex-direction:column;  	}
.boxialueapampula .boxi2 {	width:100%;  max-width:666px; margin:0 auto 0 auto;      }

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




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

.ingressibxv  {	width:100%;   margin:66px 0 0 0;  float:none;    }
.ingressiteksti {	padding:0;  margin:11px 0px;  font-size:155%;      }
.ingressibxo {	width:100%;  margin:33px 0 33px 0;  float:none;    }
.ingressipampula {	margin:11px 22px;     }
	
.logolohko { 	margin:55px auto 0px auto;  border-radius:44px 44px 0 0;  float:none;    }
.linkkilohko { 	width:100%;  float:none;  text-align:center; }
.linkkinappi { 	float:none;   margin:0 auto;  display:block;}
.linkkinappi1 {	width:14em;	}
.linkkinappi2 {	width:14em;	}
.linkkinappi3 {	width:14em;	}
.linkkiteksti { 	padding:1.5em 0; }

.paivystyslohko { 	width:600px;  margin:0 auto 55px auto;  float:none;  border-radius:0 0 44px 44px;      }	
.imageslogan {	margin:222px 0 22px 0;  }

.yhteyslinkkiele {	margin:0 0 22px 0;  text-align:center;  	}

.boxialue3 {	flex-direction:column;	 }
.boxi3 {		margin:66px auto 0 auto; width:100%;  max-width:666px;      }
.apadiso2 {	padding-bottom:0; 	}

.yhteyselev {	width:333px;        }
.yhteyseleo {	width:calc(100% - 350px);  }



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





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

.imageslogan {	width:100%;  left:0;  font-size:177%;    
		background:linear-gradient(90deg, hsla(0,0%,100%, 0.2) ,  hsla(0,0%,100%, 1) 10% , hsla(0,0%,100%, 1) 90% , hsla(0,0%,100%, 0.2)  );  }



.boxialue2 {	flex-direction:column;  	}
.boxi2 {		width:100%;  max-width:666px; margin:66px auto 0 auto;      }

.yhteysalue{	flex-direction:column;	}
.yhteyselev {	margin:66px auto 0 auto;  width:100%;  max-width:444px;       }
.yhteystieto  {	font-size:122%;   	}
.yhteysotsikko {	font-size:133%;	}
.yhteystieto2  {	font-size:99%;   	}

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



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







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

.logolohko { 	width:94%;  max-width:500px;      }
.paivystyslohko { 	width:94%;  max-width:500px;       } 
.paivystysele {	font-size:144%;  }


.imageslogan {	background:hsl(0,0%,100%);   }

.ingressiteksti {	padding:0;  margin:11px 0px;  font-size:133%;     }
.ingressipampula {	font-size:122%;    }

.boxialue4{	width:94%;  }
.boxi4 {		width:40%;       }

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

h2 {		font-size:133%;  }
.paaotsikko {	font-size:133%; }
.otsikko {	font-size:133%;  }
.leveeotsikko {	font-size:133%;   }

.apuslogan {	font-size:133%;  }
.apuslogan2 {	font-size:133%;    }
.apuslogan3 {	font-size:133%;  }


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











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


.apadiso {	padding-bottom:66px; 	}
.amargpieni {	margin-bottom:33px; 	}
.ymargnolla {	margin-top:0; 	}
.ymargpieni {	margin-top:33px;      }

.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; }
.rako0060 {	margin-bottom:60px; }
.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; }






