

/*-------------------------------------------------------------*/
/*                                                             */
/*                Tyylitiedosto, marraskuu 2020                */
/*                                                             */
/*                       Lumiini Media                         */
/*                                                             */
/*-------------------------------------------------------------*/


:root {
  --valia: 20px;
  --b_radius: 6px;
  --color_1: #489e4f;
}

@font-face {
    font-family: 'Fira Sans';
    src: url(3A8256_0_0.ttf); }   
    
@font-face {
    font-family: 'Fira Sans Regular';
    src: url(Lato-Regular.ttf); }    
    
body	{background-color: #e6e6e6; /* vanha #8d4471;  */
		 background-image: url('kuvat/tausta-etusivu2-k.png');
	     background-position: center top;
	     background-repeat: repeat;
         background-size: auto 60px;
         background-attachment: fixed;
		 margin: 0;
		 line-height: 1.5em; 
		 color: #303030;
         font-size: 20px;
		 position: relative;

}


h1, h1, h2, h3, h4, h5 {font-family: 'Fira Sans', serif;  line-height: 1.5;
                        margin: 0px; border: 0px solid #ff0000; padding: 1em 0 0.5em 0; color: var(--color_1);
}
 
h1 { font-size: 3.2em;  }
h2 { font-size: 1.6em;  }
h3 { font-size: 1em;  }

#logo { display: inline-block; margin-top: 1em; padding: 10px 17px 10px 17px; height: 36px; border: 2px solid transparent; transition: 1.6s border; 
        border-radius: var(--b_radius);
}

#logo:hover { border: 2px solid orange; }

p, ul { font-family: 'Fira Sans Regular'; font-weight: 400; font-size: 1em; margin: 0px; border-radius: var(--b_radius);
		padding-bottom: 1em; border: 0px solid #ff0000; text-align: left; line-height: 1.5;
}

p.esittely { color: #304030; font-family: 'Fira Sans Regular'; font-weight: normal; font-size: 1em; margin: 0px;
		     padding-bottom: 1em; text-align: left; line-height: 1.5;  }

ul { padding: 1em 1em 1em 2em; margin-bottom: 1em; background: #ececec; list-style-image: url('kuvat/listat.png'); background: url('kuvat/tausta-etusivu3.png');
					 background-repeat: repeat; background-size: 56px 32px;  }

p:hover { }

td { font-family: 'Fira Sans Regular'; font-size: 1em; padding-right: 30px; }


@media screen and (max-width:400px) { p { font-size: 21px }}

table.main	 {width: 100%; 
		      background: transparent;
		      text-align: left; 
		      }
                   

a { font-family: 'Fira Sans', serif; font-size: 1em; font-weight: normal;
  color: #489e4f;
  display: inline-block;
  text-decoration: none; margin-right: 20px; 
  padding: 6px 15px 6px 15px;
  transition: 0.4s box-shadow;
  border-radius: 6px;	
  border: 0px solid #e6afe7;
  box-shadow: 0px 4px 16px 0px #d0d0d0;
  
}  
    
a:hover { box-shadow: none; }
  

              
.email { padding: 0.5em 1em 0.5em 1em; border-radius: var(--b_radius);text-shadow: none; display: inline-block;
         font-size: 1em; margin-bottom: var(--valia); transition: 0.4s color; transition: 0.4s background; }
         
a.email { color: #fff; } 

a.email:hover { color: orange; background: rgb(35, 48, 73,0.9); } 
    

              
.sisa-koko   {max-width: 1000px; margin-right: auto; margin-left: auto; text-align: left;
              margin-top: 20px; box-shadow: 0px 6px 5px -4px #00000070;
              padding: 60px 60px 60px 60px; background: #fafafa; border-radius: 6px;
              }

.sisa-koko-harmaa   {max-width: 1000px; margin-right: auto; margin-left: auto; text-align: left;
                     margin-top: 10px; box-shadow: 0px 6px 5px -4px #00000070;
                     padding: 60px 60px 60px 60px; background: url('kuvat/tausta-etusivu3.png'); 
					 background-repeat: repeat; background-size: 56px 32px; border: 3px solid #fdfdfd; border-radius: 6px;
                     }   


.sisa-koko-alempi   {max-width: 1000px; margin-right: auto; margin-left: auto; text-align: left;
                     margin-top: -1px; margin-bottom: 10px;
                     padding: 0px 50px 0px 50px; border-radius: 0px 0px 6px 6px; height: 30px;
                     background: url('kuvat/ala-aalto5.png'); background-size: 100% 100%; display: none;}

.sisa-koko-eka   {max-width: 1000px; margin-right: auto; margin-left: auto; text-align: center;
                  margin-top: 10px; padding: 10px 50px 10px 50px; background: transparent; border-radius: 6px;
                 }


.sisa-koko-eka img { height: 25px; width: auto; float: none; display: none; }
.sisa-koko-eka h1 { color: #fff; padding: 45px 50px 20px 0px; border-radius: var(--b_radius); line-height: 1.3em; text-shadow: 0px 6px 6px #244c28;
	                background: transparent; border-radius: var(--b_radius); }

@media screen and (max-width:700px) { .valkoinen { width: 90%; font-size: 1em; }}


.kuvapaikka { text-align: left; display: block; }

img { float: left; border: 2px solid #2b374d; border-radius: 2px; border: none; margin-top: 0px; width: 100%; height: 100%; }

.kuvapaikka > p { margin-left: 90px; font-size: 17px;  }

.sisa-valikko a { display: inline-block; border-bottom: 1px solid #d68600; font-size: 21px;
	              padding: 12px 2px 12px 60px; margin-left: 0%; transition: 0.2s background; }

.sisa-valikko a:hover {color: #fff; }

.header { height: 60px; background: #4d404b; }
.header .sisa { max-width: 1000px; margin-right: auto; margin-left: auto; text-align: right; padding: 0px 50px 0px 50px; }

.header img { margin-top: 18px; display: block; float: right; opacity: 0.6; }
a.norm { padding: 0px; margin-right: 0px; }

a.norm::before { background: transparent; }

.footer { background: #316b34; max-width: 1000px; margin-right: auto; margin-left: auto; padding: 60px 57px 60px 57px;
	      border-radius: var(--b_radius); border: 3px solid #30612f; margin-bottom: 20px; margin-top: 10px; 
}




.tekstijakuva {  }
.tekstijakuva img { }
.tekstijakuva p { border-left: 0px solid #a660ad; padding-left: 0px; border-radius: 0px; }
.tekstijakuva h2 { padding-top: 0px; }

.grid-container-tekstijakuva {
  display: grid;
  grid-template-columns: 24% 73%;
  grid-column-gap: 3%;
  padding: 0px 0px 10px 1px;
}



.footer-teksti { width: 66%; float: left; }
.footer-kuva { float: right;  }

    @media (max-width:900px)  { .grid-container-tekstijakuva { grid-template-columns: 32% 65%; grid-column-gap: 3%; }}
    @media (max-width:600px)  { .grid-container-tekstijakuva { grid-template-columns: auto; overflow: hidden; }}
	@media (max-width:600px)  { .tekstijakuva h2 { clear: both; padding-top: 1em; } 
								.sisa-koko { padding: 30px 20px 30px 20px; margin-top: 0px; border-radius: 0px!important; }
								.sisa-koko-alempi { margin-bottom: 0px; border-radius: 0px; background: #fafafa; height: 10px; }
								.sisa-koko-harmaa {padding: 30px 20px 30px 20px; border-radius: 0px;}
				                .footer { padding: 45px 20px 45px 20px; }
								.sisa-koko-eka h1 { padding: 30px 20px 30px 20px; text-align: center; }
							    .footer { margin: 0px; border-radius: 0px; border: 0px; }
								.grid-container-tekstijakuva img { }
								.footer-teksti { width: 100%; float: left; }
								.footer-kuva { float: left; padding-top: 30px; }
	}
								 
    @media (max-width:900px)  { body { background-size: auto 43px; } .sisa-koko-eka { margin-top: 10px; }
	}
	@media (max-width:1250px) { .sisa-koko, .sisa-koko-alempi, .sisa-koko-eka, .sisa-koko-harmaa, .footer {margin-right: 20px; margin-left: 20px; }}
	@media (max-width:600px) { .sisa-koko, .sisa-koko-alempi, .sisa-koko-eka, .sisa-koko-harmaa, .footer {margin-right: 0; margin-left: 0; }}
	
img.pikkukuva { height: 180px; width: auto; float: right; padding: 0px 0px 0px 30px; margin-top: 0px;  }
	@media (max-width:600px) { img.pikkukuva { height: 160px; width: auto; float: right; padding: 0px 0px 0px 10px; margin-top: 0px; }}

img.pikkukuva-2 { height: 250px; width: auto; float: right; padding: 0px 0px 0px 30px; margin-top: 0px;  }
	@media (max-width:1000px) { img.pikkukuva-2 { height: 230px; width: auto; float: right; padding: 0px 0px 0px 20px; margin-top: 0px; }}
	@media (max-width:850px) { img.pikkukuva-2 { height: 250px; width: auto; float: none; display: block; padding: 0px 0px 20px 0px; margin-top: 0px; margin-right: auto; margin-left: auto; }}
	
img { width: 100%; height: auto; }

a.peruslinkki {margin-right: 0px; padding: 0px; border: none; font-weight: normal; color: #36863a; text-decoration: underline; 
	           background: transparent; box-shadow: none; font-size: 1em; font-family: 'Fira Sans Regular'; }

a.peruslinkki::before { background: inherit; }

.footer a {margin-right: 0px; color: #fff; border: none; text-decoration: underline; padding: 0px; font-weight: normal; 
	       background: transparent; box-shadow: none; font-size: 1em; font-family: 'Fira Sans Regular'; }

.footer p, .footer a { color: #fff; padding-bottom: 0px; font-size: 16px; }

.footer a::before { background: inherit; }









