div#comments_main
{
width: 100%;
padding: 1rem 1rem 1rem 52%;
position: relative;
background: #214361;
}

div#comments_main a.front
{
display: block;
position: absolute;
top: 1rem;
bottom: 1rem;
left: 1rem;
width: 49%;
background-position: center;
background-size: cover;
text-decoration: none;
}

div#comments_main a.front h3
{
position: absolute;
left: 0;
right: 0;
bottom: 0;
color: #A5CCEC;
width: 100%;
padding: 1rem;
font-size: 1.25rem;
line-height: 1.5rem;
background: #345E85;
text-transform: none;
}

div#comments_main a.front:hover h3
{
color: #F6921E;
}

div#comments_main a.front h3 span.date
{
display: block;
color: #FFF;
font-size: 1rem;
line-height: 1rem;
text-transform: none;
margin-top: 0.25rem;
}

div#comments_main a.side
{
display: block;
text-decoration: none;
margin-top: 2rem;
}

div#comments_main a.side:nth-child(-n+2)
{
margin-top: 0;
}

div#comments_main a.side h3
{
display: block;
color: #A5CCEC;
font-size: 1.25rem;
line-height: 2rem;
margin-top: 0;
text-transform: none;
}

div#comments_main a.side:hover h3
{
color: #F6921E;
}

div#comments_main a.side h3 span.date
{
display: block;
color: #FFF;
font-size: 1rem;
line-height: 1rem;
text-transform: none;
margin-top: 0.75rem;
}

@media (max-width: 768px)
{
	div#comments_main
	{
		padding: 0.25rem;
		margin-top: 0.25rem;
	}
	div#comments_main a.front
	{
		display: block;
		width: 100%;
		padding-top: 75%;
		position: relative;
		top: 0;
		left: 0;
	}
	div#comments_main a.front h3
	{
		padding: 0.25rem;
	}
	div#comments_main a.side:nth-child(-n+2)
	{
		margin-top: 1rem;
	}
}