* {
    padding: 0px;
    margin: 0px;    
}

html, body {
    background-color: #001940;
	/*background: url('../images/bg.jpg') left top no-repeat fixed;*/
    font-family: arial;
    font-size: 90%;
}

#document {
}

#Index {
}

img {
    border: none;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}


input {
  border: 2px solid blue;
}
input:invalid {
  border: 2px dashed red !important;
}
input:invalid:focus {
  background-image: linear-gradient(pink, lightgreen);
}


h1 {
  font-size: 2em;
  margin: 0.67em 0;
  font-weight: normal;
  color: #AAAAAA;
}
h2 {
  font-size: 1.5em;
  margin: 0.83em 0;
  font-weight: normal;
  color: #AAAAAA;
}
h3 {
  font-size: 1.17em;
  margin: 1em 0;
  font-weight: normal;
  color: #AAAAAA;
}
h4 {
  font-size: 1em;
  margin: 1.33em 0;
  font-weight: normal;
  color: #AAAAAA;
}
h5 {
  font-size: 0.83em;
  margin: 1.67em 0;
  font-weight: normal;
  color: #AAAAAA;
}
h6 {
  font-size: 0.75em;
  margin: 2.33em 0;
  font-weight: normal;
  color: #AAAAAA;
}

.tip {
    font-size: 0.8em;
    font-style: italic;
}

.list:hover {
    background-color: #EEEEEE;
}

table {            
    border-collapse: collapse;
    margin-bottom: 20px;
}

tr {
}

td {
    vertical-align: top;
    text-align: left;
    /*padding: 2px 2px 2px 2px;*/
}

th {
/*
    vertical-align: top;
    text-align: left;
    border-bottom: solid 1px;
    padding: 5px;
*/
}

form {
    border: none;
    width: 100%;
    margin-bottom: 80px;
}

form table tr {
	line-height:2.2em;
}

input {
}

select {
}

ul {
    margin-left: 30px;
}

#deletedialog {
    position:absolute;
    display:none;
    width:100%;
    text-align:center;   
}

.toevoeging {
    font-size: 24px;
}

.logboek {
    font-size:0.8em;
    width:600px;
    height:200px;
    overflow:auto;
    padding: 5px;
}

.logentry tr td {
    line-height: 15px;
}

.prioslider {
    margin-top: 15px;
    margin-bottom: 25px;
}

.percslider {
    margin-top: 15px;
    margin-bottom: 25px;
}

.left {
    text-align: left !important;
}

.center {
    text-align: center !important;
}

.right {
    text-align: right !important;
}

legend {
    /*background-color: #7EA700;*/
    color: #555555;
    font-weight: bold;
    padding: 1px; 
    margin-left: 5px;
}

fieldset {
    margin-bottom: 10px;
    padding: 5px;
}

/*
 * METRO classes
*/

/* VOORGROND KLEUREN */

.fg-color-blue {         
  color: #2d89ef !important;
}
.fg-color-blueLight {
  color: #eff4ff !important;
}
.fg-color-blueDark {
  color: #2b5797 !important;
}
.fg-color-green {
  color: #00a300 !important;
}
.fg-color-greenLight {
  color: #99b433 !important;
}
.fg-color-greenDark {
  color: #1e7145 !important;
}
.fg-color-red {
  color: #b91d47 !important;
}
.fg-color-yellow {
  color: #ffff00 !important; /* #ffc40d */
}
.fg-color-orange {
  color: #e3a21a !important;
}
.fg-color-orangeDark {
  color: #da532c !important;
}
.fg-color-pink {
  color: #9f00a7 !important;
}
.fg-color-pinkDark {
  color: #7e3878 !important;
}
.fg-color-purple {
  color: #603cba !important;
}
.fg-color-darken {
  color: #1d1d1d !important;
}
.fg-color-lighten {
  color: #d5e7ec !important;
}
.fg-color-white {
  color: #ffffff !important;
}
.fg-color-grayDark {
  color: #525252 !important;
}
.fg-color-magenta {
  color: #ff0097 !important;
}
.fg-color-teal {
  color: #00aba9 !important;
}
.fg-color-redLight {
  color: #ee1111 !important;
}

/* ACHTERGROND KLEUREN */

.bg-color-blue {
  background-color: #2d89ef !important;
}
.bg-color-blueLight {
  background-color: #eff4ff !important;
}
.bg-color-blueDark {
  background-color: #2b5797 !important;
}
.bg-color-green {
  background-color: #00a300 !important;
}
.bg-color-greenLight {
  background-color: #99b433 !important;
}
.bg-color-greenDark {
  background-color: #1e7145 !important;
}
.bg-color-red {
  background-color: #b91d47 !important;
}
.bg-color-yellow {
  background-color: #ffff00 !important; 
}
.bg-color-orange {
  background-color: #e3a21a !important;
}
.bg-color-orangeDark {
  background-color: #da532c !important;
}
.bg-color-pink {
  background-color: #9f00a7 !important;
}
.bg-color-pinkDark {
  background-color: #7e3878 !important;
}
.bg-color-purple {
  background-color: #603cba !important;
}
.bg-color-darken {
  background-color: #1d1d1d !important;
}
.bg-color-lighten {
  background-color: #d5e7ec !important;
}
.bg-color-white {
  background-color: #ffffff !important;
}
.bg-color-grayDark {
  background-color: #525252 !important;
}
.bg-color-magenta {
  background-color: #ff0097 !important;
}
.bg-color-teal {
  background-color: #00aba9 !important;
}
.bg-color-redLight {
  background-color: #ee1111 !important;
}

/* BORDER KLEUREN */

[class*=border-color] {
  border: 2px solid;
}
.border-color-blue {
  border-color: #2d89ef !important;
}
.border-color-blueLight {
  border-color: #eff4ff !important;
}
.border-color-blueDark {
  border-color: #2b5797 !important;
}
.border-color-green {
  border-color: #00a300 !important;
}
.border-color-greenLight {
  border-color: #99b433 !important;
}
.border-color-greenDark {
  border-color: #1e7145 !important;
}
.border-color-red {
  border-color: #b91d47 !important;
}
.border-color-yellow {
  border-color: #ffff00 !important;
}
.border-color-orange {
  border-color: #e3a21a !important;
}
.border-color-orangeDark {
  border-color: #da532c !important;
}
.border-color-pink {
  border-color: #9f00a7 !important;
}
.border-color-pinkDark {
  border-color: #7e3878 !important;
}
.border-color-purple {
  border-color: #603cba !important;
}
.border-color-darken {
  border-color: #1d1d1d !important;
}
.border-color-lighten {
  border-color: #d5e7ec !important;
}
.border-color-white {
  border-color: #ffffff !important;
}
.border-color-grayDark {
  border-color: #525252 !important;
}
.border-color-magenta {
  border-color: #ff0097 !important;
}
.border-color-teal {
  border-color: #00aba9 !important;
}
.border-color-redLight {
  border-color: #ee1111 !important;
}
.bordered {
  border-collapse: separate !important;
  border: 1px #ccc solid !important;
}
.striped tbody tr:nth-child(odd) {
  background-color: #f9f9f9;
}


/* OUTLINE KLEUREN */

*:hover[class=outline-color] {
  outline: 3px solid;
}
.outline-color-blue {
  outline-color: #2d89ef !important;
}
.outline-color-blueLight {
  outline-color: #eff4ff !important;
}
.outline-color-blueDark {
  outline-color: #2b5797 !important;
}
.outline-color-green {
  outline-color: #00a300 !important;
}
.outline-color-greenLight {
  outline-color: #99b433 !important;
}
.outline-color-greenDark {
  outline-color: #1e7145 !important;
}
.outline-color-red {
  outline-color: #b91d47 !important;
}
.outline-color-yellow {
  outline-color: #ffff00 !important;
}
.outline-color-orange {
  outline-color: #e3a21a !important;
}
.outline-color-orangeDark {
  outline-color: #da532c !important;
}
.outline-color-pink {
  outline-color: #9f00a7 !important;
}
.outline-color-pinkDark {
  outline-color: #7e3878 !important;
}
.outline-color-purple {
  outline-color: #603cba !important;
}
.outline-color-darken {
  outline-color: #1d1d1d !important;
}
.outline-color-lighten {
  outline-color: #d5e7ec !important;
}
.outline-color-white {
  outline-color: #ffffff !important;
}
.outline-color-grayDark {
  outline-color: #525252 !important;
}
.outline-color-magenta {
  outline-color: #ff0097 !important;
}
.outline-color-teal {
  outline-color: #00aba9 !important;
}
.outline-color-redLight {
  outline-color: #ee1111 !important;
}

/* USERNAME BLOCK */

.user-login {
  float: right;
  margin: 10px 20px 0 0;
  cursor: pointer;
}
.user-login .avatar {
  float: right;
  border: 0px #ccc solid;
  width: 55px;
  height: 55px;
}
.user-login .avatar img,
.avatar [class^="icon-"],
.avatar [class*=" icon-"] {
  width: 100%;
  height: 100%;
}
.user-login .avatar [class^="icon-"],
.user-login .avatar [class*=" icon-"] {
  margin-top: 2px;
  font-size: 30px;
  line-height: 30px;
  display: block;
}
.user-login .name {
  float: left;
  margin: -5px 10px 0;
  text-align: right;
  color: #AAAAAA;
}
.user-login .name .first-name {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 200;
  font-size: 18pt;
  letter-spacing: 0.01em;
  line-height: 22pt;
  font-smooth: always;
  display: block;
  margin: 0;
}
.user-login .name .last-name {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 9pt;
  font-smooth: always;
  line-height: 11pt;
  display: block;
  margin: 0;
}

/* PAGINA INSTELLINGEN */

.page {
  position: relative;
  height: 100%;
  min-height: 100%;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  *zoom: 1;
}
.page:before,
.page:after {
  display: table;
  content: "";
}
.page:after {
  clear: both;
}
.page .page-region {
    display: block;
    margin-top: 50px;
}
.page-header {
    position: fixed;
    top: 0;
    left: 20px;
    right: 20px;
}
.page .page-region .page-region-content {
  margin-top: 90px;
  /*padding-top: 20px;*/
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 20px;
  display: block;
  height: 100%;
  min-height: 100%;
  position: relative;
}

/* TILES */

.tile-group {
  margin: 0;
  margin-right: 80px;
  float: left;
  width: auto;
  height: auto;
  min-height: 1px;
  width: 802px;
}
.tile {
  display: block;
  float: left;
  background-color: #525252;
  width: 130px;
  height: 130px;
  cursor: pointer;
  box-shadow: inset 0px 0px 1px #FFFFCC;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 300;
  font-size: 11pt;
  letter-spacing: 0.02em;
  line-height: 14pt;
  font-smooth: always;
  margin: 0 10px 10px 0;
  overflow: hidden;
}
.tile * {
  color: #FFFFFF;
}
.tile .tile-content {
  width: 100%;
  height: 100%;
  padding: 0;
  padding-bottom: 30px;
  vertical-align: top;
  padding: 10px 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 9pt;
  font-smooth: always;
  line-height: 11pt;
  color: #000000;
  color: #ffffff;
  line-height: 16px;
}
.tile .tile-content:hover {
  color: rgba(0, 0, 0, 0.8);
}
.tile .tile-content:active {
  color: rgba(0, 0, 0, 0.4);
}
.tile .tile-content:hover {
  color: #ffffff;
}
.tile .tile-content h1,
.tile .tile-content h2,
.tile .tile-content h3,
.tile .tile-content h4,
.tile .tile-content h5,
.tile .tile-content h6 {
  font-size: 14pt;
}
.tile .tile-content h1,
.tile .tile-content h2,
.tile .tile-content h3,
.tile .tile-content h4,
.tile .tile-content h5,
.tile .tile-content h6,
.tile .tile-content p {
  padding: 0;
  margin: 0;
  line-height: 24px;
}
.tile .tile-content h1:hover,
.tile .tile-content h2:hover,
.tile .tile-content h3:hover,
.tile .tile-content h4:hover,
.tile .tile-content h5:hover,
.tile .tile-content h6:hover,
.tile .tile-content p:hover {
  color: #FFFFFF;
}
.tile .tile-content p {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 9pt;
  font-smooth: always;
  line-height: 11pt;
  color: #000000;
  color: #ffffff;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tile .tile-content p:hover {
  color: rgba(0, 0, 0, 0.8);
}
.tile .tile-content p:active {
  color: rgba(0, 0, 0, 0.4);
}
.tile .tile-content p:hover {
  color: #ffffff;
}
.tile.icon > .tile-content {
  padding: 0;
}
.tile.icon > .tile-content > img {
  position: absolute;
  width: 64px;
  height: 64px;
  top: 50%;
  left: 50%;
  margin-left: -32px;
  margin-top: -32px;
}
.tile.icon > .tile-content > i {
  position: absolute;
  width: 64px;
  height: 64px;
  top: 50%;
  left: 50%;
  margin-left: -32px;
  margin-top: -32px;
  font-size: 64px;
}
.tile.image > .tile-content,
.tile.image-slider > .tile-content {
  padding: 0;
}
.tile.image > .tile-content > img,
.tile.image-slider > .tile-content > img {
  width: 100%;
  height: auto;
  min-height: 100%;
  max-width: 100%;
}
.tile.image-set > .tile-content {
  margin: 0;
  padding: 0;
  width: 25% !important;
  height: 50%;
  float: left;
  border: 1px #1e1e1e solid;
}
.tile.image-set > .tile-content > img {
  min-width: 100%;
  width: 100%;
  height: auto;
  min-height: 100%;
}
.tile.image-set .tile-content:first-child {
  width: 50% !important;
  float: left;
  height: 100%;
}
.tile.double {
  /*width: 310px;*/
  width: 270px;
}
.tile.triple {
  width: 410px;
}
.tile.quadro {
  width: 550px;
}
.tile.double-vertical {
  height: 270px;
}
.tile.triple-vertical {
  height: 410px;
}
.tile.quadro-vertical {
  height: 550px;
}
.tile .brand,
.tile .tile-status {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  min-height: 30px;
  background-color: transparent;
  *zoom: 1;
}
.tile .brand:before,
.tile .tile-status:before,
.tile .brand:after,
.tile .tile-status:after {
  display: table;
  content: "";
}
.tile .brand:after,
.tile .tile-status:after {
  clear: both;
}
.tile .brand > .badge,
.tile .tile-status > .badge {
  position: absolute;
  bottom: 0;
  right: 0;
  right: 5px;
  margin-bottom: 0;
  color: #ffffff;
  width: 34px;
  height: 28px;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 11pt;
  letter-spacing: 0.01em;
  line-height: 13pt;
  font-smooth: always;
  padding-top: 3px;
}
.tile .brand > .badge.activity,
.tile .tile-status > .badge.activity {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGMSURBVDhPvZMtTwNBEIbv2mtScaICcQJRgSgJCQIEhqSiAlEHAlFRwU/ov0AgUEgUsrIkiJIgMOAQJFSQQAIJJBWIu95Hj2eGvXIpB3W8yWTn452Z3dld25pDmqZuFEWdcrm8jr6JK7Bt+wb9Ft85+vsXswBxHHdIfmFNi4TYG7InXAp6ss52kCTJIc6e6KzSVbrdYzrYDaSFXZU4uEQ8x3FW1ZpMJge5Tn3IdQ3kID5iw4zHTqIsUEP3TWCA7WhgDjRZg/eUFRCR3Fl3KYJjyfALIUU46jHcsSlQl8FdmQJnhrcQJFbJ6QZB0LDDMNyS4XBFo1Kp9Gw4/wi247GLHmvNuBaC47Y5gtzIQB1mBmMGdDSdTpfV+QdM8vfcsqkap6ClgQIQa+a4bXViPGRO5ILjuBqYAwk7yIfhXcNz9CljDFkkST6P4JGjnHA7d+gBxAY3tIve1Khljbi1beKvakHQp0uhfTrMjvOL9H3fX9FE8OM7yxAhdem4QWHZkSufSoTYaaVSkY9kYFmfXgyTciI3uacAAAAASUVORK5CYII%3D) 50% no-repeat;
}
.tile .brand > .badge.alert,
.tile .tile-status > .badge.alert {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFeSURBVDhPpZMtT8RAEIbb7YoTJ04gkQgQuBNIEpB4LD8AwQ9AkCCQhGAvQSAuKHCIE0gEP+DEISAhQYK4pE0/eWa65a7lSvh4k8nsvDv77sxs67UhSZLNNE0LZ3uO/gLj/J+hAkVRWI1+geqMCuR5fkKZoyiKViX+DuQu094wy7KhEmEYrkAk0qt4Nk5R77GszQCuE8fxIXxY8ZJjgiBY8n3/UcTwlsQDNifGmF29AcBtITyGOyan47gXXFfW2g/q+yi+VeptJhVgR1KRHp4HZI+bzknQlhYcvpQZuHRF8xmnCDyLL8MZEI9o4YkW3h1VB+o73DJp3to08l7xsw9Lng5i1EiSSV/Pcbdwzfk8MLcNqjIyye1STnHD5joln7lYcGWtXaP8gYsFfeJyHvR9waExt3wKsV74L3Brn/geu3OUDqiL1T7nNoEK8mLi9RUoZYqlsv4pqtf459/oeR8seozS7mDHCwAAAABJRU5ErkJggg%3D%3D) 50% no-repeat;
}
.tile .brand > .badge.available,
.tile .tile-status > .badge.available {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKvSURBVHjahJA/bJR1HMY/31977x33r2LuClc1LYM9TSAUr5gqtkVJjAkSFxYHE3VgaWRw0cUwOagxMZLApoXFBIwuHVSoQYkVMBXUpqSkMW9jaS25plh7/3rv+3scTIwixs/8PHn+2Bk/SVtN2mqxacYOKw13KfNiXtlneihmDONXqs0VVs/VXP1UqJvnc8qBeZoWYWf9JHXVqWkj2EX55G76X86R4W40aDHNzMdzLBwJLLEWm6fTI+o0knvZ+dkgO/cDfGczTNpl5gjxePrpY0SPMKwKT1A5nCe7Y4ofDgQEv/Ghn2AqunZabUmR9Fb8gQoaUVIVFTSiokaV0qDu0T694Y+rGbWktnQ5+nHiuP+IjrFjR4cqevj9wBK8beO87t6jiyzbKJAiIEWSreQxjAm7QGyeAwzRzb39i/7WFbdV2bGs0nxvs7zjxtlOgRwZPP6v7R5PmhQPUOKEneFLd4UECfqs51WXU/opDL6wb/mdDfJkEfrXgUKk2UKbiM/5BoD76d7reujOANwgJH9H8p14PDnSzBGySZsSReecDIAIDxj/jxH/LcQtW7UJ0E8f69RwuP+0Ohwb1CnTS0CCW6zK3Wb9a4AnNcgWktRoYHdpYhgtWvypfRSARVv5yVXd2smGWuzTHo7qeRZZpk7zH00cRos2ITd5yT/HQY0gPKGW3u0YPvZ06HB77tO2hx5jN5HFTNk11lgHRIs2VW5Tp8kRf5g3eYUUSa5y/eKsfn7NTvlPaCjqelwDF3bx4ADAeXeJc1xijpCYmDJ9jKrCIe0H4IaF81/56VGDJTvtPwV1IFmhTO/4AOWDSQIAWmwiRIokADEx08xeXGD5hUjxQp0GnQCdOAKS1RnNP7tO7VDOMmO9bB8qUQRghVVCW7raUOPEvH45W7IidRoA/DEAmmk0pL+n6f4AAAAASUVORK5CYII%3D) 50% no-repeat;
}
.tile .brand > .badge.unavailable,
.tile .tile-status > .badge.unavailable {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKASURBVHjalJK9axxXFMV/772ZzOysVqvRDgtaSSwpJYFwY3ATEpIm5KNLawgp3Ljz/5E2bu20CYQUBoMNNnaRMkUKqYiQtIgdCQ0TaVc7M29n3nspzC7GMYYcuMWFe7jnHI4YjUY453DOYYyh0+l8opT63vO8L8MwbAshqKqq0lo/c849rqrquXMOIcSbGY1GWGsxxny0urr6MI7jH5RSAFhrAZBSLvc8z3+dTqf3lFL/SCnxAIwxwdra2tP19fXPAC4vL8myjKIoAIiiiF6vR7/fJ0mS75RSH19dXX0hpbwWx8fHrKys/JwkyV1rLYeHh5yenuKc420lzjm2trbY3d3F8zzyPH8ynU6/ERcXF3fiOP7D930ODg44OjoiDMOl7AWstZRlyXA4ZH9/H2MM4/H4K+l53n3f98myjJOTE4Ig+A95kUMURZydnXF+fo5SiiiKHkjf9z9f+AaWst+HRfKL2yiKbssgCNrOOWaz2Xs/vwulFLPZjLquCcPwDcM5x//B2/dyPp9XC3/WWoQQHyQbY2i32/i+T1VVTtZ1/QogSZJlGz/02VpLkiQAlGX5l2ya5mHTNPT7fba3tynLctnAd8llWTIYDNjY2MBaS1EUP0qt9YvJZPI7wM7ODsPhEK01WmuapqFpGrTWVFXFYDBgb28PIQTX19ev67r+TYzHY7TW3W63+zKO41sAaZqSZRk3NzcAtNtter0em5ubAEwmk7/zPP9USjkWaZoyn89xziWdTudRt9v9etGFuq4B8H1/aSXP89dFUdx1zp065xBpmlLXNUIIjDG0Wq1vPc+7H4bhnVarhRCCsiwpiuJPY8xPRVH8EgQBxhistfw7ABpxTL93U9x/AAAAAElFTkSuQmCC) 50% no-repeat;
}
.tile .brand > .badge.away,
.tile .tile-status > .badge.away {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAJ2SURBVHjajJI7iFVnFIW//d9zz52ZO2fG14gzJBgbp5JYKPh+NqKxsxWMRZoBCxu1sAuBKFaClj5KDUQhRXybCIqICjqNYjFDhtExN45e7/uc8y+L/yJGp3A1+2fDWv/ea23zlQvIp0gpRgfrWbZRNrhP0cAOopEyGGSvWmQz15zq59SeuC5LsAis0MJ85SLKG8jXY3pXnKb8/X6iBAB8KLhuzZtQf/gbrWc/WTGetSgnAg9qlCiv/pNk1RYAqz3A6jeg/SyoxMtReRNKNsLAhj24gWW0726H+B3+9Rmyd3fPp5KyXMpf/SqNL5KelEIdH5Ke9Ejj8+SnjyrLWkolZbX7f/jZk5h/e3WN7197j0I/NnMMN3MYoiXgBv6/g+rQmUJDR/Ajv4BP0eylnU5u/pgK/Vj9Ee6/411y8gm5a4b1Qfwt9uYUrnoTXBGLvzvoFCXbDLDaVcjfd38WX0JBRCnUroRW/M1qRzRSxgPt55+NPRc8FJJgbtaB4rBz+phRxtcj//hylr5s4YDScvDVT0KfCw7yGpRGIYohfS2H3v4NoL6tYL3BbWwOsoHawY3y1tDJpp46p8pp5U2UrEcLD0BnCtT4bBIXyJ0J/Pwf0eAu8ELtiROO5uQtazy9LMAvPoKGDoU00n/CSr4K2RTkFfyCMRj+OWg2Ht9RNv27+X/PId8cVN+62/SvWAngqtehdq17yjmURlHfZjRvdxi98fyFr/21GWfT5ivnkQehRfSOnqV35S4KpW4w7ZB/1NNNMYf6wzukk3ulbBI1iIJkBBZX1Bn/gby621wyRrx0DcXhQGzPYOnEY/nmKbVeXLTicNcn+DAArZ4503S5ZjkAAAAASUVORK5CYII%3D) 50% no-repeat;
}
.tile .brand > .badge.busy,
.tile .tile-status > .badge.busy {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAIGNIUk0AAHolAACAgwAA+f8AAIDoAABSCAABFVgAADqXAAAXb9daH5AAAAKNSURBVHjajJI9a1RBGIWfGeLdmPXuKkR0Q0RTmFsFUxgQNcaPRonpbAW1sAlY2IhFfoCIVSDaaVImFhYWmkTxAwJBVgttNqTYQFAjAWPi7t3svXeOxeC3hQdeZpiZ887DmTFuchIlCUoSTLOJ6erqV7F4QYXCaTo68hgDHz82WFmZsbXauKrVWYUhBjCNBsZNTaF6HdVqAT09tzlw4BJhyD8Vx1Au36dSuWyC4LPJMlpwDur1HH19jzh48DiAefUK8+QJVCrgHHR3o2PHUH8/HD16jkKhi7m5UwTBF9zdu6RzcxOJpFRSduOG1N4u5XJ+3LlTam2Vtm+XGxlR2mgokZTOzz90o6PgpqcPpRsbP83GSKWSFEXS/v2+okjq7JRA7vp1pZLSZlPJ5OQZqx07hrVtG+b1a+zNm7B7N4ShR/8u56CtDfbswYyNYZ8+hS1bMPv2XbUKw5MGMNPTsLEBhQJIfwco+SZJAo8f+7XOzj5LR0cegIUFb/715j/lnKerVKDZhFLJWlnrN9OU/1aW/Zha8+FDA4Dublhfh+8N/yVr4etXiCIIAvj0SZa1tRcAOnECtm6FWg2M+dtsDGxu8uMsYJaX31q7unpbcYyOHEFXrsDyMtTrv5NY683VKu7iRTQ4CBKqVm/h7twhnZ9/kEhK41ju2jWpWJTa2qRdu3zl81I+r2x4WNnamv8H5fKLZHQU48bHURwXdfjwM3p6egHs7CzMzPi0swyiCA0MoKEhj76wsOiePx/AmPfGTUwgQFI7UXSP3t5BcjmPvrnp37+19Wf65fJLlpbOK02XqNdpAaClBYJgVe/enWV9fciE4TB79x6iVPLGlRVMtfpGcTymxcUpUyr5nIBvAwDWIWcndiwtQAAAAABJRU5ErkJggg%3D%3D) 50% no-repeat;
}
.tile .brand > .badge.newMessage,
.tile .tile-status > .badge.newMessage {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAC/SURBVDhP1ZE9DgIhFIQhobDYg1haWniMbSw9j0exsfMAeg9L7Sy2kPATnCFI2LgYtjJOMjx4vPkoED+X5OK934cQ+thpFOYvSqmdMMascVDOuQMcGn1GptNaL4W1dgBkMwOSw8jeBJszIKMwexFAN0A+wnQG0Lh4wv0EJIb5AO4fRX8MoDFAlZAyPJSztOSSfiYLAYeyxTcdURcIrqSUJ7iLA4UmAdQbgnqvhakqgEoQXQtTXwEtIuCa9n8pIV67VJf6AmhGmgAAAABJRU5ErkJggg%3D%3D) 50% no-repeat;
}
.tile .brand > .badge.paused,
.tile .tile-status > .badge.paused {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAArSURBVDhPY/j9+7fDnz9//mPBCQxQgE8NE1QN2WDUgFEDQGDUgIE3gIEBAArtNKc4HT7sAAAAAElFTkSuQmCC) 50% no-repeat;
}
.tile .brand > .badge.playing,
.tile .tile-status > .badge.playing {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEXSURBVDhPY4CBnz9/pvz+/dsFyiUaMEFpBiYmJhkgtf3v37/t////Z4GIEgZwA0CAkZGRBai5AmjIYSCtABXGC1AMQAIWf/78OQ/EEVA+ToDLAJBrBIDUcqBrZgNdwwMRxQQ4DYABoOYUoCGngYFsABVCAQQNgAINYCAf//XrVwGUDwfEGgDyEgfQkH5guGwGukoEKky8AUhA5sePH6DwAQOSDAC6YgIzM7MpJyfnHagQcQYAnfwGiD2BmguBhvyBCoMBMQbsYWFh0WVlZd0B5aMAnAYAbfzz79+/SqBmV6CtL6DCGACXAQ+ABliysbF1QPk4AYYBQI0rgH7VBWo+AxXCC+AGADV+AVKJQL9GAp0MYhMBGBgA8v5j1f90TA8AAAAASUVORK5CYII%3D) 50% no-repeat;
}
.tile .brand > .badge.error,
.tile .tile-status > .badge.error {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFiSURBVDhPjVM7TsNQELRjy8ISBQeIREtBEYnQUXCINFTkCCBxgNwAJI5AaejSpaCAEqRINBTcIQ1SbD9/mHmfZP3iSIw0ytt9O7O7thMGHpqmGVZVNQnD8AwcMde27RL8rOt6nqbpjy7sA4RTpdQKv20fcbcuy/IOZrGVbIHLpz7RHr52TJCYukuMeU+6WDBjdxej4UyLubMbm0KdBDyTzHWEyY01UEVRnA4Q8IEdaZVAFEW3yD/g+IzzFc6VuTFAHAPXO7vLKQi5q+suuOD+X15yx4ToEXON1QB3B6ZkC3Qd+q8Kaxzbo0TMCTLPefPAfPS8nTeOtnk1YEfMsf11pIm+y/P8BLusmaCZrevsLE1QO3F51FzopJyCQil2pAnFoLLxI7X6z8SxkVjgeMn4H/jGQz3Ht/BrY2MC85nrsI/sjNpDKzMTSODzHPELQ9EY1H9ndFqCHxC/JEnyrgs1guAPTvwreuY0IiIAAAAASUVORK5CYII%3D) 50% no-repeat;
}
.tile .brand > .badge.attention,
.tile .tile-status > .badge.attention {
  background: #2d89ef url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEbSURBVDhPtZI9bsJAEIVZ7ANQ5gApEomChjoNBUUOkSJFivSUQE3JEThCCo4BkotcIVKKNEi2vP7hveVZrMFgKPJJo915szOzf51/Jc/zhbV2Jfc+kiR5QrLNsqzEMJJ8O0hcM1kWlWUZKtQOOo69ZGdpmn4ofB12QsI3k1BoRtP8F7Gell0GnT6rrpJ4HOfzUiU1ww7o9HepAGI2juNHyeegw7Ja3FRA9iW5jv9slSl0WqD2rEYjF7Hy68E7gCPNORpjpk44sg2CYAg969JTxVoywYIXmlyfAS77jRPDZ8PZN5j3KfiEYeh2yG07wQN5P4g/d9H9Hf5ZMkHM/QO5NbCzh6IoJgbVI/iNBdrALnY8An9X+w9rpLPbA/sADga+JgSiAAAAAElFTkSuQmCC) 50% no-repeat;
}
.tile .brand > .name,
.tile .tile-status > .name {
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 5px;
  margin-left: 15px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 9pt;
  font-smooth: always;
  line-height: 11pt;
  color: #ffffff;
}
.tile .brand > .name:hover,
.tile .tile-status > .name:hover {
  color: #ffffff;
}
.tile .brand > .name > [class*=icon-],
.tile .tile-status > .name > [class*=icon-] {
  font-size: 24px;
}
.tile .brand > .icon,
.tile .tile-status > .icon {
  margin: 5px 15px;
  width: 32px;
  height: 32px;
}
.tile .brand > .icon > [class*=icon-],
.tile .tile-status > .icon > [class*=icon-] {
  font-size: 32px;
}
.tile .brand > .icon > img,
.tile .tile-status > .icon > img {
  width: 100%;
  height: 100%;
}
.tile .brand > img ~ .text,
.tile .tile-status > img ~ .text {
  position: absolute;
  left: 60px;
  width: auto;
}
.tile .brand > .text,
.tile .tile-status > .text {
  position: relative;
  left: 8px;
  top: 5px;
  right: 50px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 9pt;
  font-smooth: always;
  line-height: 11pt;
  color: #000000;
  color: #ffffff;
  line-height: 14px;
  width: 60%;
  padding: 0;
  margin: 0;
}
.tile .brand > .text:hover,
.tile .tile-status > .text:hover {
  color: rgba(0, 0, 0, 0.8);
}
.tile .brand > .text:active,
.tile .tile-status > .text:active {
  color: rgba(0, 0, 0, 0.4);
}
.tile .brand > .text:hover,
.tile .tile-status > .text:hover {
  color: #ffffff;
}
.tile:hover {
  outline: 3px #3a3a3a solid;
}

/* LIST VIEW */

.listview {
  margin-left: 0;
  list-style: none;
  *zoom: 1;
}
.listview li {
  margin-bottom: 10px;
  border: 4px transparent solid;
  padding: 10px;
  width: 300px;
  position: relative;
  display: block;
  cursor: pointer;
  *zoom: 1;
}
.listview li .icon {
  width: 48px;
  height: 48px;
  font-size: 40px;
  float: left;
}
.listview li .icon img {
  width: 100%;
  height: 100%;
}
.listview li .icon i {
  margin-top: 10px;
}
.listview li .data {
  margin-left: 55px;
}
.listview li .data h4 {
  margin: 0;
  padding: 0 0 2px 0;
}
.listview li .data p {
  margin: 0;
  font-size: 9pt;
}
.listview li .data .static-rating.small,
.listview li .data .progress-bar {
  margin-bottom: 3px;
}
.listview li:hover {
  outline: 3px #ccc solid;
}
.listview li:active {
  outline: 3px #3e3e3e solid;
}
.listview li:before,
.listview li:after {
  display: table;
  content: "";
}
.listview li:after {
  clear: both;
}
.listview.image li {
  width: 380px;
}
.listview.image li .icon {
  width: 100px;
  height: 100px;
  border: 1px #ccc solid;
}
.listview.image li .data {
  margin-left: 110px;
}
.listview.image li .data h4 {
  margin-bottom: 4px;
}
.listview.image li .data p {
  line-height: 16px;
  font-size: 10pt;
  margin-bottom: 5px;
}
.listview.image li .data .static-rating.small,
.listview.image li .data .progress-bar {
  margin-bottom: 10px;
}
.listview.iconic li .icon {
  width: 32px;
  height: 32px;
  border: 1px #ccc solid;
}
.listview.iconic li .data {
  margin-left: 40px;
}
.listview.fluid li {
  float: left;
  margin-right: 10px;
}
.listview li div.badge {
  position: absolute;
  left: -4px;
  top: -4px;
  background-color: #2d89ef;
  padding: 5px;
  margin: 0 !important;
  text-align: center;
  display: block;
  font-size: 9pt;
  color: #ffffff;
}
.listview li div.badge.strech {
  padding: 0 5px;
}
.listview li div.badge.right {
  right: -4px;
  left: auto;
}
.listview li div.badge.bottom {
  top: auto;
  bottom: -4px;
}
.listview > li.selected {
  border: 4px #2d89ef solid;
}
.listview > li.selected:after {
  width: 0;
  height: 0;
  border-top: 40px solid #2d89ef;
  border-left: 40px solid transparent;
  position: absolute;
  display: block;
  right: 0;
  content: "";
  top: 0;
  z-index: 1001;
}
.listview > li.selected:before {
  position: absolute;
  content: "\e08a";
  color: #fff;
  right: 4px;
  top: 0;
  font-family: iconFont;
  z-index: 1002;
  display: block;
}
.listview:before,
.listview:after {
  display: table;
  content: "";
}
.listview:after {
  clear: both;
}

/* BREEDTES */

.span1 {
  width: 60px;
}
.span2 {
  width: 140px;
}
.span3 {
  width: 220px;
}
.span4 {
  width: 300px;
}
.span5 {
  width: 380px;
}
.span6 {
  width: 460px;
}
.span7 {
  width: 540px;
}
.span8 {
  width: 620px;
}
.span9 {
  width: 700px;
}
.span10 {
  width: 780px;
}
.span11 {
  width: 860px;
}
.span12 {
  width: 940px;
}
.span13 {
  width: 1020px;
}
.span14 {
  width: 1100px;
}

/* APP-BAR */

.app-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  /*min-height: 80px;*/
  background-color: #1d1d1d !important;
}

.charms {
  position: fixed;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  min-width: 200px;
  width: auto;
}
.charms.place-left {
  left: 0;
  right: auto;
}

.place-left {
  float: left !important;
  margin-right: 10px;
}
.place-right {
  float: right !important;
  margin-left: 10px;
}

label {
    clear:left;
    float:left;
    line-height:2.2em;
}

label span {
    float:left;
}
    
.toolbaritem {
    margin-top:40px;
    text-align:center;    
    font-size: 0.8em;
    width: 70px;
    text-decoration: none;
}

#buttonbar {
    margin-top: 20px;
    padding: 5px;
    height: 26px;
}

/* KENDO UI AANPASSINGEN */

.k-grid-header {
    height: 42px;
}

.k-group {
    margin-top:7px;
    margin-right:5px;
}

.k-grid-footer {
    height: 32px;
}

input {border: solid 1px #CCC;}    

.k-invalid-msg {
    background-color: #FFCCCC;
}

#dialog ul {
    list-style: disc;
    margin-left: 30px;
}

#dialog ol {
    list-style: decimal;
    margin-left: 30px;
}

#dialog p {
    margin-bottom: 10px;
}

td.k-group-cell {
      background-color: #fff !important;
}