/* reset CSS
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
} */
/**************************************************************************/
/* This CSS file must be the first of all CSS files.                      */
/* Creates the body of the page, the height is set in screenpars_xxxx.js  */
/* the of the project. height is depending on the viewport height.        */
/**************************************************************************/
/* End of style definition of menu's in horizontal form in the pages.    */
/*                          */
/* Navileren CSS specials.  */
/*                          */
/* RC 20160312 added for new UI masterpage. */
/*                          */
/* Bemplanner colours       */
/*                          */
/*                          */
/* New UI Idyia colors      */
/*                          */
/* Blue       RGB 000 00 255 CMYK 70-16-00-00 */
/* Blue       RGB 038 169 225 CMYK 70-16-00-00 */
/* Lightgreen RGB 201 201 045 CMYK 25-10-99-00 */
/* Orange     RGB 252 176 060 CMYK 00-35-86-00 */
/* Purple     RGB 237 035 124 CMYK 00-96-18-00 */
/* Green      RGB 141 198 063 CMYK 50-01-99-00 */
/* DGreen    */
/* Lightgrey with matching color*/
/* Dark Green for header text instead of blue */
/* 0.7 Transparent colors for background */
/* Lightgrey with matching color*/
/* Grid colors */
/* Colors for judgement */
/*                          */
/* Navileren CSS specials.  */
/*                          */
/*@ClrBgColNavHdr : #BFCFFF;
@ClrBgColPupNav : #D0DBE6;
@ClrBgColNav 	: #FFFFE0;*/
/* Colors for Navileren Educational */
body {
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
h2 {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
h3 {
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}
h4 {
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}
h5 {
  margin-top: 1em;
  margin-bottom: 1em;
}
img {
  border: 0;
}
/* Takes care of stretching the images.                                  */
.AppClsImg_Stretch {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
/* Sets the container for the logoff , part of the container */
/* and displays the logo picture. Here the left position is changed.             */
/* Sets the container for the logoff , part of the container            */
/* and displays the logo picture. Here the left position is changed.    */
/* Start of style definition of menu's in horizontal form in the pages */
/* End of style definition of menu's in horizontal form in the pages.    */
/* End of style definitions for the inside parts of the main headerbox.  */
/*  This class is in first instance used for the multi input format
    booking. This is the start of our own templates */
/*  Used */
.AppClsFormulierSingle {
  width: 780px;
  display: block;
  height: auto;
  padding-left: 0;
  padding-right: 0;
  /*outline: 0 0 0;*/
}
.AppClsLeftAlign0v5,
.AppClsLeftAlign1v5,
.AppClsLeftAlign2v5,
.AppClsLeftAlign3,
.AppClsLeftAlign4,
.AppClsLeftAlign4v5,
.AppClsLeftAlign5,
.AppClsLeftAlign6,
.AppClsLeftAlign7,
.AppClsLeftAlign7v5,
.AppClsLeftAlign8,
.AppClsLeftAlign10,
.AppClsLeftAlign11,
.AppClsLeftAlign12,
.AppClsLeftAlign13,
.AppClsLeftAlign15,
.AppClsLeftAlign20,
.AppClsLeftAlign25 {
  float: left;
  margin-right: 0.5em;
  padding-top: 0.2em;
}
.ClsPos0v5,
.ClsPos1v5,
.ClsPos2v5,
.ClsPos3,
.ClsPos4,
.ClsPos4v5,
.ClsPos5,
.ClsPos6,
.ClsPos7,
.ClsPos7v5,
.ClsPos8,
.ClsPos9,
.ClsPos10,
.ClsPos11,
.ClsPos12,
.ClsPos13,
.ClsPos15,
.ClsPos20,
.ClsPos25 {
  padding-left: 0;
}
.AppClsLeftAlign25,
.ClsPos25 {
  width: 25em;
}
.AppClsLeftAlign20,
.ClsPos20 {
  width: 20em;
}
.AppClsLeftAlign15,
.ClsPos15 {
  width: 15em;
}
.AppClsLeftAlign13,
.ClsPos13 {
  width: 13em;
}
.AppClsLeftAlign12,
.ClsPos12 {
  width: 12em;
}
.AppClsLeftAlign11,
.ClsPos11 {
  width: 11em;
}
.AppClsLeftAlign10,
.ClsPos10 {
  width: 10em;
}
.AppClsLeftAlign9,
.ClsPos9 {
  width: 9em;
}
.AppClsLeftAlign8,
.ClsPos8 {
  width: 8em;
}
.AppClsLeftAlign7v5,
.ClsPos7v5 {
  width: 7.5em;
}
.AppClsLeftAlign7,
.ClsPos7 {
  width: 7em;
}
.AppClsLeftAlign6,
.ClsPos6 {
  width: 6em;
}
.AppClsLeftAlign5,
.ClsPos5 {
  width: 5em;
}
.AppClsLeftAlign4v5,
.ClsPos4v5 {
  width: 4.5em;
}
.AppClsLeftAlign4,
.ClsPos4 {
  width: 4em;
}
.AppClsLeftAlign3,
.ClsPos3 {
  width: 3em;
}
.AppClsLeftAlign2v5,
.ClsPos2v5 {
  width: 2.5em;
}
.AppClsLeftAlign1v5,
.ClsPos1v5 {
  width: 1.5em;
}
.AppClsLeftAlign0v5,
.ClsPos0v5 {
  width: 0.5em;
}
/* General Classes. */
.AppClsHead_Rounded_Div {
  font-size: 113%;
  color: Navy;
  font-weight: bold;
}
/*// End of styles used for descriptions in right upper part of data. 

// Start of CSS for Dialog formatting purposes.
//   These classes can be changed locally.*/
.ClsDialogShadow {
  box-shadow: -1px 1px 10px 10px rgba(8, 8, 8, 0.15);
  font-family: 'Alegreya Sans', sans-serif;
}
/* Some utility classes */
.clsDispNone,
.ClsDispNone {
  display: none;
}
.ClsTaCenter,
.ClsDiVText_Center {
  text-align: center;
}
.AppClsDivFloatLeft {
  float: left;
}
.AppClsDivFloatRight {
  float: right;
}
.AppClsDivFloatClear {
  clear: both;
}
/* Start of CSS for Dialog formatting purposes.
   These classes can be changed locally.        */
/* Used for padding dialog fields, except the first one. */
.AppClsSubPadding {
  padding-left: 10px;
  padding-top: 5px;
  height: auto;
}
/****************************************/
/* CSS for slick, before in every file. */
/****************************************/
.invis {
  visibility: hidden ;
}
.DivChild {
  width: 744px;
}
.NoBorders {
  border-style: none;
}
.slick-cell.selected {
  background-color: #E4BD5B;
}
.cell-story {
  white-space: normal!important;
  line-height: 19px!important;
}
.loading-indicator {
  display: inline-block;
  padding: 12px;
  background: white;
  font-weight: bold;
  z-index: 9999;
  border: 1px solid red;
  border-radius: 0.9em;
  /*	-moz-background-clip:    padding;*/
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
  filter: alpha(opacity=50);
  box-shadow: 0 0 5px red;
  color: black;
  /*text-shadow: @par0 @par1 @par2 @par3 @Clr2;*/
  text-shadow: 1px 1px 1px white;
}
.loading-indicator label {
  padding-left: 20px;
  background: url('/css/slick/images/ajax-loader-small.gif') no-repeat center left;
}
/****************************************/
/* End of CSS for slick.                */
/****************************************/
/* Class for the forms to set some styles. Used */
.AppClsForms {
  font-size: 75%;
}
/* End of Class for the forms to set some styles. */
/* style for span in exp_start.aspx */
.clsSpanTitle {
  margin: 10%;
  font-size: 130%;
  font-weight: bold;
  color: white;
}
.clsSpanText {
  margin: 10%;
  font-size: 120%;
  font-weight: bold;
  color: Black;
}
.clsScroll,
.ClsScroll {
  overflow: auto;
}
.clsYScroll,
.ClsYScroll {
  overflow-y: auto;
}
.ClsXScroll {
  overflow-x: auto;
}
.ClsNoScroll {
  overflow: hidden;
}
.AppClsGenHead {
  padding-top: 7px;
  font-weight: bold;
}
.ClsTitleText {
  overflow: hidden;
  padding-left: 4px;
  font-weight: bold;
  font-size: 116.65%;
  color: #e77208;
  background-color: transparent;
}
.ClsDispNone {
  display: none;
}
.IsItalic {
  font-style: italic;
}
.locDiscTitleLine {
  font-weight: bold;
}
.selectbutton {
  padding: 2px;
  border: 1px solid black;
  width: 7.5em;
  height: 1.8em;
  background-color: #EEE;
  border-radius: 0.333em;
  /*	-moz-background-clip:    padding;*/
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  cursor: pointer;
}
/* General Classes used in the PagiFile */
.ClsBorder-Radius {
  border-radius: 0.666em;
  /*	-moz-background-clip:    padding;*/
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.ClsGenericRect {
  position: static;
  overflow: hidden;
}
.ClsBgClrTransparent,
.ClsBlankRect {
  background-color: transparent;
}
.ClsPopupCaptionText {
  color: #e77208;
  font-size: 91%;
  /* based on 0.75em */
}
.ClsBorderRect {
  border: 1px solid #E77208;
}
.ClsFillRect {
  background-color: #FFEEDD;
}
.ClsCaptionText {
  padding-top: 5px;
  padding-bottom: 5px;
  color: black;
}
/* BOLDFIELD is only used in pagifile, must be replaced by ClsBoldField. */
.ClsBoldField {
  font-weight: bold;
  font-size: 120%;
  /* based on 0.75em */
}
.scrolldiv,
.ClsScrolldiv {
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  width: 100%;
  -ms-scrollbar-base-color: #FFEEDD;
  scrollbar-base-color: #FFEEDD;
}
.innerdiv {
  padding: 3px;
  width: 100%;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
}
/* Rotate text*/
.box_rotate {
  -moz-transform: rotate(7.5deg);
  /* FF3.5+ */
  -o-transform: rotate(7.5deg);
  /* Opera 10.5 */
  -webkit-transform: rotate(7.5deg);
  /* Saf3.1+, Chrome */
  -ms-transform: rotate(7.5deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);
  /* IE6,IE7 */
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";
  /* IE8 */
  transform: rotate(7.5deg);
}
/* CSS for Box behaviour */
.ClsBorderBox,
.ClsBoxSizing {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.ClsHalfTransp {
  opacity: 0.5;
  filter: alpha(opacity= 50 );
}
/* CSS for borderlines */
.ClsBorder {
  border: 1px solid #E8E8E8;
}
.ClsTopBorder,
.ClsTBorder {
  border-top: 1px solid #E8E8E8;
}
.ClsBottomBorder,
.ClsBBorder {
  border-bottom: 1px solid #E8E8E8;
}
.ClsRightBorder,
.ClsRBorder {
  border-right: 1px solid #E8E8E8;
}
.ClsLBorder {
  border-left: 1px solid #E8E8E8;
}
.ClsBotAndRightBorder,
.ClsBAndRBorder {
  border-right: 1px solid #E8E8E8;
  border-bottom: 1px solid #E8E8E8;
}
.ClsTAndLBorder {
  border-left: 1px solid #E8E8E8;
  border-top: 1px solid #E8E8E8;
}
.ClsTAndRBorder {
  border-right: 1px solid #E8E8E8;
  border-top: 1px solid #E8E8E8;
}
.ClsBAndLBorder {
  border-left: 1px solid #E8E8E8;
  border-bottom: 1px solid #E8E8E8;
}
.ClsLAndRBorder {
  border-left: 1px solid #E8E8E8;
  border-right: 1px solid #E8E8E8;
}
.ClsLBAndRBorder {
  border-left: 1px solid #E8E8E8;
  border-right: 1px solid #E8E8E8;
  border-bottom: 1px solid #E8E8E8;
}
.ClsLTAndRBorder {
  border-left: 1px solid #E8E8E8;
  border-right: 1px solid #E8E8E8;
  border-top: 1px solid #E8E8E8;
}
.ClsTAndBBorder {
  border-top: 1px solid #E8E8E8;
  border-bottom: 1px solid #E8E8E8;
}
/* Several classes for often used width */
.clsW100H2v5O {
  width: 100%;
  height: 2.5em;
}
.clsW100HautoO {
  width: 100%;
  height: auto;
}
.clsW100HautoFLP,
.clsW100Hauto {
  width: 100%;
  height: auto;
  float: left;
  padding-top: 0.25em;
}
.clsW100H2v25FLP,
.clsW100H2v25 {
  width: 100%;
  height: 2.25em;
  float: left;
  padding-top: 0.25em;
}
.clsW98H2v5FL {
  width: 98%;
  height: 2.5em;
  float: left;
  padding-top: 1em;
  padding-left: 1%;
}
.clsW99v9H2v5FLP,
.clsW99v9H2v5 {
  width: 100%;
  height: 2.25em;
  float: left;
  padding-top: 0.25em;
}
.clsW99v9HautoFL,
.clsW99v9Hauto {
  width: 100%;
  height: auto;
  float: left;
}
.clsW30H2v5FL,
.clsW30H2v5 {
  width: 30%;
  height: 2.5em;
  float: left;
}
.clsW30H50FlR,
.clsW30H50FlR {
  width: 30%;
  height: 50%;
  float: right;
}
.clsW50H50FR,
.clsW50H50FlR {
  width: 50%;
  height: 50%;
  float: right;
}
.ClsW100pFlRght {
  width: 100%;
  float: right;
}
.ClsW100p {
  width: 100%;
}
.ClsH100p {
  height: 100%;
}
.ClsW50p {
  width: 50%;
}
.ClsW100H100p {
  width: 100%;
  height: 100%;
}
.ClsHeight2v5 {
  height: 2.5em;
}
/* Height for select listview button in form-floating input fields */
.form-floating-height {
  height: calc(3.5rem + 2px);
}
.ClsPad0V5Top {
  padding-top: 0.5em;
}
.ClsPad0V25Left {
  padding-left: 0.25em;
}
.ClsPad0V5Left {
  padding-left: 0.5em;
}
.ClsVertColumnsWidth {
  width: 15em;
}
/* Font and padding from navileren */
.ClsFntSz12v09 {
  font-size: 75%;
}
/*based on 12 px result = 9px */
.ClsFntSz12v10 {
  font-size: 83.333%;
}
/*based on 12 px result = 10px */
.ClsFntSz12v11 {
  font-size: 91.666%;
}
/*based on 12 px result = 11px */
.ClsFntSz12v14,
.ClsFntSz1v20 {
  font-size: 116.7%;
}
/*based on 12 px result = 14px */
.ClsFntSz12v15,
.ClsFntSz1v25 {
  font-size: 125%;
}
/*based on 12 px result = 15px */
.ClsFntSz12v16,
.ClsFntSz1v30 {
  font-size: 133.3%;
}
/*based on 12 px result = 16px */
.ClsFntSz12v17,
.ClsFntSz1v40 {
  font-size: 141.7%;
}
/*based on 12 px result = 17px */
.ClsFntSz12v18,
.ClsFntSz1v50 {
  font-size: 150%;
}
/*based on 12 px result = 18px */
.ClsFntSz12v20,
.ClsFntSz1v60 {
  font-size: 166.7%;
}
/*based on 12 px result = 20px */
.ClsFntSz12v22,
.ClsFntSz1v80 {
  font-size: 183.4%;
}
/*based on 12 px result = 22px */
.ClsFntSz12v24,
.ClsFntSz2v00 {
  font-size: 200%;
}
/*based on 12 px result = 24px */
.ClsFntSz12v28 {
  font-size: 233.28%;
}
/*based on 12 px result = 28px */
.ClsFntSz12v36 {
  font-size: 300%;
}
/*based on 12 px result = 28px */
.ClsFntSz14v16 {
  font-size: 114.3%;
}
/*based on 14 px result = 16px */
.ClsFntSz14v18 {
  font-size: 128.57%;
}
/*based on 14 px result = 18px */
.ClsFntSz16v18 {
  font-size: 112.5%;
}
/*based on 14 px result = 18px */
/* Css for the jquery ui */
/*  CSS for the new forms. */
#FrmInnerDiv0,
#FrmInnerDiv1 {
  width: 100%;
  height: auto;
}
#ErrorDiv0,
#ErrorDiv1 {
  width: 100%;
  border-top: 1px solid #E8E8E8;
  float: left;
  box-sizing: border-box;
  padding-left: 10px;
  margin-top: 5px;
  height: auto;
  /*min-height:2.5em;*/
}
/*  End of CSS for the new forms. */
.ui-widget-overlay {
  opacity: 0.3;
}
/*                              */
/* For grid */
a.lineedit,
a.linedelete {
  text-decoration: none;
}
a.lineedit.ui-widget-content {
  color: #FCB03C;
  border: 0;
}
a.linedelete.ui-widget-content {
  color: #ED237C;
  border: 0;
}
/* Classes for positions        */
.ClsPosRelative {
  position: relative;
}
.ClsPosAbsolute {
  position: absolute;
}
/* End of Classes for positions             */
/*                                          */
/* Font classes.                            */
.FontLilitaOne {
  font-family: 'Lilita One', cursive;
}
.ClsFontLilitaOne {
  font-family: 'Lilita One', Arial;
}
.ClsFontLilitaOneBold {
  font-family: 'Lilita One', Arial;
  font-weight: bold;
}
.ClsNormal {
  font-weight: normal;
}
.ClsBold {
  font-weight: bold;
}
.ClsBolder {
  font-weight: bolder;
}
/* BOLDFIELD is only used in pagifile, must be replaced by ClsBoldField. */
.BOLDFIELD,
.ClsBoldField {
  font-weight: bold;
  font-size: 120%;
  /* based on 0.75em */
}
/* End of Font classes.                     */
/*                                          */
/* class for transparant background color   */
.ClsTransparantBG {
  background-color: transparent;
}
.fa-anderhalf {
  font-size: 1.5em;
}
/* end of class for transparant background color			*/
/* Redefinition of UI-Theme, to prevent problems when updating theme. 	*/
/* must look for other abstractions.   Used                           
.ui-dialog-title { font-size:81.25%;}
.ui-dialog-buttonpane button { font-size:68.75%;} */
/* Classes for smileys */
.ClsSmileyTaskDif_1,
.ClsSmileyTaskDif_2,
.ClsSmileyTaskDif_3,
.ClsSmileyJudgment_1,
.ClsSmileyJudgment_2,
.ClsSmileyJudgment_3,
.ClsSmileyJudgment_4,
.ClsSmileyJudgment_5 {
  width: 4em;
  height: 4em;
  float: left;
}
.ClsSmileyTaskDif_1 {
  background: url('/css/images/IdyiaSvg/oneofthree_1.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyTaskDif_2 {
  background: url('/css/images/IdyiaSvg/oneofthree_2.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyTaskDif_3 {
  background: url('/css/images/IdyiaSvg/oneofthree_3.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_0 {
  background-color: #E5E5E5;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_1 {
  background: url('/css/images/IdyiaSvg/oneoffive_1.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_2 {
  background: url('/css/images/IdyiaSvg/oneoffive_2.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_3 {
  background: url('/css/images/IdyiaSvg/oneoffive_3.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_4 {
  background: url('/css/images/IdyiaSvg/oneoffive_4.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileyJudgment_5 {
  background: url('/css/images/IdyiaSvg/oneoffive_5.svg') no-repeat;
  background-size: 3em 3em;
  background-position: center;
}
.ClsSmileySelected {
  border: 1px solid blue;
}
.ClsPupilCheckBox {
  width: 2em;
  height: 2em;
  float: left;
  color: #8DC63F;
  background-color: #ebebeb;
  padding: 0.5em 0 0 0.5em;
  border-radius: 0.333em;
  /*	-moz-background-clip:    padding;*/
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
/* End of classes for smileys   */