API tools faq
paste
planthed

Heathens

planthed
Jul 4th, 2016
1,877
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.58 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. ✧* 。♡ Heathens theme | @planthed | @themekid ♡ 。*✧
  4.  
  5.  
  6. — Do not delete the credit.
  7. — Do not copy or steal any code.
  8. — Do not claim as yours.
  9.  
  10. Enjoy (✿◠‿◠)
  11.  
  12. infinite scroll with masonry + pxu: @shythemes
  13. -->
  14.  
  15. <html lang="en">
  16. <head>
  17.  
  18.  
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. {block:hidden}
  23. <!--Default Variables-->
  24. <meta name="image:background" content=""/>
  25.  
  26. <meta name="color:Background" content="#ffffff"/>
  27. <meta name="color:Link" content="#000000"/>
  28. <meta name="color:Text" content="#000000"/>
  29. <meta name="color:Title" content="#000000"/>
  30.  
  31. <meta name="color:Accent" content="#BDC0DA"/>
  32. <meta name="color:Accent text" content="#000000"/>
  33. <meta name="color:Borders" content="#BDC0DA"/>
  34.  
  35. <meta name="text:Blogtitle" content="" />
  36. <meta name="text:Home label" content="home" />
  37. <meta name="text:Ask label" content="ask"/>
  38. <meta name="text:Archive label" content="Past" />
  39. <meta name="text:Extra link 1 title" content="" />
  40. <meta name="text:Extra link 1" content="http://" />
  41. <meta name="text:Extra link 2 title" content="" />
  42. <meta name="text:Extra link 2" content="http://" />
  43.  
  44. <meta name="if:White Tiny cursor" content="" />
  45. <meta name="if:Black Tiny cursor" content="" />
  46.  
  47.  
  48. {/block:hidden}
  49.  
  50.  
  51. <!---pxu script--->
  52. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  53.  
  54. <!--- tooltips script --->
  55. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  56. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  57. <script>
  58. (function($){
  59. $(document).ready(function(){
  60. $("a[title]").style_my_tooltips({
  61. tip_follows_cursor:true,
  62. tip_delay_time:90,
  63. tip_fade_speed:600,
  64. attribute:"title"
  65. });
  66. });
  67. })(jQuery);
  68. </script>
  69.  
  70.  
  71. <!-------
  72.  
  73. A FEW RULES YOU NEED TO KNOW BEFORE START EDITING THE THEME:
  74.  
  75. > You CAN'T use my themes as base
  76. > You CAN'T remove my credits, even if you edited the theme a lot.
  77. > Don't use any part of my codes without permission.
  78. > You can edit the theme as your own like and make it look too different as the original one but if you edit the theme a lot and you're having problems with it, I'll not allowed to help you.
  79.  
  80.  
  81. YOU ARE NOT ALLOWED TO USE MY CODES FOR YOUR OWN THEME OR ANY OTHER THEME
  82. BY OTHER THEME MAKER WITHOUT PERMISSION, IF YOU WANNA USE ONE OF MY CODES
  83. ASK FIRST, DON'T CLAIM AS YOURS, DON'T BE A BITCH.
  84.  
  85. ---------->
  86.  
  87.  
  88. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
  89.  
  90. <script>
  91. $(document).ready(function(){
  92. $(".show").click(function(){
  93. $(".notas").slideToggle("slow");
  94. });
  95. });
  96. </script>
  97.  
  98. <style type="text/css">
  99.  
  100.  
  101. .video, .video iframe{
  102. display:block;
  103. {block:indexpage}
  104. width:230px;
  105. height:auto;
  106. {/block:indexpage}
  107. {block:PermalinkPage}
  108. width:500px;
  109. height:auto;
  110. {/block:PermalinkPage}
  111. }
  112.  
  113. /*tooltips style*/
  114. #s-m-t-tooltip{
  115. max-width:300px;
  116. padding:7px;
  117. min-height:7px;
  118. margin:20px 0px 0px 20px;
  119. line-height:100%;
  120. border:1px solid {color:borders};
  121. background:#fff;
  122. word-wrap:break-word;
  123. word-break:break-all;
  124. opacity:1;
  125. z-index:9999999999999999999;
  126. }
  127.  
  128.  
  129. #tumblr_controls, .tmblr-iframe{
  130. position:fixed!important;
  131. top:25px!important;
  132. right:4px!important;
  133. opacity:.9;
  134. z-index:99999999999999999999999999!important;
  135. -webkit-filter:invert(100%);
  136. -moz-filter:invert(100%);
  137. -o-filter:invert(100%);
  138. -ms-filter:invert(100%);
  139. filter:invert(100%);
  140. -webkit-transition:all 0.6s ease-out;
  141. -webkit-transition: opacity 0.7s linear;
  142. -webkit-transition: all 0.8s ease-out;
  143. -moz-transition: all 0.8s ease-out;
  144. transition: all 0.8s ease-out
  145. }
  146.  
  147. #tumblr_controls, .tmblr-iframe:hover{
  148. opacity:.9;webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;
  149. -webkit-transition:all 0.6s ease-out;-webkit-filter:invert(80%); -moz-filter:invert(80%); -o-filter:invert(80%); -ms-filter:invert(80%); filter:invert(80%);
  150. }
  151.  
  152.  
  153. /*tumblr controls and lightbox*/
  154.  
  155.  
  156.  
  157. #tumblr_lightbox,.tmblr-lightbox{
  158. background:rgba({RGBcolor:background}, 0.8)!important;}
  159.  
  160. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
  161. opacity:0!important;
  162. }
  163.  
  164. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .lightbox-image {
  165. box-shadow:none!important;
  166. border-radius:0px!important;
  167. padding:0px!important;
  168. background:{color:post background}!important;
  169. border:0px solid {color:border}!important;
  170. }
  171.  
  172. ::-webkit-scrollbar{
  173. height:3px;
  174. width:11px;
  175. background:inherit;
  176. background:rgba({RGBcolor:Accent}, 0.4);
  177. border:5px solid {color:background};
  178. }
  179.  
  180. ::-webkit-scrollbar-track {background:transparent;}
  181.  
  182. ::-webkit-scrollbar-thumb {
  183. height:150px!important;
  184. background:{color:borders};
  185. border:5px solid {color:background};
  186. }
  187.  
  188. /*tiny cursor*/
  189.  
  190.  
  191. html, body, img, a {
  192. {block:ifWhiteTinycursor}
  193. cursor:url(http://static.tumblr.com/vmteopo/fhxo3gbrd/small_white_cursor.png), auto;
  194. {/block:ifWhiteTinycursor}
  195. {block:ifBlackTinyCursor}
  196. cursor: url('http://33.media.tumblr.com/tumblr_lqs4qdUu8n1qfoi4t.png'), auto;
  197. {/block:ifBlackTinyCursor}
  198. }
  199.  
  200. a:hover, a:active, iframe{
  201. {block:ifWhiteTinycursor}cursor:url(http://static.tumblr.com/vmteopo/RQ9o3gbth/small_white_cursor_help.png), crosshair;
  202. {/block:ifWhiteTinycursor}
  203. {block:ifBlackTinyCursor}
  204. cursor:url(http://static.tumblr.com/vmteopo/DH3njhg50/help_cursor.png), crosshair;
  205. {/block:ifBlackTinyCursor}
  206. }
  207.  
  208.  
  209. /*main structure*/
  210.  
  211. body{
  212. background-color:{color:background};
  213. background-image:url({image:Background});
  214. background-attachment:fixed;
  215. background-repeat:repeat;
  216. font-size:10px;
  217. letter-spacing:0px;
  218. font-family:Karla, sans-serif;
  219. color:{color:text};
  220. line-height:1.5em;
  221. -moz-osx-font-smoothing:grayscale;
  222. -webkit-font-smoothing:antialiased;
  223. font-smoothing:antialiased;
  224. }
  225.  
  226.  
  227. a:link, a:active, a:visited{
  228. color:{color:link};
  229. text-decoration:none;
  230. -webkit-transition:all 0.5s linear;
  231. -moz-transition:all 0.5s linear;
  232. transition:all 0.5s linear;
  233. }
  234.  
  235. a:hover {color:{color:text};}
  236.  
  237.  
  238. .center {
  239. position:relative;
  240. margin:50px auto;
  241. width:calc(550px + 120px);
  242. {block:PermalinkPage}
  243. width:calc(400px + 200px);
  244. {/block:PermalinkPage}
  245. }
  246.  
  247. #posts{
  248. position:relative;
  249. {block:PermalinkPage}
  250. margin-top:100px;
  251. {/block:PermalinkPage}
  252. }
  253.  
  254.  
  255. .entry {
  256. overflow:hidden;
  257. margin:35px;
  258. background:#fff;
  259. padding:15px;
  260. border:1px solid {color:borders};
  261. {block:indexpage}
  262. width:230px;
  263. opacity:0;
  264. z-index:-1;
  265. {/block:indexpage}
  266. {block:PermalinkPage}
  267. width:500px;
  268. padding-bottom:0px;
  269. {/block:PermalinkPage}
  270. }
  271.  
  272.  
  273. .entry img{
  274. max-width:100%;
  275. display:block;
  276. position:relative;
  277. overflow:hidden;
  278. }
  279.  
  280. #zoom{
  281. position:relative;
  282. overflow:hidden;
  283. }
  284.  
  285. .entry #zoom img{
  286. display:block;
  287. height:auto;
  288. -webkit-transition:opacity 0.5s linear;
  289. -webkit-transition:all 0.5s linear;
  290. -moz-transition:all 0.5s linear;
  291. transition:all 0.5s linear;
  292. -webkit-transform: scale(1.2);
  293. -moz-transform: scale(1.2);
  294. -o-transform: scale(1.2);
  295. transform: scale(1.2);
  296. }
  297.  
  298. .entry:hover #zoom img{
  299. -webkit-filter: grayscale(0%);
  300. -webkit-transform: scale(1);
  301. -moz-transform: scale(1);
  302. -o-transform: scale(1);
  303. transform: scale(1);
  304. }
  305.  
  306. .mask{
  307. position:absolute;
  308. width:230px;
  309. height:calc(100% - 30px);
  310. opacity:0.0;
  311. background:black;
  312. z-index:9;
  313. -webkit-transition: all 0.4s ease;
  314. -moz-transition: all 0.4s ease;
  315. -o-transition: all 0.4s ease;
  316. transition: all 0.4s ease;
  317. }
  318.  
  319. .entry:hover .mask{
  320. opacity:0.6;
  321. -webkit-transition: all 0.4s ease;
  322. -moz-transition: all 0.4s ease;
  323. -o-transition: all 0.4s ease;
  324. transition: all 0.4s ease;
  325. }
  326.  
  327. #perm{
  328. position:absolute;
  329. z-index:10;
  330. left:25px;
  331. right:25px;
  332. top:25px;
  333. bottom:25px;
  334. overflow:hidden;
  335. opacity:0;
  336. -webkit-transition: all 0.5s ease;
  337. -moz-transition: all 0.5s ease;
  338. -o-transition: all 0.5s ease;
  339. transition: all 0.5s ease;
  340. }
  341.  
  342. .entry:hover #perm {opacity:1;}
  343.  
  344.  
  345. .line {
  346. width:0px;
  347. height:0px;
  348. border-top:1px solid #fff;
  349. border-left:1px solid #fff;
  350. -webkit-transition: all 0.5s ease;
  351. -moz-transition: all 0.5s ease;
  352. -o-transition: all 0.5s ease;
  353. transition: all 0.5s ease;
  354.  
  355. }
  356.  
  357. .line2 {
  358. position:absolute;
  359. width:0px;
  360. height:0px;
  361. border-bottom:1px solid #fff;
  362. border-right:1px solid #fff;
  363. bottom:0px;
  364. right:0px;
  365. -webkit-transition: all 0.5s ease;
  366. -moz-transition: all 0.5s ease;
  367. -o-transition: all 0.5s ease;
  368. transition: all 0.5s ease;
  369.  
  370. }
  371.  
  372. .entry:hover .line, .entry:hover .line2 {width:100%;height:100%;}
  373.  
  374. .perm1 a, .perm2 a, .perm3 a{
  375. color:#fff;
  376. }
  377.  
  378. .perm1 {
  379. width:20px;
  380. height:20px;
  381. text-align:center;
  382. position:absolute;
  383. z-index:100;
  384. top:10%;
  385. font-size:18px;
  386. margin-left:55px;
  387. opacity:0;
  388. display:inline-block;
  389. -webkit-transition: all 0.5s ease;
  390. -moz-transition: all 0.5s ease;
  391. -o-transition: all 0.5s ease;
  392. transition: all 0.5s ease;
  393. }
  394.  
  395. .entry:hover .perm1{
  396. opacity:1;
  397. top:45%;
  398. -webkit-transition-delay: 0.50s;
  399. -webkit-transition: all 0.50s;
  400. transition: all 0.50s;
  401. transition-delay: 0.50s;
  402. }
  403.  
  404. .perma1{
  405. position:absolute;
  406. text-transform:uppercase;
  407. font-family:roboto;
  408. font-weight:300;
  409. font-style:normal;
  410. font-size:14px;
  411. letter-spacing:1px;
  412. margin-top:20px;
  413. margin-left:0px;
  414. width:120px;
  415. opacity:0;
  416. visibility:hidden;
  417. -webkit-transition:opacity 0.3s linear;
  418. -webkit-transition:all 0.3s linear;
  419. -moz-transition:all 0.3s linear;
  420. transition:all 0.3s linear;
  421. }
  422.  
  423. .perm1:hover .perma1{
  424. opacity:1;
  425. visibility:visible;
  426. margin-left:0px;
  427. }
  428.  
  429. .perm2 {
  430. width:20px;
  431. height:20px;
  432. text-align:center;
  433. position:absolute;
  434. z-index:100;
  435. top:70%;
  436. font-size:18px;
  437. margin-left:105px;
  438. opacity:0;
  439. display:inline-block;
  440. -webkit-transition:all .5s ease-in-out;
  441. -moz-transition:all .5s ease-in-out;
  442. -o-transition:all .5s ease-in-out;
  443. }
  444.  
  445. .entry:hover .perm2 {
  446. opacity:1;
  447. top:45%;
  448. -webkit-transition-delay: 0.50s;
  449. -webkit-transition: all 0.50s;
  450. transition: all 0.50s;
  451. transition-delay: 0.50s;
  452. }
  453.  
  454.  
  455. .perma2{
  456. position:absolute;
  457. text-transform:uppercase;
  458. font-family:roboto;
  459. font-weight:300;
  460. font-style:normal;
  461. font-size:14px;
  462. letter-spacing:1px;
  463. margin-top:20px;
  464. margin-left:-50px;
  465. width:120px;
  466. opacity:0;
  467. visibility:hidden;
  468. -webkit-transition:opacity 0.3s linear;
  469. -webkit-transition:all 0.3s linear;
  470. -moz-transition:all 0.3s linear;
  471. transition:all 0.3s linear;
  472. }
  473.  
  474. .perm2:hover .perma2{
  475. opacity:1;
  476. visibility:visible;
  477. margin-left:-50px;
  478. }
  479.  
  480. .perm3 {
  481. width:20px;
  482. height:20px;
  483. text-align:center;
  484. position:absolute;
  485. z-index:100;
  486. top:10%;
  487. font-size:18px;
  488. margin-left:155px;
  489. opacity:0;
  490. display:inline-block;
  491. -webkit-transition:all .5s ease-in-out;
  492. -moz-transition:all .5s ease-in-out;
  493. -o-transition:all .5s ease-in-out;
  494. }
  495.  
  496. .entry:hover .perm3 {
  497. opacity:1;
  498. top:45%;
  499. -webkit-transition-delay: 0.50s;
  500. -webkit-transition: all 0.50s;
  501. transition: all 0.50s;
  502. transition-delay: 0.50s;
  503.  
  504. }
  505.  
  506.  
  507. .perma3{
  508. position:absolute;
  509. text-transform:uppercase;
  510. font-family:roboto;
  511. font-weight:300;
  512. font-style:normal;
  513. font-size:14px;
  514. letter-spacing:1px;
  515. margin-top:20px;
  516. margin-left:-100px;
  517. width:120px;
  518. opacity:0;
  519. visibility:hidden;
  520. -webkit-transition:opacity 0.3s linear;
  521. -webkit-transition:all 0.3s linear;
  522. -moz-transition:all 0.3s linear;
  523. transition:all 0.3s linear;
  524. }
  525.  
  526. .perm3:hover .perma3{
  527. opacity:1;
  528. visibility:visible;
  529. margin-left:-100px;
  530. }
  531.  
  532.  
  533. pre {
  534. white-space: pre-wrap;
  535. white-space: -moz-pre-wrap;
  536. white-space: -pre-wrap;
  537. white-space: -o-pre-wrap;
  538. word-wrap: break-word;
  539. }
  540.  
  541. p {margin:5px 0;}
  542.  
  543. p:first-of-type {
  544. margin-top:0;
  545. padding-top:0;
  546. }
  547.  
  548. p:last-of-type {
  549. margin-bottom:0;
  550. padding-bottom:0;
  551. }
  552.  
  553.  
  554. small, big {font-size:1em;}
  555.  
  556. h1, h2, h3, h4 {
  557. font-size:2em;
  558. line-height:24px;
  559. margin:0;
  560. padding:0;
  561. }
  562.  
  563.  
  564. .back{
  565. padding:0px;
  566. }
  567.  
  568. .etext{
  569. padding:5px;
  570. }
  571.  
  572. .back a, .a a{
  573. color:{color:text};
  574. border-bottom:1px solid {color:borders};
  575. }
  576.  
  577. .back a:hover, .a a:hover{
  578. color:{color:link};
  579. border-bottom:1px solid {color:link};
  580. }
  581.  
  582. .permalinktext{
  583. margin-left:-15px;
  584. width:calc(100% + 17px);
  585. display:block;
  586. text-decoration:none;
  587. text-transform:uppercase;
  588. letter-spacing:1px;font-size:8px;
  589. border-top:1px solid {color:borders};
  590. padding-right:7px;
  591. padding-top:7px;
  592. padding-left:7px;
  593. margin-top:15px;
  594. height:6px;
  595. line-height:16px;
  596. }
  597.  
  598. .permalinktext a{
  599. color:{color:link};
  600. }
  601.  
  602. .permalinktext a:hover{
  603. color:{color:text};
  604. letter-spacing:3px;font-weight:700;
  605. }
  606.  
  607. /*audio player*/
  608.  
  609.  
  610. #audio {
  611. width:auto;
  612. margin:0px;
  613. height:auto;
  614. min-height:60px;
  615. line-height:20px;
  616. }
  617. .cover {
  618. z-index:1;
  619. width:70px;
  620. height:70px;
  621. position:absolute;
  622. }
  623. .cover img {
  624. float:left;
  625. position:absolute;
  626. border-radius:0px;
  627. width:70px;
  628. height:70px;
  629. }
  630.  
  631. .playbox {
  632. position:absolute;
  633. z-index:9;
  634. background:black;
  635. opacity:0;
  636. width:70px;
  637. height:70px;
  638. -webkit-transition:opacity 0.5s linear;
  639. -webkit-transition:all 0.5s linear;
  640. -moz-transition:all 0.5s linear;
  641. transition:all 0.5s linear;
  642. }
  643.  
  644. .entry:hover .playbox{
  645. opacity:.8;
  646. -webkit-transition:opacity 0.5s linear;
  647. -webkit-transition:all 0.5s linear;
  648. -moz-transition:all 0.5s linear;
  649. transition:all 0.5s linear;
  650. }
  651.  
  652. .button {
  653. position:relative;
  654. z-index: 1000;
  655. overflow:hidden;
  656. width:25px;
  657. height:25px;
  658. margin:20px 20px 20px 20px;
  659. }
  660.  
  661.  
  662. .info {
  663. margin-left:70px;
  664. margin-top:0px;
  665. font-size:11px;
  666. letter-spacing:2px;
  667. text-align:right;
  668. text-transform:uppercase;
  669. line-height:25px;
  670. background:{color:Accent};
  671. color:{color:Accent text};
  672. padding:10px;
  673. }
  674.  
  675. /*title*/
  676.  
  677. .title{
  678. padding:8px;
  679. padding-left:11px;
  680. margin-bottom:10px;
  681. font-family:Quicksand, serif;
  682. font-size:17px;
  683. color:{color:Accent text};
  684. background:{color:Accent};
  685. text-transform:uppercase;
  686. letter-spacing:1px;
  687. line-height:28px;
  688. }
  689.  
  690. .title a{
  691. color:{color:Accent text};
  692. }
  693.  
  694. /*blockquote & quote*/
  695.  
  696. blockquote{
  697. border-left:1px solid {color:borders};
  698. margin:5px;
  699. padding-left:10px;
  700. line-height:15px;
  701. }
  702.  
  703. .quote{
  704. font-size:12px;
  705. font-style:italic;
  706. line-height:20px;
  707. padding:7px;
  708. background:{color:Accent};
  709. color:{color:Accent text};
  710. }
  711.  
  712. .cite{
  713. line-height:15px;
  714. text-align:right;
  715. font-family:9px;
  716. font-style:italic;
  717. padding:10px;
  718. padding-bottom:7px;
  719. background:rgba({RGBcolor:Accent}, 0.7);
  720. color:{color:Accent text};
  721. }
  722.  
  723. .cite a{
  724. color:{color:Accent text};
  725. }
  726.  
  727. /*ask style*/
  728.  
  729.  
  730. .as{
  731. color:{color:text};
  732. letter-spacing:0px;
  733. text-transform:uppercase;
  734. letter-spacing:1px;
  735. padding:10px;
  736. font-family:roboto;
  737. font-size:10px;
  738. text-align:center;
  739. overflow:hidden;
  740. background:{color:Accent};
  741. color:{color:Accent text};
  742. }
  743.  
  744. .as a{color:{color:Accent text};}
  745.  
  746. .q{
  747. margin-top:10px;
  748. margin-bottom:10px;
  749. line-height:14px;
  750. }
  751.  
  752. .qline{
  753. height:1px;
  754. display:block;
  755. width:50%;
  756. margin-left:25%;
  757. background:{color:borders};
  758. }
  759.  
  760. .a{
  761. line-height:14px;
  762. margin-top:10px;
  763. }
  764.  
  765. .a img{
  766. width:100%;
  767. height:auto;
  768. }
  769.  
  770.  
  771. .pagination{
  772. bottom:0px;
  773. display:block;
  774. margin:5px;
  775. }
  776. /*chat styling*/
  777.  
  778. .user_1, .user_3, .user_5, .user_7, .user_9, .user_11, .user_13, .user_15, .user_17, .user_19, .user_21, .user_23, .user_25, .user_27, .user_29, .user_31, .user_33, .user_35, .user_37, .user_39, .user_41, .user_43, .user_45, .user_47, .user_49, .user_51, .user_53, .user_55, .user_57, .user_59, .user_61, .user_63, .user_65, .user_67, .user_69, .user_71, .user_73, .user_75, .user_77, .user_79, .user_81, .user_83, .user_85, .user_87, .user_89, .user_91, .user_93, .user_95, .user_97, .user_99, .user_101, .user_103, .user_105, .user_107, .user_109, .user_111, .user_113, .user_115, .user_117, .user_119, .user_121, .user_123, .user_125, .user_127, .user_129, .user_131, .user_133, .user_135, .user_137, .user_139, .user_141, .user_143, .user_145, .user_147, .user_149{
  779. background:rgba({RGBcolor:Accent}, 1);
  780. padding:7px;
  781. color:{color:Accent text};}
  782.  
  783. .user_2, .user_4, .user_6, .user_8, .user_10, .user_12, .user_14, .user_16, .user_18, .user_20, .user_22, .user_24, .user_26, .user_28, .user_30, .user_32, .user_34, .user_36, .user_38, .user_40, .user_42, .user_44, .user_46, .user_48, .user_50, .user_52, .user_54, .user_56, .user_58, .user_60, .user_62, .user_64, .user_66, .user_68, .user_70, .user_72, .user_74, .user_76, .user_78, .user_80, .user_82, .user_84, .user_86, .user_88, .user_90, .user_92, .user_94, .user_96, .user_98, .user_100, .user_102, .user_104, .user_106, .user_108, .user_110, .user_112, .user_114, .user_116, .user_118, .user_120, .user_122, .user_124, .user_126, .user_128, .user_130, .user_132, .user_134, .user_136, .user_138, .user_140, .user_142, .user_144, .user_146, .user_148, .user_150{
  784. background:rgba({RGBcolor:Accent}, 0.6);
  785. padding:7px;
  786. color:{color:Accent text};}
  787.  
  788.  
  789. .back li, .a li{position:relative;display:block;}
  790. .back li:before, .a li:before{content:'―';font-size:10px;position:absolute;left:-15px;color:{color:borders};top:0px;}
  791.  
  792.  
  793. /*permalink notes*/
  794.  
  795. .caption{
  796. padding-top:10px;
  797. padding-bottom:10px;
  798. }
  799.  
  800.  
  801. .l{
  802. display:block;
  803. border-top:1px solid {color:borders};
  804. margin-left:-15px;
  805. width:calc(100% + 30px);
  806. }
  807.  
  808.  
  809. .inf{
  810. display:block;
  811. margin-top:10px;
  812. margin-bottom:5px;
  813. line-height:17px;
  814. }
  815.  
  816. .tg{display:block;}
  817. .tg a:after{content:',';}
  818. .tg a:last-of-type:after {content:'.';}
  819. .inf a, .notas a, .tg a{color:{color:text};}
  820. .inf a:hover, .notas a:hover, .tg a:hover{color:{color:link};}
  821.  
  822. .notas{
  823. margin-top:0px;
  824. display:none;
  825. padding:0px;margin-left:-15px;
  826. width:calc(100% + 30px);
  827. color:{color:text};
  828. }
  829.  
  830.  
  831.  
  832. ol.notes {
  833. padding:0px!important;
  834. margin: 0;
  835. list-style-type: none;
  836. }
  837. ol.notes li.note {
  838. padding:8px;
  839. border-top:1px solid {color:borders};
  840. }
  841. ol.notes li.note img.avatar {
  842. float:right;
  843. border-radius:50%;
  844. padding:0px!important;
  845. border:1px solid #fff;
  846. }
  847. ol.notes li.note blockquote a {
  848. text-decoration: none;
  849. }
  850. li.more_notes_link_container {
  851. text-transform: uppercase;
  852. font-size:1em;
  853. letter-spacing:1px;
  854. }
  855.  
  856. li.more_notes_link_container:hover{
  857. letter-spacing:4px;
  858. }
  859.  
  860. img:not(.lightbox-image) {
  861. max-width:100%;
  862. height:auto;
  863. }
  864.  
  865. #top{
  866. position:fixed;
  867. top:0px;
  868. left:0px;
  869. width:100%;
  870. height:15px;
  871. background:{color:Accent};
  872. z-index:999999;
  873. }
  874.  
  875. #top2{
  876. position:fixed;
  877. top:15px;
  878. left:20px;
  879. width:100%;
  880. height:5px;
  881. border-bottom:1px solid {color:Accent};
  882. background:{color:background};
  883. z-index:999999;
  884. }
  885.  
  886.  
  887. #left{
  888. position:fixed;
  889. top:0px;
  890. left:0px;
  891. width:15px;
  892. height:100%;
  893. background:{color:Accent};
  894. z-index:999999;
  895. }
  896.  
  897. #left2{
  898. position:fixed;
  899. top:20px;
  900. left:20px;
  901. width:1px;
  902. height:100%;
  903. background:{color:Accent};
  904. z-index:999999;
  905. }
  906.  
  907.  
  908.  
  909. #sidebar {
  910. width:160px;
  911. height:auto;
  912. border:1px solid {color:borders};
  913. position:fixed;
  914. background:white;
  915. margin-left:calc(20px - 260px);
  916. top:180px;
  917. z-index:999999;
  918. padding:15px;
  919. height:auto;
  920. }
  921.  
  922.  
  923. .titulo {
  924. color:{color:title};
  925. margin-top:-25px;
  926. margin-left:0px;
  927. font-family:quicksand;
  928. font-size:23px;
  929. text-transform:uppercase;
  930. z-index:999999;
  931. text-align:left;
  932. width:auto;
  933. padding:3px;
  934. background:{color:background};
  935. position:absolute; }
  936.  
  937. .desc{
  938. margin:4px;
  939. padding:10px;
  940. background:{color:Accent};
  941. color:{color:Accent text};
  942. }
  943.  
  944. .desc a{
  945. color:{color:Accent text};
  946. }
  947.  
  948.  
  949. .nav{
  950. position:fixed;
  951. height:19px;
  952. z-index:-9999999999999;
  953. margin-top:3px;
  954. margin-left:30px;
  955. opacity:1;
  956. transition:0.4s;
  957. }
  958.  
  959.  
  960. .nav a{
  961. font-size:13px;
  962. display:inline-block;
  963. margin-left:-1px;
  964. text-align:center;
  965. width:17px;
  966. height:14px;
  967. margin-right:-2px;
  968. padding:5px;
  969. color:{color:Accent};
  970. background:{color:background};
  971. -webkit-transition:All 0.3s ease-in-out;
  972. }
  973.  
  974. .nav a:hover{
  975. color:{color:Accent text};
  976. background:{color:Accent};
  977. }
  978.  
  979.  
  980.  
  981. </style>
  982. </head>
  983.  
  984. <body>
  985.  
  986.  
  987. <div id="top"></div>
  988. <div id="top2"></div>
  989. <div id="left"></div>
  990. <div id="left2"></div>
  991.  
  992. <div class="center">
  993.  
  994. <div id="sidebar">
  995. <div class="titulo">{text:blogtitle}</div>
  996. <div class="desc">
  997. {description}
  998. </div>
  999. <div class="nav">
  1000. <a title="{text:Home Label}" href="/"><i class="fa fa-home"></i></a>
  1001. <a title="{text:Ask Label}" href="/ask"><i class="fa fa-envelope"></i></a>
  1002. <a title="{text:Extra link 1 Title}" href="{text:Extra link 1}"><i class="fa fa-link"></i></a>
  1003. <a title="{text:Extra link 2 Title}" href="{text:Extra link 2}"><i class="fa fa-tags"></i></a>
  1004. <a title="{text:Archive Label}" href="/archive"><i class="fa fa-calendar"></i></a>
  1005. </div>
  1006. </div>
  1007.  
  1008.  
  1009. <div id="posts">
  1010. {block:Posts}
  1011. <div class="entry">
  1012.  
  1013. {block:Text}
  1014. {block:Title}<div class="title">{Title}</div>{/block:Title}
  1015. <div class="back">{Body}</div>
  1016. {block:IndexPage}
  1017. <div class="permalinktext">
  1018. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1019. {/block:IndexPage}
  1020. {/block:Text}
  1021.  
  1022.  
  1023. {block:Link}
  1024. <div class="title">
  1025. <a href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></div>
  1026. <div class="back">{block:Description}{Description}{/block:Description}
  1027. </div>{block:IndexPage}
  1028. <div class="permalinktext">
  1029. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1030. {/block:IndexPage}
  1031. {block:Link}
  1032.  
  1033.  
  1034. {block:Photo}
  1035. {block:IndexPage}
  1036. <div class="perm1">
  1037. <a href="{Permalink}"><i class="fa fa-calendar"></i></a>
  1038. <div class="perma1">
  1039. <a href="{Permalink}">{Month} {DayOfMonth}</a></div>
  1040. </div><div class="perm2"><a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a>
  1041. <div class="perma2"><a href="{ReblogURL}" target="_blank">reblog this</a></div>
  1042. </div>
  1043. <div class="perm3">
  1044. <a href="{Permalink}"><i class="fa fa-comments"></i></a>
  1045. <div class="perma3"><a href="{Permalink}">{NoteCountWithLabel}</a></div>
  1046. </div>
  1047. <!--
  1048. <div id="perma">
  1049. <div id="perm1">
  1050. <a href="{permalink}" target="_blank">{block:NoteCount}{notecount}{/block:NoteCount}</a></div>
  1051. <div id="perm2"><a href="{ReblogURL}" target="_blank">reblog</a>
  1052. </div>
  1053. <div id="perm3"><a href="{permalink}" target="_blank">{Month} {DayOfMonth}</a>
  1054. </div>
  1055. </div>-->
  1056. <div class="mask"></div>
  1057. <div id="perm">
  1058. <div class="line"></div>
  1059. <div class="line2"></div>
  1060. </div>
  1061. <div id="zoom">
  1062. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></div>
  1063. {/block:IndexPage}
  1064. {block:PermalinkPage}
  1065. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>
  1066. {/block:PermalinkPage}
  1067. {/block:Photo}
  1068.  
  1069.  
  1070. {block:Photoset}
  1071. <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>
  1072. {block:IndexPage}
  1073. <div class="permalinktext">
  1074. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1075. {/block:IndexPage}
  1076. {/block:Photoset}
  1077.  
  1078.  
  1079. {block:Quote}
  1080. <div class="back"><div class="quote">❝&nbsp;{quote}</div>
  1081. <div class="cite">&mdash; {Source}</div></div>
  1082. {block:IndexPage}
  1083. <div class="permalinktext">
  1084. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1085. {/block:IndexPage}
  1086. {/block:Quote}
  1087.  
  1088. {block:Chat}<div class="back">
  1089. <div class="chat">
  1090. {block:Title}<span class="title">{Title}</span></span>{/block:Title}
  1091. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<i>{Label}</i> {/block:Label}{Line}</div></div>{/block:Lines}
  1092. </div></div>
  1093. {block:IndexPage}
  1094. <div class="permalinktext">
  1095. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1096. {/block:IndexPage}
  1097. {/block:Chat}
  1098.  
  1099. {block:Audio}<div class="back">
  1100. <div id="audio">
  1101. <div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>
  1102. {block:AlbumArt}
  1103. <div class="cover"><img src="{AlbumArtURL}"></div>
  1104. {/block:AlbumArt}
  1105. <div class="playbox">
  1106. <div class="button">
  1107. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  1108. <div class="info">
  1109. <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}
  1110. <div style="text-transform:uppercase;font-size:8px;letter-spacing:2px;color:{color:Accent text};">
  1111. <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}</div>
  1112. </div>
  1113. </div></div>
  1114. {block:IndexPage}
  1115. <div class="permalinktext">
  1116. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1117. {/block:IndexPage}
  1118. {/block:Audio}
  1119.  
  1120.  
  1121. {block:Video}
  1122. <div class="video">{Video-500}</div>
  1123. {block:IndexPage}
  1124. <div class="permalinktext">
  1125. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1126. {/block:IndexPage}
  1127. {/block:Video}
  1128.  
  1129.  
  1130. {block:Answer}<div class="back">
  1131. <div class="as">{Asker} asked:</div>
  1132. <div class="q">{Question}</div>
  1133. <div class="qline"></div>
  1134. <div class="a">{Answer}</div></div>
  1135. {block:IndexPage}
  1136. <div class="permalinktext">
  1137. Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
  1138. {/block:IndexPage}
  1139. {/block:Answer}
  1140.  
  1141.  
  1142. {block:ContentSource}<!-- {SourceURL}
  1143. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1144. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1145. {/block:ContentSource}
  1146.  
  1147. <!-- {block:NoRebloggedFrom}
  1148. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1149. {/block:NoRebloggedFrom} -->
  1150.  
  1151.  
  1152. {block:PermalinkPage}
  1153. <div class="caption">{block:Caption}{Caption}{/block:Caption}</div>
  1154. {block:Date}
  1155. <div class="l"></div>
  1156. <div class="inf">
  1157. Posted on {month} {dayofmonth}{dayofmonthsuffix} at {12hour}:{minutes}{ampm} <br>
  1158. {block:RebloggedFrom}
  1159. source: <a href="{ReblogRootURL}">{ReblogRootName}</a> <br> via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  1160. {/block:RebloggedFrom}
  1161. <div class="tg">
  1162. {block:HasTags}
  1163. tags: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;
  1164. {/block:Tags}{/block:HasTags}
  1165. </div>
  1166. <a title="show notes" class="show">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</a></div>
  1167. <div class="notas">
  1168. {block:PostNotes}
  1169. {PostNotes}
  1170. {/block:PostNotes}
  1171. {/block:Date}
  1172. </div>
  1173. {/block:PermalinkPage}
  1174. {/block:Date}
  1175. </div>
  1176. {/block:Posts}
  1177. </div>
  1178.  
  1179.  
  1180. <div class="pagination">
  1181. {block:Pagination}
  1182. {block:PreviousPage}
  1183. <a href="{PreviousPage}"></a>
  1184. {/block:PreviousPage}
  1185.  
  1186. {block:NextPage}
  1187. <a href="{NextPage}" class="next"></a>
  1188. {/block:NextPage}
  1189. {/block:Pagination}</div></div>
  1190.  
  1191. <!--Like seriously guys, DON'T TOUCH any of this scripts unless you know what it does or you will ruin your whole theme--->
  1192. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Source+Sans+Pro:400,700|Hind:400,700|Dancing+Script:400,700|Open+Sans:400,700|Muli|Kurale|PT+Serif:400,700|Old+Standard+TT:400,700|Roboto:400,700|Roboto+Condensed:400,700|Lato:400,700|Raleway:400,700,300|Montez|Karla:400,700|Quicksand:400,700|Petit+Formal+Script|Clicker+Script|Mako|Maven+Pro:400,700' rel='stylesheet' type='text/css'>
  1193. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1194. <script src ="http://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1195. <link rel="stylesheet" href="http://static.tumblr.com/8pnyeus/29To2og0o/styles.css">
  1196. <script src="http://static.tumblr.com/8pnyeus/nfIo2oh8w/l-script.js" type="text/javascript"></script>
  1197. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1198. {block:IndexPage}
  1199. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1200. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1201. {/block:IndexPage}
  1202. <script>
  1203. $(document).ready(function(){
  1204. $('.photo-slideshow').pxuPhotoset({
  1205. lightbox: true,
  1206. rounded: false,
  1207. gutter: '3px',
  1208. photoset: '.photo-slideshow',
  1209. photoWrap: '.photo-data',
  1210. photo: '.pxu-photo'
  1211. });
  1212. {block:IndexPage}
  1213. var $container = $('#posts');
  1214. $container.masonry({ itemSelector: '.entry' });
  1215. $container.imagesLoaded(function(){
  1216. $container.masonry();
  1217. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  1218. });
  1219. $container.infinitescroll({
  1220. itemSelector: '.entry',
  1221. navSelector: '.pagination',
  1222. nextSelector: '.next',
  1223. loadingImg: '',
  1224. loadingText: '<em></em>',
  1225. bufferPx: 2000
  1226. },
  1227. function( newElements ) {
  1228. var $newElems = $( newElements );
  1229. $newElems.find('.photo-slideshow').pxuPhotoset({
  1230. lightbox: true,
  1231. rounded: false,
  1232. gutter: '3px',
  1233. photoset: '.photo-slideshow',
  1234. photoWrap: '.photo-data',
  1235. photo: '.pxu-photo'
  1236. },
  1237.  
  1238. function(){
  1239. resizeVideos(); },
  1240.  
  1241. function(){
  1242. $container.masonry();
  1243. });
  1244. $newElems.imagesLoaded(function(){
  1245. $container.masonry( 'appended', $newElems );
  1246. $newElems.animate({ opacity: 1, zIndex: 1 });
  1247. });
  1248. });
  1249. {/block:IndexPage}
  1250. });
  1251. </script>
  1252. </body>
  1253. </html>
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!