html{
    background-color: #e0e0e0;
}
*{
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
}
@keyframes kissateksti{
    0%  {color: red;}
    16% {color: orange;}
    33% {color: yellow;}
    49% {color: green;}
    66% {color: blue;}
    83% {color: purple;}
    100%{color: red;}
}
@keyframes kissatausta{
    0%  {background-color: red;}
    16% {background-color: orange;}
    33% {background-color: yellow;}
    49% {background-color: green;}
    66% {background-color: blue;}
    83% {background-color: purple;}
    100%{background-color: red;}
}

header ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    animation: kissatausta 4s linear 0s infinite;
}
header li{
    display: inline-block;
}

header li a{
    font-family: Arial, Helvetica, sans-serif;
    display: inline-block;
    color: #fff;
    text-decoration: none;
    padding: 0.5em 1em;
}

header li a:hover{
    background-color: rgba(11,11,11,0.4);
    font-weight: bold;
}

.contentdiv{
    padding: 1em;
}

.kissadiv{
    padding: 2em 0em;
    border-radius: 1em;
    width: fit-content;
}

.rainbow{
    text-align: center;
    animation: kissateksti 4s linear 0s infinite;
}

.kissadiv img{
    max-width: 300px;
    border: 0.5em solid black;
    border-radius: 1em;

}