/*
** Ersteller: Udo Kasper
** Erstelldatum: 2020-05-12
** Beschreibung: Formatierung des Inhalts mit den Dokumenten
**
** Änderungshistorie
** Datum      Änderer    Änderung
** ---------- ---------- -----------------------------------------------------------------------
*/

/*
** Zuerst die Definitionen für alle ...
*/
.auslassungspunkte {
	display				: block;
	white-space			: nowrap;
	overflow			: hidden;
	text-overflow		: ellipsis;
	}
.line:nth-child(odd) {
	background-color	: #FFFFFF;
	}
.fileBoxdata,
.fileBoxdata2,
.fileBoxneu {
	display				: table;
	table-layout		: fixed;
	border-spacing		: 0px 5px;
	}
.line {
	font-family			: var(--schriftArt);
	font-size			: var(--schriftGroesseNormal);
	display				: table-row;
	xheight				: 30px;
	}
.fileElement {
	display: table-cell;
	}
.icon{
	display				: table-cell;
	padding-left		: 5px;
}
.name{
	width				: 500px;
	display				: table-cell;
	white-space			: nowrap;
	overflow			: hidden;
	text-overflow		: ellipsis;
	padding-left		: 5px;
}
.extra {
	padding-top			: 10px;
	}

/* ************************************************** */

#buttonBoxAll ,
#buttonBoxRight {
	display				: flex;
	flex-flow			: row wrap;
	justify-content		: space-around;
	background-color	: #FFFFFF;
	width				: inherit;
	border-bottom		: 1px solid #DDDDDD;
	}
#buttonBoxAll input
	{ box-shadow		: 0 0 5px 5px #AABBCC
	; padding-bottom	: 6px
	;}
#suche {
	width				: 290px;
	display				: flex;
	}

.info{
	xclear				: left;
	width				: 200px;
	display				: inline-block;
}
.date{
	width				: 200px;
	display				: inline-block;
}
.size{
	width				: 100px;
	text-align			: right;
	display				: inline-block;
}
.smallsize{
	width				: 50px;
	text-align			: right;
	display				: inline-block;
}
.name, .date, .size, .icon a:link, .icon a:visited, .name a:link, .name a:visited {
	font-family			: Arial;
	font-size			: 16px;
	color				: #000000
}
.line a {
	text-decoration		: none;
}
.fa-folder-open {
	color				: #C8A107	
}
.fa-file {
	color				: #445566	
}
.rot {
	color				: #FF0000	
}



/*
** dann die für das Handy ...
*/

.line .size,
.line .smallsize {
	display: none;
	}



/*
/* ... dann die für das Tablet ...
*/
@media screen and (min-width: 700px) {
	#cont {
		display			: block;
		width			: 700px;
		}
	#buttonBoxAll input,
	#buttonBoxAll button {
		vertical-align	: middle;
		}
	.line .size,
	.line .smallsize {
		display: table-cell;
		}
}



/*
/* ... und zum Schluss die für den PC
*/
@media only screen and (min-device-width: 1200px) {
	#cont {
		width			: 1010px;
		}
}