body{
	margin-bottom: 50px;
}
.hidden{
	display: none!important;
}

.login button{
	background-color: #8E9B4A!important;
	border: none!important;
}

.login{
	max-width: 650px;
  width: 90vw;
	margin: 0 auto;
	margin-top: 5vh;
	text-align: left;
}

.login span{
  font-size: 12px;
  color: gray;
}

table{
	margin-top: 15px;
}

td.available, .btn-available{
	background-color: lightgreen!important;
	cursor: pointer;
}
td.available:hover{
	background-color: #8E9B4A!important;
}
td.booked, .btn-booked{
	background-color: #F44336!important; /*red*/
}
td.abgeholt, .btn-abgeholt{
	background-color: #2196F3!important;
	color: white;
	font-weight: bold;
}
td.zurueckgebracht, .btn-zurueckgebracht{
	background-color: #FF9800!important;
	color: white;
	font-weight: bold;
}
td.barzahlung-ausstehend{
	border: 3px dotted black;	
}
td.booked{
	padding: 0;
  font-size: 10px;
  vertical-align: middle;
  text-align: center;
  white-space: nowrap;
}
table .block{
	border-right: 1px solid gray;
}
p.success{
	text-align: center;
}


.legende{
	text-align: center;
}
.legende span{
	padding: 5px;
	color: white;
	font-weight: bold;
}
.legende .barzahlung-ausstehend{
	border: 3px dotted black;
	color: black;
}


header {
  position: sticky;
  top: 0;
  z-index: 999;
  height: 25px;
  padding: 0 10px 0 10px;
  
}
header button:hover{
	background-color: #8E9B4A!important;
}


p.error{
	color: red;
}
#reservieren small{
	font-size: 10px;
}


@media only screen and (max-width: 800px) {
	td:first-child, tr:first-child{
		font-size: 10px;
	}
}