API tools faq
paste
thetruththemes

Oblivion - Remember

thetruththemes
Oct 21st, 2015 (edited)
1,860
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.79 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <!---------------------------------------------------------------------------
  3.  
  4. ,,
  5. ,GG,
  6. GIIG
  7. Gl''lG
  8. ;G' 'G;
  9. GP YG
  10. oQ' 'Qo -Oʙʟɪᴠɪᴏɴ ᴛʜᴇᴍᴇ ʙʏ
  11. *TGGGGGGGGGGGGQQQ, ,QQQGGGGGGGGGGGGP* ɴʏᴄᴛᴏᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  12. *TGo, '* *' ,oGP*
  13. *TGo, ɴʏᴄᴛ□ᴛʜᴇᴍᴇs ,oGP* -ᴘʟᴇᴀsᴇ ʀᴇғᴇʀ ᴛᴏ ᴏʀɪɢɪɴᴀʟ
  14. *TGio,, ,,oiGP* ᴘᴏsᴛ ʟɪɴᴋ ғᴏʀ ʀᴜʟᴇs ᴀɴᴅ ᴍɪsᴄ
  15. ;GGT' 'TGG:
  16. GG' ii 'GG -ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴀɴʏ ᴏғ ᴛʜᴇ
  17. GG' ,GG, 'GG ᴄᴏᴅᴇ ᴄʀᴇᴅɪᴛ ᴏʀ ᴍᴏᴠᴇ ɪᴛ ᴛᴏ
  18. GG* oGGGGo. *GG ᴀ ᴘᴀɢᴇ.
  19. oG* oGG* *GGo. *Go
  20. ;GG;oGG* *GGo;GG;
  21. ,GGGT* *TGGG,
  22. ""' '""
  23.  
  24. ---------------------------------------------------------------------------->
  25.  
  26. <!-- hover title -->
  27. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  28. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  29.  
  30. <head>
  31.  
  32. <!-- website necessities -->
  33. {block:Ifcustomfavicon}<link rel="shortcut icon" href="{image:favicon}"/>{/block:Ifcustomfavicon}
  34. {block:IfNotcustomfavicon}<link rel="shortcut icon" href="{favicon}"/>{/block:IfNotcustomfavicon}
  35.  
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  37. <title>{Title}</title>
  38. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  39.  
  40. <!-------------------------------- IMAGES ---------------------------------->
  41. <meta name="image:Card Image BG 1" content="http://static.tumblr.com/u5vz4xb/4tjnwhggd/untitled-2.png"/>
  42. <meta name="image:Card Image BG 2" content="http://static.tumblr.com/u5vz4xb/MUJnwk16q/untitled-1.png"/>
  43. <meta name="image:READ OP Card Cutout" content="http://static.tumblr.com/u5vz4xb/3N0nwah4k/card5.png"/>
  44. <meta name="image:Custom Cursor" content="http://static.tumblr.com/u5vz4xb/w7qnwk0h0/delete_png1.png"/>
  45. <meta name="image:Custom Cursor Links" content="http://static.tumblr.com/u5vz4xb/L9tnwk0h2/delete_png2.png"/>
  46. <meta name="image:Favicon" content="https://31.media.tumblr.com/e143cc0f3a13efeca4ae20c71c5890ca/tumblr_inline_nilpryAesd1rg1lxe.png"/>
  47. <meta name="image:Album Art" content="https://31.media.tumblr.com/26a12b635fa21b1c335e22e1cd84e110/tumblr_inline_ni4vz2P0bz1rg1lxe.png"/>
  48.  
  49. <!-------------------------------- COLORS ---------------------------------->
  50. <!-- Full Body -->
  51. <meta name="color:Background" content="#f0f0f0"/>
  52. <meta name="color:Scroll Gradient Top" content="#94484c"/>
  53. <meta name="color:Scroll Gradient Bottom" content="#cb837e"/>
  54. <meta name="color:Scroll BG" content="#f0f0f0"/>
  55. <!-- Sidebar -->
  56. <meta name="color:Card Gradient BG Top" content="#4c5550"/>
  57. <meta name="color:Card Gradient BG Bottom" content="#b29e6c"/>
  58. <meta name="color:Card Hover BG Top" content="#ebe9e0"/>
  59. <meta name="color:Card Hover BG Bottom" content="#ebe9e0"/>
  60. <meta name="color:Description Titles" content="#dddddd"/>
  61. <meta name="color:Description Text" content="#b87175"/>
  62. <meta name="color:Description Links" content="#535754"/>
  63. <meta name="color:Description Links Hover" content="#838459"/>
  64. <meta name="color:Description Scrollbar" content="#cb837e"/>
  65. <meta name="color:Sidelink 1" content="#4c5550"/>
  66. <meta name="color:Sidelink 2" content="#606355"/>
  67. <meta name="color:Sidelink 3" content="#74715b"/>
  68. <meta name="color:Sidelink 4" content="#898060"/>
  69. <meta name="color:Sidelink 5" content="#9d8f66"/>
  70. <meta name="color:Sidelink 6" content="#b29e6c"/>
  71. <!-- Posts -->
  72. <meta name="color:Posts BG" content="#ebe9e0"/>
  73. <meta name="color:Posts Title" content="#535754"/>
  74. <meta name="color:Posts Text" content="#9fa09a"/>
  75. <meta name="color:Posts Bold" content="#797b77"/>
  76. <meta name="color:Posts Italic" content="#9fa09a"/>
  77. <meta name="color:Posts Pre" content="#f5f5f5"/>
  78. <meta name="color:Posts Pre BG" content="#cccccc"/>
  79. <meta name="color:Posts Links" content="#aa484d"/>
  80. <meta name="color:Posts Links Hover" content="#783a41"/>
  81. <meta name="color:Posts Blockquote" content="#dedacb"/>
  82. <meta name="color:Ask BG" content="#dedacb"/>
  83. <meta name="color:Audio Player" content="#c63f16"/>
  84. <!-- Post Endings -->
  85. <meta name="color:Postending Circles" content="#7f795e"/>
  86. <meta name="color:Postending Circles Hover" content="#b29e6c"/>
  87. <meta name="color:Ending BG" content="#d0c9a1"/>
  88. <meta name="color:Ending Text" content="#f0f0f0"/>
  89. <meta name="color:Ending Links" content="#535852"/>
  90. <meta name="color:Ending Links Hover" content="#7f795e"/>
  91. <!-- Permalink -->
  92. <meta name="color:Permalink Text" content="#cccccc"/>
  93. <meta name="color:Permalink Links" content="#bbbbbb"/>
  94. <meta name="color:Permalink Links Hover" content="#cb837e"/>
  95. <meta name="color:Permalink Blockquote" content="#dddddd"/>
  96. <meta name="color:Permalink Scroll Thumb" content="#dddddd"/>
  97. <!-- Misc. -->
  98. <meta name="color:Link Hover BG" content="#545754"/>
  99. <meta name="color:Link Hover Text" content="#b8b8b8"/>
  100. <meta name="color:Link Hover Accent" content="#be6a5d"/>
  101. <meta name="color:Selection BG" content="#dac9bd"/>
  102. <meta name="color:Selection Text" content="#aa7373"/>
  103. <meta name="color:Selection Links" content="#f0f0f0"/>
  104.  
  105. <!------------------------------- OPTIONS ---------------------------------->
  106. <meta name="if:Card Image Backgrounds" content="1"/>
  107. <meta name="if:Monochrome Photos" content="0"/>
  108. <meta name="if:Fade Photos" content="1"/>
  109. <meta name="if:Postending Circles for Indexpage" content="0"/>
  110. <meta name="if:Custom Cursor" content="1"/>
  111. <meta name="if:Custom Favicon" content="1"/>
  112. <meta name="if:Dark Audio Player" content="0"/>
  113. <meta name="if:Credit on the Right" content="1"/>
  114.  
  115. <!-------------------------------- TEXTS ----------------------------------->
  116. <meta name="text:Card Title" content="Thinking of You" />
  117. <meta name="text:Card Hover Title" content="Where ever You Are" />
  118. <meta name="text:Link 1 URL" content="/" />
  119. <meta name="text:Link 1 Hover" content="Link 1" />
  120. <meta name="text:Link 2 URL" content="/" />
  121. <meta name="text:Link 2 Hover" content="Link 2" />
  122. <meta name="text:Link 3 URL" content="/" />
  123. <meta name="text:Link 3 Hover" content="Link 3" />
  124. <meta name="text:Ask Verb" content="asked" />
  125.  
  126. <!-- symbol font (like the credit) -->
  127. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  128. <!-- custom font 1/3 -->
  129. <link href='http://fonts.googleapis.com/css?family=Cinzel:400,700,900' rel='stylesheet' type='text/css'>
  130.  
  131. </head>
  132.  
  133. <!-- custom font 2/3 -->
  134. <script type="text/javascript">
  135. WebFontConfig = {
  136. google: { families: [ 'Cinzel:400,700,900:latin' ] }
  137. };
  138. (function() {
  139. var wf = document.createElement('script');
  140. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  141. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  142. wf.type = 'text/javascript';
  143. wf.async = 'true';
  144. var s = document.getElementsByTagName('script')[0];
  145. s.parentNode.insertBefore(wf, s);
  146. })(); </script>
  147.  
  148. <style type="text/css">
  149.  
  150. /* custom font 3/3 */
  151. @import url(http://fonts.googleapis.com/css?family=Cinzel:400,700,900);
  152.  
  153. /* ------------------------------ DECORATION ---------------------------- */
  154.  
  155. /* body */
  156. body {
  157. color:{color:Posts Text};
  158. letter-spacing:.5px;
  159. background:{color:background};
  160. font-size:10px;
  161. font-family:calibri;
  162. line-height:13px;
  163. text-align:justify;}
  164.  
  165. /*------------------------- CREDIT; DON'T REMOVE --------------------------*/
  166.  
  167. #credit {
  168. z-index:99999; position:fixed;
  169. bottom:10px;
  170. {block:IfNotCreditOnTheRight}left:10px;{/block:IfNotCreditOnTheRight}
  171. {block:IfCreditOnTheRight}right:10px;{/block:IfCreditOnTheRight}
  172. width:20px; height:20px;
  173. font-size:20px; font-weight:bold;
  174. color:{color:Postending Circles};
  175. text-shadow:0 0 .5px {color:Postending Circles};
  176. -webkit-transition: all 0.3s linear;
  177. -moz-transition: all 0.3s linear;
  178. transition: all 0.3s linear;}
  179. #credit:hover {
  180. color:{color:Postending Circles Hover};
  181. text-shadow:0 0 .5px {color:Postending Circles Hover};}
  182.  
  183. /* ----------------------------- MINOR STUFF ---------------------------- */
  184.  
  185. /* hover text */
  186. #s-m-t-tooltip {
  187. z-index: 99999;
  188. display: block;
  189. margin-left: 25px;
  190. margin-top: 7px;
  191. max-width:200px;
  192. padding: 4px 5px 5px 6px;
  193. color: {color:Link Hover Text};
  194. font-family:Calibri;
  195. font-size:8px;
  196. font-weight:bold;
  197. line-height:8px;
  198. text-transform:uppercase;
  199. letter-spacing:1px;
  200. text-align:center;
  201. border:1px solid {color:Link Hover Accent};
  202. background: {color:Link Hover BG};
  203. box-shadow:0px 0px 0px 1px {color:Link Hover BG};
  204. border-radius: 1px;}
  205. #s-m-t-tooltip::first-letter {
  206. color: {color:Link Hover Accent};}
  207.  
  208. /* scrollbar */
  209. ::-webkit-scrollbar {
  210. height: 14px; width: 14px;
  211. background: {color:Scroll BG};}
  212. ::-webkit-scrollbar-thumb {
  213. background: -webkit-linear-gradient({color:Scroll Gradient Top}, {color:Scroll Gradient Bottom});
  214. background: -o-linear-gradient({color:Scroll Gradient Top}, {color:Scroll Gradient Bottom});
  215. background: -moz-linear-gradient({color:Scroll Gradient Top}, {color:Scroll Gradient Bottom});
  216. background: linear-gradient({color:Scroll Gradient Top}, {color:Scroll Gradient Bottom});
  217. border:4px solid {color:Scroll BG};
  218. border-radius:5px;}
  219.  
  220. /* drag n' click selection */
  221. ::selection {
  222. background: {color:Selection BG};
  223. color: {color:Selection Text};}
  224. ::-moz-selection {
  225. background: {color:Selection BG};
  226. color: {color:Selection Text};}
  227. a::selection {
  228. color: {color:Selection Links};}
  229. a::-moz-selection {
  230. color: {color:Selection Links};}
  231.  
  232. #tumblr_controls {
  233. opacity:0.33;
  234. -webkit-filter: invert(100%) brightness(95%) saturate(500%);
  235. -moz-filter: invert(100%) brightness(95%) saturate(500%);
  236. -ms-filter: invert(100%) brightness(95%) saturate(500%);
  237. -o-filter: invert(100%) brightness(95%) saturate(500%);
  238. filter: invert(100%) brightness(95%) saturate(500%);
  239. -webkit-transition-duration: 0.5s;
  240. -moz-transition-duration:0.5s;
  241. -ms-transition-duration:0.5s;
  242. -o-transition-duration:0.5s;
  243. transition-duration:0.5s;}
  244.  
  245. /* ------------------------- FONT STUFF --------------------------- */
  246.  
  247. /* links */
  248. a:link, a:active, a:visited{
  249. text-decoration:none;
  250. color:{color:Posts Links};
  251. -webkit-transition: all 0.5s linear;
  252. -moz-transition: all 0.5s linear;
  253. transition: all 0.5s linear;}
  254. a:hover {
  255. color:{color:Posts Links Hover};
  256. -webkit-transition: all 0.2s linear;
  257. -moz-transition: all 0.2s linear;
  258. transition: all 0.2s linear;}
  259.  
  260. /* main font decorations */
  261. b, strong{color:{color:Posts Bold};}
  262. i, em {color:{color:Posts Italic};}
  263. pre {color:{color:Posts Pre};
  264. font-size:10px;
  265. max-width:100%;
  266. font-family:consolas;
  267. word-break: break-all;
  268. background:{color:Posts Pre BG};
  269. padding:4px 7px 3px 7px;
  270. white-space: pre-wrap;
  271. white-space: -moz-pre-wrap;
  272. white-space: -pre-wrap;
  273. white-space: -o-pre-wrap;
  274. word-wrap: break-word;}
  275.  
  276. a b, b a, strong a, a strong {
  277. font-weight:bold;
  278. color:{color:Posts Links};}
  279.  
  280. /* text and link post titles */
  281. h1 {font: normal normal 700 18px/18px Cinzel;
  282. color:{color:Posts Title};
  283. text-align:center;
  284. letter-spacing:0.5px;}
  285. /* quote and ask post titles */
  286. h2 {font: normal normal 400 17px/17px Cinzel;
  287. color:{color:Posts Bold};
  288. text-align:center;
  289. letter-spacing:0.5px;}
  290. .posts h1:first-child, .posts h2:first-child {margin-top:0px;}
  291.  
  292. /* -------------------------------- SIDEBAR ------------------------------ */
  293.  
  294. /* sidebar container */
  295. #side {
  296. position:fixed;
  297. left:50%; margin-left:-390px;
  298. top:50%; margin-top:-135px;
  299. height:270px; width:220px;}
  300.  
  301. /* hover titles */
  302. #title1, #title2 {
  303. position:fixed;
  304. left:50%; margin-left:-390px;
  305. top:50%; margin-top:-160px;
  306. width:220px;
  307. font-family:Cinzel;
  308. font-weight:700;
  309. letter-spacing:0.5px;
  310. color:{color:Description Titles};
  311. text-align:center;
  312. font-size:18px;
  313. line-height:18px;}
  314. #title1 {
  315. opacity:1;
  316. -webkit-transition: all 0.5s linear;
  317. -moz-transition: all 0.5s linear;
  318. transition: all 0.5s linear;}
  319. #side:hover #title1 {opacity:0;}
  320. #title2 {
  321. opacity:0;
  322. -webkit-transition: all 0.5s linear;
  323. -moz-transition: all 0.5s linear;
  324. transition: all 0.5s linear;}
  325. #side:hover #title2 {opacity:1;}
  326.  
  327. /* memory card */
  328. #card {
  329. z-index:2;
  330. opacity:1;
  331. position:fixed;
  332. left:50%; margin-left:-370px;
  333. top:50%; margin-top:-125px;
  334. width:175px; height:250px;
  335. {block:IfCardImageBackgrounds}
  336. background:url({image:Card Image BG 1}) center/cover;
  337. {/block:IfCardImageBackgrounds}
  338. {block:IfNotCardImageBackgrounds}
  339. background: {color:Card Gradient BG Bottom};
  340. box-shadow:0px 225px 225px -100px {color:Card Gradient BG Top} inset;
  341. {/block:IfNotCardImageBackgrounds}
  342. -webkit-transition: all 0.5s linear;
  343. -moz-transition: all 0.5s linear;
  344. transition: all 0.5s linear;}
  345. #side:hover #card {
  346. {block:IfCardImageBackgrounds}
  347. background:url({image:Card Image BG 2}) center/cover;
  348. {/block:IfCardImageBackgrounds}
  349. {block:IfNotCardImageBackgrounds}
  350. background: {color:Card Hover BG Bottom};
  351. box-shadow:0px 225px 225px -100px {color:Card Hover BG Top} inset;
  352. {/block:IfNotCardImageBackgrounds}
  353. margin-left:-380px;}
  354.  
  355. /* page navigation */
  356. #pagination {
  357. z-index:3;
  358. opacity:0;
  359. position:fixed;
  360. top:50%; margin-top:-15px;
  361. left: 50%; margin-left:-370px;
  362. width:175px;
  363. font-family:Calibri;
  364. text-transform:uppercase;
  365. font-size:8px;
  366. font-weight:bold;
  367. letter-spacing:1px;
  368. text-align:center;
  369. color:{color:Description Text};
  370. text-shadow:0 0 0 {color:Description Text};
  371. -webkit-transition: all 0.5s linear;
  372. -moz-transition: all 0.5s linear;
  373. transition: all 0.5s linear;}
  374. #side:hover #pagination {
  375. opacity:1;
  376. margin-left:-380px;}
  377. #pagination a {
  378. font-size:10px;
  379. color:{color:Description Links};
  380. text-shadow:none;}
  381. #pagination a:hover {
  382. color:{color:Description Links Hover};
  383. text-shadow:none;}
  384.  
  385. /* description */
  386. #description {
  387. z-index:3;
  388. opacity:0;
  389. position:fixed;
  390. top:50%; margin-top:0px;
  391. left: 50%; margin-left:-355px;
  392. width:145px; max-height:110px;
  393. padding-right:3px;
  394. font:normal normal bold 8px/10px Calibri;
  395. color:{color:Description Text};
  396. text-transform:uppercase;
  397. overflow:auto;
  398. -webkit-transition: all 0.5s linear;
  399. -moz-transition: all 0.5s linear;
  400. transition: all 0.5s linear;}
  401. #side:hover #description {
  402. opacity:1;
  403. margin-left:-365px;}
  404. #description::-webkit-scrollbar {
  405. height: 2px;
  406. width: 2px;
  407. background: transparent;}
  408. #description::-webkit-scrollbar-thumb {
  409. background: {color:description scrollbar};
  410. border:none;}
  411.  
  412. /* description: fonts */
  413. #description a {
  414. color:{color:Description Links};}
  415. #description a:hover {
  416. color:{color:Description Links Hover};}
  417. #description b, #description strong, #description em, #description i {
  418. color:{color:Description Text};}
  419. #description b, #description strong {
  420. text-shadow:0 0 0 {color:Description Text};}
  421.  
  422. /* sidebar links */
  423. #sidelinks {
  424. z-index:1;
  425. opacity:0;
  426. position:fixed;
  427. top:50%; margin-top:-105px;
  428. left:50%; margin-left:-210px;
  429. -webkit-transition: all 0.5s linear;
  430. -moz-transition: all 0.5s linear;
  431. transition: all 0.5s linear;}
  432. #side:hover #sidelinks {
  433. opacity:1;
  434. margin-left:-195px;}
  435. #sidelinks a {
  436. display:block;
  437. margin-top:20px;
  438. font-size:15px;}
  439. #link1 {
  440. color:{color:Sidelink 1};
  441. text-shadow:0 0 .5px {color:Sidelink 1};}
  442. #link2 {
  443. color:{color:Sidelink 2};
  444. text-shadow:0 0 .5px {color:Sidelink 2};}
  445. #link3 {
  446. color:{color:Sidelink 3};
  447. text-shadow:0 0 .5px {color:Sidelink 3};}
  448. #link4 {
  449. color:{color:Sidelink 4};
  450. text-shadow:0 0 .5px {color:Sidelink 4};}
  451. #link5 {
  452. color:{color:Sidelink 5};
  453. text-shadow:0 0 .5px {color:Sidelink 5};}
  454. #link6 {
  455. color:{color:Sidelink 6};
  456. text-shadow:0 0 .5px {color:Sidelink 6};}
  457.  
  458. /* -------------------------------- POSTS ------------------------------- */
  459.  
  460. /* posts position */
  461. #entries {
  462. margin-top:70px;
  463. margin-left:50%;
  464. text-align:justify;}
  465. /* posts themselves */
  466. .posts {
  467. margin:0 0 70px -60px;
  468. overflow:hidden;
  469. width: 500px;
  470. min-height:33px;
  471. text-align:justify;
  472. padding:20px;
  473. background: {color:Posts BG};
  474. border:4px double {color:Background};}
  475.  
  476. /* ----------------------------- POST TYPES ------------------------------ */
  477.  
  478. /* text post lines */
  479. blockquote {
  480. padding:0px;
  481. padding-left:6px;
  482. margin:-3px 0 -1px 6px;
  483. border-left:3px solid {color:posts blockquote};}
  484. hr {display: block;
  485. margin: 20px 50px;
  486. border:1px solid transparent;
  487. border-top: 2px solid {color:posts blockquote};}
  488.  
  489. /* bullet lists */
  490. ul {margin-left:-20px;
  491. list-style-type:circle;}
  492. ol {margin-left:-20px;
  493. list-style-type:decimal;}
  494. li {margin-bottom:3px;}
  495.  
  496. /* text-images */
  497. .posts img {
  498. vertical-align:middle;
  499. max-width:100%;}
  500. /* the credit below images that are from other people */
  501. .tmblr-full {margin:0;}
  502. .tmblr-attribution {
  503. opacity:.8;
  504. margin-top:0px;
  505. font-family:Calibri;
  506. font-size:8px; line-height:8px;
  507. text-transform:uppercase;
  508. letter-spacing:1px;}
  509. .tmblr-attribution::before {content: "└";}
  510. .tmblr-attribution::after {content: " >";}
  511. img a{border:none; max-width:100%;}
  512.  
  513. /* link posts */
  514. .link-posts a {
  515. background: {color:Posts Links};
  516. display:inline-block;
  517. width: 480px;
  518. border-radius:3px;
  519. padding:10px;
  520. color:{color:Posts BG};}
  521. .link-posts a:hover {
  522. background: {color:Posts Links Hover}}
  523.  
  524. /* ask posts */
  525. .ask-posts {
  526. min-height:64px;
  527. padding: 10px;
  528. background: {color:ask bg};
  529. border-radius:3px;}
  530. .ask-posts img {
  531. vertical-align:middle;
  532. display:inline-block;
  533. margin-right:7px;
  534. border-radius:2px;
  535. max-width:64px;}
  536. .ask-posts .question {
  537. vertical-align:middle;
  538. display:inline-block;
  539. width:406px;}
  540. .ask-posts h2 {text-align:left; margin:0px 0px 5px 0px;}
  541.  
  542. /* quote posts */
  543. .quote-posts {
  544. margin:0px 0px 5px 0px;
  545. padding:10px;
  546. text-align:center}
  547. .quote {
  548. vertical-align:middle;
  549. width:430px;
  550. display:inline-block;}
  551. .quote-posts .fa {
  552. width:20px;
  553. vertical-align:middle;
  554. display:inline-block;
  555. color:{color:Posts Blockquote}}
  556.  
  557. /* chat posts */
  558. ul.chat, .chat ol, .chat li {
  559. list-style:none;
  560. margin:0px;
  561. padding:4px 0px 4px 2px;}
  562. ul.chat, .chat ol {margin:-2px 0px;}
  563. .chat li {
  564. border-bottom:2px solid {color:Posts Blockquote};}
  565. .chat li:first-of-type {
  566. border-top:2px solid {color:Posts Blockquote};}
  567. .person {
  568. color:{color:Posts Bold};
  569. font-weight:bold}
  570.  
  571. /* photo posts */
  572. .posts img, .posts .html_photoset, .posts #audio-pic {
  573. {block:IfFadePhotos}opacity:0.75;{/block:IfFadePhotos}
  574. {block:IfMonochromePhotos}
  575. -webkit-filter: grayscale(100%);
  576. -moz-filter: grayscale(100%);
  577. -ms-filter: grayscale(100%);
  578. -o-filter: grayscale(100%);
  579. filter: grayscale(100%);{/block:IfMonochromePhotos}
  580. -webkit-transition-duration: 0.5s;
  581. -moz-transition-duration:0.5s;
  582. -o-transition-duration:0.5s;
  583. transition-duration:0.5s;}
  584. .posts:hover img, .posts:hover .html_photoset, .posts:hover #audio-pic {
  585. opacity:1;
  586. -webkit-filter: grayscale(0%);
  587. -moz-filter: grayscale(0%);
  588. -ms-filter: grayscale(0%);
  589. -o-filter: grayscale(0%);
  590. filter: grayscale(0%);
  591. -webkit-transition-duration: 0.5s;
  592. -moz-transition-duration:0.5s;
  593. -o-transition-duration:0.5s;
  594. transition-duration:0.5s;}
  595.  
  596. /* photoset focused image background */
  597. .tmblr-lightbox {
  598. background-color:transparent !important;}
  599. .vignette {
  600. z-index:99998! important;
  601. opacity:.75 !important;
  602. background-color:{color:background} !important;
  603. background-image:none !important;}
  604. .tmblr-lightbox .lightbox-image {
  605. z-index:99999! important;
  606. border-radius:0px !important;
  607. background:{color:background} !important;
  608. box-shadow:0px 0px 0px 30px {color:background} !important;}
  609. .tmblr-lightbox .lightbox-caption {
  610. z-index:99999! important;
  611. font-family:consolas !important;
  612. font-size:10px !important;
  613. font-size: 15px !important;
  614. font-weight: bold !important;
  615. color: {color:posts title} !important;
  616. text-shadow: 0 4px 30px {color:background} !important;}
  617.  
  618. /* video posts */
  619. .caption #youtube_iframe, .caption iframe {
  620. margin:5px 0px 5px 0px;
  621. max-width:100%;}
  622.  
  623. /* audio posts */
  624. #audio-pic {
  625. display:inline-block;
  626. vertical-align:middle;
  627. margin-right:2px;
  628. border-radius:3px;
  629. width:135px; height:135px;
  630. background: url('{image:Default Audio Pic}');
  631. background-size:cover;}
  632. #info-container {
  633. display:inline-block;
  634. vertical-align:middle;
  635. text-align:left;
  636. font-size:8px; line-height:15px;
  637. width:355px;
  638. text-transform:uppercase;
  639. letter-spacing:1px;}
  640. #info-container li {
  641. display:block;
  642. border-radius:3px;
  643. padding:4px 7px;
  644. margin:0px; margin-top:4px;
  645. background:{color:Posts 2nd BG};}
  646. .posts .audio_player {
  647. max-width:355px; max-height:27px;
  648. margin:0px; border-radius:3px;
  649. background:{color:Audio Player};
  650. {block:IfMonochromePhotos}
  651. -webkit-filter: grayscale(100%);
  652. -moz-filter: grayscale(100%);
  653. -ms-filter: grayscale(100%);
  654. -o-filter: grayscale(100%);
  655. filter: grayscale(100%);{/block:IfMonochromePhotos}
  656. -webkit-transition: all 0.2s linear;
  657. -moz-transition: all 0.2s linear;
  658. transition: all 0.2s linear;}
  659. .posts:hover .audio_player {
  660. {block:IfMonochromePhotos}
  661. -webkit-filter: grayscale(0%);
  662. -moz-filter: grayscale(0%);
  663. -ms-filter: grayscale(0%);
  664. -o-filter: grayscale(0%);
  665. filter: grayscale(0%);{/block:IfMonochromePhotos}}
  666. .tumblr_audio_player {
  667. width:355px; opacity:.66;}
  668.  
  669. /* ------------------------------ POSTS INFO ------------------------------ */
  670.  
  671. /* if circles */
  672. #postinfo {
  673. margin-top:35px;
  674. position:absolute;
  675. text-align:center;
  676. margin-left:-20px;
  677. width:548px;
  678. height:10px;
  679. font-size:15px;
  680. letter-spacing:15px;}
  681. #postinfo a {
  682. display:inline-block;
  683. text-decoration:none;
  684. background:none;
  685. color:{color:Postending Circles};
  686. text-shadow:0 0 .5px {color:Postending Circles};
  687. -webkit-transition: all 0.2s linear;
  688. -moz-transition: all 0.2s linear;
  689. transition: all 0.2s linear;}
  690. #postinfo a:hover {
  691. color:{color:Postending Circles Hover};
  692. text-shadow:0 0 .5px {color:Postending Circles Hover};}
  693.  
  694. /* if no circles */
  695. #postending {
  696. background: {color:Ending BG};
  697. width:496px;
  698. padding:10px;
  699. margin:15px 0px -11px -11px;
  700. text-align:center;
  701. text-transform:uppercase;
  702. font-family:Calibri;
  703. letter-spacing:1px;
  704. font-size:8px;
  705. border:3px double {color:Posts BG};
  706. color: {color:Ending Text};}
  707. #postending a {
  708. color:{color:Ending Links};}
  709. #postending a:hover {
  710. color:{color:Ending Links Hover};}
  711.  
  712. /* ---------------------------- PERMALINK -------------------------------- */
  713.  
  714. /* permalink position */
  715. #permalink {
  716. background:; /* if you want the post-notes to have a non-transparent bg */
  717. width:500px;
  718. margin: -70px 0px 0px -56px;
  719. padding: 20px;}
  720.  
  721. /* post notes container */
  722. #notescontainer {
  723. width: 500px;
  724. max-height:600px;
  725. overflow: auto;
  726. line-height:14px;
  727. text-transform:uppercase;
  728. font-family:Calibri;
  729. font-size:8px;
  730. letter-spacing:1px;
  731. text-align:left;
  732. color:{color:Permalink Text};}
  733. #notescontainer a {
  734. font-weight:bold;
  735. text-decoration:none;
  736. color:{color:Permalink Links};}
  737. #notescontainer a:hover {
  738. color:{color:Permalink Links Hover};}
  739. #notescontainer blockquote {
  740. margin-top:3px;
  741. margin-bottom:3px;
  742. border-left:3px solid {color:Permalink Blockquote};}
  743.  
  744. /* permalink etc */
  745. .notes img {
  746. {block:IfFadePhotos}opacity:0.7;{/block:IfFadePhotos}
  747. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  748. width: 10px;
  749. position: relative;
  750. vertical-align: middle;
  751. padding-right: 5px;
  752. -webkit-transition: all 0.5s linear;
  753. -moz-transition: all 0.5s linear;
  754. transition: all 0.5s linear;}
  755. ol.notes, .notes li {
  756. width: 100%;
  757. list-style: none;
  758. margin: 0px;
  759. padding-left: 0px}
  760. .notes li:hover img {
  761. {block:IfFadePhotos}opacity:1;{/block:IfFadePhotos}
  762. {block:IfMonochromePhotos}-webkit-filter: grayscale(0%);{/block:IfMonochromePhotos}
  763. -webkit-transition: all 0.5s linear;
  764. -moz-transition: all 0.5s linear;
  765. transition: all 0.5s linear;}
  766.  
  767. /* permalink scrollbar */
  768. #permalink ::-webkit-scrollbar {
  769. height:3px; width:3px;
  770. background: transparent;}
  771. #permalink ::-webkit-scrollbar-thumb:vertical {
  772. background: {color:Permalink Scroll Thumb};
  773. border:none; border-radius: 1px;}
  774.  
  775. </style>
  776. <body>
  777.  
  778. <!-------------------------------- CURSOR ---------------------------------->
  779. {block:IfCustomCursor}
  780. <style type="text/css"> body {cursor: url({image:Custom Cursor}), auto;} a, a:hover{cursor:url({image:Custom Cursor Links}), auto;}
  781. </style>
  782. <!-- Custom cursors don't show up on empty spaces, but this fixes that -->
  783. <div style="position:fixed; background:rgba(0,0,0,0); top:0px; left:0px; width:100%; height:100%; z-index: -99999999999999;"></div>{/block:IfCustomCursor}
  784.  
  785. <!-------------------------- CREDIT; DON'T REMOVE -------------------------->
  786. <a href="http://nyctothemes.tumblr.com/" title="© nyctothemes" id="credit">
  787. <l class="fa fa-th"></l>
  788. </a>
  789.  
  790. <!-------------------------------- SIDEBAR --------------------------------->
  791.  
  792. <div id="side">
  793.  
  794. <div id="title1">{text:Card Title}</div>
  795. <div id="title2">{text:Card Hover Title}</div>
  796.  
  797. <img src="{image:READ OP Card Cutout}" id="card">
  798.  
  799. <!-- pagination -->
  800. {block:Pagination}<div id="pagination">
  801. {block:PreviousPage}<a href="{PreviousPage}" title="return">◀&nbsp;</a>{/block:PreviousPage}
  802. Room {CurrentPage} of {TotalPages}.
  803. {block:NextPage}<a href="{NextPage}" title="continue">&nbsp;▶</a>{/block:NextPage}
  804. </div>{/block:Pagination}
  805.  
  806. <!-- description -->
  807. <div id="description">{description}</div>
  808.  
  809. <!-- sidebar links -->
  810. <div id="sidelinks">
  811. <a href="/" title="Entrance" id="link1"><l class="fa fa-home fa-fw"></l></a>
  812. <a href="/ask" title="Question" id="link2"><l class="fa fa-envelope fa-fw"></l></a>
  813. <a href="/archive" title="Memories" id="link3"><l class="fa fa-th fa-fw"></l></a>
  814. <a href="{text:link 1 URL}" title="{text:link 1 hover}" id="link4"><l class="fa fa-heart fa-fw"></l></a>
  815. <a href="{text:link 2 URL}" title="{text:link 2 hover}" id="link5"><l class="fa fa-tags fa-fw"></l></a>
  816. <a href="{text:link 3 URL}" title="{text:link 3 hover}" id="link6"><l class="fa fa-user fa-fw"></l></a>
  817. </div>
  818.  
  819. </div>
  820.  
  821. <!--------------------------------- POSTS --------------------------------->
  822. <div id="entries">
  823. {block:posts}
  824.  
  825. <div class="posts">
  826.  
  827. <!-- text posts -->
  828. {block:Text}
  829. {block:Title}<h1>{Title}</h1>{/block:Title}
  830. <div class="caption">{Body}</div>
  831. {/block:Text}
  832.  
  833. <!-- link posts -->
  834. {block:Link}
  835. {block:Thumbnail}<center>
  836. <a href="{Thumbnail-HighRes}">
  837. <img src="{Thumbnail}" class="photo-posts" style="margin-bottom:5px; border-radius:3px">
  838. </a>
  839. </center>{/block:Thumbnail}
  840. <div class="link-posts"><h1><a href="{URL}">
  841. {Name}&nbsp;&nbsp;&#8594;</l>
  842. </a></h1></div>
  843. {block:Description}<div class="caption">
  844. <p>{Description}</p>
  845. </div>{/block:Description}
  846. {/block:Link}
  847.  
  848. <!-- ask posts -->
  849. {block:Answer}
  850. <div class="ask-posts">
  851. <img src="{AskerPortraitURL-64}">
  852. <div class="question">
  853. <h2>{Asker} {text:Ask Verb}:</h2> {Question}
  854. </div></div><br>
  855. <div id="caption">{Answer}</div>
  856. {/block:Answer}
  857.  
  858. <!-- quote posts -->
  859. {block:Quote}
  860. <h2 class="quote-posts">
  861. <l class="fa fa-quote-left"></l>
  862. <div class="quote">{Quote}</div>
  863. <l class="fa fa-quote-right"></l>
  864. </h2>
  865. <div style="text-align:right; margin-right:20px">
  866. {block:Source}<b>- {Source}</b>{/block:Source}
  867. </div>
  868. {/block:Quote}
  869.  
  870. <!-- chat posts -->
  871. {block:Chat}
  872. {block:Title}<h1>{Title}</h1>{/block:Title}
  873. <ul class="chat">{block:Lines}
  874. <li class="user_{UserNumber}">{block:Label}<span class="person">{Label}</span>{/block:Label} {Line}</li>
  875. {/block:Lines}</ul>
  876. {/block:Chat}
  877.  
  878. <!-- photo posts -->
  879. {block:Photo}
  880. <center>
  881. {block:HighRes}<a href="{PhotoURL-HighRes}">{/block:HighRes}<img src="{PhotoURL-500}" class="photo-posts"/>{block:HighRes}</a>{/block:HighRes}
  882. </center>
  883. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  884.  
  885. {block:Photoset}
  886. <center>
  887. {Photoset-500}
  888. </center>
  889. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  890.  
  891. <!-- video post -->
  892. {block:Video}
  893. {Video-500}
  894. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  895. {/block:Video}
  896.  
  897. <!-- audio post -->
  898. {block:Audio}
  899. <!--image-->
  900. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}<div id="audio-pic" {block:AlbumArt}style="background:none"{/block:AlbumArt}>
  901. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  902. </div>{block:IndexPage}</a>{/block:IndexPage}
  903. <div id="info-container">
  904. <!--player-->
  905. {block:ifDarkAudioPlayer}{AudioPlayerBlack}{/block:ifDarkAudioPlayer}
  906. {block:ifNotDarkAudioPlayer}{AudioPlayerWhite}{/block:ifNotDarkAudioPlayer} <!--info-->
  907. {block:TrackName}<li><b>Track:</b> {TrackName}</li>{/block:TrackName}
  908. {block:Artist}<li><b>Artist:</b> {Artist}</li>{/block:Artist}
  909. {block:Album}<li><b>Album:</b> {Album}</li>{/block:Album}
  910. {block:PlayCount}<li><b>Plays:</b> {FormattedPlayCount}</li>{/block:PlayCount}
  911. </div>
  912. {block:Caption}<div class="caption" style="margin-top:5px;>{Caption}</div>{/block:Caption}{/block:Audio}
  913.  
  914. <!------------------------------ POST ENDING ------------------------------->
  915.  
  916. {block:PermalinkPage}{block:Date}<div id="postending">
  917.  
  918. <!-- date posted -->
  919. <a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  920. <!-- notes counter -->
  921. {block:NoteCount}
  922. || <a href="#permalink">{NoteCountWithLabel}</a>
  923. {/block:NoteCount}
  924. <!-- reblogged from -->
  925. {block:RebloggedFrom}<br>
  926. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  927. {/block:RebloggedFrom}
  928. <!-- original poster -->
  929. {block:ContentSource}
  930. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  931. {/block:ContentSource}
  932. <!-- tags -->
  933. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  934. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  935. </div>{/block:HasTags}
  936.  
  937. </div>{/block:Date}{/block:PermalinkPage}
  938.  
  939. <!------------- If Circles for Index Page ------------->
  940. {block:IfPostendingCirclesForIndexpage}
  941. {block:IndexPage}
  942. <div id="postinfo">
  943.  
  944. <!-- date posted -->
  945. {block:Date}
  946. <a href="{Permalink}" title="{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}"><l class="fa fa-clock-o"></l></a>
  947. {/block:Date}
  948. <!-- notes counter -->
  949. {block:NoteCount}
  950. <a href="{Permalink}" title="Notes: {NoteCount}"><l class="fa fa-pencil"></l></a>
  951. {/block:NoteCount}
  952. <!-- reblogged from -->
  953. {block:RebloggedFrom}
  954. <a href="{ReblogParentURL}" title="Via: {ReblogParentName}"><l class="fa fa-at"></l></a>
  955. {/block:RebloggedFrom}
  956. <!-- original poster -->
  957. {block:ContentSource}
  958. <a href="{SourceURL}" title="Source: {SourceTitle}"><l class="fa fa-copyright"></l></a>
  959. {/block:ContentSource}
  960. <!-- tags -->
  961. {block:HasTags}
  962. <a href="{Permalink}" title="Tags: {block:Tags}{Tag}, {/block:Tags}"><l class="fa fa-tag"></l></a>
  963. {/block:HasTags}
  964. <!-- reblog -->
  965. <a href="{ReblogURL}" title="Reblog"><l class="fa fa-retweet"></l></a>
  966.  
  967. </div>
  968. {/block:IndexPage}
  969. {/block:IfPostendingCirclesForIndexpage}
  970.  
  971. <!------------- If NO Circles for Index Page ------------->
  972. {block:IfNotPostendingCirclesForIndexpage}
  973. {block:IndexPage}
  974. {block:Date}<div id="postending">
  975.  
  976. <!-- date posted -->
  977. <a href="{Permalink}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  978. <!-- notes counter -->
  979. {block:NoteCount}
  980. || <a href="{Permalink}">{NoteCountWithLabel}</a>
  981. {/block:NoteCount}
  982. <!-- reblogged from -->
  983. {block:RebloggedFrom}<br>
  984. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  985. {/block:RebloggedFrom}
  986. <!-- original poster -->
  987. {block:ContentSource}
  988. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  989. {/block:ContentSource}
  990. <!-- tags -->
  991. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  992. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  993. </div>{/block:HasTags}
  994.  
  995. </div>{/block:Date}
  996. {/block:IndexPage}
  997. {/block:IfNotPostendingCirclesForIndexpage}
  998.  
  999. </div> <!-- ending div tag for "posts" -->
  1000.  
  1001. {/block:Posts}
  1002. <!------------------------------- PERMALINK ------------------------------->
  1003.  
  1004. {block:PostNotes}
  1005. <div id="permalink">
  1006. <div id="notescontainer">{PostNotes}</div>
  1007. </div>
  1008. {/block:PostNotes}
  1009.  
  1010. </div> <!-- ending div tag for "entries" -->
  1011.  
  1012. </body>
  1013. </html>
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!