body, app, .main {
    height: 100%;
}
.content {
    position: relative;
    height: 100%;
}
.toolbar {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    z-index: 99;
    top: 8px;
    right: 0px;
    margin-bottom: 20px;
    height: 60px;
    background-color: #f1f3f4;
    width: 100%;
    box-shadow: 0px 4px 14px 0px rgba(182,182,182,0.51);
    -webkit-box-shadow: 0px 4px 14px 0px rgba(182,182,182,0.51);
    -moz-box-shadow: 0px 4px 14px 0px rgba(182,182,182,0.51);
}

.toolbar-container {
    position: relative;
    height: 100%;
    width: 100%;

}

.toolbar-content {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.toolbar-space {
    margin-bottom: 60px;
    
}

.pagebar {
    border-radius: 4px;
    padding: 6px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.19), 2px 2px 6px rgba(0,0,0,0.23);
    
}

.pagebar-container {
    margin-top: 80px;
}

.pagebar-default {    
    margin: 8px;
    display: inline;
    float: right;
}

.pagebar-fixed {
    position: fixed;
    bottom: 25px;
    right: 10px;
    left: 10px;
}

.page-load-btn  {
    position: fixed;
    bottom: 30px;
    right: 30px;
}

pre {
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    font-family: inherit;
}

@media (min-width: 768px){
    .pagebar-default {
        margin: 25px;
        display: inline;
        float: right;
    }

    .pagebar-fixed {
        position: fixed;
        bottom: 20px;
        right: 30px;
        left: auto;
    }
}