Advertisement
puellae-themes

Black Theme

Dec 2nd, 2012
168
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 29.28 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <!--                
  5.  
  6.                          Black Theme by
  7.  
  8.         _   __            ___  _             __  ___
  9.        / \ |  \|    ||   |    | \     |     /   |
  10.       |   ||  ||    ||   |    |  \    |    /    |
  11.       |   ||__/|    ||   |___ |   \   |---|     |___
  12.       \   /|   |    ||   |    |    \  |    \    |
  13.        \_/ |    \__/ |___|___ |     \_|     \__ |___
  14.      
  15.      
  16.      
  17. Please don't remove the credit. I worked very hard on this.
  18.  
  19.  
  20. If you don't have any html skills I wouldn't suggest you to use this theme because you have pretty much to edit in the html code not in the appearance page.
  21. I will work on this. If you have questions just send me a message and I will help you. Please leave the credit & enjoy your new theme :)xx
  22.  
  23.  
  24. -->
  25.  
  26. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  27. <head>
  28. <script language=”javaScript” type=text/javascript”src="http://www.onlineleaf.com/savetheenvironment.js?time=120”></script>
  29.  
  30.  
  31. <meta name="color:link" content="#77003c"/>
  32. <meta name="color:hover" content="#b4025c"/>
  33. <meta name="color:blockquote" content="#efefef"/>
  34. <meta name="color:background" content="#efefef"/>
  35. <meta name="color:posts" content="#ffffff"/>
  36. <meta name="image:background image" content="0"/>
  37. <meta name="if:thin title font" content="1"/>
  38. <meta name="if:shadow" content="0"/>
  39. <meta name="if:rounded corners" content="0"/>
  40. <meta name="if:pixel font" content="0">
  41. <meta name="if:custom cursor" content="1">
  42. <meta name="if:custom scrollbar" content="1">
  43.  
  44.  
  45.  
  46.  
  47.  
  48. <title>{Title}</title>
  49. <link rel="shortcut icon" href="{Favicon}">
  50. {block:Description}
  51.  
  52. {/block:Description}
  53. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  54. <!--[if IE]>
  55.        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  56.    <![endif]-->
  57.  
  58.     <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/fxpo5zq/XZum5p9k0/standard.css">
  59.  
  60. <style type="text/css">
  61.  
  62. #tumblr_controls{
  63. position:fixed !important;
  64. -webkit-filter: invert(100%)
  65. }
  66.  
  67. img{
  68. -webkit-transition: opacity 4.0s linear;
  69. opacity: 0.10;
  70. }
  71. img:hover{
  72. -webkit-transition: opacity 4.0s linear;
  73. opacity: 6;
  74. }
  75.  
  76.  
  77. #networks {
  78. position:fixed;
  79. left:-200px;
  80. width:350px;
  81. top:500px;
  82. z-index:1000000000000000000000000;
  83. -webkit-transition:0.5s linear;
  84. -moz-transition:0.5s linear;
  85. -o-transition:0.5s linear;
  86. -ms-transition:0.5s linear;
  87. transition:0.5s linear;
  88. }
  89. #networks:hover {
  90. left:20px;
  91. }
  92. #networks img {
  93. margin-right:10px;    
  94. -webkit-transition: all 0.5s ease-in-out;
  95. -moz-transition: all 0.5s ease-in-out;
  96. -ms-transition: all 0.5s ease-in-out;
  97. -o-transition: all 0.5s ease-in-out;
  98. transition: all 0.5s ease-in-out;
  99. opacity:0.8;
  100. }
  101. #networks img:hover {
  102. opacity:1;
  103. }
  104.  
  105.  
  106.  
  107. img{
  108. -webkit-transition: opacity 5.0s linear;
  109. opacity: 0.6;
  110. }
  111. img:hover{
  112. -webkit-transition: opacity 1.0s linear;
  113. opacity: 1;
  114. }
  115.  
  116.  
  117. ::selection {
  118. background: #419145;
  119. color: #ffffff;
  120. }
  121.  
  122. ::-moz-selection {
  123. background: #419145;
  124. color: #ffffff;
  125. }
  126.  
  127.  
  128. @font-face { font-family: pixie; src: url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf'); }
  129.  
  130. {block:ifnotthintitlefont}
  131. @font-face {font-family: customfont; src: url('http://static.tumblr.com/fxpo5zq/oOim5vst9/quicksand_book.otf');
  132. }
  133. {block:ifnotthintitlefont}
  134.  
  135. {block:ifthintitlefont}
  136. @font-face {font-family: customfont; src: url('http://static.tumblr.com/fxpo5zq/ad0m5vybr/quicksand_light.otf');
  137. }
  138. {/block:ifthintitlefont}
  139.  
  140. html, body, {
  141.      {block:ifpixelfont}
  142.     font-family: pixie;
  143.     font-size: 8px;
  144.     letter-spacing:-1px;
  145.     {/block:ifpixelfont}
  146.  
  147.     {block:ifnotpixelfont}
  148.     font-family: helvetica;
  149.     font-size: 9px;
  150.     {/block:ifnotpixelfont}
  151. }
  152. body {
  153.     color: #777;
  154.     background:{color:background} url({image:background image});
  155.     line-height:150%;
  156.    {block:ifpixelfont}
  157.     font-family: pixie;
  158.     font-size: 8px;
  159.     letter-spacing:-1px;
  160.     {/block:ifpixelfont}
  161.  
  162.     {block:ifnotpixelfont}
  163.     font-family: helvetica;
  164.     font-size: 9px;
  165.     {/block:ifnotpixelfont}
  166. }
  167.  
  168.  
  169. {if:customscrollbar}
  170.  
  171. ::-webkit-scrollbar-thumb:vertical {
  172. background-color:{color:Link};
  173. height:auto;-webkit-border-radius:20px;
  174. }
  175.  
  176. ::-webkit-scrollbar-thumb:horizontal {
  177. background-color:{color:Link};
  178. height:6px !important;-webkit-border-radius:20px;
  179. }
  180.  
  181. ::-webkit-scrollbar {
  182. height:6px;
  183. width:6px;
  184. background-color:{color:Background};
  185. -webkit-border-radius:20px;
  186. }
  187.  
  188. {/if:customscrollbar}
  189.  
  190.    #infscr-loading {
  191.        position: absolute;
  192.        bottom: 0;
  193.        left: 25%;
  194.    }
  195. a:link, a:active, a:visited{
  196.  
  197.   color:{color:Link};
  198.    text-decoration: none;
  199.  
  200. }
  201. a:hover {
  202.    color:{color:Hover};
  203.  
  204.    text-decoration: none;
  205.    }
  206.    
  207. #content {
  208.     {block:indexpage}
  209.     width: 768px;
  210.     {/block:indexpage}
  211.    
  212.     {block:permalinkpage}
  213.     width: 506px;    
  214.     {/block:permalinkpage}
  215.     float: left;
  216.     background: {color:posts}
  217. }
  218.  
  219. #note3 {
  220.     width: 500px;
  221.     text-align:left;
  222.     }
  223.    
  224. #contain {
  225.     {block:indexpage}
  226.      width: 1040px;
  227.     {/block:indexpage}
  228.    
  229.     {block:permalinkpage}
  230.     width: 700px;    
  231.     {/block:permalinkpage}
  232.    
  233.     height:100%;
  234.     padding-left:10px;
  235.     padding-right:10px;
  236.     margin: 0px auto;
  237.     position: relative;
  238. }
  239.  
  240. ol.notes img {
  241. width: 16px;
  242. display: inline;
  243. position: relative;
  244. top: 3px;
  245. }
  246.        
  247. #sidebar {
  248. height:100%;
  249. width: 100px;
  250. position: fixed;
  251. background:{color:posts};
  252. padding: 2px;
  253.  
  254. {block:indexpage}
  255.     margin-left: 768px;
  256. {/block:indexpage}
  257.  
  258. {block:permalinkpage}
  259.     margin-left: 505px;
  260. {/block:permalinkpage}
  261. }
  262.  
  263. ol.notes img {
  264. width: 16px;
  265. display: inline;
  266. position: relative;
  267. top: 3px;
  268. }
  269.  
  270. #sidebar img {
  271. {block:ifroundedcorners}-moz-border-radius: 5px;
  272. border-radius: 5px;
  273. {block:ifroundedcorners}
  274. display: block;
  275. margin-bottom: 1px;
  276. }
  277. .entry {
  278. {block:ifroundedcorners}-moz-border-radius: 5px;
  279. border-radius: 5px;
  280. {/block:ifroundedcorners}  
  281.     float: right;
  282.   {block:indexpage}
  283.  
  284.     width: 250px;
  285.     margin: 3px;
  286.     {/block:indexpage}
  287.     {block:permalinkpage}
  288.     width: 500px;
  289.     margin: 3px;    
  290.     {/block:permalinkpage}
  291.     display: block;
  292.     background:{color:posts};
  293.             {block:ifshadow}
  294.      box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.06);
  295.     -moz-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.06);
  296.     -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.06);
  297.     {/block:ifshadow}
  298.     position: relative;
  299.     }
  300. .entry img {
  301. {block:ifroundedcorners}-moz-border-radius: 5px;
  302. border-radius: 5px;
  303. {block:ifroundedcorners}
  304.     display: block;
  305.     max-width: 100%;
  306.     {block:iffadedimages}
  307.     opacity:0.8;
  308.     filter:alpha(opacity=80);
  309.     -webkit-transition: all ease-in 250ms;
  310.     -moz-transition: all ease-in 250ms;
  311.     -o-transition: all ease-in 250ms;
  312.     -ms-transition: all ease-in 250ms;
  313.     transition: all ease-in 250ms;
  314.     {/block:iffadedimages}
  315. }
  316. .entry:hover img {
  317.     {block:iffadedimages}
  318.     opacity:1;
  319.     filter:alpha(opacity=100);
  320.     -webkit-transition: all ease-in 250ms;
  321.     -moz-transition: all ease-in 250ms;
  322.     -o-transition: all ease-in 250ms;
  323.     -ms-transition: all ease-in 250ms;
  324.     transition: all ease-in 250ms;
  325.     {/block:iffadedimages}
  326. }
  327.  
  328.  
  329. .entry:hover .details {
  330. opacity: 1.0;
  331. margin:12px 0px 0px 0px;
  332. filter: alpha(opacity = 100);
  333. -webkit-transition: all .25s ease-in-out;
  334. -moz-transition: all .25s ease-in-out;
  335. -o-transition: all .25s ease-in-out;
  336. transition: all .25s ease-in-out;
  337. }
  338.  
  339.  
  340. #pagination{
  341.     display:none;
  342. }
  343.  
  344.  
  345.  
  346.  
  347.  
  348. iframe#tumblr_controls {
  349.     right:3px !important;
  350.     position: fixed !important;
  351.     -webkit-transition: opacity 0.7s linear;
  352.     opacity: 0.5;
  353.     -webkit-transition: all 0.8s ease-out;
  354.     -moz-transition: all 0.8s ease-out;
  355.     transition: all 0.8s ease-out;
  356. }
  357.  
  358. iframe#tumblr_controls:hover {
  359.     -webkit-transition: opacity 0.7s linear;
  360.     opacity: 1;
  361.     -webkit-transition: all 0.4s ease-out;
  362.     -moz-transition: all 0.4s ease-out;
  363.     transition: all 0.4s ease-out;
  364. }
  365.  
  366.  .permalink2 {
  367. color: #000000;
  368. padding-top: 0px;
  369. padding-bottom: 0px;
  370. font-size: 10px;
  371. text-align: center;
  372.     opacity: 0;
  373.     filter: alpha(opacity = 0);
  374.     -webkit-transition: all ease-in 250ms;
  375.     -moz-transition: all ease-in 250ms;
  376.     -o-transition: all ease-in 250ms;
  377.     -ms-transition: all ease-in 250ms;
  378.     transition: all ease-in 250ms;
  379.    
  380. }
  381.  
  382. blockquote {
  383. padding-left:5px;padding-top:7px;
  384. padding-right:5px;padding-bottom:7px;
  385. margin-left:5px; margin-right:5px;
  386. border-left: 0px solid #ccc;
  387. border-right: 0px solid #ccc;
  388. background-color:{color:blockquote};
  389. }
  390.  
  391. #cole{
  392. padding-right:5px;
  393. color:{color:Link};
  394.  
  395. }
  396.  
  397. #cole a {
  398. padding-right:5px;
  399. display:relative;
  400. max-width:400px;
  401. text-align:left;
  402. color:{color:Link};
  403. }
  404.  
  405. #cole .mohr {
  406. padding-left:10px;
  407. margin-top:-10px;
  408. filter: alpha(opacity = 0);
  409. opacity:0;
  410. -webkit-transition: all 1s ease-out;
  411. -moz-transition: all 1s ease-out;transition: all 1s ease-out;
  412. text-align:left;text-transform:lowercase;
  413. }
  414.  
  415. #cole:hover .mohr {
  416. margin-top:5px;
  417. padding-left:10px;
  418. -webkit-transition: all 1s ease-out;
  419. -moz-transition: all 1s ease-out;transition: all 1s ease-out;
  420. filter: alpha(opacity = 80);
  421. filter: alpha(opacity = 100);
  422. opacity:100;
  423. }
  424.  
  425.  
  426.  
  427.  
  428. li.drawer a {
  429.     margin: 0px 5px;}
  430.    
  431. .label {
  432.       text-transform:lowercase;
  433.       color:{color:Link}
  434.       }
  435.    
  436. .question {
  437.       text-align:left;
  438.       padding-left:5px;padding-top:7px;
  439.       padding-right:5px;padding-bottom:7px;
  440.       border-left: 0px solid {color:Link};
  441.       border-right: 0px solid {color:Link};
  442.       background-color:{color:blockquote};
  443.       }
  444.  
  445. .answer {
  446.       text-align:left;
  447.       padding-left:5px;padding-top:7px;
  448.       padding-right:5px;padding-bottom:7px;
  449.       }  
  450.      
  451. .text {
  452.     padding: 10px;
  453. }
  454.  
  455. .entry:hover .permalink2 {
  456.     opacity: 1;
  457.     filter: alpha(opacity = 100);
  458.     -webkit-transition: all ease-in 250ms;
  459.     -moz-transition: all ease-in 250ms;
  460.     -o-transition: all ease-in 250ms;
  461.     -ms-transition: all ease-in 250ms;
  462.     transition: all ease-in 250ms;
  463. }
  464.  
  465. #pp {
  466.     text-align: center;
  467.     width: 100%;
  468.     padding-top: 2px;
  469. }
  470.  
  471.  
  472. .perma1
  473. {
  474.     opacity: 0.0;
  475.     filter: alpha(opacity = 0);
  476.     position:absolute;
  477.     z-index:9999991;  
  478.     bottom: 0px;
  479.     right: 7px;
  480. }
  481.  
  482. .entry:hover .perma1 {
  483.    
  484.     -webkit-transition: opacity 0.4s linear;
  485.     opacity: 1;
  486.     -moz-transition: all 0.4s linear;
  487.     transition: all 0.4s linear;
  488.     filter: alpha(opacity = 100);
  489.  
  490. }
  491.  
  492. .likep {
  493. width: 21px;
  494. height: 20px;
  495. overflow: hidden;
  496. z-index: 9999999;
  497. display: inline-block;
  498.  
  499. }
  500. .rep {
  501. width: 24px;
  502. height: 20px;
  503. overflow: hidden;
  504. z-index: 9999999;
  505. display: inline-block;
  506.  
  507. }    
  508. .likep a:hover {
  509. background-position: 0px 0px;
  510. }
  511. .likep a {
  512. background-image: url("http://static.tumblr.com/uiqhh9x/BPnlzww8v/like.png");
  513. background-position: 0px 0px;
  514. display: block;
  515. z-index: 9999999;
  516.    webkit-transition: all 0s linear;
  517. -webkit-transition: all 0s linear;
  518. -moz-transition: all 0s linear;
  519. transition: all 0s linear;
  520. }
  521. .likep img {
  522.     width: 21px;
  523.     height: 20px;
  524.        webkit-transition: all 0.2s linear;
  525. -webkit-transition: all 0.2s linear;
  526. -moz-transition: all 0.2s linear;
  527. transition: all 0.2s linear;
  528. }
  529. .rep img{
  530.     width: 24px;
  531.     height: 20px;
  532.     line-height: 30px;
  533.     display: inline;
  534. }
  535.  
  536. .not { display: inline-block;
  537. background: url("http://static.tumblr.com/uiqhh9x/X6Ym17xp2/middle.png");
  538. height: 20px;
  539. font-size: 11px;
  540. line-height: 20px;
  541. color: #fff;
  542. padding-left: 4px;
  543. padding-right: 4px;
  544. -moz-border-radius: 2px;
  545.     border-radius:  2px;
  546.     bottom: 6px;
  547. position: relative;
  548. letter-spacing:0px;
  549. }
  550. .not a{
  551. color: #fff;
  552. font-family: helvetica;
  553. }
  554.  
  555. .entry:hover .not, .entry:hover .rep, .entry:hover .likep {
  556.      opacity: 0.8;
  557.     filter: alpha(opacity = 80);
  558. }
  559. .not:hover , .rep:hover, .likep:hover {
  560.      opacity: 1!important;
  561.     filter: alpha(opacity = 100)!important;
  562. }
  563.  
  564. .permahover {
  565.     text-align: right;
  566.     line-height:200%;
  567.     opacity: 0.0;
  568.     filter: alpha(opacity = 0);
  569.     font-size: 9px;
  570.     line-height: 9px;
  571.     text-transform: lowercase;
  572.     }
  573.    
  574. .entry:hover .permahover {
  575.     text-align: center;
  576.     opacity: 1;
  577.     filter: alpha(opacity = 50);
  578.  
  579.    
  580.     }
  581.  
  582.  
  583. .b {display : block; font-size: 8px;text-align: left;line-height: 15px; text-indent : 0px; vertical-align : middle;  padding : 2px;
  584. padding-bottom : 0px;}
  585.  
  586.        
  587. #titulo {
  588.         text-transform:lowercase;
  589.         padding-bottom: 2px;
  590.         padding-left: 5px;
  591.         text-align: left;
  592.         font-family:customfont;
  593.         font-size: {text:Blog title size}px;
  594.         line-height: 110%;
  595.         color:{color:link};
  596.         }
  597.      
  598.         div.panel {
  599.                 width: 260px;
  600.       padding: 15px 20px;
  601.                 color: #333;
  602.                 text-align: center;
  603.                 line-height: 22px;
  604.                 display: none;
  605.            
  606.                 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#0d000000',GradientType=0 );
  607.         }
  608.         div.panel p {
  609.                 margin: 10px 0;
  610.         }
  611.         div.panel p a, div.textPost p a, div.audioPost p a {
  612.                 color: #333;
  613.                 text-decoration: none;
  614.                 border-bottom: 1px dotted;
  615.                 font-style: italic;
  616.                 font-weight: bold;
  617.         }
  618.  
  619. div.navigate a{
  620.  
  621. background: #ffffff; color: #419145; letter-spacing: 0px; display:block; padding:0px 0;
  622. border: 0px solid #000000;
  623. width: 180px; margin-top:1px; position:relative; -webkit-transition-duration: .0s; z-index:1;
  624. }
  625.  
  626.  
  627. div.navigate a:hover{
  628. font-weight: bold; letter-spacing: 1px; background: #ffffff}; display:block; padding:0px 0;
  629. border: 0px solid #000000; z-index:2;
  630. }
  631.    
  632.  
  633.  
  634. #sidebar{
  635. position:fixed !important;
  636. left:15px; padding-top:12px;
  637. top:35px;
  638. padding-bottom:12px;
  639. text-align:left;
  640. text-transform: lowercasehttp://static.tumblr.com/uiqhh9x/OAClzwwao/reblog.png;
  641. height:70px;
  642. width:10px;
  643. background-color:#fff;
  644. }
  645.  
  646. #box{
  647. height:auto;
  648. opacity:1.0;
  649. text-align:center;
  650. z-index:99999999999999999999;
  651. background:transparent;}
  652.  
  653.  
  654.  
  655. #cubehome a:link {
  656. color:#e64eb4;}
  657.  
  658. #links{
  659. border-radius: 10px;
  660. position:fixed !important;
  661. left:1000px; padding-top:12px;
  662. bottom:200px;
  663. padding-top:12px;
  664. text-align:center;
  665. height:10px;
  666. width:68px;
  667. overflow:hidden;
  668. -webkit-transition: opacity 0.7s linear;
  669. -webkit-transition: all 0.7s ease-in-out;
  670. -moz-transition: all 0.7s ease-in-out;
  671. -o-transition: all 0.7s ease-in-out;
  672. background:transparent;
  673. z-index:999999999;}
  674.  
  675. #links:hover{
  676. border-radius: 10px;
  677. border:0px solid #000;
  678. padding:5px;
  679. height:155px;
  680. width:200px;
  681. z-index:999999999;
  682. opacity: 0.8;
  683. background:#fff;}
  684.  
  685. #updates{
  686. border-radius: 10px;
  687. position:fixed;
  688. left:1000px; padding-top:12px;
  689. bottom:140px;
  690. padding-bottom:12px;
  691. text-align:center;
  692. height:15px;
  693. width:68px;
  694. overflow:hidden;
  695. -webkit-transition: opacity 0.7s linear;
  696. -webkit-transition: all 0.7s ease-in-out;
  697. -moz-transition: all 0.7s ease-in-out;
  698. -o-transition: all 0.7s ease-in-out;
  699. background:transparent;
  700. z-index:999999999;
  701. }
  702.  
  703. #updates:hover{
  704. border-radius: 10px;
  705. border:0px solid #000;
  706. padding:5px;
  707. height:120px;
  708. overflow:hidden;
  709. width:200px;
  710. opacity:1.0;
  711. background:white;
  712. opacity: 0.8;
  713. z-index:999999999;}
  714.  
  715. #other1{
  716. border-radius: 10px;
  717. position:fixed !important;
  718. left:1000px; padding-top:12px;
  719. bottom:100px;
  720. padding-bottom:12px;
  721. text-align:center;
  722. height:10px;
  723. width:68px;
  724. overflow:hidden;
  725. -webkit-transition: opacity 0.7s linear;
  726. -webkit-transition: all 0.7s ease-in-out;
  727. -moz-transition: all 0.7s ease-in-out;
  728. -o-transition: all 0.7s ease-in-out;
  729. background:transparent;
  730. z-index:9999;}
  731.  
  732. #other1:hover{
  733. border-radius: 10px;
  734. border:0px solid #000;
  735. padding:5px;
  736. height:50px;
  737. width:50px;
  738. z-index:999999999;
  739. opacity: 0.8;
  740. background:white;}
  741.  
  742.  
  743. #other2{
  744. border-radius: 10px;
  745. position:fixed !important;
  746. left:1000px; padding-top:12px;
  747. bottom:50px;
  748. padding-bottom:12px;
  749. text-align:center;
  750. height:10px;
  751. width:68px;
  752. overflow:hidden;
  753. -webkit-transition: opacity 0.7s linear;
  754. -webkit-transition: all 0.7s ease-in-out;
  755. -moz-transition: all 0.7s ease-in-out;
  756. -o-transition: all 0.7s ease-in-out;
  757. background:transparent;
  758. z-index:9999;}
  759.  
  760. #other2:hover{
  761. border-radius: 10px;
  762. border:0px solid #000;
  763. padding:5px;
  764. height:350px;
  765. width:300px;
  766. z-index:999999999;
  767. opacity: 0.8;
  768. background:white;}
  769.  
  770.  
  771.  
  772.  
  773. #hover{
  774.     border-radius: 0px;
  775.     border:0px dashed #000;
  776.     position:fixed !important;
  777.     left:800px; padding-top:2px;
  778.     top:5px;
  779.     padding-bottom:3px;
  780.     text-align:center;
  781.     height:11px;
  782.     width:70px;
  783.     overflow:hidden;
  784.     -webkit-transition: opacity 0.6s linear;
  785.     -webkit-transition: all 0.6s ease-in-out;
  786.     -moz-transition: all 0.6s ease-in-out;
  787.     -o-transition: all 0.6s ease-in-out;
  788.     border-bottom-left-radius: 3px;
  789.     -moz-border-radius-bottomleft: 3px;
  790.     -webkit-border-bottom-left-radius: 3px;
  791.     border-bottom-right-radius: 3px;
  792.     -moz-border-radius-bottomright: 3px;
  793.     -webkit-border-bottom-right-radius: 3px;
  794.     border-top-left-radius: 3px;
  795.     -moz-border-radius-top-left: 3px;
  796.     -webkit-border-top-left-radius: 3px;
  797.     border-top-right-radius: 3px;
  798.     -moz-border-radius-topright: 3px;
  799.     -webkit-border-top-right-radius: 3px;
  800.     background:#F0F0F0;
  801.     background-image:url('');
  802.     z-index:55555;
  803.    
  804.     }
  805.    
  806.     #hover:hover{
  807.     border-radius: 0px;
  808.     border:1px transparent #000;
  809.     padding:5px;
  810.     height:220px;
  811.     width:200px;
  812.     z-index:55555555555555555;
  813.     background:transparent;
  814.     }
  815.    
  816.     #box{
  817.     height:auto;
  818.     opacity:1.0;
  819.     text-align:center;
  820.     z-index:99999999999999999999;
  821.     background:transparent;
  822.     }
  823.  
  824. </style>
  825. <script type="text/javascript">function tb8_makeArray(n){this.length = n;return this.length;}tb8_messages = new tb8_makeArray(3);tb8_messages[0] = "YOURTEXT";tb8_messages[1] = "YOURTEXT";tb8_messages[2] = "YOURTEXT";tb8_rptType = 'infinite';tb8_rptNbr = 5;tb8_speed = 100;tb8_delay = 2000;var tb8_counter=1;var tb8_currMsg=0;var tb8_tekst ="";var tb8_i=0;var tb8_TID = null;function tb8_pisi(){tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);document.title = tb8_tekst;tb8_sp=tb8_speed;tb8_i++;if (tb8_i==tb8_messages[tb8_currMsg].length){tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;}if (tb8_currMsg == tb8_messages.length){if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){clearTimeout(tb8_TID);return;}tb8_counter++;tb8_currMsg = 0;}tb8_TID = setTimeout("tb8_pisi()", tb8_sp);}tb8_pisi()</script>
  826.  
  827.  
  828.  
  829.  
  830. <script type="text/javascript">
  831. $(window).load(function(){
  832. $("p").remove(":contains('Source:')");
  833. $("p").remove(":contains('via ')");
  834. });
  835. </script>
  836.  
  837. </head>
  838. <body>
  839.  
  840. <body>
  841. <div id="hover"><font color="#fff">HOVER</font><p>
  842.     <div id="box">
  843. I track the tag XXXXX<br>
  844. ONLINE USERS COUNTER
  845. <br><center>
  846.  
  847.  
  848.  
  849.  
  850.     </div></div>
  851.  
  852. <!--
  853. This is where you put your banner. Upload your banner on tinypic.com and use the 4th link "Direct Link for Layouts" and paste it into the <img src="YOURLINK" width blabla.
  854. You can change the height and width & where you want your banner. If you want it a bit more on top change top: to 100 for example. If you want your banner more on the left side change left: to 10 for example.
  855. -->
  856. <div style="position:fixed; top:200px; left:980px;">
  857. <img src="http://static.tumblr.com/sxplfnv/1uOmckah9/sherp-a.jpg" width="200" height="30" alt="banner"></div>
  858.  
  859. <font color="#C0C0C0"><div style="position:fixed; bottom:250px; left:1024px;">
  860. <a href="http://YOURURL"><font color="#808080">ASK</a></div></font>
  861.  
  862.  
  863. <div class="wrapper">
  864.  
  865. <div id="links">
  866. <font color="#808080">LINKS<br></font>
  867. <div id="box">
  868. <br>
  869.  
  870. <font size="1">
  871. <div class="navigate">
  872. <a href="http://YOURURL"style="text-decoration:none">link1</a>
  873. <a href="http://YOURURL"style="text-decoration:none">link2</a>
  874. <a href="http://YOURURL/"style="text-decoration:none">link3</a>
  875. <a href="http://YOURURL"style="text-decoration:none">link4</a>
  876. <a href="http://YOURURL"style="text-decoration:none">link5</a>
  877. <a href="http://opulen-ce"style="text-decoration:none">theme</a>
  878. </div></center>
  879. <script type=text/javascript” src=”http://codysherman.com/tools/infinite-scrolling/code”></script><br>
  880. <br></font></font>
  881. </font><br>
  882.  
  883. <br>
  884. </div></div>
  885.  
  886.  
  887. <div id="updates">
  888. UPDATES<Br><p>
  889. <div id="box">
  890. <br>
  891. This is where your updates go
  892.  
  893.  
  894. </div></div>
  895.  
  896. <div id="other1">
  897. OTHER<br><p><br>
  898. <div id="box">
  899.  
  900. blablablbabla
  901.  
  902.  
  903.  
  904. <BR><BR></div></div>
  905.  
  906. <div id="other2">
  907. OTHER<br><p><br>
  908. <div id="box">
  909. blablabka
  910. </div></div></center>
  911.  
  912.  
  913.  
  914.  
  915.  
  916. <div class="content">
  917.  
  918. <div class="left">
  919.  
  920. <div id="posts">
  921.  
  922.  
  923. <div class="entry">
  924. <center>
  925.  
  926. <div id="contain">
  927. <div id="sidebar">
  928. <div style="       
  929.         {block:ifshowsidebarimage}
  930.         padding-top:100px;
  931.         {/block:ifshowsidebarimage}
  932.         {block:ifnotshowsidebarimage}
  933.         padding-top:200px;
  934.         {/block:ifnotshowsidebarimage}">
  935. <div style="border-left: 1px solid {color:blockquote};">
  936. <div id="titulo">
  937.            
  938. {block:ifshowsidebarimage}<a href="/"><img src="{image:sidebar}" width="290"/></a>{/block:ifshowsidebarimage}
  939. {block:ifshowtitle}<a href="/">{title}</a><br>{/block:ifshowtitle}
  940.                         </div>
  941.  
  942. <div style="
  943. {block:ifpixelfont}
  944.    font-family: pixie;
  945.    font-size: 8px;
  946.    letter-spacing:-1px;
  947.    {/block:ifpixelfont}
  948.    {block:ifnotpixelfont}
  949.    font-family: helvetica;
  950.    font-size: 9px;
  951.    {/block:ifnotpixelfont}
  952.     text-align:left; padding-left:10px; line-height: 100%; color:#777; text-transform: none;
  953.     width:265px;padding-top:5px;">
  954.  
  955. {Description}
  956.  
  957.  
  958. </div>
  959.  
  960. <br>
  961. <div style="{block:ifpixelfont}
  962.    font-family: pixie;
  963.    font-size: 8px;
  964.    letter-spacing:-1px;
  965.    {/block:ifpixelfont}
  966.    {block:ifnotpixelfont}
  967.    font-family: helvetica;
  968.    font-size: 9px;
  969.     text-transform:lowercase;
  970.    {/block:ifnotpixelfont} text-align:right; border-top: 1px solid {color:blockquote};padding-right:3px; padding-top:3px; padding-bottom:3px;">
  971.  
  972.  
  973. </div>
  974. </div>
  975.  
  976. </div>
  977. </div></div>
  978.                         </div>
  979. <div id="content">
  980. {block:Posts}
  981. <div class="entry">
  982.  
  983. {block:Text}
  984. <div class="text">
  985.     <div style="text-transform:lowercase">{block:Title}
  986.         <a href="{Permalink}">{Title}</a>
  987.     {/block:Title}</div>
  988.         {Body}
  989.     {block:indexpage}
  990.     <div class="permahover"><p><br><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  991.     {/block:indexpage}
  992.  
  993. </div>
  994. {/block:Text}
  995.  
  996. {block:Photo}
  997. {block:IndexPage}
  998. <div class="perma1">
  999. <div class="likep">
  1000. <a id="like{PostID}" href="javascript:likelink('{PostID}','{Permalink}','');"><img src="http://static.tumblr.com/lba83dv/OUUltd958/spacer.gif" width="21" height="20" alt="Like this post" id="likeimage{PostID}"/></a>
  1001. </div>
  1002. <div class="rep"><a href="{reblogurl}" target="_blank"><img src="http://static.tumblr.com/uiqhh9x/OAClzwwao/reblog.png" width="30"/></a>
  1003. </div>
  1004. <div class="not"><a id="notes{PostID}" href="{Permalink}">{NoteCount}</a></div>          
  1005. </div>  
  1006. {/block:IndexPage}
  1007. {block:indexpage}
  1008. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>{LinkCloseTag}
  1009. {/block:indexpage}
  1010. {block:permalinkpage}
  1011. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>{LinkCloseTag}
  1012. {/block:permalinkpage}
  1013. {/block:Photo}
  1014.  
  1015. {block:Photoset}
  1016.     {block:IndexPage}{Photoset-250}{/block:IndexPage}
  1017.     {block:indexpage}
  1018.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1019.     {/block:indexpage}
  1020. {block:permalinkpage}
  1021.     {Photoset-500}
  1022. {/block:permalinkpage}
  1023. {/block:Photoset}
  1024.  
  1025. {block:Quote}
  1026.     <div class="text">
  1027.     "{Quote}"
  1028.     {block:Source}
  1029.         <div class="source"><div style="text-align:right">{Source}</div></div>
  1030.     {/block:Source}
  1031.     {block:indexpage}
  1032.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1033.     {/block:indexpage}
  1034. </div>{/block:Quote}
  1035.  
  1036. {block:Link}
  1037. <div class="text">
  1038. <span style="text-transform:lowercase;"><a href="{URL}" class="link" {Target}>{Name}</a></span>
  1039.     {block:Description}
  1040.         <div class="description">{Description}</div>
  1041.     {/block:Description}
  1042.     {block:indexpage}
  1043.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1044.     {/block:indexpage}
  1045. </div>{/block:Link}
  1046.  
  1047. {block:Chat}
  1048.     <div class="text">
  1049.     {block:Title}
  1050.         <a href="{Permalink}">{Title}</a>
  1051.         {/block:Title}
  1052.         <ul class="chat">
  1053.            {block:Lines}
  1054.            <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label}
  1055.                  
  1056.                   {Line} </li>
  1057.            {/block:Lines}
  1058.         </ul>    
  1059.     {block:indexpage}
  1060.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1061.     {/block:indexpage}
  1062. </div>{/block:Chat}
  1063.  
  1064. {block:Video}
  1065.     {block:IndexPage}{Video-250}{/block:IndexPage}
  1066.     {block:indexpage}
  1067.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1068.     {/block:indexpage}
  1069.     {block:permalinkpage}
  1070.     {Video-500}
  1071.     {/block:permalinkpage}
  1072.    
  1073. {/block:Video}
  1074.  
  1075. {block:Audio}
  1076. <div class="text">
  1077.         {AudioPlayerGrey}
  1078.         {block:Caption}
  1079.         {Caption}
  1080.     {/block:Caption}
  1081.     {block:indexpage}
  1082.     <div class="permahover"><br><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a></p></div>
  1083.     {/block:indexpage}
  1084. </div>{/block:Audio}
  1085.  
  1086.  {block:Answer}<div class="text">
  1087. <div class="question">
  1088. <span style="text-transform:lowercase; color:{color:Link}">{Asker} </span>asked: {Question}</div><div class="answer">{Answer}</div>
  1089.     {block:indexpage}
  1090.     <div class="permahover"><p><a href="{permalink}">{NoteCountwithLabel}</a> / <a href="{ReblogURL}" target="_blank">Reblog</a> </p></div>
  1091.     {/block:indexpage}
  1092. </div>{/block:Answer}
  1093.  
  1094.  
  1095. {block:PermalinkPage}
  1096. <div id="note3"><div style="text-align:right">
  1097. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</div>
  1098.  
  1099. {block:PostNotes}
  1100. {PostNotes}
  1101. {/block:PostNotes}
  1102. </div>
  1103. {/block:PermalinkPage}
  1104. </div>
  1105. {/block:Posts}
  1106. </div></div>
  1107.     {block:Pagination}
  1108.                 <ul id="pagination">
  1109.                         {block:PreviousPage}
  1110.                                 <li><a href="{PreviousPage}"></a></li>
  1111.                         {/block:PreviousPage}
  1112.                         {block:JumpPagination length="5"}
  1113.                         {block:CurrentPage}
  1114.                                 <li><span class="current_page numbersNav"><strong>{PageNumber}</strong></span></li>
  1115.                         {/block:CurrentPage}
  1116.                         {block:JumpPage}
  1117.                                 <li><a class="jump_page numbersNav" href="{URL}">{PageNumber}</a></li>
  1118.                         {/block:JumpPage}
  1119.                         {/block:JumpPagination}
  1120.                         {block:NextPage}
  1121.                                 <li><a id="nextPage" href="{NextPage}"></a></li>
  1122.                         {/block:NextPage}
  1123.                 </ul>
  1124.         {/block:Pagination}
  1125.  
  1126. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  1127. <script src="http://static.tumblr.com/fxpo5zq/HCHm5q8gs/infinitescroll.js"></script>
  1128. {block:IndexPage}
  1129. <script type="text/javascript">
  1130. $(window).load(function () {
  1131. $('#content').masonry(),
  1132. $('.masonryWrap').infinitescroll({
  1133. navSelector    : '#pagination',  
  1134. nextSelector   : '#pagination a#nextPage',
  1135. itemSelector : ".entry",
  1136. bufferPx : 100,
  1137. loadingText : "<em></em>",
  1138. },
  1139. function() { $('#content').masonry({ appendedContent: $(this) }); }
  1140. );
  1141. });
  1142. </script>
  1143. {/block:IndexPage}
  1144. <script type="text/javascript" src="http://static.tumblr.com/sxplfnv/TeSmf33pa/infinitescroll.txt"></script>
  1145. <script type="text/javascript">
  1146.  
  1147.                         $('.show').click(function(e){
  1148.                                 e.preventDefault();
  1149.                                 $('.panel').stop(true,true);
  1150.                                 var target = $(this).attr('href');
  1151.                                 if($('.panel').is(':visible')){
  1152.                                         if($(target).is(':visible')){
  1153.                                                 $(target).slideUp();
  1154.                                                 return false;
  1155.                                         }else{
  1156.                                                 $('.panel:visible').slideUp(400, function(){
  1157.                                                         $(target).slideDown();
  1158.                                                 });            
  1159.                                         }
  1160.                                 }else {
  1161.                                         $(target).slideDown();
  1162.                                 }
  1163.                         });
  1164.    
  1165. </script>
  1166. <script type="text/javascript" src="http://static.tumblr.com/uiqhh9x/aK8m1cpdr/like2.js"></script>
  1167. <iframe id="likeiframe" style="width: 1px; height: 1px;"></iframe>
  1168. </body>
  1169.  
  1170.  
  1171. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement