label.required::after {
    color: #a94442;
    content: " *";
    /*font-size: x-small;*/
    vertical-align: super;
}

table.datainfo td, table.table-datainfo td {
    font-weight: bolder;
    vertical-align: top;
}

#google-signin {
    outline: none;
    background: url(/img/btn_google_signin_dark_normal_web@2x.png);
    background-size: 193px 48px;
    width: 193px;
    height: 48px;
}

#google-signin:hover {
    outline: none;
    background: url(/img/btn_google_signin_dark_focus_web@2x.png);
    background-size: 193px 48px;
    width: 193px;
    height: 48px;
}

#google-signin:active {
    outline: none;
    background: url(/img/btn_google_signin_dark_pressed_web@2x.png);
    background-size: 193px 48px;
    width: 193px;
    height: 48px;
}

table th {
    white-space: nowrap;
}

table td {
    max-width: 45ch;
}

table.table-last-fit td:last-child {
    width: 65px;
    white-space: nowrap;
}

.font-monospace {
    font-family: Courier, "Liberation Mono", monospace;
}

dl.dl-md-centered {
    width: 300px;
    margin-left: 30px;
}

dl.dl-wider dt {
    width: 180px;
}

dl.dl-wider dd {
    margin-left: 200px;
}

dl.dl-wider-centered dt {
    width: 300px;
}

dl.dl-wider-centered dd {
    margin-left: 320px;
}

dl.dl-horizontal-centered {
    display: grid;
    grid-template-columns: repeat(2, 50%);
}

dl.dl-horizontal-centered dt {
    text-align: right;
    margin-right: 10px;
}

dl.dl-horizontal-centered dd {
    margin-left: 10px;
}

dl.dl-spaced dt:not(:first), dl.dl-spaced dd:not(:first) {
    margin-top: 0.5em;
}

.highlight {
    background-color: #ff0;
}

.glyph-signature {
    content: url(/img/signature-icon-freepik.svg);
    height: 15px;
    width: 15px;
}

/* Absolute Center Spinner */
.loading {
    position: fixed;
    z-index: 999;
    height: 2em;
    width: 2em;
    overflow: visible;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Transparent Overlay */
.loading:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
    /* hide "loading..." text */
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.loading:not(:required):after {
    content: '';
    display: block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    -webkit-animation: spinner 1500ms infinite linear;
    -moz-animation: spinner 1500ms infinite linear;
    -ms-animation: spinner 1500ms infinite linear;
    -o-animation: spinner 1500ms infinite linear;
    animation: spinner 1500ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@media print {
    .panel-heading {
        padding: 0 15px;
    }

    dl {
        margin-bottom: 0;
    }

    tr.data-separator {
        border-top:1px solid;
        border-bottom:1px solid;
    }

    td {
        padding: 2px !important;
    }

    .col-print-12 {
        float: initial !important;
        margin: 0 !important;
        width: 95% !important;
    }

    /*.success, .label-success, tr.success > td {
        color: #fff !important;
        background-color: #eee !important;
    }*/

    .info, .label-info, tr.info > td {
        background-color: #eee !important;
    }

    .danger, .label-danger, tr.danger > td {
        color: #fff !important;
        background-color: #555 !important;
    }

    .text-muted {
        color: #777 !important;
    }
}

@media (orientation: landscape) and (max-width: 768px) {
    .fullscreen-on-landscape .modal-dialog {
        height: 100%;
        margin: 0;
    }

    .fullscreen-on-landscape .modal-header {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .fullscreen-on-landscape .modal-content {
        height: 100%;
        position: relative;
    }

    .fullscreen-on-landscape .modal-footer {
        padding-top: 8px;
        padding-bottom: 8px;
        bottom: 0;
        position: absolute;
        width: 100%;
    }

    .visible-portrait {
        display: none !important;
    }
}

@media (orientation: portrait) and (max-width: 768px) {
    .fullscreen-on-landscape .modal-header {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .fullscreen-on-landscape .modal-footer {
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .visible-landscape {
        display: none !important;
    }
}