swiper.min.css 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. /*
  2. * Swiper 2.7.6
  3. * Mobile touch slider and framework with hardware accelerated transitions
  4. *
  5. * http://www.idangero.us/sliders/swiper/
  6. *
  7. * Copyright 2010-2015, Vladimir Kharlampidi
  8. * The iDangero.us
  9. * http://www.idangero.us/
  10. *
  11. * Licensed under GPL & MIT
  12. *
  13. * Released on: February 11, 2015
  14. */
  15. /* ===============================================================
  16. Basic Swiper Styles
  17. ================================================================*/
  18. .swiper-container {
  19. margin: 0 auto;
  20. position: relative;
  21. overflow: hidden;
  22. direction: ltr;
  23. -webkit-backface-visibility: hidden;
  24. -moz-backface-visibility: hidden;
  25. -ms-backface-visibility: hidden;
  26. -o-backface-visibility: hidden;
  27. backface-visibility: hidden;
  28. /* Fix of Webkit flickering */
  29. z-index: 1;
  30. }
  31. .swiper-wrapper {
  32. position: relative;
  33. width: 100%;
  34. -webkit-transition-property: -webkit-transform, left, top;
  35. -webkit-transition-duration: 0s;
  36. -webkit-transform: translate3d(0px, 0, 0);
  37. -webkit-transition-timing-function: ease;
  38. -moz-transition-property: -moz-transform, left, top;
  39. -moz-transition-duration: 0s;
  40. -moz-transform: translate3d(0px, 0, 0);
  41. -moz-transition-timing-function: ease;
  42. -o-transition-property: -o-transform, left, top;
  43. -o-transition-duration: 0s;
  44. -o-transform: translate3d(0px, 0, 0);
  45. -o-transition-timing-function: ease;
  46. -o-transform: translate(0px, 0px);
  47. -ms-transition-property: -ms-transform, left, top;
  48. -ms-transition-duration: 0s;
  49. -ms-transform: translate3d(0px, 0, 0);
  50. -ms-transition-timing-function: ease;
  51. transition-property: transform, left, top;
  52. transition-duration: 0s;
  53. transform: translate3d(0px, 0, 0);
  54. transition-timing-function: ease;
  55. -webkit-box-sizing: content-box;
  56. -moz-box-sizing: content-box;
  57. box-sizing: content-box;
  58. }
  59. .swiper-free-mode > .swiper-wrapper {
  60. -webkit-transition-timing-function: ease-out;
  61. -moz-transition-timing-function: ease-out;
  62. -ms-transition-timing-function: ease-out;
  63. -o-transition-timing-function: ease-out;
  64. transition-timing-function: ease-out;
  65. margin: 0 auto;
  66. }
  67. .swiper-slide {
  68. float: left;
  69. -webkit-box-sizing: content-box;
  70. -moz-box-sizing: content-box;
  71. box-sizing: content-box;
  72. }
  73. /* IE10 Windows Phone 8 Fixes */
  74. .swiper-wp8-horizontal {
  75. -ms-touch-action: pan-y;
  76. }
  77. .swiper-wp8-vertical {
  78. -ms-touch-action: pan-x;
  79. }
  80. .pagination {
  81. position: absolute;
  82. z-index: 20;
  83. bottom: 10px;
  84. width: 100%;
  85. text-align: center;
  86. }
  87. .swiper-pagination-switch {
  88. display: inline-block;
  89. width: 8px;
  90. height: 8px;
  91. background: #dcdcdc;
  92. margin: 0 5px;
  93. cursor: pointer;
  94. border-radius: 8px;
  95. }
  96. .swiper-active-switch {
  97. background: #f44941;
  98. }
  99. /* ===============================================================
  100. Your custom styles, here you need to specify container's and slide's
  101. sizes, pagination, etc.
  102. ================================================================*/
  103. .swiper-container {
  104. /* Specify Swiper's Size: */
  105. /*width:200px;
  106. height: 100px;*/
  107. }
  108. .swiper-slide {
  109. /* Specify Slides's Size: */
  110. /*width: 100%;
  111. height: 100%;*/
  112. }
  113. .swiper-slide-active {
  114. /* Specific active slide styling: */
  115. }
  116. .swiper-slide-visible {
  117. /* Specific visible slide styling: */
  118. }
  119. /* ===============================================================
  120. Pagination Styles
  121. ================================================================*/
  122. .swiper-pagination-switch {
  123. /* Stylize pagination button: */
  124. }
  125. .swiper-active-switch {
  126. /* Specific active button style: */
  127. }
  128. .swiper-visible-switch {
  129. /* Specific visible button style: */
  130. }