style.css 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. .mint-spinner-snake {
  2. -webkit-animation: mint-spinner-rotate 0.8s infinite linear;
  3. animation: mint-spinner-rotate 0.8s infinite linear;
  4. border: 4px solid transparent;
  5. border-radius: 50%;
  6. }
  7. @-webkit-keyframes mint-spinner-rotate {
  8. 0% {
  9. -webkit-transform: rotate(0deg);
  10. transform: rotate(0deg);
  11. }
  12. 100% {
  13. -webkit-transform: rotate(360deg);
  14. transform: rotate(360deg);
  15. }
  16. }
  17. @keyframes mint-spinner-rotate {
  18. 0% {
  19. -webkit-transform: rotate(0deg);
  20. transform: rotate(0deg);
  21. }
  22. 100% {
  23. -webkit-transform: rotate(360deg);
  24. transform: rotate(360deg);
  25. }
  26. }
  27. .mint-spinner-double-bounce {
  28. position: relative;
  29. }
  30. .mint-spinner-double-bounce-bounce1, .mint-spinner-double-bounce-bounce2 {
  31. width: 100%;
  32. height: 100%;
  33. border-radius: 50%;
  34. opacity: 0.6;
  35. position: absolute;
  36. top: 0;
  37. left: 0;
  38. -webkit-animation: mint-spinner-double-bounce 2.0s infinite ease-in-out;
  39. animation: mint-spinner-double-bounce 2.0s infinite ease-in-out;
  40. }
  41. .mint-spinner-double-bounce-bounce2 {
  42. -webkit-animation-delay: -1.0s;
  43. animation-delay: -1.0s;
  44. }
  45. @-webkit-keyframes mint-spinner-double-bounce {
  46. 0%, 100% {
  47. -webkit-transform: scale(0.0);
  48. transform: scale(0.0);
  49. }
  50. 50% {
  51. -webkit-transform: scale(1.0);
  52. transform: scale(1.0);
  53. }
  54. }
  55. @keyframes mint-spinner-double-bounce {
  56. 0%, 100% {
  57. -webkit-transform: scale(0.0);
  58. transform: scale(0.0);
  59. }
  60. 50% {
  61. -webkit-transform: scale(1.0);
  62. transform: scale(1.0);
  63. }
  64. }
  65. .mint-spinner-triple-bounce {}
  66. .mint-spinner-triple-bounce-bounce1, .mint-spinner-triple-bounce-bounce2, .mint-spinner-triple-bounce-bounce3 {
  67. border-radius: 100%;
  68. display: inline-block;
  69. -webkit-animation: mint-spinner-triple-bounce 1.4s infinite ease-in-out both;
  70. animation: mint-spinner-triple-bounce 1.4s infinite ease-in-out both;
  71. }
  72. .mint-spinner-triple-bounce-bounce1 {
  73. -webkit-animation-delay: -0.32s;
  74. animation-delay: -0.32s;
  75. }
  76. .mint-spinner-triple-bounce-bounce2 {
  77. -webkit-animation-delay: -0.16s;
  78. animation-delay: -0.16s;
  79. }
  80. @-webkit-keyframes mint-spinner-triple-bounce {
  81. 0%, 80%, 100% {
  82. -webkit-transform: scale(0);
  83. transform: scale(0);
  84. }
  85. 40% {
  86. -webkit-transform: scale(1.0);
  87. transform: scale(1.0);
  88. }
  89. }
  90. @keyframes mint-spinner-triple-bounce {
  91. 0%, 80%, 100% {
  92. -webkit-transform: scale(0);
  93. transform: scale(0);
  94. }
  95. 40% {
  96. -webkit-transform: scale(1.0);
  97. transform: scale(1.0);
  98. }
  99. }
  100. .mint-spinner-fading-circle {
  101. position: relative
  102. }
  103. .mint-spinner-fading-circle-circle {
  104. width: 100%;
  105. height: 100%;
  106. top: 0;
  107. left: 0;
  108. position: absolute
  109. }
  110. .mint-spinner-fading-circle-circle::before {
  111. content: " ";
  112. display: block;
  113. margin: 0 auto;
  114. width: 15%;
  115. height: 15%;
  116. border-radius: 100%;
  117. -webkit-animation: mint-fading-circle 1.2s infinite ease-in-out both;
  118. animation: mint-fading-circle 1.2s infinite ease-in-out both
  119. }
  120. .mint-spinner-fading-circle-circle.is-circle2 {
  121. -webkit-transform: rotate(30deg);
  122. transform: rotate(30deg)
  123. }
  124. .mint-spinner-fading-circle-circle.is-circle2::before {
  125. -webkit-animation-delay: -1.1s;
  126. animation-delay: -1.1s
  127. }
  128. .mint-spinner-fading-circle-circle.is-circle3 {
  129. -webkit-transform: rotate(60deg);
  130. transform: rotate(60deg)
  131. }
  132. .mint-spinner-fading-circle-circle.is-circle3::before {
  133. -webkit-animation-delay: -1s;
  134. animation-delay: -1s
  135. }
  136. .mint-spinner-fading-circle-circle.is-circle4 {
  137. -webkit-transform: rotate(90deg);
  138. transform: rotate(90deg)
  139. }
  140. .mint-spinner-fading-circle-circle.is-circle4::before {
  141. -webkit-animation-delay: -0.9s;
  142. animation-delay: -0.9s
  143. }
  144. .mint-spinner-fading-circle-circle.is-circle5 {
  145. -webkit-transform: rotate(120deg);
  146. transform: rotate(120deg)
  147. }
  148. .mint-spinner-fading-circle-circle.is-circle5::before {
  149. -webkit-animation-delay: -0.8s;
  150. animation-delay: -0.8s
  151. }
  152. .mint-spinner-fading-circle-circle.is-circle6 {
  153. -webkit-transform: rotate(150deg);
  154. transform: rotate(150deg)
  155. }
  156. .mint-spinner-fading-circle-circle.is-circle6::before {
  157. -webkit-animation-delay: -0.7s;
  158. animation-delay: -0.7s
  159. }
  160. .mint-spinner-fading-circle-circle.is-circle7 {
  161. -webkit-transform: rotate(180deg);
  162. transform: rotate(180deg)
  163. }
  164. .mint-spinner-fading-circle-circle.is-circle7::before {
  165. -webkit-animation-delay: -0.6s;
  166. animation-delay: -0.6s
  167. }
  168. .mint-spinner-fading-circle-circle.is-circle8 {
  169. -webkit-transform: rotate(210deg);
  170. transform: rotate(210deg)
  171. }
  172. .mint-spinner-fading-circle-circle.is-circle8::before {
  173. -webkit-animation-delay: -0.5s;
  174. animation-delay: -0.5s
  175. }
  176. .mint-spinner-fading-circle-circle.is-circle9 {
  177. -webkit-transform: rotate(240deg);
  178. transform: rotate(240deg)
  179. }
  180. .mint-spinner-fading-circle-circle.is-circle9::before {
  181. -webkit-animation-delay: -0.4s;
  182. animation-delay: -0.4s
  183. }
  184. .mint-spinner-fading-circle-circle.is-circle10 {
  185. -webkit-transform: rotate(270deg);
  186. transform: rotate(270deg)
  187. }
  188. .mint-spinner-fading-circle-circle.is-circle10::before {
  189. -webkit-animation-delay: -0.3s;
  190. animation-delay: -0.3s
  191. }
  192. .mint-spinner-fading-circle-circle.is-circle11 {
  193. -webkit-transform: rotate(300deg);
  194. transform: rotate(300deg)
  195. }
  196. .mint-spinner-fading-circle-circle.is-circle11::before {
  197. -webkit-animation-delay: -0.2s;
  198. animation-delay: -0.2s
  199. }
  200. .mint-spinner-fading-circle-circle.is-circle12 {
  201. -webkit-transform: rotate(330deg);
  202. transform: rotate(330deg)
  203. }
  204. .mint-spinner-fading-circle-circle.is-circle12::before {
  205. -webkit-animation-delay: -0.1s;
  206. animation-delay: -0.1s
  207. }
  208. @-webkit-keyframes mint-fading-circle {
  209. 0%, 39%, 100% {
  210. opacity: 0
  211. }
  212. 40% {
  213. opacity: 1
  214. }
  215. }
  216. @keyframes mint-fading-circle {
  217. 0%, 39%, 100% {
  218. opacity: 0
  219. }
  220. 40% {
  221. opacity: 1
  222. }
  223. }