@charset "UTF-8";
       body {
            align:center;
        }
        form {
            max-width: 800px;
            margin-bottom: 40px;
            padding: 20px;
            border: 1px solid #ccc;
            background:rgba(172, 4, 4, 0.8);
            color:#f2f2f2;
        }
        /* Formular-Box mittig */
        .box{
		  max-width: 900px;     
		  width: 100%;
		  margin: 30px auto;    /* auto = zentriert */
		}
		form.box{
		  max-width: 900px;     
		  width: 100%;
		  margin: 30px auto;    /* auto = zentriert */
		}
        label {
            display: block;
            margin-top: 15px;
            font-weight: bold;
        }
        input[type="date"],
        input[type="text"],
        textarea {
            width: 100%;
            padding: 8px;
            box-sizing: border-box;
            margin-top: 5px;
        }
        textarea {
            min-height: 180px;
            resize: vertical;
        }
        button,
        .buttonlink {
            display: inline-block;
            margin-top: 20px;
            padding: 10px 18px;
            font-size: 16px;
            cursor: pointer;
            text-decoration: none;
            border: 1px solid #888;
            background: #f2f2f2;
            color: #000;
        }
        .buttonlink {
            margin-left: 10px;
        }
        table {
            border-collapse: collapse;
            width: 100%;
            margin-top: 20px;
            background:rgba(222,222, 222, 0.8);
        }
        th, td {
            border: 1px solid #999;
            padding: 8px;
            text-align: left;
            vertical-align: top;
        }
        th {
            background-color: #f2f2f2;
        }
        .bereich {
            margin-top: 50px;
        }
        .aktionen a {
            margin-right: 10px;
        }
        .err{color:#b00020;margin-top:10px;}
        
        .actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.actions form{ margin:0; }




/* gleicher Look für <a class="button"> und <button class="button"> */
.actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

/* Form darf NICHT eigene Abstände/Höhen reinbringen */
.actions .actionform{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
}
.actions form{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
}

/* Einheitlicher Button für <a> und <button> */
.actions .button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  width:110px;          /* optional: gleiche Breite */
  height:42px;          /* gleiche Höhe */
  padding:0;            /* Höhe kommt von height */

  border:3px solid #b51121;
  background:#b51121;
  color:#000;

  text-decoration:none;
  font:inherit;
  line-height:1;
  box-sizing:border-box;
  cursor:pointer;
}

.actions a.button,
.actions button.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:42px;           /* feste Höhe -> kein Baseline-Versatz */
  padding:0 18px;        /* nur horizontal, vertikal kommt von height */

  line-height:1;
  vertical-align:middle;
  box-sizing:border-box;
  text-decoration:none;  /* für <a> */
}

/* Button-Defaults killen */
.actions button.button{
  appearance:none;
  -webkit-appearance:none;
  border-radius:0;
  background:#b51121;
}



/* =================================*/
/* mitscrollender 'zurück'-Button   */
/* =================================*/

.backbtn-topright{
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 9999;
  text-decoration: none;
}

/* optional: auf Handy etwas kleiner/mehr Abstand */
@media (max-width: 700px){
  .backbtn-topright{
    top: 10px;
    right: 10px;
  }
}