API tools faq
paste
meteora

Theme | Welcome to Paradise

meteora
Jun 27th, 2014
7,988
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.76 KB | None | 0 0
raw download clone embed print report
  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 4: Welcome to Paradise © Meteora Themes │
  6.  
  7. + If you have any problems, don't hesitate to contact me! I will
  8. do my best to help with the problem.
  9. + Heavy/Light CSS and HTML Editing is allowed and encouraged, just
  10. make sure my credits remain intact.
  11. + Don't Claim any part of my code as your own, and definitely don't
  12. redistribute the code in whole or in part.
  13.  
  14. ------------------------------------------------------------------------>
  15.  
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  18. <title>{Title}</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21. {block:Description}
  22. <meta name="description" content="{MetaDescription}" />
  23. {/block:Description}
  24.  
  25. <!-- VARIABLES -->
  26.  
  27. <meta name="image:Background" content=""/>
  28. <meta name="image:Content Background" content=""/>
  29. <meta name="image:Top" content=""/>
  30. <meta name="image:Sidebar" content=""/>
  31. <meta name="image:Music Player GIF" content="http://media.tumblr.com/tumblr_m7w2izzY0j1r6o8v2.gif"/>
  32.  
  33. <meta name="color:Background" content="#fdf3ee" />
  34. <meta name="color:Content Background" content="#aaa"/>
  35. <meta name="color:Line 1" content="#aaa"/>
  36. <meta name="color:Line 2" content="#aaa"/>
  37. <meta name="color:Title" content="#fff"/>
  38. <meta name="color:Shadow" content="#aaa"/>
  39. <meta name="color:Blockquote" content="#333"/>
  40. <meta name="color:Text" content="#beb3a4" />
  41. <meta name="color:Bold" content="#809729" />
  42. <meta name="color:Italic" content="#809729" />
  43. <meta name="color:Link" content="#a09280" />
  44. <meta name="color:Link Hover" content="#aaa"/>
  45. <meta name="color:Content BG" content="#ffffff" />
  46. <meta name="color:Question BG" content="#aaa"/>
  47. <meta name="color:Info" content="#000"/>
  48. <meta name="color:Info Link" content="#aaa"/>
  49. <meta name="color:Info Line" content="#aaa"/>
  50. <meta name="color:Selection Background" content="#333"/>
  51. <meta name="color:Selection Text" content="#fff"/>
  52. <meta name="color:Scrollbar Background" content="#fff"/>
  53. <meta name="color:Scrollbar Thumb" content="#333"/>
  54. <meta name="color:Scrollbar Line" content="#333"/>
  55. <meta name="color:Hover Title BG" content="#000"/>
  56. <meta name="color:Hover Title Text" content="#fff"/>
  57. <meta name="color:Chat Odd Background" content="#aaa"/>
  58. <meta name="color:Chat Odd Text" content="#333"/>
  59. <meta name="color:Chat Even Background" content="#fff"/>
  60. <meta name="color:Chat Even Text" content="#333"/>
  61. <meta name="color:Chat Odd Name" content="#333"/>
  62. <meta name="color:Chat Even Name" content="#333"/>
  63. <meta name="color:Icon" content="#aaa"/>
  64. <meta name="color:Icon Hover" content="#000"/>
  65. <meta name="color:Icon Shadow" content="#000"/>
  66. <meta name="color:Icon Shadow Hover" content="#aaa"/>
  67. <meta name="color:Custom Link BG" content="#aaa"/>
  68. <meta name="color:Custom Link BG Hover" content="#fff"/>
  69. <meta name="color:Custom Link" content="#fff"/>
  70. <meta name="color:Custom Link Hover" content="#aaa"/>
  71. <meta name="color:Pagination Bar" content="#aaa"/>
  72. <meta name="color:Pagination Text" content"#000"/>
  73.  
  74. <meta name="text:Title" content="Title here"/>
  75.  
  76. <meta name="text:Text Size" content="10" />
  77. <meta name="text:Info Symbol" content="✖"/>
  78. <meta name="text:Nav Icon 1" content="♚"/>
  79. <meta name="text:Nav Icon 2" content="♔"/>
  80. <meta name="text:Nav Margin Left" content="86"/>
  81. <meta name="text:Navigation Title" content="Navigation"/>
  82.  
  83. <meta name="text:Custom Link 1" content="Custom Link 1"/>
  84. <meta name="text:Link 1 URL" content="/"/>
  85. <meta name="text:Custom Link 2" content="Custom Link 2"/>
  86. <meta name="text:Link 2 URL" content="/"/>
  87. <meta name="text:Custom Link 3" content="Custom Link 3"/>
  88. <meta name="text:Link 3 URL" content="/"/>
  89. <meta name="text:Custom Link 4" content="Custom Link 4"/>
  90. <meta name="text:Link 4 URL" content="/"/>
  91. <meta name="text:Custom Link 5" content="Custom Link 5"/>
  92. <meta name="text:Link 5 URL" content="/"/>
  93. <meta name="text:Custom Link 6" content="Custom Link 6"/>
  94. <meta name="text:Link 6 URL" content="/"/>
  95. <meta name="text:Custom Link 7" content="Custom Link 7"/>
  96. <meta name="text:Link 7 URL" content="/"/>
  97. <meta name="text:Custom Link 8" content="Custom Link 8"/>
  98. <meta name="text:Link 8 URL" content="/"/>
  99. <meta name="text:Custom Link 9" content="Custom Link 9"/>
  100. <meta name="text:Link 9 URL" content="/"/>
  101. <meta name="text:Custom Link 10" content="Custom Link 10"/>
  102. <meta name="text:Link 10 URL" content="/"/>
  103.  
  104. <meta name="text:Billy Music Player" content="Music Code here"/>
  105.  
  106. <meta name="if:400 Posts" content="1"/>
  107. <meta name="if:500 Posts" content="0"/>
  108. <meta name="if:Fading Images" content="1"/>
  109. <meta name="if:Monochrome Posts" content="0"/>
  110. <meta name="if:Hover Tags" content="0"/>
  111. <meta name="if:White Audio Player" content="1"/>
  112. <meta name="if:Black Audio Player" content="0"/>
  113. <meta name="if:Music Player" content="1"/>
  114. <meta name="if:Search" content="1"/>
  115.  
  116. <meta name="if:Link1" content="1"/>
  117. <meta name="if:Link2" content="1"/>
  118. <meta name="if:Link3" content="1"/>
  119. <meta name="if:Link4" content="1"/>
  120. <meta name="if:Link5" content="1"/>
  121. <meta name="if:Link6" content="1"/>
  122. <meta name="if:Link7" content="1"/>
  123. <meta name="if:Link8" content="1"/>
  124. <meta name="if:Link9" content="1"/>
  125. <meta name="if:Link10" content="1"/>
  126.  
  127. <link href='http://fonts.googleapis.com/css?family=everafter:400,100' rel='stylesheet' type='text/css'>
  128.  
  129. <script type="text/javascript"
  130. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  131. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  132. <script>
  133. (function($){
  134. $(document).ready(function(){
  135. $("[title]").style_my_tooltips();
  136. });
  137. })(jQuery);
  138. </script>
  139.  
  140. <style type="text/css">
  141.  
  142. @font-face {
  143. font-family: 'autumn';
  144. src: url('http://static.tumblr.com/hmlq09x/b74n7sw73/colors_of_autumn.ttf') format('truetype');
  145. font-weight: normal;
  146. font-style: normal;
  147. }
  148.  
  149. @font-face {
  150. font-family: 'silkscreen';
  151. src: url('http://static.tumblr.com/hmlq09x/Wrjn7tie6/slkscr.ttf') format('truetype');
  152. font-weight: normal;
  153. font-style: normal;
  154. }
  155.  
  156. @font-face {
  157. font-family: 'everafter';
  158. src: url('http://static.tumblr.com/hmlq09x/cRvn7u4dw/everafte.ttf') format('truetype');
  159. font-weight: normal;
  160. font-style: normal;
  161. }
  162.  
  163. /* MAIN */
  164.  
  165. ::-moz-selection, mark {background:{color:Selection Background};color:{color:Selection Text};}
  166. ::selection {color:{color:Selection Text};background:{color:Selection Background}!important;}
  167.  
  168. ::-webkit-scrollbar-thumb {
  169. background-color: {color:Scrollbar Thumb};
  170. height: 50px;
  171. border-bottom:none;
  172. }
  173. ::-webkit-scrollbar {
  174. height: 0px;
  175. width:5px;
  176. background-color:{color:Scrollbar Background};
  177. border: 2px solid {color:Scrollbar Background};
  178.  
  179. }
  180.  
  181. #s-m-t-tooltip {
  182. display: block;
  183. background:{color:Hover Title BG};
  184. font-size: 8px;
  185. font-family:'silkscreen';
  186. letter-spacing: 1px;
  187. text-transform: uppercase;
  188. color:{color:Hover Title Text};
  189. text-align: center;
  190. margin-left: 18px;
  191. padding: 4px;
  192. min-width: 20px;
  193. max-width: 200px;
  194. box-shadow: 1px 1px 1px rgba(60, 60, 60, 0.3);
  195. z-index: 99999;
  196. }
  197.  
  198. body {
  199. background-color:{color:Background};
  200. background-image: url('{image:Background}');
  201. background-attachment:fixed;
  202. background-repeat:repeat;
  203. color:{color:Text};
  204. font-family: arial;
  205. font-size: {text:Text Size}px;
  206. margin: 0px;
  207. padding: 0px;
  208. }
  209.  
  210. pre {
  211. font-family:arial;
  212. font-size:8px;
  213. color:{color:Text};
  214. background-color:{color:Info BG};
  215. padding:10px;
  216. padding-left:15px;
  217. padding-right:15px;
  218. background-color:{color:question bg};
  219. word-wrap: break-word;
  220. }
  221.  
  222. a:link, a:active {
  223. text-decoration:none;
  224. color: {color:Link};
  225. -moz-transition-duration: 0.6s;
  226. -webkit-transition-duration: 0.6s;
  227. -o-transition-duration: 0.6s;
  228. }
  229.  
  230. a:visited {
  231. text-decoration:none;
  232. color: {color:Link};
  233. -moz-transition-duration: 0.6s;
  234. -webkit-transition-duration: 0.6s;
  235. -o-transition-duration: 0.6s;
  236. }
  237.  
  238. a:hover {
  239. text-decoration:none;
  240. color: {color:Link Hover};
  241. text-decoration: line-through;
  242. }
  243.  
  244. b, strong, .strong {color:{color:Bold};}
  245.  
  246. blockquote {
  247. margin-left:15px;
  248. border-left:2px solid {color:Blockquote};
  249. padding-left:10px;
  250. }
  251.  
  252. #tumblr_controls{ position:fixed!important; right: 0px; top:0px;}
  253.  
  254. i, em, .em {color:{color:Italic};}
  255.  
  256. .content img {
  257. {block:iffadingimages}opacity: 0.8;{/block:iffadingimages}
  258. {block:IfMonochromePosts}
  259. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  260. filter: gray; /* IE6-9 */
  261. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  262. {/block:IfMonochromePosts}
  263. transition-duration: 0.6s;
  264. -moz-transition-duration: 0.6s;
  265. -webkit-transition-duration: 0.6s;
  266. -o-transition-duration: 0.6s;
  267. }
  268.  
  269. .content img:hover {
  270. {block:IfMonochromePosts}
  271. filter: none;
  272. -webkit-filter: grayscale(0%);
  273. {/block:IfMonochromePosts}
  274. {block:iffadingimages}opacity:1;{/block:iffadingimages}
  275. }
  276.  
  277. .photoset {
  278. {block:iffadingimages}opacity: 0.8;{/block:iffadingimages}
  279. {block:IfMonochromePosts}
  280. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  281. filter: gray; /* IE6-9 */
  282. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  283. {/block:IfMonochromePosts}
  284. transition-duration: 0.6s;
  285. -moz-transition-duration: 0.6s;
  286. -webkit-transition-duration: 0.6s;
  287. -o-transition-duration: 0.6s;
  288. }
  289.  
  290. .photoset:hover {
  291. {block:IfMonochromePosts}
  292. filter: none;
  293. -webkit-filter: grayscale(0%);
  294. {/block:IfMonochromePosts}
  295. {block:iffadingimages}opacity:1;{/block:iffadingimages}
  296. }
  297.  
  298. /* CONTENT */
  299.  
  300. .contentwhole {
  301. {block:if400Posts}
  302. margin-top:49px;
  303. width: 475px;
  304. margin-left:461px;
  305. {/block:if400Posts}
  306. {block:if500Posts}
  307. margin-top:67px;
  308. width:575px;
  309. margin-left:461px;
  310. {/block:if500Posts}
  311. height: 550px;
  312. overflow: scroll;
  313. background-color:{color:content background};
  314. background-image: url('{image:Content Background}');
  315. }
  316.  
  317. .content {
  318. {block:if400Posts}
  319. width: 400px;
  320. {/block:if400Posts}
  321. {block:if500Posts}
  322. width:500px;
  323. {/block:if500Posts}
  324. margin-left:22px;
  325. height: auto;
  326. padding-top:15px;
  327. padding-left:15px;
  328. padding-right:15px;
  329. {block:PermalinkPage}
  330. padding-bottom:15px;
  331. {/block:PermalinkPage}
  332. {block:IndexPage}
  333. padding-bottom:5px;
  334. {/block:IndexPage}
  335. margin-bottom:5px;
  336. margin-top:15px;
  337. background-color: {color:Content BG};
  338. {block:ifBorders}
  339. border:1px solid {color:Content Border};
  340. {/block:ifBorders}
  341.  
  342. }
  343.  
  344. /* QUESTION POST */
  345.  
  346. #question {
  347. background-color:{color:Question BG};
  348. opacity:.8px;
  349. padding:10px;
  350. padding-bottom:12px;
  351. text-align:center;
  352. {block:if400Posts}
  353. width:380px;
  354. {/block:if400Posts}
  355. {block:if500Posts}
  356. width:480px;
  357. {/block:if500Posts}
  358. overflow:auto;
  359. }
  360.  
  361. /* AUDIO POST */
  362.  
  363. .audio {
  364. padding: 0;
  365. }
  366.  
  367. .audio_container {
  368. overflow: hidden;
  369. position: relative;
  370. width: 100px;
  371. }
  372.  
  373. .soundcloud_audio_player {
  374. width: 100%;
  375. }
  376.  
  377. .tumblr_audio_player {
  378. width: 100%;
  379. }
  380.  
  381. /* QUOTE POST */
  382.  
  383. .qquote {
  384. font-family:georgia;
  385. font-size:80px;
  386. color:{color:content background};
  387. margin-top:-20px;
  388. }
  389.  
  390. .quote {
  391. margin-top:-60px;
  392. text-align:center;
  393. font-family: 'everafter', sans-serif;
  394. font-size:28px;
  395. }
  396.  
  397. .source {
  398. letter-spacing:1px;
  399. font-family:arial;
  400. font-size:8px;
  401. text-transform:uppercase;
  402. text-align:center;
  403. margin-bottom:5px;
  404. }
  405.  
  406. /* CHAT POSTS */
  407.  
  408. .odd .line {
  409. background-color:{color:Chat Odd Background};
  410. padding: 10px 5px;
  411. color:{color:Chat Odd Text};
  412. }
  413.  
  414. .even .line {
  415. background-color:{color:Chat Even Background};
  416. padding: 10px 5px;
  417. color:{color:Chat Even Text};
  418. }
  419.  
  420. .odd .name {
  421. font-family:'bitxmap';
  422. font-size:10px;
  423. color:{color:Chat Odd Name};
  424. padding: 3px 5px;
  425. }
  426.  
  427. .even .name {
  428. font-family:'bitxmap';
  429. font-size:10px;
  430. color:{color:Chat Even Name};
  431. padding: 3px 5px;
  432. }
  433.  
  434. /* POST TITLES */
  435.  
  436. h1 {
  437. font-weight:400;
  438. font-family: 'everafter', sans-serif;
  439. font-size:28px;
  440. text-align:center;
  441. margin-bottom:2px;
  442. margin-top:3px;
  443. }
  444.  
  445. h1 a:hover {
  446. text-decoration:none;
  447. }
  448.  
  449. .ttitle {
  450. font-family: 'everafter', sans-serif;
  451. font-size:28px;
  452. text-align:center;
  453. }
  454.  
  455. /* POST INFORMATION */
  456.  
  457. .info {
  458. display:inline-block;
  459. {block:if400Posts}
  460. width: 380px;
  461. {/block:if400Posts}
  462. {block:if500Posts}
  463. width:480px;
  464. {/block:if500Posts}
  465. height:15px;
  466. float:center;
  467. padding:3px;
  468. padding-left:10px;
  469. padding-right:10px;
  470. opacity:0.8;
  471. text-align:center;
  472. font-size:8px;
  473. font-family:'silkscreen';
  474. text-transform:uppercase;
  475. background-color:#transparent;
  476. background-image:url('{image:Info BG}');
  477. color:{color:info};
  478. transition-duration: 0.6s;
  479. -moz-transition-duration: 0.6s;
  480. -webkit-transition-duration: 0.6s;
  481. -o-transition-duration: 0.6s;
  482. }
  483.  
  484. .info a {
  485. color:{color:info link};
  486. font-size:10px;
  487. -moz-transition-duration: 0.6s;
  488. -webkit-transition-duration: 0.6s;
  489. -o-transition-duration: 0.6s;
  490. }
  491.  
  492. .info a:hover {
  493. text-decoration: line-through;
  494. opacity:1.0;
  495. }
  496.  
  497. {block:IndexPage}{block:ifHoverTags}
  498. .tags:hover {
  499. margin-top:-25px;
  500. opacity:.7;
  501. }
  502. {/block:IndexPage}{/block:ifHoverTags}
  503.  
  504. .tags {
  505. display:inline-block;
  506. float:center;
  507. padding-top:20px;
  508. {block:PermalinkPage}
  509. margin-top:3px;
  510. {/block:PermalinkPage}
  511. {block:IndexPage}
  512. {/block:ifnotHoverTags}
  513. margin-top:3px;
  514. {/block:ifnotHoverTags}
  515. {block:ifHoverTags}
  516. margin-top:-50px;
  517. opacity:0;
  518. {/block:ifHoverTags}
  519. {/block:IndexPage}
  520. text-align:center;
  521. font-size:8px;
  522. font-family:consolas;
  523. letter-spacing:1px;
  524. background-color: #transparent;
  525. background-image:url('{image:Info BG}');
  526. color:{color:info};
  527. {block:if400Posts}
  528. width: 400px;
  529. {/block:if400Posts}
  530. {block:if500Posts}
  531. width:500px;
  532. {/block:if500Posts}
  533. -webkit-transition: 0.6s ease-out;
  534. -moz-transition: 0.6s ease-out;
  535. transition: 0.6s ease-out;
  536. }
  537.  
  538. .tags a {
  539. color:{color:info link};
  540. font-size:8px;
  541. text-transform:uppercase;
  542. -moz-transition-duration: 0.6s;
  543. -webkit-transition-duration: 0.6s;
  544. -o-transition-duration: 0.6s;
  545. }
  546.  
  547. .tags a:hover {
  548. text-decoration: line-through;
  549. opacity:1.0;
  550. }
  551.  
  552. #leftie {
  553. position:fixed;
  554. font-family:georgia;
  555. font-size:50px;
  556. }
  557.  
  558. #arrow1 {position:fixed; top:385px; margin-left:0px;}
  559. #arrow1 a{color:{color:Arrow}; font:80px Georgia; line-height:90%;}
  560. #arrow1 a:hover{color:{color:Arrow Hover}; z-index:9999999;text-decoration:none;}
  561.  
  562. #arrow2 {position:fixed; top:385px; margin-left:235px;}
  563. #arrow2 a{color:{color:Arrow}; font:80px Georgia; line-height:90%;}
  564. #arrow2 a:hover{color:{color:Arrow Hover}; z-index:9999999;text-decoration:none;}
  565.  
  566. /* CONTAINERS */
  567.  
  568. #literallyeverything {
  569. position:fixed;
  570. margin-top:100px;
  571. margin-left:-10px;
  572. }
  573.  
  574. #sidebar {
  575. position:fixed;
  576. margin-left:136px;
  577. {block:if400Posts}
  578. margin-top:56px;
  579. {/block:if400Posts}
  580. {block:if500Posts}
  581. margin-top:76px;
  582. {/block:if500Posts}
  583. }
  584.  
  585. /* LINES */
  586.  
  587. #line1 {
  588. z-index:9999999999999;
  589. position:fixed;
  590. background-color:#aaa;
  591. width:5px;
  592. margin-top:-100px;
  593. margin-left:124px;
  594. {block:if400Posts}
  595. height:149px;
  596. {/block:if400Posts}
  597. {block:if500Posts}
  598. height:168px;
  599. {/block:if500Posts}
  600. }
  601.  
  602. /* TITLE */
  603.  
  604. #renegade {
  605. z-index:999999999;
  606. position:fixed;
  607. font-family:'autumn';
  608. color:{color:Title};
  609. font-size:60px;
  610. margin-top:-65px;
  611. text-shadow: -1px -1px {color:Shadow},-2px -2px {color:Shadow};
  612. }
  613.  
  614. #lovers {
  615. z-index:9;
  616. position:fixed;
  617. height:35px;
  618. {block:if400Posts}
  619. width:800px;
  620. {/block:if400Posts}
  621. {block:if500Posts}
  622. width:900px;
  623. {/block:if500Posts}
  624. opacity:.5;
  625. background-color:{color:line 1};
  626. margin-top:-50px;
  627. }
  628.  
  629. #enemies {
  630. z-index:9;
  631. position:fixed;
  632. width:35px;
  633. height:140%;
  634. margin-left:10px;
  635. opacity:.5;
  636. background-color:{color:line 2};
  637. margin-top:-200px;
  638. }
  639.  
  640. #iconnav {
  641. z-index:999999;
  642. position:fixed;
  643. padding-left:15px;
  644. padding-right:10px;
  645. background-color:{color:content bg};
  646. border-right:2px solid {color:content background};
  647. border-left:2px solid {color:content background};
  648. font-size:18px;
  649. margin-top:143px;
  650. margin-left:{text:Nav Margin Left}px;
  651. letter-spacing:6px;
  652. border-radius:2px;
  653. }
  654.  
  655. #iconnav a {
  656. opacity:.8;
  657. color:{color:Icon};
  658. text-shadow: -1px -1px {color:Icon Shadow},1px 1px {color:Icon Shadow};
  659. }
  660.  
  661. #iconnav a:hover {
  662. color:{color:Icon Hover};
  663. text-shadow: -1px -1px {color:Icon Shadow Hover},1px 1px {color:Icon Shadow Hover};
  664. text-decoration:none;
  665. }
  666.  
  667. #description {
  668. margin-top:173px;
  669. margin-left:55px;
  670. width:260px;
  671. }
  672.  
  673. /* MUSIC PLAYER */
  674.  
  675. .melody {
  676. background-color:{color:content bg};
  677. opacity:.7;
  678. overflow: hidden;
  679. position:absolute;
  680. z-index:9999999999999;
  681. height: 24px;
  682. width: 24px;
  683. top: 18px;
  684. left: 73px;
  685. -webkit-transition: opacity .7s linear;
  686. -webkit-transition: all .7s ease-in-out;
  687. -moz-transition: all .7s ease-in-out;
  688. -o-transition: all .7s ease-in-out;
  689. }
  690.  
  691. .melody:hover {
  692. opacity:1;
  693. }
  694.  
  695. .reverberate {
  696. position:absolute;
  697. height: 14px;
  698. width: 14px;
  699. margin-top: 0px;
  700. margin-left: 0px;
  701. padding: 5px;
  702. font-size: 13px;
  703. font-style: normal;
  704. color: #000;
  705. -webkit-transition: opacity .7s linear;
  706. -webkit-transition: all .7s ease-in-out;
  707. -moz-transition: all .7s ease-in-out;
  708. -o-transition: all .7s ease-in-out;
  709. }
  710.  
  711. .melody:hover .reverberate {
  712. margin-top: -50px;
  713. }
  714.  
  715. .harmony {
  716. overflow: hidden;
  717. position:absolute;
  718. height: 50px;
  719. width: 20px;
  720. margin-top: 50px;
  721. margin-left: 8px;
  722. -webkit-transition: opacity .7s linear;
  723. -webkit-transition: all .7s ease-in-out;
  724. -moz-transition: all .7s ease-in-out;
  725. -o-transition: all .7s ease-in-out;
  726. }
  727.  
  728. .melody:hover .harmony {
  729. margin-top: 5px;
  730. }
  731.  
  732. .rhythm {
  733. position:absolute;
  734. height: 25px;
  735. width: 10px;
  736. margin-top: 2px;
  737. margin-left: -26px;
  738. }
  739.  
  740. /* SEARCH */
  741.  
  742. #search {
  743. opacity:.6;
  744. margin-top:4px;
  745. }
  746.  
  747. .sfm input {
  748. background-color:{color:Pagination Bar};
  749. color:{color:Pagination Text};
  750. font-size: 9px;
  751. border: 0px;
  752. text-transform: uppercase;
  753. margin-top: 0px;
  754. letter-spacing: 1px;
  755. padding: 4px 10px;
  756. font-family:arial;
  757. }
  758.  
  759. #sb {
  760. height: 11px;
  761. vertical-align: top;
  762. }
  763.  
  764. /* CUSTOM LINKS */
  765.  
  766. #cl {
  767. {block:ifSearch}
  768. margin-top:-10px;
  769. {/block:ifSearch}
  770. }
  771.  
  772. #cl a {
  773. background-color:{color:Custom Link BG};
  774. color:{color:Custom Link};
  775. padding:5px;
  776. width:118px;
  777. text-align:center;
  778. display:inline-block;
  779. margin-top:3px;
  780. font-size:8px;
  781. font-family:'silkscreen';
  782. }
  783.  
  784. #cl a:hover {
  785. text-decoration:none;
  786. background-color:{color:Custom Link BG Hover};
  787. color:{color:Custom Link Hover};
  788. -webkit-transition: opacity .7s linear;
  789. -webkit-transition: all .7s ease-in-out;
  790. -moz-transition: all .7s ease-in-out;
  791. -o-transition: all .7s ease-in-out;
  792. }
  793.  
  794. /* PAGINATION */
  795.  
  796. #pagination {
  797. letter-spacing:2px;
  798. margin-top:3px;
  799. padding:3px;
  800. opacity:.6;
  801. text-align:center;
  802. background-color:{color:Pagination Bar};
  803. color:{color:Pagination Text};
  804. font-family:'silkscreen';
  805. font-size:8px;
  806. }
  807.  
  808. #pagination a {
  809. color:{color:pagination text};
  810. }
  811.  
  812. </style><div id="literallyeverything">
  813.  
  814. <img src="{image:Top}" style="position:fixed;margin-top:-100px;margin-left:136px;overflow:hidden;
  815. {block:if400Posts}
  816. width:800px;
  817. height:149px;
  818. {/block:if400Posts}
  819. {block:if500Posts}
  820. width:900px;
  821. height:168px;
  822. {/block:if500Posts}">
  823.  
  824. <div id="sidebar">
  825.  
  826. <div id="renegade">{text:Title}</div>
  827. <div id="lovers"></div>
  828. <div id="enemies"></div>
  829.  
  830. <img src="{image:Sidebar}"
  831. style="position:fixed;height:130px;width:238px;margin-left:55px;padding:10px;background-color:{color:content bg};border:2px solid {color:content background};">
  832.  
  833. {block:ifMusicPlayer}
  834. <div class="melody"><div class="reverberate"><img src="{image:Music Player GIF}" style="margin-top:2px;"/></div>
  835. <div class="harmony"><div class="rhythm">
  836. {text:Billy Music Player}
  837. </div></div></div>
  838. {/block:ifMusicPlayer}
  839.  
  840. <div id="iconnav">
  841. <a href="/" title="Index">{text:Nav Icon 1}</a>
  842. <a href="/ask" title="message">{text:Nav Icon 2}</a>
  843. <a href="/submit" title="submit">{text:Nav Icon 1}</a>
  844. <a href="/archive" title="archive">{text:Nav Icon 2}</a>
  845. <a href="http://meteorathemes.tumblr.com/" title="Theme by Meteora">{text:Nav Icon 1}</a></div>
  846.  
  847. <div id="description">{Description}
  848. <div style="text-transform:lowercase;text-align:center;font-family:'everafter';font-size:22px;letter-spacing:4px;background-color:{color:content background};">{text:Navigation Title}</div>
  849.  
  850. {block:ifSearch}
  851. <div id="search"><center>
  852. <form action="/search" method="get" class="sfm">
  853. <input type="text" name="q" style="width:226px;" value="{SearchQuery}" id="sf"/>
  854. <input type="image" value="Search" src="http://static.tumblr.com/bj5zkci/fNgn42ep2/search.png" id="sb"/>
  855. </form></div>
  856. {/block:ifSearch}
  857.  
  858. <div id="cl">
  859. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Custom Link 1}</a>{/block:ifLink1}
  860. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Custom Link 2}</a>{/block:ifLink2}
  861. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Custom Link 3}</a>{/block:ifLink3}
  862. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Custom Link 4}</a>{/block:ifLink4}
  863. {block:ifLink5}<a href="{text:Link 5 URL}">{text:Custom Link 5}</a>{/block:ifLink5}
  864. {block:ifLink6}<a href="{text:Link 6 URL}">{text:Custom Link 6}</a>{/block:ifLink6}
  865. {block:ifLink7}<a href="{text:Link 7 URL}">{text:Custom Link 7}</a>{/block:ifLink7}
  866. {block:ifLink8}<a href="{text:Link 8 URL}">{text:Custom Link 8}</a>{/block:ifLink8}
  867. {block:ifLink9}<a href="{text:Link 9 URL}">{text:Custom Link 9}</a>{/block:ifLink9}
  868. {block:ifLink10}<a href="{text:Link 10 URL}">{text:Custom Link 10}</a>{/block:ifLink10}
  869. </div>
  870.  
  871. <div id="pagination">
  872. {block:Pagination}{block:PreviousPage}
  873. <a href="{PreviousPage}"><div style="display:inline-block;letter-spacing:1px;">◂ prev</div>&nbsp;</a>
  874. {/block:PreviousPage}{block:JumpPagination length="5"}{block:CurrentPage}
  875. <span class="current_page">{CurrentPage}</span>
  876. {/block:CurrentPage}{block:JumpPage}
  877. <a class="jump_page" href="{URL}">{PageNumber}</a>
  878. {/block:JumpPage}{/block:JumpPagination}{block:NextPage}
  879. <a href="{NextPage}">&nbsp;<div style="display:inline-block;letter-spacing:1px;">next ▸</div></a>
  880. {/block:NextPage}{/block:Pagination}
  881. </div>
  882.  
  883. </div></div>
  884.  
  885. <div class="contentwhole">
  886. {block:Posts}
  887. <div class="content">
  888.  
  889. {block:Text}
  890. {block:Title}
  891. <a href="{Permalink}"> <h1>{Title}</h1></a>
  892. {/block:Title}
  893. {Body}
  894. {/block:Text}
  895.  
  896. {block:Photo}
  897. {block:if400Posts}
  898. <img class="photo" src="{PhotoURL-400}" alt="{PhotoAlt}" style="padding-bottom:5px;"/>
  899. {/block:if400Posts}
  900. {block:if500Posts}
  901. <img class="photo" src="{PhotoURL-500}" alt="{PhotoAlt}" style="padding-bottom:5px;"/>
  902. {/block:if500Posts}
  903. {block:Caption}{Caption}{/block:Caption}
  904. {/block:Photo}
  905.  
  906. {block:Photoset}
  907. {block:if400Posts}
  908. <div class="photoset" style="padding-bottom:5px;">{Photoset-400}</div>
  909. {/block:if400Posts}
  910. {block:if500Posts}
  911. <div class="photoset" style="padding-bottom:5px;">{Photoset-500}</div>
  912. {/block:if500Posts}
  913. {block:Caption}{Caption}{/block:Caption}
  914. {/block:Photoset}
  915.  
  916. {block:Quote}
  917. <div class="qquote">❝</div>
  918. <div class="quote">{Quote}</div><p>
  919. {block:Source}<div class="source">- {Source} -</div>{/block:Source}
  920. {/block:Quote}
  921.  
  922. {block:Link}
  923. <a href="{URL}" target="{Target}"><h1>{Name} →</h1></a>
  924. {block:Description} {Description} {/block:Description}
  925. {/block:Link}
  926.  
  927. {block:Chat}
  928. {block:Title}<div class="ttitle">{Title}</div>{/block:Title}
  929. <div class="text">
  930. {block:Lines}<div class="{Alt}">
  931. <div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
  932. {/block:Lines}
  933. </div>
  934. {/block:Chat}
  935.  
  936. {block:Audio}
  937. <div class="audioContainer">
  938. {block:AudioEmbed}
  939. {block:ifWhiteAudioPlayer}{AudioEmbed color="white"}{/block:ifWhiteAudioPlayer}
  940. {block:ifBlackAudioPlayer}{AudioEmbed color="black"}{/block:ifBlackAudioPlayer}
  941. {/block:AudioEmbed}
  942. </div>
  943. {block:Caption}{Caption}{/block:Caption}
  944. {/block:Audio}
  945.  
  946.  
  947. {block:Video}
  948. {block:if500Posts}
  949. {VideoEmbed-500}
  950. {/block:if500Posts}
  951. {block:if400Posts}
  952. {VideoEmbed-400}
  953. {/block:if400Posts}
  954. {block:Caption}{Caption}{/block:Caption}
  955. {/block:Video}
  956.  
  957. {block:Answer}
  958. <div id="question">
  959. <div style="margin-top:3px;">{Question}</div></div><p>
  960. <div style="color:{color:Question BG};font-size:30px;margin-top:-26px;margin-left:20px;">◥</div>
  961. <div style="font-family:'silkscreen';text-transform:uppercase;font-size:8px;margin-top:-18px;margin-left:45px;letter-spacing:1px;">{Asker}</div>
  962. {Answer}
  963. {/block:Answer}
  964.  
  965. {block:Date}
  966. <div class="info"><div style="z-index:-999;display:inline-block;width:100%;height:1px;background-color:{color:info line};{block:if400Posts}width: 400px;{/block:if400Posts}{block:if500Posts}width:500px;{/block:if500Posts}margin-left:-10px;margin-top:5px;"></div>
  967. <div style="z-index:999999;display:inline-block;background-color:{color:content bg};padding-left:10px;padding-right:10px;margin-left:45px;margin-right:45px;margin-top:-4px;">
  968. {TimeAgo} on {MonthNumberWithZero}.{DayOfMonthWithZero}.{ShortYear}</a>&nbsp;{text:info symbol} {NoteCount}</a> notes
  969. </div></div>
  970.  
  971. {block:IndexPage}
  972. <div class="tags">
  973. <a href="{Permalink}">permalink</a>{block:ContentSource} | <a href="{SourceURL}" title="Source: {SourceTitle}">source</a> {/block:ContentSource} | <a href="{ReblogURL}">reblog</a>
  974. {block:HasTags}<br>{block:Tags}<i>#</i><a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div><!--END INFO -->
  975. {/block:IndexPage}
  976.  
  977. {block:PermalinkPage}{block:ContentSource}
  978. <div class="font-family:consolas;font-size:8px;text-align:center;">
  979. <a href="{SourceURL}">Source: {SourceTitle}</a> <small>|</small></div>{/block:ContentSource}
  980. {block:RebloggedFrom}<div class="font-family:consolas;font-size:8px;text-align:center;"><a href="{ReblogParentURL}"> Via: {ReblogParentTitle}</a></div> {/block:RebloggedFrom}
  981. <br>{block:HasTags}Tagged: {block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  982. </div>
  983. {/block:PermalinkPage}
  984.  
  985. {/block:Date}
  986.  
  987. {block:PostNotes}{PostNotes}{/block:PostNotes}
  988.  
  989. </div><!-- END CONTENT -->
  990. {/block:Posts}
  991. <div style="height:30px;"></div>
  992. </div></div> <!-- END CONTENT WHOLE -->
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!