@-webkit-keyframes awg_valid {
    from {
        background-color: orange;
    }

    to {
        background-color: inherit;
    }
}

@-moz-keyframes awg_valid {
    from {
        background-color: orange;
    }

    to {
        background-color: inherit;
    }
}

@-o-keyframes awg_valid {
    from {
        background-color: orange;
    }

    to {
        background-color: inherit;
    }
}

@keyframes awg_valid {
    from {
        background-color: orange;
    }

    to {
        background-color: inherit;
    }
}

.awg_valid {
    -webkit-animation: awg_valid 1s infinite;
    /* Safari 4+ */
    -moz-animation: awg_valid 1s infinite;
    /* Fx 5+ */
    -o-animation: awg_valid 1s infinite;
    /* Opera 12+ */
    animation: awg_valid 1s infinite;
    /* IE 10+ */
}

@-webkit-keyframes awg_invalid {
    from {
        background-color: red;
    }

    to {
        background-color: inherit;
    }
}

@-moz-keyframes awg_invalid {
    from {
        background-color: red;
    }

    to {
        background-color: inherit;
    }
}

@-o-keyframes awg_invalid {
    from {
        background-color: red;
    }

    to {
        background-color: inherit;
    }
}

@keyframes awg_invalid {
    from {
        background-color: red;
    }

    to {
        background-color: inherit;
    }
}

.awg_invalid {
    -webkit-animation: awg_invalid 1s infinite;
    /* Safari 4+ */
    -moz-animation: awg_invalid 1s infinite;
    /* Fx 5+ */
    -o-animation: awg_invalid 1s infinite;
    /* Opera 12+ */
    animation: awg_invalid 1s infinite;
    /* IE 10+ */
}

.awg_loading, .awg_loading:focus, .awg_loading:hover {
    position: relative;
    color: rgba(80, 51, 14, 0.15) !important;
    text-shadow: none;
    background-color: rgb(255 255 255 / 90%) !important;
    border-color: #e4e4e4;
    transition: color 1s, background-color 0.2s, border-color 1s, background-image 10s;
    cursor: progress;
}

.awg_loading:after {
    content: "";
    display: block;
    left: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    background-image: url("css/loading.gif?1");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 1;
    transition: opacity 4s;
    transition: background 5s linear;
    -webkit-animation: awg_load_fadein 4s;
    /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: awg_load_fadein 4s;
    /* Firefox < 16 */
    -ms-animation: awg_load_fadein 4s;
    /* Internet Explorer */
    -o-animation: awg_load_fadein 4s;
    /* Opera < 12.1 */
    animation: awg_load_fadein 4s;
}

.awg_loading.awg_loading_pink:after {
    background-image: url("css/loading_pink.gif");
}

.awg_loading.awg_loading_blue:after {
    background-image: url("css/loading_blue.gif");
}

@keyframes awg_load_fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes awg_load_fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes awg_load_fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-ms-keyframes awg_load_fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-o-keyframes awg_load_fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
