* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* GENERAL */
    --background_principal: #0f6caf;
    --background_principal_hover: #2daae1;

    /* COLORES CUANDO EL FONDO NO ES BLANCO */
    --background_principal_fondo_oscuro: #fff;
    --background_principal_fondo_oscuro_hover: #ddd;
}

html,
body {
    width: 100% !important;
    overflow-x: hidden !important;
}

.boton-persoalizado-1 {
    background-color: var(--background_principal);
    padding: 12px;
    color: #fff !important;
    border-radius: 4px;
    text-decoration: none;
}

.boton-persoalizado-1:hover {
    background-color: var(--background_principal_hover);
    transition: 0.8s;
    /* background-color: #f2aa24; */
}

.boton-persoalizado-2 {
    background-color: var(--background_principal_fondo_oscuro);
    padding: 12px;
    color: var(--background_principal) !important;
    border-radius: 4px;
    text-decoration: none;
}

.boton-persoalizado-2:hover {
    background-color: var(--background_principal_fondo_oscuro_hover);
    color: #000000 !important;
    transition: 0.2s;
    /* background-color: #f2aa24; */
}