.events {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.events > div {
	background-color: #090d10;
	background-clip: content-box;
	display: flex;
	flex-direction: column;
	cursor: pointer;
}

.events > div > div,
.events > div > h2 { padding-bottom: 0; }

.events h3 { margin: 10px 0 0 0; }

.events h3 a {
	color: inherit;
	text-decoration: none;
}

.events .bottom {
	margin-top: auto;
	padding-bottom: 2px;
}

.events .bottom hr {
	background-image: linear-gradient(transparent 0%, transparent 90%, #B9AB52, #B9AB52);
	background-repeat: no-repeat;
	background-size: 0 100%;
	background-position-x: right;
	transition: background-size 300ms;

	display: block;
	height: 10px;
	border: none;
}

.events > div:hover hr,
.events > div:hover hr {
	background-size: 100% 100%;
	background-position-x: left;
}