.div {	border:1px red solid; 	}

body {	margin: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";   }
.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;	}

.perusvari	{	background-color:hsl(111,80%,40%);	}
.piristevihree	{	background-color:hsl(111,80%,60%);	}




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

h1 {	margin:0;  padding:0 5%;  font-size:333%;  font-weight:normal;  text-align:center; font-family: 'Source Sans 3', sans-serif;    }
p {	margin:22px 0 0 0;  padding:0;  font-size:111%;  line-height:155%;   }




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

.sivualue {	padding:99px 5% 55px 5%;  width:100%;  display:table; 	}

.imagekuva {	margin: 77px 0 66px 0; width:100%;	}
.pilari1 {	width:calc(46% - 33px);  margin:0 0 0 0;  float:left;  display:table; }
.pilari2 {	width:calc(50% - 33px);  margin:0 33px 0 0;  float:right; display:table;	}
.pilarikuva {	width:100%; }
.kuvaele {	margin: 0 0 66px 0; box-shadow: 22px 22px 22px hsl(0,0%,55%);   width:100%; }
.isokuva {	width:100%;	}
.portfolioele {	width:100%;  display:table; 	}
.portfolio {	margin:22px 0 0 0;  padding: 0 0 0 10%;   font-size:111%;  line-height:155%;   	}


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

.aluelogo { 	width:100%;  clear:both; display:table;   }
.logolohko { 	margin:99px auto 22px auto;  width:100%;  display:table;   }
.logokuva {	width:555px; max-width:90%;  margin:11px auto 33px auto;    }
.logoteksti {	text-align:center;  margin:0;  padding:7px 0 0 0;  font-size:144%;     }


#myBtn {	display: none;  position: fixed;  bottom: 11px;  right: 11px;  z-index: 99;  border: none;  background-color:hsl(0,0%,22%);  border-radius: 4px;  height:40px;  width:40px;  
	background-size:22px;  background-repeat:no-repeat;  background-position:50% 50%;  display:block;  text-decoration:none;  background-image:url(kuvat/nnkoy255.png); }
#myBtn:hover {	background-image:url(kuvat/nnkoy255.png);  background-color:hsl(0,0%,66%);  }





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

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



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

.sivualue {	padding:55px 3% 33px 3%;   	}
.pilari1 {	width:100%;  margin:0 0 0 0;  float:none;   }
.pilari2 {	width:100%;  margin:0 0 0 0;  float:none;	}
.pilarikuva {	box-shadow: 0 0 0 hsl(0,0%,55%);    }



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


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

h1 {		font-size:222%;     }
.logoteksti {	font-size:122%;     }

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






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

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

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





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

.sininen {	background-color:hsl(208,100%,33%);	color:rgb(0, 61, 204); }
.keltainen {	background-color:hsl(60,100%,50%);	color:rgb(255, 255, 0); }
.oranssi {	background-color:hsl(25,100%,50%);	color:rgb(255, 106, 0); }
.vihree {		background-color:hsl(222,100%,40%);	color:rgb(0, 166, 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); }

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


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

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

