figure1 {
display: inline-block;
position: relative;
overflow: hidden;
margin: 0 auto; 
}


figcaption1 {
position: absolute;
padding: 10px 10px;
opacity: 0;
-webkit-transition: all 0.6s ease;
-moz-transition:    all 0.6s ease;
-o-transition:      all 0.6s ease;}

figure1:hover figcaption1 {opacity: 1;}

.cap-bot:before { top: 10px; left: 10px; }
.cap-bot figcaption1 { left: 0; top: -30%;}
.cap-bot:hover figcaption1 { top: 0; }