Advertisement
tobemarissa

TBM Theme 22: Hocus Pocus (Halloween #3)

Oct 8th, 2013
428
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.07 KB | None | 0 0
  1. <!---Do not under any circumstaces remove credit! If you need to move them from where they are currently, I expect them to still be somewhere they are easily accessable :) If you don't follow these rules, I will report you.
  2.  
  3. Enjoy the theme & customize as you wish! If you have any questions, just message me and I'll be happy to help you.
  4.  
  5. --->
  6.  
  7. <html>
  8.  
  9. <head>
  10.  
  11. <meta name="color:links" content="#939597" />
  12. <meta name="color:linkshover" content="#868484" />
  13. <meta name="image:sidebar" content="http://i917.photobucket.com/albums/ad12/xguyswithguitarsx/sidebarimg_zps25dd2516.png" />
  14. <meta name="image:background" content="http://i917.photobucket.com/albums/ad12/xguyswithguitarsx/background_zps3a342cf2.gif"
  15. />
  16. <meta name="text:linkurl"content=""/>
  17. <meta name="if:showtitle" content="1" />
  18.  
  19.  
  20.  
  21. <link rel="shortcut icon" href="http://img.photobucket.com/albums/v252/shaquanda/dumpitydump/anotherdumpingfolder/onemore/65474657u/image661.gif">
  22.  
  23. {block:Description}
  24. <meta name="description" content="{MetaDescription}" />
  25. {/block:Description}
  26.  
  27. <title>{Title}</title>
  28.  
  29.  
  30. <style type="text/css">
  31.  
  32. @font-face {font-family:"arma";src:url('http://static.tumblr.com/7glhdxz/B3Mmgevme/pf_arma_five.ttf');}
  33.  
  34. @font-face{font-family:"Ginette";src:url('http://static.tumblr.com/9wzbixa/ZKKmj2im3/ginette.ttf');}
  35.  
  36. /*GENERAL*/
  37.  
  38. body{
  39. background-image:url('{image:background}');
  40. background-attachment: fixed;
  41. font-family:"arma";
  42. font-size:8px;
  43. }
  44.  
  45. a:link, a:active, a:visited{
  46. color: {color:links};
  47. text-decoration: none;}
  48.  
  49. a:hover {
  50. color:{color:linkshover};
  51. text-decoration: none;}
  52.  
  53.  
  54. /*SIDEBAR*/
  55.  
  56. div#gravestone{
  57. z-index:1;
  58. position:fixed;
  59. margin-left:220px;
  60. top:180px;
  61. }
  62.  
  63. div#desc{
  64. z-index:2;
  65. position:fixed;
  66. margin-left:270px;
  67. top:240px;
  68. width:80px;
  69. height:12px;
  70. -webkit-border-radius:30px;
  71. text-align:center;
  72. text-shadow:4px 3px 4px #fff;
  73. }
  74.  
  75. div#sidebarimg{
  76. left:273px;
  77. top:230px;
  78. width:93px;
  79. height:123px;
  80. -webkit-border-radius:80px;
  81. position:fixed;
  82. z-index:1;
  83. opacity:.7;
  84. background-image:url('{image:sidebar}') ;
  85. }
  86.  
  87. div#title{
  88. margin-left:210px;
  89. width:200px;
  90. text-align:center;
  91. font-size:40px;
  92. position:fixed;
  93. color:#fff;
  94. margin-top:110px;
  95. background:transparent;
  96. font-family:"Ginette";
  97. z-index:1;
  98. }
  99.  
  100.  
  101. /*POSTS*/
  102.  
  103. div#posts{
  104. margin-left: 500px;
  105. margin-top:10px;
  106. width:750px;
  107. height:110%;
  108. background: transparent;
  109.  
  110. }
  111.  
  112. .entry {
  113. margin:7px;
  114. padding:1px;
  115. float:left;
  116. background-color: white;
  117. {block:IndexPage}
  118. width:250px;
  119. {/block:IndexPage}
  120. {block:PermalinkPage}
  121. width:500px;
  122. line-height:14px;
  123. padding:3px;
  124. margin-left: -50px;
  125. {/block:PermalinkPage}
  126. }
  127.  
  128. #audiostats {display:block; height:auto; position:relative; min-height:80px;}
  129.  
  130. .audioentry {width:245px; background-color:#ffffff; position:relative; padding:5px; {block:IndexPage}overflow:hidden;{/block:IndexPage}; min-height:80px;}
  131.  
  132. .audio {top: 15px; left: 15px; -webkit-border-radius: 50px; -moz-border-radius: 50px; position: absolute; z-index: 3; background: white; opacity: .5; filter:alpha(opacity=50)}
  133.  
  134. .audioplayer {width: 20px; height: 30px; overflow: hidden; margin: 17px 24px 13px 16px;}
  135.  
  136. .perms {
  137. border-bottom: 1px solid {color:border};
  138. color:#777;
  139. font-size:8px;
  140. opacity: 0;
  141. -webkit-transition-duration: .75s;top:0px;
  142. width:250px;
  143. height:22px;
  144. padding-bottom:4px;
  145. background-color: #fff;
  146. position: absolute;
  147. margin-top:6px;
  148. text-align:center;
  149. text-transform:uppercase;
  150. font-family:consolas;
  151. letter-spacing:1px;
  152. display:block;
  153. }
  154.  
  155. .entry:hover .perms {
  156. opacity:0.9;
  157. z-index:999999;
  158. padding-top:4px;}
  159.  
  160. .permalinktext{
  161. text-align:center;
  162. }
  163.  
  164.  
  165.  
  166. /*NAVIGATION*/
  167.  
  168. div#navi{
  169. margin-top:410px;
  170. margin-left:250px;
  171. width:122px;
  172. background:#cccccc;
  173. font-size:10px;
  174. text-align:center;
  175. position:fixed;
  176. border-radius:5px;
  177. }
  178.  
  179. /*EXTRAS*/
  180.  
  181. div#trees{
  182. left:0px;
  183. margin-left:-5px;
  184. position:fixed;
  185. z-index;-1;
  186. }
  187.  
  188.  
  189. </style>
  190.  
  191.  
  192.  
  193. </head>
  194.  
  195. <body>
  196.  
  197. {block:IfShowTitle}<div id="title">{Title}</div>{/block:IfShowTitle}
  198.  
  199. <div id="trees"><img src="http://3.bp.blogspot.com/_JUAaGVLZrKw/TJt20sEHcoI/AAAAAAAAAKg/J2_T5ishtsA/s1600/TreeBatframe.png" width=1360px;></div>
  200.  
  201. <div id="gravestone"><img src="http://i917.photobucket.com/albums/ad12/xguyswithguitarsx/sidebaryo_zps23f18f09.png"></div>
  202.  
  203. <div id="desc">{Description}</div>
  204.  
  205. <div id="sidebarimg"></div>
  206.  
  207. <div id="navi"><a href="/"><img src="http://4.bp.blogspot.com/-hoonaLvLtGs/TpHz3U4b_xI/AAAAAAAABAM/-WNKaUATPHY/s1600/home.gif"></a>
  208.  
  209. |
  210.  
  211. <a href="/ask"><img src="http://1.bp.blogspot.com/-SkJy6HconeM/TpHz1kI1LDI/AAAAAAAAA_8/JFFVEZvYLjE/s1600/email.gif"></a>
  212.  
  213. |
  214.  
  215. <a href="{text:linkurl}"><img src="http://2.bp.blogspot.com/-C7TWnlhmQew/TpHz4o7JyUI/AAAAAAAABAc/gsmm4afzPuQ/s1600/pasta.gif"></a>
  216.  
  217. |
  218.  
  219. <a href="http://tobemarissa.tumblr.com"><img src="http://3.bp.blogspot.com/-JdDhiXxbcrI/TpHz0dH5_9I/AAAAAAAAA_w/NW1Yj8mp8dI/s1600/core.gif"></a>
  220.  
  221. </div>
  222.  
  223. <div id="posts">
  224.  
  225. {block:Posts}
  226. <div class="entry">
  227.  
  228.  
  229.  
  230.  
  231. {block:Text}
  232. <div class="text">
  233. <div style="text-transform:uppercase">{block:Title}
  234. <a href="{Permalink}">{Title}</a>
  235. {/block:Title}</div>
  236. {Body}
  237. {block:IndexPage}
  238. <div class="permalinktext">
  239. _______________________________________________________________
  240. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  241. </div>
  242. {/block:IndexPage}
  243.  
  244. </div>
  245. {/block:Text}
  246.  
  247.  
  248. {block:Link}
  249. <div class="text">
  250. <span style="text-transform:uppercase;"><a href="{URL}" class="link" {Target}>{Name}</a></span>
  251. {block:Description}
  252. <div class="description">{Description}</div>
  253. {/block:Description}
  254. {block:IndexPage}
  255. <div class="permalinktext">
  256. _______________________________________________________________
  257. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  258. </div>
  259. {/block:IndexPage}
  260. </div>{/block:Link}
  261.  
  262. {block:Photo}
  263. {block:IndexPage}<div class="perms">
  264. <a href="{permalink}">{notecountwithlabel}</a> <img src="http://clipartist.net/social/clipartist.net/C/cat_icons_4_black_white_line_art-999px.png" height=10px;> <a href="{ReblogURL}" target="_blank">reblog</a>
  265. </div> {/block:IndexPage}
  266. {block:IndexPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" style="opacity:0.8" width=
  267. "250px"/></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" style="opacity:1" width="500px"/>{LinkCloseTag}{/block:PermalinkPage}
  268. {block:ifshowcaption}{caption}{/block:ifshowcaption}
  269. {/block:Photo}
  270.  
  271. {block:Photoset}
  272. {block:IndexPage}<div class="perms">
  273. posted at on {DayOfWeek} <br> with <a href="{permalink}">{notecountwithlabel}</a> / <a href="{ReblogURL}" target="_blank">reblog</a>
  274. </div> {/block:IndexPage}
  275. {block:IndexPage}<center>{Photoset-250}</center>{/block:IndexPage}
  276. <center>{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}</center>
  277. {/block:Photoset}
  278.  
  279.  
  280. {block:Quote}
  281. <div class="text">
  282. <div class="quote">&#10077;</div>
  283. <div style="margin-top:2px;;margin-bottom:0px;min-height:30px; padding: 4px; background-color:#fafafa;border:1px dotted #eee; letter-spacing:1px;text-transform:uppercase; font-size:8px; font-family: consolas; border-radius:5px;">
  284. {Quote} </div>
  285. {block:Source}
  286. <div class="source"><div style="text-align:right; color:{color:link};padding-top:5px;"> • {Source}</div></div>
  287. {/block:Source}
  288. {block:IndexPage}
  289. <div class="permalinktext">
  290. _______________________________________________________________
  291. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  292. </div>
  293. {/block:IndexPage}
  294. </div>{/block:Quote}
  295. {block:Chat}
  296. <div class="text">
  297. {block:Title}
  298. <a href="{Permalink}">{Title}</a>
  299. {/block:Title}
  300. <ul class="chat">
  301. {block:Lines}
  302. <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label}
  303.  
  304. {Line} </li>
  305. {/block:Lines}
  306. </ul>
  307. {block:IndexPage}
  308. <div class="permalinktext">
  309. _______________________________________________________________
  310. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  311. </div>
  312. {/block:IndexPage}
  313. </div>{/block:Chat}
  314.  
  315.  
  316.  
  317. {block:Audio}
  318.  
  319. <div id="audiostats">
  320. <div class="audioentry">
  321.  
  322. <img src="http://static.tumblr.com/2lqtwbf/coolyqooj/untitled-1.png" alt="default album art" width="80" height="80" style="position:absolute; vertical-align:middle;" />
  323.  
  324. {block:AlbumArt}<img width="80" height="80" src="{AlbumArtURL}" style="position:absolute;" />{/block:AlbumArt}
  325.  
  326. <div class="audio"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  327.  
  328. <div style="margin-left:90px; line-height:12px">{block:TrackName}<b>Song:</b> {TrackName}<br>{/block:TrackName}
  329. {block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist}
  330. {block:Album}<b>Album:</b> {Album}<br>{/block:Album}
  331. {FormattedPlayCount} plays{block:Caption}{Caption}{/block:Caption}</div>
  332. </div>
  333. <div class="permalinktext">
  334. _______________________________________________________________
  335. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a></span></div>
  336. {/block:IndexPage}
  337. {/block:Audio}
  338.  
  339. {block:Video}
  340. {block:IndexPage}<div id="permalink"><div class="reblogg"><a href="{reblogurl}">reblog</a></span></div></div>
  341. <center>
  342. {block:IndexPage}
  343. {Video-250}
  344. {/block:IndexPage}
  345. </center>
  346. {block:PermalinkPage}
  347. <center>{Video-500}</center>
  348. {/block:PermalinkPage}
  349. {block:Video}
  350.  
  351. {block:Answer}
  352. <div style="padding:13px;text-align:left;">
  353. <strong><i>{asker}:</i> {question}</strong>
  354. <div class="caption" style="margin-top:3px;">
  355. {Answer}</div>
  356. {block:indexpage}
  357. <div align="right" style="padding-right:10px; padding-top:3px;padding-bottom:0px;"><a href="{Permalink}">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  358. </a>&nbsp;&nbsp;-&nbsp;&nbsp;<a href="{Permalink}">{DayOfMonth} {Month}
  359. </a></div>{/block:indexpage}
  360. </div>
  361. {/block:Answer}
  362.  
  363. {block:IndexPage}<div style="display:none;">{block:ContentSource}<a href="{SourceURL}">{SourceTitle}</a> {block:RebloggedFrom}<a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{/block:ContentSource}</div>{/block:IndexPage}
  364.  
  365. {block:PermalinkPage}
  366. {block:caption}{caption}<br>{/block:caption}
  367. <center>{block:Date}Posted on {DayOfWeek}, {Month} {DayOfMonth}, {Year} with {NoteCountWithLabel}{/block:Date}
  368. {block:RebloggedFrom}<br><b>via</b>: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{block:ContentSource} | <b>source</b>: <a href="{SourceURL}">{SourceTitle}</a> {/block:ContentSource}
  369. </center>
  370. {/block:PermalinkPage}
  371.  
  372. <div style="text-align:left;">
  373. {block:PostNotes}{PostNotes}
  374. {/block:PostNotes}</div>
  375. </div>
  376.  
  377.  
  378.  
  379. {/block:Posts}
  380. </div>
  381. </div>
  382. {block:IndexPage}<br>
  383. {block:Pagination}
  384. <div id="pagination">
  385. {block:NextPage}
  386. <a id="nextPage" href="{NextPage}">next</a>
  387. {/block:NextPage}
  388. {block:PreviousPage}
  389. <a href="{PreviousPage}">back</a>
  390. {/block:PreviousPage}
  391. </div>
  392. {/block:Pagination}
  393. {/block:IndexPage}
  394. </div>
  395. </body>
  396.  
  397. {block:indexpage}
  398. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  399. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  400. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  401. <script type="text/javascript">
  402. $(window).load(function(){
  403. var $wall = $('#posts');
  404. $wall.imagesLoaded(function(){
  405. $wall.masonry({
  406. itemSelector: '.entry, .entry_photo',
  407. isAnimated : false
  408. });
  409. });
  410.  
  411. $wall.infinitescroll({
  412. navSelector : '#page-nav',
  413. nextSelector : '#page-nav a',
  414. itemSelector : '.entry, .entry_photo',
  415. bufferPx : 2000,
  416. debug : false,
  417. errorCallback: function() {
  418. $('#infscr-loading').fadeOut('normal');
  419. }},
  420. function( newElements ) {
  421. var $newElems = $( newElements );
  422. $newElems.hide();
  423. $newElems.imagesLoaded(function(){
  424. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  425. });
  426. }); $('#content').show(500);
  427. });
  428. </script>
  429. {/block:indexpage}
  430.  
  431. <script type="text/javascript">
  432. $(function() {
  433. $("#topDivA").click(function(){
  434. var target = $("html");
  435. $('html, body').animate({
  436. scrollTop: target.offset().top
  437. }, 1000);
  438. });
  439.  
  440. });</script>
  441.  
  442.  
  443. </body>
  444.  
  445. <hmtl>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement