@import url("/brocade/fontstyle.css");
@import url("/brocade/x0popup.min.css");



/* afwijkingen t.o.v. x0popup.min.css */

.x0l,.x0l .ball{position:absolute}
.xi-error span::before,.xi-info span::before,.xi-ok span::before,.xi-warning span::before{content:'';box-sizing:border-box}
.x0l{width:120px;height:10px;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.x0l .ball{width:0;height:0;border:5px solid #000;border-radius:30%;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-timing-function:ease;animation-timing-function:ease;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
.x0l .ball-1{border-color:#555;-webkit-animation-name:BallFly-1;animation-name:BallFly-1}
.x0l .ball-2{border-color:#777;-webkit-animation-name:BallFly-2;animation-name:BallFly-2}
.x0l .ball-3{border-color:#999;-webkit-animation-name:BallFly-3;animation-name:BallFly-3}
.x0l .ball-4{border-color:#bbb;-webkit-animation-name:BallFly-4;animation-name:BallFly-4}
@-webkit-keyframes BallFly-1{88%,from,to{margin-left:0}38%,50%{margin-left:110px}}
@keyframes BallFly-1{88%,from,to{margin-left:0}38%,50%{margin-left:110px}}
@-webkit-keyframes BallFly-2{4%,92%,from,to{margin-left:0}42%,54%{margin-left:110px}}
@keyframes BallFly-2{4%,92%,from,to{margin-left:0}42%,54%{margin-left:110px}}
@-webkit-keyframes BallFly-3{8%,96%,from,to{margin-left:0}46%,58%{margin-left:110px}}
@keyframes BallFly-3{8%,96%,from,to{margin-left:0}46%,58%{margin-left:110px}}
@-webkit-keyframes BallFly-4{12%,from,to{margin-left:0}50%,62%{margin-left:110px}}
@keyframes BallFly-4{12%,from,to{margin-left:0}50%,62%{margin-left:110px}}
.x0p-overlay{position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(180,180,180,.5);z-index:50998;-webkit-animation:x0pfadeIn .5s ease;animation:x0pfadeIn .5s ease}
.x0p,.xi{left:50%}.x0p{position:fixed;top:50%;font-size:16px;background-color:#fff;-webkit-transform:translate(-50%,-60%);transform:translate(-50%,-60%);font-family:Verdana,Helvetica,STHeiti;-webkit-animation:x0ppop .45s ease;animation:x0ppop .45s ease;z-index:99999}
.x0p-overlay.no-animation,.x0p.no-animation,.x0p.no-animation .xi>span::before{-webkit-animation:none;animation:none}@-webkit-keyframes x0pfadeIn{from{opacity:0}to{opacity:1}}@keyframes x0pfadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes x0ppop{from{-webkit-transform:scale(.9) translate(-55%,-60%);transform:scale(.9) translate(-55%,-60%);opacity:.3}50%{-webkit-transform:scale(1.1) translate(-45%,-60%);transform:scale(1.1) translate(-45%,-60%);opacity:.7}to{-webkit-transform:scale(1) translate(-50%,-60%);transform:scale(1) translate(-50%,-60%);opacity:1}}@keyframes x0ppop{from{-webkit-transform:scale(.9) translate(-55%,-60%);transform:scale(.9) translate(-55%,-60%);opacity:.3}50%{-webkit-transform:scale(1.1) translate(-45%,-60%);transform:scale(1.1) translate(-45%,-60%);opacity:.7}to{-webkit-transform:scale(1) translate(-50%,-60%);transform:scale(1) translate(-50%,-60%);opacity:1}}@-webkit-keyframes x0pslideUp{from{-webkit-transform:translate(-50%,200%);transform:translate(-50%,200%);opacity:0}to{-webkit-transform:translate(-50%,-60%);transform:translate(-50%,-60%);opacity:1}}@keyframes x0pslideUp{from{-webkit-transform:translate(-50%,200%);transform:translate(-50%,200%);opacity:0}to{-webkit-transform:translate(-50%,-60%);transform:translate(-50%,-60%);opacity:1}}@-webkit-keyframes x0pslideDown{from{-webkit-transform:translate(-50%,-260%);transform:translate(-50%,-260%);opacity:0}to{-webkit-transform:translate(-50%,-60%);transform:translate(-50%,-60%);opacity:1}}@keyframes x0pslideDown{from{-webkit-transform:translate(-50%,-260%);transform:translate(-50%,-260%);opacity:0}to{-webkit-transform:translate(-50%,-60%);transform:translate(-50%,-60%);opacity:1}}
.xi{position:absolute;width:80px;height:80px;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.xi-ok span::before{position:absolute;height:8%;border-radius:10px;background-color:#60BF80}
.xi-ok-left::before{width:40%;left:15%;top:50%;-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-animation:showOKLeft .6s ease;animation:showOKLeft .6s ease}
.xi-ok-right::before{width:60%;left:35%;top:42%;-webkit-transform:rotate(-50deg);transform:rotate(-50deg);-webkit-animation:showOKRight .75s ease;animation:showOKRight .75s ease}@-webkit-keyframes showOKLeft{75%,from{-webkit-transform:rotate(45deg);transform:rotate(45deg);width:0;left:21%;top:37%}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);width:40%;left:15%;top:50%}}@keyframes showOKLeft{75%,from{-webkit-transform:rotate(45deg);transform:rotate(45deg);width:0;left:21%;top:37%}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);width:40%;left:15%;top:50%}}@-webkit-keyframes showOKRight{80%,from{-webkit-transform:rotate(-50deg);transform:rotate(-50deg);width:0;left:46%;top:65%}to{-webkit-transform:rotate(-50deg);transform:rotate(-50deg);width:60%;left:35%;top:42%}}@keyframes showOKRight{80%,from{-webkit-transform:rotate(-50deg);transform:rotate(-50deg);width:0;left:46%;top:65%}to{-webkit-transform:rotate(-50deg);transform:rotate(-50deg);width:60%;left:35%;top:42%}}
.xi-info span::before{position:absolute;background-color:#5080DF}
.xi-info-circle::before{width:11%;height:11%;border-radius:50%;left:50%;top:15%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.xi-info-line::before{width:8%;height:45%;border-radius:10px;left:50%;top:35%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.xi-warning span::before{position:absolute;background-color:#F29F3F}
.xi-warning-circle::before{width:11%;height:11%;border-radius:50%;left:50%;top:71%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.xi-warning-line::before{width:8%;height:45%;border-radius:10px;left:50%;top:15%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
.xi-error span::before{position:absolute;background-color:#EF6080;width:8%;border-radius:10px}.xi-error-right::before{height:80%;top:10%;left:50%;-webkit-transform:translateX(-50%) rotate(45deg);transform:translateX(-50%) rotate(45deg);-webkit-animation:errorDrawRight .6s ease;animation:errorDrawRight .6s ease}.xi-error-left::before{height:80%;top:10%;left:50%;-webkit-transform:translateX(-50%) rotate(-45deg);transform:translateX(-50%) rotate(-45deg);-webkit-animation:errorDrawLeft .75s ease;animation:errorDrawLeft .75s ease}@-webkit-keyframes errorDrawLeft{75%,from{height:0;top:22%;left:23%}to{height:80%;top:10%;left:50%}}@keyframes errorDrawLeft{75%,from{height:0;top:22%;left:23%}to{height:80%;top:10%;left:50%}}@-webkit-keyframes errorDrawRight{80%,from{height:0;top:22%;left:76%}to{height:80%;top:10%;left:50%}}@keyframes errorDrawRight{80%,from{height:0;top:22%;left:76%}to{height:80%;top:10%;left:50%}}
.noscroll{overflow:hidden}
.x0p.default .button,.x0p.default .icon-wrapper,.x0p.default .text-pure-wrapper,.x0p.default .text-wrapper{display:inline-block;vertical-align:top}
.x0p.default .icon-wrapper{position:relative;width:35%;height:100%}
.x0p.default .text-wrapper{position:relative;width:65%;height:100%;margin:0 auto}
.x0p.default .text-pure-wrapper{position:relative;width:100%;height:100%}
.x0p.default .text-anchor{position:absolute;top:50%;width:100%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
.x0p.default .content{width:100%;height:80%;height:calc(100% - 40px)}
.x0p.default.no-button .content{height:100%}
.x0p.default .buttons{width:100%;height:40px;position:absolute;bottom:0;background-color:#eee}
.x0p.default .text-wrapper .input,.x0p.default .text-wrapper .text,.x0p.default .text-wrapper .title{padding-left:0}
.x0p.default .title{padding:0 25px;box-sizing:border-box;font-size:15px;font-weight:700;color:#333}
.x0p.default .text{margin-top:5%;padding:0 25px;font-size:18px;color:#777}.x0p.default .error{margin-top:1px;padding:5px 10px;font-size:13px;background-color:#fe9999;color:#fcfcfc}
.x0p.default .input,
.x0p .x0p-broc-result {
  padding:20px 30px;
}
.x0p.default input[type=text],.x0p.default input[type=password]{margin-top:7%;padding:8px 10px;outline:0;background-color:#f9f9f9;border-width:0 0 1px;border-style:solid;border-color:#aaa;font-size:18px;box-sizing:border-box;width:100%;color:#aaa;-webkit-transition:all ease .3s;transition:all ease .3s}
.x0p.default input[type=text]:focus, .x0p.default input[type=password]:focus{border-color:#5080DF;color:#5080DF}
.x0p.default .button{text-align:center;padding:12px 0;font-size:16px;margin-bottom:0;box-sizing:border-box;border:0;outline-width:0;outline-style:solid;outline-offset:-1px}
.x0p.default .button-outline:focus{outline-width:1px;-webkit-animation:x0pButtonOutline .3s ease;animation:x0pButtonOutline .3s ease}
.x0p.default .button:hover{cursor:pointer}@-webkit-keyframes x0pButtonOutline{from{outline-offset:7px}to{outline-offset:-1px}}@keyframes x0pButtonOutline{from{outline-offset:7px}to{outline-offset:-1px}}
.x0p.default .button-ok{background-color:#60BF80;outline-color:#207F40;color:#fefefe}
.x0p.default .button-ok:hover{background-color:#50AF70}
.x0p.default .button-cancel{background-color:#eee;outline-color:#aaa;color:#666}
.x0p.default .button-cancel:hover{background-color:#e3e3e3}
.x0p.default .button-warning{background-color:#F29F3F;outline-color:#B25F00;color:#fefefe}
.x0p.default .button-warning:hover{background-color:#E28F2F}
.x0p.default .button-info{background-color:#004466;outline-color:#2050AF;color:#fefefe}
.x0p.default .button-info:hover{background-color:#006699}
.x0p.default .button-error{background-color:#EF6080;outline-color:#AF2040;color:#fefefe}
.x0p.default .button-error:hover{background-color:#DF5070}

.x0p.sticktotop{
  top: 120px;
}
.x0p #x0p-close-top-right{
  font-size: 1.5em;
  cursor: pointer;
  position: absolute;
  right: 15px;
  top: 10px;
  z-index: 80000;
}
.x0p #searchdata-results{
  padding: 10px;
}
.x0p .searchdata-link{
  font-size: 14px;
  line-height: 22px;
}
.x0p input{
  font-size: 12px;
  border: 1px solid #bbb;
  padding: 4px;
  border-radius: 5px;
}

ul.ui-autocomplete li.ui-menu-item {
  font-size: 14px;
}

/*x0popup jstree*/
#x0popup .jstree-default.jstree-focused {
  background: none;
}

#x0popup #btree{
  font-size: 10pt;
  margin: 20px;
  margin-bottom: 100px;
}

#x0popup  [id^='empty-'] .jstree-icon{
  background: none;
}

#x0popup .jstree-default .jstree-clicked {
  background: #e7f4f9;
  padding: 0 10px 0 1px;
  border: 1px solid #dbf7f9;
}

#x0popup .jstree-default #actualmenufol {
    background: #006699;
    padding: 0 10px 0 2px;
    border: none;
    color: #fff;
}
#x0popup .actualmenuitem{
  color: #006699;
  background: #e7f4f9;
  padding: 0 10px 0 1px;
}
#x0popup .actualmenuitem:hover{
  padding: 0 9px 0 0;
}

/* end x0popup jstree*/

/* navigatiemenus */

.navmenu {
  z-index:10;
  font-family: arial, verdana, sans-serif;
  right:10px;
  top:50px;
  position:fixed;
  display:none;
  border-collapse: collapse;
  border: 1px solid #808080;
  background-color: #E7E9E2;
}

.ie .navmenu {
  z-index:10;
  font-family: arial, verdana, sans-serif;
  right: 10px;
  top: 1px;
  position: absolute;
  display: none;
  border-collapse: collapse;
  border: 1px solid #808080;
  overflow: hidden;
}

.navmenu td {
  text-align:left;
  margin:0 0 0 0;
  border: 1px solid #808080;
}

.navmenu td:hover {
  background-color: #004466;
  color: #ffffff;
  border: 1px solid #808080;
}

.navmenu a:hover {
  cursor: pointer;
  color: #ffffff;
}

.navmenu a, navmenu a:visited {
  font-size:0.8em;
  text-align:left;
  display:block;
  padding:.2em;
}

.navmenuitemchanged {
  background-color:#F7BE81;
}


fieldset {
  border: 1px solid #ccc;
}

input {
  border: 1px solid #ccc;
}

a {
  text-decoration: none;
  color: #003366;
  border-style: none;
}

a:hover {
	text-decoration: none;
  color: #656565;
  cursor: pointer;
}

[type="checkbox"], [type="radio"] {
  margin: 0 5px 0 0;
}

td { 
  font-size: 10pt; 
}

.workspace-table {
  border-style: solid;
  border-width: thin;
  padding: 3px;
}

.workspace-unichar {
  font-family: fallbackfont;
  color: red;
}
@font-face {
  font-family: "fallbackfont";
  src: local('Tahoma');
  unicode-range: U+0100-01FF;
}

.workspace-tableheader {
  font-family: Verdana, Helvetica, sans-serif ;
  color: #000000 ;
  border-bottom-style: solid;
  border-bottom-width: 1pt;
  border-bottom-color: #004466;
  font-size: 10pt;
  padding: 3px;
  text-align: left;
  font-weight:bold;
}

.workspace-td-header {
  border-bottom:thin solid #CCCCCC;
  border-right:thin solid #CCCCCC;
  color:#000000;
  font-size: 90%;
  text-align:left;
  vertical-align:top;
}

.workspace-td-string {
  border-bottom: thin solid #CCCCCC;
  border-right: thin solid #CCCCCC;
  text-align: left;
}

.workspace-td-number {
  border-bottom: thin solid #CCCCCC;
  border-right: thin solid #CCCCCC;
  text-align: right;
}

.workspace-td-string-emphasis {
  text-align: left;
  font-weight:bold;
}

.workspace-td-number-emphasis {
  text-align: left;
  font-weight:bold;
}

.workspace-td-string-playdown{
  text-align: left;
  font-size: 80%;
}

.workspace-td-number-playdown {
  text-align: left;
  font-size: 80%;
}

.workspace-grayline{
  border-bottom: thin solid #D8D8D8;
}

.workspace-inputsubmit {
  font-size: 80%;
  border-radius:5px;
  border-style:outset;
}

.workspace-inputcode {font-family: monospace;}

.warning {
  background-color: #e7e9e2;
  padding: 10px;
  width: 98%;
  border-radius: 5px;
}

.workspace-body,
.x0p .x0p-broc-result {
  font-family: Verdana, Helvetica, sans-serif ;
  font-size: 10pt;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  color: #000000;
  margin-left: 1em;
}

.workspace-indent-1 {
  margin-left: 2em;
}


.workspace-key {
  font-size: 10pt;
  vertical-align: top;
  font-weight: normal;
}

.workspace-subkey {
  font-size: 8pt;
  font-weight: normal;
}

.workspace-value {
  vertical-align: top;
  font-size: 10pt;
  font-weight: normal;
}

.workspace-tablecell {
  vertical-align: top;
  font-size: 10pt;
  font-weight: normal;
  padding: 5px;
  text-align: left;
  border-bottom: 1px solid #dddddd;
}

div.searchlist tr:hover {
  background-color: #e7e9e2;
}

div.searchlist th {
  background-color: #ffffff;
}

div.searchlist th:hover {
  background-color: #ffffff;
}

.workspace-markedtext { color: #800000; }

.workspace-errortarget { background-color: #f5f5dc; }

.workspace-errormessage { background-color: #f5f5dc; }

.workspace-warningtarget { background-color: #A0D0A0; }

.workspace-warningmessage { background-color: #A0D0A0; }

.workspace-errorselectbox {
  vertical-align: middle;
  padding: 2px;
  font-size: 80%;
}

.workspace-infoblock { font-size: 85%; }

.workspace-application-button {
  margin-top: 12px;
  margin-left: 2px;
  font-size: 9pt;
  border-radius: 5px;
  background-color: #004466;
  color:#ffffff;
  font-size: 10pt;
  border-style:none;
}

.workspace-application-button:hover {
  background-color: #006699;
}

.workspace-history-select {
  font-size: 10pt;
  margin-left: 2px;
  margin-bottom: 5px;
}

.workspace-paragraphtitle { font-weight: bold; }


/* ZOEKOMGEVINGEN */

/* waarschuwingen */
.workspace-searchenv-warningbox { background-color: #f5f5dc; }
.workspace-searchenv-warning { }

/* visuele kenmerken: image */
.workspace-searchenv-img { 
  padding-left: 1em;
  padding-right: 1em;
}

/* startscherm: indexopsomming */
.workspace-searchenv-index {
  margin-left: 2em;
  margin-top: 1em;
}

/* startscherm: invulvelden */
.workspace-searchenv-input { 
  margin-left: 2em;
  margin-top: 1em;
}

/* startscherm: informatie */
.workspace-searchenv-info {
  background-color: #e7e9e2;
  font-size: 85%;
  padding: 2em;
  border-radius: 5px;
}

/* scherm indextermen / korte beschrijving: indexingangen (verwante vormen of hoofdvormen) */
.workspace-searchenv-ix {
  font-size: 70%;
  width: 165px;
}

/* scherm indextermen: hoofdvormen /  verwoording authority code  */
.workspace-searchenv-hv { }
.workspace-searchenv-hvauth {  }

/* scherm indextermen / scherm korte beschrijving: korte beschrijving */
.workspace-searchenv-sd {  }

/* scherm korte beschrijving: verwoording opnemen/verwijderen lijst */
.workspace-searchenv-listaction { font-size: 90%; }

/* scherm geavanceerd zoeken: verwoording operators */
.workspace-searchenv-operator {
  font-variant: small-caps;
  font-weight: bold;
}

/* aantallen */
.workspace-searchenv-nr {
  text-align: right;
  font-weight: bold;
  padding-left: 1em;
}


/* MENU */

.menulist {
  margin-left: 2em;
}

.menubutton {
  font-family: monospace;
  font-weight: bold;
  color: #7c8fc6;
  border-style : outset;
  border-width: thin;
  padding-top: 1px;
  padding-left: 2px;
  padding-right: 2px;
}

:hover .menubutton {
  font-family: monospace;
  font-weight: bold;
  color: #000000;
  border-style : outset;
  border-width: thin;
  padding-top: 1px;
  padding-left: 2px;
  padding-right: 2px;
}

.menubutton-empty {
  font-family: monospace;
  font-weight: bold;
  color: #fff;
  background-color: #fff;
  border-style : solid;
  border-width: thin;
  padding-top: 1px;
  padding-left: 2px;
  padding-right: 2px;
}

ul.menu-grid-content,
ul.menulist{
  list-style-type: none;
  margin-left: 20px;
}
ul.menu-grid-content li.menuicon-folder,
ul.menulist li.menuicon-folder{
  list-style: none;
  color: #003366; 
}

ul li.menutag{
  line-height: 1.3em;
  padding-bottom: 3px;
  text-indent: -18px; /* for double lines in grid, indenting */
}
ul li.menuicon-folder::before {
  content: '\2022';
  font-size: 75%;
  color: #003366;
  padding-right: 8px;
}
ul li.menuicon-item::before {
  content: '\25E6';
  color: #006633; 
  padding-right: 8px;
  padding-left: 1px;
}
.menu-open::before {
  margin-right: -10px;
}

.menu-walk::before {
  margin-right: -10px;
}

.menu-item {
  padding-right: 10px;
  background: transparent no-repeat center right;
}

/* MENU GRID */
.menu-grid-container {
  display: grid;
  display:-ms-grid;
  /*grid-gap: 3em;*/
  justify-content: center;
  grid-template-columns: repeat(2, 45%);
  -ms-grid-columns: 48% 48%;
}

/* FOR IE/EDGE */
@media all and (max-width: 700px){
  .menu-grid-item{
    margin: 0 0 2em 0;
  }
}
@media all and (min-width: 699px) and (max-width: 1399px){
  :nth-child(2n).menu-grid-item{
    margin: 0 0 2em 0;
  }
  :nth-child(2n+1).menu-grid-item{
    margin: 0 2em 2em 0;
  }
} 
@media all and (min-width: 1400px){
  :nth-child(3n).menu-grid-item{
    margin: 0 0 2em 0;
  }
  :nth-child(3n+1).menu-grid-item,
  :nth-child(3n+2).menu-grid-item{
    margin: 0 2em 2em 0;
  }
}

@media all and (min-width: 699px) and (max-width: 1399px) {
  /* 2 columns*/
  .menu-grid-item:nth-child(2){
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(3){
    -ms-grid-row:2;
  }
  .menu-grid-item:nth-child(4){
    -ms-grid-row:2;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(5){
    -ms-grid-row:3;
  }
  .menu-grid-item:nth-child(6){
    -ms-grid-row:3;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(7){
    -ms-grid-row:4;
  }
  .menu-grid-item:nth-child(8){
    -ms-grid-row:4;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(9){
    -ms-grid-row:5;
  }
  .menu-grid-item:nth-child(10){
    -ms-grid-row:5;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(11){
    -ms-grid-row:6;
  }
  .menu-grid-item:nth-child(12){
    -ms-grid-row:6;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(13){
    -ms-grid-row:7;
  }
  .menu-grid-item:nth-child(14){
    -ms-grid-row:7;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(15){
    -ms-grid-row:8;
  }
  .menu-grid-item:nth-child(16){
    -ms-grid-row:8;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(17){
    -ms-grid-row:9;
  }
}
/* end FOR IE/EDGE */
@media all and (max-width: 700px) {
  .menu-grid-container {
    grid-template-columns: repeat(1, 90%);
    -ms-grid-columns: 95%;
    /*grid-gap: 2em;*/
  }
  /* IE/EDGE */
  .menu-grid-item:nth-child(2){
    -ms-grid-row:2;
  }
  .menu-grid-item:nth-child(3){
    -ms-grid-row:3;
  }
  .menu-grid-item:nth-child(4){
    -ms-grid-row:4;
  }
  .menu-grid-item:nth-child(5){
    -ms-grid-row:5;
  }
  .menu-grid-item:nth-child(6){
    -ms-grid-row:6;
  }
  .menu-grid-item:nth-child(7){
    -ms-grid-row:7;
  }
  .menu-grid-item:nth-child(8){
    -ms-grid-row:8;
  }
  .menu-grid-item:nth-child(9){
    -ms-grid-row:9;
  }
  .menu-grid-item:nth-child(10){
    -ms-grid-row:10;
  }
  .menu-grid-item:nth-child(11){
    -ms-grid-row:11;
  }
  .menu-grid-item:nth-child(12){
    -ms-grid-row:12;
  }
  .menu-grid-item:nth-child(13){
    -ms-grid-row:13;
  }
  .menu-grid-item:nth-child(14){
    -ms-grid-row:14;
  }
  .menu-grid-item:nth-child(15){
    -ms-grid-row:15;
  }
  .menu-grid-item:nth-child(16){
    -ms-grid-row:16;
  }
}
@media all and (min-width: 1400px) {
  .menu-grid-container {
    grid-template-columns: repeat(3, 30%);
    -ms-grid-columns: 33% 33% 33%;
    /*grid-gap: 2em;*/
  }
  /* IE/EDGE */
  .menu-grid-item:nth-child(2){
    -ms-grid-row:1;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(3){
    -ms-grid-row:1;
    -ms-grid-column:3;
  }
  .menu-grid-item:nth-child(4){
    -ms-grid-row:2;
    -ms-grid-column:1;
  }
  .menu-grid-item:nth-child(5){
    -ms-grid-row:2;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(6){
    -ms-grid-row:2;
    -ms-grid-column:3;
  }
  .menu-grid-item:nth-child(7){
    -ms-grid-row:3;
    -ms-grid-column:1;
  }
  .menu-grid-item:nth-child(8){
    -ms-grid-row:3;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(9){
    -ms-grid-row:3;
    -ms-grid-column:3;
  }
  .menu-grid-item:nth-child(10){
    -ms-grid-row:4;
    -ms-grid-column:1;
  }
  .menu-grid-item:nth-child(11){
    -ms-grid-row:4;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(12){
    -ms-grid-row:4;
    -ms-grid-column:3;
  }
  .menu-grid-item:nth-child(13){
    -ms-grid-row:5;
    -ms-grid-column:1;
  }
  .menu-grid-item:nth-child(14){
    -ms-grid-row:5;
    -ms-grid-column:2;
  }
  .menu-grid-item:nth-child(15){
    -ms-grid-row:5;
    -ms-grid-column:3;
  }
  .menu-grid-item:nth-child(16){
    -ms-grid-row:6;
    -ms-grid-column:1;
  }
  .menu-grid-item:nth-child(17){
    -ms-grid-row:6;
    -ms-grid-column:2;
  }
}

.menu-grid-container .menu-grid-header {
    background-color: #004466;
    color: #fff;
    padding: 10px 20px;
}
.menu-grid-container .menu-grid-content {
    padding: 0.5em 1em;
}
.menu-grid-container .menu-grid-item {
    border: 1px solid #004466;
    border-radius: 2px;
    overflow: hidden;
}
/* END MENU GRID*/

/* UPLOADBLOCK */

.workspace-uploadblock {
  padding: .5em;
  background-color: #f5f5dc;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.workspace-uploadbutton {
  font-size: 85%;
  border-radius:5px;
}

.workspace-uploadinput {
  font-size: 85%;
  border-radius:5px;
}

.workspace-uploadmessage { 
  font-size: 90%;
  color: #800000;
}


/* SECTIONS */

.workspace-section-header {
  font-family: Verdana, Helvetica, sans-serif ;
  font-weight: bold;
  padding-top: 5px;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-right: 1em;
  /*
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color:  #004466;
  */
}

.workspace-section-subheader {
  font-family: Verdana, Helvetica, sans-serif ;
  font-weight: bold;
  color: #54598B;
  margin-top: 1em;
  margin-bottom: 1em;
}

.workspace-section-header-2 {
  font-family: Verdana, Helvetica, sans-serif ;
  font-weight: bold;
  padding-top: 5px;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-right: 1em;
}

.workspace-taskbar-jump {
  font-size: 9pt;
  color: #ffffff;
}

input[type=text] {
  font-size: 9pt;
  font-family: monospace;
  border: 1px solid #ccc;
  border-radius: 5px;
}

input[type=password] {
  font-size: 9pt;
  font-family: monospace;
  border-radius: 5px;
  border: 1px solid #ccc;
}

input[type=checkbox] {
  font-size: 9pt;
  font-family: monospace;
  border-radius: 5px;
}

input[type=submit] {
  border-radius: 5px;
  border: 1px solid #ccc;
}


input[type="submit"]:disabled {
  background: grey;
}


textarea {
  font-size: 9pt;
  font-family: monospace;
  font-weight: normal;
  border: 1px solid #ccc;
  border-radius: 5px;
}

select {
  font-family: arial, verdana, sans-serif;
  font-size: 9pt;
  vertical-align: middle;
  border: 1px solid #ccc;
  border-radius: 5px;
  min-width: 150px;
}

option {
  font-family: arial, verdana, sans-serif;
  font-size: 9pt;
}

/* classes voor lookup object */


.lookupmenu {
  position:absolute;
  visibility: hidden;
  border-bottom-width: 1;
  font-size: 8pt;
  font-family: Verdana, Helvetica, sans-serif;
  font-weight: normal;
  line-height: 18px;
  z-index: 100;
  background-color: #ffffff;
  border-radius: 5px;
}


.lookupmenu a:hover {
  background-color: #e7e9e2;
  color: #000000;
}

.lookupsearch {
  color: #000000;
  width: 98%;
  display: block;
  text-indent: 3px;
  border:1px solid #808080;
  padding: 1px 0;
  text-decoration: none;
  font-weight: bold;
  text-indent: 5px;
  font-size: 8pt;
  font-family: Verdana, Helvetica, sans-serif;
  font-weight: bold;
  border-radius: 5px;
}


.lookuphistory {
  color: #000000;
  width: 98%;
  display: block;
  border: 1px solid #808080;
  text-decoration: none;
  text-indent: 5px;
  font-size: 8pt;
  font-family: Verdana, Helvetica, sans-serif;
  font-weight: normal;
  border-radius: 5px;
}


.lookup-copy {
  font-size: 0.8em;
  cursor:pointer;
  color: #003366;
}
.lookup-copy:hover {
  color: #656565;
}
.lookup-copy a {
  cursor:pointer;
  text-decoration: none;
  border-style: none;
}

.lookup::before {
  padding-right: 15px;
  font-size: 0.9em;
}

.extra::before {
  padding-right: 12px;
}

.icon-active {
  color: #008000 ;
  font-size: 1.5em;
  font-family: sans-serif;
}

.block-duplicate {
  padding-bottom: .5em;
}

.taskbarmenu {
  position:absolute;
  visibility: hidden;
  border:1px solid #808080;
  border-bottom-width: 0;
  font:normal 12px Verdana;
  line-height: 18px;
  z-index: 100;
  background-color: #ffffff;
  width: 25em;
}

.taskbarmenu a:hover {
  background-color: #F8FBBD;
  color: #000000;
}

.taskbarmenuitem{
  color: #000000;
  width: 100%;
  display: block;
  border-bottom: 1px solid #808080;
  text-decoration: none;
  text-indent: 5px;
  font-size: 8pt;
}


/* CLASSES voor stijlkenmerken Brocade statistiche tabellen */

.stat-table {
  border-collapse: collapse;
  width:97%;
}

div.stat td,
div.stat tr,
div.stat th {
  border: 1px solid #dddddd;
  padding: 4px;
  vertical-align: top;
}


div.stat th {
  font-weight: normal;
  font-size: 10pt;
  text-align:right;
  padding: 4px;
}

.stat caption {
  font-size: 10pt;
  font-weight:bold;
  text-align:center;
  margin-bottom: 1em;
}

.stat-higher {
	padding:0.25em 0.5em;
	text-align:center;
	vertical-align:top;
}

.stat-previous {
	padding:0.25em 0.5em;
	text-align:left;
	vertical-align:top;
}
.stat-next {
	padding:0.25em 0.5em;
	text-align:right;
	vertical-align:top;
}

.stat-tr-odd {
  color: #000000;
  border-color:#EBE5D9;
  background-color:#e7e9e2;
}


.stat-tr-even {
  border-style: solid;
  border-width: thin;
}

.stat-table-sortable {
  margin-top: 1em;
  margin-bottom: 1em;
  border-style: outset;
  border-width: thin;
  border-spacing: 0;
}

.stat-td-number {
  text-align: right;
	border-right-style: solid;
	border-right-width: thin;
	border-right-color: #cccccc;
	border-bottom-style: solid;
	border-bottom-width: thin;
	border-bottom-color: #cccccc;
}

.stat-td-string {
  text-align: left;
	border-right-style: solid;
	border-right-width: thin;
	border-right-color: #cccccc;
	border-bottom-style: solid;
	border-bottom-width: thin;
	border-bottom-color: #cccccc;
}

.stat-td-header-number {
  vertical-align: top;
	font-weight: bold;
	border-right-style: solid;
	border-right-width: thin;
	border-right-color: #cccccc;
	border-bottom-style: solid;
	border-bottom-width: thin;
	border-bottom-color: #cccccc;
  color: #000000;
  background-color: #EBE5D9;
}

.stat-td-header-string {
  vertical-align: top;
  font-weight: bold;
  color: #000000;
  background-color: #EBE5D9;
}


tr.stat-tr-odd:hover td {
  color: #000000;
  background-color:#f5f5dc;
  border: 1px solid #ccc;
}

tr.stat-tr:hover td {
  color: #000000;
  background-color:#f5f5dc;
  border: 1px solid #ccc;
}

tr.stat-tr-even:hover td {
  color: #000000;
  background-color:#f5f5dc;
  border: 1px solid #ccc;
}

.metascreen-section {
  font-family: Verdana, Helvetica, sans-serif ;
  font-size: 10pt;
  font-weight: bold;
  padding-top: 1em;
  margin-top: 1em;
  margin-bottom: 1em;
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #004466;
}

.metascreen-table {
  font-family: Verdana, Helvetica, sans-serif ;
}

/* Naam van de variabele */
.metascreen-key {
  padding-top: 10px;
  font-size: 10pt;
  vertical-align: top;
  font-weight: normal;
}

/* Waarde van een variabele */
.metascreen-value {
  font-family:  Verdana, Helvetica, sans-serif ;
  padding-top: 10px;
  margin-bottom: 10px;
  font-size: 10pt;
  vertical-align: top;
}

/* Ingevulde en geregistreerde identifier, bv. code voor de objectklasse, gebruikersklasse */
.metascreen-id {
  font-family: Verdana, Helvetica, sans-serif;
  padding-top: 10px;
  margin-bottom: 10px;
  font-size: 10pt;
  font-weight: bold;
  vertical-align: top;
}

/*Infoveld dat instructies en verdere uitleg bevat over hoe je een value moet invullen */
.metascreen-info {
  padding-top: 10px;
  font-family: Verdana, Helvetica, sans-serif ;
  font-size: 9pt;
  vertical-align: top;
  font-weight: normal;
}

.metascreen-lookup { vertical-align: top }

.metascreen-selectbox { 
  font-family: monospace;
  font-size: 9pt;
  width: 300px;
  font-weight: normal;
}

.metascreen-input {
  font-size: 9pt;
  font-family: monospace;
  font-weight: normal;
}


.metascreen-textarea {
  font-size: 9pt;
  font-family: monospace;
  font-weight: normal;
}

.diagram {
  position: relative;
  font-size: 8pt;
}
.diagram div {
  border: 0.05em solid #000;
}
.diagram div {
  position: absolute;
  margin: 0;
  padding: 0;
}

.diagram li {
  position: absolute;
  margin: 0;
  padding: 0;
}


.diagram h3 {
  margin: 0;
  padding-left: 3px;
  padding-right: 3px;
  font-size: 1em;
  font-weight: normal;
  line-height: 2;
  text-align: center;
}

.diagramlevel {
  margin: 0;
  padding-left: 3px;
  padding-right: 3px;
  font-size: 1em;
  font-weight: normal;
  line-height: 2;
  text-align: center;
  border: 0.05em solid #000;
}


.diagram li span {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.diagram ul {
  margin: 0;
  padding: 0;
  list-style: none inside;
}

.diagram-down {
  top: 100%;
  left: 5px;
  height: 1.9em;
  margin-top: 0.05em;
  border-left: 0.05em solid #000;
}
/* Arrowheads */
.diagram-down span {
  bottom: 0;
  left: -0.3em;
  border-top: 0.5em solid #000;
  border-right: 0.3em solid #fff;
  border-left: 0.3em solid #fff;
}

.ir-submission-preamble { margin-bottom: 2em; }

.ir-submission-form{ 
  margin-top: 2em;
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #004466;
}

.ir-submission-button { 
  margin-top: 1em;
  padding-top: 1em;
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: #004466;
}

.ir-feedback-preamble {
  padding-bottom: 1em;
  margin-bottom: 1em;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #004466;
}

.ir-feedback-fields { 
  padding-bottom: 1em;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #004466;
}

.ir-feedback-value{ 
  font-family: monospace;
  padding-left: 2em;
}

.ir-key { margin-top: 1em; }

.rightcolumn {
  margin-left: 15em;
  margin-bottom: 0.5em;
}

.ir-mandatory {
  color: #004466;
  font-weight: bold;
}

/* Context menu */

.contextmenu {
  background-attachment: scroll;
  background-color: #EEF0EB;
  background-image: none;
  background-position: 0 0;
  background-repeat: repeat;
  border-bottom-color: #CCCCCC;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-top-color: #CCCCCC;
  border-top-style: solid;
  border-top-width: 1px;
  border-left-color: #CCCCCC;
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: #CCCCCC;
  border-right-style: solid;
  border-right-width: 1px;
  display: none;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  padding: 0;
  position: absolute;
  width: 150px;
  z-index: 99999;
  font-size: 8pt;
  box-shadow: 10px 10px 5px #888;
}

.contextmenu li {
  list-style-image: none;
  list-style-position: outside;
  list-style-type: none;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  padding-bottom: .8ex;
  padding-top: .8ex;
  padding-left: .2ex;
  padding-right: .2ex;
}

.contextmenu li.separator {
  border-top-color: #CCCCCC;
  border-top-style: solid;
  border-top-width: 1px;
}

.contextmenu li.contextmenuaction:hover {
  background-color: #6CC8EF;
}

.contextmenuinfo {
  margin-left: 1ex;
  margin-right: 1ex;
  margin-bottom: 1ex;
}

.contextmenu div { margin-left: 2ex; }

.contextmenu a { margin-left: 2ex; }

.contextmenu a.contextmenuaction_active:link {color: #000000; }
.contextmenu a.contextmenuaction_active:visited {color: #000000; }
.contextmenu a.contextmenuaction_active:hover {color: #000000; }

.contextmenuaction_inactive {color: #808080; }

.contextmenu a.contextmenuaction_inactive:link {color: #808080; }
.contextmenu a.contextmenuaction_inactive:visited {color: #808080; }
.contextmenu a.contextmenuaction_inactive:hover {color: #808080; }

/* Dropzone */

.dropzone {
  font-variant: normal;
  font-weight: normal;
  text-align: center;
  /*padding: .5em .5em .5em .5em;*/
  color: #555555;
  cursor: default;
  /*background-image:url('/brocade/layout/basket_put.png');*/
  background-repeat: no-repeat;
  width: 0px;
  /*margin-left: 1em;*/
}

.dropzonemessage {
  font-weight: bold;
  margin-top: 1em;
}

.dropzone_hover  {
  font-variant: normal;
  font-weight: normal;
  text-align: center;
/*  padding: .5em .5em .5em .5em;  */
  color: #555555;
  cursor: default;
  width: 50px;
  color: #000000;
  border: 1px dotted;
  border-color: #000000;
  width: 450px;
  height: 50px;
}

.dropzone_form {
  display:none;
  font-size: 10pt;
  background-color:#004466;
  text-align:center;
  padding-top: 1px;
  padding-left: 9px;
  padding-right: 9px;
  margin-left: 2px;
  border-radius: 5px;
  height: 18px;
  color: #ffffff;
  cursor: grab;
}
.dropzone_hover_form {
  width: 200px;
  margin-left: 2px;
  border-style: none;
  background-color: #F7BE81;
  color: #FFFFFF;
  text-align: center;
  border-radius: 5px;
  height: 18px;
  font-size: 10pt;
}

.dropzone_global_fieldset {
  width: 200px;
  margin-bottom: 2em;
}

.dropzone_global_legend {
}

.dropzone_global_label {
  background-image:url('/brocade/layout/basket_put.png');
  background-repeat: no-repeat;
  width: 20px;
  margin-left: 1em;
}

.dropzone_global {
  width: 95%;
/*  background-position: right; */
  background-image: none;
}


.dropzone_hover_global {
  width: 95%
}

.listpath,
.listtitle {
  background-color: #e7e9e2;
  padding: 10px;
  border-radius: 5px;
}
.listtitle {
  width: 100%;
}

.workspace-overview-normal,
.workspace-overview-frozen {
  border: 1px solid #ccc;
  max-width: 80%;
  overflow: auto;
  border-radius: 5px;
  background-color: #e7e9e2;
  padding: 5px;
}

.workspace-overview-frozen {
  background-color: #f5f5dc;
}

.workspace-no-access {
  background-color: #e7e9e2;
  padding: 10px;
  margin-left: 50px;
  margin-right: 50px;
  border-radius: 5px;
}


.ordertable {
  border-style: solid;
  border-width: thin;
  font-size: 9pt;
}

.ordertableheader {
  background-color: #e7e9e2;
  border-top: thin solid #CCC;
  border-left: thin solid #CCC;
  font-size: 8pt;
  text-align: left;
}


.budgettable {
  border-style: solid;
  border-width: thin;
  font-size: 9pt;
}

.budgettableheader {
  background-color:#e7e9e2;
  border-top: thin solid #CCC;
  border-left: thin solid #CCC;
  font-size: 8pt;
}

.loangood {
  background-color:#e7e9e2;
  border-radius:5px;
}

.loanbad {
  background-color: #f5f5dc;
  border-radius: 5px;
}


.workspace-objinfo {
  background-color: #e7e9e2;
  border-radius: 5px;
}

.workspace-td-view {
  background-color: #e7e9e2;
}

.workspace-td-warning {
  background-color: #f5f5dc;
}

.workspace-td-error {
  background-color: #800000;
  color: #ffffff;
}

.workspace-td-processed {
  background-color: #a5d68c;
}


.chouse-credit-mode {
  border-style: solid;
  border-width: 1px;
  border-color: #656565;
  max-width: 80%;
  overflow:auto;
  border-radius: 5px;
  background-color: #e7e9e2;
  padding: 5px;
}

.chouse-invoice-mode {
  border-style: solid;
  border-width: 1px;
  border-color: #656565;
  max-width: 80%;
  overflow: auto;
  border-radius: 5px;
  background-color: #e7e9e2;
  padding: 5px;
}

/* Search Autocomplete */
.autosearch-list .autosearch-lookupsearch {
  border-bottom: 1px solid #aaa;
  border-top: 1px solid #aaa;
  margin-top: -1px;
  margin-bottom: -1px;
}

.autosearch-list.ui-widget {
  font-size: 12px;
}

.autosearch-list.ui-menu .ui-menu-item a {
  padding: .22em 1.8em;
  text-indent: -11px;
}

.ui-widget input {
  border-radius: 5px;
  padding: 4px;
}

#searchmetadata {
  float: right;
  margin-right: 110px;
}
ul.ui-autocomplete.autosearch-list {
  max-width: 350px;
}

ul.ui-autocomplete {
  max-height: 250px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 10px;
}
/* END Search Autocomplete*/


/* Keyboard switch */
div.keyboard .active,
div.keyboard .active a{
  color: #656565;
  cursor: default;
}
div.keyboard .active{
  margin-left: -17px;
}
div.keyboard .active span{
  padding-right: 4px;
}
/* End Keyboard switch */


.provenance-header {
  background-color: #e7e9e2;
  height: 30px;
  border-radius: 5px;
  padding: 5px;
}

/* Inputfield with icon */
.input-with-icon {
  position: relative;
}

.input-with-icon input{
  width: 100%;
  border: 1px solid #aaa;
  margin: 8px 0;
  outline: none;
  padding: 8px;
  transition: 0.3s;
  padding-left: 40px;
}

.input-with-icon i {
  position: absolute;
  left: 0;
  top: -6px;
  transition: 0.3s;
  background-color: #aaa;
  color: #fff;
  padding: 9px 5px;
}

.input-with-icon :focus {
  border-color: dodgerBlue;
}

.input-with-icon input:focus + i {
  background-color: dodgerBlue;
}

/* End inputfield with icon */

img.bookcover {
  border: solid 1px black; 
  box-shadow: 2px 2px grey;
}

/* mailgrp report styling */
.mailgrp-memberinfo {
  display: flex;
}

.mailgrp-membername {
  flex-basis: 30%;
}