API tools faq
paste
Advertisement
luciam

spacewalker - theme 06

luciam
Nov 27th, 2015
3,401
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.90 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <head>
  4.  
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6.  
  7. <title>{block:SearchPage} ({lang:Search results for SearchQuery}){/block:SearchPage}{block:TagPage}#{Tag} - {/block:TagPage}{block:PermalinkPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{/block:PermalinkPage}{Title}</title>
  8.  
  9. <link rel="shortcut icon" href="{Favicon}" />
  10.  
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  12.  
  13. <link href='http://fonts.googleapis.com/css?family={text:titles google font}' rel='stylesheet' type='text/css'>
  14. <link href='http://fonts.googleapis.com/css?family={text:text google font}' rel='stylesheet' type='text/css'>
  15.  
  16. <!-------------------------------META---------------------------------->
  17. <meta name="keywords" content="{block:Permalink}{block:Posts}{block:Tags}{Tag}, {/block:Tags}{/block:Posts}{/block:Permalink}" />
  18. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  19. <meta name="title" content="{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}" />
  20.  
  21. <meta name="image:background" content="">
  22. <meta name="image:icon" content="">
  23.  
  24. <meta name="color:background" content="#fff">
  25. <meta name="color:scrollbar" content="#666">
  26. <meta name="color:text" content="#666">
  27. <meta name="color:links" content="#666">
  28. <meta name="color:links hover" content="#93d4b4">
  29. <meta name="color:links hover bg" content="#93d4b4">
  30. <meta name="color:links hover when bg" content="#999">
  31. <meta name="color:title" content="#2b2b2b">
  32. <meta name="color:description" content="#2b2b2b">
  33. <meta name="color:sidebar" content="#2b2b2b">
  34. <meta name="color:sidebar text" content="#fff">
  35. <meta name="color:sidebar titles" content="#fff">
  36. <meta name="color:sidebar titles hover" content="#93d4b4">
  37.  
  38. <meta name="color:tooltip" content="#fff">
  39. <meta name="color:tooltip bg" content="#666">
  40.  
  41. <meta name="color:posts bg" content="#fff">
  42. <meta name="color:post title" content="#666">
  43. <meta name="color:lines" content="#d3d3d3">
  44. <meta name="color:info" content="#fff">
  45. <meta name="color:info bg" content="#2b2b2b">
  46. <meta name="color:info hover" content="#eee">
  47. <meta name="color:tags" content="#666">
  48. <meta name="color:tags hover" content"#93d4b4">
  49.  
  50. <meta name="color:lightbox bg" content="#fff" />
  51. <meta name="text:lightbox opacity" content="0.8" />
  52.  
  53. <meta name="if:grid layout" content="0" />
  54. <meta name="if:sidebar" content="1" />
  55. <meta name="if:abouttab" content="1" />
  56. <meta name="if:messagetab" content="1" />
  57. <meta name="if:linkstab" content="1" />
  58. <meta name="if:show half sidebar" content="0" />
  59. <meta name="if:fixed info" content="0" />
  60. <meta name="if:hide captions" content="0" />
  61. <meta name="if:hide tags" content="0" />
  62. <meta name="if:highlight links" content="1" />
  63.  
  64. <meta name="text:post width" content="400">
  65. <meta name="text:photoset spacing" content="0">
  66. <meta name="text:text google font" content="Open Sans">
  67. <meta name="text:titles google font" content="Roboto">
  68. <meta name="text:about" content="About text here">
  69.  
  70. <meta name="text:Link1 URL" content="/" />
  71. <meta name="text:Link1 Name" content="link 1" />
  72. <meta name="text:Link2 URL" content="/" />
  73. <meta name="text:Link2 Name" content="link 2" />
  74. <meta name="text:Link3 URL" content="/" />
  75. <meta name="text:Link3 Name" content="link 3" />
  76. <meta name="text:Link4 URL" content="/" />
  77. <meta name="text:Link4 Name" content="link 4" />
  78. <meta name="text:Link5 URL" content="/" />
  79. <meta name="text:Link5 Name" content="link 5" />
  80. <meta name="text:Link6 URL" content="/" />
  81. <meta name="text:Link6 Name" content="link 6" />
  82.  
  83. <style type="text/css">
  84.  
  85. /*--------------------------------RESET----------------------------------*/
  86.  
  87. html, body, div, span, applet, object, iframe,
  88. h1, h2, h3, h4, h5, h6, blockquote, pre,
  89. a, abbr, acronym, address, big, cite, code,
  90. del, dfn, em, img, ins, kbd, q, s, samp,
  91. small, strike, strong, sub, sup, tt, var,
  92. b, u, i, center,
  93. dl, dt, dd,
  94. fieldset, form, label, legend,
  95. table, caption, tbody, tfoot, thead, tr, th, td,
  96. article, aside, canvas, details, embed,
  97. figure, figcaption, footer, header, hgroup,
  98. menu, nav, output, ruby, section, summary,
  99. time, mark, audio, video {
  100. margin: 0;
  101. padding: 0;
  102. border: 0;
  103. font-size: 100%;
  104. font: inherit;
  105. vertical-align: baseline;
  106. }
  107.  
  108. article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{
  109. display:block;
  110. }
  111.  
  112. /*-------------------------------SCROLL----------------------------------*/
  113.  
  114. ::-webkit-scrollbar-thumb:vertical {
  115. background-color: {color:scrollbar};
  116. margin-right:20px;
  117. border:3px solid {color:background};
  118. }
  119.  
  120. ::-webkit-scrollbar-thumb:horizontal {
  121. background-color: {color:scrollbar};
  122. height:3px;
  123. border:8px solid {color:background};
  124. }
  125.  
  126. ::-webkit-scrollbar-corner {
  127. background-color: transparent;
  128. }
  129.  
  130. ::-webkit-scrollbar {
  131. background-color: {color:background};
  132. height:7px;
  133. width:7px;
  134. }
  135.  
  136. * {
  137. box-sizing: border-box;
  138. -webkit-box-sizing: border-box;
  139. -moz-box-sizing: border-box;
  140. -webkit-transition: all 0.4s ease-out;
  141. -moz-transition: all 0.4s ease-out;
  142. -ms-transition: all 0.4s ease-out;
  143. -o-transition: all 0.4s ease-out;
  144. transition: all 0.4s ease-out;
  145. }
  146.  
  147. body {
  148. -webkit-font-smoothing: antialiased;
  149. -moz-osx-font-smoothing: grayscale;
  150. }
  151.  
  152. /*-------------------------CONTROLS----------------------*/
  153. .tmblr-iframe,
  154. .tmblr-iframe--desktop-loggedin-controls,
  155. .iframe-controls--desktop {
  156. right:3px !important;
  157. position: fixed !important;
  158. opacity:0.3;
  159. width: 200px;
  160. }
  161.  
  162. .tmblr-iframe:hover,
  163. .tmblr-iframe--desktop-loggedin-controls:hover,
  164. .iframe-controls--desktop:hover {
  165. opacity:0.8;
  166. }
  167.  
  168.  
  169. /*-------------------------BLOCKQUOTE----------------------*/
  170.  
  171.  
  172. blockquote {
  173. padding:0 10px;
  174. margin:5px;
  175. border-left:1px solid {color:lines};
  176. }
  177.  
  178.  
  179. blockquote img {
  180. padding: 10px 0px;
  181. max-width:100px;
  182. height:auto;
  183. }
  184.  
  185. /*---------------------------BODY-------------------------------------*/
  186. #s-m-t-tooltip{
  187. letter-spacing:1px;
  188. max-width:150px;
  189. font-size: 8px;
  190. margin:0px 10px;
  191. padding:3px 5px;
  192. background:{color:tooltip bg};
  193. color: {color:tooltip};
  194. opacity: .8;
  195. z-index:999;
  196. text-transform:uppercase;
  197. }
  198.  
  199. html {
  200. height: 100%;
  201. }
  202.  
  203.  
  204. body {
  205. {block:ifbackgroundimage}
  206. background-image:url('{image:background}');
  207. {/block:ifbackgroundimage}
  208. background-attachment:fixed;
  209. background-repeat:repeat;
  210. margin: 0;
  211. padding: 0px;
  212. letter-spacing:0.04em;
  213. font-family: '{text:text google font}', sans-serif;
  214. font-size: 10px;
  215. word-wrap: break-word;
  216. background-color: {color:background};
  217. color: {color: text};
  218. height: 100%;
  219. line-height:1.3;
  220. }
  221.  
  222. a,
  223. a:active,
  224. a:visited,
  225. a:hover {
  226. color: {color:links};
  227. text-decoration:none;
  228. -webkit-transition: all 0.4s ease-out;
  229. -moz-transition: all 0.4s ease-out;
  230. -ms-transition: all 0.4s ease-out;
  231. -o-transition: all 0.4s ease-out;
  232. transition: all 0.4s ease-out;
  233. }
  234.  
  235.  
  236. a:hover {
  237. color: {color:links hover};
  238. }
  239.  
  240. pre {
  241. white-space: pre-wrap;
  242. white-space: -moz-pre-wrap;
  243. white-space: -pre-wrap;
  244. white-space: -o-pre-wrap;
  245. word-wrap: break-word;
  246. }
  247.  
  248. small{
  249. font-size:8px;
  250. }
  251.  
  252. big {
  253. font-size:12px;
  254. }
  255.  
  256. strong, b {
  257. font-weight:bold;
  258. }
  259.  
  260. em, i, u {
  261. font-style:italic;
  262. }
  263.  
  264. ul, ol {
  265. list-style-type:square;
  266. }
  267.  
  268. h1, h2, h3, h4, h5, h6, h7, h7 {
  269. font-family: '{text:titles google font}', sans-serif;
  270. width:100%;
  271. text-align:left;
  272. margin: 5px 0;
  273. color: {color:title};
  274. }
  275.  
  276. /*---------------------------MARKUP--------------------------------*/
  277.  
  278. #sidebar {
  279. width:400px;
  280. position:fixed;
  281. top:0;
  282. bottom:0;
  283. left:0;
  284. -webkit-transform-style: preserve-3d;
  285. -moz-transform-style: preserve-3d;
  286. transform-style: preserve-3d;
  287. }
  288.  
  289. #todo {
  290. padding:40px;
  291. margin-left: 400px;
  292. }
  293.  
  294. .phoenixt {
  295. position:fixed;
  296. bottom:20px;
  297. right:20px;
  298. text-align:center;
  299. }
  300.  
  301. /*---------------------------SIDEBAR--------------------------------*/
  302.  
  303. .sidewrapper {
  304. position:absolute;
  305. width:50%;
  306. height:100%;
  307. right:0;
  308. border-left:1px {color:lines} solid;
  309. }
  310.  
  311. .sidecontent {
  312. width:100%;
  313. position:absolute;
  314. bottom:20px;
  315. padding-left:20px;
  316. min-height:200px;
  317. }
  318.  
  319. .square {
  320. width: 60px;
  321. height: 60px;
  322. -ms-transform: rotate(-45deg);
  323. -webkit-transform: rotate(-45deg);
  324. transform: rotate(-45deg);
  325. overflow: hidden;
  326. border-radius:5px;
  327. }
  328.  
  329. .square.mainpic {
  330. float:left;
  331. margin-left:-50px;
  332. }
  333.  
  334. .square .sideimage {
  335. background: url('{image:icon}');
  336. background-size:cover;
  337. background-repeat: no-repeat;
  338. background-position: center;
  339. background-attachment:local;
  340. width: 80px;
  341. height: 80px;
  342. margin: -10px;
  343. -ms-transform: rotate(45deg);
  344. -webkit-transform: rotate(45deg);
  345. transform: rotate(45deg);
  346. }
  347.  
  348. .square.menuopener {
  349. background:{color:sidebar};
  350. width: 35px;
  351. height: 35px;
  352. margin-left: 40px;
  353. margin-top:10px;
  354. }
  355.  
  356. a.opener {
  357. display:block;
  358. cursor:pointer;
  359. height:20px;
  360. width:20px;
  361. position:absolute;
  362. margin-top:15px;
  363. margin-left:3px;
  364. -ms-transform: rotate(45deg);
  365. -webkit-transform: rotate(45deg);
  366. transform: rotate(45deg);
  367. }
  368.  
  369. #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
  370. cursor: pointer;
  371. border-radius: 1px;
  372. height: 2px;
  373. width: 17px;
  374. position: absolute;
  375. display: block;
  376. content: '';
  377. background:{color:sidebar text};
  378. }
  379.  
  380. #nav-toggle span:before {
  381. top: -6px;
  382. }
  383.  
  384. #nav-toggle span:after {
  385. bottom: -6px;
  386. }
  387.  
  388. #nav-toggle.active span {
  389. background-color: transparent;
  390. }
  391.  
  392. #nav-toggle.active span:before, #nav-toggle.active span:after {
  393. top: 0;
  394. }
  395.  
  396. #nav-toggle.active span:before {
  397. -ms-transform: rotate(45deg);
  398. -webkit-transform: rotate(45deg);
  399. transform: rotate(45deg);
  400. }
  401.  
  402. #nav-toggle.active span:after {
  403. -ms-transform: rotate(-45deg);
  404. -webkit-transform: rotate(-45deg);
  405. transform: rotate(-45deg);
  406. }
  407.  
  408. .title {
  409. font-family: '{text:titles google font}', sans-serif;
  410. width:100%;
  411. padding-right:20px;
  412. font-weight:bold;
  413. text-transform:uppercase;
  414. text-align:left;
  415. {block:ifsidebar}
  416. margin-top:30px;
  417. {/block:ifsidebar}
  418. {block:ifnotsidebar}
  419. margin-top:70px;
  420. {/block:ifnotsidebar}
  421. font-size:18px;
  422. color: {color:title};
  423. }
  424.  
  425. .title a {
  426. color: {color:title};
  427. }
  428.  
  429. .desc {
  430. font-size:10px;
  431. margin:5px 20px 0px 0px;
  432. color: {color:description};
  433. }
  434.  
  435. nav#nav {
  436. position:absolute;
  437. width:400px;
  438. {block:ifnotshowhalfsidebar}
  439. left:-400px;
  440. {/block:ifnotshowhalfsidebar}
  441. {block:ifshowhalfsidebar}
  442. left:-200px;
  443. {/block:ifshowhalfsidebar}
  444. bottom:0;
  445. top:0;
  446. background:{color:sidebar};
  447. color:{color:sidebar text};
  448. padding:30px;
  449. }
  450.  
  451. nav .navlink {
  452. margin: 0 0 10px 0;
  453. opacity:0;
  454. }
  455.  
  456. nav .navlink.show-nav {
  457. opacity:1;
  458. }
  459.  
  460. nav .navlink a.head {
  461. font-family: '{text:titles google font}', sans-serif;
  462. width:160px;
  463. text-transform:uppercase;
  464. font-size:12px;
  465. letter-spacing:0.1em;
  466. font-weight:bold;
  467. display:block;
  468. padding:10px 0px;
  469. border-bottom:1px solid {color:sidebar titles};
  470. cursor:pointer;
  471. color:{color:sidebar titles};
  472. }
  473.  
  474. nav .navlink a.head:hover,
  475. nav .navlink a.head.toggleactive {
  476. width:340px;
  477. color:{color:sidebar titles hover};
  478. border-color:{color:sidebar titles hover};
  479. }
  480.  
  481. nav .navlink .navlink-toggle {
  482. width:340px;
  483. padding:10px 0px;
  484. display:none;
  485. -webkit-transition: none;
  486. -moz-transition: none;
  487. -ms-transition: none;
  488. -o-transition: none;
  489. transition: none;
  490. }
  491.  
  492.  
  493. .linkslist {
  494. list-style:none;
  495. padding:0;
  496. margin:0;
  497. }
  498.  
  499. .desc .linkslist {
  500. margin:10px 0;
  501. }
  502. .desc .linkslist li {
  503. text-transform:uppercase;
  504. display:inline-block;
  505. margin-right:3px;
  506. font-size:8px;
  507. font-weight:bold;
  508. }
  509.  
  510. nav .navlink .navlink-toggle .linkslist a {
  511. display:block;
  512. text-transform:uppercase;
  513. letter-spacing:0.1em;
  514. margin: 5px 0;
  515. color:{color:sidebar text};
  516. }
  517.  
  518. nav .navlink .navlink-toggle .linkslist a:hover {
  519. margin-left:10px;
  520. }
  521.  
  522.  
  523. nav#nav.show-nav {
  524. left:0;
  525. }
  526.  
  527. .title a.show-nav,
  528. .desc.show-nav,
  529. .desc.show-nav a,
  530. .pagination.show-nav {
  531. color:{color:sidebar text};
  532. }
  533.  
  534. .sidewrapper.show-nav {
  535. border:none;
  536. }
  537.  
  538. .pagination {
  539. width:100%;
  540. margin-top:10px;
  541. font-size:6px
  542. letter-spacing:0.1em;
  543. }
  544.  
  545. .pagination a {
  546. color:{color:description};
  547. }
  548.  
  549. .pagination a:hover {
  550. color: {color:links hover};
  551. }
  552.  
  553. /*---------------------------------POST-----------------------------------*/
  554.  
  555. #todo .post {
  556. background-color: {color:posts bg};
  557. margin:40px auto 0px auto;
  558. height:auto;
  559. overflow-y:hidden;
  560. width: {text:post width}px;
  561. {block:permalinkpage}
  562. width:500px;
  563. {/block:permalinkpage}
  564. position:relative;
  565. min-height:40px;
  566. -webkit-font-smoothing: subpixel-antialiased;
  567. backface-visibility: hidden;
  568. }
  569.  
  570. {block:ifhighlightlinks}
  571.  
  572. li.note a,
  573. .pagination a,
  574. .post.text .postinner a,
  575. .post .cap a {
  576. padding:0 3px;
  577. overflow:hidden;
  578. outline: none;
  579. position: relative;
  580. display: inline-block;
  581. vertical-align: bottom;
  582. }
  583.  
  584. li.note a:hover,
  585. .pagination a:hover,
  586. .post.text .postinner a:hover,
  587. .post .cap a:hover {
  588. color: {color:links hover when bg};
  589. }
  590.  
  591. .li.note a::before,
  592. .pagination a::before,
  593. .post .cap a::before,
  594. .post.text .postinner a::before {
  595. position: absolute;
  596. pointer-events: none;
  597. backface-visibility: hidden;
  598. top: 0;
  599. left: 0;
  600. z-index: -1;
  601. width: 100%;
  602. height: 100%;
  603. background: {color:links hover bg};
  604. content: '';
  605. -webkit-transition: -webkit-transform 0.3s;
  606. transition: transform 0.3s;
  607. -webkit-transform: scaleY(0.618) translateX(-100%);
  608. transform: scaleY(0.618) translateX(-100%);
  609. }
  610.  
  611. li.note a:hover:before,
  612. .pagination a:hover:before,
  613. .post.text .postinner a:hover:before,
  614. .post .cap a:hover:before {
  615. -webkit-transform: scaleY(0.618) translateX(0%);
  616. transform: scaleY(0.618) translateX(0%);
  617. }
  618.  
  619. {/block:ifhighlightlinks}
  620.  
  621. .postinner {
  622. overflow:hidden;
  623. background:{color:posts bg};
  624. }
  625.  
  626. #todo .post.text .postinner {
  627. padding:15px;
  628. }
  629.  
  630. .videoinner {
  631. position: relative;
  632. padding-bottom: 75%;
  633. height: 0;
  634. overflow: hidden;
  635. }
  636.  
  637. .videoinner iframe,
  638. .videoinner object,
  639. .videoinner embed {
  640. position: absolute;
  641. top: 0;
  642. left: 0;
  643. width: 100%;
  644. height: 100%;
  645. }
  646.  
  647. .post img,
  648. .photoset img,
  649. .photoset iframe {
  650. max-width:{text:post width}px;
  651. height:auto;
  652. display:block;
  653. }
  654.  
  655. /*---Lightbox---*/
  656. #vignette {
  657. visibility: hidden;
  658. }
  659.  
  660. #tumblr_lightbox {
  661. background: rgba({RGBcolor:lightbox bg},{text:lightbox opacity})!important;
  662. }
  663.  
  664. #tumblr_lightbox img {
  665. box-shadow: none !important;
  666. border-radius:0 !important;
  667. }
  668.  
  669.  
  670. #todo .post .info {
  671. height:40px;
  672. {block:ifnotfixedinfo}
  673. {block:IndexPage}
  674. position: absolute;
  675. -ms-transform:-ms-transform: translateY(-40px);
  676. -webkit-transform: translateY(-40px);
  677. transform: translateY(-40px);
  678. height: 40px;
  679. {/block:indexpage}
  680. {/block:ifnotfixedinfo}
  681. {block:permalinkpage}
  682. position:relative;
  683. height:60px;
  684. {/block:permalinkpage}
  685. background: {color:info bg};
  686. color: {color:info};
  687. width: 100%;
  688. top: 0;
  689. bottom: auto;
  690. text-transform:uppercase;
  691. text-align:center;
  692. font-weight:bold;
  693. letter-spacing:0.1em;
  694. font-size:8px;
  695. line-height:1.5;
  696. }
  697.  
  698. #todo .post .info a {
  699. color:{color:info};
  700. }
  701.  
  702. #todo .post .info a:hover,
  703. #todo .post .info a:active {
  704. color:{color:info hover};
  705. }
  706.  
  707. #todo .post .info .post-date {
  708. display: inline-block;
  709. width: 95%;
  710. position: relative;
  711. top: 50%;
  712. -ms-transform:transform: translateY(-50%);
  713. transform: translateY(-50%);
  714. transform: translateY(-50%);
  715. }
  716.  
  717. {block:ifnotfixedinfo}
  718. {block:indexpage}
  719. #todo .post:hover .postinner {
  720. -ms-transform: translateY(40px);
  721. -webkit-transform: translateY(40px);
  722. transform: translateY(40px);
  723. }
  724.  
  725. #todo .post:hover .info {
  726. -ms-transform: translateY(0px);
  727. -webkit-transform: translateY(0px);
  728. transform: translateY(0px);
  729. }
  730. {/block:indexpage}
  731. {/block:ifnotfixedinfo}
  732.  
  733. #todo .post .cap {
  734. padding: 10px;
  735. text-align: justify;
  736. width: 100%;
  737. line-height: 18px;
  738. background-color: {color:posts bg};
  739. z-index:100;
  740. position:relative;
  741. {block:ifhidecaptions}
  742. {block:indexpage}
  743. display:none;
  744. {/block:indexpage}
  745. {/block:ifhidecaptions}
  746. }
  747.  
  748. #todo .post .cap img {
  749. width:auto;
  750. max-width:200px;
  751. }
  752.  
  753.  
  754. #todo .post .titulo {
  755. color: {color:post title};
  756. min-height: 20px;
  757. width: 100%;
  758. text-transform:uppercase;
  759. font-weight:bold;
  760. letter-spacing:0.1em;
  761. font-size:16px;
  762. margin-bottom:10px;
  763. font-family:'{text:titles google font}', sans-serif;
  764. }
  765.  
  766. #todo .post .tags {
  767. z-index:100;
  768. position:relative;
  769. padding:10px;
  770. min-height: 20px;
  771. width: 100%;
  772. background:{color:posts bg};
  773. border-top:1px solid {color:lines};
  774. {block:ifhidetags}
  775. {block:indexpage}
  776. display:none;
  777. {/block:indexpage}
  778. {/block:ifhidetags}
  779. }
  780.  
  781.  
  782. #todo .post .tags a {
  783. color:{color:tags};
  784. text-transform:uppercase;
  785. font-weight:bold;
  786. letter-spacing:0.1em;
  787. font-size:8px;
  788. display:inline-block;
  789. margin: 5px;
  790. }
  791.  
  792. #todo .post .tags a:hover,
  793. #todo .post .tags a:active {
  794. color:{color:tags hover};
  795. }
  796.  
  797. /*-------------------------------AUDIO------------------------------*/
  798. .audio {
  799. background:{color:posts bg};
  800. }
  801.  
  802. .artcover {
  803. width:100px;
  804. height:100px;
  805. float:left;
  806. }
  807.  
  808. .artcover img {
  809. width:100%;
  810. height:100%;
  811. }
  812.  
  813. .player {
  814. width:100%;
  815. display:block;
  816. background:#000;
  817. padding:5px;
  818. border-top:1px solid {color:posts bg};
  819. margin-bottom:10px;
  820. }
  821.  
  822. .audioplayer {
  823. display:block;
  824. margin:0 auto;
  825. }
  826.  
  827. .audioinfo {
  828. margin-left:110px;
  829. height:100px;
  830. border-left:1px solid {color:lines};
  831. font-size: 14px;
  832. font-weight: bold;
  833. text-transform: uppercase;
  834. font-size:10px;
  835. letter-spacing:0.1em;
  836. overflow: hidden;
  837. padding:10px;
  838. }
  839.  
  840. .audioinfo-inner {
  841. margin:0 auto;
  842. max-width:250px;
  843. position: relative;
  844. top: 50%;
  845. -webkit-transform: translateY(-50%);
  846. -ms-transform: translateY(-50%);
  847. transform: translateY(-50%);
  848. }
  849.  
  850. /*------------------------------------CHAT-------------------------*/
  851. .user:nth-of-type(odd){
  852. background:{color:info bg};
  853. color:{color:info};
  854. }
  855.  
  856. .user .label {
  857. display:block;
  858. margin-bottom:5px;
  859. }
  860.  
  861. ul.chat, .chat ol, .chat li {
  862. list-style:none;
  863. margin:0px;
  864. padding:15px;
  865. min-height: 20px;
  866. text-transform:uppercase;
  867. font-weight:bold;
  868. letter-spacing:0.1em;
  869. font-size:8px;
  870. }
  871.  
  872. /*-----------------------------------ASK-------------------------*/
  873.  
  874. .answer .pregunta {
  875. background:{color:info bg};
  876. color:{color:info};
  877. padding:20px;
  878. min-height: 20px;
  879. width: 100%;
  880. text-transform:uppercase;
  881. font-weight:bold;
  882. letter-spacing:0.1em;
  883. font-size:8px;
  884. border-top:1px solid {color:posts bg};
  885. line-height:1.5;
  886. }
  887.  
  888. .answer .pregunta .asker-question {
  889. text-align:justify;
  890. }
  891.  
  892. .answer .pregunta .curioso {
  893. margin-top:5px;
  894. text-align:right;
  895. }
  896.  
  897. .answer .pregunta .curioso a {
  898. color:{color:info};
  899. }
  900.  
  901. .answer .replies,
  902. .answer .respuesta {
  903. padding:20px;
  904. }
  905.  
  906. .answer .respuesta ~ .replies {
  907. padding:0;
  908. }
  909.  
  910. /*----------------------LINK-------------------------*/
  911.  
  912. .linkinner {
  913. padding:25px;
  914. }
  915.  
  916. .link a h1 {
  917. color: {color:title};
  918. }
  919.  
  920. .linkinner a h1:hover {
  921. color: {color:links hover};
  922. }
  923.  
  924.  
  925. /*-----------------------------------QUOTE----------------------*/
  926.  
  927. .quoteinner {
  928. padding:20px;
  929. background:{color:info bg};
  930. border-top:1px solid {color:posts bg};
  931. color:{color:info};
  932. min-height: 20px;
  933. width: 100%;
  934. text-transform:uppercase;
  935. font-weight:bold;
  936. letter-spacing:0.1em;
  937. line-height:1.5;
  938. }
  939.  
  940. .quoteinner .quote-source {
  941. font-size:8px;
  942. margin:10px 0;
  943. text-align:right;
  944. }
  945.  
  946. /*-----------------------------------NOTAS----------------------*/
  947.  
  948. .notas {
  949. width: 100%;
  950. list-style-type: none;
  951. letter-spacing: 0.1em;
  952. padding:20px;
  953. }
  954.  
  955. ol.notes {
  956. padding: 0;
  957. margin:0;
  958. }
  959.  
  960. ol.notes li.note {
  961. display: block;
  962. margin:10px auto;
  963. padding:0;
  964. }
  965.  
  966. ol.notes li.note img.avatar {
  967. display:none;
  968. }
  969.  
  970. ol.notes li.more_notes_link_container {
  971. display: block;
  972. margin-top: 10px;
  973. }
  974.  
  975.  
  976. {CustomCSS}
  977.  
  978. </style>
  979.  
  980. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css">
  981. </head>
  982.  
  983. <body>
  984.  
  985. <div id="sidebar">
  986.  
  987.  
  988. {block:ifsidebar}
  989. <nav id="nav">
  990.  
  991. {block:ifabouttab}
  992. <div class="navlink">
  993. <a class="head" href="#">About</a>
  994. <div class="navlink-toggle">
  995. {text:about}
  996. </div>
  997. </div>
  998. {/block:ifabouttab}
  999. {block:ifmessagetab}
  1000. <div class="navlink">
  1001. <a class="head" href="#">Message</a>
  1002. <div class="navlink-toggle">
  1003. {block:AskEnabled}
  1004. <iframe frameborder="0" border="0" scrolling="yes" width="340" height="250" allowtransparency="true" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;"></iframe>
  1005. {/block:AskEnabled}
  1006. </div>
  1007. </div>
  1008. {/block:ifmessagetab}
  1009.  
  1010.  
  1011. {block:iflinkstab}
  1012. <div class="navlink">
  1013. <a class="head" href="#">Links</a>
  1014. <div class="navlink-toggle">
  1015. <ul class="linkslist">
  1016.  
  1017. {block:IfLink1Name}
  1018. <li>
  1019. <a href="{text:Link1 URL}" >{text:Link1 Name}</a>
  1020. </li>
  1021. {/block:IfLink1Name}
  1022.  
  1023. {block:IfLink2Name}
  1024. <li>
  1025. <a href="{text:Link2 URL}" >{text:Link2 Name}</a>
  1026. </li>
  1027. {/block:IfLink2Name}
  1028.  
  1029. {block:IfLink3Name}
  1030. <li>
  1031. <a href="{text:Link3 URL}" >{text:Link3 Name}</a>
  1032. </li>
  1033. {/block:IfLink3Name}
  1034.  
  1035. {block:IfLink4Name}
  1036. <li>
  1037. <a href="{text:Link4 URL}" >{text:Link4 Name}</a>
  1038. </li>
  1039. {/block:IfLink4Name}
  1040.  
  1041. {block:IfLink5Name}
  1042. <li>
  1043. <a href="{text:Link5 URL}" >{text:Link5 Name}</a>
  1044. </li>
  1045. {/block:IfLink5Name}
  1046.  
  1047. {block:IfLink6Name}
  1048. <li>
  1049. <a href="{text:Link6 URL}" >{text:Link6 Name}</a>
  1050. </li>
  1051. {/block:IfLink6Name}
  1052. </ul>
  1053. </div>
  1054. </div>
  1055. {/block:iflinkstab}
  1056. </nav>
  1057. {/block:ifsidebar}
  1058. <div class="sidewrapper">
  1059. <div class="sidecontent">
  1060.  
  1061. <div class="square mainpic">
  1062. <div class="sideimage"></div>
  1063. </div>
  1064.  
  1065. {block:ifsidebar}
  1066. <div class="square menuopener">
  1067. <a class="opener" id="nav-toggle" href="#"><span></span></a>
  1068. </div>
  1069. {/block:ifsidebar}
  1070.  
  1071. <div class="title">
  1072. <a href="/">{Title}</a>
  1073. </div>
  1074. <div class="desc">
  1075. {Description}
  1076. {block:ifnotlinkstab}
  1077. <ul class="linkslist">
  1078.  
  1079. {block:IfLink1Name}
  1080. <li>
  1081. <a href="{text:Link1 URL}" >{text:Link1 Name}</a>
  1082. </li>
  1083. {/block:IfLink1Name}
  1084.  
  1085. {block:IfLink2Name}
  1086. <li>
  1087. <a href="{text:Link2 URL}" >{text:Link2 Name}</a>
  1088. </li>
  1089. {/block:IfLink2Name}
  1090.  
  1091. {block:IfLink3Name}
  1092. <li>
  1093. <a href="{text:Link3 URL}" >{text:Link3 Name}</a>
  1094. </li>
  1095. {/block:IfLink3Name}
  1096.  
  1097. {block:IfLink4Name}
  1098. <li>
  1099. <a href="{text:Link4 URL}" >{text:Link4 Name}</a>
  1100. </li>
  1101. {/block:IfLink4Name}
  1102.  
  1103. {block:IfLink5Name}
  1104. <li>
  1105. <a href="{text:Link5 URL}" >{text:Link5 Name}</a>
  1106. </li>
  1107. {/block:IfLink5Name}
  1108.  
  1109. {block:IfLink6Name}
  1110. <li>
  1111. <a href="{text:Link6 URL}" >{text:Link6 Name}</a>
  1112. </li>
  1113. {/block:IfLink6Name}
  1114. </ul>
  1115. {/block:ifnotlinkstab}
  1116. {block:Pagination}
  1117. <div class="pagination">
  1118. {block:PreviousPage}<a href="{PreviousPage}">&#8592; prev</a>{/block:PreviousPage} // {block:NextPage}<a href="{NextPage}">next &#8594;</a>{/block:NextPage}
  1119. </div>
  1120. {/block:Pagination}
  1121. </div>
  1122. </div><!--/.sidecontent-->
  1123. </div>
  1124. </div><!--/.sidebar-->
  1125.  
  1126. <!--
  1127. POST
  1128. -->
  1129.  
  1130. <div id="todo">
  1131.  
  1132. {block:Posts}
  1133. <div class="post {PostType}" id="{PostId}">
  1134.  
  1135. <!--info-->
  1136. {block:Date}
  1137. <div class="info">
  1138.  
  1139. <div class="post-date">
  1140. <a title="{TimeAgo}" href="{Permalink}">{block:NoteCount}{NoteCountWithLabel} /// {/block:NoteCount} {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</a>
  1141. <br>
  1142. {block:PermalinkPage}
  1143. {block:RebloggedFrom}
  1144. // rebblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1145. <br>
  1146. // originally by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1147. {/block:RebloggedFrom}
  1148. {/block:PermalinkPage}
  1149. </div>
  1150.  
  1151. </div><!--/.info-->
  1152. {/block:Date}
  1153.  
  1154. <div class="postinner">
  1155.  
  1156. <!---------HIDESOURCE------>
  1157.  
  1158. {block:ContentSource}
  1159.  
  1160. <!--- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1161.  
  1162. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1163.  
  1164. {/block:SourceLogo}
  1165.  
  1166. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  1167.  
  1168. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1169.  
  1170. <!---------------------------------------------------------->
  1171.  
  1172.  
  1173. {block:Text}
  1174. {block:Title}
  1175. <h1 class="titulo"><a href="{Permalink}">{Title}</a></h1>
  1176. {/block:Title}
  1177. {Body}
  1178. {/block:Text}
  1179.  
  1180.  
  1181. {block:Quote}
  1182. <div class="quoteinner">
  1183. <span>"</span>{Quote}<span>"</span>
  1184. {block:Source}
  1185. <div class="quote-source">//// quote by {Source}
  1186. </div>
  1187. {/block:Source}
  1188. </div>
  1189. {/block:Quote}
  1190.  
  1191. {block:Link}
  1192. <div class="linkinner">
  1193. <a href="{URL}"><h1 class="titulo">// {Name} &#8594;</h1></a>
  1194. {block:Description}
  1195. <blockquote><p>{Description}</p></blockquote>
  1196. {/block:Description}
  1197. </div>
  1198. {/block:Link}
  1199.  
  1200.  
  1201. {block:Photo}
  1202. <div>
  1203. {LinkOpenTag}
  1204. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  1205. {LinkCloseTag}
  1206. </div>
  1207. {/block:Photo}
  1208.  
  1209. {block:Photoset}
  1210. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1211. {block:Photos}
  1212. <div class="photo-data">
  1213. <div class="pxu-photo">
  1214. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1215. </div>
  1216. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1217. </div>
  1218. {/block:Photos}
  1219. </div>
  1220. {/block:Photoset}
  1221.  
  1222. {block:Chat}
  1223. <ul class="chat">
  1224. {block:Lines}
  1225. <li class="user">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>
  1226. {/block:Lines}
  1227. </ul>
  1228. {/block:Chat}
  1229.  
  1230. {block:Video}
  1231. <div class="videoinner">
  1232. {Video-700}
  1233. </div>
  1234. {/block:Video}
  1235.  
  1236. {block:Answer}
  1237. <div class="pregunta">
  1238. <div class="asker-question">
  1239. {Question}
  1240. </div>
  1241. <div class="curioso">
  1242. /// {Asker}
  1243. </div>
  1244. </div>
  1245.  
  1246. {block:Answerer}
  1247. <div class="respuesta">
  1248. <div class="answerer">/// {Answerer}</div>
  1249. <div class="answerer-answer">
  1250. <blockquote>{Answer}</blockquote>
  1251. </div>
  1252. </div>
  1253. {/block:Answerer}
  1254.  
  1255. <div class="replies">
  1256. {Replies}
  1257. </div>
  1258. {/block:Answer}
  1259.  
  1260.  
  1261. {block:Audio}
  1262. <div class="audio">
  1263.  
  1264. {block:AudioPlayer}
  1265. <div class="player">
  1266. <div class="audioplayer">{AudioPlayerBlack}</div>
  1267. </div>
  1268.  
  1269. <div class="artcover">
  1270. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1271. </div>
  1272.  
  1273. <div class="audioinfo">
  1274. <div class="audioinfo-inner">
  1275. <div class="cancion">
  1276. {block:TrackName}{TrackName}{/block:TrackName}<br> {block:Artist}/// {Artist}{/block:Artist}
  1277. </div>
  1278. <div style="font-size:8px;">
  1279. Played: {FormattedPlayCount} times
  1280. </div>
  1281. </div>
  1282. </div>
  1283. {block:AudioPlayer}
  1284.  
  1285. {block:AudioEmbed}
  1286. <div class="audioembed">{AudioEmbed}</div>
  1287. {/block:AudioEmbed}
  1288.  
  1289. </div>
  1290. {/block:Audio}
  1291.  
  1292. </div><!--post inner-->
  1293.  
  1294. {block:Caption}
  1295. <div class="cap">{Caption}</div>
  1296. {/block:Caption}
  1297.  
  1298. {block:HasTags}
  1299. <div class="tags">
  1300. {block:Tags}<a href="{TagUrl}">&#10005 {Tag}</a> {/block:Tags}
  1301. </div>
  1302. {/block:HasTags}
  1303.  
  1304. {block:PostNotes}
  1305. <div class="notas">
  1306. Notes:<br >
  1307. {PostNotes}
  1308. </div>
  1309. {/block:PostNotes}
  1310.  
  1311. </div><!---end post-->
  1312.  
  1313. {/block:Posts}
  1314.  
  1315. </div><!---end todo-->
  1316.  
  1317. <div class="phoenixt">
  1318. <a href="http://phoenixthemes.tumblr.com">P.</a>
  1319. </div>
  1320.  
  1321.  
  1322. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1323. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  1324. <script src="//cdnjs.cloudflare.com/ajax/libs/masonry/3.1.2/masonry.pkgd.js"></script>
  1325. <script src="http://static.tumblr.com/d4tdea8/Mkhnw70y5/pxuphotoset.js"></script>
  1326.  
  1327. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1328. <script>
  1329.  
  1330.  
  1331. $(document).ready(function() {
  1332. $('.photo-slideshow').pxuPhotoset({
  1333. ligthbox: true,
  1334. highRes : true,
  1335. rounded: false,
  1336. gutter: '{text:photoset spacing}', // spacing between the images
  1337. photoset: '.photo-slideshow', // photoset wrapper
  1338. photoWrap: '.photo-data',
  1339. photo: '.pxu-photo'
  1340. });
  1341. $("[title]").style_my_tooltips({
  1342. tip_follows_cursor:true,
  1343. tip_delay_time:0,
  1344. tip_fade_speed:400,
  1345. attribute:"title"
  1346. });
  1347. $('.opener').on('click', function(){
  1348. $('#nav, .title a, .desc, .sidewrapper, .navlink, .pagination' ).toggleClass('show-nav');
  1349. });
  1350. $("#open").trigger('click');
  1351. document.querySelector( "#nav-toggle" ).addEventListener( "click", function() {
  1352. this.classList.toggle( "active" );
  1353. });
  1354. $(".navlink").click(function(){
  1355. $('.navlink-toggle:visible').slideToggle(350);
  1356. $(this).find(".navlink-toggle").slideToggle(350);
  1357. $("a.toggleactive").removeClass("toggleactive");
  1358. $(this).find("a").addClass("toggleactive");
  1359. });
  1360. {block:ifgridlayout}
  1361. {block:indexpage}
  1362. (function() {
  1363. // Main content container
  1364. var $container = $('#todo');
  1365.  
  1366. // Masonry + ImagesLoaded
  1367. $container.imagesLoaded(function(){
  1368. $container.masonry({
  1369. // selector for entry content
  1370. itemSelector: '.post',
  1371. gutter: 40
  1372. });
  1373. });
  1374. })();
  1375. {/block:indexpage}
  1376. {/block:ifgridlayout}
  1377. });
  1378. </script>
  1379. </body>
  1380. </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!