.material-list-item
{
	position: relative;
	overflow: hidden;
	float: left;
	width: 270px;
	height: 152px;
	margin-right: 10px;
	margin-bottom: 10px;
}

.material-list-item:hover img
{
	opacity: 0.8;
}

.material-list-item:hover .has-media
{
	opacity: 1 !important;
}

.mp-first:hover .has-media, .mp-other:hover .has-media
{
	opacity: 1;
}

.material-list-item:after
{
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%;
	box-shadow: 0 0 30px 70px #000;
	left: 0px;
	opacity: 0.5;
	z-index: 0;
}


.material-list-text-block
{
	color: #fff;
	text-decoration: none;
	position: absolute;
	left: 0px;
	bottom: 0px;
	padding: 10px;

	text-shadow:
			-0   -1px 1px #222222,
			0   -1px 1px #222222,
			-0    1px 1px #222222,
			0    1px 1px #222222,
			-1px -0   1px #222222,
			1px -0   1px #222222,
			-1px  0   1px #222222,
			1px  0   1px #222222,
			-1px -1px 1px #222222,
			1px -1px 1px #222222,
			-1px  1px 1px #222222,
			1px  1px 1px #222222,
			-1px -1px 1px #222222,
			1px -1px 1px #222222,
			-1px  1px 1px #222222,
			1px  1px 1px #222222;
	z-index: 1;
}


.material-list-date
{
	font-size: 12px;
	margin-bottom: 4px;
	padding: 5px;
	padding-bottom: 3px;
	padding-top: 3px;
	color: #FFF;

	position: absolute;
	top: 0;
	right: 0;
	background-color: rgba(227,30,36,.7);

}

.material-list-text
{
	font-size: 16px;
	line-height: 18px;
}

.material-list-has-media
{
	top: 25px;
	right: 5px;
	font-size: 18px;
}

.material-list-has-media i
{
	padding-left: 5px;
}