API tools faq
paste
ninpen

Pearl

ninpen
Nov 30th, 2016
838
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 51.32 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!-------------------------------
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11.  
  12.  
  13. GEMS THEME BY NINPEN.TUMBLR.COM
  14.  
  15.  
  16. [    Pearl    ]
  17.  
  18.  
  19. DO NOT REMOVE THE CREDIT.
  20.  
  21.  
  22.  
  23.  
  24. SEARCH, VIDEO, & PHOTOSET SCRIPT ------- SHYTHEMES.TUMBLR.COM
  25.  
  26.  
  27.  
  28.  
  29.  
  30.  
  31.  
  32.  
  33. --------------------------------->
  34.  
  35.  
  36.  
  37.  
  38.  
  39.  
  40. <head>
  41. <title>{Title}</title>
  42. <link rel="shortcut icon" href="{FavIcon}" />
  43. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  44. <script src="//use.edgefonts.net/lato:n4,n7,n9;varela-round;fredoka-one.js"></script>
  45. <div class="cred"><a href="http://ninpen.tumblr.com/">N</a></div>
  46.  
  47. <meta name="if:ShowCaption" content=""/>
  48. <meta name="if:ShowTags" content=""/>
  49. <meta name="if:ShowExtraLinks" content=""/>
  50. <meta name="if:WallpaperBG" content=""/>
  51. <meta name="text:header title" content=""/>
  52. <meta name="image:background" content=""/>
  53. <meta name="image:portrait" content=""/>
  54.  
  55. <meta name="color:gemborder" content="#d8f2ff"/>
  56. <meta name="color:Gem color 1" content="#b8eaf9"/>
  57. <meta name="color:Gem color 2" content="#fdfff3"/>
  58.  
  59. <meta name="color:tooltip text" content="#679897"/>
  60. <meta name="color:tooltip BG" content="#ffffff"/>
  61.  
  62. <meta name="color:headerb1" content="#f8c0e3"/>
  63. <meta name="color:headerb2" content="#ffffff"/>
  64. <meta name="color:headerb3" content="#8fcde8"/>
  65.  
  66. <meta name="color:link" content="#5f8496"/>
  67. <meta name="color:abouttab link" content="#6f94b0"/>
  68. <meta name="color:linkhover" content="#81cfff"/>
  69. <meta name="color:h1" content="#f79a8e"/>
  70. <meta name="color:h2" content="#8dd8fe"/>
  71.  
  72. <meta name="color:background" content="#eef8ff"/>
  73. <meta name="color:posts" content="#f2fdff"/>
  74. <meta name="color:sidebarBG" content="#eef8ff"/>
  75. <meta name="color:text" content="#55829f"/>
  76. <meta name="color:searchtext" content="#6b9b9f"/>
  77. <meta name="color:border" content="#d8eaff"/>
  78.  
  79. <meta name="color:accent1" content="#8dc2fe"/>
  80. <meta name="color:accent2" content="#ffffff"/>
  81. <meta name="color:accent3" content="#ff7878"/>
  82. <meta name="color:accent4" content="#d8f2ff"/>
  83. <meta name="color:accent5" content="#ffd1dc"/>
  84. <meta name="color:accent6" content="#ffe3e6"/>
  85. <meta name="color:accent7" content="#ffe8ea"/>
  86. <meta name="color:accent8" content="#61e7ff"/>
  87. <meta name="color:accent9" content="#ffb7d0"/>
  88. <meta name="color:accent10" content="#fee7f6"/>
  89.  
  90. <meta name="text:AboutTab Link One" content=""/>
  91. <meta name="text:AboutTab Link One URL" content=""/>
  92. <meta name="text:AboutTab Link Two" content=""/>
  93. <meta name="text:AboutTab Link Two URL" content=""/>
  94. <meta name="text:AboutTab Link Three" content=""/>
  95. <meta name="text:AboutTab Link Three URL" content=""/>
  96. <meta name="text:AboutTab Link Four" content=""/>
  97. <meta name="text:AboutTab Link Four URL" content=""/>
  98. <meta name="text:AboutTab Link Five" content=""/>
  99. <meta name="text:AboutTab Link Five URL" content=""/>
  100. <meta name="text:AboutTab Link Six" content=""/>
  101. <meta name="text:AboutTab Link Six URL" content=""/>
  102. <meta name="text:AboutTab Link Seven" content=""/>
  103. <meta name="text:AboutTab Link Seven URL" content=""/>
  104. <meta name="text:AboutTab Link Eight" content=""/>
  105. <meta name="text:AboutTab Link Eight URL" content=""/>
  106. <meta name="text:AboutTab Link Nine" content=""/>
  107. <meta name="text:AboutTab Link Nine URL" content=""/>
  108. <meta name="text:AboutTab Link Ten" content=""/>
  109. <meta name="text:AboutTab Link Ten URL" content=""/>
  110. <meta name="text:AboutTab Link Eleven" content=""/>
  111. <meta name="text:AboutTab Link Eleven URL" content=""/>
  112. <meta name="text:AboutTab Link Twelve" content=""/>
  113. <meta name="text:AboutTab Link Twelve URL" content=""/>
  114.  
  115.  
  116.  
  117.  
  118. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  119. <script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  120. <script>
  121. $(document).ready(function() {
  122.     $('.search').submit(function(event) {
  123.         var value = $('input:first').val();
  124.         location.replace('http://{Name}.tumblr.com/tagged/' + value);
  125.     });
  126. });
  127. </script>
  128.  
  129. <style type="text/css">
  130.     html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, a, abbr, acronym, address, big, cite,hr, code,del, dfn,img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd,ol,ul, fieldset, form, label, legend,  tbody, tfoot, thead, tr, th, td, article,  canvas, details, embed, figure, figcaption, footer,  hgroup, menu,  output, ruby, summary,time, mark, audio, video{
  131.         margin: 0;
  132.         padding: 0;
  133.         border: 0;
  134.         font-size: 100%;
  135.         font: inherit;
  136.         vertical-align: baseline;
  137.     }
  138.      
  139.     article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  140.         display: block;
  141.     }
  142.        
  143.     body {
  144.         line-height: 1;
  145.     }
  146.      
  147.     ul {
  148.         list-style: none;
  149.     }
  150.      
  151.     table {
  152.         border-collapse: collapse;
  153.         border-spacing: 0;
  154.     }
  155.    
  156.     ::-webkit-scrollbar {
  157.         width: 6px;
  158.         height: 6px;
  159.         border-left:1px solid {color:border};
  160.     }
  161.    
  162.     ::-webkit-scrollbar-thumb {
  163.         border-left:1px solid {color:border};
  164.         background:{color:accent2};
  165.     }
  166.    
  167.     body,html{
  168.         width:100%;
  169.         height:100%;
  170.         padding:0;
  171.         margin:0;
  172.     }
  173.    
  174.     body{
  175.         cursor:url(http://static.tumblr.com/hczaopr/Wmjohh76z/peal_cursor.gif), auto;
  176.         word-wrap: break-word;
  177.         font:10px/16px varela-round;
  178.         color:{color:text};
  179.         {block:IfNotWallpaperBG}
  180.             background:{color:background} url({image:background}) repeat center fixed;
  181.         {/block:IfNotWallpaperBG}
  182.         {block:IfWallpaperBG}
  183.              background:{color:background} url({image:background}) no-repeat center fixed;
  184.             -webkit-background-size: cover;
  185.             -moz-background-size: cover;
  186.             -o-background-size: cover;
  187.             background-size: cover;
  188.         {/block:IfWallpaperBG}
  189.     }
  190.    
  191.     ::selection {
  192.         background:{color:accent1};
  193.         color:{color:accent2};
  194.     }
  195.    
  196.     ::-moz-selection {
  197.         background:{color:accent1};
  198.         color:{color:accent2};
  199.     }
  200.    
  201.     a{text-decoration:none;color:{color:link};}
  202.      
  203.     a:hover {color:{color:linkhover};}
  204.      
  205.     b,strong{color:{color:accent3};}
  206.      
  207.     i,em{color:{color:accent2};}
  208.      
  209.     u{color:{color:accent5};}
  210.    
  211.     h1{
  212.         margin:0 0 10px 0;
  213.         text-align:right;
  214.         font-size:20px;
  215.         padding:2px;
  216.         color:{color:h1};
  217.     }
  218.    
  219.     h1 a{
  220.         position:relative;
  221.         margin-right:20px;
  222.         color:#ff9bc0;
  223.         border-bottom:1px dotted {color:border};
  224.     }
  225.    
  226.     h1 a:hover{
  227.         color:{color:accent2};
  228.     }
  229.    
  230.     h1 a:before {
  231.         content: "";
  232.         width: 12px;
  233.         height: 5px;
  234.         position: absolute;
  235.         top: 50%;
  236.         margin-top: -2.5px;
  237.         right: -20px;
  238.         background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAFCAYAAABmWJ3mAAAAIElEQVQYV2P8al/8n/tgLyMDGgALYJOEq0SXxK0Dlx0AUTcUBqUiXzsAAAAASUVORK5CYII=);
  239.         opacity: .5;
  240.     }
  241.      
  242.     h2{
  243.         font-style:italic;
  244.         font-weight:300;
  245.         font-size:18px;
  246.         line-height:22px;
  247.         color: {color:h2};
  248.     }
  249.    
  250.     .cred{
  251.         background:{color:background};
  252.         border:1px solid {color:border};
  253.         width: 10px;
  254.         height: 8px;
  255.         padding: 12px 11px;
  256.         border-radius: 100%;
  257.         display: block;
  258.         z-index:99999;
  259.         font:700 italic 10px/8px varela-round;
  260.         letter-spacing:0;
  261.         position:Fixed;
  262.         bottom:5%;
  263.         right:5%;
  264.         }
  265.      
  266.     .cred a{
  267.         color:{color:link};
  268.     }
  269.    
  270.     .cred a:hover{color:{color:bold};}
  271.      
  272.     .source{
  273.         font:italic 8px/8px trebuchet ms;
  274.         text-transform:uppercase;
  275.         letter-spacing:2px;
  276.         margin:10px 0 0 30px
  277.     }
  278.      
  279.     img{max-width:100%;}
  280.    
  281.     a#ui-id-1:focus,a#ui-id-2:focus,a#ui-id-3:focus{
  282.         outline:0 !important;
  283.     }
  284.    
  285.     a#ui-id-1,a#ui-id-2,a#ui-id-3{
  286.         position:relative;
  287.         top:8px;
  288.     }
  289.    
  290.     .tabbed{
  291.         height: 100%;
  292.         width: 100%;
  293.     }
  294.    
  295.     @media only screen and (max-width: 1440px){
  296.         .contents {
  297.             position: absolute;
  298.             top:calc(10% - 24px);
  299.             left: 50%;
  300.             margin-left: -450px;
  301.             width: 900px;
  302.             height: calc(80% + 48px);
  303.         }
  304.    
  305.         #content{
  306.             width:450px;
  307.             height:80vh;
  308.             border-radius:0 0 0 10px;
  309.             overflow-y:scroll;
  310.             display:none;
  311.         }
  312.        
  313.         #blogroll,#about{
  314.             height:80vh;
  315.         }
  316.     }
  317.    
  318.     @media only screen and (min-width: 1441px)and (max-width: 2000px){
  319.         .contents {
  320.             position: absolute;
  321.             top:calc(18% - 24px);
  322.             left: 50%;
  323.             margin-left:-450px;
  324.             width: 900px;
  325.             height: calc(64% + 48px);
  326.         }
  327.    
  328.         #content{
  329.             width:450px;
  330.             height:64vh;
  331.             border-radius:0 0 0 10px;
  332.             overflow-y:scroll;
  333.             display:none;
  334.         }
  335.        
  336.         #blogroll,#about{
  337.             height:64vh;
  338.         }
  339.     }
  340.    
  341.     .section {
  342.         border-radius: 0 0 10px 10px;
  343.         border:1px solid {color:border};
  344.         margin-top:-1px;
  345.     }
  346.    
  347.     #entrywrap{
  348.         margin:0 auto;
  349.         position:relative;
  350.         width:900px;
  351.         height:65%;
  352.     }
  353.    
  354.     header{
  355.         background:{color:accent4};
  356.         height:20px;
  357.         width:100%;
  358.         position:relative;
  359.         border-radius:10px 10px 0 0;
  360.     }
  361.    
  362.     header span{
  363.         font:800 8px/8px calibri;
  364.         padding:6px 20px;
  365.         text-transform:uppercase;
  366.         letter-spacing:5px;
  367.         position:Absolute;
  368.         top:0;
  369.     }
  370.    
  371.     #search{
  372.         position:Relative;
  373.         height:8px;
  374.         width:calc(100% - 42px);
  375.         padding:10px 20px;
  376.         background:{color:accent2};
  377.         border:1px solid {color:border};
  378.         font:8px/8px calibri;
  379.         text-transform:uppercase;
  380.         letter-spacing:2px;
  381.     }
  382.    
  383.     #search:before{
  384.         color:#fdb0cc;
  385.         content:"http://www.";
  386.         position:Absolute;
  387.     }
  388.    
  389.     .search .query {
  390.        border: 0;
  391.        outline: 0;
  392.        width:100%;
  393.        color:{color:searchtext};
  394.        font:inherit;
  395.        text-transform:inherit;
  396.        letter-spacing:inherit;
  397.        background:inherit;
  398.     }
  399.    
  400.     .search {
  401.         font-weight:800;
  402.         width: calc(100% - 166px);
  403.         position: absolute;
  404.         top: 0;
  405.         padding: 8px 0;
  406.         left: 90px;
  407.     }
  408.    
  409.     ::-webkit-input-placeholder {color: inherit;}
  410.     :-moz-placeholder {color: inherit; opacity:1;}
  411.     ::-moz-placeholder {color: inherit; opacity:1;}
  412.     :-ms-input-placeholder {color: inherit;}
  413.    
  414.     input:focus::-webkit-input-placeholder {color: transparent;}
  415.     input:focus:-moz-placeholder {color: transparent;}
  416.     input:focus::-moz-placeholder {color: transparent;}
  417.     input:focus:-ms-input-placeholder { color: transparent;}
  418.    
  419.     #side{
  420.         position:Absolute;
  421.         top:5px;
  422.         right:20px;
  423.         width:100px;
  424.         height:10px;
  425.         z-index:1;
  426.         text-align:right;
  427.     }
  428.    
  429.     #side a{
  430.         color:transparent;
  431.     }
  432.    
  433.     #side li{
  434.         display:inline-block;
  435.         vertical-align:top;
  436.         margin:0 5px;
  437.         overflow:hidden;
  438.         width:10px;
  439.         line-height:0;
  440.         height:10px;
  441.         list-style-type:none;
  442.         position:relative;
  443.         z-index:100;
  444.     }
  445.    
  446.     #side li:first-of-type{
  447.         background:{color:headerb1};
  448.         border-radius:100%;
  449.     }
  450.    
  451.     #side li:nth-of-type(2){
  452.         background:{color:headerb2};
  453.         border-radius:2px;
  454.     }
  455.    
  456.     #side li:nth-of-type(3){
  457.         background:transparent;
  458.         position:relative;
  459.     }
  460.    
  461.     #side li:nth-of-type(3):before{
  462.         content:"";
  463.         position:Absolute;
  464.         left:0;
  465.         top:0;
  466.         width: 0;
  467.         height: 0;
  468.         border-left: 5px solid transparent;
  469.         border-right: 5px solid transparent;
  470.         border-bottom: 10px solid {color:headerb3};
  471.     }
  472.        
  473.     aside{
  474.         position: absolute;
  475.         top: 0;
  476.         right: 1px;
  477.         width: 449px;
  478.         background: {color:sidebarBG};
  479.         border-top: 1px solid {color:border};
  480.         border-left: 1px solid {color:border};
  481.         height: calc(100% - 2px);
  482.         border-radius: 0 0 10px 0;
  483.     }
  484.    
  485.     #gem{
  486.         width:209px;
  487.         height:310px;
  488.         border-radius:50%;
  489.         background:{color:accent2};
  490.         margin:-170px auto 0 auto;
  491.         border:15px solid {color:gemborder};
  492.         position:relative;
  493.         top:50%;
  494.         font-size:8px;
  495.         line-height:7px;
  496.         font-weight:800;
  497.         color:{color:accent2};
  498.         text-transform:uppercase;
  499.         letter-spacing:2px;
  500.     }
  501.    
  502.     #gem svg{
  503.         position:relative;
  504.     }
  505.    
  506.     .gn {
  507.         position: absolute;
  508.         top:50%;
  509.         left:50%;
  510.         margin:-85px 0 0 -12px;
  511.         width:24px;
  512.         height:114px;
  513.     }
  514.    
  515.     #gem:hover .gn a{
  516.         opacity:1;
  517.     }
  518.    
  519.     .gn a{
  520.         opacity:0;
  521.         width:24px;
  522.         display:block;
  523.         transition: opacity .25s ease-in-out;
  524.         -moz-transition: opacity .25s ease-in-out;
  525.         -webkit-transition: opacity .25s ease-in-out;
  526.     }
  527.    
  528.     .gn a:nth-child(even){
  529.         margin:25px 0;
  530.     }
  531.    
  532.     #content{
  533.         background:{color:posts};
  534.         border-right:1px solid {color:border};
  535.     }
  536.    
  537.     #content:first-of-type{
  538.         display: block;
  539.     }
  540.    
  541.     {block:IndexPage}
  542.         article:first-child{
  543.             margin:50px auto 153px auto;
  544.         }
  545.        
  546.         article:last-child{
  547.             margin:0 auto;
  548.         }
  549.     {/block:IndexPage}
  550.    
  551.     article{
  552.         width:300px;
  553.         {block:IndexPage}margin:0 auto 153px auto;{/block:IndexPage}
  554.         position:relative;
  555.         {block:PermalinkPage}margin:50px auto 20px auto;{/block:PermalinkPage}
  556.     }
  557.    
  558.     .photo-data.count-2 img,.photo-data.count-3 img,.photo-data.count-4 img,.photo-data.count-5 img {
  559.         width: calc(100% - 5px)!important;
  560.     }
  561.    
  562.     .cap a,.bod a{
  563.         border-bottom:1px dotted {color:Gem color 3};
  564.     }
  565.    
  566.     article img{
  567.         border-radius:5px;
  568.     }
  569.    
  570.     {block:IndexPage}
  571.         article:last-child:after{
  572.             background:transparent;
  573.         }
  574.        
  575.         article:after {
  576.             content: "";
  577.             width: 70%;
  578.             height: 1px;
  579.             background: {color:accent6};
  580.             position: absolute;
  581.             top: calc(100% + 78px);
  582.             left: 15%;
  583.         }
  584.     {/block:IndexPage}
  585.    
  586.     .img{display:block;}
  587.    
  588.     p .tumblr_blog{
  589.         margin:0;
  590.     }
  591.    
  592.     .cap p:nth-child(1) {
  593.         padding: 0;
  594.         margin: 0;
  595.     }
  596.    
  597.     .cap{
  598.         margin-top:5px;
  599.         border:1px solid {color:border};
  600.         padding:10px;
  601.         background:{color:accent2};
  602.         {block:ifNotShowCaption}
  603.             display:none;
  604.         {/block:ifNotShowCaption}
  605.     }
  606.    
  607.     .vignette, #vignette {
  608.         opacity:0;
  609.     }
  610.    
  611.     .lightbox-image, #tumblr_lightbox img {
  612.         box-shadow:none !important;
  613.         border-radius:0 !important;
  614.         max-width:none;
  615.     }
  616.    
  617.     .tmblr-lightbox, #tumblr_lightbox {
  618.         background-color:{color:accent2} !important;
  619.     }
  620.    
  621.     .lightbox-image, #tumblr_lightbox img {
  622.         background: {color:accent2};
  623.         box-shadow: inset 0 0 2px {color:border} !important;
  624.         padding: 10px;
  625.         border: 10px solid {color:accent2} !important;
  626.     }
  627.    
  628.     .lightbox-caption, #tumblr_lightbox_caption {
  629.         visibility:hidden;
  630.     }
  631.    
  632.     .spotify_audio_player {height:80px !important;}
  633.    
  634.     .alart{
  635.         border-radius:10px;
  636.         width:140px;
  637.         height:140px;
  638.         border:5px solid {color:accent2};
  639.         background:{color:accent4} url('http://static.tumblr.com/hczaopr/Nncohnckk/pearlaud.png') no-repeat center;
  640.         display:inline-block;
  641.     }
  642.    
  643.     #play {
  644.         margin-top:51px;
  645.         vertical-align:top;
  646.         display: inline-block;
  647.         width: 117px;
  648.         height: 21px;
  649.         padding: 12px 17px 15px 13px;
  650.         background:url(http://static.tumblr.com/hczaopr/qtOohnclw/pearlmedia.png)no-repeat center;
  651.         position:relative;
  652.     }
  653.    
  654.     .play{
  655.         width:21px;
  656.         height:21px;
  657.         overflow:hidden;
  658.         margin:-5px auto 0 auto;
  659.         border-radius:20px;
  660.         border-left:5px solid {color:accent2};
  661.         border-bottom:10px solid {color:accent2};
  662.         border-top:5px solid {color:accent2};
  663.         border-right:10px solid {color:accent2};
  664.     }
  665.    
  666.     .audioinfo{
  667.         font-size:8px;
  668.         font-weight:900;
  669.         letter-spacing:1px;
  670.         margin:15px 0 20px 20px;
  671.     }
  672.    
  673.     .audioinfo img{
  674.         position:relative;
  675.         display:inline-block;
  676.         top:14px;
  677.         margin:0 10px 10px 0;
  678.     }
  679.    
  680.     .askr{
  681.         height:26px;
  682.         font:italic 26px/26px Fredoka-One;
  683.         padding:10px 0;
  684.         letter-spacing:1px;
  685.         text-transform:lowercase;
  686.         display:inline-block;
  687.         width:calc(100% - 59px);
  688.         vertical-align:top;
  689.     }
  690.    
  691.     .askr a{
  692.         color:{color:h2};
  693.     }
  694.    
  695.     .askr a:hover{
  696.         color:{color:accent2};
  697.     }
  698.    
  699.     .asked{
  700.         padding:10px;
  701.         background:{color:accent2};
  702.         border:1px solid {color:border};
  703.         margin:20px auto;
  704.         width:calc(100% - 50px);
  705.     }
  706.    
  707.     .quest span img{
  708.         display:block;
  709.         border-radius:50px;
  710.     }
  711.    
  712.     .quest span{
  713.         display:inline-block;
  714.         border-radius:30px;
  715.         padding:8px;
  716.         background:{color:accent2} url(http://static.tumblr.com/hczaopr/aK2of9hyv/anonymous.png)no-repeat center;
  717.         margin:0 10px 1px 0;
  718.     }
  719.    
  720.     .perma{
  721.         font-weight:bold;
  722.         margin-top:5px;
  723.         height:52px;
  724.     }
  725.    
  726.     .date{
  727.         float:left;    
  728.         padding: 5px 9px;
  729.         background:{color:accent2};
  730.         font-size: 16px;
  731.         line-height: 20px;
  732.         border:1px solid {color:border};
  733.         {block:IndexPage}
  734.             width: 31px;
  735.         {/block:IndexPage}
  736.         {block:PermalinkPage}
  737.             width:65%;
  738.             text-align:center;
  739.         {/block:PermalinkPage}
  740.     }
  741.    
  742.     .perma a{
  743.         color:{color:accent1};
  744.     }
  745.    
  746.     a.tumblr_blog{  
  747.         margin-bottom: 10px;
  748.         display: inline-block;
  749.         color:{color:text};
  750.         background: {color:accent4};
  751.         letter-spacing:2px;
  752.         font-weight:800;
  753.         font-size:9px;
  754.         line-height:9px;
  755.         padding:1px 2px 0 2px;
  756.         vertical-align:top;
  757.         border-bottom:0;
  758.         position:relative;
  759.     }
  760.    
  761.     a.tumblr_blog:before {
  762.         content: "";
  763.         width: 4px;
  764.         height: 100%;
  765.         background: {color:accent2};
  766.         position: absolute;
  767.         right: -4px;
  768.     }
  769.    
  770.     .right {
  771.         width: 50px;
  772.         height:100%;
  773.         float: right;
  774.         text-align:center;
  775.     }
  776.    
  777.     .tago {
  778.         width: calc(100% - 101px);
  779.         display: inline-block;
  780.         font-size: 9px;
  781.         height:9px;
  782.         letter-spacing: 1px;
  783.         text-align: center;
  784.         padding: 20.5px 0;
  785.         position:Relative;
  786.         z-index:1;
  787.     }
  788.    
  789.     .tago:before {
  790.         content: "";
  791.         position: absolute;
  792.         z-index:-1;
  793.         background:{color:accent2};
  794.         top:0;
  795.         left: 5px;
  796.         width: calc(100% - 15px);
  797.         height: 100%;
  798.         border: 1px solid {color:border};
  799.     }
  800.    
  801.     .vias{  
  802.         {block:IndexPage}margin-top: 9px; {/block:IndexPage}
  803.         {block:PermalinkPage}
  804.             vertical-align: top;
  805.             border:1px solid {color:border};
  806.             width: calc(30% - 23px);
  807.             height:20px;
  808.             margin-left: 11px;
  809.             display: inline-block;
  810.             padding: 5px 2.5px;
  811.         {/block:PermalinkPage}
  812.     }
  813.    
  814.     .vias img {
  815.         width: 20px;
  816.         border-radius:30px;
  817.     }
  818.    
  819.     .vias a:last-child {
  820.         {block:IndexPage}margin-left:3px;{/block:IndexPage}
  821.         {block:PermalinkPage} margin-left: 10px;{/block:PermalinkPage}
  822.     }
  823.    
  824.     .controls{
  825.         background:{color:accent5};
  826.         position:relative;
  827.     }
  828.    
  829.     .controls svg{
  830.         width:10px;
  831.         height:10px;
  832.         fill:{color:accent2};
  833.     }
  834.    
  835.     .controls a {
  836.         position:relative;
  837.         display:inline-block;
  838.         padding:5px;
  839.         width:12px;
  840.         height:12px;
  841.     }
  842.    
  843.     .controls:before{
  844.         content:"";
  845.         width:1px;
  846.         height:100%;
  847.         background:{color:posts};
  848.         position:absolute;
  849.         top:0;
  850.         left:50%;
  851.     }
  852.    
  853.     .controls .like .like_button iframe {
  854.         position:absolute;
  855.         top:0;
  856.         left:0;
  857.         bottom:0;
  858.         right:0;
  859.         width:100%;
  860.         height:100%;
  861.         z-index:2;
  862.         opacity:0;
  863.     }
  864.    
  865.     pre{
  866.         background:{color:accent2};
  867.         border-radius:5px;
  868.         padding:10px;
  869.         border:1px solid {color:border};
  870.         white-space: pre-wrap;
  871.         white-space: -moz-pre-wrap;
  872.         white-space: -pre-wrap;
  873.         white-space: -o-pre-wrap;
  874.         word-wrap: break-word;
  875.     }
  876.    
  877.     .itags{
  878.         font-size:9px;
  879.         line-height:10px;
  880.         font-weight:800;
  881.         letter-spacing:1px;
  882.         padding:10px;
  883.         background:{color:accent2};
  884.         width:90%;
  885.         position:relative;
  886.         text-align:center;
  887.         left:calc(5% - 10px);
  888.         border:1px dotted {color:border};
  889.         {block:IndexPage}
  890.             {block:ifNotShowTags}
  891.                 display:none;
  892.             {/block:ifNotShowTags}
  893.             margin-top:20px;
  894.         {/block:IndexPage}
  895.         {block:PermalinkPage}margin:20px 0;{/block:PermalinkPage}
  896.     }
  897.    
  898.     .itags a{
  899.         margin:5px 5px 5px 0;
  900.         display:inline-block;
  901.     }
  902.    
  903.     blockquote{
  904.         border-left:10px solid {color:accent2};
  905.         padding-left:10px;
  906.     }
  907.    
  908.     ul, ol{
  909.         list-style-position:inside;
  910.         list-style:none;
  911.         margin:0px;
  912.         padding:0px;
  913.     }
  914.      
  915.     ul.chat {
  916.         margin: 0;
  917.         padding: 0;
  918.         letter-spacing:.06em;
  919.     }
  920.      
  921.     .chat li {
  922.         list-style-type: none;
  923.         margin-left: 0px;
  924.         padding: 10px;
  925.     }
  926.    
  927.     .label{
  928.         padding: 0 5px;
  929.         background: {color:accent4};
  930.     }
  931.      
  932.     .chat li.odd {
  933.         margin-bottom: 3px;
  934.         background-color:{color:accent2};
  935.         border-radius:5px;
  936.         border:1px dotted {color:border};
  937.     }
  938.      
  939.     .chat li.even {
  940.         margin-bottom: 3px;
  941.     }
  942.      
  943.     li{list-style-type:square;font-family:calibri;}
  944.      
  945.     .videoWrapper {
  946.         position: relative;
  947.         padding-bottom: 56.25%;
  948.         height: 0;
  949.     }
  950.    
  951.     .videoWrapper iframe{
  952.         position: absolute;
  953.         width: 100%;
  954.         height: 100%;
  955.         left: 0;
  956.         top: 0;
  957.     }
  958.    
  959.     .fourthirds {padding-bottom: 75%;}
  960.    
  961.     .tmblr-lightbox{background:{color:accent10};}
  962.    
  963.     .tmblr-lightbox .vignette{opacity:0;}
  964.     .tmblr-lightbox .lightbox-image{box-shadow:0 0 0 #000;}
  965.    
  966.     #pagination {
  967.         position: Absolute;
  968.         right: 0;
  969.         font-size:0;
  970.         line-height:0;
  971.         top: 0;
  972.         text-align:right;
  973.         height: 28px;
  974.         width: 74px;
  975.     }
  976.    
  977.     #pagination a {
  978.         background: {color:accent5};
  979.         width: 16px;
  980.         height: 16px;
  981.         vertical-align: top;
  982.         display: inline-block;
  983.         padding: 6px 10px;
  984.     }
  985.    
  986.     #s-m-t-tooltip{
  987.         max-width:200px;
  988.         padding:4px 7px;
  989.         margin-left: 20px;
  990.         margin-top: 2px;
  991.         background:{color:tooltip BG};
  992.         font-size:9px;
  993.         font-style:italic;
  994.         line-height:9px;
  995.         color:{color:tooltip text};
  996.         letter-spacing:1px;
  997.         z-index:999999;
  998.     }
  999.    
  1000.     .row.clearit:nth-child(n+2) {
  1001.         display: none;
  1002.     }
  1003.    
  1004.     .lightbox-image, #tumblr_lightbox img{
  1005.         margin: -20px 0 0 -20px;
  1006.     }
  1007.    
  1008.     ol.notes {
  1009.         margin-top: 45px;
  1010.         height: 400px;
  1011.         overflow: auto;
  1012.         letter-spacing:.08em;
  1013.         list-style-type: none;
  1014.         border:1px solid {color:border};
  1015.     }
  1016.        
  1017.     ol.notes li.note {
  1018.         border-bottom:1px dotted {color:border};
  1019.         padding: 10px;
  1020.     }
  1021.        
  1022.     ol.notes li.note img.avatar {
  1023.         vertical-align: -4px;
  1024.         margin-right: 10px;
  1025.         width: 16px;
  1026.         height: 16px;
  1027.         border-radius:30px;
  1028.     }
  1029.        
  1030.     ol.notes li.note span.action a{
  1031.         font-style:italic;
  1032.         color:{color:Gem color 1};
  1033.     }
  1034.    
  1035.     ol.notes li.note span.action a:hover{
  1036.         color:{color:accent4};
  1037.     }
  1038.    
  1039.     a.more_notes_link {
  1040.         color: {color:accent1};
  1041.         font-weight: bold;
  1042.         padding: 0 10px;
  1043.         background: {color:accent2};
  1044.         font-style: italic;
  1045.         text-transform: lowercase;
  1046.     }
  1047.        
  1048.     #about {
  1049.         font-size: 0;
  1050.         line-height: 0;
  1051.         background: {color:posts};
  1052.         border:1px solid {color:border};
  1053.         border-radius: 0 0 10px 10px;
  1054.         margin-top:-1px;
  1055.     }
  1056.    
  1057.     #about h1{    
  1058.         border-bottom: 1px dotted {color:Gem color 3};
  1059.         border-top: 1px dotted {color:Gem color 3};
  1060.         display: inline-block;
  1061.         padding: 5px;
  1062.         font-style:italic;
  1063.         font-weight:800;
  1064.         font-size:14px;
  1065.     }
  1066.    
  1067.     .desc {
  1068.         font-size:10px;
  1069.         line-height:15px;
  1070.         vertical-align:top;
  1071.         display: inline-block;
  1072.         width: calc(340px - 40px);
  1073.         height:calc(50% - 40px);
  1074.         padding: 20px;
  1075.         overflow: auto;
  1076.         border-right:1px solid {color:border};
  1077.     }
  1078.    
  1079.     .desc .dport {
  1080.         display:inline-block;
  1081.         width: 70px;
  1082.         border-radius: 5px;
  1083.         margin-right: 7px;
  1084.     }
  1085.    
  1086.     .dinfo li b {
  1087.         text-transform: uppercase;
  1088.         letter-spacing: 2px;
  1089.         margin-right: 10px;
  1090.     }
  1091.    
  1092.     .dinfo li {
  1093.         list-style-type: none;
  1094.         border-bottom: 1px solid {color:border};
  1095.         padding: 4px ;
  1096.     }
  1097.    
  1098.     .dinfo {
  1099.         display: inline-block;
  1100.         background: {color:accent2};
  1101.         width: 220px;
  1102.         font-size: 9px;
  1103.         line-height: 9px;
  1104.         font-weight: 800;
  1105.         letter-spacing: 1px;
  1106.     }
  1107.    
  1108.     .tblogs{
  1109.         font-size:10px;
  1110.         line-height:15px;
  1111.         vertical-align:top;
  1112.         border-right:1px solid {color:border};
  1113.         display: inline-block;
  1114.         width: calc(250px - 38px);
  1115.         height:calc(50% - 40px);
  1116.         padding: 20px;
  1117.         overflow: auto;
  1118.     }
  1119.    
  1120.     .blg {
  1121.         height:30px;
  1122.         display:block;
  1123.         margin-bottom:20px;
  1124.     }
  1125.    
  1126.     .blg img{
  1127.         border-radius:5px;
  1128.         margin-top:5px;
  1129.     }
  1130.    
  1131.     .blg:last-of-type{
  1132.         margin-bottom:0;
  1133.     }
  1134.    
  1135.     .blg .port {
  1136.         width:30px;
  1137.         float: left;
  1138.     }
  1139.    
  1140.     .blg .info {
  1141.         padding:5px;
  1142.         background:{color:accent2};
  1143.         display: inline-block;
  1144.         width: calc(100% - 60px);
  1145.         border-radius:3px;
  1146.         margin-left: 20px;
  1147.     }
  1148.    
  1149.     .blg h3 {
  1150.         font-size: 14px;
  1151.         line-height: 14px;
  1152.         font-weight: 800;
  1153.         letter-spacing: .05em;
  1154.     }
  1155.    
  1156.     .blg h4 {
  1157.         font-style: italic;
  1158.         font-size: 10px;
  1159.         letter-spacing: .04em;
  1160.     }
  1161.    
  1162.     .update{
  1163.         margin-right: -1px;
  1164.         line-height:15px;
  1165.         display: inline-block;
  1166.         border-right:1px solid {color:border};
  1167.         width: calc(304px - 40px);
  1168.         height:calc(50% - 40px);
  1169.         padding: 20px;
  1170.         overflow: auto;
  1171.         vertical-align:top;
  1172.         font-size:11px;
  1173.     }
  1174.    
  1175.     .update li{
  1176.         list-style-type:none;
  1177.         margin-bottom:5px;
  1178.     }
  1179.    
  1180.     .update li span{
  1181.         color:{color:Gem color 3}
  1182.         padding:0 2px;
  1183.         font-size:10px;
  1184.         line-height:10px;
  1185.         background:{color:accent2};
  1186.         color:{color:accent8};
  1187.         font-weight:800;
  1188.         letter-spacing:.08em;
  1189.         display:inline-block;
  1190.         margin-right:10px;
  1191.     }
  1192.    
  1193.     .navi {
  1194.         font-size: 10px;
  1195.         line-height: 15px;
  1196.         width: calc(100% - 41px);
  1197.         padding: 20px;
  1198.         overflow: auto;
  1199.         border-top: 1px solid {color:border};
  1200.         background: {color:accent2};
  1201.         max-height: calc(50% - 44px);
  1202.         height: calc(50% - 44px);
  1203.         border-radius: 0 0 10px 10px;
  1204.         {block:ifNotShowExtraLinks}
  1205.             display:none;
  1206.         {/block:ifNotShowExtraLinks}
  1207.     }
  1208.    
  1209.     .navi a{
  1210.         color:{color:abouttab link};
  1211.     }
  1212.    
  1213.     .navi li{
  1214.         list-style-type:none;
  1215.     }
  1216.    
  1217.     .nav{
  1218.         vertical-align:top;
  1219.         display:inline-block;
  1220.         width:calc(40% + 0px);
  1221.         height:calc(100% - 2px);
  1222.         overflow:hidden;
  1223.         font-size:0;
  1224.         line-height:0;
  1225.     }
  1226.    
  1227.     .nav a {
  1228.         font-size: 11px;
  1229.         line-height: 11px;
  1230.         width: calc((100% / 3) - 2px);
  1231.         background: {color:accent2};
  1232.         padding:26.2px 0;
  1233.         text-align: center;
  1234.         display: inline-block;
  1235.         border:1px solid {color:border};
  1236.     }
  1237.    
  1238.     .nav a:nth-of-type(2),.nav a:nth-of-type(5),.nav a:nth-of-type(8),.nav a:nth-of-type(11){
  1239.         margin:0 -1px;
  1240.     }
  1241.    
  1242.     .nav a:nth-of-type(n){
  1243.         margin-bottom:-1px;
  1244.     }
  1245.    
  1246.     .tagged{
  1247.         vertical-align:top;
  1248.         margin-left:26px;
  1249.         display:inline-block;
  1250.         width:calc(60% - 30px);
  1251.         height:100%;
  1252.         overflow:auto;
  1253.         {block:ifShowExtraLinks}
  1254.             margin-left:26px;
  1255.             display:inline-block;
  1256.             width:calc(60% - 30px);
  1257.         {/block:ifShowExtraLinks}
  1258.         {block:ifNotShowExtraLinks}
  1259.             width:calc(100% - 30px);
  1260.         {/block:ifNotShowExtraLinks}
  1261.     }
  1262.    
  1263.     .tagged li:before {
  1264.         content: "";
  1265.         width: 10px;
  1266.         height: 100%;
  1267.         background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAADCAYAAAC56t6BAAAAG0lEQVQYV2P8al/8n/tgLyMjAwMDA4jDCBMBAI/NCqpMWEFaAAAAAElFTkSuQmCC) no-repeat center;
  1268.         position: absolute;
  1269.         left: 0;
  1270.         top: 0;
  1271.     }
  1272.    
  1273.     .tagged li {
  1274.         background: {color:accent2};
  1275.         border-bottom: 1px dotted {color:border};
  1276.         padding: 5px 10px 5px 15px;
  1277.         margin-bottom:3px;
  1278.         display: inline-block;
  1279.         width: calc((100% / 4) - 28px);
  1280.         position: relative;
  1281.     }
  1282.    
  1283.     #blogroll {
  1284.         overflow: auto;
  1285.         background: {color:posts};
  1286.         margin-top: -1px;
  1287.         border-radius: 0 0 10px 10px;
  1288.         border:1px solid {color:border};
  1289.     }
  1290.    
  1291.     #fol {
  1292.         display: inline-block;
  1293.         width: 45px;
  1294.         height: 45px;
  1295.         vertical-align: top;
  1296.         margin: 10px;
  1297.         border-radius: 5px;
  1298.         padding: 10px;
  1299.         background: {color:accent2};
  1300.     }
  1301.        
  1302.     #fol img{
  1303.         width:45px;
  1304.         border-radius:3px;
  1305.     }
  1306.    
  1307.     .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop {
  1308.         z-index:123456!important;
  1309.         position:fixed;
  1310.         top:10px;
  1311.         right:10px;
  1312.         white-space:nowrap;
  1313.         -webkit-filter: invert(100%);
  1314.         -moz-filter: invert(100%);
  1315.         -o-filter: invert(100%);
  1316.         -ms-filter: invert(100%);
  1317.         filter: invert(100%);
  1318.         transform:scale(.7);
  1319.         -webkit-transform:scale(.7);
  1320.         -moz-transform:scale(.7);
  1321.     }
  1322. </style>
  1323. </head>
  1324. <body>
  1325.  
  1326.  
  1327.  
  1328. <div class="tabbed">
  1329.  
  1330.  
  1331.  
  1332. <div class="contents">
  1333.  
  1334. <div id="side">
  1335.   <ul>
  1336.     <li><a href="#posts">posts</a></li>
  1337.     <li><a href="#about">about</a></li>
  1338.     <li><a href="#blogroll">blogroll</a></li>
  1339.   </ul>
  1340. </div>  
  1341.  
  1342.     <header>
  1343.         <span>{text:header title}</span>
  1344.     </header>
  1345.  
  1346.     <div id="search">
  1347.         <form class="search" action="javascript:return false">
  1348.             <input type="text" class="query" placeholder="search the tags">
  1349.         </form>
  1350.        
  1351.     {block:Pagination}
  1352.         <div id="pagination">
  1353.             {block:PreviousPage}<a href="{PreviousPage}#posts"><img src="http://static.tumblr.com/hczaopr/X6Bof09a3/left.png"></a>{/block:PreviousPage}
  1354.             {block:NextPage}<a href="{NextPage}#posts"><img src="http://static.tumblr.com/hczaopr/G19of09aa/right.png"></a>{/block:NextPage}
  1355.         </div>
  1356.     {/block:Pagination}    
  1357.        
  1358.        
  1359.     </div>
  1360.    
  1361.    
  1362.  
  1363.  
  1364.  
  1365. <div id="posts">
  1366.  
  1367.  
  1368. <section id="entrywrap">
  1369.  
  1370.  
  1371.   <div class="section">
  1372.     <aside>
  1373.         <div id="gem">
  1374.             <svg viewBox="102.25 106 407.45 604">
  1375.                 <ellipse fill="{color:Gem color 1}" cx="306" cy="408" rx="203.75" ry="302"/>
  1376.                 <ellipse fill="{color:Gem color 2}" cx="306" cy="374.534" rx="142.406" ry="224.034"/>
  1377.                
  1378.                 <div class="gn">
  1379.                     <a href="/ask" title="inbox"><img src="http://static.tumblr.com/hczaopr/3dRohh7ob/chat.png"></a>
  1380.                     <a href="/" title="home">
  1381.                         <img src="http://static.tumblr.com/hczaopr/hJPohh7p5/pearlgem.png">
  1382.                     </a>
  1383.                     <a href="/archive" title="arhive"><img src="http://static.tumblr.com/hczaopr/yo2ohh7mb/calendar.png"></a>
  1384.                 </div>
  1385.             </svg>
  1386.  
  1387.         </div>
  1388.     </aside>
  1389.  
  1390.  
  1391.  
  1392.  
  1393.  
  1394. <div id="content">
  1395.     {block:Posts}
  1396.     <article id="{PostID}">
  1397.        
  1398.     {block:Text}
  1399.         <div class="txt">
  1400.             {block:Title}
  1401.             <h1><a href="{permalink}">{Title}</a></h1>{/block:Title}
  1402.             <span class="bod">{Body}</span>
  1403.         </div>
  1404.     {/block:Text}
  1405.    
  1406.      
  1407.      
  1408.      
  1409.     {block:Link}
  1410.         <div class="txt">
  1411.             <div class="span">
  1412.                 <h1><a href="{URL}">{Name}</a></h1>
  1413.                 {block:Description}<span class="bod">{Description}</span>{/block:Description}
  1414.             </div>
  1415.         </div>
  1416.     {block:Link}
  1417.      
  1418.      
  1419.      
  1420.      
  1421.     {block:Photo}
  1422.         {block:IndexPage}
  1423.             <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  1424.         <img class="img" src="{PhotoURL-HighRes}">
  1425.     </a>
  1426.         {/block:IndexPage}
  1427.        
  1428.         {block:PermalinkPage}
  1429.             {block:HighRes}<a href="{PhotoURL-HighRes}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>{/block:HighRes}
  1430.         {block:PermalinkPage}
  1431.     {/block:Photo}
  1432.      
  1433.      
  1434.      
  1435.      
  1436.    
  1437.     {block:Photoset}
  1438.         <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  1439.     {/block:Photoset}
  1440.    
  1441.    
  1442.    
  1443.    
  1444.    
  1445.    
  1446.     {block:Chat}
  1447.         {block:Title}
  1448.             <div class="titled">
  1449.                 <h1><a href="{Permalink}">{Title}</a></h1>
  1450.             </div>
  1451.         {/block:Title}
  1452.             <ul class="chat">
  1453.                 {block:Lines}
  1454.                     <li class="{Alt} user_{UserNumber}">
  1455.                 {block:Label}<span class="label">{Label}</span>{/block:Label}
  1456.                     {Line}
  1457.                 </li>
  1458.                 {/block:Lines}
  1459.             </ul>
  1460.     {/block:Chat}
  1461.    
  1462.    
  1463.    
  1464.    
  1465.    
  1466.    
  1467.    
  1468.    
  1469.    
  1470.    
  1471.     {block:Audio}
  1472.         <div class="alart">
  1473.             {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1474.         </div>
  1475.         <div id="play"><div class="play">{AudioPlayerWhite}</div></div>
  1476.        
  1477.         <div class="audioinfo">
  1478.             {block:TrackName}<img src="http://static.tumblr.com/hczaopr/Aqpohncit/audio.png">{TrackName}<br>{/block:TrackName}
  1479.             {block:Artist}<img src="http://static.tumblr.com/hczaopr/fN9ohncip/artist.png">{Artist}<br>{/block:Artist}
  1480.             {block:Album}<img src="http://static.tumblr.com/hczaopr/agTohncik/album.png">{Album}{/block:Album}
  1481.         </div>
  1482.     {/block:Audio}
  1483.    
  1484.    
  1485.    
  1486.    
  1487.      
  1488.      
  1489.     {block:Quote}
  1490.         <span class="bod">
  1491.             <h2>{Quote}</h2>
  1492.             {block:Source}<div class="source">- {Source}</div>{/block:Source}
  1493.         </bod>
  1494.     {/block:Quote}
  1495.      
  1496.      
  1497.      
  1498.      
  1499.      
  1500.     {block:Answer}
  1501.         <div class="quest">
  1502.             <span><img src="{AskerPortraitURL-30}"></span>
  1503.             <div class="askr"> <a href="{permalink}">{Asker}</a></div>
  1504.             <div class="asked">{Question}</div>
  1505.         </div>
  1506.         {Answer}
  1507.     {/block:Answer}
  1508.    
  1509.    
  1510.    
  1511.    
  1512.     {block:Video}
  1513.             <div class="video">{Video-500}</div>
  1514.     {/block:Video}
  1515.  
  1516.  
  1517.  
  1518.     {block:Caption}
  1519.         <div class="cap">{Caption}</div>
  1520.     {/block:Caption}
  1521.  
  1522.  
  1523. {block:IndexPage}
  1524.     <div class="perma">
  1525.         {block:Date}<div class="date"><a href="{permalink}">{MonthNumberWithZero}{DayOfMonthWithZero}{ShortYear}</a></div>
  1526.        
  1527.         <div class="tago">
  1528.             {TimeAgo}
  1529.         </div>
  1530.        
  1531.         {/block:Date}
  1532.         <div class="right">
  1533.             <div class="controls">
  1534.                 <a href="{ReblogURL}" target="_blank" class="reblog">
  1535.                     <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333    c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5    s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733    C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617    c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6    c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg>
  1536.             </a>
  1537.             <a href="#" class="like">{LikeButton}
  1538.                 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95    c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1    c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1    c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z     M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4    c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5    c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767    c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45    c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg>
  1539.                 </a>
  1540.             </div>
  1541.            
  1542.             {block:RebloggedFrom}
  1543.                 <div class="vias">
  1544.                     <a href="{ReblogParentURL}" title="via: {ReblogParentName}"><img src="{ReblogParentPortraitURL-24}"></a>
  1545.                     <a href="{ReblogRootURL}" title="source: {ReblogRootName}"><img src="{ReblogRootPortraitURL-24}"></a>
  1546.                 </div>
  1547.             {/block:RebloggedFrom}
  1548.         </div>
  1549.     </div>
  1550.     {block:HasTags}
  1551.         <div class="itags">
  1552.             {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  1553.         </div>
  1554.     {/block:HasTags}
  1555. {/block:IndexPage}
  1556.  
  1557.  
  1558.  
  1559.  
  1560. {block:PermalinkPage}
  1561.     <div class="perma">
  1562.         {block:Date}<div class="date">{TimeAgo}</div>{/block:Date}
  1563.        
  1564.         {block:RebloggedFrom}
  1565.                 <div class="vias">
  1566.                     <center><a href="{ReblogParentURL}" title="via: {ReblogParentName}"><img src="{ReblogParentPortraitURL-24}"></a>
  1567.                     <a href="{ReblogRootURL}" title="source: {ReblogRootName}"><img src="{ReblogRootPortraitURL-24}"></a></center>
  1568.                 </div>
  1569.             {/block:RebloggedFrom}
  1570.     </div>
  1571.    
  1572.     {block:HasTags}
  1573.         <div class="itags">
  1574.             {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  1575.         </div>
  1576.     {/block:HasTags}
  1577. {/block:PermalinkPage}
  1578.  
  1579.  
  1580. {PostNotes-16}
  1581.  
  1582.  
  1583. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1584. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{block:NoSourceLogo}{/block:NoSourceLogo}{/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1585.  
  1586.  
  1587.  
  1588. </article>
  1589. {/block:Posts}
  1590.  
  1591.  
  1592. </div>
  1593.  
  1594. <!--CONTENT 1 SECTION ENDS-->
  1595.  
  1596.  
  1597.  
  1598.  
  1599.  
  1600.  
  1601. </div>
  1602. </section>
  1603.  
  1604.  
  1605.  
  1606.  
  1607. </div>
  1608.  
  1609.  
  1610.  
  1611.  
  1612.  
  1613.  
  1614.  
  1615.  
  1616.  
  1617.  
  1618.  
  1619. <div id="about">
  1620.  
  1621.  
  1622. <!-- This is the description part in the about tab. Everything is self explanatory, just please look through the code -->
  1623.  
  1624.  
  1625.  
  1626.     <!-- Description box starts -->
  1627.     <div class="desc">
  1628.         <img class="dport" src="{image:portrait}">
  1629.         <div class="dinfo">
  1630.        
  1631.         <!-- Add your basic info here or delete it and add whatever -->
  1632.             <li><b>Name:</b> Lorem Ipsum</li>
  1633.             <li><b>Age:</b>2222000000years</li>
  1634.             <li><b>Location:</b>United of sass</li>
  1635.             <li><b>Status:</b>Nonya</li>
  1636.         </div>
  1637.        
  1638.         {description}
  1639.     </div>    
  1640.    
  1641.     <!-- Description box Ends -->
  1642.    
  1643.    
  1644.    
  1645.    
  1646.    
  1647.    
  1648.    
  1649.    
  1650.    
  1651.    
  1652.    
  1653.    
  1654.    
  1655.    
  1656.    
  1657.    
  1658.    
  1659.    
  1660.     <!-- Blog redirect starts -->
  1661.     <div class="tblogs">
  1662.         <h1>redirect</h1>
  1663.        
  1664.         <!---------
  1665.       To add more blogs or delete theme this is the code:
  1666.      
  1667.            <div class="blg">
  1668.               <div class="port"><img src="BLOG IMAGE URL"></div>
  1669.               <div class="info">
  1670.                   <h3>Blog name</h3>
  1671.                   <h4>sub title of blog</h4>
  1672.               </div>
  1673.           </div>
  1674.          
  1675.       --------->
  1676.        
  1677.        
  1678.         <div class="blg">
  1679.             <div class="port"><img src="BLOG 1 IMAGE URL"></div>
  1680.             <div class="info">
  1681.                 <h3>Blog one name</h3>
  1682.                 <h4>sub title of blog one</h4>
  1683.             </div>
  1684.         </div>
  1685.        
  1686.        
  1687.        
  1688.         <div class="blg">
  1689.             <div class="port"><img src="BLOG 2 IMAGE URL"></div>
  1690.             <div class="info">
  1691.                 <h3>Blog two name</h3>
  1692.                 <h4>sub title of blog two</h4>
  1693.             </div>
  1694.         </div>
  1695.     </div>
  1696.    
  1697.     <!-- Blog redirect Ends -->
  1698.    
  1699.    
  1700.    
  1701.    
  1702.    
  1703.    
  1704.    
  1705.    
  1706.    
  1707.    
  1708.    
  1709.    
  1710.    
  1711.    
  1712.     <!-- Updates will have to be manually entered, or you can delete this section -->
  1713.     <div class="update">
  1714.         <h1>updates</h1>
  1715.         <li><span>01/12/16</span> Update one here</li>
  1716.         <li><span>02/13/17</span> Update two here</li>
  1717.         <li><span>03/14/18</span> Update three here</li>
  1718.         <li><span>04/15/19</span> Update four here</li>
  1719.         <li><span>05/16/20</span> Update five here</li>
  1720.     </div>
  1721.     <!-- Update section ends -->
  1722.    
  1723.    
  1724.    
  1725.    
  1726.    
  1727.    
  1728.    
  1729.    
  1730.    
  1731.    
  1732.    
  1733.    
  1734.     <!-- Extra Links starts -->
  1735.     <div class="navi">
  1736.         <div class="nav">
  1737.             {block:IfAboutTabLinkOne}
  1738. <a href="{block:IfAboutTabLinkOneURL}{text:AboutTab Link One URL}{/block:IfAboutTabLinkOneURL}" title="{text:AboutTab Link One}"><li>I</li></a>
  1739. {/block:IfAboutTabLinkOne}
  1740.  
  1741.  
  1742.             {block:IfAboutTabLinkTwo}
  1743.             <a href="{block:IfAboutTabLinkTwoURL}{text:AboutTab Link Two URL}{/block:IfAboutTabLinkTwoURL}"  title="{text:AboutTab Link Two}"><li>II</li></a>
  1744.             {/block:IfAboutTabLinkTwo}
  1745.              
  1746.              
  1747.             {block:IfAboutTabLinkThree}
  1748.             <a href="{block:IfAboutTabLinkThreeURL}{text:AboutTab Link Three URL}{/block:IfAboutTabLinkThreeURL}"  title="{text:AboutTab Link Three}"><li>III</li></a>
  1749.             {/block:IfAboutTabLinkThree}
  1750.              
  1751.              
  1752.             {block:IfAboutTabLinkFour}
  1753.             <a href="{block:IfAboutTabLinkFourURL}{text:AboutTab Link Four URL}{/block:IfAboutTabLinkFourURL}"  title="{text:AboutTab Link Four}"><li>IV</li></a>
  1754.             {/block:IfAboutTabLinkFour}
  1755.              
  1756.              
  1757.             {block:IfAboutTabLinkFive}
  1758.             <a href="{block:IfAboutTabLinkFiveURL}{text:AboutTab Link Five URL}{/block:IfAboutTabLinkFiveURL}"  title="{text:AboutTab Link Five}"><li>V</li></a>
  1759.             {/block:IfAboutTabLinkFive}
  1760.              
  1761.              
  1762.             {block:IfAboutTabLinkSix}
  1763.             <a href="{block:IfAboutTabLinkSixURL}{text:AboutTab Link Six URL}{/block:IfAboutTabLinkSixURL}"  title="{text:AboutTab Link Six}"><li>VI</li></a>
  1764.             {/block:IfAboutTabLinkSix}
  1765.              
  1766.              
  1767.             {block:IfAboutTabLinkSeven}
  1768.             <a href="{block:IfAboutTabLinkSevenURL}{text:AboutTab Link Seven URL}{/block:IfAboutTabLinkSevenURL}"  title="{text:AboutTab Link Seven}"><li>VII</li></a>
  1769.             {/block:IfAboutTabLinkSeven}
  1770.              
  1771.              
  1772.             {block:IfAboutTabLinkEight}
  1773.             <a href="{block:IfAboutTabLinkEightURL}{text:AboutTab Link Eight URL}{/block:IfAboutTabLinkEightURL}"  title="{text:AboutTab Link Eight}"><li>VIII</li></a>
  1774.             {/block:IfAboutTabLinkEight}
  1775.              
  1776.                        
  1777.             {block:IfAboutTabLinkNine}
  1778.             <a href="{block:IfAboutTabLinkNineURL}{text:AboutTab Link Nine URL}{/block:IfAboutTabLinkNineURL}"  title="{text:AboutTab Link Nine}"><li>IX</li></a>
  1779.             {/block:IfAboutTabLinkNine}
  1780.            
  1781.            
  1782.             {block:IfAboutTabLinkTen}
  1783.             <a href="{block:IfAboutTabLinkTenURL}{text:AboutTab Link Ten URL}{/block:IfAboutTabLinkTenURL}"  title="{text:AboutTab Link Ten}"><li>X</li></a>
  1784.             {/block:IfAboutTabLinkTen}
  1785.            
  1786.            
  1787.             {block:IfAboutTabLinkEleven}
  1788.             <a href="{block:IfAboutTabLinkElevenURL}{text:AboutTab Link Eleven URL}{/block:IfAboutTabLinkElevenURL}"  title="{text:AboutTab Link Eleven}"><li>XI</li></a>
  1789.             {/block:IfAboutTabLinkEleven}
  1790.            
  1791.            
  1792.             {block:IfAboutTabLinkTwelve}
  1793.             <a href="{block:IfAboutTabLinkTwelveURL}{text:AboutTab Link Twelve URL}{/block:IfAboutTabLinkTwelveURL}"  title="{text:AboutTab Link Twelve}"><li>XII</li></a>
  1794.             {/block:IfAboutTabLinkTwelve}
  1795.         </div>
  1796.     <!-- Extra Links End -->
  1797.        
  1798.        
  1799.        
  1800.        
  1801.        
  1802.     <!-- Tags starts -->
  1803.         <div class="tagged">
  1804.             <h1>tagged</h1><br>  
  1805.            
  1806.             <!-- You have to surround each tag link with <li></li> -->
  1807.            
  1808.             <li><a href="">tag 1</a></li>
  1809.             <li><a href="">tag 2</a></li>
  1810.             <li><a href="">tag 3</a></li>
  1811.             <li><a href="">tag 4</a></li>
  1812.             <li><a href="">tag 5</a></li>
  1813.             <li><a href="">tag 6</a></li>
  1814.             <li><a href="">tag 7</a></li>
  1815.             <li><a href="">tag 8</a></li>
  1816.             <li><a href="">tag 9</a></li>
  1817.             <li><a href="">tag 10</a></li>
  1818.             <li><a href="">tag 11</a></li>
  1819.             <li><a href="">tag 12</a></li>
  1820.             <li><a href="">tag 13</a></li>
  1821.             <li><a href="">tag 14</a></li>
  1822.             <li><a href="">tag 15</a></li>
  1823.             <li><a href="">tag 16</a></li>
  1824.             <li><a href="">tag 17</a></li>
  1825.             <li><a href="">tag 18</a></li>
  1826.             <li><a href="">tag 19</a></li>
  1827.             <li><a href="">tag 20</a></li>
  1828.         </div>
  1829.     <!-- Tags Ends -->
  1830.    
  1831.    
  1832.     </div>
  1833. </div>
  1834.  
  1835.  
  1836.  
  1837.  
  1838.  
  1839.  
  1840.  
  1841.  
  1842.  
  1843.  
  1844.  
  1845.  
  1846. <div id="blogroll">
  1847.         <center>
  1848.             {block:Following}{block:Followed}
  1849.                 <div id="fol"><a title="{FollowedName}" href="{FollowedURL}"><img src="{FollowedPortraitURL-64}"></a></div>            
  1850.             {/block:Followed}{/block:Following}
  1851.         </center>
  1852. </div>
  1853.  
  1854.  
  1855.  
  1856.  
  1857.   </div>
  1858. </div>
  1859.  
  1860.  
  1861. <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
  1862. <script src='http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js'></script>
  1863. <script src="http://static.tumblr.com/hczaopr/nwFoe3apm/index.js"></script>
  1864. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1865. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1866. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1867.  
  1868. <script>
  1869. // minimal soundcloud player © shythemes.tumblr
  1870. $(document).ready(function(){
  1871.    var color = '{color:accent1}';
  1872.    $('.soundcloud_audio_player').each(function(){
  1873.        $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 116, width: '100%' });
  1874.    });
  1875. });
  1876. </script>
  1877.  
  1878. <script>
  1879. $(document).ready(function() {
  1880.     (function($) {
  1881.         $('ul a').click(function(g) {
  1882.             var tab = $(this).closest('#entrywrap'),
  1883.                 index = $(this).closest('a').index();
  1884.             tab.find('.section').find('div#content').not(
  1885.                 'div#content:eq(' + index + ')').slideUp();
  1886.             tab.find('.section').find('div#content:eq(' +
  1887.                 index + ')').slideDown();
  1888.             g.preventDefault();
  1889.         });
  1890.     })(jQuery);
  1891.     $('.photo-slideshow').pxuPhotoset({
  1892.         lightbox: true,
  1893.         rounded: false,
  1894.         gutter: '5px',
  1895.         borderRadius: '5px',
  1896.         photoset: '.photo-slideshow',
  1897.         photoWrap: '.photo-data',
  1898.         photo: '.pxu-photo'
  1899.     });
  1900. });
  1901. </script>
  1902.  
  1903. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1904. <script>
  1905. (function($) {
  1906.     $(document).ready(function() {
  1907.         $("a[title]").style_my_tooltips({
  1908.             tip_follows_cursor: true,
  1909.             tip_delay_time: 90,
  1910.             tip_fade_speed: 300,
  1911.             attribute: "title"
  1912.         });
  1913.     });
  1914. })(jQuery);
  1915. </script>
  1916.  
  1917.  
  1918. </body>
  1919. </html>
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!