@supports (scroll-behavior: smooth) {
    html {
        scroll-behavior: smooth
    }
}

.scroll {
    bottom: 0;
    transition: all .15s ease !important;
    right: 1rem;
    transform: translateY(100%);
    z-index: 1040;
}

.highlight {
    background-color: #e6ecf5 !important;
}

.options-zone:hover {
    background-color: #eeeeee !important;
    border-radius: 9px;
    border-bottom-width: 1px !important;
}


.navbar-dark .nav-link {
    color: #fff !important;
}

.nav-link:hover {
    opacity: .5
}

body {
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    font-size: .9rem;
    max-width: 1170px;
    min-width: 320px;
}

.fullheight {
    background-color: #fff;
    min-height: 100vh;
}


body.popupPage {
    background-color: #fff;
    margin: 10px 0
}



footer {
    bottom: 0;
    left: 0;
    z-index: 3;
}

.errorMessage {
    margin: 5px;
    color: Red;
    font-weight: 400;
    padding: 5px;
}

.hiddenMessage {
    display: none
}

.LabelError {
    margin: 0;
    border: 0;
    width: 99%;
    color: Red;
    font-weight: 400;
}

.statuslegend {
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    font-size: 8pt;
    text-align: right
}

.helpContent {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    color: #333;
    font-size: 10pt
}

    .helpContent table {
        line-height: 1em
    }

    .helpContent td {
        padding: 5px
    }

.header-sub a {
    color: #36C;
    font-size: 15px;
    text-decoration: none
}

    .header-sub a:visited {
        text-decoration: none
    }

    .header-sub a:hover {
        border-bottom: 1px dashed #00f
    }

span.header-main {
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    color: green;
    font-size: 18px
}

span.header-sub {
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    font-size: 15px;
    color: #36C
}

.text-sub {
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    font-size: 11px;
    color: #666;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 0;
    border-bottom: 1px solid #777777;
    margin-bottom: 7px
}

    .text-sub img {
        vertical-align: middle
    }

    .text-sub a {
        color: #36C;
        text-decoration: none
    }

        .text-sub a:visited {
            text-decoration: none
        }

        .text-sub a:hover {
            border-bottom: 1px dashed #00f
        }


.buttonTypeLinkReg {
    margin: 5px 0;
    padding: 5px 0;
    text-align: left;
    vertical-align: middle
}

    .buttonTypeLinkReg span {
        float: left;
        padding-right: 5px;
        text-align: left;
        text-decoration: none
    }

    .buttonTypeLinkReg select {
        float: left
    }


.actionToolbar {
    border-bottom: 1px solid gray;
    clear: both;
    font-size: 10pt;
    margin: 5px 0;
    overflow: hidden;
    padding: 5px 0;
    text-align: left
}



.linkButton {
    color: #356A00;
    margin: 0 0 0 15px;
    text-decoration: underline;
    vertical-align: middle
}

:hover.linkButton {
    text-decoration: underline
}

.pageContent {
    border-bottom: 0 solid gray;
    margin: 10px 10px 5px;
    padding: 5px 0;
    overflow: hidden;
    text-align: left
}

.leftColumn {
    border-right: solid 1px #CCC;
    float: left;
    font-size: medium;
    padding: 5px 0;
    text-align: left;
    width: 63%
}

.rightColumn {
    float: right;
    font-size: medium;
    padding: 5px 0;
    text-align: left;
    width: 35%
}


.linkText {
    clear: both;
    font-family: 'Roboto', 'Lato', Arial, Helvetica, Sans-Serif;
    margin: 2px 10px;
    padding-bottom: 10px;
    overflow: visible;
    position: relative;
    text-align: left;
    vertical-align: middle
}

    .linkText a {
        color: #36C;
        display: block;
        font-size: 15px;
        font-weight: 400;
        vertical-align: middle
    }

.smallTitle {
    font-weight: bolder;
    padding: 2px 0
}

.infoText {
    font-size: small;
    padding: 2px
}

.watermarked {
    color: #AAA
}

.navigationFirst {
    clear: both;
    font-size: x-small;
    padding: 10px 0;
    margin: 10px 0;
    width: 100%;
    background: url(buttons/go-first.png) center right no-repeat
}

.navigationLast {
    clear: both;
    font-size: x-small;
    padding: 10px 0;
    margin: 10px 0;
    width: 100%;
    background: url(buttons/go-last.png) center right no-repeat
}

.navigation {
    clear: both;
    font-size: x-small;
    padding: 10px 0;
    margin: 10px 0;
    width: 100%
}

    .navigation li {
        display: inline-block;
        margin: 0
    }

    .navigation span {
        background-color: #FEFEFE;
        border: solid 1px #ccc;
        border-radius: 5px;
        padding: .3em .7em;
        margin: 0 .38em 0 0
    }

    .navigation a {
        border: solid 1px #ccc;
        border-radius: 5px;
        padding: .3em .7em;
        margin: 0 .38em 0 0;
        text-decoration: none
    }

        .navigation a:hover {
            background-color: #f0f7e8;
            border: 1px solid #83bc46
        }

.configuration {
    overflow: auto;
    vertical-align: middle
}

    .configuration li {
        padding: 2px
    }

    .configuration .actionButton {
        bottom: 5px;
        display: block;
        position: absolute;
        right: 5px;
        font-size: 8pt
    }

.labelBox {
    display: inline-block;
    padding: 0 5px;
    text-align: right;
    vertical-align: top !important;
    width: 250px;
    font-weight: 400
}

.regDataBaseBox {
    display: inline-block;
    text-align: left;
    vertical-align: middle !important
}

.pageInfo {
    border-bottom: 1px solid gray;
    color: #356A00;
    font-size: large;
    font-weight: 400;
    overflow: hidden;
    text-align: left
}

.defaultPage .pageInfo {
    margin: 0 10px;
    padding: 5px 0
}

.resultsPage .pageInfo {
    clear: both;
    padding: 10px 0 0
}

.pageInfo a {
    color: #356A00;
    text-decoration: none
}

    .pageInfo a:hover {
        color: #7ede33
    }

.pageInfo input {
    background: none;
    border: none;
    float: right;
    text-align: left;
    text-decoration: underline
}

    .pageInfo input:hover {
        cursor: pointer
    }

.infoPadding {
    border-bottom: 1px solid gray;
    clear: both;
    color: #356A00;
    padding: 5px 0;
    overflow: hidden;
    text-align: left
}

    .infoPadding .bold {
        font-weight: 400
    }

    .infoPadding .notbold {
        font-weight: 400
    }

.verticalAlignCenter {
    vertical-align: middle
}

.imageButton {
    cursor: pointer
}


.centerText {
    text-align: center
}

.labelRow {
    height: 2em;
    vertical-align: top
}

.actionRow {
    height: 2em;
    text-align: center !important;
    vertical-align: bottom
}

.centralContentLeft {
    padding: 0 10px;
    vertical-align: top
}

.centralContentRight {
    margin-left: 10px;
    text-align: left;
    vertical-align: top
}

.updateProgressInline {
    display: inline-block;
    margin: 0 10px;
    vertical-align: middle
}

    .updateProgressInline img {
        width: 20px
    }

.recordOptionsLeft {
    position: relative;
    left: 0;
    float: left;
    white-space: nowrap
}

.recordOptionsRight {
    position: relative;
    left: 0;
    float: right;
    text-align: right;
    margin-right: 20px
}

.messagetext i {
    background: #99f;
    font: 10px/12px Arial, Sans-serif;
    margin: 5px 5px 15px 0;
    padding: 5px;
    color: #fff;
    text-decoration: none;
    display: block;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0
}

.librarylist-styled-select {
    background: #E8EAEC;
    height: 25px;
    overflow: hidden;
    width: 100%
}

    .librarylist-styled-select select {
        background: #E8EAEC;
        border: none;
        font-size: 12px;
        height: 25px;
        padding: 4px;
        width: 100%
    }

.librarylist-semi-square {
    background: #E8EAEC;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.librarylist-blue {
    color: #000
}

    .librarylist-blue select {
        color: #000
    }

.librarylist-styled-select option:checked {
    background-color: #E8EAEC;
    color: #000
}

.comment {
    width: 400px;
    background-color: #f0f0f0;
    margin: 10px
}

a.morelink {
    text-decoration: none;
    outline: none;
    color: #c4161c !important;
    font-weight: bold
}

.morecontent span {
    display: none
}

.linksList {
    margin: 5px 0;
    -webkit-padding-start: 0
}

a.boxedLink {
    background-color: #fff;
    border: solid 1px #ccc;
    color: #2B3856;
    font-size: .9em;
    margin: 0;
    border-radius: 4px;
    padding: 0 1px;
    text-decoration: none
}

    a.boxedLink:hover {
        background-color: #ccc
    }


li ui-menu-item {
    font-size: 100px !important;
}

/* LibraryInfo*/

.libraryinfo .carousel-cell {
    width: 100%;
    min-height: 100%;
    padding: 0 2.5rem
}

.libraryinfo .card img {
    border-radius: calc(.3rem - 1px) calc(.3rem - 1px) 0 0;
    height: 100%;
}

@media (min-width:768px) {
    .libraryinfo .card img {
        border-radius: .3rem 0 0 .3rem
    }
}

.img-overlay {
    height: 100%;
    min-height: 270px;
    width: 100%
}

.card-img-overlay {
    background: linear-gradient(to top,rgba(0,0,0,.9) 0,transparent 100%) repeat-x
}

img[data-ofi="cover"] {
    object-fit: cover;
    object-position: center;
    font-family: 'object-fit: cover; object-position: center;'
}