Slide Multiusos

<div class="baseSMM" style="background: url(https://i.imgur.com/HxenSvZ.png);"><div class="tituSMM">Título Aquí</div><div class="dataSMM"><h1>Dato 01</h1><h1>Dato 02</h1><h1>Dato 03</h1><h1>Dato 04</h1><div class="textSMM">Fruitcake croissant gingerbread powder topping. Donut sugar plum fruitcake tiramisu jelly beans. Candy lollipop macaroon cotton candy biscuit jujubes tootsie roll. Toffee tiramisu croissant danish gummies jelly-o cotton candy.

Oat cake sweet sweet roll cake liquorice muffin dessert carrot cake. Chupa chups lollipop tiramisu lollipop candy. Marzipan halvah liquorice pudding jujubes marzipan. Chupa chups muffin halvah fruitcake topping.

Tiramisu sweet sugar plum candy canes jelly beans. Cake dragée tiramisu tootsie roll gummies cake gummies bear claw. Donut icing wafer pastry tart.</div></div></div><a href="https://emmescodes.tumblr.com/"><div class="CMM">@mm</div></a><link href="https://fonts.googleapis.com/css?family=Cormorant+Unicase|Source+Serif+Pro" rel="stylesheet"><style type="text/css">.CMM {background: #33333361;color: #fff;width: 454px;margin: 5px auto;text-align: center;font-size: 10px;height: 12px;line-height: 12px;}.CMM:hover {animation: latido 1s infinite;}@keyframes latido {0% {zoom: 1.2; background: #333;}50% {zoom: 1;}70% {zoom: 1.3; background: #333;}100% {zoom: 1;}}.baseSMM {width: 452px;height: 350px;margin: auto;border: 5px solid #fff;outline: 1px solid #aaa;background-size: 450px 350px !important;position: relative;overflow: hidden;}.tituSMM {font: 20px Cormorant Unicase;background: #000000c4;text-align: center;line-height: 50px;height: 50px;color: #FFF;letter-spacing: 1px;position: absolute;bottom: -50px;width: 100%;transition-duration: .5s;transition-delay: .5s;}.baseSMM:hover .tituSMM {bottom: 0px;transition-delay: 0s;}.baseSMM:hover .dataSMM {top: 0px;transition-delay: 0s;}.dataSMM {position: absolute;background: #ffffffab;width: 100%;height: 290px;top: -290px;transition-duration: 1s;color: #000;transition-delay: .5s;}.dataSMM h1 {display: inline-block;background: #ffffffb5;border: none;margin: -450px 0px 5px 6px;width: 103px;font: 10px Source Serif Pro;text-align: center;line-height: 10px;padding: 2px;text-transform: uppercase;font-weight: bold;height: 12px;transition-duration: .5s;transition-delay: 0s;}.textSMM {background: #ffffffb5;margin: -430px 6px 5px;padding: 25px;height: 262px;overflow: auto;font: 13px Source Serif Pro;text-align: justify;transition-duration: .5s;transition-delay: 0s;}.textSMM:first-letter {font-size: 50px;float: left;margin: -5px 5px -12px 4px;}.baseSMM:hover .dataSMM h1 {margin: 5px 0px 5px 6px;transition-delay: .5s;}.baseSMM:hover .dataSMM .textSMM {margin: 0px 6px 5px;transition-delay: .5s;}</style>