合一猎豆雷达、合一看盟、猎豆37标识物

swiper.css 20KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548
  1. /**
  2. * Swiper 3.3.1
  3. * Most modern mobile touch slider and framework with hardware accelerated transitions
  4. *
  5. * http://www.idangero.us/swiper/
  6. *
  7. * Copyright 2016, Vladimir Kharlampidi
  8. * The iDangero.us
  9. * http://www.idangero.us/
  10. *
  11. * Licensed under MIT
  12. *
  13. * Released on: February 7, 2016
  14. */
  15. .swiper-container {
  16. margin: 0 auto;
  17. position: relative;
  18. overflow: hidden;
  19. /* Fix of Webkit flickering */
  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,
  52. .swiper-wrapper {
  53. -webkit-transform: translate3d(0px, 0, 0);
  54. -moz-transform: translate3d(0px, 0, 0);
  55. -o-transform: translate(0px, 0px);
  56. -ms-transform: translate3d(0px, 0, 0);
  57. transform: translate3d(0px, 0, 0);
  58. }
  59. .swiper-container-multirow > .swiper-wrapper {
  60. -webkit-box-lines: multiple;
  61. -moz-box-lines: multiple;
  62. -ms-flex-wrap: wrap;
  63. -webkit-flex-wrap: wrap;
  64. flex-wrap: wrap;
  65. }
  66. .swiper-container-free-mode > .swiper-wrapper {
  67. -webkit-transition-timing-function: ease-out;
  68. -moz-transition-timing-function: ease-out;
  69. -ms-transition-timing-function: ease-out;
  70. -o-transition-timing-function: ease-out;
  71. transition-timing-function: ease-out;
  72. margin: 0 auto;
  73. }
  74. .swiper-slide {
  75. -webkit-flex-shrink: 0;
  76. -ms-flex: 0 0 auto;
  77. flex-shrink: 0;
  78. width: 100%;
  79. height: 100%;
  80. position: relative;
  81. }
  82. /* Auto Height */
  83. .swiper-container-autoheight,
  84. .swiper-container-autoheight .swiper-slide {
  85. height: auto;
  86. }
  87. .swiper-container-autoheight .swiper-wrapper {
  88. -webkit-box-align: start;
  89. -ms-flex-align: start;
  90. -webkit-align-items: flex-start;
  91. align-items: flex-start;
  92. -webkit-transition-property: -webkit-transform, height;
  93. -moz-transition-property: -moz-transform;
  94. -o-transition-property: -o-transform;
  95. -ms-transition-property: -ms-transform;
  96. transition-property: transform, height;
  97. }
  98. /* a11y */
  99. .swiper-container .swiper-notification {
  100. position: absolute;
  101. left: 0;
  102. top: 0;
  103. pointer-events: none;
  104. opacity: 0;
  105. z-index: -1000;
  106. }
  107. /* IE10 Windows Phone 8 Fixes */
  108. .swiper-wp8-horizontal {
  109. -ms-touch-action: pan-y;
  110. touch-action: pan-y;
  111. }
  112. .swiper-wp8-vertical {
  113. -ms-touch-action: pan-x;
  114. touch-action: pan-x;
  115. }
  116. /* Arrows */
  117. .swiper-button-prev,
  118. .swiper-button-next {
  119. position: absolute;
  120. top: 50%;
  121. width: 27px;
  122. height: 44px;
  123. margin-top: -22px;
  124. z-index: 10;
  125. cursor: pointer;
  126. -moz-background-size: 27px 44px;
  127. -webkit-background-size: 27px 44px;
  128. background-size: 27px 44px;
  129. background-position: center;
  130. background-repeat: no-repeat;
  131. }
  132. .swiper-button-prev.swiper-button-disabled,
  133. .swiper-button-next.swiper-button-disabled {
  134. opacity: 0.35;
  135. cursor: auto;
  136. pointer-events: none;
  137. }
  138. .swiper-button-prev,
  139. .swiper-container-rtl .swiper-button-next {
  140. 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");
  141. left: 10px;
  142. right: auto;
  143. }
  144. .swiper-button-prev.swiper-button-black,
  145. .swiper-container-rtl .swiper-button-next.swiper-button-black {
  146. 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");
  147. }
  148. .swiper-button-prev.swiper-button-white,
  149. .swiper-container-rtl .swiper-button-next.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'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
  151. }
  152. .swiper-button-next,
  153. .swiper-container-rtl .swiper-button-prev {
  154. 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");
  155. right: 10px;
  156. left: auto;
  157. }
  158. .swiper-button-next.swiper-button-black,
  159. .swiper-container-rtl .swiper-button-prev.swiper-button-black {
  160. 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");
  161. }
  162. .swiper-button-next.swiper-button-white,
  163. .swiper-container-rtl .swiper-button-prev.swiper-button-white {
  164. 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");
  165. }
  166. /* Pagination Styles */
  167. .swiper-pagination {
  168. position: absolute;
  169. text-align: center;
  170. -webkit-transition: 300ms;
  171. -moz-transition: 300ms;
  172. -o-transition: 300ms;
  173. transition: 300ms;
  174. -webkit-transform: translate3d(0, 0, 0);
  175. -ms-transform: translate3d(0, 0, 0);
  176. -o-transform: translate3d(0, 0, 0);
  177. transform: translate3d(0, 0, 0);
  178. z-index: 10;
  179. }
  180. .swiper-pagination.swiper-pagination-hidden {
  181. opacity: 0;
  182. }
  183. /* Common Styles */
  184. .swiper-pagination-fraction,
  185. .swiper-pagination-custom,
  186. .swiper-container-horizontal > .swiper-pagination-bullets {
  187. bottom: 10px;
  188. left: 0;
  189. width: 100%;
  190. }
  191. /* Bullets */
  192. .swiper-pagination-bullet {
  193. width: 8px;
  194. height: 8px;
  195. display: inline-block;
  196. border-radius: 100%;
  197. background: #000;
  198. opacity: 0.2;
  199. }
  200. button.swiper-pagination-bullet {
  201. border: none;
  202. margin: 0;
  203. padding: 0;
  204. box-shadow: none;
  205. -moz-appearance: none;
  206. -ms-appearance: none;
  207. -webkit-appearance: none;
  208. appearance: none;
  209. }
  210. .swiper-pagination-clickable .swiper-pagination-bullet {
  211. cursor: pointer;
  212. }
  213. .swiper-pagination-white .swiper-pagination-bullet {
  214. background: #fff;
  215. }
  216. .swiper-pagination-bullet-active {
  217. opacity: 1;
  218. background: #007aff;
  219. }
  220. .swiper-pagination-white .swiper-pagination-bullet-active {
  221. background: #fff;
  222. }
  223. .swiper-pagination-black .swiper-pagination-bullet-active {
  224. background: #000;
  225. }
  226. .swiper-container-vertical > .swiper-pagination-bullets {
  227. right: 10px;
  228. top: 50%;
  229. -webkit-transform: translate3d(0px, -50%, 0);
  230. -moz-transform: translate3d(0px, -50%, 0);
  231. -o-transform: translate(0px, -50%);
  232. -ms-transform: translate3d(0px, -50%, 0);
  233. transform: translate3d(0px, -50%, 0);
  234. }
  235. .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  236. margin: 5px 0;
  237. display: block;
  238. }
  239. .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  240. margin: 0 5px;
  241. }
  242. /* Progress */
  243. .swiper-pagination-progress {
  244. background: rgba(0, 0, 0, 0.25);
  245. position: absolute;
  246. }
  247. .swiper-pagination-progress .swiper-pagination-progressbar {
  248. background: #007aff;
  249. position: absolute;
  250. left: 0;
  251. top: 0;
  252. width: 100%;
  253. height: 100%;
  254. -webkit-transform: scale(0);
  255. -ms-transform: scale(0);
  256. -o-transform: scale(0);
  257. transform: scale(0);
  258. -webkit-transform-origin: left top;
  259. -moz-transform-origin: left top;
  260. -ms-transform-origin: left top;
  261. -o-transform-origin: left top;
  262. transform-origin: left top;
  263. }
  264. .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
  265. -webkit-transform-origin: right top;
  266. -moz-transform-origin: right top;
  267. -ms-transform-origin: right top;
  268. -o-transform-origin: right top;
  269. transform-origin: right top;
  270. }
  271. .swiper-container-horizontal > .swiper-pagination-progress {
  272. width: 100%;
  273. height: 4px;
  274. left: 0;
  275. top: 0;
  276. }
  277. .swiper-container-vertical > .swiper-pagination-progress {
  278. width: 4px;
  279. height: 100%;
  280. left: 0;
  281. top: 0;
  282. }
  283. .swiper-pagination-progress.swiper-pagination-white {
  284. background: rgba(255, 255, 255, 0.5);
  285. }
  286. .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
  287. background: #fff;
  288. }
  289. .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
  290. background: #000;
  291. }
  292. /* 3D Container */
  293. .swiper-container-3d {
  294. -webkit-perspective: 1200px;
  295. -moz-perspective: 1200px;
  296. -o-perspective: 1200px;
  297. perspective: 1200px;
  298. }
  299. .swiper-container-3d .swiper-wrapper,
  300. .swiper-container-3d .swiper-slide,
  301. .swiper-container-3d .swiper-slide-shadow-left,
  302. .swiper-container-3d .swiper-slide-shadow-right,
  303. .swiper-container-3d .swiper-slide-shadow-top,
  304. .swiper-container-3d .swiper-slide-shadow-bottom,
  305. .swiper-container-3d .swiper-cube-shadow {
  306. -webkit-transform-style: preserve-3d;
  307. -moz-transform-style: preserve-3d;
  308. -ms-transform-style: preserve-3d;
  309. transform-style: preserve-3d;
  310. }
  311. .swiper-container-3d .swiper-slide-shadow-left,
  312. .swiper-container-3d .swiper-slide-shadow-right,
  313. .swiper-container-3d .swiper-slide-shadow-top,
  314. .swiper-container-3d .swiper-slide-shadow-bottom {
  315. position: absolute;
  316. left: 0;
  317. top: 0;
  318. width: 100%;
  319. height: 100%;
  320. pointer-events: none;
  321. z-index: 10;
  322. }
  323. .swiper-container-3d .swiper-slide-shadow-left {
  324. background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  325. /* Safari 4+, Chrome */
  326. background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  327. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  328. background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  329. /* Firefox 3.6-15 */
  330. background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  331. /* Opera 11.10-12.00 */
  332. background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  333. /* Firefox 16+, IE10, Opera 12.50+ */
  334. }
  335. .swiper-container-3d .swiper-slide-shadow-right {
  336. background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  337. /* Safari 4+, Chrome */
  338. background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  339. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  340. background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  341. /* Firefox 3.6-15 */
  342. background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  343. /* Opera 11.10-12.00 */
  344. background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  345. /* Firefox 16+, IE10, Opera 12.50+ */
  346. }
  347. .swiper-container-3d .swiper-slide-shadow-top {
  348. background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  349. /* Safari 4+, Chrome */
  350. background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  351. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  352. background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  353. /* Firefox 3.6-15 */
  354. background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  355. /* Opera 11.10-12.00 */
  356. background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  357. /* Firefox 16+, IE10, Opera 12.50+ */
  358. }
  359. .swiper-container-3d .swiper-slide-shadow-bottom {
  360. background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  361. /* Safari 4+, Chrome */
  362. background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  363. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  364. background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  365. /* Firefox 3.6-15 */
  366. background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  367. /* Opera 11.10-12.00 */
  368. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  369. /* Firefox 16+, IE10, Opera 12.50+ */
  370. }
  371. /* Coverflow */
  372. .swiper-container-coverflow .swiper-wrapper,
  373. .swiper-container-flip .swiper-wrapper {
  374. /* Windows 8 IE 10 fix */
  375. -ms-perspective: 1200px;
  376. }
  377. /* Cube + Flip */
  378. .swiper-container-cube,
  379. .swiper-container-flip {
  380. overflow: visible;
  381. }
  382. .swiper-container-cube .swiper-slide,
  383. .swiper-container-flip .swiper-slide {
  384. pointer-events: none;
  385. -webkit-backface-visibility: hidden;
  386. -moz-backface-visibility: hidden;
  387. -ms-backface-visibility: hidden;
  388. backface-visibility: hidden;
  389. z-index: 1;
  390. }
  391. .swiper-container-cube .swiper-slide .swiper-slide,
  392. .swiper-container-flip .swiper-slide .swiper-slide {
  393. pointer-events: none;
  394. }
  395. .swiper-container-cube .swiper-slide-active,
  396. .swiper-container-flip .swiper-slide-active,
  397. .swiper-container-cube .swiper-slide-active .swiper-slide-active,
  398. .swiper-container-flip .swiper-slide-active .swiper-slide-active {
  399. pointer-events: auto;
  400. }
  401. .swiper-container-cube .swiper-slide-shadow-top,
  402. .swiper-container-flip .swiper-slide-shadow-top,
  403. .swiper-container-cube .swiper-slide-shadow-bottom,
  404. .swiper-container-flip .swiper-slide-shadow-bottom,
  405. .swiper-container-cube .swiper-slide-shadow-left,
  406. .swiper-container-flip .swiper-slide-shadow-left,
  407. .swiper-container-cube .swiper-slide-shadow-right,
  408. .swiper-container-flip .swiper-slide-shadow-right {
  409. z-index: 0;
  410. -webkit-backface-visibility: hidden;
  411. -moz-backface-visibility: hidden;
  412. -ms-backface-visibility: hidden;
  413. backface-visibility: hidden;
  414. }
  415. /* Cube */
  416. .swiper-container-cube .swiper-slide {
  417. visibility: hidden;
  418. -webkit-transform-origin: 0 0;
  419. -moz-transform-origin: 0 0;
  420. -ms-transform-origin: 0 0;
  421. transform-origin: 0 0;
  422. width: 100%;
  423. height: 100%;
  424. }
  425. .swiper-container-cube.swiper-container-rtl .swiper-slide {
  426. -webkit-transform-origin: 100% 0;
  427. -moz-transform-origin: 100% 0;
  428. -ms-transform-origin: 100% 0;
  429. transform-origin: 100% 0;
  430. }
  431. .swiper-container-cube .swiper-slide-active,
  432. .swiper-container-cube .swiper-slide-next,
  433. .swiper-container-cube .swiper-slide-prev,
  434. .swiper-container-cube .swiper-slide-next + .swiper-slide {
  435. pointer-events: auto;
  436. visibility: visible;
  437. }
  438. .swiper-container-cube .swiper-cube-shadow {
  439. position: absolute;
  440. left: 0;
  441. bottom: 0px;
  442. width: 100%;
  443. height: 100%;
  444. background: #000;
  445. opacity: 0.6;
  446. -webkit-filter: blur(50px);
  447. filter: blur(50px);
  448. z-index: 0;
  449. }
  450. /* Fade */
  451. .swiper-container-fade.swiper-container-free-mode .swiper-slide {
  452. -webkit-transition-timing-function: ease-out;
  453. -moz-transition-timing-function: ease-out;
  454. -ms-transition-timing-function: ease-out;
  455. -o-transition-timing-function: ease-out;
  456. transition-timing-function: ease-out;
  457. }
  458. .swiper-container-fade .swiper-slide {
  459. pointer-events: none;
  460. -webkit-transition-property: opacity;
  461. -moz-transition-property: opacity;
  462. -o-transition-property: opacity;
  463. transition-property: opacity;
  464. }
  465. .swiper-container-fade .swiper-slide .swiper-slide {
  466. pointer-events: none;
  467. }
  468. .swiper-container-fade .swiper-slide-active,
  469. .swiper-container-fade .swiper-slide-active .swiper-slide-active {
  470. pointer-events: auto;
  471. }
  472. /* Scrollbar */
  473. .swiper-scrollbar {
  474. border-radius: 10px;
  475. position: relative;
  476. -ms-touch-action: none;
  477. background: rgba(0, 0, 0, 0.1);
  478. }
  479. .swiper-container-horizontal > .swiper-scrollbar {
  480. position: absolute;
  481. left: 1%;
  482. bottom: 3px;
  483. z-index: 50;
  484. height: 5px;
  485. width: 98%;
  486. }
  487. .swiper-container-vertical > .swiper-scrollbar {
  488. position: absolute;
  489. right: 3px;
  490. top: 1%;
  491. z-index: 50;
  492. width: 5px;
  493. height: 98%;
  494. }
  495. .swiper-scrollbar-drag {
  496. height: 100%;
  497. width: 100%;
  498. position: relative;
  499. background: rgba(0, 0, 0, 0.5);
  500. border-radius: 10px;
  501. left: 0;
  502. top: 0;
  503. }
  504. .swiper-scrollbar-cursor-drag {
  505. cursor: move;
  506. }
  507. /* Preloader */
  508. .swiper-lazy-preloader {
  509. width: 42px;
  510. height: 42px;
  511. position: absolute;
  512. left: 50%;
  513. top: 50%;
  514. margin-left: -21px;
  515. margin-top: -21px;
  516. z-index: 10;
  517. -webkit-transform-origin: 50%;
  518. -moz-transform-origin: 50%;
  519. transform-origin: 50%;
  520. -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  521. -moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  522. animation: swiper-preloader-spin 1s steps(12, end) infinite;
  523. }
  524. .swiper-lazy-preloader:after {
  525. display: block;
  526. content: "";
  527. width: 100%;
  528. height: 100%;
  529. 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");
  530. background-position: 50%;
  531. -webkit-background-size: 100%;
  532. background-size: 100%;
  533. background-repeat: no-repeat;
  534. }
  535. .swiper-lazy-preloader-white:after {
  536. 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");
  537. }
  538. @-webkit-keyframes swiper-preloader-spin {
  539. 100% {
  540. -webkit-transform: rotate(360deg);
  541. }
  542. }
  543. @keyframes swiper-preloader-spin {
  544. 100% {
  545. transform: rotate(360deg);
  546. }
  547. }