preloader style : demo 216

                        .preloader{
                            width: 100px;
                            height: 100px;
                            margin: 30px auto 0;
                        }
                        .main-circle{
                            width: 50px;
                            height: 50px;
                            border-top: 50px solid #3429ad;
                            border-bottom: 50px solid #3429ad;
                            border-left: 50px solid #C4E538;
                            border-right: 50px solid #C4E538;
                            border-radius: 50%;
                            box-shadow: 0 0 0 3px #fff,0 0 10px #000;
                            animation: spin 6s linear infinite;
                        }
                        @keyframes spin{
                           0%{ transform: rotate(-360deg) scale(0); }
                           20%{ transform: rotate(360deg) scale(1); }
                           40%{ transform: rotate(-360deg) scale(0); }
                           60%{ transform: rotate(360deg) scale(1); }
                           100%{ transform: rotate(-360deg)scale(0); }
                        }