//Post content
@post-content-overlap: 20px;
/*-----------------*/
/***** Overlay (background) - scale effect *****/
/*-----------------*/
.post-head-wrapper,
.post-entry-wrapper {
	.gradient-overlay-layout-list & {
		position: absolute;
		top: 50%;
		left: 20px;
		right: 20px;
		transition: opacity 0.4s, transform 0.4s;
		transform: translate3d(0,-50%,0);
		transform-origin: 50%;
	}
}
.gradient-overlay-layout-list .post-entry-content {
	-webkit-backface-visibility: hidden;
	transform: translatez(0);
}


.gradient-overlay-layout-list .post-entry-wrapper {
	opacity: 0;
	transition: opacity 0.35s, transform 0.35s;
	transform: translate3d(0,-50%,0) scale3d(0.8,0.8,1);
}

.gradient-overlay-layout-list:not(.disable-layout-hover) article:hover .post-head-wrapper {
	opacity: 0;
	transform: translate3d(0,-50%,0) scale3d(0.8,0.8,1);
}

.gradient-overlay-layout-list:not(.disable-layout-hover) article:hover .post-entry-wrapper {

	transform: translate3d(0,-50%,0) scale3d(1,1,1);
	opacity: 1;
	transition-delay: 0.1s;
}
.rollover-background-gradient(@firstColor, @gradient) when (isstring(~"@gradient")) {
	background: @firstColor;
	background: -webkit-linear-gradient(@gradient);
	background: linear-gradient(@gradient);
}
.post-entry-content {
	#page .@{unique-shortcode-class-name}.gradient-overlay-layout-list.enable-bg-rollover & {
		.custom-mixin-bg (@portfolio-rollover-bg);
			.rollover-background-gradient (@firstColor: @portfolio-rollover-bg, @gradient: @portfolio-rollover-bg-gradient);
	}
	.@{unique-shortcode-class-name}.gradient-overlay-layout-list:not(.portfolio-shortcode):not(.albums-shortcode) & {
		top: @post-content-overlap;
		right: @post-content-overlap;
		bottom: @post-content-overlap;
		left: @post-content-overlap;

	}
}
.post-head-wrapper,
.post-entry-wrapper {
	.@{unique-shortcode-class-name}.gradient-overlay-layout-list & {
		right: @post-content-padding-right;
		left: @post-content-padding-left;
	}
}