Advertisement
thetruththemes

The Grid - User

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