﻿.math-option-btn {
    appearance: none;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    font-size: 30px;
    color: black;
    cursor: pointer;
    border-style: none;
    outline: none;
    background-color: #f7f7f7;
    border-radius: 15px;
    padding: 15px;
}

.math-option-btn-right {
    color: white;
    background-color: #8BC34A;
}


.math-option-btn-error {
    background-color: #df574d !important;
    color: #fff !important;
    animation: shake 0.4s ease-in-out;
}

@keyframes shake {
    0% {
        transform: translateX(0);
    }

    15% {
        transform: translateX(-6px);
    }

    30% {
        transform: translateX(6px);
    }

    45% {
        transform: translateX(-5px);
    }

    60% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-3px);
    }

    90% {
        transform: translateX(3px);
    }

    100% {
        transform: translateX(0);
    }
}
