@font-face {
    font-family: 'ETBembo';
    src: url('/fonts/ETBembo-RomanOSF.woff') format('woff'),
         url('/fonts/ETBembo-RomanOSF.otf') format('opentype'),
         url('/fonts/ETBembo-RomanOSF.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ETBembo';
    src: url('/fonts/ETBembo-SemiBoldOSF.woff') format('woff'),
         url('/fonts/ETBembo-SemiBoldOSF.otf') format('opentype'),
         url('/fonts/ETBembo-SemiBoldOSF.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'ETBembo';
    src: url('/fonts/ETBembo-DisplayItalic.woff') format('woff'),
         url('/fonts/ETBembo-DisplayItalic.otf') format('opentype'),
         url('/fonts/ETBembo-DisplayItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

body {
    font-family: 'ETBembo', serif;
    font-size: 18px;
}

#footer {
    font-size: 16px;
}

#top {
    display: table;
}

#toplogo {
    vertical-align: middle;
    display: table-cell;
    padding-top: 20px;
    padding-right: 50px;
    padding-bottom: 20px;
    padding-left: 20px;
}

#toptext {
    vertical-align: middle;
    display: table-cell;
    padding-right: 20px;
}

#content {
    padding-bottom: 20px;
    padding-left: 20px;
}

#footer {
    padding-left: 20px;
}

@media (min-width: 896px) {
    #content, #footer {
        padding-left: 198px;
        padding-right: 50px;
    }
}

@media (min-width: 512px) {
    .topname { font-size: 48px; }
    .topline { font-size: 24px; }
}

@media (max-width: 511px) {
    .topname { font-size: 36px; }
    .topline { font-size: 18px; }
    #toplogo { padding-right: 30px; }
}