Home › Forums › CSS › How to set the hover result as the prime result › Reply To: How to set the hover result as the prime result
This is the CSS that comes with the plugin. I’ve tried to fix it by removing the opacity element in “.hero-box.hero-box-effect-sadie p.hero-box-caption”, but it seems to have no effect. :
.hero-box.hero-box-effect-sadie .hero-box-text{width:100%;top:0;bottom:0;padding:30px}
.hero-box.hero-box-effect-sadie h3.hero-box-title{position:absolute;text-align:center;left:0;right:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
.hero-box.hero-box-effect-sadie .hero-box-img,.hero-box.hero-box-effect-sadie img{opacity:.9}
.hero-box.hero-box-effect-sadie p.hero-box-caption{position:absolute;text-align:center;left:0;right:0;bottom:40px;opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}
.hero-box.hero-box-effect-sadie:hover .hero-box-img,.hero-box.hero-box-effect-sadie:hover img{opacity:.7}
.hero-box.hero-box-effect-sadie:hover p.hero-box-caption{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
.hero-box.hero-box-effect-sadie:hover h3.hero-box-title{-webkit-transform:translateY(calc(-50% - 30px));transform:translateY(calc(-50% - 30px))}