API tools faq
paste
Advertisement
the49thname

Theme 16: Jealous Gods (light version)

the49thname
Jun 22nd, 2019
862
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.77 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <head>
  4.  
  5. <!-- theme 16: jealous gods (light ver) / ver 1.1 (updated 03/09/19)
  6.  
  7. themes by ro (the49thname) / the49ththeme.tumblr.com
  8. tumblr controls fix by cyantists @ tumblr
  9. unnest captions script by magnusthemes & neothm @ tumblr
  10. pxu photoset script by shythemes @ tumblr / pixelunion @ github
  11. masonry script by shythemes @ tumblr
  12. don't remove the credit, use as a base code, or claim as your own work.
  13. edit as much as you want, and feel free to send me any queries/problems.
  14.  
  15. -->
  16.  
  17. <title>{Title}</title>
  18.  
  19. <link rel="shortcut icon" href="{Favicon}">
  20.  
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22.  
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24.  
  25. <!-- colour options -->
  26.  
  27. <meta name="color:background" content="#eee"/>
  28. <meta name="color:scrollbar" content="#56bc8a"/>
  29. <meta name="color:nav links" content="#888"/>
  30. <meta name="color:nav links hover" content="#78c9a1"/>
  31. <meta name="color:enter bg" content="#fff"/>
  32. <meta name="color:text" content="#888"/>
  33. <meta name="color:bold" content="#56bc8a"/>
  34. <meta name="color:italic" content="#9ad7b9"/>
  35. <meta name="color:underline" content="#888"/>
  36. <meta name="color:link" content="#78c9a1"/>
  37. <meta name="color:link hover" content="#888"/>
  38. <meta name="color:h1 text" content="#56bc8a"/>
  39. <meta name="color:border" content="#ccc"/>
  40. <meta name="color:perma link" content="#78c9a1"/>
  41. <meta name="color:perma link hover" content="#888"/>
  42. <meta name="color:tags" content="#888"/>
  43. <meta name="color:tags hover" content="#78c9a1"/>
  44. <meta name="color:tooltip text" content="#000"/>
  45. <meta name="color:tooltip bg" content="#45966e"/>
  46. <meta name="color:selection text" content="#000"/>
  47. <meta name="color:selection bg" content="#45966e"/>
  48.  
  49. <!-- image options -->
  50.  
  51. <meta name="image:bg" content=""/>
  52. <meta name="image:header icon" content="//66.media.tumblr.com/61526fa7bed7510377776b67eda08d73/tumblr_inline_ptgljj5KDp1ua3owt_1280.png"/>
  53. <meta name="image:sidebar icon" content="//66.media.tumblr.com/257aa7bdd6e72bdf5d48b6b2c09cf552/tumblr_inline_ptgljmjKQb1ua3owt_1280.png"/>
  54.  
  55. <!-- text options -->
  56.  
  57. <meta name="text:link 1" content="link 1"/>
  58. <meta name="text:link 1 url" content=""/>
  59. <meta name="text:link 2" content="link 2"/>
  60. <meta name="text:link 2 url" content=""/>
  61.  
  62. <!-- toggle options -->
  63.  
  64. <meta name="if:show header" content="1"/>
  65. <meta name="if:show captions" content="1"/>
  66. <meta name="if:show like reblog buttons" content="1"/>
  67. <meta name="if:show tags" content="1"/>
  68.  
  69. <!-- fonts -->
  70.  
  71. <link href="//fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
  72.  
  73. <!-- font awesome script -->
  74.  
  75. <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css">
  76.  
  77. <!-- pxu photosets css -->
  78.  
  79. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  80.  
  81. <style type="text/css">
  82.  
  83. iframe.tmblr-iframe {
  84. top:0!important;
  85. right:0!important;
  86. opacity:0.4;
  87. filter:invert(1);
  88. -webkit-filter:invert(1);
  89. -o-filter:invert(1);
  90. -moz-filter:invert(1);
  91. -ms-filter:invert(1);
  92. transform:scale(0.8);
  93. transform-origin:100% 0;
  94. -webkit-transform:scale(0.8);
  95. -webkit-transform-origin:100% 0;
  96. -o-transform:scale(0.8);
  97. -o-transform-origin:100% 0;
  98. -moz-transform:scale(0.8);
  99. -moz-transform-origin:100% 0;
  100. -ms-transform:scale(0.8);
  101. -ms-transform-origin:100% 0;
  102. z-index:99999999999999!important;
  103. }
  104.  
  105. ::-webkit-scrollbar-thumb {
  106. position:relative;
  107. height:auto;
  108. background-color:{color:scrollbar};
  109. z-index:9999;
  110. }
  111.  
  112. ::-webkit-scrollbar {
  113. width:5px;
  114. height:5px;
  115. background-color:{color:background};
  116. }
  117.  
  118. /* basics */
  119.  
  120. * {margin:0;padding:0;box-sizing:border-box;}
  121.  
  122. @media only screen and (max-width: 1019px) {
  123. html, body {height:100%;}
  124. }
  125.  
  126. body {
  127. color:{color:text};
  128. background-color:{color:background};
  129. font-family:'Roboto', sans-serif;
  130. font-size:10px;
  131. line-height:14px;
  132. letter-spacing:1px;
  133. text-align:justify;
  134. word-wrap:break-word;
  135. background-image:url('{image:bg}');
  136. background-position:left top;
  137. background-attachment:fixed;
  138. background-repeat:repeat;
  139. }
  140.  
  141. small {font-size:9px;}
  142.  
  143. pre {
  144. margin:0 10px;
  145. padding:5px;
  146. border:1px solid {color:border};
  147. word-wrap:break-word;
  148. white-space:pre-wrap;
  149. white-space:-moz-pre-wrap;
  150. white-space:-pre-wrap;
  151. white-space:-o-pre-wrap;
  152. }
  153.  
  154. blockquote {
  155. margin:5px 0 5px 20px;
  156. padding:2px 0 2px 5px;
  157. border-left:1px solid {color:border};
  158. }
  159.  
  160. b, strong {color:{color:bold};}
  161.  
  162. i, em {color:{color:italic};}
  163.  
  164. u {color:{color:underline};text-transform:none;}
  165.  
  166. a {
  167. color:{color:link};
  168. text-transform:uppercase;
  169. text-decoration:none;
  170. -moz-transition-duration:1s;
  171. -webkit-transition-duration:1s;
  172. -o-transition-duration:1s;
  173. }
  174.  
  175. a:hover {
  176. color:{color:link hover};
  177. -moz-transition-duration:1s;
  178. -webkit-transition-duration:1s;
  179. -o-transition-duration:1s;
  180. }
  181.  
  182. p {margin:10px;}
  183. p:empty {display:none;}
  184. p img {margin-left:0!important;}
  185.  
  186. hr {width:200px;margin:0 auto;border-top:1px solid {color:border};}
  187.  
  188. /* header */
  189.  
  190. #headercont {
  191. {block:ifnotshowheader}display:none;{/block:ifnotshowheader}
  192. {block:PermalinkPage}display:none;{/block:PermalinkPage}
  193. }
  194.  
  195. #header {width:100%;height:100vh;}
  196.  
  197. #headerinfo {
  198. position:absolute;
  199. top:calc(50vh - 130px);
  200. left:calc(50vw - 250px);
  201. width:500px;
  202. height:192px;
  203. padding-right:20px;
  204. background-color:rgba(255, 255, 255, 0.4);
  205. border:1px solid {color:border};
  206. overflow:auto;
  207. -webkit-transition:all ease 0.8s;
  208. -moz-transition:all ease 0.8s;
  209. -o-transition:all ease 0.8s;
  210. transition:all ease 0.8s;
  211. }
  212.  
  213. #headerinfo:hover {background-color:rgba(255, 255, 255, 1);}
  214.  
  215. #headericon {
  216. float:left;
  217. width:150px;
  218. height:150px;
  219. margin:20px;
  220. }
  221.  
  222. #headericon img {
  223. width:150px;
  224. height:150px;
  225. border-radius:50%;
  226. opacity:1;
  227. -moz-transition-duration:1s;
  228. -webkit-transition-duration:1s;
  229. -o-transition-duration:1s;
  230. }
  231.  
  232. #headericon img:hover {
  233. cursor:help;
  234. opacity:0.6;
  235. -moz-transition-duration:1s;
  236. -webkit-transition-duration:1s;
  237. -o-transition-duration:1s;
  238. }
  239.  
  240. #headertitle {
  241. position:relative;
  242. margin:30px 0 20px 0;
  243. font-family:'Roboto Condensed', sans-serif;
  244. font-size:25px;
  245. line-height:25px;
  246. letter-spacing:3px;
  247. text-align:center;
  248. text-transform:uppercase;
  249. }
  250.  
  251. #headernav {margin-bottom:15px;text-align:center;}
  252.  
  253. #headernav a {
  254. display:inline-block;
  255. margin:0 5px 5px 5px;
  256. padding:0 3px 8px 3px;
  257. color:{color:nav links};
  258. border-bottom:1px solid {color:nav links};
  259. }
  260.  
  261. #headernav a:hover {
  262. color:{color:nav links hover};
  263. border-bottom:1px solid {color:nav links hover};
  264. letter-spacing:3px;
  265. }
  266.  
  267. #headerdesc {text-transform:uppercase;padding-bottom:10px;}
  268.  
  269. #scroll {
  270. position:absolute;
  271. bottom:10vh;
  272. left:calc(50% - 100px);
  273. width:200px;
  274. padding:20px;
  275. color:{color:text};
  276. border:1px solid {color:border};
  277. font-size:30px;
  278. text-align:center;
  279. background-color:rgba(255, 255, 255, 0.4);
  280. box-shadow:inset 0 0 0 0 {color:enter bg};
  281. -webkit-transition:all ease 0.8s;
  282. -moz-transition:all ease 0.8s;
  283. -o-transition:all ease 0.8s;
  284. transition:all ease 0.8s;
  285. }
  286.  
  287. #scroll:hover {color:{color:text};box-shadow:inset 0 100px 0 0 {color:enter bg};}
  288.  
  289. /* sidebar */
  290.  
  291. @media only screen and (max-width: 1019px) {
  292. #sidebarcont {display:none;}
  293. #footercont {display:block;}
  294. #paginationtwo {display:block;}
  295. }
  296.  
  297. @media only screen and (min-width: 1020px) {
  298. #sidebarcont {display:block;}
  299. #footercont {display:none;}
  300. #paginationtwo {display:none;}
  301. }
  302.  
  303. #sidebarcont {
  304. {block:IndexPage}
  305. {block:ifnotshowheader}
  306. position:fixed;
  307. top:calc(50% - 115px);
  308. {/block:ifnotshowheader}
  309. {block:ifshowheader}
  310. position:absolute;
  311. top:calc(100vh + 50% - 115px);
  312. {/block:ifshowheader}
  313. height:230px;
  314. {/block:IndexPage}
  315. {block:PermalinkPage}
  316. position:fixed;
  317. top:calc(50% - 87px);
  318. height:174px;
  319. {/block:PermalinkPage}
  320. left:70px;
  321. width:270px;
  322. z-index:99;
  323. }
  324.  
  325. .sticky {position:fixed!important;top:calc(50% - 115px)!important;}
  326.  
  327. #sidebar {
  328. width:270px;
  329. height:174px;
  330. background-color:rgba(255, 255, 255, 0.4);
  331. border:1px solid {color:border};
  332. -webkit-transition:all ease 0.8s;
  333. -moz-transition:all ease 0.8s;
  334. -o-transition:all ease 0.8s;
  335. transition:all ease 0.8s;
  336. overflow:auto;
  337. }
  338.  
  339. #sidebar:hover {background-color:rgba(255, 255, 255, 1);}
  340.  
  341. #sidebaricon {
  342. position:relative;
  343. float:left;
  344. width:50px;
  345. height:50px;
  346. margin:12px 10px 10px 15px;
  347. z-index:9;
  348. }
  349.  
  350. #sidebaricon img {
  351. width:50px;
  352. height:50px;
  353. border-radius:50%;
  354. opacity:1;
  355. -moz-transition-duration:1s;
  356. -webkit-transition-duration:1s;
  357. -o-transition-duration:1s;
  358. }
  359.  
  360. #sidebaricon img:hover {
  361. cursor:help;
  362. opacity:0.6;
  363. -moz-transition-duration:1s;
  364. -webkit-transition-duration:1s;
  365. -o-transition-duration:1s;
  366. }
  367.  
  368. #sidebartitle {
  369. position:relative;
  370. width:250px;
  371. min-height:75px;
  372. margin:0 auto 10px auto;
  373. padding:30px 0 10px 0;
  374. border-bottom:1px solid {color:border};
  375. font-family:'Roboto Condensed', sans-serif;
  376. font-size:15px;
  377. line-height:15px;
  378. letter-spacing:2px;
  379. text-align:center;
  380. text-transform:uppercase;
  381. }
  382.  
  383. #sidebarnav {width:250px;margin:0 auto 10px auto;text-align:center;}
  384.  
  385. #sidebarnav a {display:inline-block;padding:0 5px;color:{color:nav links};}
  386.  
  387. #sidebarnav a:hover {color:{color:nav links hover};}
  388.  
  389. #sidebardesc {
  390. width:250px;
  391. margin:0 auto 10px auto;
  392. padding-top:10px;
  393. border-top:1px solid {color:border};
  394. text-transform:uppercase;
  395. }
  396.  
  397. #pagination {width:270px;margin-top:20px;font-size:15px;text-align:center;}
  398.  
  399. #pagination a {
  400. display:inline-block;
  401. margin:0 10px;
  402. padding:10px;
  403. border:1px solid {color:border};
  404. background-color:rgba(255, 255, 255, 0.4);
  405. -webkit-transition:all ease 0.8s;
  406. -moz-transition:all ease 0.8s;
  407. -o-transition:all ease 0.8s;
  408. transition:all ease 0.8s;
  409. }
  410.  
  411. #pagination a:hover {background-color:rgba(255, 255, 255, 1);}
  412.  
  413. #paginationtwo {
  414. position:relative;
  415. width:540px;
  416. margin:40px auto 0 auto;
  417. color:{color:nav links};
  418. font-size:25px;
  419. text-align:center;
  420. }
  421.  
  422. #paginationtwo a {
  423. display:inline-block;
  424. margin:0 20px;
  425. color:{color:nav links};
  426. }
  427.  
  428. #paginationtwo a:hover {color:{color:nav links hover};}
  429.  
  430. /* footer */
  431.  
  432. #footercont {
  433. position:relative;
  434. width:100%;
  435. height:100px;
  436. background-color:rgba(255, 255, 255, 0.4);
  437. border-top:1px solid {color:border};
  438. -webkit-transition:all ease 0.8s;
  439. -moz-transition:all ease 0.8s;
  440. -o-transition:all ease 0.8s;
  441. transition:all ease 0.8s;
  442. }
  443.  
  444. #footercont:hover {background-color:rgba(255, 255, 255, 1);}
  445.  
  446. #footerinfo {width:550px;height:80px;margin:10px auto;overflow:hidden;}
  447.  
  448. #footerinfo div {display:inline-block;}
  449.  
  450. #footericon {
  451. width:95px;
  452. height:80px;
  453. margin-right:10px;
  454. padding-right:15px;
  455. border-right:1px solid {color:border};
  456. }
  457.  
  458. #footericon img {width:80px;height:80px;border-radius:50%;}
  459.  
  460. #footerdesc {
  461. width:250px;
  462. height:80px;
  463. padding:15px 15px 5px 5px;
  464. border-right:1px solid {color:border};
  465. text-transform:uppercase;
  466. overflow:auto;
  467. }
  468.  
  469. #footernav {
  470. width:180px;
  471. height:80px;
  472. padding-top:15px;
  473. text-align:center;
  474. overflow:auto;
  475. }
  476.  
  477. #footernav a {display:inline-block;margin:5px 10px;color:{color:nav links};}
  478.  
  479. #footernav a:hover {color:{color:nav links hover};}
  480.  
  481. /* posts */
  482.  
  483. #themecontainer {
  484. position:relative;
  485. width:100%;
  486. min-height:100vh;
  487. padding:80px 0;
  488. }
  489.  
  490. @media only screen and (max-width: 1019px) {
  491. #container {width:540px;margin:0 auto;}
  492.  
  493. .posts {
  494. {block:IndexPage}
  495. position:relative!important;
  496. top:inherit!important;
  497. left:inherit!important;
  498. margin:0 auto 80px auto;
  499. {/block:IndexPage}
  500. {block:PermalinkPage}
  501. margin:0 auto 40px auto;
  502. {/block:PermalinkPage}
  503. }
  504. }
  505.  
  506. @media only screen and (min-width: 1020px) and (max-width: 1719px) {
  507. #container {width:540px;margin-left:410px;}
  508.  
  509. .posts {
  510. {block:IndexPage}
  511. position:relative!important;
  512. top:inherit!important;
  513. left:inherit!important;
  514. margin:0 auto 80px auto;
  515. {/block:IndexPage}
  516. {block:PermalinkPage}
  517. margin:0 auto 40px auto;
  518. {/block:PermalinkPage}
  519. }
  520. }
  521.  
  522. @media only screen and (min-width: 1720px) {
  523. #container {
  524. {block:IndexPage}width:calc(100% - 410px);{/block:IndexPage}
  525. {block:PermalinkPage}width:540px;{/block:PermalinkPage}
  526. margin-left:410px;
  527. }
  528.  
  529. .posts {
  530. {block:IndexPage}
  531. float:left;
  532. opacity:0;
  533. z-index:-1;
  534. margin:0 40px 80px 40px;
  535. {/block:IndexPage}
  536. {block:PermalinkPage}
  537. margin:0 auto 40px auto;
  538. {/block:PermalinkPage}
  539. }
  540. }
  541.  
  542. .posts {
  543. width:540px;
  544. padding:20px;
  545. background-color:rgba(255, 255, 255, 0.4);
  546. border:1px solid {color:border};
  547. -webkit-transition:all ease 0.8s;
  548. -moz-transition:all ease 0.8s;
  549. -o-transition:all ease 0.8s;
  550. transition:all ease 0.8s;
  551. }
  552.  
  553. .posts:hover {background-color:rgba(255, 255, 255, 1);}
  554.  
  555. .topbar {
  556. width:500px;
  557. height:40px;
  558. margin-bottom:10px;
  559. border-bottom:1px solid {color:border};
  560. {block:PermalinkPage}display:none;{/block:PermalinkPage}
  561. }
  562.  
  563. .postinfo {
  564. padding-top:10px;
  565. font-size:12px;
  566. letter-spacing:3px;
  567. text-align:center;
  568. text-transform:uppercase;
  569. }
  570.  
  571. .postinfo a {color:{color:text};}
  572. .postinfo a:hover {color:{color:link};}
  573.  
  574. /* posts - text */
  575.  
  576. .text {padding:1px 0;}
  577.  
  578. .caption {
  579. {block:ifnotshowcaptions}
  580. {block:IndexPage}display:none;{/block:IndexPage}
  581. {/block:ifnotshowcaptions}
  582. margin-top:5px;
  583. }
  584.  
  585. .tumblr_parent {
  586. margin:0;
  587. padding:1px 0;
  588. background-color:{color:post bg};
  589. border-left:none;
  590. border-top:1px solid {color:border};
  591. }
  592.  
  593. .tumblr_parent:first-child {border-top:none;}
  594.  
  595. .tumblr_avatar {
  596. display:inline-block;
  597. vertical-align:middle;
  598. width:25px;
  599. height:25px;
  600. margin:15px 10px 0 10px;
  601. border-radius:50%;
  602. }
  603.  
  604. .tumblr_parent a.tumblr_blog {display:inline-block;vertical-align:-8px;}
  605.  
  606. .tcap .tumblr_parent:first-child .tumblr_avatar {margin-top:0px;}
  607. .tcap .tumblr_parent:first-child a.tumblr_blog {vertical-align:-1px;}
  608.  
  609. .posts ul, ol {margin-left:15px;padding:0!important;}
  610.  
  611. .posts li {margin:0 10px;}
  612.  
  613. .posts h1 {
  614. color:{color:h1 text};
  615. padding:10px;
  616. font-size:14px;
  617. font-family:'Roboto', sans-serif;
  618. text-align:left;
  619. text-transform:uppercase;
  620. letter-spacing:1px;
  621. }
  622.  
  623. .posts h1 a {color:{color:link};}
  624. .posts h1 a:hover {color:{color:text};}
  625.  
  626. .unnest h1, .text h1 {color:{color:text};margin:10px 0 5px 10px;}
  627.  
  628. /* posts - embeds */
  629.  
  630. .posts img:not(.tumblr_avatar), .posts iframe:not(.like_toggle) {
  631. display:block;
  632. vertical-align:middle;
  633. max-width:500px;
  634. }
  635.  
  636. .posts img:not(.tumblr_avatar) {height:auto;}
  637.  
  638. .text img, .tumblr_parent img:not(.tumblr_avatar),
  639. .text iframe, .tumblr_parent iframe, .text video, .tumblr_parent video {
  640. max-width:calc(500px - 20px)!important;
  641. margin-left:10px;
  642. margin-bottom:10px;
  643. }
  644.  
  645. .tumblr_parent img:not(.tumblr_avatar), .tumblr_parent iframe, .tumblr_parent video {
  646. margin-top:10px;
  647. margin-bottom:10px;
  648. }
  649.  
  650. blockquote:not(.tumblr_parent) img,
  651. blockquote:not(.tumblr_parent) iframe,
  652. blockquote:not(.tumblr_parent) video {
  653. max-width:calc(100% - 20px)!important;
  654. margin:0 0 0 10px!important;
  655. }
  656.  
  657. iframe#ask_form {max-width:500px!important;margin:0;}
  658.  
  659. iframe#submit_form {margin-bottom:10px;}
  660.  
  661. /* posts - quotes */
  662.  
  663. h2 {
  664. margin:0;
  665. padding:10px;
  666. text-align:center;
  667. font-size:14px;
  668. word-spacing:2px;
  669. line-height:17px;
  670. text-transform:uppercase;
  671. font-family:'Roboto', sans-serif;
  672. }
  673.  
  674. #source {padding:0 10px 10px 10px;text-align:center;}
  675.  
  676. /* posts - chats */
  677.  
  678. #chat ol {margin:0;}
  679.  
  680. .line {list-style:none;padding:5px 0;}
  681.  
  682. .line:first-child {padding-top:10px;}
  683. .line:last-child {padding-bottom:7px;}
  684.  
  685. .label {font-weight:bold;}
  686.  
  687. /* posts - photos */
  688.  
  689. #pphotos img {width:500px!important;}
  690.  
  691. /* posts - audio */
  692.  
  693. #audio {
  694. height:100px;
  695. font-family:'Roboto Condensed', sans-serif;
  696. font-size:10px;
  697. line-height:25px;
  698. }
  699.  
  700. #albumart {
  701. float:left;
  702. width:90px;
  703. height:90px;
  704. margin:5px 20px 0 10px;
  705. }
  706.  
  707. #albumart img {width:90px;height:90px;border-radius:50%;}
  708.  
  709. #audioplayerbg {
  710. position:absolute;
  711. width:90px;
  712. height:90px;
  713. margin:5px 10px 0 10px;
  714. padding:10px;
  715. background-color:#fff;
  716. border-radius:50%;
  717. opacity:0.5;
  718. -moz-transition-duration:1s;
  719. -webkit-transition-duration:1s;
  720. -o-transition-duration:1s;
  721. }
  722.  
  723. #audioplayerbg:hover {
  724. opacity:0.4;
  725. -moz-transition-duration:1s;
  726. -webkit-transition-duration:1s;
  727. -o-transition-duration:1s;
  728. }
  729.  
  730. #audioplayer {
  731. width:30px;
  732. height:30px;
  733. margin:20px auto;
  734. overflow:hidden;
  735. }
  736.  
  737. #audioinfo {
  738. height:100px;
  739. padding:0 10px;
  740. background-color:{color:h1 bg};
  741. text-transform:uppercase;
  742. text-align:left;
  743. overflow-x:auto;
  744. overflow-y:hidden;
  745. }
  746.  
  747. .audiocaption {margin-top:10px;border-top:1px solid {color:border};}
  748.  
  749. .audiocaption:empty {display:none;}
  750.  
  751. /* posts - asks */
  752.  
  753. #askcont {
  754. height:74px;
  755. margin-bottom:5px;
  756. border-bottom:1px solid {color:border};
  757. overflow:auto;
  758. }
  759.  
  760. #askericon {
  761. position:relative;
  762. float:left;
  763. width:64px;
  764. height:64px;
  765. margin:0 20px 0 10px;
  766. z-index:99;
  767. }
  768.  
  769. #askericon img {
  770. width:64px;
  771. height:64px;
  772. border-radius:50%;
  773. opacity:1;
  774. -moz-transition-duration:1s;
  775. -webkit-transition-duration:1s;
  776. -o-transition-duration:1s;
  777. }
  778.  
  779. #askericon img:hover {
  780. opacity:0.5;
  781. -moz-transition-duration:1s;
  782. -webkit-transition-duration:1s;
  783. -o-transition-duration:1s;
  784. }
  785.  
  786. #asker {
  787. position:relative;
  788. margin-top:10px;
  789. font-size:15px;
  790. font-family:'Roboto', sans-serif;
  791. text-transform:uppercase;
  792. }
  793.  
  794. #ask {padding:10px;}
  795.  
  796. #replier {
  797. margin:15px 0;
  798. font-size:15px;
  799. font-family:'Roboto', sans-serif;
  800. text-align:center;
  801. text-transform:uppercase;
  802. }
  803.  
  804. .answer img:first-child {margin-top:10px;}
  805.  
  806. .replies {margin-top:5px;}
  807. .replies:empty {display:none;}
  808.  
  809. /* perma */
  810.  
  811. #perma {
  812. margin-top:5px;
  813. padding:15px 10px 0 10px;
  814. border-top:1px solid {color:border};
  815. letter-spacing:2px;
  816. text-align:center;
  817. }
  818.  
  819. .buttons {
  820. display:inline-block;
  821. width:30px;
  822. height:30px;
  823. margin:0 10px;
  824. }
  825.  
  826. .buttons img {
  827. display:inline-block!important;
  828. width:30px;
  829. height:30px;
  830. border-radius:50%;
  831. vertical-align:initial!important;
  832. }
  833.  
  834. #reblogicon img, #sourceicon img {
  835. opacity:1;
  836. -moz-transition-duration:1s;
  837. -webkit-transition-duration:1s;
  838. -o-transition-duration:1s;
  839. }
  840.  
  841. #reblogicon img:hover, #sourceicon img:hover {
  842. opacity:0.5;
  843. -moz-transition-duration:1s;
  844. -webkit-transition-duration:1s;
  845. -o-transition-duration:1s;
  846. }
  847.  
  848. #likebutton, #reblogbutton {
  849. width:30px;
  850. height:30px;
  851. vertical-align:bottom;
  852. -moz-transition-duration:1s;
  853. -webkit-transition-duration:1s;
  854. -o-transition-duration:1s;
  855. }
  856.  
  857. #likebutton:hover, #reblogbutton:hover {
  858. cursor:pointer;
  859. -moz-transition-duration:1s;
  860. -webkit-transition-duration:1s;
  861. -o-transition-duration:1s;
  862. }
  863.  
  864. {block:PermalinkPage}
  865. #perma a {color:{color:perma link};font-size:9px;padding:5px;}
  866. #perma a:first-child {padding-left:0;}
  867. #perma a:hover {color:{color:perma link hover};}
  868. {/block:PermalinkPage}
  869.  
  870. #tags {margin-top:10px;text-align:center;text-transform:uppercase;}
  871.  
  872. #tags a {
  873. padding:0 5px;
  874. color:{color:tags};
  875. font-size:9px;
  876. text-transform:none;
  877. }
  878.  
  879. #tags a:first-child {padding-left:0;}
  880. #tags a:last-child {padding-right:0;}
  881.  
  882. #tags a:hover {color:{color:tags hover};}
  883.  
  884. /* notes */
  885.  
  886. ol.notes {
  887. list-style-type:none;
  888. margin:15px 0 0 0;
  889. border-top:1px solid {color:border};
  890. text-align:left;
  891. }
  892.  
  893. ol.notes li.note {margin:5px;padding:15px 10px 0 10px;line-height:14px;}
  894.  
  895. ol.notes li.note:last-child {padding-bottom:10px;}
  896.  
  897. ol.notes li.note img.avatar {
  898. float:left;
  899. width:20px;
  900. height:20px;
  901. margin:-5px 15px 0 0;
  902. border-radius:50%;
  903. }
  904.  
  905. ol.notes li.note blockquote {padding:2px 5px;margin:5px 0 0 35px;}
  906.  
  907. /* extras */
  908.  
  909. #s-m-t-tooltip {
  910. display:block;
  911. color:{color:tooltip text};
  912. background:{color:tooltip bg};
  913. border:1px solid {color:tooltip text};
  914. max-width:150px;
  915. margin:24px 14px 7px 12px;
  916. padding:2px 5px 2px 5px;
  917. font-size:9px;
  918. line-height:11px;
  919. font-family:'Roboto Condensed', sans-serif;
  920. text-align:left;
  921. text-transform:uppercase;
  922. word-wrap:break-word;
  923. z-index:9999999999;
  924. }
  925.  
  926. ::selection {color:{color:selection text};background:{color:selection bg};}
  927.  
  928. /* credit - do not remove, alter, or move to another page */
  929.  
  930. #credit {
  931. position:fixed;
  932. bottom:14px;
  933. right:10px;
  934. text-align:center;
  935. z-index:9999;
  936. }
  937.  
  938. #credit a {
  939. color:{color:background};
  940. background-color:{color:scrollbar};
  941. padding:4px;
  942. font-size:10px;
  943. }
  944.  
  945. #credit a:hover {color:{color:scrollbar};background-color:{color:background};}
  946.  
  947. </style>
  948. </head>
  949. <body>
  950.  
  951. <div id="headercont">
  952. <div id="header">
  953. <div id="headerinfo">
  954. <div id="headericon"><a href="/" title="return home"><img src="{image:header icon}" alt="header icon"/></a></div>
  955. <div id="headertitle">{Title}</div>
  956. <div id="headernav">
  957. <a href="/">Home</a>
  958. <a href="/ask">Ask</a>
  959. <a href="/archive">Past</a>
  960. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  961. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  962. </div>
  963. <div id="headerdesc">{Description}</div>
  964. </div>
  965. <a id="scroll" href="#">Enter</a>
  966. </div>
  967. </div>
  968.  
  969. <div id="sidebarcont">
  970. <div id="sidebar">
  971. <div id="sidebaricon"><a href="/" title="return home"><img src="{image:sidebar icon}" alt="sidebar icon"/></a></div>
  972. <div id="sidebartitle">{Title}</div>
  973. <div id="sidebarnav">
  974. <a href="/">Home</a>
  975. <a href="/ask">Ask</a>
  976. <a href="/archive">Archive</a>
  977. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  978. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  979. </div>
  980. <div id="sidebardesc">{Description}</div>
  981. </div>
  982. {block:Pagination}
  983. <div id="pagination">
  984. {block:PreviousPage}<a href="{PreviousPage}">Back</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">Forth</a>{/block:NextPage}
  985. </div>
  986. {/block:Pagination}
  987. </div>
  988.  
  989. <div id="themecontainer">
  990. <div id="container">
  991. {block:Posts}
  992. <div class="posts">
  993.  
  994. <div class="topbar">
  995. <div class="postinfo"><a href="{Permalink}" title="{block:Date}{TimeAgo}{/block:Date}">{PostType} - {NoteCountwithLabel} - {DayofMonth}{DayofMonthSuffix} {Month} {Year}</a></div>
  996. </div>
  997.  
  998. {block:Text}
  999. {block:RebloggedFrom}
  1000. {block:Title}<h1>{Title}</h1>{/block:Title}
  1001. <div class="unnest tcap">{Body}</div>
  1002. {/block:RebloggedFrom}
  1003. {block:NotReblog}
  1004. {block:Title}<h1>{Title}</h1>{/block:Title}
  1005. <div class="text">{Body}</div>
  1006. {/block:NotReblog}
  1007. {/block:Text}
  1008.  
  1009. {block:Quote}
  1010. <div class="text"><h2>&quot;{Quote}&quot;</h2>
  1011. {block:Source}<div id="source">{Source}</div>{/block:Source}</div>
  1012. {/block:Quote}
  1013.  
  1014. {block:Link}
  1015. <h1><a href="{URL}"><< {Name} >></a></h1>
  1016. {block:Description}{block:RebloggedFrom}<div class="unnest">{Description}</div>{/block:RebloggedFrom}{block:NotReblog}<div class="text">{Description}</div>{/block:NotReblog}{/block:Description}{/block:Link}
  1017.  
  1018. {block:Chat}
  1019. {block:Title}
  1020. <h1>{Title}</h1>
  1021. {/block:Title}
  1022. <div id="chat">
  1023. <ol>{block:Lines}
  1024. <li class="line {Alt}">
  1025. {block:Label}
  1026. <span class="label">
  1027. <b>{Label}</b></span>
  1028. {/block:Label}{Line}</li>
  1029. {/block:Lines}
  1030. </ol></div>
  1031. {/block:Chat}
  1032.  
  1033. {block:Photo}
  1034. {LinkOpenTag}<div id="pphotos"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></div>{LinkCloseTag}{block:Caption}{block:RebloggedFrom}<div class="unnest caption">{Caption}</div>{/block:RebloggedFrom}{block:NotReblog}<div class="text caption">{Caption}</div>{/block:NotReblog}{/block:Caption}
  1035. {/block:Photo}
  1036.  
  1037. {block:Photoset}
  1038. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"/></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>{block:Caption}{block:RebloggedFrom}<div class="unnest caption">{Caption}</div>{/block:RebloggedFrom}{block:NotReblog}<div class="text caption">{Caption}</div>{/block:NotReblog}{/block:Caption}
  1039. {/block:Photoset}
  1040.  
  1041. {block:Video}
  1042. {Video-500}{block:Caption}{block:RebloggedFrom}<div class="unnest caption">{Caption}</div>{/block:RebloggedFrom}{block:NotReblog}<div class="text caption">{Caption}</div>{/block:NotReblog}{/block:Caption}
  1043. {/block:Video}
  1044.  
  1045. {block:Audio}
  1046. <div id="audio">
  1047. <div id="audioplayerbg"><div id="audioplayer">{AudioPlayerWhite}</div></div>
  1048. <div id="albumart"><span{block:AlbumArt} style="display:none;"{block:AlbumArt}><img src="//78.media.tumblr.com/9b78d1e07567414cae86f9e454b1e9f7/tumblr_inline_o39hgzRFff1rrt3vb_540.png" width="80"/></span>{block:AlbumArt}<img src="{AlbumArtURL}" width="80"/>{/block:AlbumArt}</div>
  1049. <div id="audioinfo">
  1050. <span{block:TrackName} style="display:none;"{block:TrackName}><b>Song:</b> unknown</span>{block:TrackName}<b>Song:</b> {TrackName}{/block:TrackName}
  1051. <br/><span{block:Artist} style="display:none;"{block:Artist}><b>Artist:</b> unknown</span>{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}
  1052. <br/><span{block:Album} style="display:none;"{block:Album}><b>Album:</b> unknown</span>{block:Album}<b>Album:</b> {Album}{/block:Album}
  1053. <br/><span{block:PlayCount} style="display:none;"{block:PlayCount}><b>Play count:</b> unknown</span>{block:PlayCount}<b>Play count:</b> {PlayCount}{/block:PlayCount}
  1054. </div></div>
  1055. {block:Caption}{block:RebloggedFrom}<div class="unnest caption audiocaption">{Caption}</div>{/block:RebloggedFrom}{block:NotReblog}<div class="text caption audiocaption">{Caption}</div>{/block:NotReblog}{/block:Caption}
  1056. {/block:Audio}
  1057.  
  1058. {block:Answer}
  1059. <div id="askcont">
  1060. <div id="askericon"><a href="{AskerURL}"><img src="{AskerPortraitURL-96}"/></a></div>
  1061. <div id="asker">{Asker} asked:</div>
  1062. <div id="ask">{Question}</div>
  1063. </div>
  1064. <div class="answer text">{block:Answerer}<div id="replier">{Answerer} replied:</div>{/block:Answerer}{Answer}</div>
  1065. {block:Answerer}<div class="unnest replies">{Replies}</div>{/block:Answerer}
  1066. {/block:Answer}
  1067.  
  1068. {block:Date}
  1069.  
  1070. {block:IndexPage}<div id="perma">
  1071.  
  1072. {block:ifshowlikereblogbuttons}<div class="buttons" id="likebutton">{LikeButton size="20" color="gray"}</div>{/block:ifshowlikereblogbuttons}{block:RebloggedFrom}<div class="buttons" id="reblogicon"><a href="{ReblogParentURL}" title="via {ReblogParentName}"><img src="{ReblogParentPortraitURL-30}"></a></div><div class="buttons" id="sourceicon"><a href="{ReblogRootURL}" title="© {ReblogRootName}"><img src="{ReblogRootPortraitURL-30}"></a></div>{/block:RebloggedFrom}{block:ifshowlikereblogbuttons}<div class="buttons" id="reblogbutton">{ReblogButton size="20" color="gray"}</div>{/block:ifshowlikereblogbuttons}
  1073.  
  1074. {block:ifshowtags}{block:HasTags}<div id="tags">Filed under:<br/>{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}{/block:ifshowtags}
  1075. </div>{/block:IndexPage}
  1076.  
  1077. {block:PermalinkPage}<div id="perma">
  1078. <a href="{Permalink}">{block:Date}{TimeAgo}{/block:Date}</a>
  1079. <a href="{Permalink}">{NoteCountwithLabel}</a>
  1080. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  1081. {block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}">©</a>{/block:ContentSource}
  1082. {block:HasTags}<br/><div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1083. </div>{/block:PermalinkPage}
  1084.  
  1085. {/block:Date}
  1086.  
  1087. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1088.  
  1089. </div>
  1090. {/block:Posts}
  1091.  
  1092. {block:Pagination}<div id="paginationtwo">{block:PreviousPage}| <a href="{PreviousPage}">Back</a>{/block:PreviousPage} | {block:NextPage}<a href="{NextPage}">Forth</a> |{/block:NextPage}</div>{/block:Pagination}
  1093.  
  1094. </div>
  1095. </div> <!-- #themecontainer end -->
  1096.  
  1097. <div id="footercont">
  1098. <div id="footerinfo">
  1099. <div id="footericon"><img src="{image:sidebar icon}" alt="footer icon"/></div>
  1100. <div id="footerdesc">{Description}</div>
  1101. <div id="footernav"><a href="/">Home</a><a href="/ask">Ask</a><a href="/archive">Archive</a><a href="{text:Link 1 URL}">{text:Link 1}</a><a href="{text:Link 2 URL}">{text:Link 2}</a></div>
  1102. </div>
  1103. </div>
  1104.  
  1105. <!-- jquery script -->
  1106.  
  1107. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  1108.  
  1109. <!-- tooltip script -->
  1110.  
  1111. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1112.  
  1113. <!-- pxu photosets script -->
  1114.  
  1115. <script src="//static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  1116.  
  1117. <!-- unnest captions script -->
  1118.  
  1119. <script src="//static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1120.  
  1121. <!-- masonry script -->
  1122.  
  1123. <script src="//static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1124.  
  1125. <!-- jquery -->
  1126.  
  1127. <script type="text/javascript">
  1128. $(document).ready(function(){
  1129. $('.posts').unnest({
  1130. yourCaption: ".unnest",
  1131. //your caption selector, the div wrapping {Caption}
  1132. wrapName: ".tumblr_parent",
  1133. //the name of the captions’ new wrapper
  1134. newCaptionUsername: true,
  1135. //if the user adds a new caption, following a series of captions, show their username above the caption
  1136. originalPostCaptionUsername: false,
  1137. //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  1138. tumblrAvatars: true,
  1139. //”dashboard style” caption, have the avatar of the blog next to the username
  1140. tumblrAvatarClass: ".tumblr_avatar",
  1141. //class of the avatar next to the username
  1142. usernameColon: false
  1143. //if turned to false, removes the colon at the end of usernames
  1144. });
  1145. $('.photo-slideshow').pxuPhotoset({
  1146. lightbox: true,
  1147. rounded: false,
  1148. gutter: '2px',
  1149. borderRadius: '0',
  1150. photoset: '.photo-slideshow',
  1151. photoWrap: '.photo-data',
  1152. photo: '.pxu-photo'
  1153. });
  1154. {block:IndexPage}
  1155. var $container = $('#container');
  1156. $container.masonry({ itemSelector: '.posts' });
  1157. $container.imagesLoaded(function(){
  1158. $container.masonry();
  1159. $container.find('.posts').animate({ opacity: 1, zIndex: 1 });
  1160. });
  1161. {block:ifshowheader}
  1162. var containerPosition = jQuery('#themecontainer').offset().top;
  1163. jQuery('#scroll').click(function(){
  1164. jQuery('html, body').animate({scrollTop:containerPosition}, 'slow');
  1165. return false;
  1166. });
  1167. var winH = $(window).height();
  1168. var sticky = "sticky";
  1169. $(window).scroll(function() {
  1170. if( $(window).scrollTop() > winH ) {
  1171. $("#sidebarcont").addClass(sticky);
  1172. } else {
  1173. $("#sidebarcont").removeClass(sticky);
  1174. }
  1175. });
  1176. {/block:ifshowheader}
  1177. {/block:IndexPage}
  1178. });
  1179. </script>
  1180.  
  1181. <!-- tooltips jquery -->
  1182.  
  1183. <script>
  1184. (function($){
  1185. $(document).ready(function(){
  1186. $("a[title]").style_my_tooltips({
  1187. tip_follows_cursor:true,
  1188. tip_delay_time:90,
  1189. tip_fade_speed:600,
  1190. attribute:"title"
  1191. });
  1192. });
  1193. })(jQuery);
  1194. </script>
  1195.  
  1196. <div id="credit"><a href="//the49thname.tumblr.com/" title="made by the49thname">49</a>
  1197. </div>
  1198.  
  1199. </body>
  1200. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!