/* Medias listing */
.webcmsMediasListing {
	height: 234px;
	overflow-y: scroll;
	box-sizing: border-box;
	border: 3px solid #ddd; background-color: #f3f3f3;
}
.webcmsMediasListing .mediasList > div { position: relative; padding: 0; border: 1px solid #fff; height: 95px; }
.webcmsMediasListing .mediasList > div a { display: block; width: 100%; height: 100%; }
.webcmsMediasListing .mediasList > div img { display: block; width: 100%; height: 100%; object-fit: cover; }
.webcmsMediasListing .mediasList > div p {
	position: absolute; z-index: 2; bottom: 0;
	background-color: rgba(0,0,0,0.6); color: white;
	margin-bottom: 0; padding: 4px;
	width: 100%; max-height: 46%;
	text-align: center;
	font-size: 12px;
	overflow: hidden;
	display: block;
}
.webcmsMediasListing .mediasList > div:hover { cursor: pointer; }
.webcmsMediasListing .mediasList > div:hover p { display: none; cursor: pointer; }

/* media list */
/*.webcmsMediasListing .mediasList > div p { display: none; }*/
.webcmsMediasListing .mediasList > div .mediasListTools { display: none; position: absolute; bottom: 0; z-index: 2; }
.webcmsMediasListing .mediasList > div:hover .mediasListTools { display: block; }
.webcmsMediasListing .mediasList > div .mediasListTools a { display: inline-block; width: auto; color: white; background-color: rgba(0,0,0,.5); }
/*.mediasListTools .mediasListToolsEdit {}
.mediasListTools .mediasListToolsDelete {}*/


/* multiupload Area */
#webcmsUploadArea {
	position: relative;
	border: 3px solid #ddd; background-color: #f3f3f3;
	display: block; width: 100%; min-height: 200px;
	margin: 15px 0;
}
.clearUploadedMediaFilesList { text-decoration: underline; position: absolute; bottom: -20px; right: 10px; z-index: 1; font-size: 11px; }
#webcmsUploadArea .bgArea {
	position: absolute; top: 0; z-index: 1;
	width: 100%; min-height: 200px;

	display: flex; flex-direction: column;
	align-items: center;
	justify-content: center;

	font-weight: 300; color: #888;
}
#webcmsUploadArea .bgArea h2 { display: block; font-size: 2em; margin-left: 15px; }
/*#webcmsUploadArea .bgArea h2 span {}*/
#webcmsUploadArea .bgArea p { display: block; }
#webcmsUploadArea .bgArea .custom-file { width: 50%; }

#webcmsFilesListing { position: relative; z-index: 2; list-style: none; margin: 0; padding: 0; }
#webcmsFilesListing li { position: relative; display: block; }
#webcmsFilesListing li { background-color: #fff; }
#webcmsFilesListing li:nth-child(2N+1) { background-color: #eee; }

#webcmsFilesListing li div.file { position: absolute; top: 0; z-index: 1; }
#webcmsFilesListing li span.filename {
	font-size: 12px; font-weight: 300; display: inline-block;
	color: #fff;
	padding-left: 10px;
	line-height: 42px;
}
#webcmsFilesListing li span.filesize { color: #f3f3f3; font-size: 9px; }
#webcmsFilesListing li span.upload-error { color: #fff; font-size: 9px; margin-left: 10px; }
#webcmsFilesListing li div.progress { border-radius: 0; margin-bottom: 0; height: 42px; }
#webcmsFilesListing li div.progress-bar {
	text-align: right;
	padding-right: 10px;
	padding-top: 10px;
}