2 * -------------------------- */
4 /* Stacked and layered icon */
7 /* Animated rotating icon */
10 -moz-animation: spin 2s infinite linear;
11 -o-animation: spin 2s infinite linear;
12 -webkit-animation: spin 2s infinite linear;
13 animation: spin 2s infinite linear;
16 /* Prevent stack and spinners from being taken inline when inside a link */
19 display: inline-block;
20 text-decoration: none;
23 @-moz-keyframes spin {
24 0% { -moz-transform: rotate(0deg); }
25 100% { -moz-transform: rotate(359deg); }
27 @-webkit-keyframes spin {
28 0% { -webkit-transform: rotate(0deg); }
29 100% { -webkit-transform: rotate(359deg); }
32 0% { -o-transform: rotate(0deg); }
33 100% { -o-transform: rotate(359deg); }
36 0% { -ms-transform: rotate(0deg); }
37 100% { -ms-transform: rotate(359deg); }
40 0% { transform: rotate(0deg); }
41 100% { transform: rotate(359deg); }
44 /* Icon rotations and mirroring */
45 .icon-rotate-90:before {
46 -webkit-transform: rotate(90deg);
47 -moz-transform: rotate(90deg);
48 -ms-transform: rotate(90deg);
49 -o-transform: rotate(90deg);
50 transform: rotate(90deg);
51 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
54 .icon-rotate-180:before {
55 -webkit-transform: rotate(180deg);
56 -moz-transform: rotate(180deg);
57 -ms-transform: rotate(180deg);
58 -o-transform: rotate(180deg);
59 transform: rotate(180deg);
60 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
63 .icon-rotate-270:before {
64 -webkit-transform: rotate(270deg);
65 -moz-transform: rotate(270deg);
66 -ms-transform: rotate(270deg);
67 -o-transform: rotate(270deg);
68 transform: rotate(270deg);
69 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
72 .icon-flip-horizontal:before {
73 -webkit-transform: scale(-1, 1);
74 -moz-transform: scale(-1, 1);
75 -ms-transform: scale(-1, 1);
76 -o-transform: scale(-1, 1);
77 transform: scale(-1, 1);
80 .icon-flip-vertical:before {
81 -webkit-transform: scale(1, -1);
82 -moz-transform: scale(1, -1);
83 -ms-transform: scale(1, -1);
84 -o-transform: scale(1, -1);
85 transform: scale(1, -1);
88 /* ensure rotation occurs inside anchor tags */
90 .icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical {
91 &:before { display: inline-block; }