Advertisement
khazd0rf

Extra.css

Mar 5th, 2013
155
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.66 KB | None | 0 0
  1. /* --------------------------------------------------
  2. Buttons
  3. -------------------------------------------------- */
  4.  
  5. a.button,
  6. a.button:visited {
  7. display: inline-block;
  8. padding: 4px 14px;
  9. margin: 0 3px 5px 0;
  10. font-size: 12px;
  11. font-weight: normal ! important;
  12. line-height: 20px;
  13. color: #333333;
  14. text-align: center;
  15. text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  16. vertical-align: middle;
  17. cursor: pointer;
  18. background-color: #f5f5f5;
  19. background-repeat: repeat-x;
  20. -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  21. -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  22. box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  23. border: 1px solid #bbbbbb;
  24. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  25. border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  26. border-bottom-color: #a2a2a2;
  27. -webkit-border-radius: 4px;
  28. -moz-border-radius: 4px;
  29. border-radius: 4px;
  30. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  31. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  32. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  33. background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  34. background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  35. background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  36. background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  37. }
  38.  
  39. a.button.radius {
  40. border-radius: 4px!important;
  41. -webkit-border-radius: 4px!important;
  42. -moz-border-radius: 4px!important;
  43. -o-border-radius: 4px!important;
  44. }
  45.  
  46. a.button.round {
  47. border-radius: 30px!important;
  48. -webkit-border-radius: 30px!important;
  49. -moz-border-radius: 30px!important;
  50. -o-border-radius: 30px!important;
  51. }
  52.  
  53. a.button.medium {
  54. padding: 9px 18px!important;
  55. font-size: 15px;
  56. }
  57.  
  58. a.button.large {
  59. padding: 12px 22px!important;
  60. font-size: 16px;
  61. }
  62.  
  63. a.button:hover {
  64. color: #333333;
  65. text-decoration: none;
  66. background-color: #e6e6e6;
  67. *background-color: #d9d9d9;
  68. /* Buttons in IE7 don't get borders, so darken on hover */
  69.  
  70. background-position: 0 -15px;
  71. -webkit-transition: background-position 0.1s linear;
  72. -moz-transition: background-position 0.1s linear;
  73. -ms-transition: background-position 0.1s linear;
  74. -o-transition: background-position 0.1s linear;
  75. transition: background-position 0.1s linear;
  76. }
  77.  
  78. a.button:focus {
  79. outline: thin dotted #333;
  80. outline: 5px auto -webkit-focus-ring-color;
  81. outline-offset: -2px;
  82. }
  83.  
  84. a.button:active {
  85. background-color: #e6e6e6;
  86. background-color: #d9d9d9 \9;
  87. background-image: none;
  88. outline: 0;
  89. -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
  90. -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
  91. box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
  92. }
  93.  
  94. a.button.green {
  95. color: #ffffff;
  96. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  97. background-color: #5bb75b;
  98. *background-color: #51a351;
  99. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));
  100. background-image: -webkit-linear-gradient(top, #62c462, #51a351);
  101. background-image: -o-linear-gradient(top, #62c462, #51a351);
  102. background-image: linear-gradient(to bottom, #62c462, #51a351);
  103. background-image: -moz-linear-gradient(top, #62c462, #51a351);
  104. background-repeat: repeat-x;
  105. border-color: #51a351 #51a351 #387038;
  106. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  107. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
  108. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  109. }
  110.  
  111. a.button.green:hover {
  112. color: #ffffff;
  113. background-color: #51a351;
  114. *background-color: #499249;
  115. }
  116.  
  117. a.button.light-blue {
  118. color: #ffffff;
  119. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  120. background-color: #49afcd;
  121. *background-color: #2f96b4;
  122. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
  123. background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  124. background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  125. background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
  126. background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  127. background-repeat: repeat-x;
  128. border-color: #2f96b4 #2f96b4 #1f6377;
  129. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  130. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
  131. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  132. }
  133.  
  134. a.button.light-blue:hover {
  135. color: #ffffff;
  136. background-color: #2f96b4;
  137. *background-color: #2a85a0;
  138. }
  139.  
  140. a.button.blue {
  141. color: #ffffff;
  142. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  143. background-color: #006dcc;
  144. *background-color: #0044cc;
  145. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
  146. background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
  147. background-image: -o-linear-gradient(top, #0088cc, #0044cc);
  148. background-image: linear-gradient(to bottom, #0088cc, #0044cc);
  149. background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
  150. background-repeat: repeat-x;
  151. border-color: #0044cc #0044cc #002a80;
  152. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  153. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
  154. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  155. }
  156.  
  157. a.button.blue:hover {
  158. color: #ffffff;
  159. background-color: #0044cc;
  160. *background-color: #003bb3;
  161. }
  162.  
  163. a.button.red {
  164. color: #ffffff;
  165. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  166. background-color: #da4f49;
  167. *background-color: #bd362f;
  168. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
  169. background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
  170. background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
  171. background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
  172. background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
  173. background-repeat: repeat-x;
  174. border-color: #bd362f #bd362f #802420;
  175. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  176. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  177. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  178. }
  179.  
  180. a.button.red:hover {
  181. color: #ffffff;
  182. background-color: #bd362f;
  183. *background-color: #a9302a;
  184. }
  185.  
  186. a.button.orange {
  187. color: #ffffff;
  188. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  189. background-color: #faa732;
  190. *background-color: #f89406;
  191. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));
  192. background-image: -webkit-linear-gradient(top, #fbb450, #f89406);
  193. background-image: -o-linear-gradient(top, #fbb450, #f89406);
  194. background-image: linear-gradient(to bottom, #fbb450, #f89406);
  195. background-image: -moz-linear-gradient(top, #fbb450, #f89406);
  196. background-repeat: repeat-x;
  197. border-color: #f89406 #f89406 #ad6704;
  198. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  199. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
  200. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  201. }
  202.  
  203. a.button.orange:hover {
  204. color: #ffffff;
  205. background-color: #f89406;
  206. *background-color: #df8505;
  207. }
  208.  
  209. a.button.grey {
  210. color: #555!important;
  211. text-shadow: 0 1px 0 rgba(255,255,255,0.2);
  212. border-color: #acacac!important;
  213. background: #f5f5f5;
  214. background: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  215. background: -ms-linear-gradient(top, #ffffff, #e6e6e6);
  216. background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  217. background: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  218. background: -o-linear-gradient(top, #ffffff, #e6e6e6);
  219. background: linear-gradient(top, #ffffff, #e6e6e6);
  220. }
  221.  
  222. a.button.grey:hover {
  223. background: #f6f6f6;
  224. background: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#f6f6f6));
  225. background: -webkit-linear-gradient(top, #fcfcfc, #f6f6f6);
  226. background: -moz-linear-gradient(top, #fcfcfc, #f6f6f6);
  227. background: -ms-linear-gradient(top, #fcfcfc, #f6f6f6);
  228. background: -o-linear-gradient(top, #fcfcfc, #f6f6f6);
  229. }
  230.  
  231. a.button.black {
  232. color: #ffffff;
  233. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  234. background-color: #363636;
  235. *background-color: #222222;
  236. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
  237. background-image: -webkit-linear-gradient(top, #444444, #222222);
  238. background-image: -o-linear-gradient(top, #444444, #222222);
  239. background-image: linear-gradient(to bottom, #444444, #222222);
  240. background-image: -moz-linear-gradient(top, #444444, #222222);
  241. background-repeat: repeat-x;
  242. border-color: #222222 #222222 #000000;
  243. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  244. filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
  245. filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  246. }
  247.  
  248. a.button.black:hover {
  249. color: #ffffff;
  250. background-color: #222222;
  251. *background-color: #151515;
  252. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement