/* Fontiksi kuvaruudulla Arial, paperitulostuksessa
   Times New Roman. Arialin ominaisuuksien takia asetetaan
   myös rivinväli tavallista hiukan isommaksi. */
@media screen
   { body { font-family: Arial, sans-serif;
            line-height: 1.3; } }
@media print 
   { body { font-family: "Times New Roman", serif; } }

/* Vasemmalle pienehkö marginaali. Useissa selaimissa
   marginaali on vielä tätä kapeampi. */
body { margin-left: 1.5em; }

/* Listojen ja lohkolainausten sisennykset em-määräisiksi.
   Tavoitteena on saada listojen sisennykset oletusarvoja
   (esim. vasen reunus noin 40px) hiukan pienemmiksi. */
ul, ol, dl { margin: 0.3em 0 0.7em 2em; }
blockquote { margin: 0.4em 0 0.7em 2.5em; }

/* Otsikoiden fontiksi Verdana, Arial tai muu pääteviivaton
   fontti kaikissa tilanteissa. Pääotsikon keskitys. */
h1, h2, h3, h4, h5, h6 {
   font-family: Verdana, Arial, sans-serif; }
h1 { text-align: center; }

/* Otsikoiden koot kohtuullisiksi ja lihavointi vähäiseksi
   tai kokonaan pois. */
h1 { font-size: 170%; }
h2 { font-size: 145%; }
h3 { font-size: 125%; }
h4 { font-size: 115%; }
h5 { font-size: 106%; }
h6 { font-size: 100%; }
h1, h2, h3, h4, h5, h6 { font-weight: 500; }

/* Otsikoiden (paitsi pääotsikon) yläpuolelle enemmän tilaa
   kuin alapuolelle, suunnilleen kultaisen leikkauksen mukaan
   eli noin 1,62 : 1. Näissä on otettava huomioon otsikoiden
   fonttikoot, koska em on tässä elementin oma fonttikoko!
   Lisäksi pienennetään kappaleiden ylä- ja alareunuksia mm.
   siksi, että ne muuten aiheuttavat tyhjää otsikon jälkeen. */
h2 { margin: 1em 0 0.625em 0; }
h3 { margin: 1.1em 0 0.679em 0; }
h4 { margin: 1em 0 0.625em 0; }
h5 { margin: 0.81em 0 0.5em 0; }
h6 { margin: 0.81em 0 0.5em 0; }
p  { margin: 0.3em 0 0.9em 0; }

/* Ingressi-luokalle fonttikoko hiukan peruskokoa isommaksi
   ja vasemmalle pieni sisennys. */
.ingressi { font-size: 110%; margin-left: 1em; }

/* Poistetaan address-elementin kursivointi, joka on usein
   selaimessa oletusarvona. Toisaalta tehdään osoitteen
   ympärille pisteviivakehys. */
/* TÄMÄ POISTETTU TÄSTÄ VERSIOSTA
address {
  font-style: normal;
  border: dotted #060 2px;
  padding: 0.3em; }
*/

/* Pienennetään sub- ja sup-elementtien fonttikokoa, jotta
   ei tulisi niin epätasaisia rivinvälejä. */
sub, sup {
  font-size : 80%;
  font-family : Verdana, Arial, sans-serif; }

/* Tekstinsyöttökenttien ja valikkojen fonttikoko samaksi
   kuin normaalitekstin. Selaimissa se on yleensä pienempi. */
select, input, textarea {
  font-size: 100%; }
/* Yritetään huolehtia siitä, että jos täytetty lomake
   tulostetaan, kaikki syötteet tulevat mukaan. */
@media print {
   textarea, input { overflow: visible; } }  

/* Listoissa, jotka kuuluvat luokkaan "iso", jätetään
   tyhjää tilaa alkioiden väliin. */
ul.iso li, ol.iso li { margin-bottom: 0.6em; }

/* Linkki tummanpunaiseksi valkealla pohjalla ja
   alleviivaus pois, kun kursori viedään linkin päälle. */
:link:hover, :visited:hover {
   color: #c00;
   background: white;
   text-decoration: none; }

/* Linkki punaiseksi vaaleankeltaisella pohjalla ja
   alleviivaus pois, kun kursori viedään linkin päälle.
   Keltaisuus on voimakkaampi, jos linkki on vierailematon. */
:link:active, :visited:active { color: red;
                                background: #ffc;
                                text-decoration: none; }
:link:active {                  background: #ff6; }

/* Tulostusasua parantelevia asetuksia, joilla pyritään
   estämään epäsuotavia sivunvaihtoja. */
h1, h2, h3, h4, h5, h6 { page-break-after: avoid; }
p { widows: 2; orphans: 2; }

/* Tyypilliselle taulukolle sopiva asettelu, jossa on
   yksinkertaiset reunaviivat solujen ympärillä ja täytettä
   solun sisällössä sivuilla hiukan enemmän kuin yllä ja alla.
   Lisäksi caption-elementti on lihavalla ja reunaviivallinen.
   Huomaa, että sillä ei ole reunaviivaa alapuolella, koska
   sinne muutoin tulisi kaksinkertainen viiva.
   Lisäksi taulukolle on asetettu ylä- ja alareunus.
   Asettelun soveltaminen on tehty riippuvaiseksi luokasta,
   <table class="normaali">, koska muutoin näiden asetusten
   ohittaminen tarvittaessa olisi turhan hankalaa. */
table.normal { border-collapse: collapse;
               margin-top: 0.7em;
               margin-bottom: 0.7em; }
table.normal caption { font-weight: bold;
                       padding: 0.2em 0.3em;
                       border: solid thin gray;
                       border-bottom-width: 0; }
table.normal th, table.normal td {
  border: solid thin gray;
  padding: 0.06em 0.2em; }