1@-webkit-keyframes honeycomb {
2  0%,
3  20%,
4  80%,
5  100% {
6    opacity: 0;
7    -webkit-transform: scale(0);
8    transform: scale(0);
9  }
10
11  30%,
12  70% {
13    opacity: 1;
14    -webkit-transform: scale(1);
15    transform: scale(1);
16  }
17}
18
19@keyframes honeycomb {
20  0%,
21  20%,
22  80%,
23  100% {
24    opacity: 0;
25    -webkit-transform: scale(0);
26    transform: scale(0);
27  }
28
29  30%,
30  70% {
31    opacity: 1;
32    -webkit-transform: scale(1);
33    transform: scale(1);
34  }
35}
36
37.honeycomb {
38  height: 24px;
39  position: relative;
40  width: 24px;
41}
42
43.honeycomb div {
44  -webkit-animation: honeycomb 2.1s infinite backwards;
45  animation: honeycomb 2.1s infinite backwards;
46  background: #f3f3f3;
47  height: 12px;
48  margin-top: 6px;
49  position: absolute;
50  width: 24px;
51}
52
53.honeycomb div:after, .honeycomb div:before {
54  content: '';
55  border-left: 12px solid transparent;
56  border-right: 12px solid transparent;
57  position: absolute;
58  left: 0;
59  right: 0;
60}
61
62.honeycomb div:after {
63  top: -6px;
64  border-bottom: 6px solid #f3f3f3;
65}
66
67.honeycomb div:before {
68  bottom: -6px;
69  border-top: 6px solid #f3f3f3;
70}
71
72.honeycomb div:nth-child(1) {
73  -webkit-animation-delay: 0s;
74  animation-delay: 0s;
75  left: -28px;
76  top: 0;
77}
78
79.honeycomb div:nth-child(2) {
80  -webkit-animation-delay: 0.1s;
81  animation-delay: 0.1s;
82  left: -14px;
83  top: 22px;
84}
85
86.honeycomb div:nth-child(3) {
87  -webkit-animation-delay: 0.2s;
88  animation-delay: 0.2s;
89  left: 14px;
90  top: 22px;
91}
92
93.honeycomb div:nth-child(4) {
94  -webkit-animation-delay: 0.3s;
95  animation-delay: 0.3s;
96  left: 28px;
97  top: 0;
98}
99
100.honeycomb div:nth-child(5) {
101  -webkit-animation-delay: 0.4s;
102  animation-delay: 0.4s;
103  left: 14px;
104  top: -22px;
105}
106
107.honeycomb div:nth-child(6) {
108  -webkit-animation-delay: 0.5s;
109  animation-delay: 0.5s;
110  left: -14px;
111  top: -22px;
112}
113
114.honeycomb div:nth-child(7) {
115  -webkit-animation-delay: 0.6s;
116  animation-delay: 0.6s;
117  left: 0;
118  top: 0;
119}