@media all
{
	.widget.bni_dates
	{
		background: #fff;
		border: .1em solid #222;
		display: flex;
		overflow: auto;
		padding: 0;
		position: relative;
	}

		.widget.bni_dates > div
		{
			box-sizing: border-box;
			flex: 1 0 10%;
			text-align: center;
			padding: .4em;
			margin-bottom: 0 !important;
			min-width: 5em;
			cursor: pointer;
			position: relative;
		}

			.widget.bni_dates > div + div
			{
				border-left: .1em solid #222;
			}

			.widget.bni_dates > div.closed
			{
				background:#eee;
				cursor:default;
			}

			.widget.bni_dates mess
			{
				align-items: center;
				background: #eee;
				display: flex;
				font-size: .8rem;
				height: 100%;
				justify-content: center;
				opacity: 0;
				overflow: hidden;
				position: absolute;
				bottom: 0; left: 0;
				width: 100%;
			}

				.widget.bni_dates > div.closed:hover mess
				{
					opacity: 1;
				}

			.widget.bni_dates > div ram
			{
				box-sizing: border-box;
				position:absolute;
				top:0;
				left:0;
				border:5px solid #CF1F31;
				display:block;
				width:100%;
				height:100%;
				opacity:0;
				transition:0.15s all ease;
			}

			.widget.bni_dates > div.selected ram, .widget.bni_dates > div.selected:hover ram
			{
				border:5px solid #CF1F31;
				opacity:1;
			}

			.widget.bni_dates > div:hover ram
			{
				border:5px solid #ccc;
				opacity:1;
			}

			.widget.bni_dates > div.closed:hover ram
			{
				border:none;
				opacity:0;
			}

			.widget.bni_dates weekday, .widget.bni_dates date, .widget.bni_dates month
			{
				display:block;
			}

			.widget.bni_dates weekday, .widget.bni_dates month
			{
				font-size: 18px;
			}

			.widget.bni_dates weeknr
			{
				color:#aaa;
				font-size:14px;
				position:absolute;
				top:5px;
				left:8px;
			}

			.widget.bni_dates date
			{
				font-size: 36px;
				line-height: 1;
				margin-bottom: 0;
				margin-top: 8px;
				margin-right: 0;
			}
}