@font-face {
    font-family: nimi sin;
    src:url("PlayfairDisplay-Bold.ttf");
}
@font-face {
    font-family: kon;
    src:url("OpenSans-SemiBold.ttf");
}
@font-face {
    font-family: toki;
    src:url("OpenSans-Regular.ttf");
}
@font-face {
    font-family: sitelen pona;
    src:url("linja-nanpa.otf");
}

#footer {  
   bottom : 40px;  
   height : 40px;  
   margin-top : 40px;  
   text-align: center;  
   vertical-align: middle; 
   position:fixed;
   width:100%;
   font-family: sitelen pona;
}

#header {
top:40px;
height:40px;
margin-bottom:40px;
text-align:center;
vertical-align:middle;
position:static;
width:100%;
font-family: sitelen pona;
}


pre {
  white-space: pre-wrap;
}

body {
	background-color: #f8f8ff;
	font-size:150%;

}


a {
text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

@media (min-width:600px) and (min-height:700px) {
.nimisin-poki {
   position: absolute;
    top: 50%;
    left: 50%;
    width: 30vw;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
}

@media (max-width:600px) and (max-height:700px) {
    .nimisin-poki {
    padding-bottom:60px;
    }
}

.nimisin {
    font-family: nimi sin;
    color: #00002f;
}

.kon {
    color: #00002f;
    font-family: kon;
}

.toki {
    color: #7979ff;
    font-family: toki;
    font-style: italic;
}

.nena {
    color: #7979ff;
}

.nena:hover {
box-shadow: 0 0 5px #7979ff;
text-decoration:none;
}