preloader style : demo 219

HTML

                        

CSS

                        .preloader{
                            position: relative;
                            height: 75px;
                            width: 75px;
                            margin: 50px auto 0;
                        }
                        .spinner{
                            width: 75px;
                            height: 75px;
                            margin: 0;
                            border-top: 10px solid #ff3f34;
                            box-shadow: 4px 4px 5px #d2d2d2 inset;
                            border-right: 10px solid transparent;
                            border-radius: 50%;
                            animation: 1.5s spin linear infinite;
                        }
                        .spinner-2{
                            width: 75px;
                            height: 75px;
                            margin: 0;
                            border-top: 10px solid #0fbcf9;
                            border-left: 10px solid transparent;
                            border-radius: 50%;
                            position: absolute;
                            top: 0;
                            animation: 1.5s spin-2 linear infinite;
                        }
                        @keyframes spin{
                            from{ transform: rotate(0deg); }
                            to{ transform: rotate(360deg); }
                        }
                        @keyframes spin-2{
                            from{ transform: rotate(360deg); }
                            to{ transform: rotate(0deg); }
                        }
                    
License Terms