API tools faq
paste
trenzalours

Theme 17 Facade

trenzalours
Sep 13th, 2014
1,438
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.82 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4.  
  5. <title>{Title}</title>
  6.  
  7. <link rel="shortcut icon" href="{favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10. <link href='http://fonts.googleapis.com/css?family=Alegreya+Sans+SC:400,700' rel='stylesheet' type='text/css'>
  11. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  12.  
  13.  
  14. <!-- ᴛʜᴇᴍᴇ ₁₇ ﹣ ғᴀᴄᴀᴅᴇ
  15. ʙʏ ᴛʀᴇɴᴢᴀᴛʜᴇᴍᴇs
  16. ᴅᴏɴ·ᴛ sᴛᴇᴀʟ ɪᴛs ɴᴏᴛ ᴄʜɪʟʟ
  17. -->
  18.  
  19. <meta name="color:Background" content="#ffffff"/>
  20. <meta name="color:Title" content="#ffffff"/>
  21. <meta name="color:Text" content="#aaaaaa"/>
  22. <meta name="color:Link" content="#000000"/>
  23. <meta name="color:Hover" content="#ffffff"/>
  24. <meta name="color:Borders" content="#aaaaaa"/>
  25. <meta name="color:Scrollbar" content="#000000"/>
  26. <meta name="color:Accent" content="#ffffff"/>
  27.  
  28. <meta name="image:Background Image" content="http://static.tumblr.com/3dkvxpf/ebfnc69i0/468335066_6195fbad3a_o.jpg"/>
  29. <meta name="image:Body Image" content="http://static.tumblr.com/3dkvxpf/30Fnc69g0/subtle_dots.png"/>
  30. <meta name="if:Body Image" content="0">
  31. <meta name="text:Tumblr URL" content="Type in your URL! Your askbox/follow will not work without it!">
  32. <meta name="text:FAQ" content="Type out your FAQ here!" />
  33. <meta name="if:Pattern" content="0">
  34.  
  35. <meta name="select:Player Color" content="black" title="Black">
  36. <meta name="select:Player Color" content="white" title="White">
  37. <meta name="select:Player Color" content="grey" title="Grey">
  38.  
  39. <meta name="text:Link 1 URL" content="" />
  40. <meta name="text:Link 1" content="" />
  41. <meta name="text:Link 2 URL" content="" />
  42. <meta name="text:Link 2" content="" />
  43. <meta name="text:Link 3 URL" content="" />
  44. <meta name="text:Link 3" content="" />
  45. <meta name="text:Link 4 URL" content="" />
  46. <meta name="text:Link 4" content="" />
  47.  
  48.  
  49.  
  50. <!--side push menu from codrops-->
  51. <!--don't touch-->
  52. <script src="http://takien.github.io/jPushMenu/js/jquery-1.9.1.min.js"></script>
  53. <script src="http://takien.github.io/jPushMenu/js/jPushMenu.js"></script>
  54.  
  55. <!--call jPushMenu, required-->
  56. <script>
  57. jQuery(document).ready(function($) {
  58. $('.toggle').jPushMenu();
  59. });
  60. </script>
  61.  
  62. <!-- jquery for tooltips-->
  63. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  64.  
  65. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  66.  
  67. <script>
  68.  
  69. (function($){
  70.  
  71. $(document).ready(function(){
  72.  
  73. $("a[title]").style_my_tooltips({
  74.  
  75. tip_follows_cursor:true,
  76.  
  77. tip_delay_time:30,
  78.  
  79. tip_fade_speed:300,
  80.  
  81. attribute:"title"
  82.  
  83. });
  84.  
  85. });
  86.  
  87. })(jQuery);
  88.  
  89. </script>
  90.  
  91.  
  92.  
  93.  
  94.  
  95.  
  96. <!--CSS customization here. -->
  97.  
  98. <style type="text/css">
  99.  
  100.  
  101.  
  102. *, #nav a:hover {
  103. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  104. }
  105.  
  106. *, #tops a:hover {
  107. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  108. }
  109.  
  110. *, body a:hover {
  111. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  112. }
  113.  
  114. #s-m-t-tooltip{
  115. padding:4px 9px;
  116. position:absolute;
  117. margin: 10px 20px;
  118. padding:5px;
  119. font-size:9px;
  120. font-family: 'Alegreya Sans SC', sans-serif;
  121. z-index: 99999999999;
  122. letter-spacing:1px;
  123. text-transform:lowercase;
  124. background:{color:background};
  125. }
  126.  
  127. /* SELECTION */
  128.  
  129. ::selection {
  130. background-color:{color:accent};
  131. color:white;}
  132.  
  133. /* SCROLLBAR */
  134.  
  135. ::-webkit-scrollbar {
  136. background:#eee;
  137. height:50px;
  138. width:3px;}
  139.  
  140. ::-webkit-scrollbar-thumb:vertical {
  141. background:{color:scrollbar};
  142. opacity:.3;
  143. height:3px;}
  144.  
  145. ::-webkit-scrollbar-thumb:horizontal {
  146. background-color:transparent;
  147. height:50px!important;}
  148.  
  149. /*basics*/
  150. blockquote {padding:5px 0 5px 30px;
  151. border-left:1px solid {color:text};
  152. margin-left:30px;
  153. }
  154.  
  155. body {
  156. {block:ifnotBodyImage}
  157. background:{color:background};
  158. {/block:ifnotBodyImage}
  159. {block:ifBodyImage}
  160. background:url({image:Body Image})
  161. repeat center center fixed;
  162. {/block:ifBodyImage}
  163. color:{color:text};
  164. font:8px arial;
  165. letter-spacing:1px;
  166. text-align:justify;
  167. margin:0;
  168. line-height:1.4em;}
  169.  
  170.  
  171. a {
  172. color:{color:accent};
  173. text-decoration:none;
  174. -webkit-transition: all 1s ease;
  175. -moz-transition: all 1s ease;
  176. -o-transition: all 1s ease;
  177. -ms-transition: all 1s ease;
  178. transition: all 1s ease;
  179. }
  180.  
  181. a:hover {
  182. color:{color:hover};
  183. text-decoration:none;
  184. text-shadow: 1px 0 .2px {color:accent}, 0px 0 .2px {color:hover};
  185. -webkit-transition: all 1s ease;
  186. -moz-transition: all 1s ease;
  187. -o-transition: all 1s ease;
  188. -ms-transition: all 1s ease;
  189. transition: all 1s ease;
  190. }
  191.  
  192. img{opacity:1;
  193. border:none;
  194. text-decoration:none}
  195.  
  196.  
  197. small {
  198. font-size:9px;}
  199.  
  200. big {
  201. font-size:12px;}
  202.  
  203. pre{
  204. background:{color:background};
  205. padding:10px;
  206. color:{color:text};
  207. font-family:arial;
  208. text-transform:uppercase;
  209. border-bottom:1px solid {color:borders};
  210. font-size:7px;
  211. letter-spacing:1px;
  212. white-space: pre-wrap;
  213. white-space: -moz-pre-wrap;
  214. white-space: -pre-wrap;
  215. white-space: -o-pre-wrap;
  216. word-wrap: break-word;}
  217.  
  218. code{
  219. text-transform:lowercase;
  220. font-style:italic;
  221. }
  222.  
  223. b,strong{
  224. color:{color:accent};
  225. font-weight:bold;
  226. }
  227. em,i{
  228. color:{color:accent};
  229. font-style:italic;
  230. }
  231.  
  232.  
  233. strike{
  234. text-decoration: line-through;
  235. }
  236.  
  237.  
  238. #title {font-size:12px;
  239. line-height:1.4em;
  240. margin-bottom:10px;
  241. text-transform:uppercase;
  242. text-align:left;
  243. font-family: 'Alegreya Sans SC', sans-serif;
  244. }
  245.  
  246.  
  247. /*sidebar*/
  248. header {
  249. text-align: center;
  250. padding: 2em 5%;
  251. {block:ifnotPattern}
  252. background: url({image:Background Image})
  253. no-repeat center center fixed;
  254. -webkit-background-size: cover;
  255. -moz-background-size: cover;
  256. -o-background-size: cover;
  257. background-size: cover;
  258. {/block:ifnotPattern}
  259. {block:ifPattern}
  260. background: url({image:Background Image})
  261. repeat center center fixed;
  262. {/block:ifPattern}
  263. color: #fff;
  264. }
  265.  
  266. header::after {
  267. content: '';
  268. display: inline-block;
  269. width: 100%;
  270. }
  271.  
  272. header h1,
  273. header nav {
  274. display: inline-block;
  275. vertical-align: middle;
  276. }
  277.  
  278. header h1 {
  279. font-family: 'Alegreya Sans SC', sans-serif;
  280. text-align: center;
  281. padding-top: 0.5em;
  282. border:2px solid {color:borders};
  283. background:white;
  284. padding:12px;
  285. margin-left:10px;
  286. font-size:22px;
  287. text-transform:lowercase;
  288.  
  289. }
  290. header h1 a{
  291. color:{color:title};
  292. -webkit-transition: all 1s ease;
  293. -moz-transition: all 1s ease;
  294. -o-transition: all 1s ease;
  295. -ms-transition: all 1s ease;
  296. transition: all 1s ease;
  297. }
  298. header h1 a:hover{
  299. text-decoration:none;
  300. color:{color:hover};
  301. text-shadow: 1px 0px 3px {color:link};
  302. -webkit-transition: all 1s ease;
  303. -moz-transition: all 1s ease;
  304. -o-transition: all 1s ease;
  305. -ms-transition: all 1s ease;
  306. transition: all 1s ease;
  307. }
  308.  
  309. header nav {
  310. padding-top: 1em;
  311. word-spacing:5px;
  312. text-align:center;
  313. width:200px;
  314. }
  315.  
  316. header nav a{
  317. -webkit-transition: all 1s ease;
  318. -moz-transition: all 1s ease;
  319. -o-transition: all 1s ease;
  320. -ms-transition: all 1s ease;
  321. transition: all 1s ease;
  322. }
  323. header nav a:hover{
  324. -webkit-transition: all 1s ease;
  325. -moz-transition: all 1s ease;
  326. -o-transition: all 1s ease;
  327. -ms-transition: all 1s ease;
  328. transition: all 1s ease;}
  329. .uno{
  330. display:inline-block;
  331. margin-left:-12px;
  332. }
  333.  
  334. .uno a{
  335. display:inline-block;
  336. padding:7px;
  337. border:2px solid {color:borders};
  338. background:white;
  339. border-radius:100%;
  340. }
  341. .uno a:hover{
  342. background:{color:hover};
  343. opacity:.9;
  344. }
  345. .content{
  346. opacity:0;
  347. left: 50%;
  348. margin-left: -498px;
  349. top:23%;
  350. line-height:20px;
  351. text-align:center;
  352.  
  353. }
  354.  
  355. #desc{
  356. text-align:justify;
  357. color:{color:text};
  358. text-transform:lowercase;
  359. font-size:9px;
  360. letter-spacing:0px;
  361. line-height:1.5em;
  362. margin-top:5px;
  363. background:{color:background};
  364. border-top:1px solid #eee;
  365. padding:9px;
  366. }
  367.  
  368. .title-2{
  369. -webkit-text-fill-color:transparent;
  370. background:-webkit-linear-gradient(transparent,transparent),url({image:Background Image});
  371. -webkit-background-clip:text;
  372. background-size:contain;
  373. background-position:center;
  374. text-transform:lowercase;
  375. border:3px solid {color:borders};
  376. font-size:36px;
  377. padding:20px;
  378. margin-top:20px;
  379. line-height:1.3em;
  380. text-align:center;
  381. width:160px;
  382. font-family: 'Alegreya Sans SC', sans-serif;
  383. }
  384. .title-2 a:hover{
  385. text-shadow:0px 0px 0px;
  386. }
  387.  
  388.  
  389. .cool {
  390. opacity:1;
  391. height:auto;
  392. position:fixed;
  393. text-align:center;
  394. word-spacing:4px;
  395. -webkit-transition:0.5s;
  396. -moz-transition:0.5s;
  397. -ms-transition:0.5s;
  398. -o-transition:0.5s;
  399. transition:0.5s;
  400. }
  401. .dos-link{
  402. margin-top:-10px;
  403. text-align:center
  404. }
  405. .dos{
  406. display:inline-block;
  407. width:203px;
  408. margin-left:-19px;
  409. }
  410.  
  411. #all{
  412. text-align:center;
  413. width:203px;
  414. }
  415.  
  416. .dos a{
  417. display:inline-block;
  418. padding:5px;
  419. background:{color:background};
  420. border:2px solid {color:link};
  421. border-radius:100%;
  422. -webkit-transition:0.5s;
  423. -moz-transition:0.5s;
  424. -ms-transition:0.5s;
  425. -o-transition:0.5s;
  426. transition:0.5s;
  427. }
  428. .dos a:hover{
  429. background:{color:hover};
  430. border:2px solid {color:background};
  431. -webkit-transition:0.5s;
  432. -moz-transition:0.5s;
  433. -ms-transition:0.5s;
  434. -o-transition:0.5s;
  435. transition:0.5s;
  436. }
  437.  
  438. /*pagination*/
  439. #pagination {
  440. margin-bottom:50px;
  441. width:467px;
  442. margin-left:-35px;
  443. word-spacing:-3px;
  444.  
  445. }
  446.  
  447. .prev{
  448. margin-left:-20px;
  449. }
  450. .next{
  451. margin-left:5px;
  452. }
  453.  
  454. #pagination a {
  455. margin-top:-130px;
  456. }
  457.  
  458. /*container*/
  459. #con {
  460. left:50%;
  461. margin-left:-180px;
  462. position:absolute;
  463. }
  464.  
  465.  
  466.  
  467. /*posts*/
  468.  
  469. #entries {
  470.  
  471. margin-top:-100px;
  472. width:400px;
  473. }
  474.  
  475.  
  476.  
  477. #posts {
  478. width:400px;
  479. border:1px outset {color:borders};
  480. padding:8px 8px 5px;
  481. background:{color:background};
  482. margin-left:-20px;
  483. {block:IndexPage}
  484. margin-bottom:100px;
  485. {/block:IndexPage}
  486. {block:PermalinkPage}
  487. margin-bottom:75px;
  488. {/block:PermalinkPage}
  489.  
  490. }
  491. #posts img {
  492. max-width:400px;
  493. }
  494.  
  495. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  496. .caption {width:100%;
  497. margin-top:10px;
  498.  
  499. }
  500.  
  501. .border-fade{
  502. position:fixed;
  503. width:100%;
  504. bottom:-20px;
  505. height:20px;
  506. background:{color:background};
  507. z-index:1;
  508. -webkit-box-shadow: 0px -25px 100px -2px {color:background};
  509. -moz-box-shadow: 0px -25px 100px -2px {color:background};
  510. box-shadow: 0px -25px 100px -2px {color:background};
  511. }
  512.  
  513. /*quote*/
  514.  
  515. #titlequote{
  516. font-family: 'Alegreya Sans SC', sans-serif;
  517. text-transform:lowercase;
  518. letter-spacing:1px;
  519. text-align:justify;
  520. font-size:13px;
  521. line-height:19px;
  522. font-weight:none;
  523. padding:10px;
  524. }
  525.  
  526. #titlequote a{
  527. color:{color:text};
  528. }
  529. #source a{
  530. color:{color:text};
  531. }
  532.  
  533. #source {
  534. text-align:right;
  535. font-style:none;
  536. font-weight:none;
  537. text-transform:uppercase;
  538. font:7px arial;
  539. letter-spacing:1px;
  540. margin-top:5px;
  541. margin-bottom:20px;
  542. }
  543.  
  544. /*audio*/
  545.  
  546. .tracks{
  547. border:1px solid {color:borders};
  548. padding:9px;
  549. margin-bottom:4px;
  550. width:200px;
  551. margin-left:10px;
  552. }
  553.  
  554. .player iframe {
  555. width: 30px;
  556. height: 30px;}
  557.  
  558. .black .white,
  559. .black .grey { display: none;}
  560. .white .black,
  561. .white .grey { display: none;}
  562. .grey .white,
  563. .grey .black { display: none;}
  564.  
  565. .black .player_container { background: #000;}
  566. .black .player_wrap { background-color: rgba(0,0,0,0.8); }
  567. .white .player_container { background: #fff;}
  568. .white .player_wrap { background-color: rgba(255,255,255,0.8); }
  569. .grey .player_container { background: #e4e4e4;}
  570. .grey .player_wrap { background-color: rgba(228, 228, 228, 0.8); }
  571.  
  572. .audio {
  573. position: relative;
  574. margin-bottom:20px;
  575. margin-top:10px;
  576. margin-left:10px;
  577. }
  578.  
  579. .player-art {
  580. width: 100px;
  581. height: 100px;
  582. position: relative;
  583. vertical-align: top;
  584. margin-left:5px;
  585. margin-top:16px;
  586. }
  587. .player-art img { width: 100px; }
  588.  
  589. img.album { position: absolute; z-index: 2;}
  590. img.default { position: absolute; z-index: 1; }
  591.  
  592.  
  593. .player-wrap {
  594. position: relative;
  595. width: 95px;
  596. display: inline-block;
  597. left: 0;
  598. }
  599.  
  600. ol.audioinfo {
  601. list-style-type: none;
  602. width: auto;
  603. margin: 15px 0 0 5px;
  604. padding:0;
  605. z-index: 10;
  606. position: relative;
  607. display: inline-block;
  608. vertical-align: top;
  609. line-height: 1.4em;
  610. }
  611.  
  612.  
  613. .player {
  614. width: 30px; height: 30px;
  615. overflow: hidden;
  616. margin: -14px 0 0 -14px;
  617. padding: 0px;
  618. position: absolute;
  619. top: 50%;
  620. left: 50%;
  621. }
  622. .player_container {
  623. z-index: 11;
  624. opacity: 0.3; filter: alpha(opacity=30);
  625. -webkit-transition: all 0.2s ease-in-out;
  626. -moz-transition: all 0.2s ease-in-out;
  627. -o-transition: all 0.2s ease-in-out ;
  628. -ms-transition: all 0.2s ease-in-out;
  629. }
  630. .player_wrap {
  631. z-index: 9;
  632. -webkit-transition: all 0.2s ease-in-out;
  633. -moz-transition: all 0.2s ease-in-out;
  634. -o-transition: all 0.2s ease-in-out ;
  635. -ms-transition: all 0.2s ease-in-out; }
  636.  
  637. .player_container, .player_wrap {
  638. position: absolute;
  639. top: 50%;
  640. left: 50%;
  641. width: 50px; height: 50px;
  642. margin-top: -20px;
  643. margin-left: -15px;
  644. -moz-border-radius:50px;
  645. -webkit-border-radius:50px;
  646. border-radius: 50px; }
  647.  
  648. .player_container:hover{
  649. opacity:1;
  650. -webkit-transition: all 0.2s ease-in-out;
  651. -moz-transition: all 0.2s ease-in-out;
  652. -o-transition: all 0.2s ease-in-out ;
  653. -ms-transition: all 0.2s ease-in-out;
  654. }
  655.  
  656.  
  657. /*asks*/
  658. .q {
  659. margin-bottom:10px;
  660. text-transform:uppercase;
  661. font:7px arial;
  662. letter-spacing:1px;
  663. color:{color:text};
  664. padding:10px;
  665. line-height:1.5em;
  666. }
  667.  
  668. .q a{
  669. color:{color:text};
  670. }
  671.  
  672. .as {
  673. font-weight:bold;
  674. background:{color:background};
  675. padding:10px;
  676. color:{color:text};
  677. border:2px solid {color:borders};
  678. line-height:1.5em;
  679. }
  680.  
  681.  
  682. .as a{
  683. color:{color:text};}
  684.  
  685.  
  686. .a {
  687. margin-top:10px;
  688. padding:10px;
  689. line-height:1.5em;
  690. text-transform:uppercase;
  691. background:{color:background};
  692. color:{color:text};
  693. font:7px arial;
  694. letter-spacing:1px;}
  695.  
  696.  
  697. /*chat*/
  698.  
  699. .chat ol {
  700. padding:0;
  701. list-style:none;
  702. }
  703. .line {padding:5px 0;}
  704.  
  705. .label {font-weight:bold;
  706. }
  707.  
  708.  
  709.  
  710.  
  711.  
  712. /*permalink and notes*/
  713.  
  714. /*--Info!--*/
  715.  
  716. #infowrap {
  717. padding:5px;
  718. height:auto;
  719. {block:IndexPage}
  720. position:absolute;
  721. opacity:0;
  722. {/block:IndexPage}
  723.  
  724. {block:PermalinkPage}
  725. position:relative;
  726.  
  727. {/block:PermalinkPage}
  728. transition-duration: 0.8s;
  729. -moz-transition-duration: 0.8s;
  730. -webkit-transition-duration: 0.8s;
  731. -o-transition-duration: 0.8s;
  732. }
  733. #posts:hover #infowrap {
  734. {block:IndexPage} opacity:1;{/block:IndexPage}}
  735.  
  736.  
  737.  
  738. #info {
  739. text-align:left;
  740. font:7px arial;
  741. letter-spacing:1px; /* change font family*/
  742. text-transform:uppercase;
  743. padding:9px 7px 15px 7px;
  744. width:373px;
  745. height:auto;/* width of the caption is width of post minus 30px*/
  746. word-spacing:3px;
  747. color:{color:text}; /* change text color */
  748. background-color:{color:background};
  749. border:1px solid #eee;
  750. line-height:11px;/* change background color */
  751. letter-spacing:1px;
  752. }
  753. #info a {
  754. color:{color:text}; /* change link color */
  755. }
  756.  
  757. .text-info{
  758. font:7px arial;
  759. letter-spacing:1px; /* change font family*/
  760. text-transform:uppercase;
  761. word-spacing:3px;
  762. border-top:1px solid {color:borders};
  763. padding:4px;
  764. }
  765. .text-info a{
  766. color:{color:text};
  767. }
  768.  
  769.  
  770. /*--Tags!--*/
  771.  
  772. #tags {
  773. opacity:1;
  774. float:right;
  775. padding-bottom:10px;
  776. margin-top:-5px;
  777. {block:IndexPage}
  778. width:200px;
  779. height:4px;
  780. font-size:7px;
  781. overflow:hidden;
  782. text-align:right;
  783. line-height:20px;
  784. {/block:IndexPage}
  785. {block:PermalinkPage}
  786. display:none;{/block:PermalinkPage}
  787. }
  788. #tags a{
  789. padding:4px;
  790. color:{color:text};
  791. padding-left:3px;
  792. transition-duration: 0.8s;
  793. -moz-transition-duration: 0.8s;
  794. -webkit-transition-duration: 0.8s;
  795. -o-transition-duration: 0.8s;
  796. }
  797. #tags a:hover{
  798. color:{color:hover};
  799. }
  800.  
  801.  
  802. #text-tags {
  803. opacity:1;
  804. float:right;
  805. width:230px;
  806. {block:IndexPage}
  807. height:16px;
  808. font-size:7px;
  809. line-height:20px;
  810. overflow:hidden;
  811. {/block:IndexPage}
  812. {block:PermalinkPage}
  813. display:none;{/block:PermalinkPage}
  814. margin-top:-17px;
  815. text-align:right;
  816. text-transform:uppercase;
  817. }
  818. #text-tags a{
  819. color:{color:text};
  820. padding-left:3px;
  821. transition-duration: 0.8s;
  822. -moz-transition-duration: 0.8s;
  823. -webkit-transition-duration: 0.8s;
  824. -o-transition-duration: 0.8s;
  825. }
  826. #text-tags a:hover{
  827. color:{color:hover};
  828. }
  829.  
  830.  
  831. ol.notes {list-style-type:none;
  832. font:7px arial;
  833. letter-spacing:1px;
  834. text-transform: uppercase;
  835. float:center;
  836. width:400px;
  837. margin-left:-50px;}
  838. ol.notes a{color:{color:text};}
  839. ol.notes li {padding:10px; background:{color:background}}
  840. ol.notes li:nth-child(even) {background:#eee;}
  841. ol.notes li img {display:none!important;}
  842.  
  843.  
  844.  
  845. /*SLIDE ASK*/
  846.  
  847.  
  848. .cbp-spmenu {
  849. position: fixed;
  850. }
  851.  
  852.  
  853. /* Orientation-dependent styles for the content of the menu */
  854.  
  855. .cbp-spmenu-horizontal {
  856. padding:10px;
  857. margin-left:1050px;
  858. text-align:justify;
  859. font-size:10px;
  860. {block:ifnotPattern}
  861. background: url({image:Background Image})
  862. no-repeat center center fixed;
  863. -webkit-background-size: cover;
  864. -moz-background-size: cover;
  865. -o-background-size: cover;
  866. background-size: cover;
  867. {/block:ifnotPattern}
  868. {block:ifPattern}
  869. background: url({image:Background Image})
  870. repeat center center fixed;
  871. {/block:ifPattern}
  872. color:{color:background};
  873. width: 400px;
  874. height: 100%;
  875. z-index:1;}
  876.  
  877.  
  878.  
  879.  
  880. /* Horizontal menu that slides from the top or bottom */
  881.  
  882. .cbp-spmenu-bottom {
  883. right: -700px;
  884. bottom:0;
  885. }
  886.  
  887. .cbp-spmenu-bottom.cbp-spmenu-open {
  888. bottom:0px;
  889. right:0px;
  890. }
  891.  
  892.  
  893.  
  894.  
  895. /* Transitions */
  896.  
  897. .cbp-spmenu,
  898. .cbp-spmenu-push {
  899. -webkit-transition: all 0.8s ease;
  900. -moz-transition: all 0.8s ease;
  901. transition: all 0.8s ease;
  902. }
  903.  
  904.  
  905. #pushdescription {
  906. margin-top:30px;
  907. line-height:14px;
  908. padding:15px;
  909. overflow-y:scroll;
  910. overflow-x:hidden;
  911. background:rgba(255,255,255,0.9);
  912. border:5px solid {color:borders};
  913.  
  914. }
  915.  
  916.  
  917. .cbp-spmenu {
  918. position: fixed;
  919. }
  920.  
  921. .rules{
  922. border:2px solid {color:borders};
  923. background:{color:background};
  924. padding:4px;
  925. font-family:arial;
  926. text-transform:lowercase;
  927. line-height:1.5em;
  928. font-size:9px;
  929. color:{color:text};
  930. text-align:left;
  931. }
  932. .rue{
  933. font-family: 'Alegreya Sans SC', sans-serif;
  934. padding:7px;
  935. text-align:center;
  936. text-transform:uppercase;
  937. line-height:1.5em;
  938. font-size:18px;
  939. font-weight:800;
  940. color:{color:title};
  941. }
  942.  
  943.  
  944. .ask-title{
  945. font-family: 'Alegreya Sans SC', sans-serif;
  946. padding:7px;
  947. text-align:center;
  948. text-transform:uppercase;
  949. line-height:1.5em;
  950. font-size:18px;
  951. font-weight:800;
  952. color:{color:title};
  953. }
  954.  
  955.  
  956. /*DO NOT TOUCH*/
  957. #creds {
  958. font-family: 'Alegreya Sans SC', sans-serif;
  959. letter-spacing:1px;
  960. text-transform:uppercase;
  961. bottom:10px;
  962. position:fixed;
  963. right:6px;
  964. float:right;
  965. padding:5px;
  966. z-index:1;
  967. -webkit-transition: all 1s ease;
  968. -moz-transition: all 1s ease;
  969. -o-transition: all 1s ease;
  970. -ms-transition: all 1s ease;
  971. transition: all 1s ease;
  972. }
  973. #creds a{
  974. color:{color:text};
  975. border:1px outset {color:borders};
  976. padding:5px;
  977. background:transparent;
  978. -webkit-transition: all 1s ease-in;
  979. -moz-transition: all 1s ease-in;
  980. -o-transition: all 1s ease-in;
  981. -ms-transition: all 1s ease-in;
  982. transition: all 1s ease-in;
  983. }
  984.  
  985.  
  986. #creds a:hover {
  987. text-decoration:none;
  988. background:{color:hover};
  989. border:1px inset {color:borders};
  990. -webkit-transition: all 1s ease-out;
  991. -moz-transition: all 1s ease-out;
  992. -o-transition: all 1s ease-out;
  993. -ms-transition: all 1s ease-out;
  994. transition: all 1s ease-out;
  995. }
  996.  
  997.  
  998. #tumblrcontrols{
  999. position:fixed;
  1000. top:13px;
  1001. right:10px;
  1002. word-spacing:10px;
  1003. }
  1004. #tumblrcontrols{
  1005. font-family:arial;
  1006. font-size:7px;
  1007. letter-spacing:1px;
  1008. text-transform:uppercase;
  1009. color:{color:text};
  1010. -webkit-transition: all 1.6s ease-in;
  1011. -moz-transition: all 1.6s ease-in;
  1012. -o-transition: all 1.6s ease-in;
  1013. -ms-transition: all 1.6s ease-in;
  1014. transition: all 1.6s ease-in;
  1015. }
  1016.  
  1017. #tumblrcontrols a{
  1018. text-decoration:none;
  1019. color:{color:text};
  1020. border:1px solid {color:borders};
  1021. background:{color:background};
  1022. padding:6px;
  1023. }
  1024.  
  1025. #tumblrcontrols a:hover{
  1026. text-decoration:none;
  1027. color:white;
  1028. border:1px solid transparent;
  1029. background:{color:accent};
  1030. }
  1031.  
  1032. {block:IndexPage}
  1033. #tumblr_controls {display:none;}
  1034. {/block:IndexPage}
  1035.  
  1036. {block:PermalinkPage}
  1037. #tumblrcontrols{
  1038. display:none;}
  1039. iframe#tumblr_controls {
  1040. top:10px;
  1041. position: fixed !important;
  1042. right:20px !important;
  1043. -moz-transition: all 1s ease-out;
  1044. -webkit-transition: opacity 0.7s linear;
  1045. -webkit-transition: all 1s ease-out;
  1046. transition: all 1s ease-out;
  1047. opacity: 0.4;}
  1048.  
  1049. iframe#tumblr_controls:hover {
  1050. -webkit-transition: opacity 0.7s linear;
  1051. -moz-transition: all 0.4s ease-out;
  1052. -webkit-transition: all 0.4s ease-out;
  1053. transition: all 0.4s ease-out;
  1054. opacity:.7;}
  1055. {/block:PermalinkPage}
  1056.  
  1057. {CustomCSS}
  1058.  
  1059.  
  1060. </style>
  1061. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
  1062. <script type="text/javascript">
  1063. $(function(){
  1064. var stickyRibbonTop = $('#line').offset().top;
  1065.  
  1066. $(window).scroll(function(){
  1067. if( $(window).scrollTop() > stickyRibbonTop ) {
  1068. $('.content').addClass('cool');
  1069. } else {
  1070. $('.content').removeClass('cool');
  1071. }
  1072. });
  1073. });
  1074. </script>
  1075. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  1076. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  1077. <script type="text/javascript" charset="utf-8">
  1078. var $j = jQuery.noConflict();
  1079. $j(function() {
  1080. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  1081. $j("img").lazyload({
  1082. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  1083. effect: "fadeIn",
  1084. });
  1085. });
  1086. </script>
  1087. </head>
  1088.  
  1089. <body>
  1090. <div id="tumblrcontrols">
  1091. <a href="http://www.tumblr.com/follow/{text:Tumblr URL}">follow</a>
  1092. <a href="http://www.tumblr.com/dashboard">dashboard</a>
  1093. </div>
  1094. <body class="cbp-spmenu-push">
  1095.  
  1096. <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom" id="cbp-spmenu-s1">
  1097. <div class="menu" >
  1098. <div id="pushdescription"><div style="padding:5px;">
  1099. <div class="knope">
  1100. <big class="ask-title">Message</big>
  1101. <p class="rules">
  1102. {text:FAQ}</p>
  1103.  
  1104.  
  1105. <iframe frameborder="0" height="250" id="ask_form" scrolling="none" src="http://www.tumblr.com/ask_form/{text:Tumblr URL}.tumblr.com" width="100%"> </iframe>
  1106. <p></p>
  1107. </center>
  1108. </div>
  1109. </div>
  1110. </div>
  1111. </div>
  1112. </nav>
  1113.  
  1114. <header>
  1115. <div><h1><a href="/">{Title}</a></h1></div>
  1116. <nav class="uno">
  1117. <a href="/" title="home"></a>
  1118. <a title="message" class="toggle menu-bottom"></a>
  1119. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>
  1120. <a href="{text:Link 2 URL}" title="{text:Link 2}"></a>
  1121. <a href="{text:Link 3 URL}" title="{text:Link 3}"></a>
  1122. <a href="{text:Link 4 URL}" title="{text:Link 4}"></a>
  1123. </nav>
  1124. </header>
  1125.  
  1126. <div class="border-fade"></div>
  1127. <div class="content">
  1128. <div><h1 class="title-2"><a href="/">{Title}</a></h1></div>
  1129. <div id="all"><div class="dos-link">
  1130. <nav class="dos">
  1131. <a href="/" title="home"></a>
  1132. <a title="message" class="toggle menu-bottom"></a>
  1133. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>
  1134. <a href="{text:Link 2 URL}" title="{text:Link 2}"></a>
  1135. <a href="{text:Link 3 URL}" title="{text:Link 3}"></a>
  1136. <a href="{text:Link 4 URL}" title="{text:Link 4}"></a>
  1137. </nav></div>
  1138. <div id="desc">{Description}</div>
  1139. </div></div>
  1140.  
  1141. <div id="con">
  1142. <div id="line"></div>
  1143. <div id="entries">
  1144.  
  1145. {block:Posts}
  1146. <div id="posts">
  1147.  
  1148.  
  1149. {block:Quote}
  1150. <div id="titlequote">{Quote}</div>
  1151. {block:permalink}{block:Source}<div id="source">{Source}</div>{/block:Source}{/block:permalink}
  1152. <div class="text-info"><br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1153. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1154. {/block:Quote}
  1155.  
  1156.  
  1157.  
  1158. {block:Text}
  1159. {block:Title}
  1160. <div id="title">{Title}</div>{/block:Title}
  1161. {Body}
  1162. <div class="text-info"><br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1163. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1164. {/block:Text}
  1165.  
  1166. {block:Link}
  1167. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  1168. <div class="text-info"><br>{block:Date}{TimeAgo}{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1169. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1170. {/block:Link}
  1171.  
  1172. {block:Chat}
  1173. {block:Title}
  1174. <h1>{Title}</h1>
  1175. {/block:Title}
  1176. <div class="chat">
  1177. <ol>{block:Lines}
  1178. <li class="line {Alt}">
  1179. {block:Label}
  1180. <span class="label">
  1181. {Label}</span>
  1182. {/block:Label}{Line}</li>
  1183. {/block:Lines}
  1184. </ol></div>
  1185. <div class="text-info"><br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1186. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1187. {/block:Chat}
  1188.  
  1189.  
  1190. {block:Photo}
  1191. <div id="infowrap">
  1192. <div id="info">
  1193. <br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  1194. {block:HasTags}<div id="tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1195. </div>
  1196. </div>
  1197. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  1198. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1199. {/block:Photo}
  1200.  
  1201. {block:Photoset}
  1202. <div id="infowrap">
  1203. <div id="info">
  1204. <br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  1205. {block:HasTags}<div id="tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1206. </div>
  1207. </div>
  1208. {Photoset-400}
  1209. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1210. {/block:Photoset}
  1211.  
  1212. {block:Video}
  1213. <div id="infowrap">
  1214. <div id="info">
  1215. <br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  1216. {block:HasTags}<div id="tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1217. </div>
  1218. </div>
  1219. {Video-400}
  1220. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1221. {/block:Video}
  1222.  
  1223. {block:Audio}
  1224. <div class="audio">
  1225. <div class="player-wrap {select:Player Color}">
  1226. <div class="player-art">
  1227. {block:AlbumArt}
  1228. <img class="album" src="{AlbumArtURL}" alt="{block:Artist}{Artist}{/block:Artist}{block:TrackName} - {TrackName}{/block:TrackName}"/>
  1229. {/block:AlbumArt}
  1230. <img class="default" src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg" alt="{block:Artist}{Artist}{/block:Artist}{block:TrackName} - {TrackName}{/block:TrackName}"/>
  1231. </div>
  1232.  
  1233.  
  1234. <div class="player_wrap {select:Avatar Shape}"></div>
  1235. <div class="player_container {select:Avatar Shape}">
  1236. <div class="player">
  1237. <div class="black">{AudioPlayerBlack}</div>
  1238. <div class="white">{AudioPlayerWhite}</div>
  1239. <div class="grey">{AudioPlayerGrey}</div>
  1240. </div>
  1241. </div>
  1242. </div>
  1243. <ol class="audioinfo">
  1244. <li class="tracks">{block:TrackName}<span class="label">Song:</span> {TrackName}{/block:TrackName}</li>
  1245. <li class="tracks">{block:Artist}<span class="label">Artist:</span> {Artist}{/block:Artist} </li>
  1246. <li class="tracks">{block:Album}<span class="label">Album:</span> {Album}{/block:Album}</li>
  1247. </ol>
  1248.  
  1249. </div>
  1250.  
  1251. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1252. <div class="text-info"><br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1253. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1254. {/block:Audio}
  1255.  
  1256. {block:Answer}
  1257. <div class="q">
  1258. <div class="as" >{Asker} said: {Question}</div>
  1259. <div class="a" style="line-height:1.5em">{Answer}</div>
  1260. </div>
  1261. <div class="text-info"><br>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} - {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div>
  1262. {block:HasTags}<div id="text-tags">&#8627; {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1263.  
  1264. {/block:Answer}
  1265.  
  1266.  
  1267.  
  1268.  
  1269. </div>
  1270.  
  1271.  
  1272. {block:PostNotes}
  1273. <div class="pagenotes">
  1274. {PostNotes}
  1275. </div>
  1276. {/block:PostNotes}
  1277.  
  1278.  
  1279. {/block:Posts}
  1280.  
  1281. <div id="pagination">
  1282. {block:Pagination}
  1283. {block:PreviousPage}
  1284. <a href="{PreviousPage}" class="prev"title="previous" style="float:left"><img width="20px" src="http://static.tumblr.com/3dkvxpf/dzpnb7ne1/arrow395.png"></a>
  1285. {/block:PreviousPage}
  1286.  
  1287.  
  1288. {block:NextPage}
  1289. <a href="{NextPage}" class="next" title="forward" style="float:right"><img width="20px" src="http://static.tumblr.com/3dkvxpf/a82nb7ngv/move13.png"></a>
  1290. {/block:NextPage}
  1291. {/block:Pagination}
  1292. </div>
  1293.  
  1294.  
  1295.  
  1296. </div>
  1297.  
  1298. </div>
  1299.  
  1300.  
  1301. <div id="creds"><a title="960px" href="http://960px.tumblr.com/">TT</a></div>
  1302.  
  1303.  
  1304. </body>
  1305. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!