.header {
    background-color: #000000;
    color: white;
}

.middle-container {
    background-color: #FFFFFF;
}

.labeling-pannels-container {
    background-color: #394867;
}

.label-panel {
    background-color: #ECEFF1;
    color: #333333;
}

.label-panel:hover {
    background-color: #C6D1D8;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}

.left-panels {
    background-color: #FFFFFF;
}

.container-options {
    background-color: #FFFFFF;
}
  
.panel-content {
    border: 1px solid #dee2e5;
    background-color: white;
}
  
.panel-content-down {
    border: 1px solid #dee2e5;
    background-color: white;
}

.bottom-panel-heading {
    background-color: #ecf0f1;
    color: #2b3c4e;
}

.right-panels {
    background-color: #FFFFFF;
}

.select.is-link select {
    border-color: #485fc7 !important;
}

.select.is-link:not(:hover)::after {
    border-color: #485fc7 !important;
}

.element-image-container img {
    border: 1px solid black;
}

.master-label {
    background: darkgray;
}

.loader {
    border: 16px solid #f3f3f3 !important;
    border-top: 16px solid #3498db !important;
}

.listContainerOptions {
    background-color: #fff; 
    border: 1px solid #363636;
}

.dropdown-item:hover {
    background-color: #dadada;
}

.optionsDropdownItemValue {
    color: #363636 !important; 
}

.hotkey-value {
    color: black;
}

.divider {
    border-bottom: 1px solid black;
}

.small-divider {
    border-bottom: 1px solid black;
}

.hotkey-key {
    color: #555;
    border-color: #f2f2f2;
    text-shadow: 0 0.5px 1px #777, 0 2px 6px #f2f2f2;
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #D2D2D2 80%, #c0c0c0 100%);
    box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 6px 0 #C0C0C0, 0 8px 17px rgba(#444, 0.4), 2px 1px 4px rgba(#444, 0.25), -2px 1px 4px rgba(#444, 0.25), 0 9px 16px rgba(#444, 0.1);
    
    &:hover,
    &:focus {
      box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 4px 0 #C0C0C0, 0 2px 35px rgba(#444, 0.3), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 7px 4px rgba(#444, 0.1);
    }
    
    &:active {
      box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 0 0 #C0C0C0, 0 0px 30px rgba(#444, 0.15), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 0px 4px rgba(#444, 0.25);
    }
  }

.tooltip-modal-content {
    background-color: white;
}
.tooltip-timeline-title {
    color: black !important;
}

.exam-disabled {
    color: #ccc;
}