style.css 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. /* -- Begin social sharing buttons
  2. ------------------------------------------------------------- */
  3. .lsb {
  4. padding-left: 0;
  5. list-style: none;
  6. }
  7. [class*="lsb-link-"] {
  8. font-size: .875em;
  9. border-radius: 2px;
  10. border: 1px solid;
  11. box-shadow: 0 0 .5em #999;
  12. transition: background-color ease-in-out .5s, color ease-in-out .5s, border-color ease-in-out .5s, box-shadow ease-in-out .5s;
  13. width: 16px;
  14. height: 16px;
  15. }
  16. [class*="lsb-link-"]:hover {
  17. box-shadow: 0 0 1em #666;
  18. }
  19. [class*="lsb-link-name-"] {
  20. padding: .25em .25em .25em 1.75em;
  21. }
  22. [class*="lsb-link-icon-"],
  23. [class*="lsb-link-color-"] {
  24. padding: .25em .25em .25em .25em;
  25. }
  26. [class*="lsb-link-color-"],
  27. [class*="lsb-link-color-"]:hover {
  28. color: #ffffff;
  29. }
  30. [class*="lsb-item-name-"],
  31. [class*="lsb-item-icon-"] {
  32. background-size: 16px 16px;
  33. background-repeat: no-repeat;
  34. background-position: 5px center;
  35. }
  36. [class*="lsb-item-"] {
  37. display: inline-block;
  38. margin: .25em;
  39. line-height: 24px;
  40. }
  41. [class*="lsb-item-"] a:link,
  42. [class*="lsb-item-"] a:visited {
  43. text-decoration: none;
  44. }
  45. [class*="lsb-item-name-"] a:link,
  46. [class*="lsb-item-name-"] a:visited,
  47. [class*="lsb-item-icon-"] a:link,
  48. [class*="lsb-item-icon-"] a:visited {
  49. color: #000000;
  50. }
  51. [class*="lsb-item-color-"] a:link,
  52. [class*="lsb-item-color-"] a:visited {
  53. color: #ffffff;
  54. }
  55. /*
  56. * Social network specific settings
  57. */
  58. /* Twitter */
  59. .lsb-item-name-twitter {
  60. background-image: url("images/twitter.ico");
  61. }
  62. .lsb-link-icon-twitter{
  63. content:url("images/twitter.ico");
  64. }
  65. .lsb-link-name-twitter,
  66. .lsb-link-icon-twitter,
  67. .lsb-link-color-twitter {
  68. border-color: #41b7d8;
  69. }
  70. .lsb-link-color-twitter {
  71. background-color: #41b7d8;
  72. }
  73. .lsb-link-color-twitter:hover,
  74. a .lsb-link-color-twitter:hover {
  75. background-color: #238caa;
  76. border-color: #238caa;
  77. }
  78. /* Facebook */
  79. .lsb-item-name-facebook {
  80. background-image: url("images/facebook.ico");
  81. }
  82. .lsb-link-icon-facebook{
  83. content:url("images/facebook.ico");
  84. }
  85. .lsb-link-name-facebook,
  86. .lsb-link-icon-facebook,
  87. .lsb-link-color-facebook {
  88. border-color: #3b5997;
  89. }
  90. .lsb-link-color-facebook {
  91. background-color: #3b5997;
  92. }
  93. .lsb-link-color-facebook:hover,
  94. a .lsb-link-color-facebook:hover {
  95. background-color: #263960;
  96. border-color: #263960;
  97. }
  98. /* Google+ */
  99. .lsb-item-name-googleplus {
  100. background-image: url("images/googleplus.ico");
  101. }
  102. .lsb-link-icon-googleplus{
  103. content:url("images/googleplus.ico");
  104. }
  105. .lsb-link-name-googleplus,
  106. .lsb-link-icon-googleplus,
  107. .lsb-link-color-googleplus {
  108. border-color: #d64937;
  109. }
  110. .lsb-link-color-googleplus {
  111. background-color: #d64937;
  112. }
  113. .lsb-link-color-googleplus:hover,
  114. a .lsb-link-color-googleplus:hover {
  115. background-color: #a02f21;
  116. border-color: #a02f21;
  117. }
  118. /* LinkedIn */
  119. .lsb-item-name-linkedin {
  120. background-image: url("images/linkedin.ico");
  121. }
  122. .lsb-link-icon-linkedin{
  123. content:url("images/linkedin.ico");
  124. }
  125. .lsb-link-name-linkedin,
  126. .lsb-link-icon-linkedin,
  127. .lsb-link-color-linkedin {
  128. border-color: #0073b2;
  129. }
  130. .lsb-link-color-linkedin {
  131. background-color: #0073b2;
  132. }
  133. .lsb-link-color-linkedin:hover,
  134. a .lsb-link-color-linkedin:hover {
  135. background-color: #004265;
  136. border-color: #004265;
  137. }
  138. /* Pinterest */
  139. .lsb-item-name-pinterest {
  140. background-image: url("images/pinterest.ico");
  141. }
  142. .lsb-link-icon-pinterest{
  143. content:url("images/pinterest.ico");
  144. }
  145. .lsb-link-name-pinterest,
  146. .lsb-link-icon-pinterest,
  147. .lsb-link-color-pinterest {
  148. border-color: #cb2027;
  149. }
  150. .lsb-link-color-pinterest {
  151. background-color: #cb2027;
  152. }
  153. .lsb-link-color-pinterest:hover,
  154. a .lsb-link-color-pinterest:hover {
  155. background-color: #89161a;
  156. border-color: #89161a;
  157. }
  158. /* Tumblr */
  159. .lsb-item-name-tumblr {
  160. background-image: url("images/tumblr.ico");
  161. }
  162. .lsb-link-icon-tumblr{
  163. content:url("images/tumblr.ico");
  164. }
  165. .lsb-link-name-tumblr,
  166. .lsb-link-icon-tumblr,
  167. .lsb-link-color-tumblr {
  168. border-color: #35465c;
  169. }
  170. .lsb-link-color-tumblr {
  171. background-color: #35465c;
  172. }
  173. .lsb-link-color-tumblr:hover,
  174. a .lsb-link-color-tumblr:hover {
  175. background-color: #19212b;
  176. border-color: #19212b;
  177. }
  178. /* Reddit */
  179. .lsb-item-name-reddit {
  180. background-image: url("images/reddit.ico");
  181. }
  182. .lsb-link-icon-reddit{
  183. content:url("images/reddit.ico");
  184. }
  185. .lsb-link-name-reddit,
  186. .lsb-link-icon-reddit,
  187. .lsb-link-color-reddit {
  188. border-color: #ff5700;
  189. }
  190. .lsb-link-color-reddit {
  191. background-color: #ff5700;
  192. }
  193. .lsb-link-color-reddit:hover,
  194. a .lsb-link-color-reddit:hover {
  195. background-color: #b33d00;
  196. border-color: #b33d00;
  197. }
  198. /* Taringa */
  199. .lsb-item-name-taringa {
  200. background-image: url("images/taringa.ico");
  201. }
  202. .lsb-link-icon-taringa{
  203. content:url("images/taringa.ico");
  204. }
  205. .lsb-link-name-taringa,
  206. .lsb-link-icon-taringa,
  207. .lsb-link-color-taringa {
  208. border-color: #005dab;
  209. }
  210. .lsb-link-color-taringa {
  211. background-color: #005dab;
  212. }
  213. .lsb-link-color-taringa:hover,
  214. a .lsb-link-color-taringa:hover {
  215. background-color: #004178;
  216. border-color: #004178;
  217. }
  218. /* buttons with backgroud colors */
  219. .lsb-link-color-vk {
  220. background-color: #5e82a8;
  221. border-color: #5e82a8;
  222. }
  223. .lsb-link-color-vk:hover,
  224. a .lsb-link-color-vk:hover {
  225. background-color: #415c78;
  226. border-color: #415c78;
  227. }
  228. .lsb-link-color-xing {
  229. background-color: #175e60;
  230. border-color: #175e60;
  231. }
  232. .lsb-link-color-xing:hover,
  233. a .lsb-link-color-xing:hover {
  234. background-color: #082222;
  235. border-color: #082222;
  236. }