swiper.min.css 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490
  1. /**
  2. * Swiper 3.4.2
  3. * Most modern mobile touch slider and framework with hardware accelerated transitions
  4. *
  5. * http://www.idangero.us/swiper/
  6. *
  7. * Copyright 2017, Vladimir Kharlampidi
  8. * The iDangero.us
  9. * http://www.idangero.us/
  10. *
  11. * Licensed under MIT
  12. *
  13. * Released on: March 10, 2017
  14. */
  15. .swiper-container {
  16. margin-left: auto;
  17. margin-right: auto;
  18. position: relative;
  19. overflow: hidden;
  20. z-index: 1
  21. }
  22. .swiper-container-no-flexbox .swiper-slide {
  23. float: left
  24. }
  25. .swiper-container-vertical>.swiper-wrapper {
  26. -webkit-box-orient: vertical;
  27. -moz-box-orient: vertical;
  28. -ms-flex-direction: column;
  29. -webkit-flex-direction: column;
  30. flex-direction: column
  31. }
  32. .swiper-wrapper {
  33. position: relative;
  34. width: 100%;
  35. height: 100%;
  36. z-index: 1;
  37. display: -webkit-box;
  38. display: -moz-box;
  39. display: -ms-flexbox;
  40. display: -webkit-flex;
  41. display: flex;
  42. -webkit-transition-property: -webkit-transform;
  43. -moz-transition-property: -moz-transform;
  44. -o-transition-property: -o-transform;
  45. -ms-transition-property: -ms-transform;
  46. transition-property: transform;
  47. -webkit-box-sizing: content-box;
  48. -moz-box-sizing: content-box;
  49. box-sizing: content-box
  50. }
  51. .swiper-container-android .swiper-slide, .swiper-wrapper {
  52. -webkit-transform: translate3d(0, 0, 0);
  53. -moz-transform: translate3d(0, 0, 0);
  54. -o-transform: translate(0, 0);
  55. -ms-transform: translate3d(0, 0, 0);
  56. transform: translate3d(0, 0, 0)
  57. }
  58. .swiper-container-multirow>.swiper-wrapper {
  59. -webkit-box-lines: multiple;
  60. -moz-box-lines: multiple;
  61. -ms-flex-wrap: wrap;
  62. -webkit-flex-wrap: wrap;
  63. flex-wrap: wrap
  64. }
  65. .swiper-container-free-mode>.swiper-wrapper {
  66. -webkit-transition-timing-function: ease-out;
  67. -moz-transition-timing-function: ease-out;
  68. -ms-transition-timing-function: ease-out;
  69. -o-transition-timing-function: ease-out;
  70. transition-timing-function: ease-out;
  71. margin: 0 auto
  72. }
  73. .swiper-slide {
  74. -webkit-flex-shrink: 0;
  75. -ms-flex: 0 0 auto;
  76. flex-shrink: 0;
  77. width: 100%;
  78. height: 100%;
  79. position: relative
  80. }
  81. .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
  82. height: auto
  83. }
  84. .swiper-container-autoheight .swiper-wrapper {
  85. -webkit-box-align: start;
  86. -ms-flex-align: start;
  87. -webkit-align-items: flex-start;
  88. align-items: flex-start;
  89. -webkit-transition-property: -webkit-transform, height;
  90. -moz-transition-property: -moz-transform;
  91. -o-transition-property: -o-transform;
  92. -ms-transition-property: -ms-transform;
  93. transition-property: transform, height
  94. }
  95. .swiper-container .swiper-notification {
  96. position: absolute;
  97. left: 0;
  98. top: 0;
  99. pointer-events: none;
  100. opacity: 0;
  101. z-index: -1000
  102. }
  103. .swiper-wp8-horizontal {
  104. -ms-touch-action: pan-y;
  105. touch-action: pan-y
  106. }
  107. .swiper-wp8-vertical {
  108. -ms-touch-action: pan-x;
  109. touch-action: pan-x
  110. }
  111. .swiper-button-next, .swiper-button-prev {
  112. position: absolute;
  113. top: 50%;
  114. width: 27px;
  115. height: 44px;
  116. margin-top: -22px;
  117. z-index: 10;
  118. cursor: pointer;
  119. -moz-background-size: 27px 44px;
  120. -webkit-background-size: 27px 44px;
  121. background-size: 27px 44px;
  122. background-position: center;
  123. background-repeat: no-repeat
  124. }
  125. .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
  126. opacity: .35;
  127. cursor: auto;
  128. pointer-events: none
  129. }
  130. .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
  131. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  132. left: 10px;
  133. right: auto
  134. }
  135. .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
  136. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
  137. }
  138. .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
  139. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
  140. }
  141. .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
  142. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  143. right: 10px;
  144. left: auto
  145. }
  146. .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black {
  147. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
  148. }
  149. .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
  150. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
  151. }
  152. .swiper-pagination {
  153. position: absolute;
  154. text-align: center;
  155. -webkit-transition: .3s;
  156. -moz-transition: .3s;
  157. -o-transition: .3s;
  158. transition: .3s;
  159. -webkit-transform: translate3d(0, 0, 0);
  160. -ms-transform: translate3d(0, 0, 0);
  161. -o-transform: translate3d(0, 0, 0);
  162. transform: translate3d(0, 0, 0);
  163. z-index: 10
  164. }
  165. .swiper-pagination.swiper-pagination-hidden {
  166. opacity: 0
  167. }
  168. .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
  169. bottom: 10px;
  170. left: 0;
  171. width: 100%
  172. }
  173. .swiper-pagination-bullet {
  174. width: 8px;
  175. height: 8px;
  176. display: inline-block;
  177. border-radius: 100%;
  178. background: #000;
  179. opacity: .5
  180. }
  181. button.swiper-pagination-bullet {
  182. border: none;
  183. margin: 0;
  184. padding: 0;
  185. box-shadow: none;
  186. -moz-appearance: none;
  187. -ms-appearance: none;
  188. -webkit-appearance: none;
  189. appearance: none
  190. }
  191. .swiper-pagination-clickable .swiper-pagination-bullet {
  192. cursor: pointer
  193. }
  194. .swiper-pagination-white .swiper-pagination-bullet {
  195. background: #fff
  196. }
  197. .swiper-pagination-bullet-active {
  198. opacity: 1;
  199. background: #007aff
  200. }
  201. .swiper-pagination-white .swiper-pagination-bullet-active {
  202. background: #fff
  203. }
  204. .swiper-pagination-black .swiper-pagination-bullet-active {
  205. background: #000
  206. }
  207. .swiper-container-vertical>.swiper-pagination-bullets {
  208. right: 10px;
  209. top: 50%;
  210. -webkit-transform: translate3d(0, -50%, 0);
  211. -moz-transform: translate3d(0, -50%, 0);
  212. -o-transform: translate(0, -50%);
  213. -ms-transform: translate3d(0, -50%, 0);
  214. transform: translate3d(0, -50%, 0)
  215. }
  216. .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
  217. margin: 5px 0;
  218. display: block
  219. }
  220. .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
  221. margin: 0 5px
  222. }
  223. .swiper-pagination-progress {
  224. background: rgba(0,0,0,.25);
  225. position: absolute
  226. }
  227. .swiper-pagination-progress .swiper-pagination-progressbar {
  228. background: #007aff;
  229. position: absolute;
  230. left: 0;
  231. top: 0;
  232. width: 100%;
  233. height: 100%;
  234. -webkit-transform: scale(0);
  235. -ms-transform: scale(0);
  236. -o-transform: scale(0);
  237. transform: scale(0);
  238. -webkit-transform-origin: left top;
  239. -moz-transform-origin: left top;
  240. -ms-transform-origin: left top;
  241. -o-transform-origin: left top;
  242. transform-origin: left top
  243. }
  244. .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
  245. -webkit-transform-origin: right top;
  246. -moz-transform-origin: right top;
  247. -ms-transform-origin: right top;
  248. -o-transform-origin: right top;
  249. transform-origin: right top
  250. }
  251. .swiper-container-horizontal>.swiper-pagination-progress {
  252. width: 100%;
  253. height: 4px;
  254. left: 0;
  255. top: 0
  256. }
  257. .swiper-container-vertical>.swiper-pagination-progress {
  258. width: 4px;
  259. height: 100%;
  260. left: 0;
  261. top: 0
  262. }
  263. .swiper-pagination-progress.swiper-pagination-white {
  264. background: rgba(255,255,255,.5)
  265. }
  266. .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
  267. background: #fff
  268. }
  269. .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
  270. background: #000
  271. }
  272. .swiper-container-3d {
  273. -webkit-perspective: 1200px;
  274. -moz-perspective: 1200px;
  275. -o-perspective: 1200px;
  276. perspective: 1200px
  277. }
  278. .swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
  279. -webkit-transform-style: preserve-3d;
  280. -moz-transform-style: preserve-3d;
  281. -ms-transform-style: preserve-3d;
  282. transform-style: preserve-3d
  283. }
  284. .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
  285. position: absolute;
  286. left: 0;
  287. top: 0;
  288. width: 100%;
  289. height: 100%;
  290. pointer-events: none;
  291. z-index: 10
  292. }
  293. .swiper-container-3d .swiper-slide-shadow-left {
  294. background-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,.5)), to(rgba(0,0,0,0)));
  295. background-image: -webkit-linear-gradient(right, rgba(0,0,0,.5), rgba(0,0,0,0));
  296. background-image: -moz-linear-gradient(right, rgba(0,0,0,.5), rgba(0,0,0,0));
  297. background-image: -o-linear-gradient(right, rgba(0,0,0,.5), rgba(0,0,0,0));
  298. background-image: linear-gradient(to left, rgba(0,0,0,.5), rgba(0,0,0,0))
  299. }
  300. .swiper-container-3d .swiper-slide-shadow-right {
  301. background-image: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,.5)), to(rgba(0,0,0,0)));
  302. background-image: -webkit-linear-gradient(left, rgba(0,0,0,.5), rgba(0,0,0,0));
  303. background-image: -moz-linear-gradient(left, rgba(0,0,0,.5), rgba(0,0,0,0));
  304. background-image: -o-linear-gradient(left, rgba(0,0,0,.5), rgba(0,0,0,0));
  305. background-image: linear-gradient(to right, rgba(0,0,0,.5), rgba(0,0,0,0))
  306. }
  307. .swiper-container-3d .swiper-slide-shadow-top {
  308. background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.5)), to(rgba(0,0,0,0)));
  309. background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.5), rgba(0,0,0,0));
  310. background-image: -moz-linear-gradient(bottom, rgba(0,0,0,.5), rgba(0,0,0,0));
  311. background-image: -o-linear-gradient(bottom, rgba(0,0,0,.5), rgba(0,0,0,0));
  312. background-image: linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0))
  313. }
  314. .swiper-container-3d .swiper-slide-shadow-bottom {
  315. background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,.5)), to(rgba(0,0,0,0)));
  316. background-image: -webkit-linear-gradient(top, rgba(0,0,0,.5), rgba(0,0,0,0));
  317. background-image: -moz-linear-gradient(top, rgba(0,0,0,.5), rgba(0,0,0,0));
  318. background-image: -o-linear-gradient(top, rgba(0,0,0,.5), rgba(0,0,0,0));
  319. background-image: linear-gradient(to bottom, rgba(0,0,0,.5), rgba(0,0,0,0))
  320. }
  321. .swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper {
  322. -ms-perspective: 1200px
  323. }
  324. .swiper-container-cube, .swiper-container-flip {
  325. overflow: visible
  326. }
  327. .swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide {
  328. pointer-events: none;
  329. -webkit-backface-visibility: hidden;
  330. -moz-backface-visibility: hidden;
  331. -ms-backface-visibility: hidden;
  332. backface-visibility: hidden;
  333. z-index: 1
  334. }
  335. .swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide {
  336. pointer-events: none
  337. }
  338. .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
  339. pointer-events: auto
  340. }
  341. .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
  342. z-index: 0;
  343. -webkit-backface-visibility: hidden;
  344. -moz-backface-visibility: hidden;
  345. -ms-backface-visibility: hidden;
  346. backface-visibility: hidden
  347. }
  348. .swiper-container-cube .swiper-slide {
  349. visibility: hidden;
  350. -webkit-transform-origin: 0 0;
  351. -moz-transform-origin: 0 0;
  352. -ms-transform-origin: 0 0;
  353. transform-origin: 0 0;
  354. width: 100%;
  355. height: 100%
  356. }
  357. .swiper-container-cube.swiper-container-rtl .swiper-slide {
  358. -webkit-transform-origin: 100% 0;
  359. -moz-transform-origin: 100% 0;
  360. -ms-transform-origin: 100% 0;
  361. transform-origin: 100% 0
  362. }
  363. .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev {
  364. pointer-events: auto;
  365. visibility: visible
  366. }
  367. .swiper-container-cube .swiper-cube-shadow {
  368. position: absolute;
  369. left: 0;
  370. bottom: 0;
  371. width: 100%;
  372. height: 100%;
  373. background: #000;
  374. opacity: .6;
  375. -webkit-filter: blur(50px);
  376. filter: blur(50px);
  377. z-index: 0
  378. }
  379. .swiper-container-fade.swiper-container-free-mode .swiper-slide {
  380. -webkit-transition-timing-function: ease-out;
  381. -moz-transition-timing-function: ease-out;
  382. -ms-transition-timing-function: ease-out;
  383. -o-transition-timing-function: ease-out;
  384. transition-timing-function: ease-out
  385. }
  386. .swiper-container-fade .swiper-slide {
  387. pointer-events: none;
  388. -webkit-transition-property: opacity;
  389. -moz-transition-property: opacity;
  390. -o-transition-property: opacity;
  391. transition-property: opacity
  392. }
  393. .swiper-container-fade .swiper-slide .swiper-slide {
  394. pointer-events: none
  395. }
  396. .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
  397. pointer-events: auto
  398. }
  399. .swiper-zoom-container {
  400. width: 100%;
  401. height: 100%;
  402. display: -webkit-box;
  403. display: -moz-box;
  404. display: -ms-flexbox;
  405. display: -webkit-flex;
  406. display: flex;
  407. -webkit-box-pack: center;
  408. -moz-box-pack: center;
  409. -ms-flex-pack: center;
  410. -webkit-justify-content: center;
  411. justify-content: center;
  412. -webkit-box-align: center;
  413. -moz-box-align: center;
  414. -ms-flex-align: center;
  415. -webkit-align-items: center;
  416. align-items: center;
  417. text-align: center
  418. }
  419. .swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg {
  420. max-width: 100%;
  421. max-height: 100%;
  422. object-fit: contain
  423. }
  424. .swiper-scrollbar {
  425. border-radius: 10px;
  426. position: relative;
  427. -ms-touch-action: none;
  428. background: rgba(0,0,0,.1)
  429. }
  430. .swiper-container-horizontal>.swiper-scrollbar {
  431. position: absolute;
  432. left: 1%;
  433. bottom: 3px;
  434. z-index: 50;
  435. height: 5px;
  436. width: 98%
  437. }
  438. .swiper-container-vertical>.swiper-scrollbar {
  439. position: absolute;
  440. right: 3px;
  441. top: 1%;
  442. z-index: 50;
  443. width: 5px;
  444. height: 98%
  445. }
  446. .swiper-scrollbar-drag {
  447. height: 100%;
  448. width: 100%;
  449. position: relative;
  450. background: rgba(0,0,0,.5);
  451. border-radius: 10px;
  452. left: 0;
  453. top: 0
  454. }
  455. .swiper-scrollbar-cursor-drag {
  456. cursor: move
  457. }
  458. .swiper-lazy-preloader {
  459. position: absolute;
  460. width: 100%;
  461. height: 100%;
  462. z-index: 10;
  463. left: 0;
  464. top: 0;
  465. }
  466. /*.swiper-lazy-preloader:after {
  467. display: block;
  468. content: "";
  469. width: 100%;
  470. height: 100%;
  471. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  472. background-position: 50%;
  473. -webkit-background-size: 100%;
  474. background-size: 100%;
  475. background-repeat: no-repeat
  476. }*/
  477. .swiper-lazy-preloader-white:after {
  478. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
  479. }
  480. @-webkit-keyframes swiper-preloader-spin {
  481. 100% {
  482. -webkit-transform: rotate(360deg)
  483. }
  484. }
  485. @keyframes swiper-preloader-spin {
  486. 100% {
  487. transform: rotate(360deg)
  488. }
  489. }