API tools faq
paste
Advertisement
thetruththemes

The Grid - Program

thetruththemes
May 4th, 2015
1,604
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 49.44 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <!---------------------------------------------------------------------------
  3. ,,
  4. ,GG,
  5. GIIG
  6. Gl''lG
  7. ;G' 'G;
  8. GP YG
  9. oQ' 'Qo -Tʜᴇ Gʀɪᴅ ᴛʜᴇᴍᴇ ʙʏ
  10. *TGGGGGGGGGGGGQQQ, ,QQQGGGGGGGGGGGGP* ɴʏᴄᴛᴏᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  11. *TGo, '* *' ,oGP*
  12. *TGo, ɴʏᴄᴛ□ᴛʜᴇᴍᴇs ,oGP* -ᴘʟᴇᴀsᴇ ʀᴇғᴇʀ ᴛᴏ ᴏʀɪɢɪɴᴀʟ
  13. *TGio,, ,,oiGP* ᴘᴏsᴛ ʟɪɴᴋ ғᴏʀ ʀᴜʟᴇs ᴀɴᴅ ᴍɪsᴄ
  14. ;GGT' 'TGG:
  15. GG' ii 'GG -ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴀɴʏ ᴏғ ᴛʜᴇ
  16. GG' ,GG, 'GG ᴄᴏᴅᴇ ᴄʀᴇᴅɪᴛ ᴏʀ ᴍᴏᴠᴇ ɪᴛ ᴛᴏ
  17. GG* oGGGGo. *GG ᴀ ᴘᴀɢᴇ.
  18. oG* oGG* *GGo. *Go
  19. ;GG;oGG* *GGo;GG;
  20. ,GGGT* *TGGG,
  21. ""' '""
  22.  
  23. ---------------------------------------------------------------------------->
  24. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  25. <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>
  26.  
  27. <head>
  28.  
  29. {block:Ifcustomfavicon}<link rel="shortcut icon" href="{image:favicon}"/>{/block:Ifcustomfavicon}
  30. {block:IfNotcustomfavicon}<link rel="shortcut icon" href="{favicon}"/>{/block:IfNotcustomfavicon}
  31.  
  32. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  33. <title>{Title}</title>
  34. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  35.  
  36. <!--------------------------------- IMAGES ---------------------------------->
  37. <meta name="image:Background" content=""/>
  38. <meta name="image:Custom Cursor" content="http://static.tumblr.com/u5vz4xb/e6Dnhiuf0/cursor1.png"/>
  39. <meta name="image:Custom Cursor Links" content="http://static.tumblr.com/u5vz4xb/NMNnhiufk/cursor2.png"/>
  40. <meta name="image:Favicon" content="http://static.tumblr.com/29e4b93e46be436207ef2851c6879f10/u5vz4xb/M6Hnokf4y/tumblr_static_3g9u2vj7ng8wk4wgw8cgwgwcc.png"/>
  41. <meta name="image:Album Art" content="http://static.tumblr.com/9c309a26edd055605a3e87448877aa00/u5vz4xb/LKhnod31a/tumblr_static_5fwq3pz1wbggg8g8o8ow8sgws.png"/>
  42.  
  43. <!--------------------------------- COLORS ---------------------------------->
  44. <!-- Full Body -->
  45. <meta name="color:Background" content="#000000"/>
  46. <meta name="color:Scroll Track" content="#0f2536"/>
  47. <meta name="color:Scroll Thumb" content="#dbf6ff"/>
  48. <!-- Sidebar -->
  49. <meta name="color:Identity Disc Glow" content="#00ccff"/>
  50. <meta name="color:Description BG" content="#111111"/>
  51. <meta name="color:Description Borders" content="#dbf6ff"/>
  52. <meta name="color:Description Text" content="#425360"/>
  53. <meta name="color:Description Links" content="#68cbe0"/>
  54. <meta name="color:Description Links Hover" content="#ffffff"/>
  55. <meta name="color:Symbol Links BG" content="#000000"/>
  56. <meta name="color:Symbol Links Borders" content="#00192a"/>
  57. <meta name="color:Symbol Links Text" content="#52c3e8"/>
  58. <meta name="color:Symbol Links Hover BG" content="#1c4c62"/>
  59. <meta name="color:Symbol Links Hover Borders" content="#38809a"/>
  60. <meta name="color:Symbol Links Hover Text" content="#dbf6ff"/>
  61. <meta name="color:Circuits" content="#05111a"/>
  62. <meta name="color:Circuits Hover" content="#68cbe0"/>
  63. <!-- Posts -->
  64. <meta name="color:Posts BG" content="#0c0c0c"/>
  65. <meta name="color:Posts Title" content="#355f68"/>
  66. <meta name="color:Posts Text" content="#233d4c"/>
  67. <meta name="color:Posts Bold" content="#355f68"/>
  68. <meta name="color:Posts Italic" content="#233d4c"/>
  69. <meta name="color:Posts Code" content="#4f4f4f"/>
  70. <meta name="color:Posts Code BG" content="#232323"/>
  71. <meta name="color:Posts Links" content="#d4d4d4"/>
  72. <meta name="color:Posts Links Hover" content="#ffffff"/>
  73. <meta name="color:Blockquote Border" content="#52c3e8"/>
  74. <meta name="color:Blockquote BG" content="#151515"/>
  75. <meta name="color:Audio Player" content="#005a92"/>
  76. <!-- Post Endings -->
  77. <meta name="color:Ending BG" content="#151515"/>
  78. <meta name="color:Ending Text" content="#425360"/>
  79. <meta name="color:Ending Links" content="#68cbe0"/>
  80. <meta name="color:Ending Links Hover" content="#ffffff"/>
  81. <!-- Permalink -->
  82. <meta name="color:Permalink Text" content="#333333"/>
  83. <meta name="color:Permalink Links" content="#444444"/>
  84. <meta name="color:Permalink Links Hover" content="#1c4c62"/>
  85. <meta name="color:Permalink Blockquote" content="#111111"/>
  86. <meta name="color:Permalink Scroll Thumb" content="#111111"/>
  87. <!-- Misc. -->
  88. <meta name="color:Link Hover BG" content="#0c0c0c"/>
  89. <meta name="color:Link Hover Text" content="#f7f7f7"/>
  90. <meta name="color:Selection BG" content="#466a7b"/>
  91. <meta name="color:Selection Text" content="#7fa7b8"/>
  92. <meta name="color:Selection Links" content="#ffffff"/>
  93.  
  94. <!-------------------------------- OPTIONS ---------------------------------->
  95. <meta name="if:White Disc" content="0"/>
  96. <meta name="if:Description Centered" content="0"/>
  97. <meta name="if:Pixel Fonts" content="1"/>
  98. <meta name="if:Monochrome Photos" content="1"/>
  99. <meta name="if:Fade Photos" content="1"/>
  100. <meta name="if:Symbol Info for Indexpage" content="1"/>
  101. <meta name="if:Custom Cursor" content="1"/>
  102. <meta name="if:Custom Favicon" content="1"/>
  103. <meta name="if:Dark Audio Player" content="1"/>
  104. <meta name="if:Credit on the Right" content="1"/>
  105.  
  106. <!--------------------------------- TEXTS ----------------------------------->
  107. <meta name="text:Ask Verb" content="asked" />
  108. <meta name="text:Link 1 URL" content="/" />
  109. <meta name="text:Link 1 Hover" content="Link One" />
  110. <meta name="text:Link 2 URL" content="/" />
  111. <meta name="text:Link 2 Hover" content="Link Two" />
  112. <meta name="text:Link 3 URL" content="/" />
  113. <meta name="text:Link 3 Hover" content="Link Three" />
  114. <meta name="text:Link 4 URL" content="/" />
  115. <meta name="text:Link 4 Hover" content="Link Four" />
  116.  
  117. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  118. <link href='http://fonts.googleapis.com/css?family=Audiowide' rel='stylesheet' type='text/css'>
  119.  
  120. </head>
  121. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  122. <script type="text/javascript" src="http://static.tumblr.7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  123. <script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  124.  
  125. <script type="text/javascript">
  126. WebFontConfig = {
  127. google: { families: [ 'Audiowide::latin' ] }
  128. };
  129. (function() {
  130. var wf = document.createElement('script');
  131. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  132. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  133. wf.type = 'text/javascript';
  134. wf.async = 'true';
  135. var s = document.getElementsByTagName('script')[0];
  136. s.parentNode.insertBefore(wf, s);
  137. })(); </script>
  138.  
  139. <style type="text/css">
  140.  
  141. @import url(http://fonts.googleapis.com/css?family=Audiowide);
  142. @font-face { font-family: "tr0n"; src: url('https://dl.dropboxusercontent.com/s/h4nd73b46wf8gxv/TR0Npx.ttf'); }
  143. @font-face { font-family: "tr0nx2"; src: url('https://dl.dropboxusercontent.com/s/vibrq412n42mnof/TR0Nx2.ttf'); }
  144.  
  145. /* --------------------------------------------------------------------------
  146. M I S C E L L A N E O U S
  147. -------------------------------------------------------------------------- */
  148.  
  149. /* body */
  150. body {
  151. color:{color:Posts Text};
  152. background:{color:background} url('{image:background}') fixed;
  153. font-family:consolas;
  154. font-size:10px;
  155. line-height:13px;
  156. text-align:left;}
  157.  
  158. /*-------------------------- CREDIT; DON'T REMOVE -------------------------*/
  159.  
  160. #credit {
  161. z-index:99999;
  162. position:fixed;
  163. bottom:10px;
  164. {block:IfNotCreditOnTheRight}left:10px;{/block:IfNotCreditOnTheRight}
  165. {block:IfCreditOnTheRight}right:10px;{/block:IfCreditOnTheRight}}
  166. #credit a {
  167. display:inline-block;
  168. height:17px; width:18px;
  169. padding-top:1px;
  170. text-align:center;
  171. border-radius:15px;
  172. line-height:16px;
  173. background:{color:Symbol Links BG};
  174. border:2px solid {color:Symbol Links Text};
  175. -webkit-transition: all 0.3s linear;
  176. -moz-transition: all 0.3s linear;
  177. transition: all 0.3s linear;}
  178. #credit a i {
  179. color:{color:Symbol Links Text};
  180. line-height:16px;
  181. font-size:11px;
  182. position: relative;
  183. top: 50%;
  184. -webkit-transform: translateY(-50%);
  185. -ms-transform: translateY(-50%);
  186. transform: translateY(-50%);
  187. -webkit-transition: all 0.3s linear;
  188. -moz-transition: all 0.3s linear;
  189. transition: all 0.3s linear;}
  190. #credit a:hover {
  191. border:2px solid {color:Symbol Links Hover Text};
  192. box-shadow:0 0 3px {color:Symbol Links Hover BG};
  193. transform: rotate(360deg);
  194. -webkit-transform: rotate(360deg);
  195. -moz-transform: rotate(360deg);
  196. -o-transform: rotate(360deg);
  197. -ms-transform: rotate(360deg);}
  198. #credit a:hover i {
  199. color:{color:Symbol Links Hover Text};
  200. text-shadow:0 0 3px {color:Symbol Links Hover Text};}
  201.  
  202. /* --------------------------- MINOR STUFF ---------------------------- */
  203.  
  204. /* hover text */
  205. #s-m-t-tooltip {
  206. z-index: 99999;
  207. display: block;
  208. margin-left:20px; margin-top:10px;
  209. border-left:5px solid {color:Blockquote Border};
  210. max-width:200px;
  211. color: {color:Link Hover Text};
  212. text-transform:uppercase;
  213. font-size:8px;
  214. {block:IfNotpixelfonts}
  215. padding: 3px 5px 4px 6px;
  216. font-family:Calibri;
  217. {/block:IfNotpixelfonts}
  218. {block:Ifpixelfonts}
  219. padding: 4px 5px 3px 6px;
  220. font-family:'tr0nx2', Calibri;
  221. {/block:Ifpixelfonts}
  222. line-height:10px;
  223. letter-spacing:1px;
  224. text-align:left;
  225. background: {color:Link Hover BG};}
  226. #s-m-t-tooltip:empty, #s-m-t-tooltip:invalid {display:none; opacity:0; visibility: hidden;}
  227.  
  228. /* scrollbar */
  229. ::-webkit-scrollbar {
  230. height: 9px;
  231. width: 9px;
  232. background: {color:Scroll Track};
  233. border: 4px solid {color:background};}
  234. ::-webkit-scrollbar-thumb {
  235. background: {color:Scroll Thumb};
  236. border:3px solid {color:background};}
  237.  
  238. /* drag n' click selection */
  239. ::selection {
  240. background: {color:Selection BG};
  241. color: {color:Selection Text};}
  242. ::-moz-selection {
  243. background: {color:Selection BG};
  244. color: {color:Selection Text};}
  245. a::selection {
  246. background: {color:Selection BG};
  247. color: {color:Selection Links};}
  248. a::-moz-selection {
  249. background: {color:Selection BG};
  250. color: {color:Selection Links};}
  251.  
  252. /* ------------------------- FONT STUFF --------------------------- */
  253.  
  254. /* links */
  255. a:link, a:active, a:visited {
  256. text-decoration:none;
  257. color:{color:Posts Links};
  258. -webkit-transition: all 0.3s linear;
  259. -moz-transition: all 0.3s linear;
  260. transition: all 0.3s linear;}
  261. a:hover {
  262. color:{color:Posts Links Hover};
  263. -webkit-transition: all 0.1s linear;
  264. -moz-transition: all 0.1s linear;
  265. transition: all 0.1s linear;}
  266. .posts a {
  267. letter-spacing:1px;
  268. text-transform:uppercase;
  269. font-size:9px;}
  270. .posts a:hover {
  271. text-shadow:0 0 3px {color:Blockquote Border};}
  272.  
  273. /* main font decorations */
  274. b, strong{
  275. font-weight:normal;
  276. color:{color:Posts Bold};
  277. text-shadow:1px 0px 0px {color:Posts Bold};
  278. letter-spacing:1px;}
  279. i, em {color:{color:Posts Italic};}
  280.  
  281. b a, strong a, a b, a strong {color:{color:Posts Links}; text-shadow:1px 0px 0px {color:Posts Links}};}
  282. i a, em a, a i, a em {font-style: italic; color:{color:Posts Links};}
  283.  
  284. pre {color:{color:Posts Code};
  285. font-size:11px;
  286. max-width:100%;
  287. font-family:Courier New;
  288. background:{color:Posts Code BG};
  289. padding:3px 6px 4px 6px;
  290. border-left: 5px solid {color:blockquote border};
  291. word-wrap: break-word;
  292. white-space: pre-wrap;
  293. white-space: -moz-pre-wrap;
  294. white-space: -pre-wrap;
  295. white-space: -o-pre-wrap;}
  296. code {
  297. color:{color:Posts Code};
  298. font-size:11px;
  299. font-family:Courier New;
  300. background:{color:Posts Code BG};
  301. padding:0px 1px 1px 1px;}
  302.  
  303. /* text and link post titles */
  304. h1 {font: normal normal normal 18px/18px Audiowide;
  305. text-transform:uppercase;
  306. color:{color:Posts Title};
  307. text-align:center;
  308. letter-spacing:1px;}
  309. /* quote and ask post titles */
  310. h2 {font: normal normal normal 16px/16px Audiowide;
  311. color:{color:Posts Bold};
  312. text-align:center;
  313. letter-spacing:0px;}
  314. .posts h1:first-child, .posts h2:first-child {margin-top:0px;}
  315.  
  316. /* --------------------------------------------------------------------------
  317. S I D E B A R
  318. -------------------------------------------------------------------------- */
  319.  
  320. /* entire sidebar container */
  321. #side {
  322. position:fixed;
  323. left:50%; margin-left:-445px;
  324. top:50%; margin-top:-85px;
  325. height:170px; width:170px;
  326. border-radius:85px;
  327. /* background:rgba(255,0,0,0.1); */
  328. -webkit-transition: all 0.5s linear;
  329. -moz-transition: all 0.5s linear;
  330. transition: all 0.5s linear;}
  331. #side:hover {
  332. margin-left:-495px;
  333. height:170px; width:310px;
  334. border-radius:85px 0px 0px 85px;}
  335.  
  336. /* identity disc */
  337. #disc {
  338. z-index:3; opacity:1;
  339. position:fixed;
  340. left:50%; margin-left:-425px;
  341. top:50%; margin-top:-75px;
  342. height:150px; width:150px;
  343. border-radius:75px;
  344. {block:IfNotWhiteDisc}background: {color:Identity Disc Glow} url(http://static.tumblr.com/u5vz4xb/URhno0uih/disc2.png) center;
  345. {/block:IfNotWhiteDisc}{block:IfWhiteDisc}
  346. background: {color:Identity Disc Glow} url(http://static.tumblr.com/u5vz4xb/nYpno798s/disc3.png) center;{/block:IfWhiteDisc}
  347. background-size:cover;
  348. box-shadow:0 0 6px {color:Identity Disc Glow};
  349. -webkit-transition: all 0.5s linear;
  350. -moz-transition: all 0.5s linear;
  351. transition: all 0.5s linear;}
  352. #disc-hole {
  353. position:relative;
  354. top:50%; left:50%;
  355. margin-top:-31px; margin-left:-31px;
  356. height:62px; width:62px;
  357. border-radius:62px;
  358. background:{color:background} url('{image:background}') fixed;}
  359. #side:hover #disc {
  360. box-shadow:none;
  361. margin-left:-485px;
  362. transform: rotate(180deg);
  363. -webkit-transform: rotate(180deg);
  364. -moz-transform: rotate(180deg);
  365. -o-transform: rotate(180deg);
  366. -ms-transform: rotate(180deg);}
  367.  
  368. /* description */
  369. #description {
  370. z-index:4;
  371. opacity:0;
  372. position:fixed;
  373. left:50%; margin-left:-425px;
  374. top:50%; margin-top:-75px;
  375. height:130px; width:130px;
  376. padding:5px;
  377. background:{color:description bg};
  378. border:5px solid {color:description borders};
  379. box-shadow:0 0 6px {color:Identity Disc Glow}, 0 0 6px {color:Identity Disc Glow} inset;
  380. border-radius:75px;
  381. overflow:hidden;
  382. color:{color:Description Text};
  383. {block:IfDescriptionCentered}text-align:center;{/block:IfDescriptionCentered}
  384. {block:IfNotDescriptionCentered}text-align:justify;{/block:IfNotDescriptionCentered}
  385. line-height:10px;
  386. text-transform:uppercase;
  387. {block:IfNotpixelfonts}
  388. font-size:8px;
  389. font-family:Calibri;
  390. letter-spacing:.5px;
  391. {/block:IfNotpixelfonts}
  392. {block:Ifpixelfonts}
  393. font-size:8px;
  394. font-family:'tr0nx2', Calibri;
  395. letter-spacing:0px;
  396. {/block:Ifpixelfonts}
  397. -webkit-transition: all 0.5s linear;
  398. -moz-transition: all 0.5s linear;
  399. transition: all 0.5s linear;}
  400. #description a {
  401. color:{color:description links};
  402. {block:IfNotpixelfonts}
  403. font-size:8px;
  404. {/block:IfNotpixelfonts}
  405. {block:Ifpixelfonts}
  406. font-size:8px;
  407. {/block:Ifpixelfonts}}
  408. #description a:hover {
  409. color:{color:description links hover};}
  410. #description b, #description strong {
  411. color:{color:Description Text};
  412. {block:Ifpixelfonts}
  413. font-weight:normal;
  414. text-shadow:1px 0px 0px {color:Description Text};
  415. letter-spacing:1px;
  416. {/block:Ifpixelfonts}}
  417. #description i, #description em {color:{color:Description Text};}
  418. .leftdescspace {float:left; clear:left; height:10px;}
  419. .rightdescspace {float:right; clear:right; height:10px;}
  420.  
  421. #side:hover #description {opacity:1; margin-left:-485px;}
  422.  
  423. /* ------------------------------ NAVIGATION ----------------------------- */
  424. /* page-navigation and link-title container */
  425. #navigationtab {
  426. z-index:1; opacity:0;
  427. position:fixed;
  428. width:0px; height:30px;
  429. left:50%; margin-left:-380px;
  430. top:50%; margin-top:-73px;
  431. border:solid {color:description links};
  432. border-width:0px 4px 0px 4px;
  433. overflow:hidden;
  434. display:block;
  435. background:{color:description bg};
  436. border-radius:4px 2px 4px 2px;
  437. transform: skew(45deg, 0deg);
  438. -webkit-transform: skew(45deg, 0deg);
  439. -moz-transform: skew(45deg, 0deg);
  440. -o-transform: skew(45deg, 0deg);
  441. -ms-transform: skew(45deg, 0deg);
  442. -webkit-transition: all 0.3s linear;
  443. -moz-transition: all 0.3s linear;
  444. transition: all 0.3s linear;}
  445. #side:hover #navigationtab {
  446. opacity:1; width:155px;}
  447.  
  448. #pagination, #linktitle {
  449. z-index:2;
  450. position:fixed;
  451. overflow:hidden;
  452. line-height:10px;
  453. left:50%; top:50%;
  454. text-transform:uppercase;
  455. color:{color:Description Text};
  456. text-align:center;
  457. {block:IfNotpixelfonts}
  458. font-size:8px;
  459. font-family:Calibri;
  460. {/block:IfNotpixelfonts}
  461. {block:Ifpixelfonts}
  462. font-size:16px;
  463. font-family:'tr0n', Calibri;
  464. {/block:Ifpixelfonts}
  465. -webkit-transition: all 0.3s linear;
  466. -moz-transition: all 0.3s linear;
  467. transition: all 0.3s linear;}
  468. #pagination a {
  469. color:{color:Description Links};}
  470. #pagination a:hover {
  471. color:{color:Description Links Hover};}
  472.  
  473. #pagination {
  474. opacity:0;
  475. width:0px; height:14px;
  476. padding:1px 12px 0px 25px;
  477. margin-left:-374px; margin-top:-73px;
  478. letter-spacing:0px;
  479. border-bottom:1px dotted {color:Description Text};}
  480. #side:hover #pagination {
  481. opacity:1; width:115px;}
  482.  
  483. #linktitle {
  484. opacity:0; visibility:hidden;
  485. height:15px;
  486. color:{color:Description Links};
  487. margin-left:-340px; margin-top:-56px;
  488. width:117px; padding-right:3px;
  489. letter-spacing:1px;}
  490. #side:hover #minorlink:hover #linktitle {opacity:1; visibility:visible;}
  491. #side:hover #mainlinks:hover #linktitle {opacity:1; visibility:visible;}
  492.  
  493. /* ------------------------------ MAIN LINKS ----------------------------- */
  494.  
  495. /* sidebar not hovered */
  496. #mainlinks a {
  497. z-index:2; position:fixed;
  498. left:50%;
  499. top:50%; margin-top:-35px;
  500. opacity:0;
  501. position:fixed;
  502. display:block;
  503. height:28px; width:27px;
  504. padding-left:1px;
  505. border-radius:15px;
  506. color:{color:Symbol Links Text};
  507. background:{color:Symbol Links BG};
  508. border:1px solid {color:Symbol Links Borders};
  509. font-size:18px;
  510. text-align:center;
  511. -webkit-transition: all 0.3s linear;
  512. -moz-transition: all 0.3s linear;
  513. transition: all 0.3s linear;
  514. transform: rotate(180deg);
  515. -webkit-transform: rotate(180deg);
  516. -moz-transform: rotate(180deg);
  517. -o-transform: rotate(180deg);
  518. -ms-transform: rotate(180deg);}
  519. #link1, #link2, #link3, #link4 {margin-left:-310px}
  520. #mainlinks i {
  521. color:{color:Symbol Links Text};
  522. position: relative;
  523. top: 50%;
  524. -webkit-transform: translateY(-50%);
  525. -ms-transform: translateY(-50%);
  526. transform: translateY(-50%);
  527. -webkit-transition: all 0.3s linear;
  528. -moz-transition: all 0.3s linear;
  529. transition: all 0.3s linear;}
  530.  
  531. /* sidebar hovered, links not hovered */
  532. #side:hover #mainlinks a {
  533. opacity:1;
  534. transform: rotate(360deg);
  535. -webkit-transform: rotate(360deg);
  536. -moz-transform: rotate(360deg);
  537. -o-transform: rotate(360deg);
  538. -ms-transform: rotate(360deg);}
  539. #side:hover #link1 {margin-left:-332px}
  540. #side:hover #link2 {margin-left:-297px}
  541. #side:hover #link3 {margin-left:-261px}
  542. #side:hover #link4 {margin-left:-226px}
  543.  
  544. /* sidebar hovered, links hovered */
  545. #side:hover #mainlinks a:hover {
  546. background:{color:Symbol Links Hover BG};
  547. border:1px solid {color:Symbol Links Hover Borders};
  548. border-radius:0px;
  549. box-shadow:0 0 3px {color:Symbol Links Hover BG}}
  550. #side:hover #mainlinks a:hover i {
  551. font-size:21px;
  552. color:{color:Symbol Links Hover Text};
  553. text-shadow:0 0 3px {color:Symbol Links Hover Text};}
  554.  
  555. /* ----------------------------- MINOR LINKS ----------------------------- */
  556.  
  557. /* horizontal lines */
  558. .minorline1 {
  559. z-index:2;
  560. position:fixed;
  561. left:50%; margin-left:-350px;
  562. top:50%;
  563. height:5px; background:{color:circuits};
  564. -webkit-transition: all 0.3s linear;
  565. -moz-transition: all 0.3s linear;
  566. transition: all 0.3s linear;}
  567. #line1 {margin-top:35px; width:0px;}
  568. #line3 {margin-top:25px; width:0px;}
  569. #line5 {margin-top:15px; width:0px;}
  570. #line7 {margin-top:5px; width:0px;}
  571.  
  572. /* horizontal lines hovered */
  573. #side:hover #line1 {width:35px; opacity:1;}
  574. #side:hover #line3 {width:55px; opacity:1;}
  575. #side:hover #line5 {width:75px; opacity:1;}
  576. #side:hover #line7 {width:95px; opacity:1;}
  577. #minorlink:hover .minorline1 {
  578. background:{color:circuits Hover};}
  579. #side:hover #minorlink:hover #line1 {width:36px;}
  580. #side:hover #minorlink:hover #line3 {width:56px;}
  581. #side:hover #minorlink:hover #line5 {width:76px;}
  582. #side:hover #minorlink:hover #line7 {width:96px;}
  583.  
  584. /* diagonal lines */
  585. .minorline2 {
  586. z-index:2;
  587. position:fixed;
  588. left:50%; top:50%;
  589. height:5px; background:{color:circuits};
  590. transform: rotate(45deg);
  591. -webkit-transform: rotate(45deg);
  592. -moz-transform: rotate(45deg);
  593. -o-transform: rotate(45deg);
  594. -ms-transform: rotate(45deg);
  595. -webkit-transition: all 0.3s linear;
  596. -moz-transition: all 0.3s linear;
  597. transition: all 0.3s linear;}
  598. #line2 {width:0; margin-top:35px; margin-left:-311px;}
  599. #line4 {width:0; margin-top:25px; margin-left:-294px;}
  600. #line6 {width:0; margin-top:15px; margin-left:-276px;}
  601. #line8 {width:0; margin-top:5px; margin-left:-258px;}
  602.  
  603. /* diagonal lines hovered*/
  604. #side:hover #line2 {width:30px; opacity:1; margin-top:45px; margin-left:-321px;}
  605. #side:hover #line4 {width:45px; opacity:1; margin-top:40px; margin-left:-304px;}
  606. #side:hover #line6 {width:60px; opacity:1; margin-top:35px; margin-left:-286px;}
  607. #side:hover #line8 {width:74px; opacity:1; margin-top:31px; margin-left:-267px;}
  608. #minorlink:hover .minorline2 {
  609. background:{color:circuits Hover};}
  610. #side:hover #minorlink:hover #line2 {width:35px; margin-top:47px; margin-left:-321px;}
  611. #side:hover #minorlink:hover #line4 {width:50px; margin-top:42px; margin-left:-304px;}
  612. #side:hover #minorlink:hover #line6 {width:65px; margin-top:37px; margin-left:-286px;}
  613. #side:hover #minorlink:hover #line8 {width:79px; margin-top:33px; margin-left:-267px;}
  614.  
  615. /* end circles */
  616. .lineend {
  617. z-index:2;
  618. position:fixed;
  619. top:50%; margin-top:56px;
  620. left:50%;
  621. text-decoration:none;
  622. display:inline-block;
  623. margin-right:15px;
  624. width:10px; height:10px;
  625. border:0px solid {color:circuits};
  626. border-radius:5px;
  627. -webkit-transition: all 0.3s linear;
  628. -moz-transition: all 0.3s linear;
  629. transition: all 0.3s linear;}
  630. #end1 {margin-left:-298px;}
  631. #end2 {margin-left:-268px;}
  632. #end3 {margin-left:-238px;}
  633. #end4 {margin-left:-208px;}
  634.  
  635. /* end circles hovered */
  636. #side:hover #end1 {opacity:1; width:4px; height:4px; border:3px solid {color:circuits};}
  637. #side:hover #end2 {opacity:1; width:4px; height:4px; border:3px solid {color:circuits};}
  638. #side:hover #end3 {opacity:1; width:4px; height:4px; border:3px solid {color:circuits};}
  639. #side:hover #end4 {opacity:1; width:4px; height:4px; border:3px solid {color:circuits};}
  640. #side:hover #minorlink:hover .lineend {margin-top:60px; border:3px solid {color:circuits Hover};}
  641. #side:hover #minorlink:hover #end1 {margin-left:-293px;}
  642. #side:hover #minorlink:hover #end2 {margin-left:-263px;}
  643. #side:hover #minorlink:hover #end3 {margin-left:-233px;}
  644. #side:hover #minorlink:hover #end4 {margin-left:-203px;}
  645.  
  646. /* --------------------------------------------------------------------------
  647. P O S T S
  648. -------------------------------------------------------------------------- */
  649.  
  650. /* posts position */
  651. #entries {
  652. margin-top:70px;
  653. margin-left:50%;}
  654. /* posts themselves */
  655. .posts {
  656. margin:0 0 70px -50px;
  657. overflow:hidden;
  658. width: 500px;
  659. padding:20px;
  660. background: {color:Posts BG};
  661. border: 1px solid {color:Blockquote BG};
  662. box-shadow:3px 0px 3px -3px {color:blockquote border}, -3px 0px 3px -3px {color:blockquote border} inset;
  663. border-right:3px solid {color:blockquote border};}
  664.  
  665. /* ------------------------------ POST TYPES ----------------------------- */
  666.  
  667. /* text post */
  668. blockquote {
  669. padding:3px 0px 3px 6px;
  670. margin:-6px 0 -4px 6px;
  671. background:{color:blockquote bg};
  672. border-left:2px solid {color:blockquote border};}
  673. blockquote blockquote {
  674. padding:1px 0px 1px 6px;}
  675. blockquote p:first-of-type {margin-top:0px;}
  676. blockquote p:last-of-type {margin-bottom:0px;}
  677.  
  678. /* separator */
  679. hr {display: block;
  680. margin-top: 10px;
  681. margin-bottom: 10px;
  682. margin-left: auto;
  683. margin-right: auto;
  684. border-style: solid;
  685. border-width: 1px;
  686. border-color: {color:blockquote border};}
  687.  
  688. /* bullet lists */
  689. ul {margin-left:-15px;
  690. list-style-type:circle;}
  691. ol {margin-left:-15px;
  692. list-style-type:decimal;}
  693. li {margin-bottom:3px;}
  694.  
  695. /* text-images */
  696. .posts img {
  697. max-width:100%;
  698. {block:IfFadePhotos}opacity:0.85;{/block:IfFadePhotos}
  699. -webkit-transition-duration: 0.2s;
  700. -moz-transition-duration:0.2s;
  701. -o-transition-duration:0.2s;
  702. transition-duration:0.2s;}
  703. .posts:hover img {opacity:1;}
  704. /* the credit below images that are from other people */
  705. .tmblr-full {margin:0;}
  706. .tmblr-attribution {
  707. opacity:.8;
  708. margin-top:0px;
  709. font-family:Calibri;
  710. font-size:8px; line-height:8px;
  711. text-transform:uppercase;
  712. letter-spacing:1px;}
  713. .tmblr-attribution::before {content: "└";}
  714. .tmblr-attribution::after {content: " >";}
  715. img a{border:none; max-width:100%;}
  716.  
  717. /* link posts */
  718. .link-posts a {
  719. background: {color:Symbol Links Text};
  720. display:inline-block;
  721. width: 480px;
  722. border-radius:3px;
  723. padding:10px;
  724. color:{color:Posts BG};}
  725. .link-posts a:hover {
  726. background: {color:Symbol Links Hover Text}}
  727.  
  728. /* ask posts */
  729. .ask-posts {
  730. min-height:64px;
  731. padding: 10px;
  732. background: {color:Blockquote BG};
  733. border-radius:3px;}
  734. .ask-posts img {
  735. border-radius:2px;
  736. max-width:64px;}
  737. .ask-posts .question {
  738. margin-top:-64px; margin-left:74px;
  739. width:406px;}
  740. .ask-posts h2 {text-align:left; margin:0px 0px 5px 0px;}
  741.  
  742. /* quote posts */
  743. .quote-posts {
  744. padding:10px 0px;
  745. text-align:center}
  746. .quote {
  747. vertical-align:middle;
  748. width:430px;
  749. display:inline-block;}
  750. .quote-posts .fa {
  751. font-size:20px;
  752. vertical-align:middle;
  753. display:inline-block;
  754. color:{color:Posts Blockquote}}
  755.  
  756. /* chat posts */
  757. .person {
  758. font-weight:normal;
  759. color:{color:Posts Bold};
  760. text-shadow:1px 0px 0px {color:Posts Bold};
  761. letter-spacing:1px;}
  762. ul.chat, .chat ol, .chat li {
  763. list-style:none;
  764. margin:0px;
  765. padding:3px;}
  766. .chat li:nth-child(odd) {
  767. padding:4px 3px 4px 3px;}
  768. .chat li:nth-child(even) {
  769. background: {color:blockquote bg};}
  770.  
  771. /* text-images */
  772. .posts img {
  773. max-width:100%;
  774. {block:IfFadePhotos}opacity:0.85;{/block:IfFadePhotos}
  775. -webkit-transition-duration: 0.2s;
  776. -moz-transition-duration:0.2s;
  777. transition-duration:0.2s;
  778. -o-transition-duration:0.2s;}
  779. .posts:hover img {opacity:1;}
  780. img a{border:none; max-width:100%;}
  781.  
  782. /* photo posts */
  783. .posts img, .posts .html_photoset, .posts #audio-pic {
  784. {block:IfFadePhotos}opacity:0.75;{/block:IfFadePhotos}
  785. {block:IfMonochromePhotos}
  786. -webkit-filter: grayscale(100%);
  787. -moz-filter: grayscale(100%);
  788. -ms-filter: grayscale(100%);
  789. -o-filter: grayscale(100%);
  790. filter: grayscale(100%);{/block:IfMonochromePhotos}
  791. -webkit-transition-duration: 0.5s;
  792. -moz-transition-duration:0.5s;
  793. -o-transition-duration:0.5s;
  794. transition-duration:0.5s;}
  795. .posts:hover img, .posts:hover .html_photoset, .posts:hover #audio-pic {
  796. opacity:1;
  797. -webkit-filter: grayscale(0%);
  798. -moz-filter: grayscale(0%);
  799. -ms-filter: grayscale(0%);
  800. -o-filter: grayscale(0%);
  801. filter: grayscale(0%);
  802. -webkit-transition-duration: 0.5s;
  803. -moz-transition-duration:0.5s;
  804. -o-transition-duration:0.5s;
  805. transition-duration:0.5s;}
  806.  
  807. /* photoset focused image background */
  808. .tmblr-lightbox {
  809. background-color:transparent !important;}
  810. .vignette {
  811. z-index:99998! important;
  812. opacity:.75 !important;
  813. background-color:{color:background} !important;
  814. background-image:none !important;}
  815. .tmblr-lightbox .lightbox-image {
  816. z-index:99999! important;
  817. border-radius:0px !important;
  818. background:{color:background} !important;
  819. box-shadow:0px 0px 0px 30px {color:background} !important;}
  820. .tmblr-lightbox .lightbox-caption {
  821. z-index:99999! important;
  822. font-family:consolas !important;
  823. font-size:10px !important;
  824. font-size: 15px !important;
  825. font-weight: bold !important;
  826. color: {color:posts title} !important;
  827. text-shadow: 0 4px 30px {color:background} !important;}
  828.  
  829. /* video posts */
  830. .caption #youtube_iframe, .caption iframe {
  831. margin:5px 0px 5px 0px;
  832. max-width:100%;}
  833.  
  834. /* audio posts */
  835. #audio-pic {
  836. display:inline-block;
  837. vertical-align:middle;
  838. margin-right:2px;
  839. border-radius:3px;
  840. width:135px; height:135px;
  841. background: url('{image:Default Audio Pic}');
  842. background-size:cover;}
  843. #info-container {
  844. display:inline-block;
  845. vertical-align:middle;
  846. text-align:left;
  847. font-size:8px; line-height:15px;
  848. width:355px;
  849. text-transform:uppercase;
  850. letter-spacing:1px;}
  851. #info-container li {
  852. display:block;
  853. border-radius:3px;
  854. padding:4px 7px;
  855. margin:0px; margin-top:4px;
  856. {block:IfNotpixelfonts}
  857. font-size:8px;
  858. font-family:Calibri;
  859. letter-spacing:.5px;
  860. {/block:IfNotpixelfonts}
  861. {block:Ifpixelfonts}
  862. font-size:8px;
  863. font-family:'tr0nx2', Calibri;
  864. letter-spacing:0px;
  865. {/block:Ifpixelfonts}
  866. background:{color:Posts 2nd BG};}
  867. #info-container b {
  868. color:{color:Posts Bold};
  869. {block:Ifpixelfonts}
  870. font-weight:normal;
  871. text-shadow:1px 0px 0px {color:Posts Bold};
  872. letter-spacing:1px;
  873. {/block:Ifpixelfonts}}
  874. .posts .audio_player {
  875. max-width:355px; max-height:27px;
  876. margin:0px; border-radius:3px;
  877. background:{color:Audio Player};
  878. {block:IfMonochromePhotos}
  879. -webkit-filter: grayscale(100%);
  880. -moz-filter: grayscale(100%);
  881. -ms-filter: grayscale(100%);
  882. -o-filter: grayscale(100%);
  883. filter: grayscale(100%);{/block:IfMonochromePhotos}
  884. -webkit-transition: all 0.2s linear;
  885. -moz-transition: all 0.2s linear;
  886. transition: all 0.2s linear;}
  887. .posts:hover .audio_player {
  888. {block:IfMonochromePhotos}
  889. -webkit-filter: grayscale(0%);
  890. -moz-filter: grayscale(0%);
  891. -ms-filter: grayscale(0%);
  892. -o-filter: grayscale(0%);
  893. filter: grayscale(0%);{/block:IfMonochromePhotos}}
  894. .tumblr_audio_player {
  895. width:355px; opacity:.66;}
  896.  
  897. /* ----------------------------- POSTS INFO ------------------------------ */
  898.  
  899. /* if symbol ending */
  900. #postinfo {
  901. margin-top:20px;
  902. padding-top:9px;
  903. position:absolute;
  904. text-align:center;
  905. margin-left:75px;
  906. line-height:25px;
  907. width:350px; height:30px;}
  908.  
  909. #postinfo a {
  910. text-decoration:none;
  911. display:inline-block;
  912. margin:0px 5px 0px 5px;
  913. height:23px; width:22px;
  914. padding-left:1px;
  915. border-radius:15px;
  916. color:{color:Symbol Links Text};
  917. background:{color:Symbol Links BG};
  918. border:1px solid {color:Symbol Links Borders};
  919. line-height:16px;
  920. font-size:13px;
  921. text-align:center;
  922. -webkit-transition: all 0.3s linear;
  923. -moz-transition: all 0.3s linear;
  924. transition: all 0.3s linear;}
  925. #postinfo i {
  926. color:{color:Symbol Links Text};
  927. line-height:16px;
  928. font-size:13px;
  929. position: relative;
  930. top: 50%;
  931. -webkit-transform: translateY(-50%);
  932. -ms-transform: translateY(-50%);
  933. transform: translateY(-50%);
  934. -webkit-transition: all 0.3s linear;
  935. -moz-transition: all 0.3s linear;
  936. transition: all 0.3s linear;}
  937. #postinfo a:hover {
  938. margin:0px 10px 0px 10px;
  939. background:{color:Symbol Links Hover BG};
  940. border:1px solid {color:Symbol Links Hover Borders};
  941. border-radius:0px;
  942. box-shadow:0 0 3px {color:Symbol Links Hover BG};}
  943. #postinfo a:hover i {
  944. font-size:16px;
  945. color:{color:Symbol Links Hover Text};
  946. text-shadow:0 0 3px {color:Symbol Links Hover Text};}
  947.  
  948. #infoline1 {
  949. position:absolute; display:box;
  950. margin-top:21px; margin-left:90px;
  951. height:0px; width:8px;
  952. background:{color:Circuits};
  953. transform: skew(45deg, 0deg);
  954. -webkit-transform: skew(45deg, 0deg);
  955. -moz-transform: skew(45deg, 0deg);
  956. -o-transform: skew(45deg, 0deg);
  957. -ms-transform: skew(45deg, 0deg);
  958. -webkit-transition: all 0.3s linear;
  959. -moz-transition: all 0.3s linear;
  960. transition: all 0.3s linear;}
  961. #infoline2 {
  962. position:absolute; display:box;
  963. margin-top:41px; margin-left:115px;
  964. height:5px; width:0px;
  965. background:{color:Circuits};
  966. -webkit-transition: all 0.3s linear;
  967. -moz-transition: all 0.3s linear;
  968. transition: all 0.3s linear;}
  969. #infolineend {
  970. position:absolute; display:box;
  971. margin-top:39px; margin-left:384px;
  972. width:10px; height:10px;
  973. border:0px solid {color:circuits};
  974. border-radius:5px;
  975. -webkit-transition: all 0.3s linear;
  976. -moz-transition: all 0.3s linear;
  977. transition: all 0.3s linear;}
  978. .posts:hover #infoline1 {
  979. height:25px; margin-left:100px;}
  980. .posts:hover #infoline2 {
  981. width:270px;}
  982. .posts:hover #infolineend {width:4px; height:4px; border:3px solid {color:circuits};}
  983.  
  984. /* if text ending */
  985. #postending {
  986. border-radius:3px;
  987. padding:10px;
  988. width:500px;
  989. {block:IfNotpixelfonts}
  990. padding:10px;
  991. {/block:IfNotpixelfonts}
  992. {block:Ifpixelfonts}
  993. padding:8px 10px 12px 10px;
  994. {/block:Ifpixelfonts}
  995. margin:15px 0px -10px -10px;
  996. background: {color:Ending BG};
  997. text-align:center;
  998. border-radius:1px;
  999. margin-top:15px;
  1000. text-transform:uppercase;
  1001. {block:IfNotpixelfonts}
  1002. font-size:8px;
  1003. font-family:Calibri;
  1004. letter-spacing:1px;
  1005. {/block:IfNotpixelfonts}
  1006. {block:Ifpixelfonts}
  1007. font-size:16px;
  1008. font-family:'tr0n', Calibri;
  1009. {/block:Ifpixelfonts}
  1010. color: {color:Ending Text};}
  1011. #postending a {
  1012. {block:IfNotpixelfonts}
  1013. font-size:8px;
  1014. {/block:IfNotpixelfonts}
  1015. {block:Ifpixelfonts}
  1016. font-size:16px;
  1017. {/block:Ifpixelfonts}
  1018. color:{color:Ending Links};}
  1019. #postending a:hover {
  1020. text-shadow:none;
  1021. color:{color:Ending Links Hover};}
  1022.  
  1023. /* ----------------------------- PERMALINK ------------------------------- */
  1024.  
  1025. /* permalink position */
  1026. #permalink {
  1027. background:; /* if you want the post-notes to have a non-transparent bg */
  1028. margin-top: -70px; margin-left:-50px;
  1029. width: 500px;
  1030. padding: 20px;}
  1031.  
  1032. /* post notes container */
  1033. #notescontainer {
  1034. width: 500px;
  1035. max-height:600px;
  1036. overflow: auto;
  1037. line-height:14px;
  1038. text-transform:uppercase;
  1039. {block:IfNotpixelfonts}
  1040. font-size:8px;
  1041. font-family:Calibri;
  1042. letter-spacing:1px;
  1043. {/block:IfNotpixelfonts}
  1044. {block:Ifpixelfonts}
  1045. font-size:16px;
  1046. font-family:'tr0n', Calibri;
  1047. {/block:Ifpixelfonts}
  1048. text-align:left;
  1049. color:{color:Permalink Text};}
  1050. #notescontainer a {
  1051. color:{color:Permalink Links};}
  1052. #notescontainer a:hover {
  1053. color:{color:Permalink Links Hover};}
  1054. #notescontainer blockquote {
  1055. background:none; padding:1px 0px 1px 6px;
  1056. margin-top:3px; margin-bottom:3px;
  1057. border-left: 2px solid {color:Permalink Blockquote};}
  1058.  
  1059. #notescontainer a::before {content: "{";}
  1060. #notescontainer a::after {content: "}";}
  1061. #notescontainer .avatar_frame::before {content:none;}
  1062. #notescontainer .avatar_frame::after {content:none;}
  1063.  
  1064. /* permalink etc */
  1065. .notes img {
  1066. {block:IfFadePhotos}opacity:0.7;{/block:IfFadePhotos}
  1067. {block:IfMonochromePhotos}-webkit-filter: grayscale(100%);{/block:IfMonochromePhotos}
  1068. width: 10px;
  1069. position: relative;
  1070. vertical-align: middle;
  1071. padding-right: 5px;
  1072. -webkit-transition: all 0.5s linear;
  1073. -moz-transition: all 0.5s linear;
  1074. transition: all 0.5s linear;}
  1075. ol.notes, .notes li {
  1076. width: 100%;
  1077. list-style: none;
  1078. margin: 0px;
  1079. padding-left: 0px}
  1080. .notes li:hover img {
  1081. {block:IfFadePhotos}opacity:1;{/block:IfFadePhotos}
  1082. {block:IfMonochromePhotos}-webkit-filter: grayscale(0%);{/block:IfMonochromePhotos}
  1083. -webkit-transition: all 0.5s linear;
  1084. -moz-transition: all 0.5s linear;
  1085. transition: all 0.5s linear;}
  1086.  
  1087. /* permalink scrollbar */
  1088. #permalink ::-webkit-scrollbar {
  1089. height: 5px;
  1090. width: 5px;
  1091. background: transparent;}
  1092. #permalink ::-webkit-scrollbar-thumb:vertical {
  1093. background: {color:Permalink Scroll Thumb};
  1094. border:none;
  1095. border-radius: 1px;}
  1096.  
  1097. </style>
  1098. <body>
  1099.  
  1100. <!--------------------------------- CURSOR --------------------------------->
  1101.  
  1102. {block:IfCustomCursor}
  1103. <style type="text/css"> body {cursor: url({image:Custom Cursor}), auto;} a, a:hover{cursor:url({image:Custom Cursor Links}), pointer;}
  1104. </style>
  1105. <!-- Custom cursors don't show up on empty spaces, but this fixes that -->
  1106. <div style="position:fixed; background:rgba(0,0,0,0); top:0px; left:0px; width:100%; height:100%; z-index: -99999999999999;"></div>{/block:IfCustomCursor}
  1107.  
  1108. <!-------------------------- CREDIT; DON'T REMOVE -------------------------->
  1109. <div id="credit">
  1110. <a href="http://nyctothemes.tumblr.com/" title="© nyctothemes">
  1111. <i class="fa fa-circle-o-notch"></i>
  1112. </a>
  1113. </div>
  1114.  
  1115. <!-------------------------------- SIDEBAR --------------------------------->
  1116. <div id="side">
  1117.  
  1118. <div id="disc"><div id="disc-hole"></div></div>
  1119.  
  1120. <!-- description -->
  1121. <div id="description">
  1122. <div class="leftdescspace" style="width:38px;"></div>
  1123. <div class="rightdescspace" style="width:38px;"></div>
  1124. <div class="leftdescspace" style="width:24px;"></div>
  1125. <div class="rightdescspace" style="width:24px;"></div>
  1126. <div class="leftdescspace" style="width:14px;"></div>
  1127. <div class="rightdescspace" style="width:14px;"></div>
  1128. <div class="leftdescspace" style="width:7px;"></div>
  1129. <div class="rightdescspace" style="width:7px;"></div>
  1130. <div class="leftdescspace" style="width:4px;"></div>
  1131. <div class="rightdescspace" style="width:4px;"></div>
  1132. <div class="leftdescspace" style="width:1px;"></div>
  1133. <div class="rightdescspace" style="width:1px;"></div>
  1134. <div class="leftdescspace" style="width:0px;"></div>
  1135. <div class="rightdescspace" style="width:0px;"></div>
  1136. <div class="leftdescspace" style="width:1px;"></div>
  1137. <div class="rightdescspace" style="width:1px;"></div>
  1138. <div class="leftdescspace" style="width:4px;"></div>
  1139. <div class="rightdescspace" style="width:4px;"></div>
  1140. <div class="leftdescspace" style="width:7px;"></div>
  1141. <div class="rightdescspace" style="width:7px;"></div>
  1142. <div class="leftdescspace" style="width:14px;"></div>
  1143. <div class="rightdescspace" style="width:14px;"></div>
  1144. <div class="leftdescspace" style="width:24px;"></div>
  1145. <div class="rightdescspace" style="width:24px;"></div>
  1146. <div class="leftdescspace" style="width:38px;"></div>
  1147. <div class="rightdescspace" style="width:38px;"></div>
  1148.  
  1149. {description}
  1150. </div>
  1151. <!-- page navigation and link titles -->
  1152. <div id="navigationtab"></div>
  1153. <div id="pagination">
  1154. {block:indexpage}{block:Pagination}
  1155. {block:PreviousPage}<a href="{PreviousPage}">{/block:PreviousPage}<{block:PreviousPage}</a> {/block:PreviousPage}{block:JumpPagination length="5"} {block:CurrentPage}{PageNumber}{/block:CurrentPage} {block:JumpPage}<a class="jump" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination} {block:NextPage}<a href="{NextPage}">{/block:NextPage}>{block:NextPage}</a>{/block:NextPage}
  1156. {/block:Pagination}{/block:indexpage}
  1157. {block:permalinkpage}Permalink Page{/block:permalinkpage}
  1158. </div>
  1159.  
  1160. <!-- large links -->
  1161. <div id="mainlinks">
  1162. <div id="linktitle">Index</div>
  1163. <a href="/" id="link1"><i class="fa fa-power-off"></i></a>
  1164. </div>
  1165. <div id="mainlinks">
  1166. <div id="linktitle">Message</div>
  1167. <a href="/ask" id="link2"><i class="fa fa-crosshairs"></i></a>
  1168. </div>
  1169. <div id="mainlinks">
  1170. <div id="linktitle">Archive</div>
  1171. <a href="/archive" id="link3"><i class="fa fa-clock-o"></i></a>
  1172. </div>
  1173. <div id="mainlinks">
  1174. <div id="linktitle">Submit</div>
  1175. <a href="/submit" id="link4"><i class="fa fa-arrow-circle-o-up"></i></a>
  1176. </div>
  1177.  
  1178. <!-- circuit-board links -->
  1179. <a href="{text:link 1 URL}" id="minorlink">
  1180. <div id="linktitle">{text:link 1 hover}</div>
  1181. <div class="minorline1" id="line1"></div>
  1182. <div class="minorline2" id="line2"></div>
  1183. <div class="lineend" id="end1"></div>
  1184. </a>
  1185. <a href="{text:link 2 URL}" id="minorlink">
  1186. <div id="linktitle">{text:link 2 hover}</div>
  1187. <div class="minorline1" id="line3"></div>
  1188. <div class="minorline2" id="line4"></div>
  1189. <div class="lineend" id="end2"></div>
  1190. </a>
  1191. <a href="{text:link 3 URL}" id="minorlink">
  1192. <div id="linktitle">{text:link 3 hover}</div>
  1193. <div class="minorline1" id="line5"></div>
  1194. <div class="minorline2" id="line6"></div>
  1195. <div class="lineend" id="end3"></div>
  1196. </a>
  1197. <a href="{text:link 4 URL}" id="minorlink">
  1198. <div id="linktitle">{text:link 4 hover}</div>
  1199. <div class="minorline1" id="line7"></div>
  1200. <div class="minorline2" id="line8"></div>
  1201. <div class="lineend" id="end4"></div>
  1202. </a>
  1203. </div>
  1204.  
  1205. <!--------------------------------- POSTS --------------------------------->
  1206. <div id="entries">
  1207. {block:posts}
  1208.  
  1209. <div class="posts">
  1210. {block:Text}
  1211. {block:Title}<h1>{Title}</h1>{/block:Title}
  1212. <div class="caption">{Body}</div>
  1213. {/block:Text}
  1214.  
  1215. <!-- link posts -->
  1216. {block:Link}
  1217. {block:Thumbnail}<center>
  1218. <a href="{Thumbnail-HighRes}">
  1219. <img src="{Thumbnail}" class="photo-posts" style="margin-bottom:5px; border-radius:3px">
  1220. </a>
  1221. </center>{/block:Thumbnail}
  1222. <div class="link-posts"><h1><a href="{URL}">
  1223. {Name}&nbsp;&nbsp;&#8594;</l>
  1224. </a></h1></div>
  1225. {block:Description}<div class="caption">
  1226. <p>{Description}</p>
  1227. </div>{/block:Description}
  1228. {/block:Link}
  1229.  
  1230. <!-- ask posts -->
  1231. {block:Answer}
  1232. <div class="ask-posts">
  1233. <img src="{AskerPortraitURL-64}">
  1234. <div class="question">
  1235. <h2>{Asker} {text:Ask Verb}:</h2> {Question}
  1236. </div></div><br>
  1237. <div id="caption">{Answer}</div>
  1238. {/block:Answer}
  1239.  
  1240. <!-- quote posts -->
  1241. {block:Quote}
  1242. <h2 class="quote-posts">
  1243. <l class="fa fa-quote-left"></l>
  1244. <div class="quote">{Quote}</div>
  1245. <l class="fa fa-quote-right"></l>
  1246. </h2>
  1247. <div style="text-align:right; margin-right:20px">
  1248. {block:Source}<b>- {Source}</b>{/block:Source}
  1249. </div>
  1250. {/block:Quote}
  1251.  
  1252. <!-- chat posts -->
  1253. {block:Chat}
  1254. {block:Title}<h1>{Title}</h1>{/block:Title}
  1255. <ul class="chat">{block:Lines}
  1256. <li class="user_{UserNumber}">{block:Label}<span class="person">{Label}</span>{/block:Label} {Line}</li>
  1257. {/block:Lines}</ul>
  1258. {/block:Chat}
  1259.  
  1260. <!-- photo posts -->
  1261. {block:Photo}
  1262. <center>
  1263. {block:HighRes}<a href="{PhotoURL-HighRes}">{/block:HighRes}<img src="{PhotoURL-500}" class="photo-posts"/>{block:HighRes}</a>{/block:HighRes}
  1264. </center>
  1265. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  1266.  
  1267. {block:Photoset}
  1268. <center>
  1269. {Photoset-500}
  1270. </center>
  1271. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}
  1272. {/block:Photoset}
  1273.  
  1274. <!-- video post -->
  1275. {block:Video}
  1276. {Video-500}
  1277. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1278. {/block:Video}
  1279.  
  1280. <!-- audio post -->
  1281. {block:Audio}
  1282. <!--image-->
  1283. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}<div id="audio-pic" {block:AlbumArt}style="background:none"{/block:AlbumArt}>
  1284. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1285. </div>{block:IndexPage}</a>{/block:IndexPage}
  1286. <div id="info-container">
  1287. <!--player-->
  1288. {block:ifDarkAudioPlayer}{AudioPlayerBlack}{/block:ifDarkAudioPlayer}
  1289. {block:ifNotDarkAudioPlayer}{AudioPlayerWhite}{/block:ifNotDarkAudioPlayer} <!--info-->
  1290. {block:TrackName}<li><b>Track:</b> {TrackName}</li>{/block:TrackName}
  1291. {block:Artist}<li><b>Artist:</b> {Artist}</li>{/block:Artist}
  1292. {block:Album}<li><b>Album:</b> {Album}</li>{/block:Album}
  1293. {block:PlayCount}<li><b>Plays:</b> {FormattedPlayCount}</li>{/block:PlayCount}
  1294. </div>
  1295. {block:Caption}<div class="caption" style="margin-top:5px;>{Caption}</div>{/block:Caption}{/block:Audio}
  1296.  
  1297. <!------------------------------ POST ENDING ------------------------------->
  1298.  
  1299. {block:PermalinkPage}{block:Date}<div id="postending">
  1300.  
  1301. <!-- date posted -->
  1302. Date{ <a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a> }
  1303. <!-- notes counter -->
  1304. {block:NoteCount}
  1305. Notes{ <span style="color:{color:ending links}">{NoteCount}</span> }
  1306. {/block:NoteCount}
  1307. <!-- reblogged from -->
  1308. {block:RebloggedFrom}<br>
  1309. Via{ <a href="{ReblogParentURL}">{ReblogParentName}</a> }
  1310. {/block:RebloggedFrom}
  1311. <!-- original poster -->
  1312. {block:ContentSource}
  1313. Source{ <a href="{SourceURL}">{SourceTitle}</a> }
  1314. {/block:ContentSource}
  1315. <!-- tags -->
  1316. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  1317. Tags{ {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags} }
  1318. </div>{/block:HasTags}
  1319.  
  1320. </div>{/block:Date}{/block:PermalinkPage}
  1321.  
  1322. <!------------- If Symbols for Index Page ------------->
  1323. {block:IfSymbolInfoForIndexpage}
  1324. {block:IndexPage}
  1325. <div id="infoline1"></div><div id="infoline2"></div><div id="infolineend"></div>
  1326. <div id="postinfo">
  1327.  
  1328. <!-- date posted -->
  1329. {block:Date}
  1330. <a href="{Permalink}" title="Date{ {ShortMonth}.{DayOfMonthWithZero}.{ShortYear}"><i class="fa fa-clock-o"></i></a>
  1331. {/block:Date}
  1332. <!-- notes counter -->
  1333. {block:NoteCount}
  1334. <a href="{Permalink}" title="Notes{ {NoteCount}"><i class="fa fa-heart"></i></a>
  1335. {/block:NoteCount}
  1336. <!-- reblogged from -->
  1337. {block:RebloggedFrom}
  1338. <a href="{ReblogParentURL}" title="Via{ {ReblogParentName}"><i class="fa fa-at"></i></a>
  1339. {/block:RebloggedFrom}
  1340. <!-- original poster -->
  1341. {block:ContentSource}
  1342. <a href="{SourceURL}" title="Source{ {SourceTitle}"><i class="fa fa-copyright"></i></a>
  1343. {/block:ContentSource}
  1344. <!-- tags -->
  1345. {block:HasTags}
  1346. <a href="{Permalink}" title="Tags{ {block:Tags}{Tag}, {/block:Tags}"><i class="fa fa-tags"></i></a>
  1347. {/block:HasTags}
  1348. <!-- reblog -->
  1349. <a href="{ReblogURL}" title="Reblog"><i class="fa fa-refresh"></i></a>
  1350.  
  1351. </div>
  1352. {/block:IndexPage}
  1353. {/block:IfSymbolInfoForIndexpage}
  1354.  
  1355. <!------------- If Text for Index Page ------------->
  1356. {block:IfNotSymbolInfoForIndexpage}
  1357. {block:IndexPage}
  1358. {block:Date}<div id="postending">
  1359.  
  1360. <!-- date posted -->
  1361. Date{ <a href="{Permalink}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a> }
  1362. <!-- notes counter -->
  1363. {block:NoteCount}
  1364. Notes{ <a href="{Permalink}">{NoteCount}</a> }
  1365. {/block:NoteCount}
  1366. <!-- reblogged from -->
  1367. {block:RebloggedFrom}<br>
  1368. Via{ <a href="{ReblogParentURL}">{ReblogParentName}</a> }
  1369. {/block:RebloggedFrom}
  1370. <!-- original poster -->
  1371. {block:ContentSource}
  1372. Source{ <a href="{SourceURL}">{SourceTitle}</a> }
  1373. {/block:ContentSource}
  1374. <!-- tags -->
  1375. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  1376. Tags{ {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags} }
  1377. </div>{/block:HasTags}
  1378.  
  1379. </div>{/block:Date}
  1380. {/block:IndexPage}
  1381. {/block:IfNotSymbolInfoForIndexpage}
  1382.  
  1383. </div> <!-- ending div tag for "posts" -->
  1384.  
  1385. {/block:Posts}
  1386.  
  1387. <!------------------------------ PERMALINK ------------------------------->
  1388.  
  1389. {block:PostNotes}
  1390. <div id="permalink">
  1391. <div id="notescontainer">{PostNotes}</div>
  1392. </div>
  1393. {/block:PostNotes}
  1394.  
  1395. </div> <!-- ending div tag for "entries" -->
  1396.  
  1397. </body>
  1398. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!