.promo-banner{
    display: block;
    position: relative;
    text-align: center;
    width: 100%;
    overflow: hidden;
    float: left;
}
.promo-banner .text-container{
    backface-visibility: hidden;
    display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.promo-banner > a{
    display: block;
    max-width: 100%;
    position: relative;
}
/* effect-lily */
.effect-lily .promo-banner > a img{
    opacity: .7;
    max-width: none;
    transform: translate3d(-40px, 0px, 0px);
    -webkit-transform: translate3d(-40px, 0px, 0px);
    -moz-transform: translate3d(-40px, 0px, 0px);
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    width: calc(100% + 50px);
}
.effect-lily .promo-banner p{
    opacity: 0;
    transition: opacity 0.2s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.2s ease 0s, transform 0.35s ease 0s;
    -moz-transition: opacity 0.2s ease 0s, transform 0.35s ease 0s;
}
.effect-lily .promo-banner:hover > a img,
.effect-lily .promo-banner:hover .text-container h2,
.effect-lily .promo-banner:hover .text-container h3,
.effect-lily .promo-banner:hover .text-container p{
    transform: translate3d(0, 0px, 0px);
    -webkit-transform: translate3d(0, 0px, 0px);
    -moz-transform: translate3d(0, 0px, 0px);
}
.effect-lily .promo-banner:hover > a img,
.effect-lily .promo-banner:hover .text-container p{
    opacity: 1;
}
.effect-lily .promo-banner:hover p{
    transition-delay: 0.05s;
    -webkit-transition-delay: 0.05s;
    -moz-transition-delay: 0.05s;
    transition-duration: 0.35s;
    -webkit-transition-duration: 0.35s;
    -moz-transition-duration: 0.35s;
}

/* effect sadie */
.effect-sadie .promo-banner > a{
    display: block;
    position: relative;
}
.effect-sadie .promo-banner > a:before{
    background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(72, 76, 97, 0) 0%, rgba(72, 76, 97, 0.8) 75%) repeat scroll 0 0;
    content:"";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translate3d(0px, 50%, 0px);
    -webkit-transform: translate3d(0px, 50%, 0px);
    -moz-transform:translate3d(0px, 50%, 0px);
    width: 100%;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, -moz-transform 0.35s ease 0s;
    z-index: 2;
}
.effect-sadie .promo-banner .text-container h2{
    transform: translate3d(0px, -50%, 0px);
    -moz-transform: translate3d(0px, -50%, 0px);
    -webkit-transform: translate3d(0px, -50%, 0px);
    transition: transform 0.35s ease 0s, color 0.35s ease 0s;
    -webkit-transition: -webki-transform 0.35s ease 0s, color 0.35s ease 0s;
    -moz-transition: -moz-transform 0.35s ease 0s, color 0.35s ease 0s;
}
.effect-sadie .promo-banner .text-container p{
    transform: translate3d(0px, 10px, 0px);
    -webkit-transform: translate3d(0px, 10px, 0px);
    -moz-transform: translate3d(0px, 10px, 0px);
    transition: transform 0.35s ease 0s, color 0.35s ease 0s;
    -webkit-transition: -webkit-transform 0.35s ease 0s, color 0.35s ease 0s;
    -moz-transition: -moz-transform 0.35s ease 0s, color 0.35s ease 0s;
    opacity: 0;
}
.effect-sadie .promo-banner:hover > a:before,
.effect-sadie .promo-banner:hover .text-container p{
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -moz-transform: translate3d(0px, 0px, 0px);
}
.effect-sadie .promo-banner:hover .text-container h2{
    transform: translate3d(0px, -50%, 0px) translate3d(0px, -40px, 0px);
    -moz-transform: translate3d(0px, -50%, 0px) translate3d(0px, -40px, 0px);
    -webkit-transform: translate3d(0px, -50%, 0px) translate3d(0px, -40px, 0px);
}

/* effect Zoom */
.effect-zoom .promo-banner > a img{
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -webkit-transition: all 0.4s ease 0s;
}
.effect-zoom .promo-banner:hover > a img{
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    opacity: 0.8;
}

/* effect chico */

.effect-chico .promo-banner > a img{
    transform: scale(1.12);
    -webkit-transform: scale(1.12);
    -moz-transform: scale(1.12);
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, -moz-transform 0.35s ease 0s;
}
.effect-chico .promo-banner > a:before{
    border: 2px solid rgba(255,255,255,0.6);
    bottom: 30px;
    content: "";
    left: 30px;
    right: 30px;
    top: 30px;
    position: absolute;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    opacity: 0;
    z-index: 2;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, -moz-transform 0.35s ease 0s;
}
.effect-chico .promo-banner:hover > a img{
    transform: scale(1);
    -webkit-transform:  scale(1);
    -moz-transform:  scale(1);
}
.effect-chico .promo-banner:hover > a:before{
    opacity: 1;
    transform: scale(1);
    -webkit-transform:  scale(1);
    -moz-transform:  scale(1);
}

/* effect apollo */
.effect-apollo .promo-banner > a img{
    opacity: 0.95;
    transform: scale3d(1.05, 1.05, 1);
    -webkit-transform: scale3d(1.05, 1.05, 1);
    -moz-transform: scale3d(1.05, 1.05, 1);
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s, -moz-transform 0.35s ease 0s;
}
.effect-apollo .promo-banner > a:before{
    background-color: rgba(255, 255, 255, 0.5);
    content:"";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    position: absolute;
    transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, -100%, 0px);
    -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, -100%, 0px);
    -moz-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, -100%, 0px);
    transition: transform 0.6s ease 0s;
    -webkit-transition: -webkit-transform 0.6s ease 0s;
    -moz-transition: -moz-transform 0.6s ease 0s;
    z-index: 2;
}
.effect-apollo .promo-banner:hover > a img{
    opacity: 0.6;
    transform: scale3d(1, 1, 1);
    -webkit-transform: scale3d(1, 1, 1);
    -moz-transform: scale3d(1, 1, 1);
}
.effect-apollo .promo-banner:hover > a:before{
    transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, 100%, 0px);
    -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, 100%, 0px);
    -moz-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0px, 100%, 0px);
}