body {
   margin:0;
   padding:0;
   font-family: garamond, serif;
   background-color: #b7e355;
}

h1, h2, h3{
   font-family : "Helvetica", "Arial", sans-serif;
}



/* Kelluvat elementit (float: left;) ovat ylimääräisen DIV:in sisällä.
Korjaa IE6:n peek-a-boo -virheen ilmentymän, joka piiloittaa absolute elementit.
Mahdollistaa myös tyylin tai asemoinnin määrittämisen muuttuvalle sisällölle. */
.container {}


/* Kuviin ei reunoja */
img {
   border-style: none;
}


/* Tekstikorostukset */

.korostus {
   font-family : "Arial Black", "Helvetica", sans-serif;
   font-weight: bold;
   color: green;
}

.strong {
   font-weight: bold;
}
 

/* Etusivu */

.etusivu {
   float: left;
   clear: left;
   width: 58em;

   margin-left: 1em;
   margin-right: 5em;
   margin-bottom: 4em;

   padding: 1em;
   padding-left: 0px;
   padding-bottom: 0px;

   background-color: #FFFFFF;
   border-style: outset;
   border-color: black;
   border-width: 1pt 4pt 3pt 1pt;
}

.etusivu p:first-letter {
    font-size: 120%;
    color: green;
}

.etusivu .postit {
   left: 5em;
   width: 12em;
   margin-left: -4.5em;
   margin-right: -1em;
}

.etusivu .mainos {
   margin-bottom: -300px;
}

/* Huom! index.html sisältää tyylimääreen: .nav a {width: 7em;} */



/* Leiskat */

.teema {
   float: left;
   width: 40em;

   margin-left: 6em;
   margin-right: 0.5em;
   margin-top: 4em;
   margin-bottom: 0em;

   padding: 2em;

   background-color: #FFFFFF;
   border-style: outset;
   border-color: black;
   border-width: 1pt 4pt 3pt 1pt;

/* position needed for z-index. */
   position: relative; 
   left: 1px;
   z-index: 1;
}

/*
.teema p:first-letter {
    font-size: 120%;
    color: green;
}
*/


/* Kelluvat elementit */

.postit {
   float: right;
   clear: right;
   position: relative; 
   left: 6em;
   width: 15em;
   background-color: #DCF03C;
   padding: 0.5em;
   margin-top: 3em;
   margin-bottom: 2em;
   margin-left: -6em;
   margin-right: -0.5em;
   border-width: 0pt;
   font-family : "Helvetica", "Arial", sans-serif;
   font-size: large;
/*   font-size: 120%; */
}

/* Sijoittaa 150px kuvan leiskan oikealle puolelle */
.mainos {
   float: right;
   clear: right;
   position: relative; 
   left: 180px;
   width: 150px;
   margin-top: 3em;
   margin-bottom: 2em;
   margin-left: -150px;
   margin-right: -4em;
   padding: 0px;
}



/* Linkit */

a {
	TEXT-DECORATION: none;
}
a:link {
	COLOR: green; TEXT-DECORATION: none;
}
a:visited {
	COLOR: green; TEXT-DECORATION: none;
}
 a:hover {
	COLOR: #6699cc; TEXT-DECORATION: underline;
}

/* Väliotsikon näköinen linkki sisäsivulle */
.linkkiotsikko {
   text-align: right;
}

.linkkiotsikko a {
   font-size: large;
   font-weight: bold;
}

/* Listat */

dt {
   font-family : "Arial Black", "Helvetica", sans-serif;
   font-weight: bold;
}

dd {
   margin-bottom: 1em;
}



/* Navigointi */

/* Vasen palkki */
.leftBar {
   position:absolute;
   width:10em;
   top:0px;
   left:0px;
}

.leftBar:hover {
  z-index: 10;
}

.nav {
   font-family : "Helvetica", "Arial", sans-serif;
}

.nav li {
   float: left;
   list-style: none;
   width: 8em;
   height: 1.3em;
   margin-left: -20px;
}

.nav a {
   width: 8em;
   height: 1.3em;
   text-decoration: none;
   color: #000000;
   text-indent: 6px;
   float : left;
   font-size: large;
}

.nav a:visited {
	COLOR: #000000;
}

.nav a:hover {
   background-color: red;
   color: red;
   text-decoration: underline;
}

.menu_ali {
   font-size: smaller;
   text-indent: 10px;
}

#menu_etu a {background-color: #a4cb7b;}
#menu_aika a {background-color: #9ACD32;}
#menu_mimmo a {background-color: #fcdb00;}
#menu_vaali a {background-color: #c8e160;}
#menu_abc a {background-color: #a4cb7b;}
#menu_txt a {background-color: #dc1e5d;}
#menu_tuki a {background-color: #de4b36;}
#menu_raha a {background-color: #de4b36;}
#menu_yhteys a {background-color: #eb893d;}
#menu_linkit a {background-color: #eb893d;}
#menu_blogi  a {background-color: #DDF;}
.menu_ali a {background-color: #fcdb00;}

#menu_etu a:hover {background-color: green;}
#menu_aika a:hover {background-color: green;}
#menu_mimmo a:hover {background-color: green;}
#menu_vaali a:hover {background-color: green;}
#menu_abc a:hover {background-color: green;}
#menu_txt a:hover {background-color: green;}
#menu_tuki a:hover {background-color: green;}
#menu_raha a:hover {background-color: green;}
#menu_yhteys a:hover {background-color: green;}
#menu_linkit a:hover {background-color: green;}
#menu_blogi a:hover {background-color: green;}
.menu_ali a:hover {background-color: green;}

/* Sivun sisäiset linkit, sisällysluettelo */
.sisä-navi {
   visibility: hidden;
}

#menu_vaali {display: none;}


/* Kaksipalstainen taitto, Käytössä "Teemat" sivulla */

.sarake {
  float: left;
  margin: 0;
  width: 49.75%; /* 2 x 50% ei aina mahdu. */
}

.sarake p {
  text-align: justify;
}

.oikea {
/* Siirtää oikeanpuoleisen sarakkeen (ja kuvan) aivan leiskan reunaan. */
  position: relative; 
  left: 1%;
}

/* Leiskan pohjassa, yksipalstainen */
.vaakapalkki {
   clear: left;
   background-color: #DDF;
   width: 100%;
}


/* Sivun vakio-osat, osin näkymättömiä */

.banneri {
   position:absolute;
   width: 497px;
   height: 100px;
   top: 0px;
   right: 0px;
/*   z-index: -2; */
}

/* Sivun pääotsikko, näkymätön graafisessa tilassa */
.header {
   visibility: hidden;
}

/* Sivun alatekstit */
.bottom {
   clear: both;
}

/* Tekijänoikeusmerkintä */
p.copy {
   text-align: right;
   font-size: small;
   margin-top: 3em;
}

/* validator.w3.org */
.tag {
   float: left;
   margin-top: 2em;
   margin-right: 10px;
   visibility: hidden;
}



/* Etusivun erikoisuuksia */

/* Kasvokuva ja Vihreiden banneri yhdessä */
.kuvakenttä {
   float: left;
   overflow: hidden;
}

/* Kuvat eivät skaalaudu, vaan leikkautuvat. */
.kuva {
   overflow: hidden;
}