@font-face {
    font-family: Mark;
    src: url(MarckScript-Regular.ttf);
}

@font-face {
    font-family: Lenx;
    src: url(Lexend-Medium.ttf);
}



body {
    font-family: Lenx, serif;
    background-color: rgb(157, 199, 212);
}

.container {
    background-color: rgb(113, 156, 167);
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.header {
    font-family: Mark, serif; 
    background-image: url(Taustakuva.jpg);
    height: 170px;
    background-size: cover;
    font-size: 50px;
    color: white;
    text-shadow: 0px 0px 10px rgb(32, 39, 61);

    display: flex;
    align-items: flex-end;
    justify-content: flex-end;

    padding: 5px 15px;
    box-sizing: border-box;
    line-height: 0,9;

    box-shadow: 0px -20px 30px -20px inset rgb(255, 255, 255);
}

.nav {
    text-align: center;
    background-color: rgb(127, 180, 209);
    padding: 7px;
    margin-bottom: 15px;
    margin-top: 15px;
    color: rgb(42, 66, 99);
    box-shadow: 0px 10px 20px -10px rgb(62, 115, 139);
}

.main {
    min-height: 400px;
}

img {
    border: 9px solid #a1c7d3;
    margin: 5px;
}
.etusivu img:hover {
    box-shadow: 0px 0px 10px rgba(9, 11, 12, 0.438);
}

.footer {
    clear: both;
    margin-top: 15px;
    text-align: center;
    background-color: #4b585c;
    color: white;
    padding: 15px
}

.etusivu .main{
 text-align: center;
}

.yhteys .main{
    padding: 40px;
    max-width: 700px;
}

.tietoa .main{
    padding: 40px;

}

.oikealla {
    float: right;
    margin-left: 40px;
    margin-bottom: 20px;
}

.tieto .main p {

}

.nav a{
    color: inherit;
    margin: 15px;
}

a:link {color: #5282b9;}
a:hover {
    text-decoration: none;
}
a:visited {
    color: #22475a;
}
a:active {color: rgb(144, 166, 199);}