:root{
  --border:#9a9a9a;
  --border-light:#d0d0d0;
  --text:#111;
}

html{
  margin:0;
  padding:0;
  background:#fff;
  color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:15px;
  line-height:1.45;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  margin:0;
  padding:12px;
  background:#fff;
  color:var(--text);
}

h1{
  font-size:1.45rem;
  margin:0 0 12px 0;
  font-weight:600;
  line-height:1.25;
}

fieldset.auswahl{
  border:1px solid var(--border-light);
  padding:10px 12px 8px 12px;
  margin:0 0 12px 0;
}

fieldset.auswahl legend{
  padding:0 4px;
  font-weight:600;
}

p{
  margin:0 0 8px 0;
}

label{
  margin-right:4px;
  white-space:nowrap;
}

select,
input[type="text"]{
  font:inherit;
  font-size:14px;
  padding:6px 8px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text);
  vertical-align:middle;
  min-height:40px;
  max-width:100%;
  box-sizing:border-box;
}

input[type="text"]{
  min-width:14em;
}

#filterbox{
  width:34em;
  max-width:100%;
}

.table-wrap{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

table{
  width:98%;
  min-width:760px;
  border-collapse:collapse;
  table-layout:fixed;
}

th:nth-child(1),
td:nth-child(1){
  width:23%;
}

th:nth-child(2),
td:nth-child(2){
  width:50%;
}

th:nth-child(3),
td:nth-child(3){
  width:10%;
  white-space:nowrap;
}

th:nth-child(4),
td:nth-child(4){
  width:12%;
  white-space:nowrap;
}

th, td{
  border:1px solid var(--border-light);
  padding:6px 8px;
  vertical-align:top;
  text-align:left;
  word-break:break-word;
}

th{
  font-weight:600;
  cursor:pointer;
}

tr:nth-child(even){
  background:transparent;
}

tr:hover{
  background:transparent;
}

a{
  color:inherit;
  text-decoration:underline;
}

a:hover{
  text-decoration:none;
}

.erweitert-ausblenden .erweitert-filter,
.erweitert-ausblenden .erweitert-spalte,
.erweitert-ausblenden .erweitert-spalte-ausleihen{
  display:none;
}

/* Tablet und kleinere Laptops */
@media (max-width: 900px){
  html{
    font-size:15px;
  }

  body{
    padding:10px;
  }

  h1{
    font-size:1.35rem;
  }

  fieldset.auswahl{
    padding:10px;
  }

  th, td{
    padding:5px 6px;
  }
}

/* Handy */
@media (max-width: 700px){
  html{
    font-size:16px;
    line-height:1.5;
  }

  body{
    padding:8px;
  }

  h1{
    font-size:1.3rem;
    margin-bottom:10px;
  }

  fieldset.auswahl{
    padding:10px 8px 8px 8px;
  }

  fieldset.auswahl legend{
    font-size:1rem;
  }

  label{
    display:inline-block;
    margin-bottom:4px;
    white-space:normal;
  }

  select,
  input[type="text"]{
    width:100%;
    min-width:0;
    margin:2px 0 8px 0;
    font-size:16px;
    min-height:44px;
  }

  #filterbox{
    width:100%;
  }

  .table-wrap{
    border:1px solid var(--border-light);
  }

  table{
    min-width:700px;
    font-size:0.95rem;
  }

  th, td{
    padding:8px 6px;
  }
}

@media print{
  html, body{
    font-size:11px;
    line-height:1.35;
  }

  body{
    padding:0;
  }

  fieldset.auswahl{
    border:1px solid #000;
    page-break-inside:avoid;
  }

  table, th, td{
    border-color:#000;
  }

  table{
    min-width:0;
  }

  th{
    cursor:default;
  }

  a{
    text-decoration:none;
    color:#000;
  }

  input, select{
    border:1px solid #000;
    min-height:auto;
    font-size:11px;
    padding:2px 4px;
  }

  .table-wrap{
    overflow:visible;
    border:none;
  }

  .erweitert-ausblenden .erweitert-filter,
  .erweitert-ausblenden .erweitert-spalte,
  .erweitert-ausblenden .erweitert-spalte-ausleihen{
    display:none;
  }
}