/* 
    Created on : 3 mar 2025, 13:02:27
    Author     : antonio-go-on
*/




@media (max-width: 575.98px) {
    .contenedor {
        margin: 0 auto;
        width: 100%;
        height: 400px;
        position: relative;
        perspective: inherit;
    }

    .fila-flechas{
        margin-top:120px;
    }
}

@media (min-width: 576.98px) and (max-width:991.98px) {
   .contenedor {
        margin: 0 auto;
        width: 250px;
        height: 400px;
        position: relative;
        perspective: 4000px;
    }

    .fila-flechas{
        margin-top:200px;
    }
}


/* `xl` applies to large devices (desktops, less than 1200px) */
@media (min-width: 992.98px) {
    .contenedor {
        margin: 0 auto;
        width: 250px;
        height: 400px;
        position: relative;
        perspective: 4000px;
    }

    .fila-flechas{
        margin-top:200px;
    }
}





.carrusel {
    transform-style: preserve-3d;
    transition: transform 1s;
}

.tabla {
    backface-visibility: hidden;
    display: block;
    position: absolute;
    background: #000;
    /*line-height: 200px;*/
    /*font-size: 5em;*/
    text-align: center;
    color: #FFF;
    opacity: 0.95;
}

.imagen-tabla{
    background-position:center center;
    background-size: 280%;
    background-repeat: no-repeat;
    width: 280px;
    height: 420px;
    border-radius:15px;
    transition: background-size 1s;
    transition-timing-function: ease-out;
}

.imagen-tabla:hover{
    border:2px solid #fff;
    background-size:320%;
    cursor:pointer;
}

.titulo-tabla{
    padding-top:20px;
    font-size: 18px;
}

.next, .prev {
    color: #fff;
    /*position: absolute;*/
    /*top: 100px;*/
    padding: 1em 2em;
    cursor: pointer;
    transition: box-shadow 0.1s, top 0.1s;
    display:inline;
}
.next:hover, .prev:hover {
    color: #e0d4ab;
}
.next:active, .prev:active {
    top: 104px;
    box-shadow: 0 1px 0 #999;
}
.next {
    right: 5em;
}
.prev {
    left: 5em;
}