preloader style : demo 303

                        .loader{
                            width: 100px;
                            height: 100px;
                            margin: 50px auto 0;
                            border: 8px solid #bbb;
                            position: relative;
                            animation: rotate 1s infinite;
                        }
                        .loader:before{
                            content: '';
                            background: radial-gradient(#00F260, #0575E6 15px);
                            width: 35px;
                            height: 35px;
                            border-radius: 50%;
                            position: absolute;
                            left: 0;
                            bottom: 0;
                            animation: ball 1s infinite ease-in-out;
                        }
                        @keyframes rotate{
                            100%{ transform: rotate(90deg); }
                        }
                        @keyframes ball{
                            50%{ transform: translateX(49px); }
                            100%{ transform: translateX(49px); }
                        }