<!-- - CSS3 Preloaders - https://danielpietrasik.pl/css3-preloaders/ --> <div class="preloader"></div>
/** * CSS3 Preloaders * https://danielpietrasik.pl/css3-preloaders/ **/ .preloader:before, .preloader:after { position: absolute; content: ''; } .preloader:before { width: 52px; height: 102px; background: #FFF; border-radius: 50% 0 0 50%; top: -1px; left: -1px; transform-origin: 52px 51px; animation: animation 1.6s infinite ease 1.2s; } .preloader { margin: 40px auto; width: 100px; height: 100px; border-radius: 50%; box-shadow: inset 0 0 0 13px #F34A53; transform: translateZ(0); } .preloader:after { width: 52px; height: 102px; background: #FFF; border-radius: 0 50% 50% 0; top: -1px; left: 51px; transform-origin: 0px 51px; animation: animation 1.6s infinite ease; } @keyframes animation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }