.card
{
	display: block;
	position: relative;
	min-height: 30mm;
	padding: 6mm;
	margin: 12mm;
	/*text-align: justify;*/
	text-align: left;
	line-height: 2.0em;
	text-decoration: none;
	color: black;
	
	transition: all 300ms ease;
}

.card:hover
{
	box-shadow: 5px 5px 20px 0px rgba( 0, 0, 0, 0.3 );
	/*transform: scale( 1.033 );*/
	text-decoration: none;
}

.card h2
{
	position: absolute;
	left: 0mm;
	right: 0mm;
	top: 0mm;
	height: 12mm;
	line-height: 12mm;
	padding: 0mm 6mm;
	font-size: 1.0em;
	font-weight: normal;
	
	/*background: #3F3571;*/
	background: #053782;
	color: white;
}

.card h2 + *
{
	margin-top: 12mm;
}

.card .icon
{
	position: absolute;
	left: 0mm;
	top: 0mm;
	width: 30mm;
	height: 100%;
	line-height: 30mm;
	text-align: center;
	font-size: 10mm;
	/*padding-left: 6mm;*/
	
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	
	/*color: #3f3571;*/
	color: #053782;
	
	transition: padding 150ms ease;
}

.card:hover .icon
{
	padding-left: 6mm;
}

.card .image
{
	background-size: cover;
}

.card .text
{
	/*padding-left: 24mm;*/
	padding-left: 30mm;
}

.card .text.label
{
	padding-top: 0mm;
}

.card details
{
	/*padding-left: 24mm;*/
}

.card details summary
{
	list-style: none;
	cursor: pointer;
}

.card details summary::after
{
	display: block;
	/*margin-left: 0.5em;*/
	content: "Weiterlesen...";
	font-style: italic;
	/*color: #3f3571;*/
	color: #053782;
}

.card details summary:hover::after
{
	text-decoration: underline;
}

.card details[ open ] summary::after
{
	content: "";
}

/* Mobile: */

@media ( max-width: 699px )
{
	.card
	{
		margin: 6mm;
	}
	
	.card .icon
	{
		display: none !important;
	}
	
	.card .text
	{
		padding-left: 0mm !important;
	}
}