.inplaycalendar-wrapper {
	background-color: var(--background-color-less-opacity);
	margin-bottom: var(--20px);
}

.inplaykalender_tag {
  text-align: center;
  height: 1.438rem;
}

.inplaykalender_tag a{color:var(--text-color);
}

.popup_inside{color:#474746;
}

.carousel-cell {
  width: 100%; /* full width */
  height: 150px; /* height of carousel */
  margin-right: 10px;
}

/* position dots in gallery */
.flickity-page-dots {
	position: unset !important;
  	bottom: 0px !imporant;
	padding-bottom: 10px !important;
}
/* white circles */
.flickity-page-dots .dot {
	  width: 5px !important;
	  height: 5px !important;
	  opacity: 1;
	  background: transparent;
	  border: 2px solid var(--text-color);
}

.inplaykalender-legend {
  margin: auto;
  margin-bottom: auto;
  margin-bottom: var(--20px);
}
/* fill-in selected dot */
.flickity-page-dots .dot.is-selected {
  	background: var(--text-color);
}

.flickity-viewport {
	height: 13.75rem !important;
}

.inplaykalender-page-month table {
width: 100%;
}

.inplaykalender_tag {
  width: 20px;
  max-width: 20px;
}

.inplaykalender-nav {
  display: flex;
  margin-bottom: var(--20px);
  grid-gap: var(--20px);
}

    .inplaykalender_tag { text-align: center; font-size: 10px; letter-spacing: 1px; } 
        .szenen { background-color: #81A1BD; } 
.szenen strong { color: color:var(--text-color) !important; }
        .geburtstag { background-color: var(--highlight-color); }
        .geburtstag strong { color: var(--text-color) !important; }
        .timeline { background-color: #98bccd;}
        .timeline strong { color: color:var(--text-color) !important; }
        .event { background-color: #697f98; }
        .event strong { color: color:var(--text-color) !important; }
        
        .szenentimeline { background: linear-gradient(to left top, var(--highlight-color) 50%, #98bccd 50%); }
        .szenentimeline strong { color: #efefee !important; }
        .szenengeburtstag { background: linear-gradient(to left top, var(--highlight-color) 50%, #81A1BD 50%); }
        .szenenevent { background: linear-gradient(to left top, var(--highlight-color) 50%, #697f98 50%); }
        .szenenevent strong { }
        .szenengeburtstag strong { color: #efefee !important; }
        .geburtstagtimeline { background: linear-gradient(to left top, var(--highlight-color) 50%, #98bccd 50%); }
        .geburtstagtimeline strong { color: var(--text-color) !important;  }
        .geburtstagevent { background: linear-gradient(to left top, #81A1BD 50%, #697f98 50%); }
        .geburtstagevent strong { }
        .timelineevent { background: linear-gradient(to left top, #98bccd 50%, #697f98 50%);  }
        .timelineevent strong { }
        
        .szenengeburtstagtimeline { background: linear-gradient(to left top, var(--highlight-color) 33%, #81A1BD 33%, #81A1BD 66%, #98bccd 66%); }
        .szenengeburtstagtimeline strong { color: #efefee !important; }
        .szenengeburtstagevent { background: linear-gradient(to left top, var(--highlight-color) 33%, #81A1BD 33%, #81A1BD 66%, #697f98 66%); }
        .szenengeburtstagevent strong { }
        .szenentimelineevent {  background: linear-gradient(to left top, var(--highlight-color) 33%, #98bccd 33%, #98bccd 66%, #697f98 66%); }
        .szenentimelineevent strong { }
        .geburtstagtimelineevent { background: linear-gradient(to left top, var(--highlight-color) 33%, #98bccd 33%, #98bccd 66%, #697f98 66%); }
        .geburtstagtimelineevent strong { }
        
        .szenengeburtstagtimelineevent { background: linear-gradient(to left top, var(--highlight-color) 25%, #81A1BD 25%, #81A1BD 50%, #98bccd 50%, #98bccd 75%, #697f98 75%); }

        #mini-kalender { font-size: 10px; }
        #mini-kalender td { padding: 3px; }
        .calpop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.5); z-index: 1000; opacity:0; -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; transition: .5s ease-in-out; pointer-events: none; } 


        .calpop:target { opacity:1; pointer-events: auto; }

        .calpop > .pop { text-align: justify; background: var(--background-color-less-opacity); width: 800px; position: relative; margin: 5% auto; padding: 10px; z-index: 1002; font-size: 11px; }

        .closepop { position: absolute; right: -5px; top:-5px; width: 100%; height: 100%; z-index: 999; }

        .inplaykalender-eventlist { max-height: 50px; overflow: auto; padding-right: 5px;}