No Description

style.css 4.4KB

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