
@font-face {
    font-family: "hieno teksti";
    src: url(fontit/Tangerine/Tangerine-Regular.ttf);
   

}

@font-face { 
    font-family:"tavallinen teksti"; 
    src: url(fontit/Sawarabi_Mincho/SawarabiMincho-Regular.ttf);
}



body { background #555;
 font-family:"tavallinen teksti",serif;
}

.etusivu, .header, .nav,  .footer {
text-align: center;

}

.container {
background: #ffec9a;
max-width: 1200px;
margin-left: auto;
margin-right: auto;

}

img {

    border: 20px solid #fafafa;
    margin: 10px;
   
}

 .etusivu img:hover {
    box-shadow: 2px 2px 20px;
 }

 .etusivu img {
 box-shadow: 2px 2px 20px #c4bfbf;

 }

 .header{
    font-family: "hieno teksti", cursive;
    background-color: #c97878;
    background-image: url(header-tausta.jpg);
    background-size: cover;
    background-position: left bottom;
    color:aliceblue;
    text-shadow: 0px 0px 8px #a25c39,
    0px 0px 12px #a25c39;
    box-shadow: 0px -20px 20px inset #ffd88585;


    font-size: 80px;
    line-height: 0.8;
    padding: 60px 0px;
    
   
 }
 
 
 
 .nav{
background-color: aliceblue;
padding: 10px 0;
margin-bottom: 20px;
box-shadow: 2px 20px 15px -15px #cab079;
 } 

 a:link  {color: #ffb20d;;}
 a:visited {color: #c47a25;}
 a:hover  {text-decoration: none;}
 a:active {color: #c97878}
 
 .nav a {

    margin 15 px;
    color: #a85e5e;
    text-decoration: none;
 }
 .nav a:hover {
    text-decoration: underline;
 }
 

 .footer{
background-color: rgb(31, 13, 13);
color:azure;
padding: 30px;
margin-top: 20px;
clear: both;
 }

 .sivu .main {

    padding-left: 50px;
    padding-right:50px;
    
 }
 .sivu .main p {
max-width: 700px;
 }
 .main {
    min-height: 500px;
 }
 .oikealla {
    float: right;
 }

 .maalaus {
display: inline-block;
position: relative;


}




 .kuvateksti  {

   background-color: #f3a1a1;
color: #ffffff;
padding: 6px 4px;
position: absolute;
left: 30px;
bottom: 34px;
width: 200px;
box-sizing: border-box;
visibility: hidden;


 }
.maalaus:hover .kuvateksti  {
   visibility: visible;
   pointer-events: none;
}
