Ajax Loader
HTML 
    <div class="wrapper">
1
    <div class="wrapper">
2
        <div class="drop"></div>
3
        <div class="light"></div>
4
        <div class="light2"></div>
5
        <div class="light3"></div>
6
    </div>
 
CSS 
body{
1
body{
2
    background-color: #75DAF1;
3
}
4
.wrapper{
5
    width: 250px;
6
    height: 300px;
7
    position: absolute;
8
    top: 50px;
9
    left: 100px;
10
}
11
.drop{
12
    width: 200px;
13
    height: 200px;
14
    position: relative;
15
    top: 70px;
16
    left: 25px;
17
    border-bottom-right-radius: 50%;
18
    border-bottom-left-radius: 50%;
19
    border-top-left-radius: 50%;
20
    box-shadow:  inset 0 0 10px rgba(64,145,148,0.5);
21
    border-left: 5px solid rgba(227,246,249,0.5) ;
22
    -ms-transform: rotate(-45deg);
23
    -webkit-transform: rotate(-45deg);
24
    transform: rotate(-45deg);
25
 
26
    background: -webkit-radial-gradient(top right,rgba(248, 255, 255,1), rgba(254, 213, 230,0.1)10%, rgba(188, 249, 249,1), rgba(59, 218, 188,0.8), rgba(59, 196, 218,0.9), rgba(227, 246, 249,1));
27
    background: -o-radial-gradient(rgba(248, 255, 255,1), rgba(254, 213, 230,0.1)10%, rgba(188, 249, 249,1), rgba(59, 218, 188,1), rgba(59, 196, 218,0.9), rgba(227, 246, 249,1));
28
    background: -moz-radial-gradient(rgba(248, 255, 255,1), rgba(254, 213, 230,0.1)10%, rgba(188, 249, 249,1), rgba(59, 218, 188,1), rgba(59, 196, 218,0.9), rgba(227, 246, 249,1));
29
    background: radial-gradient(at top right,rgba(248, 255, 255,1), rgba(254, 213, 230,0.1)10%, rgba(188, 249, 249,1), rgba(59, 218, 188,0.8), rgba(59, 196, 218,0.9), rgba(227, 246, 249,1));
30
}
31
.light{
32
    width: 40px;
33
    height: 30px;
34
    position: relative;
35
    top: 25px;
36
    left: 90px;
37
    background-color: rgba(127,222,237,1);
38
    border-radius: 50%;
39
    box-shadow: -1px -1px 10px rgb(127,222,237);
40
}
41
.light2{
42
    width: 20px;
43
    height: 20px;
44
    position: relative;
45
    top: -70px;
46
    left: 80px;
47
    border-radius: 50%;
48
    background-color: rgba(155, 242, 236,0.2);
49
}
50
.light3{
51
    width: 10px;
52
    height: 10px;
53
    position: relative;
54
    top: -2px;
55
    left: 105px;
56
    border-radius: 50%;
57
    background-color: rgba(250,250,250,0.4);
58
    box-shadow: -3px 10px 1px rgba(59,218, 188,0.4) ;
59
}
 

Css RainDrop

CSSDeck G+