Advertisement
rollyjogered

theme thirteen: paradise

Jun 18th, 2019 (edited)
3,781
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.98 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!--
  5.  
  6. theme thirteen: paradise by pirateskinned
  7.  
  8. please don't: edit & repost / claim as your own
  9. please don't: delete or move the credit
  10. please don't: steal bits of coding
  11.  
  12. if you need any help, feel free to
  13. message me at pirateskinned.tumblr.com
  14.  
  15. ------
  16.  
  17. image wrapping inspired by iniziare.tumblr.com
  18. tumblr controls styling by cyantists.tumblr.com
  19. icon font by suiomi.com/font
  20.  
  21. -->
  22.  
  23. <title>{Title}</title>
  24.  
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  28.  
  29. <!-- meta tags -->
  30.  
  31. <meta name="image:background" content=""/>
  32. <meta name="image:sidebar" content=""/>
  33.  
  34. <meta name="color:background" content="#ffffff"/>
  35. <meta name="color:container" content="#e7e6e2"/>
  36. <meta name="color:posts" content="#ffffff"/>
  37. <meta name="color:border" content="#f6f6f6"/>
  38. <meta name="color:text" content="#1d1d1d"/>
  39. <meta name="color:link" content="#8a8a68"/>
  40. <meta name="color:accent one" content="#91b0b6"/>
  41. <meta name="color:accent two" content="#dca562"/>
  42. <meta name="color:accent three" content="#a6a77b"/>
  43.  
  44. <meta name="if:background pattern" content="0"/>
  45. <meta name="if:image wrap" content="1"/>
  46. <meta name="if:500px posts" content="0"/>
  47.  
  48. <meta name="text:sidebar title" content="sidebar title" />
  49. <meta name="text:rules" content="<h1>header</h1><p>text area</p>" />
  50. <meta name="text:muses" content='<a href="/"><img src="your url here"></a>' />
  51.  
  52. <!-- scripts -->
  53.  
  54. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css">
  55. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  56.  
  57. <!-- fonts -->
  58.  
  59. <link href="https://fonts.googleapis.com/css?family=ABeeZee:400,400i" rel="stylesheet">
  60. <link href="https://fonts.googleapis.com/css2?family=Sacramento&display=swap" rel="stylesheet">
  61.  
  62. <!-- icon font -- http://suiomi.com/font -->
  63.  
  64. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet">
  65.  
  66. <!-- tooltips -->
  67.  
  68. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  69.  
  70. <script>
  71. (function($){
  72. $(document).ready(function(){
  73. $("a[title]").style_my_tooltips({
  74. tip_follows_cursor:true,
  75. tip_delay_time:30,
  76. tip_fade_speed:300,
  77. attribute:"title"
  78. });
  79. });
  80. })(jQuery);
  81. </script>
  82.  
  83. <!-- photosets -->
  84.  
  85. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  86.  
  87. <script>
  88. $(document).ready(function(){
  89. $('.photo-slideshow').pxuPhotoset({
  90. lightbox: true,
  91. rounded: false,
  92. gutter: '1px',
  93. borderRadius: '0px',
  94. photoset: '.photo-slideshow',
  95. photoWrap: '.photo-data',
  96. photo: '.pxu-photo'
  97. });
  98. });
  99. </script>
  100.  
  101. <!---- tabs ---->
  102.  
  103. <script>
  104. $(document).ready(function() {
  105. $('.nav a').on('click', function(e) {
  106. var currentAttrValue = $(this).attr('href');
  107.  
  108. // Show/Hide Tabs
  109. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().fadeOut();
  110.  
  111. // Change/remove current tab to active
  112. $(this).parent('li').addClass('active').siblings().removeClass('active');
  113.  
  114. e.preventDefault();
  115. });
  116. });
  117. </script>
  118.  
  119. <style type="text/css">
  120.  
  121. /* --- tumblr controls styling by cyantists
  122. http://cyantists.tumblr.com/tumblr_controls/hover --- */
  123.  
  124. iframe.tmblr-iframe {
  125. z-index:99999999999999!important;
  126. top:-2px!important;
  127. right:0!important;
  128. opacity:0;
  129. padding-right:38px;
  130. /* delete invert(1) from here */
  131. filter:invert(1) contrast(150%);
  132. -webkit-filter:invert(1) contrast(150%);
  133. -o-filter:invert(1) contrast(150%);
  134. -moz-filter:invert(1) contrast(150%);
  135. -ms-filter:invert(1) contrast(150%);
  136. /* to here if your blog has a dark background */
  137. transform:scale(0.65);
  138. transform-origin:100% 0;
  139. -webkit-transform:scale(0.65);
  140. -webkit-transform-origin:100% 0;
  141. -o-transform:scale(0.65);
  142. -o-transform-origin:100% 0;
  143. -moz-transform:scale(0.65);
  144. -moz-transform-origin:100% 0;
  145. -ms-transform:scale(0.65);
  146. -ms-transform-origin:100% 0;}
  147.  
  148. iframe.tmblr-iframe:hover {
  149. opacity:0.6!important;}
  150.  
  151. .hcontrols {
  152. position:fixed;
  153. top:0;
  154. right:0;
  155. z-index:999999999;}
  156.  
  157. .hcontrols svg {
  158. width:14px;
  159. height:14px;
  160. padding:9px;}
  161.  
  162. .hcontrols svg path {
  163. fill:#888888;/* change this to change the color of the icon */}
  164.  
  165. /* --- tooltips & scrollbars --- */
  166.  
  167. #s-m-t-tooltip {
  168. position:absolute;
  169. margin-top: 15px;
  170. z-index:9999;
  171. padding:3px 5px;
  172. background:{color:posts};
  173. color:{color:text};
  174. border-radius:3px;
  175. font-size:10px;
  176. -webkit-box-shadow: 0px 0px 5px 0px rgba({RGBcolor:posts},0.5);
  177. -moz-box-shadow: 0px 0px 5px 0px rgba({RGBcolor:posts},0.5);
  178. box-shadow: 0px 0px 5px 0px rgba({RGBcolor:posts},0.5);
  179. }
  180.  
  181. ::-webkit-scrollbar-thumb:vertical {background-color:{color:accent one};}
  182. ::-webkit-scrollbar-button:horizontal {background-color:{color:accent one};}
  183. ::-webkit-scrollbar {background-color:transparent; width:1px;}
  184.  
  185. /* --- basics --- */
  186.  
  187. body {
  188. background-color:{color:background};
  189. background-image:url('{image:background}');
  190. background-attachment:fixed;
  191. background-position:center center;
  192. {block:ifnotbackgroundpattern}
  193. background-repeat:no-repeat;
  194. background-size:cover;
  195. {/block:ifnotbackgroundpattern}
  196. {block:ifbackgroundpattern}
  197. background-repeat:repeat;
  198. background-size:auto;
  199. {/block:ifbackgroundpattern}
  200. color:{color:text};
  201. font-family: 'ABeeZee', sans-serif;
  202. font-size:10px;
  203. line-height:15px;
  204. font-weight:300;
  205. text-align:justify;
  206. margin:0;
  207. }
  208.  
  209. a {
  210. color:{color:text};
  211. text-decoration:none;
  212. -moz-transition-duration: 0.5s;
  213. -o-transition-duration: 0.5s;
  214. -webkit-transition-duration: 0.5s;
  215. transition-duration: 0.5s;
  216. }
  217.  
  218. a:hover {
  219. color:{color:text};
  220. text-decoration:none;
  221. }
  222.  
  223. p a, .description a {box-shadow:{color:link} 0px -2px 0px inset;}
  224. p a:hover, .description a:hover {box-shadow:{color:link} 0px -17px 0px inset;}
  225.  
  226. img {
  227. border:none;
  228. text-decoration:none;
  229. }
  230.  
  231. b, strong, bold {
  232. color:{color:accent one};
  233. font-weight:700;
  234. }
  235.  
  236. i, em, italic {
  237. color:{color:accent two};
  238. }
  239.  
  240. u {
  241. text-decoration:none;
  242. }
  243.  
  244. .firstletter, u {
  245. display:block;
  246. float:left;
  247. padding:12px 14px;
  248. background:{color:accent one};
  249. color:{color:posts};
  250. font-weight:700;
  251. text-transform:uppercase;
  252. font-size:14px;
  253. margin:0px 10px 0px 0px;
  254. }
  255.  
  256. s, strike {
  257. text-decoration-color:{color:accent three};
  258. }
  259.  
  260. small, sub, sup, big {
  261. font-size:10px;
  262. line-height:14px;
  263. vertical-align:baseline;
  264. }
  265.  
  266. blockquote {
  267. padding:0px 5px 0px 15px;
  268. border-left:1px solid {color:border};
  269. margin-left:5px;
  270. margin-right:0px;
  271. }
  272.  
  273. blockquote img {
  274. max-width:360px;
  275. height:auto;
  276. }
  277.  
  278. blockquote blockquote {
  279. margin-right:0px;
  280. }
  281.  
  282. blockquote blockquote img {
  283. max-width:350px;
  284. height:auto;
  285. margin-top:10px;
  286. }
  287.  
  288. pre {
  289. font-family: 'ABeeZee', sans-serif;
  290. font-size:10px;
  291. text-transform:uppercase;
  292. font-weight:700;
  293. padding:10px;
  294. background-color:{color:accent three};
  295. color:{color:posts};
  296. border-radius:3px;
  297. }
  298.  
  299. pre i, pre em, pre b, pre strong, pre a {
  300. color:{color:posts};
  301. }
  302.  
  303. ul {
  304. padding-left:15px;
  305. }
  306.  
  307. ul li {
  308. list-style-type:none;
  309. }
  310.  
  311. ul li:before {
  312. content: "— ";
  313. text-indent: -5px;
  314. }
  315.  
  316. /* --- header styles --- */
  317.  
  318. h1 {
  319. margin:0px;
  320. font-weight:bold;
  321. color:{color:accent one};
  322. text-align:left;
  323. }
  324.  
  325. h2 {
  326. font-weight:normal;
  327. color:{color:accent three};
  328. text-align:left;
  329. text-transform:uppercase;
  330. font-size:12px;
  331. }
  332.  
  333. h2 b, b h2, h2 i, i h2,
  334. h2 strong, strong h2, h2 em, em h2 {
  335. color:{color:accent three};
  336. }
  337.  
  338. h3 {
  339. font-weight:bold;
  340. color:{color:accent two};
  341. text-align:center;
  342. text-transform:uppercase;
  343. font-size:12px;
  344. letter-spacing:1px;
  345. padding-bottom:2px;
  346. border-bottom:1px solid {color:border};
  347. }
  348.  
  349. /* --- container --- */
  350.  
  351. .container {
  352. position:absolute;
  353. margin-top:-325px;
  354. top:50%;
  355. left:50%;
  356. {block:ifnot500pxposts}
  357. margin-left:-500px;
  358. width:1000px;
  359. {/block:ifnot500pxposts}
  360. {block:if500pxposts}
  361. margin-left:-550px;
  362. width:1100px;
  363. {/block:if500pxposts}
  364. height:650px;
  365. border-radius:3px;
  366. overflow:hidden;
  367. background-color:{color:container};
  368. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  369. }
  370.  
  371. .container-accent {
  372. position:absolute;
  373. z-index:1;
  374. bottom:0px;
  375. left:0px;
  376. width:100%;
  377. height:37%;
  378. background-color:{color:accent two};
  379. }
  380.  
  381. /* --- topbar --- */
  382.  
  383. .topbar {
  384. position:absolute;
  385. z-index:999;
  386. top:0px;
  387. left:0px;
  388. width:100%;
  389. height:40px;
  390. background-color:{color:posts};
  391. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  392. }
  393.  
  394. .small-title {
  395. position:absolute;
  396. top:0px;
  397. left:460px;
  398. width:540px;
  399. height:40px;
  400. background-color:{color:posts};
  401. box-sizing:border-box;
  402. padding:0px;
  403. line-height:40px;
  404. text-transform:uppercase;
  405. letter-spacing:0.5px;
  406. font-weight:bold;
  407. text-align:center;
  408. }
  409.  
  410. /* --- navigation --- */
  411.  
  412. .nav {
  413. position:absolute;
  414. left:0px;
  415. top:0px;
  416. width:460px;
  417. height:40px;
  418. box-sizing:border-box;
  419. background-color:{color:posts};
  420. }
  421.  
  422. .nav a {
  423. display:inline-block;
  424. float:left;
  425. width:115px;
  426. height:40px;
  427. line-height:20px;
  428. box-sizing:border-box;
  429. text-align:center;
  430. margin:0px;
  431. color:{color:accent three};
  432. line-height:40px;
  433. font-weight:700;
  434. letter-spacing:0.5px;
  435. text-transform:uppercase;
  436. }
  437.  
  438. .nav a:hover {
  439. background-color:{color:border};
  440. }
  441.  
  442. /* --- sidebar --- */
  443.  
  444. .sidebar {
  445. position:absolute;
  446. z-index:100;
  447. top:40px;
  448. left:0px;
  449. width:460px;
  450. height:610px;
  451. background-image:url('{image:sidebar}');
  452. background-repeat:no-repeat;
  453. background-size:cover;
  454. background-position:center center;
  455. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  456. }
  457.  
  458. /* --- tabs --- */
  459.  
  460. .tab-home {
  461. opacity:0;
  462. -webkit-transition-duration: 0.6s;
  463. transition-duration: 0.6s;
  464. }
  465.  
  466. .sidebar:hover .tab-home {
  467. opacity:1;
  468. }
  469.  
  470. .tab-ask, .tab-rules, .tab-muses {
  471. display:none;
  472. }
  473.  
  474. /* --- home tab --- */
  475.  
  476. /* --- title --- */
  477.  
  478. .desc-title {
  479. position:absolute;
  480. z-index:300;
  481. left:115px;
  482. top:120px;
  483. width:230px;
  484. height:auto;
  485. text-align:center;
  486. font-size:50px;
  487. font-family: 'Sacramento', cursive;
  488. color:{color:accent one};
  489. text-shadow:1px 1px {color:posts};
  490. }
  491.  
  492. .desc-title a {
  493. color:{color:accent one};
  494. }
  495.  
  496. /* --- description --- */
  497.  
  498. .description {
  499. position:absolute;
  500. z-index:150;
  501. left:120px;
  502. top:145px;
  503. width:220px;
  504. height:260px;
  505. padding:20px;
  506. box-sizing:border-box;
  507. font-size:10px;
  508. line-height:18px;
  509. overflow-x:hidden;
  510. overflow-y:auto;
  511. background-color:{color:posts};
  512. border-radius:3px;
  513. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  514. text-align:center;
  515. }
  516.  
  517. /* --- ask tab --- */
  518.  
  519. .ask-title {
  520. position:absolute;
  521. z-index:300;
  522. left:115px;
  523. top:95px;
  524. width:230px;
  525. height:auto;
  526. text-align:center;
  527. font-size:50px;
  528. font-family: 'Sacramento', cursive;
  529. color:{color:accent one};
  530. text-shadow:1px 1px {color:posts};
  531. }
  532.  
  533. .askbox {
  534. margin-top:120px;
  535. margin-left:12%;
  536. }
  537.  
  538. /* --- rules tab --- */
  539.  
  540. .rules-title {
  541. position:absolute;
  542. z-index:300;
  543. left:115px;
  544. top:80px;
  545. width:230px;
  546. height:auto;
  547. text-align:center;
  548. font-size:50px;
  549. font-family: 'Sacramento', cursive;
  550. color:{color:accent one};
  551. text-shadow:1px 1px {color:posts};
  552. }
  553.  
  554. .rules {
  555. position:absolute;
  556. z-index:150;
  557. left:55px;
  558. top:100px;
  559. width:350px;
  560. height:400px;
  561. padding:10px;
  562. box-sizing:border-box;
  563. font-size:10px;
  564. line-height:18px;
  565. overflow-x:hidden;
  566. overflow-y:auto;
  567. background-color:{color:posts};
  568. border:10px solid {color:posts};
  569. border-radius:3px;
  570. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  571. }
  572.  
  573. .rules h1 {
  574. width:100%;
  575. text-align:center;
  576. background-color:{color:accent three};
  577. color:{color:posts};
  578. padding:5px;
  579. box-sizing:border-box;
  580. text-transform:uppercase;
  581. font-size:10px;
  582. }
  583.  
  584. .rules img {
  585. {block:ifimagewrap}
  586. float:left;
  587. width:90px;
  588. height:90px;
  589. border-radius:3px;
  590. margin-right:10px;
  591. {/block:ifimagewrap}
  592. }
  593.  
  594. .rules blockquote img {
  595. {block:ifimagewrap}
  596. float:right;
  597. margin-left:10px;
  598. margin-right:0px;
  599. {/block:ifimagewrap}
  600. }
  601.  
  602. /* --- muses tab --- */
  603.  
  604. .muses-title {
  605. position:absolute;
  606. z-index:300;
  607. left:115px;
  608. top:80px;
  609. width:230px;
  610. height:auto;
  611. text-align:center;
  612. font-size:50px;
  613. font-family: 'Sacramento', cursive;
  614. color:{color:accent one};
  615. text-shadow:1px 1px {color:posts};
  616. }
  617.  
  618. .muses {
  619. position:absolute;
  620. z-index:150;
  621. left:71px;
  622. top:100px;
  623. width:317px;
  624. height:410px;
  625. padding:10px;
  626. box-sizing:border-box;
  627. font-size:10px;
  628. line-height:18px;
  629. overflow-x:hidden;
  630. overflow-y:auto;
  631. background-color:{color:posts};
  632. border:10px solid {color:posts};
  633. border-radius:3px;
  634. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  635. }
  636.  
  637. .muses img {
  638. float:left;
  639. width:90px;
  640. height:90px;
  641. border-radius:3px;
  642. margin:1px;
  643. }
  644.  
  645. .muses img:hover {
  646. -webkit-filter: grayscale(100%);
  647. filter: grayscale(100%);
  648. }
  649.  
  650. /* --- pagination --- */
  651.  
  652. .pagination {
  653. position:absolute;
  654. z-index:200;
  655. left:0px;
  656. bottom:0px;
  657. width:460px;
  658. height:40px;
  659. z-index:999;
  660. padding:0px 10px 0px 10px!important;
  661. background-color:{color:posts};
  662. box-sizing:border-box;
  663. }
  664.  
  665. .pagination a {
  666. display:inline-block;
  667. width:auto;
  668. height:40px;
  669. color:{color:text};
  670. line-height:40px;
  671. font-weight:700;
  672. letter-spacing:0.5px;
  673. text-transform:uppercase;
  674. background-color:{color:posts};
  675. }
  676.  
  677. .pagination .prev {
  678. position:absolute;
  679. z-index:200;
  680. left:10px;
  681. text-align:left;
  682. padding-right:10px;
  683. }
  684.  
  685. .pagination .next {
  686. position:absolute;
  687. z-index:200;
  688. right:10px;
  689. text-align:right;
  690. padding-left:10px;
  691. }
  692.  
  693. .pagi-line {
  694. position:absolute;
  695. z-index:100;
  696. left:10px;
  697. bottom:20px;
  698. height:1px;
  699. width:440px;
  700. background-color:{color:text};
  701. }
  702.  
  703. /* --- entries --- */
  704.  
  705. .entries {
  706. position:absolute;
  707. z-index:3;
  708. top:40px;
  709. right:5px;
  710. {block:ifnot500pxposts}
  711. width:535px;
  712. {/block:ifnot500pxposts}
  713. {block:if500pxposts}
  714. width:635px;
  715. {/block:if500pxposts}
  716. height:610px;
  717. overflow-x:hidden;
  718. overflow-y:auto;
  719. background-color:transparent;
  720. box-sizing:border-box;
  721. padding:40px 30px 20px 50px;
  722. }
  723.  
  724. /* --- posts --- */
  725.  
  726. .post {
  727. {block:ifnot500pxposts}
  728. width:400px;
  729. {/block:ifnot500pxposts}
  730. {block:if500pxposts}
  731. width:500px;
  732. {/block:if500pxposts}
  733. padding:20px;
  734. overflow:hidden;
  735. {block:IndexPage}
  736. margin-bottom:40px;
  737. {/block:IndexPage}
  738. {block:PermalinkPage}
  739. margin-bottom:20px;
  740. {/block:PermalinkPage}
  741. background-color:{color:posts};
  742. border-radius:3px;
  743. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  744. }
  745.  
  746. .post img {
  747. max-width:100%;
  748. height:auto;
  749. }
  750.  
  751. /* --- texts --- */
  752.  
  753. .title {
  754. font-weight:500;
  755. font-size:22px;
  756. line-height:24px;
  757. color:{color:accent three};
  758. text-align:left;
  759. }
  760.  
  761. .title a {
  762. color:{color:accent three};
  763. }
  764.  
  765. .more a {
  766. font-size:18px;
  767. color:{color:accent three};
  768. }
  769.  
  770. .txt {
  771. margin-bottom:20px;
  772. }
  773.  
  774. .txt img {
  775. max-width:200px;
  776. border-radius:3px;
  777. {block:ifimagewrap}
  778. float:left;
  779. margin-right:10px;
  780. {/block:ifimagewrap}
  781. }
  782.  
  783. .txt blockquote img {
  784. {block:ifimagewrap}
  785. float:right;
  786. margin-left:10px;
  787. margin-right:0px;
  788. {/block:ifimagewrap}
  789. }
  790.  
  791. .txt blockquote blockquote img {
  792. {block:ifimagewrap}
  793. float:left;
  794. margin-left:0px;
  795. margin-right:10px;
  796. margin-top:0px;
  797. {/block:ifimagewrap}
  798. }
  799.  
  800. /* --- photos --- */
  801.  
  802. .photo {
  803. margin:-20px -20px 0px -20px;
  804. }
  805.  
  806. .photo-slideshow {
  807. margin:-20px -20px 0px -20px;
  808. }
  809.  
  810. .photo-slideshow img {
  811. border-radius:0px;
  812. }
  813.  
  814. /* --- quotes --- */
  815.  
  816. .quote {
  817. text-align:left;
  818. font-size:18px;
  819. line-height:25px;
  820. font-weight:500;
  821. }
  822.  
  823. .source {
  824. margin-top:4px;
  825. text-align:right;
  826. }
  827.  
  828. /* --- audio --- */
  829.  
  830. .audio {
  831. float:left;
  832. width:70px;
  833. height:70px;
  834. position:relative;
  835. overflow:hidden;
  836. }
  837.  
  838. .audio:hover .play {opacity:1;width:30px;}
  839. .audio:hover img {margin-left:30px;}
  840.  
  841. .cover img {
  842. width:70px;
  843. position:absolute;
  844. transition:0.5s ease;
  845. -o-transition:0.5s ease;
  846. -moz-transition:0.5s ease;
  847. -webkit-transition:0.5s ease;
  848. }
  849.  
  850. .play {
  851. overflow:hidden;
  852. width:0px;
  853. height:30px;
  854. background:{color:posts};
  855. position:absolute;
  856. padding:20px 0px;
  857. transition:0.5s ease;
  858. -o-transition:0.5s ease;
  859. -moz-transition:0.5s ease;
  860. -webkit-transition:0.5s ease;
  861. }
  862.  
  863. .au b {
  864. color:{color:accent one};
  865. font-weight:700;
  866. margin-right:2px;
  867. }
  868.  
  869. .au {
  870. height:45px;
  871. overflow:hidden;
  872. padding:12px 10px;
  873. line-height:15px;
  874. margin-left:70px;
  875. text-align:left;
  876. }
  877.  
  878. /* --- asks --- */
  879.  
  880. .question {
  881. margin:0px 0px 10px 0px;
  882. border-radius:3px;
  883. padding:20px;
  884. background-color:{color:container};
  885. }
  886.  
  887. .asker {
  888. float:left;
  889. margin-right:2px;
  890. color:{color:accent one};
  891. font-weight:700;
  892. text-transform:lowercase;
  893. }
  894.  
  895. /* --- chat --- */
  896.  
  897. .chat ul {
  898. list-style-type:none;
  899. padding-left:0px;
  900. margin-bottom:20px;
  901. }
  902.  
  903. .chat ul li:before {
  904. content: none;
  905. text-indent: 0px;
  906. }
  907.  
  908. .chat ul li {
  909. margin-bottom:5px;
  910. }
  911.  
  912. .chat .label {
  913. text-transform:uppercase;
  914. font-weight:700;
  915. color:{color:accent one};
  916. }
  917.  
  918. /* --- permalinks --- */
  919.  
  920. .permalink {
  921. font-weight:700;
  922. margin:0px -20px -20px -20px;
  923. padding:10px;
  924. font-size:8px;
  925. letter-spacing:0px;
  926. text-transform:uppercase;
  927. background-color:{color:border};
  928. border-radius:0px 0px 3px 3px;
  929. color:{color:text};
  930. font-family: 'ABeeZee', sans-serif;
  931. }
  932.  
  933. .permalink a {
  934. display:inline-block;
  935. color:{color:text};
  936. }
  937.  
  938. .reb {
  939. display:inline-block;
  940. vertical-align:middle;
  941. float:right;
  942. font-size:10px;
  943. }
  944.  
  945. .reb i {
  946. color:{color:text};
  947. }
  948.  
  949. /* --- tags --- */
  950.  
  951. .tags {
  952. margin-top:0px;
  953. -webkit-transition-duration: 0.6s;
  954. transition-duration: 0.6s;
  955. text-align:justify;
  956. font-weight:400;
  957. }
  958.  
  959. .tags a {
  960. display:inline;
  961. text-transform:none;
  962. line-height:14px;
  963. padding-bottom:1px;
  964. margin:2px 4px 0px 0px;
  965. color:{color:text};
  966. border-bottom:1px solid transparent;
  967. font-weight:normal;
  968. }
  969.  
  970. .tags a:hover {
  971. border-bottom:1px solid {color:text};
  972. }
  973.  
  974. /* --- notes --- */
  975.  
  976. .pagenotes {
  977. {block:IndexPage}
  978. display: none!important;
  979. {/block:IndexPage}
  980. {block:ifnot500pxposts}
  981. width:400px;
  982. {/block:ifnot500pxposts}
  983. {block:if500pxposts}
  984. width:500px;
  985. {/block:if500pxposts}
  986. text-align:left;
  987. background-color:{color:posts};
  988. padding:20px;
  989. margin-bottom:20px;
  990. border-radius:3px;
  991. box-shadow:rgba(0,0,0,.05) 1px 1px 3px;
  992. }
  993.  
  994. .pagenotes img {
  995. display:none;
  996. }
  997.  
  998. .pagenotes a {
  999. color:{color:accent three};
  1000. font-weight:bold;
  1001. }
  1002.  
  1003. .pagenotes ol {
  1004. list-style-type:none;
  1005. margin:0px;
  1006. padding:0px;
  1007. }
  1008.  
  1009. .pagenotes ol li {
  1010. margin:5px;
  1011. }
  1012.  
  1013. /* --- credit --- */
  1014.  
  1015. .credit a {
  1016. position:fixed;
  1017. font-size:14px;
  1018. right:10px;
  1019. bottom:10px;
  1020. text-align:center;
  1021. width:15px;
  1022. height:15px;
  1023. line-height:15px;
  1024. color:{color:accent one};
  1025. }
  1026.  
  1027.  
  1028. {CustomCSS}
  1029.  
  1030. </style>
  1031. </head>
  1032. <body>
  1033.  
  1034. <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M106.6,134c14.3,0,26-11.7,26-26s-11.7-26-26-26s-26,11.7-26,26S92.2,134,106.6,134z M106.6,94c7.7,0,14,6.3,14,14s-6.3,14-14,14s-14-6.3-14-14S98.9,94,106.6,94z M40.4,124.6l7.2,3.3c3,1.4,4.4,4.8,3.3,7.9l-2.8,7.4c-2.1,5.7-1.4,11.8,2.1,16.7c3.4,5,9,7.9,15,7.9c2.2,0,4.4-0.4,6.5-1.2l7.4-2.8c0.7-0.3,1.4-0.4,2.2-0.4c2.4,0,4.7,1.4,5.7,3.7l3.3,7.2c3,6.6,9.4,10.7,16.6,10.7s13.6-4.1,16.6-10.7l3.3-7.2c1-2.2,3.2-3.7,5.7-3.7c0.7,0,1.5,0.1,2.2,0.4l7.4,2.8c2.1,0.8,4.3,1.2,6.5,1.2c0,0,0,0,0,0c5.9,0,11.5-3,15-7.9c3.4-5,4.2-11.1,2.1-16.7l-2.8-7.4c-1.1-3.1,0.3-6.5,3.3-7.9l7.2-3.3c6.6-3,10.7-9.4,10.7-16.6s-4.1-13.6-10.7-16.6l-7.2-3.3c-3-1.4-4.4-4.8-3.3-7.9l2.8-7.4c2.1-5.7,1.4-11.8-2.1-16.7c-3.4-5-9-7.9-15-7.9c-2.2,0-4.4,0.4-6.5,1.2l-7.4,2.8c-0.7,0.3-1.4,0.4-2.2,0.4c-2.4,0-4.7-1.4-5.7-3.7l-3.3-7.2c-3-6.6-9.4-10.7-16.6-10.7S93,35.2,90,41.8l-3.3,7.2c-1,2.2-3.2,3.7-5.7,3.7c-0.7,0-1.5-0.1-2.2-0.4l-7.4-2.8c-2.1-0.8-4.3-1.2-6.5-1.2c-5.9,0-11.5,3-15,7.9c-3.4,5-4.2,11.1-2.1,16.7l2.8,7.4c1.1,3.1-0.3,6.5-3.3,7.9l-7.2,3.3c-6.6,3-10.7,9.4-10.7,16.6S33.8,121.6,40.4,124.6z M45.3,102.3l7.2-3.3c8.7-4,12.9-14.1,9.5-23l-2.8-7.4c-1-2.7,0-4.7,0.7-5.7c1.6-2.4,4.6-3.4,7.4-2.3l7.4,2.8c2.1,0.8,4.2,1.2,6.4,1.2c0,0,0,0,0,0c7.1,0,13.6-4.2,16.6-10.7l3.3-7.2c1.5-3.4,4.7-3.7,5.7-3.7s4.1,0.3,5.7,3.7l3.3,7.2c3,6.5,9.5,10.7,16.6,10.7c2.2,0,4.3-0.4,6.4-1.2l7.4-2.8c2.8-1,5.7,0,7.4,2.3c0.7,1,1.7,3,0.7,5.7l-2.8,7.4c-3.3,8.9,0.8,19,9.5,23l7.2,3.3c3.4,1.5,3.7,4.7,3.7,5.7s-0.3,4.1-3.7,5.7l-7.2,3.3c-8.7,4-12.9,14.1-9.5,23l2.8,7.4c1,2.7,0,4.7-0.7,5.7c-1.6,2.4-4.6,3.4-7.4,2.3l-7.4-2.8c-2.1-0.8-4.2-1.2-6.4-1.2c-7.1,0-13.6,4.2-16.6,10.7l-3.3,7.2c-1.5,3.4-4.7,3.7-5.7,3.7s-4.1-0.3-5.7-3.7l-3.3-7.2c-3-6.5-9.5-10.7-16.6-10.7c-2.2,0-4.3,0.4-6.4,1.2l-7.4,2.8c-2.8,1-5.7,0-7.4-2.3c-0.7-1-1.7-3-0.7-5.7l2.8-7.4c3.3-8.9-0.8-19-9.5-23l-7.2-3.3c-3.4-1.5-3.7-4.7-3.7-5.7S41.9,103.9,45.3,102.3z"/></svg></div>
  1035.  
  1036.  
  1037. <div class="container">
  1038.  
  1039. <div class="container-accent"></div>
  1040.  
  1041. <!-- topbar with title and links -->
  1042.  
  1043. <div class="topbar">
  1044. <div class="nav">
  1045. <a href="#tab1">
  1046. home
  1047. </a>
  1048. <a href="#tab2">
  1049. message
  1050. </a>
  1051. <a href="#tab3">
  1052. guidelines
  1053. </a>
  1054. <a href="#tab4">
  1055. muses
  1056. </a>
  1057. </div>
  1058.  
  1059. <div class="small-title">
  1060. <a href="/">
  1061. {Title}
  1062. </a>
  1063. </div>
  1064. </div>
  1065.  
  1066. <!-- sidebar image with pagination and description -->
  1067.  
  1068. <div class="sidebar">
  1069.  
  1070. <div class="tabs">
  1071.  
  1072. <!---- start of home tab ---->
  1073.  
  1074. <div id="tab1" class="tab tab-home active">
  1075.  
  1076. <div class="desc-title"><a href="/">{text:sidebar title}</a></div>
  1077. <div class="description">{Description}</div>
  1078.  
  1079. </div>
  1080.  
  1081. <!---- start of ask tab ---->
  1082.  
  1083. <div id="tab2" class="tab tab-ask">
  1084. <div class="ask-title">message</div>
  1085.  
  1086. <div class="askbox">
  1087. <iframe frameborder="0" scrolling="no" width="85%" height="195" src="https://www.tumblr.com/ask_form/{name}.tumblr.com" style="background-color:transparent; overflow:hidden; height:260px;" id="ask_form"></iframe>
  1088. </div>
  1089. </div>
  1090.  
  1091. <!---- start of rules tab ---->
  1092.  
  1093. <div id="tab3" class="tab tab-rules">
  1094. <div class="rules-title">guidelines</div>
  1095. <div class="rules">
  1096. {text:rules}
  1097. </div>
  1098. </div>
  1099.  
  1100. <!---- start of muses tab ---->
  1101.  
  1102. <div id="tab4" class="tab tab-muses">
  1103. <div class="muses-title">muses</div>
  1104.  
  1105. <div class="muses">
  1106. {text:muses}
  1107. </div>
  1108. </div>
  1109.  
  1110. </div> <!--- close of tabs --->
  1111.  
  1112. {block:Pagination}
  1113. <div class="pagination">
  1114. <div class="pagi-line"></div>
  1115. {block:PreviousPage}
  1116. <a href="{PreviousPage}" class="prev">
  1117. previous
  1118. </a>
  1119. {/block:PreviousPage}
  1120.  
  1121. {block:NextPage}
  1122. <a href="{NextPage}" class="next">
  1123. next
  1124. </a>
  1125. {/block:NextPage}
  1126. </div>
  1127. {/block:Pagination}
  1128.  
  1129. </div>
  1130.  
  1131. <!-- start of posts -->
  1132.  
  1133. <div class="entries">
  1134.  
  1135. {block:Posts}
  1136. <div class="post" id="{PostID}">
  1137.  
  1138.  
  1139. {block:Quote}
  1140. <div class="txt">
  1141. <div class="quote">{Quote}</div>
  1142. {block:Source}
  1143. <div class="source"><p>&mdash; {Source}</p></div>
  1144. {/block:Source}
  1145. </div>
  1146. {/block:Quote}
  1147.  
  1148.  
  1149. {block:Text}
  1150. <div class="txt">
  1151. {block:Title}
  1152. <div class="title">{Title}</div>
  1153. {/block:Title}
  1154.  
  1155. {Body}
  1156.  
  1157. {block:More}
  1158. <div class="more">
  1159. <a href="{Permalink}">continue reading...</a>
  1160. </div>
  1161. {/block:More}
  1162. </div>
  1163. {/block:Text}
  1164.  
  1165. {block:Link}
  1166. <div class="txt">
  1167. <div class="title">
  1168. <a href="{URL}">{Name}</a>
  1169. </div>
  1170.  
  1171. {block:Description}{Description}{/block:Description}
  1172. </div>
  1173. {/block:Link}
  1174.  
  1175. {block:Chat}
  1176. {block:Title}
  1177. <div class="title">{Title}</div>
  1178. {/block:Title}
  1179.  
  1180. <div class="chat">
  1181. <ul>
  1182. {block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label}
  1183. {Line}</li>{/block:Lines}
  1184. </ul>
  1185. </div>
  1186. {/block:Chat}
  1187.  
  1188. {block:Photo}
  1189. <div class="photo">
  1190. <img src="{PhotoURL-1280}" alt="{PhotoAlt}">
  1191. </div>
  1192. {block:Caption}
  1193. <div class="txt">
  1194. {Caption}
  1195.  
  1196. {block:More}
  1197. <div class="more">
  1198. <a href="{Permalink}">continue reading...</a>
  1199. </div>
  1200. {/block:More}
  1201. </div>
  1202. {/block:Caption}
  1203. {/block:Photo}
  1204.  
  1205. {block:Photoset}
  1206. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1207. {block:Photos}
  1208. <div class="photo-data">
  1209. <div class="pxu-photo">
  1210. <img src="{PhotoURL-1280}" width="{PhotoWidth-1280}" height="{PhotoHeight-1280}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1211. </div>
  1212.  
  1213. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1214. </div>
  1215. {/block:Photos}
  1216. </div>
  1217. {block:Caption}
  1218. <div class="txt">
  1219. {Caption}
  1220.  
  1221. {block:More}
  1222. <div class="more">
  1223. <a href="{Permalink}">continue reading...</a>
  1224. </div>
  1225. {/block:More}
  1226. </div>
  1227. {/block:Caption}
  1228. {/block:Photoset}
  1229.  
  1230. {block:Video}
  1231. <div class="photo">{Video-500}</div>
  1232. {block:Caption}<div class="txt">{Caption}</div>{/block:Caption}
  1233. {/block:Video}
  1234.  
  1235. {block:Audio}
  1236. <div class="txt">
  1237. <div class="audio">
  1238. {block:AlbumArt}
  1239. <div class="cover">
  1240. <img src="{AlbumArtURL}">
  1241. </div>
  1242. {/block:AlbumArt}
  1243.  
  1244. {block:AudioPlayer}
  1245. <div class="play">{AudioPlayerWhite}</div>
  1246. {/block:AudioPlayer}
  1247. </div>
  1248.  
  1249. <div class="au">
  1250. {block:TrackName}<b>Track:</b> {block:TrackName}{TrackName}<br>{/block:TrackName}
  1251. {block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist}
  1252. <b>Plays:</b> {FormattedPlayCount}
  1253. </div>
  1254.  
  1255. {block:Caption}{Caption}{/block:Caption}
  1256. </div>
  1257. {/block:Audio}
  1258.  
  1259. {block:Answer}
  1260. <div class="txt">
  1261. <div class="question">
  1262. <div class="asker">{Asker}</div> said, &ldquo;{Question}&rdquo;
  1263. </div>
  1264. {Answer}
  1265. </div>
  1266. {/block:Answer}
  1267.  
  1268.  
  1269. {block:Date}
  1270. <div style="clear:both;"></div>
  1271.  
  1272. <div class="permalink">
  1273. <a href="{Permalink}">
  1274. posted {TimeAgo}{block:NoteCount} with {NoteCountWithLabel}{/block:NoteCount}
  1275. </a>
  1276.  
  1277. <a class="reb" href="{ReblogURL}">
  1278. <span class="sf sf-reblog"></span>
  1279. </a>
  1280.  
  1281. {block:PermalinkPage}
  1282. {block:RebloggedFrom}
  1283. <br>
  1284. via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1285. &nbsp;
  1286. {/block:RebloggedFrom}
  1287.  
  1288. {block:ContentSource}
  1289. source: <a href="{SourceURL}">{SourceTitle}</a>
  1290. {/block:ContentSource}
  1291. {/block:PermalinkPage}
  1292.  
  1293. <br>
  1294.  
  1295. {block:HasTags}
  1296. <div class="tags">
  1297. {block:Tags} <a href="{TagURL}">#{Tag}</a>{/block:Tags}
  1298. </div>
  1299. {/block:HasTags}
  1300. </div>
  1301. {/block:Date}
  1302.  
  1303.  
  1304. </div> <!-- end of .post -->
  1305.  
  1306.  
  1307. {block:PostNotes}
  1308. <div class="pagenotes">
  1309. {PostNotes}
  1310. </div>
  1311. {/block:PostNotes}
  1312.  
  1313.  
  1314. {/block:Posts}
  1315.  
  1316. </div> <!-- end of .entries -->
  1317.  
  1318. </div> <!-- end of .container -->
  1319.  
  1320. <div class="credit"><a class="sf sf-boat" href="http://pirateskinned.tumblr.com/" title="coded by pirateskinned"></a></div>
  1321.  
  1322. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement