.crop {
  overflow: hidden;
  background: #5399f1;
}
.crop .content {
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
	display: table;
}
.crop .content > span{
	display: table-cell;
    vertical-align: middle;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 24px;
    padding: 0 15px;
    text-align: center;
}
.crop .image {
	z-index: 1;
	position: absolute;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
}


/* Split vertical */
.crop.vertical .image{
	// background-image: url("../images/smog.jpg");
    background-size: 100% 200%;
}
.crop:hover .upper.image {
	top: -50%;
}
.crop:hover .lower.image {
	bottom: -50%;
}
.crop .upper.image, .crop .lower.image {
	height: 50%;
}
.crop .upper.image {
	top: 0;
	-webkit-transition: top 0.5s ease;
	-moz-transition: top 0.5s ease;
	-ms-transition: top 0.5s ease;
	transition: top 0.5s ease;
}
.crop .lower.image {
	bottom: 0;
	background-position: 0% 100%;
	-webkit-transition: bottom 0.5s ease;
	-moz-transition: bottom 0.5s ease;
	-ms-transition: bottom 0.5s ease;
	transition: bottom 0.5s ease;
}


/* Split horizontal */
.crop.horizontal .image {
	/*//background-image: url("http://fotosdemotosyautos.com/wp-content/uploads/2015/08/carros-de-portivos-4.jpg");*/
	/*background-image: url("../images/diagnostic.jpg");*/
	background-size: 200% 100%;
}
.crop:hover .left.image {
	left: -50%;
}
.crop:hover .right.image {
	right: -50%;
}
.crop .left.image {
  	left: 0;
  	background-position: 0% 50%;
	-webkit-transition: left 0.5s ease;
	-moz-transition: left 0.5s ease;
	-ms-transition: left 0.5s ease;
	transition: left 0.5s ease;
}
.crop .right.image {
	right: 0;
	background-position: 100%;
	-webkit-transition: right 0.5s ease;
	-moz-transition: right 0.5s ease;
	-ms-transition: right 0.5s ease;
	transition: right 0.5s ease;
}
.crop .left.image,
.crop .right.image {
	width: 50%;
}