Advertisement
loullipops

THEME 22~ DRIFTING AWAY by loullipops

Jun 15th, 2013
174
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.28 KB | None | 0 0
  1. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  2.  
  3. <!-- THEME BY LOULLIPOPS,
  4. REMOVE CREDIT AND I'LL FIND YOU.
  5. I SWEAR.-->
  6.  
  7. <head>
  8.  
  9.  
  10. <meta name="color:bg" content="#FFFFFF">
  11. <meta name="color:link" content="#E6E4E4">
  12. <meta name="color:hover" content="#454545">
  13. <meta name="color:infobg" content="#FCFCFC">
  14. <meta name="color:text" content="#9A9A9A">
  15. <meta name="color:tags" content="#EDEDED">
  16. <meta name="color:scrollbar" content="#D6D5D5">
  17. <meta name="color:border" content="#FAFAFA">
  18.  
  19. <meta name="image:sidebar" content=""/>
  20. <meta name="image:top" content=""/>
  21.  
  22. <meta name="text:linkA" content="">
  23. <meta name="text:linkA url" content="/">
  24. <meta name="text:linkB" content="">
  25. <meta name="text:linkB url" content="/">
  26. <meta name="text:linkC" content="">
  27. <meta name="text:linkC url" content="/">
  28. <meta name="text:linkD" content="">
  29. <meta name="text:linkD url" content="/">
  30. <meta name="text:quote" content="">
  31. <meta name="text:border style" content="">
  32.  
  33. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  34. <title>{Title}</title> {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  35. <link rel="shortcut icon" href="{Favicon}" />
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  37. <script src="//use.edgefonts.net/monoton.js"></script>
  38. <script src="//use.edgefonts.net/niconne.js"></script>
  39.  
  40.  
  41.  
  42.  
  43. <style type="text/css">
  44.  
  45. #bite
  46. #bite a{
  47. }
  48. #bite .death {
  49. filter: alpha(opacity = 0);
  50. margin-top:-500px;
  51. opacity:0;-webkit-transition: all 0.5s ease-in;
  52. -moz-transition: all .5s ease-in;transition: all .5s ease-in;
  53. }
  54.  
  55. #bite:hover .death {
  56. margin-top:-300px;
  57. opacity:1;
  58. }
  59.  
  60. #bite2
  61. #bite2 a{
  62. }
  63. #bite2 .death2 {
  64. filter: alpha(opacity = 0);
  65. margin-top:-500px;
  66. opacity:0;-webkit-transition: all 0.5s ease-in;
  67. -moz-transition: all .5s ease-in;transition: all .5s ease-in;
  68. }
  69.  
  70. #bite2:hover .death2 {
  71. margin-top:0px;
  72. opacity:1;
  73. }
  74.  
  75.  
  76.  
  77. <style type="text/css">
  78.  
  79.  
  80. iframe#tumblr_controls {
  81. white-space:nowrap;
  82. -webkit-filter: invert(100%);
  83. -moz-filter: invert(100%);
  84. -o-filter: invert(100%);
  85. -ms-filter: invert(100%);
  86. filter: invert(100%);
  87. opacity:.2;
  88. transition: .8s ease-in-out;
  89. -webkit-transition: .8s ease-in-out;
  90. -moz-transition: .8s ease-in-out;
  91. -o-transition: .8s ease-in-out;
  92. }
  93.  
  94.  
  95. iframe#tumblr_controls {
  96. white-space:nowrap;
  97. -webkit-filter: invert(100%);
  98. -moz-filter: invert(100%);
  99. -o-filter: invert(100%);
  100. -ms-filter: invert(100%);
  101. filter: invert(100%);
  102. opacity:.2;
  103. transition: .8s ease-in-out;
  104. -webkit-transition: .8s ease-in-out;
  105. -moz-transition: .8s ease-in-out;
  106. -o-transition: .8s ease-in-out;
  107. }
  108.  
  109. a {
  110. color:{color:link};
  111. text-decoration:none;
  112. -moz-transition-duration:0.5s;
  113. -webkit-transition-duration:0.5s;
  114. -o-transition-duration:0.5s;
  115. }
  116.  
  117. a:hover {
  118. color:{color:hover};
  119. text-decoration:none;
  120. -moz-transition-duration:0.5s;
  121. -webkit-transition-duration:0.5s;
  122. -o-transition-duration:0.5s;
  123. }
  124.  
  125.  
  126. ::-webkit-scrollbar {background-color:{color:infobg}; height:8px; width:5px}
  127. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:50px}
  128. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar}; height:8px!important}
  129.  
  130. body {
  131. background-color:{color:bg};
  132. font-family:cambria;
  133. font-weight:light;
  134. }
  135.  
  136.  
  137.  
  138.  
  139. h1 {
  140. font-weight:normal;
  141. font-size:10px;
  142. text-align:center;
  143. font-style:normal;
  144. line-height:80%;
  145. letter-spacing:1px;
  146. text-transform:lowercase;
  147. color:{color:text};
  148. }
  149.  
  150. h2 {
  151. font-size:15px;
  152. text-align:center;
  153. line-height:100%;
  154. letter-spacing:-0.5px;
  155. color:{color:text};
  156. font-weight:normal;
  157. padding:5px;
  158. padding-bottom:2px;
  159. }
  160.  
  161.  
  162. blockquote {
  163. border-left:2px solid {color:text};
  164. padding-left:5px;
  165. margin:5px;
  166. }
  167.  
  168. #theme {
  169. background-color:{color:bg};
  170. width:700px;
  171. margin: 0 auto -12px auto;
  172. text-align: center;
  173. }
  174.  
  175. #sidebar {
  176. color:{color:text};
  177. position:fixed;
  178. width:100px;
  179. height:auto;
  180. margin-top:40px;
  181. text-align:left;
  182. }
  183.  
  184. #sidebar img {
  185. width:100px;
  186. height:100px;
  187. margin-bottom:10px;
  188. margin-left:-50px;
  189. }
  190.  
  191. #top {
  192. font-size:11px;
  193. width:620px;
  194. height:130px;
  195. letter-spacing:3px;
  196. font-family:cambria;
  197. text-align:center;
  198. text-transform:uppercase;
  199. position:fixed;
  200. margin-top:0px;
  201. color:#fff;
  202. margin-left:150px;
  203. margin-top:-295px;
  204. background-color:{color:bg};
  205. border: 1px {text:border style} #d8d8d8;
  206. }
  207.  
  208. #top a{
  209. margin-top:0px;
  210. -webkit-transition: all 1s ease-out;
  211. -moz-transition: all 1s ease-out;
  212. transition: all 1s ease-out;
  213. filter: alpha(opacity = 100);
  214. filter: alpha(opacity = 100);
  215. opacity:100;
  216. }
  217.  
  218. #top img{
  219. width:600px;
  220. height:120px;
  221. margin-bottom:10px;
  222. margin-left:0px;
  223. }
  224.  
  225. .links {
  226. width:100px;
  227. display:block;
  228. height:150px;
  229. margin-top:490px;
  230. font-size:8px;
  231. text-transform:lowercase;
  232. font-family:cambria;
  233. text-align:center;
  234. letter-spacing:2px;
  235. word-spacing:40px;
  236. margin-left:-201px;
  237. line-height:200%;
  238. }
  239.  
  240. .links a{
  241. line-height:200%;
  242. display:block;
  243. color:{color:link};
  244. background-color:#fff;
  245. letter-spacing:0px;
  246. text-decoration:none;
  247. -moz-transition-duration:1s;
  248. -webkit-transition-duration:1s;
  249. -o-transition-duration:1s;
  250. }
  251.  
  252. .links a:hover{
  253. font-style:italic;
  254. line-height:200%
  255. color:{color:hover};
  256. background-color:#fff
  257. -moz-transition-duration:1s;
  258. -webkit-transition-duration:1s;
  259. -o-transition-duration:1s;
  260. }
  261.  
  262. .links:hover{
  263. -moz-transition-duration:1s;
  264. -webkit-transition-duration:1s;
  265. -o-transition-duration:1s;
  266. }
  267.  
  268. .text {
  269. font-size:12px;
  270. text-transform:lowercase;
  271. text-align:center;
  272. opacity:1;
  273. word-spacing:2px;
  274. line-height:200%;
  275. font-style:italic;
  276. margin-top:23px;
  277. color:{color:text}
  278. }
  279.  
  280. .text:hover {
  281. font-size:15px;
  282. text-align:center;
  283. opacity:1;
  284. word-spacing:2px;
  285. line-height:200%;
  286. margin-top:23px;
  287. color:{color:text}
  288. }
  289.  
  290. .desc {
  291. padding-top:0px;
  292. text-align:center;
  293. text-transform:lowercase;
  294. margin-top:-105px;
  295. margin-left:40px;
  296. opacity:0.8;
  297. background-color:#fff;
  298. width:250px;
  299. font-size:9px;
  300. color:{color:text};
  301. letter-spacing:1px;
  302. line-height:150%;
  303. }
  304.  
  305. .desc a {
  306. color:{color:link};
  307. }
  308.  
  309. #title {
  310. padding-top:0px;
  311. text-align:center;
  312. text-transform:none;
  313. font-family: cambria;
  314. font-style:italic;
  315. letter-spacing:.5px;
  316. margin-top:67px;
  317. margin-left:-200px;
  318. opacity:0.8;
  319. width:100px;
  320. font-size:15px;
  321. color:{color:text};
  322. line-height:150%;
  323. }
  324.  
  325. #quote a {
  326. color:{color:link};
  327. }
  328.  
  329. #quote {
  330. padding-top:0px;
  331. text-align:center;
  332. text-transform:none;
  333. font-family: cambria;
  334. font-style:italic;
  335. margin-top:-142px;
  336. margin-left:325px;
  337. opacity:0.8;
  338. width:200px;
  339. font-size:30px;
  340. background-color:#fff;
  341. opacity:0.8;
  342. color:{color:text};
  343. letter-spacing:.5px;
  344. line-height:150%;
  345. }
  346.  
  347. #title a {
  348. color:{color:link};
  349. }
  350.  
  351. #pagi {
  352. opacity:.8;
  353. font-family:cambria;
  354. font-style:italic;
  355. font-size:12px;
  356. width:600px;
  357. height:15px;
  358. text-align:center;
  359. text-transform:none;
  360. letter-spacing:2px;
  361. margin-left:150px;
  362. margin-top:140px;
  363. left:0px;
  364. padding:10px;
  365. background:#fff;
  366. color:{color:text};
  367. }
  368.  
  369. #pagi:hover{
  370. background-color:#454545;
  371. all 0.5s ease-out;
  372. -moz-transition: all .5s ease-out;transition: all .5s ease-out;
  373. }
  374.  
  375.  
  376.  
  377. #stuffcontainer {
  378. float:left;
  379. margin-left:200px;
  380. margin-top:0px;
  381. text-align:justify;
  382. background-color:{color:bg};
  383. color:{color:text};
  384. margin-bottom: 35px;
  385. }
  386.  
  387.  
  388. #stuff {
  389. width:500px;
  390. margin-top:15px;
  391. text-align:justify;
  392. font-size:11px;
  393. line-height:170%;
  394. letter-spacing:0x;
  395. color:{color:text};
  396. }
  397.  
  398.  
  399. .caption {
  400. width:500px;
  401. text-align:justify;
  402. line-height:120%;
  403. }
  404.  
  405. .ask {
  406. padding:10px;
  407. text-align:left;
  408. color:{color:text};
  409. background-color:{color:infobg};
  410. border-bottom:1px solid {color:border};
  411. border-right:1px solid {color:border};
  412. }
  413.  
  414. .ans {
  415. text-align:left;
  416. padding:10px;
  417. color:{color:text};
  418. }
  419.  
  420. .audio {
  421. width:500px;
  422. padding-bottom:10px;
  423. background-color:{color:infobg};
  424. }
  425.  
  426. .albumart {
  427. float:left;
  428. padding:0px 10px 10px 0px;
  429. }
  430.  
  431. .albumart img {
  432. width:45px;
  433. height:45px;
  434. }
  435.  
  436. .playercontainer {
  437. text-align:left;
  438. padding:10px;
  439. background-color:#ffffff;
  440. width:480px;
  441. }
  442.  
  443. .audioinfo {
  444. padding:10px;
  445. color:{color:text};
  446. }
  447.  
  448. #postinfo {
  449. width:490px;
  450. padding:5px;
  451. font-size:8px;
  452. color:{color:link};
  453. text-transform:lowercase;
  454. font-style:normal;
  455. letter-spacing:2px;
  456. text-align:left;
  457. border-bottom:1px solid {color:border};
  458. -moz-transition-duration:0.5s;
  459. -webkit-transition-duration:0.5s;
  460. -o-transition-duration:0.5s;
  461. }
  462.  
  463. #postinfo a {
  464. color:{color:link};
  465. text-align:center;
  466. letter-spacing:1px;
  467. font-style:normal;
  468. }
  469.  
  470. #postinfo a:hover {
  471. color:{color:hover};
  472. }
  473.  
  474. .note {
  475. text-transform:lowercase;
  476. font-style:normal;
  477. letter-spacing:0px;
  478. font-size: 9px;
  479. text-align:left;
  480. line-height:90%;
  481. margin-left:-40px;
  482. }
  483.  
  484. .note li {
  485. list-style-type:none;
  486. border-bottom:1px solid {color:border};
  487. padding:10px 25px 10px 25px;
  488. text-align:left;
  489. margin:0px;
  490. -moz-transition-duration:0.5s;
  491. -webkit-transition-duration:0.5s;
  492. -o-transition-duration:0.5s;
  493. }
  494.  
  495. .tags {
  496. font-style:normal;
  497. width:500px;
  498. text-transform:lowercase;
  499. font-style:normal;
  500. color:{color:tags};
  501. letter-spacing:2px;
  502. line-height:120%;
  503. font-size:8px;
  504. text-align:left;
  505. padding:2px;
  506. -moz-transition-duration:0.5s;
  507. -webkit-transition-duration:0.5s;
  508. -o-transition-duration:0.5s;
  509. }
  510.  
  511. .tags a {
  512. color:{color:tags};
  513. letter-spacing:1px;
  514. padding:1px;
  515. }
  516.  
  517. .tags a:hover {
  518. color:{color:link};
  519. }
  520.  
  521. ul.chat, .chat ol, .chat li {
  522. list-style:none;
  523. margin:0px;
  524. padding:2px;
  525. }
  526.  
  527. .label {
  528. text-decoration:underline;
  529. font-weight:700;
  530. background-color:{color:infobg};
  531. margin-right:5px;
  532. }
  533.  
  534.  
  535. #credit {
  536. position:fixed;
  537. font-size:8px;
  538. font-weight:normal;
  539. line-height:150%;
  540. letter-spacing:2px;
  541. right:-80px;
  542. bottom:30px;
  543.  
  544. text-transform:uppercase;
  545. text-align:center;
  546. -moz-transition-duration:0.5s;
  547. -webkit-transition-duration:0.5s;
  548. -o-transition-duration:0.5s;
  549. }
  550.  
  551. #credit a {
  552. padding:3px;
  553. color:{color:link};
  554. border: 1px solid {color:border};
  555. background-color:white;
  556. -moz-transition-duration:0.5s;
  557. -webkit-transition-duration:0.5s;
  558. -o-transition-duration:0.5s;
  559. }
  560.  
  561. #credit:hover {
  562. right:5px;
  563. color:{color:link}
  564. -moz-transition-duration:0.5s;
  565. -webkit-transition-duration:0.5s;
  566. -o-transition-duration:0.5s;
  567. }
  568.  
  569.  
  570. {CustomCSS}
  571.  
  572.  
  573. </style></head>
  574.  
  575. <body>
  576. <div id="theme">
  577. <div id="bite">
  578. <div id="sidebar">
  579. <img src="{image:sidebar}">
  580. <div id="bite2">
  581. <div id="top">
  582. <img src="{image:top}">
  583. <div class="desc">
  584. {Description}
  585. </div>
  586. <div id="title">
  587. {Title}
  588. </div>
  589. <div id="quote">
  590. {text:quote}
  591. </div>
  592. <div class="death">
  593. <div class="links">
  594. {block:IfLinkA}
  595. <a href="{text:linkA url}">{text:linkA}</a>
  596. {/block:IfLinkA}
  597. {block:IfLinkB}
  598. <a href="{text:linkB url}">{text:linkB}</a>
  599. {/block:IfLinkB}
  600. {block:IfLinkC}
  601. <a href="{text:linkC url}">{text:linkC}</a>
  602. {/block:IfLinkC}
  603. {block:IfLinkD}
  604. <a href="{text:linkD url}">{text:linkD}</a>
  605. {/block:IfLinkD}
  606. <div class="text">
  607. </div></div></div></div></div>
  608.  
  609. </div>
  610. <div class="death2">
  611. <div id="pagi">
  612. {block:Pagination}
  613. {block:PreviousPage}
  614. <a href="{PreviousPage}">jump</a>
  615. {/block:PreviousPage}
  616. {/block:Pagination}
  617.  
  618. {block:JumpPagination length="5"}
  619. {block:CurrentPage}
  620. <span class="current_page">{PageNumber}</span>
  621. {/block:CurrentPage}
  622. {block:JumpPage}
  623. <a class="jump_page" href="{URL}">{PageNumber}</a>
  624. {/block:JumpPage}
  625. {/block:JumpPagination}
  626.  
  627. {block:Pagination}
  628. {block:NextPage}
  629. <a href="{NextPage}">fall</a>
  630. {/block:NextPage}
  631. {/block:Pagination}
  632. </div></div>
  633.  
  634.  
  635. <div id="stuffcontainer">
  636.  
  637. {block:Posts}
  638.  
  639. <div id="stuff">
  640.  
  641. {block:Text}{block:Title}<h2>{Title}</h2>{/block:Title}{Body}{/block:Text}
  642.  
  643. {block:Quote}<h2>“{Quote}”</h2><h1>{Source}</h1>{/block:Quote}
  644.  
  645. {block:Link}<a href="{URL}"><h2>{Name}</h2></a>
  646. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  647.  
  648. {block:Photo}<center><img src="{PhotoURL-500}"/></center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  649.  
  650. {block:Photoset}<center>{Photoset-500}</center>
  651. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  652.  
  653. {block:Chat}<ul class="chat">{block:Title}<h2>{Title}</h2>{/block:Title}{block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  654.  
  655. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  656.  
  657. {block:Answer}<div class="ask">
  658. <big><big>❝ <em>{Question}</em> ❞</big></big><p>
  659. - <em>{Asker}</em>
  660. </div>
  661. <div class="ans">{Answer}</div>{/block:answer}
  662.  
  663. {block:Audio}<div class="audio">{block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"/></div>{/block:AlbumArt}
  664. <div class="audioinfo">{block:TrackName}<b>title:</b> {TrackName}<br />{/block:TrackName}{block:Artist}<b>artist:</b> {Artist}<br />{/block:Artist}
  665. {/block:ExternalAudio}<b>played:</b> {PlayCount} times</div>
  666. <br><div class="playercontainer">{AudioPlayerWhite}</div></div>
  667. {block:Caption}{Caption}{/block:Caption}<br>{/block:Audio}
  668.  
  669. {block:Date}<div id="postinfo">{MonthNumberWithZero}/{DayOfMonthWithZero} | <a href="{Permalink}">{24Hour}:{Minutes}</a>{block:NoteCount} | <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom} | <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  670. {block:ContentSource} | <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}</div>{/block:Date}
  671. {block:HasTags}
  672. <div class="tags">
  673. {block:Tags}<a href="{TagURL}">{Tag}, </a>{/block:Tags}</div>
  674. {/block:HasTags}
  675. <div class="note">
  676. {block:PostNotes}{PostNotes}{/block:PostNotes}
  677. </div>
  678. </div>
  679. {/block:Posts}
  680.  
  681.  
  682. </div>
  683.  
  684. </div>
  685. </div>
  686. </div>
  687.  
  688. <script src="http://platform.tumblr.com/v1/share.js"></script>
  689.  
  690. <div id="credit"><a href="http://loullipops.tumblr.com/">❥LT&nbsp;<b>loullipops</b> </a></div>
  691.  
  692. <p>
  693.  
  694. </body>
  695. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement