@font-face {
   font-family: 'Roboto Condensed';
   src: url('../fonts/Roboto_Condensed_400.eot?#iefix');
   src:
      local('Roboto Condensed'),
      url('../fonts/Roboto_Condensed_400.woff') format('woff'),
      url('../fonts/Roboto_Condensed_400.woff2') format('woff2');
}
@font-face {
   font-family: 'Roboto Condensed';
   font-style: normal;
   font-weight: 700;
   src: url('../fonts/Roboto_Condensed_700.eot?#iefix');
   src:
      local('Roboto Condensed Bold'),
      url('../fonts/Roboto_Condensed_700.woff') format('woff'),
      url('../fonts/Roboto_Condensed_700.woff2') format('woff2');
}

body {
    font-family: 'Roboto Condensed';
}

header#banner {
    background-color: rgb(238,238,238);
    width: 100%;
}

header#banner a {
    font-family: courier;
    font-weight: bold;
    text-decoration: none;
    color: black;
}

nav#menu {
    margin-top: 2cm;
}

div#content {
    text-align: justify;
    max-width: 20cm;
}

footer#contentinfo {
    background-color: rgb(238,238,238);
    width: 100%;
    text-align: center;
}

@media only screen and (min-width: 1100px) {
    header#banner {
        position: fixed;
        top: 0px;
        left: 0px;
        opacity: 0.9;
        z-index: 9;
    }

    header#banner a {
        font-size: 36px;
    }

    nav#menu {
        position: fixed;
        top: 2cm;
        margin-top: 0cm;
    }

    div#content {
        padding-top: 2cm;
        padding-bottom: 5cm;
        width: 70%;
        margin-left: auto;
        margin-right: auto;
    }

    footer#contentinfo {
        position: fixed;
        bottom: 0px;
        opacity: 0.9;
        z-index: 9;
    }
}