
.mediaGalleryLayout .thumbnailBounds {
	display: block;
	position: relative;
	width: 100%;
	overflow: hidden;
	background-color: #F0F0F0;
}

.mediaGalleryLayout .thumbnailWrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: -1px;
	bottom: -1px;
	left: -1px;
	right: -1px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.mediaGalleryLayout .thumbnailBounds:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	opacity: 0;
	transition: opacity 0.2s ease-out;
	pointer-events: none;
	z-index: 2;
	background-color: #333333;
}

.mediaGalleryLayout .thumbnailBounds .thumbnail {
	flex: 0 0 auto;
}

.mediaGalleryLayout .thumbnailBounds.contain .thumbnail {
	max-width: 100%;
	max-height: 100%;
}

.mediaGalleryLayout .thumbnailBounds.crop .thumbnail {
	visibility: hidden;
}

.mediaGalleryLayout .thumbnailIconWrapper {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -0.5em;
	margin-top: -0.5em;
	width: 1em;
	height: 1em;
	opacity: 0.9;
	transition: opacity 0.2s ease-out;
	font-size: 60px;
	pointer-events: none;
	border-radius: 20%;
	overflow: hidden;
	z-index: 3;
	background-color: rgba(51,51,51, 0.8);
}

.mediaGalleryLayout .thumbnail .fepIcon {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -0.5em;
	margin-top: -0.5em;
	font-size: 75%;
	color: #FFFFFF;
}

.mediaGalleryLayout:not(.editMode) .thumbnailBounds:hover:after {
	opacity: 0.3;
}		

.mediaGalleryLayout .thumbnailBounds:hover .thumbnailIconWrapper {
	opacity: 1;
}

.mediaGalleryLayout.editMode .thumbnailBounds::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: 1;
	opacity: 1;
	background: linear-gradient(to bottom, rgba(51,51,51, 0.5) 0%,rgba(0,0,0,0.14) 40%,rgba(51,51,51, 0) 100%);
}

.mediaGalleryLayout .thumbnailContextMenu {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

.mediaGalleryLayout .thumbnailButtons {
	position: absolute;
	top: 15px;
	right: 15px;
	z-index: 2;
}

.mediaGalleryLayout .thumbnailButtons .fepButton {
	opacity: 0.8;
	transition: opacity 0.2s ease-out;
}

.mediaGalleryLayout .thumbnailButtons .fepButton:hover {
	opacity: 1;
}

.mediaGalleryLayout .thumbnailButtons .fepButton .fepIcon {
	color: #FFFFFF !important;
}
.mediaGalleryLayout .title {
	font-weight: bold;
}