html, body {
    height: 100%;
    margin:  0;
    font-size: 16px;
    line-height: 1.3;
    font-family: sans-serif
}
/* Top Banner zaken */
.banner { background:transparent url("images/hdrbkg01.gif") repeat-x scroll 0 0;
            height: 120px; padding:  15px 0px 0px 0px; color: #BE762A;}
.insidebanner {width: 87%; margin: 0 auto 0px; display: block; box-sizing: border-box; }
.h2marg { margin-bottom: 4px; margin-top: 10px;}
.headerrole { background-color: transparent; float: right;  text-shadow: 0px 1px 0 #f3f3f3;   }
.inbanner { font-weight: 600; background: transparent; border: 1px solid #BE762A; font-size: 0.9em;
                       margin-bottom: 3px; box-shadow: 1px 1px; color: #BE762A; }
#Instellen.ui-button { padding: 6px 5px 4px 6px; }
#inst-icon.my-icon { background-image: url("jquis/images/gear-grey.png");   background-repeat: no-repeat;}
#Logout.ui-button { padding: 6px 5px 4px 6px; }
#logout-icon.my-icon { background-image: url("jquis/images/user-grey2.png");   background-repeat: no-repeat;}
/* Kopregel manipulatie om alles gelijk te laten lopen en dichter bij elkaar */
.koptekst { font-weight: 700; }
.inkoptekst { font-weight: 700; }
div.divcenter { text-align: center; padding: 3px;}
div.divcenter > div {margin-left: 0px; margin-right: 0px; margin-bottom: 14px;}
div.divcenter > div > div { padding-left: 0px; padding-bottom: 11px;}
#sel-pers0-button { box-shadow: none;
                    border-color: #fff;
                    width: auto; margin: 5px 0px 5px 0px;
                    padding: 6px 4px 8px 4px;
}
#sel-keuze-button {box-shadow: none; border-color: #fff; width: auto;margin: 5px 0px 5px 0px;padding: 6px 4px 8px 4px;}
#paden:focus { outline: #fff solid 1px;  }
#refresh.ui-button { padding: 6px 6px 4px 7px;}
#refresh {box-shadow: none; border-color:  #fff; }
#ref-icon.my-icon { background-image: url("jquis/images/refresh-black.png"); background-repeat: no-repeat;}
/* Tabel met fixed header */
.tabfixhead { overflow-y: auto; height:500px;}
.tabfixhead thead th { position: sticky; top : 0;}
/* Tabel opmaak in css*/
.showtab { margin-left: 40px; margin-top: 4px; }
table.infofull { width: 95%; table-layout: fixed;  }
#listtabtot.infofull { width: 91%; position: fixed;left: 40px; bottom: 0; }
td { vertical-align: text-top; padding-left: 4px;}
.nrs { text-align: right; padding-right: 10px;}
tr.total { border-top: 1px solid black;}
tr.total td { font-weight: 700; text-align: right; padding-right: 10px;}
tr td.txleft { text-align: left; padding-left: 10px;}
#showtabtot { margin-bottom: 20px;}
.icon-disp  { text-indent: 20px; display:  block; background-repeat: no-repeat;
              width: 16px; height: 16px; float: right;
              background-image: url("images/ui-icons_d19405_256x240.png");
}
.hideit     { display:  none;}
.rowlight   { color: red; background-color: #ffcc33;}
td span.icon-disp { background-image: url("jquis/images/ui-icons_555555_256x240.png");}
.icon-updwn  { background-position: -128px -16px }
.icon-up     { background-position: 0px -16px; }/* arrowthick-1-n (0, -48) triangle-1-n (0,-16) circle-triangle-n = (-96,-192)} */
.icon-down   { background-position: -64px -16px; }
.do-flex     { display: inline-flex;}
/* Formulier opmaak */
.ui-dialog { overflow: visible;}
#sel-padnamen { width: 95%; padding: .4em;}
#sel-padnamen-button { width: 92%; }
#sel-padnamen-menu, #sel-pers1-menu, #sel-pers2-menu, #sel-pers3-menu
    , #sel-pers4-menu, #sel-pers5-menu, #sel-pers6-menu {font-size: 14px;}
#sel-pers1-button, #sel-pers2-button, #sel-pers3-button
    , #sel-pers4-button, #sel-pers5-button, #sel-pers6-button { width: 37%;}
.formpers { width: 37%; font-size: 12px;}
.overflow300 { height: 400px;}
.overflow200 { height: 300px;}
label, input, #sel-padnamen { display:block; }
label { margin-top:12px; }
input.text { width:95%; padding: .4em; }
fieldset { padding:0; border:0; }
.ui-dialog-buttonset { font-size: 14px;}
.validateTips { font-size: 14px; font-weight: 700; }
.validateTips.ui-state-highlight { color: red;}
.noclose .ui-dialog-titlebar-close { display: none;}
form.logon { margin: 30px 30px 30px 30px; }
#ErrLogon { margin-top: 50px; }
hr { margin-bottom: 15px; margin-top: 15px;}
@media screen and (max-width: 1200px) {
  html, body { font-size: 15px;}
}
@media screen and (max-width: 1000px) {
  html, body { font-size: 14px;}
}