/* ------------------------------------------------------------ *\
Calendar Widget
\* ------------------------------------------------------------ */
.calendar-widget {
	margin: 100px 0;
}

.calendar-widget .calendar-widget__head h3 {
	font-weight: bold;
	font-size: 48px;
	text-transform: uppercase;
}

.calendar-widget .months .month__name h3 {
	margin-bottom: 5px;
	font-weight: bold;
	color: #b3b3b3;
}

.calendar-widget .month__event {
	position: relative;
	display: flex;
	padding: 10px;
	border: 1px solid #dadada;
	border-left: 5px solid #FF0000;
	border-radius: 5px;
	margin-bottom: 20px;
	background-color: #f7f7f7;
}
.calendar-widget .event-date {
	padding-right: 20px;
}
.calendar-widget .event-date p {
	color: #101820;
	font-size: 14px;
}

.calendar-widget .event-date h4 {
	font-weight: 900;
	color: #101820;
	margin-bottom: 0;
	font-size: 22px;
	padding-left: 5px;
}

.calendar-widget .event-content {
	max-width: 260px;
}

.calendar-widget .event-content h5 {
	font-weight: 600;
	margin-bottom: 10px;
	font-size: 17px;
}

.calendar-widget .event-content p {
	font-size: 13px;
	margin-bottom: 0;
}

.month__event--empty {
	border-left: 1px solid #dadada !important;
	background-color: #fff !important;
}

.month__event--empty p {
	margin-bottom: 0;
	color: #c4c0c0;
	font-style: italic;
}

@media screen and ( max-width: 1024px ) {
	.calendar-widget .event-content {
		max-width: 500px;
	}
}