library.css

/**
 * [Table of contents]
 *
 * [&. Content / #key]
 * [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 * Summary:
 *
 *  0. VARIABLE LESS
 *    - 0.1. Color
 *    - 0.2. Font
 *  1. MIXINS


/*=============================
 =====   VARIABLE LESS    =====
 =============================*/

/*----------  0.1. Color  ----------*/

/*----------  0.2. Font  ----------*/

/*=============================
 ====  END VARIABLE LESS   ====
 =============================*/

/*=============================
 =====       MIXINS       =====
 =============================*/

/*=============================
 ====      END MIXINS      ====
 =============================*/

/*=============================
 =====     KEY FRAMES      =====
 =============================*/

@-webkit-keyframes color-text {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 475px 0;
    }
}

@keyframes color-text {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 475px 0;
    }
}

@-webkit-keyframes sonarEffect {
    0% {
        opacity: .3;
    }
    40% {
        opacity: .5;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 10px 10px rgba(255, 221, 0, .8), 0 0 0 3px rgba(255, 221, 0, .5);
    }
    100% {
        -webkit-transform: scale(1.3);

        opacity: 0;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 10px 10px rgba(255, 221, 0, .8), 0 0 0 3px rgba(255, 221, 0, .5);
    }
}

@keyframes sonarEffect {
    0% {
        opacity: .3;
    }
    40% {
        opacity: .5;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 10px 10px rgba(255, 221, 0, .8), 0 0 0 3px rgba(255, 221, 0, .5);
    }
    100% {
        -webkit-transform: scale(1.3);
                transform: scale(1.3);

        opacity: 0;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 10px 10px rgba(255, 221, 0, .8), 0 0 0 3px rgba(255, 221, 0, .5);
    }
}

@-webkit-keyframes sonarEffect-2 {
    0% {
        opacity: .3;
    }
    40% {
        opacity: .5;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 5px 7px rgba(255, 221, 0, .7), 0 0 0 3px rgba(255, 221, 0, .5);
    }
    100% {
        -webkit-transform: scale(1.3);

        opacity: 0;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 5px 7px rgba(255, 221, 0, .7), 0 0 0 3px rgba(255, 221, 0, .5);
    }
}

@keyframes sonarEffect-2 {
    0% {
        opacity: .3;
    }
    40% {
        opacity: .5;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 5px 7px rgba(255, 221, 0, .7), 0 0 0 3px rgba(255, 221, 0, .5);
    }
    100% {
        -webkit-transform: scale(1.3);
                transform: scale(1.3);

        opacity: 0;
        box-shadow: 0 0 0 2px rgba(255, 221, 0, .1), 0 0 5px 7px rgba(255, 221, 0, .7), 0 0 0 3px rgba(255, 221, 0, .5);
    }
}

@keyframes cloud_left_to_right {
    0% {
        left: -200%;
    }
    100% {
        left: 0;
    }
}

@-webkit-keyframes cloud_left_to_right {
    0% {
        left: -200%;
    }
    100% {
        left: 0;
    }
}

@keyframes cloud_right_to_left {
    0% {
        left: 0;
    }
    100% {
        left: -200%;
    }
}

@-webkit-keyframes cloud_right_to_left {
    0% {
        left: 0;
    }
    100% {
        left: -200%;
    }
}

/*=============================
 =====   END KEY FRAMES   =====
 =============================*/