/*** ronsy.css for green youth and students finland
     css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/
     design markus koljonen - http://red-black-trees.org/ ***/

* {
  margin: 0;
  padding: 0;
}

html {
  background-color: #c79193;
}
body {
  font: 10pt/15pt "Trebuchet MS", Arial, Verdana, sans-serif;
  max-width: 740px;
  min-width: 520px;
  background: white url(navitausta.jpg) repeat-y bottom left;
  border-right: 1px solid #444;
  margin-right: 2%;
  padding-bottom: 2em;
}

#otsikko {
  background: transparent url(h1.jpg) no-repeat top left;
  width: 399px;
  height: 193px;
}
#otsikko * {
  display: none;
}
#mainos {
  position: absolute;
  top: 30px;
  left: 365px;
}
#mainos img {
  border: 1px #444 solid;
}
#navigointi {
  float: left;
  font-weight: bold;
  width: 17em;
  border-top: 1px solid #000;
}
#navigointi h3 {
  width: 6em;
  font-size: 16pt;
  color: black;
  border-bottom: 2px solid white;
  margin: 10px 20px 15px 10px;
}
#navigointi a:link, #navigointi a:visited {
  text-decoration: none;
}
#navigointi a:active, #navigointi a:hover, #valittu {
  text-decoration: none;
  border-bottom: 2px solid black;
}
#navigointi ul {
  margin-right: 55px;
  list-style-type: none;
}
#navigointi li {
  margin-left: 1em;
}
#navigointi .odd {
  color: black;
}
#navigointi .even {
  color: white;
}

#juttu {
  position: relative;
  bottom: 1.2em;
  min-width: 20em;
  min-height: 80em;
  height: 100%;
  margin-left: 18em;
  margin-right: 2em;
  color: black;
}
#juttu h1 {
  font: bold 20pt "Trebuchet MS", Arial, sans-serif;
  color: #67a4ee;
}
#juttu h2 {
  font: bold 13pt "Trebuchet MS", Arial, sans-serif;
  color: #333;
  margin-top: 1em;
}

#juttu a:link, #juttu a:visited {
  color: #3774de;
}
#juttu a:hover, #juttu a:active {
  color: #67a4ee;
}

hr {
  margin-top: 1em;
  margin-bottom: 1em;
}
p, .ing, .ki, .kirjoittaja, .tiedot, dl {
  margin-top: .8em;
}
.ki, .kirjoittaja {
  text-transform: lowercase;
  font-variant: small-caps;
  font-weight: bold;
  line-height: 12pt;
  width: 60%;
  margin-bottom: 2em;
}
.ing {
  font: italic 11pt/16pt Georgia, times, serif;
}
.tiedot {
  font: italic 9pt/12pt Georgia, times, serif;
}
.nosto {
  font: italic 12pt/16pt Georgia, times, serif;
  color: #3774de;
  float: right;
  width: 10em;
  text-align: right;
  padding: .5em;
  margin: 1em 0 1em 1em;
  border: 2px #3774de solid;
  border-left: 0;
  border-right: 0;
}
.kuvateksti {
  font: italic 9pt/12pt Georgia, times, serif;
  color: #333;
  width: 60%;
  float: right;
  text-align: right;
  padding: 0 0 .5em .5em;
  margin: 0;
}
#juttu img {
  margin: .5em 0 .5em 0;
}
.kehykset {
  border: 1px #444 solid;
}
.oikea {
  float: right;
  padding: .5em 0 .5em 1em;
}
.vasen {
  float: left;
  padding: .5em 1em .5em 0;
}

#mirggi {
  width: 483px;
  margin-top: 1em;
  background: transparent url(mirggi.jpg) no-repeat top left;
}
#mirggikeskustelu {
  position: relative;
  top: 30px;
  padding: 0 .5em 1em .5em;
  border: 1px #666 solid;
  border-top: 0px;
  height: 25em;
  overflow: scroll;
}
.annukka, .heikki {
  font: 11pt Courier, monotype;
}
.annukka {
  color: red;
}
.heikki {
  color: #0c0;
}

.box {
  float: right;
  margin: 1em 0 1em 1em;
  padding-top: 0;
  width: 40%;
  background-color: #f8f8f8;
  border: 1px #ddd dashed;
}
.box .lt {
  padding: 0 1em 0 1em;
}
.box .boxotsikko {
  padding: 0 1em .2em 1em;
  background-color: #90c0ee;
}
.box h2 {
  padding-top: .2em;
}
.box h2 span {
  color: white; /*#67a4ee;*/
}

#tupakkabox {
  float: left;
  width: 40%;
  padding: .5em 1em 1.5em .5em;
  margin: 1em 1em 1em 0;
  border: 1px #999 dashed;
  border-left: 0px;
  background-color: #eee;
  line-height: 14pt;
}
#tupakkabox i {
  display: block;
  padding-bottom: .4em;
}

dt {
  display: inline;
  font-weight: bold;
  font-variant: small-caps;
}
dd {
  display: inline;

}

#juttu .entajos h1 {
  font: 22pt/28pt "Times New Roman", times, serif;
  color: white;
}
.entajos {
  background: black url(entajosalareuna.jpg) repeat-x bottom left;
  color: white;
}
.entajos2 {
  background: transparent url(entajosylareuna.jpg) repeat-x top left;
  padding: 1em 1em 2.5em 1em;
}
.entajos .lt {
  margin-left: 40%;
}
.entajosnavi {
  float: left;
  width: 27%;
  border: 1px white dashed;
  padding: 1em;
  margin: 1em 0 0 .3em;
}
.entajosnavi h3 {
  font: 14pt "Times New Roman", times, serif;
  margin-bottom: .5em;
}
.entajosnavi ul {
  padding-left: 1em;
  list-style-type: square;
}

.entajos p, .entajosnavi {
  font: 12pt/15pt "Times New Roman";
}
#juttu .entajos p {
  margin-top: 0;
  text-indent: 1em;
}
#juttu .entajos .eka {
  text-indent: 0;
  margin-top: .8em;  
}
.uutinen {
  font-size: 9pt;
  border-top: 1px white solid;
  text-align: right;
}

.jalanjalki {
  background: transparent url(jalanjalki.jpg) no-repeat 30px;
  min-height: 962px;
}
.jalanjalki .lt, .jalanjalki .kirjoittaja {
  padding-left: 6em;
}
.jalanjalki h2 {
  padding-left: 2.5em;
}
.jalanjalkinavi {
  margin: 1em 1em 1em 0;
  width: 30%;
  float: left;
  padding: 1em 1em 2em 1em;
  border: 2px black dashed;
}
.jalanjalkinavi ul {
  padding: .5em 0 0 .5em;
  list-style-type: none;
}