Advertisement
Codesbyneen

003. Layout - I'll Take It To The Grave

Nov 21st, 2016
100
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 14.16 KB | None | 0 0
  1. /* Title: I'll Take It To The Grave
  2. Creator: neen at revolumna
  3. Style: S2 Flexible Squares */
  4.  
  5. /* ---------->>> FONTS <<<---------- */
  6.  
  7. @font-face {
  8.     font-family: 'Great Vibes';
  9.     font-style: normal;
  10.     font-weight: 400;
  11.     src: local('Great Vibes'), local('GreatVibes-Regular'), url(http://fonts.gstatic.com/s/greatvibes/v4/6q1c0ofG6NKsEhAc2eh-3YbN6UDyHWBl620a-IRfuBk.woff) format('woff');
  12. }
  13.  
  14. @font-face {
  15.     font-family: 'Kreon';
  16.     font-style: normal;
  17.     font-weight: 300;
  18.     src: local('Kreon Light'), local('Kreon-Light'), url(http://fonts.gstatic.com/s/kreon/v8/foDwQzChAOJL0-zU6ynhJ_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
  19. }
  20.  
  21. /* ---------->>> GLOBAL <<<---------- */
  22.  
  23. body {
  24.     text-align: justify;
  25.     font-size: 14px;
  26.     color: #ffffff;
  27.     font-family: 'Kreon', serif;
  28.     background-color: #06161f;
  29. }
  30.  
  31. #content {
  32.     width: 1025px;
  33.     padding: 5px;
  34.     margin-left: auto;
  35.     margin-right: auto;
  36.     min-height: 623px;
  37.     margin-top: 50px;
  38.     background-color: #0c2430;
  39.     border: 5px solid #063942;
  40.     box-shadow: 0px 0px 2em #063942;
  41. }
  42.  
  43. #maincontent {
  44.     margin: 0px;
  45.     max-height: 472px;
  46.     overflow: auto;
  47.     background-color: #0c2430;
  48. }
  49.  
  50. a,
  51. a:link,
  52. a:visited {
  53.     color: #0d8185;
  54.     font-family: 'Kreon', serif;
  55.     text-decoration: none;
  56. }
  57.  
  58. a:hover {
  59.     color: #cccccc;
  60.     -webkit-transition: all 0.8s ease-out;
  61.     -moz-transition: all 0.8s ease-out;
  62. }
  63.  
  64. b {
  65.     font-size: 14px;
  66. }
  67.  
  68. /* ---------->>> HEADER <<<---------- */
  69.  
  70. #header {
  71.     color: #ffffff;
  72.     text-align: left;
  73.     font-family: 'Kreon', serif;
  74.     font-size: 11px;
  75.     font-weight: normal;
  76.     text-transform: uppercase;
  77. }
  78.  
  79. .title {
  80.     display: none;
  81. }
  82.  
  83. .subtitle {
  84.     display: none;
  85. }
  86.  
  87. ul.navheader {
  88.     padding: 10px 5px 10px 5px;
  89.     margin-top: 10px;
  90.     margin-bottom: 25px;
  91.     margin-left: 5px;
  92. }
  93.  
  94. ul.navheader li {
  95.     display: inline;
  96.     margin: 0px 0px 0px;
  97.     list-style-type: none;
  98. }
  99.  
  100. div#header li.view {
  101.     font-family: 'Kreon', serif;
  102.     font-size: 11px;
  103.     letter-spacing: 5px;
  104.     padding: 10px;
  105.     margin: 0px;
  106.     color: #06161f;
  107.     text-transform: uppercase;
  108. }
  109.  
  110. div#header a,
  111. div#header a:link,
  112. div#header a:visited {
  113.     font-family: 'Kreon', serif;
  114.     font-size: 11px;
  115.     letter-spacing: 5px;
  116.     padding: 10px;
  117.     margin: 0px;
  118.     color: #ffffff;
  119.     background-color: #06161f;
  120.     text-transform: uppercase;
  121. }
  122.  
  123. div#header a:hover,
  124. div#header li.view:hover {
  125.     color: #cccccc;
  126.     -webkit-transition: all 0.8s ease-out;
  127.     -moz-transition: all 0.8s ease-out;
  128. }
  129.  
  130. /* ---------->>> FOOTER <<<---------- */
  131.  
  132. #footer {
  133.     color: #ffffff;
  134.     text-align: left;
  135.     font-family: 'Kreon', serif;
  136.     font-size: 11px;
  137.     font-weight: normal;
  138.     text-transform: uppercase;
  139. }
  140.  
  141. ul.navfooter {
  142.     padding: 10px 5px 10px 5px;
  143.     margin-top: 20px;
  144.     margin-left: 5px;
  145.     margin-bottom: -8px;
  146. }
  147.  
  148. ul.navfooter li {
  149.     display: inline;
  150.     margin: 0px 0px 0px;
  151.     list-style-type: none;
  152. }
  153.  
  154. #footer .viewing {
  155.     font-family: 'Kreon', serif;
  156.     font-size: 11px;
  157.     letter-spacing: 5px;
  158.     padding: 10px;
  159.     margin: 0px;
  160.     color: #06161f;
  161.     text-transform: uppercase;
  162. }
  163.  
  164. div#footer a,
  165. div#footer a:link,
  166. div#footer a:visited {
  167.     font-family: 'Kreon', serif;
  168.     font-size: 11px;
  169.     letter-spacing: 5px;
  170.     padding: 10px;
  171.     margin: 0px;
  172.     color: #ffffff;
  173.     background-color: #06161f;
  174.     text-transform: uppercase;
  175. }
  176.  
  177. div#footer a:hover {
  178.     color: #cccccc;
  179.     -webkit-transition: all 0.8s ease-out;
  180.     -moz-transition: all 0.8s ease-out;
  181. }
  182.  
  183. /* ---------->>> SIDEBAR <<<---------- */
  184.  
  185. #sidebar {
  186.     background: url(http://i.imgur.com/os9DbHe.png) no-repeat center top transparent;
  187.     width: 410px;
  188.     margin-top: -59px;
  189.     margin-left: 5px;
  190.     padding: 370px 5px 0px;
  191.     color: #ffffff;
  192.     font-family: 'Kreon', serif;
  193.     font-size: 14px;
  194.     text-align: justify;
  195.     float: right;
  196. }
  197.  
  198. .defaultuserpic {
  199.     display: none;
  200. }
  201.  
  202. .defaultuserpic img {
  203.     display: none;
  204. }
  205.  
  206. div#sidebar a,
  207. div#sidebar a:link,
  208. div#sidebar a:visited {
  209.     font-family: 'Great Vibes', cursive;
  210.     font-size: 20px;
  211.     color: #ffffff;
  212.     font-style: normal;
  213. }
  214.  
  215. div#sidebar a:hover {
  216.     text-decoration: none;
  217.     color: #cccccc;
  218. }
  219.  
  220. li.sbartitle {
  221.     display: none;
  222. }
  223.  
  224. .sbarheader {
  225.     padding: 0px 5px 0px 5px;
  226. }
  227.  
  228. .sbarbody {
  229.     padding: 0px 5px 5px 5px;
  230. }
  231.  
  232. .sbarbody2 {
  233.     padding: 0px 5px 5px 5px;
  234.     display: none;
  235. }
  236.  
  237. ul.sbarlist {
  238.     margin-top: 2px;
  239.     list-style: none;
  240.     padding: 0px;
  241. }
  242.  
  243. li.sbaritem {
  244.     margin: 0px 0px 2px 0px;
  245.     padding: 10px 0px 10px 0px;
  246.     list-style: none;
  247.     background-color: #06161f;
  248.     text-align: center;
  249.     font-size: 11px;
  250. }
  251.  
  252. li.sbaritem:hover {
  253.     background-color: #0c2430;
  254.     color: #ffffff;
  255.     -webkit-transition: all 0.8s ease-out;
  256.     -moz-transition: all 0.8s ease-out;
  257. }
  258.  
  259. table.calendar {
  260.     display: none;
  261. }
  262.  
  263. .sbarcalendar {
  264.     display: none;
  265. }
  266.  
  267. .sbarcalendarposts {
  268.     display: none;
  269. }
  270.  
  271. #sidebar_summary.sbarbody {
  272.     display: none;
  273. }
  274.  
  275. #sidebar_tags.sbarbody {
  276.     display: none;
  277. }
  278.  
  279. /* ---------->>> TAGS, TAGS PAGE <<<---------- */
  280.  
  281. .ljtags {
  282.     margin-top: 25px;
  283.     margin-bottom: -10px;
  284.     font-family: 'Kreon', serif;
  285.     font-size: 14px;
  286.     padding: 0px;
  287.     color: #cccccc;
  288.     text-transform: uppercase;
  289. }
  290.  
  291. .ljtags a,
  292. .ljtags a:link,
  293. .ljtags a:visited {
  294.     color: #0d8185;
  295.     font-family: 'Kreon', serif;
  296.     text-decoration: none;
  297.     text-transform: lowercase;
  298. }
  299.  
  300. .ljtags a:hover {
  301.     color: #cccccc;
  302.     -webkit-transition: all 0.8s ease-out;
  303.     -moz-transition: all 0.8s ease-out;
  304. }
  305.  
  306. .ljtaglist {
  307.     list-style-type: none;
  308.     padding: 0px;
  309.     margin: 0px;
  310.     text-align: left;
  311. }
  312.  
  313. .ljtaglist li {
  314.     border-bottom: 1px solid #063942;
  315.     padding: 5px 2px 5px 10px;
  316.     color: #cccccc;
  317. }
  318.  
  319. h2 {
  320.     padding-left: 15px;
  321.     padding-top: 0px;
  322.     padding-bottom: 0px;
  323.     margin-left: 5px;
  324.     margin-right: 5px;
  325.     margin-bottom: -20px;
  326.     font-weight: normal;
  327.     color: #0d8185;
  328.     font-family: 'Great Vibes', cursive;
  329.     font-size: 25px;
  330.     text-align: left;
  331. }
  332.  
  333. ul.ljtaglist {
  334.     font-family: 'Kreon', serif;
  335.     font-size: 11px;
  336.     text-transform: uppercase;
  337.     padding: 10px;
  338.     background: transparent;
  339.     text-align: left;
  340.     margin-top: 20px;
  341.     padding: 10px;
  342. }
  343.  
  344. ul.ljtaglist a {
  345.     font-family: 'Kreon', serif;
  346.     font-size: 14px;
  347.     margin-right: 5px;
  348.     color: #ffffff;
  349.     text-transform: lowercase;
  350. }
  351.  
  352. /* ---------->>> ENTRY <<<---------- */
  353.  
  354. .subcontent {
  355.     padding: 0px;
  356.     background: transparent;
  357. }
  358.  
  359. .entry {
  360.     padding: 5px 10px 10px 5px;
  361.     margin: 5px 5px 5px 5px;
  362.     color: #ffffff;
  363.     font-family: 'Kreon', serif;
  364.     font-size: 14px;
  365.     line-height: 1.5em;
  366.     text-align: justify;
  367. }
  368.  
  369. .entry ul li {
  370.     padding-left: 5px;
  371.     margin: -10px;
  372.     list-style-position: outside;
  373. }
  374.  
  375. .entry ol li {
  376.     padding-left: 5px;
  377.     margin: -10px;
  378.     list-style: decimal-leading-zero;
  379.     list-style-position: outside;
  380. }
  381.  
  382. blockquote {
  383.     margin-right: 20px;
  384.     margin-left: 20px;
  385.     margin-top: -5px;
  386.     margin-bottom: -5px;
  387.     padding: 10px;
  388.     color: #cccccc;
  389.     font-size: 14px;
  390.     font-family: 'Kreon', serif;
  391.     background: transparent;
  392.     border-right: 5px solid #063942;
  393.     text-align: justify;
  394. }
  395.  
  396. /* ---------->>> USERPIC, USERPIC FRIENDS <<<---------- */
  397.  
  398. .userpic {
  399.     width: 70px;
  400.     height: 70px;
  401.     position: relative;
  402.     float: left;
  403.     margin: 10px 3px -5px 5px;
  404.     background-color: transparent;
  405.     padding: 5px;
  406. }
  407.  
  408. .userpicfriends {
  409.     background-color: transparent !important;
  410.     padding: 5px;
  411.     font-family: 'Kreon', serif;
  412.     text-align: center;
  413.     font-size: 9px;
  414.     margin: 10px 3px -5px 5px;
  415.     position: relative;
  416.     float: left;
  417.     text-transform: uppercase;
  418. }
  419.  
  420. .userpic img,
  421. .userpicfriends img {
  422.     background-color: transparent !important;
  423.     width: 70px;
  424.     height: 70px;
  425. }
  426.  
  427. .userpicfriends a font {
  428.     color: #0d8185;
  429.     background-color: transparent !important;
  430.     font-size: 9px;
  431.     font-family: 'Kreon', serif;
  432.     text-align: center;
  433.     text-transform: uppercase;
  434. }
  435.  
  436. /* ---------->>> DATE, SUBJECT, CURRENTS <<<---------- */
  437.  
  438. .date {
  439.     display: none;
  440. }
  441.  
  442. .subject {
  443.     padding-right: 15px;
  444.     padding-top: 0px;
  445.     padding-bottom: 0px;
  446.     margin-left: 5px;
  447.     margin-right: 5px;
  448.     margin-bottom: -15px;
  449.     font-weight: normal;
  450.     color: #0d8185;
  451.     font-family: 'Great Vibes', cursive;
  452.     font-size: 25px;
  453.     text-align: right;
  454. }
  455.  
  456. .subject a,
  457. .subject a:link,
  458. .subject a:visited {
  459.     font-family: 'Great Vibes', cursive;
  460.     color: #0d8185;
  461.     font-weight: normal;
  462.     font-size: 25px;
  463. }
  464.  
  465. .datesubject {
  466.     padding-left: 0px;
  467.     margin-left: -10px;
  468. }
  469.  
  470. .currents strong,
  471. .currentmood strong,
  472. .currentmusic strong,
  473. .currentlocation strong {
  474.     display: none;
  475. }
  476.  
  477. .currents,
  478. .currentmood,
  479. .currentmusic,
  480. .currentlocation,
  481. .currentgroups {
  482.     display: none;
  483. }
  484.  
  485. .currentlocation a,
  486. .currentlocation a:link,
  487. .currentlocation a:visited {
  488.     display: none;
  489. }
  490.  
  491. .currentlocation a:hover {
  492.     display: none;
  493. }
  494.  
  495. /* ---------->>> COMMENTS <<<---------- */
  496.  
  497. .comments {
  498.     font-family: 'Kreon', serif;
  499.     font-size: 14px;
  500.     color: #ffffff;
  501.     text-align: left;
  502.     text-transform: uppercase;
  503.     position: relative;
  504.     top: 20px;
  505. }
  506.  
  507. div.comments a,
  508. div.comments a:link,
  509. div.comments a:visited {
  510.     color: #ffffff;
  511.     font-family: 'Kreon', serif;
  512.     background-color: #06161f;
  513.     font-size: 11px;
  514.     letter-spacing: 3px;
  515.     padding: 5px;
  516. }
  517.  
  518. div.comments a:hover {
  519.     color: #cccccc;
  520.     -webkit-transition: all 0.8s ease-out;
  521.     -moz-transition: all 0.8s ease-out;
  522. }
  523.  
  524. .datesubjectcomment {
  525.     background-color: transparent;
  526.     padding: 5px;
  527.     margin-top: 10px;
  528.     margin-right: 5px;
  529.     color: #cccccc;
  530.     font-size: 14px;
  531.     font-family: 'Kreon', serif;
  532.     background-color: transparent;
  533.     text-align: right;
  534.     border-right: 5px solid #063942;
  535. }
  536.  
  537. .userpiccomment {
  538.     display: none;
  539. }
  540.  
  541. .box {
  542.     clear: left;
  543.     color: #ffffff;
  544.     font-size: 14px;
  545.     font-family: 'Kreon', serif;
  546.     text-align: left;
  547. }
  548.  
  549. input,
  550. textarea {
  551.     background-color: #06161f;
  552.     width: 90% !important;
  553.     padding: 3px;
  554.     color: #ffffff;
  555.     font-size: 14px;
  556.     font-family: 'Kreon', serif;
  557.     border: 1px solid #06161f;
  558. }
  559.  
  560. textarea.textbox {
  561.     width: 90% !important;
  562.     border: 1px solid #06161f;
  563.     background-color: #06161f;
  564. }
  565.  
  566. .reply {
  567.     position: relative;
  568.     margin: 0px;
  569.     padding: 0px;
  570.     text-align: justify;
  571.     color: #ffffff;
  572.     font-size: 14px;
  573.     font-family: 'Kreon', serif;
  574.     background-color: transparent;
  575. }
  576.  
  577. .replytosubject {
  578.     font-weight: bold;
  579. }
  580.  
  581. .commentreply {
  582.     position: relative;
  583.     margin: 5px;
  584.     text-align: justify;
  585.     color: #ffffff;
  586.     font-size: 14px;
  587.     font-family: 'Kreon', serif;
  588.     background-color: transparent;
  589. }
  590.  
  591. .commentbox {
  592.     padding: 10px;
  593.     margin: 0px;
  594.     background-color: transparent;
  595. }
  596.  
  597. .commentboxpartial {
  598.     padding: 10px;
  599.     margin: 10px;
  600.     background-color: transparent;
  601. }
  602.  
  603. .commentinfo {
  604.     background-color: transparent;
  605.     margin-top: 10px;
  606.     width: 100%;
  607. }
  608.  
  609. div#add_comment.box {
  610.     margin-left: 10px;
  611. }
  612.  
  613. input#prop_opt_preformatted {
  614.     margin-right: -200px;
  615.     margin-left: -200px;
  616. }
  617.  
  618. input#spellcheck {
  619.     margin-right: -200px;
  620.     margin-left: -90px;
  621.     margin-top: 5px;
  622. }
  623.  
  624. label {
  625.     margin: -1px;
  626. }
  627.  
  628. input.b-postform-quote {
  629.     margin-top: 5px;
  630.     width: 92% !important;
  631. }
  632.  
  633. input {
  634.     width: 92% !important;
  635.     margin-bottom: 5px;
  636. }
  637.  
  638. input#subject.textbox {
  639.     width: 90% !important;
  640. }
  641.  
  642. /* ---------->>> ARCHIVE PAGE <<<---------- */
  643.  
  644. ul.year {
  645.     text-align: center;
  646.     padding-bottom: 20px;
  647. }
  648.  
  649. ul.year li {
  650.     display: inline;
  651.     font-family: 'Kreon', serif;
  652.     font-size: 14px;
  653.     color: #cccccc;
  654. }
  655.  
  656. table.yeartable {
  657.     width: 450px;
  658.     margin-left: auto;
  659.     margin-right: auto;
  660.     font-family: 'Kreon', serif;
  661.     font-size: 14px;
  662.     color: #ffffff;
  663.     text-align: center;
  664. }
  665.  
  666. table.yeartable td.yeardate,
  667. table.yeartable td.yearday {
  668.     background-color: #06161f;
  669.     padding: 5px;
  670. }
  671.  
  672. table.yeartable td.yearday {
  673.     background-color: transparent;
  674.     text-align: center;
  675. }
  676.  
  677. td.yearmonth {
  678.     border: 1px #063942 solid;
  679.     padding: 5px;
  680. }
  681.  
  682. /* ----->>> TINY ICONS <<<------ */
  683. /* Generated by Malionette's Tiny Icon Generator, http://malionette.net/generator/tinylite.html */
  684.  
  685. span.ljuser img[src*="img/userinfo_v8.svg"] {
  686.     width: 0 !important;
  687.     height: 0 !important;
  688.     background: transparent url(http://i.imgur.com/xAqbx7b.png) no-repeat !important;
  689.     padding: 16px 0 0 18px !important;
  690. }
  691.  
  692. span.i-ljuser img[src*="img/community.gif"] {
  693.     width: 0 !important;
  694.     height: 0 !important;
  695.     background: transparent url(http://i.imgur.com/ZNXuczm.png) no-repeat !important;
  696.     padding: 16px 0 0 18px !important;
  697. }
  698.  
  699. img[src*="img/icon_protected.gif"] {
  700.     width: 0 !important;
  701.     height: 0 !important;
  702.     background: transparent url(http://i.imgur.com/yAeScZj.png) no-repeat !important;
  703.     padding: 16px 0 0 16px !important;
  704. }
  705.  
  706. img[src*="img/icon_sticky.png"] {
  707.     width: 0 !important;
  708.     height: 0 !important;
  709.     background: transparent url(http://i.imgur.com/IpmQQae.png) no-repeat !important;
  710.     padding: 16px 0 0 16px !important;
  711. }
  712.  
  713. /* ---------->>> MISC <<<---------- */
  714.  
  715. .clear {
  716.     display: none;
  717.     height: 0px;
  718. }
  719.  
  720. .headerimage {
  721.     position: relative;
  722.     width: 0px;
  723.     height: 0px;
  724.     margin-left: auto;
  725.     margin-right: auto;
  726.     margin-bottom: 0px;
  727.     background-image: url();
  728.     background-repeat: no-repeat;
  729. }
  730.  
  731. .separator {
  732.     background: transparent;
  733.     height: 30px;
  734.     background-image: url();
  735.     background-repeat: repeat-x;
  736. }
  737.  
  738. .skiplinks {
  739.     text-align: center;
  740.     padding: 10px;
  741.     color: #ffffff;
  742.     font-family: Arial;
  743.     font-size: 14px;
  744.     background-color: transparent;
  745.     margin-bottom: 15px;
  746. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement