@charset "utf-8";

.center {
 	display:-ms-flexbox;
 	-ms-flex-pack:center;
 	-ms-flex-align:center;
 	display:-moz-box;
	-moz-box-pack:center;
 	-moz-box-align:center;
	display:-webkit-box;
	-webkit-box-pack:center;
	-webkit-box-align:center;
  	display:box;
  	box-pack:center;
 	box-align:center;
}

#events {
	position:absolute;
	top:80px;
	color:#FFF;
}

.event {
	float:left;
	background-color:rgba(0,0,0,.8);
	margin-bottom:40px;
	width:100%;
}

.event .date {
	height:240px;
	margin:20px;
}

.event .date .number {
	font-size:120px;
	display:block;
	width:100%;
	text-align:center;
}

.event .date .month {
	font-size:80px;
	display:block;
	width:100%;
	text-align:center;
}

.event .title {
	margin:20px;
	padding-top:20px;
	font-size:40px;
}

.event .title a {
	color:#FFF;
	text-decoration:none;
}

.event .details {
	margin-bottom:40px;
}

@media (min-width: 1001px) {
	#events {
		width:1000px;
		left:50%;
		margin-left:-500px;
	}
	.event {
		width:1000px;
	}
	.event .date {
		width:240px;
		float:left;
	}
	#fix {
		height:680px;
	}
}
@media (min-width: 601px) and (max-width: 1000px) {
	#events {
		width:600px;
		left:50%;
		margin-left:-300px;
	}
	.event .date {
		width:240px;
		float:left;
	}
	#fix {
		height:700px;
	}
}
@media (max-width:600px) {
	.event .details img {
		zoom:70%;
	}
	.event .date {
		width:calc(100% - 40px);
	}
	#events {
		width:100%;
	}
	#fix {
		height:1170px;
	}
}