Advertisement
luciam

Theme #02

Apr 5th, 2014
2,615
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.86 KB | None | 0 0
  1. <html><head></head><body></body></html><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3.  
  4. <head>
  5.  
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  7. <title>{Title}</title>
  8. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  9. <link rel="shortcut icon" href="{Favicon}" />
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  11.  
  12. <script src="http://assets.tumblr.com/assets/scripts/tumblelog.js?_v=6a17c519d68bc98ed5cdd6f4a55dbaa2"></script>
  13.  
  14. {block:ifLazyLoad}
  15. <!---------------------------LL------------------------------------>
  16. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  17. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  18. <script type="text/javascript" charset="utf-8">
  19. var $j = jQuery.noConflict();
  20. $j(function() {
  21. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  22. $j("img").lazyload({
  23. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  24. effect: "fadeIn",
  25. });
  26. });
  27. </script>
  28. {/block:ifLazyLoad}
  29.  
  30. <!----TOOLTIP------------------>
  31.  
  32. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  33. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  34. <script>
  35. (function($){
  36. $(document).ready(function(){
  37. $("[title]").style_my_tooltips({
  38. tip_follows_cursor:true,
  39. tip_delay_time:0,
  40. tip_fade_speed:400,
  41. attribute:"title"
  42. });
  43. });
  44. })(jQuery);
  45. </script>
  46.  
  47.  
  48. <!--------------------MODALWINDOW---------------------------------->
  49. <script type="text/javascript"
  50. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  51.  
  52.  
  53. <script>
  54. $(document).ready(function() {
  55. //When you click on a link with class of poplight and the href starts with a #
  56. $('a.poplight[href^=#]').click(function() {
  57. var popID = $(this).attr('rel');
  58. var popURL = $(this).attr('href');
  59. var query= popURL.split('?');
  60. var dim= query[1].split('&');
  61. var popWidth = dim[0].split('=')[1];
  62. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img class="btn_close"/></a>');
  63. var popMargTop = ($('#' + popID).height() + 80) / 2;
  64. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  65. $('#' + popID).css({
  66. 'margin-top' : -popMargTop,
  67. 'margin-left' : -popMargLeft
  68. });
  69. $('body').append('<div id="fade"></div>');
  70. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  71. return false;
  72. });
  73. $('a.close, #fade').live('click', function() {
  74. $('#fade , .popup_block').fadeOut(function() {
  75. $('#fade, a.close').remove();
  76. });
  77. return false;
  78. });
  79. });
  80. </script>
  81.  
  82. <!----IFS...........................................--->
  83.  
  84. {block:ifInfiniteScrolling}
  85. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  86. {/block:ifInfiniteScrolling}
  87.  
  88.  
  89.  
  90. <!--------------------METAS----------------------->
  91. <meta name="color:text" content="#999">
  92. <meta name="color:scroll" content="#d3d3d3">
  93. <meta name="color:links" content="#d3d3d3">
  94. <meta name="color:linkshover" content="#DDD4D7">
  95. <meta name="color:background" content="#fff">
  96. <meta name="color:lines" content="#d3d3d3">
  97. <meta name="color:title" content="#ccc">
  98. <meta name="color:description" content="#ccc">
  99. <meta name="color:tooltip" content="#fff">
  100. <meta name="color:tooltipbg" content="#ccc">
  101. <meta name="color:postinfo" content="#d3d3d3">
  102. <meta name="color:postinfo hover" content="#999">
  103. <meta name="color:popupaskbg" content="#fff" />
  104.  
  105.  
  106. <meta name="image:sidebar" content="">
  107.  
  108. <meta name="if:Lazy Load" content="0" />
  109. <meta name="if:Show Caption" content="1"/>
  110. <meta name="if:Infinite Scrolling" content="0" />
  111. <meta name="if:Pop Up Ask" content="1" />
  112. <meta name="if:400px Posts" content="0" />
  113.  
  114. <meta name="text:username" content="type here your username"/>
  115. <meta name="text:ask title" content="ask me anything"/>
  116. <meta name="text:Navigation Tab1" content="description" />
  117. <meta name="text:Navigation Tab2" content="about" />
  118. <meta name="text:About" content="Here goes your about text. Make it as long as you want. If it's too long an scrollbar will show up. Make sure you write your username in the customization page, otherwise the pop up ask won't work.
  119. " />
  120. <meta name="text:Navigation Tab3" content="links" />
  121. <meta name="text:Navigation Tab4" content="message" />
  122.  
  123. <meta name="text:Link1 URL" content="/" />
  124. <meta name="text:Link1 Name" content="link 1" />
  125. <meta name="text:Link2 URL" content="/" />
  126. <meta name="text:Link2 Name" content="link 2" />
  127. <meta name="text:Link3 URL" content="/" />
  128. <meta name="text:Link3 Name" content="link 3" />
  129. <meta name="text:Link4 URL" content="/" />
  130. <meta name="text:Link4 Name" content="link 4" />
  131. <meta name="text:Link5 URL" content="/" />
  132. <meta name="text:Link5 Name" content="link 5" />
  133. <style type="text/css">
  134.  
  135. /*-------------------------SCROLL----------------------*/
  136.  
  137. ::-webkit-scrollbar-thumb:vertical {
  138. background-color: {color:scroll};
  139. height:5px;
  140. }
  141. ::-webkit-scrollbar-corner {
  142. background-color: transparent;
  143. }
  144.  
  145. ::-webkit-scrollbar {
  146. margin-left: 5px;
  147. background-color: transparent;
  148. height:2px;
  149. width:5px;
  150. }
  151. /*-------------------------CONTROLS----------------------*/
  152. .tmblr-iframe,
  153. .tmblr-iframe--desktop-loggedin-controls,
  154. .iframe-controls--desktop {
  155. right:3px !important;
  156. position: fixed !important;
  157. opacity:0.3;
  158. -webkit-transition: all 0.6s ease-out;
  159. -moz-transition: all 0.6s ease-out;
  160. -ms-transition: all 0.6s ease-out;
  161. -o-transition: all 0.6s ease-out;
  162. transition: all 0.6s ease-out;
  163. }
  164.  
  165. .tmblr-iframe:hover,
  166. .tmblr-iframe--desktop-loggedin-controls:hover,
  167. .iframe-controls--desktop:hover {
  168. opacity:0.8;
  169. -webkit-transition: all 0.6s ease-out;
  170. -moz-transition: all 0.6s ease-out;
  171. -ms-transition: all 0.6s ease-out;
  172. -o-transition: all 0.6s ease-out;
  173. transition: all 0.6s ease-out;
  174. }
  175. /*-------------------------BLOCKQUOTE----------------------*/
  176.  
  177.  
  178. blockquote {
  179. padding:10px;
  180. padding-left:15px;
  181. margin:10px;
  182. border-left:1px solid {color:lines};
  183. }
  184.  
  185. blockquote img {
  186. padding-left: 25px;
  187. {block:IfNot400pxPosts}max-width: 300px!important;{/block:IfNot400pxPosts}
  188. {block:If400pxPosts}max-width: 250px!important;{/block:If400pxPosts}
  189. }
  190.  
  191. blockquote blockquote {
  192. padding:10px;
  193. padding-left:15px;
  194. }
  195.  
  196. /*-------------------------BODY----------------------*/
  197. #s-m-t-tooltip{
  198. letter-spacing:1px;
  199. max-width:150px;
  200. font-size: 8px;
  201. margin:0px 10px;
  202. padding:3px;
  203. background:{color:tooltipbg};
  204. color: {color:tooltip};
  205. opacity: .8;
  206. z-index:999;
  207. text-transform:uppercase;
  208. }
  209.  
  210.  
  211. img a {
  212. border:none;
  213. width:100%;
  214. }
  215.  
  216.  
  217. body {
  218. background-color: {color:background};
  219. color: {color:text};
  220. font-family: Calibri;
  221. font-size: 10px;
  222. letter-spacing: 0.1em;
  223. }
  224.  
  225. a, a:active, a:visited{
  226. text-decoration:none;
  227. color:{color:links};
  228. -webkit-transition: all 0.6s ease-out;
  229. -moz-transition: all 0.6s ease-out;
  230. -ms-transition: all 0.6s ease-out;
  231. -o-transition: all 0.6s ease-out;
  232. transition: all 0.6s ease-out;
  233. }
  234.  
  235. a:hover {
  236. text-decoration:none;
  237. color: {color:linkshover};
  238. -webkit-transition: all 0.6s ease-out;
  239. -moz-transition: all 0.6s ease-out;
  240. -ms-transition: all 0.6s ease-out;
  241. -o-transition: all 0.6s ease-out;
  242. transition: all 0.6s ease-out;
  243. }
  244. sub {
  245. font-size:10px;
  246. }
  247.  
  248. small {font-size:10px;}
  249. big {font-size:13px;}
  250.  
  251. /*----------------------------------SIDE--------------------------------*/
  252.  
  253. .sidecar {
  254. position: fixed;
  255. margin-left: 380px;
  256. margin-top: 200px;
  257. height: 260px;
  258. width: 210px;
  259. }
  260.  
  261.  
  262. .simg {
  263. padding: 10px;
  264. border-bottom: solid 1px {color:lines};
  265. width:200px;
  266. -webkit-filter: black white(0.7);
  267. -webkit-transition: all 0.6s ease-out;
  268. -moz-transition: all 0.6s ease-out;
  269. -ms-transition: all 0.6s ease-out;
  270. -o-transition: all 0.6s ease-out;
  271. transition: all 0.6s ease-out;
  272. }
  273.  
  274. .nothing {
  275. height: 14px;
  276. font-size: 9px;
  277. font-weight: bold;
  278. color: {color:title};
  279. z-index: 9999999999999999;
  280. padding: 10px;
  281. width: 200px;
  282. font-family: Century Gothic, calibri;
  283. text-transform: uppercase;
  284. text-align: center;
  285. letter-spacing: 0.4em;
  286. -webkit-transition: all 0.6s ease-out;
  287. -moz-transition: all 0.6s ease-out;
  288. -ms-transition: all 0.6s ease-out;
  289. -o-transition: all 0.6s ease-out;
  290. transition: all 0.6s ease-out;
  291. }
  292.  
  293. .sidecar:hover .nothing {
  294. opacity: 0;
  295. }
  296.  
  297. .sidecar:hover .enlaces {
  298. opacity: 1;
  299. }
  300.  
  301. .sidecar:hover .simg{
  302. -webkit-filter: brightness(1);
  303. }
  304.  
  305. .enlaces {
  306. font-family: calibri;
  307. position: absolute;
  308. margin-top: -30px;
  309. margin-left: 5px;
  310. opacity: 0;
  311. -webkit-transition: all 0.6s ease-out;
  312. -moz-transition: all 0.6s ease-out;
  313. -ms-transition: all 0.6s ease-out;
  314. -o-transition: all 0.6s ease-out;
  315. transition: all 0.6s ease-out;
  316. }
  317.  
  318.  
  319. .link label img{
  320. width: 10px;
  321. height: 10px;
  322. padding: 5px;
  323. text-align: center;
  324. cursor: pointer;
  325. display: block;
  326. opacity: 0.3;
  327. -webkit-transition: all 0.6s ease-out;
  328. -moz-transition: all 0.6s ease-out;
  329. -ms-transition: all 0.6s ease-out;
  330. -o-transition: all 0.6s ease-out;
  331. transition: all 0.6s ease-out;
  332. }
  333.  
  334. .link label img:hover {
  335. opacity: 0.6;
  336. }
  337.  
  338.  
  339. .link [type=radio] {
  340. display: none;
  341. }
  342.  
  343. .contenido {
  344. border-left: solid 1px {color:lines};
  345. letter-spacing: 0.1em;
  346. font-size:10px;
  347. color: {color:description};
  348. background-color: {color:background};
  349. width: 165px;
  350. height: 70px;
  351. padding: 10px;
  352. overflow: scroll;
  353. text-align: justify;
  354. position: absolute;
  355. top:-5px;
  356. left:25px;
  357. }
  358.  
  359. .contenido img {
  360. max-width: 80px;
  361. max-height: 80px;
  362. }
  363.  
  364. .sidebarlink {
  365. font-size: 8px;
  366. background-color: {color:background};
  367. padding: 2px;
  368. color: {color:links};
  369. text-transform:uppercase;
  370. }
  371.  
  372. .sidebarlink:hover {
  373. text-decoration:none!important;
  374. margin-left: 10px;
  375. color: {color:linkshover};
  376. }
  377.  
  378. .linkline {
  379. margin-bottom: -7px;
  380. width: 20px;
  381. height: 1px;
  382. margin-top: 5px;
  383. background-color: {color:linkshover};
  384. z-index: -1;}
  385.  
  386. [type=radio]:checked ~ label {
  387. z-index: 2;
  388. }
  389.  
  390. [type=radio]:checked ~ label ~ .contenido {
  391. z-index: 999999;
  392. }
  393.  
  394. /*------------------------PAGINATION---------------------------------*/
  395.  
  396. .paginas {
  397. position: absolute;
  398. left: 180px;
  399. top: -150px;
  400. width: 50px;
  401. }
  402.  
  403.  
  404. /*POSTS---------------------------------------------------------------*/
  405.  
  406. .todo {
  407. height: 100%;
  408. margin:-30px 600px;
  409. width: 600px;
  410. border-left: solid 1px {color:lines};
  411. padding: 50px
  412. }
  413.  
  414. .post {
  415. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  416. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  417. margin-top: 30px;
  418. }
  419.  
  420. .post img {
  421. {block:IfNot400pxPosts}max-width: 500px;{/block:IfNot400pxPosts}
  422. {block:If400pxPosts}max-width: 400px;{/block:If400pxPosts}
  423. border:0px;
  424. text-align:center;
  425. }
  426.  
  427. h1 {
  428. font-size: 10px;
  429. font-weight: bold;
  430. width:100%;
  431. color: {color:title};
  432. z-index: 9999999999999999;
  433. padding: 10px;
  434. font-family: Century Gothic, calibri;
  435. text-transform: uppercase;
  436. text-align: center;
  437. letter-spacing: 0.4em;
  438. width:100%
  439. line-height:12px;
  440. margin-top:7px;
  441. padding:5px;
  442. margin-bottom: 7px;
  443. }
  444.  
  445. .caption {
  446. {block:IfNot400pxPosts}max-width: 500px;{/block:IfNot400pxPosts}
  447. {block:If400pxPosts}max-width: 400px;{/block:If400pxPosts}
  448. }
  449.  
  450. pre {
  451. overflow: auto;
  452. }
  453. /*------------------------------INFO-------------------------*/
  454.  
  455.  
  456. .info {
  457. letter-spacing: 0.2em;
  458. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  459. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  460. font-size: 8px;
  461. font-family:Consolas;
  462. text-transform:uppercase;
  463. text-align: left;
  464. margin-left: -10px;
  465. margin-top: -15px;
  466. padding: 5px;
  467. -webkit-transition: all 0,6s linear;
  468. -moz-transition: all 0.6s linear;
  469. -ms-transition: all 0.6s linear;
  470. -o-transition: all 0.6s linear;
  471. transition: all 0.6s linear;
  472. }
  473.  
  474.  
  475.  
  476. .info a {
  477. color: {color:postinfo};
  478. background-color: {color:background};
  479. display: inline-block;
  480. padding: 5px;
  481. }
  482.  
  483.  
  484. .info a:hover {
  485. text-decoration: none!important;
  486. color: {color:postinfo hover};
  487. }
  488.  
  489. .post .linkline {
  490. background-color: {color:lines}!important;
  491. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  492. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  493. }
  494.  
  495. /*-------------------------------TAGS-------------------------*/
  496.  
  497. .tags {
  498. color: {color:postinfo};
  499. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  500. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  501. text-align: left;
  502. font-size:8px;
  503. text-transform:uppercase;
  504. letter-spacing:1px;
  505. font-family: Consolas;
  506. margin-top: 5px;
  507. display: inline-block;}
  508.  
  509. .tags a:hover {
  510. text-decoration: none!important;
  511. color: {color:postinfo hover};}
  512.  
  513. /*--------------------------------ASK-----------------------------*/
  514.  
  515. #ask {
  516. padding: 5px;
  517. }
  518.  
  519.  
  520.  
  521. .pregunta {
  522. font-size: 10px;
  523. {block:IfNot400pxPosts}max-width: 500px;{/block:IfNot400pxPosts}
  524. {block:If400pxPosts}max-width: 400px;{/block:If400pxPosts}
  525. letter-spacing: 1px;
  526. padding: 5px;
  527. font-style: italic;
  528.  
  529. }
  530.  
  531.  
  532. .curioso {
  533. padding: 2px;
  534. max-width:200px;
  535. background-color: {color:background};
  536. color: {color:links};
  537. margin-left: 5px;
  538. font-size: 8px;
  539. font-weight: bold;
  540. text-transform: uppercase;
  541. letter-spacing:1px;
  542. -webkit-transition: all 0.6s ease-out;
  543. -moz-transition: all 0.6s ease-out;
  544. -ms-transition: all 0.6s ease-out;
  545. -o-transition: all 0.6s ease-out;
  546. transition: all 0.6s ease-out;
  547.  
  548. }
  549.  
  550. .curioso:hover {
  551. color: {color:linkshover};
  552. text-decoration:none!important;
  553. margin-left: 15px;
  554.  
  555. }
  556.  
  557.  
  558. .respuesta {
  559. margin-top: 5px;
  560. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  561. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  562. padding: 10px;
  563. margin-left: 5px;
  564. font-size: 10px;
  565. text-align: justify;
  566. border-left: solid 1px {color:lines};
  567. }
  568.  
  569. #ask .linkline {
  570. width: 20px!important;
  571. z-index: -1;
  572. margin-left: 5px;
  573. background-color: {color:linkshover}!important;}
  574.  
  575.  
  576.  
  577.  
  578. /*-------------------------------AUDIO------------------------------*/
  579.  
  580. #audio {
  581. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  582. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  583. display:block;
  584. margin:0px;
  585. padding: 10px;
  586. height: 40px;
  587. }
  588.  
  589. .artcover {
  590. width:50px;
  591. height:50px;
  592. position: absolute;
  593. margin-left: 10px;
  594. }
  595.  
  596. .artcover img {
  597. width:50px !important;
  598. height:50px;
  599. float:left;
  600. padding-right: 5px;
  601. }
  602.  
  603. .player {
  604. position:absolute;
  605. z-index:1;
  606. width:50px;
  607. height:50px;
  608. margin-top:0px;
  609. margin-left:10px;
  610. display:block;
  611. opacity:0.6;
  612. -webkit-transition:all 0.6s;
  613. -moz-transition:all 0.6s;
  614. -o-transition:all 0.6s;
  615. -ms-transition: all 0.6s;
  616. transition:all 0.6s;
  617. background:#fff;
  618. }
  619.  
  620. .player:hover {
  621. -webkit-transition:all 0.6s;
  622. -moz-transition:all 0.6s;
  623. -o-transition:all 0.6s;
  624. -ms-transition: all 0.6s;
  625. transition:all 0.6s;
  626. opacity:0.3;
  627. }
  628.  
  629. .audioplayer {
  630. width:20px;
  631. height:20px;
  632. margin-top:8px;
  633. margin-left:8px;
  634. padding:4px;
  635. overflow: hidden;
  636. }
  637.  
  638. .audioinfo {
  639. text-transform: uppercase;
  640. width:310px;
  641. display:block;
  642. margin-left: 70px;
  643. font-size:10px;
  644. letter-spacing:0.1em;
  645. text-align:left;
  646. overflow: hidden;
  647. }
  648.  
  649. /*------------------------------------CHAT-------------------------*/
  650. .user .label:nth-of-type(odd) {color:{color:links}; font-weight:bold; text-transform:uppercase;}
  651. .user .label:nth-of-type(even) {color:{color:linkshover}; font-weight:bold;text-transform:uppercase;}
  652.  
  653. ul.chat, .chat ol, .chat li {list-style:none; margin:0px; padding:10px}
  654.  
  655. /*-----------------------------------QUOTE----------------------*/
  656. .quote {
  657. {block:IfNot400pxPosts}width: 400px;{/block:IfNot400pxPosts}
  658. {block:If400pxPosts}width: 300px;{/block:If400pxPosts}
  659. margin-left: 50px;
  660. padding: 10px;
  661. text-indent: 0px;
  662. text-align: center;
  663. font-family: Century Gothic, Calibri;
  664. font-size: 14px;
  665. font-style: none;
  666. font-weight: lighter;
  667. line-height: 150%;
  668. }
  669.  
  670. .quote:first-letter {
  671. padding-right: 0;
  672. font-size: 20px;
  673. font-weight: bold;
  674. }
  675.  
  676. h2 {
  677. text-transform: uppercase;
  678. font-weight: 300;
  679. font-size: 10px;
  680. text-align: right;
  681. max-width: 475px;
  682. }
  683. /*-----------------------------------NOTAS----------------------*/
  684.  
  685. .notas {
  686. {block:IfNot400pxPosts}width: 500px;{/block:IfNot400pxPosts}
  687. {block:If400pxPosts}width: 400px;{/block:If400pxPosts}
  688. margin-left:-30px;
  689. margin-top:20px;
  690. text-transform: uppercase;
  691. list-style-type: none;
  692. font-size: 8px;
  693. letter-spacing: 0.2em;}
  694.  
  695. ol.notes li.note {
  696. padding-bottom:5px;
  697. margin-bottom:8px;
  698. list-style-type:none;
  699. }
  700. ol.notes li.note img.avatar {
  701. margin-bottom: -5px;
  702. padding-right: 4px;
  703. opacity: 0.9;
  704. }
  705. ol.notes li.note img {
  706. padding:0px;
  707. }
  708. ol.notes li.note blockquote {
  709. padding-left:15px;
  710. margin-left:30px;
  711. }
  712.  
  713. /*--------------------------------------------*/
  714.  
  715. .credito {
  716. width: 20px;
  717. height: 20px;
  718. position: fixed;
  719. bottom: 10px;
  720. right: 10px;
  721.  
  722.  
  723. }
  724.  
  725. .credito img {
  726. height: 12px;
  727. width: 12px;
  728. opacity: 0.4;
  729. -webkit-transition: all 0.6s ease-out;
  730. -moz-transition: all 0.6s ease-out;
  731. -ms-transition: all 0.6s ease-out;
  732. -o-transition: all 0.6s ease-out;
  733. transition: all 0.6s ease-out;
  734. }
  735.  
  736. .credito img:hover {
  737. opacity: 0.8;
  738. -webkit-transition: all 0.6s ease-out;
  739. -moz-transition: all 0.6s ease-out;
  740. -ms-transition: all 0.6s ease-out;
  741. -o-transition: all 0.6s ease-out;
  742. transition: all 0.6s ease-out;
  743. }
  744.  
  745.  
  746. /* MODAL WINDOW -------------------------------------------------*/
  747. #fade {
  748. display: none;
  749. background: {color:popupaskbg};
  750. position: fixed; left: 0; top: 0;
  751. width: 100%; height: 100%;
  752. opacity: .8;
  753. z-index: 9999;
  754. }
  755. .popup_block{
  756. float: left;
  757. display: none;
  758. padding: 20px;
  759. position: fixed;
  760. overflow:scroll;
  761. max-width: 500px;
  762. max-height: 500px;
  763. top: 50%;
  764. left: 50%;
  765. z-index: 99999999999999999;
  766. }
  767. img.btn_close {
  768. float: right;
  769. margin: -5px -5px 0 0;
  770. }
  771. *html #fade {
  772. position: absolute;
  773. }
  774. *html .popup_block {
  775. position: absolute;
  776. }
  777.  
  778.  
  779.  
  780. </style>
  781. </head>
  782. <body>
  783.  
  784.  
  785. <div class="sidecar">
  786.  
  787. {block:IfNotInfiniteScrolling}
  788. {block:Pagination}
  789. <div class="paginas">
  790. {block:PreviousPage}<a href="{PreviousPage}">&#8212;prev</a>{/block:PreviousPage}
  791. {block:NextPage}<a href="{NextPage}">next&#8212;</a>{/block:NextPage}
  792. </div>
  793. {/block:Pagination}
  794. {/block:IfNotInfiniteScrolling}
  795.  
  796. <a href="/"><img class="simg" src="{image:sidebar}"></a>
  797. <div class="nothing">{Title}</div>
  798.  
  799.  
  800. <div class="enlaces">
  801.  
  802. {block:IfNavigationTab1}
  803. <div class="link">
  804. <input type="radio" id="tab-2" name="tab-group-1" checked>
  805. <label for="tab-2" title="{text:Navigation Tab1}"><img src="http://static.tumblr.com/d4tdea8/L0Xn2anc6/iconmonstr-pen-12-icon-48.png"></label>
  806.  
  807. <div class="contenido">
  808. {Description}
  809. </div>
  810. </div>
  811. {/block:IfNavigationTab1}
  812.  
  813.  
  814. {block:IfNavigationTab2}
  815. <div class="link">
  816. <input type="radio" id="tab-3" name="tab-group-1">
  817. <label for="tab-3" title="{text:Navigation Tab2}"><img src="http://static.tumblr.com/d4tdea8/n6Zn2ancr/iconmonstr-user-6-icon-48.png"></label>
  818.  
  819. <div class="contenido">
  820. {text:About}
  821. </div>
  822. </div>
  823. {/block:IfNavigationTab2}
  824.  
  825. {block:IfNavigationTab3}
  826. <div class="link">
  827. <input type="radio" id="tab-4" name="tab-group-1">
  828. <label for="tab-4" title="{text:Navigation Tab3}"><img src="http://static.tumblr.com/d4tdea8/U47n2anch/iconmonstr-share-icon-48.png"></label>
  829.  
  830. <div class="contenido">
  831. {block:IfLink1Name}
  832. <div class="linkline"> </div>
  833. <a href="{text:Link1 URL}" class="sidebarlink">{text:Link1 Name}</a>
  834. {/block:IfLink1Name}
  835. {block:IfLink2Name}
  836. <div class="linkline"> </div>
  837. <a href="{text:Link2 URL}" class="sidebarlink">{text:Link2 Name}</a>
  838. {/block:IfLink2Name}
  839. {block:IfLink3Name}
  840. <div class="linkline"> </div>
  841. <a href="{text:Link3 URL}" class="sidebarlink">{text:Link3 Name}</a>
  842. {/block:IfLink3Name}
  843. {block:IfLink4Name}
  844. <div class="linkline"> </div>
  845. <a href="{text:Link4 URL}" class="sidebarlink">{text:Link4 Name}</a>
  846. {/block:IfLink4Name}
  847. {block:IfLink5Name}
  848. <div class="linkline"> </div>
  849. <a href="{text:Link5 URL}" class="sidebarlink">{text:Link5 Name}</a>
  850. {/block:IfLink5Name}
  851. <br>
  852. </div>
  853. </div>
  854. {/block:IfNavigationTab3}
  855.  
  856. {block:IfNavigationTab4}
  857. {block:IfNotPopUpAsk}
  858. <div class="link">
  859. <input type="radio" id="tab-5" name="tab-group-1">
  860. <label for="tab-5" title="{text:Navigation Tab4}">
  861. <a href="/ask">
  862. <img src="http://static.tumblr.com/d4tdea8/kxNn2anb6/iconmonstr-email-icon-48.png"></a></label></div>
  863. {/block:IfNotPopUpAsk}
  864.  
  865.  
  866. {block:IfPopUpAsk}
  867. <a href="#?w=500" rel="01" class="poplight" style="text-decoration: none!important;">
  868. <div class="link">
  869. <input type="radio" id="tab-5" name="tab-group-1">
  870. <label for="tab-5" title="{text:Navigation Tab4}"><img src="http://static.tumblr.com/d4tdea8/kxNn2anb6/iconmonstr-email-icon-48.png"></label></div></a>
  871. {/block:IfPopUpAsk}
  872. {/block:IfNavigationTab4}
  873.  
  874. </div><!----end contenido--->
  875. </div><!----end sidecar--->
  876.  
  877.  
  878.  
  879. <div class="todo">
  880. {block:Posts}
  881.  
  882.  
  883. <div class="post">
  884.  
  885. <!---------HIDESOURCE---------------------------->
  886.  
  887. {block:ContentSource}
  888.  
  889. <!--- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  890.  
  891. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  892.  
  893. {/block:SourceLogo}
  894.  
  895. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  896.  
  897. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  898.  
  899. <!---------------------------------------------------------->
  900. <!----INFO---->
  901. <div class="linkline"></div><div class="info">{block:Date}<a href="{Permalink}">{TimeAgo}{/block:Date} {block:NoteCount} - {NoteCountWithLabel} {/block:NoteCount}</a>
  902. {block:RebloggedFrom} <a href="{ReblogRootURL}" title="{ReblogRootName}"> &nbsp;source</a><a href="{ReblogURL}"> &nbsp;reblog</a>{/block:RebloggedFrom}</div>
  903. <!----INFO---------->
  904.  
  905. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}
  906. {/block:Text}
  907.  
  908.  
  909. {block:Quote}
  910. <div class="quote">"{Quote}”</div><h2> — {Source}</h2>
  911. {/block:Quote}
  912.  
  913. {block:Link}<a href="{URL}"><h1>{Name}</h1></a>
  914. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  915.  
  916. {block:Photo}<div>
  917. {block:IfNot400pxPosts} <img alt="{PhotoAlt}" src="{PhotoURL-500}" border="0"></div>{/block:IfNot400pxPosts}
  918. {block:If400pxPosts}<img alt="{PhotoAlt}" src="{PhotoURL-400}" border="0"></div>{/block:If400pxPosts}</div>
  919. {/block:Photo}
  920.  
  921. {block:Photoset}
  922. <div>{block:IfNot400pxPosts}{Photoset-500}{/block:IfNot400pxPosts}
  923. {block:If400pxPosts} {Photoset-400}{/block:If400pxPosts}</div>
  924. {/block:Photoset}
  925.  
  926. {block:Chat}<ul class="chat">{block:Lines}<li class="user">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>
  927. {/block:Chat}
  928.  
  929. {block:Video}
  930. {block:IfNot400pxPosts}{Video-500} {/block:IfNot400pxPosts}
  931. {block:If400pxPosts} {Video-400} {/block:If400pxPosts}
  932. {/block:Video}
  933.  
  934.  
  935. {block:Answer}
  936. <div id="ask">
  937. <div class="linkline"></div><div class="curioso">{Asker}&nbsp;SAID:</div>
  938. <div class="pregunta"> {Question}</div>
  939. <div class="respuesta">{Answer}</div>
  940. </div>
  941. {/block:Answer}
  942.  
  943.  
  944. {block:Audio}
  945. <div id="audio">
  946. <div class="artcover"><img src="http://static.tumblr.com/liul60i/IcMmdl9id/nmusic2.png"></div>{block:AlbumArt}<div class="artcover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  947.  
  948. <div class="player">
  949. <div class="audioplayer">{AudioPlayerWhite}</div>
  950. </div>
  951.  
  952. <div class="audioinfo">
  953. <div class="cancion">{block:TrackName}{TrackName}{/block:TrackName}
  954. - {block:Artist}{Artist}{/block:Artist} </div>
  955. <div style="font-size:8px;">
  956. Played {FormattedPlayCount} times
  957. </div></div>
  958.  
  959. </div>
  960. {/block:Audio}
  961.  
  962. {block:HasTags}<div class="tags">{block:Tags} &nbsp;<a href="{TagUrl}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  963.  
  964.  
  965. {block:IfShowCaption}
  966. {block:Caption}{Caption}{/block:Caption}
  967. {/block:IfShowCaption}
  968.  
  969. {block:IfNotShowCaption}
  970. {block:PermalinkPage}
  971. {block:Caption}{Caption}{/block:Caption}
  972. {/block:PermalinkPage}
  973. {/block:IfNotShowCaption}
  974.  
  975.  
  976.  
  977.  
  978. {block:PostNotes}
  979. <div class="notas">{PostNotes}</div>
  980. {/block:PostNotes}
  981.  
  982. {/block:Posts}
  983.  
  984.  
  985. </div><!---end post-->
  986.  
  987.  
  988. </div></div></div></div></div></div><!---end todo-->
  989.  
  990. <div class="credito"> <a href="http://robbarya.tumblr.com"><img src="http://static.tumblr.com/d4tdea8/Uwan2gowr/iconmonstr-copyright-3-icon-16.png"></a></div>
  991.  
  992. <!----- POPUP ----->
  993. <div id="01"class="popup_block">
  994.  
  995. <h1>{text:ask title}</h1>
  996. <br>
  997. <iframe frameborder="0" border="0" scrolling="no" width="100%" height="190" allowtransparency="true" src="http://www.tumblr.com/ask_form/{text:username}.tumblr.com"></iframe></iframe>
  998. </div></div></div></div></div></div>
  999.  
  1000. </body>
  1001. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement