#Belegung {
	background-color:#eee;
	height:800px;
}
#wrapper_Belegung {
	text-align:center;
}
#wrapper_Belegung>div {

}
#wrapper_Belegung table td{
	font:normal 1em Verdana, Geneva, sans-serif;
}
@media (max-device-width: 980px) {
	#wrapper_Belegung table td, .legende{
		font-size:1.8em;
	}
	
}
#wrapper_Belegung td:first-of-type {
	background-color:transparent;
	text-align:right;
}
#wrapper_Belegung td.lu {
	font-weight:bold;
	background-color:#C00;
	color:#FFF;
	border-radius:5px;
	text-align:center;
}
#wrapper_Belegung td.tag {
	min-width:20px;
	text-align:center;
}
#wrapper_Belegung td[title$=f] {
	background-color:#b8de5c;
	width:25px;
}
#wrapper_Belegung td[title$=r] {
	background-color:#FCC;
	width:25px;
}
#wrapper_Belegung td[title$=b] {
	background-color:#F00;
	width:25px;
}
#wrapper_Belegung td[title$=a] {
	background-color:#F90;
	width:25px;
}
#wrapper_Belegung td[title$=w] {
	background-color:#f8f8f8;
}
#wrapper_Belegung p {
	margin-top:20px;
}
#wrapper_Belegung p:first-of-type {
	font-weight:bold;
}
.legende {
	width:150px;
	color:#000;
	font-weight:bold;
	display:inline-block;
	margin-left:20px;
}
.legende div {
	height:1.5em;
	margin-bottom:10px;
	padding-left:5px;
}
.legende div.f {
	background-color:#b8de5c;
}
.legende div.r {
	background-color:#FCC;
}
.legende div.b {
	background-color:#F00;
	color:#FFF;
}
.legende div.a {
	background-color:#F90;
}
#date_act {
	margin-top:20px;
	font-size:smaller;
}
@media (min-device-width: 1280px) {
  #wrapper_Belegung {
    display: grid;
    grid-template-columns: 3fr 1fr;
	padding-bottom:60px;
  }
  div.table {
	  display:inline-block;
	  text-align:center;
  }
  div.scrollable {
	  display:inline-block;
	  width:auto;
}
}
@media (min-device-width: 1600px) {
	#wrapper_Belegung {
		width:1600px;
		margin-left:auto;
		margin-right:auto;
	}
	
}
.calSheet {
	background-color:#FFF;
	border: thin solid #999;
	width: 210px;
	height: 180px;
  display: grid; 
  grid-template-columns:14% 14% 14% 14% 14% 14% 14%; 
  grid-template-rows:14% 14% 14% 14% 14% 14% 14%;
  gap: 0;
  align-items:center;
  justify-items:center;
  float:left;
}
.day > span {
	vertical-align:middle;
	display:table-cell;
}
.day:nth-child(7n+1) {
	color:#c00;
}
.day {
	width: 90%;
	height: 90%;
	display:table;
	text-align:center;
	font:normal .9em Verdana, Geneva, sans-serif;
}

.head {
	grid-column-start:1; 
  grid-column-end:8; 
  grid-row-start:1; 
  grid-row-end:2;
}
table.tab_anz {
	border-spacing:0;
}	
tr.headline {
	background-color:#C30;
	color:#fff;
	font-weight:bold;
}
tbody tr:nth-child(even) { 
  background-color: #fff;  
}

td {
	font:normal .8em Verdana, Geneva, sans-serif;
	text-align:center;
}
td.tab_lu {
	font-weight:bold;
	color:#800;
}
.container { 
	width: 95%;
	height: 95vh;
	margin-left:auto;
	margin-right:auto;
	margin-top:1%;
  align-items:center;
  justify-items:center; 
}
.header {
	width:100%;
	height:100%;
	grid-column-start:1; 
  grid-column-end:3; 
}
.content {
	width:100%;
	height:100%;
}
.lu {
	width:100%;
	height:100%; 
	display: grid; 
    grid-template-rows:33% 33% 33%;
}
.calPlan {
	height:210px;
	width:920px;
	margin-left:auto;
	margin-right:auto;
}
.calPlan p {
	font:bold 1em Verdana, Geneva, sans-serif;
	color:#800;
	margin-left:auto;
	margin-right:auto;
}
.calPlan button {
	width:17px;
	height:30px;
	background-size: contain;
	background-repeat: no-repeat;
	background-color:rgba(255,255,255,0);
	cursor:pointer;
	border:0;
	float:left;
}
button[name^="Submit_back"] {
	background-image: url(../bilder/back.gif);
	margin-right:7px;
}
button[name^="Submit_forward"] {
	background-image: url(../bilder/forward.gif);
	margin-left:7px;
}
.header button {
	color:#fff;
	font-weight:bold;
	border-radius: .5em;
}
button[name^="new"] {
	background-color:#393;
	border-color:#393;
}
button[name^="save"] {
	background-color:#C00;
	border-color:#C00;
}
.color {
	background-color: #CCC;
	width:95%;
	height:95%;
	display:table;
	text-align:center;
}
.color:nth-child(2n) {
    background-color: #eee;
}
div.color span {
	vertical-align:middle;
	display:table-cell;
}
.calPlan input {
	float:left;
}
table.tab_anz button {
	width:20px;
	height:20px;
	background-size: cover;
	background-color:rgba(255,255,255,0);
	cursor:pointer;
	border:0;
	margin-left:10px;
}
button[name^="delete"] {
	background-image: url(../bilder/delete.gif);
}
button[name^="edit"] {
	background-image: url(../bilder/edit.gif);
}
.nb { 
background-image: url(../bilder/nb.gif);
   background-size: 100% 100%;
}
.bb { 
background-image: url(../bilder/bb.gif);
   background-size: 100% 100%;
}
.bn { 
background-image: url(../bilder/bn.gif);
   background-size: 100% 100%;
}
.nr { 
background-image: url(../bilder/nr.gif);
   background-size: 100% 100%;
}
.rr { 
background-image: url(../bilder/rr.gif);
   background-size: 100% 100%;
}
.rn { 
background-image: url(../bilder/rn.gif);
   background-size: 100% 100%;
}
.br { 
background-image: url(../bilder/br.gif);
   background-size: 100% 100%;
}
.rb { 
background-image: url(../bilder/rb.gif);
   background-size: 100% 100%;
}
.belegt {
	background-color:#ff9999;
}
.reserviert {
	background-color:#ccc;
}
.past {
	color:#CCC;
}