@font-face {
    font-family: headari;
    src: url(fontit/Fascinate-Regular.ttf);
}
@font-face {
    font-family: teksti;
    src: url(fontit/AsapCondensed-Regular.ttf);
}
@font-face {
    font-family: numero;
    src: url(fontit/Coiny-Regular.ttf);
}
body {
    font-family: Arial, sans-serif;
    background-color: rgb(168, 31, 31);
    color: whitesmoke;
    background-image: url(tausta.jpg);
    background-size: cover;
    min-height: 100vh;
    padding: 1px;
    box-sizing: border-box;
    margin: 0px;
}
h1 {
    text-align: center;
    text-shadow: -3px 3px rgb(0, 93, 146);
    font-family: headari, sans-serif;
    font-size: 50px;
}
table {
    margin-right: auto;
    margin-left: auto;
    border-spacing: 4px 8px;
}
th {
    text-align: left;
    color: white;
    text-shadow: -2px 2px rgb(0, 93, 146);
    font-size: 23px;
    font-family: teksti, sans-serif;
    font-weight: normal;
}
td {
    border: 3px solid rgb(220, 239, 255);
    border-radius: 13px;
    width: 165px;
    height: 140px;
    vertical-align: top;
    text-align: right;
    font-size: 22px;
    padding: 5px;
    box-sizing: border-box;
    background-color: rgba(2, 102, 160, 0.5);
    font-family: numero, serif;
    text-shadow: -3px 3px rgb(0, 93, 146);
    background-repeat: no-repeat;
    background-position: 10px 105px;
}
td:hover {
    background-color: rgb(220, 239, 255);
    text-shadow: none;
    color: rgba(2, 102, 160);
}
.lipudus {
    background-size: auto 20px;
}
.suomi {
    background-image: url(sumenlipu/sumenlippu.gif);
}
.saame {
    background-image: url(sumenlipu/Sami_flag.svg);
}
.laskiainen {
    background-image: url(pulla/pulla.png);
    background-position: 5px 100px;
    background-size: auto 30px;
}
.ystavanpaiva {
    background-image: url(sumenlipu/Heart_corazón.svg);
    background-size: auto 30px;
    background-position: 5px 100px
}
.kuu {
    background-size: auto 30px;
    background-position: 5px 100px
}
.taysi {
    background-image: url(kuut/moon-full.svg);
}
.uusi {
    background-image: url(kuut/moon-new.svg);
}
.kasva {
    background-image: url(kuut/moon-half-grow.svg);
}
.pieni {
    background-image: url(kuut/moon-half-shrink.svg);
}
.muu {
    opacity: 0.4;
}
.su {
    color: rgb(230, 46, 46);
    text-shadow: -3px 3px rgba(43, 0, 0, 0.6);
}
h1 a {
    color: inherit;
    text-decoration: none;
    margin: 165px;
}
h1 a:hover {
    opacity: 0.4;
}