hesperiden.css 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. /*-----------------------------------------------------------------------------
  2. - Revolution Slider 5.0 Navigatin Skin Style -
  3. HESPERIDEN SKIN
  4. author: ThemePunch
  5. email: info@themepunch.com
  6. website: http://www.themepunch.com
  7. -----------------------------------------------------------------------------*/
  8. /* ARROWS */
  9. .hesperiden.tparrows {
  10. cursor:pointer;
  11. background:#000;
  12. background:rgba(0,0,0,0.5);
  13. width:40px;
  14. height:40px;
  15. position:absolute;
  16. display:block;
  17. z-index:100;
  18. border-radius: 50%;
  19. }
  20. .hesperiden.tparrows:hover {
  21. background:#000;
  22. }
  23. .hesperiden.tparrows:before {
  24. font-family: "revicons";
  25. font-size:20px;
  26. color:#fff;
  27. display:block;
  28. line-height: 40px;
  29. text-align: center;
  30. }
  31. .hesperiden.tparrows.tp-leftarrow:before {
  32. content: "\e82c";
  33. margin-left:-3px;
  34. }
  35. .hesperiden.tparrows.tp-rightarrow:before {
  36. content: "\e82d";
  37. margin-right:-3px;
  38. }
  39. /* BULLETS */
  40. .hesperiden.tp-bullets {
  41. }
  42. .hesperiden.tp-bullets:before {
  43. content:" ";
  44. position:absolute;
  45. width:100%;
  46. height:100%;
  47. background:transparent;
  48. padding:10px;
  49. margin-left:-10px;margin-top:-10px;
  50. box-sizing:content-box;
  51. border-radius:8px;
  52. }
  53. .hesperiden .tp-bullet {
  54. width:12px;
  55. height:12px;
  56. position:absolute;
  57. background: #999999; /* old browsers */
  58. background: -moz-linear-gradient(top, #999999 0%, #e1e1e1 100%); /* ff3.6+ */
  59. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999999),
  60. color-stop(100%,#e1e1e1)); /* chrome,safari4+ */
  61. background: -webkit-linear-gradient(top, #999999 0%,#e1e1e1 100%); /* chrome10+,safari5.1+ */
  62. background: -o-linear-gradient(top, #999999 0%,#e1e1e1 100%); /* opera 11.10+ */
  63. background: -ms-linear-gradient(top, #999999 0%,#e1e1e1 100%); /* ie10+ */
  64. background: linear-gradient(to bottom, #999999 0%,#e1e1e1 100%); /* w3c */
  65. filter: progid:dximagetransform.microsoft.gradient(
  66. startcolorstr="#999999", endcolorstr="#e1e1e1",gradienttype=0 ); /* ie6-9 */
  67. border:3px solid #e5e5e5;
  68. border-radius:50%;
  69. cursor: pointer;
  70. box-sizing:content-box;
  71. }
  72. .hesperiden .tp-bullet:hover,
  73. .hesperiden .tp-bullet.selected {
  74. background:#666;
  75. }
  76. .hesperiden .tp-bullet-image {
  77. }
  78. .hesperiden .tp-bullet-title {
  79. }
  80. /* THUMBS */
  81. .hesperiden .tp-thumb {
  82. opacity:1;
  83. -webkit-perspective: 600px;
  84. perspective: 600px;
  85. }
  86. .hesperiden .tp-thumb .tp-thumb-title {
  87. font-size:12px;
  88. position:absolute;
  89. margin-top:-10px;
  90. color:#fff;
  91. display:block;
  92. z-index:1000;
  93. background-color:#000;
  94. padding:5px 10px;
  95. bottom:0px;
  96. left:0px;
  97. width:100%;
  98. box-sizing:border-box;
  99. text-align:center;
  100. overflow:hidden;
  101. white-space:nowrap;
  102. transition:all 0.3s;
  103. -webkit-transition:all 0.3s;
  104. transform:rotatex(90deg) translatez(0.001px);
  105. transform-origin:50% 100%;
  106. -webkit-transform:rotatex(90deg) translatez(0.001px);
  107. -webkit-transform-origin:50% 100%;
  108. opacity:0;
  109. }
  110. .hesperiden .tp-thumb:hover .tp-thumb-title {
  111. transform:rotatex(0deg);
  112. -webkit-transform:rotatex(0deg);
  113. opacity:1;
  114. }
  115. /* TABS */
  116. .hesperiden .tp-tab {
  117. opacity:1;
  118. padding:10px;
  119. box-sizing:border-box;
  120. font-family: "Roboto", sans-serif;
  121. border-bottom: 1px solid #e5e5e5;
  122. }
  123. .hesperiden .tp-tab-image
  124. {
  125. width:60px;
  126. height:60px; max-height:100%; max-width:100%;
  127. position:relative;
  128. display:inline-block;
  129. float:left;
  130. }
  131. .hesperiden .tp-tab-content
  132. {
  133. background:rgba(0,0,0,0);
  134. position:relative;
  135. padding:15px 15px 15px 85px;
  136. left:0px;
  137. overflow:hidden;
  138. margin-top:-15px;
  139. box-sizing:border-box;
  140. color:#333;
  141. display: inline-block;
  142. width:100%;
  143. height:100%;
  144. position:absolute; }
  145. .hesperiden .tp-tab-date
  146. {
  147. display:block;
  148. color: #aaa;
  149. font-weight:500;
  150. font-size:12px;
  151. margin-bottom:0px;
  152. }
  153. .hesperiden .tp-tab-title
  154. {
  155. display:block;
  156. text-align:left;
  157. color:#333;
  158. font-size:14px;
  159. font-weight:500;
  160. text-transform:none;
  161. line-height:17px;
  162. }
  163. .hesperiden .tp-tab:hover,
  164. .hesperiden .tp-tab.selected {
  165. background:#eee;
  166. }
  167. .hesperiden .tp-tab-mask {
  168. }
  169. /* MEDIA QUERIES */
  170. @media only screen and (max-width: 960px) {
  171. }
  172. @media only screen and (max-width: 768px) {
  173. }