/*======================================================== DARK LAYOUT =========================================================*/ @-webkit-keyframes ball-beat { 50% { -webkit-transform: scale(.75); transform: scale(.75); opacity: .2; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @-moz-keyframes ball-beat { 50% { -moz-transform: scale(.75); transform: scale(.75); opacity: .2; } 100% { -moz-transform: scale(1); transform: scale(1); opacity: 1; } } @-o-keyframes ball-beat { 50% { -o-transform: scale(.75); transform: scale(.75); opacity: .2; } 100% { -o-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes ball-beat { 50% { -webkit-transform: scale(.75); -moz-transform: scale(.75); -o-transform: scale(.75); transform: scale(.75); opacity: .2; } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } } .ball-beat > div { display: inline-block; width: 15px; height: 15px; margin: 2px; -webkit-animation: ball-beat .7s 0s infinite linear; -moz-animation: ball-beat .7s 0s infinite linear; -o-animation: ball-beat .7s 0s infinite linear; animation: ball-beat .7s 0s infinite linear; border-radius: 100%; background-color: #b8c2cc; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .ball-beat > div:nth-child(2n-1) { -webkit-animation-delay: -.35s !important; -moz-animation-delay: -.35s !important; -o-animation-delay: -.35s !important; animation-delay: -.35s !important; }