Advertisement
luciam

Theme #05

Apr 24th, 2015
2,317
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.61 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <!-------------------------------------------------
  3. THEME #05 BY: http://phoenixthemes.tumblr.com
  4. ...................................................
  5. ...................................................
  6.  
  7. TERMS OF USE:
  8. -Don’t remove or move the credit
  9. -Don’t redistribute
  10. -Don’t use as a base or take bits of code
  11. -You can edit it as much as you like as long as the credit remains untouched.
  12. --------------------------------------------->
  13.  
  14. <head>
  15.  
  16. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  17.  
  18. <title>{Title}</title>
  19.  
  20. <!---{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}---->
  21.  
  22. <link rel="shortcut icon" href="{Favicon}" />
  23.  
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  25.  
  26. <script src="http://assets.tumblr.com/assets/scripts/tumblelog.js?_v=6a17c519d68bc98ed5cdd6f4a55dbaa2"></script>
  27.  
  28.  
  29. <link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
  30.  
  31. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  32.  
  33.  
  34. <!-------------------------------META---------------------------------->
  35.  
  36. <meta name="color:background" content="#eee">
  37. <meta name="color:container" content="#fff">
  38. <meta name="color:scrollbar" content="#999">
  39. <meta name="color:title" content="#fff">
  40. <meta name="color:description" content="#fff">
  41. <meta name="color:text" content="#666">
  42. <meta name="color:links" content="#888888">
  43. <meta name="color:links hover" content="#AACAD7">
  44. <meta name="color:nav" content="#AACAD7">
  45. <meta name="color:nav links" content="#fff">
  46. <meta name="color:post info bg" content="#AACAD7">
  47. <meta name="color:post info" content="#fff">
  48. <meta name="color:tags" content="#666">
  49. <meta name="color:tags hover" content="#888888">
  50. <meta name="color:post border" content="#999">
  51. <meta name="color:tooltip" content="#fff">
  52. <meta name="color:tooltip background" content="#AACAD7">
  53.  
  54. <meta name="image:header" content="">
  55. <meta name="image:background" content="">
  56.  
  57. <meta name="text:Link 1 URL" content="/">
  58. <meta name="text:Link 1 Name" content="home">
  59. <meta name="text:Link 2 URL" content="/ask">
  60. <meta name="text:Link 2 Name" content="ask">
  61. <meta name="text:Link 3 URL" content="/">
  62. <meta name="text:Link 3 Name" content="about">
  63. <meta name="text:Link 4 URL" content="/">
  64. <meta name="text:Link 4 Name" content="links">
  65. <meta name="text:Link 5 URL" content="/">
  66. <meta name="text:Link 5 Name" content="extra link">
  67.  
  68.  
  69. <meta name="text:Extra Link 1 URL" content="/">
  70. <meta name="text:Extra Link 1 Name" content="link">
  71. <meta name="text:Extra Link 2 URL" content="/">
  72. <meta name="text:Extra Link 2 Name" content="link">
  73. <meta name="text:Extra Link 3 URL" content="/">
  74. <meta name="text:Extra Link 3 Name" content="link">
  75.  
  76. <meta name="if:Ask slider" content="1">
  77. <meta name="if:About slider" content="1">
  78. <meta name="if:Link slider" content="1">
  79. <meta name="if:Header" content="1">
  80.  
  81. <meta name="if:Hide caption" content="0">
  82. <meta name="if:Hide tags" content="0">
  83.  
  84. <meta name="text:click for posts" content="click for posts">
  85. <meta name="text:about title" content="About">
  86. <meta name="text:about text" content="Here goes the text for your about slider">
  87. <style type="text/css">
  88.  
  89.  
  90. /*--------------------------------RESET----------------------------------*/
  91.  
  92. html, body, div, span, applet, object, iframe,
  93. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  94. a, abbr, acronym, address, big, cite, code,
  95. del, dfn, em, img, ins, kbd, q, s, samp,
  96. small, strike, strong, sub, sup, tt, var,
  97. b, u, i, center,
  98. dl, dt, dd,
  99. fieldset, form, label, legend,
  100. table, caption, tbody, tfoot, thead, tr, th, td,
  101. article, aside, canvas, details, embed,
  102. figure, figcaption, footer, header, hgroup,
  103. menu, nav, output, ruby, section, summary,
  104. time, mark, audio, video {
  105. margin: 0;
  106. padding: 0;
  107. border: 0;
  108. font-size: 100%;
  109. font: inherit;
  110. vertical-align: baseline;
  111. }
  112.  
  113. article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{
  114. display:block;
  115. }
  116.  
  117. /*-------------------------------SCROLL----------------------------------*/
  118.  
  119. ::-webkit-scrollbar-thumb:vertical {
  120. border-left: 1px solid {color:scrollbar};
  121. background:transparent;
  122. height:5px;
  123. }
  124.  
  125. ::-webkit-scrollbar-thumb:horizontal {
  126. border-top: 1px solid {color:scrollbar};
  127. background:transparent;
  128. height:3px;
  129. }
  130.  
  131. ::-webkit-scrollbar-corner {
  132. background-color: transparent;
  133. }
  134.  
  135. ::-webkit-scrollbar {
  136. background-color: transparent;
  137. height:2px;
  138. width:5px;
  139. }
  140.  
  141. * {
  142. box-sizing: border-box;
  143. -webkit-box-sizing: border-box;
  144. -moz-box-sizing: border-box;
  145. -webkit-transition: all 0.4s ease-out;
  146. -moz-transition: all 0.4s ease-out;
  147. -ms-transition: all 0.4s ease-out;
  148. -o-transition: all 0.4s ease-out;
  149. transition: all 0.4s ease-out;
  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. width: 200px;
  159. }
  160.  
  161. .tmblr-iframe:hover,
  162. .tmblr-iframe--desktop-loggedin-controls:hover,
  163. .iframe-controls--desktop:hover {
  164. opacity:0.8;
  165. }
  166.  
  167. /*-------------------------BLOCKQUOTE----------------------*/
  168.  
  169.  
  170. blockquote {
  171. padding:10px;
  172. padding-left:15px;
  173. margin:5px;
  174. border-left:1px dotted {color:post border};
  175. }
  176.  
  177.  
  178. blockquote img {
  179. padding: 10px 0px;
  180. max-width:250px;
  181. }
  182.  
  183. /*---------------------------BODY-------------------------------------*/
  184. #s-m-t-tooltip{
  185. font-family: calibri;
  186. letter-spacing:1px;
  187. max-width:150px;
  188. font-size: 8px;
  189. margin:0px 10px;
  190. padding:3px 5px;
  191. background:{color:tooltip background};
  192. color: {color:tooltip};
  193. opacity: .8;
  194. z-index:9994444444444444444444444444444444444444444444444444444444444444;
  195. text-transform:uppercase;
  196. border:1px solid {color:tooltip};
  197. }
  198.  
  199. html {
  200. height: 100%;
  201. }
  202.  
  203.  
  204. body {
  205. background: {color:background};
  206. color: {color:text};
  207. background-attachment: fixed;
  208. background-position:bottom;
  209. background-size:150%;
  210. height:100%;
  211. background-attachment:fixed;
  212. background-repeat:no-repeat;
  213. margin: 0;
  214. padding: 0px;
  215. font-family: Consolas, sans-serif;
  216. font-size: 10px;
  217. word-wrap: break-word;
  218. letter-spacing: 0;
  219. line-height:130%;
  220. }
  221.  
  222. a, a:active, a:visited, a:hover {
  223. color: {color:links};
  224. text-decoration:none;
  225. -webkit-transition: all 0.6s ease-out;
  226. -moz-transition: all 0.6s ease-out;
  227. -ms-transition: all 0.6s ease-out;
  228. -o-transition: all 0.6s ease-out;
  229. transition: all 0.6s ease-out;
  230. }
  231.  
  232. a:hover {
  233. color: {color:links hover};
  234. }
  235.  
  236. pre {
  237. white-space: pre-wrap;
  238. white-space: -moz-pre-wrap;
  239. white-space: -pre-wrap;
  240. white-space: -o-pre-wrap;
  241. word-wrap: break-word;
  242. }
  243.  
  244. small{font-size:8px;}
  245.  
  246. big {font-size:12px;}
  247.  
  248. strong, b {
  249. font-weight:bold;
  250. }
  251.  
  252. em, i, u {
  253. font-style:italic;
  254. }
  255.  
  256. .phoenixt {
  257. position:absolute;
  258. bottom:20px;
  259. right:20px;
  260. text-align:center;
  261. }
  262. /*---------------------------HEADER--------------------------------*/
  263.  
  264. #centerdiv {
  265. width:100%;
  266. height:100%;
  267. padding-top:50px;
  268. }
  269.  
  270. #todo {
  271. width: 500px;
  272. height:500px;
  273. margin: 0px auto;
  274. background: {color:container};
  275. padding:25px;
  276. border:1px #d3d3d3 solid;
  277. }
  278.  
  279. header {
  280. background-color:#eee;
  281. position:absolute;
  282. width: 450px;
  283. height: 450px;
  284. overflow:hidden;
  285. z-index:99;
  286. }
  287.  
  288. {block:permalinkpage}
  289. header {
  290. display:none;
  291. }
  292. {/block:permalinkpage}
  293.  
  294. header img {
  295. width: 400px;
  296. height: 400px;
  297. margin: 25px;
  298. -webkit-transform: scale(0.9);
  299. -moz-transform: scale(0.9);
  300. -ms-transform: scale(0.9);
  301. -o-transform: scale(0.9);
  302. transform: scale(0.9);
  303. }
  304.  
  305. header:hover img {
  306. -webkit-transform: scale(1.05,1.07);
  307. -webkit-transition-timing-function: ease-out;
  308. -webkit-transition-duration: 600ms;
  309. -moz-transform: scale(1.05,1.07);
  310. -moz-transition-timing-function: ease-out;
  311. -moz-transition-duration: 600ms;
  312. opacity:0.5;
  313. }
  314.  
  315. #titulo {
  316. font-family: 'Raleway', calibri, sans-serif;
  317. letter-spacing: 0.2em;
  318. width:450px;
  319. border: 50px solid {color:background};
  320. height:450px;
  321. position:absolute;
  322. top:0;
  323. color:{color:title};
  324. }
  325.  
  326. #titulo p {
  327. text-align:right;
  328. color:{color:title};
  329. letter-spacing: 0.2em;
  330. margin: 40px 30px 10px 40px;
  331. font-size:22px;
  332. font-weight:bold;
  333. text-transform:uppercase;
  334. }
  335.  
  336. #titulo #desc {
  337. color:{color:description};
  338. width:300px;
  339. height:250px;
  340. padding:10px;
  341. text-align:right;
  342. margin:auto;
  343. margin-top: 50px;
  344. border-top: 5px solid {color:title};
  345. font-size: 14px;
  346. font-weight:bold;
  347. opacity:0;
  348. }
  349.  
  350. #titulo:hover #desc {
  351. margin-top:0px;
  352. opacity:1;
  353. }
  354.  
  355. #titulo:hover p {
  356. margin: 30px 30px 10px 40px;
  357. }
  358.  
  359. #click {
  360. background-color: {color:background};
  361. padding:10px;
  362. font-size:8px;
  363. color: {color:text};
  364. position:absolute;
  365. bottom:10px;
  366. left:125px;
  367. cursor:pointer;
  368. }
  369.  
  370. #click:hover {
  371. background: {color:nav};
  372. color: {color:nav links};
  373. }
  374.  
  375. #titulo:hover #click {
  376. bottom:30px;
  377. }
  378.  
  379. .photoset iframe {
  380. width:400px;
  381. }
  382.  
  383. #links {
  384. text-align:center;
  385. }
  386.  
  387. #links a {
  388. border: 1px solid {color:nav links};
  389. text-transform:uppercase;
  390. display:block;
  391. padding:5px;
  392. margin: 30px 0 0px 155px;
  393. width: 100px;
  394. }
  395.  
  396. #links a:hover {
  397. background: {color:nav};
  398. color: {color:nav links};
  399. }
  400.  
  401. /*-----------------------------------------------------------*/
  402.  
  403. .abajo {
  404. z-index:33;
  405. width:450px;
  406. background:rgba(238, 238, 238, 0.7);
  407. position:absolute;
  408. margin-top:50px;
  409. padding:20px;
  410. display:none;
  411. height:0;
  412. text-align:center;
  413. overflow:auto;
  414. }
  415.  
  416. .close {
  417. font-size:30px;
  418. color:{color:text};
  419. margin:20px auto 0px auto;
  420. text-align:center;
  421. width:50%;
  422. height:50px;
  423. text-transform:uppercase;
  424. cursor:pointer;
  425. }
  426.  
  427. nav {
  428. background:{color:nav};
  429. height: 50px;
  430. text-align:center;
  431. position:absolute;
  432. width:450px;
  433. }
  434.  
  435. nav a {
  436. text-transform:uppercase;
  437. color:{color:nav links};
  438. font-weight:bold;
  439. font-size:9px;
  440. letter-spacing:0.2em;
  441. display:inline-block;
  442. padding:5px;
  443. margin-top:15px;
  444. cursor:pointer;
  445. }
  446.  
  447. nav a:hover {
  448. opacity:0.6;
  449. color:{color:nav links};
  450. }
  451.  
  452. .mask {
  453. display:none;
  454. }
  455.  
  456. .navcredit {
  457. display:none;
  458. }
  459. /*--------------------post---------------------------------------*/
  460.  
  461. #main {
  462. background:{color:background};
  463. width:450px;
  464. height:390px;
  465. overflow:auto;
  466. margin-top:60px;
  467. padding-top:20px;
  468. }
  469.  
  470. #main .post {
  471. width: 400px;
  472. margin: 0px auto 15px auto;
  473. border-bottom: 1px dotted {color:post border};
  474. padding-bottom:15px;
  475. }
  476.  
  477. .post .text, .post .postlink, .post .chat, .post .quote{
  478. padding:5px;
  479. }
  480.  
  481. .post img {
  482. max-width:400px;
  483. }
  484.  
  485. .cap {
  486. padding:5px 0px;
  487. }
  488.  
  489. h1 {
  490. font-family: 'Raleway', calibri, sans-serif;
  491. font-size:14px;
  492. text-align:center;
  493. text-transform:uppercase;
  494. margin-bottom:10px;
  495. letter-spacing:0.2em;
  496. }
  497. /*--------------------bottom-----------------------------*/
  498.  
  499. .bottom {
  500. width:100%;
  501. margin-top:7px;
  502. font-size:8px;
  503. }
  504.  
  505. .info {
  506. background: {color:post info bg};
  507. color:{color:post info};
  508. height:20px;
  509. padding:0px 5px;
  510. text-transform:uppercase;
  511. letter-spacing:0.2em;
  512. line-height:20px;
  513. }
  514.  
  515. .info a {
  516. color:{color:post info};
  517. }
  518.  
  519. .source {
  520. float:right;
  521. }
  522.  
  523. .tags {
  524. margin-top:10px;
  525. letter-spacing:0.1em;
  526. }
  527.  
  528. .tags a {
  529. color:{color:tags};
  530. }
  531.  
  532. .tags a:hover {
  533. color:{color:tags hover};
  534. }
  535.  
  536. /*------------------------*/
  537.  
  538. #pagination {
  539. margin:-16px auto;
  540. width:300px;
  541. text-align:center;
  542. }
  543.  
  544. #pagination a {
  545. border-top:1px solid #999;
  546. padding:10px;
  547. display:inline-block;
  548. margin-right:2px;
  549. }
  550.  
  551. #pagination a:hover {
  552. border-top:1px solid {color:nav};
  553. color: {color:nav};
  554. }
  555.  
  556. .current {
  557. border-top:1px solid {color:nav};
  558. color: {color:nav};
  559. padding:10px;
  560. }
  561.  
  562. /*-------------------------------AUDIO------------------------------*/
  563.  
  564. .audio {
  565. width:100%;
  566. height:220px;
  567. display:block;
  568. }
  569.  
  570. .artcover img {
  571. width:200px;
  572. }
  573.  
  574.  
  575. .player {
  576. width:150px;
  577. height:150px;
  578. margin-top:-180px;
  579. margin-left: 25px;
  580. padding-top:10px;
  581. display:block;
  582. opacity:0.9;
  583. background:{color:container};
  584. }
  585.  
  586. .player:hover {
  587. opacity:0.7;
  588. }
  589.  
  590. .audioplayer {
  591. width:30px;
  592. height:30px;
  593. margin-top:45px;
  594. margin-left:55px;
  595. padding:5px;
  596. overflow: hidden;
  597. }
  598.  
  599. .audioinfo {
  600. float:right;
  601. margin-top:-120px;
  602. margin-left:20px;
  603. padding:18px 10px;
  604. border-left:1px solid {color:post border};
  605. font-size: 14px;
  606. font-weight: bold;
  607. text-transform: uppercase;
  608. width:180px;
  609. display:block;
  610. font-size:10px;
  611. letter-spacing:0.1em;
  612. text-align:left;
  613. overflow: hidden;
  614. }
  615.  
  616. /*------------------------------------CHAT-------------------------*/
  617. .user:nth-of-type(odd){
  618. border-left:1px solid {color:post border};
  619. }
  620.  
  621.  
  622. .user .label {
  623. font-weight:bold;
  624. text-transform:uppercase;
  625. font-size:9px;
  626. display:block;
  627. margin-bottom:2px;
  628. }
  629.  
  630. .user:nth-of-type(even) .label {
  631. color:{color:nav};
  632. }
  633.  
  634. ul.chat, .chat ol, .chat li {
  635. list-style:none;
  636. margin:0px;
  637. padding: 10px;
  638.  
  639. }
  640.  
  641. /*--------------------------------ASK-----------------------------*/
  642.  
  643. .pregunta {
  644. width: 100%;
  645. margin:0 auto;
  646. min-height: 60px;
  647. padding:10px;
  648. margin-bottom:10px;
  649. background:{color:container};
  650. }
  651.  
  652. .asker-avatar img {
  653. width: 40px;
  654. height:40px;
  655. margin-bottom:-5px;
  656.  
  657. }
  658.  
  659. .curioso {
  660. margin-left:50px;
  661. margin-top:-35px;
  662. text-transform:uppercase;
  663. color:{color:links};
  664. font-size:11px;
  665. padding-bottom:2px;
  666. }
  667.  
  668. .curioso a {
  669. color: {color:links};
  670. }
  671. .asker-question {
  672. margin-top:5px;
  673. margin-left:50px;
  674. }
  675.  
  676. .respuesta {
  677. width:100%;
  678. padding: 10px;
  679. }
  680.  
  681. .replies {
  682. padding: 10px;
  683. width:100%;
  684. }
  685. /*-----------------------------------QUOTE----------------------*/
  686. .quote {
  687. width: 350px;
  688. padding:20px;
  689. text-indent: 0px;
  690. text-align: justify;
  691. font-size: 14px;
  692. font-style: none;
  693. font-weight: lighter;
  694. line-height: 150%;
  695. font-family: 'Raleway', calibri, sans-serif;
  696. margin:0 auto;
  697. }
  698.  
  699. .quote:first-letter {
  700. padding-right: 0;
  701. color: {color:nav};
  702. text-transform:uppercase;
  703. }
  704.  
  705. .post h2 {
  706. text-transform: uppercase;
  707. font-weight: 300;
  708. font-size: 9px;
  709. text-align:left;
  710. font-family:consolas;
  711. width: 350px;
  712. }
  713.  
  714. /*-----------------------------------NOTAS----------------------*/
  715.  
  716. .notas {
  717. width: 400px;
  718. position:relative;
  719. text-transform: uppercase;
  720. list-style-type: none;
  721. font-size: 8px;
  722. letter-spacing: 0.2em;
  723. text-align:center;
  724. }
  725.  
  726. ol.notes {
  727. list-style-type: none;
  728. padding: 0;
  729. }
  730. ol.notes li.note {
  731. display: inline-block;
  732. }
  733.  
  734. ol.notes li.note span {
  735. display:none;
  736. }
  737.  
  738. ol.notes li.note img.avatar {
  739. display:inline-block;
  740. width: 15px!important;
  741. height: 15px;
  742. margin: 2px;
  743. opacity: 0.6;
  744. }
  745.  
  746. ol.notes li.note img.avatar:hover {
  747. opacity:1;
  748. }
  749.  
  750. ol.notes li.note blockquote {
  751. display: none;
  752. }
  753. ol.notes li.more_notes_link_container {
  754. display: block;
  755. margin-top: 10px;
  756. }
  757.  
  758. /*---------------------------------*/
  759.  
  760. .closeheader {
  761. height:0px;
  762. }
  763.  
  764. .openheader {
  765. height:400px;
  766. display:block;
  767.  
  768. -webkit-transition: all 0.4s ease-out;
  769. -moz-transition: all 0.4s ease-out;
  770. -ms-transition: all 0.4s ease-out;
  771. -o-transition: all 0.4s ease-out;
  772. transition: all 0.4s ease-out;
  773. }
  774.  
  775.  
  776. /*TABLETS*/
  777. @media screen and (max-width:768px) {
  778.  
  779. header img {
  780. width: 400px;
  781. height: 400px;
  782. margin: 25px;
  783. -webkit-transform: scale(1.05,1.07);
  784. -webkit-transition-timing-function: ease-out;
  785. -webkit-transition-duration: 600ms;
  786. -moz-transform: scale(1.05,1.07);
  787. -moz-transition-timing-function: ease-out;
  788. -moz-transition-duration: 600ms;
  789. opacity:0.5;
  790. }
  791.  
  792.  
  793. #titulo p {
  794. margin: 30px 30px 10px 40px;
  795. }
  796.  
  797. #titulo #desc {
  798. margin-top:0px;
  799. opacity:1;
  800. }
  801.  
  802. #click {
  803. margin-top:0px;
  804. opacity:1;
  805. bottom:30px;
  806. }
  807.  
  808. h1 {
  809. line-height:130%;
  810. }
  811. }
  812.  
  813. /*MOBILE*/
  814. @media screen and (max-width:600px) {
  815.  
  816.  
  817. body {
  818. height:100%;
  819. }
  820.  
  821. #todo, #centerdiv {
  822. width:100%;
  823. height:100%;
  824. margin:0 auto;
  825. padding:0;
  826. overflow:visible;
  827. background:transparent;
  828. }
  829.  
  830. header {
  831. display:block;
  832. width:100%;
  833. margin: 0 auto;
  834. position:static;
  835. min-height:100px;
  836. height:auto;
  837. background:transparent;
  838. }
  839.  
  840. #titulo {
  841. height:150px;
  842. width:100%;
  843. padding:20px;
  844. overflow:hidden;
  845. margin:0 auto;
  846. border:none;
  847. text-align:center;
  848. }
  849.  
  850. #titulo p {
  851. display:block;
  852. line-height:100%;
  853. margin:10px auto;
  854. font-size:30px;
  855. padding:0;
  856. text-align:center;
  857. }
  858.  
  859. #titulo #desc {
  860. margin:-10px auto;
  861. text-align:center;
  862. width:100%;
  863. border:none;
  864. }
  865.  
  866. header img {
  867. display:none;
  868. }
  869.  
  870. #titulo:hover p {
  871. margin: 10px auto;
  872. }
  873.  
  874. #titulo:hover #desc {
  875. margin: -10px auto;}
  876.  
  877. #click {
  878. display:none;
  879. }
  880. nav {
  881. margin: 0 auto;
  882. position:static;
  883. width:100%;
  884. overflow:hidden;
  885. }
  886.  
  887. #main {
  888. margin: 10px auto;
  889. height:100%;
  890. width:100%;
  891. max-width:400px;
  892. overflow:visible;
  893. padding:0;
  894. background:transparent;
  895. }
  896.  
  897. #main .post {
  898. padding:0;
  899. padding-bottom:15px;
  900. width:100%;
  901. }
  902.  
  903. .post .photoset iframe, .post .photo img {
  904. width:100%;
  905. }
  906. nav a.clickask {
  907. display:none;
  908. }
  909.  
  910. .mask {display:inline-block}
  911.  
  912. .navcredit {display:inline-block}
  913. }
  914.  
  915. </style>
  916.  
  917.  
  918. </head>
  919.  
  920. <body>
  921.  
  922. <div id="centerdiv">
  923. <div id="todo">
  924. {block:Indexpage}
  925. {Block:ifheader}
  926. <header id="header">
  927. <img src="{image:header}">
  928. <div id="titulo">
  929.  
  930. <p>{Title}</p>
  931. <div id="desc">
  932. {Description}
  933. </br>
  934. <div id="click">{text:click for posts}</div>
  935. </div>
  936.  
  937.  
  938. </div>
  939. </header>
  940. {Block:ifheader}
  941. {/block:Indexpage}
  942.  
  943. {block:ifaskslider}
  944. <div id="message" class="abajo">
  945. <div class="close"> &times;</div>
  946. <h1>{AskLabel}</h1>
  947. </br></br>
  948. <iframe frameborder="0" scrolling="yes" width="100%" height="200px" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com"></iframe>
  949.  
  950. </div>
  951. {/block:ifaskslider}
  952.  
  953.  
  954. {block:ifaboutslider}
  955. <div id="about" class="abajo">
  956. <div class="close"> &times;</div>
  957. <h1>{text:about title}</h1>
  958. {text:about text}
  959. </br>
  960.  
  961. </div>
  962. {/block:ifaboutslider}
  963.  
  964. {block:iflinkslider}
  965. <div id="links" class="abajo">
  966. <div class="close"> &times;</div>
  967. <h1>{text:links title}</h1>
  968. <a href="{text:Extra Link 1 Url}">{text:Extra Link 1 Name}</a>
  969. </br>
  970. <a href="{text:Extra Link 2 Url}">{text:Extra Link 2 Name}</a>
  971. </br>
  972. <a href="{text:Extra Link 3 Url}">{text:Extra Link 3 Name}</a>
  973. </div>
  974. {/block:iflinkslider}
  975.  
  976.  
  977. <nav>
  978. <a href="{text:Link 1 URL}">{text:Link 1 Name}</a>
  979.  
  980. {block:ifaskslider}
  981. <a class="clickask">{text:Link 2 Name}</a>
  982. {/block:ifaskslider}
  983.  
  984. {block:ifnotaskslider}
  985. <a href="{text:Link 2 URL}">{text:Link 2 Name}</a>
  986. {/block:ifnotaskslider}
  987. <a href="{text:Link 2 URL}" class="mask">{text:Link 2 Name}</a>
  988.  
  989. {block:ifaboutslider}
  990. <a class="clickabout">{text:Link 3 Name}</a>
  991. {/block:ifaboutslider}
  992. {block:ifnotaboutslider}
  993. <a href="{text:Link 3 URL}">{text:Link 3 Name}</a>
  994. {/block:ifnotaboutslider}
  995.  
  996.  
  997. {block:iflinkslider}
  998. <a class="clicklinks">{text:Link 4 Name}</a>
  999. {/block:iflinkslider}
  1000. {block:ifnotlinkslider}
  1001. <a href="{text:Link 4 URL}">{text:Link 4 Name}</a>
  1002. {/block:ifnotlinkslider}
  1003.  
  1004. <a href="{text:Link 5 URL}">{text:Link 5 Name}</a>
  1005.  
  1006. <a class="navcredit" href="http://phoenixthemes.tumblr.com">credit</a>
  1007. </nav>
  1008.  
  1009. <div id="main">
  1010.  
  1011.  
  1012. {block:Posts}
  1013.  
  1014. <div class="post">
  1015.  
  1016.  
  1017. <!---------HIDESOURCE---------------------------->
  1018.  
  1019. {block:ContentSource}
  1020.  
  1021. <!--- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1022.  
  1023. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1024.  
  1025. {/block:SourceLogo}
  1026.  
  1027. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  1028.  
  1029. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1030.  
  1031. <!---------------------------------------------------------->
  1032.  
  1033.  
  1034. {block:Text}<div class="text">{block:Title}<h1 class="titulo">{Title}</h1>{/block:Title}{Body}</div>
  1035. {/block:Text}
  1036.  
  1037.  
  1038. {block:Quote}
  1039. <div class="quote">"{Quote}”<h2> — {Source}</h2></div>
  1040. {/block:Quote}
  1041.  
  1042. {block:Link}<div class="postlink"><a href="{URL}"><h1 class="titulo">{Name}</h1></a>
  1043. {block:Description}<p>{Description}</p>{/block:Description}</div>
  1044. {/block:Link}
  1045.  
  1046. {block:Photo}<div class="photo"><img src="{PhotoURL-500}"/></div>
  1047. {/block:Photo}
  1048.  
  1049. {block:Photoset}<div class="photoset">{Photoset}</div>
  1050. {/block:Photoset}
  1051.  
  1052. {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>
  1053. {/block:Chat}
  1054.  
  1055. {block:Video}{Video-400}{/block:Video}
  1056.  
  1057.  
  1058.  
  1059. {block:Answer}
  1060. <div class="pregunta">
  1061. <div class="asker-avatar"><img src="{AskerPortraitURL-40}">
  1062. <div class="curioso">{Asker}</div>
  1063. </div>
  1064. <div class="asker-question">{Question}</div>
  1065. </div>
  1066.  
  1067. {block:Answerer}
  1068. <div class="respuesta">
  1069. <div class="answerer">{Answerer}:</div>
  1070. <div class="answerer-answer">{Answer}</div>
  1071. </div>
  1072. {/block:Answerer}
  1073.  
  1074. <div class="replies">
  1075. {Replies}
  1076. </div>
  1077. {/block:Answer}
  1078.  
  1079.  
  1080. {block:Audio}
  1081. <div class="audio">
  1082. {block:AlbumArt}<div class="artcover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  1083.  
  1084. <div class="player">
  1085. <div class="audioplayer">{AudioPlayerWhite}</div>
  1086. </div>
  1087.  
  1088. <div class="audioinfo">
  1089. <div class="cancion">{block:TrackName}name:{TrackName}{/block:TrackName}<br> {block:Artist}artist:{Artist}{/block:Artist} </div>
  1090. <div style="font-size:8px;">
  1091. Played: {FormattedPlayCount} times
  1092. </div></div>
  1093.  
  1094. </div>
  1095. {/block:Audio}
  1096.  
  1097. {block:ifnothidecaption}{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}{/block:ifnothidecaption}
  1098.  
  1099. {block:ifhidecaption}
  1100. {block:PermalinkPage}{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
  1101. {block:ifhidecaption}
  1102.  
  1103. <div class="bottom">
  1104.  
  1105.  
  1106. <!----INFO---->
  1107.  
  1108.  
  1109. <div class="info">
  1110. {block:Date}<a title="permalink" href="{Permalink}">{DayOfMonthWithZero}/{MonthNumberWithZero}/{ShortYear}-{12Hour}{CapitalAmPm}{/block:Date} {block:NoteCount} | {NoteCountWithLabel}{/block:NoteCount}</a>
  1111. <div class="source">
  1112. {block:RebloggedFrom}
  1113. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> |
  1114. <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
  1115. {/block:RebloggedFrom}
  1116. </div>
  1117.  
  1118.  
  1119. </div>
  1120.  
  1121. {block:ifnothidetags}
  1122. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1123. {/block:ifnothidetags}
  1124.  
  1125. {block:ifhidetags}
  1126. {block:PermalinkPage}
  1127. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1128. {/block:PermalinkPage}
  1129. {block:ifhidetags}
  1130.  
  1131. <!----INFO---------->
  1132.  
  1133. </div><!---bottom--->
  1134. {block:PostNotes}
  1135. <div class="notas">{PostNotes}</div>
  1136. {/block:PostNotes}
  1137.  
  1138. </div>
  1139.  
  1140. {/block:posts}
  1141.  
  1142. {block:Pagination}
  1143. <div id="pagination">
  1144. {block:JumpPagination length="5"}
  1145. {block:CurrentPage}
  1146. <span class="current">{PageNumber}</span>
  1147. {/block:CurrentPage}
  1148. {block:JumpPage}
  1149. <a class="jump" href="{URL}">{PageNumber}</a>
  1150. {/block:JumpPage}
  1151. {/block:JumpPagination}
  1152. </div>
  1153. {/block:Pagination}
  1154.  
  1155. </div><!--main-->
  1156.  
  1157. </div><!---todo--->
  1158.  
  1159. <div class="phoenixt"><a href="http://phoenixthemes.tumblr.com">P.</a></div>
  1160.  
  1161. </div>
  1162. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1163. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1164. <script>
  1165. (function($){
  1166. $(document).ready(function(){
  1167. $("[title]").style_my_tooltips({
  1168. tip_follows_cursor:true,
  1169. tip_delay_time:0,
  1170. tip_fade_speed:400,
  1171. attribute:"title"
  1172. });
  1173. });
  1174. })(jQuery);
  1175. </script>
  1176.  
  1177. <script>
  1178. $(document).ready(function(){
  1179. $("#click").click(function(){
  1180. $("#header").addClass('closeheader');
  1181. });
  1182. $(".clickask").click(function(){
  1183. $("#message").addClass('openheader');
  1184. $("#about, #links").removeClass('openheader');
  1185. });
  1186. $(".clickabout").click(function(){
  1187. $("#about").addClass('openheader');
  1188. $("#message, #links").removeClass('openheader');
  1189. });
  1190. $(".clicklinks").click(function(){
  1191. $("#links").addClass('openheader');
  1192. $("#message, #about").removeClass('openheader');
  1193. });
  1194. $(".close").click(function(){
  1195. $("#message, #about, #links").removeClass('openheader');
  1196. });
  1197. });
  1198. </script>
  1199.  
  1200.  
  1201. </body>
  1202. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement