.events .row {
	height: 235px;
}

.events .row .box-container .col {
	text-align: center;
	color: #fff;
	font-size: 36px;
	padding: 0 5px;
	transition: width 0.2s ease;
	-webkit-transition: width 0.2s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}

.row .col.original  {
	margin-bottom: 20px;
}

.events .row .box-container .col.original .wrapper {
	padding: 85px 0;
	height: 235px;
	overflow: hidden;
	width: 100%;
	padding-left: 15px;
}

.events .row .box-container .col .wrapper > .text {
	display: inline-block;
	text-transform: uppercase;
	transform: rotate(-90deg);
	font-size: 30px;
}

.events .row .box-container:nth-child(odd) .wrapper {
	background-color: #43cba4;
}

.events .row .box-container:nth-child(even) .wrapper {
	background-color: #ff5a5e;
}

.events .row .box-container .col .original-detailed {
	padding: 0;
	background: transparent;
	position: relative;
}
.events .row .box-container .col .original-detailed .main-text {
	position: absolute;
	width: 100%;
}

.events .row .box-container .col .original-detailed .main-text .title {
	display: inline-block;
	font-size: 43px;
	font-family: 'abcd';
	vertical-align: middle;
	padding-top: 50px;
}

.events .row .box-container .col .original-detailed .main-text .details {
	padding-top:20px;
	font-size: 15px;
}

.events .row .box-container .col .original-detailed .main-text .details span {
	display: block;
	border-bottom: 1px solid #fff;
	
}

.events .row .box-container .col .original-detailed .main-text .details span:last-child {
	border-bottom: none;
}

.events .row .box-container .col .original-detailed img {
	width: 100%;
}

/***** active box *****/
.events .row .box-container .original-detailed {
	background: transparent;
	display: none;
	overflow: hidden;
}

.events .row .box-container:hover .original-detailed {
	display: block;
}

.events .row .box-container:hover .col .wrapper > .text {
	display: none;
}

.events .row .box-container:hover .col.original .wrapper {
	padding: 0;
}

/******** mobile media queries **********/

@media screen and (max-width: 992px) {
	.events .row .box-container .col .original-detailed img {
	
		width: 100%;
		height: 250px;
	}
	.events .row .box-container .col .original-detailed .main-text .title {
		font-size: 25px;
		position: relative;
		
	}
	.events .row .box-container .col .original-detailed .main-text .details {
	
		font-size: 10px;
	}
	.events .row .box-container .original-detailed {
		display: block;
	}
	.events .row .box-container .col .wrapper > .text {
		display: none;
	}
	.events .row .box-container .col.original .wrapper {
	display:none;
		padding: 0;
	}
}
