table.tablaBiit td.listadoactions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}


/*@BOTONES*/
@media only screen and (min-width: 1200px) {
    button.inputHelper span.icono {
        display: none;
    }
}

@media only screen and (max-width: 1200px) {
    table.tablaBiit td.listadoactions span {
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: 45px;
    }

    table.tablaBiit td.listadoactions span [class*='boton'] {
        height: 100%;
        width: 100%;
    }
}

[class*='boton']:active {
    transform: scale(0.95);
}

[class*='boton']:hover {
    text-decoration: none;
}

[class*='boton'] {
    padding: 10px 20px;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    border: 0;
    display: inline-block;
    font: 500 13px var(--font-family);
    transition: all 0.2s;
}

[class*='boton-mediano'] {
    padding: 5px 15px;
}

[class*='boton-pequeno'] {
    padding: 5px 10px;
}

/*@@DEFAULT*/
/*@WHITE => BLANCO*/
.boton-white {
    background-color: var(--color-corporativo-blanco-oscuro);
    color: black;
    border: 1px solid transparent;
}

.boton-white:hover {
    background-color: var(--color-corporativo-blanco-claro);
    color: black;
    border: 1px solid transparent;
}

.boton-white:active {
    background-color: var(--color-corporativo-blanco);
    color: black;
    border: 1px solid transparent;
}

.boton-white:disabled {
    background-color: var(--color-corporativo-blanco-claro);
    color: black;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-blanco-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-blanco-oscuro);
}


/*@BLUE => AZUL*/
.boton-blue {
    background-color: var(--color-corporativo-azul-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-blue:hover {
    background-color: var(--color-corporativo-azul-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-blue:active {
    background-color: var(--color-corporativo-azul);
    color: white;
    border: 1px solid transparent;
}

.boton-blue:disabled {
    background-color: var(--color-corporativo-azul-claro);
    color: black;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-azul-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-azul-oscuro);
}

/*@GREEN => VERDE*/
.boton-green {
    background-color: var(--color-corporativo-verde-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-green:hover {
    background-color: var(--color-corporativo-verde-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-green:active {
    background-color: var(--color-corporativo-verde);
    color: white;
    border: 1px solid transparent;
}

.boton-green:disabled {
    background-color: var(--color-corporativo-verde-claro);
    color: black;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-verde-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-verde-oscuro);
}

/*@YELLOW => AMARILLO*/
.boton-yellow {
    background-color: var(--color-corporativo-amarillo-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-yellow:hover {
    background-color: var(--color-corporativo-amarillo-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-yellow:active {
    background-color: var(--color-corporativo-amarillo);
    color: white;
    border: 1px solid transparent;
}

.boton-yellow:disabled {
    background-color: var(--color-corporativo-amarillo-claro);
    color: black;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-amarillo-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-amarillo-oscuro);
}

/*@BLACK => NEGRO*/
.boton-black {
    background-color: var(--color-corporativo-negro-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-black:hover {
    background-color: var(--color-corporativo-negro-oscuro);
    opacity: 80%;
    color: white;
    border: 1px solid transparent;
}

.boton-black:active {
    background-color: var(--color-corporativo-negro-oscuro);
    opacity: 80%;
    color: white;
    border: 1px solid transparent;
}

.boton-black:disabled {
    background-color: var(--color-corporativo-negro-claro);
    color: white;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-negro-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-negro-oscuro);
}

/*@PURPLE => LILA*/
.boton-purple {
    background-color: var(--color-corporativo-lila-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-purple:hover {
    background-color: var(--color-corporativo-lila-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-purple:active {
    background-color: var(--color-corporativo-lila);
    color: white;
    border: 1px solid transparent;
}

.boton-purple:disabled {
    background-color: var(--color-corporativo-lila-claro);
    color: white;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-lila-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-lila-oscuro);
}

/*@RED => ROJO*/
.boton-red {
    background-color: var(--color-corporativo-rojo-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-red:hover {
    background-color: var(--color-corporativo-rojo-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-red:active {
    background-color: var(--color-corporativo-rojo);
    color: white;
    border: 1px solid transparent;
}

.boton-red:disabled {
    background-color: var(--color-corporativo-rojo-claro);
    color: white;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-rojo-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-rojo-oscuro);
}

/*@ORANGE => NARANJA*/
.boton-orange {
    background-color: var(--color-corporativo-naranja-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-orange:hover {
    background-color: var(--color-corporativo-naranja-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-orange:active {
    background-color: var(--color-corporativo-naranja);
    color: white;
    border: 1px solid transparent;
}

.boton-orange:disabled {
    background-color: var(--color-corporativo-naranja-claro);
    color: white;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-naranja-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-naranja-oscuro);
}

/*@BROWN => MARRON*/
.boton-brown {
    background-color: var(--color-corporativo-marron-oscuro);
    color: white;
    border: 1px solid transparent;
}

.boton-brown:hover {
    background-color: var(--color-corporativo-marron-claro);
    color: white;
    border: 1px solid transparent;
}

.boton-brown:active {
    background-color: var(--color-corporativo-marron);
    color: white;
    border: 1px solid transparent;
}

.boton-brown:disabled {
    background-color: var(--color-corporativo-marron-claro);
    color: white;
    cursor: not-allowed;
    border: 1px solid var(--color-corporativo-marron-oscuro);
    box-shadow: inset 0 0 0 2px var(--color-corporativo-marron-oscuro);
}

/*@HOTPINK*/
.boton-hotpink {
    background-color: hotpink;
    color: white;
}

.boton-hotpink:hover {
    background-color: deeppink;
    color: white;
}

.boton-hotpink:disabled {
    background-color: pink;
    color: black;
    cursor: not-allowed;
    border: 1px solid hotpink;
    box-shadow: inset 0 0 0 2px hotpink;
}