API tools faq
paste
666rps

Limitless - indie theme

666rps
Jan 25th, 2017
586
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 31.58 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!--
  5.         LIMITLESS
  6.         theme #01 by @666rps
  7.        
  8.         THANK YOU TO:
  9.        
  10.         - @neonbikethemes for the tabs base code/script
  11.         - @htmlqueens for the tooltip base code/script
  12.        
  13.         RULES:
  14.        
  15.         - do not use as a base.
  16.             other than the above credits,
  17.             this was coded entirely by @666rps.
  18.         - do not move or alter the credit.
  19.         - do not steal code.
  20.         - like and/or reblog the post.
  21.  
  22. -->
  23.  
  24. <head><title>{Title}</title>
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  28.  
  29. <meta name="image:bg" content=""/>
  30. <meta name="image:header" content=""/>
  31.  
  32. <meta name="color:bg" content="#e7e7e7"/>
  33. <meta name="color:header" content="#b8b8b8"/>
  34. <meta name="color:title" content="#5d63b0"/>
  35. <meta name="color:container" content="#ffffff"/>
  36. <meta name="color:posts" content="#e7e7e7"/>
  37. <meta name="color:text" content="#767676"/>
  38. <meta name="color:links" content="#4c4c4c"/>
  39. <meta name="color:links hover" content="#c9c9c9"/>
  40. <meta name="color:accent" content="#669f93"/>
  41. <meta name="color:border" content="#c9c9c9"/>
  42. <meta name="color:tags" content="#c6c6c6"/>
  43.  
  44. <meta name="text:title" content="title here"/>
  45.  
  46. <meta name="if:GrayscaleMuseIcons" content="0"/>
  47.  
  48. <link href="https://fonts.googleapis.com/css?family=Muli:400,400i,700|Montserrat:400,700" rel="stylesheet">
  49.  
  50. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  51.  
  52. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
  53. <script type="text/javascript">
  54. $(document).ready(function() {
  55.     $('.museh').on('click', function() {
  56.         $parent_box = $(this).closest('.muse');
  57.         $parent_box.siblings().find('.museb').hide(500);
  58.         $parent_box.find('.museb').slideToggle(500);
  59.     });
  60. });
  61. </script>
  62.  
  63. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="http://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  64. <script>
  65. (function($){
  66. $(document).ready(function(){
  67. $("[title]").style_my_tooltips({
  68. tip_follows_cursor:true,
  69. tip_delay_time:100,
  70. tip_fade_speed:300
  71. });
  72. });
  73. })(jQuery);
  74. </script>
  75.  
  76. <style type="text/css">
  77.  
  78. /*
  79.  
  80. Check the gray comments that look like this in the code for customization options.
  81.  
  82. If you need anymore help customizing, contact @666rps.
  83.  
  84. */
  85.  
  86. #s-m-t-tooltip {
  87.     max-width: 300px;
  88.     background-color: {color:accent};
  89.     color: {color:posts};
  90.     border-radius: 4px;
  91.     -webkit-border-radius: 4px;
  92.     -moz-border-radius: 4px;
  93.     z-index: 999999;
  94.     margin: 10px 7px -2px 10px;
  95.     font-size: 9px;
  96.     padding: 2px 5px;
  97.     font-weight: 700;
  98.     letter-spacing: 1px;
  99.     font-family: 'Montserrat', calibri, sans-serif;
  100.     text-transform: uppercase;
  101.     text-align: center;
  102. }
  103.  
  104. @font-face { font-family: "fashion_light"; src: url('https://dl.dropboxusercontent.com/s/0wsl42bnojrx0cb/Fashion%20Fetish%20Light.ttf'); format("truetype");}
  105.  
  106. @font-face { font-family: "fashion"; src: url('https://dl.dropboxusercontent.com/s/hgjzriga1ji2gjt/Fashion%20Fetish%20Regular.ttf'); format("truetype");}
  107.  
  108. ::selection {
  109.     background: {color:accent};
  110.     color: {color:bg};
  111. }
  112. ::-moz-selection {
  113.     background: {color:accent};
  114.     color: {color:bg};
  115. }
  116. ::-webkit-selection {
  117.     background: {color:accent};
  118.     color: {color:bg};
  119. }
  120. ::-webkit-selection {
  121.     background: {color:accent};
  122.     color: {color:bg};
  123. }
  124. ::-webkit-scrollbar {
  125.     background-color: transparent;
  126.     height: 2px;
  127.     width: 2px;
  128. }
  129. ::-webkit-scrollbar-thumb:vertical {
  130.     background-color: {color:accent};
  131. }
  132. ::-webkit-scrollbar-thumb:horizontal {
  133.     background-color: transparent;
  134.     height: 5px;
  135. }
  136.  
  137. .tmblr-iframe, #tumblr_controls {
  138.     position: fixed;
  139.     z-index: 999999999999;
  140.     opacity: 0.5;
  141.     -webkit-filter: invert(100%);
  142.     filter: invert(100%);
  143. }
  144.  
  145. html, body {
  146.     height: 100%;
  147. }
  148.  
  149. body {
  150.     background: {color:bg} url({image:bg});
  151.     background-size: cover;
  152.     color: {color:text};
  153.     font-family: 'Muli', calibri, sans-serif;
  154.     font-size: 11px;
  155.     margin: 0;
  156.     line-height: 15px;
  157.     -webkit-font-smoothing: antialiased;
  158.     font-smoothing: antialiased;
  159.     overflow: hidden;
  160. }
  161.  
  162. small, sub, sup {
  163.     font-size: 11px;    
  164. }
  165.  
  166. b, strong {
  167.     color: {color:accent};
  168.     text-transform: uppercase;
  169.     border-bottom: 1px dashed {color:accent};
  170.     font-weight: 700;
  171.     font-family: 'Montserrat', helvetica, sans-serif;
  172. }
  173.  
  174. i, em, s, strike {
  175.     letter-spacing: 1px;
  176.     color: {color:title};
  177. }
  178.  
  179. blockquote {
  180.     padding-top: 1px;
  181.     padding-bottom: 1px;
  182.     padding-left: 10px;
  183.     border-left: 1px solid {color:border};
  184.     margin: 7px;
  185. }
  186.  
  187. blockquote blockquote ul {
  188.     width: 80%;
  189. }
  190.  
  191. hr {
  192.     border: 0;
  193.     height: 1px;
  194.     background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  195. }
  196.  
  197. a {
  198.     color: {color:links};
  199.     text-decoration: none;
  200.     border-bottom: none;
  201.     letter-spacing: 0px;
  202.     -webkit-transition: all 0.5s ease;
  203.     -moz-transition: all 0.5s ease;
  204.     -ms-transition: all 0.5s ease;
  205.     -o-transition: all 0.5s ease;
  206.     transition: all 0.5s ease;
  207. }
  208.  
  209. a:hover {
  210.     text-decoration: none;
  211.     color: {color:links hover};
  212.     -webkit-transition: all 0.5s ease;
  213.     -moz-transition: all 0.5s ease;
  214.     -ms-transition: all 0.5s ease;
  215.     -o-transition: all 0.5s ease;
  216.     transition: all 0.5s ease;
  217. }
  218.  
  219. ul {  
  220.     list-style-type: none;
  221.     margin-left: 3em;
  222.     padding-left: 10px;
  223.     line-height: 125%;
  224. }
  225.  
  226. ul > li:before {
  227.     content: '─';
  228.     display: inline-block;
  229.     font-size: 0.8em;
  230.     width: 2em;
  231.     margin-left: -2.1em;
  232. }
  233.  
  234. h1 {
  235.     font-weight: bold;
  236.     font-size: 28px;
  237.     text-align: center;
  238.     color: {color:accent};
  239.     line-height: 100%;
  240.     font-family: 'fashion', helvetica, sans-serif;
  241.     text-transform: uppercase;
  242.     letter-spacing: -1px;
  243. }
  244.  
  245. h2 {
  246.     color: {color:title};
  247.     font-family: 'fashion_light', helvetica, sans-serif;
  248.     font-size: 22px;
  249.     text-align: center;
  250.     line-height: 120%;
  251.     text-transform: uppercase;
  252. }
  253.  
  254. h2 small {
  255.     font-size: 16px;
  256. }
  257.  
  258. h3 {
  259.     color: {color:accent};
  260.     text-transform: uppercase;
  261.     letter-spacing: 2px;
  262.     font-size: 14px;
  263.     font-family: 'Muli', helvetica, calibri, sans-serif;
  264.     text-align: center;
  265.     font-weight: bold;
  266.     margin: 5px 0;
  267. }
  268.  
  269. pre {
  270.     font-size: 10px;
  271.     background-color: {color:accent};
  272.     color: {color:posts};
  273.     white-space: pre-wrap;
  274.     white-space: -moz-pre-wrap;
  275.     white-space: -pre-wrap;
  276.     white-space: -o-pre-wrap;
  277.     word-wrap: break-word;
  278.     padding: 5px;
  279.     line-height: 125%;
  280. }
  281.  
  282. #container {
  283.     background-color: {color:container};
  284.     height: 550px;
  285.     width: 460px;
  286.     position: absolute;
  287.     top: 50%;
  288.     left: 50%;
  289.     margin-top: -240px;
  290.     margin-left: -240px;
  291.     padding: 5px;
  292. }
  293.  
  294. .header {
  295.     position: absolute;
  296.     height: 100px;
  297.     width: 470px;
  298.     margin-top: -105px;
  299.     margin-left: -5px;
  300.     background: url('{image:header}') {color:header};
  301. }
  302.  
  303. .title {
  304.     position: absolute;
  305.     text-align: right;
  306.     font-family: 'fashion', helvetica, calibri, sans-serif;
  307.     color: {color:title};
  308.     font-size: 26px;
  309.     font-weight: bold;
  310.     letter-spacing: 3px;
  311.     width: 350px;
  312.     margin-left: 110px;
  313.     height: 20px;
  314.     bottom: 0;
  315.     right: 10px;
  316.     text-shadow: 2px 1px 0 {color:posts};
  317. }
  318.  
  319. .tab-nav {
  320.     position: absolute;
  321.     text-align: center;
  322.     width: 75px;
  323.     margin-left: 0;
  324. }
  325.  
  326. .tab-nav li {
  327.     display: inline-block;
  328.     list-style: none;
  329. }
  330.  
  331. .tab-nav li:before {
  332.     content: '';
  333. }
  334.  
  335. .tab-nav li a {
  336.     display: inline-block;
  337.     -webkit-border-radius: 100%;
  338.     -moz-border-radius: 100%;
  339.     border-radius: 100%;
  340.     border: 2px solid {color:posts};
  341.     background: {color:accent};
  342.     color: {color:posts};
  343.     padding: 5px;
  344.     width: 15px;
  345.     height: 15px;
  346.     font-size: 15px;
  347.     margin: 4px 2px;
  348. }
  349.  
  350. li.active a, li a:hover {
  351.     color: {color:accent};
  352.     background: {color:posts};
  353.     border: 2px solid {color:accent};
  354. }
  355.  
  356. .tab {
  357.     display: none;
  358.     background: url('') {color:container};
  359.     width: 440px;
  360.     height: 530px;
  361.     padding: 10px;
  362.     position: absolute;
  363. }
  364.  
  365. .tab.active {
  366.     display: block;
  367. }
  368.  
  369. .tab.x {
  370.     background: {color:posts};
  371.     width: 420px;
  372.     height: 510px;
  373.     overflow: auto;
  374. }
  375.  
  376. #tab2 img {
  377.     width: 65px;
  378.     height: 65px;
  379.     margin: 5px;
  380.     padding: 5px;
  381.     border: 3px dashed {color:accent};
  382.     border-radius: 100%;
  383.     -moz-border-radius: 100%;
  384.     -webkit-border-radius: 100%;
  385. }
  386.  
  387. .guidelines, .about-mun {
  388.     border: 1px solid {color:border};
  389.     width: 250px;
  390.     padding: 15px;
  391.     height: 100px;
  392.     overflow: auto;
  393.     text-align: justify;
  394.     margin: 25px 15px;
  395. }
  396.  
  397. ul.gl {
  398.     margin-left: 10px;
  399. }
  400.  
  401. .center-nav {
  402.     margin: 10px auto;
  403.     text-align: center;
  404.     width: 350px;
  405. }
  406.  
  407. .center-nav a {
  408.     background: {color:title};
  409.     color: {color:posts};
  410.     padding: 5px;
  411.     margin: 2px;
  412.     width: 155px;
  413.     display: inline-block;
  414.     text-transform: uppercase;
  415.     font-weight: bold;
  416.     font-size: 12px;
  417. }
  418.  
  419. .center-nav a:hover {
  420.     background: {color:accent};
  421.     letter-spacing: 3px;
  422. }
  423.  
  424. .left {
  425.     float: left;
  426. }
  427.  
  428. .right {
  429.     float: right;
  430. }
  431.  
  432. #tab3 {
  433.     text-align: center;
  434. }
  435.  
  436. .muse {
  437.     margin: 0 auto;
  438.     width: 85%;
  439. }
  440.  
  441. .museh {
  442.     font-family: "fashion_light", helvetica, calibri, sans-serif;
  443.     font-size: 18px;
  444.     font-weight: bold;
  445.     padding: 10px;
  446.     background-color: {color:title};
  447.     color: {color:posts};
  448.     cursor: pointer;
  449.     margin: 32px auto;
  450.     text-transform: uppercase;
  451. }
  452.  
  453. .museh img {
  454.     float: left;
  455.     width: 60px;
  456.     height: 60px;
  457.     margin-top: -25px;
  458.     margin-left: -25px;
  459.     border-radius: 100%;
  460.     -moz-border-radius: 100%;
  461.     -webkit-border-radius: 100%;
  462.     border: 3px dashed {color:title};
  463.     cursor: pointer;
  464.     {block:ifGrayscaleMuseIcons}
  465.     border: none;
  466.     -webkit-filter: grayscale(100%);
  467.     filter: grayscale(100%);
  468.     {/block:ifGrayscaleMuseIcons}
  469. }
  470.  
  471. .museb {
  472.     display: none;
  473.     float: right;
  474.     margin-top: -15px;
  475.     width: 88%;
  476. }
  477.  
  478. .musei {
  479.     padding: 0 15px;
  480. }
  481.  
  482. .musel {
  483.     margin-top: 10px;
  484.     width: 100%;
  485.     background: {color:accent};
  486.     line-height: 200%;
  487. }
  488.  
  489. .musel a {
  490.     color: {color:posts};
  491.     padding: 5px;
  492.     font-weight: bold;
  493.     text-transform: uppercase;
  494.     -webkit-transition: all 0.5s ease;
  495.     -moz-transition: all 0.5s ease;
  496.     -ms-transition: all 0.5s ease;
  497.     -o-transition: all 0.5s ease;
  498.     transition: all 0.5s ease;
  499. }
  500.  
  501. .pagi {
  502.     width: 450px;
  503.     text-align: center;
  504.     letter-spacing: 3px;
  505. }
  506.  
  507. .pagi a {
  508.     color: {color:posts};
  509.     font-family: Muli, calibri, sans-serif;
  510.     font-size: 44px;
  511.     font-weight: bold;
  512.     letter-spacing: 1px;
  513.     text-transform: uppercase;
  514.     border: none;
  515.     padding: 3px;
  516.     -webkit-transition: all 0.5s ease;
  517.     -moz-transition: all 0.5s ease;
  518.     -ms-transition: all 0.5s ease;
  519.     -o-transition: all 0.5s ease;
  520.     transition: all 0.5s ease;
  521. }
  522.  
  523. .pagi a:hover {
  524.     color: {color:links hover};
  525.     -webkit-transition: all 0.5s ease;
  526.     -moz-transition: all 0.5s ease;
  527.     -ms-transition: all 0.5s ease;
  528.     -o-transition: all 0.5s ease;
  529.     transition: all 0.5s ease;
  530. }
  531.  
  532. .posts {
  533.     width: 440px;
  534.     height: 530px;
  535.     overflow: auto;
  536.     overflow-x: hidden;
  537. }
  538.  
  539. .post {
  540.     background-color: {color:posts};
  541.     padding: 20px;
  542.     width: 400px;
  543.     margin-bottom: 15px;
  544. }
  545.  
  546. .post ul {  
  547.     list-style-type: none;
  548.     margin-left: 3em;
  549.     padding-left: 10px;
  550.     line-height: 125%;
  551. }
  552.  
  553. .post ul > li:before {
  554.     content: '─';
  555.     display: inline-block;
  556.     font-size: 0.8em;
  557.     width: 2em;
  558.     margin-left: -2.1em;
  559. }
  560.  
  561. .post img, .post li, .post blockquote {
  562.     max-width: 100%;
  563.     height: auto;
  564. }
  565.  
  566. .post ol {  
  567.     list-style: decimal-leading-zero;
  568. }
  569.  
  570. blockquote img {
  571.     max-width: 100%;
  572.     height: auto;
  573.     border: none;
  574. }
  575.  
  576. .info {
  577.     border-top: 1px solid {color:border};
  578.     padding-top: 5px;
  579.     text-transform: uppercase;
  580.     font-size: 8px;
  581.     margin-top: 12px;
  582.     margin-bottom: 5px;
  583. }
  584.  
  585. .info a, .like_button::before, .like_button:hover::before {
  586.     border: none;
  587. }
  588.  
  589. .info b {
  590.     border: none;
  591.     font-size: 8px;
  592. }
  593.  
  594. .lnr-redo {
  595.     padding-right: 5px;
  596. }
  597.  
  598. .like_button {
  599.     position:relative;
  600.     display:inline;
  601.     overflow:hidden;
  602.     width:1.5em;
  603. }
  604.  
  605. .like_button iframe {
  606.     position:absolute;
  607.     top:0;
  608.     left:0;
  609.     width:100%;
  610.     height:100%;
  611.     opacity:0;
  612. }
  613.  
  614. .like_button::before {
  615.     position:relative;
  616.     content:'♡';
  617.     color:{color:Links};
  618. }
  619.  
  620. .like_button:hover:before {
  621.     color: red;
  622.     -webkit-transition: all 0.5s ease;
  623.     -moz-transition: all 0.5s ease;
  624.     -ms-transition: all 0.5s ease;
  625.     -o-transition: all 0.5s ease;
  626.     transition: all 0.5s ease;
  627. }
  628.  
  629. .like_button.liked::before {
  630.     color: red;
  631. }
  632.  
  633. .tags {
  634.     font-size: 7px;
  635.     text-transform: uppercase;
  636.     text-align: justify;
  637.     -webkit-transition: all 0.5s ease;
  638.     -moz-transition: all 0.5s ease;
  639.     -ms-transition: all 0.5s ease;
  640.     -o-transition: all 0.5s ease;
  641.     transition: all 0.5s ease;
  642.     line-height:105%;
  643. }
  644.  
  645. .tags a {
  646.     color: {color:tags};    
  647.     margin-right: 5px;
  648.     border: none;
  649. }
  650.  
  651. .tags a:hover {
  652.     color: {color:links hover};
  653.     letter-spacing: 1px;
  654. }
  655.  
  656. ol.notes {
  657.     background-color: {color:posts};
  658.     padding-left: 15px;
  659.     margin: 25px 0px 0px 0px;
  660.     list-style-type: none;
  661. }
  662.  
  663. ol.notes a {
  664.     border: none;
  665. }
  666.  
  667. ol.notes li.note {
  668.     padding: 10px;
  669. }
  670.  
  671. ol.notes li.note img.avatar {
  672.     vertical-align: -4px;
  673.     margin-right: 10px;
  674.     width: 16px;
  675.     height: 16px;
  676.     border: none;
  677. }
  678.  
  679. ol.notes li.note span.action {
  680.     font-weight: normal;
  681. }
  682.  
  683. ol.notes li.note .answer_content {
  684.     font-weight: normal;
  685. }
  686.  
  687. ol.notes li.note blockquote {
  688.     padding: 4px 10px;
  689.     margin: 10px 0px 0px 25px;
  690. }
  691.  
  692. ol.notes li.note blockquote a {
  693.     text-decoration: none;
  694.     border: none;
  695. }
  696.  
  697. .quote {
  698.     font-family: 'fashion_light', helvetica, sans-serif;
  699.     font-weight: bold;
  700.     font-size: 26px;
  701.     text-align: center;
  702.     line-height: 100%;
  703. }
  704.  
  705. .quote bl {
  706.     color: {color:accent};
  707. }
  708.  
  709. .quotesource {
  710.     text-align: right;
  711.     margin-top: 10px;
  712. }
  713.  
  714. ul.bubble {
  715.     overflow: hidden;
  716.     padding: 0;
  717.     margin: 0;
  718.     font-family: Helvetica Neue, sans-serif;
  719.     font-size: 12px;
  720.     list-style: none;
  721. }
  722.  
  723. ul.bubble li:before {
  724.     content: '';
  725.     margin-right: 0px;
  726. }
  727.  
  728. ul.bubble li {
  729.     margin: 0 0 5px;
  730.     border-radius: 1em;
  731.     padding: .5em 10px;
  732.     max-width: 75%;
  733.     clear: both;
  734.     position: relative;
  735.     list-style: none;
  736. }
  737.  
  738. ul.bubble li strong {
  739.     color: #000;
  740.     text-transform: uppercase;
  741.     font-size: 12px;
  742.     font-family: Helvetica Neue, sans-serif;
  743.     letter-spacing: none;
  744.     border: none;
  745. }
  746.  
  747. .user_1,.user_3,.user_5,.user_7,.user_9,.user_11,.user_13,.user_15,.user_17,.user_19,.user_21,.user_23,.user_25,.user_27,.user_29,.user_31,.user_33,.user_35,.user_37,.user_39,.user_41,.user_43,.user_45,.user_47,.user_49 {
  748.     float: left;
  749.     background: #d8d9d9;
  750.     color: #000;
  751.     left: 3px;
  752. }
  753.  
  754. .user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after,.user_13::after,.user_15::after,.user_17::after,.user_19::after,.user_21::after,.user_23::after,.user_25::after,.user_27::after,.user_29::after,.user_31::after,.user_33::after,.user_35::after,.user_37::after,.user_39::after,.user_41::after,.user_43::after,.user_45::after,.user_47::after,.user_49::after {
  755.     content:"";
  756.     position: absolute;
  757.     left: -.5em;
  758.     bottom: 0;
  759.     width: .5em;
  760.     height: 1em;
  761.     border-right: .5em solid #d8d9d9;
  762.     border-bottom-right-radius: 1em .5em;
  763. }
  764.  
  765. .user_2,.user_4,.user_6,.user_8,.user_10,.user_12,.user_14,.user_16,.user_18,.user_20,.user_22,.user_24,.user_26,.user_28,.user_30,.user_32,.user_34,.user_36,.user_38,.user_40,.user_42,.user_44,.user_46,.user_48,.user_50 {
  766.     right: 3px;
  767.     float: right;
  768.     background-color: #a9bdc4;
  769.     color: #000;
  770. }
  771.  
  772. .user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after,.user_14::after,.user_16::after,.user_18::after,.user_20::after,.user_22::after,.user_24::after,.user_26::after,.user_28::after,.user_30::after,.user_32::after,.user_34::after,.user_36::after,.user_38::after,.user_40::after,.user_42::after,.user_44::after,.user_46::after,.user_48::after,.user_50::after {
  773.     content: "";
  774.     position: absolute;
  775.     right: -.5em;
  776.     bottom: 0;
  777.     width: .5em;
  778.     height: 1em;
  779.     border-left: .5em solid #a9bdc4;
  780.     border-bottom-left-radius: 1em .5em;
  781. }
  782.  
  783. .portrait {
  784.     float: left;
  785.     margin: 0px 5px 0 0px;
  786.     padding: 5px;
  787.     border: 1px solid {color:border};
  788.     border-radius: 50%;
  789.     -moz-border-radius: 50%;
  790.     -webkit-border-radius: 50%;
  791. }
  792.  
  793. .portrait img {
  794.     width: 35px;
  795.     height: 35px;
  796.     border-radius: 50%;
  797.     -moz-border-radius: 50%;
  798.     -webkit-border-radius: 50%;
  799. }
  800.  
  801. .asker {
  802.     font-family: 'fashion_light', helvetica, sans-serif;
  803.     font-size: 18px;
  804.     text-align: right;
  805.     letter-spacing: 2px;
  806.     z-index: 999;
  807.     color: {color:links};
  808.     margin-top: -5px;
  809.     font-weight: bold;
  810. }
  811.  
  812. .speech {
  813.     background: #f1f1f1;
  814.     color: {color:text};
  815.     text-align: justify;
  816.     margin: 5px 0px 5px 55px;
  817.     padding: 10px;
  818.     border: 1px dashed {color:container};
  819. }
  820.  
  821. .playerbutton {
  822.     position: relative;
  823.     width: 30px;
  824.     height: 35px;
  825.     margin-left: 3px;
  826.     overflow: hidden;
  827. }
  828.            
  829. .playerbuttonhug {
  830.     position: absolute;
  831.     top: -7px;
  832.     left: 2px;
  833. }
  834.  
  835. .tumblr_audio_player {
  836.     height: 50px;
  837.     width: 300px;
  838. }
  839.  
  840. .playerbuttonbg {
  841.     position: absolute;
  842.     width: 35px;
  843.     height: 35px;
  844.     background-color: #e4e4e4;
  845.     padding: 10px;
  846.     -moz-border-radius: 25px;
  847.     -webkit-border-radius: 25px;
  848.     border-radius: 25px;
  849. }
  850.            
  851. .trackdetails {
  852.     width: auto;
  853.     display: inline-block;
  854.     margin-left: 70px;
  855.     font-size: 10px;
  856.     letter-spacing: 1px;
  857.     padding: 5px;
  858.     line-height: 15px;
  859. }
  860.  
  861. .trackdetails b {
  862.     letter-spacing: -1px;    
  863. }
  864.            
  865. .audiowrapper {
  866.     position: relative;
  867.     display: inline-block;
  868. }
  869.  
  870. .cdt {
  871.     position: fixed;
  872.     bottom: 15px;
  873.     left: 15px;
  874. }
  875.  
  876. .cdt a {
  877.     font-size: 14px;
  878.     background-color: {color:accent};
  879.     padding: 6px 6px 4px 6px;
  880.     border-bottom: none;
  881.     -moz-border-radius: 25px;
  882.     -webkit-border-radius: 25px;
  883.     border-radius: 25px;
  884. }
  885.  
  886. .cdt a i {
  887.     color: {color:bg};
  888. }
  889.  
  890. .cdt a:hover {
  891.     background-color: {color:bg};
  892.     -moz-border-radius: 0px;
  893.     -webkit-border-radius: 0px;
  894.     border-radius: 0px;
  895. }
  896.  
  897. .cdt a:hover i {
  898.     color: {color:accent};
  899. }
  900.  
  901. </style>
  902.  
  903. </head>
  904.  
  905. <body>
  906.  
  907. <div class="cdt"><a title="theme by nic" href="http://666rps.tumblr.com"><i class="lnr lnr-heart"></i></a></div>
  908.  
  909. <div id="container">
  910.  
  911.     <div class="header">
  912.        
  913.         <div class="title">{text:title}</div>
  914.        
  915.         <div class="tabs">
  916.             <ul class="tab-nav">
  917.                 <li class="active">
  918.                 <a title="home" href="/"><span class="lnr lnr-home"></span></a></li>
  919.                 <li><a title="contact" href="#tab1"><span class="lnr lnr-star"></span></a></li>
  920.                 <li><a title="information" href="#tab2"><span class="lnr lnr-diamond"></span></a></li>
  921.                 <li><a title="muses" href="#tab3"><span class="lnr lnr-camera"></span></a></li>
  922.             </ul>
  923.         </div>
  924.     </div>
  925.    
  926.     <div class="tabs">
  927.    
  928.     <div class="tab active">
  929.    
  930.         <div class="posts">
  931.             {block:Posts}
  932.             <div class="post">
  933.              
  934.                 {block:Text}
  935.                 {block:Title}<h1>{Title}</h1>{/block:Title}
  936.                 {Body}{/block:Text}
  937.                  
  938.                  
  939.                 {block:Photo}
  940.                 <div class="faded"><img src="{PhotoURL-HighRes}" width="100%"></div>
  941.                 {block:Caption}{Caption}{/block:Caption}
  942.                 {/block:Photo}
  943.                  
  944.                  
  945.                 {block:Photoset}
  946.  
  947.                 {Photoset}
  948.                
  949.                 {block:Caption}{Caption}{/block:Caption}
  950.                
  951.                 {/block:Photoset}
  952.  
  953.                  
  954.                 {block:Quote}
  955.                 <div class="quote"><bl>❝</bl> {Quote} <bl>❞</bl></div>
  956.                 {block:Source}<div class="quotesource"> ─ {Source}</div>
  957.                 {/block:Source}{/block:Quote}
  958.                  
  959.                  
  960.                 {block:Link}
  961.                 <h1><a href="{URL}" {Target}>{Name}</a></h1>
  962.                 {block:Description}{Description}{/block:Description}
  963.                 {/block:Link}
  964.                  
  965.                 {block:Chat}
  966.                 {block:Title}
  967.                 <h1>{Title}</h1>{/block:Title}<br>
  968.                 <ul class="bubble">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label} {Line}</li>{/block:Lines}</ul>{/block:Chat}
  969.                  
  970.                 {block:Audio}
  971.                 {block:AudioPlayer}
  972.                 <div class="audiowrapper">
  973.                 <div class="playerbuttonbg">
  974.                 <div class="playerbutton">
  975.                 <div class="playerbuttonhug">
  976.                 {AudioPlayerGrey}
  977.                 </div></div></div>
  978.                  
  979.                 <div class="trackdetails">
  980.                 {block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}<br>
  981.                  
  982.                 {block:Artist}<b>ARTIST:</b> {Artist}{/block:Artist}<br>
  983.                  
  984.                 <b>PLAYS:</b> {FormattedPlayCount}</div></div>
  985.                 {/block:AudioPlayer}
  986.                  
  987.                 {block:Caption}
  988.                 <div class="caption">{Caption}</div>
  989.                 {/block:Caption}
  990.                 {/block:Audio}
  991.                  
  992.                  
  993.                 {block:Video}
  994.                 <center>{Video-400}</center>
  995.                 {block:Caption}{Caption}{/block:Caption}
  996.                 {/block:Video}
  997.                  
  998.                  
  999.                 {block:Answer}<a href="{AskerURL}"><span class="portrait"><img src="{AskerPortraitURL-40}" align="left"></span></a>
  1000.                 <div class="speech"><span></span>{Question}</div>
  1001.                 <div class="asker">– {Asker}</div>
  1002.                 {Answer}
  1003.                 {/block:Answer}
  1004.                  
  1005.                 {block:Date}
  1006.                 <div class="info">
  1007.                
  1008.                 <b><a title="{TimeAgo}" href="{Permalink}">{DayOfMonthWithZero}.{ShortMonth}.{ShortYear}</b></a> &nbsp;&nbsp;
  1009.                  
  1010.                 {block:NoteCount}
  1011.                 <a href="{Permalink}">{NoteCountWithLabel}</a>&nbsp;&nbsp;
  1012.                 {/block:NoteCount}
  1013.                  
  1014.                 {block:RebloggedFrom}
  1015.                 <a href="{ReblogParentURL}" title="{ReblogParenttitle}">via</a>
  1016.                 {block:ContentSource} /
  1017.                 <a href="{ReblogRootURL}" "{ReblogRootName}" title="{ReblogRoottitle}"> src</a>
  1018.                 {/block:ContentSource}
  1019.                 {/block:RebloggedFrom}
  1020.                  
  1021.                 <div style="text-align:right;margin-top:-15px;">
  1022.                 <a href="{ReblogURL}" target="_blank" class="details"><span class="lnr lnr-redo"></span></a>
  1023.                 {LikeButton color="grey" size="10"}
  1024.                 </div>
  1025.            
  1026.              {/block:Date}
  1027.          
  1028.             {block:HasTags}
  1029.             <div class="tags">
  1030.             {block:Tags}
  1031.             <a href="{TagURL}">#{Tag}</a>
  1032.             {/block:Tags}
  1033.             </div>
  1034.             {/block:HasTags}
  1035.             </div>
  1036.      
  1037. </div>
  1038.  
  1039. {block:PostNotes}
  1040. {PostNotes}
  1041. {/block:PostNotes}
  1042.  
  1043. {/block:Posts}
  1044.  
  1045. <div class="pagi">
  1046.     {block:Pagination}{block:PreviousPage}
  1047.         <a href="{PreviousPage}">«</a>
  1048.     {/block:PreviousPage}{block:NextPage}
  1049.         <a href="{NextPage}">»</a>
  1050.     {/block:NextPage}{/block:Pagination}
  1051. </div>
  1052.  
  1053. </div>
  1054.  
  1055.     <div id="tab1" class="tab x">
  1056.         <h1>Any Questions?</h1>
  1057.        
  1058.         <iframe frameborder="0" scrolling="no" width="100%" height="190" src="https://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]-->
  1059.        
  1060.         <h1>Leave Me Something!</h1>
  1061.         <iframe frameborder="0" scrolling="no" width="100%" height="530" id="submit_form" src="https://www.tumblr.com/submit_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('submit_form').allowTransparency=true;</script><![endif]-->
  1062.     </div>
  1063.    
  1064.     <div id="tab2" class="tab x">
  1065.         <div class="guidelines left">
  1066.             <h3>Guidelines</h3>
  1067.             <ul class="gl">
  1068.                 <li>guideline one here</li>
  1069.                 <li>guideline two here</li>
  1070.  
  1071. <!-- To add another guideline, copy/paste the following directly above this line:
  1072.                 <li>guideline here</li>
  1073. -->
  1074.             </ul>
  1075.         </div>
  1076.         <img class="right" src="http://placehold.it/65">
  1077.         <img class="right" src="http://placehold.it/65">
  1078.         <div style="clear: both;"></div>
  1079.         <div class="center-nav">
  1080.             <a href="/">link</a>
  1081.             <a href="/">link</a>
  1082.             <a href="/">link</a>
  1083.             <a href="/">link</a>
  1084.             <a href="/">link</a>
  1085.             <a href="/">link</a>
  1086.             <a href="/">link</a>
  1087.             <a href="/">link</a>
  1088.         </div>
  1089.         <div class="about-mun right">
  1090.             <h3>About the Mun</h3>
  1091.             write whatever you want about yourself here. you might want to include your name or alias, time zone, age, and pronouns, as well as activity level or how busy you are. you can list other blogs you have with a <a href="/">link</a> to each, like that.
  1092.         </div>
  1093.         <img class="left" src="http://placehold.it/65">
  1094.         <img class="left" src="http://placehold.it/65">
  1095.         <div style="clear: both;"></div>
  1096.     </div>
  1097.    
  1098.     <div id="tab3" class="tab x">
  1099.         <h1>Muses</h1>
  1100.        
  1101. <!-- Muse one begins here. -->
  1102.        
  1103.         <div class="muse">
  1104.             <div class="museh">
  1105.                 <img src="http://placehold.it/60">
  1106.                 muse name
  1107.             </div>
  1108.             <div class="museb">
  1109.                 <div class="musei">
  1110.                     <strong>birth name:</strong> birth name &nbsp; <strong>stage name:</strong> stage name &nbsp; <strong>gender:</strong> gender &nbsp; <strong>orientation:</strong> orientation &nbsp; <strong>date of birth:</strong> date of birth &nbsp; <strong>place of birth:</strong> place of birth &nbsp; <strong>occupation:</strong> occupation &nbsp; <strong>face claim:</strong> face claim
  1111.                 </div>
  1112.                 <div class="musel">
  1113.                     <a title="stats" href="/">01.</a>
  1114.                     <a title="visual" href="/">02.</a>
  1115.                     <a title="musings" href="/">03.</a>
  1116.                     <a title="threads" href="/">04.</a>
  1117.                     <a title="starters" href="/">05.</a>
  1118.  
  1119. <!-- To add another link, copy/paste the following directly above this line:
  1120.  
  1121.                     <a title="link title" href="/">06.</a>
  1122. -->
  1123.  
  1124.                 </div>
  1125.             </div>
  1126.             <div style="clear: both;"></div>
  1127.         </div>
  1128.  
  1129. <!-- Muse one ends here. -->
  1130.  
  1131. <!-- Muse two begins here. -->
  1132.        
  1133.         <div class="muse">
  1134.             <div class="museh">
  1135.                 <img src="http://placehold.it/60">
  1136.                 muse name
  1137.             </div>
  1138.             <div class="museb">
  1139.                 <div class="musei">
  1140.                     <strong>birth name:</strong> birth name &nbsp; <strong>stage name:</strong> stage name &nbsp; <strong>gender:</strong> gender &nbsp; <strong>orientation:</strong> orientation &nbsp; <strong>date of birth:</strong> date of birth &nbsp; <strong>place of birth:</strong> place of birth &nbsp; <strong>occupation:</strong> occupation &nbsp; <strong>face claim:</strong> face claim
  1141.                 </div>
  1142.                 <div class="musel">
  1143.                     <a title="stats" href="/">01.</a>
  1144.                     <a title="visual" href="/">02.</a>
  1145.                     <a title="musings" href="/">03.</a>
  1146.                     <a title="threads" href="/">04.</a>
  1147.                     <a title="starters" href="/">05.</a>
  1148.                 </div>
  1149.             </div>
  1150.             <div style="clear: both;"></div>
  1151.         </div>
  1152.  
  1153. <!-- Muse two ends here. -->
  1154.  
  1155. <!-- To add another muse, paste the following directly above this line:
  1156.  
  1157.         <div class="muse">
  1158.             <div class="museh">
  1159.                 <img src="https://68.media.tumblr.com/307ba6e4db175dfa9812c1d9f8aac673/tumblr_oja9lxQqCC1urkt8fo8_250.png">
  1160.                 johnny
  1161.             </div>
  1162.             <div class="museb">
  1163.                 <div class="musei">
  1164.                     <strong>birth name:</strong> seo young ho &nbsp; <strong>stage name:</strong> johnny &nbsp; <strong>gender:</strong> cisgender male &nbsp; <strong>orientation:</strong> unknown &nbsp; <strong>date of birth:</strong> february 9, 1995 &nbsp; <strong>place of birth:</strong> chicago, il, usa &nbsp; <strong>occupation:</strong> rapper &nbsp; <strong>face claim:</strong> himself
  1165.                 </div>
  1166.                 <div class="musel">
  1167.                     <a title="stats" href="/">01.</a>
  1168.                     <a title="visual" href="/">02.</a>
  1169.                     <a title="musings" href="/">03.</a>
  1170.                     <a title="threads" href="/">04.</a>
  1171.                     <a title="starters" href="/">05.</a>
  1172.                 </div>
  1173.             </div>
  1174.             <div style="clear: both;"></div>
  1175.         </div>
  1176.        
  1177. -->
  1178.        
  1179.        
  1180.     </div>
  1181.  
  1182. {block:ContentSource}
  1183. <!---{SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1184. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1185. {/block:SourceLogo}
  1186. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  1187.  {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1188.  
  1189. </body>
  1190.  
  1191. <script>
  1192. $(document).ready(function() {
  1193.     $('.tabs .tab-nav a').on('click', function(e)  {
  1194.         var currentAttrValue = $(this).attr('href');
  1195.         $('.tabs ' + currentAttrValue).fadeIn(700).siblings().hide();
  1196.         $(this).parent('li').addClass('active').siblings().removeClass('active');
  1197.         e.preventDefault();
  1198.     });
  1199. });
  1200. </script>
  1201.  
  1202. <script>
  1203. $(document).ready(function() {
  1204.   $('#tabOptions li a').click(function() {
  1205.     var tabClass = $(this).attr('class');
  1206.     $('#tabOptions li').removeClass('active');
  1207.     $(this).parent().addClass('active');
  1208.  
  1209.     if(tabClass == 'all') {
  1210.       $('#tab-container').children('div.item').show();
  1211.     }
  1212.     else {
  1213.       $('#tab-container').children('div:not(.' + tabClass + ')').hide();
  1214.       $('#tab-container').children('div.' + tabClass).show();
  1215.     }
  1216.     return false;
  1217.   });
  1218. });
  1219. </script>
  1220.  
  1221. </html>
Advertisement
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!