@font-face {
  font-family: LatoR;
  src: url('fonts/lato_regular.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: LatoB;
  src: url('fonts/lato_bold.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: CatamaranM;
  src: url('fonts/catamaran_medium.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: RobotoR;
  src: url('fonts/roboto_regular.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: RobotoI;
  src: url('fonts/roboto_italic.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: RobotoM;
  src: url('fonts/roboto_medium.ttf') format('truetype');
  font-style: normal;
}
@font-face {
  font-family: RobotoB;
  src: url('fonts/roboto_bold.ttf') format('truetype');
  font-style: normal;
}

html, body {
  margin: 0;
  padding: 0;
}
body {
  background-color: #ebeef4;
  font-family: LatoR, sans-serif;
  font-size: 14px;
  font-weight: normal;
  color: #464646;
  min-width: 300px;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
*:focus {
  outline:none !important
}
#wrapper {
  background-color: #ebeef4;
  width: 100%;
  height: 100%;
  margin: 80px 0 0 0;
  padding: 30px 0 0 0;
}
h1, h2, h3, h4, h5 {
  font-family: CatamaranM, LatoR, sans-serif;
  font-weight: normal;
}
h1 {
  font-size: 26px;
}
h2 {
  font-size: 22px;
}
h3 {
  font-size: 20px;
}
h4 {
  font-size: 18px;
}
h5 {
  font-size: 17px;
}
a {
  text-decoration: none;
}
img {
  border: none;
}
iframe.captivate{
  border: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
#cpDocument .cpMainContainer{
  background-color: #d5d5d5;
}
#project_container{
  box-shadow: 0 0 7px #909090;
}
#returner{
  background-color: #ffffff;
  border: 2px solid #00a0e6;
  color: #a0d246;
  font-family: LatoB, sans-serif;
  text-decoration: none;
  cursor: pointer;
  padding: 5px;
}
.voucherTable{
  border-spacing:0;
    border-collapse:collapse;
}
.paging{
  border: 1px black solid;
  background-color: #ffffff;
  margin: 2px 3px;
  padding: 2px 0px;
  text-decoration: none;
  color: #000000;
  display: inline-block;
  width: 30px;
  text-align: center;
  font-family: LatoB, sans-serif;
  font-size: 0.8em;
}
.paging:hover{
  background-color: #00a0e6
}
.feedback, .feedback2 {
  display: inline-block;
  background-color: #576b96;
  border: 0;
  border-radius: 2px;
  line-height: 25px;
  color: #ffffff;
  min-height: 26px;
  margin: 10px 0 0 0;
  padding: 3px 13px;
}
.feedback2{
  margin: 25px 0 10px 0;
}
.crumbs{
  top: 96px;
  position: absolute;
  margin-bottom: -20px;
  padding-left: 2px;
  color:#529dba;
  font-weight: normal
}
.crumbs a{
  text-decoration: none;
  color:#529dba;
}
a.back{
  display: block;
  background-color: #fff;
  border: solid 1px #529dba;
  color: #529dba;
  font-family: LatoB, sans-serif;
  margin: 30px auto;
  padding: 2px 15px 4px 15px;
  text-align: center;
  width: 60px;
  text-decoration: none;
}
table.login, table.voucherlogin{
  margin: 40px auto;
}
table.login input.button, table.voucherlogin input.button{
  float: right;
  margin: 10px 0 0 0!important;
}
table.login .voucher_recover_div a {
  font-size: 0.9em;
  color: #1ebefa;
}
.newtest {
  font-family: "Segoe UI", "Trebuchet MS", sans-serif;
  font-size: 14px;
}
#mccontentvid1 {
  display: inline-block;
  width: 155px;
  min-height: 600px;
  padding: 0 0 0 30px;
  overflow: hidden;
}
#mccontentvid2 {
  display: inline-block;
  width: 575px;
  text-align: center;
  padding: 0;
  overflow: hidden;
}
#mccontent1b, #mccontent2b {
  display: inline-block;
  width: 48%;
  text-align: center;
  vertical-align: top;
  padding: 0;
  overflow: hidden;
}
#mccontent2b {
  padding: 0 0 0 10px;
}
#mccontent3 {
  display: inline-block;
  width: 100%;
  max-width: 800px;
  padding: 0;
  overflow: hidden;
}
.verzamel1, #content .verzamel2 {
  min-height: 0 !important;
  margin-bottom: 40px !important;
}
#content .portal_text {
  padding: 0;
}
#error{
  background-color: #ffffff;
  border-bottom: solid 5px #a0d246;
  text-align: center;
  min-height: 425px;
  overflow: hidden;
  padding: 50px;
}
.vanilla{
  cursor:url(../layout/zoom.png),url(../layout/zoom.cur),pointer;
}
.clear{
  clear: both;
  height: 0;
  padding: 0;
  margin: 0;
}
.wspace{
  width: 100%;
  height: 20px;
}
input.text{
  width: 210px;
  height: 20px;
  border: solid 1px #529dba;
}
input.button{
  background: url(../layout/ok.png) no-repeat scroll 0 0 transparent;
  border: 0 none;
  font-size: 1em;
  color: #ffffff;
  height: 48px;
  width: 48px;
  margin-bottom: 30px;
  cursor: pointer;
}
input.next2{
  background: url(../layout/blue_next.png) no-repeat scroll 0 0 transparent;
  border: 0 none;
  font-size: 1em;
  color: #ffffff;
  height: 48px;
  width: 48px;
  margin-bottom: 30px;
  cursor: pointer;
}
input[type="radio"]{
  margin-bottom: 15px;
}
/*
.reset{
  float: right;
  margin-left: 50px;
  background:url(../layout/reset.png) no-repeat;
  border: 0px;
  width: 48px;
  height: 48px;
  cursor: pointer;
}
*/
#score{
  width: 100%;
  text-align: center;
  font-size: 40px;
  font-family: LatoB, sans-serif;
  margin: 20px 0 25px 0;
}
select.blue{
  border: solid 1px #a5a5a5;
  height: 22px;
  width: auto;
}
select.blue2{
  border: solid 1px #a5a5a5;
  height: 22px;
  width: 47px;
}
select.text{
  border: solid 1px #a5a5a5;
  height: 22px;
  width: 212px;
}
#mccontent3 select.blue2 {
  border-radius: 2px;
  margin-top: 10px;
}

a img{border-width: 0px;}
a.tooltip{outline:none; margin-right: 15px;}
a.tooltip strong{line-height:30px;}
a.tooltip:hover{text-decoration:none;}
a.tooltip span{ z-index:10;display:none; padding:5px 0px; margin-top:-40px; margin-left:-73px; width:123px; height: 20px; line-height:16px; text-align: center}
a.tooltip:hover span{ display:inline; position:absolute; color:#EEE; background: url(../layout/tooltip.png) repeat-x 0 0; }
.callout{z-index:20;position:absolute;border:0;top:30px;left:56px;}
a.tooltip span{opacity: 1; font-weight: normal;}
a.tooltip_wide{outline:none; margin-right: 20px;}
a.tooltip_wide strong{line-height:30px;}
a.tooltip_wide:hover{text-decoration:none;}
a.tooltip_wide span{ z-index:10;display:none; padding:5px 0px; margin-top:-40px; margin-left:-93px; width:163px; height: 20px; line-height:16px; text-align: center}
a.tooltip_wide:hover span{ display:inline; position:absolute; color:#EEE; background: url(../layout/tooltip.png); }
.callout_wide{z-index:20;position:absolute;border:0;top:30px;left:76px;}
a.tooltip_wide span{opacity: 1; font-weight: normal;}
a.tooltip_big{outline:none; margin-right: 20px;}
a.tooltip_big strong{line-height:30px;}
a.tooltip_big:hover{text-decoration:none;}
a.tooltip_big span{ z-index:10;display:none; padding:5px 0px; margin-top:-60px; margin-left:-73px; width:123px; height: 40px; line-height:16px; text-align: center}
a.tooltip_big:hover span{ display:inline; position:absolute; color:#EEE; background: url(../layout/tooltip_big.png) repeat 0 0; }
.callout_big{z-index:20;position:absolute;border:0;top:50px;left:56px;}
a.tooltip_big span{opacity: 1; font-weight: normal;}
a.tooltip2{outline:none; border-bottom: 1px dashed #000;}
a.tooltip2 strong{line-height:30px;}
a.tooltip2:hover{text-decoration:none;}
a.tooltip2 span{ z-index:10;display:none; padding:5px 0px; margin-top:35px; margin-left:-60px; width:250px; line-height:16px; text-align: center}
a.tooltip2:hover span{ display:inline; position:absolute; color:#EEE; background: url(../layout/tooltip2.png); }
.callout2{z-index:20;position:absolute;border:0;top:-8px;left:8px;}
a.tooltip2 span{opacity: 1; font-weight: normal;}
.tooltip_info{outline:none; font-size: 13px; position: absolute; top: 10px; right: 10px; margin-top: 0px}
.tooltip_info strong{line-height:30px;}
.tooltip_info span{ z-index:10;display:none; padding:5px 0px; margin-top:35px; margin-left:-400px; width:400px; line-height:16px; text-align: center; color:#EEE; background: url(../layout/tooltip2.png);}
.tooltip_info:hover span{ display:inline; position:absolute; }
.callout_info{z-index:20;position:absolute;border:0;top:-8px;right:24px;}
.tooltip_info span{opacity: 1; font-weight: normal; padding: 10px;}
.tooltip_info span a{color: #529dba}
.tooltip_info_2{outline:none; font-size: 13px; position: absolute; top: 10px; right: 10px; margin-top: 0px}
.tooltip_info_2 strong{line-height:30px;}
.tooltip_info_2 span{ z-index:10;display:inline; position: absolute; padding:5px 0px; margin-top:35px; margin-left:-400px; width:400px; line-height:16px; text-align: center; color:#EEE; background: url(../layout/tooltip2.png);}
.tooltip_info_2 span{opacity: 1; font-weight: normal; padding: 10px;}
.tooltip_info_2 span a{color: #529dba}
.tooltip_info img, .tooltip_info_2 img {cursor:pointer}

.progress-label{
  position: absolute;
  left: 40%;
  top: 4px;
  font-family: LatoB, sans-serif;
  text-shadow: 1px 1px 0 #fff;
}
.ui-progressbar{
  position: relative;
}
.tab_active{
  background-color: #00a0e6;
  width: 80px;
  padding: 5px;
  padding-left: 10px;
  margin-top: 10px;
  cursor: pointer;
  margin-left: 10px;
  transition:background-color 1s, margin-left 1s;
  -webkit-transition:background-color 1s, margin-left 1s;
}
.tab_inactive{
  border: 1px #00a0e6 solid;
  padding: 5px;
  padding-left: 10px;
  margin-top: 10px;
  width: 80px;
  cursor: pointer;
  margin-left: 0px;
  transition:background-color 1s, margin-left 1s;
  -webkit-transition:background-color 1s, margin-left 1s;
}
.tab_inactive:hover{
  background-color: #00a0e6;
}
.tabs_content{
  border: 1px #00a0e6 solid;
  margin: 0px;
  padding: 0px;
  clear: both;
}
.tabs{
  margin: 0px;
  padding: 0px;
  float: left;
}
.tab_content_inactive{
  display: none;
}
.tab_content_active{
  display: block;
}
.bar{
  width:270px;
  font-family: LatoB, sans-serif;
  margin-bottom: 5px;
  color: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
  padding: 2px;
  padding-left: 5px;
  transition: background-color 0.5s, color 0.5s;
  -webkit-transition: background-color 0.5s, color 0.5s;
}
.bar > img{
  margin-right: 16px;
  margin-left: 10px;
  vertical-align: -4px;
}
.bar:hover{
  background-color: rgba(180,180,180,0.8);
  color: #FFFFFF;
}
.sidebar_disabled:hover {
  background-color: transparent;
}
.folders{
  display: none;
  margin: 10px;
  margin-top: 0px;
  padding: 10px;
  padding-left: 0px;
  width: 240px;
  height: 200px;
  border: 1px white solid;
  border-radius: 0px;
  overflow: auto;
  overflow-x: hidden;
  -ms-overflow-x: hidden;
}
.folderstitle{
  margin-top: 30px;
  margin-left: 10px;
  padding-left: 5px;
  color: #18A8E7;
  font-family: LatoB, sans-serif;
  display: none;
  width: 100px;
  background-color: #FFF;
}
.sidebar .folders{
  display: block;
}
.sidebar .folderstitle{
  display: block;
}
.sidebar .foldersicon{
  display: none;
}
.folderbar {
  width: 100%;
  font-family: LatoB, sans-serif;
  color: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
  padding-left: 5px;
  padding-top: 2px;
  padding-bottom: 2px;
  transition: background-color 0.5s, color 0.5s;
  -webkit-transition: background-color 0.5s, color 0.5s;
}
.folderbar:hover{
  background-color: rgba(180,180,180,0.8);
  color: #FFFFFF;
}
.folderbar > img{
  margin-right: 16px;
  margin-left: 10px;
  vertical-align: -4px;
}
.activefolderbar{
  width:100%;
  font-family: LatoB, sans-serif;
  color: #464646;
  text-decoration: none;
  cursor: pointer;
  padding-left: 5px;
  padding-top: 2px;
  padding-bottom: 2px;
  background-color: rgba(255,190,0,0.9);
  transition: background-color 0.5s, color 0.5s;
  -webkit-transition: background-color 0.5s, color 0.5s;
}
.activefolderbar > img{
  margin-right: 16px;
  margin-left: 10px;
  vertical-align: -4px;
}
.activefolderbar:hover{
  background-color: rgba(180,180,180,0.8);
  color: #464646;
}
.sidebar{
  position: fixed;
  left: 0px;
  top: 0px;
  height: 100%;
  background-color: rgba(0,160,230,0.9);
  width: 270px;
  padding-left: 0px;
  overflow: hidden;
  padding-top: 100px;
  transition: background-color 0.5s, width 0.5s;
  -webkit-transition: background-color 0.5s, width 0.5;
  margin-top: 0px;
  z-index: 30;
}
.divcontent{
  padding-left: 290px !important;
}
.resize_picture_right{
  max-width: 80%;
  max-height: 400px;
  margin-top: 11px;
}
.resize_picture_left {
  max-width: 80%;
  max-height: 400px;
  margin-top: 20px;
}
.resize_picture_full {
  max-width: 90%;
  max-height: 600px;
}
.resize_picture_full_div {
  width: auto !important;
  height: auto !important;
}
.resize_picture_full_div .question_span {
  display: block !important;
  font-size: 14px;
  line-height: 18px;
}
#content.simulatie .question_span {
  display: block;
  width: 100%;
  height: auto;
  overflow: auto;
  padding: 0;
}
#content.simulatie .div_307_image {
  display: inline;
  margin: 0;
}
#content.simulatie .feedback2 {
  position: absolute;
  top: -31px;
  left: 20px;
  background-color: #ff4040;
  border-radius: 2px;
  max-width: calc(100% - 60px);
  margin: 0;
}
.hotspot_wrapper {
  display: block;
/*  background-color: #ebedef;  */
  width: calc(100% + 40px);
  margin: 36px 0 0 -20px;
  padding: 20px 0;
  position: relative;
}
.hotspot_container, #imgx {
  width: 100%;
  height: 100%;
  max-width: 1220px;
  max-height: 600px;
  margin: 0 auto;
}
#imgx {
  display: block;
  border: solid 1px #576b96;
  margin: 0 auto;
}
.imgxtrans {
  cursor: pointer;
}
#main.theorie .resize_picture_right {
  max-width: 80%;
  max-height: 400px;
  margin-top: 40px;
}
#main.theorie .resize_picture_left {
  max-width: 80%;
  max-height: 400px;
  margin-top: 40px;
}
#main.theorie .resize_picture_full {
  max-width: 90%;
  max-height: 600px;
}
#main.theorie .resize_picture_full {
  max-width: 90%;
  max-height: 600px;
}
#main #mccontent1 .video_wrapper, #main #mccontent2 .video_wrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
  width: 90%;
  margin-top: 11px;
}
#main #mccontent2 .video_wrapper {
  float: right;
}
#main.theorie .video_wrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
  width: 100%;
  float: none;
}
.video_wrapper .youtube_embedded {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
.lightbox{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .5);
  z-index: 99;
}
.lightbox_table{
  width: 100%;
  height: 100%;
}
.lightbox_table_cell{
  vertical-align: middle;
}
#lightbox_content{
  display: block;
  background-color: #ffffff;
  border-radius: 2px;
  width: calc(100% - 60px) !important;
  max-width: 1100px;
  height: auto;
  max-height: 550px;
  text-align: left;
  overflow: auto;
  padding: 20px;
  margin: 0 auto;
}
#lightbox_content h1{
  margin: 5px 0 0 0 !important;
}
#lightbox_content h2{
  margin: 7px 0 0 0 !important;
}
#lightbox_content h3{
  margin: 9px 0 0 0 !important;
}
#lightbox_content h4, h5, h6{
  margin: 11px 0 0 0 !important;
}
.lightbox_text_left {
  float: left;
  width: 48%;
  margin: 0 20px 20px 0;
}
.lightbox_text_right {
  float: left;
  width: 48%;
  margin: 0 0 20px 20px;
}
.lightbox_img_right {
  float: right;
  width: 48%;
  text-align: right;
  margin: 20px 0;
}
.lightbox_img_left {
  float: left;
  width: 48%;
  text-align: right;
  margin: 20px 0;
}
.lightbox_img_right img, .lightbox_img_left img {
  max-width: 100%;
  height: auto;
}
#truefalse, #truefalse2 {
  margin: 50px 0 0;
  text-align: center;
  width: 100%;
}
#truefalse input[type="radio"], #truefalse2 input[type="radio"] {
  display: none;
}
#truefalse label, #truefalse2 label {
  background-color: #f0f1f2;
  border-radius: 70px;
  display: inline-block;
  font-size: 2em;
  height: 120px;
  line-height: 115px;
  margin: 0 20px;
  text-align: center;
  width: 120px;
  box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24);
  transition: all .2s ease;
}
#truefalse .true + label, #truefalse2 .true + label {
  color: #0db862;
}
#truefalse .false + label, #truefalse2 .false + label {
  color: #ff4040;
}
#truefalse .true:checked + label, #truefalse2 .true:checked + label {
  background-color: #0db862;
  color: #ffffff;
}
#truefalse .false:checked + label, #truefalse2 .false:checked + label {
  background-color: #ff4040;
  color: #ffffff;
}

/* AUTONEXT BEGIN */
.truefalseautonext .true:hover + label {
  background-color: #0db862 !important;
  color: #ffffff !important;
  cursor: pointer;
}
.truefalseautonext .false:hover + label {
  background-color: #ff4040 !important;
  color: #ffffff !important;
  cursor: pointer;
}
/* AUTONEXT END */

select.wizard_yes option{
  background-color: #dcf0b4;
}
select.wizard_no option{
  background-color: #f0bea0;
}
select.wizard_blank option{
  background-color: #ffffff;
}
.wizard_no{
  background-color: #f0bea0 !important;
}
.wizard_yes{
  background-color: #dcf0b4 !important;
}
.wizard_blank{
  background-color: #ffffff !important;
}
.wizard_question{
  color: #900;
}
.mcspan{
  display: block;
  margin-top: 10px;
}
.new_endscreen #test_question_span,
.new_endscreen .screen_count,
.old_endscreen #test_question_span,
.old_endscreen .screen_count,
.theorie #test_question_span {
  display: none !important;
}
.mcspan .question_span{
  margin-top: 0;
}
.question_span li {
  line-height: 22px;
}
.mcdiv{
  margin: 0;
}
.mcdiv:after{
  content: "";
  clear: both;
}
.mccheck[type=checkbox]{
  float: left;
  display: none;
}
.mccheck[type=checkbox] + label{
  display: inline-block;
  background: #ebeef4 url(images/checkbox.png) 5px 5px no-repeat;
  border-radius: 2px;
  width: calc(100% - 37px);
  min-height: 25px;
  line-height: 25px;
  margin: 0 0 15px 0;
  padding: 5px 5px 5px 33px;
  cursor: pointer;
  box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24);
  transition: all .2s ease;
}
.mccheck[type=checkbox]:hover + label{
/*  box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.25); */
  filter: brightness(102%);
  -webkit-filter: brightness(102%);
  -moz-filter: brightness(102%);
}
.mccheck[type=checkbox]:checked + label{
  background: #ebeef4 url(images/tcs/checkbox_checked.png) 5px 5px no-repeat;
}
.mccheck[type=radio]{
  float: left;
  display: none;
}
.mccheck[type=radio] + label{
  display: inline-block;
  background: #ebeef4 url(images/radiobutton.png) 5px 5px no-repeat;
  border-radius: 2px;
  width: calc(100% - 37px);
  min-height: 25px;
  line-height: 25px;
  margin: 0 0 20px 0;
  padding: 5px 5px 5px 33px;
  cursor: pointer;
  box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12), 0 1px 1px 0 rgba(0,0,0,.24);
  transition: all .2s ease;
}
.mccheck[type=radio]:hover + label{
  filter: brightness(102%);
  -webkit-filter: brightness(102%);
  -moz-filter: brightness(102%);
}
.mccheck[type=radio]:checked + label{
  background: #ebeef4 url(images/tcs/radiobutton_checked.png) 5px 5px no-repeat;
}
.mccheck:disabled + label{
  color: #afafaf;
}
.mccheck:disabled:hover + label{
  filter: brightness(100%);
  -webkit-filter: brightness(100%);
  -moz-filter: brightness(100%);
}
#mccontent1 .mccheck[type=checkbox] + label, #mccontent1 .mccheck[type=radio] + label {
  width: calc(100% - 52px);
}

/* AUTONEXT BEGIN */
.mcautonext .mccheck[type=radio] + label{
  background: #ebeef4 url(images/radio_arrow.png) 99% 5px no-repeat;
  padding: 5px 23px 5px 15px;
}
.mcautonext .mccheck[type=radio]:hover + label{
  background: #909090 url(images/radio_arrow_checked.png) 99% 5px no-repeat;
  color: #ffffff;
}
.mcautonext .mccheck[type=radio]:checked + label{
  background: #0db862 url(images/radio_arrow_checked.png) 99% 5px no-repeat;
  color: #ffffff;
}
/* AUTONEXT END */

.matrixtable_wrapper {
  width: 100%;
  overflow-x: auto;
  margin-top: 11px;
}
.matrixtable{
  border-collapse: collapse;
  font-size: 14px;
}
#content > .matrixtable{
  width: 70%;
  min-width: 400px;
  margin: 20px 0 0 10px;
}
#content > .textmatrix {
  width: 90%;
}
#mccontent1.matrix1 {
  width: 60%;
}
#mccontent2.matrix2 {
  width: 40%;
}
#mccontent1 > .matrixtable{
  width: 95%;
  margin: 20px 0 0 0;
}
.matrixtable td{
  border: solid 1px #c5c5c5;
  padding: 5px 7px;
  vertical-align: middle;
}
.matrixtable input{
  margin: 0;
}
.textmatrix input {
  font-size: 14px !important;
  width: 90% !important;
  border: solid 1px #c5c5c5;
  padding: 1px 5px 2px 5px !important;
  transition: all ease .3s;
}
.textmatrix input:focus {
  border: solid 1px #576b96;
}
.matrix_top_left{
  background-color: #576b96;
  font-size: 24px;
  color: #ffffff;
  padding: 2px 7px 2px 8px!important;
}
.matrix_top{
  text-align: center;
}
.matrix_content{
  text-align: center;
  background-color: #f0f1f2;
  padding: 0!important;
}
.textmatrix .matrix_content {
  padding: 5px !important;
}
.matrix_check{
  float: left;
  opacity: 0;
}
.matrix_overlay{
  display: block;
  background: #f0f1f2 url(images/radiobutton.png) 2px 2px no-repeat;
  width: 29px;
  height: 29px;
  margin: auto;
}
.matrix_check:checked + .matrix_overlay{
  display: block;
  background: #f0f1f2 url(images/tcs/radiobutton_checked.png) 2px 2px no-repeat;
  width: 29px;
  height: 29px;
  margin: auto;
}
.matrix_title {
  font-style: italic;
  color: #a4aaba;
}
.report_table{
  border: 1px solid #00a0e6;
  background-color: #ffffff;
  margin-bottom: 36px;
  padding: 0px;
  border-spacing: 0px;
  border-collapse: collapse;
  min-width: 970px;
}
.report_question{
  background: none repeat scroll 0 0 #00a0e6;
  color: #FFFFFF;
  font: bold 15px/24px 'Segoe UI', Arial, Helvetica,sans-serif;
}
.report_question td{
  padding: 5px 10px;
}
.report_table td{
  padding: 5px;
}
.report_first{
  min-width: 250px;
  width: 250px;
}
.report_even{
  background-color: #e5e5e5;
}
.report_uneven{
  background-color: #f5f5f5;
}
.report_header th{
  text-align: left;
}
.report_header_grouping{
  border-bottom: 2px #00a0e6 solid;
  border-top: 2px #00a0e6 solid;
  font-family: LatoB, sans-serif;
}
.report_header_grouping td{
  padding-left: 20px;
}
.report_header_td{
  font-family: LatoB, sans-serif;
  min-width: 150px;
}
.report_header_short{
  min-width: 150px;
}
.report_header_long{

}

/* THEORIE MODULE BEGIN */
#main.theorie .mccheck[type=checkbox] + label {
  background: #ebeef4 none;
  padding: 5px 5px 5px 12px;
  cursor: pointer;
  width: calc(100% - 17px);
}
#main.theorie .mccheck[type=checkbox]:checked + label {
  background: #ebeef4 none;
  font-family: LatoB, sans-serif;
  width: calc(100% - 17px);
}
#main.theorie .mccheck[type=radio] + label {
  background: #ebeef4 none;
  padding: 5px 5px 5px 12px;
  cursor: pointer;
  width: calc(100% - 17px);
}
#main.theorie .mccheck[type=radio]:checked + label {
  background: #ebeef4 none;
  font-family: LatoB, sans-serif;
  width: calc(100% - 17px);
}
#mccontent2b.theorie {
  text-align: left;
}
/* THEORIE MODULE EIND */

.feeback_item {
  margin-top: 20px;
}
.feedback_item h1{
  font-family: "Segoe UI", "Trebuchet MS", sans-serif;
  font-size: 40px;
  font-weight: normal;
  color: #444444;
  margin: 5px 0 0 0 !important;
}
.feedback_item h2{
  font-family: "Segoe UI", "Trebuchet MS", sans-serif;
  font-size: 32px;
  font-weight: normal;
  color: #444444;
  margin: 7px 0 0 0 !important;
}
.feedback_item h3{
  font-family: "Segoe UI", "Trebuchet MS", sans-serif;
  font-size: 24px;
  font-weight: normal;
  color: #444444;
  margin: 9px 0 0 0 !important;
}
.feedback_item h4, feedback_item h5, feedback_item h6{
  font-family: "Segoe UI", "Trebuchet MS", sans-serif;
  font-size: 18px;
  font-weight: normal;
  color: #444444;
  margin: 11px 0 0 0 !important;
}
.feedback_item p{
  margin: 10px 0 10px 0 !important;
}
p.preview_bar{
  background-color: #cdd2dc;
  border-radius: 0 0 2px 2px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 2px 4px rgba(0,0,0,0.24);
  font-family: LatoB, sans-serif;
  font-size: 20px;
  color: #fa1e41;
  line-height: 85px !important;
  text-align: center;
  width: calc(100% + 70px) !important;
  height: 85px;
  margin: -15px 0 0 -35px;
  z-index: 2;
}

.resize_picture_right_subscript {
  display: block;
  font-family: RobotoI;
  margin-top: 10px;
}
.media_subtext{
  font-size: 11px;
}

/* WIZARD TOOLTIP BEGIN */
.wizard_tooltip_item > div{
  position: relative;
  top: -38px;
  margin-top: 11px;
}
#mccontent2 .feedback_container {
/*  float: right; */
  padding: 0 0 0 15px;
  margin-top: -8px;
}
.feedback_container_subdiv {
  padding: 0 25px;
}
/* WIZARD TOOLTIP EIND */

.mcfree{
  margin: -15px 0 20px 0;
}
.mcfree textarea, #mccontent1 textarea, input.absolute_text, textarea.absolute_text {
  background-color: #f8f8f8;
  border: none;
  border-bottom: solid 2px #c5c5c5;
  border-radius: 2px;
  font: inherit;
  font-size: 20px;
  width: calc(100% - 10px);
  margin: 0;
  padding: 5px !important;
  transition: all ease .3s;
}
.mcfree textarea:focus, #mccontent1 textarea:focus, input.absolute_text:focus, textarea.absolute_text:focus {
  border-color: #576b96;
}
.mcfree textarea {
  font-size: 1em;
  padding: 5px 10px !important;
  width: calc(100% - 20px);
}
.mclabel{word-wrap: break-word;}

label.absolute_text, label.answertxt {
  display: inline-block;
  color: #0db862;
  height: 30px;
  line-height: 30px;
  margin: 0;
  padding: 0;
}
input.absolute_text {
  width: 350px;
  height: 40px;
  margin: 0;
  padding: 0 5px !important;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }


/* INSTELLINGEN BEGIN */
#logo_div_container #logo_div,
#bg_div_container #bg_div,
#bg_div_container #background_div {
  border: solid 1px #00a0e6;
  width: 165px;
  height: 108px;
  margin: 0;
  padding: 2px;
  overflow: hidden;
}
#bg_div_container #bg_div,
#bg_div_container #background_div {
  height: 140px;
  text-align: center;
}
/* INSTELLINGEN EIND */

#score_sub {
  font-size: 26px;
  font-family: LatoB, sans-serif;
  text-align: center;
  width: 100%;
}
.return_error, .end_return_error {
  display: block;
  background-color: #ff4040;
  color: #ffffff;
  border-radius: 2px;
  width: 45%;
  text-align: center;
  margin: 25px 0 20px 0;
  padding: 5px;
}
.end_return_error {
  margin: 25px 0 15px 3px;
}
#return_sub_button a {
  text-decoration: none;
}
.redo_test {
  display: inline-block;
  background-color: #576b96;
  border: solid 1px #576b96;
  font-size: 0.9em;
  font-family: LatoB, sans-serif;
  color: #fff;
  margin: 20px 0 0 3px;
  padding: 3px 10px;
}
.redo_test:hover {
  background-color: #ffffff;
  border: solid 1px #576b96;
  color: #576b96;
}
.unanswered_text {
  display: block;
  margin: 20px 0 0 30px;
}
.unanswered_options {
  display: table;
  border-spacing: 30px;
  border-collapse: separate;
}
a.unanswered {
  display: table-cell;
  text-decoration: none;
  font-size: 14px;
  color: #ffffff !important;
  vertical-align: bottom;
  background-repeat: no-repeat;
  width: 180px;
  height: 180px;
  border-radius: 2px;
  margin: 0;
  padding: 10px;
  transition: all .2s ease-in-out;
}
a.unanswered1_grey {
  background-image: url(images/tcs/onbeantwoord-bekijken2.png);
}
a.unanswered1 {
  background-image: url(images/tcs/onbeantwoord-bekijken.png);
}
a.unanswered2 {
  background-image: url(images/tcs/alles-bekijken.png);
}
a.unanswered3 {
  background-image: url(images/tcs/test-afronden.png);
}
a.unanswered1:hover {
  background-image: url(images/tcs/onbeantwoord-bekijken1.png);
}
a.unanswered2:hover {
  background-image: url(images/tcs/alles-bekijken1.png);
}
a.unanswered3:hover {
  background-image: url(images/tcs/test-afronden1.png);
}

/* PATROON VRAAG BEGIN */
.iqtest {
  padding: 20px 0 0 0 !important;
}
.iqtest #mccontent2 {
  text-align: left;
  width: 70%;
}
.iqtest #mccontent1 {
  text-align: left;
  width: auto;
}
.iqtest .resize_picture_right {
  margin-top: 5px !important;
  max-width: 300px;
}
.iqtest .mcdiv {
  margin: 0;
}
.iqtest .mcspan {
  margin-top: -2px;
}
.iqtest .mccheck[type=radio] + label {
  display: inline-block;
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 2px solid transparent;
  width: auto !important;
  margin: 8px 0 12px 0;
  padding: 12px;
  vertical-align: middle;
  box-shadow: none;
}
.iqtest .mccheck[type=radio]:checked + label {
  background: #909090 none repeat scroll 0 0;
  border: 2px solid transparent;
}
.iqtest .mccheck[type=radio]:hover + label {
  border: 2px solid #909090 !important;
}
.iqtest .mclabel:hover {
  border: 2px solid #909090 !important;
}
/* PATROON VRAAG EIND */


/* START AANPASSINGEN DIETER 09/08 */

#drag_end_solution {
  padding: 0 0 0 15px;
}
.drag_end_solution{
	max-width: 400px;
	min-height: 25px;
	border: 1px dashed #576b96;
	list-style: none;
	padding: 5px;
	margin: 5px 5px 5px 0;
	background-color: #ffffff;
}
.dragcontentsolution {
  float: left;
  width: 40%;
}
.drag_check_button {
  background: url(../layout/drag_check_button.png) no-repeat;
  border: none;
  width: 48px;
  height: 48px;
  margin: 40px 0 0 0;
  cursor: pointer;
  margin-left: 50px;
}
.drag_correct {
	border: 1px solid #0db862 !important;
}
.drag_incorrect {
	border: 1px solid #ff4040 !important;
}
.dragcontentsolutiontitle {
  padding-left: 15px;
  font-size: 17px;
  font-family: LatoB, sans-serif;
}

/* EINDE AANPASSINGEN */

/* BEGIN SLEEP VRAAG DM 24/10/2015 */
.dragcontent1 {
  float: left;
  width: 50%;
  margin-right: 50px;
}
.dragcontent2 {
  float: left;
  width: calc(50% - 50px);
}
#drag_start {
  min-height: 300px;
  margin-top: 10px;
}
.dragcontent2 div.sorteren {
  margin-top: 15px !important;
}
.dragcontent2 li.sorteren {
  padding: 10px !important;
}
#drag_end {
  padding: 0 0 0 15px;
}
.drag_end {
	max-width: 400px;
	min-height: 25px;
	border: 1px dashed #576b96;
	list-style: none;
	padding: 5px;
	margin: 5px 5px 5px 0;
	background-color: #ffffff;
}
.drag_li {
	background-color: #f0f1f2;
  border-radius: 2px;
	padding: 5px;
	margin: 0 5px 30px 0;
	list-style: none;
	cursor: pointer;
	min-height: 25px;
	display: inline-block;
  box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);
	text-align: center;
}
.drag_end_container {
	background-color: #f0f1f2;
	border: 1px solid #c9c9c9;
	margin: 10px 10px 25px 0;
	max-width: 415px;
	padding: 5px 5px 5px 10px;
	font-family: LatoB, sans-serif;
}
.drag_end_container .drag_li {
	margin: 5px 5px 5px 0 !important;
}
.drag_end_placeholder {
	color: #bbbbbb;
	font-weight: normal;
}
#drag_end .drag_li {
  box-shadow: none;
}
#drag_end .back, #drag_end .backend, #drag_end_container .back, drag_end_container .backend, #drag_end_solution .back, #drag_end_solution .backend {
  display: inline-block;
  background-color: #f0f1f2;
  border: solid 1px #c9c9c9;
  max-width: 400px;
  height: 60px;
  margin: 15px;
  padding: 10px;
  position: relative;
  margin-bottom: 30px;
}
#drag_end .back:after, #drag_end_container .back:after, #drag_end_solution .back:after {
  content: url(../layout/pijl-md.png);
  position: absolute;
  bottom: -31px;
  right: 27px;
}
#drag_end .backend:after, #drag_end_container .backend:after, #drag_end_solution .backend:after {
  content: '';
}
/*
.drag-li-active{
	border: 1px solid #529dba;
}
*/
.drag-li-hover{
	border: 1px solid #576b96 !important;
}
.drag_reset_button {
  background: url(../layout/drag_reset_button.png) no-repeat;
  border: none;
  width: 48px;
  height: 48px;
  margin: 40px 0 0 0;
  cursor: pointer;
}
/* EINDE SLEEP VRAAG */

/* BEGIN OPEN VRAAG */
textarea.absolute_text {
  width: 50%;
  height: 150px;
  padding: 5px;
  position: relative;
}
#theupload {
  display: inline-block;
/*  margin: 0px 0px 0px 10px; */
}
#theupload .attachment_text {
  border: medium none;
  margin: 40px 0px 10px -6px;
}
#uploaderror {
  margin: 0px 0px 10px 9px;
  color: #ff4040;
}
.inputbox {
/*  margin-left: 10px; */
  width: 170px;
}
.inputbox figure {
  display: inline-block;
  margin: 3px 5px 0px 5px;
  vertical-align: sub;
}
.inputbox svg {
  fill: #ffffff;
}
.rv_inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
.rv_inputfile + label {
  display: inline-block;
  background-color: #576b96;
  border: 1px solid #576b96;
  color: #ffffff;
  cursor: pointer;
  font-size: 0.9em;
  font-family: LatoB, sans-serif;
  height: 24px;
  min-width: 154px;
  padding: 2px 10px 3px 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rv_inputfile + label:hover, #thefile + label:focus {
  background-color: #ffffff;
  color: #576b96;
}
.inputbox:hover svg {
  fill: #576b96;
}
#theupload .newtest {
  background-color: #f18e00;
  border: solid 1px #f18e00;
  color: #ffffff;
}
#theupload .newtest:hover {
  background-color: #576b96;
  border: solid 1px #576b96;
}
/* EINDE OPEN VRAAG */

.folderstitle_blue{
  padding: 2px;
  padding-left: 5px;
  color: #FFF;
  font-family: LatoB, sans-serif;
  display: block;
  width: 100px;
  background-color: #00A0E6;
}

.folders_blue{
  display: block;
  background-color: #FFF;
  border: 1px #00A0E6 solid;
  padding: 5px;
}

.widget_block_blue {
  color: #fff;
  padding-left: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}

/* BEGIN OPLEIDINGSADVIES */
.advise_title, .advise_category_title, .advise_group_score, .advise_category_score {
  display: none;
}
.advise_intro {
  margin-bottom: 40px;
}
.advise_intro h2 {
  font-size: 1.6em;
}
.advise_content ul {
  margin: -5px 0 0 0;
}
.advise_content a {
  color: #00a7e1;
  text-decoration: none;
}
.advise_group_uneven, .advise_group_even {
  background-color: #f5f5f5;
  width: calc(100% + 10px);
  padding: 0 0 20px 10px;
  margin-left: -10px;
}
.advise_group_even {
  background-color: #ededed;
}
.advise_group_title {
  display: inline-block;
  font-size: 1.2em;
  font-family: LatoB, sans-serif;
  margin: 15px 0 10px 0;
}
.advise_category_uneven, .advise_category_even {
  background-color: #f5f5f5;
  width: calc(100% + 10px);
  padding: 0 0 20px 10px;
  margin-left: -10px;
}
.advise_category_even {
  background-color: #ededed;
}
.advise_category_title {
  display: inline-block;
  font-size: 1.2em;
  font-family: LatoB, sans-serif;
  margin: 15px 0 10px 0;
}
.advise_outro {

}
.advise_outro a {
  color: #529dba;
  text-decoration: none;
}
/* EIND OPLEIDINGSADVIES */


/* CSS VERSCHILLEN IN V8.0 DD 31-8-2017 */

/* NULM60.CSS */
.folderbar {
  width: calc(100% + 10px);
  font-family: LatoB, sans-serif;
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
  padding-left: 5px;
  padding-top: 2px;
  padding-bottom: 2px;
  transition: background-color 0.5s, color 0.5s;
  -webkit-transition: background-color 0.5s, color 0.5s;
}


/* JQUERY.GRIDSTER.CSS */
.gridster li {
	list-style-type: none;
	border: 1px #a0aabe solid;
	background-color: #a0aabe;
	border-radius: 0;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
	color: #fff;
	font-family: LatoB, sans-serif;
	text-align: center;
	overflow: hidden;
}
.widget_sub_block {
	border: 1px #fff dashed;
	margin-left: 50px;
	margin-right: 50px;
	margin-top: 10px;
  padding: 5px !important;
	cursor: pointer;
	background-color: #00a0e6;
	color: #fff;
	font-family: LatoB, sans-serif;
	text-align: center;
	overflow: hidden;
}
.widget_sub_block_inner {
	margin: 5px;
	margin-top: 10px;
	padding: 5px;
	font-size: 1.1em;
	border-width: 0px;
}
.widget_sub_block .fa-cog, .widget_sub_block .fa-close, .widget_sub_block .fa-plus {
  font-size: 18px !important;
  line-height: 20px !important;
}
.widget_sub_block .fa-plus {
  line-height: 22px !important;
}

/* NICEFORMS-DEFAULT.CSS */
#main_body {
  margin-top: 18px;
}
#testitform span.span_settings_general,
#testitform span.span_settings_access,
#testitform span.span_settings_options,
#testitform span.span_settings_security,
#testitform span.span_settings_test {
  display: inline-block;
  font-family: LatoB, sans-serif;
  color: #ffffff;
  text-align: center;
  width: auto !important;
  min-width: 100px;
  height: 28px;
  line-height: 28px;
  cursor: pointer;
  margin: 0 5px 0 0;
  padding: 0 10px;
}
#testitform span.span_settings_general {
  background-color: #00a0e6;
}
#testitform span.span_settings_access {
  background-color: #00a0e6;
}
#testitform span.span_settings_options {
  background-color: #747575;
}
#testitform span.span_settings_test {
  background-color: #00a0e6;
}
#testitform span.span_settings_security {
  background-color: #00a0e6;
}
#testitform span.span_settings_info_1, #testitform span.span_settings_info_2 {
  position: absolute;
  top: -30px;
  left: -1px;
  background-color: transparent;
  color: #444444;
  text-align: left;
  padding: 0 0 0 2px;
  cursor: initial;
}
#testitform span.span_settings_info_2 {
  left: 516px;
  padding: 0 0 0 4px;
}
#testitform span.span_settings_block_endscreen {
  margin-left: 300px;
}
fieldset.fs_settings_access, .fieldset.fs_settings_access {
  border: 1px solid #00a0e6;
}
fieldset.fs_settings_options, .fieldset.fs_settings_options {
  border: 1px solid #747575;
}
fieldset.fs_settings_test, .fieldset.fs_settings_test {
  border: 1px solid #00a0e6;
}
fieldset.fs_settings_security, .fieldset.fs_settings_security {
  border: 1px solid #00a0e6;
}
.layout_or_div, .ts_font_box {
  border: solid 1px #d5d5d5;
}
fieldset.fs_settings, .fieldset.fs_settings {
  border-top-width: 4px;
  width: 948px;
  padding: 10px;
}
.span_settings_general.span_settings_inactive {
	background-color: #a0aabe !important;
}
.span_settings_access.span_settings_inactive {
	background-color: #a0aabe !important;
}
.span_settings_options.span_settings_inactive {
	background-color: #a0aabe !important;
}
.span_settings_test.span_settings_inactive {
	background-color: #a0aabe !important;
}
.span_settings_security.span_settings_inactive {
	background-color: #a0aabe !important;
}
.template_div {
  display: inline-block;
  border: solid 1px #d9d9d9;
  width: 270px;
  padding: 5px;
  margin: 0 40px 40px 0;
  cursor: pointer;
}
.template_title {
  margin-left: 5px;
  font-family: LatoB, sans-serif;
}
.template_img img {
  width: 100%;
  height: auto;
}
.template_div:hover {
  border: solid 1px #00a0e6;
}
fieldset.fs_settings .fa-download, .fieldset.fs_settings .fa-download {
  margin-top: 3px;
}
.dynatable-active-page {
  background-color: #a0d246 !important;
  border-radius: 0 !important;
}

/* ENDSCREEN_DASHBOARD.CSS */
.taskstep_action {
	height: 7px;
	background-color: #999;
	overflow: hidden;
	background-image: url(../layout/dots.png);
	background-repeat: no-repeat;
	background-position: center bottom
}
.taskstep_action_last {
	height: 55px;
	background-color: #ccc;
}
.taskstep_add {
	text-align: center;
	display: inline-block;
	color: #000;
	text-decoration: none;
	font-family: LatoB, sans-serif;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 7px;
}
.taskstep_add:hover {
	background-color: #555;
	color: #fff;
}
.taskstep_action {
	text-align: center;
}
.ts_33 {
	width: 33%;
}
.ts_50 {
	width: 49%;
}
.ts_100{
	width: 99%;
}
.taskstep_group {
	font: bold 15px/24px 'segoe ui', arial, helvetica, sans-serif;
	padding-left: 5px;
	width: 400px;
	background-color: #fff;
	border: 1px #b5b5b5 solid;
}
.taskstep_category {
	font: bold 15px/24px 'segoe ui', arial, helvetica, sans-serif;
	padding-left: 5px;
	width: 400px;
	background-color: #fff;
	border: 1px #0080c6 solid;
	color: #000;
}
.taskstep_container {
	margin-top: 10px;
	margin-bottom: 10px;
	height: 300px;
	overflow-y: auto;
	display: block;
}
.taskstep_picture {
	float: right;
}
.taskstep_picture img {
	max-width: 220px !important;
	max-height: 220px !important;
}
.tsa_fix {
	position: relative;
	top: -32px;
}
.font_box {
	width: 100px;
	padding: 1px;
	line-height: -3px;
	border: 1px #00a0e6 solid;
	text-align: center;
	font-family: LatoB, sans-serif;
	margin-left: 15px;
	display: inline-block;
	vertical-align: middle;
}
.font_box_search {
	cursor: pointer;
}
.slider {
	height: 25px;
	vertical-align: middle;
}
.sldred, .sldgreen, .sldblue, .sldtrans, .sldindent, .font_size_slider {
	width: 200px;
	display: inline-block;
	vertical-align: middle;
	margin-bottom: 10px;
}
.sldred .ui-slider-range { background: #ef2929; }
.sldred .ui-slider-handle { border-color: #ef2929; }
.sldgreen .ui-slider-range { background: #8ae234; }
.sldgreen .ui-slider-handle { border-color: #8ae234; }
.sldblue .ui-slider-range { background: #729fcf; }
.sldblue .ui-slider-handle { border-color: #729fcf; }
.sldtrans .ui-slider-range { background: #000000; }
.sldtrans .ui-slider-handle { border-color: #000000; }
.sldindent .ui-slider-range { background: #000000; }
.sldindent .ui-slider-handle { border-color: #000000; }

.border_example {
	float: right;
	position: relative;
	top: 10px;
	width: 350px;
	border: 2px #18a8e7 solid;
	margin-right: 10px;
	text-align: center;
	height: 70px;
	margin-bottom: -150px;
}
.border_example_inac {
	width: 350px;
	border: 2px #18a8e7 solid;
	margin-right: 10px;
	text-align: center;
	height: 70px;
}
.border_example_sub {
	display: block;
	line-height: 70px;
}
.font_example{
	float: right;
	position: relative;
	top: 10px;
	width: 270px;
	margin-right: 10px;
	text-align: center;
	height: 70px;
	margin-bottom: -150px;
}
.font_example_inac {
	width: 280px;
	border: 2px #18a8e7 solid;
	margin-right: 10px;
	text-align: center;
	height: 70px;
}
.font_example_sub {
	display: block;
	line-height: 70px;
}
.ts_font_box {
	height: 210px;
	padding-left: 10px;
}
.urlbit {
	display: none;
}
.widget_filter_block_new {
	margin-top: 10px;
	text-align: center;
	padding: 5px;
	background-color: #a0d246;
	font-size: 1.2em;
	color: #fff;
	cursor: pointer;
}
.f_div {
	margin-bottom: 10px;
}
.filter_or_div {
	border: 1px #529dba solid;
	padding: 5px;
	margin-top: 10px;
}
.filter_or_div > i {
	float: right;
	cursor: pointer;
	font-size: 1.3em;
}
.filter_or_div > span > i {
	cursor: pointer;
	font-size: 1.3em;
}
.widget_layout_block_new {
	margin-top: 10px;
	text-align: center;
	padding: 5px;
	background-color: #a0d246;
	font-size: 1.2em;
	color: #fff;
	cursor: pointer;
}
.l_div {
	margin-bottom: 10px;
}
.layout_or_div {
	border: 1px #529dba solid;
	padding: 5px;
	margin-top: 10px;
}
.layout_or_div > i {
	float: right;
	cursor: pointer;
	font-size: 1.3em;
}
.layout_or_div > span > i {
	cursor: pointer;
	font-size: 1.3em;
}
.f_div {
	padding: 5px;
	margin-top: 10px;
}
.f_div > i {
	float: right;
	cursor: pointer;
	font-size: 1.3em;
	position: relative;
	top: 2px;
}
.blue {
	height: 24px !important;
}
.inline-tab {
	display: inline-block;
	width: 120px;
	border: 2px #00a0e6 solid;
	border-bottom-width: 0px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	text-align: center;
	cursor: pointer;
	font-family: LatoB, sans-serif;
	padding: 5px;
	margin-right: 10px;
}
.inline-tab-active {
	border-bottom: 2px #fff solid;
	top: 2px;
	position: relative;
}
.inline-tab-div {
	border: 2px #00a0e6 solid;
}
.color_preset_block {
	display: inline-block;
	width: 50px;
	height: 50px;
	vertical-align: middle;
}
.color_preset_text {
	display: inline-block;
	margin-left: 20px;
	line-height: 50px;
	vertical-align: middle;
}
.color_preset_container {
	width: 50%;
	cursor: pointer;
	display: inline-block;
}
.color_preset_div{
	background-color: #fff;
}
.color_preset_div:hover {
	background-color: transparent;
}
.span_special_title {
	display: block;
	position: relative;
	left: 20px;
	top: 80px;
	z-index: 99999999;
}
.widget_yaxis_block_new {
	margin: 5px;
	margin-top: 10px;
	text-align: center;
	padding: 5px;
	background-color: #a0d246;
	font-size: 1.2em;
	color: #fff;
	cursor: pointer;
}
.yaxis_div {
	border: 2px #00a0e6 solid;
	padding: 5px;
	margin: 5px;
	margin-top: 10px;
}
.yaxis_div > i {
	float: right;
	cursor: pointer;
	font-size: 1.3em;
}
.yaxis_div > span > i {
	cursor: pointer;
	font-size: 1.3em;
}
#pdf_block_content_tab > a {
	text-decoration: none;
}
#pdf_block_content_tab {
	display: inline-block;
}
#pdf_block_theupload {
	display: inline-block;
}
.ui-accordion {
  margin-bottom: -1px;
}
.ui-accordion-header {
	font-size: 13px;
	background-image: none !important;
	background-color: #009BDC;
	color: #ffffff;
	font-family: LatoB, sans-serif;
	margin: 0px !important;
}
.ui-accordion-content {
	padding: 0px !important;
	background-color: #00a0e6;
	background-image: none !important;
	padding: 5px 0 0 0 !important;
}
.ui-accordion-header-icon {
	background-image: none !important;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
  text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: #ffffff;
	text-indent: 0px;
	overflow: auto;
  margin-top: -6px !important;
}
.ui-accordion .ui-accordion-icons {
  padding-left: 2em;
}
.ui-icon-triangle-1-s:before{content:"\f0d7"}
.ui-icon-triangle-1-e:before{content:"\f0da"}

.folders_accordion {
	padding: 0px;
	padding-bottom: 1px;
}
#accordion h3, #accordion_pop h3 {
  border: none !important;
  outline: none !important;
  border-bottom: solid 1px rgba(255, 255, 255, 0.4) !important;
}
.accordion_inner {
  border-bottom: solid 1px rgba(255, 255, 255, 0.4) !important;
}
.popup-form fieldset.action, .popup-form .fieldset.action {
  margin-top: -37px;
  border: solid 1px #00a0e6;
  border-top: 0;
  width: 928px;
  padding: 10px 20px;
}

/* DIRECTE FEEDBACK */
.mccheck_wrong[type=radio] + label{
	border: 1px #ff4040 solid !important;
}
.mccheck_correct[type=radio] + label{
	border: 1px #0db862 solid !important;
}
.mccheck_wrong[type=checkbox] + label{
	border: 1px #ff4040 solid !important;
}
.mccheck_correct[type=checkbox] + label{
	border: 1px #0db862 solid !important;
}
.mccheck_partial[type=checkbox] + label{
	border: 1px #576b96 solid !important;
}
.mccheck_partial[type=checkbox] + label{
	border: 1px #576b96 solid !important;
}
.mc_direct_feedback {
  display: inline-block;
  background-color: #576b96;
  color: #ffffff;
  border: none;
  border-radius: 2px;
  margin: 25px 0;
  padding: 5px 13px;
}
strong, b {
  font-family: LatoB, sans-serif;
}

/* MATERIAL DESIGN BEGIN */

/* error pagina begin */
#bannererror {
  position: absolute;
  top: 0;
  background-color: #ffffff;
  box-shadow: 0 5px 10px rgba(0,0,0,0.16);
  width: 100%;
  height: 75px;
  z-index: 9;
}
#logoerror {
  float: left;
  background-color: #ffffff;
  width: 190px;
  height: 75px;
  text-align: center;
  padding: 0;
}
#logoerror img {
  width: 165px;
  height: 75px;
}
#bannererror #nav {
  display: none;
}
#mainerror {
  margin-top: 75px;
}
#mainerror a.back {
  border: none;
  border-radius: 2px;
  text-align: center;
  height: 32px;
  line-height: 33px;
  font-family: CatamaranM, sans-serif;
  font-size: 1.1em;
  background-color: #529dba;
  color: #ffffff;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  padding: 0 10px;
  transition: all 300ms ease;
}
#mainerror a.back:hover {
  background-color: #ffbb00 !important;
  border-color: #ffbb00 !important;
  color: #ffffff !important;
}
/* error pagina eind */

.md_wrapper, .md_wrapper h1, .md_wrapper h2, .md_wrapper h3, .md_wrapper h4, .md_wrapper p, .md_wrapper span {
  font-family: RobotoR !important;
}
#wrapper.md_wrapper {
  padding: 20px 0 0 0;
}
.md_wrapper strong, .md_wrapper b {
  font-family: RobotoB !important;
  font-weight: normal;
}
.md_wrapper span.subscript {
  font-family: RobotoI !important;
}
#main.theorie .mccheck[type=radio]:checked + label {
  font-family: RobotoB !important;
}
.shadow1 {
  box-shadow: 0 2px 5px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.24);
}
.shadow2 {
  box-shadow: 0 10px 20px rgba(0,0,0,0.20), 0 6px 8px rgba(0,0,0,0.20);
}
#banner {
  position: fixed;
  top: 0;
  background-color: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 80px;
  z-index: 9;
}
#logo {
  float: left;
  background-color: #ffffff;
  width: 190px;
  height: 80px;
  padding: 0;
}
#logo .logo_wrapper {
  display: table-cell;
  width: 190px;
  height: 80px;
  text-align: center;
  vertical-align: middle;
  margin: 0;
  padding: 0;
}
#logo img {
  max-width: 190px;
  max-height: 80px;
}
#title {
  float: left;
  background-color: #ffffff;
  border: none;
  max-width: calc(100% - 240px);
  height: 80px;
  padding: 0 20px;
}
#title h1 {
  color: #576b96;
  margin: 10px 0 0 0;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
#title h3 {
  color: #f18e00;
  margin: 3px 0 0 0;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
#header {
  display: table;
  width: calc(100% - 20px);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 10px;
  vertical-align: middle;
}
#breadcrumb {
  display: table-cell;
  width: 80%;
  vertical-align: top;
}
#breadcrumb_group, #breadcrumb_category {
  display: inline-block;
  position: relative;
  background-color: transparent !important;
  border: solid 1px rgba(160, 160, 160, 0.5);
  border-radius: 20px;
  min-width: 100px;
  height: 28px;
  text-align: center;
  line-height: 28px;
  margin: 0 0 10px 0;
  padding: 0 !important;
  white-space: nowrap;
  overflow: hidden;
}
#breadcrumb_group p, #breadcrumb_category p {
  color: #909090;
  position: relative;
  top: 1px;
  left: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  z-index: 2;
  margin: 0;
  padding: 0 20px;
}
#breadcrumb .divider {
  font-size: 1.2em;
  color: #b4b9c8;
  margin: 0 5px;
}

/* PRIVACY BEGIN */
#privacy_container_md {
  display: table-cell;
  text-align: right;
  width: 20%;
  margin: 0;
  padding: 0 0 14px 0;
}
#privacy_container_md .privacy {
  background: transparent url(images/user_icon.png) no-repeat right;
  background-size: 34px 34px;
  vertical-align: middle;
}
#privacy_container_md .privacy .logged_as, #privacy_container_md .privacy a {
  display: block;
  font-size: 0.9em;
  line-height: 15px;
  margin-right: 40px;
}
#privacy_container_md .privacy a {
  display: inline-block;
  color: #576b96;
}
.privacy_input_div, .privacy_button_div {
  text-align: center;
  margin: 10px 0;
}
.privacy_label {
  display: block;
  font-family: RobotoR, sans-serif;
  font-size: 20px;
}
.privacy_input, .privacy_select {
  display: block;
  font-size: 16px;
  width: 300px !important;
  height: 35px !important;
  padding: 4px 5px 7px 5px;
  margin: 5px auto 10px auto;
}
.privacy_button {
  background-color: #576b96;
  font-size: 14px;
  font-family: RobotoR, sans-serif;
  color: #ffffff;
  border: none;
  border-radius: 2px;
  margin-top: 10px;
  padding: 8px 26px;
  cursor: pointer;
}
.form_privacy_popup_input input, .form_privacy_popup_input select, .form_privacy_popup_input textarea {
  font-size: 14px;
  width: 300px;
  box-sizing: content-box;
  border: solid 1px #a5a5a5;
  padding: 4px 5px 7px 5px;
  margin: 2px 0 12px 0;
}
.form_privacy_popup_input input:focus, .form_privacy_popup_input select:focus, .form_privacy_popup_input textarea:focus, select:focus {
  border: solid 1px #576b96;
}
.form_privacy_popup_text {
  border: none !important;
  padding: 20px 0 5px 0 !important;
}
.form_privacy_popup_input textarea {
  width: 70%;
  height: 70px;
}
.form_privacy_button button {
  background-color: #f18e00;
  font-size: 16px;
  font-family: RobotoR, sans-serif;
  color: #ffffff;
  border: none;
  border-radius: 2px;
  margin-top: 10px;
  padding: 5px 20px;
  cursor: pointer;
}
.form_privacy_button button:hover, .form_privacy_button button:focus {
  background-color: #576b96;
}
.form_privacy_button button:disabled, .form_privacy_button button[disabled] {
  background-color: #c5c5c5;
}
/* PRIVACY EIND */


/* NIEUWE NAVIGATIE BEGIN */
#nav_container {
  position: fixed;
  bottom: 5px;
  right: 25px;
}
#nav_container .material-icons {
  color: #ffffff;
  font-size: 29px;
}
#nav_container .keyboard_nav, #nav_container .open_nav_button, #nav_container .next, #nav_container .prev {
  transition: all 0.15s ease-in-out;
}
#nav_container .keyboard_nav, #nav_container .open_nav_button {
  display: block;
  background-color: #3a4764;
  color: white;
  border: 0px;
  border-radius: 48px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.20), 0 6px 8px rgba(0,0,0,0.20);
  width: 48px;
  height: 48px;
  margin: 20px 0;
  padding: 0;
  cursor: pointer;
}
#nav_container .keyboard_nav:hover, #nav_container .open_nav_button:hover {
  opacity: 0.9;
}
#nav_container .next, #nav_container .prev, #nav_container button.portal_home {
  display: block;
  background-color: #f18e00;
  border: 0px;
  border-radius: 48px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.20), 0 6px 8px rgba(0,0,0,0.20);
  width: 48px;
  height: 48px;
  margin: 20px 0;
  cursor: pointer;
}
#nav_container .next:hover, #nav_container .prev:hover, #nav_container button.portal_home:hover {
  background-color: #576b96;
}
nav {
  display: none;
  position: fixed;
  top: 80px;
  right: 0;
  background-color: #576b96;
  border-radius: 0 0 2px 2px;
  font-size: 14px;
  width: 300px;
  height: calc(100% - 110px);
  overflow: auto;
  margin: 0;
  padding: 10px 20px 20px 20px;
  box-shadow: -5px 0 10px rgba(0,0,0,0.16);
  cursor: default;
  z-index: 9;
}
#navmenu, .secondary_nav {
  width: 300px;
}
#navmenu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
#navmenu li {
  height: 50px;
}
#navmenu p.grtitle.expanded, #navmenu p.grtitle.collapsed {
  background: url(images/bar_gr_expanded_white.png) 2px 3px no-repeat;
  display: inline-block;
  font-style: italic;
  font-weight: normal;
  text-decoration: underline;
  color: #ffffff;
  margin: 20px 0 0 -5px;
  padding: 0 0 0 20px;
  cursor: pointer;
}
#navmenu p.grtitle.collapsed {
  background: url(images/bar_gr_collapsed_white.png) 2px 3px no-repeat;
}
#navmenu p.sidemenu_active {
  font-family: RobotoB, sans-serif !important;
}
#navmenu a {
  display: block;
  color: #ffffff;
  line-height: 20px;
  text-decoration: none;
  width: calc(100% - 15px);
  margin: 15px 0 0 0;
  padding: 0 0 0 15px;
  transition: ease all 0.3s;
}
#navmenu a.menu_active {
  font-family: RobotoB, sans-serif;
}
#navmenu .menu_gr_complete {
  color: rgba(255,255,255,.6) !important;
}
#navmenu .menu_cat_complete a {
  background: url(images/tcs/bar_cat_completed.png) -3px 3px no-repeat;
  color: rgba(255,255,255,.6);
}
nav hr {
  display: inline-block;
  border: 0;
  width: 100%;
  height: 0;
  border-top: 1px solid #fff;
  margin: 25px 0;
}
.secondary_nav .reset2, .secondary_nav .portal_home {
  display: block;
  color: #ffffff !important;
  width: 100%;
  height: auto;
  margin-bottom: 15px;
  cursor: pointer;
}
.secondary_nav .reset2:before, .secondary_nav .portal_home:before {
  background-image: url(images/nav-terug-naar-begin.png);
  background-size: 15px 15px;
  display: inline-block;
  width: 15px; 
  height: 15px;
  content: '';
  margin: -2px 8px 0 0;
  vertical-align: middle;
}
.secondary_nav .portal_home:before {
  background-image: url(images/nav-terug-naar-portal.png);
}
/* NIEUWE NAVIGATIE EIND */

#main {
  display: block;
  box-sizing: border-box;
  background-color: #ffffff;
  border-radius: 2px;
  width: calc(100% - 20px);
  max-width: 1280px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.24);
  padding: 20px 30px;
  margin: 0 auto 50px auto;
}
#main p, #main ul, #main ol {
  line-height: 1.5em;
}
#main #test_question_span {
  margin: 0 0 25px 0;
}
/*
#main a {
  color: #529dba;
}
*/
#main input.text, #main select.text {
  background-color: #f8f8f8;
  border: none;
  border-bottom: solid 2px #c5c5c5;
  border-radius: 2px;
  font-family: RobotoR, sans-serif !important;
  font-size: 1em;
  width: 210px;
  height: 20px;
  margin: 0 0 5px 0;
  padding: 4px 5px !important;
  transition: all ease .3s;
}
#main select.text {
  box-sizing: content-box;
}
#main input.text:focus, #main select.text:focus {
  border-color: #576b96;
}
#main input.button, #main input.next2 {
  font-family: RobotoB !important;
  background-image: none;
  background-color: #f18e00;
  border-radius: 24px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.24);
}
#main input.button:hover, #main input.next2:hover {
  background-color: #576b96;
}
#content, #mccontent {
  display: block;
  width: 100%;
  min-height: 350px;
  margin: 0;
  padding: 0;
}
#content video, #mccontent video {
  width: 100%;
  max-width: 890px;
  height: auto;
}
.portal video {
  width: 60% !important;
}
#mccontent1, #mccontent2 {
  display: inline-block;
  width: 50%;
  vertical-align: top;
}
#mccontent1 select {
  font-size: 14px;
  width: 50px;
  height: 25px;
  border-radius: 2px;
  margin-top: 10px;
}
#mccontent1 video.privacy {
  width: 100%;
  height: auto;
}
#mccontent2 {
  text-align: center;
}
#content ul {
  list-style-position: inside;
  padding: 0 0 0 2px;
}
#content ul li {
  line-height: 1.5em;
}
#content ul ul {
  list-style-position: inside;
  padding: 0 0 0 32px;
}
#content a, #mccontent a {
  font-family: RobotoB, sans-serif;
  color: #576b96;
}

/* NIEUWE SIMULATIE BEGIN */
#content p.legend {
  margin-left: 2px;
  margin-bottom: 2px;
}
#content table.new_sim_legend {
  border: solid 1px #e1e6eb;
  border-spacing: 1px;
  width: 330px;
}
#content table.new_sim_legend tr.no_border {
  border-bottom: none;
}
#content table.new_sim_legend td {
  padding: 3px 10px;
}
#content table.new_sim_legend td.icon {
  background-color: #747575;
  text-align: center;
}
#content table.new_sim_legend td.desc {
  background-color: #e7ebef;
}
#content a.new_sim_start {
  display: inline-block;
  background-color: #f4f5f6;
  border-radius: 3px;
  font-family: RobotoB, sans-serif;
  font-size: 22px;
  color: #3a4764;
  line-height: 80px;
  height: 80px;
  margin: 50px 0;
  padding: 0 10px 0 20px;
  vertical-align: top;
  box-shadow: 0 2px 5px rgba(0,0,0,.2), 0 1px 3px rgba(0,0,0,.3);
  transition: color 0.15s ease-in-out;
}
#content a.new_sim_start::after {
  display: inline-block;
  content: url(images/nieuwe-simulatie-play.png);
  background-color: #f18e00;
  border-radius: 999px;
  line-height: 40px;
  width: 40px;
  height: 40px;
  margin: -10px 0 0 25px;
  padding: 30px;
  vertical-align: top;
  box-shadow: 0 3px 6px rgba(240, 110, 0, .16), 0 6px 8px rgba(240, 110, 0, .24);
  transition: all 0.15s ease-in-out;
}
#content a.new_sim_start:hover::after {
  background-color: #576b96;
  box-shadow: 0 3px 6px rgba(87, 107, 150, .26), 0 5px 10px rgba(87, 107, 150, .34);
}
/* NIEUWE SIMULATIE EIND */

/* NIEUWE VIDEO OP PORTAL BEGIN */
.portal .verzamel2 a::after {
  display: block;
  content: '(Klik om de video af te spelen)';
  font-family: RobotoR, sans-serif;
  color: initial;
  font-style: italic;
  margin-top: 10px;
}
/* NIEUWE VIDEO OP PORTAL EIND */

#footer {
  clear: both;
  display: block;
  width: 100%;
  padding: 0;
  margin: 50px 0 0 0;
  position: relative;
}
#footer p.screen_count, #footer p.timer {
  display: inline-block;
  font-size: 12px;
  color: #909090;
  border: solid 1px #909090;
  border-radius: 2px;
  margin: 0 15px 0 0;
  padding: 4px 10px;
  text-align: center;
}
#footer p.screen_count:empty {
  border: none;
}
#footer p.timer {
  color: #f81f41;
  border: solid 1px #f81f41;
}

/* EINDSCHERM BEGIN */
.widget_block {
  font-size: 14px;
  color: #ffffff;
  padding-left: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}
#post_endscreen .widget_text_block h1 {
  font-size: 30px;
}
.popup-cover {
  background-color: #000 !important;
  opacity: 0.2 !important;
}
.popup-form {
  width: 90% !important;
  max-width: 800px;
  font-family: RobotoR, sans-serif;
  padding: 40px;
}
.popup-form legend {
  display: none !important;
}
.popup-form * {
  font-family: RobotoR, sans-serif;
}
.popup-form fieldset, .popup-form .fieldset {
  border-top: solid #ffffff 15px;
  border-bottom: solid #ffffff 15px;
  border-left: none;
  border-right: none;
  border-radius: 2px;
  box-shadow: 0 15px 24px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
  padding: 0 15px
}
.popup-form .inline_error {
  background-color: #ffffff !important;
  color: #ff4040 !important;
  border: none !important;
  box-shadow: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 10px 0 !important;
}
.popup-form .md_close {
  position: absolute;
  top: 16px;
  right: 70px;
  width: 48px;
  height: 48px;
  background-color: #3a4764;
  border-radius: 24px;
  text-align: center;
  box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(0,0,0,.23);
  z-index: 2;
}
.popup-form .md_close .fa {
  font-family: FontAwesome !important;
  color: #ffffff;
  line-height: 48px;
  width: 48px;
  height: 48px;
  border-radius: 24px;
  margin: 0 !important;
  padding: 0;
}
.form_mail_popup {
  text-align: center;
}
.form_mail_popup_title {
  font-family: RobotoR, sans-serif;
  font-size: 22px;
  margin: 50px 0 20px 0;
}
.form_mail_popup_label {
  font-family: RobotoR, sans-serif;
  font-size: 16px;
}
.form_mail_popup_input input.text {
  font-size: 14px;
  width: 300px;
  height: 35px;
  padding: 4px 5px 7px 5px;
  margin: 2px 0 12px 0;
}
.form_mail_popup_button button {
  background-color: #576b96;
  font-size: 16px;
  font-family: RobotoR, sans-serif;
  color: #ffffff;
  border: none;
  border-radius: 2px;
  margin-top: 10px;
  padding: 5px 20px;
  cursor: pointer;
}
.form_mail_popup_button button:hover, .form_mail_popup_button button:focus {
  background-color: #576b96;
}
.form_mail_popup_button button:disabled, .form_mail_popup_button button[disabled] {
  background-color: #747575;
}
/* EINDSCHERM EINDE */

/* PROGRESSBAR BEGIN */
#main.main_progress {
  margin-top: 40px;
}
.meter {
  display: inline-block;
  position: relative;
  background-color: transparent !important;
  border: solid 1px rgba(160, 160, 160, 0.5);
  border-radius: 20px;
  min-width: 100px;
  height: 28px;
  text-align: center;
  line-height: 28px;
  margin: 0 0 10px 0;
  padding: 0 !important;
  white-space: nowrap;
  overflow: hidden;
}
.meter:after {
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  background-color: rgba(160, 160, 160, 0.25);
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 0 2px 2px 0;
  z-index: 1;
  overflow: hidden;
}
.meter p {
  color: #747575;
  position: relative;
  top: 0 !important;
  left: 0;
  z-index: 2;
  margin: 0;
  padding: 0 20px;
}
.meter > span {
  display: block;
  height: 3px;
  background-color: #0db862;
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 0 1px 1px 0;
  z-index: 2;
  overflow: hidden;
}
.divider {
  display: inline-block;
  margin: 0 5px 10px 5px !important;
  height: 28px;
  text-align: center;
  line-height: 28px;
  overflow: hidden;
}
#progressbar_bg {
  position: relative;
  background-color: rgba(160, 160, 160, 0.25);
  width: calc(100% + 60px);
  height: 8px;
  margin: -20px 0 25px -30px;
  padding: 0;
}
#progressbar {
  position: relative;
  top: 0;
  left: 0;
  background-color: #0db862;
  width: 30%;
  height: 8px;
}
.teardrop {
  position: absolute;
  top: -40px;
  left: calc(100% - 15px);
  background-color: #0db862;
  font-size: 12px;
  color: #ffffff;
  line-height: 30px;
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: 50% 50% 0 50%;
  transform: rotate(45deg);
}
.percent {
  display: block;
  transform: rotate(-45deg);
}
.question_nr_dot {
  position: relative;
  float: left;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 3px;
  width: 6px;
  height: 6px;
  margin: 0 0 0 20%;
  padding: 0;
}
.question_nr {
  position: absolute;
  top: -20px;
  left: -6px;
  font-size: 14px;
  width: 18px;
  text-align: center;
  margin: 0;
  padding: 0;
}
/* PROGRESSBAR EIND */

/* AVG FOOTER BEGIN*/
.avg_footer {
  display: block;
  width: calc(100% - 20px);
  max-width: 1280px;
  margin: -37px auto 37px auto;
  padding: 0;
}
.avg_footer a {
  font-size: 0.9em;
  text-decoration: none;
  color: #576b96;
}
/* AVG FOOTER  EIND */

/* COPYRIGHT FOOTER BEGIN */
.footer_copyright {
  display: block;
  width: calc(100% - 20px);
  max-width: 1280px;
  font-size: 0.9em;
  margin: -37px auto 37px auto;
  padding: 0;
}
.footer_copyright a {
  text-decoration: none;
  color: #576b96;
}
/* COPYRIGHT FOOTER EIND */

/* PORTAL BEGIN */
.portal img.portal_header {
  width: calc(100% + 60px) !important;
  height: auto !important;
  margin: -45px 0 30px -30px !important;
}
/* PORTAL EIND */

/* PORTAL DASHBOARD BEGIN */
.portal_main #container_header_image img {
  width: calc(100% + 60px) !important;
  height: auto !important;
  margin: -45px 0 30px -30px !important;
}
.portal_main a.container_header_button {
  position: relative;
  display: table;
  border-radius: 99px;
  background-color: #f44336 !important;
  font-family: RobotoM, sans-serif !important;
  color: #ffffff !important;
  font-size: 24px;
  margin: -105px auto 0 auto;
  padding: 10px 50px 10px 35px;
}
.portal_main .widget_full {
  padding: 0 !important;
}
.portal_main .widget_form_fade {
  top: 0 !important;
  left: 0 !important;
  height: 100% !important;
  width: 100% !important;
}
.portal_main .widget_text_block h1, .portal_main .widget_text_block h2, .portal_main .widget_text_block h3, .portal_main .widget_text_block h4 {
  margin-top: 0 !important;
}
/* PORTAL DASHBOARD EIND */

/* AUDIO VRAGEN BEGIN */
#test_question_span.has_audio {
  margin-bottom: 40px;
}
#test_question_span .audioMain {
  float: left;
  margin: -2px 10px 0px 0;
}
.mcspan .audioSub {
  float: left;
  margin: 5px 10px 0 0;
}
.mcspan .has_audio {
  float: left;
  width: calc(100% - 60px);
}
.audioMain, .audioSub {
  background: transparent url(https://www.test-it-online.com/test-maken/layout/audio-mc-player.png) no-repeat 8px 2px;
  width: 38px;
  height: 22px;
  border: solid 1px #a4aaba;
  border-radius: 20px;
  overflow: hidden;
  margin: 100px auto;
  padding: 1px 5px 0 5px;
}
.togglePlay {
  display: flex;
  justify-content: stretch;
  align-items: center;
  background: transparent;
  font-size: 13px;
  color: #69789b;
  width: 100%;
  height: 20px;
  border: none;
  cursor: pointer;
  margin: 0;
  padding: 0 0 0 20px;
  transition: all 0.2s ease;
}
.togglePlay:focus {
  outline: none;
}
.togglePlay:after {
  box-sizing: border-box;
  display: block;
  content: '';
  width: 0;
  height: 0;
  margin-left: 5px;
  border-color: transparent;
  border-style: solid;
  border-top-width: 6px;
  border-bottom-width: 6px;
  border-left-width: 9px;
  border-left-color: #8c96aa;
  transition: all 0.2s ease;
}
.togglePlay.active:after {
  width: 8px;
  height: 10px;
  margin-left: 5px;
  border-width: 0 3px;
  border-color: #8c96aa;
}
.progress {
  width: 0px;
  height: 2px;
  background: #f44336;
  transition: width .1s linear;
}
/* AUDIO VRAGEN EIND */

/* NIEUWE TIMER BEGIN */
.timer2, .timer_warning {
  color: #f18e00;
  border: solid 1px #f18e00;
  border-radius: 99px;
  margin: 0;
  padding: 3px 15px 2px 15px;
  transition: all 0.3s ease-in;
}
.timer_warning {
  background-color: #f18e00;
  color: #ffffff;
}
#js_timelimit {
  font-family: RobotoB !important;
}
/* NIEUWE TIMER EIND */

/* VIMEO VIDEO BEGIN */
.vimeo {
  position: relative;
  max-width: 100%;
  overflow: hidden;
}
.vimeo::before {
  display: block;
  content: '';
  padding-top: 56.25%;
}
.vimeo iframe,
.vimeo object,
.vimeo embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* VIMEO VIDEO EIND */

/* TOETSENBORD POPUP BEGIN */
#popup-form-1 h3 {
  color: inherit !important;
}
/* TOETSENBORD POPUP EIND */


/* MEDIA QUERIES MODULES BEGIN */
/** MIN 800 PX (HOVER) */
@media screen and (min-width: 800px) {
  .nextbtn:hover, .prevbtn:hover, .prevbtn2:hover {
    background-color: #f81f41;
  }
  .nextbtn:active, .prevbtn:active, .prevbtn2:active {
    background-color: #e01332;
    box-shadow: 0 3px 6px rgba(0,0,0,0.3), 0 3px 4px rgba(0,0,0,0.3);
    bottom: -46px;
    transition: none;
  }
}

/* MAX 1600 PX */
@media screen and (max-width: 1600px){
  .resize_picture_right{
    max-width: 80%;
    max-height: 350px;
  }
  .resize_picture_left{
    max-width: 80%;
    max-height: 350px;
    margin-top: 20px;
  }
  .resize_picture_full{
    max-width: 80%;
    max-height: 450px;
  }
/*
  .hotspot_container, .hotspot_sub_container{
    max-width: 80%;
    max-height: 450px;
  }
*/
  #main.theorie .resize_picture_right{
    max-width: 80%;
    max-height: 350px;
    margin-top: 40px;
  }
  #main.theorie .resize_picture_left{
    max-width: 80%;
    max-height: 350px;
    margin-top: 40px;
  }
  #main.theorie .resize_picture_full{
    max-width: 80%;
    max-height: 450px;
  }
/*
  #main.theorie .hotspot_container{
    max-width: 80%;
    max-height: 450px;
  }
  .div_307_image .hotspot_container{
    max-width: 80%;
    max-height: 450px;
  }
*/
  a.unanswered {
    background-size: 190px;
    width: 170px !important;
    height: 170px !important;
  }
}

/* MAX 1366 PX */
@media screen and (max-width: 1370px){
  h1 {
    font-size: 24px;
  }
  #wrapper {
    margin: 70px 0 0 0;
  }
  #banner {
    height: 70px;
  }
  #logo {
    height: 70px;
  }
  #logo .logo_wrapper {
    height: 70px;
  }
  #logo img {
    max-height: 70px;
  }
  #title {
    height: 70px;
  }
  #title h1 {
    font-size: 22px;
    line-height: 26px;
    margin: 9px 0 0 0;
  }
  #title h3 {
    font-size: 18px;
    line-height: 23px;
    margin: 4px 0 0 0;
  }
  .resize_picture_right{
    max-height: 300px;
  }
  .resize_picture_left{
    max-height: 300px;
    margin-top: 20px;
  }
  .resize_picture_full{
    max-height: 400px;
  }
/*
  .hotspot_container, .hotspot_sub_container{
    max-height: 350px;
  }
*/
  #main.theorie .resize_picture_right{
    max-height: 300px;
    margin-top: 40px;
  }
  #main.theorie .resize_picture_left{
    max-height: 300px;
    margin-top: 40px;
  }
  #main.theorie .resize_picture_full{
    max-height: 400px;
  }
/*
  #main.theorie .hotspot_container{
    max-height: 400px;
  }
  .div_307_image .hotspot_container{
    max-height: 400px;
  }
*/
  a.unanswered {
    background-size: 180px;
    width: 160px !important;
    height: 160px !important;
  }
  nav {
    top: 70px;
    height: calc(100% - 100px);
  }
  #nav_container {
    right: 15px;
  }
  #nav_container .keyboard_nav, #nav_container .open_nav_button, #nav_container .next, #nav_container .prev {
    border-radius: 42px;
    width: 42px;
    height: 42px;
  }
  #nav_container .material-icons {
    font-size: 24px;  
  }
}

/* MAX 1280 PX */
/* WEGGEHAALD VANWEGE ZOOM. GAAT NU T/M 175% GOED */
/*
@media screen and (max-width: 1280px){
  .resize_picture_full{
    max-height: 400px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 400px;
  }
  #main.theorie .resize_picture_full{
    max-height: 400px;
  }
  #main.theorie .hotspot_container{
    max-height: 400px;
  }
  .div_307_image .hotspot_container{
    max-height: 400px;
  }
}
 */

/* MAX 1024 PX */
@media screen and (max-width: 1024px){
  h1 {
    font-size: 22px;
  }
  #breadcrumb, #privacy_container_md {
    width: 50%;
  }
  .resize_picture_full{
    max-height: 300px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 300px;
  }
  #main.theorie .resize_picture_full{
    max-height: 300px;
  }
  #main.theorie .hotspot_container{
    max-height: 300px;
  }
  .div_307_image .hotspot_container{
    max-height: 300px;
  }
  #post_endscreen .widget_text_block h1 {
    font-size: 24px;
  }
}

/** MAX 800 PX */
@media screen and (max-width: 800px) {
  h1 {
    font-size: 20px;
  }
  h2 {
    font-size: 18px;
  }
  h3 {
    font-size: 17px;
  }
  h4 {
    font-size: 16px;
    font-family: LatoB, sans-serif;
  }
  #wrapper, #wrapper.md_wrapper {
    margin: 0;
    padding: 0;
  }
  #banner {
    width: 100%;
    height: 140px;
  }
  #logo {
    display: table;
    border: 0;
    width: 100%;
    height: 70px;
    text-align: center;
    padding: 0;
  }
  #logo img {
    margin: 0 auto;
  }
  #title {
    display: block;
    max-width: calc(100% - 100px);
    border: none;
    padding: 0 15px;
  }
  .md_wrapper #header {
    margin-top: 154px;
  }
  nav {
    top: 140px;
    height: calc(100% - 170px);
  }
  #main, #breadcrumb {
    margin-top: 30px;
  }
  .new_endscreen {
    padding: 20px !important;
  }
  #breadcrumb, #privacy_container_md {
    margin-bottom: -20px;
  }
  #breadcrumb_group, #breadcrumb_category {
    min-width: 30%;
    max-width: 80%;
    height: 27px;
    line-height: 26px;
  }
  #breadcrumb_group p, #breadcrumb_category p {
    font-size: 0.9em;
    padding: 0 10px;
  }
  #privacy_container_md {
    padding: 0;
  }
  #privacy_container_md .privacy {
    background-size: 32px 32px;
    vertical-align: middle;
  }
  #privacy_container_md .privacy .logged_as, #privacy_container_md .privacy a {
    font-size: 0.8em;
    margin-right: 38px;
  }
  #content img[align="left"],
  #content img[style*="float: left"],
  #content img[style*="float:left"],
  #content img[align="right"],
  #content img[style*="float: right"],
  #content img[style*="float:right"] {
    float: none !important;
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 20px auto 20px auto !important;
  }
  #mccontent1, #mccontent2, #mccontent1b, #mccontent2b {
    display: block;
    width: 100%;
    margin-bottom: 40px;
  }
  #mccontent2, #mccontent1b {
    margin-bottom: 40px;
  }
  #mccontent1, #mccontent2b {
    padding: 0;
  }
  #mccontent1 .mccheck[type=checkbox] + label, #mccontent1 .mccheck[type=radio] + label {
    width: calc(100% - 37px);
  }
  #mccontent2 .feedback_container {
    float: none;
    padding: 0;
    margin: 0;
  }
  #mccontent1.matrix1, #mccontent2.matrix2 {
    width: 100%;
  }
  #main .video_wrapper {
    width: 100% !important;
    float: none !important;
  }
  .lightbox_text_left, .lightbox_text_right, .lightbox_img_left, .lightbox_img_right {
    float: none;
    display: block;
    width: 100%;
    margin: 0 0 40px 0;
  }
  .lightbox_img_left, .lightbox_img_right {
    text-align: center;
  }
  .resize_picture_full{
    max-height: 270px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 270px;
  }
  #main.theorie .resize_picture_full{
    max-height: 270px;
  }
  #main.theorie .hotspot_container{
    max-height: 270px;
  }
  .div_307_image .hotspot_container{
    max-height: 270px;
  }
  #truefalse label, #truefalse2 label {
    font-size: 1.5em;
    line-height: 75px;
    border-radius: 50px;
    width: 80px;
    height: 80px;
  }
  .return_error, .end_return_error {
    width: 100%;
  }
  .feedback, .feedback2 {
    width: calc(100% - 20px);
    margin: 10px 0 0 0;
  }
  #content.simulatie .feedback2 {
    position: static;
    display: block;
    margin: 0 auto 5px auto;
  }
  .hotspot_wrapper {
    background: none;
    margin: 0 0 0 -20px;
    padding: 0;
  }
  #imgx {
    margin-top: 10px;
  }
  .iqtest #mccontent2 {
    text-align: left;
    width: 100%;
  }
  .iqtest #mccontent1 {
    text-align: center;
  }
  .iqtest .mccheck[type=radio] + label {
    margin: 5px 0;
    padding: 10px;
  }
  .dragcontent1 {
    float: none;
    display: block;
    width: 100%;
    margin: 0;
  }
  #drag_start {
    min-height: 0px;
  }
  #drag_end {
    padding: 0;
  }
  .dragcontent2 {
    float: none;
    display: block;
    width: 100%;
    text-align: center;
  }
  .drag_li{
  	margin: 0 auto 30px auto;
  }
  .unanswered_options {
    width: 100%;
  }
  a.unanswered {
    display: block;
    margin: 0 auto 30px auto;
  }
  .old_endscreen_form {
    display: block !important;
    width: 100% !important;
    margin: 15px 0 !important;
  }
  #footer {
    padding-bottom: 15px;
  }
  #post_endscreen table {
    width: calc(100% - 10px) !important;
  }
  #post_endscreen table tr {
    width: 100% !important;
    min-height: 100px !important;
  }
  #post_endscreen table td {
    display: block;
    width: 100% !important;
    min-height: 100px !important;
  }
  #post_endscreen_table td > div {
    width: 100% !important;
    min-height: 100px !important;
  }
  #post_endscreen_table td > div > div {
    display: block !important;
    width: 100% !important;
    min-height: 100px !important;
    text-align: center;
  }
  #post_endscreen .widget_text_block h1 {
    font-size: 20px;
  }
  #content .portal_text {
    padding: 0;
  }
  .portal video {
    width: 100% !important;
  }
  #main.main_progress {
    margin-top: 60px;
  }
  .privacy_footer_container_md {
    margin: 10px 0 0 0;
  }
  .form_privacy_popup_input input, .form_privacy_popup_input select, .form_privacy_popup_input textarea {
    width: calc(100% - 12px);
  }
  .form_privacy_button {
    text-align: center;
  }
}

/* MAX 700 PX */
@media screen and (max-width: 700px){
  .resize_picture_full{
    max-height: 240px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 240px;
  }
  #main.theorie .resize_picture_full{
    max-height: 240px;
  }
  #main.theorie .hotspot_container{
    max-height: 240px;
  }
  .div_307_image .hotspot_container{
    max-height: 240px;
  }
}

/** MAX 600 PX */
@media screen and (max-width: 600px) {
  #main {
    padding-left: 15px;
    padding-right: 15px;
  }
  .hotspot_wrapper {
    width: calc(100% + 30px);
    margin: 36px 0 0 -15px;
  }
  #content.simulatie .feedback2 {
    max-width: calc(100% - 50px);
  }
  .resize_picture_full{
    max-height: 200px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 200px;
  }
  #main.theorie .resize_picture_full{
    max-height: 200px;
  }
  #main.theorie .hotspot_container{
    max-height: 200px;
  }
  .div_307_image .hotspot_container{
    max-height: 200px;
  }
  #post_endscreen .widget_text_block h1 {
    font-size: 15px;
  }
  #breadcrumb_group, #breadcrumb_category {
    display: block;
    max-width: 40%;
  }
  #breadcrumb .divider {
    display: none;
  }
  #progressbar_bg {
    width: calc(100% + 30px);
    margin-left: -15px;
  }
  img.portal_header {
    width: calc(100% + 30px) !important;
    margin: -45px 0 30px -15px !important;
  }
  .popup-form {
    padding: 40px 5%;
  }
  .popup-form .md_close {
    right: 8%;
  }
}

/* MAX 500 PX */
@media screen and (max-width: 500px){
  .resize_picture_full{
    max-height: 180px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 180px;
  }
  #main.theorie .resize_picture_full{
    max-height: 180px;
  }
  #main.theorie .hotspot_container{
    max-height: 180px;
  }
  .div_307_image .hotspot_container{
    max-height: 180px;
  }
}

/** MAX 480 PX */
@media screen and (max-width: 480px) {
  h1 {
    font-size: 16px;
  }
  #navmenu {
    width: calc(100% - 40px);
  }
  input.absolute_text {
    width: calc(100% - 10px);
  }
  .resize_picture_full{
    max-height: 160px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 160px;
  }
  #main.theorie .resize_picture_full{
    max-height: 160px;
  }
  #main.theorie .hotspot_container{
    max-height: 160px;
  }
  .div_307_image .hotspot_container{
    max-height: 160px;
  }
  #post_endscreen .widget_text_block h1 {
    font-size: 11px;
  }
}
/** MAX 420 PX */
@media screen and (max-width: 420px) {
  .resize_picture_full{
    max-height: 130px;
  }
  .hotspot_container, .hotspot_sub_container{
    max-height: 130px;
  }
  #main.theorie .resize_picture_full{
    max-height: 130px;
  }
  #main.theorie .hotspot_container{
    max-height: 130px;
  }
  .div_307_image .hotspot_container{
    max-height: 130px;
  }
}
/* MEDIA QUERIES MODULES EIND */

/* MATERIAL DESIGN EIND */