ameliasdreams

theme 8 - ephemeral

Feb 3rd, 2014
469
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.27 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <!---
  6.  
  7. EPHEMERAL (theme #8) BY MELODYPCND(.tumblr.com)
  8.  
  9. - DO NOT REMOVE THE CREDIT
  10. - DO NOT TOUCH THE CREDIT IN ANY WAY
  11. - DO NOT MOVE THE CREDIT TO A SECONDARY PAGE
  12. - DO NOT STEAL THIS CODE AND REDISTRIBUTE AS YOUR OWN
  13. - DO NOT USE THIS AS A BASE CODE
  14. - AND LASTLY, DO NOT TAKE PARTS OF THE CODE, AS THAT IS ALSO STEALING
  15.  
  16. but please DO like or reblog the post! :) enjoy the theme! <3
  17.  
  18. --->
  19.  
  20. <head>
  21.  
  22. <!---TITLE--->
  23. <title>{Title}</title>
  24.  
  25. <!---FAVICON--->
  26. <link rel="shortcut icon" href="{Favicon}">
  27.  
  28. <!---RSS FEED--->
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30.  
  31. <!---DESCRIPTION--->
  32. {block:Description}
  33. <meta name="description" content="{MetaDescription}"/>
  34. {/block:Description}
  35.  
  36. <!---COLORS--->
  37. <meta name="color:Font" content="#b6b5b5" />
  38. <meta name="color:ScrollbarBG" content="#b8b8b8" />
  39.  
  40. <!---LINKS AND TEXT--->
  41. <meta name="text:Link 1 URL" content="" />
  42. <meta name="text:Link 1 Title" content="" />
  43. <meta name="text:Link 2 URL" content="" />
  44. <meta name="text:Link 2 Title" content="" />
  45. <meta name="text:Link 3 URL" content="" />
  46. <meta name="text:Link 3 Title" content="" />
  47. <meta name="text:Link 4 URL" content="" />
  48. <meta name="text:Link 4 Title" content="" />
  49. <meta name="text:Link 5 URL" content="" />
  50. <meta name="text:Link 5 Title" content="" />
  51.  
  52. <!---IMAGES--->
  53. <meta name="image:Sidebar Image" content="" />
  54.  
  55. <!---FONTS--->
  56. <link href='http://fonts.googleapis.com/css?family=Megrim' rel='stylesheet' type='text/css'>
  57. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
  58.  
  59. <!---SCRIPTS--->
  60. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  61.  
  62. <style>
  63. div#qTip {
  64. padding: 5px;
  65. display: none;
  66. text-align: center;
  67. position: absolute;
  68. font-size:10px;
  69. margin-left:10px;
  70. margin-top:-2px;
  71. line-height:9px;
  72. font-family:calibri;
  73. font-style:none;
  74. z-index: 10000;
  75. background-color:#f3f3f3;
  76. border:1px solid {color:font};
  77. box-shadow:3px 3px 2px {color:font};
  78. text-transform:lowercase;
  79. letter-spacing: 3px;
  80. color:{color:font};
  81. }
  82. </style>
  83.  
  84. <style>
  85. body, a, a:hover {
  86. cursor:url(http://static.tumblr.com/oxr8htj/yyBn0fro1/thing.png), auto;
  87. }
  88. </style>
  89.  
  90. <style type="text/css">
  91.  
  92. /*---WEBKIT SCROLLBAR---*/
  93. ::-webkit-scrollbar {width:5px; height:auto; background:#fff;}
  94. ::-webkit-scrollbar-corner {background:#000;}
  95. ::-webkit-scrollbar-thumb:vertical {background:#000;}
  96. ::-webkit-scrollbar-thumb:horizontal {background:#000;}
  97.  
  98.  
  99. /*---BODY---*/
  100.  
  101.  
  102.  
  103. /* --- SIDEBAR ---*/
  104. #sidebar {
  105. width:175px;
  106. position:fixed;
  107. margin-left:125px;
  108. margin-top:215px
  109. }
  110.  
  111. #sidebarimage img {
  112. width:175px;
  113. height:auto;
  114. margin-top:0px;
  115. -moz-transition-duration:1s;
  116. -webkit-transition-duration:1s;
  117. -o-transition-duration:1s;
  118. }
  119.  
  120. #sidebarimage img:hover {
  121. -webkit-filter: brightness(120%);
  122. }
  123.  
  124. #links {
  125. position: fixed;
  126. font-family:calibri;
  127. width: 175px;
  128. text-align:center;
  129. }
  130.  
  131. #links a {
  132. padding-left:5px;
  133. padding-right:5px;
  134. margin-left:10px;
  135. margin-right:10px;
  136. margin-bottom: 5px;
  137. font-size:8px;
  138. font-style:normal;
  139. font-family: calibri light;
  140. text-align:center;
  141. letter-spacing:2.6px;
  142. width:175px;
  143. background-color:#eee;
  144. border:1px solid {color:font};
  145. border-radius:14px;
  146. color:{color:Font};
  147. }
  148.  
  149. #links a:hover {;
  150. border-radius:0px;
  151. -moz-transition-duration:0.5s;
  152. -webkit-transition-duration:0.5s;
  153. -o-transition-duration:0.5s;
  154. }
  155.  
  156. #description {
  157. margin-top:20px;
  158. width: 152px;
  159. line-height: 100%;
  160. background-color:#eee;
  161. text-transform:none;
  162. text-align:center;
  163. font-family:calibri;
  164. text-transform:none;
  165. letter-spacing:1px;
  166. font-size:8.5px;
  167. line-height:150%;
  168. font-style:none;
  169. padding:10px;
  170. color:{color:font};
  171. border-left:3px double #ccc;
  172. }
  173.  
  174.  
  175.  
  176. body {
  177. font-style:none;
  178. background:#fff;
  179. margin:50px;
  180. color:{color:Font};
  181. font-family:calibri;
  182. font-size:11px;
  183. line-height:100%;
  184. color:{color:Font};
  185. }
  186.  
  187. blockquote {
  188. border-left:2px solid #b8b8b8;
  189. padding-left:10px;
  190. margin-left:20px;
  191. }
  192.  
  193. a {
  194. color:{color:Font};
  195. text-decoration:none;
  196. text-transform:none;
  197. -webkit-transition:all 0.5s ease-in-out;
  198. -moz-transition:all 0.5s ease-in-out;
  199. -o-transition:all 0.5s ease-in-out;
  200. -ms-transition:all 0.5s ease-in-out;
  201. -transition:all 0.5s ease-in-out;
  202. }
  203.  
  204. img {
  205. max-height:100%;
  206. }
  207.  
  208. h1 , h2 {
  209. font-family:calibri light;
  210. text-transform:none;
  211. font-size:12px;
  212. line-height:30px;
  213. letter-spacing:0px;
  214. text-align:justify;
  215. font-style:none;
  216. border-bottom:1px solid {color:font};
  217. }
  218.  
  219. #title {
  220. font-size:17.5px;
  221. font-family:calibri light;
  222. text-align:center;
  223. letter-spacing:2px;
  224. line-height:125%;
  225. color:#555;
  226. background-color:#fff;
  227. text-transform:lowercase;
  228. width:370px;
  229. margin-top:-50px;
  230. margin-left:515px;
  231. margin-bottom:75px;
  232. padding:15px;
  233. opacity:0.85;
  234. position:fixed;
  235. z-index:99999999999999999999999999999;
  236. }
  237.  
  238. /*---ENTRIES/POSTS---*/
  239. #entry {
  240. width:400px;
  241. margin-top:50px;
  242. }
  243.  
  244. #posts {
  245. width:400px;
  246. padding-bottom:100px;
  247. font-style:none;
  248. padding:15px;
  249. margin-left:500px;
  250. margin-bottom:50px;
  251. -webkit-filter: grayscale(0%);
  252. -webkit-transition-duration:0.5s;
  253. -moz-transition-duration:0.5s;
  254. -o-transition-duration:0.5s;
  255. }
  256. #posts:hover {
  257. opacity:0.9;
  258. -webkit-filter: grayscale(100%);
  259. -webkit-transition-duration:0.5s;
  260. -moz-transition-duration:0.5s;
  261. -o-transition-duration:0.5s;
  262. }
  263. .cap {
  264. background-color:#eee;
  265. padding:10px;
  266. margin-top:5px;
  267. letter-spacing:1px;
  268. }
  269.  
  270. #quote {
  271. font-size:15px;
  272. font-style:italic;
  273. line-height:100%;
  274. letter-spacing:1px;
  275. text-align:justify;
  276. }
  277.  
  278. .source {
  279. text-align:right;
  280. font-size:9px;
  281. letter-spacing:2px;
  282. }
  283.  
  284. .newplayerbutton {
  285. position: relative;
  286. width: 28px;
  287. height: 27px;
  288. overflow: hidden;
  289. }
  290.  
  291. .playerbuttonhug {
  292. position: absolute;
  293. top: -11px;
  294. left: -12px;
  295. }
  296.  
  297.  
  298. .tumblr_audio_player {
  299. border: none;
  300. padding: 0px;
  301. margin: 0px;
  302. height: 50px;
  303. width: 500px;
  304. }
  305.  
  306. .playerbuttonbg {
  307. position: absolute;
  308. left: 20px;
  309. top: 20px;
  310. width: 28px;
  311. height: 28px;
  312. background-color: #fff;
  313. padding: 10px;
  314. -webkit-border-radius: 40px;
  315. -moz-border-radius: 40px;
  316. border-radius: 40px;
  317. opacity: .4;
  318. filter: alpha(opacity=40);
  319. -moz-opacity: 0.4;
  320. -khtml-opacity: 0.4;
  321. transition: opacity .7s ease-in-out;
  322. -moz-transition: opacity .7s ease-in-out;
  323. -webkit-transition: opacity .7s ease-in-out;
  324. }
  325.  
  326. .playerbuttonbg:hover {
  327. opacity: 1;
  328. filter: alpha(opacity=100);
  329. -moz-opacity: 1;
  330. -khtml-opacity: 1;
  331. }
  332.  
  333. .audioimgwrapper {
  334. position: absolute;
  335. left: 0px;
  336. top: 0px;
  337. -webkit-border-radius: 50px;
  338. -moz-border-radius: 50px;
  339. border-radius: 50px;
  340. overflow: hidden;
  341. width: 88px;
  342. height: 88px;
  343. }
  344.  
  345. .audioimgwrapper img {
  346. width: 100%;
  347. height: auto;
  348. -webkit-border-radius: 50px;
  349. -moz-border-radius: 50px;
  350. border-radius: 50px;
  351. }
  352.  
  353. .trackdetails {
  354. width: auto;
  355. display:inline-block;
  356. margin-left: 100px;
  357. min-height: 85px;
  358. }
  359.  
  360. .audiowrapper {
  361. position: relative;
  362. display:inline-block;
  363. }
  364.  
  365. /*---ASKS/INFO---*/
  366.  
  367. #answers {
  368. background-color:#ffffff;
  369. color:{color:Font};
  370. padding:2px;
  371. font-family:calibri;
  372. font-size:10px;
  373. font-style:normal;
  374. text-align:justify;
  375. }
  376.  
  377. .note {
  378. padding:0px 20px 0px 20px;
  379. background-color:#ffffff;
  380. text-transform:lowercase;
  381. letter-spacing:0px;
  382. font-size: 11px;
  383. font-style:normal;
  384. text-align:left;
  385. line-height:120%;
  386. }
  387.  
  388. .note li {
  389. list-style-type:none;
  390. padding:5px 25px 5px 25px;
  391. text-align:left;
  392. margin-right:30px;
  393. margin-top:-50px;
  394. }
  395.  
  396. #info {
  397. font-family:calibri;
  398. text-align:right;
  399. margin-top:10px;
  400. padding-top:10px;
  401. padding:0px;
  402. padding-bottom:1px;
  403. text-transform:lowercase;
  404. font-style:none;
  405. font-size:9px;
  406. letter-spacing:2px;
  407. line-height:100%;
  408. color:{color:Font};
  409. }
  410.  
  411. #rebloggedfrom {
  412. font-family:calibri;
  413. text-align:center;
  414. margin-top:-5px;
  415. padding-bottom:0px;
  416. text-transform:lowercase;
  417. font-style:none;
  418. font-size:10px;
  419. }
  420.  
  421. /*---TAGS---*/
  422. #tags {
  423. font-family:calibri;
  424. text-align:right;
  425. letter-spacing:2px;
  426. margin-top:0px;
  427. padding-bottom:0px;
  428. text-transform:lowercase;
  429. font-style:none;
  430. font-size:8px;
  431. }
  432.  
  433. /*---CREDIT---*/
  434. #credit {
  435. margin-bottom:50px;
  436. margin-top:5px;
  437. text-transform:lowercase;
  438. font-size:8px;
  439. letter-spacing:1px;
  440. text-align:center;
  441. width:400px;
  442. margin-left:515px;
  443. color:{color:text};
  444. }
  445.  
  446. /*---PAGINATION---*/
  447. #pagination {
  448. text-align:center;
  449. margin-top:50px;
  450. font-size:10px;
  451. font-family:cambria;
  452. line-height:15px;
  453. width:400px;
  454. margin-left:515px;
  455. color:{color:text};
  456. letter-spacing:1px;
  457. }
  458.  
  459. #pagination a {
  460. margin:0 15px;
  461. }
  462.  
  463.  
  464. #bite
  465. #bite a{
  466. display:block
  467. }
  468. #bite .death {
  469. margin-top:-40px;filter: alpha(opacity = 0);
  470. opacity:0;-webkit-transition: all 0.5s ease-out;
  471. -moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  472. }
  473.  
  474. #bite:hover .death {
  475. margin-top:2px;
  476. -webkit-transition: all 0.8s ease-out;
  477. -moz-transition: all 0.8s ease-out;
  478. transition: all 0.8s ease-out;
  479. filter: alpha(opacity = 100);
  480. filter: alpha(opacity = 100);
  481. opacity:100;
  482. }
  483.  
  484.  
  485. /*---END CSS---*/
  486.  
  487. {CustomCSS}</style></head><body>
  488.  
  489. <!---SIDEBAR--->
  490. <div id="sidebar">
  491. <div id="sidebarimage"><a title="home" href="/"><img src="{image:Sidebar Image}"></a></div><br>
  492.  
  493. <div id="links"><center>
  494. <a href="{text:Link 1 URL}" title="{text:Link 1 Title}"> </a>
  495. <a href="{text:Link 2 URL}" title="{text:Link 2 Title}"> </a>
  496. <a href="{text:Link 3 URL}" title="{text:Link 3 Title}"> </a>
  497. <a href="{text:Link 4 URL}" title="{text:Link 4 Title}"> </a>
  498. <a href="{text:Link 5 URL}" title="{text:Link 5 Title}"> </a>
  499. </div></center>
  500.  
  501. <div id="description">{Description}</div>
  502.  
  503. <div id="scrollbar">{scrollbar}</div>
  504.  
  505. {block:HasPages}
  506. {block:Pages}
  507. <a href="{URL}">{Label}</a>
  508. {/block:Pages}
  509. {/block:HasPages}
  510.  
  511. </div></center>
  512. </div>
  513. <!---END SIDEBAR--->
  514.  
  515. <!---POSTS--->
  516. <div id="entry">
  517. <div id="title">{Title}</div>
  518. {block:Posts}
  519. <div id="posts">
  520.  
  521. <!---TEXT POSTS--->
  522. {block:Text}
  523. <h1>
  524. {block:Title}
  525. {Title}
  526. {/block:Title}
  527. </h1>
  528. <div class="cap">{Body}</div>
  529. {/block:Text}
  530.  
  531. {block:blockquote}
  532. {/block:blockquote}
  533.  
  534. <!---PHOTO POSTS--->
  535. {block:Photo}
  536. <center>
  537. {LinkOpenTag}
  538. <img src="{PhotoURL-400}" alt="{PhotoAlt}"/>
  539. {LinkCloseTag}
  540. </center>
  541. {block:Caption}
  542. <div class="cap">{Caption}</div>
  543. {/block:Caption}
  544. {/block:Photo}
  545.  
  546. <!---PHOTOSET POSTS--->
  547. {block:Photoset}
  548. <center>
  549. {Photoset-400}
  550. </center>
  551. {block:Caption}
  552. <div class="cap">{Caption}</div>
  553. {/block:Caption}
  554. {/block:Photoset}
  555.  
  556. <!---QUOTE POSTS--->
  557. {block:Quote}
  558. <div id="quote">❝{Quote}❞</div><p>
  559. <center>
  560. {block:Source}
  561. <div class="source">—{Source}</div>
  562. {/block:Source}
  563. </center>
  564. {/block:Quote}
  565.  
  566. <!---LINK POSTS--->
  567. {block:Link}
  568. <h1>
  569. <a href="{URL}"{Target}>{Name}</a>
  570. </h1>
  571. {block:Description}
  572. {Description}
  573. {/block:Description}
  574. {/block:Link}
  575. <!---CHAT POSTS--->
  576. {block:Chat}
  577. {block:Title}
  578. <h1>
  579. {Title}
  580. </h1>
  581. {/block:Title}
  582. {block:Lines}
  583. {block:Label}
  584. <b>{Label}</b>
  585. {/block:Label}
  586. {Line}<br>
  587. {/block:Lines}
  588. {/block:Chat}
  589. <!---AUDIO POSTS--->
  590. {block:AudioPlayer}
  591. <div class="audiowrapper">
  592. {block:AlbumArt}
  593. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  594. {/block:AlbumArt}
  595.  
  596. <div class="playerbuttonbg">
  597. <div class="newplayerbutton">
  598. <div class="playerbuttonhug">
  599.  
  600. {AudioPlayerWhite}
  601.  
  602. </div>
  603. </div>
  604. </div>
  605.  
  606. <div class="trackdetails">
  607.  
  608. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  609. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  610. {block:Album}Album: {Album}{/block:Album}<br/>
  611. {PlayCountWithLabel}
  612.  
  613. </div>
  614. </div>
  615. {block:Caption}
  616. <div class="cap">{Caption}</div>
  617. {/block:Caption}
  618. {/block:AudioPlayer}
  619. <!---VIDEO POSTS--->
  620. {block:Video}
  621. {Video-400}
  622. {block:Caption}
  623. <div class="cap">{Caption}</div>
  624. {/block:Caption}
  625. {/block:Video}
  626. <!---ASK POSTS--->
  627. {block:Answer}
  628. <div style="padding:20px; text-align:center;" class="cap">
  629. <a href="{askerURL}"><b>{Asker}</b> —&nbsp;{Question}</div>
  630. <div id="answer">{Answer}</div>
  631. {/block:answer}
  632. <!---END POSTS--->
  633.  
  634. <!---POST INFO--->
  635. <div id="info">
  636.  
  637. <!---DATE--->
  638. {block:Date}
  639. <a href="{Permalink}">{DayOfWeek}, {Month} {DayOfMonth}</a> /
  640. {/block:Date}
  641. <!---NOTE COUNT--->
  642. {block:NoteCount}
  643. <a href="{Permalink}"> {NoteCountWithLabel} / </a>
  644. {/block:NoteCount}
  645. <!---VIA--->
  646. {block:RebloggedFrom}
  647. <a href="{ReblogParentURL}">via / </a>
  648. {/block:RebloggedFrom}
  649.  
  650. <!---SOURCE--->
  651. {block:ContentSource}
  652. <a href="{SourceURL}">src</a>
  653. {/block:ContentSource}
  654. </div>
  655.  
  656. <!---END POST INFO--->
  657.  
  658. <!---TAGS--->
  659. <div id="tags">
  660. {block:HasTags}
  661. {block:Tags}
  662. <a href="{TagURL}">&nbsp; #{Tag}</a>
  663. {/block:Tags}
  664. {/block:HasTags}
  665. </div>
  666.  
  667. <!---POST NOTES--->
  668. {block:PostNotes}
  669. {PostNotes}
  670. {/block:PostNotes}
  671. </div>
  672. {/block:Posts}
  673.  
  674. <!---PAGINATION--->
  675. <center>
  676. {block:Pagination}
  677. <div id="pagination">
  678. {block:PreviousPage}
  679. <a href="{PreviousPage}">↢</a>
  680. {/block:PreviousPage}
  681. {block:NextPage}
  682. <a href="{NextPage}">↣</a>
  683. {/block:NextPage}
  684. </div>
  685. {/block:Pagination}
  686.  
  687. <div id="credit">
  688. <a href="http://melodypcnd.tumblr.com" target="_blank">theme by <u>melodypcnd</u></a>
  689. </center>
  690. </div>
  691.  
  692. </body>
  693.  
  694. </html>
Advertisement
Add Comment
Please, Sign In to add comment