Advertisement
rollyjogered

theme ten: wasteland

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