<style type="text/css">
.kub {
            width: 50px;
            height: 50px;
            background: black;
            position: absolute;
            -webkit-animation: kub 3s 99999 linear;
        }
  @-webkit-keyframes kub {
            0% {
                background: black;
            }

            25% {
                background: #D92424;

                transform: rotate(90deg);
            }

            50% {
                background: #8625CA;

                transform: rotate(180deg);
            }

            75% {
                background: #02B0A2;

                transform: rotate(270deg);
            }

            100% {
                background: #004069;
                margin-left: 850px;
                transform: rotate(360deg);
            }
        }

        .kyb {
            width: 50px;
            height: 50px;
            background: black;
            position: absolute;
            margin-left: 850px;
            -webkit-animation: kyb 3s 99999 linear;
        }

        @-webkit-keyframes kyb {
            0% {
                background: black;
            }

            25% {
                background: #D92424;
                transform: rotate(-90deg);
            }

            40% {
                background: #D92424;

            }

            50% {
                background: #8625CA;

                transform: rotate(-180deg);

            }

            60% {
                background: #D92424;

            }

            75% {
                background: #02B0A2;

                transform: rotate(-270deg);
            }

            100% {
                background: #004069;
                margin-left: 10px;
                transform: rotate(-360deg);
            }
        }

.dva {
  position: relative;
}
.dva:after {
  content: "";
  position: absolute; top: 0; left: -2em;
  width: 100%;
  height: 100%;
  background: linear-gradient(to left, rgba(255,255,255,.0), rgba(255,255,255,.8), rgba(255,255,255,.0)) no-repeat -2em 0%;
  background-size: 2em 100%;
  transform: skewX(-50deg);
}
.dva:hover:after {
  transition: 2s linear;
  background-position: 100% 0%;
}</style>

<div class="kub">
	&nbsp;
</div>

<div class="kyb">
	&nbsp;
</div>