h4 {
    margin-top: 20px;
}

/* We force quite a few of the settings below; see
   https://community.plotly.com/t/dash-table-overrules-custom-css/29298/2 */
.dash-header {
  font-family: Lato, sans-serif;
  background-color: rgb(30, 30, 30) !important;
  padding-right: 10px !important;
}

.dash-cell {
    font-family: Lato, sans-serif;
    background-color: rgb(50, 50, 50) !important;
    padding-right: 10px !important;
}

/* Dark theme for dropdown; see
   https://community.plotly.com/t/change-textcolor-for-dropdown-menu/35230 */
.Select-control {
    background-color: #222 !important;
}

.Select.is-focused > .Select-control {
    background-color: #222;
}

#school-input {
    color: white;
}

.Select-input input {
    color: white;
}

.Select-value-label {
    color: white;
}

.Select--single > .Select-control .Select-value, .Select-placeholder {
    border: 1px solid grey;
    border-radius: 4px;
}

.VirtualizedSelectOption {
    background-color: #222;
    color: white;
 }

.VirtualizedSelectFocusedOption {
    background-color: #222;
    opacity: .7;
}

.Select.is-focused:not(.is-open) > .Select-control {
    background-color: #222;
    border-color: var(--primary); 
    box-shadow: none;
}