.banner{
	width:60%;
	height: 10em;
	max-height: 10em;
	overflow: hidden;
	margin: 2em;
	clip-path: polygon(0 0, 90% 0%, 100% 50%, 90% 100% , 0% 100%);
	box-shadow: 0px 0px 2em 1em #0008;
}

.banner:hover{

}

.banner-info{
	position: fixed;
	z-index: 5;
	margin: 0.5em;
	padding: 0.2em;
	font-weight: bold;
	background-color: var(--accent2);
	border-radius: 2px;
}

.tag-container{
	position: fixed;
	bottom: 0.2em;
	z-index: 5;
	margin: 0.2em;
}

.tag{
	float:left;
	margin: 0.2em;
	padding: 0 0.1em;
	font-weight: bold;
	background-color: var(--accent2);
	border-radius: 2px;
	font-size: 0.8em;
}

.breaker{
	clear: both;
}

.img-banner{
		transition: all 1s ease;
	-webkit-transition: all 1s ease;

}

.img-banner:hover{


	-webkit-transform: scale(1.2); /* Saf3.1+, Chrome */
	-moz-transform: scale(1.2); /* FF3.5+ */
	-ms-transform: scale(1.2); /* IE9 */
	-o-transform: scale(1.2); /* Opera 10.5+ */
	transform: scale(1.2);
}

.img-container1{
	float:left;
	width: 90%;
	background-color: var(--light-backgroud);
	box-shadow: 5px 5px 0.2em 0.1em #0002;
	margin: 1em auto;
	/*padding: 1em;*/
}

.img-container2{
	float:left;
	width: 40%;
	background-color: var(--light-backgroud);
	box-shadow: 5px 5px 0.2em 0.1em #0002;
	margin: 1em auto;
	/*padding: 1em;*/
}

.img-article2{
	width: 100%;
	height: 15em;
	object-fit: cover;
}

.img-caption{
	height: 2em;
	padding: 0.5em;
}

.banner-wrap{
	filter: drop-shadow(5px 6px 3px rgba(0, 0, 0, 0.5));
}


@media screen and (max-width: 992px) {

.img-container2{
	width: 90%;
}

.banner{
	width:90%;
	max-height: 10em;
}

}