API tools faq
paste
Advertisement
luciam

Theme #03

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