html, body {
    height: 100%;
    background: #efefef;
}
.tam-body {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}
.full-h {
    flex: 1;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.fs-sm { font-size: .875em; }
.xl-icon { font-size: calc(3.5rem + 4vw); }
.alert { color: #fff; }
.alert-danger { background: #f44336 !important; }
.alert-success { background: #4caf50 !important; }
.alert-warning { background: #ff9800 !important; }
.alert-primary { background: #2196f3 !important; }
.text-danger { color: #f44336 !important; }
.text-success { color: #4caf50 !important; }
.text-warning { color: #ff9800 !important; }
.text-primary { color: #2196f3 !important; }
.btn-danger { background-color: #f44336; border-color: #f44336; }
.btn-success { background-color: #4caf50; border-color: #4caf50; }
.btn-warning { background-color: #ff9800; border-color: #ff9800; }
.btn-primary { background-color: #2196f3; border-color: #2196f3; }
.btn-danger:hover { background-color: #d81d10; border-color: #d81d10; }
.btn-success:hover { background-color: #349237; border-color: #349237; }
.btn-warning:hover { background-color: #ce7b00; border-color: #ce7b00; }
.btn-primary:hover { background-color: #0d7ad4; border-color: #0d7ad4; }
.logo { text-align: center; }
.logo img, .logo svg { height: 30px; }
.logo span {
    font-size: calc(1rem + 1.5vw);
    font-weight: 700;
    text-transform: uppercase;
}
.card {
    border: 0;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
}
.card-title {
    font-size: 1.25rem;
    font-weight: 500;
    letter-spacing: .0125em;
    line-height: 2rem;
}
.video-container { background: rgba(0,0,0,.8); }
#video_display { margin: 0 auto; }
#video_display, #video_display video {
    max-width: 100% !important;
    width: 100%;
    height: auto !important;
}
.emp-list { font-size: .75rem; }
@media (min-width: 1200px) and (max-width: 1399px) {
    /* #video_display, #video_display video {
        max-width: 420px !important;
    } */
}
@media (min-width: 992px) and (max-width: 1199px) {
    /* #video_display, #video_display video {
        max-width: 510px !important;
    } */
}
@media (min-width: 769px) and (max-width: 991px ) {
    #video_display, #video_display video {
        /* max-width: 396px !important; */
        height: auto !important;
    }
}
@media (max-width: 767px) {
    #video_display, #video_display video {
        max-width: 100% !important;
        max-height: 100% !important;
    }
}