/*======================================================== DARK LAYOUT =========================================================*/ @-webkit-keyframes ball-grid-pulse { 0% { transform: scale(1); } 50% { transform: scale(0.5); opacity: 0.7; } 100% { transform: scale(1); opacity: 1; } } @keyframes ball-grid-pulse { 0% { transform: scale(1); } 50% { transform: scale(0.5); opacity: 0.7; } 100% { transform: scale(1); opacity: 1; } } .ball-grid-pulse { width: 57px; } .ball-grid-pulse > div:nth-child(1) { -webkit-animation-delay: 0.05s; animation-delay: 0.05s; -webkit-animation-duration: 0.66s; animation-duration: 0.66s; } .ball-grid-pulse > div:nth-child(2) { -webkit-animation-delay: 0.09s; animation-delay: 0.09s; -webkit-animation-duration: 0.94s; animation-duration: 0.94s; } .ball-grid-pulse > div:nth-child(3) { -webkit-animation-delay: 0.66s; animation-delay: 0.66s; -webkit-animation-duration: 0.74s; animation-duration: 0.74s; } .ball-grid-pulse > div:nth-child(4) { -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-duration: 0.88s; animation-duration: 0.88s; } .ball-grid-pulse > div:nth-child(5) { -webkit-animation-delay: 0.49s; animation-delay: 0.49s; -webkit-animation-duration: 1.46s; animation-duration: 1.46s; } .ball-grid-pulse > div:nth-child(6) { -webkit-animation-delay: 0.01s; animation-delay: 0.01s; -webkit-animation-duration: 0.61s; animation-duration: 0.61s; } .ball-grid-pulse > div:nth-child(7) { -webkit-animation-delay: 0.7s; animation-delay: 0.7s; -webkit-animation-duration: 0.82s; animation-duration: 0.82s; } .ball-grid-pulse > div:nth-child(8) { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-duration: 0.96s; animation-duration: 0.96s; } .ball-grid-pulse > div:nth-child(9) { -webkit-animation-delay: 0.35s; animation-delay: 0.35s; -webkit-animation-duration: 0.81s; animation-duration: 0.81s; } .ball-grid-pulse > div { background-color: #b8c2cc; width: 15px; height: 15px; border-radius: 100%; margin: 2px; -webkit-animation-fill-mode: both; animation-fill-mode: both; display: inline-block; float: left; -webkit-animation-name: ball-grid-pulse; animation-name: ball-grid-pulse; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-delay: 0; animation-delay: 0; }