﻿html, body
{
    height: 100%;
    margin: 0;
}

div.pagecontentcontainer
{
    display: flex;
}

div.pagecontent
{
    width: 260mm;
    margin: 0em 1em;
    background: white;
    /*box-shadow: 0px 0px 0.5em 0px rgba(0,0,0,0.3);
    padding: 0em 1em;*/
}

div.banner
{
    background-size: cover;
    line-height: normal;
    border-bottom: 2px solid black;
}

.banneritemscontainer
{
    display: flex;
    align-items: center;
}

.bannerbuttonscontainer
{
    flex-grow: 1;
    text-align: center;
}

a.bannerbutton, a.bannerbutton:link, a.bannerbutton:visited
{
	display: inline-block;
	background: black;
    margin: 0.2em;
	padding: 0.6em 1.2em;
	border-radius: 0.25em;
	text-decoration: none;
	color: white;
	box-shadow: 0px 0px 0.5em 0 rgba(0, 0, 0, 0.5);
}

a.bannerbutton:hover
{
	background: #002366;
}

.banner a.bannerbutton, .banner a.bannerbutton:link, .banner a.bannerbutton:visited
{
	background: rgba(0, 0, 0, 0.75);
}

.banner a.bannerbutton:hover
{
	background: #002366;
}

img.languageFlag
{
    height: 2.5em;
    margin: 0.25em;
}

#logoImage
{
    height: 8em;
}

.copyrightbar
{
    background: black;
    color: white;
    margin-top: 1em;
    padding: 0.5em;
    display: flex;
}

.copyrightcontainer
{
    display: flex;
    font-size: 80%;
    align-items: center;
    text-align: center;
    width: 260mm;
}

.copyrightbar a, .copyrightbar a:visited
{
    color: white;
}

.copyrightbar a:hover
{
    color: orange;
}

.copyrightbar .infoandlinks
{
    flex-grow: 1;
}

@media (max-width: 1100px)
{
    #logoImage
    {
        height: 7em;
    }

    a.bannerbutton, a.bannerbutton:link, a.bannerbutton:visited
    {
        padding: 0.5em 1em;
    }
}

@media (max-width: 900px)
{
    #logoImage
    {
        height: 5em;
    }

    a.bannerbutton, a.bannerbutton:link, a.bannerbutton:visited
    {
        padding: 0.4em 0.8em;
    }
}

@media (max-width: 600px)
{
    img.languageFlag
    {
        height: 2em;
    }

    .banneritemscontainer
    {
        flex-wrap: wrap;
    }

    a.bannerbutton, a.bannerbutton:link, a.bannerbutton:visited
    {
        /*padding: 0.3em 0.6em;*/
    }

    .bannerbuttonscontainer
    {
        order: 5;
        width: 100%; /* To force them on to the next line */
    }

    .logocontainer
    {
        flex-grow: 1;
    }

    #logoImage
    {
        height: 3em;
    }
}