/*
  Availability Calendar : navigation through month
-------------------------------------------------------------------------------*/

ul.prev_next {
  list-style: none !important;
  list-style-image: none !important;
  margin: 10px 0;
  padding: 0;
  width: 100%;
}

ul.prev_next li {
  list-style: none !important;
  list-style-image: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 33%;
  text-align: center;
  float: left;
  /*outline: 1px solid #c00;*/
}
ul.prev_next li.prev a { text-align: left; }
ul.prev_next li.curr { font-weight: bold; color: #5e111a; }
ul.prev_next li.next a { text-align: right; }

ul.prev_next li a {
  display: block;
  width: 100%;
  color: #000000;
}
ul.prev_next li a:hover {
  color: #5e111a;
}

/*
  Availability Calendar : Monats-Grid (mehrere Monatsblätter nebeneinander)
-------------------------------------------------------------------------------*/

.avcal {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 15px;
}

/*
  Availability Calendar : calendar month sheet
-------------------------------------------------------------------------------*/

table.calendar {
  /* 4 Monate pro Zeile: (100% - 3 Lücken à 15px) / 4 */
  width: calc(25% - 11.25px);
  margin: 0;
  border: 1px solid #efefef;
  background-color: #efefef;
  border-collapse: collapse;
  table-layout: fixed;
}

table.calendar col {
  width: 14.2857%; /* 7 gleich breite Wochentagsspalten */
}

table.calendar caption {
  border: 1px solid #5e111a;
  text-align: center;
  background-color: #5e111a;
  color: #ffffff;
  font-weight: bold;
  font-size: 1.1em;
}
table.calendar thead th {
  border: 1px solid #5e111a;
  text-align:center;
  color: #ffffff;
  background-color: #5e111a;
}
table.calendar tbody td {
  border: 1px solid #ffffff;
  padding: 0;
  height: 40px;
  text-align: center;
  vertical-align: middle;
  color: #000000;
}
table.calendar tbody td.pad {
  background-color: #efefef;
}
table.calendar tbody td.booked {
  background-color: #efefef;
}
table.calendar tbody td.booked-am {
  background: url(booked-am.gif) no-repeat center center;
  color: #fff;
}
table.calendar tbody td.booked-pm {
  background: url(booked-pm.gif) no-repeat center center;
  color: #fff;
}
table.calendar tbody td.booked-all {
  background: url(booked-all.gif) no-repeat center center;
  color: #fff;
}

/* Mobile: Monatsblätter untereinander, volle Breite */
@media (max-width: 999px) {
  table.calendar {
    width: 100%;
  }
}

/*
  Availability Calendar : legend
-------------------------------------------------------------------------------*/

ul.legend {
  list-style: none !important;
  list-style-image: none !important;
  margin: 10px 0;
  padding: 0;
  width: 100%;
  color: #000000;
}

ul.legend li {
  list-style: none !important;
  list-style-image: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 24.5%;
  float: left;
  background: url(booked-none.gif) no-repeat center left;
  /*outline: 1px solid #c00;*/
}
ul.legend li.none { background-image: url(booked-none.gif); }
ul.legend li.all { background-image: url(booked-all.gif); }
ul.legend li.am { background-image: url(booked-am.gif); }
ul.legend li.pm { background-image: url(booked-pm.gif); }