@font-face { 
    font-family: numerot ;
    src: url(fontit/Geo/Geo-Regular.ttf);
}

@font-face {
    font-family: soluotsikot ;
    src: url(fontit/RobotoCondensed/RobotoCondensed-VariableFont_wght.ttf);
}

@font-face {
    font-family: otsikko ;
    src: url(fontit/CabinSketch/CabinSketch-Regular.ttf);
}


body {
    background-color: #94bdec;
    background-image:url(helmikuutausta.jpg);
    background-size: cover;
    background-position: center bottom;
    min-height: 100vh;             /* vähintään ikkunan korkuinen*/
    padding: 1px;                  /* jotta h1:n marginaali pysyy bodyn sisällä*/ 
    box-sizing: border-box;        /*jotta padding ei kasvata bodyn korkeutta*/
    margin: 0;                     /*jotta kaikki mahtuu kerralla näkyviin  */
    color:#fff;
}

h1 {
    text-align: center;
    font-family: otsikko, sans-serif;
    font-weight: normal;
    font-size: 50px;
    margin: 0;
    text-shadow: 0px 0px 10px hsla(244, 89%, 48%, 0.6);
}
h1 a {
    color: inherit;
    text-decoration: none;
    margin: 50px;
}
h1 a:hover {
opacity: 0.6;
}


table {
     margin-left: auto;
     margin-right: auto;
     border-spacing: 4px;
     border-spacing: 6px;
     border-spacing: 10px;
}

th { font-family: soluotsikot, sans-serif;
    font-weight: normal;
    text-shadow: 0px 0px 20px #1b1d81;
}

td {font-family: numerot, serif;
    border: 2px solid #fff;
    border-radius: 10px;
     width: 120px;
    height: 120px;
    vertical-align: top;
    text-align: right;
    font-size: 35px;  
    padding-top: 5px;
    padding-right: 6px;
    box-sizing: border-box; /*padding sisältyy kokoon */ 
    background-color: rgba(255,255,255,0.2);
    color: #94bdec; 
    background-repeat: no-repeat;
    background-position: 10px 10px;
}

td:hover {
    background-color: hsla(212, 82%, 69%, 0.5);
    color: #fff;
}

 .liputus {
    background-size: auto 22px;
 }
 
 .suomi {
    background-image: url(suomen-lippu.gif);
 }
 .saame {
    background-image: url(saamen-lippu.svg);
 }

.laskiainen {
    background-image: url(laskiaispulla.png);
}
.ystavanpaiva {
    background-image: url(sydan.svg);
    background-size: 27px auto;
}
.kuu {
    background-size: 30px auto;
}
.taysi {
    background-image: url(kuu/taysikuu.svg);
}
.vaheneva {
    background-image: url(kuu/vaheneva-kuu.svg);
}
.uusi {
    background-image: url(kuu/uusikuu.svg);
}
.kasvava {
    background-image: url(kuu/kasvavakuu.svg);
}
.muu {
    color:#333333;
}
.su {
    color:#c93a3a;
}