html, body {
    margin: 0;
    height: 100%;
    background-color: #2B2B2B;
}

.container-fluid {
    padding: 0;
}

.content {
    padding-left: 0;
    padding-right: 0;
}

.full-height {
    min-height: 100%;
    height: 100%;
}

.pdf-viewer {
    width: 100%;
    height: 100%;
}

.navigation {
    background-color: #2B2B2B;
    height: 50px;
    margin: 0 auto;
        padding-left: 0;
        padding-right: 0;

}

.navigation-left {

}

.navigation-title {
    height: 50px;
    top: 0;
    left: 120px;
    position: relative;
}

.navigation-right {
    text-align: right;
}

.spinner {
    display: none;
    position: fixed;
    z-index:100;
    top: 100px;
    width: 100%;
    text-align: center;
}

.spinner img {
    height: 100px;
}

.button {
    text-align: center;
    color: white;
    padding-top: 14px;
    font-size: 16pt;
    width: 50px;
    height: 100%;
}

.buttons {
    height: 100%;
}

.audio-info {
    overflow: hidden;
    padding-top: 2px;
    font-family: 'Courier New', 'Courier New', sans-serif;
    font-size: 10pt;
    line-height: 12pt;
    text-align: center;
    color: white;
}

.audio-info .title {
    font-size: 8pt;
}

.audio-info .theo {
    padding-top: 7px;
}

.audio-info .anna {
    padding-top: 7px;
}

.audio-info .felicia {
    padding-top: 7px;
}

.audio-info .mats {
    padding-top: 7px;
}

@media (max-width: 600px) {
    .audio-info .theo {
        padding-top: 0;
    }

    .audio-info .catalogue {
        display: none;
    }
}

@media (max-width: 360px) {
    .audio-info .anna {
        padding-top: 0;
    }
    .audio-info .theo {
        padding-top: 0;
    }
}