.cal-wrapper { 
	max-width: 1200px; 
	margin: 0;
	padding: 0;
	display: grid;
    overflow: auto;
	grid-template-areas: 
		"title cols"
		"rows boxes";
	grid-template-columns: 9rem;
	line-height:initial;
}

.cal-wrapper .cal-title {
	grid-area: title;
	display: grid;
	border-bottom: 2px solid #dee2e6;
	border-right: 2px solid #dee2e6;
	font-weight: bold;
	align-items: center;
	justify-content: center;
}

.cal-wrapper .cal-cols {
	grid-area: cols;
	display: grid;
	border-bottom: 2px solid #dee2e6;
}

.cal-wrapper .cal-cols>div {
	display: grid;
	align-items: center;
	justify-content: center;
	border-right: 1px solid #dee2e6;
	padding: 0.75rem;
	font-weight: bold;
}

.cal-wrapper .cal-rows {
	grid-area: rows;
	display: grid;
	border-right: 2px solid #dee2e6;
}

.cal-wrapper .cal-rows>div {
	display: grid;
	align-items: center;
	border-bottom: 1px solid #dee2e6;
	
}

.cal-wrapper .cal-boxes {
	grid-area: boxes;
	display: grid;
	grid-auto-flow: row;
}

.cal-wrapper .cal-boxes>div {
	border-right: 1px solid #dee2e6;
	border-bottom: 1px solid #dee2e6;
	position: relative;
}

.cal-wrapper .cal-boxes>div:nth-of-type(odd) {
	border-right: none;
}

.cal-wrapper .cal-boxes>div:hover,
.cal-wrapper .cal-boxes>div.hover {
	background-color: var(--fg-color-0-25) !important;
	cursor: pointer;
}

.cal-wrapper .cal-boxes>div.grey {
	background-color: rgba(227, 227, 229, 0.7);
}
.cal-wrapper .cal-boxes>div.green {
	background-color: rgba(212, 237, 218, 0.7);
}
.cal-wrapper .cal-boxes>div.red {
	background-color: rgba(248, 215, 218, 0.7);
}
.cal-wrapper .cal-boxes>div.yellow {
	background-color: rgba(255, 243, 205, 0.7);
}
.cal-wrapper .cal-boxes>div.blue {
	background-color: rgba(204, 229, 255, 0.7);
}

.cal-wrapper .cal-entries {
	grid-area: boxes;
	display: grid;
}

.cal-wrapper .cal-entries>div {
	position: relative;
    height: fit-content;
    margin: 2px;
    padding: 2px 3px;
    background-color: #EFEFEF;
	border-collapse: collapse;
    border: 2px solid #DEE2E6;
    border-radius: 5px;
    line-height: auto;
    font-size: 80%;
    overflow: hidden;
}

.cal-wrapper .cal-entries>div>a {
	float:right;
    padding: 2px 3px;
	color: #000000 !important;
}


.cal-wrapper .cal-entries>div:hover {
	cursor: pointer;
	background-color: var(--fg-color-0-5) !important;
}

.cal-wrapper .cal-entries>div.open {
	color: #842029;
	background-color: #f8d7da;
	border-color: #f5c2c7;
}
.cal-wrapper .cal-entries>div.missing {
	color: #150e79;
	background-color: #968eff;
	border-color: #1e14ad;
/*	color: #055160;
	background-color: #cff4fc;
	border-color: #b6effb;*/
}
.cal-wrapper .cal-entries>div.pending {
	color: #664d03;
	background-color: #fff3cd;
	border-color: #ffecb5;
}
.cal-wrapper .cal-entries>div.planned {
	color: #0f5132;
	background-color: #d1e7dd;
	border-color: #badbcc;
}
.cal-wrapper .cal-entries>div.dateblocker {
	color: #084298;
	background-color: #cfe2ff;
	border-color: #b6d4fe;
}