sharing.css 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749
  1. /**
  2. * Sharedaddy Base Styles
  3. *
  4. * Contains styles for modules, containers, buttons
  5. */
  6. /* Master container */
  7. #jp-post-flair {
  8. padding-top: .5em;
  9. }
  10. /* Overall Sharedaddy block title */
  11. div.sharedaddy,
  12. #content div.sharedaddy,
  13. #main div.sharedaddy {
  14. clear: both;
  15. }
  16. div.sharedaddy h3.sd-title {
  17. margin: 0 0 1em 0;
  18. display: inline-block;
  19. line-height: 1.2;
  20. font-size: 9pt;
  21. font-weight: bold;
  22. }
  23. div.sharedaddy h3.sd-title:before {
  24. content: "";
  25. display: block;
  26. width: 100%;
  27. min-width: 30px;
  28. border-top: 1px solid #ddd;
  29. margin-bottom: 1em;
  30. }
  31. body.highlander-light h3.sd-title:before {
  32. border-top: 1px solid rgba(0,0,0,.2);
  33. }
  34. body.highlander-dark h3.sd-title:before {
  35. border-top: 1px solid rgba(255,255,255,.4);
  36. }
  37. /* Sharing services list */
  38. .sd-content ul {
  39. padding: 0 !important;
  40. margin: 0 0 .7em 0 !important;
  41. list-style: none !important;
  42. }
  43. .sd-content ul li {
  44. display: inline-block;
  45. }
  46. .sd-block.sd-gplus {
  47. margin: 0 0 .5em 0;
  48. }
  49. .sd-gplus .sd-content {
  50. font-size: 12px;
  51. }
  52. /* Buttons */
  53. .sd-social-icon .sd-content ul li a.sd-button,
  54. .sd-social-text .sd-content ul li a.sd-button,
  55. .sd-content ul li a.sd-button,
  56. .sd-content ul li .option a.share-ustom, /* Ugh. */
  57. .sd-content ul li.preview-item div.option.option-smart-off a,
  58. .sd-content ul li.advanced a.share-more,
  59. .sd-social-icon-text .sd-content ul li a.sd-button,
  60. .sd-social-official .sd-content>ul>li>a.sd-button,
  61. #sharing_email .sharing_send,
  62. .sd-social-official .sd-content>ul>li .digg_button >a { /* official Digg button no longer works, needs cleaning */
  63. text-decoration: none !important;
  64. display: inline-block;
  65. font-size: 12px;
  66. font-family: "Open Sans", sans-serif;
  67. font-weight: normal;
  68. border-radius: 3px;
  69. color: #777 !important;
  70. background: #f8f8f8;
  71. border: 1px solid #cccccc;
  72. box-shadow: 0 1px 0 rgba(0,0,0,.08);
  73. text-shadow: none;
  74. line-height: 23px;
  75. padding: 1px 8px 0px 5px;
  76. }
  77. .sd-social-text .sd-content ul li a.sd-button span,
  78. .sd-content ul li a.sd-button>span,
  79. .sd-content ul li .option a.share-ustom span, /* Ugh. */
  80. .sd-content ul li.preview-item div.option.option-smart-off a span,
  81. .sd-content ul li.advanced a.share-more span,
  82. .sd-social-icon-text .sd-content ul li a.sd-button>span,
  83. .sd-social-official .sd-content>ul>li>a.sd-button span,
  84. .sd-social-official .sd-content>ul>li .digg_button >a span { /* official Digg button no longer works, needs cleaning */
  85. line-height: 23px;
  86. }
  87. /* Our gray buttons should be smaller when seen with the official ones */
  88. .sd-social-official .sd-content>ul>li>a.sd-button,
  89. .sd-social-official .sd-content .sharing-hidden .inner>ul>li>a.sd-button,
  90. .sd-social-official .sd-content>ul>li .digg_button>a,
  91. .sd-social-official .sd-content .sharing-hidden .inner>ul>li .digg_button>a {
  92. line-height: 17px;
  93. box-shadow: none; /* No shadow on gray buttons between the official ones */
  94. vertical-align: top;
  95. }
  96. .sd-social-official .sd-content ul li a.sd-button>span {
  97. line-height: 17px;
  98. }
  99. .sd-social-official .sd-content>ul>li>a.sd-button:before,
  100. .sd-social-official .sd-content>ul>li .digg_button>a:before,
  101. .sd-social-official .sd-content .sharing-hidden .inner>ul>li>a.sd-button:before,
  102. .sd-social-official .sd-content .sharing-hidden .inner>ul>li .digg_button>a:before {
  103. margin-bottom: -1px;
  104. }
  105. .sd-social-icon .sd-content ul li a.sd-button:hover,
  106. .sd-social-icon .sd-content ul li a.sd-button:active,
  107. .sd-social-text .sd-content ul li a.sd-button:hover,
  108. .sd-social-text .sd-content ul li a.sd-button:active,
  109. .sd-social-icon-text .sd-content ul li a.sd-button:hover,
  110. .sd-social-icon-text .sd-content ul li a.sd-button:active,
  111. .sd-social-official .sd-content>ul>li>a.sd-button:hover,
  112. .sd-social-official .sd-content>ul>li>a.sd-button:active,
  113. .sd-social-official .sd-content>ul>li .digg_button>a:hover,
  114. .sd-social-official .sd-content>ul>li .digg_button>a:active {
  115. color: #555;
  116. background: #fafafa;
  117. border: 1px solid #999999;
  118. }
  119. .sd-social-icon .sd-content ul li a.sd-button:active,
  120. .sd-social-text .sd-content ul li a.sd-button:active,
  121. .sd-social-icon-text .sd-content ul li a.sd-button:active,
  122. .sd-social-official .sd-content>ul>li>a.sd-button:active,
  123. .sd-social-official .sd-content>ul>li .digg_button>a:active {
  124. box-shadow: inset 0 1px 0 rgba(0,0,0,.16);
  125. }
  126. /* All icons */
  127. .sd-content ul li a.sd-button:before {
  128. display: inline-block;
  129. -webkit-font-smoothing: antialiased;
  130. -moz-osx-font-smoothing: grayscale;
  131. font: normal 18px/1 'social-logos';
  132. vertical-align: top;
  133. text-align: center;
  134. }
  135. /* text + icon styles should have relative and top position */
  136. .sd-social-icon-text ul li a.sd-button:before {
  137. position: relative;
  138. top: 2px;
  139. }
  140. /* Make it look great in Chrome and Safari */
  141. @media screen and (-webkit-min-device-pixel-ratio:0) {
  142. .sd-content ul li a.sd-button:before {
  143. position: relative;
  144. top: 2px;
  145. }
  146. }
  147. .sd-social-official ul li a.sd-button:before {
  148. position: relative;
  149. top: -2px;
  150. }
  151. /* Make it look great in Chrome and Safari */
  152. @media screen and (-webkit-min-device-pixel-ratio:0) {
  153. .sd-social-official ul li a.sd-button:before {
  154. top: 0px;
  155. }
  156. }
  157. .sd-content ul li {
  158. margin: 0 5px 5px 0;
  159. padding: 0;
  160. }
  161. /* Add more pading on touch devices */
  162. .jp-sharing-input-touch .sd-content ul li { padding-left: 10px; }
  163. /* Text + icon & Official */
  164. .sd-social-icon-text .sd-content ul li a span,
  165. .sd-social-official .sd-content ul li a.sd-button span,
  166. .sd-content ul li.preview-item a.sd-button span {
  167. margin-left: 3px;
  168. }
  169. .sd-content ul li.preview-item.no-icon a.sd-button span {
  170. margin-left: 0;
  171. }
  172. /* Text only */
  173. .sd-social-text .sd-content ul li a:before,
  174. .sd-content ul li.no-icon a:before {
  175. display: none;
  176. }
  177. body .sd-social-text .sd-content ul li.share-custom a span,
  178. body .sd-content ul li.share-custom.no-icon a span {
  179. background-image: none;
  180. background-position: -500px -500px !important; /* hack to work around !important inline style */
  181. background-repeat: no-repeat !important;
  182. padding-left: 0;
  183. height: 0;
  184. line-height: inherit;
  185. }
  186. .sd-social-icon .sd-content ul li a.share-more {
  187. position: relative;
  188. top: -4px;
  189. }
  190. @media screen and (-webkit-min-device-pixel-ratio:0) {
  191. .sd-social-icon .sd-content ul li a.share-more {
  192. top: 2px;
  193. }
  194. }
  195. /* Firefox specific hack to make the share more button look better on Firefox. */
  196. @-moz-document url-prefix() {
  197. .sd-social-icon .sd-content ul li a.share-more {
  198. top: 2px;
  199. }
  200. }
  201. .sd-social-icon .sd-content ul li a.share-more span {
  202. margin-left: 3px;
  203. }
  204. /* Individual icons */
  205. .sd-social-icon .sd-content ul li.share-print a:before,
  206. .sd-social-text .sd-content ul li.share-print a:before,
  207. .sd-content ul li.share-print div.option.option-smart-off a:before,
  208. .sd-social-icon-text .sd-content li.share-print a:before,
  209. .sd-social-official .sd-content li.share-print a:before {
  210. content: '\f469';
  211. }
  212. .sd-social-icon .sd-content ul li.share-email a:before,
  213. .sd-social-text .sd-content ul li.share-email a:before,
  214. .sd-content ul li.share-email div.option.option-smart-off a:before,
  215. .sd-social-icon-text .sd-content li.share-email a:before,
  216. .sd-social-official .sd-content li.share-email a:before {
  217. content: '\f410';
  218. }
  219. .sd-social-icon .sd-content ul li.share-linkedin a:before,
  220. .sd-social-text .sd-content ul li.share-linkedin a:before,
  221. .sd-content ul li.share-linkedin div.option.option-smart-off a:before,
  222. .sd-social-icon-text .sd-content li.share-linkedin a:before {
  223. content: '\f207';
  224. }
  225. .sd-social-icon .sd-content ul li.share-twitter a:before,
  226. .sd-social-text .sd-content ul li.share-twitter a:before,
  227. .sd-content ul li.share-twitter div.option.option-smart-off a:before,
  228. .sd-social-icon-text .sd-content li.share-twitter a:before {
  229. content: '\f202';
  230. }
  231. .sd-social-icon .sd-content ul li.share-reddit a:before,
  232. .sd-social-text .sd-content ul li.share-reddit a:before,
  233. .sd-content ul li.share-reddit div.option.option-smart-off a:before,
  234. .sd-social-icon-text .sd-content li.share-reddit a:before {
  235. content: '\f222';
  236. }
  237. .sd-social-icon .sd-content ul li.share-tumblr a:before,
  238. .sd-social-text .sd-content ul li.share-tumblr a:before,
  239. .sd-content ul li.share-tumblr div.option.option-smart-off a:before,
  240. .sd-social-icon-text .sd-content li.share-tumblr a:before {
  241. content: '\f607';
  242. }
  243. .sd-social-icon .sd-content ul li.share-pocket a:before,
  244. .sd-social-text .sd-content ul li.share-pocket a:before,
  245. .sd-content ul li.share-pocket div.option.option-smart-off a:before,
  246. .sd-social-icon-text .sd-content li.share-pocket a:before {
  247. content: '\f224';
  248. }
  249. .sd-social-icon .sd-content ul li.share-pinterest a:before,
  250. .sd-social-text .sd-content ul li.share-pinterest a:before,
  251. .sd-content ul li.share-pinterest div.option.option-smart-off a:before,
  252. .sd-social-icon-text .sd-content li.share-pinterest a:before {
  253. content: '\f210';
  254. }
  255. .sd-social-icon .sd-content ul li.share-google-plus-1 a:before,
  256. .sd-social-text .sd-content ul li.share-google-plus-1 a:before,
  257. .sd-content ul li.share-google-plus-1 div.option.option-smart-off a:before,
  258. .sd-social-icon-text .sd-content li.share-google-plus-1 a:before {
  259. content: '\f218';
  260. }
  261. .sd-social-icon .sd-content ul li.share-facebook a:before,
  262. .sd-social-text .sd-content ul li.share-facebook a:before,
  263. .sd-content ul li.share-facebook div.option.option-smart-off a:before,
  264. .sd-social-icon-text .sd-content li.share-facebook a:before {
  265. content: '\f203';
  266. }
  267. .sd-social-icon .sd-content ul li.share-press-this a:before,
  268. .sd-social-text .sd-content ul li.share-press-this a:before,
  269. .sd-content ul li.share-press-this div.option.option-smart-off a:before,
  270. .sd-social-icon-text .sd-content li.share-press-this a:before,
  271. .sd-social-official .sd-content li.share-press-this a:before {
  272. content: '\f205';
  273. }
  274. .sd-social-official .sd-content li.share-press-this a:before {
  275. color: #2ba1cb;
  276. }
  277. .sd-social-icon .sd-content ul li.share-telegram a:before,
  278. .sd-social-text .sd-content ul li.share-telegram a:before,
  279. .sd-content ul li.share-telegram div.option.option-smart-off a:before,
  280. .sd-social-icon-text .sd-content li.share-telegram a:before,
  281. .sd-social-official .sd-content li.share-telegram a:before {
  282. content: '\f606';
  283. }
  284. .sd-social-official .sd-content li.share-telegram a:before {
  285. color: #0088cc;
  286. }
  287. .sd-social-icon .sd-content ul li.share-skype a:before,
  288. .sd-social-text .sd-content ul li.share-skype a:before,
  289. .sd-content ul li.share-skype div.option.option-smart-off a:before,
  290. .sd-social-icon-text .sd-content li.share-skype a:before {
  291. content: '\f220';
  292. }
  293. .sd-social-icon .sd-content ul a.share-more:before,
  294. .sd-social-text .sd-content ul a.share-more:before,
  295. .sd-content ul li.advanced a.share-more:before,
  296. .sd-social-icon-text .sd-content a.share-more:before,
  297. .sd-social-official .sd-content a.share-more:before {
  298. content: '\f415';
  299. }
  300. .sd-social-official .sd-content a.share-more:before {
  301. color: #2ba1cb;
  302. }
  303. .sd-social-icon .sd-content ul li.share-jetpack-whatsapp a:before,
  304. .sd-social-text .sd-content ul li.share-jetpack-whatsapp a:before,
  305. .sd-content ul li.share-jetpack-whatsapp div.option.option-smart-off a:before,
  306. .sd-social-icon-text .sd-content li.share-jetpack-whatsapp a:before,
  307. .sd-social-official .sd-content li.share-jetpack-whatsapp a:before {
  308. content: '\f608';
  309. }
  310. .sd-social-official .sd-content li.share-jetpack-whatsapp a:before {
  311. color: #43d854;
  312. }
  313. .sd-social-icon .sd-content ul li[class*='share-'].share-jetpack-whatsapp a.sd-button {
  314. background: #43d854;
  315. color: #fff !important;
  316. }
  317. /* Share count */
  318. .sd-social .sd-button .share-count {
  319. background: #2ea2cc;
  320. color: #fff;
  321. -moz-border-radius: 10px;
  322. border-radius: 10px;
  323. display: inline-block;
  324. text-align: center;
  325. font-size: 10px;
  326. padding: 1px 3px;
  327. line-height: 1;
  328. }
  329. /* Official buttons */
  330. .sd-social-official .sd-content ul, .sd-social-official .sd-content ul li {
  331. line-height: 25px !important;
  332. }
  333. .sd-social-official .sd-content>ul>li>a.sd-button span {
  334. line-height: 1;
  335. }
  336. .sd-social-official .sd-content ul:after {
  337. content: ".";
  338. display: block;
  339. height: 0;
  340. clear: both;
  341. visibility: hidden;
  342. }
  343. .sd-social-official .sd-content li.share-press-this a {
  344. margin: 0 0 5px 0;
  345. }
  346. .sd-social-official .sd-content ul>li {
  347. display: block;
  348. float: left;
  349. margin: 0 10px 5px 0 !important;
  350. height: 25px;
  351. }
  352. .sd-social-official .fb-share-button > span {
  353. vertical-align: top !important;
  354. }
  355. .sd-social-official .sd-content .pocket_button iframe {
  356. width: 98px;
  357. }
  358. /* Individual official buttons */
  359. .googleplus1_button .g-plus {
  360. vertical-align: top !important;
  361. }
  362. .reddit_button iframe {
  363. margin-top: 1px;
  364. }
  365. .pocket_button iframe, .googleplus1_button iframe, .pinterest_button, .twitter_button, .linkedin_button>span {
  366. margin: 0 !important;
  367. }
  368. .sd-social-official .sd-content .share-skype {
  369. width: 55px;
  370. }
  371. body .sd-social-official li.share-print ,
  372. body .sd-social-official li.share-email a,
  373. body .sd-social-official li.share-custom a,
  374. body .sd-social-official li a.share-more,
  375. body .sd-social-official li.share-digg a,
  376. body .sd-social-official li.share-press-this a
  377. {
  378. position: relative;
  379. top: 0;
  380. }
  381. /* Custom icons */
  382. body .sd-social-icon .sd-content li.share-custom>a {
  383. padding: 2px 3px 0 3px;
  384. position: relative;
  385. top: 4px;
  386. }
  387. body .sd-social-icon .sd-content li.share-custom a span,
  388. body .sd-social-icon-text .sd-content li.share-custom a span,
  389. body .sd-social-text .sd-content li.share-custom a span,
  390. body .sd-social-official .sd-content li.share-custom a span,
  391. body .sd-content ul li.share-custom a.share-icon span
  392. {
  393. background-size: 16px 16px;
  394. background-repeat: no-repeat;
  395. margin-left: 0;
  396. padding: 0 0 0 19px;
  397. display: inline-block;
  398. height: 21px;
  399. line-height: 16px;
  400. }
  401. body .sd-social-icon .sd-content li.share-custom a span {
  402. width: 0;
  403. }
  404. body .sd-social-icon .sd-content li.share-custom a span {
  405. padding-left: 16px !important;
  406. }
  407. /* Overflow Sharing dialog */
  408. .sharing-hidden .inner {
  409. position: absolute;
  410. z-index: 2;
  411. border: 1px solid #ccc;
  412. padding: 10px;
  413. background: #fff;
  414. box-shadow: 0px 5px 20px rgba(0,0,0,.2);
  415. -webkit-border-radius: 2px;
  416. -moz-border-radius: 2px;
  417. border-radius: 2px;
  418. margin-top: 5px;
  419. max-width: 400px;
  420. }
  421. .sharing-hidden .inner ul{
  422. margin: 0 !important;
  423. }
  424. .sd-social-official .sd-content .sharing-hidden ul>li.share-end {
  425. clear: both;
  426. margin: 0 !important;
  427. height: 0 !important;
  428. }
  429. .sharing-hidden .inner:before, .sharing-hidden .inner:after {
  430. position: absolute;
  431. z-index: 1;
  432. top: -8px;
  433. left: 20px;
  434. width: 0;
  435. height: 0;
  436. border-left: 6px solid transparent;
  437. border-right: 6px solid transparent;
  438. border-bottom: 8px solid #ccc;
  439. content: "";
  440. display: block;
  441. }
  442. .sharing-hidden .inner:after {
  443. z-index: 2;
  444. top: -7px;
  445. border-left: 6px solid transparent;
  446. border-right: 6px solid transparent;
  447. border-bottom: 8px solid #fff;
  448. }
  449. .sharing-hidden ul {
  450. margin: 0;
  451. }
  452. /**
  453. * Special colorful look for "Icon Only" option
  454. */
  455. .sd-social-icon .sd-content ul li[class*='share-'] a,
  456. .sd-social-icon .sd-content ul li[class*='share-'] a:hover,
  457. .sd-social-icon .sd-content ul li[class*='share-'] div.option a {
  458. border-radius: 50%;
  459. -webkit-border-radius: 50%;
  460. border: 0;
  461. box-shadow: none;
  462. padding: 7px;
  463. position: relative;
  464. top: -2px;
  465. line-height: 1;
  466. width: auto;
  467. height: auto;
  468. margin-bottom: 0;
  469. }
  470. .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button>span,
  471. .sd-social-icon .sd-content ul li[class*='share-'] div.option a span {
  472. line-height: 1;
  473. }
  474. .sd-social-icon .sd-content ul li[class*='share-'] a:hover,
  475. .sd-social-icon .sd-content ul li[class*='share-'] div.option a:hover {
  476. border: none;
  477. opacity: .6;
  478. }
  479. .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button:before {
  480. top: 1px;
  481. top: 0px\9; /* IE8 and below */
  482. }
  483. .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button.share-custom {
  484. padding: 8px 8px 6px 8px;
  485. top: 5px;
  486. }
  487. .sd-social-icon .sd-content ul li a.sd-button.share-more {
  488. margin-left: 10px;
  489. }
  490. .sd-social-icon .sd-content ul li:first-child a.sd-button.share-more {
  491. margin-left: 0;
  492. }
  493. .sd-social-icon .sd-button span.share-count {
  494. position: absolute;
  495. bottom: 0;
  496. right: 0;
  497. border-radius: 0;
  498. background: #555;
  499. font-size: 9px;
  500. }
  501. /* Special look colors */
  502. .sd-social-icon .sd-content ul li[class*='share-'] a.sd-button {
  503. background: #e9e9e9;
  504. margin-top: 2px;
  505. text-indent: 0;
  506. }
  507. .sd-social-icon .sd-content ul li[class*='share-'].share-tumblr a.sd-button {
  508. background: #2c4762;
  509. color: #fff !important;
  510. }
  511. .sd-social-icon .sd-content ul li[class*='share-'].share-facebook a.sd-button {
  512. background: #3b5998;
  513. color: #fff !important;
  514. }
  515. .sd-social-icon .sd-content ul li[class*='share-'].share-twitter a.sd-button {
  516. background: #00acee;
  517. color: #fff !important;
  518. }
  519. .sd-social-icon .sd-content ul li[class*='share-'].share-pinterest a.sd-button {
  520. background: #ca1f27;
  521. color: #fff !important;
  522. }
  523. .sd-social-icon .sd-content ul li[class*='share-'].share-digg a.sd-button {
  524. color: #555555 !important;
  525. }
  526. .sd-social-icon .sd-content ul li[class*='share-'].share-press-this a.sd-button {
  527. background: #1e8cbe;
  528. color: #fff !important;
  529. }
  530. .sd-social-icon .sd-content ul li[class*='share-'].share-telegram a.sd-button {
  531. background: #0088cc;
  532. color: #fff !important;
  533. }
  534. .sd-social-icon .sd-content ul li[class*='share-'].share-linkedin a.sd-button {
  535. background: #0077b5;
  536. color: #fff !important;
  537. }
  538. .sd-social-icon .sd-content ul li[class*='share-'].share-google-plus-1 a.sd-button {
  539. background: #dd4b39;
  540. color: #fff !important;
  541. }
  542. .sd-social-icon .sd-content ul li[class*='share-'].share-pocket a.sd-button {
  543. background: #ee4056;
  544. color: #fff !important;
  545. }
  546. .sd-social-icon .sd-content ul li[class*='share-'].share-reddit a.sd-button {
  547. background: #cee3f8;
  548. color: #555555 !important;
  549. }
  550. .sd-social-icon .sd-content ul li[class*='share-'].share-skype a.sd-button {
  551. background: #00AFF0;
  552. color: #fff !important;
  553. }
  554. /**
  555. * Screen Reader Text for "Icon Only" option
  556. */
  557. .sharing-screen-reader-text {
  558. clip: rect(1px, 1px, 1px, 1px);
  559. position: absolute !important;
  560. height: 1px;
  561. width: 1px;
  562. overflow: hidden;
  563. }
  564. .sharing-screen-reader-text:hover,
  565. .sharing-screen-reader-text:active,
  566. .sharing-screen-reader-text:focus {
  567. background-color: #f1f1f1;
  568. border-radius: 3px;
  569. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  570. clip: auto !important;
  571. color: #21759b;
  572. display: block;
  573. font-size: 14px;
  574. font-weight: bold;
  575. height: auto;
  576. left: 5px;
  577. line-height: normal;
  578. padding: 15px 23px 14px;
  579. text-decoration: none;
  580. top: 5px;
  581. width: auto;
  582. z-index: 100000; /* Above WP toolbar */
  583. }
  584. /**
  585. * Sharing Email Dialog
  586. */
  587. #sharing_email {
  588. width: 342px;
  589. position: absolute;
  590. z-index: 1001;
  591. border: 1px solid #ccc;
  592. padding: 15px;
  593. background: #fff;
  594. box-shadow: 0px 5px 20px rgba(0,0,0,.2);
  595. text-align: left;
  596. }
  597. div.sharedaddy.sharedaddy-dark #sharing_email {
  598. border-color: #fff;
  599. }
  600. #sharing_email .errors {
  601. color: #fff;
  602. background-color: #771a09;
  603. font-size: 12px;
  604. padding: 5px 8px;
  605. line-height: 1;
  606. margin: 10px 0 0 0;
  607. }
  608. #sharing_email label {
  609. font-size: 12px;
  610. color: #333;
  611. font-weight: bold;
  612. display: block;
  613. padding: 0 0 4px 0;
  614. text-align: left;
  615. text-shadow: none;
  616. }
  617. #sharing_email form {
  618. margin: 0;
  619. }
  620. #sharing_email input[type="text"], #sharing_email input[type="email"] {
  621. width: 100%;
  622. box-sizing: border-box;
  623. -moz-box-sizing:border-box;
  624. -webkit-box-sizing:border-box;
  625. border: 1px solid #ccc;
  626. margin-bottom: 1em;
  627. background: #fff;
  628. font-size: 12px;
  629. color: #333;
  630. max-width: none;
  631. padding: 1px 3px;
  632. }
  633. #jetpack-source_f_name {
  634. display: none!important;
  635. position: absolute !important;
  636. left: -9000px;
  637. }
  638. #sharing_email .sharing_cancel {
  639. padding: 0 0 0 1em;
  640. font-size: 12px;
  641. text-shadow: none;
  642. }
  643. #sharing_email .recaptcha {
  644. width: 312px;
  645. height: 123px;
  646. margin: 0 0 1em 0;
  647. }