// News Entity
.news-entity{
	font-size: 18px;

	color: white;
}
.news-icon{
	display: inline-block;

	box-sizing: border-box;

	border: 2px $gray solid;

	img{
		background-color: white;
	}
}
.news-text{
	display: inline-block;
}

// Small News Item
.news-small{
	&-header{
		position: relative;
		img{
			display: block;

			width: 100%;
			height: auto;
		}
		.news-entity{
			font-family: $din-medium;
			font-size: 18px;

			position: absolute;
			bottom: 20px;
			left: 20px;
		}
	}
	&-content{
		@extend %clearfix;

		position: relative;
		z-index: 3;

		display: block;
		&::before{
			position: absolute;
			z-index: 2;
			top: 0;
			left: 17px;

			display: block;
			overflow: hidden;

			width: 2px;
			height: 100%;

			content: " ";

			background-color: $gray;
		}
		.news-icon{
			position: relative;
			z-index: 3;

			float: left;

			width: 32px;
			height: 32px;
			margin: .5em 0;
		}
		.news-text{
			float: left;

			box-sizing: border-box;
			width: calc(100% - 50px);
			margin: .5em 0 .5em 1em;

			color: $gray-333;
			p{
				font-size: 14px;
				line-height: 140%;

				margin: 0;
				word-wrap: normal;
				word-break: break-word;
			}
		}
		&:hover{
			* img{
				background-color: $gray;
			}
		}
	}
	&-dim{
		position: absolute;
		top: 0;
		left: 0;

		width: 100%;
		height: 100%;

		background-color: rgba($color: #000, $alpha: .15);
	}
}
.news-small-container .news-small-content:last-of-type{
	&::before{
		height: 50%;
	}
}

.news-small-container a.news-small-content{
	&:hover{
		color: $red-dark;
		.news-text{
			color: $red-dark;
		}
	}
}
.news-headline{
	font-family: $din-regular;
	font-size: 22px;

	margin: .5em 0;

	color: black;
}
.news-content{
	font-size: 14px;
	line-height: 140%;

	margin-bottom: 2em;

	color: #3d3d3d;
}
// News Mall Container
.news-small-container{
	display: inline-block;
	float: left;

	box-sizing: border-box;
	width: calc(50% - 3%);
	margin-right: 6%;
	margin-bottom: 2em;
	.news-small-content:last-child{
		&:before{
			height: 20px;
		}
	}
}
.news-section{
	@extend %clearfix;
	.news-small-container:nth-child(2n+1){
		margin-right: 0;
	}
}

a.news-big-link{
	text-decoration: none !important;
	&:visited{
		text-decoration: none !important;
	}
	&:hover{
		text-decoration: none !important;
	}
}

.sidenavbar{
	* a{
		text-decoration: none;
		&:hover{
			text-decoration: none !important;
		}
	}
}

// Big News Item
.news-big{
	& *{
		text-decoration: none !important;
	}
	&-header{
		position: relative;

		text-decoration: none !important;
		img{
			display: block;

			width: 100%;
		}
	}
	&-dim{
		position: absolute;
		top: 0;
		left: 0;

		display: none;

		width: 100%;
		height: 100%;

		background-color: rgba($color: #000, $alpha: .15);
	}
	.news-big-content{
		box-sizing: border-box;
		padding-right: 20px;
		border-right: 3px transparent solid;
	}
	&:hover{
		.news-headline{
			color: $red;
		}
		.news-big-content{
			box-sizing: border-box;
			padding-right: 20px;
			border-right: 3px $gray-search-border solid;
		}
	}

}


@media screen and (min-width: 0) and (max-width: 1024px){
	.news-section .news-small-container{
		width: 100% !important;
		max-width: 100%;
		padding: 0;
	}
}

.news-more-link{
	font-family: $din-medium;
	font-size: 14px;

	display: inline-block;

	margin-top: 17px;

	text-decoration: none;
	text-transform: uppercase;

	color: $gray-dark;
	&:visited{
		color: $gray-dark;
	}
	&:hover{
		text-decoration: none;
		color: $red-dark;
	}
}
.news-more-icon{
	display: inline-block;
	position: relative;
	top: -2px;
	svg{
		width: 11px;
		height: 7px;

		transform: rotate(-90deg);

		fill: $red;
		stroke-width: 1px;
		stroke: $red;
	}
}

.news-more{
	text-align: center;

	border-top: 2px $gray-75 solid;

	&:hover{
		.news-more-icon{
			svg{
				stroke: $red-dark;
				fill: $red-dark;
			}
		}
	}
}
.news-more-group{
	text-align: right;
	&:hover{
		svg{
			fill: $red-dark;
		}
	}
}