/* 
 * CSS for the weewx Standard skin
 * $Id: weewx.css 2749 2014-11-29 18:15:24Z tkeffer $
 * used in molemmat indeksit ym, siivoa harkiten!
 *  background-image: url i oli backgrounds/band.gif

 * v. 2.0 muutoksia 11.8.2018 17:15
 * ja 1.1.2019 ja taas 1.12.2019
 * v.3.0 1.3.2020 muokattu taas, leveydet ym, kohti w3-css-tyyli
*/
  
/* Global */

body {
    margin: 0;
    padding: 0;
    border: 0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.1em;
/*    background-color: #f0f0fa; */
    background-color: #fafcf0;
    background-image: url('backgrounds/skyb.png');
    background-repeat: repeat;
    background-attachment: scroll;
}	

/*
 * Tyyli uudelle index.html:lle
 * Originaaliasetukset alempana vakiosivuille indexV0
 * voisivat olla eri tiedostoissakin...
*/

#kontaineri {
/*  max-width:940px;
  margin: auto;
  padding: 20;*/
}

#hederi {
  margin: 1% 0% 1% 0%;
  padding: 20px;
  text-align: left;
  border: 2px solid #bbb;
/*  background-color: #9ac; */
  background-color: #22d;
  color_old1: #eef; 
  color_old:#59f;
  color:#ff5;
}
#hederi h1v1 { color: #3d6c87;}
#hederi h1 { color: #c9c9c9;}
#hederi h2 { color: #7bf; margin-top:8px; margin-bottom:8px;}
#hederi h2old { color: #e1e1e1; margin-top:10px; margin-bottom:10px;}
#hederi h2v1 { color: #3d6c87; margin-top:10px; margin-bottom:10px;}
#hederi h3old { color: #5f8ea9; margin-top:10px; margin-bottom:10px;}
#hederi h3 { color: #79c; margin-top:8px; margin-bottom:8px;}
#hederi a.hlinkN {font-size: 1.25em;color:#fff; background-color: #9ac;}
#hederi a.hlink {font-size: 1.25em;color:#fff; background-color: #22d;}
#hederi img { float:right; border: 3px solid #fff; vertical-align: bottom;background-color: #eee;}

#foteri {
/* margin:1%;
 width:98%;*/
 clear:both;
 background-color: #fafaf8;
}

#kontentti {
/*    width: 100%;
 min-height: 680px;
 margin: 0;
 padding: 5px;
 background-color: #fff;
 border: 2px solid #aab; */
 }

#entislt {
/* margin: 0;
 padding: 10px;
 background-color: #cfc;
 border: 2px solid #aab; */
}

#kontent1 {
/* width:45%;float:left;*/ 
}
#kontent2 {
/* width:50%;float:left;
 background-color: #eee;
 padding:15px;
 border: 1px solid #ccc;
 margin: 3px; */
}

/* seuraavat ei toimi here */
.normis {font-size: 0.8em;}
.huolto {color: red;}

td.iimage {position: relative; height: 160px; width: 160px; }
td.ijmage {position: relative; height: 32px; width: 32px; }
#ennuste {position: relative; height: 160px; width: 160px; }
#ennuskuva {position:absolute;
    left:0;
    top:0; }
#uberlei {z-index:100;
    position:absolute;    
    color:white;
    font-size:16px;
    font-weight:bold;
    left:54px;
    top:88px;
}
#uberlei2 {z-index:100;
    position:absolute;    
    color:navy;
    font-size:16px;
    font-weight:normal;
    left:14px;
    top:18px;
}

#infoalue { /*margin-top: 10px; padding:5px;color:#575; border: 1px solid #ccc; */}
#statsi_groupi {
    min-height: 340px;
    margin: 3px;
    padding: 5px;
    float: left;
    border-top: 1px solid #dcdcdc;
    border-right: 1px solid #a9a9a9;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #a9a9a9;
}


/*
#kontent2l {width:240px;float:right;
 background-color: #f8f;
}
#kontent2r {width:220px;float:right;
 background-color: #f8f;
}
#kontent2b {}
*/

/*
 * Originaaliasetukset muille sivuille
*/

#container {
    margin: auto;
    padding: 0;
    border: 0;
}
/*
 * This is the big header at the top of the page
*/
#masthead {
    margin: 1% 1% 0 1%;
    padding: 5px;
    text-align: center;
    border-top: 1px solid #dcdcdc;
    border-right: 1px solid #a9a9a9;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #a9a9a9;
    background-color: #fafaff;
}

#masthead h1 {
    color: #3d6c87;
}
#masthead h2 {
    color: #5f8ea9;
}
#masthead h3 {
    color: #5f8ea9;
}

/*
 * This holds the statistics (daily high/low, etc.) on the left: 
 */
#stats_group {
    width: 30%;
    min-height: 500px;
    margin: 1%;
    padding: 5px;
    float: left;
    border-top: 1px solid #dcdcdc;
    border-right: 1px solid #a9a9a9;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #a9a9a9;
    background-color: #fafaff;
}

.stats table {
    border: thin solid #000000;
    border_collapse:1;
    width: 100%;
}
.stats td {
    border: thin solid #000000;
    padding: 2px;
}

.stats_header  {
/*    background-color: #6666aa;
    font-weight: bolder;
    color: #fee;
    background-color: #77b; */
    background-color: #77c;
    color: #fff;
    font-size: 14pt;
    font-weight: bold;
  padding:5px;
}

.stats_label {
    color: olive;
}

.stats_data {
    color: brown;
}
.stats_data_s {
    color: brown;
    font-size: 0.625em;
}

/*
 * This holds the "About", "Almanac", and plots on the right
 */
#content {
    width: 62%;
    min-height: 300px;
    margin: 1%;
    padding: 5px;
    float: right;
    border-top: 1px solid #dcdcdc;
    border-right: 1px solid #a9a9a9;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #a9a9a9;
    background-color: #fafaff;
    text-align: center;
}

#content .header {
    font-size: 14pt;
    font-weight: bolder;
    color: #3d6c87;
    margin-bottom: 10px;
}

#content .caption {
    font-weight: bold;
    color: #3d6c87;
}

#content table {
    text-align: center;
    width: 100%;
}

#content td {
    width: 50%;
}

#content .label {
    text-align: right;
    font-style: italic;
}

#content .data {
    text-align: left;
}

#about, #almanac {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
}

.celestial_group {
}

.celestial_body {
    width: 48%;
    vertical-align: top;
    display:inline-block;
}

#plots {
    width: 90%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
    
#plots img {
    border: thin solid #3d6c87;
    margin: 3px;
    padding: 3px;
}

#radar_img {
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin: 3px;
    padding: 3px;
}

#radar_img img {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    margin: 3px;
    padding: 3px;
}

#radar_img p {
    width: 90%;
    font-style: italic;
    font-size: smaller;
    text-align: center;
    margin-top: 0;
}

/*
 * Navigation bar (week, month, etc.) at the bottom
 */
#navbar {
    margin: 0 1% 1% 1%;
    padding: 5px;
    text-align: center;
    clear: both;
    border-top: 1px solid #dcdcdc;
    border-right: 1px solid #a9a9a9;
    border-bottom: 1px solid #808080;
    border-left: 1px solid #a9a9a9;
    background-color: #fafaff;
}

/*************** Global Styles ***************/

h2, h3, h4, h5, h6 {
  color: #3d6c87;
  margin-top:20px;
  margin-bottom:10px;
}