body {
    background-color: #F5FFDC;
    background-image: url("groupsbilde.jpg") ;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    height: 100%;
    padding:0;
    margin: 0

}
.left-bear {
    overflow: hidden;
    flex: 1 1 auto;
    max-width: calc(50vw  - 50vh * 596 / 394);
}
.right-bear {
    overflow: hidden;
    flex: 1 1 auto;
    max-width: calc(50vw  - 50vh * 596 / 394);
}
.right-bear .bear {
    position: absolute;
    bottom: 20px;
}
.without-bear {
    width: calc(100vh * 596 / 394);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 190%;
    height: calc(100vh - 111px);
    font-family: 'Comic Neue', cursive;
    color: #800020;
}
.without-bear.add {
    font-size: 160%;

}
.without-bear li {
    margin-bottom: 33px;
}
.bear {
    width: 100%;
    height: 150px;
    padding-top: 15px;
    margin:  20px auto 0;
    text-align: center;
    position: absolute;
    max-width: calc(50vw  - 50vh * 596 / 394);
    overflow: hidden;
}
img {
    animation: swing 3s infinite ease-in-out;
}
@keyframes swing {
    0% {transform: rotate(-15deg)}
    50% {transform: rotate(15deg)}
    100% {transform: rotate(-15deg)}
}
@media (aspect-ratio < 596/394) {
    body {
        background-size: cover;
    }
    .left-bear {
        width: 0;
    }
    .right-bear {
        width: 0;
    }
    .without-bear {
        width: 100vw;
    }
}
.main-content {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: stretch;
}
.menu-item {
    margin-left: 55px;
    font-weight: bold
}
.main-menu-item {
    margin-left: 15px;
    text-decoration: none;
    color: #800020
}
.last-item {
    margin-left: 55px;
    text-decoration: none;
    color: #800020
}
.menu {
    background-color: aquamarine; margin: 0; padding: 11px
}