/**
* ========================================
* @name    Input Dimmer CSS
* @creator Badescu Theodor<theo@btheo.com>
* @version 1.0
* @license http://www.apache.org/licenses/LICENSE-2.0
* ========================================
*/

/**
* ===================
*     Dimmer CSS
* ===================
*/
body.id-on:before, body.id-off:before {
        width: 100%;
    height: 100%;
    position: fixed;
    content: "";
    top: 0;
}

body.id-on:before {
    /* highest Safari 3 accepted z-index - 2 */
    z-index: 11;
    animation: id-on-a .3s ease-in forwards;
}

body.id-off:before {
    z-index: -1;
    animation: id-off-a .3s ease-out forwards;
}

/*
* ===================
*   Dimmed Element
* ===================
*/
.id-dimmed {
    /* highest Safari 3 accepted z-index - 1 */
    z-index: 16777270;
}

.id-r {
    position: relative;
}

/**
* ===================
*     Animations
* ===================
*/
@keyframes id-off-a {
    0% {
        background: rgba(0, 0, 0, 0.77);
    }

    100% {
        background: rgba(0, 0, 0, 0);
    }
}

@keyframes id-on-a {
    0% {
        background: rgba(0, 0, 0, 0);
    }

    100% {
        background: rgba(0, 0, 0, 0.77);
    }
}