/*
BLACK   #000112
DARK    #09203D
MED     #113F67
LIGHT   #678C99
WHITE   #F2F8F5
*/

/*FONTS*/
.kirang-haerang-regular {
  font-family: "Kirang Haerang", system-ui;
  font-weight: 400;
  font-style: normal;
}
.mandali-regular {
  font-family: "Mandali", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* BOXES */
.body {
    background-color: #678C99;
    background-image: url("https://www.transparenttextures.com/patterns/asfalt-light.png");
    padding: 20%;
}
.head {
    background-color:#09203D;
    color: #F2F8F5;
    border-radius: 12px 12px 0 0;
    padding: 20px;
}
.side { 
    background-color: #113F67;
    color: #F2F8F5;
    padding: 15px;
    align-items: center;
}
.main {
    background-color: #F2F8F5;
    color: #000112;
    padding: 15px;
}
.foot {
    background-color:#09203D;
    color: #F2F8F5;
    border-radius:0 0 12px 12px;
    padding: 10px;
    text-align: center;
}
/* TEXT */
h1 {
    font: 2em Kirang Haerang;
    text-align: center;
}
h2 {
    font: 1.8em Kirang Haerang;
    text-align: center;
    color: #000112;
}
p {
    font: 1em mandali-regular;
    text-align: left;
}
.foot p {
    font: 0.75em mandali-regular;
}
.foot a {
    font: 0.75em mandali-regular;
    text-decoration: none;
    font-weight: bold;
    text-align: center;
    color: white;
}
/* NAV BAR */
a.bloop:link, a.bloop:visited {
    padding: 15px;
    margin: 10px 0px;
    background-color: #678C99;
    border: 5px solid #09203D;
    border-radius: 12px;
    min-width: 100px;
    display:block;
    transition-duration: 0.5s;
    /* text */
    font-family: kirang-haerang-regular;
    text-decoration: none;
    color: white;
    text-align: center;
}
a.bloop:hover, a.bloop:active {
    padding: 15px;
    margin: 10px 0px;
    background-color: #09203D;
    border: 5px solid #09203D;
    border-radius: 12px;
    min-width: 100px;
    display:block;
    transition-duration: 0.5s;
    /* text */
    font-family: kirang-haerang-regular;
    text-decoration: none;
    color: white;
    text-align: center;
}
/* LINK GROUP */
.longList {
    background-color:#D9DFDC;
    color: #678C99;
    font-family: mandali-regular;
}