.archive section.content, section.content {
	padding: 10px;
}

@media (max-width: 400px) {

	.archive section.content, section.content {
		padding: 0;
	}
}

.archive-header {
	padding: 10px 20px 0 20px;
}

.video-grid {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

article.video-thumb {
	width: calc(25% - 20px);
	margin: 10px;
	padding: 0;
}

@media (max-width: 800px) {

	article.video-thumb {
		width: calc(33.33% - 20px);
	}
}

@media (max-width: 600px) {

	article.video-thumb {
		width: calc(50% - 20px);
	}
}

article.video-thumb .thumbnail {
		position: relative;
		width: 100%;
		padding-bottom: 56.25%;
		background-size: cover;
		background-position: center;
}

article.video-thumb .thumbnail .duration {
			position: absolute;
			bottom: 8px;
			right: 8px;
			font-size: 12px;
			color: #fff;
			background: #000000;
			opacity: .8;
			line-height: 1;
			padding: 6px;
			border-radius: 2px;
		}

article.video-thumb .title {
		font-size: 14px;
		color: #fff;
		margin: 10px 0;
}

@media (max-width: 400px) {

	article.video-thumb .title {
		font-size: 12px;
	}
}

article.video-thumb .meta {
		font-size: 13px;
		color: #999;
		line-height: 1;
}

@media (max-width: 400px) {

	article.video-thumb .meta {
		font-size: 11px;
	}
}

article.video-thumb .YouTube_marker, article.video-thumb .Vimeo_marker, article.video-thumb .T\.Rex_marker {
		width: 8px;
		height: 8px;
		display: inline-block;
		border-radius: 1px;
		margin-right: 5px;
		border: 2px solid;
}

article.video-thumb .YouTube_marker {
		border-color: #f70104;
}

article.video-thumb .Vimeo_marker, article.video-thumb .T\.Rex_marker {
		border-color: #ceff51;
}

article.video {
	padding: 10px;
}

article.video .full-video {
		position: relative;
		width: 100%;
		padding-bottom: 56.24%;
	}

article.video .full-video > * {
			position: absolute;
			top: 0; right: 0; bottom: 0; left: 0;
			width: 100%;
			height: 100%;
		}

article.video .therest {
		margin: 20px 20px 10px;
		overflow: hidden;
	}

@media (max-width: 400px) {

	article.video .therest {
		margin: 20px 0;
	}
}

article.video .therest .left {
			width: calc(100% - 270px);
}

@media (max-width: 600px) {

	article.video .therest .left {
		width: 100%;
		float: none;
		margin-bottom: 20px;
	}
}

article.video .therest .left h1 {
				color: #fff;
				text-transform: none;
				font-size: 20px;
				font-weight: 400;
				padding: 0;
				margin-bottom: 10px;
}

article.video .therest .left > .meta {
				font-size: 15px;
				color: #fff;
				opacity: .6;
}

article.video .therest .left .entry-content {
				margin: 20px 0;
}

article.video .therest .right {
			width: 250px;
			float: right;
}

@media (max-width: 600px) {

	article.video .therest .right {
		width: 100%;
		float: none;
	}
}

article.video .therest .right article.video-thumb {
				float: none;
				width: 100%;
				margin: 0 0 20px 0;
}