Advertisement
Codesbyneen

001. Layout - Princess Peach

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