Advertisement
mogimochi

Theme [07] Decretum

Sep 15th, 2012
29,344
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 53.11 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-----------------------------------------------------------------------
  6.  
  7. Theme 07 Decretum
  8. by yukoki/s-ekki
  9.  
  10. 1. Light/Heavy CSS editting is allowed.
  11. 2. Do not use as base code.
  12. 3. Do not remove credit.
  13. 4. Do not claim theme as your own.
  14. 5. Do not redistribute.
  15.  
  16. ++ [YUKOKI 2012 THEMES' REVAMPS] ++ [YUKOKI REVAMP PACK #06] ++
  17. This theme is unlikely to be further edited or updated, & its preview will also be moved to a static page. It's similar to being labeled as an 'old theme'. This theme's first title was 'Flower & Rat'.
  18.  
  19. --------------------------------------------------- UPDATE VER 030716 -->
  20.  
  21. <meta name="color:scrollbar background" content="#ffffff">
  22. <meta name="color:scrollbar" content="#427ea3">
  23. <meta name="color:text highlight" content="#8596a6">
  24. <meta name="color:tooltip background" content="#8596a6">
  25. <meta name="color:tooltip text" content="#ffffff">
  26. <meta name="color:tooltip border" content="#ffffff">
  27. <meta name="color:background" content="#ffffff">
  28.  
  29. <meta name="color:header images border" content="#ffffff">
  30. <meta name="color:header images base overlay" content="#ffffff">
  31.  
  32. <meta name="color:description border" content="#8596a6">
  33. <meta name="color:description text" content="#626262">
  34. <meta name="color:description bold" content="#4a7093">
  35. <meta name="color:description italic" content="#789db6">
  36. <meta name="color:description links" content="#6e7f8c">
  37. <meta name="color:description links hover" content="#bbbbbb">
  38.  
  39. <meta name="color:custom links text" content="#555555">
  40. <meta name="color:custom links border" content="#8596a6">
  41. <meta name="color:custom links hover text" content="#555555">
  42. <meta name="color:custom links hover border" content="#8596a6">
  43.  
  44. <meta name="color:blog title bar background" content="#ffffff">
  45. <meta name="color:blog title bar bottom border" content="#c1d3d3">
  46. <meta name="color:blog title" content="#679c9b">
  47. <meta name="color:blog title shadow" content="#dddddd">
  48. <meta name="color:blog subtitle" content="#aaaaaa">
  49.  
  50. <meta name="color:navigation background" content="#c1d3d3">
  51. <meta name="color:navigation text" content="#ffffff">
  52. <meta name="color:navigation hover background" content="#ffffff">
  53. <meta name="color:navigation hover text" content="#bbbbbb">
  54.  
  55. <meta name="color:post background" content="#ffffff" />
  56.  
  57. <meta name="color:body text" content="#aaaaaa">
  58. <meta name="color:body links" content="#679c9b">
  59. <meta name="color:body links hover" content="#cfcfcf">
  60. <meta name="color:body bold" content="#b8b8b8">
  61. <meta name="color:body bold highlight" content="#f4f4f4">
  62. <meta name="color:body italic" content="#8ca6b8">
  63. <meta name="color:blockquote" content="#cccccc">
  64.  
  65. <meta name="color:post title background" content="#ffffff">
  66. <meta name="color:post title text" content="#aaaaaa">
  67. <meta name="color:post title border" content="#a5c1c0">
  68. <meta name="color:link post background" content="#ffffff">
  69. <meta name="color:link post text" content="#aaaaaa">
  70. <meta name="color:link post hover background" content="#ffffff">
  71. <meta name="color:link post hover text" content="#737373">
  72. <meta name="color:link post hover border" content="#54657c">
  73.  
  74. <meta name="color:audio info background" content="#ffffff">
  75. <meta name="color:audio info text" content="#9d9d9d">
  76.  
  77. <meta name="color:quote" content="#8da1b6">
  78. <meta name="color:quote source" content="#aaaaaa">
  79.  
  80. <meta name="color:ask background" content="#ffffff">
  81. <meta name="color:ask text" content="#9f9f9f">
  82. <meta name="color:asker text" content="#aeaeae">
  83. <meta name="color:asker link" content="#ffffff">
  84. <meta name="color:asker link background" content="#63859f">
  85.  
  86. <meta name="color:chat even name" content="#679599" />
  87. <meta name="color:chat even text" content="#8c8c8c" />
  88. <meta name="color:chat odd name" content="#688191" />
  89. <meta name="color:chat odd text" content="#adadad" />
  90.  
  91. <meta name="color:perma background" content="#f7f7f7">
  92. <meta name="color:perma text" content="#aaaaaa">
  93. <meta name="color:perma text hover" content="#666666">
  94. <meta name="color:perma bottom border" content="#e7e7e7">
  95. <meta name="color:perma links text" content="#ffffff">
  96. <meta name="color:perma links 1" content="#c1d3d3">
  97. <meta name="color:perma links 2" content="#a3c0c0">
  98. <meta name="color:perma links 3" content="#85acad">
  99. <meta name="color:perma links 4" content="#67999a">
  100. <meta name="color:perma links hover background" content="#ffffff">
  101. <meta name="color:perma links hover text" content="#dddddd">
  102. <meta name="color:perma links hover border" content="#dddddd">
  103.  
  104. <meta name="color:tags" content="#aaaaaa">
  105. <meta name="color:tags background" content="#e7e7e7">
  106. <meta name="color:tags hover" content="#dddddd">
  107. <meta name="color:tags hover background" content="#ffffff">
  108.  
  109. <meta name="color:pagination background 1" content="#c1d3d3">
  110. <meta name="color:pagination text 1" content="#ffffff">
  111. <meta name="color:pagination background 2" content="#ffffff">
  112. <meta name="color:pagination text 2" content="#67999a">
  113.  
  114. <meta name="if:500px posts" content="1">
  115. <meta name="if:400px posts" content="0">
  116. <meta name="if:250px posts" content="0">
  117. <meta name="if:1 column" content="1">
  118. <meta name="if:2 columns" content="0">
  119. <meta name="if:3 columns" content="0">
  120. <meta name="if:always show tags on 1 col" content="0">
  121. <meta name="if:fading photos" content="1">
  122. <meta name="if:show captions" content="1">
  123. <meta name="if:music player" content="0">
  124. <meta name="if:monochrome posts" content="0">
  125. <meta name="if:header images" content="1">
  126. <meta name="if:light description background" content="1">
  127. <meta name="if:light custom links background" content="1">
  128.  
  129. <meta name="image:background" content="">
  130. <meta name="image:title background" content="">
  131. <meta name="image:left image" content="http://static.tumblr.com/e9dc872a4749d60b23131a2d6e3f440d/2icx37z/Xmrn787p8/tumblr_static_4ee8v3fc6mm80k4kggg848g84.jpg">
  132. <meta name="image:right image" content="http://static.tumblr.com/ae4d92662d1a9c78b67bb1a4638ebddc/2icx37z/jjkn787p8/tumblr_static_ezio80x9uf40c4wcg4ok4k0ow.jpg">
  133. <meta name="image:music player gif" content="http://media.tumblr.com/tumblr_m7vzhvERfC1r6o8v2.gif">
  134.  
  135. <meta name="text:sidebar image height" content="320">
  136. <meta name="text:billy music code" content="paste your billy music code here">
  137. <meta name="text:subtitle" content="There's no way I'd ever regret this.">
  138. <meta name="text:link 1" content="">
  139. <meta name="text:link 1 URL" content="">
  140. <meta name="text:link 2" content="">
  141. <meta name="text:link 2 URL" content="">
  142. <meta name="text:link 3" content="">
  143. <meta name="text:link 3 URL" content="">
  144. <meta name="text:link 4" content="">
  145. <meta name="text:link 4 URL" content="">
  146. <meta name="text:link 5" content="">
  147. <meta name="text:link 5 URL" content="">
  148. <meta name="text:link 6" content="">
  149. <meta name="text:link 6 URL" content="">
  150. <meta name="text:link 7" content="">
  151. <meta name="text:link 7 URL" content="">
  152. <meta name="text:link 8" content="">
  153. <meta name="text:link 8 URL" content="">
  154. <meta name="text:link 9" content="">
  155. <meta name="text:link 9 URL" content="">
  156. <meta name="text:link 10" content="">
  157. <meta name="text:link 10 URL" content="">
  158.  
  159. <title>{title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  160. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  161. <link rel="shortcut icon" href="{Favicon}" />
  162.  
  163. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  164. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  165. <script>
  166. (function($){
  167. $(document).ready(function(){
  168. $("a[title]").style_my_tooltips({
  169. tip_follows_cursor:true,
  170. tip_delay_time:0,
  171. tip_fade_speed:0,
  172. attribute:"title"
  173. });
  174. });
  175. })(jQuery);
  176. </script>
  177.  
  178. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  179. <script type="text/javascript">
  180. jQuery(document).ready(function() {
  181. jQuery(".sub").hide();
  182. //toggle the componenet with class msg_body
  183. jQuery(".cthrough").click(function()
  184. {
  185. jQuery(this).next(".sub").slideToggle(500); return false;
  186. });});
  187. </script>
  188.  
  189. {block:indexpage}
  190. {block:ifnot1column}
  191. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  192.  
  193. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  194.  
  195. <script>
  196. $(function(){
  197. var $container = $('#content');
  198. $container.imagesLoaded(function(){
  199. $container.masonry({
  200. itemSelector: '.posts',
  201. });
  202. });
  203. $container.infinitescroll({
  204. itemSelector : ".posts",
  205. navSelector : "div.pagination",
  206. nextSelector : ".pagination a#next",
  207. loadingImg : "",
  208. loadingText : "<em></em>",
  209. bufferPx : 10000,
  210. extraScrollPx: 12000,
  211. },
  212. // trigger Masonry as a callback
  213. function( newElements ) {
  214. var $newElems = $( newElements ).css({ opacity: 0 });
  215. // ensure that images load before adding to masonry layout
  216. $newElems.imagesLoaded(function(){
  217. $newElems.animate({ opacity: 1 });
  218. $container.masonry( 'appended', $newElems, true );
  219. });
  220. }
  221. );
  222. });
  223. </script>
  224. {/block:ifnot1column}
  225. {/block:indexpage}
  226.  
  227. <style type="text/css">
  228.  
  229. @font-face { font-family: "talldark"; src: url('https://dl.dropboxusercontent.com/s/i8kug7l4k6qlzz7/talldark.ttf'); }
  230.  
  231. .tmblr-lightbox {background-color:rgba(255,255,255,0.9)!important;}
  232. .tmblr-lightbox img { opacity:0;padding: 10px;
  233. border: 1px solid #ddd; }
  234. .lightbox-image {
  235. opacity: 1!important;
  236. box-shadow: 0 0 0 transparent!important;
  237. border-radius: 0!important;
  238. -moz-border-radius: 0!important;
  239. -webkit-border-radius: 0!important;
  240. -o-border-radius: 0!important;
  241. padding: 10px!important;
  242. border: 1px solid #ddd!important;
  243. background-color: #fff!important;
  244. }
  245. .lightbox-caption {
  246. color: #aaa!important;
  247. font-family: calibri!important;
  248. font-size: 12px!important;
  249. margin-toP: 30px!important;
  250. text-shadow: 0 0 0 transparent!important;
  251. font-weight: 400!important;
  252. }
  253.  
  254. .tmblr-iframe { z-index:999999999!important; }
  255.  
  256. ::-webkit-scrollbar { width: 7px; }
  257. ::-webkit-scrollbar-track-piece { background-color: {color:scrollbar background}; }
  258. ::-webkit-scrollbar-thumb:vertical {
  259. width: 1px;
  260. background-color: {color:scrollbar};
  261. border-top: 4px solid {color:scrollbar background};
  262. border-right: 3px solid {color:scrollbar background};
  263. border-bottom: 4px solid {color:scrollbar background};
  264. border-left: 3px solid {color:scrollbar background};
  265. }
  266.  
  267. ::selection {background-color:{color:text highlight};color: #fff;}
  268. ::-moz-selection {background-color:{color:text highlight};color: #fff;}
  269. ::-webkit-selection {background-color:{color:text highlight};color:#fff;}
  270.  
  271. #s-m-t-tooltip {
  272. padding: 3px 5px;
  273. margin: 20px 14px 7px 10px;
  274. background-color: {color:tooltip background};
  275. font-family: consolas;
  276. font-size: 8px;
  277. letter-spacing: 1px;
  278. text-transform: uppercase;
  279. color: {color:tooltip text};
  280. z-index: 1002;
  281. border: 4px double {color:tooltip border};
  282. }
  283.  
  284. body {
  285. background-color: {color:background};
  286. background-image: url({image:background});
  287. background-attachment: fixed;
  288. margin: 0;
  289. word-wrap: break-word;
  290. }
  291. a { text-decoration:none; }
  292. .pagination {display: none;}
  293.  
  294. #cente {
  295. width: 100%;
  296. top: 0;
  297. position: fixed;
  298. z-index: 1000;
  299. }
  300.  
  301. #header {
  302. {block:indexpage}
  303. {block:if1column}
  304. {block:if500pxposts}width: 520px;{/block:if500pxposts}
  305. {block:if400pxposts}width: 420px;{/block:if400pxposts}
  306. {block:if250pxposts}width: 270px;{/block:if250pxposts}
  307. {/block:if1column}
  308. {block:if2columns}
  309. {block:if250pxposts}width: 530px;{/block:if250pxposts}
  310. {block:if400pxposts}width: 840px;{/block:if400pxposts}
  311. {/block:if2columns}
  312. {block:if3columns}
  313. {block:if250pxposts}width: 790px;{/block:if250pxposts}
  314. {/block:if3columns}
  315. {/block:indexpage}
  316. {block:permalinkpage}
  317. width: 520px;
  318. {/block:permalinkpage}
  319. top: 0;
  320. }
  321.  
  322. .leftim, .rightim { width: 160px; border: 10px solid {color:header images border}; }
  323. .leftim {
  324. border-radius: 0 0 0 130px;
  325. transition: 0.6s;
  326. -moz-transition: 0.6s;
  327. -webkit-transition: 0.6s;
  328. -o-transition: 0.6s;
  329. }
  330. .rightim {
  331. border-radius: 0 0 130px 0;
  332. transition: 0.6s;
  333. -moz-transition: 0.6s;
  334. -webkit-transition: 0.6s;
  335. -o-transition: 0.6s;
  336. }
  337.  
  338. .right {
  339. width: 180px;
  340. height: {text:sidebar image height}px;
  341. position: absolute;
  342. {block:indexpage}
  343. {block:if1column}
  344. {block:if500pxposts}margin-left: 520px;{/block:if500pxposts}
  345. {block:if400pxposts}margin-left: 420px;{/block:if400pxposts}
  346. {block:if250pxposts}margin-left: 270px;{/block:if250pxposts}
  347. {block:if1column}
  348. {block:if2columns}
  349. {block:if250pxposts}margin-left: 530px;{/block:if250pxposts}
  350. {block:if400pxposts}margin-left: 840px;{/block:if400pxposts}
  351. {/block:if2columns}
  352. {block:if3columns}
  353. {block:if250pxposts}margin-left: 790px;{/block:if250pxposts}
  354. {/block:if3columns}
  355. {/block:indexpage}
  356. {block:permalinkpage}
  357. margin-left: 520px;
  358. {/block:permalinkpage}
  359. }
  360. .left {
  361. width: 180px;
  362. height: {text:sidebar image height}px;
  363. position: absolute;
  364. float: left;
  365. margin-left: -180px;
  366. }
  367. .bar1, .bar2, .bar3, .bar4, .bar5, .bar6, .bar7, .bar8 {
  368. width: 40px;
  369. background-color: {color:header images base overlay};
  370. z-index: 1;
  371. margin-top: 10px;
  372. height: 0;
  373. opacity: 0.4;
  374. position: absolute;
  375. float: left;
  376. transition: 0.8s;
  377. -moz-transition: 0.8s;
  378. -webkit-transition: 0.8s;
  379. -o-transition: 0.8s;
  380. }
  381. .bar1, .bar8 {margin-left: 10px;}
  382. .bar2, .bar7 {margin-left: 50px;}
  383. .bar3, .bar6 {margin-left: 90px;}
  384. .bar4, .bar5 {margin-left: 130px;}
  385.  
  386. .bar2, .bar6 {transition-delay: 0.2s;}
  387. .bar3, .bar7 {transition-delay: 0.4s;}
  388. .bar4, .bar8 {transition-delay: 0.6s;}
  389.  
  390. .left:hover .bar1, .left:hover .bar2, .left:hover .bar3, .left:hover .bar4 { height: {text:sidebar image height}px; }
  391. .right:hover .bar5, .right:hover .bar6, .right:hover .bar7, .right:hover .bar8 { height: {text:sidebar image height}px; }
  392. .left:hover .leftim { border-radius: 0; }
  393. .right:hover .rightim { border-radius: 0; }
  394.  
  395. .desc {
  396. font-family: consolas;
  397. font-size: 10px;
  398. {block:iflightdescriptionbackground}
  399. background-color: rgba(255,255,255,0.5);
  400. {/block:iflightdescriptionbackground}
  401. {block:ifnotlightdescriptionbackground}
  402. background-color: rgba(0,0,0,0.5);
  403. {/block:ifnotlightdescriptionbackground}
  404. border-right: 3px solid {color:description border};
  405. color: {color:description text};
  406. width: 117px;
  407. padding: 10px;
  408. position: absolute;
  409. margin: 0 20px;
  410. opacity: 0;
  411. z-index: 2;
  412. text-align: justify;
  413. {block:ifnotheaderimages}
  414. opacity: 1;
  415. margin: 120px 20px;
  416. text-align: right;
  417. {/block:ifnotheaderimages}
  418. transition: 1.0s;
  419. -moz-transition: 1.0s;
  420. -webkit-transition: 1.0s;
  421. -o-transition: 1.0s;
  422. }
  423. .desc a {color: {color:description links};border-bottom:1px solid {color:description links hover};}
  424. .desc a:hover {color: {color:description links hover};}
  425. .desc b,strong { color: {color:description bold};}
  426. .desc i,em { color: {color:description italic};}
  427. .left:hover .desc {
  428. margin: 20px;
  429. opacity: 1;
  430. {block:ifnotheaderimages}
  431. margin: 120px 20px;
  432. {/block:ifnotheaderimages}
  433. }
  434.  
  435. .custom {
  436. font-family: consolas;
  437. font-size: 10px;
  438. position: absolute;
  439. margin: 0 20px;
  440. opacity: 0;
  441. z-index: 2;
  442. text-align: justify;
  443. {block:ifnotheaderimages}
  444. opacity: 1;
  445. margin: 120px 20px;
  446. {/block:ifnotheaderimages}
  447. transition: 1.0s;
  448. -moz-transition: 1.0s;
  449. -webkit-transition: 1.0s;
  450. -o-transition: 1.0s;
  451. }
  452. .right:hover .custom {
  453. margin: 20px;
  454. opacity: 1;
  455. {block:ifnotheaderimages}
  456. margin: 120px 20px;
  457. {/block:ifnotheaderimages}
  458. }
  459. .cl {
  460. width: 117px;
  461. {block:iflightcustomlinksbackground}
  462. background-color: rgba(255,255,255,0.5);
  463. {/block:iflightcustomlinksbackground}
  464. {block:ifnotlightcustomlinksbackground}
  465. background-color: rgba(0,0,0,0.5);
  466. {/block:ifnotlightcustomlinksbackground}
  467. padding: 3px 10px;
  468. text-align: center;
  469. color: {color:custom links text};
  470. border-left: 3px solid {color:custom links border};
  471. margin: 0 0 3px 0;
  472. text-align: left;
  473. {block:ifnotheaderimages}
  474. padding: 2px 10px;
  475. {/block:ifnotheaderimages}
  476. transition: 0.6s;
  477. -moz-transition: 0.6s;
  478. -webkit-transition: 0.6s;
  479. -o-transition: 0.6s;
  480. }
  481. .cl:hover {
  482. color: {color:custom links hover text};
  483. border-left: 20px solid {color:custom links hover border};
  484. width: 100px;
  485. {block:iflightcustomlinksbackground}
  486. background-color: rgba(255,255,255,0.8);
  487. {/block:iflightcustomlinksbackground}
  488. {block:ifnotlightcustomlinksbackground}
  489. background-color: rgba(0,0,0,0.8);
  490. {/block:ifnotlightcustomlinksbackground}
  491. }
  492.  
  493. #titleb {
  494. background-color: {color:blog title bar background};
  495. background-image: url({image:title background});
  496. position: relative;
  497. {block:indexpage}
  498. {block:if1column}
  499. {block:if500pxposts}width: 480px;{/block:if500pxposts}
  500. {block:if400pxposts}width: 380px;{/block:if400pxposts}
  501. {block:if250pxposts}width: 230px;{/block:if250pxposts}
  502. {/block:if1column}
  503. {block:if2columns}
  504. {block:if250pxposts}width: 490px;{/block:if250pxposts}
  505. {/block:if2columns}
  506. {/block:indexpage}
  507. {block:permalinkpage}
  508. width: 480px;
  509. {/block:permalinkpage}
  510. padding: 20px 20px;
  511. font-family: talldark;
  512. font-size: 46px;
  513. letter-spacing: 6px;
  514. color: {color:blog title};
  515. text-shadow: 2px 2px 0 {color:blog title shadow};
  516. border-bottom: 3px solid {color:blog title bar bottom border};
  517. opacity: 0.9;
  518. z-index: 1000000;
  519. transition: 0.6s;
  520. -moz-transition: 0.6s;
  521. -webkit-transition: 0.6s;
  522. -o-transition: 0.6s;
  523. }
  524. #titleb:hover { opacity: 1; }
  525.  
  526. .subtitle {
  527. margin-top: 8px;
  528. font-family: consolas;
  529. font-size: 10px;
  530. text-transform: uppercase;
  531. letter-spacing: 2px;
  532. color: {color:blog subtitle};
  533. text-shadow: 0 0 0 transparent;
  534. transition: 0.6s;
  535. -moz-transition: 0.6s;
  536. -webkit-transition: 0.6s;
  537. -o-transition: 0.6s;
  538. }
  539.  
  540. #navigation {
  541. font-family: consolas;
  542. font-size: 10px;
  543. text-transform: uppercase;
  544. letter-spacing: 1px;
  545. text-shadow: 0 0 0 transparent;
  546. position: absolute;
  547. padding: 0 20px;
  548. margin-top: 15px;
  549. {block:indexpage}
  550. {block:if1column}
  551. {block:if500pxposts}width: 420px;{/block:if500pxposts}
  552. {block:if400pxposts}width: 320px;{/block:if400pxposts}
  553. {block:if250pxposts}width: 185px;font-size: 8px;margin-top: 17px;{/block:if250pxposts}
  554. {/block:if1column}
  555. {block:if2columns}
  556. {block:if250pxposts}width: 420px;{/block:if250pxposts}
  557. {block:if400pxposts}width: 760px;{/block:if400pxposts}
  558. {/block:if2columns}
  559. {block:if3columns}
  560. {block:if250pxposts}width: 700px;{/block:if250pxposts}
  561. {/block:if3columns}
  562. {/block:indexpage}
  563. {block:permalinkpage}
  564. width: 420px;
  565. {/block:permalinkpage}
  566. }
  567. #navigation a {
  568. background-color: {color:navigation background};
  569. color: {color:navigation text};
  570. padding: 2px 12px;
  571. border-left: 0 solid {color:blog title bar bottom border};
  572. border-right: 0 solid {color:blog title bar bottom border};
  573. margin: 0 3px;
  574. {block:indexpage}
  575. {block:if1column}
  576. {block:if500pxposts}padding: 2px 12px;{/block:if500pxposts}
  577. {block:if400pxposts}padding: 2px 12px;{/block:if400pxposts}
  578. {block:if250pxposts}padding: 2px 4px;margin: 0;{/block:if250pxposts}
  579. {/block:if1column}
  580. {block:if2columns}
  581. {block:if250pxposts}padding: 2px 12px;{/block:if250pxposts}
  582. {/block:if2columns}
  583. {block:permalinkpage}
  584. padding: 2px 12px;
  585. {/block:permalinkpage}
  586. transition: 0.6s;
  587. -moz-transition: 0.6s;
  588. -webkit-transition: 0.6s;
  589. -o-transition: 0.6s;
  590. }
  591. #navigation a:hover {
  592. border-left: 10px solid {color:blog title bar bottom border};
  593. border-right: 10px solid {color:blog title bar bottom border};
  594. background-color: {color:navigation hover background};
  595. color: {color:navigation hover text};
  596. {block:if1column}{block:if250pxposts}
  597. border-left: 0px solid {color:blog title bar bottom border};
  598. border-right: 0px solid {color:blog title bar bottom border};
  599. {/block:if250pxposts}{/block:if1column}
  600. {block:if1column}{block:if400pxposts}
  601. border-left: 0px solid {color:blog title bar bottom border};
  602. border-right: 0px solid {color:blog title bar bottom border};
  603. {/block:if400pxposts}{/block:if1column}
  604. {block:permalinkpage}
  605. border-left: 10px solid {color:blog title bar bottom border};
  606. border-right: 10px solid {color:blog title bar bottom border};
  607. {/block:permalinkpage}
  608. }
  609.  
  610. #content {
  611. margin-top: 120px;
  612. {block:indexpage}
  613. {block:if1column}
  614. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  615. {block:if400pxposts}width: 400px;{/block:if400pxposts}
  616. {block:if250pxposts}width: 250px;{/block:if250pxposts}
  617. {block:if1column}
  618.  
  619. {block:if2columns}
  620. {block:if250pxposts}width: 520px;{/block:if250pxposts}
  621. {block:if400pxposts}width: 820px;{/block:if400pxposts}
  622. {block:if2columns}
  623.  
  624. {block:if3columns}
  625. {block:if250pxposts}width: 780px;{/block:if250pxposts}
  626. {block:if3columns}
  627. {/block:indexpage}
  628. {block:permalinkpage}
  629. width: 500px;
  630. margin-top: 120px;
  631. {/block:permalinkpage}
  632. margin-bottom: 20px;
  633. }
  634.  
  635. .posts {
  636. {block:indexpage}
  637.  
  638. {block:if1column}
  639. {block:if500pxposts}
  640. width:500px;
  641. margin-bottom:20px;
  642. {/block:if500pxposts}
  643. {block:if400pxposts}
  644. width:400px;
  645. margin-bottom:20px;
  646. {/block:if400pxposts}
  647. {block:if250pxposts}
  648. width: 250px;
  649. float: left;
  650. display: block;
  651. overflow: hidden;
  652. margin: 0 0 20px 0;
  653. {/block:if250pxposts}
  654. {/block:if1column}
  655.  
  656. {block:ifnot1column}
  657. {block:if250pxposts}
  658. width: 250px;
  659. float: left;
  660. display: block;
  661. overflow: hidden;
  662. margin: 0 5px 10px 5px;
  663. {/block:if250pxposts}
  664. {block:if400pxposts}
  665. width: 400px;
  666. float: left;
  667. display: block;
  668. overflow: hidden;
  669. margin: 0 5px 10px 5px;
  670. {/block:if400pxposts}
  671. {block:ifnot1column}
  672.  
  673. {/block:indexpage}
  674. {block:permalinkpage}
  675. width: 500px;
  676. margin-top: 120px;
  677. {/block:permalinkpage}
  678. transition: 0.6s;
  679. -moz-transition: 0.6s;
  680. -webkit-transition: 0.6s;
  681. -o-transition: 0.6s;
  682. }
  683.  
  684. .photo {
  685. {block:if500pxposts}max-width: 500px;{/block:if500pxposts}
  686. {block:if400pxposts}max-width: 400px;{/block:if400pxposts}
  687. {block:if250pxposts}max-width: 250px;{/block:if250pxposts}
  688. {block:permalinkpage}{block:if250pxposts}max-width: 500px;{/block:if250pxposts}{/block:permalinkpage}
  689. {block:iffadingphotos}
  690. opacity: 0.7;
  691. {/block:iffadingphotos}
  692. {block:ifmonochromeposts}
  693. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  694. filter: gray; /* IE6-9 */
  695. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  696. {/block:ifmonochromeposts}
  697. transition: 0.6s;
  698. -moz-transition: 0.6s;
  699. -webkit-transition: 0.6s;
  700. -o-transition: 0.6s;
  701. }
  702.  
  703. .text img {
  704. {block:indexpage}
  705. {block:if500pxposts}max-width: 470px;{/block:if500pxposts}
  706. {block:if400pxposts}max-width: 370px;{/block:if400pxposts}
  707. {block:if250pxposts}max-width: 220px;{/block:if250pxposts}
  708. {/block:indexpage}
  709.  
  710. {block:permalinkpage}
  711. {block:if500pxposts}max-width: 470px;{/block:if500pxposts}
  712. {block:if400pxposts}max-width: 470px;{/block:if400pxposts}
  713. {block:if250pxposts}max-width: 470px;{/block:if250pxposts}
  714. {/block:permalinkpage}
  715. }
  716. #content blockquote img {max-width: 100%;}
  717.  
  718. .photo:hover {
  719. opacity: 1;
  720. {block:ifmonochromeposts}
  721. filter: none;
  722. -webkit-filter: grayscale(0%);
  723. {/block:ifmonochromeposts}
  724. }
  725.  
  726. .photocov {
  727. opacity: 0;
  728. font-family: courier new;
  729. line-height: 18px;
  730. font-size: 10px;
  731. text-transform: uppercase;
  732. letter-spacing: 1px;
  733. position: absolute;
  734. z-index: 2;
  735. top: 35%;
  736. width: 100%;
  737. height: 100%;
  738. margin-left: auto;
  739. margin-right: auto;
  740. transition: 0.6s;
  741. -moz-transition: 0.6s;
  742. -webkit-transition: 0.6s;
  743. -o-transition: 0.6s;
  744. }
  745. .posts:hover .pho {opacity: 0.8;background-color: #fff;}
  746. .posts:hover .photocov { opacity: 1;}
  747. .pho {
  748. position: absolute;
  749. z-index: 1;
  750. width: 100%;
  751. height: 100%;
  752. top: 0;
  753. left: 0;
  754. opacity: 0;
  755. transition: 0.6s;
  756. -moz-transition: 0.6s;
  757. -webkit-transition: 0.6s;
  758. -o-transition: 0.6s;
  759. }
  760.  
  761. .posts img {
  762. {block:indexpage}
  763. {block:if500pxposts}max-width: 500px;{/block:if500pxposts}
  764. {block:if400pxposts}max-width: 400px;{/block:if400pxposts}
  765. {block:if250pxposts}max-width: 250px;{/block:if250pxposts}
  766. {/block:indexpage}
  767. {block:permalinkpage}
  768. max-width: 500px;
  769. {/block:permalinkpage}
  770. }
  771. .posts blockquote img {max-width: 100%;}
  772.  
  773. .qpost {
  774. background-color: {color:post background};
  775. padding: 10px;
  776. }
  777.  
  778. .text, .ctext, .atext {
  779. background-color: {color:post background};
  780. padding: 5px 15px;
  781. font-family: consolas;
  782. font-size: 11px;
  783. color: {color:body text};
  784. text-align: justify;
  785. }
  786. .ctext { background-color: transparent; padding: 0; }
  787. .atext { margin-top: 10px; }
  788.  
  789. blockquote {
  790. border-left: 1px solid {color:blockquote};
  791. padding: 0 10px;
  792. margin: 5px;
  793. }
  794.  
  795. .line {
  796. text-align: left;
  797. margin: 3px 0;
  798. background-color: {color:post background};
  799. }
  800.  
  801. .odd .line {padding: 10px;color:{color:chat odd text};}
  802. .even .line {padding: 10px;color:{color:chat even text};}
  803. .odd .name {color: {color:chat odd name};}
  804. .even .name {color: {color:chat even name};}
  805.  
  806. .ptitle, .ltitle {
  807. background-color: {color:post title background};
  808. color: {color:post title text};
  809. text-align: center;
  810. font-family: talldark;
  811. font-size: 20px;
  812. line-height: 20px;
  813. letter-spacing: 5px;
  814. padding: 20px 20px;
  815. margin: 5px 0;
  816. border-top: 3px solid {color:post title border};
  817. text-transform: uppercase;
  818. }
  819. .ltitle {
  820. background-color: {color:link post background};
  821. color: {color:link post text};
  822. transition: 1s;
  823. -moz-transition: 1s;
  824. -webkit-transition: 1s;
  825. -o-transition: 1s;
  826. }
  827. .ltitle:hover {
  828. background-color: {color:link post hover background};
  829. color: {color:link post hover text};
  830. border-top: 3px solid {color:link post hover border};
  831. }
  832.  
  833. .audiopost { height: 150px; margin-bottom: 3px; }
  834.  
  835. .albumno {
  836. width: 150px;
  837. height: 150px;
  838. background-color: #888;
  839. position: absolute;
  840. z-index: 1;
  841. {block:indexpage}{block:if250pxposts}
  842. width: 250px;
  843. height: 250px;
  844. {/block:if250pxposts}{/block:indexpage}
  845. }
  846.  
  847. .albumartp {
  848. z-index: 10;
  849. width: 150px;
  850. height: 150px;
  851. position: relative;
  852. z-index: 2;
  853. display: block;
  854. {block:indexpage}{block:if250pxposts}
  855. width: 250px;
  856. height: 250px;
  857. {/block:if250pxposts}{/block:indexpage}
  858. }
  859.  
  860. .albumart {
  861. {block:if500pxposts}margin-left: -350px;{/block:if500pxposts}
  862. {block:if400pxposts}margin-left: -250px;{/block:if400pxposts}
  863. {block:if250pxposts}margin-left: 0;{/block:if250pxposts}
  864. width: 150px;
  865. height: 150px;
  866. display: block;
  867. position: relative;
  868. {block:indexpage}{block:if250pxposts}
  869. width: 250px;
  870. height: 250px;
  871. {/block:if250pxposts}{/block:indexpage}
  872. }
  873.  
  874. .audioplayer {
  875. position: absolute;
  876. z-index: 11;
  877. margin-top: -90px;
  878. margin-left: 65px;
  879. width: 25px;
  880. height: 25px;
  881. overflow: hidden;
  882. opacity: 0.5;
  883. z-index: 10;
  884. {block:indexpage}{block:if250pxposts}
  885. margin-top: -140px;
  886. margin-left: 115px;
  887. {/block:if250pxposts}{/block:indexpage}
  888. transition: 0.6s;
  889. -moz-transition: 0.6s;
  890. -webkit-transition: 0.6s;
  891. -o-transition: 0.6s;
  892. }
  893. .audioplayer:hover {opacity: 1;}
  894.  
  895. .audioinfo {
  896. position: absolute;
  897. margin-left: 155px;
  898. height: 150px;
  899. }
  900.  
  901. .aline {
  902. {block:if500pxposts}width: 325px;{/block:if500pxposts}
  903. {block:if400pxposts}width: 225px;{/block:if400pxposts}
  904. {block:indexpage}{block:if250pxposts}margin-top: 5px;{/block:if250pxposts}{/block:indexpage}
  905. font-family: consolas;
  906. font-size: 10px;
  907. padding: 11px 7px;
  908. margin-bottom: 5px;
  909. text-transform: uppercase;
  910. background-color: {color:audio info background};
  911. color: {color:audio info text};
  912. text-align: left;
  913. }
  914. .aline b,strong { color: {color:body bold}; background-color: {color:body bold highlight};padding: 5px 8px; }
  915.  
  916. .quote {
  917. font-family: talldark;
  918. text-align: center;
  919. font-size: 26px;
  920. letter-spacing: 2px;
  921. line-height: 26px;
  922. color: {color:quote};
  923. }
  924. .qsrc {color:{color:quote source};text-align:center;font-family:consolas;font-size:10px;}
  925. .askerportrait {
  926. max-width: 64px;
  927. max-height: 64px;
  928. position: absolute;
  929. border: 10px solid {color:ask background};
  930. float: left;
  931. {block:if250pxposts}
  932. {block:indexpage}margin-left: -120px;{/block:indexpage}
  933. {block:permalinkpage}margin-left: -260px;{/block:permalinkpage}
  934. {/block:if250pxposts}
  935. {block:if400pxposts}
  936. margin-left: -200px;
  937. {/block:if400pxposts}
  938. {block:if500pxposts}
  939. margin-left: -250px;
  940. {/block:if500pxposts}
  941. }
  942. .a {
  943. margin-left: 100px;
  944. background-color: {color:ask background};
  945. min-height: 64px;
  946. padding: 10px;
  947. font-family: consolas;
  948. font-size: 11px;
  949. color: {color:ask text};
  950. text-align: justify;
  951. }
  952. .asker {
  953. color: {color:asker text};
  954. font-family: consolas;
  955. font-size: 11px;
  956. text-transform: uppercase;
  957. }
  958. .asker a {color: {color:asker link};}
  959. .asker b,strong {background-color: {color:asker link background};color:{color:asker link}; padding: 1px 5px;}
  960. .q {margin-top: 10px;}
  961. .tri {
  962. position: absolute;
  963. font-size: 30px;
  964. margin: 20px 0 0 85px;
  965. color: {color:ask background};
  966. }
  967.  
  968. .p1 { color: {color:perma links 1}; }
  969. .p2 { color: {color:perma links 2}; }
  970. .p3 { color: {color:perma links 3}; }
  971.  
  972. .perma {
  973. background-color: {color:perma background};
  974. padding: 10px;
  975. font-family: courier new;
  976. font-size: 10px;
  977. text-transform: uppercase;
  978. color: {color:perma text};
  979. text-align: left;
  980. border-bottom: 1px solid {color:perma bottom border};
  981. {block:if1column}{block:if250pxposts}
  982. text-align:center;
  983. {/block:if250pxposts}{/block:if1column}
  984. }
  985. .perma b,strong {
  986. padding: 0 4px;
  987. background-color: {color:perma links 4};
  988. color: {color:perma links text};
  989. }
  990. .perma a {
  991. color: {color:perma text};
  992. transition: 0.6s;
  993. -moz-transition: 0.6s;
  994. -webkit-transition: 0.6s;
  995. -o-transition: 0.6s;
  996.  
  997. }
  998. .perma a:hover {color:{color:perma text hover};}
  999.  
  1000. .ptags {margin-top: 8px;text-align:center;}
  1001. .permarvs, .permarvst, .permarvstreb {
  1002. font-family: courier new;
  1003. padding: 0 3px;
  1004. color: {color:perma links text};
  1005. text-align: right;
  1006. margin: 0 -2px 0 0;
  1007. }
  1008. .permarvstreb {
  1009. position: absolute;
  1010. float: right;
  1011. margin-top: -14px;
  1012. {block:if500pxposts}margin-left: 469px;{/block:if500pxposts}
  1013. {block:if400pxposts}margin-left: 369px;{/block:if400pxposts}
  1014. }
  1015. .permarvst {
  1016. {block:if500pxposts}margin-left: 469px;{/block:if500pxposts}
  1017. {block:if400pxposts}margin-left: 369px;{/block:if400pxposts}
  1018. float: right;
  1019. margin-top: -14px;
  1020. position: absolute;
  1021. }
  1022.  
  1023. .permarvs a {color: {color:perma links text};}
  1024. #rvsv, #rvss, #rvsr, #rvst {
  1025. z-index: 1;
  1026. transition: 0.3s;
  1027. -moz-transition: 0.3s;
  1028. -webkit-transition: 0.3s;
  1029. -o-transition: 0.3s;
  1030. }
  1031. #rvsv { background-color: {color:perma links 1}; border: 1px solid {color:perma links 1}; }
  1032. #rvss { background-color: {color:perma links 2}; border: 1px solid {color:perma links 2}; }
  1033. #rvsr { background-color: {color:perma links 3}; border: 1px solid {color:perma links 3}; }
  1034. #rvst { background-color: {color:perma links 4}; border: 1px solid {color:perma links 4}; }
  1035. #rvsv:hover, #rvss:hover, #rvsr:hover, #rvst:hover {
  1036. background-color: {color:perma links hover background};
  1037. color: {color:perma links hover text};
  1038. border:1px solid {color:perma links hover border};
  1039. }
  1040.  
  1041. .prvs {
  1042. text-align: right;
  1043. {block:ifnotalwaysshowtagson1col}
  1044. {block:if500pxposts}margin-left: 413px;{/block:if500pxposts}
  1045. {block:if400pxposts}margin-left: 313px;{/block:if400pxposts}
  1046. {/block:ifnotalwaysshowtagson1col}
  1047. {block:ifalwaysshowtagson1col}
  1048. {block:if500pxposts}margin-left: 428px;{/block:if500pxposts}
  1049. {block:if400pxposts}margin-left: 328px;{/block:if400pxposts}
  1050. {/block:ifalwaysshowtagson1col}
  1051. float: right;
  1052. width: 50px;
  1053. position: absolute;
  1054. margin-top: -2px;
  1055. }
  1056.  
  1057. .permainfo {
  1058. margin-top: 10px;
  1059. {block:if500pxposts}width: 460px;{/block:if500pxposts}
  1060. {block:if400pxposts}width: 360px;{/block:if400pxposts}
  1061. {block:if250pxposts}width: 470px;{/block:if250pxposts}
  1062. padding: 20px;
  1063. font-family: consolas;
  1064. font-size: 11px;
  1065. text-align: center;
  1066. background-color: {color:post background};
  1067. color: {color:body text};
  1068. }
  1069.  
  1070. #notecon {
  1071. padding: 10px;
  1072. width: 500px;
  1073. text-align: left;
  1074. background-color: {color:post background};
  1075. color: {color:body text};
  1076. font-family: consolas;
  1077. font-size: 11px;
  1078. margin-top: 10px;
  1079. }
  1080.  
  1081. #notecon ol.notes {
  1082. list-style-type: none;
  1083. font-size: 11px;
  1084. color: {color:body text};
  1085. font-family: calibri;
  1086. text-decoration: none;
  1087. margin: 0;
  1088. width: 500px;
  1089. padding: 5px;
  1090. text-align: left;
  1091. }
  1092. #notecon ol.notes a {
  1093. color: {color:body links};
  1094. -webkit-transition: all 0.4s ease-in-out;
  1095. -moz-transition: all 0.4s ease-in-out;
  1096. -o-transition: all 0.4s ease-in-out;
  1097. -ms-transition: all 0.4s ease-in-out;
  1098. transition: all 0.4s ease-in-out;}
  1099. #notecon ol.notes a:hover {color:{color:body links};}
  1100. #notecon img.avatar {
  1101. margin-right: 5px;
  1102. width: 10px;
  1103. height: 10px;
  1104. float: left;
  1105. }
  1106.  
  1107. .text b,strong, .permainfo b,strong, .ctext b,strong, .atext b,strong {
  1108. color: {color:body bold};
  1109. font-weight: 400;
  1110. background-color: {color:body bold highlight};
  1111. }
  1112. .text i,em, .permainfo a, .ctext i,em, .atext i,em {
  1113. color: {color:body italic};
  1114. transition: 0.6s;
  1115. -moz-transition: 0.6s;
  1116. -webkit-transition: 0.6s;
  1117. -o-transition: 0.6s;
  1118. }
  1119.  
  1120. .text a, #notecon a, .qsrc a, .ctext a, .atext a {
  1121. color: {color:body links};
  1122. border-bottom: 0 solid transparent;
  1123. transition: 0.6s;
  1124. -moz-transition: 0.6s;
  1125. -webkit-transition: 0.6s;
  1126. -o-transition: 0.6s;
  1127. }
  1128. .text a:hover, .ptags a:hover, .permainfo a:hover, #notecon a:hover, .qsrc a:hover, .ctext a:hover, .atext a:hover {
  1129. color: {color:body links hover};
  1130. border-bottom: 1px solid {color:body links hover};
  1131. }
  1132.  
  1133. .ptags a {
  1134. margin: 0 2px 0 0;
  1135. background-color: {color:tags background};
  1136. color: {color:tags};
  1137. padding: 2px 4px;
  1138. font-family: consolas;
  1139. font-size: 9px;
  1140. text-transform: uppercase;
  1141. line-height: 16px;
  1142. transition: 0.6s;
  1143. -moz-transition: 0.6s;
  1144. -webkit-transition: 0.6s;
  1145. -o-transition: 0.6s;
  1146. }
  1147. .ptags a:hover {
  1148. background-color: {color:tags hover background};
  1149. color: {color:tags hover};
  1150. border-bottom: 0 solid transparent;
  1151. }
  1152.  
  1153. #pagi {
  1154. background-color: {color:post background};
  1155. {block:if250pxposts}width: 250px;{/block:if250pxposts}
  1156. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  1157. {block:if400pxposts}width: 400px;{/block:if400pxposts}
  1158. padding: 10px 0 50px 0;
  1159. border-top: 4px solid {color:pagination background 1};
  1160. font-family: consolas;
  1161. font-size: 12px;
  1162. }
  1163.  
  1164. .jump_page {
  1165. color: {color:pagination text 1};
  1166. background-color: {color:pagination background 1};
  1167. padding: 2px 5px;
  1168. transition: 0.6s;
  1169. -moz-transition: 0.6s;
  1170. -webkit-transition: 0.6s;
  1171. -o-transition: 0.6s;
  1172. }
  1173.  
  1174. .jump_page:hover {
  1175. color: {color:pagination text 2};
  1176. background-color: {color:pagination background 2};
  1177. }
  1178.  
  1179. .current_page {
  1180. color: {color:pagination text 2};
  1181. background-color: {color:pagination background 2};
  1182. }
  1183.  
  1184. #music {
  1185. width: 25px;
  1186. height: 25px;
  1187. overflow: hidden;
  1188. position: absolute;
  1189. background-color: {color:header images border};
  1190. z-index: 100000000;
  1191. {block:ifheaderimages}
  1192. margin-top: 10px;
  1193. margin-left: -34px;
  1194. {/block:ifheaderimages}
  1195. {block:ifnotheaderimages}
  1196. margin-top: 140px;
  1197. margin-left: -24px;
  1198. {/block:ifnotheaderimages}
  1199. }
  1200. .musicgif {
  1201. margin: 5px;
  1202. -webkit-transition: all 0.4s ease-in-out;
  1203. -moz-transition: all 0.4s ease-in-out;
  1204. -o-transition: all 0.4s ease-in-out;-ms-transition: all 0.4s ease-in-out;
  1205. transition: all 0.4s ease-in-out;
  1206. }
  1207. #music:hover .musicgif {
  1208. margin-top: -30px;
  1209. }
  1210.  
  1211. #musicpl {
  1212. width: 20px;
  1213. overflow: hidden;
  1214. height: 20px;
  1215. padding: 2px 20px 10px 0;
  1216. margin-left: -17px;
  1217. background-color: {color:header accent};
  1218. }
  1219.  
  1220. .w1 { background-color: #000;padding: 5px 20px; color: #fff; }
  1221. .w2 {font-family: consolas;font-size: 11px;text-align: left;padding: 10px;width: 326px;margin: 0 auto;background-color: #eee;}
  1222. .w3 {letter-spacing:5px;border-bottom:1px solid #777;text-align:center;margin-bottom: 5px;}
  1223. #warning {position: fixed;width: 100%;height: 100%;background-color: #fff;z-index:-1000000;top: 0;left: 0;text-align: center;padding-top: 200px;font-family: georgia;font-size: 16px;opacity: 0;
  1224. {block:if500pxposts}
  1225. {block:if400pxposts}opacity:1;z-index:100000;{/block:if400pxposts}
  1226. {block:if250pxposts}opacity:1;z-index:100000;{/block:if250pxposts}
  1227. {block:if400pxposts}{block:if250pxposts}opacity:1;z-index:100000;{/block:if250pxposts}{/block:if400pxposts}
  1228. {/block:if500pxposts}
  1229. {block:if400pxposts}{block:if250pxposts}opacity:1;z-index:100000;{block:if250pxposts}{block:if400pxposts}
  1230. {block:if1column}
  1231. {block:if2columns}opacity:1;z-index:100000;{/block:if2columns}
  1232. {block:if3columns}opacity:1;z-index:100000;{/block:if3columns}
  1233. {block:if2columns}{block:if3columns}opacity:1;z-index:100000;{/block:if3columns}{/block:if2columns}
  1234. {/block:if1column}
  1235. {block:if2columns}{block:if3columns}opacity:1;z-index:100000;{block:if3columns}{block:if2columns}
  1236. {block:if2columns}{block:if500pxposts}opacity:1;z-index:100000;{/block:if500pxposts}{/block:if2columns}
  1237. {block:if3columns}{block:if500pxposts}opacity:1;z-index:100000;{/block:if500pxposts}{/block:if3columns}
  1238. {block:if3columns}{block:if400pxposts}opacity:1;z-index:100000;{/block:if400pxposts}{/block:if3columns}
  1239. {block:if3columns}{block:if400pxposts}{block:if500pxposts}opacity:1;z-index:100000;{/block:if500pxposts}{/block:if400pxposts}{/block:if3columns}
  1240. {block:ifnot500pxposts}{block:ifnot400pxposts}{block:ifnot250pxposts}opacity:1;z-index:100000;{/block:ifnot250pxposts}{/block:ifnot400pxposts}{/block:ifnot500pxposts}
  1241. {block:ifnot1column}{block:ifnot2columns}{block:ifnot3columns}opacity:1;z-index:100000;{/block:ifnot3columns}{/block:ifnot2columns}{/block:ifnot1column}
  1242. }
  1243.  
  1244. {CustomCSS}
  1245.  
  1246. </style>
  1247. </head>
  1248. <body>
  1249.  
  1250. <div id="warning">
  1251. <span class="w1">Please pick only 1 post size and/or column!!</span>
  1252. <div class="w2">
  1253. <div class="w3">CHOOSE YOUR COMBO!</div>
  1254. 1 column - 500px posts / 400px posts / 250px posts <br>
  1255. 2 columns - 400px posts / 250px posts<br>
  1256. 3 columns - 250px posts only<br>
  1257. </div><!--w2-->
  1258. </div>
  1259.  
  1260. <center>
  1261.  
  1262. <div id="cente">
  1263.  
  1264. <div id="header">
  1265.  
  1266. <div class="left">
  1267. {block:ifmusicplayer}
  1268. <div id="music">
  1269. <div class="musicgif"><img src="{image:music player gif}"/></div>
  1270. <div id="musicpl">{text:billy music code}</div>
  1271. </div>
  1272. {/block:ifmusicplayer}
  1273. {block:ifheaderimages}
  1274. <div class="bar1"></div>
  1275. <div class="bar2"></div>
  1276. <div class="bar3"></div>
  1277. <div class="bar4"></div>
  1278. {/block:ifheaderimages}
  1279. <div class="desc">{description}</div>
  1280. {block:ifheaderimages}
  1281. <img class="leftim" src="{image:left image}">
  1282. {/block:ifheaderimages}
  1283. </div><!--left-->
  1284.  
  1285. <div class="right">
  1286. {block:ifheaderimages}
  1287. <div class="bar5"></div>
  1288. <div class="bar6"></div>
  1289. <div class="bar7"></div>
  1290. <div class="bar8"></div>
  1291. {/block:ifheaderimages}
  1292. <div class="custom">
  1293. {block:IfLink1}<a href="{text:Link 1 URL}"><div class="cl">{text:Link 1}</div></a>{/block:IfLink1}
  1294. {block:IfLink2}<a href="{text:Link 2 URL}"><div class="cl">{text:Link 2}</div></a>{/block:IfLink2}
  1295. {block:IfLink3}<a href="{text:Link 3 URL}"><div class="cl">{text:Link 3}</div></a>{/block:IfLink3}
  1296. {block:IfLink4}<a href="{text:Link 4 URL}"><div class="cl">{text:Link 4}</div></a>{/block:IfLink4}
  1297. {block:IfLink5}<a href="{text:Link 5 URL}"><div class="cl">{text:Link 5}</div></a>{/block:IfLink5}
  1298. {block:IfLink6}<a href="{text:Link 6 URL}"><div class="cl">{text:Link 6}</div></a>{/block:IfLink6}
  1299. {block:IfLink7}<a href="{text:Link 7 URL}"><div class="cl">{text:Link 7}</div></a>{/block:IfLink7}
  1300. {block:IfLink8}<a href="{text:Link 8 URL}"><div class="cl">{text:Link 8}</div></a>{/block:IfLink8}
  1301. {block:IfLink9}<a href="{text:Link 9 URL}"><div class="cl">{text:Link 9}</div></a>{/block:IfLink9}
  1302. {block:IfLink10}<a href="{text:Link 10 URL}"><div class="cl">{text:Link 10}</div></a>{/block:IfLink10}
  1303. </div><!--cl-->
  1304. {block:ifheaderimages}
  1305. <img class="rightim" src="{image:right image}">
  1306. {/block:ifheaderimages}
  1307. </div><!--right-->
  1308.  
  1309. <div id="titleb">
  1310. {title}
  1311. <div class="subtitle">{text:subtitle}</div>
  1312. <div id="navigation">
  1313. <a href="/">restart</a>
  1314. <a href="/ask">contact</a>
  1315. <a href="/archive">memories</a>
  1316. <a href="http://yukoki.tumblr.com">theme</a>
  1317. </div><!--navigation-->
  1318. </div><!--titleb-->
  1319.  
  1320. </div><!--header-->
  1321.  
  1322. </div><!--cente-->
  1323.  
  1324. <div id="content">
  1325. {block:Posts}
  1326. <div class="posts">
  1327.  
  1328. {block:Quote}<div class="qpost">
  1329. <div class="quote">"{Quote}"</div> <div class="qsrc">- {Source} -</div>
  1330. </div>
  1331. {block:if250pxposts}
  1332. <div class="perma">
  1333. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1334. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1335. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1336. </div>
  1337. {block:if250pxposts}
  1338. {/block:Quote}
  1339.  
  1340. {block:Link}
  1341. <a href="{URL}"><div class="ltitle">{Name} ▷</div></a>
  1342. {block:Description}<div class="text">{Description}</div>{block:Description}
  1343. {block:if250pxposts}
  1344. <div class="perma">
  1345. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1346. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1347. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1348. </div>
  1349. {block:if250pxposts}
  1350. {/block:Link}
  1351.  
  1352. {block:Chat}
  1353. {block:Title}<div class="ptitle">{Title}</div>{/block:Title}
  1354. <div class="ctext">
  1355. {block:Lines}<div class="{Alt}">
  1356. <div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
  1357. {/block:Lines}
  1358. </div>
  1359. {block:if250pxposts}
  1360. <div class="perma">
  1361. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1362. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1363. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1364. </div>
  1365. {block:if250pxposts}
  1366. {/block:Chat}
  1367.  
  1368. {block:Photo}
  1369. {block:indexpage}{block:if250pxposts}{block:ifnot1column}
  1370. <div class="photocov">
  1371. <a href="{permalink}"><span class="p1">{notecountwithlabel}</span</a><br>
  1372. <a href="{permalink}"><span class="p2">{timeago}</span></a><br>
  1373. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1374. </div><!--photocov-->
  1375. <div class="pho"></div>
  1376. {/block:ifnot1column}{/block:if250pxposts}{/block:indexpage}
  1377. {linkopentag}<center><img class="photo" src="{PhotoURL-500}"></center>{linkclosetag}
  1378. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1379. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1380. <div class="text">{Caption}</div>
  1381. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1382. {block:if250pxposts}{block:if1column}
  1383. <div class="perma">
  1384. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1385. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1386. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1387. </div>
  1388. {/block:if1column}{block:if250pxposts}
  1389. {/block:Photo}
  1390.  
  1391. {block:Photoset}
  1392. {block:indexpage}{block:if250pxposts}{block:ifnot1column}
  1393. <div class="photocov">
  1394. <a href="{permalink}"><span class="p1">{notecountwithlabel}</span</a><br>
  1395. <a href="{permalink}"><span class="p2">{timeago}</span></a><br>
  1396. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1397. </div><!--photocov-->
  1398. <div class="pho"></div>
  1399. {/block:ifnot1column}{/block:if250pxposts}{/block:indexpage}
  1400. {block:indexpage}
  1401. {block:if500pxposts}<div class="photo">{Photoset-500}</div>{/block:if500pxposts}
  1402. {block:if400pxposts}<div class="photo">{Photoset-400}</div>{/block:if400pxposts}
  1403. {block:if250pxposts}<div class="photo">{Photoset-250}</div>{/block:if250pxposts}
  1404. {/block:indexpage}
  1405. {block:permalinkpage}
  1406. {block:if500pxposts}<div class="photo">{Photoset-500}</div>{/block:if500pxposts}
  1407. {block:if400pxposts}<div class="photo">{Photoset-500}</div>{/block:if400pxposts}
  1408. {block:if250pxposts}<div class="photo">{Photoset-500}</div>{/block:if250pxposts}
  1409. {/block:permalinkpage}
  1410.  
  1411. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1412. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1413. <div class="text">{Caption}</div>
  1414. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1415. {block:if250pxposts}{block:if1column}
  1416. <div class="perma">
  1417. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1418. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1419. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1420. </div>
  1421. {/block:if1column}{block:if250pxposts}
  1422.  
  1423. {/block:Photoset}
  1424.  
  1425. {block:Text}
  1426. {block:title}<div class="ptitle">{Title}</div>{/block:title}
  1427. <div class="text">{Body}</div>
  1428. {block:if250pxposts}
  1429. <div class="perma">
  1430. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1431. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1432. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1433. </div>
  1434. {block:if250pxposts}
  1435. {/block:Text}
  1436.  
  1437. {block:Audio}
  1438. {block:indexpage}
  1439. {block:ifnot250pxposts}
  1440. <div class="audiopost">
  1441. <div class="audioinfo">
  1442. {block:trackname}<div class="aline"><b>track name</b> {trackname}</div>{/block:trackname}
  1443. {block:artist}<div class="aline"><b>artist</b> {artist}</div>{/block:artist}
  1444. {block:album}<div class="aline"><b>album</b> {album}</div>{/block:album}
  1445. {block:playcount}<div class="aline"><b>play count</b> {playcount}</div>{/block:playcount}
  1446. </div><!--audioinfo-->
  1447. {/block:ifnot250pxposts}
  1448. {/block:indexpage}
  1449. {block:permalinkpage}
  1450. <div class="audioinfo">
  1451. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  1452. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  1453. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  1454. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  1455. </div><!--audioinfo-->
  1456. {/block:permalinkpage}
  1457. <div class="albumart"><div class="albumno"></div>{block:AlbumArt}<img class="albumartp" src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1458. <div class="audioplayer">{AudioPlayer}</div>
  1459. {block:indexpage}{block:ifnot250pxposts}</div><!--audiopost-->{/block:ifnot250pxposts}{/block:indexpage}
  1460. {block:indexpage}{block:if250pxposts}
  1461. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  1462. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  1463. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  1464. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  1465. {/block:if250pxposts}{/block:indexpage}
  1466. {block:IfShowCaptions}{block:Caption}<div class="atext">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1467. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1468. <div class="text">{Caption}</div>
  1469. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1470. {block:if250pxposts}
  1471. <div class="perma">
  1472. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1473. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1474. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1475. </div>
  1476. {block:if250pxposts}
  1477. {/block:Audio}
  1478.  
  1479. {block:Video}
  1480. {block:indexpage}
  1481. {block:if500pxposts}{Video-500}{/block:if500pxposts}
  1482. {block:if400pxposts}{Video-400}{/block:if400pxposts}
  1483. {block:if250pxposts}{Video-250}{/block:if250pxposts}
  1484. {/block:indexpage}
  1485. {block:permalinkpage}
  1486. {block:if500pxposts}{Video-500}{/block:if500pxposts}
  1487. {block:if400pxposts}{Video-500}{/block:if400pxposts}
  1488. {block:if250pxposts}{Video-500}{/block:if250pxposts}
  1489. {/block:permalinkpage}
  1490. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1491. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1492. <div class="text">{Caption}</div>
  1493. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1494. {block:if250pxposts}
  1495. <div class="perma">
  1496. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1497. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1498. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1499. </div>
  1500. {block:if250pxposts}
  1501. {/block:Video}
  1502.  
  1503. {block:Answer}
  1504. <img class="askerportrait" src="{AskerPortraitURL-64}">
  1505. <div class="tri">◀</div>
  1506. <div class="a">
  1507. <span class="asker"><b>{Asker} whispered:</b></span>
  1508. <span class="q">{Question}</span>
  1509. </div>
  1510. <div class="atext">{Answer}</div>
  1511. {block:if250pxposts}
  1512. <div class="perma">
  1513. <a href="{permalink}"><span class="p1">{timeago}</span></a>
  1514. <a href="{permalink}"><span class="p2">@ {NoteCountWithLabel}</span></a>
  1515. <a href="{reblogurl}"><span class="p3">reblog</span></a>
  1516. </div>
  1517. {/block:if250pxposts}
  1518. {/block:Answer}
  1519.  
  1520. {block:indexpage}{block:date}{block:ifnot250pxposts}
  1521.  
  1522. <div class="perma">
  1523.  
  1524. <div class="prvs">{block:RebloggedFrom} <a title="via {ReblogParentName}" href="{ReblogParentURL}"><span class="permarvs" id="rvsv">v</span></a> <a title="source {ReblogRootName}" href="{ReblogRootURL}"><span class="permarvs" id="rvss">s</span></a>{/block:RebloggedFrom} <a title="reblog this?" href="{ReblogURL}"><span class="permarvs" id="rvsr">r</span></a>
  1525.  
  1526. </div><!--prvs-->
  1527.  
  1528. <div style="width: {block:if500pxposts}4{/block:if500pxposts}{block:if400pxposts}3{/block:if400pxposts}00px;"><a title="{DayOfMonthWithZero} {ShortMonth} {Year} @ {12Hour}.{Minutes}{AmPm}" href="{permalink}"><b>Posted</b> {timeago} with {NoteCountWithLabel}.</a></div>
  1529.  
  1530. {block:ifnotalwaysshowtagson1col}
  1531. <a title="view tags" href="#" class="cthrough"><span class="permarvst{block:rebloggedfrom}reb{block:rebloggedfrom}" id="rvst">t</span></a>
  1532. <div class="sub">
  1533. {/block:ifnotalwaysshowtagson1col}
  1534. {block:HasTags}<div class="ptags">{block:Tags}
  1535. <a href="{TagURL}">#{Tag}</a>
  1536. {/block:Tags}</div>{/block:HasTags}
  1537. {block:ifnotalwaysshowtagson1col}
  1538. </div><!--sub-->
  1539. {/block:ifnotalwaysshowtagson1col}
  1540. </div>
  1541.  
  1542. {/block:ifnot250pxposts}{/block:date}{/block:indexpage}
  1543.  
  1544. </div><!--posts-->
  1545.  
  1546. {block:permalinkpage}
  1547. {block:date}<div class="permainfo">
  1548. Posted on <b>{DayOfMonth} {Month} {Year}</b>, at <b>{12Hour}.{Minutes}{AmPm}</b>, with <b>{NoteCountWithLabel}</b><br>
  1549. {block:RebloggedFrom}
  1550. Reblogged via <a href="{ReblogParentURL}">{ReblogParentName}</a>, originally by <a href="{ReblogRootURL}">{ReblogRootName}</a><br>
  1551. {/block:RebloggedFrom}
  1552. {block:HasTags}<div class="ptags">{block:Tags}
  1553. <a href="{TagURL}">#{Tag} </a>
  1554. {/block:Tags}</div>{/block:HasTags}
  1555. </div>{/block:date}
  1556. {block:date}{block:NoteCount}<div id="notecon">
  1557. {PostNotes-16}
  1558. </div><!--notecon-->{/block:NoteCount}{/block:date}
  1559. {/block:permalinkpage}
  1560.  
  1561. {/block:Posts}
  1562. {block:ContentSource}
  1563. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1564. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1565. {/block:SourceLogo}
  1566. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1567. {/block:ContentSource}
  1568.  
  1569. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  1570.  
  1571. </div><!--content-->
  1572.  
  1573. {block:indexpage}{block:if1column}
  1574. <div id="pagi">{block:pagination}
  1575. {block:PreviousPage}
  1576. <a href="{PreviousPage}" class="jump_page">←</a>
  1577. {/block:PreviousPage}
  1578. {block:JumpPagination length="7"}
  1579. {block:CurrentPage}
  1580. <span class="current_page">✗</span>
  1581. {/block:CurrentPage}
  1582. {block:JumpPage}
  1583. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1584. {/block:JumpPage}
  1585. {/block:JumpPagination}
  1586. {block:NextPage}
  1587. <a href="{NextPage}" class="jump_page">→</a>
  1588. {/block:NextPage}
  1589. {/block:pagination}</div><!--pagi-->
  1590. {/block:if1column}{/block:indexpage}
  1591.  
  1592. </center>
  1593.  
  1594. <div class="pagination">
  1595. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  1596. </div>
  1597.  
  1598. </body>
  1599. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement