/**********************************************************/
/* HTML typed objects */
/**********************************************************/
@import url('Colors.css');

body {
    background-color: #efefef;
    font-size: 12px;
    font-family: Tahoma;
    margin-top: 0px;
    margin-right: 4px;
    margin-left: 4px;
    margin-bottom: 4px;
    padding-right: 8px;
    padding-left: 2px;
    padding-bottom: 10px;
    color: #4a4a4a;
}

select {
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
}

textarea {
    font-size: 12px;
    font-family: Tahoma;
}

input {
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
}
input:focus {outline: none; }
button:focus {outline: none; }

hr {
    background: #4a4a4a;
    border: none;
    color: #4a4a4a;
    height: 1px;
}

h2 {
    font-size: 13px;
    font-family: Tahoma;
    font-weight: bold;
    color: #4a4a4a;
    margin-top: 10px;
    margin-bottom: 8px;
}

th {
    text-align: left;
}

input[type="checkbox"] {
    margin: 3px 3px 0 0;
    vertical-align: bottom;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #c6c6c6;
  opacity: 1;
}

/**********************************************************/
/* Custom classes */
/**********************************************************/
.topDummyRow {
    background-color:#efefef;
}

.preLogInMessage {
    font-size: 12px;
    font-weight: bold;
    color: var(--rood);
}

.headerText {
    font-size: 15px;
    font-family: Tahoma;
    font-weight: bold;
    color: #000000;
}

.headerText2 {
    font-size: 18px;
    font-family: Tahoma;
    color: #000000;
}

.gridHeader {
    background-color: #afdaf6;
    color: #4a4a4a;
}

.gridHeader2 {
    background-color:#afdaf6;
    color:#4a4a4a;
    height:18px;
}

.mainAreaOuter {
    margin-left: 1px;
    /*min-height: 700px;
    max-height: 700px;*/
    -moz-box-shadow: 0 1px 5px #272727;
    -webkit-box-shadow: 0 1px 5px #272727;
    background-color: #ffffff;
}

.mainAreaInnerLogin {
    padding: 12px;
}

.mainAreaInnerLoginSMS {
    padding-left: 36px;
    padding-right: 32px;
    padding-top:4px;
    padding-bottom:12px;
}

.smsErrorLogin {
    text-align:center;
    font-size:16px;
}

.mainAreaInner {
    min-height: 650px;
    /*max-height: 650px;*/
    padding: 8px;
    overflow: auto;
    margin-top: 13px;
}

.mainAreaInnerSideMenu {
    padding: 8px;
    text-align: right;
}

.whiteText {
    color: #ffffff;
    font-weight: bold;
}

.whiteTextSmooth {
    color: #ffffff;
}

.greenText {
    color: #009900;
}

.blueText {
    color: #1c76e5;
}

.orangeText {
    color: #f2a223;
}

.redText {
    color: #CC0000;
}

.inactive {
    background-color: #CC0000;
    font-weight: bold;
}

.errorControl {
    background-color: #CC0000;
}

.okControl {
    background-color: #009900;
}

.periodeInfoNr {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    text-align:center;
    font-size:11px;
    color:#134a85;
    width:20px;
    height:14.1px;
    background-color:var(--geel);
    display:inline-block;
    margin-left:3px;
    cursor:pointer;
    border-style:none;
}

.messagesBox {
    color: White;
    font-weight: bold;
    border-style: solid;
    border-color: #4a4a4a;
    border-width: 1px;
    width: 99%;
    margin-top: 2px;
    margin-bottom: 8px;
    padding: 4px;
}

.redBar {
    background-color: #CC0000;
}

.warningBar {
    color: #000000;
    border-style: solid;
    border-color: #4a4a4a;
    border-width: 1px;
    width: 608px;
    margin-bottom: 8px;
    padding:4px;
    background-color: #eac01e;
}

.errorBar {
    color: #000000;
    border-style: solid;
    border-color: #4a4a4a;
    border-width: 1px;
    width: 608px;
    margin-bottom: 8px;
    padding-top:4px;
    padding-left:4px;
    padding-right:4px;
    padding-bottom:20px;
    background-color: #d57c7c;
}

.greenBar {
    background-color: #009900;
}

.tableCell {
    padding-bottom: 8px;
    vertical-align: middle;
}

.tableCellA {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
    text-align: center;
    padding:4px;
}

.tableCellB {
    border-style: solid;
    border-width: 1px;
    border-left: none;
    border-top: none;
    border-color: #4a4a4a;
    vertical-align: middle;
    padding-left: 4px;
}

.inPageMenuItem {
    font-size: 13px;
    font-family: Tahoma;
    font-weight: bold;
    color: #4a4a4a;
    margin-top: 10px;
    margin-bottom: 4px;
}

.sideMenuItem {
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
    width: 200px;
}

.startPageMenuItemBlue {
    font-size: 12px;
    font-family: Tahoma;
    width: 200px;
    height: 50px;
    color: #003158;
}

.inPageHyperlink {
    font-weight: bold;
    color: #4a4a4a;
}

.inPageHyperlinkRed {
    font-weight: bold;
    color: #CC0000;
}

.inPageHyperlink2 {
    color: #4a4a4a;
}

.link {
    color: #4a4a4a;
}

.onmouseoverLink {
    text-decoration: underline;
    cursor: pointer;
}

.blacklinkNoLine {
    color: #000000;
    text-decoration: none;
}

.bluelinkNoLine {
    color: #32879f;
    text-decoration: none;
}

.noLine {
    text-decoration: none;
}

.buttonLogin {
    font-size: 12px;
    font-family: Tahoma;
    width: 80px;
    color: #4a4a4a;
    background-color: #ffffff;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.buttonLoginSMS {
    font-size: 20px;
    font-family: Tahoma;
    width: 120px;
    color: #4a4a4a;
    background-color: #ccc;
    border-style: solid;
    border-width: 1px;
    height: 30px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.button {
    font-size: 12px;
    font-family: Tahoma;
    width: 80px;
    border-style: solid;
    border-width: 1px;
    height: 21px;    
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.buttonSmall {
    font-size: 12px;
    font-family: Tahoma;
    width: 65px;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .buttonSmall:disabled {
        font-size: 12px;
        font-family: Tahoma;
        width: 65px;
        color: darkgray;
        background-color: lightgrey;
        border-style: solid;
        border-width: 1px;
        height: 21px;
        border-color: #32879f;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.buttonMedium {
    font-size: 12px;
    font-family: Tahoma;
    width: 90px;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .buttonMedium:disabled {
        font-size: 12px;
        font-family: Tahoma;
        width: 90px;
        color: darkgray;
        background-color: lightgrey;
        border-style: solid;
        border-width: 1px;
        height: 21px;
        border-color: #32879f;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.buttonLarge {
    width: 120px;
    font-size: 12px;
    font-family: Tahoma;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .buttonLarge:disabled {
        width: 120px;
        font-size: 12px;
        font-family: Tahoma;
        color: darkgray;
        background-color: lightgrey;
        border-style: solid;
        border-width: 1px;
        height: 21px;
        border-color: #32879f;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.buttonExtraLarge {
    width: 150px;
    font-size: 12px;
    font-family: Tahoma;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .buttonExtraLarge:disabled {
        width: 150px;
        font-size: 12px;
        font-family: Tahoma;
        color: darkgray;
        background-color: lightgrey;
        border-style: solid;
        border-width: 1px;
        height: 21px;
        border-color: #32879f;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.buttonExtraLargeDisabled {
    width: 150px;
    font-size: 12px;
    font-family: Tahoma;
    color: darkgray;
    background-color: lightgrey;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.buttonXXL {
    width: 170px;
    font-size: 12px;
    font-family: Tahoma;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .buttonXXL:disabled {
        width: 210px;
        font-size: 12px;
        font-family: Tahoma;
        color: darkgray;
        background-color: lightgrey;
        border-style: solid;
        border-width: 1px;
        height: 21px;
        border-color: #32879f;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

.buttonWide {
    width: 160px;
    font-size: 12px;
    font-family: Tahoma;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    color: #ffffff;
    background-color: #0887d4;
    border-color: #0887d4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.buttonGreen {
    background-color:#90e876;
    border-style:solid;
    border-width:1px;
    border-color:gray;
    width:200px;
    padding:4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    margin:2px;
    text-decoration:none;
    font-weight:bold;
}

.linkButtonSquare {
    display: table-cell;
    width: 20px;
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
    background-color:#afdaf6;
    height: 14px;
    border: 1px solid #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: left;
    vertical-align: middle;
}

.linkButtonSquare2 {
    display: table-cell;
    width: 20px;
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
    background-color: #afdaf6;
    height: 14px;
    border: 1px solid #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: left;
    vertical-align: middle;
    border-color: #134a85;
    border-style: solid;
    border-width: 1px;
    border-radius: 3px;
}

.linkButtonCircle {
    display: table-cell;
    width: 15px;
    font-size: 12px;
    font-family: Tahoma;
    color: #ffffff;
    background-color: #1c76e5;
    height: 14px;
    border: 1px solid #afdaf6;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 15px;
    text-align: left;
    vertical-align: middle;
}

.buttonTransp {
    border-width:1px;
    border-color:gray;
    background-color:transparent;
    font-size:10px;
    cursor:pointer;
}

#CPH1_fuFileUpload::-webkit-file-upload-button {
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
    background-color:#afdaf6;
    border-style: solid;
    border-width: 1px;
    height: 21px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.buttonLogin:hover { cursor:pointer; }
.buttonLoginSMS { cursor:pointer; }
.button { cursor:pointer; }
.buttonSmall { cursor:pointer; }
.buttonMedium { cursor:pointer; }
.buttonLarge { cursor:pointer; }
.buttonExtraLarge { cursor:pointer; }
.buttonXXL { cursor:pointer; }
.buttonWide { cursor:pointer; }
.buttonGreen { cursor:pointer; }
.buttonTransp { cursor:pointer; }
.linkButtonSquare { cursor:pointer; }

.dataImportDiv {
    width: 900px;
    padding: 4px;
}

.infoDiv {
    padding: 4px;
}

.grayIcon {
    color: #4a4a4a;
}

.whiteIcon {
    color: #ffffff;
}

.infoIcon {
    color: #2477e2;
}

.okIcon {
    color: #268E11;
}

.nokIcon {
    color: #E00909;
}

.warningkIcon {
    color: #dcbd13;
}

.toetsResultaatInfoCap {
    font-size: 10px;
    font-style: italic;
}

.toetsResultaatDotted {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
}

.toetsResultaatDotted2 {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
}

.toetsResultaatDottedCap {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
    border-bottom-style: none;
}

.toetsResultaatDottedTot {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
    border-right-style: none;
}

.toetsResultaatDottedHighLight {
    border-style: solid;
    border-width: 1px;
    border-color: #a0a0a0;
    background-color: #efefef;
}

.toetsResultaatMarkering {
    font-size: 8px;
}

.toetsResultaatName {
    border-width: 1px;
    border-color: #FFFFFF;
}

.smallCap {
    font-size: 10px;
    text-align: center;
}

.eindCijferBlack {
    color: #000000;
    border: none;
}

.eindCijferBlue {
    color: #0055FF;
    border: none;
}

.eindCijferRed {
    color: var(--rood);
    border: none;
}

.webkit {
    -webkit-print-color-adjust: exact;
}

.pWaardeBlack {
    color: #000000;
    border-width:2px;border-style:solid;border-color:#ffffff;
}

.pWaardeRed {
    color: #E00909;
    background-color: var(--geel);
    border-width:2px;border-style:solid;border-color:var(--geel);
}

.signaleringGeelNTermCesuur {
    background-color: var(--geel);
    border-width: 1px;
}

.signalering {
    font-weight: bold;
    background-color: #FFFFFF;
    border: none;
    color: #000000;
}
.signaleringBG {
    font-weight: bold;
    background-color: #FFFFFF;
    border: none;
    color: #000000;
}

.iRood {
    background-color: var(--rood);
}

.iGeel {
    background-color: var(--geel);
}

.iGroen {
    background-color: var(--groen);
}

.iGroenMax {
    background-color: var(--groenplus);
}

.signaleringGroen {
    background-color: var(--groen);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/VoldoendeSoft.png) no-repeat right center;
}
.signaleringGroen2 {
    background-color: var(--groen);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/VoldoendeSoft2.png) no-repeat right center;
}
.signaleringGroenBG {
    background-color: var(--groen);
    font-weight: bold;
    border: none;
    color: #000000;
}

.signaleringGroenPlus {
    background-color: var(--groenplus);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/Smiley.png) no-repeat right center;
}
.signaleringGroenPlus2 {
    background-color: var(--groenplus);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/Smiley2.png) no-repeat right center;
}
.signaleringGroenPlusBG {
    background-color: var(--groenplus);
    font-weight: bold;
    border: none;
    color: #000000;
}

.signaleringGeel {
    background-color: var(--geel);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/UitroeptekenSoft.png) no-repeat right center;
}
.signaleringGeel2 {
    background-color: var(--geel);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/UitroeptekenSoft2.png) no-repeat right center;
}
.signaleringGeelBG {
    background-color: var(--geel);
    font-weight: bold;
    border: none;
    color: #000000;
}

.signaleringRood {
    background-color: var(--rood);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/ZwakSoft.png?p=1) no-repeat right center;
}
.signaleringRood2 {
    background-color: var(--rood);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/ZwakSoft2.png?p=1) no-repeat right center;
}
.signaleringRoodBG {
    background-color: var(--rood);
    font-weight: bold;
    border: none;
    color: #000000;
}

.signaleringGroenPlusLarge {
    background-color: var(--groenplus);
    font-weight: bold;
    border: none;
    color: #000000;
    background: url(../Images/Coderingen/SmileyLarge.png) no-repeat right center;
}
.signaleringGroenPlusLargeBG {
    background-color: var(--groenplus);
    font-weight: bold;
    border: none;
    color: #000000;
}

.overlay {
    background: transparent url(../Images/overlay.png) repeat top left;
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 100;
}

.box {
    position: fixed;
    top: -200px;
    left: 30%;
    right: 30%;
    background-color: #fff;
    color: #7F7F7F;
    padding: 20px;
    border: 2px solid #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-box-shadow: 0 1px 5px #333;
    -webkit-box-shadow: 0 1px 5px #333;
    z-index: 101;
}

a.boxclose {
    float: right;
    width: 26px;
    height: 26px;
    background: transparent url(images/cancel.png) repeat top left;
    margin-top: -30px;
    margin-right: -30px;
    cursor: pointer;
}

.box h1 {
    border-bottom: 1px dashed #7F7F7F;
    margin: -20px -20px 0px -20px;
    padding: 10px;
    background-color: #FFEFEF;
    color: #EF7777;
    -moz-border-radius: 20px 20px 0px 0px;
    -webkit-border-top-left-radius: 20px;
    -webkit-border-top-right-radius: 20px;
    -khtml-border-top-left-radius: 20px;
    -khtml-border-top-right-radius: 20px;
}

.leerlingCommentBox {
    width:1072px;
    border-style: ridge;
    border-width: 1px;
    border-color: gray;
    padding:6px;
    margin-top:8px;
}

/**********************************************************/
/* OMZA START                                             */
/**********************************************************/
.omzaLetterCell {
    border: solid;
    border-width: 0;
    -webkit-print-color-adjust: exact;
}

.omzaCellWithPrevious {
    -webkit-print-color-adjust: exact;
}

.omzaCell {
    border: solid;
    border-width: 1px;
    border-top-style:none;
    padding: 0;
    margin: 0;
    -webkit-print-color-adjust: exact;
}

.omzaCellFirstRow {
    border: solid;
    border-width: 1px;
    padding: 0;
    margin: 0;
    -webkit-print-color-adjust: exact;
}

.omzaCellFirstRowPeer {
    border: solid;
    border-width: 1px;
    padding: 0;
    margin: 0;
    -webkit-print-color-adjust: exact;
}

.omzaValueCellLeft {
    width: 8px;
    height: 24px;
    display: inline-block;
    border-width: 0;
    padding: 0;
    margin: 0;
    float: left;
    margin-right: -1px;
    -webkit-print-color-adjust: exact;
}

.omzaValueCellRight {
    width: 16px;
    height: 24px;
    display: inline-block;
    border-width: 0;
    padding: 0;
    margin: 0;
    float: right;
    -webkit-print-color-adjust: exact;
}

.omzaValueCellCenter {
    -webkit-print-color-adjust: exact;
    background-color: lightgray;
    width: 1px;
    height: 24px;
    display: inline-block;
    border-width: 0;
    padding: 0;
    margin: 0;
    float: none;
}

.omzaValueCell {
    -webkit-print-color-adjust: exact;
    width: 24px;
    height: 24px;
    display: inline-block;
    border-width: 0;
    padding: 0;
    margin: 0;
    float: right;
    background-color: white;
}

.omzaValueCell2 {
    -webkit-print-color-adjust: exact;
    width: 24px;
    display: inline-block;
    border-width: 0;
    padding: 0;
    margin: 0;
    float: right;
    background-color: white;
}

.omzaValueCellRed {
    border-left-style:none;
}

.omzaValueCellYellow {
    border-left-style:none;
}

.omzaValueCellSmile[isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellGreen[isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellRed[isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellYellow[isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellSmile[isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellGreen[isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellRed[isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellYellow[isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    border-color: #a0a0a0;
    border-width: 1px;
}

.omzaValueCellSmile[isactive="True"][isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--groenplus);
    -webkit-transition: background-color 1s;
    -moz-transition: background-color 1s;
    -o-transition: background-color 1s;
    transition: background-color 1s;    
}

.omzaValueCellGreen[isactive="True"][isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--groen);
    -webkit-transition: background-color 1s;
    -moz-transition: background-color 1s;
    -o-transition: background-color 1s;
    transition: background-color 1s;
}

.omzaValueCellRed[isactive="True"][isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--rood);
    -webkit-transition: background-color 1s;
    -moz-transition: background-color 1s;
    -o-transition: background-color 1s;
    transition: background-color 1s;
}

.omzaValueCellYellow[isactive="True"][isHistorical="False"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--geel);
    -webkit-transition: background-color 1s;
    -moz-transition: background-color 1s;
    -o-transition: background-color 1s;
    transition: background-color 1s;
}

.omzaValueCellSmile[isactive="True"][isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    background-color: #C0C0C0;
}

.omzaValueCellGreen[isactive="True"][isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    background-color: #C0C0C0;
}

.omzaValueCellRed[isactive="True"][isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    background-color: #C0C0C0;
}

.omzaValueCellYellow[isactive="True"][isHistorical="True"] {
    -webkit-print-color-adjust: exact;
    background-color: #C0C0C0;
}

.omzaValueCellSmile[isactive="False"] {
    color: var(--groenplus);
}

.omzaValueCellGreen[isactive="False"] {
    color: var(--groen);
}

.omzaValueCellRed[isactive="False"] {
    color: var(--rood);
}

.omzaValueCellYellow[isactive="False"] {
    color: var(--geel);
}

.omzaValueCellSmile[mouseHover="True"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--groenplus);
    -webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
    color:#ffffff;
}

.omzaValueCellGreen[mouseHover="True"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--groen);
    -webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
    color:#ffffff;
}

.omzaValueCellRed[mouseHover="True"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--rood);
    -webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
    color:#ffffff;
}

.omzaValueCellYellow[mouseHover="True"] {
    -webkit-print-color-adjust: exact;
    background-color: var(--geel);
    -webkit-transition: background-color 0.2s;
    -moz-transition: background-color 0.2s;
    -o-transition: background-color 0.2s;
    transition: background-color 0.2s;
    color:#ffffff;
}

.omzaValueCellClear {
    -webkit-print-color-adjust: exact;
    border:none;
    position:relative;
    top:7px;
}

.omzaValueCellClear2 {
    -webkit-print-color-adjust: exact;
    border-color: transparent;
    border-width: 1px;
}

.omzaValueCell:hover {
    cursor: pointer;
}

.omzaValueCellRight:hover {
    cursor: pointer;
}

.omzaValueCellLeft:hover {
    cursor: default;
}

.omza1 {
    border-color: #CCCCCC;
    border-width: 1px;
    border-style: Ridge;
    font-size: 12px;
    font-family: Tahoma;
}

.omza2 {
    border-color: #CCCCCC;
    border-width: 1px;
    border-style: Ridge;
    font-size: 10px;
    font-family: Tahoma;
}

.omzaDialog {
    height: 400px;
    width: 600px;
}

.OmzaTextButtonRTTI {
    font-size: 12px;
    font-family: Tahoma;
    width: 150px;
    color: #4a4a4a;
    background-color:#afdaf6;
    border-style: solid;
    border-width: 1px;
    height: 17px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.OmzaTextButtonRTTIVAK {
    font-size: 12px;
    font-family: Tahoma;
    width: 150px;
    color: #4a4a4a;
    background-color: #99bec7;
    border-style: solid;
    border-width: 1px;
    height: 17px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.OmzaTextButtonMijn {
    font-size: 12px;
    font-family: Tahoma;
    width: 150px;
    color: #4a4a4a;
    background-color: var(--groen);
    border-style: solid;
    border-width: 1px;
    height: 17px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.noActionsYet {
    height:15px;
    vertical-align:middle;
    text-align:center;
    width:149px;
    background-color:#efe5e5;
    margin-bottom:1px;
}

.omzaVakButton {
    width:50px;
    height:16px;
    background-color:var(--groen);
    border-style: solid;
    border-width: 1px;
    border-color: #32879f;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color:#000000;
    cursor:pointer;
}

.omzaObservatie {
    cursor:pointer;
    background-color:#ccc;
    border-style: solid;
    border-width: 1px;
    border-color: #4a4a4a;
    width:590px;
    border-top:none;
}

.omzaObservatie2 {
    cursor:pointer;
    border-style: solid;
    border-width: 1px;
    border-color: #4a4a4a;
    width:590px;
    border-top:none;
}

.omzaObservatie2:hover {
    background-color:#32879f;
    color:#ffffff;
}

/**********************************************************/
/* OMZA END                                               */
/**********************************************************/

.mentorCijferlijstTable {
    border-style: solid;
    border-color: #4a4a4a;
}

.mentorDetailsTable {
    border-style: solid;
    border-width: 1px;
    border-color: #4a4a4a;
    margin-bottom: 6px;
}

.mentorVergaderTable {
    border-style: solid;
    border-width: 1px;
    border-color: gray;
    padding-bottom: 10px;
    width:1085px;
}

.mentorVergaderTable2 {
    border-style: none;
    border-width: 1px;
    border-color: gray;
    padding-bottom: 10px;
    width: 1109px;
}

.periodTitle {
    width: 99%;
    border-style: solid;
    border-width: 1px;
    border-color: #003158;
    background-color: #003158;
    color: #efefef;
    margin-bottom: 4px;
    padding: 3px;
    font-size: 14px;
}

.signaleringTitle {
    border-style: solid;
    border-width: 1px;
    border-color: #4a4a4a;
    background-color: #4a4a4a;
    color: #efefef;
    margin-bottom: 4px;
    text-align: left;
    font-size: 12px;
}

.zak {
    background-color: var(--geel);
}

.clock {
    font-size: 11px;
    color: #000000;
}

.whiteRightBorder {
    border-right-style:none;
}

.whiteLeftBorder {
    border-left-style:none;
}

.roleSwitch {
    background-color:#afdaf6;
    text-align: center;
    width: 140px;
    max-width: 140px;
    height: 30px;
    border-style: solid;
    border-width: 1px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    font-size:11px;
    margin:3px;
}

.rightSpace {
    margin-right:6px;
}

.managementCell_Other {
    border-top:ridge;
    border-left:ridge;
    border-right:ridge;
    border-top-color:gray;
    border-left-color:gray;
    border-right-color:gray;
    border-top-width:1px;
    border-left-width:1px;
    border-right-width:1px;
}

.managementCell_Same {
    border-top:ridge;
    border-left:ridge;
    border-right:ridge;
    border-top-color:#ffffff;
    border-left-color:gray;
    border-right-color:gray;
    border-top-width:1px;
    border-left-width:1px;
    border-right-width:1px;
}

.transParantButton{
    background-color:#ffffff;
    border:0;
    height:13px;
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
}

.transParantButton2{
    background-color:transparent;
    height:23px;
    font-size: 12px;
    font-family: Tahoma;
    color: #4a4a4a;
    border-style: solid;
    border-width: 1px;
    border-color:#878787;
}

.tegelSmall {
    background-color:#afdaf6;
    text-align: center;
    width: 120px;
    max-width: 120px;
    height: 40px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}

.JaarKeuzeHuidig {
    background-color:#afdaf6;
    text-align: center;
    width: 80px;
    max-width: 80px;
    height: 66px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}
.JaarKeuze {
    background-color: #eeeeee;
    text-align: center;
    width: 80px;
    max-width: 80px;
    height: 66px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}

.vakLesgroepTop {
    background-color: transparent;
    color: #000000;
    background-color: #afdaf6;
    border-style:solid;
    border-width:1px;
    border-color:darkgray;
}

    .vakLesgroepTop:hover {
        background-color: #ffffff;
        color: #000000;
        background-color: #134a85;
        border-style: solid;
        border-width: 1px;
        border-color: darkgray;
    }

.vakLesgroepSelectedTop {
    background-color: #134a85;
    color: #ffffff;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    border-color: #134a85;
}

.vakLesgroep {
    background-color:#afdaf6;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 66px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}

.vakLesgroepSelected {
    background-color: #003158;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 66px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
}

.vakLesgroepStagingBlue {
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    background-color: #134a85;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 72px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #134a85;
    border-right: 1px solid #134a85;
    border-bottom: 1px solid #134a85;
    border-left: 1px solid #134a85;
    border-radius: 5px;
}

.vakLesgroepStagingGreen {
    font-weight: bold;
    text-decoration: none;
    color: lightgrey;
    background-color: #A1A1A1;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 72px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    border-radius: 5px;
}

.vakLesgroepStagingGrey {
    font-weight: bold;
    text-decoration: none;
    color: lightgrey;
    background-color: #A1A1A1;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 72px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    border-radius: 5px;
}

.vakTegel {
    font-weight: bold;
    text-decoration: none;
    color: #EBFCF8;
    background-color: #152A3F;
    text-align: center;
    width: 100px;
    max-width: 100px;
    height: 72px;
    border-style: solid;
    border-width: 1px;
    padding: 2px 6px 2px 6px;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    border-radius: 5px;
}

.smoothCell {
    border-color: #a0a0a0;
    border-width: 1px;
    border-style: Ridge;
}

.smoothCellSmallCap {
    border-color: #a0a0a0;
    border-width: 1px;
    border-style: Ridge;
    font-size: 10px;
    text-align: center;
}

.smoothCellLargeCap {
    border-color: #a0a0a0;
    border-width: 1px;
    border-style: Ridge;
    font-size: 12px;
    text-align: center;
}

.smoothCellSmallCap2 {
    border-color: #a0a0a0;
    border-width: 1px;
    border-style: Ridge;
    font-size: 10px;
}

.nietRttiToets {
    background-color:#e6e6e6;
}

.tdOnlyLeftBorder {
    border-top-style:hidden;
    border-right-style:hidden;
    border-bottom-style:hidden;
}

.tdOnlyRightBorder {
    border-top-style:hidden;
    border-left-style:hidden;
    border-bottom-style:hidden;
}

.grayArced {
    background-color:#e3fafa;
}

.grayArced2 {
    background-color: rgba(238, 238, 238, 0.28);
}

.qaMainDiv {
    width: 998px;
    background-color: #C0C0C0;
    padding-top: 6px;
    padding-bottom: 0px;
    padding-left: 2px;
}

.qaMainText {
    padding-left: 3px;
    font-weight: bold;
    padding-bottom: 1px;
    display: inline-block;
    vertical-align: middle;
    width: 490px;
}

.qaSubDiv {
    background-color: #ffffff;
    margin-left: 2px;
    padding: 3px;
    display: inline-block;
    vertical-align: top;
}

.qaSubTDHead {
    border-color: #C0C0C0;
    border-right-width: 4px;
    border-style: solid;
    margin-left: -1px;
    margin-right: 0px;
}

.qaSubTDDetail {
    border-color: #C0C0C0;
    border-left-width: 2px;
    border-right-width: 6px;
    border-bottom-width: 6px;
    border-style: solid;
    padding: 3px;
}

.qaSignalering {
    width: 490px;
    text-align: right;
    display: inline-block;
}

.qatextarea1 {
    border: 0 none white;
    overflow: hidden;
    padding: 0;
    outline: none;
    background-color: #ffffff;
    resize: none;
    width: 168px;
}

.qatextarea2 {
    border: 0 none white;
    overflow: hidden;
    padding: 0;
    outline: none;
    background-color: #ffffff;
    resize: none;
    width: 380px;
}

.ht:hover .tooltip {
    display: block;
}

.tooltip {
    display: none;
    color: #000000;
    background-color: #CCCCCC;
    height: 22px;
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px;
    margin-left: 18px; /* moves the tooltip to the right */
    margin-top: 5px; /* moves it down */
    position: absolute;
    z-index: 1000;
    border-style: solid;
    border-color: #000000;
    border-width: 1px;
}

.numberCircleHighlight {
    border-radius: 50%;
    display: inline-block;
    padding: 4px;
    width: 12px;
    height: 12px;
    background: yellow;
    border: 2px solid #666;
    color: #666;
    text-align: center;
    font: 10px Arial, sans-serif;
    font-weight: bolder;
}

.numberCircle {
    border-radius: 50%;
    display: inline-block;
    padding: 4px;
    width: 12px;
    height: 12px;
    background: lightgray;
    border: 2px solid darkgray;
    color: #666;
    text-align: center;
    font: 10px Arial, sans-serif;
}

.feedbackCell {
    border-bottom: 1px solid darkgray;
}

.readOnlyTextBox {
    background: rgb(235, 235, 228);
    border-style:solid;
    border-width:1px;
    border-color:#a8a5a5;
}

/**********************************************************/
/* Freezed table */
/**********************************************************/
.gebruikersBewerkenHeader {
    overflow: auto;
    width: 1100px;
    border-style: none;
}

.gebruikersBewerkenData {
    overflow: auto;
    width: 1100px;
    height: 300px;
    border-style: none;
    border-width: 1px;
    border-color: #4a4a4a;
}

.toetsBewerkenHeader {
    overflow: auto;
    overflow-x: hidden
}

.toetsBewerkenData {
    overflow: auto;
    width: 896px;
    height: 400px;
    border-style: none;
    border-width: 1px;
    border-color: #4a4a4a;
    overflow-x: hidden;
}

.toetsResultatenDetails {
    overflow: auto;
    border-width: 1px;
    border-color: #4a4a4a;
    border-style: none;
}

/**********************************************************/
/* Legenda */
/**********************************************************/
.my-legend .legend-title {
    text-align: left;
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 90%;
}

.my-legend .legend-scale ul {
    margin: 0;
    margin-bottom: 5px;
    padding: 0;
    float: left;
    list-style: none;
}

    .my-legend .legend-scale ul li {
        font-size: 80%;
        list-style: none;
        margin-left: 0;
        line-height: 18px;
        margin-bottom: 2px;
    }

.my-legend ul.legend-labels li span {
    display: block;
    float: left;
    height: 16px;
    width: 30px;
    margin-right: 5px;
    margin-left: 0;
    border: 1px solid #999;
}

.my-legend .legend-source {
    font-size: 70%;
    color: #999;
    clear: both;
}

.my-legend a {
    color: #777;
}

/**********************************************************/
/* Staafdiagrammen */
/**********************************************************/
.staafDevider {
    background-color: #000000;
}

.staafRood {
    background-color: var(--rood);
    color: #000000;
}

.staafGeel {
    background-color: var(--geel);
    color: #000000;
}

.staafGroen {
    background-color: var(--groen);
    color: #000000;
}

.staafGroenMax {
    background-color:var(--groenplus);
    color:#000000;
}

/**********************************************************/
/* Rounded DIV in main */
/**********************************************************/
.arhoekenY {
    background: #ffffff;
}

.arhoekenX {
    background: #efefef;
}

.arb1X, .arb2X, .arb3X, .arb4X {
    display: block;
    overflow: hidden;
    background: transparent;
    font-size: 1px;
}

.arb1X, .arb2X, .arb3X {
    height: 1px;
}

.arb2X, .arb3X, .arb4X {
    background: #ffffff;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
}

.arb1X {
    margin: 0 5px;
    background: #ffffff;
}

.arb2X {
    margin: 0 3px;
    border-width: 0 2px;
}

.arb3X {
    margin: 0 2px;
}

.arb4X {
    height: 2px;
    margin: 0 1px;
}

/**********************************************************/
/* Rounded DIV in login */
/**********************************************************/
.larhoekenY {
    background: #134a85;
}

.larhoekenX {
    background: #134a85;
    width: 420px;
    border-style:none;
    border-color:#134a85;
    border-width:0px;
    -moz-box-shadow: 0 1px 2px #272727;-webkit-box-shadow: 0 1px 2px #272727;
}

.larb1X, .larb2X, .larb3X, .larb4X {
    display: block;
    overflow: hidden;
    background: #134a85;
    font-size: 1px;
}

.larb2X, .larb3X, .larb4X {
    background: #134a85;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
}

/**********************************************************/
/* Rounded DIV in header */
/**********************************************************/
.harhoekenY {
    background: #003158;
}

.harhoekenX {
    background: #efefef;
    width: 100%;
}

.harb1X, .harb2X, .harb3X, .harb4X {
    display: block;
    overflow: hidden;
    background: transparent;
    font-size: 1px;
}

.harb1X, .harb2X, .harb3X {
    height: 1px;
}

.harb2X, .harb3X, .harb4X {
    background: #003158;
    border-left: 1px solid #003158;
    border-right: 1px solid #003158;
}

.harb1X {
    margin: 0 5px;
    background: #003158;
}

.harb2X {
    margin: 0 3px;
    border-width: 0 2px;
}

.harb3X {
    margin: 0 2px;
}

.harb4X {
    height: 2px;
    margin: 0 1px;
}

/**********************************************************/
/* Rounded DIV in h1 */
/**********************************************************/
.h1arhoekenY {
    background: #003158;
}

.h1arhoekenX {
    background: #efefef;
}

.h1arb1X, .h1arb2X, .h1arb3X, .h1arb4X {
    display: block;
    overflow: hidden;
    background: transparent;
    font-size: 1px;
}

.h1arb1X, .h1arb2X, .h1arb3X {
    height: 1px;
}

.h1arb2X, .h1arb3X, .h1arb4X {
    background: #003158;
    border-left: 1px solid #003158;
    border-right: 1px solid #003158;
}

.h1arb1X {
    margin: 0 5px;
    background: #003158;
}

.h1arb2X {
    margin: 0 3px;
    border-width: 0 2px;
}

.h1arb3X {
    margin: 0 2px;
}

.h1arb4X {
    height: 2px;
    margin: 0 1px;
}

.concurrentUsersTitle{
    font-size: 14px;
    font-weight: bold;
    margin-right:50px;
    vertical-align: middle;
}

.concurrentUsersValue{
    font-size: 18px;
    font-weight: bold;
    color: #1041e0;
    vertical-align: sub;
}

.concurrentUsersTd {
    border-color:Gray;
    border-width:1px;
    border-style:Ridge;
    font-weight:bold;
    width:50px;
}

.concurrentUsersTdNotBold {
    border-color:Gray;
    border-width:1px;
    border-style:Ridge;
    width:50px;
}

.manualToets {
    width:20px;
    height:18px;
    border-left-width:1px;
    border-right-width:1px;
    border-top-width:1px;
    border-bottom-width:0px;
    border-left-style:solid;
    border-right-style:solid;
    border-top-style:solid;
    border-bottom-style:solid;
    border-color:#a0a0a0;
}

.manualToetsLast {
    width:20px;
    height:18px;
    border-width:1px;
    border-style:solid;
    border-color:#a0a0a0;
}

.cseToets {
    color:#000000;
    background-color:#afdaf6;
}

div.ui-tooltip {
    max-width: 700px;
    font-family:Arial,sans-serif;
	color:#000000;
	background:#FFFF99;
	padding:4px 5px 4px 5px;
	border:1px solid gray;
}

.transBack {
    background-color:#ffffff;
}

.internetLight {
    border-style:ridge;
    border-color:black;
    border-width:thin;
    height:30px;
    width:30px;
    display:block;
}

.internetLight12 {
    background-color:#39e210;
}
.internetLight10 {
    background-color:#73e210;
}
.internetLight8 {
    background-color:#ace210;
}
.internetLight6 {
    background-color:#e0e210;
}
.internetLight4 {
    background-color:#e2aa10;
}
.internetLight3 {
    background-color:#e27d10;
}
.internetLight2 {
    background-color:#e25710;
}
.internetLight1 {
    background-color:#e23d10;
}
.internetLight0 {
    background-color:#e21d10;
}

.speedAdvise {
    padding:6px;
    color:#4a4a4a;
    font-weight:500;
}

.google2FA {
    height:20px;
    width:100px;
    text-align:center;
    font-weight:900;
    background:#d7cb72;
    color:#000000;
    font-size:14px;
    font-family:'Courier New';
}

.periodePanel {
    border-color:grey;
    border-width:1px;
    border-style:ridge;
    padding:4px;
    width:1350px;
}

.periodeTable {
    border-style:none;
    padding:4px;
    font-weight:700;
}

.periodeMonth {
    border-color:lightgray;
    border-width:1px;
    border-style:dashed;
}

.periodeNr {
    width:30px;
    background-color:#afdaf6;
    font-weight:700;
    text-align:center;
}

.periodeGeneric {
    width:10px;
    background-color:#afdaf6;
    border-style:solid;
    border-width:1px;
    border-color:#32879f;
}

.periodeBalk {
    background-color:#afdaf6;
    border-style:solid;
    border-width:1px;
    border-color:#32879f;
}

.periodeHighlight {
    background-color:lightgray;
}

.periodeHeader {
    background-color:lightgray;
    border-color:gray;
    text-align:center;
    font-size:16px;
    font-weight:700;
    width:1323px;
}

.floatingBoxRed {
    float:right;
    background-color:var(--rood);
    color:#ffffff;
    border-radius:3px;
    width:200px;
}

.floatingBoxRedTeksten {
    float:right;
    background-color:var(--rood);
    color:#ffffff;
    border-radius:3px;
    width:200px;
}

.floatingBoxYellow {
    float:right;
    background-color:var(--geel);
    color:#4a4a4a;
    border-radius:3px;
    width:200px;
}

.floatingBoxGreen {
    float:right;
    background-color:#009900;
    color:#ffffff;
    border-radius:3px;
    width:200px;
}

/**********************************************************/
/* CSS Vergaderoverzicht                                  */
/**********************************************************/
.cblWeergave td {
    padding-right:6px;
}

.omzalogboek:hover {
    text-decoration: underline;
    cursor: pointer;
}

.edit-entries {
    /* some styles to position the modal at the center of the page */
    position: fixed;
    top: 50%;
    left: 50%;
    width: 730px;
    max-height: 480px;
    margin-left: -360px;
    margin-top: -240px;
    background-color: #efefef;
    border-radius: 5px;
    padding: 10px;
  
    /* needed styles for the overlay */
    z-index: 10; /* keep on top of other elements on the page */
    box-shadow: 0 0 0 9999px rgba(0,0,0,0.5);
}

    .edit-entries-content {
        overflow-x: hidden;
        overflow-y: auto;
        max-height: 300px;
    }

.modalPopupClose {
    position:absolute !important;
    top: 5px !important;
    right: 8px !important;
    text-decoration: none !important;
    color: red !important;
}

.modalBackground {
    background-color:Gray;
    filter:alpha(opacity=50);
    opacity:0.7;
}

.opacityBackground {
    filter:alpha(opacity=40);
    opacity:0.4;
}

.toelichtingLetters{
    color: #000000;
    border-style: solid;
    border-width: 1px;
    border-color: #afdaf6;
    margin-top:10px;
    margin-bottom:10px;
    display:block;
    width:100%;
}

.legendaKleurBlok {
    width:20px;
    height:20px;
    display:inline-block;
    margin-bottom:4px;
    margin-right:12px;
}

.caretPadding {
    padding-right:4px;
}

.klassenopmerkingen {
    margin-top:8px;
    padding:4px;
    border-style:solid;
    border-color:lightgray;
    border-width:1px;
    width:1090px;
    max-height:165px;
    overflow:auto;
}

.saveIndicator {
    color:green;
}

.klassenopmerkingGrid {
    border-style:solid;
    border-color:Gray;
    border-width:1px;
    width:1000px;
    padding:4px;
}

.ovgCijferO {
    color: #f55252;
    border: none;
}

.ovgCijferV {
    color: #17be48;
    border: none;
}

.ovgCijferG {
    color: #1c9a71;
    border: none;
}

/**********************************************************/
/* Leerlinginvoer                                         */
/**********************************************************/
.llInvoerMainTable {
    width:500px;
    border-width:1px;
    border-style:ridge;
    border-collapse:collapse;
    border-color:#a0a0a0;
}

.llInvoerHeaderText1 {
    font-size: 30px;
    font-family: Tahoma;
    font-weight: bold;
    color: #009900;
    width:200px;
    background-color:#e1dfdf;
    padding-left:10px;
}

.llInvoerHeaderText2 {
    font-size: 30px;
    font-family: Tahoma;
    font-weight: bold;
    color: #009900;
    text-align:center;
    background-color:#e1dfdf;
}

.llInvoerOpgave {
    font-size: 30px;
    font-family: Tahoma;
    font-weight: bold;
    color: #000000;
    text-align:center;
    padding-top:20px;
}

.llInvoerOpgaveScore {
    font-size: 50px;
    font-family: Verdana;
    font-weight: bold;
    color: #000000;
    text-align:center;
    width:400px;
    height:134px;
}

.llInvoerOpgaveNavButton {
    font-size: 50px;
    font-family: Verdana;
    font-weight: bold;
    color: #000000;
    text-align:center;
    width:200px;
    height:140px;
}

.llInvoerToggleScoreDetailsBtn {
    font-size: 30px;
    font-family: Verdana;
    font-weight: bold;
    color: #000000;
    text-align:center;
    width:280px;
    height:46px;
    margin:10px;
}

.llInvoerError {
    font-size: 30px;
    font-family: Tahoma;
    color: var(--rood);
    text-align:center;
    height:40px;
}

.llInvoerVoortgangTekst {
    font-size: 30px;
    font-family: Tahoma;
    color: #000000;
    height:40px;
    width:200px;
    padding-left:10px;
}

.llInvoerVoortgangProgess {
    font-size: 52px;
    font-family: Tahoma;
    color: #000000;
    padding-left:10px;
}

.llInvoerVoortgangProgessItem {
    padding:6px;
    cursor:pointer;
    color:#1c76e5;
}

.llInvoerVoortgangProgessItemGreen {
    padding:6px;
    cursor:pointer;
    color:#009900;
}

.llInvoerVoortgangProgessItemScore {
    margin:2px;
    display:inline-block;
    cursor:pointer;
    font-size:20px;
    border-style:solid;
    border-width:2px;
    width:50px;
    height:50px;
    text-align:center;
    border-color:#1c76e5;
}

.llInvoerVoortgangProgessItemScoreGreen {
    margin:2px;
    display:inline-block;
    cursor:pointer;
    font-size:20px;
    border-style:solid;
    border-width:2px;
    width:50px;
    height:50px;
    text-align:center;
    border-color:#009900;
}

.llInvoerScore {
    font-size: 30px;
    font-family: Tahoma;
    color: #000000;
    padding-left:12px;
}

.llInvoerRTTIKleuring {
    font-size: 30px;
    font-family: Tahoma;
    color: #000000;
    padding:12px;
    float:left;
    border-style:none;
}

.llInvoerBackButton {
    font-size: 50px;
    font-family: Verdana;
    font-weight: bold;
    color: #000000;
    text-align:center;
    width:812px;
    height:140px;
    margin:3px;
    margin-top:60px;
    margin-bottom:60px;
}

.llInvoerScoreInvis {
    font-size:4px;
    color:#ffffff;
}

.txtBoxNoBorder {
    border-style:none;
    outline-width: 0;
}

.toetsSjabCell {
    vertical-align:top;
    width:200px;
    border-right-width:1px;
    border-right-style:ridge;
    border-right-color:#a4a4a4;
}

.toetsSjabCellR {
    vertical-align:top;
    width:200px;
}

.txtBoxNoBorderRO {
    border-style:none;
    padding:4px;
    vertical-align:top;
}

.commentLink {
    background-color:#e1ebf8;
    color:#337ab7;
    font-weight: 500;
    border-style:solid;
    border-width:1px;
    border-color:#939393;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding-left:2px;
    padding-right:2px;
    word-break:break-all;
    margin-top:5px;
    margin-bottom:5px;
    display:inline-block;
    text-decoration:none;
    line-height:20px;
}

.LDProgress {
    border-color: #134a86;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    width: 200px;
    background-color: #ffffff;
    height: 20px;
    display:inline-block;
}

/**********************************************************/
/* SideNav                                                */
/**********************************************************/
.sidenav {
  height: 200px;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 82px;
  right:14px;
  background-color: #efefef;
  overflow: hidden;
  transition: 0.5s;
}

.sidenav a {
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

/**********************************************************/
/* OMZA-selfie                                            */
/**********************************************************/
.omzaSelfieActie[mouseHover="True"] {
    opacity:1;
    font-weight:600;
}
.omzaSelfieActie[mouseHover="False"] {
    opacity: .65;
}
.omzaSelfieActie[isactive="True"] {
    opacity: 1;
    font-weight: 600;
}

/**********************************************************/
/* OMZA-rubics leerling                                   */
/**********************************************************/

.feedupCellGroenPlus {
    background-color: var(--pastelgroenplus);
}

.feedupCellGroen {
    background-color: var(--pastelgroen);
}

.feedupCellGeel {
    background-color: var(--pastelgeel);
}

.feedupCellRood {
    background-color: var(--pastelrood);
}

.feedupCellSelectedGroenPlus {
    border-color: black;
    color: #000000;
    border-radius: 3px;
    background-color: var(--groenplus);
}

.feedupCellSelectedGroen {
    border-color: black;
    color: #000000;
    border-radius: 3px;
    background-color: var(--groen);
}

.feedupCellSelectedGeel {
    border-color: black;
    color: #000000;
    border-radius: 3px;
    background-color: var(--geel);
}

.feedupCellSelectedRood {
    border-color: black;
    color: #000000;
    border-radius: 3px;
    background-color: var(--rood);
}

.progressieRood {
    background-color: var(--rood);
    height: 100%;
}

.progressieGeel {
    background-color: var(--geel);
    height: 100%;
}

.progressieGroen {
    background-color: var(--groenplus);
    height: 100%;
}

/**********************************************************/
/* Generic colors                                         */
/**********************************************************/

.generiekGroenPlus {
    background-color: var(--groenplus);
}

.generiekGroen {
    background-color: var(--groen);
}

.generiekGeel {
    background-color: var(--geel);
}

.generiekRood {
    background-color: var(--rood);
}