API tools faq
paste
planthed

Moonlight

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