@media only screen and (max-width: 960px) {
	#main li {
		width: 100%;
		height: auto;
		overflow: hidden;
	}

	.video-image, .reveal-image {
		width: 50%;
	}
	.video-image img, .reveal-image img {
		width: 100%;
		height: auto;
	}
}

@media only screen and (max-width: 850px) {
	#main li:not(#contact) h2 {
		padding: 20px 10px 10px;
	}
	#main li:not(#contact) .reveal-text h2 {
		padding: 20px 30px 20px;
	}
}

@media only screen and (max-width: 800px) {
	#main h2 {
		font-size: 24px;
		line-height: 100%;
	}

	.video-image, .reveal-image {
		margin-right: 20px;
	}

	.audio-player {
		bottom: 10px;
	}
	.audio-player .playlist div {
		line-height: 20px;
	}

	#main #contact h2 {
		padding: 20px 30px 10px;
	}
}

@media only screen and (max-width: 650px) {
	.video-image,
	.reveal-image,
	.reveal-text {
		float: none;
		width: 100%;
		margin: 0;
	}

	.audio-player {
		position: static;
		width: 100%;
	}
	.audio-controls {
		margin-top: 10px;
		margin-bottom: 20px;
		margin-left: 30px;
		width: calc(100% - 60px);
	}
	.no-touch .audio-controls .audio-button-volume,
	.no-touch .audio-controls .audio-slider-volume {
		display: inline-block;
	}
	.no-touch .audio-controls .audio-slider-track {
		margin-right: 20px;
		width: calc(100% - 200px);
	}

	#main .reveal-text p,
	.audio-player .playlist div {
		margin-left: 30px;
	}
	.audio-player .playlist div {
		line-height: 25px;
	}

	#main .reveal-item + h2 {
		display: block;
	}

	#main li:not(#contact) h2 {
		padding: 20px 30px 10px;
	}

	#main p {
		margin-bottom: 30px;
	}
}