style-wpcom.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633
  1. /*--------------------------------------------------------------
  2. # Comments
  3. --------------------------------------------------------------*/
  4. #comments #respond {
  5. font-family: inherit;
  6. font-weight: inherit;
  7. margin: 0;
  8. padding: 0;
  9. }
  10. #comments #respond h3 {
  11. margin: 0 auto 30px;
  12. }
  13. #comments #respond form {
  14. background: transparent;
  15. }
  16. #comment-form-comment {
  17. margin-bottom: 30px;
  18. }
  19. #comments #respond #comment-form-comment,
  20. #comments #comment-form-share-text-padder,
  21. #comments #respond .comment-form-fields div.comment-form-input {
  22. background: #fff;
  23. border: 1px solid #ddd;
  24. border-radius: 0;
  25. box-shadow: none !important;
  26. transition-duration: 350ms;
  27. }
  28. #comments #respond .comment-form-fields div.comment-form-input {
  29. margin-bottom: 15px;
  30. }
  31. #comments .comment #respond #comment-form-comment,
  32. #comments .comment #comment-form-share-text-padder,
  33. #comments .comment #respond .comment-form-fields div.comment-form-input {
  34. background: #fff;
  35. }
  36. #comments #respond #comment-form-subscribe {
  37. line-height: 1.5 !important;
  38. margin-bottom: 30px;
  39. margin-top: 0;
  40. }
  41. #comments #respond .comment-form-fields p.comment-form-posting-as,
  42. #comments #respond .comment-form-fields p.comment-form-log-out,
  43. #comments #respond #comment-form-identity #comment-form-nascar p,
  44. #comments #respond #comment-form-load-service p,
  45. #comments #respond #comment-form-comment textarea,
  46. #comments #comment-form-share-text-padder textarea,
  47. #comments #respond .comment-form-fields label,
  48. #comments #respond .comment-form-fields label span.required,
  49. #comments #respond .comment-form-fields label span.nopublish,
  50. #comments #respond .comment-form-fields div.comment-form-input input {
  51. color: #222;
  52. text-shadow: none;
  53. }
  54. #comments #respond .comment-form-fields p.comment-form-posting-as,
  55. #comments #respond .comment-form-fields p.comment-form-log-out {
  56. padding-top: 0;
  57. }
  58. #comments #respond #comment-form-comment.active,
  59. #comments #respond .comment-form-fields div.comment-form-input.active {
  60. box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.075) !important;
  61. }
  62. #comments #respond form *,
  63. #comments #respond #comment-form-comment textarea,
  64. #comments #comment-form-share-text-padder textarea,
  65. #comments #respond p.comment-subscription-form label {
  66. font-size: inherit !important;
  67. line-height: inherit !important;
  68. }
  69. #comments #respond #comment-form-load-service {
  70. height: auto;
  71. }
  72. #comments #respond #comment-form-load-service p {
  73. background: transparent;
  74. padding-top: 0;
  75. }
  76. #comments #respond .comment-form-service {
  77. background: transparent;
  78. border-bottom: 0;
  79. padding: 0 0 15px;
  80. }
  81. #comments #respond .comment-form-service a {
  82. color: #3863c1;
  83. text-decoration: none;
  84. }
  85. #comments #respond .comment-form-service a:active,
  86. #comments #respond .comment-form-service a:focus,
  87. #comments #respond .comment-form-service a:hover {
  88. color: #222;
  89. }
  90. #comments #respond .comment-form-padder {
  91. padding: 0;
  92. }
  93. #comments #respond .form-submit {
  94. font-size: inherit !important;
  95. line-height: 1.5 !important;
  96. padding: 0 0 30px;
  97. }
  98. #comments .comment #respond .form-submit {
  99. padding-bottom: 24px;
  100. }
  101. #comments #respond p.form-submit input#comment-submit {
  102. background: #3863c1 !important;
  103. border: 2px solid #3863c1 !important;
  104. border-radius: 0 !important;
  105. color: #fff !important;
  106. font-family: Lato, sans-serif;
  107. font-size: inherit !important;
  108. font-weight: bold !important;
  109. line-height: 1.875 !important;
  110. padding: 5.5px 13px !important;
  111. text-shadow: none !important;
  112. }
  113. #comments #respond .form-submit input#comment-submit:active,
  114. #comments #respond .form-submit input#comment-submit:focus,
  115. #comments #respond .form-submit input#comment-submit:hover {
  116. background: #fff !important;
  117. color: #3863c1 !important;
  118. }
  119. #comments #respond .comment-form-fields div.comment-form-field {
  120. margin: 2px 0 5px 0;
  121. }
  122. #comments #respond #comment-form-identity {
  123. border-top: 0;
  124. margin-top: -5px;
  125. }
  126. #comments #respond #comment-form-identity #comment-form-nascar {
  127. background: transparent;
  128. }
  129. #comments #respond #comment-form-identity #comment-form-nascar p {
  130. margin: 0;
  131. padding: 0;
  132. }
  133. #comments #respond #comment-form-identity #comment-form-nascar ul {
  134. margin: 0 0 0 15px;
  135. }
  136. #comments #respond #comment-form-identity #comment-form-nascar ul li {
  137. padding: 3px;
  138. }
  139. .rtl #comments #respond #comment-form-identity #comment-form-nascar ul {
  140. margin-left: 0;
  141. margin-right: auto;
  142. }
  143. #comments #respond.js .comment-form-fields label {
  144. top: 6px;
  145. }
  146. #comments #respond .comment-form-fields {
  147. margin-left: 39px;
  148. }
  149. .rtl #comments #respond .comment-form-fields {
  150. margin-left: auto;
  151. margin-right: 39px;
  152. }
  153. #comments #respond .comment-form-avatar img {
  154. border: 0;
  155. border-radius: 50%;
  156. padding: 0;
  157. width: 24px;
  158. }
  159. /*--------------------------------------------------------------
  160. # Reblogger
  161. --------------------------------------------------------------*/
  162. .hentry .wpcom-reblog-snapshot .reblogger-note {
  163. border-bottom-color: #eee;
  164. margin-bottom: 30px;
  165. overflow: inherit;
  166. padding-bottom: 0;
  167. }
  168. .hentry .wpcom-reblog-snapshot p.reblogger-headline {
  169. line-height: inherit;
  170. margin-bottom: 30px;
  171. }
  172. .reblog-from img,
  173. .reblogger-headline img {
  174. border-radius: 50%;
  175. height: 30px;
  176. width: 30px;
  177. }
  178. body .hentry .wpcom-reblog-snapshot .reblogger-note-content blockquote {
  179. margin: 0 auto 30px;
  180. font-style: italic;
  181. }
  182. /*--------------------------------------------------------------
  183. # Stats & Robots
  184. --------------------------------------------------------------*/
  185. img#wpstats {
  186. position: absolute;
  187. top: -999em;
  188. }
  189. /*--------------------------------------------------------------
  190. # Widgets
  191. --------------------------------------------------------------*/
  192. /* About.me */
  193. .aboutme_widget #am_thumbnail {
  194. margin-bottom: 30px;
  195. }
  196. .aboutme_widget #am_thumbnail a,
  197. .aboutme_widget #am_thumbnail img {
  198. display: block;
  199. }
  200. .aboutme_widget #am_thumbnail img {
  201. border: 0;
  202. max-width: 100%;
  203. }
  204. .aboutme_widget #am_name {
  205. font-size: 25px;
  206. line-height: 1.2;
  207. margin-bottom: 30px;
  208. }
  209. .aboutme_widget #am_name a {
  210. font-size: inherit !important;
  211. }
  212. .aboutme_widget #am_headline {
  213. font-size: 20px;
  214. line-height: 1.5;
  215. margin-bottom: 0;
  216. }
  217. .aboutme_widget #am_bio {
  218. margin-bottom: 30px;
  219. }
  220. .aboutme_widget #am_bio p {
  221. margin-bottom: 0;
  222. }
  223. .aboutme_widget #am_services {
  224. padding-bottom: 26px;
  225. }
  226. .aboutme_widget #am_services a.am_service_icon {
  227. display: inline-block;
  228. line-height: 0;
  229. margin-bottom: 4px;
  230. }
  231. .aboutme_widget #am_services a.am_service_icon img {
  232. margin-bottom: 0;
  233. }
  234. /* Akismet */
  235. .widget_akismet_widget .a-stats {
  236. display: inline-block;
  237. font-family: Lato, sans-serif;
  238. font-size: 14px;
  239. line-height: 1.07143;
  240. margin-bottom: 30px;
  241. text-transform: uppercase;
  242. }
  243. .widget_akismet_widget .a-stats a,
  244. .widget_akismet_widget .a-stats .count {
  245. font-size: inherit;
  246. font-weight: bold;
  247. line-height: inherit;
  248. }
  249. .widget_akismet_widget .a-stats a {
  250. background: #3863c1;
  251. border: 2px solid #3863c1;
  252. border-radius: 0;
  253. color: #fff;
  254. padding: 5.5px 13px;
  255. }
  256. .widget_akismet_widget .a-stats a:active,
  257. .widget_akismet_widget .a-stats a:focus,
  258. .widget_akismet_widget .a-stats a:hover {
  259. background: #fff;
  260. color: #3863c1;
  261. }
  262. .widget_akismet_widget .a-stats .count {
  263. color: inherit;
  264. padding: 0;
  265. }
  266. .widget_akismet_widget .a-stats a:active .count,
  267. .widget_akismet_widget .a-stats a:focus .count,
  268. .widget_akismet_widget .a-stats a:hover .count {
  269. color: #3863c1;
  270. }
  271. /* Authors */
  272. .widget_authors ul ul {
  273. margin-left: 0;
  274. }
  275. .rtl .widget_authors ul ul {
  276. margin-right: 0;
  277. }
  278. .widget_authors img {
  279. border-radius: 50%;
  280. margin-right: 15px;
  281. vertical-align: middle;
  282. }
  283. .rtl .widget_authors img {
  284. margin-right: 0;
  285. margin-left: 15px;
  286. }
  287. .widget_authors > ul > li > a {
  288. color: #222;
  289. font-family: Lato, sans-serif;
  290. }
  291. .widget_authors > ul > li > a:active,
  292. .widget_authors > ul > li > a:focus,
  293. .widget_authors > ul > li > a:hover {
  294. color: #3863c1;
  295. }
  296. /* Flickr */
  297. .widget_flickr #flickr_badge_uber_wrapper,
  298. .widget_flickr #flickr_badge_wrapper {
  299. background: transparent;
  300. border: 0;
  301. }
  302. .widget_flickr #flickr_badge_wrapper {
  303. margin: 0;
  304. }
  305. .widget_flickr #flickr_badge_uber_wrapper {
  306. margin: 0 0 25px;
  307. }
  308. .widget_flickr br {
  309. display: none;
  310. }
  311. .widget_flickr br:last-of-type {
  312. clear: both;
  313. display: inline;
  314. }
  315. .widget_flickr td {
  316. border: 0;
  317. padding: 0;
  318. text-align: left;
  319. }
  320. .rtl .widget_flickr td {
  321. text-align: right;
  322. }
  323. .widget_flickr a,
  324. .widget_flickr img {
  325. display: block;
  326. }
  327. .widget_flickr a {
  328. border-bottom: 0;
  329. float: left;
  330. height: 60px;
  331. margin-bottom: 5px;
  332. margin-right: 5px;
  333. overflow: hidden;
  334. }
  335. .rtl .widget_flickr a {
  336. float: right;
  337. margin-left: 5px;
  338. margin-right: 0;
  339. }
  340. .widget_flickr .flickr-size-small a {
  341. height: 90px;
  342. }
  343. .widget_flickr a img {
  344. height: 100%;
  345. }
  346. .widget_flickr #flickr_badge_uber_wrapper td a:last-child {
  347. background: #3863c1 !important;
  348. border: 2px solid #3863c1;
  349. clear: both;
  350. color: #fff;
  351. display: inline-block;
  352. height: auto;
  353. float: none;
  354. font-family: Lato, sans-serif;
  355. font-weight: bold;
  356. padding: 5.5px 13px;
  357. margin-right: 0;
  358. text-transform: uppercase;
  359. transition: all 350ms ease-in-out;
  360. width: auto;
  361. }
  362. .widget_flickr #flickr_badge_uber_wrapper td a:last-child:active,
  363. .widget_flickr #flickr_badge_uber_wrapper td a:last-child:focus,
  364. .widget_flickr #flickr_badge_uber_wrapper td a:last-child:hover {
  365. background: #fff !important;
  366. color: #3863c1;
  367. }
  368. /* Follow Blog */
  369. .widget_blog_subscription > div {
  370. background: transparent !important;
  371. border: 0 !important;
  372. color: inherit !important;
  373. margin: 0 0 30px !important;
  374. padding: 0 !important;
  375. }
  376. .widget_blog_subscription input[type="text"] {
  377. padding: 7.5px !important;
  378. width: 100% !important;
  379. }
  380. /* Gravatar */
  381. .widget_gravatar img {
  382. vertical-align: middle;
  383. }
  384. /* Grid */
  385. .widgets-grid-layout,
  386. .widgets-multi-column-grid {
  387. margin-bottom: 26px;
  388. }
  389. .widgets-grid-layout a,
  390. .widgets-multi-column-grid a {
  391. border-bottom: 0;
  392. line-height: 0;
  393. }
  394. /* I Voted */
  395. .widget_i_voted img {
  396. margin-bottom: 30px;
  397. }
  398. /* Instagram */
  399. .widget_wpcom_instagram_widget a,
  400. .widget_wpcom_instagram_widget img {
  401. display: block;
  402. }
  403. .widget_wpcom_instagram_widget a {
  404. border-bottom: 0;
  405. }
  406. .widget_wpcom_instagram_widget > div {
  407. margin-bottom: 30px;
  408. }
  409. .widget_wpcom_instagram_widget .wpcom-instagram-columns-1 img,
  410. .widget_wpcom_instagram_widget .wpcom-instagram-columns-2 img,
  411. .widget_wpcom_instagram_widget .wpcom-instagram-columns-3 img {
  412. margin: 0;
  413. }
  414. /* Internet Defense League */
  415. .widget_internet_defense_league_widget a,
  416. .widget_internet_defense_league_widget img {
  417. display: block;
  418. }
  419. .widget_internet_defense_league_widget a {
  420. border-bottom: 0;
  421. }
  422. /* Lists */
  423. .widget_authors ul,
  424. .widget_jp_blogs_i_follow ol,
  425. .widget_blog-stats ul,
  426. .widget_top-clicks ul,
  427. .widget_top-posts ul,
  428. .widget.top_rated ul,
  429. .widget_upcoming_events_widget ul {
  430. border-bottom: 1px solid #eee;
  431. list-style: none;
  432. margin-left: 0;
  433. }
  434. .rtl .widget_authors ul,
  435. .rtl .widget_jp_blogs_i_follow ol,
  436. .rtl .widget_blog-stats ul,
  437. .rtl .widget_top-clicks ul,
  438. .rtl .widget_top-posts ul,
  439. .rtl .widget.top_rated ul,
  440. .rtl .widget_upcoming_events_widget ul {
  441. margin-right: 0;
  442. }
  443. .widget_authors li,
  444. .widget_jp_blogs_i_follow li,
  445. .widgets-list-layout li,
  446. .widget_top-clicks li,
  447. .widget_top-posts li,
  448. .widget.top_rated li,
  449. .widget_upcoming_events_widget li {
  450. border-top: 1px solid #eee;
  451. padding-bottom: 7.5px;
  452. padding-top: 7.5px;
  453. }
  454. .widget_authors ul ul {
  455. border-bottom: 0;
  456. margin-bottom: -7.5px;
  457. margin-top: 7.5px;
  458. padding-left: 30px;
  459. }
  460. .rtl .widget_authors ul ul {
  461. padding-left: 0;
  462. padding-right: 30px;
  463. }
  464. /* List Layout */
  465. .widget .widgets-list-layout {
  466. margin-bottom: 30px;
  467. }
  468. .widget .widgets-list-layout li {
  469. margin-bottom: 0;
  470. }
  471. .widget .widgets-list-layout span {
  472. display: block;
  473. opacity: 1;
  474. }
  475. /* Milestone */
  476. .milestone-widget .milestone-content {
  477. line-height: inherit;
  478. margin: 0 0 30px;
  479. }
  480. .milestone-widget .milestone-header {
  481. background: #3863c1;
  482. font-family: Lato, sans-serif;
  483. line-height: inherit;
  484. padding: 15px;
  485. }
  486. .milestone-widget .milestone-header .event {
  487. font-size: inherit;
  488. line-height: inherit;
  489. }
  490. /* Recent Comments */
  491. .widget_recent_comments table {
  492. background: transparent;
  493. border: 0;
  494. border-top: 1px solid #eee;
  495. margin-bottom: 30px;
  496. }
  497. .widget_recent_comments tr,
  498. .widget_recent_comments td {
  499. border: 0;
  500. border-bottom: 1px solid #eee;
  501. }
  502. .widget_recent_comments td.recentcommentsavatarend,
  503. .widget_recent_comments td.recentcommentsavatartop,
  504. .widget_recent_comments td.recentcommentstextend {
  505. padding: 7.5px 0;
  506. vertical-align: middle;
  507. }
  508. .widget_recent_comments td.recentcommentstextend {
  509. padding-left: 15px;
  510. }
  511. .rtl .widget_recent_comments td.recentcommentstextend {
  512. padding-left: 0;
  513. padding-right: 15px;
  514. }
  515. .widget_recent_comments td.recentcommentsavatarend a {
  516. border-bottom: 0;
  517. }
  518. .widget_recent_comments td.recentcommentstexttop {
  519. padding: 15px 0 15px 15px;
  520. }
  521. .rtl .widget_recent_comments td.recentcommentstexttop {
  522. padding: 15px 15px 15px 0;
  523. }
  524. .widget_recent_comments img {
  525. border-radius: 50%;
  526. vertical-align: middle;
  527. }
  528. /* Recent Images */
  529. .widget_recent_images .recent_images {
  530. margin-bottom: 25px;
  531. }
  532. .widget_recent_images .recent_images a,
  533. .widget_recent_images .recent_images img {
  534. display: inline-block;
  535. line-height: 0;
  536. }
  537. .widget_recent_images .recent_images a {
  538. border-bottom: 0;
  539. }
  540. /* Tag Cloud */
  541. .wp_widget_tag_cloud > div {
  542. padding-bottom: 18px;
  543. }
  544. .wp_widget_tag_cloud a {
  545. font-size: inherit !important;
  546. line-height: 1.5;
  547. text-decoration: none;
  548. }
  549. .wp_widget_tag_cloud a:before {
  550. color: #222;
  551. content: "\0023";
  552. margin-right: 0.125em;
  553. }
  554. /* Top Rated */
  555. .widget.top_rated .pd_top_rated_holder_posts {
  556. margin-bottom: 30px;
  557. }
  558. .widget.top_rated .pd_top_rated_holder_posts > p {
  559. border: 1px solid #ddd;
  560. font-family: Lato, sans-serif;
  561. margin-bottom: -1px;
  562. padding: 15px;
  563. text-align: center;
  564. }
  565. .widget.top_rated ul {
  566. border: 1px solid #ddd;
  567. border-top: 0;
  568. margin-bottom: 0;
  569. padding: 15px;
  570. }
  571. .widget.top_rated li:first-child {
  572. border-top: 0;
  573. padding-top: 0;
  574. }
  575. .widget.top_rated li:last-child {
  576. padding-bottom: 0;
  577. }
  578. /* Upcoming Events */
  579. .widget_upcoming_events_widget .upcoming-events li {
  580. margin-bottom: 0;
  581. }
  582. /*--------------------------------------------------------------
  583. # Follow
  584. --------------------------------------------------------------*/
  585. #bitsubscribe input[type=text],
  586. #bitsubscribe input[type=email] {
  587. color: #000;
  588. }
  589. /*--------------------------------------------------------------
  590. # Responsive
  591. --------------------------------------------------------------*/
  592. /*--------------------------------------------------------------
  593. ## x >= 450px
  594. --------------------------------------------------------------*/
  595. @media screen and (min-width: 450px) {
  596. /* Comments */
  597. #comments #respond .comment-form-fields label,
  598. #respond.js .comment-form-fields label {
  599. padding-bottom: 10px !important;
  600. }
  601. }
  602. /*--------------------------------------------------------------
  603. ## x >= 600px
  604. --------------------------------------------------------------*/
  605. @media screen and (min-width: 600px) {
  606. /* Comments */
  607. #comments #respond {
  608. margin-bottom: 30px;
  609. }
  610. }