alicescreed

#22: Saving Grace

Jul 22nd, 2013
6,245
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.88 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.  
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5. <head>
  6. <title>{Title}</title>
  7.  
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />
  11.  
  12. {/block:Description}
  13.  
  14. <meta name="image:side1" content="">
  15. <meta name="image:side2" content="http://static.tumblr.com/dc5f2aa630530d7209d582621ff7dd26/tgtto7a/5Ytmqd39x/tumblr_static_barcelona_lyrics06.png">
  16. <meta name="image:sidebar" content="">
  17. <meta name="image:side3" content="">
  18. <meta name="image:portrait" content="">
  19.  
  20. <meta name="color:desctext" content="#ffffff">
  21. <meta name="color:accent1" content="#af4c35">
  22. <meta name="color:bg" content="#1d1111">
  23. <meta name="color:infobg" content="#f2f2f2">
  24. <meta name="color:text" content="#4c2b23">
  25. <meta name="color:posts" content="#ffffff">
  26.  
  27. <meta name="text:side2 repeat" content="repeat">
  28. <meta name="text:side2 position" content="center">
  29. <meta name="text:link1" content="/">
  30. <meta name="text:link1title" content="link">
  31. <meta name="text:link2" content="/">
  32. <meta name="text:link2title" content="link">
  33. <meta name="text:link3" content="/">
  34. <meta name="text:link3title" content="link">
  35. <meta name="text:link4" content="/">
  36. <meta name="text:link4title" content="link">
  37. <meta name="text:link5" content="/">
  38. <meta name="text:link5title" content="link">
  39. <meta name="text:subtitle" content="you're everything i need and more">
  40. <meta name="text:othertitle" content="hit me like a ray of sun">
  41. <meta name="text:sidebarmargin" content="200">
  42. <meta name="text:linksmargin" content="150">
  43.  
  44. <style type="text/css">
  45.  
  46.  
  47. #cred {
  48. position:fixed;
  49. font-size:8px;
  50. font-weight:normal;
  51. line-height:150%;
  52. background-color: {color:accent1};
  53. letter-spacing:2px;
  54. right:10px;
  55. padding: 4px;
  56. bottom:10px;
  57. text-transform:uppercase;
  58. text-align:center;
  59. font-weight: 300;
  60. }
  61.  
  62. #cred a{
  63. color: {color:desctext};
  64. }
  65.  
  66.  
  67. ::-webkit-scrollbar-thumb:vertical {
  68. background-color: {color:accent1};
  69. height:auto;
  70. border: 0px solid #000;
  71. }
  72.  
  73. ::-webkit-scrollbar-thumb:horizontal {
  74. background-color: {color:accent1};
  75. height:5px !important;
  76. }
  77.  
  78. ::-webkit-scrollbar {
  79. height:5px;
  80. width:5px;
  81. background-color: transparent;
  82. }
  83.  
  84. body {
  85. background-color: {color:bg};
  86. font-family: times new roman;
  87. font-size: 8pt;
  88. line-height: 100%;
  89. text-align: justify;
  90. color: {color:text};
  91. }
  92.  
  93. a {
  94. color: {color:accent1};
  95. text-decoration: none;
  96. -moz-transition-duration: 1s;
  97. -webkit-transition-duration:1s;
  98. -o-transition-duration: 1s;
  99. filter: url(css/grayscale.svg#greyscale);
  100. filter: gray;
  101. -webkit-filter: grayscale(50%);
  102. -moz-filter: grayscale(50%);
  103. -ms-filter: grayscale(50%);
  104. -webkit-filter: grayscale(50%);
  105. -o-filter: grayscale(50%);
  106. }
  107.  
  108. a:hover {
  109. filter: url(css/grayscale.svg#greyscale);
  110. filter: gray;
  111. -webkit-filter: grayscale(0%);
  112. -moz-filter: grayscale(0%);
  113. -ms-filter: grayscale(0%);
  114. -webkit-filter: grayscale(0%);
  115. -o-filter: grayscale(0%);
  116. }
  117.  
  118. #info a {
  119. color: {color:desctext};
  120. background-color: {color:accent1};
  121. padding: 2px;
  122. line-height: 100%;
  123. -moz-transition-duration: 1s;
  124. -webkit-transition-duration:1s;
  125. -o-transition-duration: 1s;
  126. filter: url(css/grayscale.svg#greyscale);
  127. filter: gray;
  128. -webkit-filter: grayscale(50%);
  129. -moz-filter: grayscale(50%);
  130. -ms-filter: grayscale(50%);
  131. -webkit-filter: grayscale(50%);
  132. -o-filter: grayscale(50%);
  133. letter-spacing: 1px;
  134. }
  135.  
  136. #info a:hover {
  137. -moz-transition-duration: 1s;
  138. -webkit-transition-duration:1s;
  139. -o-transition-duration: 1s;
  140. color: {color:desctext};
  141. padding: 2px;
  142. background-color: {color:accent1};
  143. filter: url(css/grayscale.svg#greyscale);
  144. filter: gray;
  145. -webkit-filter: grayscale(0%);
  146. -moz-filter: grayscale(0%);
  147. -ms-filter: grayscale(0%);
  148. -webkit-filter: grayscale(0%);
  149. -o-filter: grayscale(0%);
  150. letter-spacing: 3px;}
  151.  
  152. #left {
  153. margin-left: 250px;
  154. }
  155.  
  156. #side {
  157. background-repeat: repeat;
  158. width: 250px;
  159. height: 100%;
  160. margin-top: -8px;
  161. margin-left: -8px;
  162. background-image: url('{image:side1}');
  163. position: fixed;
  164. }
  165.  
  166. #side2 {
  167. background-repeat: {text:side2 repeat};
  168. background-position: {text:side2 position};
  169. width: 250px;
  170. height: 100%;
  171. opacity: .1;
  172. filter: url(css/grayscale.svg#greyscale);
  173. filter: gray;
  174. -webkit-filter: grayscale(50%);
  175. -moz-filter: grayscale(50%);
  176. -ms-filter: grayscale(50%);
  177. -webkit-filter: grayscale(50%);
  178. -o-filter: grayscale(50%);
  179. position: fixed;
  180. background-image: url('{image:side2}');
  181. }
  182.  
  183. #side3 {
  184. background-repeat: repeat;
  185. width: 250px;
  186. height: 100%;
  187. margin-left: -8px;
  188. margin-top: -8px;
  189. position: fixed;
  190. background-image: url('{image:side3}');
  191. }
  192.  
  193. #sidebar {
  194. opacity: 0;
  195. color: {color:desctext};
  196. margin-top: {text:sidebarmargin}px;
  197. position: fixed;
  198. width: 200px;
  199. text-shadow: 1px 1px 1px {color:text};
  200. margin-left: -100px;
  201. height: auto;
  202. text-align: center;
  203. font-style: italic;
  204. }
  205.  
  206. #sidebar2 {
  207. opacity: 1;
  208. margin-top: {text:linksmargin}px;
  209. color: {color:desctext};
  210. position: fixed;
  211. width: 200px;
  212. margin-left: 25px;
  213. height: auto;
  214. text-align: center;
  215. font-style: italic;
  216. }
  217.  
  218. #side:hover #sidebar {
  219. opacity: 1;
  220. margin-left: 25px;
  221. -moz-transition-duration: 1s;
  222. -webkit-transition-duration:1s;
  223. -o-transition-duration: 1s;
  224. }
  225.  
  226. #simg {
  227. width: 195px;
  228. margin-left: 1px;
  229. margin-bottom: 5px;
  230. filter: url(css/grayscale.svg#greyscale);
  231. filter: gray;
  232. height: auto;
  233. -webkit-filter: grayscale(50%);
  234. -moz-filter: grayscale(50%);
  235. -ms-filter: grayscale(50%);
  236. -webkit-filter: grayscale(50%);
  237. -o-filter: grayscale(50%);
  238. }
  239.  
  240. #simg img {
  241. border: 3px solid {color:accent1};
  242. }
  243.  
  244.  
  245. #simg:hover {
  246. -moz-transition-duration: 1s;
  247. -webkit-transition-duration:1s;
  248. -o-transition-duration: 1s;
  249. filter: url(css/grayscale.svg#greyscale);
  250. filter: gray;
  251. -webkit-filter: grayscale(0%);
  252. -moz-filter: grayscale(0%);
  253. -ms-filter: grayscale(0%);
  254. -webkit-filter: grayscale(0%);
  255. -o-filter: grayscale(0%);
  256. }
  257.  
  258. #simg2 {
  259. margin-left: 1px;
  260. margin-bottom: 5px;
  261. filter: url(css/grayscale.svg#greyscale);
  262. filter: gray;
  263. border-radius: 100px;
  264. -webkit-filter: grayscale(50%);
  265. -moz-filter: grayscale(50%);
  266. -ms-filter: grayscale(50%);
  267. -webkit-filter: grayscale(50%);
  268. -o-filter: grayscale(50%);
  269. }
  270.  
  271. #simg2 img {
  272. border-radius: 100px;
  273. width: 100px;
  274. height: 100px;
  275. }
  276.  
  277.  
  278. #simg2:hover {
  279. -moz-transition-duration: 1s;
  280. -webkit-transition-duration:1s;
  281. -o-transition-duration: 1s;
  282. filter: url(css/grayscale.svg#greyscale);
  283. filter: gray;
  284. -webkit-filter: grayscale(0%);
  285. -moz-filter: grayscale(0%);
  286. -ms-filter: grayscale(0%);
  287. -webkit-filter: grayscale(0%);
  288. -o-filter: grayscale(0%);
  289. }
  290.  
  291. #links {
  292. margin-top: 10px;
  293. line-height: 250%;
  294. }
  295.  
  296. #links a {
  297. text-decoration: none;
  298. text-transform: uppercase;
  299. color: {color:desctext};
  300. margin-right: 2px;
  301. padding: 5px;
  302. background-color: {color:accent1};
  303. filter: url(css/grayscale.svg#greyscale);
  304. filter: gray;
  305. -webkit-filter: grayscale(50%);
  306. -moz-filter: grayscale(50%);
  307. -ms-filter: grayscale(50%);
  308. -webkit-filter: grayscale(50%);
  309. -o-filter: grayscale(50%);
  310. }
  311.  
  312. #links a:hover {
  313. -moz-transition-duration: 1s;
  314. -webkit-transition-duration:1s;
  315. -o-transition-duration: 1s;
  316. color: {color:desctext};
  317. padding: 2px;
  318. background-color: {color:accent1};
  319. filter: url(css/grayscale.svg#greyscale);
  320. filter: gray;
  321. -webkit-filter: grayscale(0%);
  322. -moz-filter: grayscale(0%);
  323. -ms-filter: grayscale(0%);
  324. -webkit-filter: grayscale(0%);
  325. -o-filter: grayscale(0%);
  326. letter-spacing: 1px;
  327. }
  328.  
  329. #title {
  330. margin-left: 2px;
  331. font-size: 12px;
  332. padding: 5px;
  333. letter-spacing: 3px;
  334. filter: url(css/grayscale.svg#greyscale);
  335. filter: gray;
  336. -webkit-filter: grayscale(50%);
  337. -moz-filter: grayscale(50%);
  338. -ms-filter: grayscale(50%);
  339. -webkit-filter: grayscale(50%);
  340. -o-filter: grayscale(50%);
  341. text-transform: uppercase;
  342. }
  343.  
  344. #title:hover {
  345. -moz-transition-duration: 1s;
  346. -webkit-transition-duration:1s;
  347. -o-transition-duration: 1s;
  348. filter: url(css/grayscale.svg#greyscale);
  349. filter: gray;
  350. -webkit-filter: grayscale(0%);
  351. -moz-filter: grayscale(0%);
  352. -ms-filter: grayscale(0%);
  353. -webkit-filter: grayscale(0%);
  354. -o-filter: grayscale(0%);
  355. letter-spacing: 1px;
  356. }
  357.  
  358. #subtitle {
  359. text-transform: lowercase;
  360. font-style: normal;
  361. color: {color:accent1};
  362. font-size: 6pt;
  363. letter-spacing: 2px;
  364. margin-top: -5px;
  365. margin-bottom: 5px;
  366. }
  367.  
  368. #posts {
  369. margin-left: 550px;
  370. position: absolute;
  371. margin-top: 20px;
  372. }
  373.  
  374. #post {
  375. background-color: {color:posts};
  376. margin-bottom:50px;
  377. padding:5px;
  378. width: 500px;
  379. }
  380.  
  381. #info {
  382. margin-top: 5px;
  383. padding:5px;
  384. line-height: 150%;
  385. text-align: center;
  386. width: 490px;
  387. border-top: 1px solid {color:infobg};
  388. text-transform: uppercase;
  389. font-size:7px;
  390. }
  391.  
  392.  
  393. blockquote img {
  394. width: 100%;
  395. }
  396.  
  397. blockquote {
  398. border-left: 2px solid;
  399. padding-left: 5px;
  400. }
  401.  
  402. #audioplayer {
  403. width: 25px;
  404. height: 25px;
  405. overflow:hidden;
  406. position:absolute;
  407. margin-left: 238px;
  408. margin-top: 25px;
  409. border-radius: 200px;
  410. opacity: 0.8;
  411. filter:alpha(opacity=80);
  412. -moz-opacity: 0.8;
  413. -khtml-opacity: 0.8;
  414. }
  415.  
  416. #albumart {
  417. float:center;
  418. margin: 0px 7px;
  419. margin-bottom: 2px;
  420. }
  421.  
  422. #caption {
  423. margin-top: 20px;
  424. }
  425.  
  426. #a {
  427. font-style: italic;
  428. text-align: center;
  429. position: center;
  430. }
  431.  
  432. h1 {
  433. color: {color:accent1};
  434. text-transform: uppercase;
  435. font-size: 20px;
  436. font-style:italic;
  437. text-align: center;
  438. line-height: 100%;
  439. font-weight: normal;
  440. }
  441.  
  442. h2 {
  443. color: {color:accent1};
  444. text-transform: uppercase;
  445. font-size: 20px;
  446. font-style:italic;
  447. text-align: center;
  448. line-height: 100%;
  449. font-weight: normal;
  450. }
  451.  
  452.  
  453. #h3 {
  454. color: {color:accent1};
  455. text-transform: uppercase;
  456. font-size: 15px;
  457. font-style:italic;
  458. text-align: center;
  459. line-height: 100%;
  460. font-weight: normal;
  461. }
  462.  
  463.  
  464.  
  465. #l {
  466. line-height: 120%;
  467. border-bottom: 1px solid {color:accent1};
  468. margin-bottom: 1px;
  469. }
  470.  
  471.  
  472. #l b {
  473. color: {color:desctext};
  474. padding: 2px;
  475. background-color: {color:accent1};
  476. }
  477.  
  478. #pages {
  479. margin-left: 60px;
  480. margin-top: 650px;
  481. position: fixed;
  482. }
  483.  
  484. .jump_page {
  485. padding: 4px 8px;
  486. background-color: {color:accent1};
  487. color:{color:desctext};
  488. font-size:8px;
  489. text-decoration:none;
  490. }
  491.  
  492. .current_page, .jump_page:hover {
  493. padding: 2px 6px;
  494. font-size:8px;
  495. background-color: {color:accent1};
  496. text-decoration:none;
  497. }
  498.  
  499.  
  500. </style>
  501.  
  502. </head>
  503.  
  504. <body>
  505.  
  506. <div id="side3">
  507. <Div id="sidebar2">
  508. <div id="simg2"><img src="{image:portrait}"></div>
  509. <div id="h3">{text:othertitle}</div>
  510. <Div id="links">
  511. <a href="/">home</a> <a href="/ask">ask</a> <a href="/archive">archive</a><Br>
  512. <a href="{text:link1}">{text:link1title}</a> <a href="{text:link2}">{text:link2title}</a> <a href="{text:link3}">{text:link3title}</a> <a href="{text:link4}">{text:link4title}</a> <a href="{text:link5}">{text:link5title}</a>
  513. </div>
  514.  
  515. </div>
  516. </div>
  517.  
  518. <div id="left">
  519.  
  520. <div id="side"> <div id="side2"></div>
  521.  
  522. <div id="sidebar">
  523. <div id="title">{title}</div>
  524. <div id="subtitle">{text:subtitle}</div>
  525. <div id="simg"><img src="{image:sidebar}" width="195" height="auto"></div>
  526. {description}
  527. </div>
  528. </div>
  529. </div>
  530.  
  531.  
  532. <div id="pages">
  533. {block:Pagination}
  534. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  535. {block:JumpPagination length="5"}
  536. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  537. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  538. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  539. {/block:Pagination}
  540. </div>
  541.  
  542. <div id="cred"><a href="http://lutherwest.tumblr.com/">theme</a></div>
  543.  
  544. <div id="posts">{block:Posts}<div id="post">
  545.  
  546. {block:Text}<h2>{block:Title}{Title}{/block:Title}</h2>{Body}{/block:Text}
  547.  
  548. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}
  549.  
  550. {Caption}{/block:Caption}{/block:Photo}
  551.  
  552. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}
  553.  
  554. {/block:Photoset}
  555.  
  556. {block:Quote}<h1>{Quote}</h1>{block:Source}<div style="text-align:center;">—{Source}</div>{/block:Source}{/block:Quote}
  557.  
  558. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}
  559.  
  560. {Description}{/block:Description}{/block:Link}
  561.  
  562. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>
  563.  
  564. <div id="l">{Label}</b>{/block:Label} {Line}<br></div>{/block:Lines}{/block:Chat}
  565.  
  566. {block:Audio}
  567. <div id="a">
  568. <div id="audioplayer">{AudioPlayerWhite}</div>
  569. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="70">{/block:AlbumArt}</div>
  570. {block:TrackName}
  571. <b>Name:</b> {TrackName}<br>
  572. {/block:TrackName}
  573. {block:Artist}
  574. <b>Artist:</b> {Artist}<br>
  575. {/block:Artist}
  576. {block:Album}
  577. <b>Album:</b> {Album}<br>
  578. {/block:Album}
  579. {PlayCountWithLabel}
  580. </div>
  581. {block:caption}<div id="caption">{Caption}</div>{/block:caption}
  582. {/block:Audio}
  583.  
  584. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  585.  
  586. {block:Answer}<h1>{Asker} wondered,</h1>
  587.  
  588. <div style="text-align:center; text-transform: uppercase;">{Question}</div>
  589. <br>{Answer}{/block:Answer}
  590.  
  591. <div id="info">
  592. {block:Date}posted {TimeAgo}{/block:Date} with <a href="{Permalink}">{NoteCountWithLabel}</a>{block:RebloggedFrom}<br>via: <a href="{ReblogParentURL}"
  593. title="{ReblogParentTitle}"><b>{ReblogParentName}</b></a> source: <a
  594.  
  595. href="{ReblogRootURL}"title="{ReblogRoottitle}">{ReblogRootName}</a>
  596.  
  597. {/block:RebloggedFrom}<br> {block:HasTags}{block:Tags} #<a href="{TagURL}">{Tag}</a>
  598.  
  599. {/block:Tags}{/block:HasTags}</div>
  600.  
  601. </div>
  602. {block:PostNotes}{PostNotes}{/block:PostNotes}
  603. {/block:Posts}</div>
  604.  
  605. </body>
  606.  
  607. </html>
Advertisement
Add Comment
Please, Sign In to add comment