/* General Style */
.common{
 margin: 0;
 padding: 0;
 display: inline-block;
 position: relative;
 overflow: hidden;
}

.common::before, .common::after{
 content: '';
 width: 100%;
 height: 100%;
 background: black;
 position: absolute;
 opacity: 0.2;
 top: 0;
 left 0;
 -moz-transform: translate3d(0, -100%, 0);
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
}

.pic-caption {
 position: absolute;
 text-align: center;
 background: #0A9D59;
 z-index: 999;
 width: 100%;
 max-height: 100%;
 overflow: hidden;
 top: 80%;
 -webkit-transform: translate3d(-100%, -50%, 0);
 transform: translate3d(-100%, -50%, 0);
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 line-height: 30px;
 /*font-size: 16px;*/
 color:#ffffff;
}

.pic-caption a{
 text-decoration: none;
}

imgx {
 display: block;
}
    
/* Slidedown Caption */

.slidedown:hover::before{
 -moz-transform: translate3d(0, 0, 0);
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}

.slidedown:hover .pic-caption{
 opacity: 1;
 -moz-transform: translate3d(0, -50%, 0);
 -webkit-transform: translate3d(0, -50%, 0);
 transform: translate3d(0, -50%, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 -moz-transition-delay: 0.5s;
 -webkit-transition-delay: 0.5s;
 transition-delay: 0.5s;
}

/* Horizontal Split Caption */

.split-horiz::after{
 -moz-transform: translate3d(0, 100%, 0);
 -webkit-transform: translate3d(0, 100%, 0);
 transform: translate3d(0, 100%, 0);
}

.split-horiz:hover::before{
 -moz-transform: translate3d(0, -50%, 0);
 -webkit-transform: translate3d(0, -50%, 0);
 transform: translate3d(0, -50%, 0);
}

.split-horiz:hover::after{
 -moz-transform: translate3d(0, 50%, 0);
 -webkit-transform: translate3d(0, 50%, 0);
 transform: translate3d(0, 50%, 0);
}

.split-horiz:hover .pic-caption{
 opacity: 1;
 -moz-transform: translate3d(0, -50%, 0);
 -webkit-transform: translate3d(0, -50%, 0);
 transform: translate3d(0, -50%, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 -moz-transition-delay: 0.5s;
 -webkit-transition-delay: 0.5s;
 transition-delay: 0.5s;
}


/* Vertical Split Caption */

.split-vert::before{
 -moz-transform: translate3d(-100%, 0, 0);
 -webkit-transform: translate3d(-100%, 0, 0);
 transform: translate3d(-100%, 0, 0);
}

.split-vert::after{
 -moz-transform: translate3d(100%, 0, 0);
 -webkit-transform: translate3d(100%, 0, 0);
 transform: translate3d(100%, 0, 0);
}

.split-vert:hover::before{
 -moz-transform: translate3d(-50%, 0, 0);
 -webkit-transform: translate3d(-50%, 0, 0);
 transform: translate3d(-50%, 0, 0);
}

.split-vert:hover::after{
 -moz-transform: translate3d(50%, 0, 0);
 -webkit-transform: translate3d(50%, 0, 0);
 transform: translate3d(50%, 0, 0);
}

.split-vert:hover .pic-caption{
 opacity: 1;
 -moz-transform: translate3d(0, -50%, 0);
 -webkit-transform: translate3d(0, -50%, 0);
 transform: translate3d(0, -50%, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 -moz-transition-delay: 0.5s;
 -webkit-transition-delay: 0.5s;
 transition-delay: 0.5s;
}

/* Slideup Caption */

.slideup img{
 -moz-transform: translate3d(0, 0, 0);
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
}

.slideup .pic-caption{
 top: 100%;
 opacity: 1;
 -moz-transform: translate3d(0, 0, 0);
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}

.slideup:hover img{
 -moz-transform: translate3d(0, -20px, 0);
 -webkit-transform: translate3d(0, -20px, 0);
 transform: translate3d(0, -20px, 0);
}

.slideup:hover .pic-caption{
 -moz-transform: translate3d(0, -100%, 0);
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0);
 -moz-transition: all 0.5s;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
}