html,body{margin:0;padding:0}
body{
    font: 82% arial,sans-serif;
    text-align:center;
    background: #5cdb95
}

p{
    margin:0 10px 10px;
    line-height: 1.4;
}
a{text-decoration:none; color:#edf5e1;}

/* Below is main dividers for the page. */

body{
    background-image: url("assets/backg.png");
    background-size: 380px;
    background-repeat: repeat;
}

div#container{
    background-color: #8ee4af;
    text-align:left;
    width:900px;
    margin:0 auto;
}

div#header{
    background-color:#379683;
    background-image: url("Logo.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 40px;
    height: 80px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
div#header #headlink{
    height: 40px;
    width: 470px;
    margin: 0px 215px 20px;
    vertical-align: middle;
    float: left;
    margin-top: 20px;
}

div#wrapper{
    float:left;
    width:100%;
    background: #8ee4af;
}

div#content{
    color: #05386b;
    display: block;
    width: 730px;
    height: auto;
    float: left;
    margin-left: 10px;
}

div#extrabar{
    display: block;
    width: 150px;
    height: auto;
    float: right;
}

div#footer{
    align-items: center;
    height: 65px;
    bottom: 0px;
}

/* Below is the rest of the styling */

div#content h2{
    margin: 0 0px;
}
div#content h3{
    margin: 10px 10px;
}
div#content a{
    color: #05386b;
    line-height:1.4;
    text-decoration: underline;
}
div#content a:hover{
    color: #edf5e1;
}

/*Below starts a lot of color changes*/

.item{
    background: #379683;
}
.item strong{
    color: #edf5e1;
}
.news{
    background: #379683;
    color: #edf5e1;
}
.news:hover{
    background: #05386b;
    color: #edf5e1;
}
.line{
    color: #379683;
}
#itemBack{
    background: #379683;
}

/*End of color changes*/

.extra{
    background:#edf5e1;
    color: #05386b;
    border-radius: 10px;
    width: auto;
    padding-top: 10px;
}
.extra img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 130px;
}
.extra a{
    color: #05386b;
    line-height:1.4;
    text-decoration: underline;
}
.extra a:hover{
    color: #8ee4af;
}

div#footer #menu{
    background: #8ee4af; /*´Same as background for text*/
    display: flex;
    height: 40px;
    width: 900px;
    float: center;
    justify-content: center;
    align-content: center;
    position: sticky;
    bottom: 25px;
}
div#footer #bottom{
    flex: auto;
    background:#379683;
    color: #edf5e1;
    vertical-align: center;
    width: 900px;
    height: 25px;
    position: sticky;
    bottom: 0;
}

#menuItem{
    color: #edf5e1;
    background: #379683;
    width: 130px;
    height: 30px;
    margin: 5px 3px 5px;
    border-radius: 30px;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
    transition: 0.2s;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2;
}
#menuItem:hover{
    background-color: #05386b; /*Normal menuitem*/
    color: #edf5e1;
    text-decoration: none;
}
#menuItem a{
    color: #edf5e1;
    text-decoration: none;
}
div#footer p{
    margin: 0px;
    padding: 5px;
    text-align: center;
}
div#footerleft a{
    color: #edf5e1;
    text-decoration: underline;
}
div#footer a:hover{
    color: #8ee4af;
}
div#footerleft{
    display: block;
    float: left;
    width: 300px;
    height: 25px;
}
div#footermid{
    display: block;
    float: left;
    width: 300px;
    height: auto;
}
div#footerright{
    display: block;
    float: left;
    width: 300px;
    height: auto;
}
div#footerleft p{
    text-align: left;
    margin-left: 10px;
}
/* Below is colors for the collapsible in the changelog */
.collapsible {
    background-color: #edf5e1;
    color: #05386b;
    background: linear-gradient(to left, #edf5e1 50%, #379683 50%);
}
.active, .collapsible:hover {
    color: #edf5e1;
}
/* Below is for the images on the "other sites" page */
#link{
    width: 300px;
    height: 100px;
    border-radius: 20px;
    border: 4px solid #379683;
}