#matterList
{
	margin-top: 30px !important;
	color: #ffffff;
}

#matterList .results_criteria li::marker
{
	color: #ffffff;
}

#matterList ul.results_list 
{
	display: grid;
	grid-gap: 15px;
	margin: 0;
}

#matterList ul.results_list > li 
{
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 250px;
	padding:  max(25px, 
             min(52px, 25px + (52 - 25) * ((100vw - 767px) / (1920 - 767))
				))

				max(25px, 
				             min(45px, 25px + (45 - 25) * ((100vw - 767px) / (1920 - 767))
				));


	margin: 0;
	list-style: none;
	background: #2B65A7;
	color: #ffffff;

}


#matterList .title 
{
	margin-top: 8px;
	--min-font-size: 19;
	--max-font-size: 21;
	font-family: 'merriweather';
}

#matterList a:not(.sp_pencil)
{
	display: flex;
	align-items: flex-end;
	height: 100%;
}

#matterList a:not(.sp_pencil)
{
	color: inherit;
}

#matterList .hovertext
{
	--min-margin-top: 14;
	--max-margin-top: 20;
	--min-font-size: 16;
	--max-font-size: 19;
	line-height: 1.3;
}

#matterList .area ul,
#matterList .area li 
{
	padding: 0;
	margin: 0;
	list-style: none;
}

#matterList .area li
{
	color: #CEE5F8;
	letter-spacing: 1px;
	font-size: 16px;
	text-transform: uppercase;
}

#experienceNewsSpot
{
	margin-top: 60px;
	color: #ffffff;
}

#experienceNewsSpot a 
{
	display: block;
	height: 100%;
}

#experienceNewsSpot ul 
{
	display: grid;
	grid-gap: 15px;
}

#experienceNewsSpot h2,
#experienceNewsSpot .title
{
	color: inherit;
}

#experienceNewsSpot li 
{
	position: relative;
	margin: 0;
	list-style: none;
	min-height: 223px;
	background: #000000;
}

#experienceNewsSpot .image img 
{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .5;
}

#experienceNewsSpot .content 
{
	position: relative;
	padding:  max(25px, 
             min(52px, 25px + (52 - 25) * ((100vw - 767px) / (1920 - 767))
				))

				max(25px, 
				             min(45px, 25px + (45 - 25) * ((100vw - 767px) / (1920 - 767))
				));
	z-index: 10;
	box-sizing: border-box;
}

#experienceNewsSpot .itemdate 
{
	margin-bottom: 5px;
	color: #C0DDF5;
	font-size: 16px;
}

#experienceNewsSpot .title 
{
	font-size: 19px;
	color: #ffffff;
}

#matterList a.sp_pencil,
#experienceNewsSpot a.sp_pencil
{
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10;
}

.submit_wrapper
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
}

.submit_wrapper a 
{
	font-size: 17px;
}

.submit_wrapper button
{
	cursor: pointer;
	padding: 0;
}

#subContent
{
	order: 1;
}

#mainContent
{
	order: 2;
}

@media (min-width: 600px)
{
	#matterList ul.results_list,
	#experienceNewsSpot ul.results_list
	{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}


@media (min-width: 1024px)
{

	body.wideContentNoBackground #mainContent:not(:only-child)
	{
		float: right;
		width: calc(100% - 304px - 40px);
	}

	#subContent
	{
		float: left;
		clear: left;
		width: 304px;
	}

}

@keyframes formFieldSlide
{
	0%
	{
		transform: translateY();
		opacity: 0;
	}

	100%
	{
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes matterGrow
{

	0%
	{
		transform: scale(0);
	}

	100%
	{
		transform: scale(1);
	}

}

@keyframes matterFadeIn
{
	0%
	{
		opacity: 0;
	}

	100%
	{
		opacity: 1;
	}
}


@media (min-width: 1280px)
{

	#matterList li 
	{
		transform: scale(0);

		animation: matterGrow 500ms forwards 500ms;
	}
	
	#matterList .content
	{
		opacity: 0;
		animation: matterFadeIn 500ms forwards 1000ms;
	}

	#matterList .hovertext
	{
		display: none;
	}

	#matterList a:hover .hovertext,
	#matterList a:focus .hovertext,
	#matterList li:hover .hovertext,
	#matterList li:focus-within .hovertext
	{
		display: block;
	}

	#matterList li:hover .hovertext,
	#matterList li:focus-within .hovertext
	{
		cursor: default;
	}

	#matterList a:hover .hovertext,
	#matterList a:focus .hovertext
	{
		cursor: pointer;
	}

	#subContent form > div > div:nth-child(n + 3)
	{
		opacity: 0;
		animation: formFieldSlide 500ms forwards 500ms;
	}

	#subContent form > div > div:nth-child(3)	{transform: translateY(-55px);}
	#subContent form > div > div:nth-child(4)	{transform: translateY(-110px);}
	#subContent form > div > div:nth-child(5)	{transform: translateY(-165px);}
	#subContent form > div > div:nth-child(6)	{transform: translateY(-220px);}
	#subContent form > div > div:nth-child(7)	{transform: translateY(-275px);}
	#subContent form > div > div:nth-child(8)	{transform: translateY(-330px);}
	#subContent form > div > div:nth-child(9)	{transform: translateY(-385px);}
	#subContent form > div > div:nth-child(10){transform: translateY(-440px);}



	#matterList ul.results_list > li a::before
	{
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #2B65A7;
		z-index: 0;
		transition: transform 250ms ease;
		z-index: -1;
	}


	#matterList ul.results_list > li a:hover::before
	{
		transform: scale(1.05);
	}


}

@media (min-width: 1350px)
{
	body.wideContentNoBackground #mainContent:not(:only-child)
	{
		width: calc(100% - 304px - 50px);
	}

	#subContent
	{
		width: 304px;
	}
}

@media (min-width: 1600px)
{
	#matterList ul.results_list,
	#experienceNewsSpot ul.results_list
	{
		grid-template-columns: repeat(3, 1fr);
	}
}