main {
	height: calc(100vh - 60px);
	margin-top: 60px;
	justify-content: center;
	background-color: #000000;
}

.main-videos {
	display: flex;
	justify-content: center;
	background-color: #FFFFFF;
}

.performance {
	width: 50%;
	position: relative;
}

.performance-video video {
	max-width: 100%;
	filter: grayscale();
	opacity: 60%;
	transition: .5s;
	position: absolute;
}

.performance:hover .performance-video video {
	filter: grayscale(0);
	opacity: 100%;
}

.performance-text img {
	filter: grayscale(0);
	align-self: center;
}

.performance-text {
	display: flex;
  	justify-content: center;
}

.classes {
	width: 50%;	
	position: relative;
}

.classes-video video {
	max-width: 100%;
	filter: grayscale();
	opacity: 60%;
	transition: .5s;
	position: absolute;
}

.classes:hover .classes-video video {
	filter: grayscale(0);
	opacity: 100%;
}

.classes-text img {
	filter: grayscale(0);
	align-self: center;
}

.classes-text {
	display: flex;
  	justify-content: center;
}

/* MOBILE VERSION*/

@media only screen and (max-width: 768px) {
	
	main {
		height: calc(100vh - 40px);
		margin-top: 40px;
		background-color: #FFFFFF;
	}
	
	.main-videos {
		flex-wrap: wrap;
		justify-content: center;
		background-color: #FFFFFF;
	}
	
	.performance {
		width: 100%;
	}
	
	.classes {
		width: 100%;	
	}
	
}

@media only screen and (min-width: 992px) {
	
}