.div {	border:1px red solid;	}

body {	margin: 0; padding: 0; color: rgb(0,0,0);   background-color: rgb(229,229,255);  background-image: url(kuvat/sivutausta.png);  word-spacing: 0.1em;  letter-spacing: 0.07em; 
	font-family: Arial, Helvetica, Tahoma, "Liberation Sans", "DejaVu Sans", "Bitstream Vera Sans", "sans-serif";   }
h1, h2, h3, h4, p {	line-height: 165%;  }
img {	display: block; }
* {	box-sizing: border-box;	}

a:link {	color: rgb(0,19,169);   text-decoration: underline; }  
a:visited {	color: rgb(190,51,225); text-decoration: underline; }
a:hover {	color: rgb(230,10,20);  text-decoration: none; }


	.paluuele  {	 	color: rgb(1,28,128);  height: 3.5em;  padding: 0 0 0 70px;  width: 100%;  display:table;   }
	.paluunappula {	 	float: left;  margin: 10px 30px 20px 0px;   font-size: 80%; word-spacing: 0.1em;  letter-spacing: 0.07em;    }

	.paluulinkki:link {		color: rgb(1,28,128); padding-left: 0.5em; text-decoration: none; }  
	.paluulinkki:visited {	color: rgb(1,28,128); padding-left: 0.5em; text-decoration: none; }
	.paluulinkki:hover {	color: hsl(0,100%,50%);  padding-left: 0.5em; text-decoration: none; }


	.seuraavaele  {	background-color:rgb(239,239,239); color: rgb(126,19,169);  margin: 0 0 0 0;   width: 100%;  display: table;     }
	.seuraavanappula {	color: rgb(255,255,255);  float: left;  margin: 33px 3% 0 3%;   font-size:1em;  word-spacing: 0.1em;  letter-spacing: 0.07em; }

	.seuraavalinkki:link {	background: linear-gradient(rgb(199,199,199), rgb(111,111,111) );  padding: 5px 21px;  color: rgb(255,255,255);   text-decoration: none;   }  
	.seuraavalinkki:visited {	background: linear-gradient(rgb(199,199,199), rgb(111,111,111) );  padding: 5px 21px;  color: rgb(232,232,232);   text-decoration: none;   }
	.seuraavalinkki:hover {	background: linear-gradient( hsl(0,100%,77%) ,  hsl(0,100%,50%) );  padding: 5px 21px;  color: rgb(255,255,255);     text-decoration: none;   }
  	.seuraavalinkki {	border-radius:1em; 	   }  

	.face:link {	background: linear-gradient( hsl(220,100%,77%), hsl(220,100%,50%) );  padding: 5px 21px;  color: rgb(255,255,255);   text-decoration: none;   }  
	.face:hover {	background: linear-gradient( hsl(0,100%,77%) ,  hsl(0,100%,50%)   );  padding: 5px 21px;  color: rgb(255,255,255);     text-decoration: none;   }

/*    imagealue   oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo   */

	.alueimage {	width: 100%;  background: linear-gradient( rgb(1,28,128), rgb(180,218,255),  rgb(1,28,128) );   padding: 10px 0; }
	.imageraamit {	border-width:1px 0;  border-color:rgb(180,218,255);  border-style:solid; 
		padding: 22px 0; text-align:center;   }

	h1 {		padding:0;  margin: 0px 3%;  text-shadow: 2px 2px rgb(0,0,0);  font-size: 150%;  word-spacing: 0.13em;  letter-spacing: 0.07em; color: rgb(255,244,255);   }
	.logoteksti {	padding: 11px 0;  margin: 0;  font-size: 99%; color: rgb(255,244,255);  word-spacing: 0.13em;  letter-spacing: 0.07em;    }
	.aluevakio {	padding: 0 7% 55px 7%; margin: 0 auto;  background-color:rgb(252,252,252);  width:100%;  max-width:1000px;  display:table;	}

	.kelluvakio {	width:40%;  float:right; margin: 22px 0 22px 3%; 	}
	.leveekuva {	width:100%;  margin: 22px 0; 	}

.artikkelilohko {	  width:100%;  max-width: 1000px;  margin: 0 auto;  border-width: 0px 1px;  border-color: rgb(111,111,111);  border-style: solid;  }

	
	.aluealin {	width: 100%; padding: 20px 0;  text-align:center; }


/*    navigointi   oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo   */

	.sokeripalaele1 {		position: fixed;  top: 4px; left: 4px;    }
	.sokeripala:link { 		border-radius: 7px;  padding: 12px 9px 12px 9px;  color: rgb(255,255,255); 	display: block;  text-decoration: none;   background-color: rgb(0,0,0);     border-width: 2px;  border-color: rgb(255,255,255); border-style: solid; }
	.sokeripala:visited { 	border-radius: 7px;  padding: 12px 9px 12px 9px;  color: rgb(255,255,255); 	display: block;  text-decoration: none;   background-color: rgb(0,0,0);     border-width: 2px;  border-color: rgb(255,255,255); border-style: solid; }
	.sokeripala:hover { 	border-radius: 7px;  padding: 12px 9px 12px 9px;  color: rgb(255,255,255); 	display: block;  text-decoration: none;   background-color: rgb(216,16,16); border-width: 2px;  border-color: rgb(255,255,255); border-style: solid;  }



/*    artikkelin perustekstit    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

	.artikkeliele {		background-color: rgb(255,252,255);  padding: 3em 8% 4em 10%;   }
 
h2 { 	font-size: 155%;  padding: 3em 0 0 0;  margin: 0px;  font-weight: normal; }
.h2ylin { 	padding-top: 0.6em;  }
h3 { 	font-size: 133%;   padding:  2em 0 0 0;  margin: 0px;   }

p { 	font-size:122%;   padding:  1em 0 0 0;  margin: 0px;   }
.pieniteksti { 	font-size: 100%;   padding:  1em 0 0 0;  margin: 0px;   }
.pampula{		margin: 0.5em 2em 0.5em 3em; padding: 0 0 0 2em; font-size: 111%;  background-image: url(kuvat/musta-7.png); background-position: 0 0.55em; background-repeat: no-repeat; } 
.pampulatasan{			margin: 1em 2em 0.5em 0.1em; 	padding: 0 0 0 2em; font-size:111%;  background-image: url(kuvat/musta-6.png); background-position: 0 0.4em; background-repeat: no-repeat; }
.pampulatasankommentti{		padding: 0em 0 0.5em 4em;  font-size:111%;  font-style: italic;  font-family: Georgia, "Bitstream Charter", "Century Schoolbook L", "Liberation Serif", "Times New Roman", serif; }  

.ingressiele  { 	background-color: rgb(239,239,239);  padding: 3em 8% 2.4em 10%;  margin: 0; }
.ingressiteksti { 	line-height:165%;   font-size:133%;  padding: 1em 0 0em 0;    font-style: italic;  font-family: "Liberation Serif", "Bitstream Vera Serif", "Times New Roman", serif;    }





/*    kuvat    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

.kellu100 {	  width: 100%; background-color: rgb(245,245,245); padding: 0px;  margin: 1em 0 0 0; 	   			border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  box-sizing:border-box;   }
	.kellu45  {	  width: 45%;  background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 1em;  float: right;  border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  box-sizing:border-box;    }
.kellu35  {	  width: 35%;  background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 1em;  float: right;  border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;   box-sizing:border-box;   }
	.kellu25  {	  width: 25%;  background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 1em;  float: right;  border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;   box-sizing:border-box;   }
	.kellukuva {	width: 100%;  }

.kelluteksti {	 margin:9px 2% 14px 5%; padding:0; font-size:99%;  }


.kelluv  {	  width: 45%; background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 0;  float: left; border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  }
.kelluo  {	  width: 45%; background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 0;  float: right; border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  }
.kellutekstivo {	margin: 10px 3% 11px 5%; font-size: 83%;  }
.kelluklik {	padding: 8px 12px 2px 8px  }


	.kellukuvaele25  {	  width: 25%;  margin: 1.4em 0 0.5em 1em;  float: right;    }
	.kellukuvaele35  {	  width: 35%;  margin: 1.4em 0 0.5em 1em;  float: right;    }
	.kellukuvaelekuva  {	  width: 100%;  border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted; }





/*    index sivu    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */


.indexlohko {	background-image: none; background-color: rgb(253,253,253);   width: 100%;  padding: 30px 0 2em 0; margin: 0;   border-width: 0px 1px 0px 1px;  border-color: rgb(111,111,111);  border-style: solid;  }

.aluelinkeille {	width:100%;  display:flex;  flex-wrap:wrap; 	}
.indexlaatikko {	font-size:111%;  width:30%;  margin:2em 1% 1em 1%;  padding: 1em 1em 0 2em;  border-width: 1px 0px 0px 0px;  border-color: rgb(111,111,111);  border-style: dotted;   }



.indexlaatikko2 {	font-size: 111%; margin: 1em 4em 0 4em;      }
.indexlaatikko3 {	font-size: 111%; margin: 1em 4em 0 8em;     }
.indexlaatikko4 {	font-size: 111%; width: 60%;  margin: 2em 20% 2em 20%;  padding: 1em 1em 0 0em;   }

.indexlinkki:link { 	color: rgb(0,19,169);   	text-decoration: none;  }
.indexlinkki:visited { 	color: rgb(121,121,121); 	text-decoration: none;  }
.indexlinkki:hover { 	color: rgb(0,19,169);    	text-decoration: underline;  	   }


/*    erikoiset    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

	.slogan {	background-color: rgb(222,222,222);  background-image: url(kuvat/kuutio6.png);  background-repeat: no-repeat; font-size: 133%;  margin: 0 30px 1.4em 30px; padding: 2em 2em 2em 200px;  text-align: center;  font-style: italic; font-family: Georgia, "Bitstream Charter", "Century Schoolbook L", "Liberation Serif", "Times New Roman", serif;  color: rgb(0,0,0);  text-shadow: 2px 1px rgb(255,255,255); border-width: 1px;  border-color: rgb(0,0,0);  border-style: solid;  border-radius: 1em; }
	.alaslogan{	color: rgb(255,244,255);  font-size: 84%;  font-weight: bold;  padding: 12px 3% 12px 3%;  text-align: center; word-spacing: 0.13em;  letter-spacing: 0.07em; background: linear-gradient( rgb(1,28,128), rgb(180,218,255) );   }

.raamikappale { 	background-color: rgb(255,255,255); font-size:122%;  margin: 2em 0 2em 0;   padding: 1.4em 2em 1.4em 3em; width:100%;  border-width: 1px;  border-color: rgb(111,111,111);   border-style: solid;  display:table;  }

	.raamiele { 	background-color: rgb(255,255,255); margin: 2em 0 2em 0;   padding: 1.4em 2em 1.4em 3em;  border-width: 1px;  border-color: rgb(111,111,111);   border-style: solid; }
	.raamiotsikko { 	font-size: 122%;  font-weight: bold;  padding:  0.5em 0 0.5em 0; }
	.raamiteksti { 	font-size: 111%;  padding: 0.5em 0 0.5em 0;  margin: 0;   }


.keskitetty {	text-align: center; }
.punainen {	color: rgb(210,5,10);  }

.sidos {	width:100%;  display:table; 	}

.boxi9 { 		text-align: center; font-size: 150%;  background-color: rgb(0,0,0);	color: rgb(240,20,4);  margin: 15px 0px 10px 5%;  padding: 13px 40px 11px 40px;  float: right;   border-width:  7px;  border-color: rgb(202,202,202);   border-style: solid;   }
.boxi10 { 	text-align:center; width: 100%; font-size: 88%;  background-color: rgb(255,255,255); margin: 1em 0;  padding: 1em 1em 1em 1.2em;  border-width:  1px;  border-color: rgb(0,0,0);   border-style: solid;     }
.boxi11 { 	text-align:center;  width:100%;  font-size:111%;  background-color: rgb(255,255,255);  margin:1em 0;  padding: 1em 1em 1em 1.2em;  border-width:  1px;  border-color: rgb(0,0,0);   border-style: solid;  line-height:155%;     }
.haiveviiva { 	height:1px;  width:77%;  margin:33px auto; background: linear-gradient( 90deg, transparent , hsl(0,0%,0%) , transparent );   }
.poistettu {	display:none;   }










								@media screen and (max-width : 1100px)	{	/*  ==============================================================================  */   
 /*    navigointi    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */
 
.sokeripalaele2 {  display: inline; } 


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











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

	.seuraavaindex {		float: none;  margin: 10px 0 33px 30px;   width: calc(100% - 30px);  }

/*    rakenne    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

.artikkelilohko {	width: 100%;  max-width:1920px;  margin:0 auto;      }
.indexlaatikko {	width:100%;    }

/*    artikkelin perustekstit    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

	.artikkeliele {		padding: 3em 2% 4em 6%;   }
 
	.pampula{		margin: 0.5em 0em 0.5em 0.1em; padding: 0 0 0 1.6em; font-size: 85%;  background-image: url(kuvat/musta-7.png); background-position: 0 0.5em; background-repeat: no-repeat; } 
.pampulatasan{	margin: 0.5em 0em 0.5em 0.1em; padding: 0 0 0 1.6em; font-size: 85%;  }
.pampulatasankommentti{		padding: 0.0em 0em 0.8em 2em;   }   

.ingressiele  { 	padding: 3em 2% 2.4em 6%;   }

/*    kuvat    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

	.kellu35  {	margin-right: -5px; width: 37%;   }
	.kellu25  {	margin-right: -5px; width: 29%;   }
	.kelluklik {	padding: 4px 8px 2px 4px  }



/*    taulukot    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */




.raamikappale { 	padding: 1.4em 1em 1.4em 2em; 		}

.raamiele { 	padding: 1.4em 1em 1.4em 2em;   }
.raamiotsikko { 	padding: 0.5em 0 0.5em 0; }
.raamiteksti { 	padding: 0.5em 0 0.5em 0;  margin: 0;   }

.sisennyspieni {	margin-left:10%;    }

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












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

/*    rakenne    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

h1 {			padding-right: 1em;  padding-left: 1em;  	  }
	.artikkelilohko {	width: 100%;        }



 


/*    artikkelin perustekstit    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

	.artikkeliele {	padding: 3em 1% 4em 3%;   }
 
	.pampula{		margin: 0.5em 0em 0.5em 0.1em; padding: 0 0 0 1.6em; font-size: 85%;  background-image: url(kuvat/musta-7.png); background-position: 0 0.5em; background-repeat: no-repeat; } 

.pampulatasan{	margin: 0.5em 0em 0.5em 0em; padding: 0 0 0 1.2em; font-size: 85%;  background-image: url(kuvat/musta-6.png); background-position: 0 0.6em; background-repeat: no-repeat; } 

.ingressiele  { 	padding: 3em 1% 2.4em 3%;   }





/*    kuvat    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */

.kellu35  {	width:100%;    margin: 1.4em 1em 1em 1em;    }
	.kellu25  {	margin-right: -5px; width: 29%;   }
	.leveeteksti {	 margin: 0.5em 2% 1.4em 3%; font-size: 83%;  }

.kelluv  {	  width: 48%; background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 0;  float: left; 
		border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  }
.kelluo  {	  width: 48%; background-color: rgb(245,245,245); padding: 0px;  margin: 1.4em 0 0.5em 0;  float: right; 
		border-width: 1px;  border-color: rgb(0,0,0);   border-style: dotted;  }
.kellutekstivo {	margin: 10px 2% 11px 3%; font-size: 83%;  }
.kelluklik {	padding: 4px 8px 2px 4px  }

	.kellukuvaele25  {	width: 100%;   margin-left: 0;  }

	.kellukuvaele35  {	width: 100%;  margin: 0.4em 0 1.5em 0;     }



/*    taulukot    oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo    */



.indexlaatikko {	margin: 2em 1em 0 1em;  padding-top: 1em;  border-width: 1px 0px 0px 0px;  border-color: rgb(111,111,111);  border-style: dotted;   }
.indexlaatikko2 {	font-size: 88%; margin: 1em 1em 0 1em;      }
.indexlaatikko3 {	font-size: 88%; margin: 1em 1em 0 3em;     }

	.raamikappale { 	padding: 1em 1em 1em 1.2em; 	}

	.slogan {	margin: 0 10px 1.4em 10px; padding: 1.2em 2em 1em 2em;  }
	.raamiele { 	padding: 1em 1em 1em 1.2em;   }
	.raamiotsikko { 	font-weight: bold;  padding: 0.5em 0 0.5em 0; }
	.raamiteksti { 	padding: 0.5em 0 0.5em 0;  margin: 0;   }

.sisennyspieni {	margin-left:10%;    }
.boxi9 { 	display: table-cell;  width: 80%;  margin: 5px 10% 20px 10%;  padding: 13px 40px 11px 40px;  }
.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;  }


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




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

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

.ypadisompi { 	padding-top:99px; }
.ypadiso { 	padding-top:66px; }
.ypadpieni { 	padding-top:33px; }
.ypadmini { 	padding-top:11px; }
.ypadnolla { 	padding-top:0; }
.apadiso { 	padding-bottom:66px; }
.apadpieni { 	padding-bottom:33px; }
.apadmini { 	padding-bottom:11px; }
.apadnolla { 	padding-bottom:0; }

.ymargisompi { 	margin-top:99px; }
.ymargiso { 	margin-top:66px; }
.ymargpieni { 	margin-top:33px; }
.ymargmini { 	margin-top:11px; }
.ymargnolla { 	margin-top:0; }
.amargiso { 	margin-bottom:66px; }
.amargpieni { 	margin-bottom:33px; }
.amargmini { 	margin-bottom:11px; }
.amargnolla { 	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ä 	*/

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






