
.cssEffect .cssBox.cssZoomIn .cssHeader {
	transition: all 0.2s ease-in-out;
}
.cssEffect .cssBox.cssZoomIn:hover .cssHeader {
	transform: translateY(0);
	width: calc(50%);
}
.cssEffect .cssBox.cssZoomIn .cssContent {
	transition: transform 0.4s ease-in-out;
}
.cssEffect .cssBox.cssZoomIn:hover .cssContent {
	position: absolute;
	width: inherit;
	background-color: rgba(255,255,255, 0.25) !important;
	transition: transform 0.4s ease-in-out;
}
.cssEffect .cssBox.cssZoomIn.showMedia .cssBodytext {
	display: block;
	transform: translateX(90%);
}
.cssEffect .cssBox.cssZoomIn.showMedia:hover .cssBodytext {
	transform: translateX(100%);
	transition: transform 0.4s ease-in-out;
}
.cssEffect .cssBox.cssZoomIn.showMedia:hover .cssTeaser {
	color: #666 !important;
}

.cssEffect .cssBox.cssZoomIn.showMedia:hover .cssSymbol {
	border-bottom-color: rgba(255,255,255, 0.35);
}

.cssEffect .cssBox.cssZoomIn .cssBoxlink:hover {
	box-shadow: 0px 0px 0px 7px rgba(255,255,255, 0.6) inset,
		2px 2px 5px 0px rgba(55,55,55, 0.35) !important;
}

.cssEffect .cssBox.cssZoomIn .cssMedia {
	transition: all 0.2s ease-out;
}
.cssEffect .cssBox.cssZoomIn:hover .cssMedia {
	filter: blur(20px);
	opacity: 0.4;
	transform-origin: top center;
	transform: scale(2.0, 2.0) translate(-40%, -25%);
	width: 50%;
	transition: all 0.4s linear;
	float: right !important;
}


.cssEffect .cssBox.cssZoomIn:hover .cssShowOnHover {
	display: block;
}
