#mobile
{
	background-image:linear-gradient(45deg, #ffbb3d, #8a2ebd); 
	height:5vh; 
	text-align:center; 
	color:#fafbfc;
	font-family:orbitron;
	letter-spacing:3px;
	padding-top:4rem; padding-bottom:3rem;
	font-size:1.5rem; 
	font-weight:bold;
	border-radius:25px;
	width:80%;
	margin:4rem auto;
}
			
			

#splash-section
{
	position:relative;
	background-image:linear-gradient(to top, black, rgb(44, 6, 92));
	width:100%;
	margin-top:-6rem;
	overflow:hidden;
}

#splash-about-link
{
	background-color:#F17B16; 
	color:#fafbfc; 
	position:absolute; 
	font-size:1.5rem; 
	font-family:orbitron; 
	display:block; margin:auto; 
	bottom:13%; right:10%; 
	padding:20px 40px; 
	border:2px solid #fafbfc;
	border-radius:25px;
	z-index:99;
	transition:0.5s ease;
}

.heading
{
	background-image:linear-gradient(315deg, #ffbb3d, #8a2ebd);
	margin-top:7%;
	margin-bottom:0;
	padding:5%;
	font-family:orbitron;
	font-size:2rem;
	margin-left:calc(10% - 12px);
	margin-right:calc(10% - 12px); 
	color:#fafbfc;
	border-radius:25px 25px 0 0;
	text-decoration:underline;
}

#splash
{
	margin:auto;
	width:100%;
}

#splash-v
{
	display:none; 
	margin:auto; 
	width:100%;
}

.content
{
	width:100%;
	margin:auto;
}

#news-section > *
{
	margin-left:20px;
}

#news-section
{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	padding-top:20px; padding-right:20px;
	margin-left:-20px;
	margin:auto;
	width:calc(80% + 20px);
}

.news
{
	width:calc(33.333333% - 20px);
	overflow:hidden;
	position:relative;
	border-radius:25px 0;
	margin-bottom:20px;
}

.news-img
{
	width:100%;
	border-radius:25px 0;	
}

.news-overlay, .news-overlay-o
{
	background-color:#BD45FF;
	font-family:orbitron;
	overflow:hidden;
	position:absolute;
	top:0; left:0;
	width:100%; height:70%;
	transition:0.2s ease;
	transform:translate(0, 140%);
	z-index:9;
	border-radius:25px 0;
}

.news-overlay-o
{
	background-color:#F1AB16;
}

.news-overlay-heading
{
	padding:3% 5%;
	margin:0;
	color:#fafbfc;
	font-size:1.8rem;
}

.news-overlay-body
{
	font-family:prompt;
	padding:0 5%;
	margin:0;
	color:#fafbfc;
	font-size:1.2rem;
}

#news-overlay-read-more, #news-overlay-read-more-o
{
	font-family:prompt;
	padding:2% 4%;
	margin:3% 5%;
	color:#fafbfc;
	font-size:1rem;
	background-color:#fafbfc;
	color:#BD45FF;
	border-radius:25px;
	display:inline-block;
	font-weight:bold;
	transition:0.2s ease;
}

#news-overlay-read-more-o
{
	color:#F1AB16;
}

@media screen and (min-width:1024px) {

	.news:hover .news-overlay
	{
		transform:translate(0, 50%);
	}
	
	.news:hover .news-overlay-o
	{
		transform:translate(0, 50%);
	}
	
	#news-overlay-read-more:hover
	{
		background-color:#fafbfc;
		font-size:1.05vw;
	}
	
	#news-overlay-read-more-o:hover
	{
		background-color:#fafbfc;
		font-size:1.05vw;
	}
	
}

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

	.heading
	{
		margin-left:calc(5% - 11px);
		margin-right:calc(5% - 11px);
		text-align:center;
	}
	/*
	#splash
	{
		display:none;
	}
	
	#splash-v
	{
		display:block;
	}
	*/
	.content
	{
		border:1px solid lightgray;
	}

	#nav-container
	{
		width:90%; height:100%;
	}

	#news-section
	{
		width:calc(90% + 10px);
		text-align:center;
	}

	.news, .game
	{
		width:100%;
		border-radius:25px;
		margin-bottom:4rem;
	}
	
	.news-img
	{
		border-radius:25px 25px 0 0;
	}

	.news-overlay, .news-overlay-o
	{
		position:relative;
		transform:translate(0, 0);
		border-radius:0 0 25px 25px;
		padding:5% 0;
	}

}