@import url(http://fonts.googleapis.com/css?family=Oxanium|Allura|Parisienne); 


body {
  background:url(hbg.jpg);
	background-size:100%;
	background-opacity:50%; 
     background-attachment: fixed;
  font:13.5px 'Oxanium';
  color:#504e4f;
  line-height:24px;
text-align:justify;
  }
  
#nimi
 {
  font:110px 'Parisienne';
  color: #F4F5F7;
text-align:center;
margin: 20px 0 10px 0;
text-shadow: 0px 0px 3px #000;
}

#tekstiloota {
  width:900px;

background: rgba(255,255,255,0.8);
box-shadow: 0 0 3px #8FA8B8;
border-collapse: collapse;
margin: 0 auto;
padding: 1px 20px;
  }

#tekstiloota2 {
background: rgba(255,255,255,0.6);

box-shadow: 0 0 3px #8FA8B8;
border-collapse: collapse;
margin: 20px 0;
padding: 10px 20px;
  }


.vasen {
width: 396px;
background: rgba(255,255,255,0.6);

box-shadow: 0 0 3px #8FA8B8;
border-collapse: collapse;
margin: 20px 0;
padding: 5px 20px;
  }

.oikea {
width: 396px;
background: rgba(255,255,255,0.6);

box-shadow: 0 0 3px #8FA8B8;
border-collapse: collapse;
margin: 20px 0;
padding: 5px 20px;
  }

t {
font-weight:bold;
color: #6D7980;
letter-spacing:1px;
text-transform:uppercase;
font-size:12px;
margin-right: 5px;
}

#copyt { width:100%; text-align:center; margin: 20px 0; }

a:link, a:active, a:visited { color: #6D7980; }
a:hover { text-decoration:none; color: #818C94; }

t a:link, t a:active, t a:visited { color: #6D7980; text-decoration:none; margin: 0 10px; }
t a:hover { color: #818C94; }


/* VÄLIOTSIKOT */

h1 {
  font:40px 'Parisienne';
  color: #6D7980;
margin: 20px 0 10px 40px;
text-shadow: 0px 0px 3px #DADADA;
}

h2 {
  font:40px 'Parisienne';
  color: #6D7980;
margin: 50px 0 10px 40px;
text-shadow: 0px 0px 3px #DADADA;
}





/* MUUT */

::-webkit-scrollbar { width: 5px; height: 3px; }
::-webkit-scrollbar-button { width: 0px; height: 0px; }
::-webkit-scrollbar-thumb { background: #BBBBD0; border: 0px dotted #ffffff; border-radius: 50px; }
::-webkit-scrollbar-thumb:hover { background: #BBBBD0; }
::-webkit-scrollbar-thumb:active { background: #BBBBD0; }
::-webkit-scrollbar-track { background: #F1F1F5; border: 0px none #ffffff; border-radius: 50px; }
::-webkit-scrollbar-track:hover { background: #F1F1F5; }
::-webkit-scrollbar-track:active { background: #F1F1F5; }
::-webkit-scrollbar-corner { background: transparent; }








#perustietoloota2 {
  width:100%;
background: #fff;
border-collapse: collapse;
margin: 10px 0;
}






#perustietoloota {
  background:url(bg.jpg);

  width:100%;
border-collapse: collapse;
margin: 10px 0;
}

.vaalea  { padding: 10px 12px; background: #f4f4f4; border:solid 1px #dad9d5; }
.tumma  { padding: 5px 12px; background: #E8E8E8; border:solid 1px #dad9d5; }

#sukutaulu {
width: 100%;
border-collapse:collapse;
border-top:solid 2px #E8E8E8;
border-bottom:solid 2px #E8E8E8;
}

#sukutaulu td {
width:33%;
padding: 7px 20px;
}

.ala {
border-bottom:solid 2px #E8E8E8;
}


#galleria {
font-size:12px;
width: 100%;
text-align:center;
}

#galleria img {
background: #E8E8E8;
border: solid #dad9d5 1px;
height: 125px;
padding: 4px;
margin: 5px;
}






.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 260px;
  background-image:url('tumma.jpg'); border:solid 1px #dad9d5;

  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -60px;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}