/*Sivuston yleiset määritykset, kuten taustakuva ja teksti*/
body {
  background-image:url('background-fmi.jpg');
  background-repeat: no-repeat;
  color: black;	
  font-family: "Arial",Helvetica,sans-serif;
  font-size: 12px;
}


/*Logon asettelu*/
.logo {
 margin-left: 5%;
}

/*Sivuston ylälaidassa olevan navigoinnin määritykset*/
/*Ylälaidassa olevan navigoinnin linkityksen muotoilut*/
.ylanavigointi a:link, a:visited {
 text-decoration: none;
 color:black;
}

/*Ylälaidassa olevan navigoinnin elemnttien etäisyys "marginaali" seuraavaan elementtiin*/
.ylanavigointi ul {
 margin-left: 1.5%;
}

/*Ylälaidassa olevan navigoinnin yleiset muotoilut*/
.ylanavigointi li {
 font-weight:bold;
 display: inline;
 background-color: white;
 border-style: solid;
 border-width: thin;
 border-color: black;
 margin-right: 0.3em;
 padding: 0.5em;
}

/*Sivusto, jolla käyttäjä on juuri nyt, on merkitty navigoinnissa sinisellä värillä*/
li.selected {
 background-color: #0073DE;
}

/*Sivusto, jolla käyttäjä on juuri nyt, on muotoiltu teksti näkymään valkoisena*/
li.selected a:link, a:hover {
 color: white;
 text-decoration: none;
}

li.notselected a:link, a:hover {
 color:black;
 text-decoration: none;
}

/*Sivunavigoinnin linkkien muotoilut*/
.sivunavigointi a:link, a:visited {
 text-decoration: none;
 color: black;
}

/*Sivunavigoinnin päälle kun vie kursorin, vaihtuu linkin muotoilu alleviivatuksi ja siniseksi*/
.sivunavigointi a:hover {
 text-decoration: underline;
 color: blue;
}

/*Sivunavigoinnin taustan muotoilut*/
.sivunavigointi {
 line-height:200%;
 width: 18%;
 float: left;
 margin-left: 5%;
 background-color: white;
 border-style: solid;
 border-width: thin;
 border-color: black;
}

/*Sivunavigoinnin "ranskalaiset viivat"*/
.sivunavigointi ul.a {
 list-style-type: square;
 font-weight:bold;
}

/*Sivunavigoinnin sisennetyt elementit*/
.sivunavigointi ul.b {
 list-style-type: square;
 font-weight: normal;
 background-color: white;
 color: black;
 
}

/*Sivun varsinaisen sisällön taustan muotoilut*/
.sisalto {
 width: 70%;
 float: right;
 margin-right: 5%;
 background-color: white;
 border-style: solid;
 border-width: thin;
 border-color: black;
}

/*Taulukko-elementeissä ei näytetä reunaviivoja*/
.table {
 border: 0px;
 border-collapse: collapse;
}

/*Laatikko-elementti, eli "ympyröity" elementti sivustolla, joka halutaan erottaa muusta sisällöstä*/
.laatikko {
 border-style: solid;
 border-width: thin; 
 border-color: grey;
 border-radius:6px;
 width: 40%;
}

/*Säätaulukon otsikkorivin muotoilut*/

.taulukko {
 border-spacing: 0;
 border-collapse: collapse;
}

/*Tummempi tausta joka toiselle päivälle*/
.otsake {
 background-color: #CFCFCF;
}

/*Vaaleampi tausta joka toiselle päivälle*/
.otsake td.alt {
 background-color: #E7E7E7;
}

/*Pakkaslukemat näkyvät punaisena*/
.pakkasta tr.alt {
 font-color: red;
}

/*Lämpölukemat näkyvät sinisenä*/
.lampoa {
 font-color: blue;
}

/*Linkkinappulat, jotka vaihtavat kuvaa 'Paikallisissa säähavainnoissa'*/
.nappulat ul li {
 display: inline;
 background-color: #BFF6F9;
 border-radius:6px;
 margin-right: 0.5em;
 padding: 0.5em;
}

/*'Koko Suomen' kuvan muotoilut*/
.kokosuomi {
 float: right;
 border-left-style: dashed;
 border-left-width: thin;
}

/*Linkkinappulat, jotka vaihtavat kuvaa 'Koko Suomessa'*/
.namiskat ul li {
 display: inline;
 background-color: #BFF6F9;
 border-radius:6px;
 margin-right: 0.5em;
 padding: 0.5em;
}

/*Säätietojen muotoilut*/
.saatiedot tr.alt td  {
 background-color: #E7E7E7;
 border-collapse: collapse;
}

/*Sivuston alatunnisteen muotoilut*/
.footer {
 background-color: #F8F8F8;
 margin-left: 8%;
 clear: both;
 align-content: bottom;
 outline-style: solid;
 outline-width: thin; 
 outline-color:grey;
 margin-right: 5%;
 padding: 0.5em;
}

/*Sivuston alatunnisteen linkkien muotoilut*/
.footer a {
 float: right;
 text-decoration: none;
 color: black;
}