@charset "UTF-8";
/* CSS Document */

.DivInfoProductos {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0;
    transition: .3s all;
    -webkit-transition: .3s all;
    -moz-transition: .3s all;
    -o-transition: .3s all;
    -ms-transition: .3s all;
    background-color: rgba(29,29,34,0.80);
}

.DivInfoProductos2 {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 10px;
    opacity: 1;
    transition: .3s all;
    -webkit-transition: .3s all;
    -moz-transition: .3s all;
    -o-transition: .3s all;
    -ms-transition: .3s all;
    background-color: rgba(29,29,34,0.80);
}

.TituloProducto {
    font-size: 4vw;
    line-height: 100%;
    color: #ffffff;
    font-family: BrandonReg;
    display: inline-block;
    padding: 0 1% 0 1%;
}

.DescripcionProducto {
    font-size: 1.4vw;
    line-height: 130%;
    color: #ffffff;
    font-family: BrandonReg;
    width: 100%;
    padding: 0 10% 0 10%;
    display: inline-block;
    margin-top: 15px;
}

.ProductoHover:hover .DivInfoProductos {
    opacity: 1;
}

.ProductoHover:active .DivInfoProductos {
    opacity: 1;
}

/*.ProductoHover:active .DivInfoProductos {
    opacity: 1;
}*/

.PlecaDescripcionProducto {
    width: 60px;
    height: 2px;
    background-color: #ffffff;
    display: inline-block;
}

.DivPxHide {
    width: 1px;
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}

.divBgTextoMiddle {
    display: inline-block;
    vertical-align: middle;
    width: 98%;
    margin-left: -20px;
}


@media screen and (min-width: 641px) and (max-width: 1024px) {

    .DescripcionProducto {
        font-size: 1.5vw;
        padding: 0 5% 0 5%;
    }

    .divBgTextoMiddle {
        margin-left: -10px;
    }

    .DivInfoProductos {
        opacity: 1;
    }
}

@media screen and (min-width: 641px) and (max-width: 920px) {

    .DescripcionProducto {
        font-size: 2.4vw;
        padding: 0 3% 0 3%;
    }

    .divBgTextoMiddle {
        margin-left: 0px;
    }

    .TituloProducto {
        font-size: 4.7vw;
    }
}

@media screen and (min-width: 0px) and (max-width: 640px) {
    .DescripcionProducto {
        font-size: 4.8vw;
        padding: 0 3% 0 3%;
    }

    .divBgTextoMiddle {
        margin-left: 0px;
    }

    .TituloProducto {
        font-size: 9.9vw;
    }

  /*  no hay ajustes para esta clase*/
/*    .DivInfoProductos {
    }*/
}