API tools faq
paste
the49thname

Theme 08: King and Lionheart

the49thname
Aug 26th, 2016
6,089
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.45 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <head>
  4.  
  5. <!-- theme 08: king and lionheart / version 1.3 (edited 03/09/19)
  6.  
  7. themes by ro (the49thname) / the49ththeme.tumblr.com
  8. tumblr controls fix by cyantists @ tumblr
  9. don't remove the credit, use as a base code, or claim as your own work.
  10. edit as much as you want, and feel free to send me any queries/problems.
  11.  
  12. -->
  13.  
  14. <html xlmns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  15.  
  16. <title>{Title}</title>
  17.  
  18. <link rel="shortcut icon" href="{Favicon}">
  19.  
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21.  
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <!-- colour options -->
  25.  
  26. <meta name="color:bold" content="#000"/>
  27. <meta name="color:italic" content="#ccc"/>
  28. <meta name="color:underline" content="#888"/>
  29. <meta name="color:background" content="#eee"/>
  30. <meta name="color:scrollbar" content="#ff8f8f"/>
  31. <meta name="color:text" content="#888"/>
  32. <meta name="color:navbar bg" content="#666"/>
  33. <meta name="color:title" content="#ffabab"/>
  34. <meta name="color:nav links" content="#fff"/>
  35. <meta name="color:nav links hover" content="#ffabab"/>
  36. <meta name="color:header desc bg" content="#fff"/>
  37. <meta name="color:quotation marks" content="#ffabab"/>
  38. <meta name="color:header scroll arrow" content="#666"/>
  39. <meta name="color:sidebar desc bg" content="#fff"/>
  40. <meta name="color:link" content="#ffc7c7"/>
  41. <meta name="color:link hover" content="#888"/>
  42. <meta name="color:perma link" content="#fff"/>
  43. <meta name="color:perma link hover" content="#ffabab"/>
  44. <meta name="color:perma link bg" content="#666"/>
  45. <meta name="color:tags" content="#fff"/>
  46. <meta name="color:tags hover" content="#ffabab"/>
  47. <meta name="color:border" content="#ccc"/>
  48. <meta name="color:h1 text" content="#fff"/>
  49. <meta name="color:h1 bg" content="#666"/>
  50. <meta name="color:ask text" content="#fff"/>
  51. <meta name="color:ask bg" content="#666"/>
  52. <meta name="color:reply bg" content="#f6f6f6"/>
  53. <meta name="color:tooltip text" content="#fff"/>
  54. <meta name="color:tooltip bg" content="#ff8f8f"/>
  55. <meta name="color:selection text" content="#fff"/>
  56. <meta name="color:selection bg" content="#ff8f8f"/>
  57.  
  58. <!-- image options -->
  59.  
  60. <meta name="image:bg" content=""/>
  61. <meta name="image:header" content="//68.media.tumblr.com/0a1efe105c79f1c9d170d87141df29a0/tumblr_och101MUKG1uptww3o1_1280.png"/>
  62. <meta name="image:about icon" content="https://68.media.tumblr.com/ec406f94a1215e020f55601eb4158759/tumblr_inline_och134nKzv1rrt3vb_540.png"/>
  63. <meta name="image:sidebar icon" content="https://68.media.tumblr.com/18d6133635396218071046de38f340db/tumblr_inline_och134FVcK1rrt3vb_540.png"/>
  64.  
  65. <!-- text options -->
  66.  
  67. <meta name="text:tumblr username" content=""/>
  68. <meta name="text:header description" content="header quote goes here"/>
  69. <meta name="text:header link 1" content="Link 1"/>
  70. <meta name="text:header link 1 url" content=""/>
  71. <meta name="text:header link 2" content="Link 2"/>
  72. <meta name="text:header link 2 url" content=""/>
  73. <meta name="text:sidebar link 1" content="Link 1"/>
  74. <meta name="text:sidebar link 1 url" content=""/>
  75. <meta name="text:sidebar link 2" content="Link 2"/>
  76. <meta name="text:sidebar link 2 url" content=""/>
  77. <meta name="text:sidebar link 3" content="Link 3"/>
  78. <meta name="text:sidebar link 3 url" content=""/>
  79. <meta name="text:sidebar link 4" content="Link 4"/>
  80. <meta name="text:sidebar link 4 url" content=""/>
  81.  
  82. <!-- toggle options -->
  83.  
  84. <meta name="if:show header" content="1"/>
  85. <meta name="if:header desc box" content="1"/>
  86. <meta name="if:popup links" content="1"/>
  87. <meta name="if:show sidebar" content="1"/>
  88. <meta name="if:square sidebar img" content="0"/>
  89. <meta name="if:400px posts" content="0"/>
  90. <meta name="if:show buttons" content="1"/>
  91. <meta name="if:show caption" content="1"/>
  92. <meta name="if:show tags" content="1"/>
  93.  
  94. <!-- fonts -->
  95.  
  96. <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
  97.  
  98. <!-- jquery scripts -->
  99.  
  100. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  101.  
  102. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  103.  
  104. <!-- font awesome script -->
  105.  
  106. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  107.  
  108. <!-- tooltip scripts -->
  109.  
  110. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  111.  
  112. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  113.  
  114. <script>
  115. (function($){
  116. $(document).ready(function(){
  117. $("a[title]").style_my_tooltips({
  118. tip_follows_cursor:true,
  119. tip_delay_time:90,
  120. tip_fade_speed:600,
  121. attribute:"title"
  122. });
  123. });
  124. })(jQuery);
  125. </script>
  126.  
  127. <style type="text/css">
  128.  
  129. iframe.tmblr-iframe {
  130. z-index:99999999999999!important;
  131. top:50px!important;
  132. right:0!important;
  133. transform:scale(0.6);
  134. transform-origin:100% 0;
  135. -webkit-transform:scale(0.8);
  136. -webkit-transform-origin:100% 0;
  137. -o-transform:scale(0.8);
  138. -o-transform-origin:100% 0;
  139. -moz-transform:scale(0.8);
  140. -moz-transform-origin:100% 0;
  141. -ms-transform:scale(0.8);
  142. -ms-transform-origin:100% 0;
  143. }
  144.  
  145. ::-webkit-scrollbar-thumb {
  146. z-index:9999999;
  147. position:relative;
  148. height:auto;
  149. background-color:{color:scrollbar};
  150. }
  151.  
  152. ::-webkit-scrollbar {
  153. height:5px;
  154. width:5px;
  155. background-color:{color:background};
  156. }
  157.  
  158. /* basics */
  159.  
  160. body {
  161. color:{color:text};
  162. background-color:{color:background};
  163. font-family:'Roboto', sans-serif;
  164. font-size:10px;
  165. margin:0;
  166. line-height:14px;
  167. letter-spacing:1px;
  168. text-align:justify;
  169. word-wrap:break-word;
  170. background-image:url('{image:bg}');
  171. background-position:left top;
  172. background-attachment:fixed;
  173. background-repeat:repeat;
  174. }
  175.  
  176. small {font-size:9px;}
  177.  
  178. pre {
  179. word-wrap:break-word;
  180. padding:5px;
  181. margin:0px 10px;
  182. border:1px solid {color:border};
  183. white-space:pre-wrap;
  184. white-space:-moz-pre-wrap;
  185. white-space:-pre-wrap;
  186. white-space:-o-pre-wrap;
  187. }
  188.  
  189. blockquote {
  190. margin:0px 0px 0px 20px;
  191. padding:2px 0px 2px 5px;
  192. border-left:1px solid {color:border};
  193. }
  194.  
  195. b, strong {color:{color:bold};}
  196.  
  197. i, em {color:{color:italic};}
  198.  
  199. u {color:{color:underline};text-transform:none;}
  200.  
  201. a {
  202. color:{color:link};
  203. text-transform:uppercase;
  204. text-decoration:none;
  205. -moz-transition-duration:1s;
  206. -webkit-transition-duration:1s;
  207. -o-transition-duration:1s;
  208. }
  209.  
  210. a:hover {
  211. color:{color:link hover};
  212. -moz-transition-duration:1s;
  213. -webkit-transition-duration:1s;
  214. -o-transition-duration:1s;
  215. }
  216.  
  217. p {margin:10px;}
  218.  
  219. hr {width:200px;border-top:1px solid {color:border};}
  220.  
  221. h1 {
  222. font-size:14px;
  223. font-family:'Roboto', sans-serif;
  224. text-align:left;
  225. text-transform:uppercase;
  226. letter-spacing:1px;
  227. color:{color:h1 text};
  228. background-color:{color:h1 bg};
  229. padding:10px;
  230. margin-top:0px;
  231. }
  232.  
  233. h1 a {
  234. color:{color:h1 text};
  235. -moz-transition-duration:1s;
  236. -webkit-transition-duration:1s;
  237. -o-transition-duration:1s;
  238. }
  239.  
  240. h1 a:hover {
  241. color:{color:nav links hover};
  242. -moz-transition-duration:1s;
  243. -webkit-transition-duration:1s;
  244. -o-transition-duration:1s;
  245. }
  246.  
  247. h1 c {margin-right:10px;}
  248.  
  249. h2 {
  250. text-align:center;
  251. font-size:12px;
  252. word-spacing:2px;
  253. line-height:17px;
  254. padding:5px 10px;
  255. text-transform:uppercase;
  256. font-family:'Roboto', sans-serif;
  257. }
  258.  
  259. /* top navigation bar */
  260.  
  261. #topbar {
  262. top:0;
  263. left:0;
  264. width:100%;
  265. height:50px;
  266. position:fixed;
  267. background-color:{color:navbar bg};
  268. z-index:9;
  269. }
  270.  
  271. #title {
  272. position:fixed;
  273. top:0;
  274. left:0;
  275. color:{color:title};
  276. font-family:'Roboto Condensed', sans-serif;
  277. font-size:35px;
  278. font-weight:700;
  279. letter-spacing:5px;
  280. text-transform:uppercase;
  281. padding:18px 14px;
  282. z-index:99;
  283. }
  284.  
  285. #nav {
  286. position:fixed;
  287. top:18px;
  288. right:5px;
  289. z-index:99;
  290. }
  291.  
  292. #nav a {
  293. color:{color:nav links};
  294. font-family:'Roboto Condensed', sans-serif;
  295. font-size:15px;
  296. text-transform:uppercase;
  297. letter-spacing:1px;
  298. padding:0px 10px;
  299. -moz-transition-duration:1s;
  300. -webkit-transition-duration:1s;
  301. -o-transition-duration:1s;
  302. }
  303.  
  304. #nav a:hover {
  305. color:{color:nav links hover};
  306. -moz-transition-duration:1s;
  307. -webkit-transition-duration:1s;
  308. -o-transition-duration:1s;
  309. }
  310.  
  311. .hidden {display:none;}
  312.  
  313. .unhidden {
  314. display:block;
  315. position:fixed;
  316. top:80px;
  317. right:30px;
  318. background-color:#fff;
  319. padding:10px;
  320. box-sizing:border-box;
  321. z-index:999;
  322. }
  323.  
  324. #icon {
  325. width:60px;
  326. height:60px;
  327. margin-left:auto;
  328. margin-right:auto;
  329. margin-bottom:10px;
  330. }
  331.  
  332. #icon img {
  333. width:60px;
  334. height:60px;
  335. border-radius:50%;
  336. }
  337.  
  338. /* header */
  339.  
  340. #headercont {
  341. {block:ifnotshowheader}display:none;{/block:ifnotshowheader}
  342. {block:PermalinkPage}display:none;{/block:PermalinkPage}
  343. }
  344.  
  345. #header {
  346. width:100%;
  347. height:100vh;
  348. background:url({image:header}) top center;
  349. -webkit-background-size:cover;
  350. -moz-background-size:cover;
  351. -o-background-size:cover;
  352. background-size:cover;
  353. z-index:1!important;
  354. }
  355.  
  356. #scroll {
  357. position:absolute;
  358. top:85vh;
  359. left:51%;
  360. margin-left:-40px;
  361. font-size:95px;
  362. }
  363.  
  364. #info {
  365. position:absolute;
  366. width:300px;
  367. top:46vh;
  368. left:50%;
  369. margin-left:-150px;
  370. {block:ifnotheaderdescbox}display:none;{/block:ifnotheaderdescbox}
  371. }
  372.  
  373. #infoquoteleft {
  374. position:absolute;
  375. margin:-30px 0px 0px -30px;
  376. font-size:55px;
  377. }
  378.  
  379. #infoquoteright {
  380. position:absolute;
  381. margin:-20px 0px 0px 280px;
  382. font-size:55px;
  383. }
  384.  
  385. #infoquoteleft c, #infoquoteright c {color:{color:quotation marks};}
  386.  
  387. #desc {
  388. width:300px;
  389. padding:10px;
  390. box-sizing:border-box;
  391. background-color:{color:header desc bg};
  392. margin-top:10px;
  393. text-align:center;
  394. }
  395.  
  396. /* sidebar */
  397.  
  398. {block:ifshowheader}
  399. {block:IndexPage}.sidebar {
  400. opacity:0;
  401. -moz-transition-duration:all 0.5s ease-in-out;
  402. -webkit-transition-duration:all 0.5s ease-in-out;
  403. -o-transition-duration:all 0.5s ease-in-out;
  404. transition:all 0.5s ease-in-out;
  405. }
  406.  
  407. .sidebar2 {
  408. opacity:1;
  409. -moz-transition-duration:all 0.5s ease-in-out;
  410. -webkit-transition-duration:all 0.5s ease-in-out;
  411. -o-transition-duration:all 0.5s ease-in-out;
  412. transition:all 0.5s ease-in-out;
  413. }{/block:IndexPage}
  414. {/block:ifshowheader}
  415.  
  416. .sidebar {
  417. position:fixed;
  418. top:90px;
  419. left:30px;
  420. width:200px;
  421. z-index:9;
  422. {block:ifnotshowsidebar}
  423. display:none;
  424. {/block:ifnotshowsidebar}
  425. }
  426.  
  427. #sidebaricon {
  428. width:100px;
  429. height:100px;
  430. margin-bottom:10px;
  431. }
  432.  
  433. #sidebaricon img {
  434. width:100px;
  435. height:100px;
  436. {block:ifnotsquaresidebarimg}
  437. border-radius:50%;
  438. {/block:ifnotsquaresidebarimg}
  439. }
  440.  
  441. #sidebardesc {
  442. width:200px;
  443. background-color:{color:sidebar desc bg};
  444. padding:10px;
  445. margin-bottom:10px;
  446. box-sizing:border-box;
  447. }
  448.  
  449. #sidebarnav {
  450. width:200px;
  451. background-color:{color:navbar bg};
  452. padding:0px 10px;
  453. box-sizing:border-box;
  454. margin-bottom:10px;
  455. }
  456.  
  457. #sidebarnav a {
  458. display:block;
  459. color:{color:nav links};
  460. font-family:'Roboto Condensed', sans-serif;
  461. border-bottom:1px solid {color:nav links};
  462. font-size:11px;
  463. text-transform:uppercase;
  464. letter-spacing:1px;
  465. padding:10px 0px;
  466. -moz-transition-duration:1s;
  467. -webkit-transition-duration:1s;
  468. -o-transition-duration:1s;
  469. }
  470.  
  471. #sidebarnav a:last-child {border-bottom:none;}
  472.  
  473. #sidebarnav a:hover {
  474. color:{color:nav links hover};
  475. -moz-transition-duration:1s;
  476. -webkit-transition-duration:1s;
  477. -o-transition-duration:1s;
  478. }
  479.  
  480. /* posts */
  481.  
  482. #pagination {
  483. text-align:center;
  484. margin-bottom:20px;
  485. color:{color:text};
  486. font-size:25px!important;
  487. font-family:'Roboto Condensed', sans-serif;
  488. }
  489.  
  490. #pagination a {
  491. padding:20px 2px;
  492. color:{color:text}!important;
  493. -moz-transition-duration:1s;
  494. -webkit-transition-duration:1s;
  495. -o-transition-duration:1s;
  496. }
  497.  
  498. #pagination a:hover {
  499. color:{color:scrollbar}!important;
  500. -moz-transition-duration:1s;
  501. -webkit-transition-duration:1s;
  502. -o-transition-duration:1s;
  503. }
  504.  
  505. #themecontainer {
  506. position:relative;
  507. width:100%;
  508. min-height:100vh;
  509. top:0;
  510. overflow:hidden;
  511. }
  512.  
  513. #container {
  514. {block:if400pxposts}width:500px;{/block:if400pxposts}
  515. {block:ifnot400pxposts}width:600px;{/block:ifnot400pxposts}
  516. margin:130px auto 50px auto;
  517. text-align:justify;
  518. }
  519.  
  520. #posts {
  521. background-color:#fff;
  522. {block:if400pxposts}width:400px;{/block:if400pxposts}
  523. {block:ifnot400pxposts}width:500px;{/block:ifnot400pxposts}
  524. padding:10px;
  525. {block:IndexPage}margin:0px auto 80px auto;{/block:IndexPage}
  526. {block:PermalinkPage}margin:0px auto 40px auto;{/block:PermalinkPage}
  527. }
  528.  
  529. .buttons {
  530. position:absolute;
  531. {block:if400pxposts}margin-left:425px;{/block:if400pxposts}
  532. {block:ifnot400pxposts}margin-left:525px;{/block:ifnot400pxposts}
  533. margin-top:-9px;
  534. display:block;
  535. {block:PermalinkPage}display:none;{/block:PermalinkPage}
  536. {block:ifnotshowbuttons}display:none;{/block:ifnotshowbuttons}
  537. }
  538.  
  539. #posticon {
  540. color:{color:title};
  541. background-color:{color:navbar bg};
  542. padding:5px;
  543. width:30px;
  544. height:30px;
  545. font-size:15px;
  546. text-align:center;
  547. box-sizing:border-box;
  548. }
  549.  
  550. #posticon c {margin-top:3px;}
  551.  
  552. #likebutton {
  553. background-color:{color:navbar bg};
  554. padding:5px;
  555. margin-top:40px;
  556. margin-bottom:10px;
  557. width:30px;
  558. height:30px;
  559. overflow:hidden;
  560. box-sizing:border-box;
  561. }
  562.  
  563. #reblogbutton {
  564. background-color:{color:navbar bg};
  565. padding:5px;
  566. width:30px;
  567. height:30px;
  568. overflow:hidden;
  569. box-sizing:border-box;
  570. }
  571.  
  572. #posts ul, ol {margin-left:15px;padding:0px!important;}
  573.  
  574. #posts li {margin:0px 10px;}
  575.  
  576. #posts img {
  577. {block:if400pxposts}max-width:400px;{/block:if400pxposts}
  578. {block:ifnot400pxposts}max-width:500px;{/block:ifnot400pxposts}
  579. }
  580.  
  581. #posts p img {margin:0px;}
  582.  
  583. #posts blockquote img {max-width:100%;height:auto;}
  584.  
  585. #posts iframe, #posts video {max-width:100%;}
  586.  
  587. #source {margin-top:15px;text-align:right;}
  588.  
  589. .caption {
  590. {block:ifnotshowcaption}
  591. {block:IndexPage}display:none;{/block:IndexPage}
  592. {/block:ifnotshowcaption}
  593. }
  594.  
  595. #audio {
  596. width:100%;
  597. height:100px;
  598. padding:10px 0px;
  599. color:{color:h1 text};
  600. background-color:{color:navbar bg};
  601. font-family:'Roboto Condensed', sans-serif;
  602. font-size:10px;
  603. line-height:25px;
  604. overflow:hidden;
  605. }
  606.  
  607. #audio b {color:{color:link};}
  608.  
  609. #audioplayerbg {
  610. background:#fff;
  611. width:80px;
  612. height:80px;
  613. margin-left:10px;
  614. padding:10px;
  615. overflow:hidden;
  616. position:absolute;
  617. opacity:0.4;
  618. -moz-transition-duration:1s;
  619. -webkit-transition-duration:1s;
  620. -o-transition-duration:1s;
  621. }
  622.  
  623. #audioplayerbg:hover {
  624. opacity:0.7;
  625. -moz-transition-duration:1s;
  626. -webkit-transition-duration:1s;
  627. -o-transition-duration:1s;
  628. }
  629.  
  630. #audioplayer {
  631. width:30px;
  632. height:30px;
  633. overflow:hidden;
  634. margin-top:25px;
  635. margin-left:25px;
  636. }
  637.  
  638. #albumart {float:left;margin:0px 10px;}
  639.  
  640. #audioinfo {
  641. position:absolute;
  642. {block:if400pxposts}width:260px;{/block:if400pxposts}
  643. {block:ifnot400pxposts}width:360px;{/block:ifnot400pxposts}
  644. max-height:100px;
  645. overflow:auto;
  646. margin-left:125px;
  647. padding-right:10px;
  648. text-transform:uppercase;
  649. }
  650.  
  651. .chat ol {margin:0px!important;list-style:none;}
  652.  
  653. .line {list-style:none;padding:5px 0px;}
  654.  
  655. .label {text-decoration:bold;}
  656.  
  657. .askericon {
  658. width:64px;
  659. height:64px;
  660. float:left;
  661. border:10px solid {color:scrollbar};
  662. margin-right:10px;
  663. }
  664.  
  665. .asker {
  666. text-align:left;
  667. font-size:15px;
  668. font-family:'Roboto', sans-serif;
  669. text-transform:uppercase;
  670. margin-bottom:10px;
  671. }
  672.  
  673. .ask {
  674. text-align:left;
  675. color:{color:ask text};
  676. background-color:{color:ask bg};
  677. height:64px;
  678. padding:10px;
  679. overflow:auto;
  680. }
  681.  
  682. .answer {
  683. padding:10px;
  684. margin-top:10px;
  685. background-color:{color:reply bg};
  686. }
  687.  
  688. #posts .answer img {max-width:100%;height:auto;}
  689.  
  690. .replier {
  691. text-align:left;
  692. font-size:15px;
  693. font-family:'Roboto', sans-serif;
  694. text-transform:uppercase;
  695. margin:10px 0px 10px 10px;
  696. }
  697.  
  698. .replies {margin-top:10px;}
  699.  
  700. #perma {
  701. padding:10px;
  702. letter-spacing:2px;
  703. text-align:left;
  704. background-color:{color:perma link bg};
  705. margin-top:10px;
  706. }
  707.  
  708. #perma a {
  709. color:{color:perma link};
  710. font-size:9px;
  711. padding:5px;
  712. -moz-transition-duration:1s;
  713. -webkit-transition-duration:1s;
  714. -o-transition-duration:1s;
  715. }
  716.  
  717. #perma a:hover {
  718. color:{color:perma link hover};
  719. -moz-transition-duration:1s;
  720. -webkit-transition-duration:1s;
  721. -o-transition-duration:1s;
  722. }
  723.  
  724. #tags {
  725. text-align:left;
  726. word-wrap:break-word;
  727. color:{color:tags};
  728. margin:5px 0px 0px 5px;
  729. {block:ifnotshowtags}
  730. {block:IndexPage}display:none;{/block:IndexPage}
  731. {/block:ifnotshowtags}
  732. }
  733.  
  734. #tags a {
  735. padding:0px 5px;
  736. font-size:8px;
  737. text-transform:none;
  738. color:{color:tags};
  739. -moz-transition-duration:1s;
  740. -webkit-transition-duration:1s;
  741. -o-transition-duration:1s;
  742. }
  743.  
  744. #tags a:hover {
  745. color:{color:tags hover};
  746. -moz-transition-duration:1s;
  747. -webkit-transition-duration:1s;
  748. -o-transition-duration:1s;
  749. }
  750.  
  751. ol.notes {
  752. text-align:left;
  753. font-size:9px;
  754. list-style-type:none;
  755. padding:0px!important;
  756. margin:0px!important;
  757. }
  758.  
  759. ol.notes li.note {padding:10px 0px;}
  760.  
  761. ol.notes li.note img.avatar {padding-right:10px;}
  762.  
  763. /* extras */
  764.  
  765. #s-m-t-tooltip {
  766. z-index:9999999999;
  767. color:{color:tooltip text};
  768. background-color:{color:tooltip bg};
  769. font-size:9px;
  770. line-height:11px;
  771. font-family: 'Roboto Condensed', sans-serif;
  772. letter-spacing:1px;
  773. text-transform:uppercase;
  774. max-width:150px;
  775. text-align:left;
  776. padding:2px 5px 2px 5px;
  777. display:block;
  778. margin:24px 14px 7px 12px;
  779. }
  780.  
  781. ::selection {
  782. color:{color:selection text};
  783. background-color:{color:selection bg};
  784. }
  785.  
  786. /* credit - do not remove, alter, or move to another page */
  787.  
  788. #credit {
  789. position:fixed;
  790. bottom:14px;
  791. right:10px;
  792. text-align:center;
  793. z-index:9999999;
  794. }
  795.  
  796. #credit a {
  797. font-size:10px;
  798. color:{color:background};
  799. background-color:{color:scrollbar};
  800. padding:4px;
  801. -moz-transition-duration:1s;
  802. -webkit-transition-duration:1s;
  803. -o-transition-duration:1s;
  804. }
  805.  
  806. #credit a:hover {
  807. color:{color:scrollbar};
  808. background-color:{color:background};
  809. -moz-transition-duration:1s;
  810. -webkit-transition-duration:1s;
  811. -o-transition-duration:1s;
  812. }
  813.  
  814. </style>
  815. </head>
  816. <body>
  817.  
  818. <div id="topbar">
  819. <div id="title">{Title}</div>
  820. <div id="nav">
  821. <a href="/">Home</a>
  822. {block:ifpopuplinks}<a href="javascript:unhide('displaybx1');">Ask</a>
  823. <a href="javascript:unhide('displaybx2');">About</a>
  824. <a href="javascript:unhide('displaybx3');">Updates</a>
  825. <a href="/submit">Submit</a>
  826. <a href="/archive">Past</a>{/block:ifpopuplinks}
  827. {block:ifnotpopuplinks}
  828. <a href="/ask">Ask</a>
  829. <a href="/submit">Submit</a>
  830. <a href="/archive">Past</a>
  831. <a href="{text:header link 1 url}">{text:header link 1}</a>
  832. <a href="{text:header link 2 url}">{text:header link 2}</a>
  833. {/block:ifnotpopuplinks}
  834. </div>
  835. </div>
  836.  
  837. {block:ifpopuplinks}
  838. <div id="displaybx1" class="hidden" style="width:300px;">
  839. <iframe frameborder="0" height="250" id="ask_form" scrolling="no" src="//www.tumblr.com/ask_form/{text:tumblr username}.tumblr.com" width="100%" style="background-color: transparent; overflow: hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]-->
  840. </div>
  841.  
  842. <div id="displaybx2" class="hidden" style="width:200px;">
  843. <div id="icon"><img src="{image:about icon}"></div>
  844. <!-- your about goes here. it comes with a small icon 60x60px in size and room to give a short summary of yourself and/or your blog. use regular html styling (i.e. p / b / i / etc.) -->
  845. About goes here.
  846. </div>
  847.  
  848. <div id="displaybx3" class="hidden" style="width:200px;">
  849. <!-- your updates go here. you can write your latest updates, networks, what you're reading/watching/etc. right now and other relevant things. use regular html styling (i.e. p / b / i / etc.) -->
  850. Updates go here.
  851. </div>
  852. {/block:ifpopuplinks}
  853.  
  854. <div id="headercont">
  855. <div id="info">
  856. <div id="infoquoteleft"><c class="fa fa-quote-left"></c></div>
  857. <div id="desc">{text:header description}</div>
  858. <div id="infoquoteright"><c class="fa fa-quote-right"></c></div>
  859. </div>
  860. <a id="scroll" href="#" style="color:{color:header scroll arrow};">
  861. <c class="fa fa-caret-down"></c></a>
  862. <div id="header"></div>
  863. </div>
  864.  
  865. <div class="sidebar">
  866. <div id="sidebaricon"><a href="/" title="home"><img src="{image:sidebar icon}"></a></div>
  867. <div id="sidebardesc">{Description}</div>
  868. <div id="sidebarnav">
  869. <a href="{text:sidebar link 1 url}"><c class="fa fa-star"></c> {text:sidebar link 1}</a>
  870. <a href="{text:sidebar link 2 url}"><c class="fa fa-star"></c> {text:sidebar link 2}</a>
  871. <a href="{text:sidebar link 3 url}"><c class="fa fa-star"></c> {text:sidebar link 3}</a>
  872. <a href="{text:sidebar link 4 url}"><c class="fa fa-star"></c> {text:sidebar link 4}</a>
  873. </div>
  874. </div>
  875.  
  876. <div id="themecontainer">
  877. <div id="container">
  878. {block:Posts}
  879. <div id="posts">
  880.  
  881. <div class="buttons">
  882. <div id="likebutton">{LikeButton color="white" size="20"}</div>
  883. <div id="reblogbutton">{ReblogButton color="white" size="20"}</div>
  884. </div>
  885.  
  886. {block:Text}
  887. {block:IndexPage}
  888. <div class="buttons">
  889. <div id="posticon"><c class="fa fa-pencil"></c></div>
  890. </div>
  891. {/block:IndexPage}
  892. {block:Title}<h1><c class="fa fa-star"></c>{Title}</h1>{/block:Title}
  893. {Body}
  894. {/block:Text}
  895.  
  896. {block:Quote}
  897. {block:IndexPage}
  898. <div class="buttons">
  899. <div id="posticon"><c class="fa fa-quote-right"></c></div>
  900. </div>
  901. {/block:IndexPage}
  902. <h2>{Quote}</h2>
  903. {block:Source}<div id="source">— {Source}</div>{/block:Source}
  904. {/block:Quote}
  905.  
  906. {block:Link}
  907. {block:IndexPage}
  908. <div class="buttons">
  909. <div id="posticon"><c class="fa fa-link"></c></div>
  910. </div>
  911. {/block:IndexPage}
  912. <h1><c class="fa fa-star"></c><a href="{URL}"><< {Name} >></a></h1>
  913. {block:Description}{Description}{/block:Description}
  914. {/block:Link}
  915.  
  916. {block:Chat}
  917. {block:IndexPage}
  918. <div class="buttons">
  919. <div id="posticon"><c class="fa fa-commenting"></c></div>
  920. </div>
  921. {/block:IndexPage}
  922. {block:Title}
  923. <h1><c class="fa fa-star"></c>{Title}</h1>
  924. {/block:Title}
  925. <div class="chat">
  926. <ol>{block:Lines}
  927. <li class="line {Alt}">
  928. {block:Label}
  929. <span class="label">
  930. <b>{Label}</b></span>
  931. {/block:Label}{Line}</li>
  932. {/block:Lines}
  933. </ol></div>
  934. {/block:Chat}
  935.  
  936. {block:Photo}
  937. {block:IndexPage}
  938. <div class="buttons">
  939. <div id="posticon"><c class="fa fa-camera"></c></div>
  940. </div>
  941. {/block:IndexPage}
  942. {LinkOpenTag}<center>{block:if400pxposts}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{/block:if400pxposts}{block:ifnot400pxposts}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{/block:ifnot400pxposts}</center>{LinkCloseTag}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  943. {/block:Photo}
  944.  
  945. {block:Photoset}
  946. {block:IndexPage}
  947. <div class="buttons">
  948. <div id="posticon"><c class="fa fa-camera"></c></div>
  949. </div>
  950. {/block:IndexPage}
  951. <center>{block:if400pxposts}{Photoset-400}{/block:if400pxposts}{block:ifnot400pxposts}{Photoset-500}{/block:ifnot400pxposts}</center>{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  952. {/block:Photoset}
  953.  
  954. {block:Video}
  955. {block:IndexPage}
  956. <div class="buttons">
  957. <div id="posticon"><c class="fa fa-video-camera"></c></div>
  958. </div>
  959. {/block:IndexPage}
  960. <center>{block:if400pxposts}{Video-400}{/block:if400pxposts}{block:ifnot400pxposts}{Video-500}{/block:ifnot400pxposts}</center>{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  961. {/block:Video}
  962.  
  963. {block:Audio}
  964. {block:IndexPage}
  965. <div class="buttons">
  966. <div id="posticon"><c class="fa fa-music"></c></div>
  967. </div>
  968. {/block:IndexPage}
  969. <div id="audio">
  970. <div id="audioplayerbg"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  971. <div id="albumart"><span{block:AlbumArt} style="display:none;"{block:AlbumArt}><img src="https://41.media.tumblr.com/9b78d1e07567414cae86f9e454b1e9f7/tumblr_inline_o39hgzRFff1rrt3vb_540.png" width="100"></span>{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
  972. <div id="audioinfo">
  973. <span{block:TrackName} style="display:none;"{block:TrackName}><b>Song:</b> unknown</span>{block:TrackName}<b>Song:</b> {TrackName}{/block:TrackName}
  974. <br><span{block:Artist} style="display:none;"{block:Artist}><b>Artist:</b> unknown</span>{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}
  975. <br><span{block:Album} style="display:none;"{block:Album}><b>Album:</b> unknown</span>{block:Album}<b>Album:</b> {Album}{/block:Album}
  976. <br>{block:PlayCount}<b>Play count:</b> {PlayCount}{/block:PlayCount}
  977. </div></div>
  978. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  979. {/block:Audio}
  980.  
  981. {block:Answer}
  982. {block:IndexPage}
  983. <div class="buttons">
  984. <div id="posticon"><c class="fa fa-comment"></c></div>
  985. </div>
  986. {/block:IndexPage}
  987. <div class="askericon"><img src="{AskerPortraitURL-64}"></div>
  988. <div class="ask"><div class="asker">{Asker} asked:</div>{Question}</div>
  989. <div class="answer">{block:Answerer}<div class="replier">{Answerer} replied:</div>{/block:Answerer}{Answer}</div>
  990. {block:Answerer}<div class="replies">{Replies}</div>{/block:Answerer}
  991. {/block:Answer}
  992.  
  993. {block:Date}
  994.  
  995. {block:IndexPage}<div id="perma">
  996. <a href="{Permalink}" title="{DayofMonth}{DayofMonthSuffix} {Month} {Year}">{block:Date}{TimeAgo}{/block:Date}</a>
  997. <a href="{Permalink}">{NoteCountwithLabel}</a>
  998. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  999. {block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}
  1000. <br>{block:HasTags}<div id="tags"><c class="fa fa-tags"></c>{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1001. </div>{/block:IndexPage}
  1002.  
  1003. {block:PermalinkPage}<div id="perma">
  1004. <a href="{Permalink}">{block:Date}{TimeAgo}{/block:Date}</a>
  1005. <a href="{Permalink}">{NoteCountwithLabel}</a>
  1006. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  1007. {block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}
  1008. <br>{block:HasTags}<div id="tags"><c class="fa fa-tags"></c>{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1009. </div>{/block:PermalinkPage}
  1010.  
  1011. {/block:Date}
  1012.  
  1013. {block:PostNotes}{PostNotes-16}{/block:PostNotes}
  1014.  
  1015. </div>
  1016. {/block:Posts}
  1017.  
  1018. {block:Pagination}
  1019. <div id="pagination">
  1020. {block:PreviousPage}<a href="{PreviousPage}">Back</a>{/block:PreviousPage}
  1021. <c class="fa fa-star"></c>
  1022. {block:NextPage}<a href="{NextPage}">Forth</a>{/block:NextPage}</div>
  1023. {/block:Pagination}
  1024.  
  1025. </div>
  1026. </div>
  1027.  
  1028. <!-- toggle class jquery -->
  1029.  
  1030. <script type="text/javascript">
  1031. function unhide(divID) {
  1032. var item = document.getElementById(divID);
  1033. if (item) {
  1034. item.className=(item.className=='hidden')?'unhidden':'hidden';
  1035. }
  1036. }
  1037. </script>
  1038.  
  1039. <!-- scrollto jquery -->
  1040.  
  1041. <script type="text/javascript">
  1042. jQuery(document).ready(function(){
  1043. var containerPosition = jQuery('#themecontainer').offset().top;
  1044. jQuery('#scroll').click(function(){
  1045. jQuery('html, body').animate({scrollTop:containerPosition}, 'slow');
  1046. return false;
  1047. });
  1048. });
  1049. </script>
  1050.  
  1051. <!-- sticky div jquery -->
  1052.  
  1053. <script>
  1054. $(document).ready(function(){
  1055. $(window).bind('scroll', function(){
  1056. if($(window).scrollTop() > 1100){
  1057. $('.sidebar').addClass('sidebar2');
  1058. }
  1059.  
  1060. else{
  1061. $('.sidebar').removeClass('sidebar2');
  1062. }
  1063. });
  1064. });
  1065. </script>
  1066.  
  1067. <div id="credit"><a href="//the49thname.tumblr.com/" title="made by the49thname">49</a>
  1068. </div>
  1069.  
  1070. </body>
  1071. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!