/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/
html, body {
    height: auto;
    margin: 0;
}

body {
    background-color: #fbfcfa;
    font-family: Arial, Helvetica, sans-serif;
}

a {
    color: #33e;
    /*-webkit-text-decoration-line: none;
            text-decoration-line: none;
    -webkit-transition: color .2s ease-in;
    -o-transition: color .2s ease-in;
    transition: color .2s ease-in;*/
}

a:hover {
    color: #77f;
    -webkit-text-decoration-line: underline;
            text-decoration-line: underline;
}

a:visited {
    color: #737;
    /*-webkit-transition: color .2s ease-in;
    -o-transition: color .2s ease-in;
    transition: color .2s ease-in;*/
}

a:visited:hover {
    color: #a5a;
}

#navigointi {
    background-color: #3b7c3a;
    position: fixed;
    text-align: center;
    width: 100%;
}

#navigointi a {
    color: white;
    display: inline-block;
    padding: 5px;
}

#navigointi a:visited, #navigointi a:hover, #navigointi a:visited:hover {
    color: white;
}

#navigointi h1 {
    color: white;
    margin: 0;
}

#main {
    margin: 0 auto;
    padding: 5em 0;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
}

@media (min-width: 800px) {
    #main {
        border: 1px solid #dbdcda;
        border-radius: 10px;
        padding: 5em 10em;
    }
}

#main hr {
    color: fbfcfa;
    border: 1px solid #dbdcda;
}

#esipuhe {
    max-width: 40em;
    margin: 0 auto;
}
.otsikko {
    text-align: center;
}
.video {
    display: block;
    margin: 0 auto;
    max-width: 100vw;
    width: 560px;
    height: 315px;
}
.kategoria {
    display: block;
}

#kuva {
    border: 1px solid #dbdcda;
    float: left;
    margin: 5px;
    padding: 5px;
}