API tools faq
paste
Advertisement
luciam

Theme #01

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