/* RESET */
html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, 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 {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  background: transparent;
  font-family: Calibri, 'Liberation Sans', 'Ubuntu Sans', sans-serif;
}

body {
  padding-top: 5px;
  box-sizing: border-box;
}

.center,
.centerkop,
.footer {
  width: 1024px;
  margin: 0 auto;
}
.center,
.footer {
  background-color: #f3f1ec;
}
.logo {
  float: left;
  margin-right: 23px;
  margin-top: 1px;
  margin-left: 20px;
}
.footer {
  font-size: 70%;
  color: #666;
  text-align: center;
  line-height: 160%;
  }
.pagecontent {
  border: 1px solid #818380;
  border-top: 1px solid #c6c6c6;
  padding: 0.5em;
  margin-bottom: 5px;
  background: #ffffff;
}

.paginakop {
  background-color: #ffffff;
  padding: 0px 0px 0px 0px;
}

.contentpage {
  padding: 15px;
  margin-bottom: 5px;
  background: transparent;
}

.Widget_List.hoofdmenu {
  padding: 15px 0px 10px 0px;
}
.Widget_List.hoofdmenu li { display: inline; } /* maak menu horizontaal */
.Widget_List.hoofdmenu li a {
  padding: 10px 5px 11px 5px;
  text-decoration: none;
  color: #000000;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  background-color: rgba(243, 241, 236, .3);
}
.Widget_List.hoofdmenu li a:hover {
  background-color: rgba(243, 241, 236, .6);
}
.Widget_List.hoofdmenu li a:active, .Widget_List.hoofdmenu .Widget_LinkButton_Selected  {
  background-color: #f3f1ec;
}

.Widget_List.logout {
  padding: 15px 10px 10px 5px;
}
.Widget_List.logout li { list-style: none; } /* maak menu horizontaal */
.Widget_List.logout li a {
  text-decoration: none;
  color: #aaaaaa;
}
.Widget_List.logout li a:hover {
  color: #000000;
}



/* titel van 'index' pagina */
.pagetitle {
  display: block;
  padding: 5px 10px 5px 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  border: 1px solid #41531D;
  color: white;
  background: #146996;
  font-size: 140%;
}

.contenttitle {
  display: block;
  padding: 15px 30px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-topleft: 5px;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  border-bottom: 1px solid #DADEE5;
  color: black;
  background: #F1F6F9;
  font-size: 16px;
}

.button {
  border-radius: 11px;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.15);
  background: #EAEAEA;
  border-color: #DEDEDE #BBBBBB #BFBFBF #DEDEDE;
  border-style: solid;
  border-width: 1px;
  color: #464646;
  display: inline-block;
  font-size: 80%;
  font-weight: normal;
  line-height: 120%;
  min-height: 1em;
  margin: 0 0.7em 0 0;
  min-width: 60px;
  padding: 3px 10px;
  text-decoration: none;
}
.button.mini {
  padding: 0px 3px;
  min-width: 30px;
  text-align: center;
}
.button:hover {
  color: black;
  background: #EFEFEF;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.button.showOutline:focus {
  border-color: black;
}
.button.Widget_LinkButton_Selected {
  font-weight: bold;
  color: black;
}

.Widget_Table .button {
  border-radius: 1px;
  min-width: 0;
  padding: 1px 2px;
  margin: 0;
  box-shadow: none;
  border-color: #666;
  font-size: 90%;
}

.submenu {
  width: 150px;
  display: block;
  padding-top: 20px;
}

.submenu li {
  list-style: none;
}

.submenu li a {
  padding: 5px 10px 5px 3px;
  display: block;
  text-decoration: none;
  color:  #000000;
  text-align: right;
}
.Widget_Section.submenu li a {
  margin-left: 10px;
}

.submenu li a:hover,
.submenu li a.Widget_LinkButton_Selected,
.Widget_Droppable_Hover {
  background: #E6E3DE;
}

.submenu_item {
}

.submenu.horizontal {
  display: table;
  background: ;
  width: 100%;
  padding: 0;
  border-bottom: 1px solid #DADEE5;
}
.submenu.horizontal li {
  float: left;
}
.submenu.horizontal li a {
  font-size: .9em;
  height: 100%;
  padding: 5px 10px;
  display: block;
  border-right: 1px solid #EEE;
  border-left: 1px solid #CCC;
}
.submenu.horizontal li:first-child a {
  border-left: 0;
}
.submenu.horizontal li:first-child a:hover,
.submenu.horizontal li:first-child a.Widget_LinkButton_Selected {
}
.submenu.horizontal li:last-child a {
  float: right;
}
.submenu.horizontal li a:hover {
  background-color: rgba(243, 241, 236, .6);
}

.weeknummer {
  display: block;
}

.weeknummer li {
  list-style: none;
  display: inline;
}

.weeknummer li a {
  display: inline-block;
  text-decoration: none;
  color: #000000;
}

.weeknummer li a.Widget_LinkButton_Selected,
.Widget_Droppable_Hover,
.weeknummer li a:hover {
  background:  #E6E3DE;
}

.weeknummer_item {
  padding: 5px 0px 5px 3px;
  width: 100px;
}

/* todo... */
.tabelrij td {
  padding: 3px 5px;
}
.tabelrij tr.odd td {
  background-color: rgba(241, 246, 249, .5);
}
.Widget_Table.tabelrij tr:hover td,
.Widget_Table.Overzicht tr:hover td {
  background-color: #E6E3DE;
}

.content {
  background: #ffffff;
  width: 870px;
  min-height: 600px;
  -webkit-box-shadow: 0 0 3px #ccc;
  -moz-box-shadow: 0 0 3px #ccc;
  box-shadow: 0 0 3px #ccc;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  border-color: #d7d7d7;
  border-width: 1px;
  border-style: solid;
}

.cake {
  background-image: url('cake.svg');
  background-position-x: right;
  background-position-y: 30px;
  background-size: 23%;
  background-repeat: no-repeat;
}

.page {
  padding: 10px 0px 10px 0px;
}


table {
  border: none;
  background-color: #FFFFFF;
}

th, td {
  padding: 3px 8px;
  border: none;
  background-color: #FFFFFF;
}

th {
  background-image: none;
  border-color:  #FFFFFF;
  text-align: left;
}

td {
  padding: 1px 8px;
  font-size: 10pt;
}

.buttoncol {
  padding: 0px;
}

.Widget_Table_ControllerDiv {
  width:130px;
  margin:auto;
}

.Widget_Table tr {
   background-color: #FFFFFF;
}

.Widget_Table tr:hover {
   background-color: #FFFFFF;
}

.Widget_Table_Hover tr:hover {
   background-color: #FFFFFF;
   cursor:pointer;
}

.Widget_Table_Row_Selected td {
   background-color: #FFFFFF;
}

.popuperror {
  text-align: center;
}

.form {
  width: 630px;
}

.zoekform {
  width: 500px;
}

.formtussenkop {
  font-weight: bold;
}

.delete {
  background: url('delete.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 2px 6px 1px 6px;
}

.edit {
  background: url('edit.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 2px 6px 1px 6px;
}

.detail {
  background: url('detail.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 2px 6px 1px 6px;
}

.lock {
  background: url('lock.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 2px 6px 1px 6px;
}

.unlock {
  background: url('unlock.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 2px 6px 1px 7px;
}

.add {
  background: url('add.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 11px;
}

.remove {
  background: url('delete.png') no-repeat;
  background-position: 50% 50%;
  color:#464646;
  display:inline-block;
  font-size:80%;
  font-weight:normal;
  float:none;
  text-decoration:none;
  padding: 11px;
}

.gegevens {
  width: 500px;
}

.kolomactiviteit {
  max-width: 270px;
  word-wrap: break-word;
}

.kolomactiviteitsmal {
  max-width: 200px;
  word-wrap: break-word;
}

.kolomomschrijving {
  max-width: 150px;
  word-wrap: break-word;
}

.formbreed fieldset input,
.formbreed fieldset select,
.formbreed fieldset span,
.formbreed fieldset textarea {
  width: 100%;
}

.noresize {
  resize: none;
  margin: 0;
}

/*
.Widget_FormLayout_Row {
  height: 2em;
}
*/

.submenu li a.defaultWerkRooster {
  color: red;
}
.submenu li a.addRooster {
  font-style: italic;
  }

.nofound {
  display: block;
  font-style: italic;
  color: #999;
  padding: 10px;
}

.Widget_Table.Overzicht.Week,
.Widget_FormLayout.datumWerksoort,
.Widget_Table.invoer {
  width: 100%;
}
.Widget_Table.invoer .Widget_Table_Row td {
  border: 2px solid #ddd;
}
.Widget_TextOutput.waarschuwing,
.Widget_TextOutput.teWeinig {
  display: block;
  padding: 1em;
  font-style: italic;
  font-size: 90%;
  color: red;
  border: 1px solid rgba(200, 0, 0, .2);
  border-top: none;
  background-image: url(bg_striped_red.png);
  margin-top: -15px;
  margin-bottom: 15px;
}
.Widget_Table.invoer {
  border: 1px solid #ddd;
  width: 100%;
  margin-bottom: 15px;
}
.Widget_Table.invoer thead {
  display: none;
}

.Widget_Table.invoer .Widget_FormLayout fieldset label {
  width: 60px;
}
.Widget_Table.invoer .Widget_FormLayout fieldset span {
  width: auto;
}
.Widget_Table.invoer tr td:nth-child(3) {
  vertical-align: text-top;
}
.Widget_Table.invoer input,
.Widget_Table.invoer textarea {
  border: 1px solid gray;
  width: auto;
}
.Widget_Table.invoer select,
.Widget_Table.invoer input {
  width: 130px;
  padding: 1px;
  margin: 2px 0;
  font-size: 10pt;
}
.Widget_Table.invoer input {
  width: 124px;
  padding-left: 5px;
}

/* page/urenadmin/tabeloverzicht */
.Widget_Table.Overzicht {
  border: 1px solid #ddd;
  margin-bottom: 15px;
  width: 100%;
}
/*
.Widget_Table.Overzicht.Week thead tr th:last-child {
  background-image: url('delete.png');
  }
.Widget_Table.Overzicht.Week thead tr th:last-child {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  min-width: 15px;
  }
  */
.Widget_Table.Overzicht th {
  font-size: .9em;
  padding-top: 4px;
  padding-bottom: 4px;
  border-bottom: 1px solid #ddd;
  }
.Widget_Table.Overzicht th,
.Widget_Table.Overzicht td {
  border-right: 2px solid #ddd;
  padding: 3px 5px;
  }
.Widget_Table.Overzicht th:last-child,
.Widget_Table.Overzicht td:last-child {
  border-right: 0;
  }
.Widget_Table.Overzicht th:first-child,
.Widget_Table.Overzicht td:first-child {
  text-align: left;
  }
.Widget_Table.Overzicht.Week th:first-child,
.Widget_Table.Overzicht.Week td:first-child {
  white-space: nowrap;
  }
.Widget_Table tr:nth-child(odd) td {
  background-color: rgba(241, 246, 249, .5);
  }
.Widget_Table.Overzicht tr:hover td {
  background-color: rgba(243, 241, 236, .6);
}

.Widget_FormLayout.datumWerksoort {
  border: 1px solid #ddd;
  width: 100%;
}
/* --------- login css --------- */
.login {
  border-radius: 8px;
  box-shadow: 0 3px 15px #AAAAAA;
  margin: 33px auto;
  width: 300px;
  background: #F0F0F0;
}
.login > div:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border-bottom: 1px solid #AAAAAA;
  color: #CCCCCC;
  min-height: 60px;
  text-align: center;
}
.login > div:first-child,
.login div.buttons {
  background-color: steelblue;
  background-image: url(bg_pagetitle_blue.png);
}
.login div.buttons {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.login > div:last-child {
}
.login > div:first-child span {
  display: block;
  margin-left: 10px;
  padding: 20px 0;
  font-size: 150%;
  letter-spacing:-1px;
  text-shadow:0 -2px rgba(0, 0, 0, 0.2);
  color:#E0EEE0;
  font-weight: bold;
}
.login fieldset {
  display: block;
}
.login fieldset .Widget_FormLayout_Row {
  display: block;
}
.login .Widget_FormLayout > fieldset > .Widget_FormLayout_Row,
.login .Widget_FormLayout > fieldset > .Widget_FormLayout_Row > label,
.login .Widget_FormLayout > fieldset > .Widget_FormLayout_Row > .Widget_FormLayout_Row_FieldWrapper {
  display: block;
}

.login fieldset label {
  font-size: 110%;
  line-height: 200%;
  color: #555555;
  font-weight: bold;
  width: auto;
}
.login .Widget_PasswordInput,
.login .Widget_TextInput {
  font-size: 110%;
  width: 90%;
  color: #444;
  padding: 5px;
  margin-top: 10px;
  margin-bottom: 15px;
  margin-left: 10px;
  border: 1px solid #ccc;
}
.login fieldset {
  padding: 15px;
}
.login .buttons .Widget_LinkButton {
  background: lightsteelblue;
  color: white;
  display: inline-block;
  font-weight: bold;
  padding: 5px 0;
  text-align: center;
  text-decoration: none;
  width: 100%;
}
.login .buttons .Widget_LinkButton:hover {
  background: rgba(255,255,255,.1);
}
.login .buttons div:last-child .Widget_LinkButton {
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.login .loginError {
  display: block;
  padding: 1em;
  font-style: italic;
  font-size: 90%;
  color: red;
  border: 1px solid rgba(200, 0, 0, .2);
  border-top: none;
  background-image: url(bg_striped_red.png);
  text-align: center;
}

.Widget_FormLayout_Row > label,
.Widget_FormLayout_Row > .Widget_FormLayout_Row_FieldWrapper {
  padding: 2px 0;
}
.Widget_FormLayout_Row > .Widget_FormLayout_Row_FieldWrapper .Widget_NumberInput {
  padding: 2px 1px;
}

.Widget_FormLayout fieldset .Widget_Checkbox {
  width: auto;
}

.uFirst {
  text-transform: capitalize;
  }
.Widget_Unroll_Item {
  padding: 0 0 10px 10px;
  }
.Widget_Unroll_Item .uFirst{
  font-weight: bold;
  padding-bottom: 3px;
  display: inline-block;
  }
.Widget_Unroll_Item .Overzicht.Week td {
  text-align: left;
  }
.Widget_Unroll_Item .netto_uren {
  font-size: .9em;
  font-style: italic;
}
.Widget_Unroll_Item .nofound {
  border: 1px solid #ddd;
}

.Widget_Table.facturatieOverzicht th {
  font-size: .9em;
  border: 2px solid #ddd;
}

.Widget_Table.facturatieOverzicht th,
.Widget_Table.facturatieOverzicht td {
  vertical-align: text-top;
  padding: 2px 4px;
}

.Widget_Table.facturatieOverzicht td {
  border: 1px solid #ddd;
}

.vergrendeld td:first-child {
  padding-right: 20px;
  background: url('lock.png') 98% 1px no-repeat;
}
.gedeeltelijk_vergrendeld td:first-child {
  padding-right: 20px;
  background: url('lock_partial.png') 98% 1px no-repeat;
}

.Widget_Table.Overzicht.Week tr.totals td:nth-child(-n+3),
.Widget_Table.Overzicht.Week tr.totals td:nth-child(6) {
  border-right-color: transparent;
}
.Widget_Table.Overzicht.Week tr.totals td:nth-child(4) span{
  text-align: right;
  font-weight: bold;
  display: block;
}

.Widget_Table.Overzicht.Week tr.totals td {
  border-top: 2px solid #DDDDDD;
}

.Widget_Table_Row.nonActief td {
  text-decoration: line-through;
  color: #777777;
}


@font-face {
  font-family: "Pictos";
  src: url('Pictos/pictos-web.ttf') format('truetype');
}
.ikoon {
  font-family: Pictos;
  -webkit-font-smoothing: antialiased;
  font-size: 100%;
  text-decoration: none;
  display: inline-block;
  font-size: 130%;
  margin-top: -10px;
  padding-bottom: 2px;
}
.ikoon:hover{
  color: red !important;
}
.ikoon.status {
}
.ikoon.aktie {
  color: rgba(200,200,200,.5);
}
.ikoon.aktie.verwijder {
  color: rgba(255,0,0,.5);
}
.ikoon.aktie.verwijder:hover {
  color: rgba(200,200,200,1);
}
.ikoon.aktie.verwijder:hover {
  color: rgba(255,0,0,1);
}

.bargraph {
  display: block;
  min-height: 1em;
  /*
  text-align: center;
  font-size: 80%;
  text-shadow:
  */
}

.Widget_DateOutput {
  white-space: nowrap;
}

.Widget_Table.AlignTop td {
  vertical-align: text-top;
}
.noWrap {
  white-space: nowrap;
}


/* first colum 50px */
.Widget_FormLayout.Fixed50px fieldset label {
  width: 50px;
}
.Widget_FormLayout.Fixed50px fieldset label + * {
  width: auto;
}
.Widget_FormLayout.Fixed50px fieldset input,
.Widget_FormLayout.Fixed50px fieldset select,
.Widget_FormLayout.Fixed50px fieldset span,
.Widget_FormLayout.Fixed50px fieldset textarea {
}

.toekomst {
  color: #888;
  }

.Widget_FormLayout.shrinkFirstColumn {
  display: table;
  width: 100%;
  }
.Widget_FormLayout.shrinkFirstColumn .Widget_FormLayout_Row {
  display: table-row;
  }
.Widget_FormLayout.shrinkFirstColumn .Widget_FormLayout_Row label,
.Widget_FormLayout.shrinkFirstColumn .Widget_FormLayout_Row label + * {
  display: table-cell;
  float: none;
  width: auto;
  vertical-align: middle;
  }
.Widget_FormLayout.shrinkFirstColumn .Widget_FormLayout_Row label {
  width: 1%;
  }

.OpVakantie {
  margin-left: 10px;
  margin-top: 15px;
}
.OpVakantie thead tr th {
  font-weight: normal;
  font-style: italic;
}
.OpVakantie thead tr th,
.OpVakantie .nofound {
  font-size: 90%;
}
.Widget_FormLayout fieldset .EmptyLabel,
.Widget_FormLayout fieldset .EmptyDiv {
  display: none;
}

.intalign {
  width: 5ex;
  text-align: right;
}