#calendar {
	width: 100%;
	position: relative;
	height: 100px;
}

#calendar [type="radio"] {
 	display: none;
}

#calendar [for^="spielmonat"] {
	font: 500 9px/20px 'Quicksand';
	color: #a6a6a6;
	background-color:#d6d6d6;
    position: absolute;
    top: 0;
    min-width: 75px;
    height:20px;
	letter-spacing: 4px;
	padding: 3px;
}

#calendar [for="spielmonat-1"] {
	left: 0px;
	width: 95px;
	text-align:center;
}

#calendar [for="spielmonat-2"] {
	left: 95px;
	width: 95px;
	text-align:center;
}

#calendar [for="spielmonat-3"] {
	left: 190px;
	width: 85px;
	text-align: center;
}

#calendar .spielmonat-inhalt {
    position: absolute;
    top: 30px;
  	width:100%;
	font: 8px'Quicksand'; 
    opacity:0;
	height:140px;
	overflow: auto:
	scrollbar-width: thin;
}

#calendar input:checked + label {
	text-align: center;  
	font: 8px 'Quicksand'; 
	color: #d6d6d6; 
	text-transform: uppercase;
	letter-spacing:4px;
	padding: 3px;
	display: inline-block;
	background-color:#a6a6a6;
}

#calendar input:checked + label + .spielmonat-inhalt {
    z-index: 5;
    opacity: 1;
}

.calendarbox {
	height: 140px;
	padding: 10px;
	overflow: auto;
	scrollbar-width:thin;
}

.day{
	font: 400 8px;
	width: 10px;
	height: 15px; 
	padding: 3px; 
	text-align: right;
	background-color: rgba(146, 158, 170, 0.3);
}

.dayn{
	font: 400 8px;
	width: 12px;
	height: 12px; 
	padding: 3px; 
	text-align: right;
	background-color: rgba(146, 158, 170, 0.3);
}

.daye{
	height: 17px; 
	padding: 3px; 
	font-weight: 700;
	text-align: right;
	background-color:rgba(220, 122, 122, 0.2);
}


/*POPUP KALENDER*/
.accpop {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:hsla(0,0%,0%,0.3);
    z-index: 99;
    opacity:0;
    -webkit-transition:.5s ease-in-out;
    -moz-transition:.5s ease-in-out;
    transition:.5s ease-in-out;
    pointer-events:none;
}

.accpop:target {
    opacity:1;
    pointer-events: auto;
}

/* Hier wird das Popup definiert! */
.accpop>.pop {
	font: 400 10px 'Calibri';
	color: #000;
	letter-spacing: 2px;
	font-weight: 400;
    position:relative;
    margin:10% auto;
   	height:200px;
    box-sizing:border-box;
    padding:20px;
    background: #d1d1d1;
    border: 3px solid #a6a6a6;
    text-align:justify;
    overflow:auto;
    z-index:999;
}

.accpop>.closepop {
    position:absolute;
    right:-5px;
    top:-5px;
    width:100%;
    height:100%;
    z-index: 1;
}