API tools faq
paste
darianella

"Heir Transparent" tumblr theme HTML code

darianella
Jul 22nd, 2013
6,790
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 34.15 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.  <link href='http://fonts.googleapis.com/css?family=Telex' rel='stylesheet' type='text/css'>
  5.  
  6. <!--
  7. Homestuck! Homestuck! Homestuck!
  8. This theme was originally made for an RP friend of mine, but I've decided to post it in light of my recent obsession with the greatest webcomic/game/video series/thing ever.
  9.  
  10. POSTS:
  11.  - one column 250px, 400px, or 500px posts
  12.  - optional monochrome images
  13.  - show/hide image descriptions
  14.  - infinite scroll or pagination
  15.  
  16. SIDEBAR:
  17.  - six custom links
  18.  - optional standalone render image
  19.  - optional music player
  20.  
  21.  
  22. So. Don't steal, and stuff. And please don't remove the credit? It's cute. And filled with love.
  23.  
  24. HAPPY BLOGGING,
  25. Darian
  26.  
  27. -->
  28.  
  29.  
  30. <head><title>{Title}</title>
  31.  
  32. <link rel="shortcut icon" href="{favicon}">
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34.  
  35.  
  36.  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  37. <script src="http://static.tumblr.com/5ojoydj/p9wmmzopi/jquery.style-my-tooltips.js"></script>
  38. <script src="http://static.tumblr.com/5ojoydj/En2mmzorm/style-my-tooltips.css"></script>
  39. <script>
  40.      (function($){
  41.          $(document).ready(function(){
  42.              $("[title]").style_my_tooltips({
  43.     tip_follows_cursor:true,
  44.     tip_delay_time:200,
  45.     tip_fade_speed:300,
  46.     attribute:"title"
  47. });
  48.          });
  49.      })(jQuery);
  50.  </script>
  51.  
  52.  
  53.  
  54. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  55.  
  56.  
  57.     <meta name="color:title" content="#000000" />
  58.     <meta name="color:subtitle" content="#000000" />
  59.     <meta name="color:titleborder" content="#000000" />
  60.     <meta name="color:titlebackground" content="#ffffff" />
  61.     <meta name="color:pagination" content="#2e2d2d" />
  62.     <meta name="color:bold" content="#222121" />
  63.     <meta name="color:italic" content="#92a271" />
  64.    
  65.     <meta name="color:background" content="#f3f3f3" />
  66.     <meta name="color:backgroundbar1" content="#444645" />
  67.     <meta name="color:backgroundbar2" content="#5f8b7a" />
  68.     <meta name="color:backgroundbar3" content="#c7c6c6" />
  69.     <meta name="color:backgroundbar4" content="#56836e" />
  70.     <meta name="color:backgroundbar5" content="#302f2f" />
  71.    
  72.     <meta name="color:scrollbar" content="#232323" />
  73.     <meta name="color:scrollbarback" content="#d6d5d5" />
  74.        
  75.     <meta name="color:selection" content="#cfcece" />
  76.     <meta name="color:selectiontext" content="#256143" />
  77.    
  78.     <meta name="color:description" content="#070707" />
  79.     <meta name="color:descriptionback" content="#ffffff" />
  80.     <meta name="color:descriptionborder" content="#000000" />
  81.    
  82.     <meta name="color:sidebarimgborder" content="#000000" />  
  83.     <meta name="color:musicplayer" content="#e9e7e7" />
  84.    
  85.     <meta name="color:post" content="#ffffff" />
  86.     <meta name="color:text" content="#353534" />
  87.     <meta name="color:postlinks" content="#205840" />
  88.     <meta name="color:postlinkhover" content="#424242" />
  89.    
  90.     <meta name="color:permalink" content="#d8dad9" />
  91.     <meta name="color:datelinks" content="#242323" />
  92.     <meta name="color:permalinktext" content="#0f0f0f" />
  93.     <meta name="color:datelinkhover" content="#fdfdfd" />
  94.     <meta name="color:taglinks" content="#797c7a" />
  95.     <meta name="color:taglinkhover" content="#121602" />
  96.    
  97.     <meta name="color:quote" content="#313131" />
  98.     <meta name="color:question" content="#313131" />
  99.    
  100.     <meta name="color:blockquote" content="#e9e9e9" />
  101.     <meta name="color:blockquote2" content="#f5f3f2" />
  102.     <meta name="color:blockquoteborder" content="#1f1f1e" />
  103.    
  104.     <meta name="color:customlinks" content="#020202" />
  105.     <meta name="color:customlinkhover" content="#d6d6d6" />
  106.     <meta name="color:custom" content="#e9e7e7" />
  107.     <meta name="color:customhover" content="#232323" />
  108.    
  109.     <meta name="color:navlinks" content="#ffffff" />
  110.     <meta name="color:navlinkhover" content="#587444" />
  111.     <meta name="color:nav" content="#0c0b0b" />
  112.     <meta name="color:navhover" content="#232323" />
  113.    
  114.     <meta name="if:250px posts" content="0">
  115.     <meta name="if:400px posts" content="1">
  116.     <meta name="if:500px posts" content="0">
  117.     <meta name="if:infinite scroll" content="0">
  118.     <meta name="if:show standalone" content="1">
  119.     <meta name="if:monochrome" content="1">
  120.     <meta name="if:hidden descriptions" content="1">
  121.     <meta name="if:music player" content="1">
  122.    
  123.     <meta name="image:background" content="https://lh4.googleusercontent.com/-xmbP1G8P-FQ/Ue3J9XUu3aI/AAAAAAAAFVk/7V1OJobKQWo/s100-no/az_subtle.png"/>
  124.     <meta name="image:standalone" content="https://lh4.googleusercontent.com/-OFIQ0Nf2gVI/Ue3KKrDwTwI/AAAAAAAAFWA/MAuwwJQ3JEs/w736-h898-no/bzzt_by_davedile-d41socopyvw.png"/>
  125.     <meta name="image:sidebar" content="https://lh6.googleusercontent.com/-q68_QNt8m0M/Ue3KISakMYI/AAAAAAAAFWU/ay2kKcfUC1w/w350-h280-no/lowassmall.jpg"/>
  126.  
  127.    
  128.     <meta name="text:PlayerCode" content="<embed src='http://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=http://k003.kiwi6.com/hotlink/10d579vuqd/homestuck_-_homestuck_vol._5_-_03_savior_of_the_waking_world.mp3&t0=&total=1' quality='high' wmode='transparent' width='200' height='10' name='billy' align='middle' type='application/x-shockwave-flash' />"/>
  129.     <meta name="text:subtitle" content="it's what's inside the adventurer that counts!"/>
  130.     <meta name="text:link1" content="" />
  131.     <meta name="text:link1URL" content="/" />
  132.     <meta name="text:link2" content="" />
  133.     <meta name="text:link2URL" content="/" />
  134.     <meta name="text:link3" content="" />
  135.     <meta name="text:link3URL" content="/" />
  136.     <meta name="text:link4" content="" />
  137.     <meta name="text:link4URL" content="/" />
  138.     <meta name="text:link5" content="" />
  139.     <meta name="text:link5URL" content="/" />
  140.     <meta name="text:link6" content="" />
  141.     <meta name="text:link6URL" content="/" />
  142.  
  143. <style type="text/css">
  144.  
  145. /*basics*/
  146.  
  147. ::-webkit-scrollbar {
  148.     width: 7px;
  149.     height: 7px;
  150.     background-color:{color:scrollbarback};
  151. }
  152.  
  153. ::-webkit-scrollbar-thumb {
  154.     background: {color:scrollbar};
  155. }
  156.  
  157.  
  158.  
  159. @font-face {
  160. font-family: "tinytots";
  161. src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
  162. }
  163.  
  164. @font-face{
  165.             font-family: "BuxtonSketch";
  166.             src: url('http://fontsforweb.com/public/fonts/1049/BuxtonSketch.eot');
  167.             src: local("Buxton Sketch"), url('http://fontsforweb.com/public/fonts/1049/BuxtonSketch.woff') format("woff"), url('http://fontsforweb.com/public/fonts/1049/BuxtonSketch.ttf') format("truetype");
  168.         }
  169.         .fontsforweb_fontid_1049 {
  170.             font-family: "BuxtonSketch";
  171.         }
  172.  
  173. iframe{
  174.     opacity: 0.9;
  175.     filter:alpha(opacity=90);
  176.     -moz-opacity: 0.9;
  177.     -khtml-opacity: 0.9;
  178. }
  179.  
  180. iframe#tumblr_controls {
  181.     right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  182.  
  183. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  184.  
  185.  
  186.  
  187. /*basic derps*/
  188.  
  189. body{
  190.     margin-top:0;
  191.     color:{color:text};
  192.         font-family:helvetica;
  193.         font-size:10px;
  194.     line-height:100%;
  195.     background-image:url('{image:background}');
  196.     background-attachment: fixed;
  197.     background-repeat: repeat;
  198.     background-color: {color:background};
  199. }
  200.  
  201. a{
  202.     text-decoration:none;
  203.     outline:none;
  204.     -moz-outline-style:none;
  205.    color:{color:customlinks};
  206.     -webkit-transition: all 0.5s linear;
  207.     -moz-transition: all 0.5s linear;
  208.     -o-transition: all 0.5s linear;
  209. }
  210.  
  211.  
  212. em{
  213.     color:{color:italic};
  214. }
  215.  
  216. strong{
  217.     color:{color:bold};
  218.     font-weight:strong;
  219. }
  220.  
  221. img{
  222.     border:none;
  223. }
  224.  
  225. blockquote{
  226.     padding:5px;
  227.     padding-left:10px;
  228.     padding-right:10px;
  229.     background-color:{color:blockquote};
  230.     overflow:auto;
  231. }
  232.  
  233. blockquote blockquote{
  234.     padding-left:10px;
  235.     padding:5px;
  236.     border-left:1px solid {color:blockquoteborder};
  237.     background-color:{color:blockquote2};
  238. }
  239.  
  240. pre{
  241.     font-size:8px;
  242.     {block:indexpage}max-width:390px;{/block:indexpage}
  243.     {block:permalinkpage}max-width:490px;{/block:permalinkpage}
  244.     overflow:auto;
  245.     background-color:#bcbbbb;
  246.     padding:5px;
  247.     font-family:tinytots;
  248.     text-align:center;
  249. }
  250.  
  251. pre::-webkit-scrollbar {
  252.     width: 2px;
  253.     height: 2px;
  254. }
  255.  
  256. pre::-webkit-scrollbar-thumb {
  257.     background: {color:scrollbar};
  258. }
  259.  
  260. ::selection {
  261. background:{color:selection};
  262. color: {color:selectiontext};
  263. }
  264.  
  265. ::-moz-selection {
  266. background: {color:selection};
  267. color: {color:selectiontext};
  268. }
  269.  
  270. ::-webkit-selection {
  271. background: {color:selection};
  272. color: {color:selectiontext};
  273. }
  274.  
  275.  /*left*/
  276.  
  277.  #bar1{
  278.      position:fixed;
  279.      margin-left:80px;
  280.      height:100%;
  281.      width:15px;
  282.      top:0;
  283.      background-color:{color:backgroundbar1};
  284. }
  285.  
  286. #bar2{
  287.      position:fixed;
  288.      margin-left:100px;
  289.      height:100%;
  290.      width:30px;
  291.      top:0;
  292.      background-color:{color:backgroundbar2};
  293. }
  294.  
  295. #sidebar{
  296.      position:fixed;
  297.      margin-left:150px;
  298.      height:100%;
  299.      width:150px;
  300.      top:0;
  301.      background-color:{color:backgroundbar3};
  302. }
  303.  
  304. /*image one*/
  305.  
  306. #sideimgback{
  307.     position:fixed;
  308.     margin-top:100px;
  309.     margin-left:50px;
  310.     width:364px;
  311.     height:294px;
  312.     background-color:{color:sidebarimgborder};
  313.     -webkit-transition: all 0.5s linear;
  314.     -moz-transition: all 0.5s linear;
  315.     -o-transition: all 0.5s linear;
  316. }
  317.  
  318. #sideimg{
  319.     position:fixed;
  320.     margin-left:7px;
  321.     margin-top:7px;
  322.     height:280px;
  323.     width:350px;
  324. }
  325.  
  326. /*titles*/
  327.  
  328. #main{
  329.     position:fixed;
  330.     margin-top:-30px;
  331.     height:20px;
  332.     width:370px;
  333.     margin-left:-3px;
  334.     font-family: tinytots;
  335.     text-align:center;
  336.     font-size:35px;
  337.     color:{color:title};
  338.     text-transform:uppercase;
  339.     border-bottom:solid 5px {color:titleborder};
  340.     -webkit-transition: all 0.5s linear;
  341.     -moz-transition: all 0.5s linear;
  342.     -o-transition: all 0.5s linear;
  343.     z-index:99;
  344. }
  345.  
  346. #sideimgback:hover #main{
  347.     margin-top:75px;
  348.     height:25px;
  349.     padding-top:20px;
  350.     opacity:0.8;
  351.     background-color:{color:titlebackground};
  352.     border-bottom:solid 0px {color:titleborder};
  353. }
  354.  
  355. #sub{
  356.     position:fixed;
  357.     margin-top:-30px;
  358.     height:20px;
  359.     width:400px;
  360.     margin-left:-18px;
  361.     font-family: tinytots;
  362.     text-align:center;
  363.     font-size:15px;
  364.     color:{color:subtitle};
  365.     text-transform:uppercase;
  366.     border-bottom:solid 5px {color:titleborder};
  367.     -webkit-transition: all 0.5s linear;
  368.     -moz-transition: all 0.5s linear;
  369.     -o-transition: all 0.5s linear;
  370.     z-index:99;
  371.     opacity:0;
  372.     -webkit-transition: all 0.5s linear;
  373.     -moz-transition: all 0.5s linear;
  374.     -o-transition: all 0.5s linear;
  375. }
  376.  
  377. #sideimgback:hover #sub{
  378.     opacity:1;
  379.     -webkit-transition-delay: 0.5s;
  380.     -moz-transition-delay: 0.5s;
  381.     -o-transition-delay: 0.5s;
  382. }
  383.  
  384. /*player*/
  385.  
  386. #playerback{
  387.     position:fixed;
  388.    
  389.     margin-top:15px;
  390.     margin-left:15px;
  391.     opacity:0.5;
  392.    
  393.     height:15px;
  394.     width:17px;
  395.     padding-left:3px;
  396.     padding-top:5px;
  397.     background-color:{color:musicplayer};
  398.    
  399.     z-index:999;
  400.     -webkit-transition: all 0.7s ease-out;
  401.     -moz-transition: all 0.7s ease-out;
  402.     -o-transition: all 0.7s ease-out;
  403. }
  404.    
  405. #playerplayer{
  406.     position:fixed;
  407.     opacity:0;
  408.     background-color:{color:musicplayer};
  409.     width:55px;
  410.     padding-left:5px;
  411.     height:13px;
  412.     padding-top:2px;
  413.     margin-left:-23px;
  414.     z-index:999;
  415.     -webkit-transition: all 0.7s ease-out;
  416.     -moz-transition: all 0.7s ease-out;
  417.     -o-transition: all 0.7s ease-out;
  418.     overflow:hidden;
  419. }
  420.  
  421. #playerback:hover{
  422.     opacity:0.8;
  423. }
  424.  
  425. #playerback:hover #playerplayer{
  426.     opacity:1;
  427.     margin-top:15px;
  428. }
  429.  
  430. /*description*/
  431.  
  432. #descback{
  433.     position:fixed;
  434.     margin-top:300px;
  435.     margin-left:150px;
  436.     width:185px;
  437.     height:80px;
  438.     background-color:{color:descriptionborder};
  439. }
  440.  
  441. #descboard{
  442.     position:fixed;
  443.     margin-top:7px;
  444.     margin-left:7px;
  445.     height:66px;
  446.     width:171px;
  447.     background-color:{color:descriptionback};
  448. }
  449.  
  450. #desc{
  451.     position:fixed;
  452.     margin-top:5px;
  453.     margin-left:5px;
  454.     height:56px;
  455.     width:161px;
  456.     text-align:center;
  457.     font-family:tinytots;
  458.     text-transform:uppercase;
  459.     font-size:8px;
  460.     color:{color:description};
  461.     overflow:auto;
  462.     padding-right:5px;
  463. }
  464.  
  465. /*nav*/
  466.  
  467. #nav{
  468.     position:fixed;
  469.     margin-left:29px;
  470.     margin-top:310px;
  471.     width:126px;
  472.     height:70px;
  473. }
  474.  
  475. .nav{
  476.     display:block;
  477.     float:left;
  478.     height:9px;
  479.     padding-top:1px;
  480.     width:50px;
  481.     margin-left:5px;
  482.     text-align:center;
  483.     font-family:tinytots;
  484.     font-size:8px;
  485.     text-transform:uppercase;
  486.     border:solid 2px {color:nav};
  487.     color:{color:navlinks};
  488.     background-color:{color:nav};
  489.     -webkit-transition: all 0.3s linear;
  490.     -moz-transition: all 0.3s linear;
  491.     -o-transition: all 0.3s linear;
  492. }
  493.  
  494. .nav:hover{
  495.     color:{color:navlinkhover};
  496.     background-color:{color:navhover};
  497. }
  498.  
  499. .custom{
  500.     display:block;
  501.     float:left;
  502.     height:9px;
  503.     padding-top:1px;
  504.     width:50px;
  505.     margin-left:5px;
  506.     margin-top:3px;
  507.     text-align:center;
  508.     font-family:tinytots;
  509.     font-size:8px;
  510.     text-transform:uppercase;
  511.     border:solid 2px {color:custom};
  512.     color:{color:customlinks};
  513.     background-color:{color:custom};
  514.     -webkit-transition: all 0.3s linear;
  515.     -moz-transition: all 0.3s linear;
  516.     -o-transition: all 0.3s linear;
  517. }
  518.  
  519. .custom:hover{
  520.     color:{color:customlinkhover};
  521.     background-color:{color:customhover};
  522. }
  523.  
  524.  
  525.  
  526.  /*right*/
  527.  
  528. #bar4{
  529.      position:fixed;
  530.      margin-left:1200px;
  531.      height:100%;
  532.      width:20px;
  533.      top:0;
  534.      z-index:-999;
  535.      background-color:{color:backgroundbar4};
  536. }
  537.  
  538. #bar5{
  539.      position:fixed;
  540.      margin-left:1225px;
  541.      height:100%;
  542.      width:10px;
  543.      top:0;
  544.      z-index:-999;
  545.      background-color:{color:backgroundbar5};
  546. }
  547.  
  548.    
  549. /*standalone*/
  550.  
  551. #sideimage{
  552.     {block:ifshowstandalone}
  553.     position:fixed;
  554.     bottom:0;
  555.     max-width:450px;
  556.    
  557.     z-index:-99;
  558.    
  559.         {block:indexpage}
  560.             {block:if250pxposts}
  561.                 margin-left:960px;
  562.             {/block:if250pxposts}
  563.             {block:if400pxposts}
  564.                 margin-left:960px;
  565.             {/block:if400pxposts}
  566.             {block:if500pxposts}
  567.                 margin-left:1020px;
  568.             {/block:if500pxposts}
  569.         {/block:indexpage}
  570.        
  571.         {block:permalinkpage}
  572.             margin-left:1020px;
  573.         {/block:permalinkpage}
  574.    
  575.     {/block:ifshowstandalone}
  576.    
  577.     {block:ifnotshowstandalone}
  578.     display:none;
  579.     {/block:ifnotshowstandalone}
  580. }
  581.  
  582.  
  583.  
  584. /*pagination*/
  585.  
  586. .pagination{
  587.     position:fixed;
  588.     margin-top:400px;
  589.     width:364px;
  590.     height:30px;
  591.     text-align:center;
  592.     font-family:tinytots;
  593.     font-size:50px;
  594.     -webkit-transition: all 0.3s linear;
  595.     -moz-transition: all 0.3s linear;
  596.     -o-transition: all 0.3s linear;
  597. }
  598.  
  599. .pagination a{
  600.     color:{color:pagination};
  601. }
  602.  
  603. .pagination a:hover{
  604.     font-size:55px;
  605. }
  606.    
  607.  
  608. /*posts*/
  609.  
  610.  
  611. #postmargin{
  612.     margin-top:10px;
  613.    
  614.     {block:indexpage}
  615.         {block:if250pxposts}
  616.             width:250px;
  617.             margin-left:600px;
  618.         {/block:if250pxposts}
  619.         {block:if400pxposts}
  620.             width:400px;
  621.             margin-left:500px;
  622.         {/block:if400pxposts}
  623.         {block:if500pxposts}
  624.             width:500px;
  625.             margin-left:480px;
  626.         {/block:if500pxposts}
  627.     {/block:indexpage}
  628.    
  629.     {block:permalinkpage}
  630.         width:500px;
  631.         margin-left:480px;
  632.     {/block:permalinkpage}
  633.    
  634.     z-index:9999;
  635.    
  636. }
  637.  
  638. .posts{
  639.    
  640.    {block:indexpage}
  641.         {block:if250pxposts}width:250px;{/block:if250pxposts}
  642.         {block:if400pxposts}width:400px;{/block:if400pxposts}
  643.         {block:if500pxposts}width:500px;{/block:if500pxposts}
  644.     {/block:indexpage}
  645.    
  646.     {block:permalinkpage}
  647.         width:500px;
  648.     {/block:permalinkpage}
  649.    
  650.     padding:10px;
  651.     margin-bottom:13px;
  652.     margin-right:10px;
  653.     background-color:{color:post};
  654.     -webkit-transition: all 0.5s linear;
  655.     -moz-transition: all 0.5s linear;
  656.     -o-transition: all 0.5s linear;
  657.  
  658. }
  659.  
  660. .posts:hover{
  661.     box-shadow:0px 0px 3px #c7c7c7;
  662. }
  663.  
  664.  
  665. .posts:hover img{
  666.      opacity:1;
  667.     {block:ifmonochrome}
  668.     {block:indexpage}
  669.         -webkit-filter: grayscale(0%);
  670.         -moz-filter: grayscale(0%);
  671.         -ms-filter: grayscale(0%);
  672.         -o-filter: grayscale(0%);
  673.     {/block:indexpage}
  674.     {/block:ifmonochrome}
  675.      
  676. }
  677.  
  678. .posts img{
  679.     border:none;
  680.     max-width:100%;
  681.     -webkit-transition: all 0.7s linear;
  682.     -moz-transition: all 0.7s linear;
  683.     -o-transition: all 0.7s linear;
  684.     opacity:0.9;
  685.     {block:ifmonochrome}
  686.     {block:indexpage}
  687.         -webkit-filter: grayscale(100%);
  688.         -moz-filter: grayscale(100%);
  689.         -ms-filter: grayscale(100%);
  690.         -o-filter: grayscale(100%);
  691.     {/block:indexpage}
  692.     {/block:ifmonochrome}  
  693. }
  694.  
  695.  
  696. .posts iframe{
  697.     border:none;
  698.     opacity:0.9;    
  699.     -webkit-transition: all 0.7s linear;
  700.     -moz-transition: all 0.7s linear;
  701.     -o-transition: all 0.7s linear;
  702.     {block:ifmonochrome}
  703.     {block:indexpage}
  704.         -webkit-filter: grayscale(100%);
  705.         -moz-filter: grayscale(100%);
  706.         -ms-filter: grayscale(100%);
  707.         -o-filter: grayscale(100%);
  708.     {/block:indexpage}
  709.     {/block:ifmonochrome}
  710.  
  711. }
  712.  
  713. .posts:hover iframe{
  714.     opacity:1;
  715.     {block:ifmonochrome}
  716.     {block:indexpage}
  717.         -webkit-filter: grayscale(0%);
  718.         -moz-filter: grayscale(0%);
  719.         -ms-filter: grayscale(0%);
  720.         -o-filter: grayscale(0%);
  721.     {/block:indexpage}
  722.     {/block:ifmonochrome}
  723.  }
  724.  
  725.  
  726. .posts a{
  727.     text-decoration:none;
  728.     outline:none;
  729.     -moz-outline-style:none;
  730.     color:{color:postlinks};
  731.     -webkit-transition: all 0.3s linear;
  732.     -moz-transition: all 0.3s linear;
  733.     -o-transition: all 0.3s linear;    
  734. }
  735.  
  736. .posts a:hover{
  737.     color:{color:postlinkhover};
  738.     text-shadow:0px 0px 3px #888888;
  739. }
  740.  
  741.  
  742. #permalink{
  743.     {block:indexpage}
  744.         {block:if250pxposts}width:210px;{/block:if250pxposts}
  745.         {block:if400pxposts}width:360px;{/block:if400pxposts}
  746.         {block:if500pxposts}width:460px;{/block:if500pxposts}
  747.        
  748.             height:auto;
  749.             padding:5px;
  750.     {/block:indexpage}
  751.    
  752.     {block:permalinkpage}
  753.         width:460px;
  754.         height:auto;
  755.         padding:5px;
  756.     {/block:permalinkpage}
  757.  
  758.    margin-top:-10px;
  759.    margin-left:25px;
  760.    margin-bottom:15px;
  761.     background-color:{color:permalink};
  762.     color:{color:permalinktext};
  763.     text-align:center;
  764.     font-family:tinytots;
  765.     text-transform:uppercase;
  766.     font-size:8px;
  767.     overflow:hidden;
  768.     -webkit-transition: all 0.5s linear;
  769.     -moz-transition: all 0.5s linear;
  770.     -o-transition: all 0.5s linear;
  771. }
  772.  
  773.  
  774. .permalink a{
  775.     color:{color:datelinks};
  776. }
  777.  
  778. .permalink a:hover{
  779.     color:{color:datelinkhover};
  780. }
  781.  
  782. .permalink{
  783.     border-bottom: solid 0px {color:permalinkborder};
  784. }
  785.  
  786. .tags{
  787.     padding-top:2px;
  788. }
  789.  
  790. .tags a{
  791.         color:{color:taglinks};
  792. }
  793.  
  794. .tags a:hover{
  795.     color:{color:taglinkhover};
  796. }
  797.    
  798.    
  799.  
  800. #quote {
  801.         font-family:tinytots;
  802.         {block:indexpage}
  803.             {block:if250pxposts}font-size:15px;{/block:if250pxposts}
  804.             {block:if400pxposts}font-size:18px;{/block:if400pxposts}
  805.             {block:if500pxposts}font-size:20px;{/block:if500pxposts}
  806.         {/block:indexpage}
  807.         {block:permalinkpage}
  808.             font-size:20px;
  809.         {/block:permalinkpage}    
  810.     color:{color:quote};
  811.     padding-left:20px;
  812.     padding-right:20px;
  813.     padding-top:10px;
  814.     line-height:100%;
  815.     text-align:justify;
  816.     text-transform:uppercase;
  817. }
  818.  
  819. #title {
  820.         font-family:tinytots;
  821.         {block:indexpage}
  822.             {block:if250pxposts}font-size:15px;{/block:if250pxposts}
  823.             {block:if400pxposts}font-size:20px;{/block:if400pxposts}
  824.             {block:if500pxposts}font-size:20px;{/block:if500pxposts}
  825.         {/block:indexpage}
  826.         {block:permalinkpage}
  827.             font-size:20px;
  828.         {/block:permalinkpage}
  829.     color:{color:quote};
  830.     padding-left:20px;
  831.     padding-right:20px;
  832.     padding-top:10px;
  833.     padding-bottom:5px;
  834.     line-height:100%;
  835.     text-transform:uppercase;
  836. }
  837.  
  838.  
  839. #audioplayerback {
  840.     position: absolute;
  841.     width: 28px;
  842.     height: 30px;
  843.     padding-left:2px;
  844.     background-color: #ffffff;
  845.     position:absolute;
  846.     margin-top:40px;
  847.     margin-left:35px;
  848.     z-index:999;
  849.     overflow:hidden;
  850.     -webkit-transition: all 0.5s linear;
  851.     -moz-transition: all 0.5s linear;
  852.     -o-transition: all 0.5s linear;
  853. }
  854.  
  855. .tumblr_audio_player {
  856.     border: none;
  857.     padding: 0px;
  858.     margin: 0px;
  859.     height: 30px;
  860.     width:500px;
  861. }
  862.  
  863.  
  864. #musicinfo{
  865.     color:{color:text};
  866.     margin-top:-90px;
  867.     margin-left:110px;
  868.     background-color:{color:blockquote2};
  869.     padding-left:10px;
  870.     padding-top:5px;
  871.     padding-right:5px;
  872.     padding-bottom:5px;
  873.     line-height:110%;
  874.     margin-bottom:50px;
  875. }
  876.  
  877. #audiocaption{
  878.     margin-top:-15px;
  879.     padding-left:10px;
  880.     padding-right:10px;
  881. }
  882.  
  883. #albumart{
  884.     height:100px;
  885.     width:100px;
  886.     background-image:url('https://lh3.googleusercontent.com/-ABbl71o4DHE/UZh6Xuh6QJI/AAAAAAAAEn8/j49R7fSCZHE/s200-no/Untitled-1.jpg');
  887.     background-position:fixed;
  888.     background-size:100px 100px;
  889.     background-repeat:no-repeat;
  890.     z-index:-1;
  891.     -webkit-transition: all 0.5s linear;
  892.     -moz-transition: all 0.5s linear;
  893.     -o-transition: all 0.5s linear;
  894. }
  895.  
  896.  
  897. .askicon {
  898.     position:absolute;
  899.     {block:indexpage}
  900.         {block:if250pxposts}margin-left:20px;{/block:if250pxposts}
  901.         {block:if400pxposts}margin-left:100px;{/block:if400pxposts}
  902.         {block:if500pxposts}margin-left:100px;{/block:if500pxposts}
  903.     {/block:indexpage}
  904.     {block:permalinkpage}
  905.         margin-left:100px;
  906.     {/block:permalinkpage}
  907. }
  908.  
  909. #triangle {
  910.     {block:indexpage}
  911.         {block:if250pxposts}margin-left:27px;{/block:if250pxposts}
  912.         {block:if400pxposts}margin-left:107px;{/block:if400pxposts}
  913.         {block:if500pxposts}margin-left:107px;{/block:if500pxposts}
  914.     {/block:indexpage}
  915.     {block:permalinkpage}
  916.         margin-left:107px;
  917.     {/block:permalinkpage}
  918.     width: 0;
  919.     height: 0;
  920.     border-left: 7px solid transparent;
  921.     border-right: 7px solid transparent;
  922.     border-top: 15px solid {color:blockquote2};
  923. }
  924.  
  925.  
  926. #askz {
  927.     padding:10px;
  928.     line-height: 140%;
  929.     {block:indexpage}
  930.         {block:if250pxposts}width:230px;{/block:if250pxposts}
  931.         {block:if400pxposts}width:380px;{/block:if400pxposts}
  932.         {block:if500pxposts}width:480px;{/block:if500pxposts}
  933.     {/block:indexpage}
  934.     {block:permalinkpage}
  935.         width:480px;
  936.     {/block:permalinkpage}
  937.     color:{color:question};
  938.     text-align:justify;
  939.  
  940.     background-color:{color:blockquote2};
  941. }
  942.  
  943. #qask{
  944.     {block:indexpage}
  945.         {block:if250pxposts}margin-left:35px;{/block:if250pxposts}
  946.         {block:if400pxposts}margin-left:115px;{/block:if400pxposts}
  947.         {block:if500pxposts}margin-left:115px;{/block:if500pxposts}
  948.     {/block:indexpage}
  949.     {block:permalinkpage}
  950.         margin-left:115px;
  951.     {/block:permalinkpage}
  952.     margin-top:8px;
  953.     padding-right:10px;
  954.     padding-top:3px;
  955.     padding-bottom:3px;
  956.     padding-left:30px;
  957.     font-size:9px;
  958.     max-width:180px;
  959.     font-family:tinytots;
  960.     font-size:8px;
  961.     text-transform:uppercase;
  962.     background-color:{color:blockquote};
  963. }
  964.  
  965. #answer {
  966.     padding:5px;
  967.     {block:indexpage}
  968.         {block:if250pxposts}
  969.             margin-left:10px;
  970.             width:220px;
  971.         {/block:if250pxposts}
  972.         {block:if400pxposts}
  973.             margin-left:30px;
  974.             width:330px;
  975.         {/block:if400pxposts}
  976.         {block:if500pxposts}
  977.             margin-left:30px;
  978.             width:430px;
  979.         {/block:if500pxposts}
  980.     {/block:indexpage}
  981.     {block:permalinkpage}
  982.         margin-left:30px;
  983.         width:430px;
  984.     {/block:permalinkpage}
  985.     text-align:justify;
  986. }
  987.  
  988. #answer img{
  989.     max-width:100%;
  990.     height:auto;
  991. }
  992.  
  993. .posts:hover #answer img{
  994.     box-shadow: 0px 0px 0px #9e9797;
  995. }
  996.  
  997. ol.notes{
  998.     max-width:500px;
  999.     padding:0px;
  1000.     margin: 0px 15px;
  1001.     list-style-type:none;
  1002.     font-size:8 px;
  1003.     font-family:tinytots;
  1004. }
  1005.  
  1006. ol.notes li.note{
  1007.     padding:0px;
  1008.     font-size:8px;
  1009. }
  1010.  
  1011. ol.notes li.note img{
  1012.     margin-top:7px;
  1013. }
  1014.  
  1015. ol.notes li.note img.avatar{
  1016.  
  1017.     margin-right:3px;
  1018.     width:16px;
  1019.     height:16px;
  1020. }
  1021.  
  1022. ol.notes li.note a img.avatar{
  1023.     padding:0px;
  1024.     border-width:0 px;
  1025.     border:none;
  1026. }
  1027.  
  1028. ol.notes li.note img{
  1029.     padding:0 px;
  1030.     border-width:0 px;
  1031.     border:none;
  1032. }
  1033.  
  1034. ol.notes li.note span.action{
  1035.     color:{color:text};
  1036. }
  1037.  
  1038. ol.notes li.note.answer_content{
  1039.     font-weight:normal;
  1040. }
  1041.  
  1042. ol.notes li.note.blockquote{
  1043.     padding:1 px 1 px;margin:1px 0px 0px 1px;
  1044. }
  1045.  
  1046. ol.notes li.note.blockquote a{
  1047.     text-decoration:none;
  1048. }
  1049.  
  1050. ol.notes li.note a{
  1051.     color:{color:text};
  1052. }
  1053.  
  1054. ol.notes li.note a:hover{
  1055.     text-shadow:0px 0px 5px #888888;
  1056. }
  1057.  
  1058.  
  1059.  
  1060.  /*etc*/
  1061.  
  1062. #credit{
  1063.     position:fixed;
  1064.     bottom:10px;
  1065.     right:10px;
  1066.     z-index:1;
  1067.     -webkit-transition: all 0.3s linear;
  1068.     -moz-transition: all 0.3s linear;
  1069.     -o-transition: all 0.3s linear;
  1070.     -ms-transition: all 0.3s linear;
  1071.         -webkit-filter: grayscale(100%);
  1072.       -moz-filter: grayscale(100%);
  1073.       -ms-filter: grayscale(100%);
  1074.       -o-filter: grayscale(100%);
  1075. }
  1076.  
  1077. #credit:hover{
  1078.      -webkit-filter: grayscale(0%);
  1079.   -moz-filter: grayscale(0%);
  1080.   -ms-filter: grayscale(0%);
  1081.   -o-filter: grayscale(0%);
  1082. }
  1083.    
  1084.  #s-m-t-tooltip{
  1085.   max-width:300px;
  1086.   z-index:10;
  1087.   margin:24px 14px 7px 12px;
  1088.   padding:5px;
  1089.   background:#232323;
  1090.   -moz-border-radius:0px;
  1091.   -webkit-border-radius:0px;
  1092.   border-radius:0px;
  1093.   -moz-box-shadow:0px 0px 3px #232323;
  1094.   -webkit-box-shadow:0px 0px 3px #232323;
  1095.   box-shadow:0px 0px 3px #232323;
  1096.   font-family:tinytots;
  1097.   font-size:8px;
  1098.   text-transform:uppercase;
  1099.   color:#fff;
  1100. }
  1101.    
  1102.  
  1103. {CustomCSS}
  1104.    
  1105. body {cursor: url(http://www.dolliehost.com/dolliecrave/cursors/cursors-arrow/arrow38.gif), progress !important;}
  1106.    
  1107. a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;}
  1108.    
  1109. </style>
  1110.  
  1111.    
  1112.  
  1113.    
  1114. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  1115.    
  1116.  
  1117.    
  1118. </head><body>
  1119.  
  1120.  <a href="http://redfox-themes.tumblr.com"><img src="https://lh5.googleusercontent.com/-jDb8l0m6g2s/ULvHPyFukjI/AAAAAAAACoA/FRBmvQsxRkc/s22/fox.gif" id="credit" title="redfox themes"></a>
  1121.  
  1122.  
  1123. <img src="{image:standalone}" id="sideimage">
  1124. <div id="bar4"></div>
  1125. <div id="bar5"></div>
  1126.  
  1127. <div id="bar1"></div>
  1128. <div id="bar2"></div>
  1129. <div id="sidebar"></div>
  1130. <div id="sideimgback">
  1131.     {block:ifnotinfinitescroll}{block:Pagination}
  1132.         <div class="pagination">
  1133.             {block:PreviousPage}
  1134.                 <a href="{PreviousPage}">&#171;</a>
  1135.             {/block:PreviousPage}
  1136.             {block:NextPage}
  1137.                 <a href="{NextPage}">&#187;</a>
  1138.             {/block:NextPage}
  1139.         </div>
  1140.     {/block:Pagination}{/block:ifnotinfinitescroll}
  1141.     <a href="/"><div id="main">{title}</div></a>
  1142.     <div id="sub">❝ {text:subtitle} ❞</div>
  1143.     {block:ifmusicplayer}
  1144.         <div id="playerback">
  1145.             <img src="https://lh6.googleusercontent.com/-XWQyuyiXAqM/ULmeOm5KNRI/AAAAAAAACk4/fhqLw5dLR_s/s14/tumblr_m7w2n46Pdl1r6o8v2.gif">
  1146.             <div id="playerplayer">
  1147.                 {text:playercode}
  1148.             </div>
  1149.         </div>
  1150.     {/block:ifmusicplayer}
  1151.     <a href="/"><img src="{image:sidebar}" id="sideimg"></a>
  1152.     <div id="descback">
  1153.         <div id="descboard">
  1154.             <div id="desc">{description}</div>
  1155.         </div>
  1156.     </div>
  1157.     <div id="nav">
  1158.         <a href="/ask" class="nav">message</a>
  1159.         <a href="/archive" class="nav">archive</a>
  1160.         {block:iflink1}<a href="{text:link1URL}" class="custom">{text:link1}</a>{/block:iflink1}
  1161.         {block:iflink2}<a href="{text:link2URL}" class="custom">{text:link2}</a>{/block:iflink2}
  1162.         {block:iflink3}<a href="{text:link3URL}" class="custom">{text:link3}</a>{/block:iflink3}
  1163.         {block:iflink4}<a href="{text:link4URL}" class="custom">{text:link4}</a>{/block:iflink4}
  1164.         {block:iflink5}<a href="{text:link5URL}" class="custom">{text:link5}</a>{/block:iflink5}
  1165.         {block:iflink6}<a href="{text:link6URL}" class="custom">{text:link6}</a>{/block:iflink6}
  1166.     </div>
  1167. </div>
  1168.  
  1169.  
  1170. <div id="postmargin">
  1171.     {block:ifinfinitescroll}<div class="autopagerize_page_element">{/block:ifinfinitescroll}
  1172.     {block:Posts}
  1173. <div class="posts">
  1174.  
  1175.  
  1176. {block:Text}
  1177.     <center>
  1178.         <div id="title">{block:Title}{Title}{/block:Title}</div>
  1179.     </center>
  1180.     {Body}
  1181. {/block:Text}
  1182.  
  1183.  
  1184. {block:Photo}
  1185.     <center>
  1186.         <img src="{PhotoURL-500}" width="500">
  1187.     </center>
  1188.     {block:indexpage}
  1189.         {block:ifnothiddendescriptions}
  1190.             {block:Caption}
  1191.                 {Caption}
  1192.             {/block:Caption}
  1193.         {/block:ifnothiddendescriptions}
  1194.     {/block:indexpage}
  1195.     {block:permalinkpage}
  1196.         {block:Caption}
  1197.             {Caption}
  1198.         {/block:Caption}
  1199.     {/block:permalinkpage}
  1200. {/block:Photo}
  1201.  
  1202.  
  1203. {block:Photoset}
  1204.     <center>
  1205.         {block:indexpage}
  1206.             {block:if250pxposts}{Photoset-250}{/block:if250pxposts}
  1207.             {block:if400pxposts}{Photoset-400}{/block:if400pxposts}
  1208.             {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  1209.         {/block:indexpage}
  1210.         {block:permalinkpage}
  1211.             {Photoset-500}
  1212.         {/block:permalinkpage}
  1213.     </center>
  1214.     {block:indexpage}
  1215.         {block:ifnothiddendescriptions}
  1216.             {block:Caption}
  1217.                 {Caption}
  1218.             {/block:Caption}
  1219.         {/block:ifnothiddendescriptions}
  1220.     {/block:indexpage}
  1221.     {block:permalinkpage}
  1222.         {block:Caption}
  1223.             {Caption}
  1224.         {/block:Caption}
  1225.     {/block:permalinkpage}
  1226. {/block:Photoset}
  1227.  
  1228.  
  1229. {block:Quote}
  1230.     <div id="quote">
  1231.         ❝ {Quote} ❞
  1232.     </div>
  1233.         <p align="right">
  1234.             {block:Source}
  1235.                 —{Source}
  1236.             {/block:Source}
  1237.         </p>
  1238. {/block:Quote}
  1239.  
  1240.  
  1241. {block:Link}
  1242.     <div id="title" align="center"><t>
  1243.         <a href="{URL}" {Target}>{Name}</a>
  1244.     </t></div>
  1245.     {block:Description}
  1246.         {Description}
  1247.     {/block:Description}
  1248. {/block:Link}
  1249.  
  1250.  
  1251. {block:Chat}
  1252.     <div id="title" align="center">
  1253.         {block:Title}<t>
  1254.             {Title}
  1255.         </t>{/block:Title}
  1256.     </div>
  1257.     <p>{block:Lines}
  1258.         {block:Label}
  1259.             <b>{Label}</b>
  1260.         {/block:Label}
  1261.         {Line}
  1262.         <br>
  1263.     {/block:Lines}</p>
  1264. {/block:Chat}
  1265.  
  1266.  
  1267. {block:Audio}
  1268.     {block:AudioPlayer}
  1269.     <div id="audioplayerback">
  1270.         {AudioPlayerWhite}
  1271.     </div>
  1272.     {/block:AudioPlayer}
  1273.     <div id="albumart">
  1274.         {block:AlbumArt}
  1275.             <img src="{AlbumArtURL}" width="100">
  1276.         {/block:AlbumArt}
  1277.     </div>
  1278.     <div id="musicinfo">
  1279.         <b>Song:</b> {block:TrackName}{TrackName}{/block:TrackName}
  1280.         <br><br>
  1281.         <b>Artist:</b> {block:Artist}{Artist}{/block:Artist}
  1282.         <br><br>
  1283.         <b>Album:</b> {block:Album}{Album}{/block:Album}
  1284.     </div>
  1285.     {block:caption}
  1286.         <div id="audiocaption">
  1287.             {caption}
  1288.         </div>
  1289.     {/block:caption}
  1290. {/block:Audio}
  1291.  
  1292.  
  1293. {block:Video}
  1294.     {block:indexpage}
  1295.         {block:if250pxposts}{Video-250}{/block:if250pxposts}
  1296.         {block:if400pxposts}{Video-400}{/block:if400pxposts}
  1297.         {block:if500pxposts}{Video-500}{/block:if500pxposts}
  1298.     {/block:indexpage}
  1299.     {block:permalinkpage}
  1300.         {Video-500}
  1301.     {/block:permalinkpage}
  1302.     {block:indexpage}
  1303.         {block:ifnothiddendescriptions}
  1304.             {block:Caption}
  1305.                 {Caption}
  1306.             {/block:Caption}
  1307.         {/block:ifnothiddendescriptions}
  1308.     {/block:indexpage}
  1309.     {block:permalinkpage}
  1310.         {block:Caption}
  1311.             {Caption}
  1312.         {/block:Caption}
  1313.     {/block:permalinkpage}
  1314. {/block:Video}
  1315.  
  1316. {block:Answer}
  1317.     <div id="askz">
  1318.         {Question}
  1319.     </div>
  1320.     <div id="triangle"></div>
  1321.     <img src="{AskerPortraitURL-30}" class="askicon">
  1322.     <div id="qask">
  1323.         {Asker} said—
  1324.     </div>
  1325.     <div id="answer">
  1326.         {Answer}
  1327.     </div>
  1328. {/block:Answer}
  1329.  
  1330.  
  1331.  
  1332. </div>
  1333.  
  1334.  
  1335.  {block:Date}
  1336.     <div id="permalink">
  1337.        <div class="permalink">
  1338.        
  1339.     {block:if250pxposts}    
  1340.         <a href="{Permalink}">{12Hour}:{Minutes}</a> on <a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a> with <a href="{Permalink}">{NoteCountWithLabel}</a> {block:RebloggedFrom}|| <a href="{ReblogRootURL}" title="{ReblogRootName}">OP</a> &#8226; <a href="{ReblogParentURL}" title="{ReblogParentName}">VIA</a>{/block:RebloggedFrom}
  1341.     {/block:if250pxposts}
  1342.    
  1343.     {block:ifnot250pxposts}    
  1344.         posted on <a href="{Permalink}">{Month} {DayOfMonth}, {Year}</a> at <a href="{Permalink}">{12hour}:{minutes}{ampm}</a> with <a href="{Permalink}">{NoteCountWithLabel}</a> {block:RebloggedFrom}|| <a href="{ReblogRootURL}" title="{ReblogRootName}">OP</a> &#8226; <a href="{ReblogParentURL}" title="{ReblogParentName}">VIA</a>{/block:RebloggedFrom}
  1345.     {/block:ifnot250pxposts}
  1346.    
  1347.         </div>
  1348.        
  1349.         <div class="tags">
  1350.     {block:HasTags}{block:Tags}#<a href="/tagged/{Tag}">{Tag} </a> {/block:Tags}{/block:HasTags}
  1351.    
  1352.        </div>
  1353.    </div>
  1354.  {/block:Date}
  1355.  
  1356. <div class="notes">
  1357.     {block:PostNotes}
  1358.         <a name="notes">
  1359.             {PostNotes}
  1360.         </a>
  1361.     {/block:PostNotes}
  1362. </div>
  1363.  
  1364.  
  1365.  
  1366. {/block:Posts}</div></div>
  1367.  
  1368.  
  1369.  
  1370. </body></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!