API tools faq
paste
darianella

"Cross My Heart" tumblr theme HTML code

darianella
Nov 30th, 2012
2,633
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 31.30 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=Wire+One' rel='stylesheet' type='text/css'>
  5.  
  6. <!--
  7.  
  8. POSTS:
  9.    -one, two, three 250px width columns OR
  10.    -one, two 400px width columns
  11.    -optional monochrome images
  12.    -show/hide desriptions
  13.    -optional post shadow
  14.    -optional permalink borders
  15.    -optional rounded post
  16.    -optional rounded permalinks
  17.    
  18. SIDEBAR
  19.    -endless description
  20.    -endless subtitle
  21.    -nine custom links
  22.    -infinate scroll/pagination
  23.    -max-350px width, max-600px height sidebar image
  24.    -optional music player
  25.    
  26. I LOVE YOU. COME SAY HI. ENJOY THIS THEME, LOVELIES.
  27.    -Darian
  28.  
  29. -->
  30.  
  31. <head><title>{Title}</title>
  32.  
  33. <link rel="shortcut icon" href="{Favicon}">
  34. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  35.  
  36. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  37.  
  38.     <meta name="color:title" content="#000000" />
  39.     <meta name="color:background" content="" />
  40.     <meta name="color:scrollbar" content="#773434" />
  41.     <meta name="color:post" content="#ffffff" />
  42.     <meta name="color:text" content="#2b2929" />
  43.     <meta name="color:links" content="#1b1919" />
  44.     <meta name="color:bold" content="#000000" />
  45.     <meta name="color:italic" content="#682f2f" />
  46.     <meta name="color:description" content="#2b2828" />
  47.     <meta name="color:permalink" content="#acabab" />
  48.     <meta name="color:quote" content="#000000" />
  49.     <meta name="color:question" content="#000000" />
  50.     <meta name="color:dateborders" content="#ffffff" />
  51.     <meta name="color:tagborders" content="#ffffff" />
  52.     <meta name="color:custom" content="#fdf8f8" />
  53.     <meta name="color:datelink" content="#ffffff" />
  54.     <meta name="color:navlinks" content="#d8d8d8" />
  55.     <meta name="color:arrow" content="#a5a4a4" />
  56.     <meta name="color:navigation" content="#dbd8d8" />
  57.     <meta name="color:sidebar" content="#ffffff" />
  58.     <meta name="color:subtitle" content="#ffffff" />
  59.    
  60.      <meta name="image:background" content="https://lh4.googleusercontent.com/-ZVFJqRpJBV4/ULmSqf0JksI/AAAAAAAACgM/8dyw1h_rd_w/s26/tiny_grid.png"/>
  61.      <meta name="image:sidebarback" content="https://lh4.googleusercontent.com/-3iTOn_g91No/ULmStCUOwUI/AAAAAAAACgU/gK_AdkIvdw0/s400/tumblr_ls0w5txuft1r3vazto1_400.png"/>
  62.      <meta name="image:standalone" content="https://lh4.googleusercontent.com/-QaEA29AueP8/ULmS3NbKUkI/AAAAAAAACgc/C4EQoHcERl0/s512/render_Luffy.png"/>
  63.          
  64.      
  65.      <meta name="if:Show Descriptions" content="0">
  66.     <meta name="if:Monochrome Posts" content="1">
  67.     <meta name="if:Small Posts" content="1">
  68.     <meta name="if:Post Shadow" content="1">
  69.     <meta name="if:Rounded Posts" content="0">
  70.      <meta name="if:Rounded Permalink" content="0">
  71.      <meta name="if:Permalink Border" content="1">
  72.     <meta name="if:Infinite Scroll" content="1">
  73.     <meta name="if:3D Title" content="1">
  74.     <meta name="if:One Column" content="1">
  75.     <meta name="if:Two Small Columns" content="0">
  76.     <meta name="if:Three Small Two Large Columns" content="0">
  77.     <meta name="if:Sidebar Shadow" content="1">
  78.     <meta name="if:Player" content="1">
  79.    
  80.     <meta name="text:Link1" content="" />
  81.     <meta name="text:Link1URL" content="/"/>
  82.     <meta name="text:Link2" content="" />
  83.     <meta name="text:Link2URL" content="/"/>
  84.     <meta name="text:Link3" content="" />
  85.     <meta name="text:Link3URL" content="/"/>
  86.     <meta name="text:Link4" content="" />
  87.     <meta name="text:Link4URL" content="/"/>
  88.     <meta name="text:Link5" content="" />
  89.     <meta name="text:Link5URL" content="/"/>
  90.     <meta name="text:Link6" content="" />
  91.     <meta name="text:Link6URL" content="/"/>
  92.     <meta name="text:Link7" content="" />
  93.     <meta name="text:Link7URL" content="/"/>
  94.     <meta name="text:Link8" content="" />
  95.     <meta name="text:Link8URL" content="/"/>
  96.     <meta name="text:Link9" content="" />
  97.     <meta name="text:Link9URL" content="/"/>
  98.     <meta name="text:Subtitle" content="/"/>
  99.     <meta name="text:PLAYERCODE" content=""/>
  100.  
  101. <style type="text/css">
  102.  
  103. ::-webkit-scrollbar {
  104.     width: 4px;
  105.     height: 4px;
  106. }
  107.  
  108. ::-webkit-scrollbar-thumb {
  109.     background: {color:scrollbar};
  110. }
  111.  
  112.  
  113. @font-face {
  114. font-family: "tinytots";
  115. src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
  116. }
  117.  
  118.   @font-face{
  119.             font-family: 'Wire One', sans-serif;
  120.         }
  121.  
  122.  
  123. iframe{
  124.     opacity: 0.9;
  125.     filter:alpha(opacity=90);
  126.     -moz-opacity: 0.9;
  127.     -khtml-opacity: 0.9;
  128. }
  129.  
  130. iframe#tumblr_controls {
  131.     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;}
  132.  
  133. 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;}
  134.  
  135.  
  136.  
  137. /*basic derps*/
  138.  
  139. body{
  140.     margin-top:0;
  141.     font-family: "tinytots";
  142.     color:{color:text};
  143.     font-size:8px;
  144.     line-height:100%;
  145.     background-image:url('{image:background}');
  146.     background-attachment: fixed;
  147.     background-repeat: repeat;
  148.     background-color: {color:background};
  149. }
  150.  
  151. .posts a{
  152.     text-decoration:none;
  153.     outline:none;
  154.     -moz-outline-style:none;
  155.     color:{color:links};
  156.     -webkit-transition: all 0.5s linear;
  157.     -moz-transition: all 0.5s linear;
  158.     -o-transition: all 0.5s linear;
  159. }
  160.  
  161. a{
  162.     text-decoration:none;
  163.     outline:none;
  164.     -moz-outline-style:none;
  165.     color:{color:navlinks};
  166.     -webkit-transition: all 0.5s linear;
  167.     -moz-transition: all 0.5s linear;
  168.     -o-transition: all 0.5s linear;
  169. }
  170.  
  171. a:hover{
  172.     text-shadow:2px 0 0 rgba(255,0,0,0.3), -2px 0 0 rgba(0,255,0,0.3);
  173. }
  174.  
  175. em{
  176.     color:{color:italic};
  177. }
  178.  
  179. strong{
  180.     color:{color:bold};
  181. }
  182.  
  183. img{
  184.     border:none;
  185. }
  186.  
  187. blockquote{
  188.     padding-left:5px;
  189. }
  190.  
  191. blockquote blockquote{
  192.     padding-left:5px;
  193.     border-left:1px dashed #C7C7C7;
  194. }
  195.  
  196. blockquote img{
  197.     {block:ifnotsmallposts}max-width: 380px!important;{/block:ifnotsmallposts}
  198.     {block:ifsmallposts}max-width: 130px!important;{/block:ifsmallposts}
  199. }
  200.  
  201. blockquote blockquote img{
  202.    {block:ifnotsmallposts}max-width: 360px!important;{/block:ifnotsmallposts}
  203.     {block:ifsmallposts}max-width: 110px!important;{/block:ifsmallposts}
  204. }
  205.  
  206. blockquote blockquote blockquote img{
  207.     {block:ifnotsmallposts}max-width: 340px!important;{/block:ifnotsmallposts}
  208.     {block:ifsmallposts}max-width: 100px!important;{/block:ifsmallposts}
  209. }  
  210.  
  211. blockquote blockquote blockquote blockquote img{
  212.    {block:ifnotsmallposts}max-width: 320px!important;{/block:ifnotsmallposts}
  213.     {block:ifsmallposts}max-width: 70px!important;{/block:ifsmallposts}
  214. }
  215.  
  216. pre{
  217.     font-size:8px;
  218.     {block:ifsmallposts}max-width:230px;{/block:ifsmallposts}
  219.     {block:ifnotsmallposts}max-width:380px;{/block:ifnotsmallposts}
  220.     overflow:auto;
  221.     background-color:#c7c7c7;
  222.     padding:3px;
  223. }
  224.  
  225. pre::-webkit-scrollbar {
  226.     width: 2px;
  227.     height: 2px;
  228. }
  229.  
  230. pre::-webkit-scrollbar-thumb {
  231.     background: {color:scrollbar};
  232. }
  233.  
  234. /*sidebar*/
  235.  
  236. #sidebar{
  237.     position:fixed;
  238.     top:0;
  239.     margin-left:100px;
  240.     height:100%;
  241.     width:100px;
  242.     background-color:{color:sidebar};
  243.     background-image:url('{image:sidebarback}');
  244.     background-attachment: fixed;
  245.     background-repeat: repeat;
  246.     {block:ifsidebarshadow}box-shadow: 0px 0px 5px #888888;{/block:ifsidebarshadow}
  247.     -webkit-transition: all 0.5s ease-out;
  248.     -moz-transition: all 0.5s ease-out;
  249.     -o-transition: all 0.5s ease-out;
  250.     z-index:1;
  251. }
  252.  
  253.  
  254. #triangle1 {
  255.     position:fixed;
  256.     margin-top:300px;
  257.     margin-left:30px;
  258.     width: 0;
  259.     height: 0;
  260.     border-top: 60px solid transparent;
  261.     border-right: 80px solid {color:arrow};
  262.     border-bottom: 60px solid transparent;
  263.     z-index:999;
  264.     -webkit-transition: all 0.5s ease-out;
  265.     -moz-transition: all 0.5s ease-out;
  266.     -o-transition: all 0.5s ease-out;
  267. }
  268.  
  269. #bar1{
  270.     position:fixed;
  271.     margin-top:320px;
  272.     height:60px;
  273.     width:110px;
  274.     left:0;
  275.     z-index:-1;
  276.     background-color:{color:arrow};
  277.     -webkit-transition: all 0.5s ease-out;
  278.     -moz-transition: all 0.5s ease-out;
  279.     -o-transition: all 0.5s ease-out;
  280. }
  281.  
  282. #sidebar:hover ~ #bar1{
  283.     width:280px;
  284. }
  285.  
  286. #sidebar:hover{
  287.     width:130px;
  288.     margin-left:80px;
  289. }
  290.  
  291. #sidebar:hover #triangle1{
  292.     margin-left:160px;
  293.     border-right:80px solid {color:arrow};
  294.     border-top:50px solid transparent;
  295.     border-bottom:50px solid transparent;
  296.     margin-top:310px;
  297.      -webkit-transform: perspective(400px) rotate3d(0,1,0,180deg);
  298.     -moz-transform: perspective(400px) rotate3d(0,1,0,180deg);
  299.     -o-transform: perspective(400px) rotate3d(0,1,0,180deg);
  300. }
  301.  
  302. #desc{
  303.     position:fixed;
  304.     margin-top:250px;
  305.     width:100px;
  306.     max-height:80px;
  307.     overflow:auto;
  308.     font-family:"tinytots";
  309.     font-size:8px;
  310.     text-align:justify;
  311.     padding-right:2px;
  312.     color:{color:description};
  313.     margin-left:0;
  314.     opacity:0;
  315.     -webkit-transition: all 0.5s ease-out;
  316.     -moz-transition: all 0.5s ease-out;
  317.     -o-transition: all 0.5s ease-out;
  318. }
  319.  
  320. #sidebar:hover #desc{
  321.     margin-left:15px;
  322.     margin-top:320px;
  323.     opacity:1;
  324. }
  325.  
  326. #desc::-webkit-scrollbar {
  327.     width: 2px;
  328.     height:2px;
  329.     border-radius:4px;
  330. }
  331.  
  332.  
  333. #desc::-webkit-scrollbar-thumb:vertical {
  334.     background-color: {color:scrollbar};
  335. }
  336.  
  337. /*title*/
  338.  
  339. #main{
  340.     position:fixed;
  341.     margin-top:50px;
  342.     {block:ifonecolumn}margin-left:275px;{/block:ifonecolumn}
  343.     {block:iftwosmallcolumns}margin-left:233px;{/block:iftwosmallcolumns}
  344.     {block:ifthreesmalltwolargecolumns}margin-left:233px;{/block:ifthreesmalltwolargecolumns}
  345.     width:200px;
  346.     text-align:center;
  347.     line-height:100%;
  348.     color:{color:title};
  349.     font-family: 'Wire One', sans-serif;
  350.     font-size:45px;
  351.     {block:if3dtitle}text-shadow:2px 0 0 rgba(255,0,0,0.2), -2px 0 0 rgba(0,255,0,0.2);{/block:if3dtitle}
  352. }
  353.  
  354. #small{
  355.     position:fixed;
  356.     margin-top:125px;
  357.     margin-left:-50px;
  358.     min-height:10px;
  359.     width:120px;
  360.     background-color:{color:subtitle};
  361.     box-shadow: 0px 0px 5px #888888;
  362.     opacity:0;
  363.     text-align:justify;
  364.     -webkit-transition: all 0.5s ease-out;
  365.     -moz-transition: all 0.5s ease-out;
  366.     -o-transition: all 0.5s ease-out;
  367.     padding:5px;
  368. }
  369.  
  370. #sidebar:hover #small{
  371.     margin-left:80px;
  372.     opacity:0.9;
  373. }  
  374.  
  375. /*navigation*/
  376.  
  377. #nav{
  378.     position:fixed;
  379.     margin-top:225px;
  380.     margin-left:15px;
  381.     width:100px;
  382. }
  383.  
  384.  
  385. .nav{
  386.     display:block;
  387.     float:left;
  388.     width:100px;
  389.     height:8px;
  390.     padding-top:2px;
  391.     background-color:{color:navigation};
  392.     text-align:center;
  393.     box-shadow: 0px 0px 5px #888888;
  394.     -webkit-transition: all 0.5s ease-out;
  395.     -moz-transition: all 0.5s ease-out;
  396.     -o-transition: all 0.5s ease-out;
  397. }
  398.  
  399. .nav:hover{
  400.     width:85px;
  401.     margin-left:7px;
  402. }
  403.  
  404. #custom{
  405.     position:fixed;
  406.     margin-top:425px;
  407.     margin-left:15px;
  408.     width:100px;
  409. }
  410.  
  411. #custom .nav{
  412.     opacity:0;
  413. }
  414.  
  415. #sidebar:hover #custom .nav{
  416.     opacity:0.99;
  417. }
  418.  
  419. .custom{
  420.     display:block;
  421.     float:left;
  422.     width:100px;
  423.     height:8px;
  424.     margin-top:-10px;
  425.     padding-top:2px;
  426.     background-color:{color:custom};
  427.     text-align:center;
  428.     box-shadow: 0px 0px 5px #888888;
  429.     -webkit-transition: all 0.5s ease-out;
  430.     -moz-transition: all 0.5s ease-out;
  431.     -o-transition: all 0.5s ease-out;
  432.     opacity:0;
  433. }
  434.  
  435. .custom:hover{
  436.     width:85px;
  437.     margin-left:7px;
  438. }
  439.  
  440. #custom:hover .custom{
  441.    opacity:0.99;
  442.     margin-top:0;
  443. }
  444.  
  445.  
  446.  
  447. #parceiros {
  448.     opacity: 0;
  449.     -webkit-transition:all 0.5s ease;
  450.     -moz-transition:all 0.5s ease;
  451.     -o-transition:all 0.5s ease;
  452. }
  453.  
  454. #sidebar:hover #parceiros{
  455.     opacity:0.99;
  456. }
  457.  
  458. #parceiros:hover a {
  459.     opacity: .20;
  460. }
  461.  
  462. #parceiros a {
  463.     opacity: .80;
  464.     -webkit-transition:all 1s ease;
  465.     -moz-transition:all 1s ease;
  466.     -o-transition:all 1s ease;
  467. }
  468.  
  469. #parceiros a:hover {
  470.     opacity: .99;
  471. }    
  472.    
  473.  
  474. /*sideimage*/
  475.  
  476. #sideimage{
  477.     position:fixed;
  478.     margin-left:160px;
  479.     max-width:350px;
  480.     max-height:600px;
  481.     bottom:0;
  482.     z-index:-999;
  483. }
  484.  
  485. /*music*/
  486.  
  487. #music{
  488.     {block:ifnotplayer}display:none;{/block:ifnotplayer}
  489.     {block:ifplayer}position:absolute;
  490.     margin-left:20px;
  491.     margin-top:335px;
  492.     width:50px;
  493.     height:30px;{/block:ifplayer}
  494.      -webkit-transition:all 0.5s ease;
  495.     -moz-transition:all 0.5s ease;
  496.     -o-transition:all 0.5s ease;
  497. }
  498.  
  499. #sidebar:hover ~ #music{
  500.     margin-left:10px;
  501. }
  502.  
  503. #player{
  504.     position:fixed;
  505.     margin-top:10px;
  506.     margin-left:17px;
  507. }
  508.  
  509. #billy{
  510.     position:fixed;
  511.     margin-top:30px;
  512.     opacity:0;
  513.      -webkit-transition:all 0.5s ease;
  514.     -moz-transition:all 0.5s ease;
  515.     -o-transition:all 0.5s ease;
  516. }
  517.  
  518. #music:hover #billy{
  519.     margin-top:50px;
  520.     opacity:1;
  521. }
  522.  
  523. /*poata*/
  524.  
  525. #postmargin{
  526.     margin-top:10px;
  527.     {block:ifonecolumn}width:500px;
  528.     margin-left:550px;{/block:ifonecolumn}
  529.     {block:iftwosmallcolumns}width:600px;
  530.     margin-left:475px;{/block:iftwosmallcolumns}
  531.     {block:ifthreesmalltwolargecolumns}width:900px;
  532.     margin-left:475px;{/block:ifthreesmalltwolargecolumns}
  533. }
  534.  
  535. .posts{
  536.     {block:ifsmallposts}{block:indexpage}width:250px;{/block:indexpage}
  537.     {block:permalinkpage}width:400px;{/block:permalinkpage}{/block:ifsmallposts}
  538.     {block:ifnotsmallposts}width:400px;{/block:ifnotsmallposts}
  539.     padding:10px;
  540.     margin-bottom:10px;
  541.     margin-right:10px;
  542.     background-color:{color:post};
  543.     opacity:0.9;
  544.     -webkit-transition: all 0.5s linear;
  545.     -moz-transition: all 0.5s linear;
  546.     -o-transition: all 0.5s linear;
  547.     z-index:1;
  548.     {block:ifroundedposts}border-radius:15px;{/block:ifroundedposts}
  549.     {block:ifpostshadow}box-shadow: 0px 0px 5px #888888;{/block:ifpostshadow}
  550. }
  551.  
  552. .posts:hover{
  553.     opacity:1;
  554. }
  555.  
  556. .posts img{
  557.     border:none;
  558.     -webkit-transition: all 0.5s linear;
  559.     -moz-transition: all 0.5s linear;
  560.     -o-transition: all 0.5s linear;
  561.     {block:ifpostshadow}box-shadow: 0px 0px 5px #888888;{/block:ifpostshadow}
  562.     {block:ifroundedposts}border-radius:10px;{/block:ifroundedposts}
  563. }
  564.  
  565. .posts iframe{
  566.     -webkit-transition: all 0.5s linear;
  567.     -moz-transition: all 0.5s linear;
  568.     -o-transition: all 0.5s linear;
  569.     {block:ifroundedposts}border-radius:10px;{/block:ifroundedposts}
  570. }
  571.  
  572. #date{
  573.    display:block;
  574.     position:absolute;
  575.     z-index: 999;
  576.     min-width:135px;
  577.     height:auto;
  578.     background-color:{color:datelink};
  579.     {block:indexpage}bottom:0;{/block:indexpage}
  580.     {block:permalinkpage}margin-top:10px;{/block:permalinkpage}
  581.    
  582.     {block:ifsmallposts}{block:permalinkpage}margin-left:-100px;
  583.     {/block:permalinkpage}
  584.    
  585.     {block:indexpage}margin-left:100px;
  586.      {/block:indexpage}{/block:ifsmallposts}
  587.    
  588.     {block:ifnotsmallposts}margin-left:-100px;
  589.    {/block:ifnotsmallposts}
  590.    
  591.     padding:5px;
  592.     font-family:monospace;
  593.     font-size:9px;
  594.     -webkit-transition: all 0.5s linear;
  595.     -moz-transition: all 0.5s linear;
  596.     -o-transition: all 0.5s linear;
  597.     opacity:0;
  598.     {block:ifsmallposts}{block:permalinkpage}text-align:right;{/block:permalinkpage}{block:indexpage}text-align:center;{/block:indexpage}{/block:ifsmallposts}
  599.     {block:ifnotsmallposts}text-align:right;{/block:ifnotsmallposts}
  600.     {block:ifroundedpermalink}border-radius:100px;{/block:ifroundedpermalink}
  601.     {block:ifpermalinkborder}border: 2px solid {color:dateborders};{/block:ifpermalinkborder}
  602. }
  603.  
  604. #notes{
  605.     display:block;
  606.     position:absolute;
  607.     z-index: 999;
  608.     min-width:25px;
  609.     height:auto;
  610.     background-color:{color:datelink};
  611.    
  612.     {block:ifsmallposts}{block:permalinkpage}display:none;
  613.     {/block:permalinkpage}
  614.    
  615.     {block:indexpage}margin-left:10px;
  616.      {/block:indexpage}{/block:ifsmallposts}
  617.    
  618.     {block:ifnotsmallposts}{block:indexpage}margin-left:-100px;
  619.     {/block:indexpage}
  620.     {block:permalinkpage}display:none;
  621.     {/block:permalinkpage}
  622.    {/block:ifnotsmallposts}
  623.    
  624.     padding:5px;
  625.     font-family:monospace;
  626.     font-size:9px;
  627.     -webkit-transition: all 0.5s linear;
  628.     -moz-transition: all 0.5s linear;
  629.     -o-transition: all 0.5s linear;
  630.     opacity:0;
  631.     {block:ifsmallposts}{block:permalinkpage}text-align:right;{/block:permalinkpage}{block:indexpage}text-align:center;{/block:indexpage}{/block:ifsmallposts}
  632.     {block:ifnotsmallposts}text-align:right;{/block:ifnotsmallposts}
  633.     {block:ifroundedpermalink}border-radius:100px;{/block:ifroundedpermalink}
  634.     {block:ifpermalinkborder}border: 2px solid {color:dateborders};{/block:ifpermalinkborder}
  635.  
  636. }
  637.  
  638. .posts:hover #notes{
  639.      {block:ifsmallposts}{block:indexpage}margin-top:10px;{/block:indexpage}{/block:ifsmallposts}
  640.       {block:ifnotsmallposts}margin-left:10px;{/block:ifnotsmallposts}
  641.      
  642.     opacity:0.8;
  643.      {block:ifpostshadow}box-shadow: 0px 0px 5px #888888;{/block:ifpostshadow}
  644. }
  645.  
  646. .posts:hover #date{
  647.      {block:ifsmallposts}{block:indexpage}bottom:0;{/block:indexpage}{block:permalinkpage}margin-left:10px;{/block:permalinkpage}{/block:ifsmallposts}
  648.       {block:ifnotsmallposts}margin-left:10px;{/block:ifnotsmallposts}
  649.      
  650.     opacity:0.8;
  651.      {block:ifpostshadow}box-shadow: 0px 0px 5px #888888;{/block:ifpostshadow}
  652. }
  653.  
  654. #tags{
  655.     display:block;
  656.     position:absolute;
  657.     z-index:999;
  658.     width:65px;
  659.     height:auto;
  660.     background-color:{color:permalink};
  661.     margin-top: 30px;
  662.     padding:5px;
  663.     margin-left:420px;
  664.     font-family:monospace;
  665.     font-size:9px;
  666.     opacity:0;
  667.     -webkit-transition: all 0.7s linear;
  668.     -moz-transition: all 0.7s linear;
  669.     -o-transition: all 0.7s linear;
  670.     {block:ifpermalinkborder}border: 2px solid {color:tagborders};{/block:ifpermalinkborder}
  671.     {block:ifpostshadow}box-shadow: 0px 0px 3px #888888;{/block:ifpostshadow}    
  672.     {block:ifroundedpermalink}border-radius:10px;{/block:ifroundedpermalink}
  673. }
  674.  
  675. .posts:hover #tags{
  676.     opacity:0.7;
  677. }
  678.  
  679.  
  680. #quote {
  681.     font-family: 'Wire One', sans-serif;
  682.     font-size:25px;
  683.     color:{color:quote};
  684.     padding-left:20px;
  685.     padding-right:20px;
  686.     padding-top:10px;
  687.     line-height:18px;
  688.     text-align:justify;
  689. }
  690.  
  691. #title {
  692.     font-family: 'Wire One', sans-serif;
  693.     font-size:28px;
  694.     color:{color:quote};
  695.     padding-left:20px;
  696.     padding-right:20px;
  697.     line-height:18px;
  698. }
  699.  
  700. #audioplayer {
  701.     width:30px;
  702.     height:30px;
  703.     overflow:hidden;
  704.     position:absolute;
  705.     margin-top:40px;
  706.     margin-left:35px;
  707.     margin-bottom:45px;
  708.     border-radius:100px;
  709. }
  710.  
  711. #musicinfo{
  712.     color:{color:text};
  713.     margin-top:-80px;
  714.     margin-left:110px;
  715.     border-left:2px solid {color:dateborders};
  716.     padding-left:10px;
  717.     line-height:10px;
  718.     margin-bottom:50px;
  719. }
  720.  
  721. #musicinfotitles{
  722.     font-style:bold;
  723. }
  724.  
  725. #audiocaption{
  726.     {block:ifnotsmallposts}margin-top:45px;{/block:ifnotsmallposts}
  727.     {block:ifsmallposts}{block:indexpage}margin-top:5px;{/block:indexpage}{block:permalinkpage}margin-top:45px;{/block:permalinkpage}{/block:ifsmallposts}
  728.     padding-left:10px;
  729.     padding-right:10px;
  730.     padding-top:10px;
  731. }
  732.  
  733. #albumart{
  734.     height:100px;
  735.     width:100px;
  736.     background-image:url('https://lh3.googleusercontent.com/-ABbl71o4DHE/UZh6Xuh6QJI/AAAAAAAAEn8/j49R7fSCZHE/s200-no/Untitled-1.jpg');
  737.     background-position:fixed;
  738.     background-size:100px 100px;
  739.     background-repeat:no-repeat;
  740.     z-index:-1;
  741.     -webkit-transition: all 0.5s linear;
  742.     -moz-transition: all 0.5s linear;
  743.     -o-transition: all 0.5s linear;
  744. }
  745.  
  746. #askz {
  747.     padding: 5px;
  748.     margin-left:10px;
  749.     margin-right:10px;
  750.     margin-top:5px;
  751.     padding-bottom: 15px;
  752.     line-height: 140%;
  753.     border-bottom: 1px solid {color:text};
  754.     color:{color:question};
  755. }
  756.  
  757.  
  758. .askicon {
  759.     float: left;
  760.     border: 2px solid {color:dateborders};
  761.     margin-right: 3px;
  762.     margin-left: -5px;
  763. }
  764.  
  765. #answer {
  766.     padding: 4px;
  767.     text-align: left;
  768.     color:{color:text};
  769.     margin-left:30px;
  770. }
  771.  
  772. #qask{
  773.     padding-top:10px;
  774.     padding-left:10px;
  775.     font-size:9px;
  776.     font-style:italic;
  777. }
  778.  
  779.  
  780. .grayscale {
  781.   -webkit-filter: grayscale(100%);
  782.   -moz-filter: grayscale(100%);
  783.   -ms-filter: grayscale(100%);
  784.   -o-filter: grayscale(100%);
  785.  
  786.  
  787. }
  788.  
  789. .posts:hover .grayscale{
  790.     -webkit-filter: grayscale(0%);
  791.   -moz-filter: grayscale(0%);
  792.   -ms-filter: grayscale(0%);
  793.   -o-filter: grayscale(0%);
  794. }
  795.  
  796. ol.notes{
  797.     max-width:400px;
  798.     padding:0px;
  799.     margin: 0px 15px;
  800.     list-style-type:none;
  801.     font-size:8 px;
  802. }
  803.  
  804. ol.notes li.note{
  805.     padding:0px;
  806.     font-size:8px;
  807. }
  808.  
  809. ol.notes li.note img{
  810.     margin-top:7px;
  811.     {block:ifpostshadow}box-shadow: 0px 0px 5px #888888;{/block:ifpostshadow}
  812. }
  813.  
  814. ol.notes li.note img.avatar{
  815.  
  816.     margin-right:3px;
  817.     width:16px;
  818.     height:16px;
  819.     border-radius:100px;
  820. }
  821.  
  822. ol.notes li.note a img.avatar{
  823.     padding:0px;
  824.     border-width:0 px;
  825.     border:none;
  826. }
  827.  
  828. ol.notes li.note img{
  829.     padding:0 px;
  830.     border-width:0 px;
  831.     border:none;
  832. }
  833.  
  834. ol.notes li.note span.action{
  835.     color:{color:text};
  836. }
  837.  
  838. ol.notes li.note.answer_content{
  839.     font-weight:normal;
  840. }
  841.  
  842. ol.notes li.note.blockquote{
  843.     padding:1 px 1 px;margin:1px 0px 0px 1px;
  844. }
  845.  
  846. ol.notes li.note.blockquote a{
  847.     text-decoration:none;
  848. }
  849.  
  850. .pagination {
  851.     {block:ifinfinitescroll}display:none;{/block:ifinfinitescroll}
  852.     {block:ifnotinfinitescroll}
  853.     position:fixed;
  854.     margin-top:550px;
  855.     opacity:1;
  856.     width:100px;
  857.     margin-left:0px;
  858.     height:80px;
  859.     font-family:"tinytots";
  860.     font-size:50px;
  861.     text-align:center;
  862.     {/block:ifnotinfinitescroll}
  863.     -webkit-transition: all 0.5s linear;
  864.     -moz-transition: all 0.5s linear;
  865.     -o-transition: all 0.5s linear;
  866.     -ms-transition: all 0.5s linear;
  867.     opacity:0;
  868.     z-index:-1;
  869. }
  870.  
  871. #sidebar:hover .pagination{
  872.     opacity:1;
  873.     margin-top:500px;
  874.     margin-left:15px;
  875. }
  876.  
  877. .my-like {
  878. font-size:10px !important;
  879. display:inline-block;
  880. -webkit-transition: all 0.5s linear;
  881.     -moz-transition: all 0.5s linear;
  882.     -o-transition: all 0.5s linear;
  883.     -ms-transition: all 0.5s linear;
  884.  
  885. }
  886.  
  887. .my-liked, .my-like:hover {
  888. font-size:10px !important;
  889. display:inline-block;
  890. }
  891.  
  892.  
  893. {CustomCSS}
  894.    
  895. #nothing{}
  896.    
  897.     /* Start http://www.cursors-4u.com */ a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth661.cur), progress !important;} /* End http://www.cursors-4u.com */
  898.    
  899.     /* Start http://www.cursors-4u.com */ body {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;} /* End http://www.cursors-4u.com */
  900.    
  901. </style>
  902.  
  903.    {block:IndexPage}<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  904.  
  905. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  906.  
  907. <script>
  908. $(function(){
  909. var $container = $('#postmargin');
  910. $container.imagesLoaded(function(){
  911. $container.masonry({
  912. itemSelector: '.posts',
  913. });
  914. });
  915. $container.infinitescroll({
  916. itemSelector : ".posts",
  917. navSelector : "div.pagination",
  918. {block:ifinfinitescroll}nextSelector : ".pagination a#next",{/block:ifinfinitescroll}
  919. {block:ifnotinfinitescroll}nextSelector : "none",{/block:ifnotinfinitescroll}
  920. loadingImg : "",
  921. loadingText : "<em>patience is a virtue, so hold on while i load</em>",
  922. bufferPx : 10000,
  923. extraScrollPx: 12000,
  924. },
  925. function( newElements ) {
  926.   var $newElems = $( newElements ).css({ opacity: 0 });
  927. $newElems.imagesLoaded(function(){
  928. $newElems.animate({ opacity: 1 });
  929. $container.masonry( 'appended', $newElems, true );
  930. });
  931. }
  932. );
  933. });
  934. </script>{/block:IndexPage}
  935.  
  936. <script>
  937. window.onload = function () {
  938. document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>' );
  939. document.addEventListener( 'click', function ( event ) {
  940.     var myLike = event.target;
  941.     if( myLike.className.indexOf( 'my-like' ) > -1 ) {
  942.         var frame = document.getElementById( 'my-like-frame' ),
  943.             liked = ( myLike.className == 'my-liked' ),
  944.             command = liked ? 'unlike' : 'like',
  945.             reblog = myLike.getAttribute( 'data-reblog' ),
  946.             id = myLike.getAttribute( 'data-id' ),
  947.             oauth = reblog.slice( -8 );
  948.         frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id;
  949.         liked ? myLike.className = 'my-like' : myLike.className = 'my-liked';
  950.     };
  951. }, false );
  952. };
  953. </script>
  954.  
  955. </head><body>
  956.  
  957. <div id="main">{title}</div>
  958.  
  959. <div id="sidebar">
  960.     <div id="triangle1"></div>
  961.     <div id="desc">{description}</div>
  962.     <div id="small">{text:subtitle}</div>
  963.     <div id="nav"><div id="parceiros">
  964.         <a href="/" class="nav">home</a>
  965.         <a href="/ask" class="nav">message</a>
  966.         <a href="/archive" class="nav">archive</a>
  967.         <a href="http://redfox-themes.tumblr.com/" class="nav">theme</a>
  968.     </div></div>
  969.    {block:IfLink1}<div id="custom">
  970.    <div class="nav">links</div>
  971.     <a href="{text:Link1URL}" class="custom">{text:Link1}</a>{/block:IfLink1}
  972.     {block:IfLink2}<a href="{text:Link2URL}" class="custom">{text:Link2}</a>{/block:IfLink2}
  973.     {block:IfLink3}<a href="{text:Link3URL}" class="custom">{text:Link3}</a>{/block:IfLink3}
  974.     {block:IfLink4}<a href="{text:Link4URL}" class="custom">{text:Link4}</a>{/block:IfLink4}
  975.     {block:IfLink5}<a href="{text:Link5URL}" class="custom">{text:Link5}</a>{/block:IfLink5}
  976.     {block:IfLink6}<a href="{text:Link6URL}" class="custom">{text:Link6}</a>{/block:IfLink6}
  977.     {block:IfLink7}<a href="{text:Link7URL}" class="custom">{text:Link7}</a>{/block:IfLink7}
  978.     {block:IfLink8}<a href="{text:Link8URL}" class="custom">{text:Link8}</a>{/block:IfLink8}
  979.     {block:IfLink9}<a href="{text:Link9URL}" class="custom">{text:Link9}</a>{/block:IfLink9}
  980.     </div>
  981.    
  982. {block:ifnotinfinitescroll}
  983. <div class="pagination">{block:Pagination}<div id="pagination">
  984. {block:PreviousPage}<a href="{PreviousPage}">&#171;</a>{/block:PreviousPage}
  985. {block:NextPage}<a href="{NextPage}">&#187;</a>{/block:NextPage}
  986. </div>{/block:Pagination}
  987. </div>{/block:ifnotinfinitescroll}
  988.    
  989. </div>
  990.  
  991. <div id="bar1"></div>
  992. <div id="music">
  993.     <img src="https://lh6.googleusercontent.com/-duv2vfAcZDQ/ULmePhXuKrI/AAAAAAAAClI/LD475ogBqag/s14/tumblr_m7w2py1dEP1r6o8v2.gif" id="player">
  994.     <div id="billy">
  995.    
  996.     {text:PLAYERCODE}
  997.        
  998.     </div>
  999. </div>
  1000.  
  1001. <img src="{image:standalone}" id="sideimage"/>
  1002.  
  1003.  
  1004. <div id="postmargin">{block:Posts}<div class="posts">
  1005.  
  1006. {block:Date}
  1007. <div id="notes"><a href="{Permalink}">{notecount}</a></div>
  1008. <div id="date">
  1009. <a href="{Permalink}">{ShortMonth}{DayOfMonth},{ShortYear}</a>|<a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a> [<a href="{ReblogURL}">Reblog</a>] <div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like this post">&hearts;</div> </div>{/block:Date}
  1010.  
  1011.  
  1012. {block:permalinkpage}<div id="tags">{block:NoteCount}{block:RebloggedFrom}<a href="{ReblogRootURL}">origin</a> &#8727; <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}{/block:NoteCount}
  1013. <br><br>
  1014. {block:NoteCount}<a href="{Permalink}"> {NoteCountWithLabel}</a> {/block:NoteCount}
  1015. <br><br>
  1016. {block:HasTags}{block:Tags}x<a href="/tagged/{Tag}">{Tag} </a> {/block:Tags}{/block:HasTags}</div>{block:permalinkpage}
  1017.  
  1018. {block:Text}<center><div id="title">{block:Title}{Title}{/block:Title}</div></center>{Body}{/block:Text}
  1019.  
  1020. {Block:IfMonochromePosts}{block:Photo}<center>{LinkOpenTag}{block:ifnotsmallposts}<img src="{PhotoURL-500}" class="grayscale" width="400">{/block:ifnotsmallposts}{block:ifsmallposts}{block:indexpage}<img src="{PhotoURL-500}" class="grayscale" width="250">{/block:indexpage}{block:permalinkpage}<img src="{PhotoURL-500}" class="grayscale" width="400">{/block:permalinkpage}{/block:ifsmallposts}{LinkCloseTag}</center>{Block:IfShowDescriptions}{block:Caption}{Caption}{/block:Caption}{/Block:IfShowDescriptions}{/block:Photo}{/Block:IfMonochromePosts}
  1021.  
  1022. {Block:IfNotMonochromePosts}{block:Photo}<center>{LinkOpenTag}{block:ifnotsmallposts}<img src="{PhotoURL-500}" width="400">{/block:ifnotsmallposts}{block:ifsmallposts}{block:indexpage}<img src="{PhotoURL-500}" width="250">{/block:indexpage}{block:permalinkpage}<img src="{PhotoURL-500}" width="400">{/block:permalinkpage}{/block:ifsmallposts}{LinkCloseTag}</center>{Block:IfShowDescriptions}{block:Caption}{Caption}{/block:Caption}{/Block:IfShowDescriptions}{/block:Photo}{/Block:IfNotMonochromePosts}
  1023.  
  1024. {Block:IfMonochromePosts}<div class="grayscale"><div align="center">{block:Photoset}{block:ifnotsmallposts}{Photoset-400}{/block:ifnotsmallposts}{block:ifsmallposts}{block:IndexPage}{Photoset-250}{/block:IndexPage}{block:PermalinkPage}{Photoset-400}{/block:PermalinkPage}{/block:ifsmallposts}{Block:IfShowDescriptions}{block:Caption}{Caption}{/block:Caption}{/Block:IfShowDescriptions}{/block:Photoset}</div></div>{/Block:IfMonochromePosts}
  1025.  
  1026. {Block:IfNotMonochromePosts}<div align="center">{block:Photoset}{block:ifnotsmallposts}{Photoset-400}{/block:ifnotsmallposts}{block:ifsmallposts}{block:IndexPage}{Photoset-250}{/block:IndexPage}{block:PermalinkPage}{Photoset-400}{/block:PermalinkPage}{/block:ifsmallposts}{Block:IfShowDescriptions}{block:Caption}{Caption}{/block:Caption}{/Block:IfShowDescriptions}{/block:Photoset}</div>{/Block:IfNotMonochromePosts}
  1027.  
  1028. {block:Quote}<div id="quote">{Quote}</div><p align="right">{block:Source}—{Source}{/block:Source}</p>{/block:Quote}
  1029.  
  1030. {block:Link}<div id="title" align="center"><t><a href="{URL}" {Target}>{Name}</a></t></div>{block:Description}{Description}{/block:Description}{/block:Link}
  1031.  
  1032. {block:Chat}<div id="title" align="center">{block:Title}<t>{Title}</t>{/block:Title}</div><p>{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}</p>{/block:Chat}
  1033.  
  1034. {block:Audio}
  1035. <div id="audioplayer">{AudioPlayerWhite} </div>      
  1036. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
  1037. <div id="musicinfo">
  1038. <b>Song:</b> {block:TrackName}{TrackName}{/block:TrackName}<br/>
  1039. <b>Artist:</b> {block:Artist}{Artist}{/block:Artist}<br/>
  1040. <b>Album:</b> {block:Album}{Album}{/block:Album}
  1041. </div>{Block:IfShowDescriptions}
  1042. {block:caption}<div id="audiocaption">{caption}</div>{/block:caption}{/Block:IfShowDescriptions}
  1043. {/block:Audio}
  1044.  
  1045. {block:Video}{block:ifnotsmallposts}{Video-400}{/block:ifnotsmallposts}{block:ifsmallposts}{block:IndexPage}{Video-250}{/block:IndexPage}{block:PermalinkPage}{Video-400}{/block:PermalinkPage}{/block:ifsmallposts}{Block:IfShowDescriptions}{block:Caption}{Caption}{/block:Caption}{/Block:IfShowDescriptions}{/block:Video}
  1046.  
  1047. {block:Answer}
  1048. <div id="askz"><img src="{AskerPortraitURL-30}" class="askicon"><div id="qask">{Asker} said—</div><br>{Question}</div>
  1049. <div id="answer">{Answer}</div>
  1050. {/block:Answer}
  1051.  
  1052.  
  1053. </div>
  1054.  
  1055. <div class="notes">{block:PostNotes}<a name="notes">{PostNotes}</a>{/block:PostNotes}</div>
  1056.  
  1057. {/block:Posts}</div>
  1058.  
  1059. {block:ifinfinitescroll}<div class="pagination">
  1060. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  1061. </div>{/block:ifinfinitescroll}
  1062.  
  1063. </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!