[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none;
}

.fltlft {
    float: left;
}

.fltrht {
    float: right;
}

.fltnon {
    float: none;
}

.fn {
    float: none;
}

.posrel {
    position: relative;
}

.posabs {
    position: absolute;
}

.clrbth {
    clear: both;
}

.cl {
    clear: left;
}

.cr {
    clear: right;
}

.cn {
    clear: none;
}

.disblk {
    display: block;
}

.dib {
    display: inline-block;
}

.dt {
    display: table;
}

.dn {
    display: none;
}

.lrg-panel-width {
    width: 452px;
}

.med-panel-width {
    width: 345px;
}

.sml-panel-width {
    width: 250px;
}

.xlrg-panel-width {
    width: 600px;
}

.tac {
    text-align: center !important;
}

.tal {
    text-align: left;
}

.tar {
    text-align: right;
}

.ttu {
    text-transform: uppercase;
}

.abs-zero-pos {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.w100p {
    width: 100%;
}

.w50p {
    width: 50%;
}

.w50pWm {
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
}

.w150px {
    width: 150px;
}

.w90pWm {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}

.w95pWm {
    width: 95%;
    margin-left: 2.5%;
    margin-right: 2.5%;
}

.w90p {
    width: 90%;
}

.h128px {
    height: 128px;
}

.h160px {
    height: 160px;
}

.p10px {
    padding: 10px !important;
}

.pT4px {
    padding-top: 4px !important;
}

.pT8px {
    padding-top: 8px !important;
}

.pT10px {
    padding-top: 10px !important;
}

.pL25px {
    padding-left: 25px !important;
}

.pR25px {
    padding-right: 25px !important;
}

.h128px {
    height: 128px;
}

.p4px {
    padding: 4px;
}

.m4px {
    margin: 4px;
}

.mL100px {
    margin-left: 100px !important;
}

.mL75px {
    margin-left: 75px !important;
}

.mL120px {
    margin-left: 120px !important;
}

.mL60px {
    margin-left: 60px !important;
}

.mL50px {
    margin-left: 50px !important;
}

.mL40px {
    margin-left: 40px !important;
}

.mL30px {
    margin-left: 30px !important;
}

.mL25px {
    margin-left: 25px !important;
}

.mL15px {
    margin-left: 20px !important;
}

.mL20px {
    margin-left: 20px !important;
}

.mL10px {
    margin-left: 10px !important;
}

.mL5px {
    margin-left: 5px !important;
}

.mL4px {
    margin-left: 4px !important;
}

.mT5px {
    margin-top: 5px !important;
}

.mT3px {
    margin-top: 3px !important;
}

.mT8px {
    margin-top: 8px !important;
}

.mT10px {
    margin-top: 10px !important;
}

.mT15px {
    margin-top: 15px !important;
}

.mT20px {
    margin-top: 20px !important;
}

.mT40px {
    margin-top: 20px !important;
}

.mB4px {
    margin-bottom: 4px !important;
}

.mB10px {
    margin-bottom: 10px !important;
}

.clrblk {
    color: #000;
}

.clrwht {
    color: #fff;
}

.clrgra {
    color: #ccc;
}

.clrred {
    color: #f00;
}

.clrgrn {
    color: #5ca904;
}

.clrylw {
    color: #ffc000;
}

.clrblurch {
    color: #2980b9;
}

.clrblurchbg {
    background: #2980b9;
}

.bkclrblk {
    background: #000000;
}

.bkclrred {
    background: #ff0000 !important;
}

.bkclrgrn {
    background: #5ca904 !important;
}

.bkclrylw {
    background: #ffc000 !important;
}

.t60px {
    top: 60px !important;
}

.t30px {
    top: 30px !important;
}

.t40px {
    top: 40px !important;
}

.mR50px {
    margin-right: 50px;
}

.mrla {
    margin-right: auto !important;
    margin-left: auto !important;
}

.ovrhid {
    overflow: hidden;
}

.fntxl {
    font-size: 16px !important;
}

.fntmed {
    font-size: 11px !important;
}

.fntsml {
    font-size: 10px !important;
}

.fwb {
    font-weight: bold;
}

.fwn {
    font-weight: normal;
}

.ajaxgifdim {
    width: 28px;
    height: 28px;
}

.crsrpntr {
    cursor: pointer;
}

.asm {
    margin-left: auto !important;
    margin-right: auto !important;
}

.noborder {
    border: none !important;
}

div {
    user-select: none;
    -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
}

td {
    user-select: text;
    -khtml-user-select: text;
    -o-user-select: text;
    -moz-user-select: text;
    -webkit-user-select: text;
}

input {
    user-select: text;
    -khtml-user-select: text;
    -o-user-select: text;
    -moz-user-select: text;
    -webkit-user-select: text;
}

.loading-thumb {
    background: #cccccc;
    background-size: 16px 16px;
    -webkit-background-size: 16px 16px;
    -moz-background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../img/thumb-loader.gif);
}

.image-not-found-sml-thumb {
    background: #cccccc;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../img/image-not-found-thumb-sml.png);
}

.tooltip.in {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

html,
body {
    overflow: hidden;
}

* {
    padding: 0;
    margin: 0;
}

.current-filter {
    color: #ff0000 !important;
}

.search-component-container {
    width: 100%;
    font-size: 12px;
    line-height: 13px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.modal-heading {
    margin-top: 3px;
    padding: 5px;
    text-align: center;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}

.modal-body {
    width: 100%;
    margin-top: 15px;
    height: 150px;
    overflow-y: auto;
}

.modal-ulist {
    list-style-type: none;
    margin-right: 20px;
    width: 60%;
    margin-left: 20%;
    margin-right: 20%;
}

.modal-button-container {
    width: 100%;
    text-align: center;
    margin-top: 15px;
}

.modal-warning-heading {
    margin-top: 20px;
    padding: 10px;
    text-align: center;
    width: 290px;
    margin-left: 10px;
    background: #c0392b;
}

.modal-button-container button {
    padding-left: 15px;
    padding-right: 15px;
}

.displaying-numberof-indicator {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 5px;
    margin-bottom: 35px;
    text-align: center;
    font-size: 12px;
}

#PrintModaliFrame {
    width: 100%;
    height: 100%;
    overflow-y: hidden;
}

.ff-hide {
    display: none;
}

.ff-hidden {
    visibility: hidden;
}

.red-caret {
    border-top-color: red !important;
    border-bottom-color: red !important;
}

.white-caret {
    border-top-color: white !important;
    border-bottom-color: white !important;
    margin-top: 6px;
    margin-left: 12px;
}

.btn {
    background: #fff;
    border: 1px solid #cccccc !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -moz-transition: none !important;
    -webkit-transition: none !important;
    line-height: 14px;
    font-size: 13px;
    border-color: #cccccc !important;
    text-shadow: none !important;
    white-space: normal !important;
}

.action-button {
    margin-right: 3px;
    margin-top: 2px;
    outline: none;
    z-index: 700;
}

.filter-button {
    margin-left: 10px;
    margin-top: 2px;
    outline: none;
    z-index: 700;
}

.filter-banner {
    left: 0;
    right: 0;
    height: 25px;
    line-height: 25px;
    background-color: #fe9705;
    font-weight: normal;
}

.current-filter-banner {
    position: absolute;
    left: 0;
    right: 0;
    height: 25px;
    text-align: left;
    line-height: 25px;
    font-size: 11px;
    padding-left: 10px;
    background-color: #7cc119;
    font-weight: normal;
}

#notifier-panel {
    z-index: 790;
}

.version-info-table {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding: 5px;
}

.version-info-table > thead > tr > th {
    text-align: center;
    font-weight: bold;
}

.version-info-table > tbody > tr > td:first-child {
    padding: 3px;
    text-align: right;
    font-weight: bold;
    width: 125px;
}

.version-info-table > tbody > tr > td:nth-child(2) {
    padding: 3px;
    text-align: left;
    width: 125px;
}

.portal-update-date {
    font-weight: normal !important;
    text-align: center !important;
    padding: 0px !important;
}

#notifier-settings-button {
    height: 30px;
    cursor: pointer;
    height: 40px;
    padding: 5px;
    padding-left: 15px;
    padding-right: 35px;
    max-width: 280px;
    overflow: hidden;
}

#notifier-settings-button i {
    font-size: 16px;
    margin-left: 15px;
    line-height: 25px;
    clear: none;
    color: inherit;
}

#notifier-settings-button p {
    max-width: 200px;
    overflow: hidden;
    line-height: 25px;
    font-size: 12px;
    margin-left: 10px;
    margin-top: -3px;
    color: inherit;
}

.notifier-ff-heading {
    padding: 5px;
    height: 30px;
    font-weight: bold;
    text-align: right;
    letter-spacing: 2px;
    padding-right: 25px;
    padding-left: 20px;
    width: 145px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: 130px 0px;
}

.notifier-heading {
    padding: 5px;
    height: 30px;
    font-weight: bold;
    text-align: left;
    /*letter-spacing: 3px;*/
    padding-right: 20px;
    padding-left: 25px;
    width: 145px;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: -15px 0px;
}

.refresh-speed-menu-diplay {
    width: 70px;
    text-align: center;
    font-size: 7px;
    margin-left: 15px;
}

#footer {
    position: absolute;
    display: block;
    height: 40px;
    margin: 0;
    padding: 0;
    left: 0;
    bottom: 0;
    clear: both;
    width: 100%;
    z-index: 30;
}

.message-to-user-bubble {
    padding: 5%;
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    border-radius: 5px;
    color: rgb(0, 0, 0);
    background: none repeat scroll 0% 0% rgb(255, 246, 191);
    border: 2px solid rgb(255, 211, 36);
    font-size: 12px;
    line-height: 12px;
    text-align: center;
    margin-top: 40px;
}

.narrow-msg {
    width: 40% !important;
    padding: 3% !important;
    margin-right: auto !important;
    margin-left: auto !important;
    text-align: center !important;
}

.loading-msg img {
    position: relative;
    display: inline-block;
    width: 28px;
    height: 28px;
}

.user-select-action-banner {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    height: 25px;
    text-align: center;
    line-height: 25px;
    font-size: 12px;
    background: #c0392b;
    color: #fff;
}

.message-to-user-bubble span {
    position: relative;
    display: inline-block;
    margin-left: 10px;
}

.error-message-container {
    padding: 2%;
    width: 70%;
    margin-left: 14%;
    margin-right: 14%;
    border-radius: 5px;
    font-weight: bold;
}

.error-heading {
    padding: 2%;
    font-size: 12px;
    line-height: 12px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 96%;
    font-weight: bold;
}

.error-message-bubble {
    padding: 2%;
    font-size: 10px;
    line-height: 11px;
    width: 96%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #b94a48;
    font-weight: bold;
}

.footer-menu-item {
    cursor: pointer;
    padding-left: 10px;
    padding-right: 10px;
    height: 40px;
}

.footer-menu-item-min {
    cursor: pointer;
    padding-left: 15px;
    padding-right: 15px;
    height: 40px;
}

.error-close-bu {
    cursor: pointer;
}

.footer-menu-item p {
    color: inherit;
}

#start-logo-container {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 240px;
    height: 40px;
    overflow: hidden;
    z-index: 100;
    cursor: pointer;
    /*z-index: 500;*/
}

#start-button {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 240px;
    height: 40px;
    z-index: 20;
    cursor: pointer;
}

#start-logo {
    position: absolute;
    top: 0;
    left: 10px;
    /*left: 17px;*/
    width: 40px;
    height: 40px;
    z-index: 1;
    -webkit-transition: border 0.1s linear, box-shadow 0.1s linear;
    -moz-transition: border 0.1s linear, box-shadow 0.1s linear;
    transition: border 0.1s linear, box-shadow 0.1s linear;
    background: #fff;
}

#start-logo.active {
    border-color: #c82128;
}

.start-menu-label {
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-weight: 700;
    font-family: "Montserrat" !important;
}

#start-menu-label-container {
    position: absolute;
    left: 64px;
    /*display: none;*/
    top: 10px;
    font-size: 15px;
}

#main-container {
    z-index: 1;
}

#x-scrolling-panel-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 40px;
    overflow-x: auto;
    overflow-y: hidden;
    z-index: 100;
}

.details-step-2 {
    width: 260px;
    height: 35px;
    line-height: 35px !important;
    margin-left: 10px;
    margin-top: 5px;
    text-align: left;
    font-weight: bold;
    text-align: center;
}

.details-step-1 {
    width: 260px;
    height: 35px;
    line-height: 35px !important;
    margin-left: 10px;
    margin-top: 5px;
    text-align: left;
    font-weight: bold;
    text-align: center;
}

#panel-container {
    display: inline-block;
    white-space: nowrap;
    min-width: 900px;
    height: 100%;
    margin-left: 20px;
    margin-top: 10px;
    margin-right: 200px;
    height: 100%;
    padding-right: 200px;
}

.panel-div {
    margin-right: 15px;
    margin-top: 0;
    white-space: normal;
    border: 1px solid #aaa;
    box-shadow: 1px 2px 4px;
    height: 95%;
    height: -moz-calc(100% - 20px);
    height: -webkit-calc(100% - 20px);
    height: calc(100% - 20px);
}

.panel-div-shaddow {
    -webkit-box-shadow: 0px 0px 2px 2px #cecece;
    box-shadow: 0px 0px 2px 2px #cecece;
}

.panel-list-item {
    display: inline-block;
    white-space: normal;
    height: 100%;
}

dashboard-logo-container {
    width: 100%;
    height: 50px; /* Set a fixed height */
    position: relative;
    overflow: hidden;
    text-align: center;
}

.dashboard-icon {
    text-align: center;
    width: 25px;
}

#info-page-logo {
    margin-top: 20px;
    height: 120px;
    margin-left: auto;
    margin-right: auto;
}

#facefirst-header-logo {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image covers the container */
    display: block;
    margin: 0 auto;
}

#full-dashboard-container {
    position: absolute;
    left: 10px;
    bottom: 40px;
    width: 230px;
    z-index: 490;
    overflow-x: hidden;
    overflow-y: auto;
    background: #135795;
    border: 1px solid #aaa;
    box-shadow: 1px 2px 4px;
    /* background-image: linear-gradient(#135795, #134472, #0462b9); */
}

#navSideMousePadding {
    position: absolute;
    bottom: 40px;
    left: 10px;
    display: none;
    z-index: 2000;
    width: 60px;
    height: 250px;
}

#trigger-hide-dashboard {
    position: absolute;
    left: 0;
    bottom: 39px;
    width: 600px;
    top: 0;
    z-index: 480;
}

.poll-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    right: 15px;
    min-height: 4px;
    z-index: 200;
    text-align: center;
    pointer-events: none;
}

.poll-indic-refresh-off {
    margin: 0;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 8px;
    line-height: 9px;
}

.poll-indic-refresh-on {
    margin: 0;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 8px;
    line-height: 9px;
}

.poll-indic-refresh-on img {
    margin-left: 10px;
    margin-top: 1px;
    width: 16px;
    height: 11px;
}

.poll-indic-updating {
    background: #35aefd;
    margin: 0;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 8px;
    line-height: 9px;
}

#dashboard-menu-container {
    width: 100%;
    padding-bottom: 20px;
    z-index: 8;
}

.dashboard-menu-item {
    cursor: pointer;
    text-align: left;
}

.dashboard-menu-item i {
    margin-top: 9px;
    margin-left: 20px;
    margin-right: 20px;
    pointer-events: none;
    background: none !important;
    font-size: 16px;
}

.dashboard-menu-item p {
    margin: 8px;
    padding: 0;
    font-size: 13px;
    line-height: 14px;
    /* font-weight: bold; */
    font-family: "Montserrat";
    font-weight: 600;
}

.menu-arrow {
    display: none;
}

.ff-thumbnail-loaded {
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain !important;
    background-color: #cccccc;
}

.panel-heading-container {
    height: 30px;
    overflow: hidden !important;
}

.panel-heading-container p {
    padding: 3px;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
    margin-top: 4px;
    margin-left: 15px;
    pointer-events: none;
    background: none;
    max-width: 95%;
    overflow: hidden !important;
}

.search-fields-container {
    padding-left: 25px;
    padding-right: 25px;
    font-size: 12px;
    padding-top: 5px;
}

.from-to-field-container {
    white-space: nowrap;
}

.from-to-field-container p {
    width: 15px;
    text-align: center;
    margin-top: 4px;
}

.controller-panel-div {
    background: none;
    height: 100%;
}

.wrapped-controller-panel-div {
    position: absolute !important;
    background: none !important;
    border: 1px solid #135795 !important;
    background: #fff !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    width: auto !important;
    margin: 15px !important;
    z-index: 530 !important;
}

.panel-wrapper {
    background: none;
    height: 100%;
}

.modal-panel-wrapper {
    height: 98% !important;
    height: calc(100% - 10px) !important;
    background: pink !important;
    border: 5px solid #2980b9 !important;
    z-index: 530 !important;
    width: 420px !important;
    background-color: rgba(255, 255, 255, 0.6) !important;
}

.specific-person-events {
    text-transform: uppercase;
    font-weight: bold;
    max-width: 250px;
    max-height: 20px;
    overflow: hide;
    margin-left: 10px;
}

.large-photo-view {
    width: 370px;
    height: 430px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #cccccc;
    border: 1px solid #135795;
}

.non-linked-list-menu-item {
    padding: 10px;
    padding-top: 0;
    min-height: 70px;
    cursor: default !important;
    border-bottom: 1px solid #cccccc;
    overflow: hidden;
}

.no-margin {
    margin: 0;
}

.no-padding {
    padding: 0;
}

.event-row {
    padding: 0;
    min-height: 128px;
    padding-bottom: 3px;
}

.list-checkbox {
    margin-left: 0;
    margin-top: 20px;
    margin-right: 5px;
}

.list-item-details {
    list-style-type: none;
    background: transparent !important;
}

.item-detail-description {
    top: 0;
    left: 0;
    font-size: 7px;
    height: 8px;
    line-height: 7px;
}

.item-detail-value {
    left: 0;
    height: 20px;
    top: 10px;
    right: 0;
    bottom: 0;
    font-size: 10px;
    line-height: 10px;
    text-wrap: wrap;
}

.single-img-details-container {
    width: 260px;
}

.double-img-details-container {
    width: 260px;
}

.list-item-details-case-abs {
    position: absolute;
    top: 4px;
    left: 120px;
    float: left;
    display: block;
    list-style-type: none;
    background: transparent !important;
    width: 260px;
    height: 90px;
}

.list-item-details-case-abs .item-detail {
    width: 100%;
}

.medium-photo-container {
    cursor: pointer;
    width: 90%;
    height: 260px;
    margin: 15px;
    margin-left: 5%;
    margin-right: 5%;
    background-color: #cccccc;
}

.drop-target-container {
    width: 90px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    border: 2px solid #135795;
    text-align: center;
}

.medium-face-photo {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-color: #cccccc;
    background-repeat: no-repeat;
    border: 1px solid #135795;
}

.small-photo-container {
    cursor: pointer;
    width: 120px;
    height: 160px;
    border: 1px solid #135795;
}

.small-photo-container-abs {
    position: absolute;
    cursor: pointer;
    top: 3px;
    left: 3px;
    display: block;
    width: 85px;
    height: 120px;
    border: 1px solid #135795;
}

.event-location-photo-container {
    width: 122px;
    height: 140px;
    border: 1px solid #135795;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain !important;
    background-color: #cccccc;
}

.notifier-photo-container {
    position: relative;
    display: inline-block;
    border: 1px solid #135795;
    background-position: center;
    background-repeat: no-repeat;
    white-space: nowrap;
}

.ir-photo-container {
    width: 78px;
    height: 90px;
    border: 1px solid #135795;
    background-position: center;
    background-repeat: no-repeat;
}

.ir-large-photo-container {
    width: 218px;
    height: 250px;
    border: 1px solid #135795;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 50px;
}

.flex-small-photo-container {
    max-width: 80px;
    max-height: 110px;
    border: 1px solid #c82128;
}

.item-detail {
    font-size: 10px;
    line-height: 16px;
    color: #000;
    width: 100%;
    max-height: 40px;
    padding-left: 5px;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    user-select: text;
    -khtml-user-select: text;
    -o-user-select: text;
    -moz-user-select: text;
    -webkit-user-select: text;
    border-bottom: 3px solid #eeeeee;
}

.tag-item-detail {
    font-size: 11px;
    color: #000;
    width: 100%;
    padding-left: 5px;
}

.event-item-detail-adjust {
    margin-top: 1px;
    width: 200px !important;
}

.alert-full-date-small {
    max-height: 30px;
    background: transparent !important;
    pointer-events: none;
    text-transform: uppercase;
    font-size: 9px;
    line-height: 10px;
    margin-top: 2px;
    margin-left: 5px;
    margin-bottom: 0;
    text-align: center;
    width: 260px;
}

.item-title {
    margin: 0;
    padding: 0;
    margin-top: 2px;
    margin-left: 15px;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 12px;
    max-width: 150px;
    text-overflow: ellipsis;
}

.panel-move-handle {
    width: 15px;
    height: 15px;
    margin-left: 10px;
    margin-top: 9px;
    cursor: pointer;
}

.icon-large {
    font-size: 1.4em;
}

.icon-medium {
    font-size: 1em;
}

.fa-exchange {
    margin-top: 7px;
}

.dropdown-menu {
    background-clip: padding-box;
    background-color: #ffffff;
    border: 0;
    border-radius: 0;
    box-shadow: 0;
}

.dropdown-menu li a {
    font-size: 12px;
    line-height: 14px;
    cursor: pointer;
    text-align: left;
}

.dropdown-menu li a:hover,
.dropdown-menu li a:focus {
    background-color: #acacac;
    background-image: none;
    color: #fff;
    filter: none;
}

.ff-copyright-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40px;
    /*
	left: 0;
	right: 40px;
	*/
    text-align: center;
    /*margin-top: 10px;*/
    /*margin-right: 50px;*/
    z-index: 1;
}

.ff-copyright-footer :first-child {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 45%;
    transform: translateX(-45%);
    padding-top: 11px;
    font-size: 12px;
    cursor: pointer;
}

.ff-copyright-footer-minimized {
    position: absolute;
    left: 0;
    right: 0;
    display: block;
    text-align: center;
    margin-top: 6px;
    margin-right: 0;
    z-index: 1;
}

.ff-copyright-footer-minimized p {
    text-align: center;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    font-size: 18px;
    font-weight: bold;
    padding-right: 15px;
    cursor: pointer;
}

#footer-menu {
    margin-right: 0px;
    /*margin-right: 70px;*/
    height: 40px !important;
    text-align: left;
    z-index: 200;
}

.footer-bu-container {
    margin-top: 10px;
}

#footer-menu-minimized {
    margin-right: 7px;
    height: 40px !important;
    text-align: left;
    z-index: 6000;
}

#footer-menu p {
    font-size: 12px;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 11px;
}

#footer-menu i {
    margin-left: 5px;
    margin-right: 0;
    margin-top: 14px;
}

#footer-menu-minimized i {
    margin-left: 5px;
    margin-right: 0;
    margin-top: 12px;
    font-size: 16px;
}

.event-details-panel {
    margin-top: 5px;
    width: 95%;
    margin-left: 2.5%;
    margin-right: 2.5%;
}

.event-details-panel td {
    font-size: 10px;
    line-height: 14px;
    padding: 6px;
    margin-left: auto;
    margin-right: auto;
}

.person-details-table {
    width: 100%;
    margin-left: auto;
    margin-top: auto;
}

.person-details-table td {
    height: 25px;
    font-size: 12px;
    vertical-align: middle;
    padding-right: 6px;
    padding-top: 8px;
}

.person-details-table td:first-child {
    text-align: right;
    font-weight: bold;
    vertical-align: middle;
    width: 50%;
}

.person-details-table td:nth-child(2) {
    text-align: left;
    width: 50%;
    padding-left: 5px;
}

.person-heading-table {
    margin-left: 10px;
    margin-top: 10px;
    width: 270px;
}

.person-heading-table td {
    font-size: 12px;
    line-height: 14px;
    padding: 6px;
}

.person-heading-table td:first-child {
    text-align: center;
    font-weight: bold;
}

.person-heading-table td:nth-child(2) {
    text-align: left;
}

.view-details-table {
}

.not-editing-table-padding {
}

.not-editing-table-padding td {
    padding: 10px;
}

.edit-table-padding {
}

.edit-table-padding td {
    padding: 2px;
}

.help-inline {
    margin-bottom: 15px;
}

.ui-slider {
    cursor: pointer;
}

.ui-slider-handle {
    cursor: pointer !important;
    background-color: #2980b9 !important;
    background-image: linear-gradient(to bottom, #34aefe, #2980b9) !important;
    background-repeat: repeat-x;
    border: 0 solid rgba(0, 0, 0, 0);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    height: 20px !important;
    position: absolute !important;
    width: 20px !important;
}

.ui-slider-handle:hover {
    background-image: linear-gradient(to bottom, #2980b9, #34aefe) !important;
}

.ui-slider-handle.round {
    cursor: pointer;
    border-radius: 20px !important;
}

.user-schedule-table {
}

.user-schedule-edit-padding td {
    padding: 7px;
}

.user-schedule-table th {
    font-size: 12px;
    line-height: 14px;
    background: #135795;
    color: #fff;
    padding: 5px;
    text-align: center;
}

.user-schedule-table td {
    font-size: 12px;
    line-height: 12px;
    font-weight: normal;
}

.user-schedule-table td span {
}

.user-schedule-table td:first-child {
    text-align: left;
    font-weight: bold;
    vertical-align: middle;
}

.user-schedule-table td:nth-child(2) {
    text-align: center;
    vertical-align: middle;
}

.user-schedule-table td label {
    font-size: 10px;
    line-height: 10px;
    font-weight: normal;
    margin-left: 3px;
}

.user-schedule-table td label checkbox {
}

.view-details-table th:first-child {
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
    color: #fff;
    background: #135795;
}

.view-details-table th:nth-child(2) {
    text-align: left;
    vertical-align: middle;
    font-weight: bold;
    color: #fff;
    background: #135795;
}

.view-details-table th {
    font-size: 12px;
    line-height: 14px;
    margin-left: auto;
    margin-right: auto;
    background: #135795;
    color: #fff;
    padding: 5px;
}

.view-details-table td {
    font-size: 12px;
    line-height: 14px;
    margin-left: auto;
    margin-right: auto;
}

.view-details-table td:first-child {
    text-align: right;
    font-weight: bold;
    vertical-align: middle;
}

.view-details-table td:nth-child(2) {
    text-align: left;
    vertical-align: middle;
}

.view-details-table td input,
select,
.btn-group {
    margin: 2px !important;
}

.account-details-table {
    margin-top: 0;
}

.account-details-table td {
    font-size: 12px;
    line-height: 14px;
    padding: 6px;
    margin-left: auto;
    margin-right: auto;
}

.account-details-table td:first-child {
    text-align: right;
    font-weight: bold;
}

.account-details-table td:nth-child(2) {
    text-align: left;
}

.user-permissions-table td {
    font-size: 12px !important;
    line-height: 14px !important;
}

.user-permissions-table th,
checkbox {
    font-size: 12px !important;
}

.btn:hover {
    background: #135795 !important;
    color: #fff !important;
}

.btn.div {
    color: inherit;
}

.btn.div.i {
    color: inherit;
}

.btn i {
    color: inherit;
}

.table-bordered {
    border-radius: none !important;
    border-radius: 0 0 0 0;
}

.detail-menu-button {
    padding: 5px;
    width: 185px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    background: #f8f8f8;
    text-align: left;
    font-size: 12px;
    line-height: 14px;
}

.close-panel-button {
    padding: 5px;
    width: 170px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    background: #fdfdfd;
    font-size: 12px;
    line-height: 14px;
    color: #b6b6b6;
}

.detail-menu-button i {
    color: #inherit;
}

.detail-menu-button:hover {
    color: #fff !important;
}

.close-button-large {
    display: table-cell;
    vertical-align: middle;
    width: 40px;
    height: 30px;
    color: #fff;
    top: 0;
    right: 0;
    index: 800;
    font-size: 15px;
    cursor: pointer;
}

.close-button-large:hover {
    font-size: 25px;
}

.close-button-large i {
    position: absolute;
    top: 0;
    right: 9px;
    font-size: inherit;
    pointer-events: none;
    margin-top: 7px;
}

.close-button-large:hover i {
    top: -4px;
    right: 6px;
}

.edit-details-table td {
    font-size: 12px;
    line-height: 16px;
    text-align: left;
    display: block;
}

.image_drop {
    display: none;
    padding-top: 30px;
    padding-bottom: 30px;
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.image_drop.alert-success {
    color: #468847;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.face-heading {
    margin: 0;
    line-height: 12px;
    padding: 0;
    font-size: 11px;
    margin-top: 0;
    color: #fff;
    max-width: 80%;
    height: 25px;
    overflow: hidden;
    text-transform: uppercase;
}

.face-heading-large {
    margin: 0;
    line-height: 17px;
    font-size: 12px;
    color: #000;
    margin-left: 0;
    margin-top: 5px;
    text-transform: uppercase;
}

.ff-ffred-white {
    background: rgba(200, 33, 40, 1) !important;
    color: #fff !important;
}

.ff_red_white {
    background: rgba(200, 33, 40, 0.5) !important;
    color: #fff !important;
}

.ff-blue-white {
    background: #2980b9 !important;
    color: #fff !important;
}

.blue-border {
    border-color: #2980b9;
}

.blue-color {
    color: #2980b9;
}

.yellow-color {
    color: #9fa42f;
}

.event_img_sml_heading {
    font-size: 8px;
    left: 0;
    line-height: 8px;
    margin: 0;
    padding: 1px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    text-transform: uppercase;
    z-index: 1;
}

.case_status_heading {
    font-size: 8px;
    left: 0;
    line-height: 9px;
    margin: 0;
    padding: 1px;
    position: absolute;
    z-index: 1;
    text-align: center;
    top: 0;
    left: 0;
    right: 0;
    text-transform: uppercase;
    color: #ffffff;
}

.single-column-centered-bu {
    min-width: 160px !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    clear: both !important;
    margin-top: 10px !important;
}

.disabled-bg-color {
    background: rgba(192, 57, 43, 0.6);
    color: #ffffff;
    font-size: 9px;
}

.enabled-bg-color {
    background: rgba(41, 128, 185, 0.6);
    color: black;
    font-weight: bold;
    font-size: 9px;
}

.pending-review-bg-color {
    background: rgba(255, 255, 0, 0.6);
    color: black;
    font-weight: bold;
    font-size: 9px;
}

.rejected-bg-color {
    background: rgba(255, 165, 0, 0.6);
    color: black;
    font-weight: bold;
    font-size: 9px;
}

.light-blue {
    color: #30aed9;
}

.light-blue-bg {
    background: #30aed9;
}

.light-purple-bg {
    background: #8e44ad;
}

.burnt-orange-bg {
    background: #d9732c;
}

.ff-red-bg {
    background: #c0392b;
}

.width50px {
    width: 50px !important;
}

.width60px {
    width: 60px !important;
}

.width90px {
    width: 90px !important;
}

.width100px {
    width: 100px !important;
}

.width150px {
    width: 150px !important;
}

.width190px {
    width: 190px !important;
}

.width200px {
    width: 200px !important;
}

.width250px {
    width: 250px !important;
}

.caseRowHeight {
    height: 135px;
}

.margin0px {
    margin: 0 !important;
}

.margin3px {
    margin: 3px !important;
}

.marginLeft5px {
    margin-left: 5px !important;
}

.marginTop10px {
    margin-top: 10px !important;
}

.height100px {
    height: 100px !important;
}

.mediumGray {
    background: #9b9b9b;
}

.padding0px {
    padding: 0;
}

.colorRed {
    color: #f00;
}

.panel-heading {
    font-size: 12px;
    padding-top: 3px;
    padding-bottom: 3px;
    width: 95%;
    padding-top: 3px;
    padding-bottom: 5px;
    margin: 2.5%;
}

.panel-heading span {
    text-transform: uppercase;
    font-size: 12px;
    line-height: 12px;
}

.panel-heading i {
    font-size: 16px;
    margin-top: 2px;
    margin-right: 15px;
}

.heading-color {
    background: #285199;
    /* background: -moz-linear-gradient(top,  #135795 0%, #7c7c7c 10%, #707070 25%, #D1E9FF 37%, #737373 50%, #656565 51%, #7a7a7a 83%, #858585 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#135795), color-stop(10%,#7c7c7c), color-stop(25%,#707070), color-stop(37%,#D1E9FF), color-stop(50%,#737373), color-stop(51%,#656565), color-stop(83%,#7a7a7a), color-stop(100%,#858585));
	background: -webkit-linear-gradient(top,  #135795 0%,#7c7c7c 10%,#707070 25%,#D1E9FF 37%,#737373 50%,#656565 51%,#7a7a7a 83%,#858585 100%);
	background: -o-linear-gradient(top,  #135795 0%,#7c7c7c 10%,#707070 25%,#D1E9FF 37%,#737373 50%,#656565 51%,#7a7a7a 83%,#858585 100%);
	background: -ms-linear-gradient(top,  #135795 0%,#7c7c7c 10%,#707070 25%,#D1E9FF 37%,#737373 50%,#656565 51%,#7a7a7a 83%,#858585 100%);
	background: linear-gradient(to bottom,  #135795 0%,#7c7c7c 10%,#707070 25%,#D1E9FF 37%,#737373 50%,#656565 51%,#7a7a7a 83%,#858585 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#135795', endColorstr='#858585',GradientType=0 ); */
    border: 1px solid #000;
    color: #fff;
}

.scroll-panel {
    position: absolute;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    top: 60px;
    bottom: 0;
    width: 100%;
    background: #f0f9ff;
}

.panel-toolbar {
    height: 30px;
    background: #d1e9ff;
    z-index: 500;
}

.toolbar-btn {
    background: #135795;
    width: 65px;
    line-height: 12px;
    font-size: 12px;
    color: #ffffff;
    text-align: left;
    outline: none;
}

.toolbar-btn-switch {
    background: #135795;
    color: #fff;
    text-align: left;
    outline: none;
    font-size: 11px !important;
    line-height: 11px !important;
}

.btn.active,
.btn:active {
    color: #fff !important;
    background: #7f7f7f !important;
}

.enroll-steps-container {
    margin: 2.5%;
    margin-top: 0;
    width: 95%;
}

.scroll-panel-visitor-search {
    position: absolute;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    top: 255px;
    bottom: 0;
    width: 100%;
    background: #f0f9ff;
}

.enroll-steps-heading {
    margin: 2.5%;
    width: 95%;
}

.enroll-steps-title {
    font-size: 13px;
    line-height: 14px;
    text-align: left;
    vertical-align: middle;
    font-weight: bold;
    color: #fff;
    padding: 5px;
    text-align: center;
    text-transform: uppercase;
}

.enroll-steps-text {
    border-top: 4px;
    border-bottom: 4px;
    border-right: 0;
    border-left: 0;
    border-style: solid;
    background: #135795;
    color: #fff;
    text-align: center;
    line-height: 14px;
    font-size: 14px;
    line-height: 16px;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 10px;
    padding-left: 5%;
    padding-right: 5%;
}

.view-description {
    margin: 5%;
    width: 90%;
    font-size: 12px;
    margin-top: 0;
    margin-bottom: 5px;
}

.view-title {
    padding: 0;
    margin-left: 15px;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 12px;
    color: #000;
    width: 90%;
    font-size: 14px;
    margin: 5%;
    margin-top: 5px;
    margin-bottom: 5px;
}

.edit-mode-block {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
}


.transparent-center-strip {
    background: #fff;
    opacity: 0.4;
    filter: alpha(opacity=40);
    z-index: 0;
}

.input-field {
    font-size: 13px;
    line-height: 15px;
    background: #ffffff;
    width: 225px;
    height: 24px !important;
    padding-left: 6px !important;
    padding-top: 3px !important;
    padding-bottom: 2px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.search-field {
    font-size: 10px !important;
    line-height: 20px !important;
    background-color: #ffffff;
    height: 20px !important;
    width: 230px !important;
    margin-left: 13px !important;
    margin-top: 5px !important;
    padding-left: 6px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.search-input-field {
    font-size: 12px;
    line-height: 12px;
    padding: 0;
    margin-left: 25px;
    padding-left: 5px;
    width: 200px;
}

.event-search-field {
    font-size: 8px !important;
    margin-right: 5px !important;
    margin-left: 5px !important;
    width: 170px !important;
}

.tag-search-field {
    font-size: 8px !important;
    margin-right: 5px !important;
    margin-left: 10px !important;
    width: 140px !important;
}

.filter-field {
    font-size: 9px !important;
    margin-right: 5px !important;
    margin-left: 5px !important;
    width: 140px !important;
}

input.input-field::-webkit-input-placeholder {
    font-size: 13px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.input-field::-moz-placeholder {
    font-size: 13px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.input-field:-ms-input-placeholder {
    font-size: 13px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.input-field:-moz-placeholder {
    font-size: 13px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.search-field::-webkit-input-placeholder {
    font-size: 9px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.search-field::-moz-placeholder {
    font-size: 9px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.search-field:-ms-input-placeholder {
    font-size: 9px !important;
    line-height: 17px !important;
    color: #939393 !important;
}

input.search-field:-moz-placeholder {
    font-size: 9px !important;
    line-height: 17px !important;
    color: #939393 !important;
}


.ff-alert {
    background: #135795;
    color: #fff;
    font-size: 12px;
    width: 140px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
    -webkit-box-shadow: 0 0 2px 2px #767676;
    box-shadow: 0 0 2px 2px #767676;
    padding: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: left;
    margin-top: 0;
    margin-bottom: 0;
}

.close {
    color: #fff;
    opacity: 1;
}

.close:hover {
    color: #fff;
    opacity: 1;
}

.animate-show.ng-hide-add {
    -webkit-transition: all linear 0s;
    -moz-transition: all linear 0s;
    -o-transition: all linear 0s;
    transition: all linear 0s;
    display: block !important;
}

.animate-show.ng-hide-remove {
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
    transition: all linear 0.5s;
    display: block !important;
}

.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove {
    opacity: 0;
}

.animate-show.ng-hide-add,
.animate-show.ng-hide-remove.ng-hide-remove-active {
    opacity: 1;
}

.animate-hide {
    display: block;
}

.animate-hide.ng-hide-add {
    transition: 1.5s linear all !important;
    display: block !important;
}

.animate-hide.ng-hide {
    opacity: 0;
}

.ff-mobile-bu-container {
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 255px;
}

.ff-mobile-button {
    width: 75px;
    height: 75px;
    border-radius: 5px;
    border: 0;
    -moz-box-shadow: 0 0 3px #bbbbbb;
    -webkit-box-shadow: 0 0 3px #bbbbbb;
    box-shadow: 0 0 3px #bbbbbb;
    margin-top: 0;
    margin-left: 5px;
    margin-right: 5px;
    text-align: center;
    padding: 0;
    line-height: 10px !important;
    cursor: pointer;
    color: #ffffff;
    text-transform: uppercase;
    background: #2e2e2e;
    background: -moz-linear-gradient(top, #2e2e2e 0%, #135795 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2e2e2e), color-stop(100%, #135795));
    background: -webkit-linear-gradient(top, #2e2e2e 0%, #135795 100%);
    background: -o-linear-gradient(top, #2e2e2e 0%, #135795 100%);
    background: -ms-linear-gradient(top, #2e2e2e 0%, #135795 100%);
    background: linear-gradient(to bottom, #2e2e2e 0%, #135795 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2e2e2e', endColorstr='#135795',GradientType=0 );
}

.ff-mobile-button:hover {
    background: #7d7e7d !important;
    background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7d7e7d), color-stop(100%, #0e0e0e)) !important;
    background: -webkit-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%) !important;
    background: -o-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%) !important;
    background: -ms-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%) !important;
    background: linear-gradient(to bottom, #7d7e7d 0%, #0e0e0e 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ) !important;
}

.ff-mobile-button p {
    position: absolute;
    display: block;
    width: 100%;
    text-align: center;
    bottom: 6px;
    color: #fff;
    font-size: 10px;
    line-height: 11px;
    margin: 0;
    padding: 0;
    font-weight: bold;
    pointer-events: none;
    background: none !important;
}

.ff-mobile-button i {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 16px;
    display: block;
    font-size: 32px;
    line-height: 14px;
    color: #fff;
    clear: both;
    margin-top: 0;
    padding: 0;
    pointer-events: none;
    background: none !important;
}

.upload-preview-container {
    margin-top: 15px;
    margin-left: auto;
    margin-right: auto;
    width: 185px;
}

.detect-faces-preview-container {
    margin-top: 15px;
    margin-left: auto;
    margin-right: auto;
    width: 95%;
}

.cursor-pointer {
    cursor: pointer;
}

.ff-badge {
    color: #fff;
    font-weight: normal;
    border-radius: 3px;
    width: 35px;
    margin-left: 5px;
    margin-top: 5px;
    line-height: 16px;
    padding: 2px;
    font-size: 9px;
    text-transform: uppercase;
}

.badge-has-groups {
    background: #16a085 !important;
}

.badge-has-tags {
    background: #006ec4 !important;
}

.badge-reduce-margins {
    margin-left: -5px;
    margin-top: -3px;
    margin-bottom: -2px;
}

.badge-has-notes {
    color: #fff;
    background: #8e44ad !important;
}

.badge-no-notes {
    color: #fff;
    background: #135795 !important;
    border: 1px solid #cccccc;
}

.badge-has-faces {
    color: #fff;
    background: #e98b39 !important;
}

.badge-has-zones {
    color: #fff;
    background: #0072c6 !important;
}

.badge-has-people {
    background: #35aefd !important;
    color: #ffffff !important;
}

.badge-has-users {
    background: #ffd700 !important;
    color: #000000 !important;
}

.badge-has-alerting {
    background: #9b59b6 !important;
}

.badge-unlinked {
    background: #34495e;
}

.badge-warn {
    color: #fff !important;
    background: #c0392b !important;
}

.badge-off {
    color: #fff !important;
    background: #000 !important;
}

.badge-enabled {
    color: #fff !important;
    background: #2980b9 !important;
}

.linked-label-small {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    color: #16a085 !important;
}

.linked-label-small i {
    color: inherit;
}

.unlinked-label-small {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    color: #a1262b !important;
}

.unlinked-label-small i {
    color: inherit;
}

.enabled-label-small {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    color: #2980b9 !important;
}

.enabled-label-small i {
    color: inherit;
}

.disabled-label-small {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    color: #a1262b !important;
}

.disabled-label-small i {
    color: inherit;
}

.enabled-label-large {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    color: #2980b9 !important;
}

.disabled-label-large {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    color: #a1262b !important;
}

.badge-unselected {
    background: #cccccc;
    color: #000000;
}

.icon-margin {
    margin-left: -15px;
    margin-right: 1px;
}

.checkmark-placeholder {
    margin: 0;
    padding: 0;
    width: 12px;
    margin-left: -10px;
    height: 20px;
}

.top60 {
    top: 60px;
}

.top85 {
    top: 85px;
}

.top110 {
    top: 110px;
}

.top75 {
    top: 75px;
}

.top100 {
    top: 100px;
}

.top130 {
    top: 100px;
}

.ng-modal-overlay {
    position: absolute;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: #000000;
    opacity: 0.8;
}

.ng-modal-dialog {
    z-index: 10000;
    position: absolute;
    width: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    background-color: #fff;
    box-shadow: 4px 4px 80px #000;
}

.ng-modal-dialog-content {
    padding: 10px;
    text-align: left;
    width: 100%;
    height: 100%;
}

.ng-modal-close {
    position: absolute;
    top: 3px;
    right: 5px;
    padding: 5px;
    cursor: pointer;
    font-size: 120%;
    display: inline-block;
    font-weight: bold;
    font-family: "arial", "sans-serif";
}

.modal-dialog {
    text-align: center;
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.nav-tabs .dropdown-menu,
.nav-pills .dropdown-menu,
.navbar .dropdown-menu {
    margin-top: 0;
    border-radius: 6px;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}

.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
}

.nav-pills > li > a {
    padding-bottom: 3px;
    padding-top: 3px;
}

.enrolment-step-container {
    font-size: 12px;
    border-radius: 4px 4px 4px 4px;
    background: #ffffff;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    border: 2px solid #2980b9;
}

.notifier-event-relative-time {
    text-transform: uppercase;
    font-size: 25px;
    line-height: 30px;
    height: 40px;
    background: pink;
    color: #f00;
}

.event-relative-time {
    width: 270px;
    height: 13px;
    text-transform: uppercase;
    font-size: 10px;
    line-height: 12px;
    background: pink;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 2px;
    color: #f00;
}

.job-progress-bar {
    width: 240px;
    height: 15px;
    text-transform: uppercase;
    font-size: 10px;
    line-height: 12px;
    height: 15px;
    background: pink;
    color: #f00;
    margin-left: 15px;
}

.job-progress-container {
    width: 240px;
    height: 15px;
    background: #777777;
    -moz-box-shadow: inset 0 0 10px #000000;
    -webkit-box-shadow: inset 0 0 10px #000000;
    box-shadow: inset 0 0 10px #000000;
}

.job-progress-title {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    display: block;
    background: transparent !important;
    pointer-events: none;
    text-transform: uppercase;
    color: #ffffff;
    font-size: 9px;
    line-height: 15px;
    font-weight: bold;
    text-align: center;
    width: 240px;
    z-index: 10;
}

.notifier-alert-rel-time-container {
    height: 100%;
    background: #777777;
    -moz-box-shadow: inset 0 0 10px #000000;
    -webkit-box-shadow: inset 0 0 10px #000000;
    box-shadow: inset 0 0 10px #000000;
}

.alert-rel-time-container {
    height: 100%;
    background: #777777;
    -moz-box-shadow: inset 0 0 10px #000000;
    -webkit-box-shadow: inset 0 0 10px #000000;
    box-shadow: inset 0 0 10px #000000;
}

.notifier-alert-rel-time-abs {
    background: transparent !important;
    pointer-events: none;
    text-transform: uppercase;
    color: #ffffff;
    font-size: 25px;
    line-height: 40px;
    font-weight: bold;
    text-align: center;
    z-index: 5000;
}

.alert-rel-time-abs {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    display: block;
    background: transparent !important;
    pointer-events: none;
    text-transform: uppercase;
    color: #ffffff;
    font-size: 10px;
    line-height: 12px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    z-index: 10;
}

.time-since-indicator {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 5;
}

.vis-job-complete {
    background: #1fc6fd;
    width: 240px;
}

.vis-job-complete-with-errors {
    background: #fbc02d;
    width: 240px;
}

.visitor-search-contraint-container {
    padding: 4px;
    position: relative;
    float: left;
    line-height: 12px;
    clear: none;
    margin-left: 25px;
    margin-top: 5px;
    width: 260px;
    text-align: left;
    max-height: 70px;
    overflow-y: auto;
    color: #000;
    font-size: 10px;
}

.visitor-jobs-processed-heading {
    position: relative;
    float: left;
    display: block;
    margin: 0;
    max-height: 15px;
    color: #000;
    width: 220px;
    margin-left: 30px;
    padding: 0;
    padding-bottom: 2px;
    font-size: 7px;
    line-height: 9px;
    margin-top: 3px;
    text-align: center;
}

.large-photo-icon {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 25px;
    display: inline-block;
    padding: 5px;
    padding-top: 3px;
    color: #fff;
    background: #000;
    margin: 0;
    text-align: center;
    cursor: pointer;
    z-index: 100;
}

.large-photo-icon:hover {
    color: #01a8fe;
}

.large-photo-icon i {
    display: block;
    font-size: 12px;
    line-height: 12px;
    color: inherit;
    clear: both;
    margin: 0;
    pointer-events: none;
    background: none !important;
}

.large-photo-icon p {
    display: block;
    font-size: 7px;
    line-height: 7px;
    font-weight: bold;
    margin: 0;
    clear: both;
    margin-top: 1px;
    padding: 0;
}

#panel-container-modal-screen {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    opacity: 0.75;
    filter: alpha(opacity=75);
    z-index: 520;
}

#footer-modal-screen {
    position: absolute;
    display: none;
    left: 0;
    right: 0;
    bottom: 0;
    height: 55px;
    background: #000;
    opacity: 0.75;
    filter: alpha(opacity=75);
    z-index: 520;
}

.event-just-now {
    border: 10px dashed #f00 !important;
    color: #f00 !important;
    background: pink !important;
}

.jcrop-hline {
    background: url("../lib/Jcrop-0.9.12/css/Jcrop.gif") repeat scroll 0 0 #ff0000;
}

.jcrop-holder {
    position: absolute !important;
    top: 0;
    left: 26px;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block;
    border: 2px solid #135795;
    z-index: 400;
}

.upload-original-image {
    display: none;
}

.originalPhotoBkupContainer {
    display: none;
}

.canvasStyle {
    border: 2px dashed #0f0;
    z-index: 6000;
}

.drag-handle {
    background: #fff6bf;
    border: 2px solid #ffd324;
    border-radius: 5px;
    color: #000000;
    padding: 5px;
    font-size: 10px;
    line-height: 11px;
    text-align: center;
    pointer-events: none;
}

.click-to-select-photo {
    position: relative;
    display: block;
    background: #135795;
    color: #f0f0f0;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    font-size: 13px;
    line-height: 13px;
    font-weight: bold;
    width: 100%;
    min-width: 40px;
    cursor: pointer;
    border-top: 0;
}

.click-to-select-photo:hover {
}

.cursor-move {
    cursor: move;
}

.draggable-label {
    position: relative;
    top: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: -12px;
    z-index: 200;
    font-size: 8px;
    line-height: 10px;
    background: #c0392b;
    padding-top: 0;
    padding-left: 3px;
    padding-right: 5px;
    color: #fff;
    pointer-events: none;
    opacity: 0.7;
    filter: alpha(opacity=70);
    text-transform: uppercase;
}

.draggable-label span {
    line-height: 10px;
}

.spinner-size {
    margin-left: 15px;
    width: 28px;
    height: 28px;
    margin-top: 2px;
    margin-bottom: 4px;
}

.busy-rotating {
    position: absolute;
    top: 0;
    left: 26px;
    right: 26px;
    bottom: 0;
    z-index: 999999;
    font-size: 8px;
    line-height: 10px;
    background: #000000;
    color: #fff;
    display: none;
    pointer-events: none;
    opacity: 0.9;
    filter: alpha(opacity=90);
    text-transform: uppercase;
}

.busy-message {
    text-transform: capitalize;
    position: relative;
    width: 100px;
    margin-left: auto;
    margin-right: auto;
    font-size: 14px;
    line-height: 16px;
    margin-top: 40px;
    color: #fff;
}

.busy-img {
    position: relative;
    display: block;
    clear: both;
    width: 28px;
    height: 28px;
    margin-top: 15px;
    margin-left: auto;
    margin-right: auto;
}

.notification-overlay {
    display: none;
    z-index: 999999;
    font-size: 8px;
    line-height: 10px;
    pointer-events: none;
    opacity: 0.9;
    filter: alpha(opacity=90);
}

.identify-results-heading {
    position: relative;
    float: left;
    display: block;
    clear: both;
    color: #c0392b;
    font-weight: bold;
    font-size: 17px;
    line-height: 20px;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
}

.rotate-right-button {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #cccccc;
    color: #fff;
    position: absolute;
    right: 0;
    top: 80px;
    width: 25px;
    height: 25px;
    display: none;
    cursor: pointer;
}

.rotate-right-button:hover {
    background: #000;
    color: #fff;
}

.rotate-right-button i {
    margin-top: 5px;
    color: inherit;
}

.rotate-left-button {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background: #cccccc;
    color: #fff;
    position: absolute;
    left: 0;
    top: 80px;
    width: 25px;
    height: 25px;
    display: none;
    cursor: pointer;
}

.rotate-left-button:hover {
    background: #000;
    color: #fff;
}

.rotate-left-button i {
    margin-top: 5px;
    color: inherit;
}

#imageCropRectContainer {
    position: relative;
    float: left;
    display: block;
    border: 1px dashed #00f;
}

#cropBoxDiv {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #000000;
    width: 300px;
    height: 40px;
    overflow: hidden;
    z-index: 99999;
}

#nwgrip,
#negrip,
#swgrip,
#segrip,
#ngrip,
#egrip,
#sgrip,
#wgrip {
    width: 10px;
    height: 10px;
    background-color: #ffffff;
    border: 1px solid #000000;
}

#segrip {
    right: -5px;
    bottom: -5px;
}

.upload-preview-directions {
    position: absolute;
    line-height: 14px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    z-index: 100;
    font-size: 12px;
    pointer-events: none;
}

.upload-dir-line-1 {
    width: 105px;
    top: 45px;
    left: 40px;
}

.upload-dir-line-2 {
    width: 20px;
    top: 107px;
    left: 80px;
}

.upload-dir-line-3 {
    width: 110px;
    top: 145px;
    left: 40px;
}

.face-detect-upload-dir-line-1 {
    width: 205px;
    top: 100px;
    left: 100px;
}

.face-detect-upload-dir-line-2 {
    width: 20px;
    top: 125px;
    left: 190px;
}

.face-detect-upload-dir-line-3 {
    width: 205px;
    top: 150px;
    left: 100px;
}

.upload-preview {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    display: block;
    clear: both;
    top: 0;
    border: 2px solid #135795;
    z-index: 1;
}

#aspect_ratio_indicator {
    position: relative;
    z-index: 400;
    clear: both;
    display: block;
    width: 250px;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
}

.ari-heading {
    margin: 0;
    position: relative;
    float: left;
    display: block;
    line-height: 10px;
    font-size: 7px;
}

.ari-disabled {
    margin: 0;
    line-height: 10px;
    width: 100px;
    position: relative;
    float: left;
    display: block;
    font-size: 7px;
    background-color: #cccccc;
    padding: 0;
    text-align: left;
    padding-left: 8px;
    padding-right: 5px;
    margin-left: 5px;
    color: #000;
    text-transform: uppercase;
}

.ari-acceptable {
    margin: 0;
    line-height: 10px;
    width: 100px;
    position: relative;
    float: left;
    display: block;
    font-size: 7px;
    padding: 0;
    text-align: left;
    padding-left: 8px;
    padding-right: 5px;
    margin-left: 5px;
    background-color: #0f0;
    color: #000;
}

.ari-acceptability {
    margin: 0;
    line-height: 10px;
    width: 100px;
    position: relative;
    float: left;
    display: block;
    font-size: 7px;
    padding: 0;
    text-align: left;
    padding-left: 8px;
    padding-right: 5px;
    margin-left: 5px;
    background-color: #0f0;
    color: #000;
}

.ari-unacceptable {
    background-color: #f00;
    color: #fff;
}

.ari-checkbox {
    position: relative;
    float: left;
    display: block;
    font-size: 7px;
    margin-left: 8px;
    margin-top: 0 !important;
    padding: 0;
}

.ari-checkbox-label {
    margin: 0;
    position: relative;
    float: left;
    display: block;
    font-size: 7px;
    line-height: 10px;
    padding: 0;
    margin-left: 5px;
    text-transform: uppercase;
}

.identify-img-props-container {
    text-align: center;
    margin-top: 5px;
    clear: both;
    position: relative;
    width: 100%;
    max-height: 80px;
}

.camera-info-win {
    position: relative;
    float: left;
    display: block;
    width: 240px;
    height: 130px;
    background: #000000;
    border: 1px solid #000;
}

.cam-img-container {
    position: relative;
    float: left;
    display: block;
    border: 1px solid #135795;
    clear: left;
    width: 240px;
    height: 130px;
    z-index: 20;
}

.upload-preview-directions-sml {
    position: absolute;
    line-height: 11px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    z-index: 100;
    font-size: 8px;
    pointer-events: none;
}

.error {
    color: #f00;
    font-size: 15px;
    line-height: 17px;
    font-weight: bold;
}

.enrollment-date-range {
    list-style: none;
    margin: 0;
    line-height: 14px;
}

.search-date-field {
    float: left;
    font-size: 12px;
    padding: 0;
    padding-left: 5px;
    width: 86px;
    margin: 0 !important;
}

.enrollment-date-range li {
    line-height: 14px;
    margin: 0;
}

.search-menu-ul {
    /*
	margin: 0;
	padding: 0;
	*/
    display: block;
    overflow-y: auto;
    overflow-x: hidden;
    list-style: none;
}

.search-menu-ul li {
    line-height: 14px;
    margin: 0;
    position: relative;
    /*
	float: left;
	*/
    clear: both;
}

.search-fields-band {
    width: 100%;
    height: 30px;
    position: relative;
    display: block;
    vertical-align: middle;
    font-size: 10px;
    text-align: center;
    line-height: 10px;
}

.search-fields-band-container {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    min-height: 20px;
    max-height: 65px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #135795;
    z-index: 300;
}

.visitor-match-results-heading {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 220px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #ffffff;
    z-index: 300;
    text-align: center;
    color: #fff;
    font-size: 12px;
    line-height: 20px;
    text-transform: uppercase;
}

.thumbnail-of-photo-to-search {
    position: relative;
    display: block;
    width: 90px;
    height: 120px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    margin-top: 10px;
    margin-bottom: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain !important;
    background-color: #135795;
    border: 1px solid #000000;
}

.matches-heading-band {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #135795;
    z-index: 300;
    color: #fff;
    text-align: center;
}

.zone-filters-band-container {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    min-height: 20px;
    max-height: 65px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #135795;
    z-index: 300;
}

.search-field-pill {
    border-radius: 5px;
    border: 1px solid #ccc;
    padding-left: 3px;
    padding-right: 3px;
    margin-left: 10px;
    height: 18px;
    max-width: 270px;
    margin-top: 3px;
    margin-bottom: 4px;
}

.search-field-pill-text {
    font-size: 9px;
    white-space: nowrap;
    line-height: 18px;
    max-width: 250px;
    overflow: hidden;
    color: #fff;
}

.search-fields-heading {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 11px;
    line-height: 16px;
    color: #fff;
    width: auto;
    margin-top: 3px;
    margin-left: 9px;
    margin-right: 3px;
    min-width: 100px;
}

.current-filter-heading {
    position: relative;
    float: left;
    display: block;
    font-size: 11px;
    color: #fff;
    width: auto;
    clear: none;
    margin-left: 12px;
    margin-right: 5px;
    margin-top: 2px;
}

.hidden-event-notice-banner {
    position: absolute;
    left: 0;
    right: 0;
    height: 25px;
    text-align: center;
    line-height: 25px;
    font-size: 10px;
    background-color: #04bffd;
    color: #fff;
    font-weight: normal;
    text-transform: uppercase;
}

.remove-sort-button {
    position: relative;
    float: left;
    display: block;
    margin-top: 2px;
    margin-left: 0;
    cursor: pointer;
}

.current-filter-for-banner {
    position: relative;
    float: left;
    display: block;
    margin-top: 2px;
    display: block;
}

.remove-search-field-button {
    position: relative;
    float: right;
    display: block;
    margin: 0;
    margin-left: 5px;
    margin-right: 2px;
    margin-top: 0;
    padding: 0;
    height: 18px;
    line-height: 16px;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
}

.remove-search-field-button i {
    margin: 0;
}

.search-dropdown-menu {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    display: none;
    list-style: none outside none;
    min-width: 175px;
    padding: 0;
    position: absolute;
    top: 25px;
    left: 0;
    z-index: 1000;
    background-clip: padding-box;
    background-color: #ffffff;
    border: 0 none;
    border-radius: 6px;
    margin: 0;
    overflow: visible;
}

.search-dropdown-heading {
    position: relative;
    float: left;
    width: 100%;
    font-size: 11px;
    margin-top: 5px;
    font-weight: bold;
    text-align: center;
    clear: both;
    display: block;
    margin-bottom: 2px;
}

.search-dropdown-subheading {
    position: relative;
    float: left;
    width: 90%;
    font-size: 12px;
    margin-top: 2px;
    font-weight: bold;
    text-align: center;
    clear: both;
    display: block;
    margin-bottom: 2px;
}

.search-menu-inner-panel {
    position: absolute;
    display: block;
    top: 5px;
    left: 20px;
    bottom: 5px;
    right: 20px;
    margin-bottom: 5px;
    background: #ffffff;
    padding: 5px;
    z-index: 200;
}

.age-selection-menu {
    position: relative;
    float: left;
    display: block;
    height: 24px;
    font-size: 11px;
    line-height: 12px;
    width: 55px;
}

.filter-checkbox {
    position: relative;
    float: left;
    display: block;
    clear: left;
    margin-left: 0;
    margin-top: 2px;
}

.search-menu-inner-panel-clear-bu {
    position: absolute;
    display: block;
    bottom: 0;
    left: 0;
    width: 60px;
    text-align: center;
    font-size: 10px;
}

.search-menu-inner-panel-close-bu {
    position: absolute;
    display: block;
    bottom: 0;
    left: 68px;
    width: 60px;
    text-align: center;
    font-size: 10px;
}

.search-menu-inner-panel-save-bu {
    position: absolute;
    display: block;
    bottom: 0;
    left: 135px;
    width: 100px;
    text-align: center;
    font-size: 10px;
}

.search-menu-inner-panel-heading {
    position: relative;
    margin-bottom: 0px;
    display: block;
    font-size: 11px;
    font-weight: bold;
    clear: both;
    width: 100%;
    text-align: center;
}

.date-time-fields-container {
    position: relative;
    margin: 0;
    margin-bottom: 3px;
    margin-left: 50px;
    text-align: center;
    float: left;
    clear: both;
    display: block;
    width: 200px;
}

.date-time-input-container {
    position: relative;
    float: left;
}

.date-time-field-addon {
    width: 35px !important;
    height: 10px;
}

.date-time-checkbox {
    position: relative;
    float: left;
    width: 10px;
    height: 10px;
    margin-top: 2px !important;
    margin-bottom: 0 !important;
}

.date-time-to-label {
    position: relative;
    text-align: center;
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    float: left;
    clear: both;
    display: block;
}

.age-to-label {
    position: relative;
    text-align: center;
    width: 30px;
    margin: 0;
    padding: 0;
    margin-top: 5px;
    text-align: center;
    float: left;
    display: block;
}

.case-search-dropdown {
    left: -207px;
    /*
	height: 420px;
	*/
    width: 290px;
}

.event-search-dropdown {
    left: -207px;
    height: 400px;
    width: 290px;
}

.visitor-search-dropdown {
    width: 290px;
    top: 28px;
    left: -205px;
}

.search-menu-top-padding {
    padding: 7px;
    height: 10px;
}

.seach-menu-field-container {
    padding-left: 25px;
    padding-right: 25px;
    font-size: 12px;
}

.seach-menu-field-title {
    position: relative;
    float: left;
    display: block;
    clear: both;
    line-height: 17px;
    margin: 0;
    margin-left: 25px;
    padding: 0;
}

.seach-menu-select-menu {
    position: relative;
    float: none;
    display: block;
    width: 200px;
    margin-right: auto !important;
    margin-left: auto !important;
    height: 24px;
    font-size: 11px;
    line-height: 22px;
    padding: 0;
}

.seach-menu-input-field {
    font-size: 12px;
    padding: 0;
    padding-left: 5px;
    width: 190px;
}

.search-dropdown-menu-relative {
    position: relative;
    float: right;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    display: none;
    list-style: none outside none;
    min-width: 160px;
    padding: 0;
    z-index: 1000;
    background-clip: padding-box;
    background-color: #ffffff;
    border: 0 none;
    border-radius: 6px;
    margin: 0;
}

.search-menu-button {
    z-index: 700 !important;
    margin-left: 12px;
}

.case-search-menu {
    left: -155px;
}

.case-search-menu li {
    position: relative;
    float: left;
    display: block;
}

.sort-button {
    margin-left: 12px;
}

.search-close-dropdown-trigger-mask {
    position: absolute;
    display: none;
    top: 0;
    left: 110px;
    width: 120px;
    height: 100px;
    z-index: 640;
}

.search-close-dropdown-trigger {
    position: absolute;
    display: none;
    top: 60px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 495;
    opacity: 0.5 !important;
    filter: alpha(opacity=50) !important;
    background: #000;
}

.current-filter-heading-band {
    position: absolute;
    left: 0;
    right: 0;
    height: 20px;
    text-align: left;
    line-height: 15px;
    font-size: 11px;
    background: #898989;
    color: #fff;
    border-bottom: 1px solid #135795;
}

.required-field-label {
    font-size: 9px;
    font-weight: 100;
    text-transform: uppercase;
    margin-right: 7px;
    color: #f00;
}

.visible-group-heading {
    background: #135795;
    color: #ffffff;
    padding: 2px;
    text-align: center;
    text-transform: uppercase;
    font-size: 11px;
    margin-bottom: 3px;
    margin-left: 15px;
    margin-top: 15px;
}

.not-valid {
    border: 1px solid #f00 !important;
}

.not-valid-heading {
    line-height: 12px;
    vertical-align: top;
    padding-top: 0;
    padding-bottom: 10px;
}

.nav-pills-small {
    width: 80px;
    /* font-size: 10px; */
    overflow: hidden;
    text-transform: uppercase;
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    margin-left: 2px !important;
    margin-top: 1px !important;
    margin-bottom: 6px !important;
}

.nav-pills-large {
    width: 132px;
    /* font-size: 10px; */
    overflow: hidden;
    text-transform: uppercase;
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    margin-left: 2px !important;
    margin-top: 1px !important;
    margin-bottom: 6px !important;
}

.dropdown-btn-label {
    position: relative;
    float: left;
    display: block;
    width: 85%;
    overflow: hidden;
}

.pill-container-small {
    margin-left: 2px !important;
    margin-right: 2px !important;
}

.caret-small {
    margin-left: 0 !important;
}

.unsaved-heading {
    position: absolute;
    top: 60px;
    height: 25px;
    display: block;
    width: 100%;
    text-align: center;
    line-height: 25px;
    font-size: 12px;
    background: #c0392b;
    color: #fff;
}

.selectMenu {
    height: 22px !important;
    font-size: 12px !important;
    line-height: 12px !important;
}

.selectMenu option {
    font-size: 12px !important;
    line-height: 12px !important;
}

.date-time-input {
    width: 150px;
}

.timepicker-picker span {
    text-align: center;
}

.picker-switch span {
    text-align: center;
}

.datepicker {
    z-index: 10000 !important;
    width: 200px !important;
}

.bootstrap-datetimepicker-widget {
    width: 215px !important;
}

ul.unstyled,
ol.unstyled {
    list-style: outside none none;
    margin-left: 0;
}

img.psuedo-back-img {
    max-height: 100%;
    max-width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}

.item-title-description {
    font-size: 8px;
    line-height: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    height: 11px;
    padding: 1px;
    text-transform: uppercase;
    color: #000000;
    width: 100%;
    background: #eeeeee;
}

.panel-heading-parent-specifier {
    font-size: 11px !important;
    margin-left: 0;
    width: 250px;
    height: 22px !important;
    overflow: hidden;
}

.expires-on-title {
    clear: none;
    color: #bf4a2b;
    line-height: 8px;
    /* border: 1px solid #bf4a2b; */
    height: 13px;
    padding: 2px;
    padding-top: 2px;
}

.item-title-value {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px;
    margin-top: 2px;
    padding-left: 0;
    line-height: 13px;
    height: 13px;
}

.event-title-value-adjust {
    height: 13px;
    color: #9b9b9b;
    width: 190px !important;
}

.right-margin-extended-button {
    pointer-events: all;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    margin-top: 3px;
    margin-right: 2px;
    padding: 2px;
    width: 38px;
    height: 30px;
    z-index: 1000;
}

.right-margin-extended-button i {
    position: absolute;
    top: 0;
    left: 0;
    color: inherit;
    font-size: 13px;
    line-height: 12px;
    text-align: center;
    /*
	margin-bottom: 3px;
	margin-top: 2px;
	width: 40px;
	*/
}

.right-margin-extended-button div {
    position: absolute;
    top: 0;
    right: 1px;
    /*
	bottom: 0;
	left: 2px;
	right: 2px;
	height: 10px;
	font-size: 10px;
	line-height: 8px;
	text-align: center;
	color: inherit;
	*/
    text-align: right;
    font-size: 10px;
    line-height: 10px;
    background: #fff;
    color: #555;
}

.right-margin-button {
    pointer-events: all;
    cursor: pointer;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    margin-top: 3px;
    margin-right: 4px;
    padding: 2px;
    width: 38px;
    height: 30px;
    z-index: 1000;
}

.right-margin-button i {
    position: absolute;
    top: 0;
    left: 0;
    color: inherit;
    font-size: 13px;
    line-height: 12px;
    text-align: center;
}

.right-margin-button div {
    position: absolute;
    top: 0;
    right: 1px;
    text-align: right;
    font-size: 10px;
    line-height: 10px;
    background: #fff;
    color: #555;
}

.rmb-norm {
    background: #fff;
    border: 1px solid #555;
    color: #555;
}

.rmb-norm i {
    display: block;
    position: relative;
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.rmb-large-icon {
    background: #fff;
    border: 1px solid #135795;
    color: #135795;
}

.rmb-large-icon i {
    display: block;
    position: relative;
    /*
	margin-top: 8px;
	font-size: 18px !important;
	color: inherit;
	*/
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.rmb-large-icon:hover {
    background: #135795;
    color: #fff;
}

.rmb-norm:hover {
    background: #135795;
    color: #fff;
}

.rmb-empty-notify {
    color: #a44;
    border: 1px solid #a44;
}

.rmb-empty-notify:hover {
    background: #a44;
    color: #fff;
}

.rmb-empty-notify i {
    display: block;
    position: relative;
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
}

.right-margin-menu {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    display: block;
    width: 47px;
    background: none;
    z-index: 150;
}

.right-margin-menu-band {
    display: block;
    pointer-events: all;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 46px;
    z-index: 90;
}

.right-menu-checkbox-container {
    pointer-events: all;
    margin-right: 2px;
    width: 37px;
    text-align: center;
}

.margin-bu-icon {
    color: inherit !important;
    margin-top: 2px;
    text-align: center;
    width: 25px;
}

.event-short-desc-container {
    position: absolute;
    top: 4px;
    left: 260px;
    width: 200px;
    list-style-type: none;
    margin-left: 0;
}

.person-short-desc-container {
    position: absolute;
    top: 4px;
    left: 190px;
    width: 200px;
    list-style-type: none;
    margin-left: 0;
}

.event-person-photo-container {
    position: absolute;
    top: 4px;
    left: 4px;
    display: block;
    width: 260px;
    height: 160px;
}

.inner-shadow {
    -moz-box-shadow: inset 0 0 3px #000000;
    -webkit-box-shadow: inset 0 0 3px #000000;
    box-shadow: inset 0 0 3px #000000;
}

.small-tip-label {
    font-size: 8px;
    line-height: 9px;
    padding: 0;
    margin: 0;
}

.action-menu-divider {
    border-bottom: 1px solid #ccc;
    margin-top: 3px;
}

.panel-sub-toolbar {
    position: absolute;
    top: 60px;
    left: 0;
    right: 0;
    height: 25px;
    /* background: #135795; */
    background: #135795;
}

.panel-sub-toolbar p {
    position: relative;
    float: right;
    color: #fff;
    font-size: 12px;
    line-height: 25px;
    text-transform: uppercase;
}

.select-all-checkbox-container {
    position: relative;
    float: right;
    display: block;
    margin-top: -2px;
    margin-right: 7px;
    margin-left: 5px;
}

.select-all-checkbox-spacer {
    position: relative;
    float: right;
    width: 14px;
    height: 10px;
}

.number-to-be-deleted-messge {
    position: relative;
    width: 100%;
    clear: both;
    text-align: center;
    font-weight: bold;
    color: #f00;
    text-transform: uppercase;
}

.view-event-link {
    font-size: 10px;
    cursor: pointer;
    position: relative;
    float: left;
    clear: left;
}

.alert-danger {
    width: 90% !important;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 5px !important;
}

.visitor-tags {
    position: relative;
    float: left;
    clear: both;
    width: 240px;
    text-transform: uppercase;
    font-size: 11px;
    overflow-y: auto;
}

.tagName {
    margin-left: 5px;
    max-width: 200px;
    overflow: hidden;
    line-height: 22px;
    text-transform: uppercase;
    text-overflow: ellipsis;
}

.so-far {
    padding: 3px;
    height: 15px;
    font-size: 9px;
    line-height: 8px;
    margin-left: 5px;
    background-color: #faa115;
    color: #fff;
    width: 41px;
    border-radius: 3px;
}

.matches-found-label {
    height: 15px;
    font-size: 12px;
    overflow: hidden;
}

.complete-job-progress-container {
    clear: both;
    display: block;
    float: left;
    height: 15px;
    margin: 0;
    padding: 0;
    position: relative;
    width: 240px;
}

.cancelled-job-progress-container {
    clear: both;
    background-color: #ccc;
    color: #000;
    display: block;
    float: left;
    height: 15px;
    margin: 0;
    padding: 0;
    position: relative;
    width: 240px;
}

.view-results-button {
    position: relative;
    float: left;
    clear: left;
    padding: 2px;
    margin-left: 25px;
    padding: 2px;
    width: 160px;
    height: 17px;
    line-height: 11px;
    font-size: 9px;
    text-align: center;
    margin-bottom: 0;
}

.image-props {
    position: relative;
    clear: both;
    font-size: 9px;
    line-height: 10px;
    padding: 0;
    margin: 0;
    margin-top: 4px;
}

.uc {
    text-transform: uppercase;
}

.lc {
    text-transform: lowercase;
}

.image-quality-warning {
    background: #e67e22;
    position: relative;
    clear: both;
    font-size: 9px;
    line-height: 15px;
    padding: 0;
    margin: 0;
    margin-top: 5px;
    color: #fff;
    width: 360px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    padding: 2px;
}

.right-margin-extending-menu {
    position: absolute;
    top: 118px;
    right: 43px;
    display: inline-block;
    white-space: nowrap;
    padding-left: 5px;
    padding-top: 3px;
    z-index: 5000;
    height: 41px;
    /*
	background: #eeeeee;
	background-color: rgba(238, 238, 238, 0.6);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	*/
    border-radius: 5px;
}

.status-bar {
    position: relative;
    float: left;
    width: 250px;
    margin-left: 15px;
    margin-top: 5px;
}

.tag-parent-container {
    position: absolute;
    display: inline-block;
    white-space: nowrap;
    top: 169px;
    left: 3px;
    height: 28px;
    width: 370px;
    padding: 0;
    margin: 0;
    overflow: auto;
}

.tag-container {
    position: absolute;
    display: block;
    white-space: nowrap;
    top: 0;
    left: 0;
    max-height: 90px;
    right: 20px;
    padding: 0;
    margin: 0;
}

.tag-pill {
    position: relative;
    float: left;
    display: block;
    list-style-type: none;
    padding-right: 20px;
    font-size: 9px;
    text-transform: uppercase;
    background: #757575;
    color: #fff;
    padding: 1px;
    margin-left: 1px;
    margin-right: 1px;
    margin-top: 0;
    margin-bottom: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tag-pill-simple {
    font-size: 9px;
    display: block;
    position: relative;
    float: left;
    clear: none;
    max-width: 100px;
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tags-heading {
    padding-right: 2px;
    font-size: 9px;
    text-transform: uppercase;
    color: #000;
    padding: 1px;
    padding-left: 3px;
    padding-right: 3px;
    margin-left: 1px;
    padding-top: 0;
    margin-top: 0;
    overflow: hidden;
    font-weight: bold;
    text-overflow: ellipsis;
}

.exclude-events-with-tags-container {
    position: relative;
    float: left;
    clear: both;
}

.exclude-events-with-tags-container input {
    position: relative;
    float: left;
    clear: none;
}

.exclude-events-with-tags-container p {
    position: relative;
    float: left;
    clear: none;
    margin-top: 3px;
    margin-left: 2px;
    font-size: 10px;
    font-weight: bold;
}

.tag-separator {
    font-size: 10px;
    font-weight: bold;
    line-height: 10px;
    position: relative;
    float: left;
    padding: 0;
    margin: 0;
    margin-right: 5px;
}

.search-params-display-container {
    position: absolute;
    left: 0;
    right: 0;
    background: #135795;
}

.search-panel-search-noloc-bu {
    margin-left: 10px !important;
    position: relative !important;
    clear: none !important;
    width: 100px !important;
    text-align: center !important;
    color: #fff !important;
    margin-top: 15px !important;
    margin-bottom: 0 !important;
    padding: 5px !important;
}

.search-panel-bu-container {
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
}

.search-panel-search-hasloc-bu {
    margin-left: 50px !important;
    position: relative !important;
    float: left !important;
    clear: left !important;
    width: 200px !important;
    text-align: center !important;
    color: #fff !important;
    margin-top: 10px !important;
    margin-bottom: 15px !important;
    padding: 5px !important;
}

.search-panel-location-bu {
    margin-left: 10px !important;
    position: relative !important;
    clear: none !important;
    width: 135px !important;
    text-align: center !important;
    color: #fff !important;
    margin-top: 15px !important;
    margin-bottom: 0 !important;
    padding: 5px !important;
}

.search-panel-clear-button {
    margin-left: 14px !important;
    position: relative !important;
    clear: left !important;
    width: 52px !important;
    text-align: center !important;
    color: #fff !important;
    margin-top: 15px !important;
    margin-bottom: 0 !important;
    padding: 5px !important;
}

.remove-filters-bu {
    font-size: 9px;
    padding: 3px;
    padding-left: 6px;
    padding-right: 6px;
    margin-top: -2px;
    margin-left: 5px;
    line-height: 10px;
}

.remove-filter-bu {
    margin-top: 2px;
    margin-left: 5px;
    cursor: pointer;
    height: 20px !important;
    font-size: 10px !important;
    line-height: 11px !important;
    text-align: center !important;
    padding-top: 4px !important;
    margin-right: 5px;
}

.remove-filter-button {
    width: 15px;
    height: 15px;
    margin: 2px;
    cursor: pointer;
}

.zone-selection-display-container {
    position: absolute;
    left: 0;
    right: 0;
    min-height: 20px;
    max-height: 50px;
    overflow: hidden;
    overflow-y: auto;
    background: #135795;
}

.region-selection-display-container {
    position: absolute;
    left: 0;
    right: 0;
    min-height: 20px;
    max-height: 50px;
    overflow: hidden;
    overflow-y: auto;
    background: #135795;
}

.eg-selection-display-container {
    position: absolute;
    left: 0;
    right: 0;
    min-height: 20px;
    max-height: 50px;
    overflow: hidden;
    overflow-y: auto;
    background: #135795;
}

.tag-selection-display-container {
    position: absolute;
    left: 0;
    right: 0;
    min-height: 20px;
    max-height: 50px;
    overflow: hidden;
    overflow-y: auto;
    background: #135795;
}

@media screen and (max-width: 2000px) {
    #footer-menu {
        display: block;
    }

    #start-menu-label-container {
        display: block;
    }

    .ff-copyright-footer {
        display: block;
    }

    .ff-copyright-footer-minimized {
        display: none;
    }

    #panel-container {
        margin-left: 5px;
    }

    #footer-menu-minimized {
        display: none;
    }
}

@media screen and (max-height: 500px) {
    .ff-copyright {
        display: none;
    }
}

@media screen and (max-width: 800px) {
    .ff-copyright-footer {
        display: none;
    }

    .ff-copyright-footer-minimized {
        display: block;
    }

    #panel-container {
        margin-left: 5px;
    }

    #footer-menu-minimized {
        display: block;
    }

    #footer-menu {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    .ff-copyright-footer-minimized {
        right: 70px;
    }

    #start-menu-label-container {
        display: none;
    }

    .footer-menu-item-min {
        padding-left: 3px;
        padding-right: 3px;
    }

    #start-logo-container {
        width: 100px;
    }
}

@media screen and (max-width: 400px) {
    .ff-copyright-footer-minimized {
        left: 50px;
        right: 70px;
    }
}

.expand-tag-container {
    position: absolute;
    right: 0;
    top: 0;
    color: #000;
}

.date-range-label-to {
    font-size: 12px;
    line-height: 12px;
    margin-top: 6px;
    margin-right: -5px;
    margin-left: 3px;
    border: 1px dashed #f00;
    position: relative;
    float: left;
    color: #fff;
}

.item-divider {
    height: 3px;
    background: #eeeeee;
    margin-bottom: 3px;
}

.menuLabel {
    margin-left: 5px;
    text-transform: uppercase;
    max-width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.constrain-filter-pill {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

.unselectedRow {
    font-size: 12px;
    height: 25px;
    width: 100%;
    overflow: hidden;
    border-bottom: 1px solid #cccccc;
    background: #fff;
    color: #000000;
    padding: 4px;
    cursor: pointer;
    white-space: nowrap;
}

.unselectedRow p {
    color: inherit;
}

.unselectedRow:hover {
    background: #135795;
    color: #ffffff;
}

.selectedRow {
    font-size: 12px;
    height: 25px;
    width: 100%;
    overflow: hidden;
    border-bottom: 1px solid #cccccc;
    background: #0072c6;
    color: #fff;
    padding: 4px;
    cursor: pointer;
    white-space: nowrap;
}

.selectedRow p {
    color: #fff;
}

.selectedRow:hover {
    background: #0072c6;
    color: #ffffff;
}

.oddRow:hover {
    background: #135795;
    color: #ffffff;
}

.single-col-filter-container {
    width: 250px;
    background: #fff;
    height: 250px;
    padding: 10px;
}

.single-col-report-menu {
    list-style-type: none;
    overflow-y: auto;
    overflow-x: hidden;
    height: 165px;
    width: 90%;
}

.single-col-filter-input {
    font-size: 11px !important;
    line-height: 11px !important;
    width: 215px !important;
    height: 20px !important;
    padding: 0 !important;
    margin-bottom: 2px !important;
    padding-left: 5px !important;
}

.single-line-heading {
    width: 95%;
    font-size: 10px;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 5px;
    margin-bottom: 3px;
    margin-top: 5px;
}

.alerts-view section {
    padding: 10px;
}

.alerts-view .row-fluid {
    margin: 10px 0;
}

.filter-match {
    color: #f00;
}

.video-player {
    margin-top: 15px;
    margin-left: 15px;
    width: 570px;
    height: 380px;
    background: #000;
}

.add-face-success-msg {
    width: 250px;
    background: #fff6bf;
    border-radius: 5px;
    border: 2px solid #ffd324;
    color: #000000;
    padding: 6px;
    font-size: 12px;
    line-height: 14px;
    margin-left: 80px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.drop-here-msg {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    background: #135795;
    color: #ffffff;
    border-top: 4px solid #c0392b;
    border-bottom: 4px solid #c0392b;
    font-size: 10px;
    line-height: 11px;
    margin-bottom: 15px;
}

.adding-photo-msg {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    padding: 5px;
    background: #135795;
    color: #ffffff;
    border-top: 4px solid #c0392b;
    border-bottom: 4px solid #c0392b;
    margin-bottom: 15px;
}

.adding-photo-msg p {
    color: #fff;
    font-size: 11px;
    margin-top: 5px;
    margin-left: 5px;
    margin-bottom: 5px;
    line-height: 16px;
}

.tag-name {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    text-transform: uppercase;
    text-overflow: ellipsis;
}

.face-quality-table {
    padding: 5px;
    margin-left: 2px;
    border: 1px solid #000;
}

.face-quality-table td {
    text-transform: uppercase;
}

.face-quality-table-col1 {
    font-size: 11px;
    text-align: right;
    width: 125px;
    padding-right: 5px;
    color: #808080 !important;
    padding-top: 3px;
    padding-bottom: 3px;
}

.face-quality-table-col2 {
    font-size: 11px;
    text-align: left;
    width: 30px;
    padding-left: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.face-quality-table-col3 {
    text-align: left;
    width: 175px;
    font-size: 11px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.search-menu-shadow {
    -webkit-box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, 0.05) !important;
    -moz-box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, 0.05) !important;
    box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, 0.05) !important;
}

.busy-submitting-search {
    position: absolute;
    top: 150px;
    left: 25px;
    right: 25px;
    height: 150px;
    z-index: 999999;
    font-size: 8px;
    line-height: 10px;
    background: #ffffff;
    color: #fff;
    pointer-events: none;
    border-radius: 15px;
    text-transform: uppercase;
    -webkit-box-shadow: 5px 5px 16px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 5px 5px 16px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 5px 5px 16px 0px rgba(0, 0, 0, 0.2);
}

div .tree-node:hover {
    background-color: #d9dee1;
}

div .highlight-node {
    background-color: #e3ffd1;
    font-style: italic;
    font-weight: bolder;
    text-transform: uppercase;
}

.regions-tree {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    display: none;
    min-width: 405px;
    padding: 10px;
    position: absolute;
    z-index: 1000;
    background-clip: padding-box;
    background-color: #ffffff;
    border: 0 none;
    border-radius: 6px;
    margin: 5px;
    overflow: visible;
}

.regions-tree-toolbar {
    height: 30px;
    background: #d1e9ff;
}

.regions-tree-toolbar .toolbar-btn {
    width: 100px;
    margin-top: 3px;
}

.regions-tree-btns .toolbar-btn {
    margin-top: 3px;
}

.regions-tree-btns {
    display: block;
    text-align: center;
    background: #d1e9ff;
    height: 30px;
}

.selectRegion {
    font-size: 12px;
    width: 95px;
}

.regions-tree .fa {
    position: relative;
    top: 5px;
    padding-right: 8px;
}

.regions-tree .fa:hover {
    cursor: pointer;
}

.inlinenowrap {
    display: inline-flex;
    white-space: nowrap;
}

.user-roles-table thead {
    position: sticky;
    top: 3px;
    background: #d1e9ff;
}

.aup-main-header {
    font-weight: bold;
    color: #17639f;
}

.aup-sub-header {
    font-weight: bold;
    color: #4e98d3;
    margin-top: 15px;
    margin-bottom: 5px;
}

.aup-modal-body {
    background-color: white;
    padding: 5px;
    padding-bottom: 15px;
    text-align: justify;
}

.aup-modal-body ul {
    list-style-type: unset !important;
    padding: 7px 20px !important;
}

.aup-modal-button {
    background: #135795;
    color: white;
    padding: 8px;
    border-radius: 22px;
}

#user-activation-pad-container {
    margin-top: 40px;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    background: #135795;
    border-radius: 5px;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.face-quality-table > p:first-child {
    margin-top: 0.625em;
    /* margin-bottom: 20px; */
    /* padding: 10px; */
    text-align: center;
    width: 290px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 500;
    font-size: 1.2em;
}

.face-quality-table > p:last-child {
    margin-top: 1.5em;
    margin-left: auto;
    margin-right: auto;
    text-align: justify;
}

.image-face-quality-sample {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 1em;
    margin-bottom: 1em;
    font-size: 0.95em;
}

.image-face-quality-sample > .img {
    background: #cccccc;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../img/facefirst-image-quality-sample.png);
    width: 7.5em;
    height: 10em;
    border: 1px solid gray;
}

.image-quality-checklist > h4 {
    font-weight: bold;
}

.image-quality-checklist > ul {
    text-align: left;
    font-size: 1em;
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

.image-quality-checklist > ul > li::before {
    content: "\f096";
    padding-right: 0.5em;
    font: normal normal normal 14px / 1 FontAwesome;
}

/* Container */
.tooltip-container {
    position: relative;
    display: inline-block;
}

.tooltip-trigger {
    display: inline-block;
    width: 100%;
}

/* Error states for inputs */
.tooltip-container input.ng-invalid.ng-touched,
.tooltip-container input.ng-invalid.ng-dirty {
    border-color: #dc2626;
    outline-color: #dc2626;
}

/* Tooltip Content */
.tooltip-content {
    display: none;
    position: absolute;
    background: #dc2626;
    color: white;
    padding: 8px 32px 8px 12px; /* Extra padding for close button */
    border-radius: 4px;
    font-size: 14px;
    white-space: normal;
    width: 300px;
    word-wrap: break-word;
    z-index: 1000;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Visible state */
.tooltip-content.visible {
    display: block;
    animation: tooltipFadeIn 0.2s ease-in;
}

/* Close button */
.tooltip-close {
    position: absolute;
    right: 8px;
    top: 12px;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: white;
    font-size: 18px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.tooltip-close:hover {
    opacity: 1;
}

/* Position Variants */
.tooltip-content.top {
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 8px;
}

.tooltip-content.bottom {
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 8px;
}

.tooltip-content.left {
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 8px;
}

.tooltip-content.right {
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 8px;
}

/* Arrows */
.tooltip-content::after {
    content: "";
    position: absolute;
    border-style: solid;
    border-width: 5px;
}

.tooltip-content.top::after {
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-color: #dc2626 transparent transparent transparent;
}

.tooltip-content.bottom::after {
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-color: transparent transparent #dc2626 transparent;
}

.tooltip-content.left::after {
    left: 100%;
    top: 50%;
    margin-top: -5px;
    border-color: transparent transparent transparent #dc2626;
}

.tooltip-content.right::after {
    right: 100%;
    top: 50%;
    margin-top: -5px;
    border-color: transparent #dc2626 transparent transparent;
}

/* Dark Theme */
.tooltip-container.dark .tooltip-content {
    background: #1f2937;
}

.tooltip-container.dark .tooltip-content.top::after {
    border-top-color: #1f2937;
}

.tooltip-container.dark .tooltip-content.bottom::after {
    border-bottom-color: #1f2937;
}

.tooltip-container.dark .tooltip-content.left::after {
    border-left-color: #1f2937;
}

.tooltip-container.dark .tooltip-content.right::after {
    border-right-color: #1f2937;
}

/* Animation */
@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px) translateX(-50%);
    }
    to {
        opacity: 1;
        transform: translateY(0) translateX(-50%);
    }
}

/* Adjust animation for left/right positions */
.tooltip-content.left,
.tooltip-content.right {
    animation-name: tooltipFadeInSide;
}

@keyframes tooltipFadeInSide {
    from {
        opacity: 0;
        transform: translateX(10px) translateY(-50%);
    }
    to {
        opacity: 1;
        transform: translateX(0) translateY(-50%);
    }
}

.loading-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading-spinner {
    width: 48px;
    height: 48px;
    border: 5px solid var(--brand-primary);
    border-top: 5px solid var(--brand-highlight);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.centered {
    align-items: center;
    text-align: center;
}

.link-action {
    cursor: pointer;
    color: var(--brand-primary);
}
.link-action:hover {
    text-decoration: underline;
}