API tools faq
paste
KudosInc

/r/Homespun Reddit Theme

KudosInc
Mar 1st, 2018
15,733
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.52 KB | None | 0 0
raw download clone embed print report
  1. /*
  2.  
  3.  
  4. _ _ _____ __ __ _____ _____ _____ _ _ __ _
  5. | | | | | _ | | | | | | ___| | ___| | _ | | | | | | | | |
  6. | |_| | | | | | | | | | | | | |___ | |___ | |_| | | | | | | | | | |
  7. | _ | | | | | | | | | | | ___| |___ | | ___| | | | | | | -- | |
  8. | | | | | |_| | | | | | | |___ ___| | | | | |_| | | | | | |
  9. |_| |_| |_____| |_| |_| |_____| |_____| |_| |_____| |_| |__|
  10.  
  11. ________________________
  12. | |
  13. | a reddit theme |
  14. | by /u/KudosInc |
  15. | --- |
  16. | 1/3/2018 |
  17. |________________________|
  18.  
  19.  
  20. */
  21.  
  22.  
  23.  
  24. /***********
  25. MISC.
  26. **********/
  27.  
  28.  
  29. .md a:hover {
  30. text-decoration: underline;
  31. }
  32.  
  33. body {
  34. background-color: #f6f6f6;
  35. }
  36.  
  37. body > .content {
  38. margin-top: 12px;
  39. margin-left: 12px;
  40. }
  41.  
  42. button {
  43. background: #eaeaea;
  44. border: 1px solid #ccc;
  45. padding: 4px 10px;
  46. border-radius: 2px;
  47. }
  48.  
  49. button:hover {
  50. background: #e6e6e6;
  51. border: 1px solid #a6a6a6;
  52. }
  53.  
  54. #stylesheet_contents {
  55. width: 95%;
  56. margin-left: 2%;
  57. }
  58.  
  59. ::selection {
  60. background-color: #5ea6ed;
  61. color: #fff;
  62. }
  63.  
  64. body::-webkit-scrollbar {
  65. width: 1em;
  66. }
  67.  
  68. body::-webkit-scrollbar-track {
  69. -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  70. }
  71.  
  72. body::-webkit-scrollbar-thumb {
  73. background-color: darkgrey;
  74. outline: 1px solid slategrey;
  75. }
  76.  
  77.  
  78.  
  79. /***********
  80. USERBAR
  81. **********/
  82.  
  83.  
  84.  
  85. #header-bottom-right a:hover {
  86. text-decoration: underline;
  87. }
  88.  
  89. #header-bottom-right,
  90. .res #header-bottom-right {
  91. position: absolute;
  92. right: 0px;
  93. top: 184px;
  94. background-color: white;
  95. border: 0;
  96. border-radius: 0px;
  97. padding: 5px 12px;
  98. line-height: 22px;
  99. height: 22px;
  100. padding: 5px 10px;
  101. text-align: center;
  102. }
  103.  
  104. #header-bottom-right a,
  105. #header-bottom-right .user,
  106. #header-bottom-right .separator {
  107. color: #666;
  108. font-size: 14px;
  109. font-family: "Segoe UI", sans-serif;
  110. font-weight: normal;
  111. line-height: 17px;
  112. }
  113.  
  114. #header-bottom-right a:hover {
  115. text-decoration: none;
  116. color: black;
  117. }
  118.  
  119. #header-bottom-right .separator {
  120. color: #777;
  121. }
  122.  
  123. #header-bottom-right .user .userkarma {
  124. display: none;
  125. }
  126.  
  127. #header-bottom-right .user {
  128. font-size: 0px!important;
  129. }
  130.  
  131. #header-bottom-right #RESAccountSwitcherIcon {
  132. position: relative;
  133. bottom: 3px;
  134. }
  135.  
  136.  
  137.  
  138. /***********
  139. TOP NAVBAR
  140. **********/
  141.  
  142.  
  143.  
  144. #sr-header-area {
  145. background: #f0f0f0;
  146. border-bottom: none;
  147. }
  148.  
  149. #sr-header-area a {
  150. color: #373737;
  151. }
  152.  
  153.  
  154.  
  155. /***********
  156. COMMENTS PAGE AUTHOR TAG
  157. **********/
  158.  
  159.  
  160.  
  161. .res .thing .tagline .author.submitter {
  162. background-color: transparent!important;
  163. color: blue!important;
  164. }
  165.  
  166. .res .thing .tagline .author.moderator {
  167. background-color: transparent!important;
  168. color: green!important;
  169. }
  170.  
  171. .res .thing .tagline .author.submitter:hover,
  172. .res .thing .tagline .author.moderator:hover {
  173. background-color: transparent!important;
  174. }
  175.  
  176.  
  177.  
  178. /***********
  179. POSTS (LINKS)
  180. **********/
  181.  
  182.  
  183. .link {
  184. margin: 0px 335px 10px 0px;
  185. background-color: #fff;
  186. border: 1px solid #f4f4f4;
  187. border-left: 4px solid #e6e6e6;
  188. box-shadow: 0px 1px 2px rgba(0,0,0,0.03);
  189. border-radius: 2px;
  190. }
  191.  
  192. .link.last-clicked {
  193. border: 0;
  194. border-left: 4px solid #ccc;
  195. }
  196.  
  197. .link .entry {
  198. padding: 15px;
  199. }
  200.  
  201. .nsfw-stamp {
  202. border: 0;
  203. background-color: transparent;
  204. color: #ff8080;
  205. font-weight: bold;
  206. }
  207.  
  208. .spoiler-stamp {
  209. border: 0;
  210. background-color: transparent;
  211. color: #9cb3c9;
  212. font-weight: bold;
  213. }
  214.  
  215. .link .thumbnail.self {
  216. margin-top: 15px;
  217. margin-left: 8px;
  218. background-color: #eee;
  219. background-image: none;
  220. height: 60px;
  221. width: 60px;
  222. border-radius: 30px;
  223. }
  224.  
  225. .link .thumbnail.self:after {
  226. content: "TEXT";
  227. }
  228.  
  229. .link .thumbnail img {
  230. margin-top: 15px;
  231. margin-left: 8px;
  232. height: 60px;
  233. width: 60px;
  234. border-radius: 30px;
  235. }
  236.  
  237. .thing.stickied .thumbnail.self {
  238. background-color: #69c9bb;
  239. }
  240.  
  241. .thing.stickied .thumbnail.self:after {
  242. content: "STICKY";
  243. color: #fff;
  244. margin-left: 7px;
  245. }
  246.  
  247. .link .thumbnail.self:after,
  248. .link .thumbnail.nsfw:after,
  249. .link .thumbnail.spoiler:after {
  250. font-family: "Segoe UI", "Arial", sans-serif;
  251. font-weight: bold;
  252. letter-spacing: 0.5px;
  253. font-size: 13px;
  254. color: #bfbfbf;
  255. line-height: 60px;
  256. margin-left: 13px;
  257. }
  258.  
  259. .link .thumbnail.nsfw,
  260. .link .thumbnail.spoiler {
  261. margin-top: 14px;
  262. margin-left: 8px;
  263. background-image: none;
  264. height: 60px;
  265. width: 60px;
  266. border-radius: 30px;
  267. }
  268.  
  269. .link .thumbnail.nsfw {
  270. background-color: #ff8080;
  271. }
  272.  
  273. .link .thumbnail.spoiler {
  274. background-color: #9cb3c9;
  275. }
  276.  
  277. .link .thumbnail.nsfw:after {
  278. content: "NSFW";
  279. color: #fff;
  280. margin-left: 11px;
  281. }
  282.  
  283. .link .thumbnail.spoiler:after {
  284. content: "SPOILER";
  285. color: #fff;
  286. margin-left: 2px;
  287. }
  288.  
  289. .link .expando-button {
  290. background-color: #e1e1e1;
  291. background-image: none!important;
  292. border: 2px solid #fff;
  293. position: absolute;
  294. margin-left: -50px;
  295. margin-top: 10px;
  296. height: 20px;
  297. width: 20px;
  298. border-radius: 20px;
  299. }
  300.  
  301. .link .expando-button.expanded {
  302. background-color: #ccc;
  303. }
  304.  
  305. .thing.stickied .expando-button {
  306. background-color: #b4e4dd;
  307. }
  308.  
  309. .thing.stickied .expando-button.expanded {
  310. background-color: #8fd6cc;
  311. }
  312.  
  313. #progressIndicator,
  314. .NERPageMarker {
  315. border: 1px solid #e1e1e1;
  316. background-color: #f0f0f0;
  317. border-radius: 0px;
  318. margin: 10px 335px 10px 0px;
  319. border-radius: 2px;
  320. }
  321.  
  322. .link .midcol {
  323. position: relative;
  324. top: 20px;
  325. }
  326.  
  327. .link .rank,
  328. .domain {
  329. display: none;
  330. }
  331.  
  332. .link .usertext-body .md {
  333. border: none;
  334. border-radius: 0px;
  335. background: transparent;
  336. padding: 10px;
  337. }
  338.  
  339. .link .entry .buttons li a,
  340. .link .tagline {
  341. color: #999;
  342. font-weight: 100;
  343. font-size: x-small;
  344. }
  345.  
  346. .link .entry .buttons li a:hover {
  347. text-decoration: none;
  348. color: #333;
  349. }
  350.  
  351. .link .tagline a {
  352. font-size: x-small;
  353. }
  354.  
  355. .link .title {
  356. font-size: 18.5px;
  357. font-family: "Segoe UI", "Arial", sans-serif;
  358. margin-bottom: 5px;
  359. }
  360.  
  361. .thing .title {
  362. color: #3973ac;
  363. }
  364.  
  365. .thing .title:visited {
  366. color: #538cc6;
  367. }
  368.  
  369. .thing.stickied.link a.title {
  370. color: #3da999;
  371. }
  372.  
  373. .tagline .stickied-tagline {
  374. color: #3da999;
  375. }
  376.  
  377. .res .RES-keyNav-activeElement,
  378. .res .commentarea .RES-keyNav-activeElement .md,
  379. .res .RES-keyNav-activeElement .md-container,
  380. .res .commentarea .RES-keyNav-activeElement.entry .noncollapsed {
  381. background-color: transparent!important;
  382. outline: none!important;
  383. }
  384.  
  385. .res .RES-keyNav-activeElement {
  386. border-right: 2px solid #69c9bb;
  387. }
  388.  
  389. .thing .entry.res-selected,
  390. .thing .entry.res-selected .md-container {
  391. background-color: transparent!important;
  392. outline: none!important;
  393. }
  394.  
  395. .link:hover .entry {
  396. background-color: #fafcfd!important;
  397. }
  398.  
  399. .titlebox .redditname a {
  400. color: #fff;
  401. font-size: 14px;
  402. font-family: "Segoe UI", "Arial", sans-serif;
  403. text-transform: uppercase;
  404. letter-spacing: 0.5px;
  405. background-color: #69c9bb;
  406. border: 0;
  407. border-radius: 3.5px;
  408. text-align: center;
  409. display: block;
  410. width: 300px;
  411. height: 38px;
  412. line-height: 38px;
  413. padding: 0;
  414. margin: 0;
  415. }
  416.  
  417. .titlebox .redditname a:hover {
  418. text-decoration: none;
  419. background: #56c2b2;
  420. }
  421.  
  422. /***********
  423. PAGENAME
  424. **********/
  425.  
  426. .pagename {
  427. position: absolute;
  428. top: 69px;
  429. left: 50%;
  430. -webkit-transform: translateX(-50%);
  431. transform: translateX(-50%);
  432. font-size: 0px;
  433. }
  434.  
  435. .pagename a {
  436. font-size: 54px;
  437. color: #fff;
  438. font-family: "Arial", sans-serif;
  439. letter-spacing: -2px;
  440. text-transform: uppercase;
  441. font-variant: none;
  442. transition: 0.2s;
  443. }
  444.  
  445. .pagename a:before {
  446. content: "/r/";
  447. font-variant: none;
  448. text-transform: lowercase;
  449. font-size: 70%;
  450. letter-spacing: -1px;
  451. }
  452.  
  453. .pagename a:hover {
  454. text-decoration: none;
  455. opacity: 0.8;
  456. }
  457.  
  458.  
  459.  
  460. /***********
  461. HEADER
  462. **********/
  463.  
  464.  
  465. #header {
  466. height: 180px;
  467. background-color: #598cc0;
  468. border-bottom: 40px solid #fff;
  469. }
  470.  
  471.  
  472. #header-img.default-header {
  473. position: absolute;
  474. right: 5px;
  475. bottom: -3px;
  476. width: 35px;
  477. height: 27px;
  478. transition: 300ms ease;
  479. z-index: 9999!important;
  480. opacity: 0.85;
  481. }
  482.  
  483. #header-img.default-header:hover {
  484. height: 30px;
  485. opacity: 1;
  486. }
  487.  
  488.  
  489.  
  490. /***********
  491. TABMENU
  492. **********/
  493.  
  494.  
  495. #header .tabmenu {
  496. position: absolute;
  497. top: 175px;
  498. left: 0px;
  499. border-radius: 2px;
  500. }
  501.  
  502. #header .tabmenu:hover {
  503. box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
  504. }
  505.  
  506. #header .tabmenu li:not(:first-of-type) a {
  507. display: block;
  508. height: 0px;
  509. padding: 0px 0px 0px 6px;
  510. overflow: hidden;
  511. }
  512.  
  513. #header .tabmenu li:first-of-type a {
  514. transition: 0s!important;
  515. border-left: 6px solid #69c9bb;
  516. background-color: #fff;
  517. padding: 10px 8px;
  518. display: block;
  519. height: 20px;
  520. }
  521.  
  522. #header .tabmenu:hover li a {
  523. padding: 10px 8px;
  524. height: 20px;
  525. }
  526.  
  527. #header .tabmenu li {
  528. margin: 0;
  529. display: block;
  530. }
  531.  
  532. #header .tabmenu li a {
  533. color: #369;
  534. background-color: #fff;
  535. font-size: 14px;
  536. font-family: "Segoe UI", sans-serif;
  537. text-transform: uppercase;
  538. letter-spacing: 0.2;
  539. display: block;
  540. text-align: left;
  541. margin: 0;
  542. padding: 6px 8px;
  543. transition: 0.2s;
  544. border: 0;
  545. }
  546.  
  547. #header .tabmenu li.selected a {
  548. color: #69c9bb;
  549. }
  550.  
  551. #header .tabmenu li.selected a,
  552. #header .tabmenu li:hover a {
  553. background-color: #fff;
  554. border-left: 6px solid #69c9bb;
  555. }
  556.  
  557. #header .tabmenu li:first-of-type a {
  558. width: 130px;
  559. }
  560.  
  561.  
  562.  
  563. /***********
  564. SIDEBAR BUTTONS
  565. **********/
  566.  
  567.  
  568. .morelink {
  569. background: none;
  570. border: none;
  571. margin-bottom: 15px;
  572. }
  573.  
  574. .nub {
  575. display: none;
  576. }
  577.  
  578. .morelink a {
  579. color: #fff;
  580. font-size: 14px;
  581. text-transform: uppercase;
  582. font-family: "Segoe UI", "Arial", sans-serif;
  583. letter-spacing: 0.2px;
  584. background-color: #6699cc;
  585. border: 0;
  586. border-radius: 3.5px;
  587. display: block;
  588. width: 300px;
  589. height: 40px;
  590. line-height: 40px;
  591. padding: 0;
  592. margin: 0;
  593. }
  594.  
  595. .morelink a:hover {
  596. background: #538cc6;
  597. color: #fff;
  598. }
  599.  
  600. .users-online,
  601. .subscribers {
  602. display: block;
  603. font-family: Arial, sans-serif;
  604. font-size: 13px;
  605. color: #666;
  606. letter-spacing: 0.5px;
  607. font-weight: normal;
  608. text-align: center;
  609. background-color: white;
  610. border-radius: 2px;
  611. margin: 0 10px;
  612. box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
  613. }
  614.  
  615. .subscribers {
  616. margin-top: 10px;
  617. font-size: 140%;
  618. border-radius: 2px 2px 0 0;
  619. padding-top: 10px;
  620. margin-top: 10px;
  621. }
  622.  
  623. body.res .subscribers {
  624. margin-top: 35px;
  625. }
  626.  
  627. .users-online {
  628. margin-bottom: 10px;
  629. padding-bottom: 10px;
  630. border-radius: 0 0 2px 2px;
  631. }
  632.  
  633. .users-online:before {
  634. display: none;
  635. }
  636.  
  637. .subButtons {
  638. text-align: center;
  639. }
  640.  
  641. .res-sr-style-toggle {
  642. display: none;
  643. }
  644.  
  645. .RESshortcutside,
  646. .RESDashboardToggle,
  647. .RESshortcutside.remove,
  648. .RESDashboardToggle.remove {
  649. font-family: Arial, sans-serif;
  650. font-size: 13px;
  651. color: #808080;
  652. letter-spacing: 0.5px;
  653. font-weight: normal;
  654. border: 0;
  655. border-radius: 2px;
  656. background-image: none;
  657. background-color: #e6e6e6;
  658. display: inline-block;
  659. width: 120px;
  660. height: 17px;
  661. line-height: 17px;
  662. margin: 5px 0 0 0;
  663. }
  664.  
  665. .RESshortcutside {
  666. float: left;
  667. margin-left: 10px!important;
  668. }
  669.  
  670. .RESDashboardToggle {
  671. float: right;
  672. margin-right: 10px!important;
  673. }
  674.  
  675. .RESshortcutside:hover,
  676. .RESDashboardToggle:hover,
  677. .RESshortcutside.remove:hover,
  678. .RESDashboardToggle.remove:hover {
  679. background: #d9d9d9;
  680. }
  681.  
  682. .fancy-toggle-button .active {
  683. display: block!important;
  684. width: 280px;
  685. height: 33px;
  686. line-height: 33px;
  687. padding: 0;
  688. margin: 15px 10px -5px 10px;
  689. background-image: none;
  690. background-color: #85e085;
  691. border: 0;
  692. font-family: Arial, sans-serif;
  693. font-size: 14px;
  694. text-transform: uppercase;
  695. text-align: center;
  696. color: #fff;
  697. font-weight: bold;
  698. letter-spacing: 0.5px;
  699. border-radius: 3.5px;
  700. }
  701.  
  702. body.subscriber .fancy-toggle-button .active {
  703. background-color: #f0f0f0;
  704. color: #a6a6a6;
  705. text-transform: lowercase;
  706. font-weight: normal;
  707. }
  708.  
  709. .fancy-toggle-button .active:hover {
  710. background-color: #71da71;
  711. }
  712.  
  713.  
  714.  
  715. /***********
  716. SIDEBAR
  717. **********/
  718.  
  719.  
  720. .side {
  721. background: #f8f8f8;
  722. padding: 10px;
  723. margin: 8px;
  724. padding-top: 5px;
  725. }
  726.  
  727. .flairselector h2 {
  728. background-color: #69c9bb;
  729. color: #fff;
  730. font-weight: 500;
  731. }
  732.  
  733. /* sidebar formatting */
  734.  
  735. .md h1 {
  736. color: #262626;
  737. font-size: large;
  738. text-transform: uppercase;
  739. font-family: "Segoe UI", "Arial", sans-serif;
  740. letter-spacing: 0.2px;
  741. }
  742.  
  743. .md h2 {
  744. color: #404040;
  745. font-size: medium;
  746. text-transform: uppercase;
  747. font-family: "Segoe UI", "Arial", sans-serif;
  748. letter-spacing: 0.2px;
  749. }
  750.  
  751. .side .titlebox .md h1,
  752. .side .titlebox .md h2 {
  753. text-align: center;
  754. }
  755.  
  756. .side .titlebox .md h1 {
  757. display: block;
  758. color: #333;
  759. font-size: 20px;
  760. }
  761.  
  762. .md h3 {
  763. color: #595959;
  764. font-size: medium;
  765. font-family: "Segoe UI", "Arial", sans-serif;
  766. letter-spacing: 0px;
  767. }
  768.  
  769. .md blockquote {
  770. margin: 10px;
  771. padding: 10px;
  772. background-color: #fff;
  773. border: 1px solid #eee;
  774. border-left: 4px solid #e1e1e1;
  775. }
  776.  
  777. .md pre {
  778. margin: 10px;
  779. padding: 10px;
  780. background-color: #f0f0f0!important;
  781. border: 1px solid #e1e1e1;
  782. }
  783.  
  784. .md hr {
  785. background-color: #bfbfbf;
  786. margin: 20px 35px;
  787. height: 1px;
  788. }
  789.  
  790. .md h6,
  791. .md h6 a {
  792. text-decoration: none!important;
  793. }
  794.  
  795. .side .titlebox .md h6 a {
  796. display: block;
  797. margin-left: 30px;
  798. margin-right: 30px;
  799. padding: 6px 0px;
  800. background-color: #8cb3d9;
  801. color: #fff;
  802. text-align: center;
  803. font-weight: 500;
  804. font-family: "Segoe UI", "Arial", sans-serif;
  805. font-size: 1em;
  806. border-radius: 2px;
  807. }
  808.  
  809. .side .titlebox .md h6 a:hover {
  810. background-color: #79a6d2;
  811. }
  812.  
  813. /* end sidebar formatting */
  814.  
  815. .sidecontentbox .title h1 {
  816. color: #fff;
  817. font-weight: normal;
  818. display: block;
  819. height: 30px;
  820. line-height: 30px;
  821. padding-left: 10px;
  822. background-color: #8cb3d9;
  823. text-transform: lowercase;
  824. border-radius: 3.5px 3.5px 0 0;
  825. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  826. }
  827.  
  828. .sidecontentbox .collapse-button {
  829. position: absolute;
  830. margin-left: 280px;
  831. }
  832.  
  833. .sidecontentbox a.helplink {
  834. color: #333;
  835. background-color: #fff;
  836. border: 1px solid #e1e1e1;
  837. padding: 4px 12px;
  838. margin-right: 4px;
  839. border-radius: 2px;
  840. }
  841.  
  842. .sidecontentbox a.helplink:hover {
  843. border: 1px solid #808080;
  844. }
  845.  
  846. .side .content {
  847. background: #fff;
  848. border: 1px solid #fff;
  849. border-radius: 0 0 3.5px 3.5px;
  850. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  851. }
  852.  
  853. .side .content:hover {
  854. border: 1px solid #e1e1e1;
  855. border-top: 1px solid #fff;
  856. }
  857.  
  858. .side .titlebox .md {
  859. background: transparent;
  860. padding: 5px;
  861. margin: 5px 0px;
  862. border-bottom: 1px solid #bfbfbf;
  863. padding-bottom: 25px;
  864. margin-bottom: 15px;
  865. }
  866.  
  867. .side .titlebox .bottom {
  868. border: none;
  869. margin: 5px 0px 25px 0px;
  870. border-bottom: 1px solid #bfbfbf;
  871. padding-bottom: 20px;
  872. }
  873.  
  874. .sidebox.create,
  875. .leavemoderator,
  876. .leavecontributor-button {
  877. display: none;
  878. }
  879.  
  880. .titlebox form.flairtoggle {
  881. margin: 20px 0px 0px 0px;
  882. padding: 0px 0px 6px 0px;
  883. text-align: center;
  884. border: 1px solid #fff;
  885. border-bottom: none;
  886. background-color: #fff;
  887. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  888. }
  889.  
  890. .titlebox form.flairtoggle:before {
  891. display: block;
  892. background-color: #8cb3d9;
  893. content: "FLAIR";
  894. height: 20px;
  895. line-height: 20px;
  896. color: #fff;
  897. font-weight: normal;
  898. height: 30px;
  899. line-height: 30px;
  900. padding-left: 10px;
  901. text-transform: lowercase;
  902. font-size: 130%;
  903. text-align: left;
  904. margin-bottom: 5px;
  905. border-radius: 3.5px 3.5px 0 0;
  906. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  907. }
  908.  
  909. .titlebox .tagline {
  910. margin: 0px;
  911. padding: 0px 0px 10px 0px;
  912. text-align: center;
  913. font-size: 105%;
  914. border: 1px solid #fff;
  915. border-top: none;
  916. background: #fff;
  917. border-radius: 0 0 3.5px 3.5px;
  918. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  919. }
  920.  
  921. #search input[type=text] {
  922. padding: 10px;
  923. border: 1px solid #e1e1e1;
  924. border-radius: 3.5px;
  925. font-family: Arial, sans-serif;
  926. letter-spacing: 0.2px;
  927. z-index: 9999;
  928. box-shadow: 0px 1px 2px rgba(0,0,0,0.03);
  929. }
  930.  
  931. #search input[type=text]:hover {
  932. border: 1px solid #bfbfbf;
  933. }
  934.  
  935. #searchexpando {
  936. background-color: white;
  937. border-radius: 2px;
  938. box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
  939. border: none;
  940. padding: 20px;
  941. margin: 10px 10px 0 10px;
  942. }
  943.  
  944.  
  945.  
  946. /***********
  947. FLAIRS
  948. **********/
  949.  
  950.  
  951. .flair,
  952. .linkflair .linkflairlabel {
  953. font-size: 14px;
  954. color: #808080;
  955. font-weight: 500;
  956. padding: 2px 8px;
  957. max-width: none;
  958. border-radius: 2px;
  959. }
  960.  
  961. .linkflairlabel {
  962. position: relative;
  963. top: 3px;
  964. }
  965.  
  966. .flair {
  967. font-size: 11px!important;
  968. }
  969.  
  970. .res .flair {
  971. margin-left: 5px;
  972. }
  973.  
  974. .flair-userorange {
  975. color: #fff;
  976. background-color: #faa47a;
  977. border: 1px solid #faa47a;
  978. }
  979.  
  980. .flair-usergreen {
  981. color: #fff;
  982. background-color: #9fdf9f;
  983. border: 1px solid #9fdf9f;
  984. }
  985.  
  986. .linkflair-green .linkflairlabel {
  987. color: #fff;
  988. background: #9fdf9f;
  989. border: 1px solid #9fdf9f;
  990. }
  991.  
  992. .linkflair-blue .linkflairlabel {
  993. color: #fff;
  994. background: #6699cc;
  995. border: 1px solid #6699cc;
  996. }
  997.  
  998. .linkflair-red .linkflairlabel {
  999. color: #fff;
  1000. background: #ff8080;
  1001. border: 1px solid #ff8080;
  1002. }
  1003.  
  1004. .linkflair-aqua .linkflairlabel {
  1005. color: #fff;
  1006. background: #69c9bb;
  1007. border: 1px solid #69c9bb;
  1008. }
  1009.  
  1010. .linkflair-orange .linkflairlabel {
  1011. color: #fff;
  1012. background: #faa47a;
  1013. border: 1px solid #faa47a;
  1014. }
  1015.  
  1016. .linkflair-aquathumb .linkflairlabel,
  1017. .linkflair-aquathumb .thumbnail {
  1018. background-color: #69c9bb!important;
  1019. border: 0!important;
  1020. color: #fff!important;
  1021. }
  1022.  
  1023. .linkflair-greenthumb .linkflairlabel,
  1024. .linkflair-greenthumb .thumbnail {
  1025. background-color: #9fdf9f!important;
  1026. border: 0!important;
  1027. color: #fff!important;
  1028. }
  1029.  
  1030. .linkflair-bluethumb .linkflairlabel,
  1031. .linkflair-bluethumb .thumbnail {
  1032. background-color: #9cb3c9!important;
  1033. border: 0!important;
  1034. color: #fff!important;
  1035. }
  1036.  
  1037. .linkflair-redthumb .linkflairlabel,
  1038. .linkflair-redthumb .thumbnail {
  1039. background-color: #ff8080!important;
  1040. border: 0!important;
  1041. color: #fff!important;
  1042. }
  1043.  
  1044. .linkflair-orangethumb .linkflairlabel,
  1045. .linkflair-orangethumb .thumbnail {
  1046. background-color: #faa47a!important;
  1047. border: 0!important;
  1048. color: #fff!important;
  1049. }
  1050.  
  1051. .linkflair-aquathumb .thumbnail:after,
  1052. .linkflair-redthumb .thumbnail:after,
  1053. .linkflair-bluethumb .thumbnail:after,
  1054. .linkflair-greenthumb .thumbnail:after,
  1055. .linkflair-orangethumb .thumbnail:after {
  1056. color: #fff!important;
  1057. }
  1058.  
  1059.  
  1060. /***********
  1061. COMMENTS PAGE
  1062. **********/
  1063.  
  1064.  
  1065. .comments-page .comment,
  1066. .comment .comment, /*targets child comments*/
  1067. .res-commentBoxes .thing.comment .thing.comment /*overrides RES CSS*/ {
  1068. padding: 10px!important;
  1069. border: 1px solid #eee!important;
  1070. border-radius: 2px!important;
  1071. }
  1072.  
  1073. .res-commentBoxes.res-commentBoxes-rounded .comment {
  1074. background: #fff;
  1075. margin-bottom: 10px!important;
  1076. margin-left: 10px!important;
  1077. border: 1px solid #d9d9d9!important;
  1078. border-radius: 2px!important;
  1079. }
  1080.  
  1081. .comment {
  1082. background: #fff!important;
  1083. margin-bottom: 10px!important;
  1084. margin-left: 15px!important;
  1085. border: 1px solid #d9d9d9!important;
  1086. border-radius: 2px!important;
  1087. }
  1088.  
  1089. .commentarea .comment .comment,
  1090. .commentarea .comment .comment .comment .comment,
  1091. .commentarea .comment .comment .comment .comment .comment .comment,
  1092. .commentarea .comment .comment .comment .comment .comment .comment .comment .comment,
  1093. .commentarea .comment .comment .comment .comment .comment .comment .comment .comment .comment .comment {
  1094. background: #f8f8f8!important;
  1095. }
  1096. .commentarea .comment .comment .comment,
  1097. .commentarea .comment .comment .comment .comment .comment,
  1098. .commentarea .comment .comment .comment .comment .comment .comment .comment,
  1099. .commentarea .comment .comment .comment .comment .comment .comment .comment .comment .comment,
  1100. .commentarea .comment .comment .comment .comment .comment .comment .comment .comment .comment .comment .comment {
  1101. background: #fff!important;
  1102. }
  1103.  
  1104. .comment-visits-box,
  1105. .linkinfo,
  1106. .login-form-side {
  1107. background: #f8f8f8;
  1108. border: none;
  1109. }
  1110.  
  1111. .linkinfo {
  1112. padding: 20px 0;
  1113. border-top: 1px solid #bfbfbf;
  1114. border-bottom: 1px solid #bfbfbf;
  1115. margin: 20px 0;
  1116. }
  1117.  
  1118. .comment-visits-box .title {
  1119. color: #369;
  1120. }
  1121.  
  1122. .linklisting .md, .commentarea .md {
  1123. padding: 10px;
  1124. }
  1125.  
  1126.  
  1127. /***********
  1128. FOOTER
  1129. **********/
  1130.  
  1131.  
  1132. .debuginfo {
  1133. width: calc(100% - 10px);
  1134. background: #e6e6e6;
  1135. }
  1136.  
  1137. .debuginfo:before {
  1138. float: left;
  1139. content: "/r/homespun theme | css by /u/kudosinc";
  1140. display: block;
  1141. position: relative;
  1142. top: 2px;
  1143. color: #808080;
  1144. font-size: 9px;
  1145. }
  1146.  
  1147. .footer {
  1148. background: #fff;
  1149. border: 1px solid #fff;
  1150. border-radius: 3.5px;
  1151. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  1152. }
  1153.  
  1154. .footer:hover {
  1155. border: 1px solid #e1e1e1;
  1156. border-top: 1px solid #fff;
  1157. }
  1158.  
  1159. .footer-parent {
  1160. background: #f8f8f8;
  1161. margin-bottom: -12px;
  1162. padding-bottom: 20px;
  1163. }
  1164.  
  1165. .flat-vert.title {
  1166. background: #8cb3d9;
  1167. color: #fff;
  1168. padding: 10px;
  1169. margin: -20px -20px 10px -20px;
  1170. border-radius: 3.5px 3.5px 0 0;
  1171. box-shadow: 0px 1px 2px rgba(0,0,0,0.05);
  1172. }
  1173.  
  1174.  
  1175.  
  1176. /***********
  1177. COMMENTS BOX
  1178. **********/
  1179.  
  1180.  
  1181. .commentarea .menuarea .toggle a {
  1182. font-weight: normal;
  1183. }
  1184.  
  1185. .menuarea {
  1186. background-color: transparent;
  1187. margin-left: 15px;
  1188. margin-right: 335px;
  1189. margin-bottom: 0px;
  1190. border-bottom: none;
  1191. }
  1192.  
  1193. .drop-choices {
  1194. border: 0;
  1195. }
  1196.  
  1197. .dropdown.lightdrop .selected {
  1198. text-decoration: none;
  1199. font-weight: bold;
  1200. font-family: "Segoe UI", "Arial", sans-serif;
  1201. text-transform: uppercase;
  1202. font-size: 120%;
  1203. }
  1204.  
  1205. .drop-choices a.choice {
  1206. padding: 4px 12px;
  1207. margin: 6px;
  1208. background-color: #fff;
  1209. }
  1210.  
  1211. .panestack-title {
  1212. background-color: #eaeaea;
  1213. border-bottom: 0;
  1214. padding: 10px;
  1215. margin-left: 10px;
  1216. margin-right: 335px;
  1217. border-bottom: none;
  1218. margin-top: 15px;
  1219. border-radius: 3.5px 3.5px 0 0;
  1220. }
  1221.  
  1222. .commentarea .menuarea {
  1223. background-color: #eaeaea;
  1224. border-bottom: 1px solid #d9d9d9;
  1225. border-top: 0;
  1226. padding: 10px;
  1227. margin-left: 10px;
  1228. margin-right: 335px;
  1229. }
  1230.  
  1231. .commentarea > .usertext {
  1232. background-color: #fff;
  1233. border-top: 0;
  1234. padding: 10px;
  1235. margin-left: 10px;
  1236. margin-right: 335px;
  1237. margin-top: -10px;
  1238. margin-bottom: 15px;
  1239. box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
  1240. border-radius: 0 0 3.5px 3.5px;
  1241. }
  1242.  
  1243. .gold-accent.comment-visits-box {
  1244. background-color: transparent;
  1245. border: 0;
  1246. border-radius: 0px;
  1247. padding: 10px;
  1248. margin-left: 15px;
  1249. margin-bottom: 8px;
  1250. }
  1251.  
  1252. .comment-visits-box .title {
  1253. color: #373737;
  1254. font-weight: normal;
  1255. }
  1256.  
  1257.  
  1258.  
  1259. /***********
  1260. SUBMIT PAGE
  1261. **********/
  1262.  
  1263.  
  1264. .submit-page #header-img.default-header {
  1265. display: none;
  1266. }
  1267.  
  1268. ul.tabmenu.formtab,
  1269. .formtabs-content .infobar,
  1270. #reddit-field,
  1271. .submit-page h1 {
  1272. display: none;
  1273. }
  1274.  
  1275. .submit .formtabs-content {
  1276. border-top: none;
  1277. }
  1278.  
  1279. .submit .roundfield {
  1280. background: transparent;
  1281. border-radius: 0px;
  1282. }
  1283.  
  1284. .submit-page .side,
  1285. .submit-page .footer-parent {
  1286. display: none!important;
  1287. }
  1288.  
  1289. .submit-page .content {
  1290. width: 500px;
  1291. position: absolute;
  1292. left: calc(50% - 250px);
  1293. }
  1294.  
  1295. .formtabs-content .infobar {
  1296. margin-bottom: 10px;
  1297. }
  1298.  
  1299. .submit_text .content {
  1300. position: static;
  1301. }
  1302.  
  1303. .submit_text .content .md {
  1304. padding: 20px 0;
  1305. border-top: 1px solid #bfbfbf;
  1306. border-bottom: 1px solid #bfbfbf;
  1307. }
  1308.  
  1309. .submit-page .debuginfo {
  1310. display: none;
  1311. }
  1312.  
  1313. .formtabs-content .infobar,
  1314. .content.submit .info-notice {
  1315. background: #fff;
  1316. border: 1px solid #e1e1e1;
  1317. padding: 10px;
  1318. border-radius: 2px;
  1319. }
  1320.  
  1321. #items-required {
  1322. display: none;
  1323. }
  1324.  
  1325. .submit.content button[name="submit"] {
  1326. background-color: #8cb3d9;
  1327. border: 1px solid #8cb3d9;
  1328. font-size: 16px;
  1329. color: #fff;
  1330. display: block;
  1331. width: 200px;
  1332. position: relative;
  1333. top: 10px;
  1334. left: calc(50% - 100px);
  1335. padding: 6px 0;
  1336. }
  1337.  
  1338. .submit.content button[name="submit"]:hover {
  1339. background-color: #79a6d2;
  1340. }
  1341.  
  1342.  
  1343.  
  1344.  
  1345. /**********
  1346.  
  1347.  
  1348. Customisation options start here:
  1349.  
  1350. Remove the " /* " symbols before and after the blocks of code to active them. If you don't want a header or sidebar image, keep them there.
  1351. Next, upload an image onto your stylesheet and name it either "header" for the header image or "sidebar" for the sidebar image.
  1352. Hit save and you're done!
  1353.  
  1354.  
  1355. **********/
  1356.  
  1357. /*
  1358. #header {
  1359. background-image: url(%%header%%);
  1360. background-position: center center;
  1361. background-size: 100%;
  1362. background-repeat: no-repeat;
  1363. }
  1364. */
  1365.  
  1366. /*
  1367. .side:before {
  1368. content: "";
  1369. display: block;
  1370. width: 280px;
  1371. height: 200px;
  1372. background-image: url(%%sidebar%%);
  1373. background-size: 100%;
  1374. background-repeat: no-repeat;
  1375. background-color: transparent;
  1376. margin-left: 10px;
  1377. margin-bottom: -10px;
  1378. z-index: -1;
  1379. border-radius: 3.5px;
  1380. box-shadow: 0px 0px 2px rgba(0,0,0,0.1);
  1381. }
  1382. */
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!