table.calendar-front {
  width: 100%;
  height: 400px;
  max-width: 500px;
  max-height: 300px;
}
table.calendar-front td {
  text-align: center;
  min-height: 28px;
  min-width: 28px;
  background-color: #f7f7f7;
  border: 2.5px solid;
  border-color: white;
}

table.calendar-front td.beschikbaar, #beschikbaar {
  background-color: #ddffcc;
}

table.calendar-front td.geboekt, #geboekt {
  background-color: #ffc0bd;	
}

table.calendar-front td.yellow, #omschakel {
  background-color: #fee2a0;	
}

#bookingvalue {
   display: block;
   position: relative;
   max-width: 670px;
}

#legenda {
   display: block;
   position: relative;
   float: right;
   width: 300px;
   height: 75px;
}

#beschikbaar, #geboekt, #omschakel {
	display: inline-block;
	position: relative;
	height: 12px;
	width: 12px;
}