#mainContent {
	color: rgba(245, 245, 245, 1);
}

#mainContent a
{
	color: #F5F5F5;
}

#mainContent .text-content a
{
	color: #fbcc40;
}

.news-header
{
	position: relative;
}

	.news-header #blur1
	{
		position: absolute;
		z-index: 1;

		top: 0;
		left: 0;
	}

	.news-header #blur2
	{
		position: absolute;
		z-index: 1;

		top: 0;
		right: 0;
	}

		.react-mobile .news-header #blur1,
		.react-mobile .news-header #blur2
		{
			display: none;
		}

	.news-header .top-news-block
	{
		
	}

		.news-header .top-news-block h2
		{
			font-size: 1.5rem;
		}

		.news-header .top-news-block p
		{
			font-size: 1rem;
		}

		.news-header .top-news-block.weekly
		{
			z-index: 2;

			box-shadow: -3px 0 10px rgba(0, 0, 0, 0.25);
		}

		.news-header .top-news-block.featured
		{
			z-index: 2;

			box-shadow: 3px 0 10px rgba(0, 0, 0, 0.25);
		}

		.news-header .top-news-block .news-item .details
		{
			position: absolute;

			bottom: 18px;
			left: 18px;
			right: 18px;
		}

		.news-header .top-news-block .news-item .image:after
		{
			content: "";
			display: block;
			z-index: 2;

			top: 0;
			left: 0;
			right: 0;
			height: 100%;
			
			background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 50%,rgba(0,0,0,0.75));
		}

			.react-mobile .news-header .top-news-block .news-item .image:after
			{
				background: rgba(0, 0, 0, 0.5);
			}

.news-item video
{
	position: absolute;

	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	opacity: 0;

	transition: 0.5s;
}

.news-header
{
	height: 23rem;
}

	.news-header .grid
	{
		height: 100%;
	}

	.top-news-block
	{
		position: relative;
		float: left;

		width: 50%;
		height: 100%;
	}

		.react-mobile .top-news-block
		{
			width: 100%;
			height: 50%;
		}

		.top-news-block .news-item
		{
			position: absolute;
			display: block;

			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
		}

		.top-news-block .image-zoom-hover
		{
			position: absolute;

			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			margin: 0 !important;
		}

			.top-news-block .image-zoom-hover .image
			{
				position: absolute;

				top: 0;
				left: 0;
				width: 100%;
				height: 100%;

				background-size: cover;
				background-position: 50% 50%;
			}

.filterBarContainer
{
	background: rgb(30, 36, 43);
}

	.filterBarContainer .filterBarRight
	{
		float: right;
	}

	.react-mobile .filterBarContainer .filterBarRight
	{
		display: none;
	}

#news-items-container
{
	margin-top: 18px;
}

.news-items
{
	background: rgba(245, 245, 245, 0.15);
}

	.news-items .details
	{
		padding-left: 16px;
	}


	.news-items .sectionHeader
	{
		margin-bottom: 0;
	}

	.news-items .news-item
	{
		position: relative;
		display: block;

		padding: 18px;
		border-bottom: 1px solid rgba(245, 245, 245, 0.1);

		transition: 0.15s;
	}

		.news-items .news-item:hover
		{
			background: rgba(245, 245, 245, 0.01);
		}

		.news-items .news-item .image
		{
			position: relative;

			height: 10.5rem;

			background-position: 50% 50%;
			background-size: cover;
			background-color: rgba(0, 0, 0, 0.1);
		}

		.news-items .news-item .time-and-author
		{
			position: absolute;

			top: 18px;
			right: 18px;
		}

			.react-mobile .news-items .news-item .time-and-author
			{
				position: relative;

				top: 0;
				right: 0;
			}

		.news-items .news-item .title
		{
			width: calc(100% - 120px);
			margin-top: 18px;

			font-size: 1.5rem;
		}

			.react-mobile .news-items .news-item .title
			{
				width: 100%;
			}

		.news-items .news-item .subtitle
		{
			font-size: 1rem;
			opacity: 0.5;
		}

		.news-items .news-item .image-zoom-hover
		{
			margin-left: 0 !important;
		}

			.news-items .news-item:hover .image-zoom-hover > .image,
			.news-items .news-item:hover .image-zoom-hover > img
			{
				-webkit-transform: scale(1.05);
				transform: scale(1.05);
			}