*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  font-family: Calibri,Verdana,Arial,Helvetica,sans-serif;
  font-size: 16px;
  margin: 0;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
}

p {
  display: block;
  line-height: 1.1em;
  padding: 0;
}

form {
  margin: 12px 0;
}

td.label {
  vertical-align: top;
}

table.form-table td,
table.form-table th {
  padding-top: 8px;
}

table.form-table td.label.long {
  max-width: 285px;
}

/* field widths */
input.wide {
  width: 15em;
}

input.medium {
  width: 9em;
}

input.short {
  width: 5em;
}

input.tiny {
  width: 3em;
}

/* Small screens: label above its field, fields as wide as the screen */
@media (max-width: 600px) {
  body {
    padding: 0 8px;
  }

  table.form-table,
  table.form-table tbody,
  table.form-table tr,
  table.form-table td {
    display: block;
  }

  table.form-table tr {
    padding-top: 12px;
  }

  table.form-table td {
    padding: 0;
  }

  table.form-table td.label {
    padding-bottom: 4px;
  }

  table.form-table td.label.long {
    max-width: none;
  }

  table.form-table td.label:empty {
    display: none;
  }

  /* yes/no questions: checkbox next to the question */
  table.form-table tr:has(> td > input[type="checkbox"]:only-child) {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  table.form-table tr:has(> td > input[type="checkbox"]:only-child) td.label {
    flex: 1;
    padding-bottom: 0;
  }

  table.form-table input[type="text"],
  table.form-table input[type="date"],
  table.form-table select,
  table.form-table textarea {
    width: 100%;
    padding: 6px;
  }

  table.form-table input[type="checkbox"],
  table.form-table input[type="radio"] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
  }

  table.form-table input[type="submit"] {
    padding: 8px 24px;
  }
}

table.list {
  margin: 8px 0;
}

table.list td,
table.list th {
  padding: 2px 5px;
  font-size: 13px;
}

table.list td {
  border-bottom: 1px solid #DDDDDD;
}

table.list td.row-actions {
  visibility: hidden;
  border: 0 none;
}

table.list tr:hover td.row-actions {
  visibility: visible;
}

button.link {
  background: none;
  border: 0 none;
  padding: 0;
  color: LinkText;
  text-decoration: underline;
  font: inherit;
  cursor: pointer;
}

table.list tfoot td {
  font-weight: bold;
}

.message {
  background-color: #CCFFCC;
  border: 1px solid #AAEEAA;
  margin: 10px;
  line-height: 200%;
  padding: 10px;
}

.error {
  background-color: #FFDDDD;
  border: 1px solid #FF7777;
  line-height: 200%;
  margin: 5px;
  padding: 10px;
}

.menu {
  background-color: #F9F9F9;
  margin: 0 0 8px;
  overflow: hidden;
  padding: 4px 0;
  opacity: 0.5;
}

.menu:hover {
  opacity: 1;
}

.menu a,
.menu select {
  float: right;
}

.menu select {
  margin: 1px;
}
  
a.link-button,
.menu a {
  background-color: #DDDDDD;
  border: 1px solid #999999;
  padding: 2px 4px;
  text-decoration: none;
  margin: 0 1px;
}

a:hover.link-button,
.menu a:hover {
  background-color: #CCCCCC;
}

/* Begin css voor sortering */
/* Copyright 2006 Joost de Valk */
a img {
	border: 0;
}

table.sortable th {
	background-color: #DDDDDD;
}

table.sortable th a {
  color: #000000;
  text-decoration: none;
}

table.sortable tr.odd td {
	background-color: #f3f3f3;
}

table.sortable tr.even td {
	background-color: #fff;
}

table.sortable tr.sortbottom td {
	border-top: 1px solid #444;
	background-color: #DDDDDD;
	font-weight: bold;
}
/* Einde css voor sortering */