.container {margin: auto;}
.navbar {margin: auto; background-color:darkgrey; width: 100%; border: 0px solid black;min-height: 30px; position: absolute; top: 105px;}
.buttonmenu { flex: 10%; padding: 5px; background-color: #2b6b7b; border: none; color: white; text-align: center;
    text-decoration: none; display: inline-block; font-size: medium; margin: 4px 2px; cursor: pointer; border-radius: 12px; }
.buttonmenu a { color: white; text-align: center; text-decoration: none; display: inline-block; font-size: medium; }    
.buttonmenu a:hover { color: darkgray; text-align: center; text-decoration: none; display: inline-block; font-size: medium; }

.row {    display: flex; flex-wrap: wrap;  }
.column {float: left; flex: 15%; margin: 0  0.5% 0.5% 0.5%; background-color: #f7f7f7; padding-left: 5px; }
@media screen and (max-width: 800px) {.column {flex: 50%}}
@media screen and (max-width: 400px) {.row {flex-direction: column;}}


.column1 {float: left; flex: 45%; margin: 0  0.5% 0.5% 0.5%; background-color: #f7f7f7; padding-left: 5px; }
@media screen and (max-width: 800px) {.column1 {flex: 100%}}
@media screen and (max-width: 400px) {.row {flex-direction: column1;}}

#header {background-position: top center; background-image: url("images/headerimg.jpg"); width:100%; height: 160px; background-repeat: no-repeat; border: 0px solid green; }

.headertoptitle {position: absolute; right: 10%; text-align: center; padding-bottom: 0px; border: 0px solid white;}
.headerbottomtitle {position: absolute; top: 55px; left: 10%; text-align: center; border: 0px solid white;}

h1{font-family:  "Montserrat", "Univers", Arial, "Arial Narrow", Times, "Times New Roman"; font-size:large; letter-spacing: 1px; color:#FFFFFF; font-weight: bold; text-transform: uppercase;}
h2{font-family:  "Montserrat", "Univers", Arial, "Arial Narrow", Times, "Times New Roman"; font-size:medium; letter-spacing: 1px; color:#000000; text-transform: uppercase;}