html,
body
{
	font-size: 5mm;
}

a:visited,
a:active,
a:link,
a:hover
{
	text-decoration: none;
}

header a,
footer,
footer a
{
	color: #ffffff;
	font-weight: bold;
}

header,
footer
{
	display: block;
	padding: 0px 10vw;
	box-sizing: border-box;
	font-family: Arial;
/*	min-height: 15mm; */



	background-color: #404040;
	padding-top: 0px;
	padding-bottom: 0px;
	display: flex;
	align-items: center;
	color: #ffffff;
	flex-wrap: wrap;
	
	/* position: fixed;
	left: 0px;
	right: 0px;
	
	z-index: 999;
	*/
}


footer
{
	justify-content: space-between;
	flex-wrap: wrap-reverse;
}

footer > *
{
	margin: 0.5em;
}

footer img.pslogo
{
	height: 1.5em;
	margin-right: 0.5em;
}

/*
header .ctsoftdesign_mainlogo
{
	position: relative;
	display: block;
	width: 40mm;
	height: 100%;
	background: url('sfb/ProShare_logo_v06_4web.svg') no-repeat left center;
	background-size: auto 1cm!important;
	/ * border-right: 1px dashed #ffffff; * /
	float: left;
	cursor: pointer;
}
*/

/*
header > nav
{
	display: inline-flex;
	height: 100%;
	font-size: 7mm;
}

header > nav > div > a
{
	border-top: 1mm solid transparent;
	border-bottom: 1mm solid transparent;
	height: 100%;
	line-height: 14mm;
	box-sizing: border-box;
	margin-left: 5mm;
	padding-left: 5mm;
	padding-right: 5mm;
	
	/ * text-transform: uppercase; * /
	font-variant: small-caps;
	color: #000000;
}

header > nav > div:hover > a
{
	color: #2f57a1;
	border-bottom-color: #2f57a1;
}
*/

header > div.logouticonholder
{
	text-align: right;
	display: flex;
	flex-grow: 1;
	justify-content: flex-end;
}

header > div.logouticonholder div.cwa_login_logouticon
{
	width: 8mm;
	height: 8mm;
}

header > div.logouticonholder div.cwa_login_logouticon > span:first-child
{
	bottom: 2mm;
}


main
{
	/* background-color: #ffffff; */
	padding-top: 15mm; /* 0px 2mm 0px; */
	font-family: Arial;
	box-sizing: border-box;
	background-color: #ffffff;
	color: #000000;
	padding: 10mm 10vw;

}


@media (max-width: 30cm)
{
	header
	{
		padding: 0px 2vw;
	}

	main
	{
		padding: 0px;
	}
	
	section.gallery
	{
		padding: 10mm 10vw;
	}
}










div.ctsoftdesign_filelist
{
	display: grid;
	display: inline-grid;
	grid-template-rows: auto;
	grid-template-columns: auto 50mm 50mm;
	grid-template-areas: "f s m";
	/* grid-column-gap: 8mm;
	grid-row-gap: 8mm; */
	min-width: 80vw;
	/*width: 80vw; */
	max-width: 100%;
	overflow-x: auto;
/*
	max-width: 80vw;
	min-width: 80vw;
*/
	/* justify-content: end; */
}


div.ctsoftdesign_filelist > *
{
	padding: 2mm 4mm;
}

div.ctsoftdesign_filelist > * > *
{
	padding: 2mm 0px;
}

div.ctsoftdesign_filelist > *.col1,
div.ctsoftdesign_filelist > *.col2
{
	position: relative;
/*	border-left: 0px none transparent; */
}

header > a,
header > a.cwa_images,
section > a
{
	background-size: 8mm 8mm;
	background-repeat: no-repeat;
	background-position: 2mm center;
	/* padding-left: 12mm; */
	padding: 2.5mm 0px 2.5mm 12mm;
	min-height: 8mm;
	box-sizing: border-box;
}

header > a:hover,
section > a:hover
{
	/* 
	color: #2f57a1;
	border-bottom-color: #2f57a1; */
	text-decoration: underline;
}

div.ctsoftdesign_filelist > *.col1 > span,
div.ctsoftdesign_filelist > *.col2 > span
{
	background-size: 8mm 8mm;
	background-repeat: no-repeat;
	background-position: 0mm center;
	padding-left: 10mm;
	position: relative;
}

div.ctsoftdesign_filelist > * > *
{
	position: relative;
	z-index: 2;
	pointer-events: none;
}


/*
div.ctsoftdesign_filelist > *:hover
{
	position: relative;
	background-color: #f5f6e8;
	background-size: 80vw;
	background-position: -100vw center;
}
*/

div.ctsoftdesign_filelist > .col1:before
{
	content: ' ';
	position: absolute;
	top: 0;
	left: 0px;
	bottom: 0px;
	width: 80vw;
	margin: 0px;
	padding: 0px;
	/* border: 1px dashed #ff00ff; */
	display: inline;
	z-index: 1;
	background-size: 180vw;
}
div.ctsoftdesign_filelist > .col1:hover::before,
div.ctsoftdesign_filelist > .col2:hover::before
{
	background-color: #f5f6e8;
}




div.ctsoftdesign_filelist > *.col2,
div.ctsoftdesign_filelist > *.head2
{
	border-left: 1px dashed #e0e0e0;
	text-align: right;
}

div.ctsoftdesign_filelist > *.col3,
div.ctsoftdesign_filelist > *.head3
{
	border-left: 1px dashed #e0e0e0;
	text-align: center;
}

div.ctsoftdesign_filelist > .col1:nth-child(6n+1),
div.ctsoftdesign_filelist > .col2:nth-child(6n+2),
div.ctsoftdesign_filelist > .col3:nth-child(6n+3)
{
	background-color: #f0f0f0;
}

div.ctsoftdesign_filelist > *:nth-child(1),
div.ctsoftdesign_filelist > *:nth-child(2),
div.ctsoftdesign_filelist > *:nth-child(3)
{
	background-color: #c0c0c0;
}

@media (max-width: 30cm)
{
	div.ctsoftdesign_filelist
	{
		grid-template-columns: auto auto 50mm;
		min-width: 100%;
	}
	
	div.ctsoftdesign_filelist > *:nth-child(3n+1)
	{
		grid-column-start: f-start;
		grid-column-end: m;
		/* padding-bottom: 1mm; */
	}

	div.ctsoftdesign_filelist > *:nth-child(3n+1):before
	{
		bottom: -6mm;
		/* width: 96vw; */
		width: 100%;
	}



	div.ctsoftdesign_filelist > *:nth-child(3n+2)
	{
		grid-column-start: f-start;
		grid-column-end: s;
	}

	div.ctsoftdesign_filelist > *:nth-child(3n+2),
	div.ctsoftdesign_filelist > *:nth-child(3n+3)
	{
		padding-top: 0px;
		padding-bottom: 0px;
		min-height: 6mm;
		max-height: 6mm;
		border-left: 0px none transparent;
	}
	div.ctsoftdesign_filelist > *:nth-child(3n+2) > span,
	div.ctsoftdesign_filelist > *:nth-child(3n+3) > span
	{
		padding-top: 0px;
		padding-bottom: 0px;
	}

	div.ctsoftdesign_filelist > *:first-child
	{
		grid-column-end: initial;
		padding-bottom: 2mm;
	}
	div.ctsoftdesign_filelist > *:nth-child(2)
	{
		grid-column-start: initial;
		padding-top: 2mm;
		min-height: initial;
		max-height: initial;
	}
	div.ctsoftdesign_filelist > *:nth-child(3)
	{
		padding-top: 2mm;
		min-height: initial;
		max-height: initial;
	}
}

/*
@media (max-width: 25cm)
{
	div.ctsoftdesign_filelist > *:nth-child(4n+1):before,
	div.ctsoftdesign_filelist > *:nth-child(4n+2):before
	{
		width: 100%;
	}
}
*/


/*
section.files
{
	padding-top: 10mm;
	padding-bottom: 10mm;
}
*/

@media (max-width: 25cm)
{
	section.files
	{
		padding: 0px;
	}
}

















main > section.gallery
{
	display: flex;
	flex-wrap: wrap;
/*	margin-right: 5mm; */
}

main > section.gallery > h2:first-child,
main > section.gallery > h2:first-child.ctsoftdesign_hideblck_en + h2.ctsoftdesign_hideblck_de
{
	margin-top: 0px;
}

main > section.gallery > h1,
main > section.gallery > h2,
main > section.gallery > h3,
main > section.gallery > h4,
main > section.gallery > h5,
main > section.gallery > h6,
main > section.gallery > span
{
	width: 100%;
}

main > section.gallery > div
{
	margin-right: 7.5mm;
	margin-bottom: 7.5mm;
	width: 70mm;
	/* height: 40mm; */
	padding-top: 50mm;
	border: 0.5mm solid #e0e0e0;
	position: relative;
}

main > section.gallery > span
{
	margin-bottom: 2em;
}


main > section.gallery > div > a.image,
main > section.gallery > div > span.image
{
	/* background-size: 60mm 40mm; */
	/* background-position: center 5mm; */
	background-repeat: no-repeat;
/*
	top: 0px;
	height: 50mm;
*/
	top: 2.5mm;
	height: 45mm;
	bottom: 0px;
	/*
	left: 0px;
	right: 0px;
	bottom: 2.5mm;
	top: 2.5mm;
	*/
	left: 2.5mm;
	right: 2.5mm;
	display: inline-block;
	position: absolute;
	background-size: contain;
	background-position: center center;
}

main > section.gallery > div > a.image
{
	cursor: zoom-in;
}

main > section.gallery > div > a.text
{
	text-align: right;
	background-color: #e0e0e0;
	color: #000000;
	padding: 1mm 2mm;
	background-size: 5mm;
   	background-position: 1mm center;

	display: block;
}

body
{
	display: flex;
	flex-direction: column;
}

main
{
	flex: 1 0 auto;
}
