Advertisement
twerkinqz

Theme 42 by Sylvia #2

Jul 4th, 2013
1,482
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!--
  2. Theme 42 by Sylvia (twerkinqz)
  3.  
  4. keep the credit or the theme will be destroyed..seriously
  5.  
  6. -->
  7.  
  8. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  9. <html xmlns="http://www.w3.org/1999/xhtml">
  10. <head>
  11.  
  12.  
  13.  
  14. <script type="text/javascript"
  15. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  16.  
  17. <link href="http://static.tumblr.com/z0cd8ty/aJjm6uyej/meffects.css" rel="stylesheet">
  18.  
  19. <link href='http://fonts.googleapis.com/css?family=Rambla|Miniver|Ubuntu' rel='stylesheet' type='text/css'>
  20.  
  21. <meta name="color:Background" content="#FFFFFF"/>
  22. <meta name="color:Text" content="#000000"/>
  23. <meta name="color:Hover" content="#ffffff"/>
  24. <meta name="color:Link" content="#000000"/>
  25. <meta name="image:Background" content=""/>
  26. <meta name="image:Sidebar" content=""/>
  27. <meta name="if:2column" content="1"/>
  28. <meta name="if:3column" content="0"/>
  29. <meta name="if:fadedposts" content="0"/>
  30. <meta name="if:titlebar" content="0"/>
  31. <meta name="text:link one" content="" />
  32. <meta name="text:link one title" content="" />
  33. <meta name="text:link two" content="" />
  34. <meta name="text:link two title" content="" />
  35. <meta name="text:link three" content="" />
  36. <meta name="text:link three title" content="" />
  37. <meta name="text:link four" content="" />
  38. <meta name="text:link four title" content="" />
  39. <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
  40.  
  41.  
  42.  
  43. <style type="text/css">
  44.  
  45. ::-webkit-scrollbar {width: 3px; height: 4px; background: {color:Background}; }
  46.  
  47. ::-webkit-scrollbar-thumb { background-color: #cecece;}
  48.  
  49. @font-face { font-family: "signerica"; src: url('http://static.tumblr.com/yo59jgt/m4om1rino/signerica_fat.ttf'); }
  50.  
  51. #tumblr_controls{
  52. position:fixed !important;
  53. -webkit-filter:invert(100%);
  54. opacity:.8;
  55. -webkit-transition:linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  56. }
  57.  
  58. .wrapper{
  59. margin: 0px auto;
  60. width: 802px;
  61. }
  62.  
  63. .header{
  64. float: left;
  65. width: 100%;
  66. }
  67.  
  68. .left{
  69. float: left;
  70. margin-right: 20px;
  71. width: 802px;
  72. }
  73.  
  74. .right{
  75. float: right;
  76. width: 200px;
  77. background-color: {color:Background};
  78. }
  79.  
  80. body {
  81. padding: 0px;
  82. margin: 0px;
  83. color:{color:text};
  84. font-family:Helvetica;
  85. font-size: 11px;
  86. background-color: {color:Background};
  87. background-image:url({image:Background});
  88. background-attachment: fixed;
  89. background-size: 100%;
  90. }
  91.  
  92. a:link, a:active, a:visited{
  93. color: {color:Link};
  94. text-decoration: none;}
  95.  
  96. a:hover {color:{color:Hover};
  97. -webkit-transition: 0.4s ease-in;
  98. -o-transition: 0.4s ease-in;
  99. -moz-transition: 0.4s ease-in;
  100. transition: 0.4s ease-in;
  101. }
  102.  
  103. .entry {
  104. margin: 7px;
  105. padding: 6px;
  106. padding-bottom: 4px;
  107. float:left;
  108. text-align: justify;
  109. font-family:Helvetica;
  110. font-size: 11px;
  111. background-color: white;
  112. line-height:11px;
  113. {block:iffadedposts}
  114. opacity:0.7;
  115. {/block:iffadedposts}
  116. {block:ifnotfadedposts}
  117. opacity:1;
  118. {/block:ifnotfadedposts}
  119. overflow:hidden;
  120. border: solid 1px #cecece;
  121. {block:IndexPage}
  122. width:220px;
  123. {/block:IndexPage}
  124. {block:PermalinkPage}
  125. width:490px;
  126. margin-left:5px;
  127. {/block:PermalinkPage}
  128. }
  129.  
  130. .entry img{
  131. {block:IndexPage}
  132. width:220px;
  133. {/block:IndexPage}
  134. }
  135.  
  136. .entry .perma{
  137. position:absolute;
  138. width:220px;
  139. height:5px;
  140. padding-bottom:14px;
  141. overflow:hidden;
  142. font-family: ubuntu;
  143. text-transform: uppercase;
  144. font-size: 9px;
  145. font-style:italic;
  146. letter-spacing: 2px;
  147. bottom:0px;
  148. line-height:20px;
  149. text-align:center;
  150. background-color: white;
  151. border-top: dotted 1px #cecece;
  152. opacity:0.0;
  153. -webkit-transition: all 0.2s linear;
  154. -webkit-transition: all 0.2s linear;
  155. -moz-transition: all 0.2s linear;
  156. transition: all 0.2s linear;
  157. color:#000;
  158. }
  159.  
  160. .entry .perma a{
  161. color: #000;
  162. }
  163.  
  164. .entry:hover .perma{
  165. bottom:0px;
  166. overflow:visible;
  167. -webkit-transition: all 0.4s linear; opacity: 1;
  168. -webkit-transition: all 0.4s linear;
  169. -moz-transition: all 0.4s linear;
  170. transition: all 0.4s linear;
  171. }
  172.  
  173.  
  174.  
  175. blockquote{
  176. padding:0px 0px 2px 5px;
  177. margin:0px 0px 2px 1px;
  178. border-left: 1px solid #130C11;}
  179. blockquote p, ul{margin:0px; padding:0px;}
  180.  
  181.  
  182.  
  183. #bar2{
  184. {block:iftitlebar}
  185. width:100%;
  186. z-index:1;
  187. position:fixed !important;
  188. text-align:center;
  189. bottom:0px;
  190. height:30px;
  191. line-height: 19px;
  192. background-color: white;
  193. color: black;
  194. opacity: 0.9;
  195. font-size: 11.5px;
  196. padding-top: 3px;
  197. left:0px;
  198. border: dotted 1px #cecece;
  199. -webkit-transition: all 0.7s linear;
  200. -moz-transition: all 0.7s linear;
  201. transition: all 0.7s linear;
  202. {/block:iftitlebar}
  203. }
  204.  
  205. #bar2:hover{
  206. opacity: 1;
  207. -webkit-transition: all 0.7s linear;
  208. -moz-transition: all 0.7s linear;
  209. transition: all 0.7s linear;
  210. }
  211.  
  212. #navi{
  213. width:220px;
  214. border-bottom: dotted 1px #cecece;
  215. border-left: dotted 1px #cecece;
  216. border-right: dotted 1px #cecece;
  217. height:12px;
  218. font-size: 12px;
  219. line-height: 10px;
  220. padding: 3px;
  221. font-family: consolas;
  222. -webkit-transition: all 0.7s linear;
  223. -moz-transition: all 0.7s linear;
  224. transition: all 0.7s linear;
  225. }
  226.  
  227. #navi .navigate{
  228. height: 5px;
  229. padding: 0px;
  230. text-transform: lowercase;
  231. margin-right: 2px;
  232. margin-top: 0px;
  233. font-family:Rambla;
  234. font-size:11px;
  235. letter-spacing:1px;
  236. line-height: 5px;
  237. display: inline-block;
  238. opacity: 0.0;
  239. text-align:center;
  240. -webkit-transition: all 0.7s linear;
  241. -moz-transition: all 0.7s linear;
  242. transition: all 0.7s linear;
  243. }
  244. }
  245.  
  246. #navi .navigate a{
  247. color: {color:lin};
  248. }
  249.  
  250. #navi:hover{
  251. height:35px;
  252. -webkit-transition: all 0.5s linear;
  253. -webkit-transition: all 0.5s linear;
  254. -moz-transition: all 0.5s linear;
  255. transition: all 0.5s linear;
  256. }
  257.  
  258. #navi:hover .navigate{
  259. opacity:1;
  260. -webkit-transition: all 0.5s linear;
  261. -webkit-transition: all 0.5s linear;
  262. -moz-transition: all 0.5s linear;
  263. transition: all 0.5s linear;
  264. }
  265.  
  266. #navi:hover .navigate:hover{
  267. opacity:1;
  268. text-shadow: 5px 0 0 rgba(255,0,0,0.3), -2px 0 0 rgba(0,255,0,0.3);
  269. -webkit-transition: all 0.5s linear;
  270. -webkit-transition: all 0.5s linear;
  271. -moz-transition: all 0.5s linear;
  272. transition: all 0.5s linear;
  273. }
  274.  
  275.  
  276. #posts {
  277. {block:if2column}
  278. width: 593px;
  279. {/block:if2column}
  280. {block:if3column}
  281. width: 793px;
  282. {/block:if3column}
  283. margin-top: 0px;
  284. float:center;
  285. margin-left:540px;
  286. }
  287.  
  288. #sidebar{
  289. text-align:center;
  290. margin-top:130px;
  291. margin-left:253px;
  292. font-family:
  293. font-size: 12px;
  294. opacity: 1;
  295. width:228px;
  296. padding:5px;
  297. z-index:1;
  298. height:auto;
  299. background-color: white;
  300. border: solid 1px #cecece;
  301. position:fixed !important;
  302. -webkit-transition: all 0.7s linear;
  303. -moz-transition: all 0.7s linear;
  304. transition: all 0.7s linear;
  305. -webkit-animation:fadeIn 4s;
  306. -moz-animation:fadeIn 4s;
  307. -ms-animation:fadeIn 4s;
  308. }
  309.  
  310. #sidebar:hover{
  311. opacity: 1;
  312. -webkit-transition: all 0.7s linear;
  313. -moz-transition: all 0.7s linear;
  314. transition: all 0.7s linear;
  315. }
  316.  
  317. #infscr-loading{
  318. bottom: -70px;
  319. position: absolute;
  320. left: 50%;
  321. margin-left:-8px;
  322. width:16px;
  323. height:11px;
  324. overflow:hidden;
  325. margin-bottom: 50px;
  326. }
  327.  
  328. .title{
  329. font-family: Miniver;
  330. font-size: 14px;
  331. line-height:11px;
  332. color: black;
  333. }
  334.  
  335. .blogtitle{
  336. {block:iftitlebar}
  337. font-family: signerica;
  338. font-size:23px;
  339. line-height: 30px;
  340. color: {color:Link};
  341. letter-spacing: 5px;
  342. padding:0px 0px 0px 0px;
  343. text-shadow:1px 1px 1px #ccc;
  344. -webkit-transition: all 0.7s linear;
  345. -moz-transition: all 0.7s linear;
  346. transition: all 0.7s linear;
  347. {/block:iftitlebar}
  348. }
  349.  
  350. .blogtitle:hover{
  351. letter-spacing: 0px;
  352. text-shadow:5px 0px 0px #ccc;
  353. -webkit-transition: all 0.7s linear;
  354. -moz-transition: all 0.7s linear;
  355. transition: all 0.7s linear;
  356. }
  357.  
  358.  
  359. .textperma{
  360. display: block;
  361. font-family:Courier New;
  362. font-size: 11px;
  363. line-height:11px;
  364. text-transform: lowercase;
  365. text-align: right;
  366. background-color:transparent;
  367. padding: 0px;
  368. margin: 2px;
  369. }
  370.  
  371. blockquote{
  372. padding:0px 0px 2px 5px;
  373. margin:0px 0px 2px 10px;
  374. border-left: 1px dotted #555555;
  375. }
  376.  
  377.  
  378.  
  379. {CustomCSS}
  380.  
  381. </style>
  382. {block:IndexPage}
  383. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script><div style="position:fixed !important;right:3px;top:24px; opacity: 0.8; z-index:999999999999999999999999999; "><a href="http://gullibled.tumblr.com/"><img src="http://static.tumblr.com/dvz4szr/oismscl3m/yinyang.gif"></a></div><script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  384.  
  385. <script type="text/javascript">
  386. $(window).load(function () {
  387. var $content = $('#posts');
  388. $content.masonry({itemSelector: '.entry'}),
  389. $content.infinitescroll({
  390. navSelector : 'div#pagination',
  391. nextSelector : 'div#pagination a#nextPage',
  392. itemSelector : '.entry',
  393. loading: {
  394. finishedMsg: '',
  395. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  396. },
  397. bufferPx : 600,
  398. debug : false,
  399. },
  400. // call masonry as a callback.
  401. function( newElements ) {
  402. var $newElems = $( newElements );
  403. $newElems.hide();
  404. // ensure that images load before adding to masonry layout
  405. $newElems.imagesLoaded(function(){
  406. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  407.  
  408.  
  409. });
  410. });
  411. });
  412. </script>
  413.  
  414. {/block:IndexPage}
  415.  
  416.  
  417. <title>{title}</title>
  418.  
  419. <link rel="shortcut icon" href="{Favicon}">
  420. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  421. <meta name="viewport" content="width=820" />
  422.  
  423.  
  424. </head>
  425. <body>
  426.  
  427. <div class="wrapper">
  428. <div class="header">
  429. </div>
  430.  
  431. </div>
  432. <div id="sidebar">
  433. <a href="/"><img src="{image:Sidebar}" style="width:221px;border: dotted 1px #cecece; padding: 5px; margin-top: -3px; margin-left: -3px; background-color:white;"></a>
  434. <div style="font-family: Helvetica; font-size: 10px; line-height: 30px; border-bottom: solid 1px #cecece;">{description}</div>
  435. <div id="navi"><div style="text-align:center; letter-spacing: 3px;">navigation</div><br>
  436.  
  437. <div class="navigate"><a href="/">home</a></div>
  438. <div class="navigate"><a href="/ask">ask</a></div>
  439. {block:IfLinkOneTitle} <div class="navigate"><a href="{text:Link One}">{text:Link One Title} {/block:ifLinkOneTitle}</a></div>
  440. {block:ifLinkTwoTitle} <div class="navigate"><a href="{text:Link Two}"> {text:Link Two Title} {/block:ifLinkTwoTitle} </a></div>
  441. {block:ifLinkThreeTitle}<div class="navigate"><a href="{text:Link Three}">{text:Link Three Title} {/block:ifLinkThreeTitle} </a></div>
  442. {block:ifLinkFourTitle}<div class="navigate"><a href="{text:Link Four}">{text:Link Four Title} {/block:ifLinkFourTitle} </a></div> </div>
  443. </div>
  444.  
  445. <div id="bar2">
  446. {block:iftitlebar}<div class="blogtitle"><a href="/">{Title}</a></div>{/block:iftitlebar}
  447. </div></div>
  448.  
  449.  
  450.  
  451.  
  452.  
  453. <div class="left">
  454.  
  455. <div id="posts">
  456.  
  457. {block:Posts}
  458. <div class="entry">
  459.  
  460.  
  461. {block:Answer}
  462. <div class="ask"><b>{Asker}</b> asked: {Question}</div><br>
  463. {Answer}<br>
  464. {block:IndexPage}<span class="textperma"><a href="{Permalink}"><a href="{Permalink}">{notecount}</a> {/block:IndexPage}
  465. {/block:Answer}
  466. {block:Text}
  467. {block:Title}<span class="title">{Title}</span>{/block:Title}
  468. <span class="entrytext">{Body}</span></a>
  469. {block:IndexPage}
  470. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  471. {/block:IndexPage}
  472. {/block:Text}
  473.  
  474. {block:Link}
  475. <a href="{URL}" class="title">{Name}</a>
  476. {block:Description}{Description}{/block:Description}
  477. {block:IndexPage}
  478. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  479. {/block:IndexPage}
  480. {block:Link}
  481.  
  482. {block:Photo}
  483. {block:IndexPage}<div class="perma">
  484. <a href="{Permalink}"><a href="{ReblogURL}" target="_blank">↺</a> • {TimeAgo} • <a href="{permalink}">{NoteCount}</a></span></div>
  485. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"width="220"/></a></div>{LinkCloseTag}{/block:IndexPage}
  486. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="490"/></a>{LinkCloseTag}{/block:PermalinkPage}
  487. {/block:Photo}
  488.  
  489. {block:Photoset}{block:IndexPage}
  490. <div class="perma">
  491. <a href="{Permalink}"><a href="{ReblogURL}" target="_blank">↺</a> • <a href="{permalink}">{NoteCount} notes</a></span></div>{/block:IndexPage}<center><div style="width:220px; overflow-y:hidden; overflow-x:scroll;">{Photoset-250}</div></center></span>{/block:Photoset}
  492.  
  493. {block:Quote}
  494. <span class="title">{Quote}</span><br><br>
  495. {block:Source}{Source}{/block:Source}
  496. {block:IndexPage}
  497. <br /><div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  498. {/block:IndexPage}
  499. {/block:Quote}
  500.  
  501. {block:Chat}
  502. {block:Title}<span class="title">{Title}</span>{/block:Title}
  503. <ul class="chat">
  504. {block:Lines}
  505. <li class="user_{UserNumber}">
  506. {block:Label}
  507. <span class="label">{Label}</span>
  508. {/block:Label}
  509. {Line}
  510. </li>
  511. {/block:Lines}
  512. </ul>
  513. {block:IndexPage}
  514. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  515. {/block:IndexPage}
  516. {/block:Chat}
  517.  
  518. {block:Audio}
  519. <center><div style="width:220px; height:20px;"><div style="float:left">{AudioPlayerWhite}</div><div style="margin-top:8px; float:right;"><small>
  520. {FormattedPlayCount} plays</small></div></div></center><br><br>
  521. {block:Caption}{Caption}{/block:Caption}
  522. {block:IndexPage}
  523. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  524. {/block:IndexPage}
  525. {/block:Audio}
  526.  
  527. {block:Video}{block:IndexPage}
  528. <div class="perma">
  529. <a href="{Permalink}"><a href="{ReblogURL}" target="_blank">↺</a> • <a href="{permalink}">{NoteCount} notes</a></span></div>{/block:IndexPage}
  530. <center>
  531. <div class="videoperma"><div style="width:220px; overflow-y:hidden; overflow-x:scroll;">{Video-250}</div></div><BR>
  532. </center>
  533. {block:Video}
  534.  
  535. {block:PermalinkPage}
  536. <center>
  537. {block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}{/block:hasTags}</center>
  538.  
  539. {/block:PermalinkPage}
  540.  
  541. {block:PostNotes}{PostNotes}
  542. {/block:PostNotes}
  543. </div>
  544.  
  545. {/block:Posts}
  546. </div>
  547. </div>
  548. {block:IndexPage}
  549. {block:Pagination}
  550. <div id="pagination">
  551. {block:NextPage}
  552. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  553. {/block:NextPage}
  554. {block:PreviousPage}
  555. <a href="{PreviousPage}">&larr;&nbsp;</a>
  556. {/block:PreviousPage}
  557. </div>
  558. {/block:Pagination}
  559. {/block:IndexPage}
  560. </div>
  561.  
  562. </body>
  563. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement