Nueva prueba de efecto para subforo

por **Admin** Dom Jul 08, 2018 6:21 pm

¡Bienvenidos, usuarios! Aquí nos encanta leer y compartir fanfics de todo tipo, sobre anime, videojuegos, de creación propia, poesía, películas, series y más

Un enlace Un enlace Un enlace Un enlace

Código:: <br><center><style type="text/css">.recuadror {width: 350px; height: 220px; position: relative; overflow: hidden; cursor: pointer; display: inline-block; border: 1px solid #CCCCCC;} .recuadror .mant {width: 350px; height: 220px; box-shadow: inset 0px 0px 500px 100px #3C1F39; opacity: .9; transition: 1s ease-in-out; position: absolute; margin-top: -220px; outline: 1px solid #EBEBEB; outline-offset: -18px;} .recuadror:hover .mant {outline-offset: 0px; box-shadow: inset 0px 0px 0px 0px #3C1F39;} .recuadror .matt {width: 290px; margin-top: -180px; text-align: center; margin-left: 0px; transition: .8s ease-in-out; transform: scaleY(0); border-top: 1px solid #EBEBEB; border-bottom: 1px solid #EBEBEB; padding: 1px; margin-right: 4px;} .recuadror:hover .matt{transform: scaleY(1); margin-left: 0px;} .matt p {width: 290px; color: #EBEBEB; text-align: center; font-family: Tahoma; font-size: 11px; margin-left: 0px; font-weight: bold;} .recuadror img {width: 350px; height: 220px; display: block; margin: 0px; padding: 0px; outline: 1px solid #EBEBEB; outline-offset: 0px; transition: .8s ease-in-out;} .recuadror:hover img {-webkit-filter: brightness(30%); filter: brightness(40%); outline-offset: -18px;} a.lo {width: 100px; padding: 2px; height: 13px; font-family: Oswald; font-size: 11px; text-align: center; transition: 1s ease-in-out; box-shadow: inset 0px 0px 0px 0px #902121; color: #EBEBEB; border-bottom: 1px solid #EBEBEB; display: inline-block; margin: 1px;} a.lo:hover {box-shadow: inset 0px -100px 0px 0px #902121;}</style><div class="recuadror"><img src="https://i76.servimg.com/u/f76/19/46/26/75/sin_tz10.jpg"><div class="mant"></div><div class="matt"><p>¡Bienvenidos, usuarios! Aquí nos encanta leer y compartir fanfics de todo tipo, sobre anime, videojuegos, de creación propia, poesía, películas, series y más<br><br><a href="#" class="lo">Un enlace</a><a href="#" class="lo">Un enlace</a><a href="#" class="lo">Un enlace</a><a href="#" class="lo">Un enlace</a></p></div> </div> </center>