.btn-estilos-black {
    width: 174px;
    height: 30px;
    line-height: 30px;
    color: white;
    padding: 0 6px;
    font-size: 10.8px;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    background-color: #1c152d !important;
    border-radius: 4px;
    border: 1px solid #38d430;
}

.btn-estilos-black:hover {
    color: #38d430 !important;
    font-weight: bold !important;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4);
}

.btn-estilos-black .flecha {
    width: 10px !important;
    height: 10px !important;
    float: right !important;
    background-image: url(../images/greenRight.svg) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    margin-top: 9px;
}

.btn-estilos-black:hover {
    color: #38d430 !important;
    font-weight: bold !important;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4);
}

.btn-estilos-black:hover .flecha {
    background-image: url(../images/darkRight.svg) !important;
    /* cambiar color de svg a blanco */
    filter: invert(1);
}

.btn-estilos-black:active {
    color: white !important;
    font-weight: bold !important;
    background-color: #38d430 !important;
    border: 1px solid #1c152d !important;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4);
}

.btn-estilos-black:active .flecha {
    background-image: url(../images/darkRight.svg) !important;
    filter: unset;
}

.btn-estilos {
    width: 174px;
    height: 30px;
    line-height: 30px;
    color: #1c152d;
    padding: 0 6px;
    font-size: 10.8px;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    background-color: white;
    border-radius: 4px;
    border: 1px solid #38d430;
}

.btn-estilos:hover {
    font-weight: bold !important;
    border: 1px solid #38d430 !important;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4) !important;
}

.btn-estilos:active {
    color: white !important;
    font-weight: bold !important;
    background-color: #1c152d !important;
    border: 1px solid #38d430 !important;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4);
}

.btn-estilos .flecha {
    width: 10px !important;
    height: 10px !important;
    float: right !important;
    background-image: url(../images/darkRight.svg) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    margin-top: 9px;
}

.btn-estilos:hover {
    font-weight: bold;
    box-shadow: 0 0 10px rgba(28, 37, 45, 0.4);
}

.btn-estilos:hover .flecha {
    background-image: url(../images/greenRight.svg) !important;
}