html, body {
    height: 100%;
    margin: 0;
}

#main {
    display: flex;
    flex-flow: column;
    height: 100%;
}

#content {
    flex: 1 0 auto;
    margin: 2%;
    margin-top: 120px;
}

#header-links p {
    display: inline;
}

header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 900;
}

footer {
    flex: 0 1 auto;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
    z-index: 900;
}

.hf-title {
    margin: 0;
    margin-left: 20px;
}

.header-link {
    margin: 0 20px 0 0;
}

.column-container {
    display: flex;
}

.half-column {
    flex: 50%;
    margin: 10px;
}

.third-column {
    flex: 33.33%;
    margin: 10px;
}

.quarter-column {
    flex: 25%;
    margin: 10px;
}

.twothird-column {
    flex: 66.66%;
    margin: 10px;
}

.threequarter-column {
    flex: 75%;
    margin: 10px;
}

.right-align-div {
    display: flex;
    justify-content: flex-end
}

.bottom-align-div {
    display: flex;
    align-items: flex-end;
}

.vertical-align-div {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.fill-height-div {
    height: 100%; 
    top: 0; 
    left: 0; 
}

.center {
  margin: 0 auto;
  text-align: center;
}

#header-title-container{
    display: grid;
    align-items: center; 
    grid-template-columns: .1fr 500fr .1fr;
    column-gap: 5px;
}

#lang-img {
    width: 46px;
    margin-bottom: -10px;
}