silvercybermen

Theme 06: Between the Lines

Apr 14th, 2014
1,677
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.36 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4.  
  5. Theme 06: Between the Lines by lunecerise aka romulvs
  6.  
  7. -keep credit intact
  8. -don't use as a basecode
  9. -don't steal any code
  10.  
  11. -----------
  12. Updates tab credit: ocehans
  13.  
  14. -->
  15.  
  16.  
  17. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  18. <head>
  19.  
  20. <title>{Title}</title>
  21. <link rel="shortcut icon" href="{image:Favicon}">
  22. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24.  
  25.  
  26. <meta name="color:Text" content="#bbbbbb"/>
  27. <meta name="color:Background" content="#ffffff"/>
  28. <meta name="color:Link" content="#aaaaaa"/>
  29. <meta name="color:Tags" content="#cccccc"/>
  30. <meta name="color:Hover" content="#f1f1f1"/>
  31. <meta name="color:Line" content="#f2f2f2"/>
  32. <meta name="color:Border" content="#eeeeee"/>
  33. <meta name="color:Scrollbar" content="#b3b3b3"/>
  34.  
  35. <meta name="if:Updates" content="1"/>
  36.  
  37. <meta name="image:Sidebar" content=""/>
  38. <meta name="image:Favicon" content=""/>
  39.  
  40. <meta name="text:linkA" content="">
  41. <meta name="text:linkA url" content="/">
  42. <meta name="text:linkB" content="">
  43. <meta name="text:linkB url" content="/">
  44. <meta name="text:linkC" content="">
  45. <meta name="text:linkC url" content="/">
  46. <meta name="text:linkD" content="">
  47. <meta name="text:linkD url" content="/">
  48. <meta name="text:linkE" content="">
  49. <meta name="text:linkE url" content="/">
  50.  
  51. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  52. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  53. <script>
  54. (function($){
  55. $(document).ready(function(){
  56. $("[title]").style_my_tooltips({
  57. tip_follows_cursor:true,
  58. tip_delay_time:1,
  59. tip_fade_speed:100,
  60. attribute:"title"
  61. });
  62. });
  63. })(jQuery);
  64. </script>
  65.  
  66. <style type="text/css">
  67.  
  68. *, body, a, a:hover {cursor: url(http://www.totallylayouts.com/cursors/random/tiny_cursor.png), auto;}
  69.  
  70. ::-webkit-scrollbar-thumb{
  71. background-color: {color:scrollbar};
  72. border: 2px solid {color:background};
  73. width:5px;
  74. height:9px;
  75. }
  76.  
  77. ::-webkit-scrollbar {
  78. height:9px;
  79. width:11px;
  80. background-color: {color:scrollbar};
  81. border:5px solid {color:background};
  82. }
  83.  
  84.  
  85. body {
  86. background:{color:background};
  87. margin:0px;
  88. color:{color:text};
  89. font-family:Arial, Helvetica;
  90. font-size:9px;
  91. line-height:110%;
  92. }
  93.  
  94. a {
  95. text-decoration:none;
  96. -moz-outline-style:none;
  97. color:{color:link};
  98. transition:0.5s ease-in-out;
  99. -webkit-transition:0.5s ease-in-out;
  100. -moz-transition:0.5s ease-in-out;
  101. -ms-transition:0.5s ease-in-out;
  102. -o-transition:0.5s ease-in-out;
  103. }
  104.  
  105. a:hover {
  106. opacity:1;
  107. color:{color:hover};
  108. }
  109.  
  110. img {
  111. border:none;
  112. max-width:100%;
  113. }
  114.  
  115.  
  116. h1 {
  117. font-size:12px;
  118. text-transform:uppercase;
  119. line-height:110%;
  120. }
  121.  
  122. h2 {
  123. font-size:15px;
  124. line-height:110%;
  125. }
  126.  
  127. blockquote {
  128. padding-left:5px;
  129. border-left:2px solid;
  130. }
  131.  
  132. blockquote blockquote {
  133. padding-left:5px;
  134. border-left:2px solid;
  135. }
  136.  
  137. p {line-height:110%;}
  138.  
  139. li {line-height:115%;}
  140.  
  141. #caption {
  142. max-width:500px;
  143. -ms-word-break: break-all;
  144. word-break: break-all;
  145. word-break: break-word;
  146. -webkit-hyphens: auto;
  147. -moz-hyphens: auto;
  148. -ms-hyphens: auto;
  149. hyphens: auto;
  150. }
  151.  
  152. #sidebar {
  153. position:fixed;
  154. width:120px;
  155. margin-left:250px;
  156. margin-top:150px;
  157. opacity:1;
  158. height:100%;
  159. }
  160.  
  161. #sidebar:hover #sidebarimage {opacity:0;-webkit-filter:blur(3px);}
  162.  
  163. #sidebar:hover #l, #sidebar:hover #k, #sidebar:hover .links {opacity:1;}
  164.  
  165. #sidebar:hover #l, #sidebar:hover #k {margin-left:-22px;}
  166.  
  167. #sidebarimage {
  168. width: 120px;
  169. transition:0.7s ease-in-out;
  170. -webkit-transition:0.7s ease-in-out;
  171. -moz-transition:0.7s ease-in-out;
  172. -ms-transition:0.7s ease-in-out;
  173. -o-transition:0.7s ease-in-out;
  174. }
  175.  
  176. #sidebarimage img {
  177. width:120px;
  178. padding:6px;
  179. margin-left:-2px;
  180. }
  181.  
  182. #l {
  183. margin-top:-20px;
  184. margin-left:70px;
  185. opacity:0;
  186. height:1px;
  187. width:170px;
  188. background-color:#aaa;
  189. transition:0.5s ease-in-out;
  190. -webkit-transition:0.5s ease-in-out;
  191. -moz-transition:0.5s ease-in-out;
  192. -ms-transition:0.5s ease-in-out;
  193. -o-transition:0.5s ease-in-out;
  194. }
  195.  
  196. #k {
  197. margin-top:-35px;
  198. margin-left:-70px;
  199. opacity:0;
  200. height:1px;
  201. width:170px;
  202. margin-bottom:45px;
  203. background-color:#aaa;
  204. transition:0.5s ease-in-out;
  205. -webkit-transition:0.5s ease-in-out;
  206. -moz-transition:0.5s ease-in-out;
  207. -ms-transition:0.5s ease-in-out;
  208. -o-transition:0.5s ease-in-out;
  209. }
  210.  
  211. .desc {
  212. position:fixed;
  213. margin-top:10px;
  214. margin-left:0px;
  215. font-family:cambria;
  216. line-height:110%;
  217. font-size:9px;
  218. font-style:italic;
  219. width:110px;
  220. padding:9px;
  221. text-align:justify;
  222. color:{color:text};
  223. background-color:#f2f2f2;
  224. }
  225.  
  226. .desc a {color:{color:text};}
  227.  
  228. .links {
  229. position:fixed;
  230. margin-top:-50px;
  231. margin-left:-8px;
  232. width:125px;
  233. padding: 9px;
  234. word-spacing:2px;
  235. font-family:Arial, Helvetica;
  236. text-align:center;
  237. text-transform:uppercase;
  238. background-color:#f2f2f2;
  239. opacity:0;
  240. transition:0.5s ease-in-out;
  241. -webkit-transition:0.5s ease-in-out;
  242. -moz-transition:0.5s ease-in-out;
  243. -ms-transition:0.5s ease-in-out;
  244. -o-transition:0.5s ease-in-out;
  245. }
  246.  
  247. .links a {
  248. color:{color:link};
  249. font-size: 9px;
  250. transition:0.5s ease-in-out;
  251. -webkit-transition:0.5s ease-in-out;
  252. -moz-transition:0.5s ease-in-out;
  253. -ms-transition:0.5s ease-in-out;
  254. -o-transition:0.5s ease-in-out;
  255. }
  256.  
  257. .links a:hover {color:{color:Hover};}
  258.  
  259. #pagi{
  260. width:100px;
  261. font-size:8px;
  262. text-align:center;
  263. margin-left:15px;
  264. margin-top:105px;
  265. position:fixed;
  266. font-family:cambria;
  267. letter-spacing:0px;
  268. font-style:italic;
  269. }
  270.  
  271. .all {
  272. padding:10px;
  273. width:500px;
  274. margin-left:550px;
  275. margin-top:30px;
  276. font-size:10px;
  277. }
  278.  
  279. #posts {
  280. width:500px;
  281. padding-bottom:10px;
  282. margin-top:30px;
  283. background-color:{color:Post};
  284. transition-duration:0.7s;
  285. -o-transition-duration:0.7s;
  286. -ms-transition-duration:0.7s;
  287. -moz-transition-duration:0.7s;
  288. -webkit-transition-duration:0.7s;
  289. }
  290.  
  291. #posts:hover #details, #posts:hover #tags {opacity:1;}
  292.  
  293. #posts:hover #r, #posts:hover #c {-webkit-transform:none;}
  294.  
  295. #r {
  296. opacity:1;
  297. width:500px;
  298. height:1px;
  299. background-color:{color:line};
  300. -webkit-transform:rotate(1deg);
  301. margin-top:12px;
  302. transition:0.5s ease-in-out;
  303. -webkit-transition:0.5s ease-in-out;
  304. -moz-transition:0.5s ease-in-out;
  305. -ms-transition:0.5s ease-in-out;
  306. -o-transition:0.5s ease-in-out;
  307. }
  308.  
  309. #c {
  310. opacity:1;
  311. width:500px;
  312. height:1px;
  313. background-color:{color:line};
  314. -webkit-transform:rotate(-1deg);
  315. margin-top:-1px;
  316. transition:0.5s ease-in-out;
  317. -webkit-transition:0.5s ease-in-out;
  318. -moz-transition:0.5s ease-in-out;
  319. -ms-transition:0.5s ease-in-out;
  320. -o-transition:0.5s ease-in-out;
  321. }
  322.  
  323. #details {
  324. opacity:0;
  325. text-align:center;
  326. text-transform:uppercase;
  327. font-size:8px;
  328. font-style:none;
  329. padding:2px;
  330. z-index:100000;
  331. color:{color:text};
  332. transition:0.7s ease-in-out;
  333. -webkit-transition:0.7s ease-in-out;
  334. -moz-transition:0.7s ease-in-out;
  335. -ms-transition:0.7s ease-in-out;
  336. -o-transition:0.7s ease-in-out;
  337. }
  338.  
  339. #tags {
  340. opacity:0;
  341. font-family:cambria;
  342. letter-spacing:0px;
  343. text-transform:lowercase;
  344. font-size:10px;
  345. font-style:italic;
  346. margin-top:-2px;
  347. text-align:center;
  348. width:500px;
  349. transition:0.7s ease-in-out;
  350. -webkit-transition:0.7s ease-in-out;
  351. -moz-transition:0.7s ease-in-out;
  352. -ms-transition:0.7s ease-in-out;
  353. -o-transition:0.7s ease-in-out;
  354. }
  355.  
  356. #tags a {
  357. display:inline-block;
  358. padding:2px;
  359. text-align:right;
  360. color:{color:Tags};
  361. -webkit-transition: all 0.6s ease-in-out;
  362. -moz-transition: all 0.6s ease-in-out;
  363. -o-transition: all 0.6s ease-in-out;
  364. -ms-transition: all 0.6s ease-in-out;
  365. -transition: all 0.6s ease-in-out;
  366. }
  367.  
  368. #question {
  369. padding:8px;
  370. font-family:cambria;
  371. letter-spacing:2px;
  372. text-align:right;
  373. font-style:italic;
  374. border:3px {color:border} solid;
  375. color:{color:text};
  376. background-color:{color:background}
  377. }
  378.  
  379. #s-m-t-tooltip {
  380. max-width:300px;
  381. padding: 2px 5px;
  382. margin:10px 0px 0px 10px;
  383. background-color:{color:link};
  384. font-family:calibri;
  385. font-size:9.5px;
  386. font-style:bold;
  387. letter-spacing:1px;
  388. text-transform:uppercase;
  389. color:#fff;
  390. z-index:100000000;
  391. transition:0.3s ease-in-out;
  392. -webkit-transition:0.3s ease-in-out;
  393. -moz-transition:0.3s ease-in-out;
  394. -ms-transition:0.3s ease-in-out;
  395. -o-transition:0.3s ease-in-out;
  396. }
  397.  
  398. #ocehans1, #ocehans2, #ocehans3, #ocehans4 {
  399. height:13px;
  400. text-align:center;
  401. overflow:hidden;
  402. margin-top:-1px;
  403. border-bottom:1px solid #efefef;
  404. text-transform:uppercase;
  405. letter-spacing:1px;
  406. font-size:8px;
  407. line-height:10px;
  408. z-index:999999999999999999999;
  409. transition:0.5s ease-in-out;
  410. -webkit-transition:0.5s ease-in-out;
  411. -moz-transition:0.5s ease-in-out;
  412. -ms-transition:0.5s ease-in-out;
  413. -o-transition:0.5s ease-in-out;
  414. }
  415.  
  416. #ocehans2, #ocehans3, #ocehans4 {
  417. line-height:13px;
  418. margin-top:0;
  419. }
  420.  
  421. #ocehans4 {border:none;}
  422.  
  423. #ocehans1:hover{
  424. height:67px;
  425. }
  426.  
  427. #ocehans2:hover{
  428. height:60px;
  429. }
  430.  
  431. #ocehans3:hover{
  432. height:135px;
  433. }
  434.  
  435. #ocehans4:hover{
  436. height:145px;
  437. }
  438.  
  439. #ocehans{
  440. text-align:left;
  441. font-size:8px;
  442. text-transform:uppercase;
  443. opacity:0.8;
  444. position:fixed;
  445. font-family:calibri;
  446. left:14px;
  447. background-color:#fff;
  448. letter-spacing:1px;
  449. width:90px;
  450. z-index:9999;
  451. padding:4px;
  452. top:14px;
  453. }
  454.  
  455. #credit, #credit a {
  456. position:fixed;
  457. bottom:5px;
  458. right:5px;
  459. padding:5px 4px;
  460. font-family:helvetica;
  461. text-transform:uppercase;
  462. color:#ccc;
  463. font-size:9px;
  464. transition:0.3s ease-in-out;
  465. -webkit-transition:0.3s ease-in-out;
  466. -moz-transition:0.3s ease-in-out;
  467. -ms-transition:0.3s ease-in-out;
  468. -o-transition:0.3s ease-in-out;
  469. }
  470.  
  471. #credit:hover, #credit a:hover {
  472. font-family:helvetica;
  473. color:#000;
  474. background-color:#fff;
  475. text-shadow:#aaa 2px 2px 0.2em;
  476. }
  477.  
  478. {CustomCSS}</style></head><body>
  479.  
  480. {block:ifUpdates}
  481. <div id="ocehans">
  482. <center>
  483. <div id="ocehans1">
  484. <div style="font-size:8px;">title 1</div> <div style="padding-top:1px; text-transform:uppercase; opacity:.9; font-family: calibri; font-size:8px; line-height:10px; text-align:center; color:#b9b9b9;">
  485. text 1 here<br>
  486. <b>Bold.</b> <i>Italic.</i> <strike>Strikethrough.</strike>
  487. <br><br>
  488. </div>
  489. </div>
  490.  
  491. <div id="ocehans2">
  492. <div style="font-size:8px;">title 2</div> <div style="padding-top:1px; text-transform:uppercase; opacity:.9; font-family: calibri; font-size:8px; line-height:10px; text-align:center; color:#b9b9b9;">
  493. text 2 here
  494.  
  495. </div></div>
  496.  
  497. <div id="ocehans3">
  498. <div style="font-size:8px;">title 3</div> <div style="padding-top:1px; text-transform:uppercase; opacity:.9; font-family: calibri; font-size:8px; line-height:10px; text-align:center; color:#b9b9b9;">
  499. text 3 here
  500. <br><br>
  501. </div>
  502. </div>
  503.  
  504. <div id="ocehans4">
  505. <div style="font-size:8px;">title 4</div> <div style="padding-top:1px; text-transform:uppercase; opacity:.9; font-family: calibri; font-size:8px; line-height:10px; text-align:center; color:#b9b9b9;">
  506. text 4 here
  507. </div></div>
  508. </div></div></div></div>
  509. {/block:ifUpdates}
  510.  
  511. <div id="sidebar">
  512. <div id="sidebarimage"><img src="{image:sidebar}"></div>
  513. <div class="links">
  514. {block:IfLinkA}<a href="{text:linkA url}" title="{text:linkA}">I . </a>{/block:IfLinkA}
  515. {block:IfLinkB}<a href="{text:linkB url}" title="{text:linkB}">II</a>{/block:IfLinkB}
  516. {block:IfLinkC}<a href="{text:linkC url}" title="{text:linkC}"> . III</a>
  517. {/block:IfLinkC}
  518. {block:IfLinkD}
  519. <a href="{text:linkD url}" title="{text:linkD}"> . IV</a>{/block:IfLinkD}
  520. {block:IfLinkE}
  521. <a href="{text:linkE url}" title="{text:linkE}"> . V</a>{/block:IfLinkE}
  522. </div>
  523. <div id="l"></div><div id="k"></div>
  524. <br>
  525. <div class="desc">
  526. {Description}
  527. </div>
  528. <br><br>
  529. {block:Pagination}<div id="pagi">
  530. {block:PreviousPage}<a href="{PreviousPage}">— back</a>&nbsp;&nbsp;{/block:PreviousPage}
  531. {block:JumpPagination length="3"}
  532. {block:CurrentPage}<span class="current_page">{PageNumber}</span>&nbsp;&nbsp;{/block:CurrentPage}
  533. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>&nbsp;&nbsp;{/block:JumpPage}
  534. {/block:JumpPagination}
  535. {block:NextPage}<a href="{NextPage}">there —</a>{/block:NextPage}
  536. </div>{/block:Pagination}
  537.  
  538. </div>
  539.  
  540. <div class="all">{block:Posts}<div id="posts">
  541.  
  542. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  543.  
  544. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  545.  
  546. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  547.  
  548. {block:Photoset}{Photoset-500}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  549.  
  550. {block:Quote}<h2 style="text-shadow:2px 2px 0px #f1f1f1;">“{Quote}”</h2><br> <span style="text-align:right;">—{Source}</span>{/block:Quote}
  551.  
  552. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="80px" height="80px" align="left" style="margin-right:10px" />{/block:AlbumArt}<span class="audio">{AudioPlayerWhite}</left></span>
  553. <span style="line-height:120%">
  554. <br>{block:TrackName}<b>Title:</b> {TrackName}{/block:TrackName}
  555. <br>{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}
  556. {/block:ExternalAudio}<br><b>Played:</b> {PlayCount} times <br>
  557. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}</span>
  558. {/block:Audio}
  559.  
  560. {block:Video}{Video-500}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Video}
  561.  
  562. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}<span style="line-height:125%">{block:Label}<b>{Label}</b>{/block:Label} {Line}</span><br>{/block:Lines}{/block:Chat}
  563.  
  564. {block:Answer}<div id="question"><span style="text-transform:uppercase;font-size:9px;font-style:italic;">— {Asker}: </span>{Question}</div><left> <font face="cambria">{Answer}</font>{/block:Answer}
  565.  
  566. <div id="r"></div><div id="c"></div>
  567.  
  568. <div id="details">
  569. <br>{block:Date}<a href="{Permalink}">{ShortMonth} {DayOfMonthWithZero}</a> {/block:Date}{block:RebloggedFrom}&emsp;<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}{block:ContentSource}&emsp;<a href="{SourceURL}" title="{SourceTitle}" title="{SourceName}">©</a> {/block:ContentSource}&emsp;<a href="{Permalink}">{NoteCountWithLabel}</a></div>
  570. {block:HasTags}<div id="tags">{block:Tags} x<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div>
  571. {/block:Posts}
  572. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  573. {/block:Posts}</div></div>
  574. </div></div>
  575.  
  576. <div id="credit"><a href="http://lunecerise.co.vu" title="Lunecerise">LC</a></div>
  577.  
  578.  
  579. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment