preloader style : demo 153

                        .loader{
                            width: 200px;
                            height: 200px;
                            margin: 30px auto;
                            position: relative;
                        }
                        .loader .loader-inner{
                            width: 15px;
                            height: 15px;
                            border-radius: 50%;
                            margin: auto;
                            position: absolute;
                            top: 0;
                            left: 0;
                            bottom: 0;
                            right: 0;
                        }
                        .loader .box-1{
                            background: #0077bb;
                            z-index: 10;
                            transform: rotate(0deg) translateX(80px);
                            animation: loading-1 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-2{
                            background: #a3f7b5;
                            z-index: 8;
                            transform: rotate(-90deg) translateX(80px);
                            animation: loading-2 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-3{
                            background: #bd632f;
                            z-index: 6;
                            transform: rotate(180deg) translateX(80px);
                            animation: loading-3 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-4{
                            background: #006C34;
                            z-index: 4;
                            transform: rotate(90deg) translateX(80px);
                            animation: loading-4 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-5{
                            background: #f1c40f;
                            z-index: 5;
                            transform: rotate(135deg) translateX(80px);
                            animation: loading-5 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-6{
                            background: #000;
                            z-index: 7;
                            transform: rotate(225deg) translateX(80px);
                            animation: loading-6 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-7{
                            background: #d90368;
                            z-index: 9;
                            transform: rotate(315deg) translateX(80px);
                            animation: loading-7 2.5s ease-in-out infinite alternate;
                        }
                        .loader .box-8{
                            background: #f75c03;
                            z-index: 3;
                            transform: rotate(405deg) translateX(80px);
                            animation: loading-8 2.5s ease-in-out infinite alternate;
                        }
                        @keyframes loading-1{
                            0%{
                                transform: rotate(0deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(360deg) translateX(0px) scale(1.2,1.2);
                            }
                        }
                        @keyframes loading-2{
                            0%{
                                transform: rotate(-90deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(270deg) translateX(0px) scale(1.6,1.6);
                            }
                        }
                        @keyframes loading-3{
                            0%{
                                transform: rotate(180deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(540deg) translateX(0px) scale(2,2);
                            }
                        }
                        @keyframes loading-4{
                            0%{
                                transform: rotate(90deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(450deg) translateX(0px) scale(2.4,2.4);
                            }
                        }
                        @keyframes loading-5{
                            0%{
                                transform: rotate(135deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(495deg) translateX(0px) scale(2.2,2.2);
                            }
                        }
                        @keyframes loading-6{
                            0%{
                                transform: rotate(225deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(585deg) translateX(0px) scale(1.8,1.8);
                            }
                        }
                        @keyframes loading-7{
                            0%{
                                transform: rotate(315deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(675deg) translateX(0px) scale(1.4,1.4);
                            }
                        }
                        @keyframes loading-8{
                            0%{
                                transform: rotate(405deg) translateX(80px) scale(1,1);
                            }
                            100%{
                                transform: rotate(765deg) translateX(0px) scale(2.6,2.6);
                            }
                        }