Advertisement
mogimochi

Theme [20]:re Solace

May 1st, 2016
16,330
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.04 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-----------------------------------------------------------------------
  6.  
  7. Theme 20 Solace
  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.  
  15. ---------------------------------------------------------- VER 280616 -->
  16.  
  17. <meta name="color:scrollbar" content="#5892b6">
  18.  
  19. <meta name="color:introductory panel background" content="#000000">
  20. <meta name="color:introductory panel accent" content="#ffffff">
  21. <meta name="color:introductory panel title" content="#ffffff">
  22. <meta name="color:introductory panel text" content="#dfdfdf">
  23. <meta name="color:intro panel bold" content="#6ec2df">
  24. <meta name="color:intro panel italic" content="#ffffff">
  25. <meta name="color:intro panel links" content="#7f9aad">
  26. <meta name="color:intro panel links hover" content="#ffffff">
  27. <meta name="color:nav icon popup" content="#ffffff">
  28. <meta name="color:directory links background" content="#ffffff">
  29. <meta name="color:directory links text" content="#ffffff">
  30.  
  31. <meta name="color:content panel background" content="#ffffff">
  32. <meta name="color:content topbar background" content="#ffffff">
  33. <meta name="color:content topbar title" content="#818181">
  34. <meta name="color:content topbar border" content="#e1e1e1">
  35. <meta name="color:content topbar icon" content="#7587ad">
  36. <meta name="color:content topbar icon hover" content="#9d9d9d">
  37.  
  38. <meta name="color:desc" content="#6d6d6d">
  39. <meta name="color:desc bold" content="#4c79ad">
  40. <meta name="color:desc italic" content="#b2b2b2">
  41. <meta name="color:desc links" content="#59969a">
  42. <meta name="color:desc links hover" content="#909090">
  43.  
  44. <meta name="color:post background" content="#ffffff" />
  45.  
  46. <meta name="color:body text" content="#525252">
  47. <meta name="color:body links" content="#44c1b3">
  48. <meta name="color:body links hover" content="#a2a2a2">
  49. <meta name="color:body bold" content="#93afc9">
  50. <meta name="color:body italic" content="#aaaaaa">
  51. <meta name="color:blockquote" content="#9dd3dc">
  52.  
  53. <meta name="color:post title background" content="#f5f5f5">
  54. <meta name="color:post title text" content="#aaaaaa">
  55.  
  56. <meta name="color:link post background" content="#f1fffd">
  57. <meta name="color:link post text" content="#97a8b3">
  58. <meta name="color:hover link post background" content="#f3f3f3">
  59. <meta name="color:hover link post text" content="#929292">
  60.  
  61. <meta name="color:audio info background" content="#ffffff">
  62. <meta name="color:audio info text" content="#9d9d9d">
  63.  
  64. <meta name="color:quote" content="#767676">
  65. <meta name="color:quote source" content="#979797">
  66.  
  67. <meta name="color:ask background" content="#ffffff">
  68. <meta name="color:ask text" content="#898989">
  69. <meta name="color:asker text" content="#848484">
  70. <meta name="color:asker link" content="#9fd2d4">
  71.  
  72. <meta name="color:chat even name" content="#a1ddf3" />
  73. <meta name="color:chat even text" content="#b3b3b3" />
  74. <meta name="color:chat odd name" content="#769dbe" />
  75. <meta name="color:chat odd text" content="#5d5d5d" />
  76.  
  77. <meta name="color:post border" content="#e1e1e1">
  78. <meta name="color:permalink icon" content="#60a9b6">
  79. <meta name="color:permalink popup" content="#c3c3c3">
  80. <meta name="color:permalink popup bg" content="#ffffff">
  81.  
  82. <meta name="color:pagination text" content="#7a7a7a">
  83. <meta name="color:pagination links" content="#77b6c9">
  84. <meta name="color:pagination links hover" content="#bbbbbb">
  85.  
  86. <meta name="if:show captions" content="1">
  87. <meta name="if:fading photos" content="0">
  88. <meta name="if:monochrome posts" content="1">
  89. <meta name="if:introductory panel cover" content="1">
  90. <meta name="if:content panel cover" content="0">
  91.  
  92. <meta name="text:url" content="your url">
  93. <meta name="text:introductory text" content="">
  94. <meta name="text:updates" content="">
  95. <meta name="text:long biography" content="">
  96. <meta name="text:content topbar text" content="Content Topbar Text">
  97. <meta name="text:link 1" content="">
  98. <meta name="text:link 1 url" content="">
  99. <meta name="text:link 2" content="">
  100. <meta name="text:link 2 url" content="">
  101. <meta name="text:link 3" content="">
  102. <meta name="text:link 3 url" content="">
  103. <meta name="text:link 4" content="">
  104. <meta name="text:link 4 url" content="">
  105. <meta name="text:link 5" content="">
  106. <meta name="text:link 5 url" content="">
  107. <meta name="text:link 6" content="">
  108. <meta name="text:link 6 url" content="">
  109. <meta name="text:link 7" content="">
  110. <meta name="text:link 7 url" content="">
  111. <meta name="text:link 8" content="">
  112. <meta name="text:link 8 url" content="">
  113. <meta name="text:link 9" content="">
  114. <meta name="text:link 9 url" content="">
  115. <meta name="text:link 10" content="">
  116. <meta name="text:link 10 url" content="">
  117. <meta name="text:link 11" content="">
  118. <meta name="text:link 11 url" content="">
  119. <meta name="text:link 12" content="">
  120. <meta name="text:link 12 url" content="">
  121.  
  122. <meta name="image:introductory panel background" content="">
  123. <meta name="image:content panel background" content="">
  124. <meta name="image:sidebar" content="">
  125.  
  126. <title>{title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  127. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  128. <link rel="shortcut icon" href="{Favicon}" />
  129.  
  130. <!-- java -->
  131. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  132. <script>
  133. $(document).ready(function(){
  134. $(".first-to-contact").click(function(){
  135. $("#contactmain").fadeIn(900);
  136. $("#firstmain").fadeOut(900);
  137. });
  138. $(".first-to-about").click(function(){
  139. $("#aboutmain").fadeIn(900);
  140. $("#firstmain").fadeOut(900);
  141. });
  142. $(".first-to-links").click(function(){
  143. $("#linksmain").fadeIn(900);
  144. $("#firstmain").fadeOut(900);
  145. });
  146. $(".contact-to-first").click(function(){
  147. $("#firstmain").fadeIn(900);
  148. $("#contactmain").fadeOut(900);
  149. });
  150. $(".contact-to-about").click(function(){
  151. $("#aboutmain").fadeIn(900);
  152. $("#contactmain").fadeOut(900);
  153. });
  154. $(".contact-to-links").click(function(){
  155. $("#linksmain").fadeIn(900);
  156. $("#contactmain").fadeOut(900);
  157. });
  158. $(".about-to-first").click(function(){
  159. $("#firstmain").fadeIn(900);
  160. $("#aboutmain").fadeOut(900);
  161. });
  162. $(".about-to-contact").click(function(){
  163. $("#contactmain").fadeIn(900);
  164. $("#aboutmain").fadeOut(900);
  165. });
  166. $(".about-to-links").click(function(){
  167. $("#linksmain").fadeIn(900);
  168. $("#aboutmain").fadeOut(900);
  169. });
  170. $(".links-to-first").click(function(){
  171. $("#firstmain").fadeIn(900);
  172. $("#linksmain").fadeOut(900);
  173. });
  174. });
  175. </script>
  176. <!--END JAVA-->
  177.  
  178. <!--fontawesome-->
  179. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  180. <!--end fontawesome-->
  181.  
  182. <!--smooth scrolling-->
  183. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  184. <script src="http://static.tumblr.com/whx9ghv/lSGm6k18m/jquery.scrollto-1.4.2-min.js"></script>
  185. <script src="http://static.tumblr.com/whx9ghv/GJEm6k188/jquery.localscroll-1.2.7-min.js"></script>
  186.  
  187. <script>
  188. $(document).ready(function () {
  189. $.localScroll();
  190. });
  191. </script>
  192. <!--end smooth scrolling-->
  193.  
  194. <!--sticky-->
  195. <script>
  196. $(document).ready(function() {
  197. var stickyNavTop = $('#cpbar').offset().top;
  198.  
  199. var stickyNav = function(){
  200. var scrollTop = $(window).scrollTop();
  201.  
  202. if (scrollTop > stickyNavTop) {
  203. $('#cpbar').addClass('sticky');
  204. } else {
  205. $('#cpbar').removeClass('sticky');
  206. }
  207. };
  208.  
  209. stickyNav();
  210.  
  211. $(window).scroll(function() {
  212. stickyNav();
  213. });
  214. });
  215. </script>
  216. <!--sticky-->
  217.  
  218. <style type="text/css">
  219.  
  220. @font-face { font-family: "opsans"; src: url('https://dl.dropboxusercontent.com/s/6t6k1zdmq4v9u8b/OpenSans-Light.ttf'); }
  221. @font-face { font-family: "gogoia"; src: url('https://dl.dropboxusercontent.com/s/zyh6remaoilffa9/GOGOIA-Deco.otf'); }
  222.  
  223. .tmblr-iframe {z-index:999999999999999999!important;position:fixed!important;}
  224.  
  225. ::-webkit-scrollbar { width: 4px; }
  226. ::-webkit-scrollbar-track-piece { background-color: transparent; }
  227. ::-webkit-scrollbar-thumb:vertical {
  228. width: 4px;
  229. background-color: {color:scrollbar};
  230. opacity: 0.4;
  231. }
  232.  
  233. body {
  234. background-color: {color:introductory panel background};
  235. {block:ifintroductorypanelcover}
  236. background-size: cover;
  237. {/block:ifintroductorypanelcover}
  238. background-image: url({image:introductory panel background});
  239. {block:permalinkpage}
  240. background-image: url({image:content panel background});
  241. {block:ifcontentpanelcover}
  242. background-size: cover;
  243. {/block:ifcontentpanelcover}
  244. {/block:permalinkpage}
  245. background-attachment: fixed;
  246. margin: 0;
  247. word-wrap: break-word;
  248. }
  249.  
  250. a { text-decoration:none; }
  251.  
  252. #intropanel {
  253. {block:permalinkpage}display: none;{/block:permalinkpage}
  254. width: 100%;
  255. height: 660px;
  256. background-color: {color:introductory panel background};
  257. background-image: url({image:introductory panel background});
  258. background-size: cover;
  259. background-attachment: fixed;
  260. }
  261.  
  262. #mainmain {padding-top: 90px;}
  263.  
  264. #cropic {
  265. width: 85px;
  266. height: 85px;
  267. transform: rotate(45deg);
  268. border-radius: 14px;
  269. overflow: hidden;
  270. border: 10px solid rgba({RGBcolor:introductory panel accent},0.4);
  271. }
  272.  
  273. .crip {
  274. width: 120px;
  275. height: 120px;
  276. display: block;
  277. transform: rotate(-45deg);
  278. margin-left: -58px;
  279. padding-left: 47px;
  280. }
  281.  
  282. .maintitle {
  283. font-family: gogoia;
  284. font-size: 50px;
  285. letter-spacing: 8px;
  286. color: {color:introductory panel title};
  287. margin-top: 60px;
  288. }
  289.  
  290. .mtabove {
  291. width: 700px;
  292. background-color: rgba({RGBcolor:introductory panel accent},0.5);
  293. height: 4px;
  294. margin-bottom: 24px;
  295. z-index: 10;
  296. }
  297.  
  298. .mtbelow {
  299. width: 700px;
  300. background-color: rgba({RGBcolor:introductory panel accent},0.5);
  301. height: 4px;
  302. margin-top: 14px;
  303. z-index: 10;
  304. }
  305.  
  306. .quotabove, .quotbelow {
  307. position: absolute;
  308. font-size: 70px;
  309. font-family: georgia;
  310. z-index: 9;
  311. overflow: hidden;
  312. height: 50px;
  313. margin: 40px 0;
  314. width: 700px;
  315. }
  316.  
  317. .quotbelow { margin: -24px 0; }
  318.  
  319. .quot {
  320. {block:ifintroductorypanelcover}
  321. background-size: cover;
  322. {/block:ifintroductorypanelcover}
  323. background-color: {color:introductory panel background};
  324. background-image: url({image:introductory panel background});
  325. background-size: cover;
  326. background-attachment: fixed;
  327. padding: 0 20px;
  328. color: {color:introductory panel accent};
  329. text-align: center;
  330. }
  331.  
  332. #maininfo {
  333. width: 800px;
  334. margin-top: 40px;
  335. margin-left: -50px;
  336. }
  337.  
  338. .leftinfo-desc {
  339. padding-right: 20px;
  340. border-right: 1px solid rgba({RGBcolor:introductory panel accent},0.2);
  341. width: 380px;
  342. float: left;
  343. font-family: opsans;
  344. line-height: 22px;
  345. color: {color:introductory panel text};
  346. font-size: 12px;
  347. text-align: right;
  348. margin-right: 19px;
  349. }
  350.  
  351. .rightinfo-upd {
  352. float: left;
  353. width: 380px;
  354. text-align: left;
  355. font-family: opsans;
  356. line-height: 22px;
  357. color: {color:introductory panel text};
  358. font-size: 12px;
  359. }
  360.  
  361. #maininfo b,strong, .abtbio b,strong {color: {color:intro panel bold};}
  362. #maininfo i,em, .abtbio i,em {color: {color:intro panel italic};}
  363. #maininfo a, .abtbio a {color: {color:intro panel links};}
  364. #maininfo a:hover, .abtbio a:hover {color: {color:intro panel links hover};}
  365.  
  366. #leftnav, #rightnav {
  367. position: absolute;
  368. margin-top: -62px;
  369. margin-left: 33px;
  370. color: {color:introductory panel accent};
  371. }
  372.  
  373. #rightnav {margin-left: 454px;}
  374.  
  375. #leftnav a, #rightnav a { color: {color:introductory panel accent}; }
  376.  
  377. .butt {
  378. width: 50px;
  379. float: left;
  380. margin-right: 32px;
  381. cursor: pointer;
  382. }
  383.  
  384. .buttbg {
  385. position: absolute;
  386. width: 30px;
  387. height: 30px;
  388. border-radius: 4px;
  389. transform: rotate(45deg);
  390. border: 2px solid {color:introductory panel accent};
  391. background-color: rgba({RGBcolor:introductory panel accent},0.1);
  392. margin: -8px 8px;
  393. }
  394.  
  395. .butt:hover .buttbg {
  396. transform: rotate(135deg);
  397. transition: 0.4s;
  398. }
  399.  
  400. #homo {
  401. width: 700px;
  402. height: 100%;
  403. }
  404.  
  405. .prompty {
  406. margin-top: 170px;
  407. color: {color:introductory panel accent};
  408. font-size: 40px;
  409. }
  410.  
  411. .strikelin, .strikelin2 {
  412. width: 38px;
  413. position: absolute;
  414. background-color: {color:introductory panel accent};
  415. height: 2px;
  416. margin: 8px 47px;
  417. }
  418.  
  419. .strikelin2 {
  420. margin: 8px -35px;
  421. }
  422.  
  423. .txtbutt {
  424. position: absolute;
  425. width: 100px;
  426. margin: -60px -24px;
  427. font-family: gogoia;
  428. font-size: 20px;
  429. letter-spacing: 3px;
  430. opacity: 0;
  431. transition: 0.8s;
  432. cursor: pointer;
  433. color: {color:nav icon popup};
  434. }
  435.  
  436. .tbhl {
  437. border: 2px solid {color:nav icon popup};
  438. padding: 5px 7px 3px 8px;
  439. }
  440.  
  441. .butt:hover .txtbutt {
  442. opacity: 1;
  443. transition-delay: 0.4s;
  444. margin: -70px -24px;
  445. }
  446.  
  447. .jiji {
  448. color: {color:introductory panel accent};
  449. margin-top: 180px;
  450. font-size: 40px;
  451. }
  452.  
  453. .jiji a {color:{color:introductory panel accent};}
  454.  
  455. #contentpanel {
  456. background-color: {color:content panel background};
  457. background-image: url({image:content panel background});
  458. {block:ifcontentpanelcover}
  459. background-size: cover;
  460. {/block:ifcontentpanelcover}
  461. width: 100%;
  462. background-attachment: fixed;
  463. min-height: 660px;
  464. }
  465.  
  466. #cpbar {
  467. background-color: {color:content topbar background};
  468. padding: 20px 0;
  469. height: 32px;
  470. border-bottom: 1px solid {color:content topbar border};
  471. border-top: 1px solid {color:content topbar border};
  472. }
  473.  
  474. .cpicon {
  475. width: 32px;
  476. height: 32px;
  477. border-radius: 3px;
  478. float: left;
  479. margin-left: 20px;
  480. }
  481.  
  482. .cptitle {
  483. font-family: gogoia;
  484. font-size: 20px;
  485. padding-left: 20px;
  486. text-transform: uppercase;
  487. line-height: 32px;
  488. letter-spacing: 3px;
  489. float: left;
  490. color: {color:content topbar title};
  491. }
  492.  
  493. .cptitle a { color: {color:content topbar title};}
  494.  
  495. .sticky {
  496. position: fixed;
  497. width: 100%;
  498. left: 0;
  499. top: 0;
  500. z-index: 100;
  501. }
  502.  
  503. #cpstickywrap {width: 100%;height: 100%;}
  504.  
  505. #cpnav {
  506. width: 280px;
  507. margin-top: -37px;
  508. margin-left: 16px;
  509. position: absolute;
  510. font-size: 14px;
  511. }
  512.  
  513. .cpnavi {
  514. width: 18px;
  515. margin-right: 22px;
  516. float: left;
  517. cursor: pointer;
  518. }
  519.  
  520. .cpnbg {
  521. background-color: {color:content topbar background};
  522. border: 1px solid {color:content topbar border};
  523. border-radius: 3px;
  524. width: 24px;
  525. height: 24px;
  526. position: absolute;
  527. transform: rotate(45deg);
  528. transition: 0.6s;
  529. margin: -6px -4px;
  530. cursor: pointer;
  531. }
  532.  
  533. .cpnic {
  534. color: {color:content topbar icon};
  535. position: relative;
  536. z-index: 2;
  537. font-size: 12px;
  538. transition: 0.6s;
  539. cursor: pointer;
  540. }
  541.  
  542. .cpnavi:hover .cpnic {color: {color:content topbar icon hover};}
  543.  
  544. #cpnic2 {margin-left: 0px;}
  545.  
  546. #cprightsidebar {
  547. width: 170px;
  548. padding: 30px;
  549. background-color: {color:content topbar background};
  550. margin-left: 536px;
  551. margin-top: 53px;
  552. border-left: 1px solid {color:content topbar border};
  553. border-right: 1px solid {color:content topbar border};
  554. border-bottom: 1px solid {color:content topbar border};
  555. border-radius: 0 0 5px 5px;
  556. }
  557.  
  558. .cprimg {width: 170px;display:block;}
  559.  
  560. .desc {
  561. font-family: opsans;
  562. font-size: 10px;
  563. margin-top: 20px;
  564. text-align: left;
  565. color: {color:desc};
  566. }
  567.  
  568. .desc b,strong { color: {color:desc bold}; }
  569. .desc i,em { color: {color:desc italic}; }
  570. .desc a { color: {color:desc links}; }
  571. .desc a:hover { color: {color:desc links hover}; }
  572.  
  573. #contactmain, #aboutmain, #linksmain {
  574. padding-top: 90px;
  575. display: none;
  576. color: #fff;
  577. width: 100%;
  578. position: absolute;
  579. top: 0;
  580. {block:ifintroductorypanelcover}
  581. background-size: cover;
  582. {/block:ifintroductorypanelcover}
  583. background-image: url({image:introductory panel background});
  584. background-color: {color:introductory panel background};
  585. background-size: cover;
  586. background-attachment: fixed;
  587. }
  588.  
  589. .contactpanel, .aboutpanel {width: 700px;}
  590.  
  591. .frqntitle, .abttitle {
  592. margin-top: 40px;
  593. font-family: gogoia;
  594. font-size: 30px;
  595. color: {color:introductory panel title};
  596. letter-spacing: 6px;
  597. border-bottom: 2px solid {color:introductory panel accent};
  598. padding-bottom: 16px;
  599. margin-bottom: 30px;
  600. text-align: center;
  601. }
  602.  
  603. #frqncon {
  604. padding: 0 30px;
  605. text-align: left;
  606. font-family: opsans;
  607. color: {color:introductory panel text};
  608. font-size: 12px;
  609. }
  610.  
  611. .faqn {
  612. margin-top: 30px;
  613. font-size: 14px;
  614. }
  615.  
  616. #frqncon blockquote {
  617. border-left: 2px solid {color:introductory panel accent};
  618. padding-left: 20px;
  619. margin-left: 20px;
  620. }
  621.  
  622. .askbox {
  623. margin-top: 40px;
  624. margin-bottom: 40px;
  625. }
  626.  
  627. .abtarea {
  628. font-family: opsans;
  629. font-size: 12px;
  630. text-align: left;
  631. }
  632.  
  633. .abtbio {padding: 0 20px 40px 20px;}
  634.  
  635. #linksmain {padding-top: 20p;}
  636.  
  637. .linkspanel {
  638. width: 660px;
  639. padding-top: 120px;
  640. }
  641.  
  642. .dirtitle {
  643. font-family: gogoia;
  644. font-size: 40px;
  645. color: {color:introductory panel title};
  646. letter-spacing: 8px;
  647. margin-bottom: 30px;
  648. }
  649.  
  650. .dirlink {
  651. width: 200px;
  652. padding: 16px 0;
  653. margin: 10px;
  654. float: left;
  655. font-family: opsans;
  656. font-size: 12px;
  657. text-transform: uppercase;
  658. letter-spacing: 2px;
  659. color: {color:directory links text};
  660. background-color: rgba({RGBcolor:directory links background},0.1);
  661. border-radius: 5px;
  662. }
  663.  
  664. .closelinksmain {
  665. position: fixed;
  666. top: 40px;
  667. right: 20px;
  668. background-color: rgba({RGBcolor:directory links background},0.2);
  669. color: {color:directory links text};
  670. font-family: opsans;
  671. font-size: 22px;
  672. padding: 2px 10px;
  673. cursor: pointer;
  674. }
  675.  
  676. #content {
  677. width: 500px;
  678. margin-top: 30px;
  679. margin-left: -250px;
  680. padding-bottom: 30px;
  681. }
  682.  
  683. .posts {
  684. width: 500px;
  685. margin-bottom: 30px;
  686. border-bottom: 1px solid {color:post border};
  687. transition: 0.6s;
  688. }
  689.  
  690. .photo {
  691. display: block;
  692. max-width: 500px;
  693. {block:iffadingphotos}
  694. opacity: 0.7;
  695. {/block:iffadingphotos}
  696. {block:ifmonochromeposts}
  697. filter: gray; /* IE6-9 */
  698. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  699. {/block:ifmonochromeposts}
  700. transition: 0.6s;
  701. }
  702.  
  703. .photo:hover {
  704. opacity: 1;
  705. {block:ifmonochromeposts}
  706. filter: none;
  707. -webkit-filter: grayscale(0%);
  708. {/block:ifmonochromeposts}
  709. }
  710. .photo img {max-width: 500px;}
  711.  
  712. .text img {max-width: 470px;}
  713. .posts blockquote img {max-width: 100%;}
  714.  
  715. .qpost {
  716. background-color: {color:post background};
  717. padding: 30px;
  718. }
  719.  
  720. .text, .ctext, .atext {
  721. background-color: {color:post background};
  722. padding: 20px 25px;
  723. font-family: opsans;
  724. font-size: 12px;
  725. color: {color:body text};
  726. text-align: justify;
  727. font-style: none;
  728. }
  729. .ctext { background-color: transparent; padding: 0; }
  730. .atext { margin-top: 5px; }
  731.  
  732. blockquote {
  733. border-left: 1px solid {color:blockquote};
  734. padding: 0 10px;
  735. margin: 5px;
  736. }
  737.  
  738. .line {
  739. text-align: left;
  740. margin: 3px 0;
  741. background-color: {color:post background};
  742. }
  743.  
  744. .odd .line {padding: 10px;color:{color:chat odd text};}
  745. .even .line {padding: 10px;color:{color:chat even text};}
  746. .odd .name {color: {color:chat odd name};}
  747. .even .name {color: {color:chat even name};}
  748.  
  749. .ptitle, .ltitle {
  750. font-family: gogoia;
  751. background-color: {color:post title background};
  752. font-size: 28px;
  753. letter-spacing: 4px;
  754. text-align: center;
  755. padding: 14px 0 6px 0;
  756. color: {color:post title text};
  757. }
  758.  
  759. .ltitle {
  760. background-color: {color:link post background};
  761. color: {color:link post text};
  762. transition: 1s;
  763. -moz-transition: 1s;
  764. -webkit-transition: 1s;
  765. -o-transition: 1s;
  766. }
  767.  
  768. .ltitle:hover {
  769. background-color: {color:hover link post background};
  770. color: {color:hover link post text};
  771. }
  772.  
  773. .audiopost { height: 150px;margin-bottom: 5px; }
  774.  
  775. .albumno {
  776. width: 150px;
  777. height: 150px;
  778. background-color: #888;
  779. position: absolute;
  780. z-index: 1;
  781. }
  782.  
  783. .albumartp {
  784. z-index: 10;
  785. width: 150px;
  786. height: 150px;
  787. position: relative;
  788. z-index: 2;
  789. }
  790.  
  791. .albumart {
  792. margin-left: -350px;
  793. width: 150px;
  794. height: 150px;
  795. display: block;
  796. position: relative;
  797. }
  798.  
  799. .audioplayer {
  800. position: absolute;
  801. z-index: 11;
  802. margin-top: -90px;
  803. margin-left: 65px;
  804. width: 25px;
  805. height: 25px;
  806. overflow: hidden;
  807. opacity: 0.5;
  808. z-index: 10;
  809. transition: 0.6s;
  810. -moz-transition: 0.6s;
  811. -webkit-transition: 0.6s;
  812. -o-transition: 0.6s;
  813. }
  814. .audioplayer:hover {opacity: 1;}
  815.  
  816. .audioinfo {
  817. position: absolute;
  818. margin-left: 155px;
  819. height: 150px;
  820. }
  821.  
  822. .aline {
  823. width: 325px;
  824. text-align: left;
  825. font-family: opsans;
  826. font-size: 10px;
  827. padding: 11px 10px;
  828. margin-bottom: 5px;
  829. text-transform: uppercase;
  830. height: 12px;
  831. overflow:hidden;
  832. background-color: {color:post background};
  833. color: {color:audio info text};
  834. }
  835.  
  836. .aline b,strong { color: {color:body bold};}
  837.  
  838. .quote {
  839. font-family: gogoia;
  840. text-align: center;
  841. font-size: 30px;
  842. color: {color:quote};
  843. }
  844. .qsrc {color:{color:quote source};text-align:center;font-family:opsans;font-size:12px;}
  845. .askerportrait {
  846. max-width: 64px;
  847. max-height: 64px;
  848. position: absolute;
  849. border: 10px solid {color:ask background};
  850. float: left;
  851. margin-left: -250px;
  852. }
  853. .a {
  854. margin-left: 100px;
  855. background-color: {color:ask background};
  856. min-height: 64px;
  857. padding: 10px;
  858. font-family: opsans;
  859. font-size: 12px;
  860. color: {color:ask text};
  861. text-align: justify;
  862. }
  863. .asker {
  864. color: {color:asker text};
  865. font-family: opsans;
  866. font-size: 11px;
  867. text-transform: uppercase;
  868. }
  869. .asker a {color: {color:asker link};}
  870. .q {margin-top: 10px;}
  871. .tri {
  872. position: absolute;
  873. font-size: 30px;
  874. margin: 20px 0 0 85px;
  875. color: {color:ask background};
  876. }
  877.  
  878. .text b,strong, .permainfo b,strong, .ctext b,strong, .atext b,strong, blockquote b,strong {
  879. color: {color:body bold};
  880. background-color: {color:post background};
  881. font-weight: 400;
  882. padding: 0 3px;
  883. }
  884. .text i,em, .permainfo a, .ctext i,em, .atext i,em {
  885. color: {color:body italic};
  886. transition: 0.6s;
  887. -moz-transition: 0.6s;
  888. -webkit-transition: 0.6s;
  889. -o-transition: 0.6s;
  890. }
  891.  
  892. .text a, #notecon a, .qsrc a, .ctext a, .atext a, .permainfo3 a {
  893. color: {color:body links};
  894. transition: 0.6s;
  895. -moz-transition: 0.6s;
  896. -webkit-transition: 0.6s;
  897. -o-transition: 0.6s;
  898. }
  899. .text a:hover, .permainfo a:hover, #notecon a:hover, .qsrc a:hover, .ctext a:hover, .atext a:hover, .permainfo3 a:hover {
  900. color: {color:body links hover};
  901. }
  902.  
  903. .perma {
  904. position: absolute;
  905. width: 500px;
  906. text-align: center;
  907. margin: -8px 180px;
  908. opacity: 0;
  909. transition: 0.6s;
  910. }
  911.  
  912. .posts:hover {
  913. {block:indexpage}margin-bottom: 70px;{/block:indexpage}
  914. }
  915.  
  916. .posts:hover .perma {
  917. opacity: 1;
  918. }
  919.  
  920. .piconcon {
  921. float: left;
  922. width: 20px;
  923. margin-right: 40px;
  924. }
  925.  
  926. .ptxttri { color: {color:permalink popup}; margin-bottom: -1px; }
  927.  
  928. .ptx {
  929. color: {color:permalink popup};
  930. background-color: {color:permalink popup bg};
  931. padding: 2px 6px;
  932. border: 1px solid {color:permalink popup};
  933. }
  934.  
  935. .ptxtcon {
  936. position: absolute;
  937. width: 200px;
  938. font-family: consolas;
  939. text-transform: uppercase;
  940. letter-spacing: 3px;
  941. font-size: 10px;
  942. z-index: 3;
  943. margin: 26px -88px;
  944. transition: 0.4s;
  945. opacity: 0;
  946. }
  947.  
  948. .piconbg {
  949. margin: -7px -4px;
  950. width: 28px;
  951. height: 28px;
  952. border: 1px solid {color:post border};
  953. background-color: {color:post background};
  954. transform: rotate(45deg);
  955. position: absolute;
  956. }
  957.  
  958. .picon { position: relative; z-index: 1; color: {color:permalink icon}; }
  959.  
  960. .piconcon:hover .ptxtcon {
  961. opacity: 1;
  962. margin: 30px -88px;
  963. }
  964.  
  965. .permainfo {
  966. font-family: opsans;
  967. font-size: 12px;
  968. color: {color:body text};
  969. padding: 30px;
  970. background-color: {color:post background};
  971. }
  972.  
  973. #notecon {
  974. padding: 30px;
  975. margin-top: 30px;
  976. background-color: {color:post background};
  977. font-family: opsans;
  978. font-size: 12px;
  979. color: {color:body text};
  980. }
  981.  
  982. #notecon ol.notes {
  983. list-style-type: none;
  984. font-size: 12px;
  985. color: {color:body text};
  986. font-family: opsans;
  987. text-decoration: none;
  988. margin: 0;
  989. width: 440px;
  990. line-height: 14px;
  991. text-align: left;
  992. }
  993.  
  994. .notes li {
  995. width: 420px;
  996. margin-left: -30px;
  997. font-size: 12px;
  998. padding: 10px 0;
  999. border-bottom: 1px solid #f3f3f3;
  1000. }
  1001.  
  1002. .notes img {
  1003. margin-right: 10px;
  1004. float: left;
  1005. width: 13px;
  1006. height: 13px;
  1007. }
  1008.  
  1009. .pagi {
  1010. position: absolute;
  1011. margin: 44px 0;
  1012. width: 170px;
  1013. text-align: center;
  1014. font-family: opsans;
  1015. font-size: 12px;
  1016. text-align: center;
  1017. letter-spacing: 6px;
  1018. color: {color:pagination text};
  1019. }
  1020.  
  1021. .pagi a {color: {color:pagination links};}
  1022. .pagi a:hover {color: {color:pagination links hover};}
  1023.  
  1024.  
  1025. {CustomCSS}
  1026.  
  1027. </style>
  1028. </head>
  1029. <body>
  1030.  
  1031. <center>
  1032. <div id="linksmain">
  1033. <span class="links-to-first"><div class="closelinksmain">X</div></span>
  1034. <div class="linkspanel">
  1035. <div class="dirtitle">directory</div>
  1036. {block:iflink1}<a href="{text:link 1 url}"><div class="dirlink">{text:link 1}</div></a>{/block:iflink1}
  1037. {block:iflink2}<a href="{text:link 2 url}"><div class="dirlink">{text:link 2}</div></a>{/block:iflink2}
  1038. {block:iflink3}<a href="{text:link 3 url}"><div class="dirlink">{text:link 3}</div></a>{/block:iflink3}
  1039. {block:iflink4}<a href="{text:link 4 url}"><div class="dirlink">{text:link 4}</div></a>{/block:iflink4}
  1040. {block:iflink5}<a href="{text:link 5 url}"><div class="dirlink">{text:link 5}</div></a>{/block:iflink5}
  1041. {block:iflink6}<a href="{text:link 6 url}"><div class="dirlink">{text:link 6}</div></a>{/block:iflink6}
  1042. {block:iflink7}<a href="{text:link 7 url}"><div class="dirlink">{text:link 7}</div></a>{/block:iflink7}
  1043. {block:iflink8}<a href="{text:link 8 url}"><div class="dirlink">{text:link 8}</div></a>{/block:iflink8}
  1044. {block:iflink9}<a href="{text:link 9 url}"><div class="dirlink">{text:link 9}</div></a>{/block:iflink9}
  1045. {block:iflink10}<a href="{text:link 10 url}"><div class="dirlink">{text:link 10}</div></a>{/block:iflink10}
  1046. {block:iflink11}<a href="{text:link 11 url}"><div class="dirlink">{text:link 11}</div></a>{/block:iflink11}
  1047. {block:iflink12}<a href="{text:link 12 url}"><div class="dirlink">{text:link 12}</div></a>{/block:iflink12}
  1048. </div><!--linkspanel-->
  1049. </div><!--linksmain-->
  1050. </center>
  1051.  
  1052.  
  1053.  
  1054. <center>
  1055. <div id="aboutmain">
  1056. <div class="aboutpanel">
  1057. <div id="cropic"><img class="crip" src="{PortraitURL-128}"></div><!--cropic-->
  1058. <div id="leftnav">
  1059. <div class="butt"><span class="about-to-first"><div class="txtbutt"><span class="tbhl">posts</span><div class="tbtri">▼</div></div></span>
  1060. <div class="strikelin"></div>
  1061. <span class="about-to-first"><div class="buttbg"></div><i class="fa fa-file-text-o"></i></span>
  1062. </div><!--butt-->
  1063. <div class="butt"><span class="about-to-contact"><div class="txtbutt"><span class="tbhl">contact</span><div class="tbtri">▼</div></div></span>
  1064. <div class="strikelin"></div>
  1065. <span class="about-to-contact"><div class="buttbg"></div><i class="fa fa-envelope-o"></i></span>
  1066. </div><!--butt-->
  1067. <div class="butt"><div class="txtbutt"><span class="tbhl">archives</span><div class="tbtri">▼</div></div>
  1068. <div class="strikelin"></div><a href="/archive">
  1069. <div class="buttbg"></div><i class="fa fa-calendar"></i>
  1070. </a></div><!--butt-->
  1071. </div><!--leftnav-->
  1072. <div id="rightnav">
  1073. <div class="butt"><span class="first-to-about"><div class="txtbutt"><span class="tbhl">about</span><div class="tbtri">▼</div></div></span>
  1074. <div class="strikelin2"></div><div class="strikelin"></div>
  1075. <span class="first-to-about"><div class="buttbg"></div><i class="fa fa-user"></i></span>
  1076. </div><!--butt-->
  1077. <div class="butt"><span class="about-to-links"><div class="txtbutt"><span class="tbhl">links</span><div class="tbtri">▼</div></div></span>
  1078. <div class="strikelin"></div><div class="strikelin"></div>
  1079. <span class="about-to-links"><div class="buttbg"></div><i class="fa fa-plus"></i></span>
  1080. </div><!--butt-->
  1081. <div class="butt"><div class="txtbutt"><span class="tbhl">credit</span><div class="tbtri">▼</div></div>
  1082. <a href="http://yukoki.tumblr.com">
  1083. <div class="buttbg"></div><i class="fa fa-pagelines"></i>
  1084. </a></div><!--butt-->
  1085. </div><!--rightnav-->
  1086. <div class="abtarea">
  1087. <div class="abttitle">user biography</div>
  1088. <div class="abtbio">{text:long biography}</div><!--abtbio-->
  1089. </div><!--abtarea-->
  1090. </div><!--aboutmain-->
  1091. </div><!--aboutpanel-->
  1092. </center>
  1093.  
  1094.  
  1095. <center>
  1096. <div id="contactmain">
  1097. <div class="contactpanel">
  1098. <div id="cropic"><img class="crip" src="{PortraitURL-128}"></div><!--cropic-->
  1099. <div id="leftnav">
  1100. <div class="butt"><span class="contact-to-first"><div class="txtbutt"><span class="tbhl">posts</span><div class="tbtri">▼</div></div></span>
  1101. <div class="strikelin"></div>
  1102. <span class="contact-to-first"><div class="buttbg"></div><i class="fa fa-file-text-o"></i></span>
  1103. </div><!--butt-->
  1104. <div class="butt"><span class="first-to-contact"><div class="txtbutt"><span class="tbhl">contact</span><div class="tbtri">▼</div></div></span>
  1105. <div class="strikelin"></div>
  1106. <span class="first-to-contact"><div class="buttbg"></div><i class="fa fa-envelope-o"></i></span>
  1107. </div><!--butt-->
  1108. <div class="butt"><div class="txtbutt"><span class="tbhl">archives</span><div class="tbtri">▼</div></div>
  1109. <div class="strikelin"></div><a href="/archive">
  1110. <div class="buttbg"></div><i class="fa fa-calendar"></i>
  1111. </a></div><!--butt-->
  1112. </div><!--leftnav-->
  1113. <div id="rightnav">
  1114. <div class="butt"><span class="contact-to-about"><div class="txtbutt"><span class="tbhl">about</span><div class="tbtri">▼</div></div></span>
  1115. <div class="strikelin2"></div><div class="strikelin"></div>
  1116. <span class="contact-to-about"><div class="buttbg"></div><i class="fa fa-user"></i></span>
  1117. </div><!--butt-->
  1118. <div class="butt"><span class="contact-to-links"><div class="txtbutt"><span class="tbhl">links</span><div class="tbtri">▼</div></div></span>
  1119. <div class="strikelin"></div><div class="strikelin"></div>
  1120. <span class="contact-to-links"><div class="buttbg"></div><i class="fa fa-plus"></i></span>
  1121. </div><!--butt-->
  1122. <div class="butt"><div class="txtbutt"><span class="tbhl">credit</span><div class="tbtri">▼</div></div>
  1123. <a href="http://yukoki.tumblr.com">
  1124. <div class="buttbg"></div><i class="fa fa-pagelines"></i>
  1125. </a></div><!--butt-->
  1126. </div><!--rightnav-->
  1127.  
  1128. <div class="faqarea">
  1129. <div class="frqntitle">frequently asked questions</div>
  1130. <div id="frqncon">
  1131.  
  1132. <!----------------------- Customizing FAQ questions -------------------------
  1133. Really this is just free space for you to type whatever you want. Example:
  1134.  
  1135. <div class="faqn"><i class="fa fa-quote-left"></i> How are you doing today?</div>
  1136. <blockquote>I'm doing fine thank you!!!</blockquote>
  1137.  
  1138. Check out this cheat sheet for html tips --
  1139. http://yukoki.tumblr.com/post/36810349024/cheat-sheet
  1140. ---------------------------------------------------------------------------->
  1141.  
  1142. <div class="faqn"><i class="fa fa-quote-left"></i> How are you doing today?</div>
  1143. <blockquote>I'm doing fine thank you!!!</blockquote>
  1144.  
  1145. </div><!--frqncon-->
  1146. </div><!--faqarea-->
  1147.  
  1148. <div class="askbox">
  1149. <iframe frameborder="0" scrolling="no" width="500" height="190" src="https://www.tumblr.com/ask_form/{text:url}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></div>
  1150. </div><!--contactmain-->
  1151. </div><!--contactpanel-->
  1152. </center>
  1153.  
  1154. <div id="firstmain">
  1155.  
  1156. <div id="intropanel">
  1157. <center>
  1158. <div id="homo">
  1159. <div id="mainmain">
  1160.  
  1161. <div id="cropic">
  1162. <img class="crip" src="{PortraitURL-128}">
  1163. </div><!--cropic-->
  1164.  
  1165. <div id="leftnav">
  1166.  
  1167. <div class="butt"><a href="#int-to-con"><div class="txtbutt"><span class="tbhl">posts</span><div class="tbtri">▼</div></div></a>
  1168. <div class="strikelin"></div>
  1169. <a href="#int-to-con"><div class="buttbg"></div><i class="fa fa-file-text-o"></i></a>
  1170. </div><!--butt-->
  1171.  
  1172. <div class="butt"><span class="first-to-contact"><div class="txtbutt"><span class="tbhl">contact</span><div class="tbtri">▼</div></div></span>
  1173. <div class="strikelin"></div>
  1174. <span class="first-to-contact"><div class="buttbg"></div><i class="fa fa-envelope-o"></i></span>
  1175. </div><!--butt-->
  1176.  
  1177. <div class="butt"><div class="txtbutt"><span class="tbhl">archives</span><div class="tbtri">▼</div></div>
  1178. <div class="strikelin"></div><a href="/archive">
  1179. <div class="buttbg"></div><i class="fa fa-calendar"></i>
  1180. </a></div><!--butt-->
  1181. </div><!--leftnav-->
  1182.  
  1183. <div id="rightnav">
  1184. <div class="butt"><span class="first-to-about"><div class="txtbutt"><span class="tbhl">about</span><div class="tbtri">▼</div></div></span>
  1185. <div class="strikelin2"></div><div class="strikelin"></div>
  1186. <span class="first-to-about"><div class="buttbg"></div><i class="fa fa-user"></i></span>
  1187. </div><!--butt-->
  1188. <div class="butt"><span class="first-to-links"><div class="txtbutt"><span class="tbhl">links</span><div class="tbtri">▼</div></div></span>
  1189. <div class="strikelin"></div><div class="strikelin"></div>
  1190. <span class="first-to-links"><div class="buttbg"></div><i class="fa fa-plus"></i></span>
  1191. </div><!--butt-->
  1192. <div class="butt"><div class="txtbutt"><span class="tbhl">credit</span><div class="tbtri">▼</div></div>
  1193. <a href="http://yukoki.tumblr.com">
  1194. <div class="buttbg"></div><i class="fa fa-pagelines"></i>
  1195. </a></div><!--butt-->
  1196. </div><!--rightnav-->
  1197.  
  1198. <div class="quotabove"><span class="quot">“</span></div>
  1199. <div class="maintitle"><div class="mtabove"></div>{title}<div class="mtbelow"></div></div>
  1200. <div class="quotbelow"><span class="quot">”</span></div>
  1201.  
  1202. <div id="maininfo">
  1203. <div class="leftinfo-desc">{text:introductory text}</div>
  1204. <div class="rightinfo-upd">{text:updates}</div>
  1205. </div><!--maininfo-->
  1206.  
  1207. <div class="jiji">
  1208. <a href="#int-to-con"><i class="fa fa-angle-double-down"></i></a>
  1209. </div><!--jiji-->
  1210.  
  1211. </div><!--mainmain-->
  1212. </div><!--homo-->
  1213. </center>
  1214. </div><!--intropanel-->
  1215.  
  1216.  
  1217. <div id="contentpanel"><center>
  1218.  
  1219. <a name="int-to-con">
  1220. <div id="cpbar">
  1221. <a href="/"><img class="cpicon" src="{PortraitURL-128}"><span class="cptitle">{text:content topbar text}</span></a>
  1222. <div id="cpstickywrap">
  1223. <div id="cprightsidebar">
  1224. <div id="cpnav">
  1225. <span class="first-to-contact"><div class="cpnavi"><div class="cpnbg"></div><div class="cpnic"><i class="fa fa-envelope-o"></div></i></div></span>
  1226. <a href="/archive"><div class="cpnavi" id="cpnavi2"><div class="cpnbg"></div><div class="cpnic" id="cpnic2"><i class="fa fa-calendar"></div></i></div></a>
  1227. <span class="first-to-about"><div class="cpnavi"><div class="cpnbg"></div><div class="cpnic"><i class="fa fa-user"></div></i></div></span>
  1228. <span class="first-to-links"><div class="cpnavi" id="cpnavi2"><div class="cpnbg"></div><div class="cpnic" id="cpnic2"><i class="fa fa-plus"></div></i></div></a></span>
  1229. </div><!--cpleftnav-->
  1230. <img class="cprimg" src="{image:sidebar}">
  1231. <div class="desc">{description}</div>
  1232.  
  1233. <div class="pagi">
  1234. {block:Pagination}
  1235. {block:PreviousPage}
  1236. <a href="{PreviousPage}"><</a>
  1237. {/block:PreviousPage}
  1238. {block:JumpPagination length="4"}
  1239. {block:CurrentPage}
  1240. <span class="current_page">X</span>
  1241. {/block:CurrentPage}
  1242. {block:JumpPage}
  1243. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1244. {/block:JumpPage}
  1245. {/block:JumpPagination}
  1246. {block:NextPage}
  1247. <a href="{NextPage}">></a>
  1248. {/block:NextPage}
  1249. {/block:Pagination}
  1250. </div>
  1251.  
  1252. </div><!--cprightsidebar-->
  1253. </div><!--cpstickywrap-->
  1254. </div><!--sticky cpbar-->
  1255. </a><!--end anchor int-to-con-->
  1256.  
  1257. <div id="content">
  1258. {block:Posts}
  1259. <div class="posts">
  1260.  
  1261. {block:Quote}
  1262. <div class="qpost">
  1263. <div class="quote">{Quote}</div> <div class="qsrc">- {Source} -</div>
  1264. </div>
  1265. {/block:Quote}
  1266.  
  1267. {block:Link}
  1268. <a href="{URL}"><div class="ltitle">
  1269. <div class="ptdecp"><div class="spd1"></div><div class="spd2"></div><div class="spd3"></div></div>{Name} ></div></a>
  1270. {block:Description}<div class="text">{Description}</div>{block:Description}
  1271. {/block:Link}
  1272.  
  1273. {block:Chat}
  1274. {block:Title}
  1275. <div class="ptitle">
  1276. <div class="ptdecp"><div class="spd1"></div><div class="spd2"></div><div class="spd3"></div></div>{Title}</div>
  1277. {/block:Title}
  1278. <div class="ctext">
  1279. {block:Lines}<div class="{Alt}">
  1280. <div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
  1281. {/block:Lines}
  1282. </div>
  1283. {/block:Chat}
  1284.  
  1285. {block:Photo}
  1286. {linkopentag}<center><img class="photo" src="{PhotoURL-500}"></center>{linkclosetag}
  1287. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1288. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1289. <div class="text">{Caption}</div>
  1290. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1291. {/block:Photo}
  1292.  
  1293. {block:Photoset}
  1294. <div class="photo">{Photoset-500}</div>
  1295. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1296. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1297. <div class="text">{Caption}</div>
  1298. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1299.  
  1300. {/block:Photoset}
  1301.  
  1302. {block:Text}
  1303. {block:Title}
  1304. <div class="ptitle">{Title}</div>
  1305. {/block:Title}
  1306. <div class="text">{Body}</div>
  1307. {/block:Text}
  1308.  
  1309. {block:Audio}
  1310. <div class="audiopost">
  1311. <div class="audioinfo">
  1312. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  1313. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  1314. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  1315. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  1316. </div><!--audioinfo-->
  1317. <div class="albumart"><div class="albumno"></div>{block:AlbumArt}<img class="albumartp" src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1318. <div class="audioplayer">{AudioPlayer}</div>
  1319. </div><!--audiopost-->
  1320. {block:indexpage}{block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:indexpage}
  1321. {block:PermalinkPage}{block:Caption}
  1322. <div class="text">{Caption}</div>
  1323. {/block:Caption}{/block:PermalinkPage}
  1324. {/block:Audio}
  1325.  
  1326. {block:Video}
  1327. {Video-500}
  1328. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  1329. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  1330. <div class="text">{Caption}</div>
  1331. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  1332. {/block:Video}
  1333.  
  1334. {block:Answer}
  1335. <img class="askerportrait" src="{AskerPortraitURL-64}">
  1336. <div class="tri">◀</div>
  1337. <div class="a">
  1338. <span class="asker">{Asker} whispered:</span>
  1339. <span class="q">{Question}</span>
  1340. </div>
  1341. <div class="atext">{Answer}</div>
  1342. {/block:Answer}
  1343.  
  1344. {block:indexpage}{block:date}
  1345.  
  1346. <div class="perma">
  1347.  
  1348. <a href="{permalink}">
  1349. <div class="piconcon">
  1350. <div class="ptxtcon"><div class="ptxttri">▲</div><div class="ptxt"><span class="ptx">{NoteCount}</span></div></div>
  1351. <div class="piconbg"></div><div class="picon"><i class="fa fa-book"></i></div></div>
  1352. </a>
  1353.  
  1354. <a href="{permalink}">
  1355. <div class="piconcon">
  1356. <div class="ptxtcon"><div class="ptxttri">▲</div><div class="ptxt"><span class="ptx">{TimeAgo}</span></div></div>
  1357. <div class="piconbg"></div><div class="picon"><i class="fa fa-clock-o"></i></div></div>
  1358. </a>
  1359.  
  1360. <a href="{ReblogURL}">
  1361. <div class="piconcon">
  1362. <div class="ptxtcon"><div class="ptxttri">▲</div><div class="ptxt"><span class="ptx">Reblog</span></div></div>
  1363. <div class="piconbg"></div><div class="picon"><i class="fa fa-retweet"></i></div></div>
  1364. </a>
  1365.  
  1366. </div><!--perma-->
  1367.  
  1368. {/block:date}{/block:indexpage}
  1369.  
  1370. </div><!--posts-->
  1371.  
  1372. {block:permalinkpage}
  1373. {block:date}<div class="permainfo">
  1374. Posted on <b>{DayOfMonth} {Month} {Year}</b>, at <b>{12Hour}.{Minutes}{AmPm}</b>, with <b>{NoteCountWithLabel}</b><br>
  1375. {block:RebloggedFrom}
  1376. Reblogged via <a href="{ReblogParentURL}">{ReblogParentName}</a>, originally by <a href="{ReblogRootURL}">{ReblogRootName}</a><br>
  1377. {/block:RebloggedFrom}
  1378. {block:HasTags}<div class="pitags">{block:Tags}
  1379. <a href="{TagURL}">#{Tag} </a>
  1380. {/block:Tags}</div>{/block:HasTags}
  1381. </div>{/block:date}
  1382. {block:date}{block:NoteCount}<div id="notecon">
  1383. {PostNotes-16}
  1384. </div><!--notecon-->{/block:NoteCount}{/block:date}
  1385. {/block:permalinkpage}
  1386.  
  1387. {/block:Posts}
  1388. {block:ContentSource}
  1389. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1390. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1391. {/block:SourceLogo}
  1392. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1393. {/block:ContentSource}
  1394.  
  1395. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  1396.  
  1397. </div><!--content-->
  1398.  
  1399. </center></div><!--contentpanel-->
  1400.  
  1401. </div><!--firstmain-->
  1402.  
  1403. </body>
  1404. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement