/* Global styles */
body {
    background-color: #121212;
}

/* Login screen */
/* Background */
.stpanel section div#logo figure.figurelogo {
    filter: grayscale(100%) brightness(400%);
}
.stpanel section {
    background-color: #121212;
}
/* Marketing text */
.stpanel section div#marketing {
    color: #e1e1e1; 
}
/* Form container and messages */
.stpanel section div.form--holder .stpanel--error--message, .stpanel section div.form--holder form {
    color: #e1e1e1;
    box-shadow: unset;
    background-color: #1E1E1E;
}
.stpanel .loader--dot1, .stpanel .loader--dot2, .stpanel .loader--dot3, .stpanel .loader--dot4 {
    background-color: #01A299;
}
.stpanel--loader {
    background-color: unset;
}
.stpanel--links a {
    color: #017374;
}
.stpanel--links a:hover {
    color: #00B3A6;
}
/* Slogan */
.stpanel section div#slogan span:last-of-type {
    color: #01A299;
}
/* Inputs */
.stpanel .form--input input {
    color: #e1e1e1;
    border-color: #e1e1e1;
    background-color: #383838;
}
.stpanel .form--input input:focus {
    color: #ebebeb;
    border-color: #70EFDE;
}
.stpanel .form--input.state-disabled input {
    background-color: #01A299;
    border-color: #01A299;
    color: #ebebeb;
}
.stpanel .form--input i {
    color: #ebebeb;
}
.stpanel .form--input i:hover {
    color: #a5a5a5;
}
/* Checkbox */
.stpanel .form--checkbox:focus i, .stpanel .form--checkbox:hover i, .stpanel .form--radio:focus i, .stpanel .form--radio:hover i, .stpanel .form--select:focus select, .stpanel .form--select:hover select, .stpanel--screensaver .form--select:focus select, .stpanel--screensaver .form--select:hover select {
    border-color: #01A299;
}
.stpanel .form--checkbox input + i::after{
    color: #e1e1e1;
}
.stpanel .form--checkbox input:checked + i, .stpanel .form--radio input:checked + i {
    background-color: #01A299;
    border-color: #01A299;
}
/* Buttons */
.button--stpanel, button.button--stpanel, input[type="submit"].button--stpanel {
    color: #01A299;
}
.stpanel section div#marketing a.btn, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel, .stpanel section div.form--holder form a.button--stpanel, .stpanel--meldingen a.button--stpanel, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel, .stpanel--screensaver section div.form--holder form a.button--stpanel {
    border-color: #01A299;
    color: #01A299!important;
}
.stpanel section div#marketing a.btn:hover, .button--stpanel:active, .button--stpanel:focus, .button--stpanel:hover, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:active, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:focus, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:hover, .stpanel section div.form--holder form a.button--stpanel:active, .stpanel section div.form--holder form a.button--stpanel:focus, .stpanel section div.form--holder form a.button--stpanel:hover, .stpanel--meldingen a.button--stpanel:active, .stpanel--meldingen a.button--stpanel:focus, .stpanel--meldingen a.button--stpanel:hover, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:active, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:focus, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:hover, .stpanel--screensaver section div.form--holder form a.button--stpanel:active, .stpanel--screensaver section div.form--holder form a.button--stpanel:focus, .stpanel--screensaver section div.form--holder form a.button--stpanel:hover, button.button--stpanel:active, button.button--stpanel:focus, button.button--stpanel:hover, input[type="submit"].button--stpanel:active, input[type="submit"].button--stpanel:focus, input[type="submit"].button--stpanel:hover {
    background:#01A299;
    color: #e1e1e1!important;
}
/* Footer */
footer > span {
    color: #e1e1e1;
}

/* Main screen */
/* Header */
span.logo {
    opacity: 0.75;
}
#header-wrapper {
    background-color: #1E1E1E;
}
#header-wrapper a {
    color: #a5a5a5!important;
}
#header-wrapper a:hover {
    color: #e1e1e1!important;
    opacity: 1;
}
span.header {
    color: unset;
}
#user img {
    display: none;
}
#user span.header {
    color: unset;
}
span#inbox-counter {
    background-color: #01A299;
    color: #121212!important;
}

/* Content Window */
/* Main menu */
#main-menu a.active, #main-menu a.active:hover {
    background-color: #01A299;
    color: #e1e1e1!important;
}
#main-menu a {
    background-color: #232323;
    color: #a5a5a5!important;    
}
#main-menu a:hover {
    background-color: #292929;
    color: #e1e1e1!important;
}
#main-menu-bottom {
    background-color: #01A299;
}
#content {
    box-shadow: unset;
}
/* Panels */
#master-panel, #master-panel .panel-header {
    background-color: #1E1E1E;
    border: unset;
    color: #e1e1e1;
}
.panel-header h2, #detail-panel h2, #detail-panel h3 {
    color: #e1e1e1;
}
#master-panel h2, h1 {
    color: #e1e1e1;
}
#master-panel .sub {
    color: #a5a5a5;
}
div#detail-panel-wrapper {
    background-color: #232323;
}
#master-panel ~ #detail-panel-wrapper, #content {
    border: unset!important;
}
/* Date and type tags */
#master-panel .date div, .pauze, .roster-table-header .day .huiswerk-items, .uurNummer, .type {
    background-color: #2C2C2C!important;
    color: #e1e1e1!important;
    border-color: #a5a5a5!important;
}
#master-panel .date div p.date-day, #master-panel .date div p.date-month, #master-panel .date span {
    color: #e1e1e1!important;
}
#master-panel .date div {
    border-right: 0px !important;
    margin: 0 0 0 -40px !important;
    padding: 5px !important;
}
#master-panel .date div p.date-day {
    background: unset;
}
/* Top-right buttons */
.ribbon .chk.checked, .ribbon .chk:hover, .ribbon.chk.checked, .yellow.ribbon a {
    color:#e1e1e1;
    border-bottom: 3px solid #00C4B4;
    background-color: unset!important;
}
.ribbon .chk, .ribbon .chk.checked:hover{
    color: #a5a5a5;
    border-color: #019592;
}
.yellow.ribbon span {
    color: #a5a5a5;
}
/* Box items */
.box {
    background-color: #2C2C2C;
    color: #e1e1e1;
    border: unset;
    margin-top: 5px;
}
.m-element {
    color: #e1e1e1;
    border: unset!important;
}
.m-element:hover {
    background-color: #2C2C2C;
}
/* Ions */
.icon-geen-van-beide, .icon-huiswerk, .icon-leermiddelen, .icon-maatregel, .icon-studiewijzer, .icon-toets {
    background-color: #01A299;
    color: #121212!important;
}