Няма описание

style.css 4.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. /**
  2. * Master Slider
  3. * Light 5
  4. */
  5. .ms-skin-light-5 .ms-slide .ms-slide-vpbtn,
  6. .ms-skin-light-5 .ms-video-btn{
  7. width: 32px;
  8. height: 32px;
  9. background: url(light-skin-5.png) black no-repeat -24px -160px;
  10. top: 50%;
  11. left: 50%;
  12. margin: -18px 0 0 -18px;
  13. }
  14. .ms-skin-light-5 .ms-slide .ms-slide-vpbtn:hover,
  15. .ms-skin-light-5 .ms-video-btn:hover{
  16. background-color:#646464;
  17. }
  18. .ms-skin-light-5 .ms-slide .ms-slide-vcbtn {
  19. width: 30px;
  20. height: 30px;
  21. background: url(light-skin-5.png) white no-repeat -24px -28px;
  22. top: 18px;
  23. right: 30px;
  24. }
  25. /* controls */
  26. .ms-skin-light-5 .ms-nav-next,
  27. .ms-skin-light-5 .ms-nav-prev {
  28. width: 32px;
  29. background: url(light-skin-5.png) white;
  30. background-position: -94px -32px;
  31. height: 32px;
  32. cursor: pointer;
  33. bottom: 40px;
  34. left: 40px;
  35. margin-top: -20px;
  36. position: absolute;
  37. z-index: 110;
  38. }
  39. .ms-skin-light-5 .ms-nav-next:hover,
  40. .ms-skin-light-5 .ms-nav-prev:hover{
  41. background-color:#E0E0E0;
  42. }
  43. .ms-skin-light-5 .ms-nav-next {
  44. left: 73px;
  45. background-position: -93px -110px;
  46. }
  47. .ms-skin-light-5 .ms-bullets.ms-dir-h {
  48. position: absolute;
  49. bottom: 20px;
  50. right: 50%;
  51. width: 100px;
  52. }
  53. .ms-skin-light-5 .ms-bullets.ms-dir-h .ms-bullets-count {
  54. position: relative;
  55. right: -50%;
  56. }
  57. .ms-skin-light-5 .ms-bullet {
  58. width: 10px;
  59. height: 10px;
  60. background: url(light-skin-5.png) no-repeat;
  61. margin: 4px;
  62. background-position: -34px -117px;
  63. }
  64. .ms-skin-light-5 .ms-bullet-selected {
  65. background-position: -34px -84px;
  66. }
  67. .ms-skin-light-5 .ms-timerbar {
  68. height: 3px;
  69. background: white;
  70. }
  71. .ms-skin-light-5 .ms-time-bar {
  72. height: 1px;
  73. background: #646464;
  74. margin-top: 1px;
  75. }
  76. .ms-skin-light-5 .ms-tooltip{
  77. position: absolute;
  78. z-index: 210;
  79. cursor: auto;
  80. }
  81. .ms-skin-light-5 .ms-tooltip-top .ms-tooltip-arrow,
  82. .ms-skin-light-5 .ms-tooltip-bottom .ms-tooltip-arrow{
  83. border-left: solid 10px transparent;
  84. border-right: solid 10px transparent;
  85. position: absolute;
  86. left: 50%;
  87. margin-left: -10px;
  88. }
  89. .ms-skin-light-5 .ms-tooltip-top .ms-tooltip-arrow{
  90. border-top: solid 10px;
  91. border-top-color: silver;
  92. border-top-color: rgba(240, 240, 240, 0.88);
  93. bottom: -10px;
  94. }
  95. .ms-skin-light-5 .ms-tooltip-bottom .ms-tooltip-arrow {
  96. border-bottom: solid 10px;
  97. border-bottom-color: silver;
  98. border-bottom-color: rgba(240, 240, 240, 0.88);
  99. top: -10px;
  100. }
  101. .ms-skin-light-5 .ms-tooltip-right .ms-tooltip-arrow,
  102. .ms-skin-light-5 .ms-tooltip-left .ms-tooltip-arrow{
  103. border-top: solid 10px transparent;
  104. border-bottom: solid 10px transparent;
  105. position: absolute;
  106. top: 50%;
  107. margin-top: -10px;
  108. }
  109. .ms-skin-light-5 .ms-tooltip-right .ms-tooltip-arrow{
  110. border-right: solid 10px;
  111. border-right-color: silver;
  112. border-right-color: rgba(240, 240, 240, 0.88);
  113. left: -10px;
  114. }
  115. .ms-skin-light-5 .ms-tooltip-left .ms-tooltip-arrow {
  116. border-left: solid 10px;
  117. border-left-color: silver;
  118. border-left-color: rgba(240, 240, 240, 0.88);
  119. right: -10px;
  120. }
  121. .ms-skin-light-5 .ms-tooltip-point {cursor: pointer;}
  122. .ms-skin-light-5 .ms-tooltip-point .ms-point-center {
  123. width: 12px;
  124. height: 12px;
  125. border-radius: 15px;
  126. border: solid 2px #BBB;
  127. background: white;
  128. margin: -8px 0 0 -8px;
  129. position: absolute;
  130. z-index: 105;
  131. }
  132. .ms-skin-light-5 .ms-tooltip-point .ms-point-border {
  133. width: 22px;
  134. height: 22px;
  135. background: black;
  136. background:rgba(0, 0, 0, 0.36);
  137. margin: -11px 0 0 -11px;
  138. position: absolute;
  139. border-radius: 15px;
  140. animation: point-anim 1.5s infinite ;
  141. -moz-animation: point-anim 1.5s infinite;
  142. -webkit-animation: point-anim 1.5s infinite;
  143. -o-animation: point-anim 1.5s infinite;
  144. }
  145. /* In Android browser, using css animations over slider causes some crashes */
  146. .ms-android.ms-skin-light-5 .ms-tooltip-point .ms-point-border{
  147. animation:none;
  148. -moz-animation:none;
  149. -webkit-animation:none;
  150. -o-animation:none;
  151. }
  152. .ms-ie7.ms-skin-light-5 .ms-tooltip-point .ms-point-border,
  153. .ms-ie8.ms-skin-light-5 .ms-tooltip-point .ms-point-border{
  154. display: none;
  155. }
  156. .ms-skin-light-5 .ms-tooltip {
  157. max-width:200px;
  158. }
  159. .ms-skin-light-5 .ms-tooltip-cont {
  160. padding: 10px;
  161. background: silver;
  162. background: rgba(240, 240, 240, 0.88);
  163. text-shadow: 0 1px 0px white;
  164. box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.04);
  165. }
  166. /* retina */
  167. @media
  168. only screen and (-webkit-min-device-pixel-ratio: 2),
  169. only screen and ( min--moz-device-pixel-ratio: 2),
  170. only screen and ( -o-min-device-pixel-ratio: 2/1),
  171. only screen and ( min-device-pixel-ratio: 2),
  172. only screen and ( min-resolution: 192dpi),
  173. only screen and ( min-resolution: 2dppx) {
  174. .ms-skin-light-5 .ms-slide .ms-slide-vpbtn,
  175. .ms-skin-light-5 .ms-video-btn,
  176. .ms-skin-light-5 .ms-slide .ms-slide-vcbtn,
  177. .ms-skin-light-5 .ms-nav-next,
  178. .ms-skin-light-5 .ms-nav-prev{
  179. background-image:url(light-skin-5-retina.png);
  180. background-size: 152px 225px;
  181. }
  182. }