@charset "UTF-8";
/* ------------------------------------------------------ */
/*                  Toevoegbare klassen                   */
/* ------------------------------------------------------ */
.clear {
  clear: both; }

.cont-clear {
  overflow: auto; }

.floatleft {
  float: left; }

.float-left {
  float: left; }

.floatright {
  float: left; }

.float-right {
  float: right; }

.nobreak {
  white-space: nowrap; }

.align-left {
  text-align: left; }

.align-center {
  text-align: center; }

.align-right {
  text-align: right; }

.centertext,
.center {
  text-align: center; }

.no-width-padding {
  padding-left: 0 !important;
  padding-right: 0 !important; }

.input-onjuist {
  background: #ff8888 !important; }

.overflow-hidden {
  overflow: hidden; }

.redborder {
  border-color: red !important; }

.vali_red {
  color: red;
  display: none; }


.default-button:disabled {
  color: #aaaaaa;
  border: 1px solid #bdbdbd;
  padding: 2px 7px;
}

.offscreen-hidden {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.no-select {
  -webkit-user-select: none;
  user-select: none;
}
.text-select {
  -webkit-user-select: text;
  user-select: text;
}

/* ------------------------------------------------------ */
/*                   Table fluid layout                   */
/* ------------------------------------------------------ */
.dtable {
  display: table;
  height: 100%;
  width: 100%; }

.dtable-row {
  display: table-row; }

.dtable-row.fill {
  height: 100%; }

.dtable-cell {
  display: table-cell;
  vertical-align: top;
  height: 100%; }

.dtable-cell.fill {
  width: 100%; }

.relative-fill {
  position: relative;
  width: 100%;
  height: 100%; }

.absolute-fill {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: auto; }


/* ----- dtable binnen bootstrap tabs system ----- */
.tab-content>.active.dtable {
    display: table;
}



/* ------------------------ */
/* table2 | generieke tabel */
/* ------------------------ */
.table-scroll {
  overflow: auto; }

.table2 {
  width: 100%;
  border-spacing: 0;
  border-collapse: separate; }

.table2 .fillwidth {
  width: 100%; }

.table2 td {
  margin: 0;
  padding: 0; }

/* ------------------------ */
/* table-wrapper | generieke tabel */
/* ------------------------ */
#table-wrapper {
  position:relative;
  width: 50%;
  margin: 0 auto;
 }


#table-scroll {
  height:200px;
  overflow:auto;  
  margin-top:20px;
  width:400px;
}
#table-wrapper table {
  width:100%;
}

/* fill rest */
.static-left {
  float: left; }

.static-right {
  float: right; }

.fill-rest {
  overflow: hidden; }

/* font imports */
@font-face {
  font-family: odinRoundedBold;
  src: url(../font/odin_rounded_bold.otf);
  font-weight: 700; }
body {
  font-size: 14px !important;
  overflow: initial !important;
  font-size: 1.4em !important; }

hr {
  margin: 5px 0;
  border-top: 2px solid #4f8ccb; }

textarea::-webkit-input-placeholder {
  color: #4f8ccb; }

textarea:-moz-placeholder {
  /* Firefox 18- */
  color: #4f8ccb; }

textarea::-moz-placeholder {
  /* Firefox 19+ */
  color: #4f8ccb; }

textarea:-ms-input-placeholder {
  color: #4f8ccb; }

#wrap {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 0 !important;
  padding: 0 !important; }

#wrapper {
  position: absolute;
  margin: 0;
  height: 100%;
  width: 100%;
  top: 0; }

#wrapper > #currentpage {
  margin-left: 90px; }

#currentpage {
  position: absolute;
  top: 65px;
  font-size: 0.8em; }

/* sql */
.SQLAgentNotRunning {
  background-color: red !important; }

/* dev,routewijs.nl */
.DevRoutewijs {
  background-color: #FFAB00 !important; }

/* grey block pattern */
.stripes tr {
  background: #F0EFF0; }

.stripes tr:nth-child(odd) td:nth-child(odd) {
  background: #E8E8E9; }

.stripes tr:nth-child(odd) td:nth-child(even) {
  background: #F0EFF0; }

.stripes tr:nth-child(even) td:nth-child(odd) {
  background: #F0EFF0; }

.stripes tr:nth-child(even) td:nth-child(even) {
  background: #E8E8E9; }

.stripes2 tr:nth-child(odd) td {
  background: #F0F0F0; }

.stripes2 tr:nth-child(even) td {
  background: #FAFAFA; }

/* blue line */
.blueline tr {
  background: #E5F3F9; }

.blueline tr:nth-child(odd) {
  background: #E5F3F9; }

.blueline tr:nth-child(even) {
  background: #F2F9FC; }

.blueline tr.selected {
  background: #CCEAF8; }

.blueline tr:hover {
  background: #cceaf8; }

/* blue button, red button */
.bluebutton,
.redbutton {
  margin: 0;
  border-radius: 3px;
  border: 0;
  color: white; }

.bluebutton:hover,
.redbutton:hover {
  color: white; }

.bluebutton:focus,
.redbutton:focus {
  color: white;
  outline: 0px; }

.bluebutton {
  background: #63b0ff;
  background: -moz-linear-gradient(top, #63b0ff 0%, #4f8ccb 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #63b0ff), color-stop(100%, #4f8ccb));
  background: -webkit-linear-gradient(top, #63b0ff 0%, #4f8ccb 100%);
  background: -o-linear-gradient(top, #63b0ff 0%, #4f8ccb 100%);
  background: -ms-linear-gradient(top, #63b0ff 0%, #4f8ccb 100%);
  background: linear-gradient(to bottom, #63b0ff 0%, #4f8ccb 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
.bluebutton:active {
  background: #4f8ccb;
  background: -moz-linear-gradient(top, #4f8ccb 0%, #63b0ff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4f8ccb), color-stop(100%, #63b0ff));
  background: -webkit-linear-gradient(top, #4f8ccb 0%, #63b0ff 100%);
  background: -o-linear-gradient(top, #4f8ccb 0%, #63b0ff 100%);
  background: -ms-linear-gradient(top, #4f8ccb 0%, #63b0ff 100%);
  background: linear-gradient(to bottom, #4f8ccb 0%, #63b0ff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }

.redbutton {
  background: #ff6363;
  background: -moz-linear-gradient(top, #ff6363 0%, #cb4f4f 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff6363), color-stop(100%, #cb4f4f));
  background: -webkit-linear-gradient(top, #ff6363 0%, #cb4f4f 100%);
  background: -o-linear-gradient(top, #ff6363 0%, #cb4f4f 100%);
  background: -ms-linear-gradient(top, #ff6363 0%, #cb4f4f 100%);
  background: linear-gradient(to bottom, #ff6363 0%, #cb4f4f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
.redbutton:active {
  background: #cb4f4f;
  background: -moz-linear-gradient(top, #cb4f4f 0%, #ff6363 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cb4f4f), color-stop(100%, #ff6363));
  background: -webkit-linear-gradient(top, #cb4f4f 0%, #ff6363 100%);
  background: -o-linear-gradient(top, #cb4f4f 0%, #ff6363 100%);
  background: -ms-linear-gradient(top, #cb4f4f 0%, #ff6363 100%);
  background: linear-gradient(to bottom, #cb4f4f 0%, #ff6363 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }

.groen1 {
  background: #B2E5A5; }

/* jquery datepicker */
.ui-datepicker-title select {
  color: black; }

/* oplossing voor specifiek geval, zal waarschijnlijk niet andere dingen breken */
.table label {margin-bottom: 0;}

/* standaard table header */
.table th {
  color: #4F8CCB;
  border: 0;
  font-weight: 400;
  font-size: 0.8em; }

/* specific tables */
/* table with green header */
.table2.groen1 th,
.table2.groen1 td {
  white-space: nowrap;
  padding: 4px 6px 0 6px; }

.table2.groen1 td {
  background: #E4F0F4;
  border-top: 1px white solid;
  border-right: 2px white solid;
  height: 25px;
  font-size: 0.8em;
  font-weight: 400;
  cursor: default; }

.table2.groen1 th {
  background-color: #B2E5A5;
  color: #787878;
  font-weight: 700;
  font-size: 0.8em;
  border-right: 2px #B2E5A5 solid; }

.table2.groen1 .selected td {
  background: white; }

.succes-tekst {
  color: green; }

.error-tekst {
  color: red; }

.cursor-default {
  cursor: default; }

#topbar {
  position: relative;
  z-index: 100; }

.navbar-fixed-top {
  display: none; }

#topbartext1 {
  position: absolute;
  left: 98px;
  top: 7px;
  font-weight: 700;
  font-size: 1.2em; }

#topbartext2 {
  display: none;
  position: absolute;
  left: 292px;
  top: 7px;
  font-weight: 700;
  font-style: italic;
  font-size: 1.2em;
  color: #75b8db; }

#topbartext3 {
  display: block;
  position: absolute;
  left: 190px;
  top: 7px;
  font-weight: 700;
  font-style: italic;
  font-size: 1.2em;
  color: #0E8ECE; }

#topbartext2 > span {
  color: #69a840; }

#user-profile {
  position: absolute;
  right: 32px;
  top: 8px;
  color: #75b8db; }

#user-profile > img {
  position: relative;
  left: 15px; }

.navbar {
  min-height: 30px;
  top: 30px; }

.navbar-nav {
  position: relative;
  margin-left: 60px;
  height: 30px;
  line-height: 30px;
  /* LEFT ALIGN */ }

.navbar-default {
  background-color: #c3e0f1;
  border: 0;
  border-radius: 0; }

.navbar-default .navbar-nav > li > a {
  display: block;
  padding: 0;
  width: 100px;
  height: 30px;
  /* text */
  font-size: 0.8em;
  color: white;
  line-height: 42px;
  text-align: center;
  background-color: #9ccce6; }

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  background-color: #bdd393; }

.navbar-default .navbar-nav > .blue1 > a {
  background-color: #75b8db; }

.navbar-default .navbar-nav > .blue2 > a {
  background-color: #89c2e1; }

.navbar-default .navbar-nav > .blue3 > a {
  background-color: #9ccce6; }

.navbar-default .navbar-nav > .active > a {
  background-color: #69a840;
  color: white; }

.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  background-color: #bdd393; }

#topbar-white-line {
  position: absolute;
  left: 50px;
  right: 50px;
  top: 9px;
  height: 2px;
  background: white; }

.topbar-ball {
  position: absolute;
  left: 46px;
  top: 4px;
  z-index: 2;
  height: 12px;
  width: 12px;
  border: 2px white solid;
  border-radius: 50%;
  background-color: #d7d8d8; }

.navbar-default .navbar-nav > .active > a > .topbar-ball {
  background-color: #69a840; }

.navbar-default .navbar-nav > li > a > .grey {
  background-color: #d7d8d8; }

.navbar-default .navbar-nav > li > a > .blue {
  background-color: #4f8ccb; }

.fill-topbar-a {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 100px;
  height: 30px; }

.navbar-brand {
  position: absolute;
  top: -40px; }

#bodywrap > .footer,
.loginfooterwrap > .footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  font-size: 1.2em;
  /* color:#75b8db; */
  font-weight: 700;
  font-style: italic;
  color: #0E8ECE;
  padding: 5px;
  /* background:#c3e0f1; */
  background: #ECECEC;
  margin-top: 20px; }

#bodywrap > .footer > span,
.loginfooterwrap > .footer > span {
  margin-left: 20px; }

/* -- LOGIN -- */
#login-main {
  position: relative;
  border: 2px solid #4f8ccb;
  border-radius: 5px;
  width: 90%;
  max-width: 400px;
  padding: 10px;
  margin: 70px auto 50px auto; }

#login-main > span {
  display: block;
  font-weight: 700;
  margin-bottom: 15px; }

.login-input {
  border: 2px solid #4f8ccb;
  width: 100%;
  margin-bottom: 10px;
  height: 2.5em;
  padding: 0.5em;
  color: #4f8ccb;
  -webkit-transition: border-color 200ms;
  -moz-transition: border-color 200ms;
  -o-transition: border-color 200ms;
  transition: border-color 200ms; }

.login-button {
  width: 100%;
  text-align: left;
  font-weight: 700;
  border-radius: 5px;
  border: 0;
  height: 2.5em; }

.login-notice {
  position: relative;
  display: block;
  text-align: center;
  color: red;
  margin-top: 0px;
  top: 5px; }

#leraar-main {
  position: relative;
  border: 2px solid #4f8ccb;
  border-radius: 5px;
  width: 90%;
  max-width: 600px;
  padding: 10px;
  font-size: 1.2em;
  margin: 70px auto 10px auto; }
#leraar-main .button-wrap {
  margin: 20px 0;
  text-align: center; }
#leraar-main .mainbutton {
  position: relative;
  width: 130px;
  height: 130px;
  margin: 7px 7px; }
#leraar-main .mainbutton:focus {
  outline: none; }
#leraar-main .mainbutton:active {
  outline: none; }

/* Leraar main knoppen groot */
#leraar-main .klassen {
  background: url(../../img/130px/avision_klassen_130px_passief.png); }

#leraar-main .klassen:hover {
  background: url(../../img/130px/avision_klassen_130px_mouseover.png); }

#leraar-main .leerlingen {
  background: url(../../img/130px/avision_leerlingen_130px_passief.png); }

#leraar-main .leerlingen:hover {
  background: url(../../img/130px/avision_leerlingen_130px_mouseover.png); }

#leraar-main .groepen {
  background: url(../../img/130px/avision_groepen_130px_passief.png); }

#leraar-main .groepen:hover {
  background: url(../../img/130px/avision_groepen_130px_mouseover.png); }

#leraar-main .toetsen {
  background: url(../../img/130px/avision_toetsen_130px_passief.png); }

#leraar-main .toetsen:hover {
  background: url(../../img/130px/avision_toetsen_130px_mouseover.png); }

#leraar-main .realtime {
  background: url(../../img/130px/avision_realtime_130px_passief.png); }

#leraar-main .realtime:hover {
  background: url(../../img/130px/avision_realtime_130px_mouseover.png); }
#leraar-main .planning {
  background: url(../../img/130px/avision_planning_130px_passief.png);
  display: none; }

#leraar-main .planning:hover {
  background: url(../../img/130px/avision_planning_130px_mouseover.png); }

#leraar-main .rooster {
  background: url(../../img/130px/avision_rooster_130px_passief.png);
  display: none; }

#leraar-main .rooster:hover {
  background: url(../../img/130px/avision_rooster_130px_mouseover.png); }

#leraar-main .rapportage {
  background: url(../../img/130px/avision_rapportage_130px_passief.png); }

#leraar-main .rapportage:hover {
  background: url(../../img/130px/avision_rapportage_130px_mouseover.png); }

#leraar-main .bestanden {
  background: url(../../img/130px/bestanden.png); }

#leraar-main .bestanden :hover {
  background: url(../../img/130px/bestanden.png); }

#maincontent-leraar {
  position: absolute;
  top: 85px;
  padding: 5px;
  padding-top: 15px;
  /* max-width:1000px; */
  margin-right: 28px;
  border: 2px #4f8ccb solid;
  border-radius: 7px;
  overflow: hidden;
  margin-bottom: 50px;
  min-height: 574px;
  /* Firefox 18- */
  /* Firefox 19+ */
  /* Button next to input */
  /* Formula: max width = 75 * num - 10 + "px" */
  /* leerling profiel tab */
  /*
  #leerling-profiel-toetsen{
    position:fixed;
    left:-100px;
    margin-top:-100px;
    display:block;
    visibility:hidden;
  }

  .tab-content>.active#leerling-profiel-toetsen{
    position:relative;
    left:auto;
    top:auto;
    visibility:visible;
  }*/
  /* leerling toetsen tab */
  /* -- Main content table */ }
#maincontent-leraar > .pagename {
  font-size: 1.3em;
  margin-left: 15px;
  top: 20px; }
#maincontent-leraar > .info {
  float: right;
  margin-top: 5px;
  margin-right: 10px; }
#maincontent-leraar > #page-links {
  /* Button container */
  margin-left: 10px;
  margin-right: 205px; }
#maincontent-leraar > #page-links > .pagebutton {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  width: 65px;
  height: 65px;
  outline: 0; }
#maincontent-leraar > #page-links > .pagebutton:focus {
  outline: 2px #FFEE02 solid; }
#maincontent-leraar > #page-links > .pagebutton.rooster {
  display: none; }
#maincontent-leraar > #page-links > .pagebutton.planning {
  display: none; }
#maincontent-leraar .zoeken {
  margin-top: 0;
  top: 29px;
  min-width: 150px;
  margin-right: 10px; }
#maincontent-leraar .form-control {
  border: 2px #4f8ccb solid;
  border-right: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #4f8ccb; }
#maincontent-leraar .phcolor::-webkit-input-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor:-moz-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor::-moz-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor:-ms-input-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .form-control:hover,
#maincontent-leraar .form-control:active,
#maincontent-leraar .form-control:focus {
  outline: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: #4f8ccb; }
#maincontent-leraar .input-group-btn > button {
  border: 2px #4f8ccb solid;
  border-left: 0;
  height: 34px;
  top: 0px;
  color: #4f8ccb; }
#maincontent-leraar .input-group-btn > button:hover,
#maincontent-leraar .input-group-btn > button:active,
#maincontent-leraar .input-group-btn > button:focus {
  background: white;
  color: #4f8ccb;
  border-color: #4f8ccb;
  -webkit-box-shadow: none;
  box-shadow: none; }
#maincontent-leraar .progress {
  /*
    Bar
  */
  /*
    Triangle
  */
  /* Lijn. nog niet perfect omdat niet in center van ding. */ }
#maincontent-leraar .progress > .bar {
  position: relative;
  float: left;
  left: 0px;
  top: 0px;
  height: 100%;
  background: #edf4ec; }
#maincontent-leraar .progress.normal > .bar {
  background: #ddf7a5;
  /* nieuwe versie */
  background: -moz-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ddf7a5), color-stop(100%, #d3d959));
  background: -webkit-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -o-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -ms-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: linear-gradient(to bottom, #ddf7a5 0%, #d3d959 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress.warning > .bar {
  background: #ffe6bf;
  background: -moz-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe6bf), color-stop(100%, #ffba19));
  background: -webkit-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -o-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -ms-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: linear-gradient(to bottom, #ffe6bf 0%, #ffba19 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress.alert > .bar {
  background: #ffd6be;
  background: -moz-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffd6be), color-stop(100%, #ed4a17));
  background: -webkit-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -o-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -ms-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: linear-gradient(to bottom, #ffd6be 0%, #ed4a17 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress > .triangle {
  position: absolute;
  float: left;
  width: 0;
  height: 0;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  border-left: 18px solid #d3d959; }
#maincontent-leraar .progress.normal > .triangle {
  border-left: 18px solid #d3d959; }
#maincontent-leraar .progress.warning > .triangle {
  border-left: 18px solid #ffba19; }
#maincontent-leraar .progress.alert > .triangle {
  border-left: 18px solid #ed4a17; }
#maincontent-leraar .progress > .line {
  position: absolute;
  height: 2px;
  top: 10px;
  left: 30px;
  right: 30px;
  background: white; }
#maincontent-leraar .progress > .ball1,
#maincontent-leraar .progress > .ball2 {
  position: absolute;
  width: 12px;
  height: 12px;
  top: 5px;
  border: 2px white solid;
  border-radius: 50%; }
#maincontent-leraar .progress > .ball1 {
  left: 30px;
  background: #FFC342; }
#maincontent-leraar .progress > .ball2 {
  right: 30px;
  background: #66FF5F; }
#maincontent-leraar .progress-square {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 4px; }
#maincontent-leraar .progress-square + .progress-square {
  /* ruimte tussen cellen */
  margin-left: 10px; }
#maincontent-leraar .progress-square.nietgemaakt {
  background: white;
  border: 2px #cccccc solid; }
#maincontent-leraar .progress-square.groepenactief {
  background: orange;
  border: 2px #cccccc solid; }
#maincontent-leraar .progress-square.bezig {
  background: red;
  border: 2px #CE9400 solid; }
#maincontent-leraar .progress-square.gemaakt {
  background: #66FF5F;
  border: 2px #00C427 solid; }
#maincontent-leraar .progress-square.afwachtend {
  background: #5F9EFF;
  border: 2px #005FC4 solid; }
#maincontent-leraar .isloading-overlay {
  position: relative;
  text-align: center; }
#maincontent-leraar .isloading-overlay .isloading-wrapper {
  background: #FFFFFF;
  -webkit-border-radius: 7px;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 7px;
  -moz-background-clip: padding;
  border-radius: 7px;
  background-clip: padding-box;
  display: inline-block;
  margin: 0 auto;
  padding: 10px 20px;
  top: 35%;
  z-index: 9000; }
#maincontent-leraar .realtime_group_active {
  color: magenta;
  background-color: #D88921; }
#maincontent-leraar .tablewrap {
  /* float:left; */
  border: 2px #4f8ccb solid;
  margin-left: 10px;
  margin-right: 10px;
  border-radius: 5px;
  margin-bottom: 10px; }
#maincontent-leraar .block-6width {
  max-width: 440px; }
#maincontent-leraar .block-7width {
  max-width: 515px; }
#maincontent-leraar .block-9width {
  max-width: 665px; }
#maincontent-leraar .percent {
  max-width: 100%; }
#maincontent-leraar .floatdesktop {
  float: left; }
#maincontent-leraar .arrow-sort {
  display: inline-block;
  position: relative;
  top: 0px;
  left: 3px;
  float: none; }
#maincontent-leraar .arrow-up {
  float: left;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 6px solid #4f8ccb; }
#maincontent-leraar .arrow-up:hover {
  border-bottom: 6px solid #75b8db; }
#maincontent-leraar .arrow-down {
  float: left;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #4f8ccb; }
#maincontent-leraar .arrow-down:hover {
  border-top: 6px solid #75b8db; }
#maincontent-leraar #leerling-profiel {
  overflow: hidden;
  min-width: 300px;
  margin-right: 10px; }
#maincontent-leraar .nav-tabs > li.active > a, #maincontent-leraar .nav-tabs > li.active > a:hover, #maincontent-leraar .nav-tabs > li.active > a:focus {
  border: 2px #4f8ccb solid;
  border-bottom: 0; }
#maincontent-leraar .nav-tabs li > a {
  display: block;
  padding: 0;
  top: 1px;
  width: 130px;
  padding-left: 10px;
  height: 30px;
  line-height: 30px;
  border: 2px #4f8ccb solid;
  border-radius: 7px 7px 0 0; }
#maincontent-leraar .nav-tabs li + li > a {
  margin-left: -4px; }
#maincontent-leraar .nav-tabs li a:hover {
  border: 2px #4f8ccb solid; }
#maincontent-leraar .nav-tabs {
  border-bottom: 0; }
#maincontent-leraar .leerling-tabel tbody tr:hover {
  cursor: pointer; }
#maincontent-leraar .table-responsive table #groepdata td:hover,
#maincontent-leraar .leerling-tabel .table-responsive tbody tr:hover td {
  background-color: #97b615;
  border-color: transparent;
  background: #97b615;
  background: -moz-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #97b615), color-stop(100%, #018254));
  background: -webkit-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -o-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -ms-linear-gradient(top, #97b615 0%, #018254 100%);
  background: linear-gradient(to bottom, #97b615 0%, #018254 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#97b615', endColorstr='#018254',GradientType=0 );
  /* color:white; */ }
#maincontent-leraar #leerling-profiel {
  position: relative;
  top: -1px; }
#maincontent-leraar #leerling-profiel .active > a {
  background: #f7f7f7; }
#maincontent-leraar #leerling-profiel .active > a:hover {
  background: #f7f7f7; }
#maincontent-leraar #leerling-profiel li > a {
  background: #ebecec;
  color: black; }
#maincontent-leraar #leerling-profiel li > a:hover {
  background: #cccccc; }
#maincontent-leraar #leerling-profiel-main {
  border: 2px #4f8ccb solid;
  border-radius: 0px 5px 5px 5px;
  height: 366px;
  background: #f7f7f7;
  background: -moz-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100%, #ebecec));
  background: -webkit-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -o-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -ms-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: linear-gradient(to bottom, #f7f7f7 0%, #ebecec 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#ebecec',GradientType=0 ); }
#maincontent-leraar #leerling-profiel-main > .leerling-info {
  font-size: 11px;
  position: relative;
  float: left;
  top: 10px;
  margin-left: 20px;
  margin-bottom: 15px; }
#maincontent-leraar #leerling-profiel-main > .leerling-info td {
  padding-right: 3px; }
#maincontent-leraar #leerling-profiel-rechts {
  overflow: hidden;
  width: 90px;
  float: right;
  text-align: center; }
#maincontent-leraar #leerling-profiel-rechts > img {
  float: right;
  padding: 10px; }
#maincontent-leraar #leerling-profiel-rechts > span {
  font-weight: 700; }
#maincontent-leraar #leerling-profiel-main .opmerkingen {
  margin-left: 10px;
  margin-top: 10px;
  margin-bottom: 5px;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 20px; }
#maincontent-leraar #leerling-profiel-main .opmerkingen textarea {
  resize: none;
  width: 100%;
  height: 143px;
  color: #4f8ccb;
  border: 2px #4f8ccb solid; }
#maincontent-leraar #leerling-profiel-toetsen {
  border: 2px #4f8ccb solid;
  border-radius: 0px 5px 5px 5px;
  height: 366px;
  background: #f7f7f7;
  background: -moz-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100%, #ebecec));
  background: -webkit-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -o-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -ms-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: linear-gradient(to bottom, #f7f7f7 0%, #ebecec 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#ebecec',GradientType=0 ); }
#maincontent-leraar #leerling-profiel-main .bluebutton {
  margin-left: 10px;
  margin-bottom: 10px; }
#maincontent-leraar #leerling-name {
  position: relative;
  display: block;
  font-size: 1.1em;
  font-weight: 700;
  margin-left: 12px;
  margin-top: 8px; }
#maincontent-leraar #leerling-profiel-main .table-responsive {
  max-height: 323px; }
#maincontent-leraar #leerling-profiel-toetsen .table-responsive {
  max-height: 323px; }
#maincontent-leraar #leerling-profiel-main #uitslagen {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #uitslagen th {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #uitslagen .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: #f7f7f7; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang .table-responsive {
  overflow-y: auto; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang td,
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang th {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: #f7f7f7; }
#maincontent-leraar .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: white; }
#maincontent-leraar #navigate-arrow-container {
  margin: 5px 10px 1px 10px; }
#maincontent-leraar #navigate-arrow-container > button {
  width: 38px;
  height: 42px; }
#maincontent-leraar #navigate-arrow-container > #arrow-left {
  float: left;
  background: url(../../img/picto_vorige.png); }
#maincontent-leraar #navigate-arrow-container > #arrow-right {
  float: right;
  background: url(../../img/picto_volgende.png); }
#maincontent-leraar #question {
  display: none;
  position: fixed;
  right: 0;
  background-image: url(../../img/routewiki.png);
  top: 100px;
  width: 45px;
  height: 130px;
  background-color: transparent;
  border: 0; }
#maincontent-leraar .table-responsive {
  font-size: 0.9em;
  padding: 0;
  max-height: 390px;
  overflow-y: hidden !important; }
#maincontent-leraar .table-responsive table {
  margin-bottom: 0;
  overflow: hidden; }
#maincontent-leraar .table-responsive table thead, #maincontent-leraar .table-responsive table tr, #maincontent-leraar .table-responsive table th, #maincontent-leraar .table-responsive table td, #maincontent-leraar .table-responsive table tbody {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  -ms-box-sizing: content-box;
  -o-box-sizing: content-box;
  box-sizing: content-box; }
#maincontent-leraar .table-responsive table thead {
  display: block;
  padding-right: 17px; }
#maincontent-leraar .table-responsive table th {
  border-left: 2px white solid;
  border-right: 2px white solid;
  height: 20px; }
#maincontent-leraar .table-responsive table td {
  display: table-cell;
  border: 2px white solid;
  height: 20px; }
#maincontent-leraar .table-responsive table tbody {
  display: block;
  height: 370px;
  overflow-y: auto;
  padding-right: 17px; }
#maincontent-leraar .table-responsive .table > thead > tr > th,
#maincontent-leraar .table-responsive .table > tbody > tr > th,
#maincontent-leraar .table-responsive .table > tfoot > tr > th,
#maincontent-leraar .table-responsive .table > thead > tr > td,
#maincontent-leraar .table-responsive .table > tbody > tr > td,
#maincontent-leraar .table-responsive .table > tfoot > tr > td {
  white-space: nowrap; }
#maincontent-leraar .table-responsive > table > thead th,
#maincontent-leraar .table-responsive > table > tbody td {
  padding: 0 6px;
  vertical-align: middle;
  overflow: hidden;
  /* font-size: 0.7em; */ }
#maincontent-leraar .table-responsive .progress {
  position: relative;
  padding: 0; }
#maincontent-leraar .floatdesktop {
  background-color: #FFF; }
#maincontent-leraar .floatThead-table thead tr th {
  font-size: 0.8em;
  border-bottom: 2px #4f8ccb solid;
  padding: 5px; }
#maincontent-leraar .min80px {
  min-width: 80px; }
#maincontent-leraar .min90px {
  min-width: 90px; }
#maincontent-leraar .min100px {
  min-width: 100px; }
#maincontent-leraar .min110px {
  min-width: 110px; }
#maincontent-leraar .min120px {
  min-width: 120px; }
#maincontent-leraar .min130px {
  min-width: 130px; }
#maincontent-leraar .min140px {
  min-width: 140px; }
#maincontent-leraar .min150px {
  min-width: 150px; }
#maincontent-leraar .min160px {
  min-width: 160px; }
#maincontent-leraar .min240px {
  min-width: 220px; }
#maincontent-leraar .min350px {
  min-width: 350px; }
#maincontent-leraar .min410px {
  min-width: 410px; }
#maincontent-leraar .width40px {
  width: 40px; }
#maincontent-leraar .width400px {
  min-width: 400px; }
#maincontent-leraar .width200px {
  width: 391px; }
#maincontent-leraar .width190px {
  width: 190px; }
#maincontent-leraar .width165px {
  width: 165px; }
#maincontent-leraar .width150px {
  width: 150px; }
#maincontent-leraar .width127px {
  width: 127px; }
#maincontent-leraar .width129px {
  width: 129px; }
#maincontent-leraar .width120px {
  width: 120px; }
#maincontent-leraar .width110px {
  width: 110px; }
#maincontent-leraar .width100px {
  width: 100px; }
#maincontent-leraar .width80px {
  width: 80px; }
#maincontent-leraar .width64px {
  width: 64px; }
#maincontent-leraar .width20px {
  width: 20px; }

/* ------ Maincontent leraar buttons --------------------- */
#maincontent-leraar .home {
  background: url(../../img/avision_home_passief.png); }

#maincontent-leraar .home:hover {
  background: url(../../img/avision_home_mouseover.png); }

#maincontent-leraar .home:active {
  background: url(../../img/avision_home_actief.png); }

#maincontent-leraar .home-active {
  background: url(../../img/avision_home_actief.png); }

#maincontent-leraar .klassen {
  background: url(../../img/avision_klassen_passief.png); }

#maincontent-leraar .klassen:hover {
  background: url(../../img/avision_klassen_mouseover.png); }

#maincontent-leraar .klassen:active {
  background: url(../../img/avision_klassen_actief.png); }

#maincontent-leraar .klassen-active {
  background: url(../../img/avision_klassen_actief.png); }

#maincontent-leraar .leerlingen {
  background: url(../../img/avision_leerlingen_passief.png); }

#maincontent-leraar .leerlingen:hover {
  background: url(../../img/avision_leerlingen_mouseover.png); }

#maincontent-leraar .leerlingen:active {
  background: url(../../img/avision_leerlingen_actief.png); }

#maincontent-leraar .leerlingen-active {
  background: url(../../img/avision_leerlingen_actief.png); }

#maincontent-leraar .groepen {
  background: url(../../img/avision_groepen_passief.png); }

#maincontent-leraar .groepen:hover {
  background: url(../../img/avision_groepen_mouseover.png); }

#maincontent-leraar .groepen:active {
  background: url(../../img/avision_groepen_actief.png); }

#maincontent-leraar .groepen-active {
  background: url(../../img/avision_groepen_actief.png); }

#maincontent-leraar .toetsen {
  background: url(../../img/avision_toetsen_passief.png); }

#maincontent-leraar .toetsen:hover {
  background: url(../../img/avision_toetsen_mouseover.png); }

#maincontent-leraar .toetsen:active {
  background: url(../../img/avision_toetsen_actief.png); }

#maincontent-leraar .toetsen-active {
  background: url(../../img/avision_toetsen_actief.png); }

#maincontent-leraar .realtime {
  background: url(../../img/avision_realtime_passief.png); }

#maincontent-leraar .realtime:hover {
  background: url(../../img/avision_realtime_mouseover.png); }

#maincontent-leraar .realtime:active {
  background: url(../../img/avision_realtime_actief.png); }

#maincontent-leraar .realtime-active {
  background: url(../../img/avision_realtime_actief.png); }

#maincontent-leraar .planning {
  background: url(../../img/avision_planning_passief.png); }

#maincontent-leraar .planning:hover {
  background: url(../../img/avision_planning_mouseover.png); }

#maincontent-leraar .planning:active {
  background: url(../../img/avision_planning_actief.png); }

#maincontent-leraar .planning-active {
  background: url(../../img/avision_planning_actief.png); }

#maincontent-leraar .rooster {
  background: url(../../img/avision_rooster_passief.png); }

#maincontent-leraar .rooster:hover {
  background: url(../../img/avision_rooster_mouseover.png); }

#maincontent-leraar .rooster:active {
  background: url(../../img/avision_rooster_actief.png); }

#maincontent-leraar .rooster-active {
  background: url(../../img/avision_rooster_actief.png); }

#maincontent-leraar .rapportage {
  background: url(../../img/avision_rapportage_passief.png); }

#maincontent-leraar .rapportage:hover {
  background: url(../../img/avision_rapportage_mouseover.png); }

#maincontent-leraar .rapportage:active {
  background: url(../../img/avision_rapportage_actief.png); }

#maincontent-leraar .rapportage-active {
  background: url(../../img/avision_rapportage_actief.png); }

@media (max-width: 767px) {
  #maincontent-leraar .table-responsive {
    width: auto; }
  #maincontent-leraar > #page-links {
    margin-right: 0; }
  #maincontent-leraar .zoeken {
    margin-left: 10px;
    margin-bottom: 40px; }
  #maincontent-leraar .floatdesktop {
    float: none; }
  #maincontent-leraar .table-responsive {
    margin-bottom: 0;
    overflow-y: scroll;
    overflow-x: auto;
    /* -ms-overflow-style: none; */
    border: 0px solid #ddd;
    -webkit-overflow-scrolling: touch; } }
.layout-leerling {
  position: absolute;
  top: 85px;
  left: 90px;
  right: 90px;
  bottom: 30px;
  min-height: 574px;
  padding: 15px;
  padding-top: 10px;
  margin-bottom: 50px;
  border: 1px #8E9391 solid;
  border-radius: 5px;
  background: #F6F6F6;
  overflow: hidden; }

.layout-leerling .titletext {
  font-size: 1.2em;
  font-weight: 700; }

.layout-leerling .leerlingtoetsenlijst {
  margin: 0;
  width: 100%;
  height: 100%;
  font-size: 1.2em;
  color: #4D5855; }
.layout-leerling .leerlingtoetsenlijst.leerling {
  padding-bottom: 12px; }
.layout-leerling .leerlingtoetsenlijst.testbegeleider {
  padding-bottom: 90px; }
.layout-leerling .leerlingtoetsenlijst .wrap1 {
  height: 100%;
  width: 100%;
  overflow: auto; }
.layout-leerling .leerlingtoetsenlijst ul {
  padding: 0;
  margin: 0;
  list-style-type: none; }
.layout-leerling .leerlingtoetsenlijst .hoofditem, .layout-leerling .leerlingtoetsenlijst .item {
  margin-bottom: 10px;
  background: #eeeeee; }
.layout-leerling .leerlingtoetsenlijst .hoofditem .item + .item {
  border-top: 0; }
.layout-leerling .leerlingtoetsenlijst .hoofditem:nth-child(even), .layout-leerling .leerlingtoetsenlijst .item:nth-child(even) {
  background: #dddddd; }
.layout-leerling .leerlingtoetsenlijst .dropdown {
  height: 34px;
  padding: 5px;
  border: 1px rgba(0, 0, 0, 0.3) solid; }
.layout-leerling .leerlingtoetsenlijst .dropdown.open {
  border-color: #8E9391; }
.layout-leerling .leerlingtoetsenlijst .dropdown:hover {
  cursor: pointer; }
.layout-leerling .leerlingtoetsenlijst .dropdownmarker {
  float: right;
  margin-right: 10px; }
.layout-leerling .leerlingtoetsenlijst .opensluitentext {
  margin-right: 5px; }
.layout-leerling .leerlingtoetsenlijst .uldrop {
  display: none;
  border: 1px #8E9391 solid;
  border-top: 0; }
.layout-leerling .leerlingtoetsenlijst .uldrop .item {
  border: 4px #ffffff solid;
  margin-bottom: 0; }
.layout-leerling .leerlingtoetsenlijst .item {
  border: 1px rgba(0, 0, 0, 0.3) solid;
  padding: 5px; }
.layout-leerling .leerlingtoetsenlijst .item.klaar {
  background: #C3E0C6; }
.layout-leerling .leerlingtoetsenlijst .item.bezig {
  background: #FFC0C0; }
.layout-leerling .leerlingtoetsenlijst .toetsklaar, .layout-leerling .leerlingtoetsenlijst button {
  float: right; }
.layout-leerling .leerlingtoetsenlijst .toetsklaar {
  margin-right: 17px; }
.layout-leerling .leerlingtoetsenlijst button {
  display: inline-block;
  width: 70px;
  height: 28px;
  line-height: 0px;
  margin-top: -2px;
  margin-right: 5px;
  border: 1px #d98313 solid;
  border-top: 4px #f1a94c solid;
  border-radius: 2px;
  background: #E99323;
  color: white;
  text-align: center;
  padding: 0;
}

.layout-leerling .leerlingtoetsenlijst button:not(.look-enabled):disabled {
  border: 1px #8E9391 solid;
  border-top: 4px #b4b3b3 solid;
  background: #9da19f;
  color: white;
}

.layout-leerling .leerlingtoetsenlijst .hoofditem button {
  margin-right: 1px;
}

.layout-leerling .luisteren-footer {
  display: none;
  position: absolute;
  bottom: 35px;
  right: 20px;
  font-size: 1.2em;
  font-weight: 700; }
.layout-leerling .luisteren-image {
  position: relative;
  top: 17px;
  margin-left: 5px;
  display: inline-block;
  width: 45px;
  height: 45px;
  background-image: url(../../img/luisteren.png);
  background-size: 100%; }
.layout-leerling .luisteren-image:hover {
  cursor: pointer; }

.layout-leerling.democreerformwrap .titletext {
  font-size: 1.4em;
  text-align: center;
  display: block;
  margin-bottom: -5px; }
.layout-leerling.democreerformwrap .content form {
  text-align: left;
  position: relative;
  display: inline-block; }
.layout-leerling.democreerformwrap .content input,
.layout-leerling.democreerformwrap .content select {
  margin-bottom: 4px;
  margin-left: 4px; }
.layout-leerling.democreerformwrap .content input.btn {
  margin-left: 0; }
.layout-leerling.democreerformwrap .content table input[type="text"],
.layout-leerling.democreerformwrap .content table input[type="email"],
.layout-leerling.democreerformwrap .content table select {
  width: 100%;
  border: 1px #dddddd solid;
  height: 24px;
  padding: 2px; }
.layout-leerling.democreerformwrap .btn {
  margin-top: 4px;
  margin-bottom: 8px; }
.layout-leerling.democreerformwrap .toetslijst input {
  margin-right: 4px;
  position: relative;
  top: 2px; }

.leerling-toets-wrap {
  position: absolute;
  left: 0;
  right: 0;
  top: 60px;
  bottom: 60px;
  overflow: hidden; }

.leerling-toets-wrap .vraagnr {
  position: absolute;
  right: 10px;
  top: 35px;
  z-index: 100; }

.leerling-toets-tabel {
  position: absolute;
  top: 60px;
  bottom: 60px;
  left: 0px;
  right: 0px;
  font-size: 1em;
  overflow: auto;
  /* disable selecting text */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.leerling-toets-tabel .inner {
  position: relative;
  margin: 50px 97px;
  margin-bottom: 20px; }


.leerling-toets-tabel .vraagtijd-wrap {
  font-size: 2em;
  font-weight: 400;
  text-align: center;
  position: fixed;
  right: 30px;
  bottom: 79px;
}

.leerling-toets-tabel .vraagtijd {
  display: inline-block;
  vertical-align: top;
  background: white;
  padding: 4px 8px;
  position: relative;
  z-index: 9999;
}

.leerling-toets-tabel label.vraagsoort16{
  padding-left: 10px;
  padding-right: 10px;
  display: inline-block;
  text-align: center;
}
.leerling-toets-tabel div.vraagsoort16{
  text-align: center;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table{
  margin: 0 auto;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table td{
  padding-left:  4px;
  padding-right: 4px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(1) td:nth-of-type(1){
  border-left:  #000 solid 2px;
  border-right: #000 solid 2px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(1) td:nth-of-type(2){
  border-right: #000 solid 3px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(1) td:nth-of-type(4){
  border-right: #000 solid 2px;
  border-left:  #000 solid 2px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(2) td:nth-of-type(1){
  border-left: #000 solid 2px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(2) td:nth-of-type(2){
  border-right: #000 solid 2px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(2) td:nth-of-type(5){
  border-right: #000 solid 3px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(2) td:nth-of-type(8){
  border-right: #000 solid 2px;
}
.leerling-toets-tabel .vraagtekst-inner .vraagsoort16 table tr:nth-of-type(2) td:nth-of-type(10){
  border-right: #000 solid 2px;
}


.leerling-toets-tabel .vraagtekst-inner {
  margin-bottom: 15px; }

.leerling-toets-tabel .vraagtekst-inner b,
.leerling-toets-tabel .vraagtekst-inner strong {
  font-weight: 700;
  color: #2e6684; }

.leerling-toets-tabel td, .leerling-toets-tabel th {
  padding: 1px; }

.leerling-toets-tabel label {
  margin-right: 10px;
  padding: 3px;
  border-radius: 2px;
  font-weight: 400; }
.leerling-toets-tabel label:hover {
  background: #eeeeee;
  cursor: pointer; }

.leerling-toets-tabel label:hover input {
  cursor: pointer;
}

.leerling-toets-tabel .vraag-inhoud-wrap hr {
  margin: 5px 10px 5px 5px;
  border-top: 2px #bbbbbb solid; }

.leerling-toets-tabel .vraag-inhoud-wrap textarea {
  display: block;
}

.leerling-toets-tabel .vraag-inhoud-wrap input[type="text"] {
  border: 1px #cccccc solid;
  padding: 1px 4px;
  background: #f8f8f0;
  border-radius: 0;
}

.leerling-toets-tabel .vraag-inhoud-wrap .bordered td {
  border: 1px #e8e8e8 solid;
  padding: 2px;
  text-align: right; }

.leerling-toets-tabel .scrollbar-arrow {
  display: none;
  position: fixed;
  top: auto;
  left: 13px;
  bottom: 60px;
  font-size: 1.4em;
  cursor: default;
  -webkit-animation: sba-bounce 1s infinite alternate;
  /* Safari 4+ */
  -moz-animation: sba-bounce 1s infinite alternate;
  /* Fx 5+ */
  -o-animation: sba-bounce 1s infinite alternate;
  /* Opera 12+ */
  animation: sba-bounce 1s infinite alternate;
  /* IE 10+, Fx 29+ */
  color: #ff570f; }

.helptools-vertical-padding {
  height: 90px;
}

/* for the reading texts */
.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) td {
  padding: 0;
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) mark {
  padding: 2px 0;
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) mark.red {
  background: rgba(255, 100, 100, 0.34);
  background: rgb(255 202 202);
}
.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) mark.green {
  background: rgba(0, 200, 0, 0.28);
  background: rgb(184 240 184);
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) mark.blue {
  background: rgba(0, 100, 255, 0.2);
  background: rgb(204 224 255);
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) mark.purple {
  background: rgb(204 205 255);
}



/* change the selection color */
.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain) *::selection {
  background: #328df9;
  color: #ffffff;
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain).text-highlight-highlight {
  cursor: url("../../img/icons/cursors/highlighter-solid.svg") 0 23, col-resize;
}

.leerling-toets-tabel :is(#divBLText1Col, #divBLText1ColMain, #divBLTextMain1Col, #divBLTextMain).text-highlight-delete {
  cursor: url("../../img/icons/cursors/delete.svg") 12 12, pointer;
}

.leerling-toets-tabel :is(
  #divBLText1Col,
  #divBLText1ColMain,
  #divBLTextMain1Col,
  #divBLTextMain
).text-highlight-delete .red.hover-group {
  background: rgb(255 233 233);
  box-shadow: 2px 3px 3px 0 #5700009c;
}
.leerling-toets-tabel :is(
  #divBLText1Col,
  #divBLText1ColMain,
  #divBLTextMain1Col,
  #divBLTextMain
).text-highlight-delete .green.hover-group {
  background: rgb(224 255 224);
  box-shadow: 2px 3px 3px 0 #004d109c;
}
.leerling-toets-tabel :is(
  #divBLText1Col,
  #divBLText1ColMain,
  #divBLTextMain1Col,
  #divBLTextMain
).text-highlight-delete .blue.hover-group {
  background: rgb(227 238 255);
  box-shadow: 2px 3px 3px 0 #0a306db8;
}


.leerling-toets-tabel :is(
  #divBLText1Col,
  #divBLText1ColMain,
  #divBLTextMain1Col,
  #divBLTextMain
).text-highlight-delete .purple.hover-group {
  background: rgb(227 227 255);
  background: rgb(231 231 255);
  box-shadow: 2px 3px 3px 0 #1f1f79ab;
}



.rangeslider,
.rangeslider__fill {
  display: block;
  border-radius: 10px;
}

.rangeslider {
  position: relative;
}

.rangeslider--horizontal {
  height: 22px;
  width: 100%;
  margin-top: 2px;
  margin-bottom: 2px;
}

.rangeslider--horizontal:before {
  content: "";
  display: block;
  width: 100%;
  height: 10px;
  background: #e7e7e7;
  top: 6px;
  border-radius: 10px;
  position: relative;
}


.rangeslider--vertical {
  width: 10px;
  min-height: 150px;
  max-height: 100%;
}

.rangeslider--disabled {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}

.rangeslider__fill {
  background: #B2E5A5;
  position: absolute;
}
.rangeslider--horizontal .rangeslider__fill {
  top: 6px;
  height: 10px;
}
.rangeslider--vertical .rangeslider__fill {
  bottom: 0;
  width: 100%;
}

.rangeslider__handle {
  background: #c3e0f1;
  border: 1px solid #4f8ccb;
  cursor: pointer;
  display: inline-block;
  width: 10px;
  height: 22px;
  position: absolute;
  border-radius: 4px;

}

.rangeslider__handle:active, .rangeslider--active .rangeslider__handle {
  background: #0e8ece;
}

.rangeslider--horizontal .rangeslider__handle {
  top: 0;
  touch-action: pan-y;
  -ms-touch-action: pan-y;
}

.rangeslider--vertical .rangeslider__handle {
  left: -10px;
  touch-action: pan-x;
  -ms-touch-action: pan-x;
}

input[type="range"]:focus + .rangeslider .rangeslider__handle {
  box-shadow: 0 0 0px 2px #4d90fe;
}



.youtube-player {
  display: inline-block;
  position: relative; }
.youtube-player .iframe-wrap iframe {
  display: block;
  border: 0; }
.youtube-player .iframe-wrap .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }
.youtube-player .controls {
  position: relative;
  height: 44px;
  background: #000000; }
.youtube-player .controls .button {
  width: 44px;
  height: 44px;
  float: left;
  line-height: 49px;
  text-align: center;
  font-size: 2em;
  color: white; }
.youtube-player .controls .range-wrap {
  position: relative;
  float: left;
  width: 200px;
  height: 44px;
  margin-left: 5px; }
.youtube-player .controls .range-wrap .track {
  position: relative;
  width: 100%;
  height: 8px;
  background: #ffffff;
  top: 19px; }
.youtube-player .controls .range-wrap .thumb {
  position: absolute;
  height: 24px;
  width: 8px;
  background: #E30000;
  top: 11px; }

.leerling-toets-footer {
  background-color: #F0EFF0 !important;
  width: 100%;
  height: 30px;
  padding: 0 !important;
  bottom: 30px !important; }
.leerling-toets-footer .stop {
  position: absolute;
  left: 0px;
}
.leerling-toets-footer .vorige {
  position: absolute;
  left: 100px; }
.leerling-toets-footer .rightbuttons {
  position: absolute;
  right: 200px; }
.leerling-toets-footer .help {
  margin-right: 4px; }
.leerling-toets-footer .other-buttons {
  position: relative;
  left: 191px;
  float: left; }
.leerling-toets-footer .other-buttons .btn span,
.leerling-toets-footer .help .btn span {
  width: auto;
  padding: 0 10px;
  margin-left: 0px !important; }
.leerling-toets-footer .other-buttons .btn {
  margin-left: 2px; }
.leerling-toets-footer .btn,
.leerling-toets-footer .btn:active,
.leerling-toets-footer .btn:hover,
.leerling-toets-footer .btn:focus {
  border: none;
  outline: none;
  text-align: left;
  margin: 0;
  padding: 0;
  border-radius: 0;
  color: white;
  overflow: hidden;
  background-color: #0E8ECE; }
.leerling-toets-footer .btn.disabled {
  background-color: #aaaaaa;
  cursor: default; }
.leerling-toets-footer .btn:focus {
  outline: 0; }
.leerling-toets-footer .btn:active {
  -webkit-box-shadow: none;
  box-shadow: none; }
.leerling-toets-footer span {
  font-family: Arial, Arial, Helvetica, sans-serif;
  font-size: 1.1em;
  font-style: normal;
  display: inline-block;
  min-width: 80px;
  height: 30px;
  line-height: 28px;
  text-align: center; }
.leerling-toets-footer .vorige .btn span,
.leerling-toets-footer .volgende .btn span {
  margin-left: 4px !important; }
.leerling-toets-footer div {
  display: inline-block; }
.leerling-toets-footer .arrow-left, .leerling-toets-footer .arrow-right {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid; }
.leerling-toets-footer .arrow-left {
  left: -10px;
  border-width: 15px 10px 15px 0;
  border-color: transparent #0E8ECE transparent transparent; }
.leerling-toets-footer .arrow-right {
  left: 100%;
  border-width: 15px 0 15px 10px;
  border-color: transparent transparent transparent #0E8ECE; }
.leerling-toets-footer .btn.disabled .arrow-left {
  border-color: transparent #aaaaaa transparent transparent; }
.leerling-toets-footer .btn.disabled .arrow-right {
  border-color: transparent transparent transparent #aaaaaa; }
.leerling-toets-footer .copyright-notice {
  position: absolute;
  display: block;
  left: 0;
  top: 34px;
  width: 100%;
  color: #dddddd;
  text-align: center; }

@-webkit-keyframes sba-bounce {
  0% {
    bottom: 60px; }
  100% {
    bottom: 70px; } }
@-moz-keyframes sba-bounce {
  0% {
    bottom: 60px; }
  100% {
    bottom: 70px; } }
@-o-keyframes sba-bounce {
  0% {
    bottom: 60px; }
  100% {
    bottom: 70px; } }
@keyframes sba-bounce {
  0% {
    bottom: 60px; }
  100% {
    bottom: 70px; } }
.layout-leerling .testbegeleider-buttonbar {
  position: absolute;
  text-align: center;
  bottom: 3px; }
.layout-leerling .testbegeleider-buttonbar button {
  position: relative;
  width: 65px;
  height: 65px;
  font-size: 0;
  display: inline-block;
  border: 0;
  padding: 2px;
  margin-right: 15px;
  background-color: transparent;
  border-radius: 12px;
  background: #75b8db;
}
.layout-leerling .testbegeleider-buttonbar button:not([disabled]):hover {
  background: #86c3e4;
}
.layout-leerling .testbegeleider-buttonbar button:not([disabled]):active {
  background: #308abb;
}
.layout-leerling .testbegeleider-buttonbar button:not([disabled]) {
  cursor: pointer;
}
.layout-leerling .testbegeleider-buttonbar button:disabled {
  
}

.layout-leerling .testbegeleider-buttonbar .testbegeleider-buttonbar__tab:disabled {
    background: #75d88e;
}
.layout-leerling .testbegeleider-buttonbar .testbegeleider-buttonbar__non-tab:disabled {
    background: #a8a8a8;
}

.layout-leerling .testbegeleider-buttonbar .testbegeleider-buttonbar__non-tab:disabled:before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: black;
  opacity: 0.4;
  border-radius: 12px;
}




.layout-leerling .rapp-wrap {
  position: absolute;
  height: 100%;
  width: 100%;
  padding-right: 20px;
  padding-bottom: 90px; }
.layout-leerling .rapp-wrap2 {
  position: relative;
  width: 100%;
  height: 100%;
  margin-right: 20px;
 /* padding-bottom: 30px; */ }
.layout-leerling .rapp-wrap3 {
  position: relative;
  max-height: 85%;
  width: 100%;
  overflow: auto;
  height: 85%;
}
.layout-leerling .rapp-table {
  border: 1px #dfdfdf solid;
  float: left;
  width: 49%; }
.layout-leerling .rapp-table td {
  padding: 2px 4px; }
.layout-leerling .rapp-table:first-child {
  margin-right: 2%; }
.layout-leerling .rapp-buttons {
  text-align: center;
  margin-top: 5px;
  clear: both;
}

.layout-leerling #lnamen .disabled td{
  color: grey;
}


.layout-leerling .rapp-buttons span {
  width: 50px;
  display: inline-block;
}

.layout-leerling .rapp-buttons span img:hover {
  cursor: pointer;
}
.layout-leerling .route8-buttons .buttons{
  width: 100%;
  margin: 0 auto;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  margin-top: 12px;
  text-align: center;
}
.layout-leerling .route8-buttons{
  text-align: center;
}
.layout-leerling .route8-buttons > div {
  width: 100%;
}
.layout-leerling .rapp-buttons button {
  margin-right: 5px;
  height: 24px;
}

.layout-leerling .realtime-wrap {
  font-size: 0.9em;
  position: absolute;
  height: 100%;
  width: 100%;
  padding-right: 20px;
  padding-bottom: 93px; }
.layout-leerling .realtime-wrap table {
  border: 0; }
.layout-leerling .realtime-wrap table td, .layout-leerling .realtime-wrap table th {
  border: 0;
  padding: 0 2px; }
.layout-leerling .realtime-wrap table td + td, .layout-leerling .realtime-wrap table th + th {
  border-left: 1px #dfdfdf solid; }
.layout-leerling .realtime-wrap .alert td {
  background: #ed4a17; }
.layout-leerling .realtime-wrap .alert .progress .bar {
  background: rgba(255, 255, 255, 0.5); }
.layout-leerling .realtime-wrap .alert .progress .triangle {
  border-left-color: rgba(255, 255, 255, 0.5); }
.layout-leerling .realtime-wrap input {
  border: 1px rgba(0, 0, 0, 0.2) solid;
  background-clip: padding-box;
  background: rgba(255, 255, 255, 0.5);
  padding: 0; }
.layout-leerling .realtime-wrap .progress {
  position: relative;
  height: auto;
  margin: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }
.layout-leerling .realtime-wrap .progress.normal .bar {
  background: #d3d959; }
.layout-leerling .realtime-wrap .progress.normal .triangle {
  border-left-color: #d3d959; }
.layout-leerling .realtime-wrap .progress.warning .bar {
  background: #ffba19; }
.layout-leerling .realtime-wrap .progress.warning .triangle {
  border-left-color: #ffba19; }
.layout-leerling .realtime-wrap .progress.alert .bar {
  background: #ed4a17; }
.layout-leerling .realtime-wrap .progress.alert .triangle {
  border-left-color: #ed4a17; }
.layout-leerling .realtime-wrap .progress.klaar {
  background: #C3E0C6; }
.layout-leerling .realtime-wrap .progress.klaar .bar {
  background: transparent; }
.layout-leerling .realtime-wrap .progress.klaar .triangle {
  border-left-color: transparent; }
.layout-leerling .realtime-wrap .bar {
  position: releative;
  left: 0;
  top: 0;
  height: 24px;
  line-height: 26px;
  text-align: center; }
.layout-leerling .realtime-wrap .triangle {
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 10px solid transparent; }
.layout-leerling .realtime-wrap .width {
  position: relative; }
.layout-leerling .realtime-wrap2 {
  position: relative;
  max-height: 100%;
  width: 100%;
  overflow: auto; }
.layout-leerling .realtimelegenda {
  position: absolute;
  bottom: 16px;
  height: 65px;
  right: 22px;
  font-size: 0.7em; }
.layout-leerling .realtimelegenda div {
  padding: 1px 2px; }
.layout-leerling .realtimelegenda .normal {
  background-color: #d3d959; }
.layout-leerling .realtimelegenda .warning {
  background-color: #ffba19; }
.layout-leerling .realtimelegenda .alert2 {
  background-color: #ed4a17; }
.layout-leerling .realtimelegenda .klaar {
  background-color: #C3E0C6; }

.layout-beheerders {
  position: absolute;
  top: 85px;
  right: 90px;
  left: 90px;
  bottom: 60px;
  padding: 5px;
  padding-top: 10px;
  border: 1px #8E9391 solid;
  background: #F1F0F1; }

.layout-beheerders .pagename {
  margin-left: 15px;
  font-size: 1.3em;
  font-weight: 700; }
.layout-beheerders .pagenameitalic {
  font-size: 1.3em;
  font-style: italic; }

/* groene rand om groepen pagina */
.layout-beheerders .groenerand {
  border: 2px #B2E5A5 solid;
  border-top: 0; }

.layout-beheerders .blauwe-achtergrond {
  background: #E4F0F4; }

.layout-beheerders .hrbottom {
  margin-bottom: 0; }

.layout-beheerders .zoeken {
  width: 100px;
  margin-top: -4px;
  margin-right: 10px; }
.layout-beheerders .zoeken .form-control {
  height: 30px;
  padding: 6px;
  padding-right: 0;
  border: 2px #4f8ccb solid;
  border-right: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }
.layout-beheerders .zoeken .btn {
  top: 0;
  height: 30px;
  padding: 6px;
  border: 2px #4f8ccb solid;
  border-left: 0;
  color: #4f8ccb; }
.layout-beheerders .zoeken .btn:focus {
  outline: none; }

.layout-beheerders .pagina-links {
  margin-bottom: 10px;
  overflow: auto; }
.layout-beheerders .pagina-links .inner {
  overflow: auto;
  float: left; }
.layout-beheerders .pagina-links .btn {
  float: left;
  width: 65px;
  height: 65px;
  margin-right: 10px;
  border: 0;
  outline: 0;
  background: url(../../img/sprited/pdwnav_65.png) no-repeat; }
.layout-beheerders .pagina-links .btn.home {
  background-position: 0px 0px; }
.layout-beheerders .pagina-links .btn.home:hover {
  background-position: 0px -65px; }
.layout-beheerders .pagina-links .btn.home.active {
  background-position: 0px -130px; }
.layout-beheerders .pagina-links .btn.scholen {
  background-position: -65px 0px; }
.layout-beheerders .pagina-links .btn.scholen:hover {
  background-position: -65px -65px; }
.layout-beheerders .pagina-links .btn.scholen.active {
  background-position: -65px -130px; }
.layout-beheerders .pagina-links .btn.groepen {
  background-position: -130px 0px; }
.layout-beheerders .pagina-links .btn.groepen:hover {
  background-position: -130px -65px; }
.layout-beheerders .pagina-links .btn.groepen.active {
  background-position: -130px -130px; }
.layout-beheerders .pagina-links .btn.collegas {
  background-position: -195px 0px; }
.layout-beheerders .pagina-links .btn.collegas:hover {
  background-position: -195px -65px; }
.layout-beheerders .pagina-links .btn.collegas.active {
  background-position: -195px -130px; }
.layout-beheerders .pagina-links .btn.rapportages {
  background: url(../../img/130px/ondertekenen.png); }
.layout-beheerders .pagina-links .opmerkingen {
  position: relative;
  top: 3px;
  overflow: hidden; }
.layout-beheerders .pagina-links .opmerkingen textarea {
  display: block;
  width: 100%;
  height: 60px;
  border: 1px #cccccc solid;
  border-radius: 3px;
  color: #666666;
  resize: none; }

.layout-beheerders .blauw-wit .lijst1 .titel {
  -webkit-border-radius: 4px 4px 0 0;
  -moz-border-radius: 4px 4px 0 0;
  -ms-border-radius: 4px 4px 0 0;
  -o-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
  padding-left: 8px;
  font-size: 0.9em;
  color: #ffffff;
  background: #4f8ccb;
  background-repeat: no-repeat;
  background-position: 143px 3px; }
.layout-beheerders .blauw-wit .lijst1 .titel.scholen {
  background-image: url(../../img/school_wit_home_pdw.png); }
.layout-beheerders .blauw-wit .lijst1 .blue-border {
  border: 2px #4f8ccb solid;
  border-radius: 0 0 4px 4px;
  background: #ffffff; }
.layout-beheerders .blauw-wit .lijst1 .content .selected {
  color: #4f8ccb;
  font-weight: 700; }
.layout-beheerders .blauw-wit .lijst1 .content .selected:hover {
  cursor: default; }
.layout-beheerders .blauw-wit .lijst1 .content div {
  display: block;
  padding-left: 5px;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 0.8em;
  text-decoration: none; }
.layout-beheerders .blauw-wit .lijst1 .content div:hover {
  color: #4f8ccb;
  cursor: default; }
.layout-beheerders .blauw-wit .lijst1 .content div:nth-child(odd) {
  background: #ffffff; }
.layout-beheerders .blauw-wit .lijst1 .content div:nth-child(even) {
  background: #f1f0f1; }
.layout-beheerders .blauw-wit .rechterkolom .heading {
  background: white;
  color: #4f8ccb;
  font-weight: 700;
  border-radius: 4px 4px 0 0;
  height: 21px; }
.layout-beheerders .blauw-wit .rechterkolom .heading span {
  margin-left: 10px; }
.layout-beheerders .blauw-wit .rechterkolom .table2 {
  /*
  img { 
    margin-left:6px;
  } */ }
.layout-beheerders .blauw-wit .rechterkolom .table2 th, .layout-beheerders .blauw-wit .rechterkolom .table2 td {
  height: 25px;
  white-space: nowrap;
  margin-right: 5px;
  padding: 2px 6px;
  padding-bottom: 0px;
  font-size: 0.8em; }
.layout-beheerders .blauw-wit .rechterkolom .table2 th {
  background: white;
  color: #4f8ccb;
  font-weight: 400; }
.layout-beheerders .blauw-wit .rechterkolom .table2 td {
  border-bottom: 1px white solid; }
.layout-beheerders .blauw-wit .witte-border {
  border: 3px white solid;
  border-top: 0; }

.layout-beheerders .icon25px .icon {
  width: 25px;
  height: 25px;
  background-size: 100% 100%; }

.layout-beheerders .icon {
  display: inline-block;
  font-size: 0;
  background-image: url(../../img/sprited/pdwtabs.png);
  width: 35px;
  height: 35px;
  margin-top: 4px;
  margin-left: 10px;
  background-color: transparent;
  background-size: contain;
  border: 0; }
.layout-beheerders .icon.voeg-toe {
  background-position: 0 0; }
.layout-beheerders .icon.voeg-toe:hover {
  background-position: 0 -35px; }
.layout-beheerders .icon.voeg-toe.actief {
  background-position: 0 -70px; }
.layout-beheerders .icon.verwijder {
  background-position: 35px 0; }
.layout-beheerders .icon.verwijder:hover {
  background-position: 35px -35px; }
.layout-beheerders .icon.verwijder.actief {
  background-position: 35px -70px; }
.layout-beheerders .icon.toetsafname {
  background-position: -35px 0; }
.layout-beheerders .icon.toetsafname:hover {
  background-position: -35px -35px; }
.layout-beheerders .icon.toetsafname.actief {
  background-position: -35px -70px; }
.layout-beheerders .icon.rapportage2 {
  background-position: -70px 0; }
.layout-beheerders .icon.rapportage2:hover {
  background-position: -70px -35px; }
.layout-beheerders .icon.rapportage2.actief {
  background-position: -70px -70px; }
.layout-beheerders .icon.verzend-school {
  background-position: -105px 0; }
.layout-beheerders .icon.verzend-school:hover {
  background-position: -105px -35px; }
.layout-beheerders .icon.verzend-school.actief {
  background-position: -105px -70px; }
.layout-beheerders .icon.facturatie {
  background-position: -140px 0; }
.layout-beheerders .icon.facturatie:hover {
  background-position: -140px -35px; }
.layout-beheerders .icon.facturatie.actief {
  background-position: -140px -70px; }
.layout-beheerders .icon.evaluatie {
  background-position: -175px 0; }
.layout-beheerders .icon.evaluatie:hover {
  background-position: -175px -35px; }
.layout-beheerders .icon.evaluatie.actief {
  background-position: -175px -70px; }
.layout-beheerders .icon.bestanden {
  background-position: -210px 0; }
.layout-beheerders .icon.bestanden:hover {
  background-position: -210px -35px; }
.layout-beheerders .icon.bestanden.actief {
  background-position: -210px -70px; }
.layout-beheerders .icon.leerling {
  background-image: url(../../img/35px/leerling_35px_passief.png); }
.layout-beheerders .icon.leerling:hover {
  background-image: url(../../img/35px/leerling_35px_hover.png); }
.layout-beheerders .icon.verzend {
  background-image: url(../../img/35px/verwijder_35px_passief.png); }
.layout-beheerders .icon.verzend:hover {
  background-image: url(../../img/35px/verwijder_35px_hover.png); }
.layout-beheerders .icon.bijlage {
  background-image: url(../../img/35px/bijlage_35px_passief.png); }
.layout-beheerders .icon.bijlage:hover {
  background-image: url(../../img/35px/bijlage_35px_hover.png); }
.layout-beheerders .icon.archiveren {
  background-image: url(../../img/35px/archiveren_35px_passief.png); }
.layout-beheerders .icon.archiveren:hover {
  background-image: url(../../img/35px/archiveren_35px_hover.png); }
.layout-beheerders .icon.pdf-grijs {
  background-image: url(../../img/35px/pdf_grijs_35px_passief.png); }
.layout-beheerders .icon.pdf-grijs:hover {
  background-image: url(../../img/35px/pdf_grijs_35px_hover.png); }
.layout-beheerders .icon.pdf-oranje {
  background-image: url(../../img/35px/pdf_oranje_35px_passief.png); }
.layout-beheerders .icon.pdf-oranje:hover {
  background-image: url(../../img/35px/pdf_oranje_35px_hover.png); }
.layout-beheerders .icon.pdf-groen {
  background-image: url(../../img/35px/pdf_groen_35px_passief.png); }
.layout-beheerders .icon.pdf-groen:hover {
  background-image: url(../../img/35px/pdf_groen_35px_hover.png); }
.layout-beheerders .icon.importeer {
  background-image: url(../../img/35px/avision_actiebalk_eedex_passief_pdw_35px_mouseover.png); }
.layout-beheerders .icon.importeer:hover {
  background-image: url(../../img/35px/avision_actiebalk_eedex_hover_pdw_35px_mouseover.png); }
.layout-beheerders .icon.koppel {
  background-image: url(../../img/35px/koppel_130px_passief.png); }
.layout-beheerders .icon.koppel:hover {
  background-image: url(../../img/35px/koppel_130px_hover.png); }
.layout-beheerders .icon.instellingen {
  background-image: url(../../img/35px/opties_passief.png); }
.layout-beheerders .icon.instellingen:hover {
  background-image: url(../../img/35px/opties_hover.png); }
.layout-beheerders .icon.uitnodigenbestuur {
  background-image: url(../../img/35px/uitnodigenbestuur_passief.png); }
.layout-beheerders .icon.uitnodigenbestuur:hover {
  background-image: url(../../img/35px/uitnodigenbestuur_hover.png); }
.layout-beheerders .icon.uitnodigendocent {
  background-image: url(../../img/35px/uitnodigendocent_passief.png); }
.layout-beheerders .icon.uitnodigendocent:hover {
  background-image: url(../../img/35px/uitnodigendocent_hover.png); }
.layout-beheerders .icon.rapportage {
  background-image: url(../../img/35px/totaaloverzicht_hover.png); }
.layout-beheerders .icon.rapportage:hover {
  background-image: url(../../img/35px/totaaloverzicht_passief.png); }
.layout-beheerders .icon.bewerk {
  background-image: url(../../img/35px/opties_passief.png); }
.layout-beheerders .icon.bewerk:hover {
  background-image: url(../../img/35px/opties_hover.png); }
.layout-beheerders .icon.combineergebruiker {
  background-image: url(../../img/35px/combineergebruiker_passief.png); }
.layout-beheerders .icon.combineergebruiker:hover {
  background-image: url(../../img/35px/combineergebruiker_hover.png); }
.layout-beheerders .icon.opp {
  background-image: url(../../img/35px/lijst_passief.png); }
.layout-beheerders .icon.opp:hover {
  background-image: url(../../img/35px/lijst_hover.png); }
.layout-beheerders .icon.toevoegen {
  background-image: url(../../img/35px/handmatig_130px_passief.png); }
.layout-beheerders .icon.toevoegen:hover {
  background-image: url(../../img/35px/handmatig_130px_hover.png); }
.layout-beheerders .icon.naambord {
  background-image: url(../../img/35px/naambord_passief.png); }
.layout-beheerders .icon.naambord:hover {
  background-image: url(../../img/35px/naambord_hover.png); }
.layout-beheerders .icon.lijst {
  background-image: url(../../img/35px/lijst_passief.png); }
.layout-beheerders .icon.lijst:hover {
  background-image: url(../../img/35px/lijst_hover.png); }
.layout-beheerders .icon.totaaloverzicht {
  background-image: url(../../img/35px/totaaloverzicht_passief.png); }
.layout-beheerders .icon.totaaloverzicht:hover {
  background-image: url(../../img/35px/totaaloverzicht_hover.png); }
.layout-beheerders .icon.herberekenen { background-image: url(../../img/35px/herbereken.svg); }
.layout-beheerders .icon.leerlingprofiel {
  background-image: url(../../img/35px/login_passief.png); }
.layout-beheerders .icon.leerlingprofiel:hover {
  background-image: url(../../img/35px/login_hover.png); }
.layout-beheerders .icon.shopsunited {
  background-image: url(../../img/35px/shopsunited_passief.png); }
.layout-beheerders .icon.shopsunited:hover {
  background-image: url(../../img/35px/shopsunited_hover.png); }
.layout-beheerders .icon.koopcredits {
  background-image: url(../../img/35px/koopcredits_35px_passief.png); }
.layout-beheerders .icon.koopcredits:hover {
  background-image: url(../../img/35px/koopcredits_35px_hover.png); }
.layout-beheerders .icon.uitnodigenibotestbegeleider {
  background-image: url(../../img/35px/uitnodigendocent_passief.png); }
.layout-beheerders .icon.uitnodigenibotestbegeleider:hover {
  background-image: url(../../img/35px/uitnodigendocent_hover.png); }
.layout-beheerders .icon.ADIT {
  background-image: url(../../img/35px/adit_button.png); }
.layout-beheerders .icon.IVO {
  background-image: url(../../img/35px/ivo_button.png); }
.layout-beheerders .icon.IVOschriftelijk {
  background-image: url(../../img/35px/ivo_schriftelijk_button.png); }
.layout-beheerders .icon.NIO {
  background-image: url(../../img/35px/nio_schriftelijk_button.png); }
.layout-beheerders .icon.WISC {
  background-image: url(../../img/35px/wisc_button.png); }
.layout-beheerders .icon.googlemaps {
  background-image: url(../../img/iconenV3/googlemaps.ico);
  background-size: 16px 16px;
  float:right;}

.layout-beheerders .geselecteerd .icon.voeg-toe {
  background-position: 0 -70px; }
.layout-beheerders .geselecteerd .icon.voeg-toe:hover {
  background-position: 0 -70px; }
.layout-beheerders .geselecteerd .icon.verwijder {
  background-position: 35px -70px; }
.layout-beheerders .geselecteerd .icon.verwijder:hover {
  background-position: 35px -70px; }
.layout-beheerders .geselecteerd .icon.toetsafname {
  background-position: -35px -70px; }
.layout-beheerders .geselecteerd .icon.toetsafname:hover {
  background-position: -35px -70px; }
.layout-beheerders .geselecteerd .icon.rapportage2 {
  background-position: -70px -70px; }
.layout-beheerders .geselecteerd .icon.rapportage2:hover {
  background-position: -70px -70px; }
.layout-beheerders .geselecteerd .icon.verzend-school {
  background-position: -105px -70px; }
.layout-beheerders .geselecteerd .icon.verzend-school:hover {
  background-position: -105px -70px; }
.layout-beheerders .geselecteerd .icon.facturatie {
  background-position: -140px -70px; }
.layout-beheerders .geselecteerd .icon.facturatie:hover {
  background-position: -140px -70px; }
.layout-beheerders .geselecteerd .icon.evaluatie {
  background-position: -175px -70px; }
.layout-beheerders .geselecteerd .icon.evaluatie:hover {
  background-position: -175px -70px; }
.layout-beheerders .geselecteerd .icon.bestanden {
  background-position: -210px -70px; }
.layout-beheerders .geselecteerd .icon.bestanden:hover {
  background-position: -210px -70px; }
.layout-beheerders .bottombar .iconcontainer .icon {
  background-size: contain;
}
.layout-beheerders .icon .check-kolom-btn {
  background-size: contain;
}
.layout-beheerders .check-marker {
  background-image: url(../../img/checkbox_passief.png);
  position: relative;
  display: inline-block;
  width: 30px;
  height: 20px; }
.layout-beheerders .check-marker:hover {
  cursor: default; }
.layout-beheerders .check-marker.afgerond, .layout-beheerders .check-marker.selected {
  background-image: url(../../img/checkbox_afgerond.png); }
.layout-beheerders .check-marker.let-op {
  background-image: url(../../img/checkbox_let-op.png); }

.layout-beheerders .bottombar {
  height: 44px;
  margin-top: 3px; }
.layout-beheerders .bottombar .bcontainer {
  height: 44px;
  float: left;
  margin-right: 10px; }
.layout-beheerders .bottombar .bcontainer.float-right {
  float: right;
  margin-right: 0;
  margin-left: 10px; }
.layout-beheerders .bottombar .bcontainer.actief .iconcontainer {
  background: #b2e5a5; }
.layout-beheerders .bottombar .bcontainer.actief .arrow {
  border-left-color: #b2e5a5; }
.layout-beheerders .bottombar .bcontainer.green .iconcontainer {
  background: #b2e5a5; }
.layout-beheerders .bottombar .bcontainer.green .arrow {
  border-left-color: #b2e5a5; }
.layout-beheerders .bottombar .iconcontainer {
  float: left;
  display: block;
  background: #dedede;
  height: 44px; }
.layout-beheerders .bottombar .arrow {
  float: left;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent;
  border-width: 22px 0 22px 22px;
  border-left-color: #dedede; }
.layout-beheerders .bottombar .tekst {
  color: #0098DB;
  display: inline-block;
  vertical-align: top;
  line-height: 40px;
  padding-left: 10px; }

.layout-beheerders .groen-geel {
  /* rechts tekst */
  /* ruimte tussen testnaam spans in groepen voeg toe tablad */ }
.layout-beheerders .groen-geel .linkerkolom, .layout-beheerders .groen-geel .rechterkolom {
  border-top: 7px #DEDEE0 solid; }
.layout-beheerders .groen-geel .linkerkolom .header {
  width: 195px; }
.layout-beheerders .groen-geel .linkerkolom .blok1 {
  position: relative;
  height: 71px;
  background: #EDF0DC; }
.layout-beheerders .groen-geel .linkerkolom .blok1 select {
  position: absolute;
  width: 80%;
  border: 0;
  color: #006600;
  left: 12px;
  bottom: 6px;
  font-weight: 700; }
.layout-beheerders .groen-geel .linkerkolom .blok1 .tekst {
  margin-left: 12px;
  padding-top: 2px;
  font-size: 1.2em;
  font-weight: 700; }
.layout-beheerders .groen-geel .linkerkolom #groepentabel td:nth-child(2) {
  width: 135px;
  max-width: 135px;
  overflow: hidden; }
.layout-beheerders .groen-geel .rechterkolom .tab {
  position: relative;
  width: 14.28%;
  height: 71px;
  float: left;
  background: #ECECEC;
  border-right: 2px #DEDEE0 solid;
  text-align: center;
  border-radius: 5px 5px 0 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
.layout-beheerders .groen-geel .rechterkolom .tab:hover {
  background: #D2F0CA;
  cursor: default; }
.layout-beheerders .groen-geel .rechterkolom .tab:last-child {
  border-right: 0; }
.layout-beheerders .groen-geel .rechterkolom .tab.afgerond {
  background: #EDF0DC; }
.layout-beheerders .groen-geel .rechterkolom .tab.geselecteerd {
  background: #b2e5a5; }
.layout-beheerders .groen-geel .rechterkolom .tab.geselecteerd span {
  color: #006600; }
.layout-beheerders .groen-geel .rechterkolom .tab .opmerking {
  position: absolute;
  width: 20px;
  height: 20px;
  right: 0;
  top: -2px;
  opacity: 0.6;
  background-image: url(../../img/opmerkingmark.png);
  background-size: 100%; }
.layout-beheerders .groen-geel .rechterkolom .tab span {
  display: block;
  font-size: 0.7em;
  margin-top: 2px; }
.layout-beheerders .groen-geel .rechterkolom .tab.t3 {
  width: 33.3%; }
.layout-beheerders .groen-geel .rechterkolom .tab .under {
  margin-top: -3px; }
.layout-beheerders .groen-geel .rechterkolom .tab .check-marker {
  top: -6px;
  left: 2px; }
.layout-beheerders .groen-geel .rechterkolom .tab .icon {
  margin-top: 1px; }
.layout-beheerders .groen-geel .text1 {
  display: inline-block;
  width: 100%;
  height: 20px;
  padding-top: 1px;
  padding-bottom: 20px;
  padding-left: 5px;
  font-weight: 700;
  font-size: 0.9em;
  line-height: 20px; }
#maincontent-swv .text1 {
  display: inline-block;
  width: 100%;
  font-weight: 700;
  font-size: 0.9em;
  padding-top: 1px;
  padding-left: 5px;
  line-height: 20px;
}
.layout-beheerders .groen-geel .groen-onderblok {
  display: block;
  height: 38px;
  background: #b2e5a5;
  border-bottom: 1px #82C072 solid; }
.layout-beheerders .groen-geel .groen-onderblok .tekst {
  margin-left: 5px;
  padding-top: 2px;
  font-size: 0.9em;
  font-weight: 700; }
.layout-beheerders .groen-geel .lijst1 {
  font-size: 0.82em;
  width: 100%; }
.layout-beheerders .groen-geel .lijst1 .selected {
  color: #529744; }
.layout-beheerders .groen-geel .lijst1 .selected td {
  background: #ffffff; }
.layout-beheerders .groen-geel .lijst1 .selected .list-style {
  background: #3b8bca; }
.layout-beheerders .groen-geel .lijst1 .selected .list-style.let-op {
  background: #ff9500; }
.layout-beheerders .groen-geel .lijst1 tr:hover {
  cursor: default; }
.layout-beheerders .groen-geel .lijst1 tr:hover td {
  background: #ffffff; }
.layout-beheerders .groen-geel .lijst1 td {
  background: #E4F0F4;
  height: 25px;
  border-top: 1px white solid;
  border-bottom: 1px white solid;
  white-space: nowrap; }
.layout-beheerders .groen-geel .lijst1 .list-style {
  margin-left: 4px;
  margin-right: 4px; }
.layout-beheerders .groen-geel .lijst1.wrap td {
  white-space: normal; }
.layout-beheerders .groen-geel .testaantal span {
  margin-right: 5px; }
.layout-beheerders .groen-geel form input, .layout-beheerders .groen-geel form textarea {
  width:100%;
  background: white;
  border: 1px #ccc solid;
  padding: 2px;
  resize: none; }
.layout-beheerders .groen-geel .groepentabel .table2 {
  position: relative;
  top: -3px; }
.layout-beheerders .groen-geel .groepentabel .table2 th, .layout-beheerders .groen-geel .groepentabel .table2 td {
  white-space: nowrap;
  padding: 4px 6px 0 6px; }
.layout-beheerders .groen-geel .groepentabel .table2 th {
  background-color: #b2e5a5;
  color: #787878;
  font-weight: 700;
  font-size: 0.8em;
  text-align: left;
  border-bottom: 1px #006600 solid;
  border-bottom: 1px #82C072 solid; }
.layout-beheerders .groen-geel .groepentabel .table2 tr + tr td {
  border-top: 1px white solid; }
.layout-beheerders .groen-geel .groepentabel .table2 td {
  background: #E4F0F4;
  border-right: 1px white solid;
  height: 25px;
  font-size: 0.8em;
  font-weight: 400;
  cursor: default; }
.layout-beheerders .groen-geel .groepentabel .table2 .selected td, .layout-beheerders .groen-geel .groepentabel .table2 .selected:hover td {
  background: #A9D9E8;
  border-right: 1px #A9D9E8 solid; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen span {
  margin-right: 4px;
  display: inline-block;
  padding: 2px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen img {
  width: 23px;
  height: 23px; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .nogniks {
  background-color: #FB8080; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .psycholoog {
  background-color: #FAFB80; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .goedgekeurd {
  background-color: #80FBEB; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .wachtonderteken {
  background-color: #8EFE8E; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .ondertekend {
  background-color: #40D040; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .verzonden {
  background-color: #2CA52C;
  cursor: pointer; }
.layout-beheerders .groen-geel .groepentabel .rapportage-iconen .nietverzonden {
  cursor: pointer; }

.layout-beheerders .list-style {
  width: 8px;
  height: 8px;
  background: white;
  border: 1px #3b8bca solid;
  border-radius: 2px;
  -webkit-box-shadow: 0px 0px 0px 1px #72B5EA;
  -moz-box-shadow: 0px 0px 0px 1px #72B5EA;
  box-shadow: 0px 0px 0px 1px #72B5EA; }
.layout-beheerders .list-style.let-op {
  border: 1px #ff9500 solid;
  -webkit-box-shadow: 0px 0px 0px 1px #FFC068;
  -moz-box-shadow: 0px 0px 0px 1px #FFC068;
  box-shadow: 0px 0px 0px 1px #FFC068; }

/*
.layout-beheerders .groepenlijst .selected,
.layout-beheerders .groen-geel .lijst1 {
  .list-style.let-op {
    background: #ff9500;
  }
}


.layout-beheerders .groepenlijst {
  width: 100%;
  overflow-y: scroll;
  font-size: 0.85em;
  white-space: nowrap;
  
  &.padding td{
    padding: 5px;
  }
  
  td {
    background: #E4F0F4;
    border-top: 1px white solid;
    border-bottom: 1px white solid;
    font-size: 0.9em;
  }
  
  .selected {
    td {
      background: #ffffff;
    }
    
    .list-style { background: #3b8bca; }
    
  }
  
  
  .list-style {
    margin-left: 3px;
    margin-right: 1px;
  }
}
*/
.layout-beheerders .laad-inactieve-knop {
  height: 23px;
  border: 1px #008337 solid;
  border-bottom: 2px #008337 solid;
  color: #B2E5A5;
  background: #019640;
  line-height: 21px;
  text-align: center;
  font-size: 1.2em;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
.layout-beheerders .laad-inactieve-knop:hover {
  cursor: default; }
.layout-beheerders .laad-inactieve-knop:active {
  margin-top: 1px;
  height: 22px;
  border-bottom: 1px #008337 solid; }

.layout-beheerders .progress-square {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 4px; }
.layout-beheerders .progress-square + .progress-square {
  margin-left: 5px; }
.layout-beheerders .progress-square.nietgemaakt {
  background: white;
  border: 2px #E9E9E9 solid; }
.layout-beheerders .progress-square.groepenactief {
  background: yellow;
  border: 2px #E9E9E9 solid; }
.layout-beheerders .progress-square.afwachtend {
  background: #5F9EFF;
  border: 2px #005FC4 solid; }
.layout-beheerders .progress-square.bezig {
  background: #FFC342;
  border: 2px #BFA259 solid; }
.layout-beheerders .progress-square.gemaakt {
  background: #66FF5F;
  border: 2px #54C16A solid; }
.layout-beheerders .progress-square.verplichtgemaakt {
  background: #2865B3;
  border: 2px #173D6A solid; }

.layout-beheerders .groepen .icon {
  float: right;
  width: 23px;
  height: 23px;
  margin: 2px 0;
  margin-right: 3px;
  background-image: url(../../img/sprited/pdwgroeplijststatus.png); }
.layout-beheerders .groepen .icon.status0 {
  background-position: 0px 0px; }
.layout-beheerders .groepen .icon.status1 {
  background-position: -23px 0px; }
.layout-beheerders .groepen .icon.status2 {
  background-position: -46px 0px; }
.layout-beheerders .groepen .icon.status3 {
  background-position: -69px 0px; }
.layout-beheerders .groepen .icon.status4 {
  background-position: -92px 0px; }
.layout-beheerders .groepen .icon.status5 {
  background-position: -115px 0px; }
.layout-beheerders .groepen .icon.status6 {
  background-position: -138px 0px; }
.layout-beheerders .groepen .icon.prullebak {
  background-position: -161px 0px; }

/* fix later */
.message-klaar {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -140px;
  font-size: 2em; }

#leraar-main {
  position: relative;
  border: 2px solid #4f8ccb;
  border-radius: 5px;
  width: 90%;
  max-width: 600px;
  padding: 10px;
  font-size: 1.2em;
  margin: 70px auto 10px auto; }
#leraar-main .button-wrap {
  margin: 20px 0;
  text-align: center; }
#leraar-main .mainbutton {
  position: relative;
  width: 130px;
  height: 130px;
  margin: 7px 7px; }
#leraar-main .mainbutton:focus {
  outline: none; }
#leraar-main .mainbutton:active {
  outline: none; }

/* Leraar main knoppen groot */
#leraar-main .klassen {
  background: url(../../img/130px/avision_klassen_130px_passief.png); }

#leraar-main .klassen:hover {
  background: url(../../img/130px/avision_klassen_130px_mouseover.png); }

#leraar-main .leerlingen {
  background: url(../../img/130px/avision_leerlingen_130px_passief.png); }

#leraar-main .leerlingen:hover {
  background: url(../../img/130px/avision_leerlingen_130px_mouseover.png); }

#leraar-main .groepen {
  background: url(../../img/130px/avision_groepen_130px_passief.png); }

#leraar-main .groepen:hover {
  background: url(../../img/130px/avision_groepen_130px_mouseover.png); }

#leraar-main .toetsen {
  background: url(../../img/130px/avision_toetsen_130px_passief.png); }

#leraar-main .toetsen:hover {
  background: url(../../img/130px/avision_toetsen_130px_mouseover.png); }

#leraar-main .realtime {
  background: url(../../img/130px/avision_realtime_130px_passief.png); }

#leraar-main .realtime:hover {
  background: url(../../img/130px/avision_realtime_130px_mouseover.png); }

#leraar-main .planning {
  background: url(../../img/130px/avision_planning_130px_passief.png);
  display: none; }

#leraar-main .planning:hover {
  background: url(../../img/130px/avision_planning_130px_mouseover.png); }

#leraar-main .rooster {
  background: url(../../img/130px/avision_rooster_130px_passief.png);
  display: none; }

#leraar-main .rooster:hover {
  background: url(../../img/130px/avision_rooster_130px_mouseover.png); }

#leraar-main .rapportage {
  background: url(../../img/130px/avision_rapportage_130px_passief.png); }

#leraar-main .rapportage:hover {
  background: url(../../img/130px/avision_rapportage_130px_mouseover.png); }

#leraar-main .bestanden {
  background: url(../../img/130px/bestanden.png); }

#leraar-main .bestanden :hover {
  background: url(../../img/130px/bestanden.png); }

#maincontent-leraar {
  position: absolute;
  top: 85px;
  padding: 5px;
  padding-top: 15px;
  /* max-width:1000px; */
  margin-right: 28px;
  border: 2px #4f8ccb solid;
  border-radius: 7px;
  overflow: hidden;
  margin-bottom: 50px;
  min-height: 574px;
  /* Firefox 18- */
  /* Firefox 19+ */
  /* Button next to input */
  /* Formula: max width = 75 * num - 10 + "px" */
  /* leerling profiel tab */
  /*
  #leerling-profiel-toetsen{
    position:fixed;
    left:-100px;
    margin-top:-100px;
    display:block;
    visibility:hidden;
  }

  .tab-content>.active#leerling-profiel-toetsen{
    position:relative;
    left:auto;
    top:auto;
    visibility:visible;
  }*/
  /* leerling toetsen tab */
  /* -- Main content table */ }
#maincontent-leraar > .pagename {
  font-size: 1.3em;
  margin-left: 15px;
  top: 20px; }
#maincontent-leraar > .info {
  float: right;
  margin-top: 5px;
  margin-right: 10px; }
#maincontent-leraar > #page-links {
  /* Button container */
  margin-left: 10px;
  margin-right: 205px; }
#maincontent-leraar > #page-links > .pagebutton {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  width: 65px;
  height: 65px;
  outline: 0; }
#maincontent-leraar > #page-links > .pagebutton:focus {
  outline: 2px #FFEE02 solid; }
#maincontent-leraar > #page-links > .pagebutton.rooster {
  display: none; }
#maincontent-leraar > #page-links > .pagebutton.planning {
  display: none; }
#maincontent-leraar .zoeken {
  margin-top: 0;
  top: 29px;
  min-width: 150px;
  margin-right: 10px; }
#maincontent-leraar .form-control {
  border: 2px #4f8ccb solid;
  border-right: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #4f8ccb; }
#maincontent-leraar .phcolor::-webkit-input-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor:-moz-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor::-moz-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .phcolor:-ms-input-placeholder {
  color: #4f8ccb; }
#maincontent-leraar .form-control:hover,
#maincontent-leraar .form-control:active,
#maincontent-leraar .form-control:focus {
  outline: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: #4f8ccb; }
#maincontent-leraar .input-group-btn > button {
  border: 2px #4f8ccb solid;
  border-left: 0;
  height: 34px;
  top: 0px;
  color: #4f8ccb; }
#maincontent-leraar .input-group-btn > button:hover,
#maincontent-leraar .input-group-btn > button:active,
#maincontent-leraar .input-group-btn > button:focus {
  background: white;
  color: #4f8ccb;
  border-color: #4f8ccb;
  -webkit-box-shadow: none;
  box-shadow: none; }
#maincontent-leraar .progress {
  /*
    Bar
  */
  /*
    Triangle
  */
  /* Lijn. nog niet perfect omdat niet in center van ding. */ }
#maincontent-leraar .progress > .bar {
  position: relative;
  float: left;
  left: 0px;
  top: 0px;
  height: 100%;
  background: #edf4ec; }
#maincontent-leraar .progress.normal > .bar {
  background: #ddf7a5;
  /* nieuwe versie */
  background: -moz-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ddf7a5), color-stop(100%, #d3d959));
  background: -webkit-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -o-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: -ms-linear-gradient(top, #ddf7a5 0%, #d3d959 100%);
  background: linear-gradient(to bottom, #ddf7a5 0%, #d3d959 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress.warning > .bar {
  background: #ffe6bf;
  background: -moz-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe6bf), color-stop(100%, #ffba19));
  background: -webkit-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -o-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: -ms-linear-gradient(top, #ffe6bf 0%, #ffba19 100%);
  background: linear-gradient(to bottom, #ffe6bf 0%, #ffba19 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress.alert > .bar {
  background: #ffd6be;
  background: -moz-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffd6be), color-stop(100%, #ed4a17));
  background: -webkit-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -o-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: -ms-linear-gradient(top, #ffd6be 0%, #ed4a17 100%);
  background: linear-gradient(to bottom, #ffd6be 0%, #ed4a17 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$topColor', endColorstr='$bottomColor',GradientType=0 ); }
#maincontent-leraar .progress > .triangle {
  position: absolute;
  float: left;
  width: 0;
  height: 0;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  border-left: 18px solid #d3d959; }
#maincontent-leraar .progress.normal > .triangle {
  border-left: 18px solid #d3d959; }
#maincontent-leraar .progress.warning > .triangle {
  border-left: 18px solid #ffba19; }
#maincontent-leraar .progress.alert > .triangle {
  border-left: 18px solid #ed4a17; }
#maincontent-leraar .progress > .line {
  position: absolute;
  height: 2px;
  top: 10px;
  left: 30px;
  right: 30px;
  background: white; }
#maincontent-leraar .progress > .ball1,
#maincontent-leraar .progress > .ball2 {
  position: absolute;
  width: 12px;
  height: 12px;
  top: 5px;
  border: 2px white solid;
  border-radius: 50%; }
#maincontent-leraar .progress > .ball1 {
  left: 30px;
  background: #FFC342; }
#maincontent-leraar .progress > .ball2 {
  right: 30px;
  background: #66FF5F; }
#maincontent-leraar .progress-square {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-right: 4px; }
#maincontent-leraar .progress-square + .progress-square {
  /* ruimte tussen cellen */
  margin-left: 10px; }
#maincontent-leraar .progress-square.nietgemaakt {
  background: white;
  border: 2px #cccccc solid; }
#maincontent-leraar .progress-square.groepenactief {
  background: orange;
  border: 2px #cccccc solid; }
#maincontent-leraar .progress-square.bezig {
  background: red;
  border: 2px #CE9400 solid; }
#maincontent-leraar .progress-square.gemaakt {
  background: #66FF5F;
  border: 2px #00C427 solid; }
#maincontent-leraar .progress-square.afwachtend {
  background: #5F9EFF;
  border: 2px #005FC4 solid; }
#maincontent-leraar .isloading-overlay {
  position: relative;
  text-align: center; }
#maincontent-leraar .isloading-overlay .isloading-wrapper {
  background: #FFFFFF;
  -webkit-border-radius: 7px;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 7px;
  -moz-background-clip: padding;
  border-radius: 7px;
  background-clip: padding-box;
  display: inline-block;
  margin: 0 auto;
  padding: 10px 20px;
  top: 35%;
  z-index: 9000; }
#maincontent-leraar .realtime_group_active {
  color: magenta;
  background-color: #D88921; }
#maincontent-leraar .tablewrap {
  /* float:left; */
  border: 2px #4f8ccb solid;
  margin-left: 10px;
  margin-right: 10px;
  border-radius: 5px;
  margin-bottom: 10px; }
#maincontent-leraar .block-6width {
  max-width: 440px; }
#maincontent-leraar .block-7width {
  max-width: 515px; }
#maincontent-leraar .block-9width {
  max-width: 665px; }
#maincontent-leraar .percent {
  max-width: 100%; }
#maincontent-leraar .floatdesktop {
  float: left; }
#maincontent-leraar .arrow-sort {
  display: inline-block;
  position: relative;
  top: 0px;
  left: 3px;
  float: none; }
#maincontent-leraar .arrow-up {
  float: left;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 6px solid #4f8ccb; }
#maincontent-leraar .arrow-up:hover {
  border-bottom: 6px solid #75b8db; }
#maincontent-leraar .arrow-down {
  float: left;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #4f8ccb; }
#maincontent-leraar .arrow-down:hover {
  border-top: 6px solid #75b8db; }
#maincontent-leraar #leerling-profiel {
  overflow: hidden;
  min-width: 300px;
  margin-right: 10px; }
#maincontent-leraar .nav-tabs > li.active > a, #maincontent-leraar .nav-tabs > li.active > a:hover, #maincontent-leraar .nav-tabs > li.active > a:focus {
  border: 2px #4f8ccb solid;
  border-bottom: 0; }
#maincontent-leraar .nav-tabs li > a {
  display: block;
  padding: 0;
  top: 1px;
  width: 130px;
  padding-left: 10px;
  height: 30px;
  line-height: 30px;
  border: 2px #4f8ccb solid;
  border-radius: 7px 7px 0 0; }
#maincontent-leraar .nav-tabs li + li > a {
  margin-left: -4px; }
#maincontent-leraar .nav-tabs li a:hover {
  border: 2px #4f8ccb solid; }
#maincontent-leraar .nav-tabs {
  border-bottom: 0; }
#maincontent-leraar .leerling-tabel tbody tr:hover {
  cursor: pointer; }
#maincontent-leraar .table-responsive table #groepdata td:hover,
#maincontent-leraar .leerling-tabel .table-responsive tbody tr:hover td {
  background-color: #97b615;
  border-color: transparent;
  background: #97b615;
  background: -moz-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #97b615), color-stop(100%, #018254));
  background: -webkit-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -o-linear-gradient(top, #97b615 0%, #018254 100%);
  background: -ms-linear-gradient(top, #97b615 0%, #018254 100%);
  background: linear-gradient(to bottom, #97b615 0%, #018254 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#97b615', endColorstr='#018254',GradientType=0 );
  /* color:white; */ }
#maincontent-leraar #leerling-profiel {
  position: relative;
  top: -1px; }
#maincontent-leraar #leerling-profiel .active > a {
  background: #f7f7f7; }
#maincontent-leraar #leerling-profiel .active > a:hover {
  background: #f7f7f7; }
#maincontent-leraar #leerling-profiel li > a {
  background: #ebecec;
  color: black; }
#maincontent-leraar #leerling-profiel li > a:hover {
  background: #cccccc; }
#maincontent-leraar #leerling-profiel-main {
  border: 2px #4f8ccb solid;
  border-radius: 0px 5px 5px 5px;
  height: 366px;
  background: #f7f7f7;
  background: -moz-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100%, #ebecec));
  background: -webkit-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -o-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -ms-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: linear-gradient(to bottom, #f7f7f7 0%, #ebecec 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#ebecec',GradientType=0 ); }
#maincontent-leraar #leerling-profiel-main > .leerling-info {
  font-size: 11px;
  position: relative;
  float: left;
  top: 10px;
  margin-left: 20px;
  margin-bottom: 15px; }
#maincontent-leraar #leerling-profiel-main > .leerling-info td {
  padding-right: 3px; }
#maincontent-leraar #leerling-profiel-rechts {
  overflow: hidden;
  width: 90px;
  float: right;
  text-align: center; }
#maincontent-leraar #leerling-profiel-rechts > img {
  float: right;
  padding: 10px; }
#maincontent-leraar #leerling-profiel-rechts > span {
  font-weight: 700; }
#maincontent-leraar #leerling-profiel-main .opmerkingen {
  margin-left: 10px;
  margin-top: 10px;
  margin-bottom: 5px;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-right: 20px; }
#maincontent-leraar #leerling-profiel-main .opmerkingen textarea {
  resize: none;
  width: 100%;
  height: 143px;
  color: #4f8ccb;
  border: 2px #4f8ccb solid; }
#maincontent-leraar #leerling-profiel-toetsen {
  border: 2px #4f8ccb solid;
  border-radius: 0px 5px 5px 5px;
  height: 366px;
  background: #f7f7f7;
  background: -moz-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100%, #ebecec));
  background: -webkit-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -o-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: -ms-linear-gradient(top, #f7f7f7 0%, #ebecec 100%);
  background: linear-gradient(to bottom, #f7f7f7 0%, #ebecec 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#ebecec',GradientType=0 ); }
#maincontent-leraar #leerling-profiel-main .bluebutton {
  margin-left: 10px;
  margin-bottom: 10px; }
#maincontent-leraar #leerling-name {
  position: relative;
  display: block;
  font-size: 1.1em;
  font-weight: 700;
  margin-left: 12px;
  margin-top: 8px; }
#maincontent-leraar #leerling-profiel-main .table-responsive {
  max-height: 323px; }
#maincontent-leraar #leerling-profiel-toetsen .table-responsive {
  max-height: 323px; }
#maincontent-leraar #leerling-profiel-main #uitslagen {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #uitslagen th {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #uitslagen .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: #f7f7f7; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang .table-responsive {
  overflow-y: auto; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang td,
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang th {
  border: 0; }
#maincontent-leraar #leerling-profiel-main #leerling-toetsvoortgang .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: #f7f7f7; }
#maincontent-leraar .floatThead-table {
  border-top: none;
  border-bottom: none;
  background-color: white; }
#maincontent-leraar #navigate-arrow-container {
  margin: 5px 10px 1px 10px; }
#maincontent-leraar #navigate-arrow-container > button {
  width: 38px;
  height: 42px; }
#maincontent-leraar #navigate-arrow-container > #arrow-left {
  float: left;
  background: url(../../img/picto_vorige.png); }
#maincontent-leraar #navigate-arrow-container > #arrow-right {
  float: right;
  background: url(../../img/picto_volgende.png); }
#maincontent-leraar #question {
  display: none;
  position: fixed;
  right: 0;
  background-image: url(../../img/routewiki.png);
  top: 100px;
  width: 45px;
  height: 130px;
  background-color: transparent;
  border: 0; }
#maincontent-leraar .table-responsive {
  font-size: 0.9em;
  padding: 0;
  max-height: 390px;
  overflow-y: hidden !important; }
#maincontent-leraar .table-responsive table {
  margin-bottom: 0;
  overflow: hidden; }
#maincontent-leraar .table-responsive table thead, #maincontent-leraar .table-responsive table tr, #maincontent-leraar .table-responsive table th, #maincontent-leraar .table-responsive table td, #maincontent-leraar .table-responsive table tbody {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  -ms-box-sizing: content-box;
  -o-box-sizing: content-box;
  box-sizing: content-box; }
#maincontent-leraar .table-responsive table thead {
  display: block;
  padding-right: 17px; }
#maincontent-leraar .table-responsive table th {
  border-left: 2px white solid;
  border-right: 2px white solid;
  height: 20px; }
#maincontent-leraar .table-responsive table td {
  display: table-cell;
  border: 2px white solid;
  height: 20px; }
#maincontent-leraar .table-responsive table tbody {
  display: block;
  height: 370px;
  overflow-y: auto;
  padding-right: 17px; }
#maincontent-leraar .table-responsive .table > thead > tr > th,
#maincontent-leraar .table-responsive .table > tbody > tr > th,
#maincontent-leraar .table-responsive .table > tfoot > tr > th,
#maincontent-leraar .table-responsive .table > thead > tr > td,
#maincontent-leraar .table-responsive .table > tbody > tr > td,
#maincontent-leraar .table-responsive .table > tfoot > tr > td {
  white-space: nowrap; }
#maincontent-leraar .table-responsive > table > thead th,
#maincontent-leraar .table-responsive > table > tbody td {
  padding: 0 6px;
  vertical-align: middle;
  overflow: hidden;
  /* font-size: 0.7em; */ }
#maincontent-leraar .table-responsive .progress {
  position: relative;
  padding: 0; }
#maincontent-leraar .floatdesktop {
  background-color: #FFF; }
#maincontent-leraar .floatThead-table thead tr th {
  font-size: 0.8em;
  border-bottom: 2px #4f8ccb solid;
  padding: 5px; }
#maincontent-leraar .min80px {
  min-width: 80px; }
#maincontent-leraar .min90px {
  min-width: 90px; }
#maincontent-leraar .min100px {
  min-width: 100px; }
#maincontent-leraar .min110px {
  min-width: 110px; }
#maincontent-leraar .min120px {
  min-width: 120px; }
#maincontent-leraar .min130px {
  min-width: 130px; }
#maincontent-leraar .min140px {
  min-width: 140px; }
#maincontent-leraar .min150px {
  min-width: 150px; }
#maincontent-leraar .min160px {
  min-width: 160px; }
#maincontent-leraar .min240px {
  min-width: 220px; }
#maincontent-leraar .min350px {
  min-width: 350px; }
#maincontent-leraar .min410px {
  min-width: 410px; }
#maincontent-leraar .width40px {
  width: 40px; }
#maincontent-leraar .width400px {
  min-width: 400px; }
#maincontent-leraar .width200px {
  width: 391px; }
#maincontent-leraar .width190px {
  width: 190px; }
#maincontent-leraar .width165px {
  width: 165px; }
#maincontent-leraar .width150px {
  width: 150px; }
#maincontent-leraar .width127px {
  width: 127px; }
#maincontent-leraar .width129px {
  width: 129px; }
#maincontent-leraar .width120px {
  width: 120px; }
#maincontent-leraar .width110px {
  width: 110px; }
#maincontent-leraar .width100px {
  width: 100px; }
#maincontent-leraar .width80px {
  width: 80px; }
#maincontent-leraar .width64px {
  width: 64px; }
#maincontent-leraar .width20px {
  width: 20px; }

/* ------ Maincontent leraar buttons --------------------- */
#maincontent-leraar .home {
  background: url(../../img/avision_home_passief.png); }

#maincontent-leraar .home:hover {
  background: url(../../img/avision_home_mouseover.png); }

#maincontent-leraar .home:active {
  background: url(../../img/avision_home_actief.png); }

#maincontent-leraar .home-active {
  background: url(../../img/avision_home_actief.png); }

#maincontent-leraar .klassen {
  background: url(../../img/avision_klassen_passief.png); }

#maincontent-leraar .klassen:hover {
  background: url(../../img/avision_klassen_mouseover.png); }

#maincontent-leraar .klassen:active {
  background: url(../../img/avision_klassen_actief.png); }

#maincontent-leraar .klassen-active {
  background: url(../../img/avision_klassen_actief.png); }

#maincontent-leraar .leerlingen {
  background: url(../../img/avision_leerlingen_passief.png); }

#maincontent-leraar .leerlingen:hover {
  background: url(../../img/avision_leerlingen_mouseover.png); }

#maincontent-leraar .leerlingen:active {
  background: url(../../img/avision_leerlingen_actief.png); }

#maincontent-leraar .leerlingen-active {
  background: url(../../img/avision_leerlingen_actief.png); }

#maincontent-leraar .groepen {
  background: url(../../img/avision_groepen_passief.png); }

#maincontent-leraar .groepen:hover {
  background: url(../../img/avision_groepen_mouseover.png); }

#maincontent-leraar .groepen:active {
  background: url(../../img/avision_groepen_actief.png); }

#maincontent-leraar .groepen-active {
  background: url(../../img/avision_groepen_actief.png); }

#maincontent-leraar .toetsen {
  background: url(../../img/avision_toetsen_passief.png); }

#maincontent-leraar .toetsen:hover {
  background: url(../../img/avision_toetsen_mouseover.png); }

#maincontent-leraar .toetsen:active {
  background: url(../../img/avision_toetsen_actief.png); }

#maincontent-leraar .toetsen-active {
  background: url(../../img/avision_toetsen_actief.png); }

#maincontent-leraar .realtime {
  background: url(../../img/avision_realtime_passief.png); }

#maincontent-leraar .realtime:hover {
  background: url(../../img/avision_realtime_mouseover.png); }

#maincontent-leraar .realtime:active {
  background: url(../../img/avision_realtime_actief.png); }

#maincontent-leraar .realtime-active {
  background: url(../../img/avision_realtime_actief.png); }

#maincontent-leraar .planning {
  background: url(../../img/avision_planning_passief.png); }

#maincontent-leraar .planning:hover {
  background: url(../../img/avision_planning_mouseover.png); }

#maincontent-leraar .planning:active {
  background: url(../../img/avision_planning_actief.png); }

#maincontent-leraar .planning-active {
  background: url(../../img/avision_planning_actief.png); }

#maincontent-leraar .rooster {
  background: url(../../img/avision_rooster_passief.png); }

#maincontent-leraar .rooster:hover {
  background: url(../../img/avision_rooster_mouseover.png); }

#maincontent-leraar .rooster:active {
  background: url(../../img/avision_rooster_actief.png); }

#maincontent-leraar .rooster-active {
  background: url(../../img/avision_rooster_actief.png); }

#maincontent-leraar .rapportage {
  background: url(../../img/avision_rapportage_passief.png); }

#maincontent-leraar .rapportage:hover {
  background: url(../../img/avision_rapportage_mouseover.png); }

#maincontent-leraar .rapportage:active {
  background: url(../../img/avision_rapportage_actief.png); }

#maincontent-leraar .rapportage-active {
  background: url(../../img/avision_rapportage_actief.png); }

@media (max-width: 767px) {
  #maincontent-leraar .table-responsive {
    width: auto; }
  #maincontent-leraar > #page-links {
    margin-right: 0; }
  #maincontent-leraar .zoeken {
    margin-left: 10px;
    margin-bottom: 40px; }
  #maincontent-leraar .floatdesktop {
    float: none; }
  #maincontent-leraar .table-responsive {
    margin-bottom: 0;
    overflow-y: scroll;
    overflow-x: auto;
    /* -ms-overflow-style: none; */
    border: 0px solid #ddd;
    -webkit-overflow-scrolling: touch; } 
}

.modal-dialog > .modal-content {
  border-radius: 10px;
  background: #F3F3F3;
  border: 2px #555555 solid;
  text-align: center;
  padding-top: 15px;
  padding-bottom: 5px;
  overflow: auto; }

.modal-header {
  font-size: 1.6em;
  text-align: center;
  padding: 0;
  margin: 0;
  padding-bottom: 4px;
  margin-left: 22px;
  margin-right: 22px;
  border-bottom: 1px #8E9391 solid; }

.modal-header h3 {
  margin: 0;
  padding: 0;
  font-size: 1em; }

.modal-body {
  padding-bottom: 0;
  padding-top: 10px;
  padding-left: 22px;
  padding-right: 22px;
  min-height: 200px;
  max-height: 460px;
  overflow-y: auto;
  text-align: left; }

.small .modal-body {
  min-height: 100px; }


.alert {
  margin-bottom: 10px; }

.modal-body #toetsbron,
.modal-body #toetsdest {
  height: 150px; }

.modal-dialog {
  margin: 50px auto;
  /* margin:0 auto; /* remove this if script wont work */
  margin-bottom: 0;
  max-width: 900px; }

.modal-dialog.width800 {
  max-width: 800px; }

.modal-dialog.width1024 {
   min-width: 1024px; 
}

.modal-dialog.width900 {
  max-width: 900px;
}

.height150 {
  height: 150px;
  min-height: 150px;
  max-height: 150px;
}

.height630 {
  width:800px; 
  height:630px;
  left:50%;
  margin-left:-300px;
}

.height300 {
  width:800px; 
  height:300px;
  left:50%;
  margin-left:-300px;
}

.modal-content .error{
  color:red;
  font-weight: bold;
  display:inline-block
}

@media (min-width: 800px) {
  .modal-dialog.width800 {
    width: 800px;
  }
}

@media (min-width: 900px) {
  .modal-dialog.width900 {
    width: 900px;
  }
}

@media (max-width: 850px) {
  .modal-dialog {
    width: 95%; }

  .modal.psycholoog .modal-dialog {
    width: auto; } }

@media (max-width: 900px) {
  .modal-dialog {
    width: 95%;
  }
}




.modal-content {
  border-radius: 0;
  position: relative; }

.modal-header {
  border: 0;
  font-weight: 700; }

.modal-body {
  font-weight: 700;
  width: 100%; }

.modal-footer {
  border: 0;
  margin: 0;
  padding-top: 5px;
  padding-bottom: 5px;
  font-weight: 700; }

.modal-footer span {
  font-style: italic; }

.modaltextblock {
  clear: both;
  font-weight: 700;
  float: left;
  display: inline-block;
  margin-bottom: 10px;
  width: 300px; }

.modalicon {
  float: left;
  margin-bottom: 10px;
  margin-right: 45px;
  width: 130px;
  height: 130px;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important; }

/* modalknoppen */
.modal-body .voeg-toe {
  width: 35px;
  height: 35px;
  background-image: url(../../img/35px/voegtoe_35px_passief.png);
  cursor: pointer; }

.modal-body .voeg-toe:hover {
  background-image: url(../../img/35px/voegtoe_35px_hover.png); }

.modal-body .btn {
  margin-right: 5px; }

.modal-body .verwijder {
  width: 35px;
  height: 35px;
  background-image: url(../../img/35px/verwijder_35px_passief.png);
  cursor: pointer; }

.modal-body .verwijder:hover {
  background-image: url(../../img/35px/verwijder_35px_hover.png); }

/* ontwikkelingsperspectief plan opp opp-plan */
.modal.op-plan .modal-body {
  padding-top: 0;
  height: 752px; }

.modal.op-plan .wizard {
  font-size: 0.85em; }

.modal.op-plan .tableg {
  border-collapse: separate;
  border-spacing: 4px; }

.modal.op-plan .tableg tr:first-child td {
  border-radius: 8px 8px 0 0; }

.modal.op-plan .tableg tr:last-child td:first-child {
  border-radius: 0 0 0 8px; }

.modal.op-plan .tableg tr:last-child td:last-child {
  border-radius: 0 0 8px 0; }

.modal.op-plan .tableg td {
  background: #dddddd;
  padding: 3px; }

.modal.op-plan input[type="text"] {
  padding-left: 2px; }

.modal.op-plan .tableg input[type="text"] {
  width: 80px;
  padding-left: 2px; }

.modal.op-plan .tableg textarea {
  resize: none; }

.modal.op-plan .wizard td {
  vertical-align: top; }

.modal.op-plan .wizard tr td:first-child {
  text-align: right;
  padding-right: 5px; }

.modal.op-plan .wizard tr td.align-left {
  text-align: left; }

.modal.op-plan .wizard input {
  height: 18px;
  border: 1px #cccccc solid;
  margin: 2px; }

.modal.op-plan .wizard textarea {
  border: 1px #cccccc solid; }

.modal.op-plan .wizard > .titel h4 {
  margin: 5px 0; }

.modal.op-plan .wizard > .titel h5 {
  margin-top: -4px;
  margin-bottom: 4px; }

.modal.op-plan .wizard > .subtitel h6 {
  font-weight: 700; }

.modal.op-plan .wizard > .data {
  margin-left: 15px; }

.modal.op-plan .data.up {
  margin-top: -15px; }

.modal.op-plan .doublures .titles > div {
  display: inline-block;
  border: 0;
  border-style: solid;
  border-bottom-width: 2px; }

.modal.op-plan .doublures .titles .groep {
  width: 155px;
  border-color: #cbcbcb; }

.modal.op-plan .doublures .titles .leerjaar {
  width: 80px;
  border-color: #a0a0a0; }

.modal.op-plan .doublures .lijst > div {
  display: inline-block;
  text-align: center; }

.modal.op-plan .doublures .lijst .up {
  margin-top: -7px; }

.modal.op-plan input.naam {
  width: 120px; }

.modal.op-plan input.telefoon {
  width: 120px; }

.modal.op-plan input.e-mail {
  width: 120px; }

.modal.op-plan .vak-td {
  position: relative; }

.modal.op-plan .wizard .tableg .nieuw-vak {
  width: 120px; }

.modal.op-plan .verwijder-rij {
  position: absolute;
  bottom: 5px;
  left: 0;
  color: red;
  border: 0;
  background: transparent; }

.modal.op-plan .verwijder-rij:hover {
  text-decoration: underline; }

.modal.op-plan .tableg.fullWidthText input[type="text"] {
  width: 100%; }

.modal.op-plan .tableg.fullWidthText td {
  padding-right: 6px; }

/* datepicker */
.modal.op-plan .datepicker {
  display: inline-block; }

.modal.op-plan .pagina1 {
  display: none; }

.modal.op-plan .pagina2 {
  display: none; }

.modal.op-plan .pagina3 {
  display: none; }

.modal.op-plan .pagina4 {
  display: none; }

.modal.op-plan .pagina5 {
  display: none; }

.modal.op-plan .pagina6 {
  display: none; }

.modal.op-plan .pagina7 {
  display: none; }

.modal.op-plan .pagina8 {
  display: none; }

.modal.op-plan .pagina9 {
  display: none; }

.modal.op-plan .modal-footer {
  height: 40px; }

.modal.op-plan .modal-footer .vorige {
  float: left; }

.modal.op-plan .modal-footer .volgende {
  float: right; }

/* collega's modal */
.collegas-modal .modal-content .collega {
  display: inline-block;
  width: 70px;
  height: 70px;
  background-size: 100% !important;
  margin: 5px;
  border-radius: 5px;
  border: 2px #4f8ccb solid;
  /* border:2px #777777 solid; */ }
.collegas-modal .modal-content .collega .hover {
  width: 66px;
  height: 66px;
  border: 2px transparent solid;
  border-radius: 2px; }
.collegas-modal .modal-content .collega:hover .hover {
  background: #ffffff;
  opacity: 0.4;
  cursor: pointer; }
.collegas-modal .collegas-modal .modal-footer {
  display: none; }

/* ROUTE8EDEX modal */
.route8edex-modal .modal-content {
  padding: 10px;
  margin: 0 10px;
  border: 0;
  text-align: left !important; }

/* SOMtoday modal */
.somtoday-modal .modal-content {
  padding: 10px;
  margin: 0 10px;
  border: 0;
  text-align: left !important; }

/* indigo modal */
.indigo-modal .modal-dialog {
  width: 1200px;
  max-width: 1200px;
}

.indigo-modal .modal-content {
  padding:10px;
  margin:0 10px;
  border:0;
  text-align:left !important;
}

.indigo-modal #melding{
  color: red;
  font-weight: bold;
}

.indigotab {
  height: 610px;
  width: 100%;
}

.indigotab td:first-child {
  width: 150px;
}

#indigobijlage img {
  width: 20px;
}

#indigobijlage #dropcontainer {
  background-color: #2E3134;
  color: #4f4f4f;
  margin-top: 10px;
}

#indigobijlage #drop {
  padding: 40px 50px;
  border: 20px solid rgba(0, 0, 0, 0);
  border-radius: 3px;
  border-image: url('../../img/fileupload/border-image.png') 25 repeat;
  text-align: center;
  font-size:16px;
  font-weight:bold;
  color:#7f858a;
}

#indigobijlage #drop a{
  background-color:#007a96;
  padding:12px 26px;
  color:#fff;
  font-size:14px;
  border-radius:2px;
  cursor:pointer;
  display:inline-block;
  margin-top:12px;
  line-height:1;
}

#indigobijlage #drop a:hover{
  background-color:#0986a3;
}

#indigobijlage #drop input{
  display:none;
}

#indigobijlage .indigobijlage-scroll {
    height: 553px;
    overflow: auto;
    margin-top: 10px;
}

#dropcontainer #droppedfiles {
  list-style:none;
  border-top:1px solid #2b2e31;
  border-bottom:1px solid #3d4043;
  margin: 0;
  padding: 0;
  max-height: 200px;
  overflow: auto;
}

#dropcontainer ul li{
  background-color:#333639;

  background-image:-webkit-linear-gradient(top, #333639, #303335);
  background-image:-moz-linear-gradient(top, #333639, #303335);
  background-image:linear-gradient(top, #333639, #303335);

  border-top:1px solid #3d4043;
  border-bottom:1px solid #2b2e31;
  padding:15px;
  height: 70px;

  position: relative;
}

#dropcontainer ul li input{
  display: none;
}

#dropcontainer ul li p{
  width: auto;
  overflow: hidden;
  white-space: nowrap;
  color: #EEE;
  font-size: 16px;
  font-weight: bold;
  position: absolute;
  top: 20px;
  left: 100px;
}

#dropcontainer ul li i{
  font-weight: normal;
  font-style:normal;
  color:#7f7f7f;
  display:block;
}

#dropcontainer ul li canvas{
  top: 15px;
  left: 32px;
  position: absolute;
}

#indigobijlage #upload ul li span{
  width: 15px;
  height: 12px;
  background: url('../../img/fileupload/icons.png') no-repeat;
  position: absolute;
  top: 34px;
  right: 33px;
  cursor:pointer;
}

#indigobijlage #upload ul li.working span{
  height: 16px;
  background-position: 0 -12px;
}

#dropcontainer #droppedfiles .error p {
    color: red;
}

.indigoknoppen {
  position: fixed;
  bottom: 5px;
}

.indigoknoppen button {
  width: 200px;
}

#indigoladen img {
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
}

/* --------------------- */
/* leerlingprofiel modal */
/* --------------------- */
.leerlingprofiel-modal {
  padding-left: 95px;
  padding-right: 95px;
  padding-top: 60px;
  padding-bottom: 65px;
  overflow-y: auto; }

.leerlingprofiel-modal .modal-dialog {
  position: relative;
  max-width: 100%;
  width: 100%;
  height: 100%;
  margin: 0; }

.leerlingprofiel-modal .modal-dialog .modal-content {
  width: 100%;
  height: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 6px;
  border: 2px #4f8ccb solid;
  overflow: auto; }

.leerlingprofiel-modal .modal-content .modal-header {
  padding: 0;
  margin: 0 10px;
  border: 0;
  text-align: left; }

.leerlingprofiel-modal .modal-content #myModalLabel {
  color: #4f8ccb;
  font-size: 0.8em; }

.leerlingprofiel-modal .modal-content .info-tabellen table td {
  padding-left: 10px;
  white-space: nowrap;
  background: white; }

.leerlingprofiel-modal .modal-content .info-tabellen div:nth-child(1) {
  padding-left: 10px; }

.leerlingprofiel-modal .modal-content .info-tabellen table td:nth-child(1),
.leerlingprofiel-modal .modal-content .info-tabellen table td:nth-child(3) {
  font-weight: 700; }

.leerlingprofiel-modal .modal-content .info-tabellen table td:nth-child(1) {
  padding-left: 0; }

.leerlingprofiel-modal .modal-content .info-tabellen table {
  text-align: left; }

.leerlingprofiel-modal .modal-content .nav-tabs {
  border-bottom: 2px #4f8ccb solid;
  margin-top: 5px;
  padding-bottom: 1px; }

.leerlingprofiel-modal .modal-content .nav-tabs a {
  text-align: left;
  font-weight: 700;
  font-size: 10px;
  padding: 10px 15px;
  line-height: 0px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  border: 0;
  margin: 0;
  margin-top: 3px;
  background: #F1F0F1; }
.leerlingprofiel-modal .modal-content .nav-tabs a:hover, .leerlingprofiel-modal .modal-content .nav-tabs a:focus {
  border: 0;
  background: #dedede;
  outline: none; }

.leerlingprofiel-modal .modal-content .nav-tabs li:first-child a {
  border-left: 0; }

.leerlingprofiel-modal .modal-content .nav-tabs .active a {
  border: 0;
  background: #4f8ccb;
  color: #ffffff; }

/* psycholoog modal */
.modal.psycholoog .modal-body {
  min-height: 60px; }

.modal.psycholoog .modal-dialog {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -150px;
  margin-top: -82px; }

/* Testbegeleider modal */

.modal.testbegeleider .modal-body {
min-height: 60px; }

.modal.testbegeleider .modal-dialog {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
margin-left: -150px;
margin-top: -82px; }

.modal.psycholoog .buttonwrap {
  position: absolute;
  bottom: 0;
  right: 10px; }

/* bewerk groep modal */
#bewerk-groep-modal .form-control {
  border: 1px solid #cccccc;
  height: inherit; }

#bewerk-groep-modal .btn {
  margin-right: 0px; }

#bewerk-groep-modal .btn-primary {
  color: white;
  border: 1px solid #cccccc; }

#bewerk-groep-modal .btn-primary:hover {
  background-color: #3277b3; }

#bewerk-groep-modal .btn-primary:active {
  background-color: #275d8c; }

#bewerk-groep-modal .btn-primary:focus {
  background-color: #275d8c; }

#bewerk-groep-modal .input-group-btn > button {
  border: 1px solid #cccccc; }

/* Brin */
.brin {
  background-image: url(../../img/130px/avision_brin_130px_passief.png); }

.brin:hover {
  background-image: url(../../img/130px/avision_brin_130px_mouseover.png); }

.handmatig {
  background-image: url(../../img/130px/avision_handmatig_130px_passief.png); }

.handmatig:hover {
  background-image: url(../../img/130px/avision_handmatig_130px_mouseover.png); }

.questionbutton {
  position: absolute;
  right: 30px;
  bottom: 30px; }

.row {
  line-height: 30px; }

.row input {
  width: 100%;
  padding-left: 3px;
  float: left;
  background: #eeeeee;
  height: 30px;
  border: 0;
  margin-bottom: 5px; }

.width100percent {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}

.modalplus {
  padding-left: 0; }

.modalsavebtn {
  padding: 0; }

@media (max-width: 940px) {
  #maincontent-beheerder,
  #maincontent-leerling,
  #maincontent-ondertekenen,
  #maincontent-swv {
    left: 5px;
    right: 5px; }

  .layout-beheerders, .layout-leerling {
    left: 5px !important;
    right: 5px !important; }

  .maincontent-beheer {
    left: 5px;
    right: 5px; }

  .leerlingprofiel-modal {
    padding-left: 10px;
    padding-right: 10px; }

  #wrapper > #currentpage {
    margin-left: 10px; }

  /* -- [ leerling testen padding ] -- */
  .leerling-toets-tabel .inner {
    position: relative;
    margin-left: 28px;
    margin-right: 28px;
    margin-top: 20px;
    margin-bottom: 20px; }

  .leerling-toets-tabel .inner.helptool-fullscreen-margin {
    margin-left: 60px;
  }

  .tts-player {
    margin-top: 40px;
  }

  #scrollbar-arrow {
    left: 3px; } }
#raponderteken img {
  padding: 2px; }

#raponderteken img.nogniks {
  background-color: #FB8080; }

#raponderteken img.psycholoog {
  background-color: #FAFB80; }

#raponderteken img.goedgekeurd {
  background-color: #80FBEB; }

#raponderteken img.wachtonderteken {
  background-color: #8EFE8E; }

#raponderteken img.ondertekend {
  background-color: #40D040; }

#raponderteken img.verzonden {
  background-color: #2CA52C;
  cursor: pointer;
  height: 27px; }

#raponderteken img.nietverzonden {
  cursor: pointer;
  height: 27px; }

.testbegeleider {
  color: blue; }

/* EDEX */
#fileUploadIndicator.glyphicon-ok {
  color: #00ff00; }

#fileUploadIndicator.glyphicon-remove {
  color: #ff0000; }

table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after {
  content: " ▴▾"; }

th.headerSort:not(.sorter-false) {
  cursor: pointer; }

th.tablesorter-headerUnSorted:not(.sorter-false) > div:after {
  content: '\25B4\25BE'; }

th.tablesorter-headerAsc > div:after {
  content: '\25B4'; }

th.tablesorter-headerDesc > div:after {
  content: '\25BE'; }

/***** Test - MITT *****/
input[type="range"] {
  min-width: 100px; }

/***** Test - Begrijpend Lezen *****/
#divBLText1Col {
  background: #f8f8f8;

  /* overwrites */
  padding: 10px;
  overflow: auto !important;
}

#divBLText1Col + hr {
  margin: 0;
  border-top: 2px solid #dbdbdb;
  margin-bottom: 10px;
}

#divBLText1Col tr td {
  vertical-align: top; }

#divBLText1ColMain tr td {
  vertical-align: top; }

/***** Test - Rekenen *****/
span.breuk {
  line-height: 2em;
  vertical-align: -20%; }

table.breuk {
  display: inline-table; }

table.breuk tr td {
  min-width: 10px;
  text-align: center; }

table.breuk tr.top td {
  border-collapse: collapse;
  border-bottom: 1px solid #000; }

/***** ReadSpeaker *****/
.rsbtn_dl {
  display: none !important; }

.rsbtn.rspopup {
    display: none !important;
}

/* leerling profiel modal */
.leerlingprofiel-modal .nav.nav-tabs .niet-aanwezig a {
  background: white; }

#vraaghelpmodal .modal-dialog {
  max-width: 90%;
  width: 90%; }



#vraaghelpmodal .modal-body {
  font-weight: 400;
}

#uitlogModal .modal-dialog,
#checkModal .modal-dialog {
  max-width: 600px;
}

#uitlogModal .modal-body,
#checkModal .modal-body {
  min-height: 100px;
  font-weight: 400;
}



#vraaghelpmodal .labelborder,
.leerling-toets-tabel .labelborder {
  border: 1px #dddddd solid; }
#gauge-wrap {
  position: absolute;
  bottom: 60px;
  left: 50%;
  margin-left: -81px;
  padding: 5px;
  border: 1px #cccccc solid; }

.tekst {
text-align: center; }

.rapportage-overzicht-testbegeleider {
  width: 100%;
}

.rapp-wrap2.rapp-o-testbegl {
  padding-bottom: 21px;
}
.rapportage-overzicht-testbegeleider .rapp-table {
  width: 100%;
}


/* realtime */
.layout-leerling .stripes2a tr:nth-child(odd) {
  background-color: #F0F0F0;
}

.layout-leerling .stripes2a tr:nth-child(even) {
  background-color: #FAFAFA;
}

.layout-leerling .progress8 {
  background:-webkit-linear-gradient(left, #FFF 0%, transparent 0%);
}

.layout-leerling .rood {
  background-color:#ed4a17 !important;
}

.layout-leerling .rood>td {
  color:white;
}
.layout-leerling .rood button {
  color: #333333;
}

.layout-leerling .oranje {
  background-color:#ffba19 !important;
}

.layout-leerling #realtime .paused {
  padding: 0;
  width: 29px;
  height: 21px;
}


/* IBO Contactpersoon (26) */
#tblIBOcontactpersoon .achternaam,
#tblIBOcontactpersoon .achternaam input {
  width: 200px;
}
#tblIBOcontactpersoon .roepnaam,
#tblIBOcontactpersoon .roepnaam input {
  width: 100px;
}
#tblIBOcontactpersoon .voorvoegsel,
#tblIBOcontactpersoon .voorvoegsel input {
  width: 80px;
}
#tblIBOcontactpersoon .emailadres,
#tblIBOcontactpersoon .emailadres input {
  width: 300px;
}

.tablenoheader{width:100%;}
.h3inline h3{display:inline;}/* h3 komt voor bij AOB Compaz antwoorden*/

td.pad5{padding:.5em}


/* lightbox voor testen */
.lightbox-modal {
  text-align: center;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.lightbox-modal .modal-dialog {
  width: auto;
  max-width: 85%;
  margin: 0 auto;
  display: inline-block;
  vertical-align: top;
}

.lightbox-modal .modal-content {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
}

.lightbox-modal .modal-header {
  padding: 0;
  margin: 0 10px;
}

.lightbox-modal .modal-header .close {
  color: white;
  opacity: 1;
  font-size: 30px;
  text-shadow: none;
}

.lightbox-modal .modal-body {
  display: inline-block;
  vertical-align: top;
  width: auto;
  max-height: none;
  padding: 0;
  border-radius: 10px;
  border: 7px solid white;
  background: #F3F3F3;
  min-width: 200px;
}

.lightbox-modal img.full-width {
  width: 1000px;
}

.lightbox-modal img {
  max-height: calc(100vh - 60px);
}

.lightbox-modal.small .modal-body {
  padding: 10px;
}

.image-lightbox-open:hover {
  cursor: zoom-in;
}
.btn-routewijs,
.btn-routewijs:active,
.btn-routewijs:focus {
  background-color: #75b8db;
  color: #F3F3F3;
}
.btn-routewijs:hover{
  background-color: #75b8db;
  color: #232323;
}
.pie-chart circle {
  transition: stroke-dasharray 1s linear;
}

/*** Evaluatie test Socials ***/

.sr-only {
    clip: rect(0 0 0 0); 
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap; 
    width: 1px;
}

.inline-block {
    display:inline-block;
}
.inline-center {
    text-align: center;
}

.inputfieldSuffix, .inputfieldPrefix {
  display: inline-block;
  min-width: 25pt;
  font-size: 11pt;
}
.inputfieldSuffix {
  text-align: left;
  padding-left: 5pt;
}
.inputfieldPrefix {
  text-align: right;
  padding-right: 5pt;
}
#divBLText1ColMain table tr td ul, #divBLText1Col table tr td ul{
  margin-top: 0;
  padding-top: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}
#divBLText1ColMain table tr td ul li.invisible-bullet, #divBLText1Col table tr td ul li.invisible-bullet{
  list-style: none;
}

/* Disable text select tts-player, tts-dialog and tts-subtitles */
.tts-player,
.tts-dialog.tts-dialog-settings,
.tts-subtitles {
  user-select: none;
  -webkit-user-select: none;
}


/* colors for base grey version */
table.base {
  border-collapse: collapse;
  padding: 0;

  --th-bg: #777777;
  --th-color: white;
  --th-column-bg: #c1c1c1;
  --th-column-color: black;
  --td-border: #afafaf;
  --zebra-bg: #d8d8d8;
}
table.base th,
table.base td {
  padding: 3px 6px;
  border: 1px solid var(--td-border);
}
table.base th {
  text-align: left;
  background: var(--th-bg);
  border-color: var(--th-bg);
  color: var(--th-color);
}
table.base th.centered {
  text-align: center;
}

table.base td {
  border-color: var(--td-border);
}

table.base.zebra tbody:nth-child(1) tr:nth-child(even) td,
table.base.zebra thead+tbody tr:nth-child(odd) td {
  background: var(--zebra-bg);
}

table.base tr:nth-child(n+2) th,
table.base thead+tbody th {
  background: var(--th-column-bg);
  color: var(--th-column-color);
}


table.base.zebra tbody:nth-child(1) tr:nth-child(n+2):nth-child(odd) th,
table.base.zebra thead+tbody tr:nth-child(even) th {
  background: var(--zebra-bg);
  border-bottom-color: var(--th-bg);
}


/* redefine colors for blue version */
table.base.blue {
  --th-bg: #6283b9;
  --th-color: white;
  --th-column-bg: #b2c2dd;
  --th-column-color: black;
  --td-border: #9cb1d3;
  --zebra-bg: #d0d9ea;
}


/* col1bold code */
table.col1bold tr td:nth-child(1) {
  font-weight: 700;
}

.v-spacer { height: 32px; }

/* Reading texts styling */
.reading-text-base {}

.reading-text-base > .reading-text-table{
  border-collapse: collapse;
  border-spacing: 0;
}

.reading-text-base br.rs_pause {
  content: "";
  display: none;
}

.reading-text-base ul {
  margin: 0;
}
.reading-text-base ul.is-first-listitem-line {
  margin-top: 10px;
}
reading-text-table ul.is-first-listitem-line {
  margin-top: 0;
}
.reading-text-base h1,
.reading-text-base h2,
.reading-text-base h3,
.reading-text-base h4,
.reading-text-base h5,
.reading-text-base strong {
  color: #2e6684;
}
