@import url('https://fonts.googleapis.com/css2?family=Itim&family=Oswald:wght@200..700&family=UnifrakturMaguntia&display=swap');


body {
background-color: #286cd3;
background-image: url(helmikuu_tausta.jpg);
background-size: cover;
min-height: 100vh;  /* 100vh = ikkunan korkeus */
margin: 0;
padding: 1px;
box-sizing: border-box;
background-position: center;
color: #ffffff;
}

h1 {
    text-align: center;
    font-family: "Itim", serif;
    font-weight: 400;
    font-size: 55px;
    margin-bottom: 30px;
}

h1 a {
    color: inherit;
    text-decoration: none;
    margin: 30px;
}

h1 a:hover {
    text-shadow: 0px 0px 6px #14446d,
    0px 0px 6px #092d4d;
}

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

th {
    font-family: "Oswald", serif;
    font-weight: 400;
}

td { font-family: "UnifrakturMaguntia", serif;
    border: 2px solid#ffffff;
    border-radius: 6px;
    width: 100px;
    height: 100px;
    vertical-align: top;
    text-align: right;
    font-size: 30px;
    padding-top: 3px;
    padding-right: 6px;
    box-sizing: border-box;
    color: rgb(61, 61, 204);
    background-color: rgba(219, 253, 253, 0.72);
    background-repeat: no-repeat;
    background-position: 6px 5px; /* Kuut on tarkoituksella eri kohdassa kuin liput.*/
}



.su {
    color: #bb0000;
}

.muu {
    color: #7a7a7a;
}

h1, th {
    text-shadow: 0px 0px 3px #14446d;
}


td:hover {
    background-color: hsla(208, 69%, 25%, 0.979);
    color: #ffffff;
}

.laskiainen {
    background-image: url(laskiaispulla.png);
}

.ystavanpaiva {
    background-image: url(sydan.svg);
    background-size: 26px;
}



.suomi {
background-image: url(suomen-lippu.gif);
}


.saame {
background-image: url(saamenlippu.svg);
background-size: auto 22px;
}


.kuu {
background-size: 20px;
background-repeat: no-repeat;
background-position: 4px 4px; /* Kuut on tarkoituksella eri kohdassa kuin liput. */
}

.uusi {
background-image: url(uusikuu.svg);
}

.kasvava {
background-image: url(kasvavapuolikuu.svg);
}

.taysi {
background-image: url(taysikuu.svg);
}

.vaheneva {
background-image: url(vahenevapuolikuu.svg);
}