@keyframes fadeIn {
    from {
        opacity: 0;
        /* transform: translateY(20px); */
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes hoverIn {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.1);
    }

}

@keyframes hoverOut {
    from {
        transform: scale(1.1);
    }
    to {
        transform: scale(1);
    }

}

:root {
    --color-light-blue: #00b7e0;
    --color-dark-blue: #137fb6;
    --color-title-blue: #111827;
    --color-gray: #6b7280;
    --color-full-white: #f6f6f6;

    --background-color: white;
    --background-color-alternate: #f6f6f6;

    --color-dark-white: black;

    --color-confirm-ok: #5cb85c;
    --color-confirm-pending: #ffaa00;
    --color-confirm-fail: #d9534f;
}

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


body {
    font-family: Arial Rounded MT Bold, Helvetica Rounded, Arial, sans-serif;
    line-height: 1.6;
    background-color: var(--background-color);
}

svg {
    display: block;
}

.highlight {
    color: var(--color-light-blue);
}

.highlight-secondary {
    color: var(--color-full-white);
}