Advertisement
Seedfawn

Theme 41

May 19th, 2016
822
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.33 KB | None | 0 0
  1. <!--
  2. > This theme was made by seedfawn aka kara-themes
  3. > Problem? Contact me: kara-themes.tumblr.com/faq
  4. > Credits:
  5. Basecode - Farahmir
  6. > KEEP THE CREDITS!
  7. -->
  8.  
  9. <html>
  10. <head>
  11.  
  12. <title>{Title}</title>
  13.  
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  17.  
  18. <link href='https://fonts.googleapis.com/css?family=Chivo:900' rel='stylesheet' type='text/css'>
  19. <link href='https://fonts.googleapis.com/css?family=Lato:300' rel='stylesheet' type='text/css'>
  20. <link href="css/hover-min.css" rel="stylesheet" media="all">
  21. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  22.  
  23. <meta name="image:Background" content=""/>
  24. <meta name="image:Sidebar" content=""/>
  25. <meta name="color:Background" content="#fff"/>
  26. <meta name="color:Text" content="#aaa"/>
  27. <meta name="color:Title" content="#f1d1c4"/>
  28. <meta name="color:Link" content="#efbdaa"/>
  29. <meta name="color:Hover" content="#f1d1c4"/>
  30. <meta name="color:Blogtitle" content="#f1d1c4"/>
  31. <meta name="color:Navigation" content="#f1d1c4"/>
  32. <meta name="color:Permalink" content="#f1d1c4"/>
  33. <meta name="color:Top bar" content="#f1d1c4"/>
  34. <meta name="color:Ask" content="#f1d1c4"/>
  35. <meta name="color:Scrollbar" content="#f1d1c4"/>
  36. <meta name="color:Selection" content="#efbdaa"/>
  37. <meta name="text:Blogtitle" content="pantone" />
  38. <meta name="text:Link One Title" content="refresh" />
  39. <meta name="text:Link Two Title" content="message" />
  40. <meta name="text:Link Three Title" content="links" />
  41. <meta name="text:Link Four Title" content="themes" />
  42. <meta name="text:Link One URL" content="/" />
  43. <meta name="text:Link Two URL" content="/faq" />
  44. <meta name="text:Link Three URL" content="/links" />
  45. <meta name="text:Link Four URL" content="http://kara-themes.tumblr.com" />
  46.  
  47. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  48. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  49. <script>
  50. (function($){
  51. $(document).ready(function(){
  52. $("a[title]").style_my_tooltips({
  53. tip_follows_cursor:true,
  54. tip_delay_time:30,
  55. tip_fade_speed:300,
  56. attribute:"title"
  57. });
  58. });
  59. })(jQuery);
  60. </script>
  61.  
  62. <script>
  63. <!--
  64.  
  65. // Disable Right Click Script
  66.  
  67. function IE(e)
  68. {
  69. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  70. {
  71. return false;
  72. }
  73. }
  74. function NS(e)
  75. {
  76. if (document.layers || (document.getElementById && !document.all))
  77. {
  78. if (e.which == "2" || e.which == "3")
  79. {
  80. return false;
  81. }
  82. }
  83. }
  84. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  85.  
  86. //-->
  87. </script>
  88.  
  89. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  90. <script>
  91. $(document).ready(function() {
  92. //
  93. $('a.poplight[href^=#]').click(function() {
  94. var popID = $(this).attr('rel'); //Get Popup Name
  95. var popURL = $(this).attr('href'); //Get Popup href to define size
  96. var query= popURL.split('?');
  97. var dim= query[1].split('&');
  98. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  99. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="https://38.media.tumblr.com/30853fe6c9b10e246922a5953db4d1a0/tumblr_inline_nl8j0gMXwf1ry72eo.gif" class="btn_close" title="Close" alt="Close" /></a>');
  100. var popMargTop = ($('#' + popID).height() + 60) / 2;
  101. var popMargLeft = ($('#' + popID).width() + 90) / 2;
  102. //Apply Margin to Popup
  103. $('#' + popID).css({
  104. 'margin-top' : -popMargTop,
  105. 'margin-left' : -popMargLeft
  106. });
  107. $('body').append('<div id="fade"></div>');
  108. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  109. return false;
  110. });
  111. $('a.close, #fade').live('click', function() {
  112. $('#fade , .popup_block').fadeOut(function() {
  113. $('#fade, a.close').remove(); //fade them both out
  114. });
  115. return false;
  116. });
  117. });
  118. </script>
  119.  
  120. <style type="text/css">
  121.  
  122. ::-webkit-scrollbar{
  123. width:15px;
  124. height:4px;
  125. background:rgba( {RGBcolor:scrollbar}, 0.4);
  126. }
  127.  
  128. ::-webkit-scrollbar-thumb{
  129. background-color:{color:scrollbar};
  130. }
  131.  
  132. ::selection {
  133. background:{color:selection};
  134. color:white
  135. }
  136.  
  137. ::-moz-selection {
  138. background:{color:selection};
  139. color:white;
  140. }
  141.  
  142. .tmblr-iframe{
  143. {block:indexpage}
  144. -moz-transform: scale(0);
  145. -webkit-transform: scale(0);
  146. -o-transform: scale(0);
  147. -ms-transform: scale(0);
  148. transform: scale(0);
  149. {/block:indexpage}
  150. {block:permalinkpage}
  151. position:fixed!important;
  152. -webkit-filter: invert(100%);
  153. top:45px !important;
  154. right:5px !important;
  155. opacity:.5;
  156. z-index:9999999999999;
  157. {/block:permalinkpage}
  158. }
  159.  
  160. #tif{
  161. {block:indexpage}
  162. position:fixed!important;
  163. top:45px;
  164. right:5px;
  165. opacity:1;
  166. z-index:9999;
  167. {/block:indexpage}
  168. }
  169.  
  170. #tif a{
  171. width:15px;
  172. height:15px;
  173. display:inline-block;
  174. font-size:15px;
  175. line-height:15px;
  176. padding:10px;
  177. opacity:1;
  178. text-align:center;
  179. color:{color:navigation};
  180. -webkit-transition: all 0.3s ease-in-out;
  181. -moz-transition: all 0.3s ease-in-out;
  182. -o-transition: all 0.3s ease-in-out;
  183. }
  184.  
  185. #fade { /*--Transparent background layer--*/
  186. display: none; /*--hidden by default--*/
  187. background: #fff;
  188. position: fixed; left: 0; top: 0;
  189. width: 100%; height: 100%;
  190. opacity: .80;
  191. z-index: 9999;
  192. }
  193. .popup_block{
  194. display: none; /*--hidden by default--*/
  195. background: #fff;
  196. padding: 20px;
  197. border: 10px solid {color:navigation};
  198. float: left;
  199. color:{color:text};
  200. position: fixed;
  201. top: 50%; left: 50%;
  202. z-index: 99999;
  203. }
  204. img.btn_close {
  205. float: right;
  206. margin: -5px -5px 0 0;
  207. }
  208. /*--Making IE6 Understand Fixed Positioning--*/
  209. *html #fade {
  210. position: absolute;
  211. }
  212. *html .popup_block {
  213. position: absolute;
  214. }
  215.  
  216. #s-m-t-tooltip{
  217. max-width:300px;
  218. margin:10px;
  219. padding:8px 8px;
  220. color:white;
  221. font-family:calibri;
  222. font-size:8px;
  223. text-transform:uppercase;
  224. letter-spacing:2px;
  225. background:rgba(0, 0, 0, .85);
  226. z-index:999999999999999999999999999999999999;
  227. }
  228.  
  229. blockquote{
  230. padding:0px 0 0px 10px;
  231. border-left:1px solid #ebebeb;
  232. margin-left:5px;
  233. }
  234.  
  235. *{
  236. cursor: url(http://static.tumblr.com/p3mk1pa/DFKnysvin/tumblr_lqs4qduu8n1qfoi4t.png), auto;
  237. }
  238.  
  239. body{
  240. background:{color:background};
  241. color:{color:text};
  242. font-family:arial;
  243. font-size:9px;
  244. text-align:justify;
  245. letter-spacing:1px;
  246. margin:0;
  247. line-height:15px;
  248. background-image:url({image:background});
  249. cursor: url(http://static.tumblr.com/p3mk1pa/DFKnysvin/tumblr_lqs4qduu8n1qfoi4t.png), auto;
  250. }
  251.  
  252. a{
  253. color:{color:link};
  254. font-weight:bold;
  255. text-decoration:none;
  256. }
  257.  
  258. a:hover{
  259. color:{color:hover};
  260. text-decoration:underline;
  261. cursor: url(http://static.tumblr.com/p3mk1pa/4eKnysvj3/help.png), help;
  262. }
  263.  
  264. img{
  265. opacity:1;
  266. border:none;
  267. text-decoration:none
  268. }
  269.  
  270. small{
  271. font-size:8px;
  272. }
  273.  
  274. big{
  275. font-size:12px;
  276. }
  277.  
  278. #title{
  279. font-size:15px;
  280. line-height:18px;
  281. margin-bottom:10px;
  282. padding-bottom:10px;
  283. border-bottom:1px solid {color:title};
  284. color:{color:title};
  285. font-size:15px;
  286. letter-spacing:3px;
  287. line-height:22px;
  288. font-family: 'Lato', sans-serif;
  289. text-transform:uppercase;
  290. text-align:left;
  291. }
  292.  
  293. #title a{
  294. font-weight:normal;
  295. }
  296.  
  297. #sidebar{
  298. position:fixed;
  299. height:200px;
  300. width:130px;
  301. margin-top:100px;
  302. margin-left:203px;
  303. z-index:999;
  304. -webkit-transition: all .3s ease-in-out;
  305. -moz-transition: all .3s ease-in-out;
  306. -o-transition: all .3s ease-in-out;
  307. -ms-transition: all .3s ease-in-out;
  308. }
  309.  
  310. #sidebarim{
  311. position:fixed;
  312. overflow:hidden;
  313. width:130px;
  314. height:130px;
  315. -webkit-transition: all .3s ease-in-out;
  316. -moz-transition: all .3s ease-in-out;
  317. -o-transition: all .3s ease-in-out;
  318. -ms-transition: all .3s ease-in-out;
  319. }
  320.  
  321. #sidebarim img{
  322. width:130px;
  323. height:130px;
  324. background:{color:sidebar};
  325. -webkit-transition: all .3s ease-in-out;
  326. -moz-transition: all .3s ease-in-out;
  327. -o-transition: all .3s ease-in-out;
  328. -ms-transition: all .3s ease-in-out;
  329. }
  330.  
  331. #sidebar:hover #sidebarim img{
  332. -moz-transform: scale(1.3);
  333. -webkit-transform: scale(1.3);
  334. -o-transform: scale(1.3);
  335. -ms-transform: scale(1.3);
  336. transform: scale(1.3);
  337. -webkit-filter: blur(1px);
  338. filter: blur(1px);
  339. }
  340.  
  341. #sidebarbg{
  342. position:absolute;
  343. width:130px;
  344. height:130px;
  345. margin-top:-135px;
  346. background:transparent;
  347. opacity:.3;
  348. -webkit-transition: all .3s ease-in-out;
  349. -moz-transition: all .3s ease-in-out;
  350. -o-transition: all .3s ease-in-out;
  351. -ms-transition: all .3s ease-in-out;
  352. }
  353.  
  354. #sidebar:hover #sidebarbg{
  355. background:black;
  356. }
  357.  
  358. .l, .ll{
  359. position:fixed!important;
  360. margin-top:165px;
  361. margin-left:65px;
  362. width:0px;
  363. height:1px;
  364. background:{color:navigation};
  365. opacity:1;
  366. z-index:9999;
  367. -webkit-transition: all .3s ease-in-out;
  368. -moz-transition: all .3s ease-in-out;
  369. -o-transition: all .3s ease-in-out;
  370. }
  371.  
  372. #sidebar:hover .l{
  373. width:65px;
  374. margin-left:0px;
  375. }
  376.  
  377. #sidebar:hover .ll{
  378. width:65px;
  379. margin-left:65px;
  380. }
  381.  
  382. #blogtitle{
  383. position:fixed;
  384. width:135px;
  385. height:33px;
  386. margin-left:-2px;
  387. margin-top:130px;
  388. font-size:21px;
  389. letter-spacing:3px;
  390. line-height:33px;
  391. font-family: 'Lato', sans-serif;
  392. color:{color:blogtitle};
  393. background:{color:background};
  394. padding-bottom:2px;
  395. text-align:center;
  396. text-transform:uppercase;
  397. opacity:1;
  398. z-index:99;
  399. -webkit-transition: all .3s ease-in-out;
  400. -moz-transition: all .3s ease-in-out;
  401. -o-transition: all .3s ease-in-out;
  402. -ms-transition: all .3s ease-in-out;
  403. }
  404.  
  405. #desc{
  406. position:absolute;
  407. overflow:auto;
  408. margin-left:0px;
  409. margin-top:0px;
  410. width:110px;
  411. height:110px;
  412. padding:10px;
  413. color:white;
  414. text-align:left;
  415. line-height:15px;
  416. letter-spacing:2px;
  417. opacity:0;
  418. z-index:9;
  419. -webkit-transition: all .3s ease-in-out;
  420. -moz-transition: all .3s ease-in-out;
  421. -o-transition: all .3s ease-in-out;
  422. -ms-transition: all .3s ease-in-out;
  423. }
  424.  
  425. #sidebar:hover #desc{
  426. margin-top:-135px;
  427. opacity:1;
  428. }
  429.  
  430. #links{
  431. position:fixed!important;
  432. margin-top:130px;
  433. margin-left:-10px;
  434. text-align:left;
  435. opacity:1;
  436. z-index:9;
  437. -webkit-transition: all 0.35s;
  438. transition: all 0.35s;
  439. -webkit-transition-delay: 0.35s;
  440. transition-delay: 0.35s;
  441. }
  442.  
  443. #sidebar:hover #links{
  444. margin-top:165px;
  445. -webkit-transition: all 0.35s;
  446. transition: all 0.35s;
  447. -webkit-transition-delay: 0.35s;
  448. transition-delay: 0.35s;
  449. }
  450.  
  451. #links a{
  452. width:15px;
  453. height:15px;
  454. margin:10px;
  455. display:inline-block;
  456. font-size:15px;
  457. line-height:10px;
  458. opacity:1;
  459. text-align:center;
  460. color:{color:navigation};
  461. -webkit-transition: all 0.3s ease-in-out;
  462. -moz-transition: all 0.3s ease-in-out;
  463. -o-transition: all 0.3s ease-in-out;
  464. }
  465.  
  466. #links a:hover{
  467. color:{color:link};
  468. }
  469.  
  470. #pagination{
  471. display:none;
  472. }
  473.  
  474. #entry{
  475. position:relative;
  476. width:620px;
  477. {block:permalinkpage}
  478. width:400px;
  479. {/block:permalinkpage}
  480. top:70px;
  481. margin:0px auto;
  482. }
  483.  
  484. .posts{
  485. position:relative;
  486. width:250px;
  487. overflow:hidden;
  488. {block:IndexPage}
  489. float:left;
  490. margin:30px;
  491. background:#fff;
  492. {/block:IndexPage}
  493. {block:permalinkpage}
  494. width:400px;
  495. top:30px;
  496. {/block:permalinkpage}
  497. }
  498.  
  499. .posts img{
  500. display:block;
  501. max-width:250px;
  502. -webkit-transition: all .5s ease;
  503. -moz-transition: all .5s ease;
  504. -o-transition: all .5s ease;
  505. -ms-transition: all .5s ease;
  506. }
  507.  
  508. .posts:hover img{
  509. {block:indexpage}
  510. max-width:250px;
  511. -moz-transform: scale(1.5);
  512. -webkit-transform: scale(1.5);
  513. -o-transform: scale(1.5);
  514. -ms-transform: scale(1.5);
  515. transform: scale(1.5);
  516. {/block:indexpage}
  517. }
  518.  
  519. .posts .permabg{
  520. position:absolute;
  521. width:250px;
  522. height:0px;
  523. bottom:-55px;
  524. background:{color:permalink};
  525. z-index:99;
  526. opacity:1;
  527. -webkit-transition: all 0.5s;
  528. transition: all 0.5s;
  529. -webkit-transition-delay: 0.5s;
  530. transition-delay: 0.5s;
  531. }
  532.  
  533. .posts:hover .permabg{
  534. bottom:0px;
  535. height:55px;
  536. opacity:1;
  537. -webkit-transition: all .5s ease-in-out;
  538. -moz-transition: all .5s ease-in-out;
  539. -o-transition: all .5s ease-in-out;
  540. -ms-transition: all .5s ease-in-out;
  541. }
  542.  
  543. .posts .perma{
  544. position:absolute;
  545. width:15px;
  546. height:15px;
  547. bottom:-50px;
  548. right:10px;
  549. font-size:20px;
  550. line-height:15px;
  551. text-align:center;
  552. opacity:1;
  553. z-index:999;
  554. -webkit-transition: all .3s ease-out;
  555. -moz-transition: all .3s ease-out;
  556. -o-transition: all .3s ease-out;
  557. transition: all .3s ease-out;
  558. }
  559.  
  560. .posts:hover .perma{
  561. opacity:1;
  562. bottom:10px;
  563. -webkit-transition: all 0.5s;
  564. transition: all 0.5s;
  565. -webkit-transition-delay: 0.5s;
  566. transition-delay: 0.5s;
  567. }
  568.  
  569. .perma a{
  570. color:white;
  571. }
  572.  
  573. .posts .perma2{
  574. position:absolute;
  575. width:19px;
  576. height:15px;
  577. bottom:-50px;
  578. right:40px;
  579. font-size:17px;
  580. text-align:center;
  581. line-height:15px;
  582. opacity:1;
  583. z-index:999;
  584. -webkit-transition: all .3s ease-out;
  585. -moz-transition: all .3s ease-out;
  586. -o-transition: all .3s ease-out;
  587. transition: all .3s ease-out;
  588. }
  589.  
  590. .posts:hover .perma2{
  591. opacity:1;
  592. bottom:10px;
  593. -webkit-transition: all 0.5s;
  594. transition: all 0.5s;
  595. -webkit-transition-delay: 0.5s;
  596. transition-delay: 0.5s;
  597. }
  598.  
  599. .perma2 a{
  600. color:white;
  601. }
  602.  
  603. .posts .perma3{
  604. position:absolute;
  605. width:auto;
  606. height:20px;
  607. bottom:5px;
  608. left:-80px;
  609. font-size:15px;
  610. text-align:center;
  611. opacity:1;
  612. z-index:999;
  613. -webkit-transition: all .3s ease-out;
  614. -moz-transition: all .3s ease-out;
  615. -o-transition: all .3s ease-out;
  616. transition: all .3s ease-out;
  617. }
  618.  
  619. .posts:hover .perma3{
  620. opacity:1;
  621. left:10px;
  622. -webkit-transition: all 0.5s;
  623. transition: all 0.5s;
  624. -webkit-transition-delay: 0.5s;
  625. transition-delay: 0.5s;
  626. }
  627.  
  628. .perma3 a{
  629. color:white;
  630. text-decoration:none;
  631. }
  632.  
  633. .posts .perma4{
  634. position:absolute;
  635. width:auto;
  636. height:20px;
  637. bottom:25px;
  638. left:-165px;
  639. font-size:18px;
  640. font-family: 'Chivo', sans-serif;
  641. text-align:left;
  642. color:white;
  643. letter-spacing:1px;
  644. text-transform:uppercase;
  645. opacity:1;
  646. z-index:999;
  647. -webkit-transition: all .3s ease-out;
  648. -moz-transition: all .3s ease-out;
  649. -o-transition: all .3s ease-out;
  650. transition: all .3s ease-out;
  651. }
  652.  
  653. .posts:hover .perma4{
  654. opacity:1;
  655. left:10px;
  656. -webkit-transition: all 0.5s;
  657. transition: all 0.5s;
  658. -webkit-transition-delay: 0.5s;
  659. transition-delay: 0.5s;
  660. }
  661.  
  662. .posts .fade{
  663. position:absolute;
  664. overflow:hidden;
  665. width:250px;
  666. height:0px;
  667. background:white;
  668. margin-left:0px;
  669. margin-top:0px;
  670. opacity:.3;
  671. z-index:1;
  672. -webkit-transition:all .3s ease-in-out;
  673. -moz-transition:all .3s ease-in-out;
  674. transition:all .3s ease-in-out;
  675. }
  676.  
  677. .posts:hover .fade{
  678. opacity:.3;
  679. height:calc(100% - 0px);
  680. }
  681.  
  682. .posts img, .posts li, .posts blockquote{
  683. max-width: 100%;
  684. }
  685.  
  686. .posts .permalinktext{
  687. position:relative;
  688. width:250px;
  689. height:auto;
  690. padding-top:10px;
  691. text-align:right;
  692. margin-top:5px;
  693. margin-left:0px;
  694. border-top:1px solid {color:permalink};
  695. color:{color:permalink};
  696. opacity:1;
  697. z-index:99;
  698. }
  699.  
  700. .posts .permalinktext a{
  701. color:{color:permalink};
  702. font-weight:normal;
  703. }
  704.  
  705. #permapage{
  706. {block:permalinkpage}
  707. padding-top:60px;
  708. width:400px;
  709. height:auto;
  710. z-index:999;
  711. {/block:permalinkpage}
  712. }
  713.  
  714. #source{
  715. margin-top:0px;
  716. margin-left:15px;
  717. }
  718.  
  719. .playerbuttonbg {
  720. position: absolute;
  721. right:-63px;
  722. margin-top:20px;
  723. width:40px;
  724. height:40px;
  725. background-color:transparent;
  726. opacity:1;
  727. transition: opacity .7s ease-in-out;
  728. -moz-transition: opacity .7s ease-in-out;
  729. -webkit-transition: opacity .7s ease-in-out;
  730. }
  731.  
  732. .playerbuttonbg:hover {
  733. opacity: 1;
  734. filter: alpha(opacity=100);
  735. -moz-opacity: 1;
  736. -khtml-opacity: 1;
  737. }
  738.  
  739. .newplayerbutton {
  740. position: relative;
  741. width:19px;
  742. height:19px;
  743. padding:5px;
  744. border-radius:30px;
  745. overflow: hidden;
  746. }
  747.  
  748. .player{
  749. width:18px;
  750. height:18px;
  751. line-height:27px;
  752. margin-top:5px;
  753. margin-left:5px;
  754. border-radius:100px;
  755. padding:5px;
  756. overflow:hidden;
  757. position:absolute;
  758. background:white;
  759. z-index:9;
  760. opacity:.8;
  761. }
  762.  
  763. .tumblr_audio_player {
  764. height: 90px;
  765. width: 270px;
  766. -moz-transform: scale(0.60, 0.60);
  767. -webkit-transform: scale(0.60, 0.60);
  768. -o-transform: scale(0.60, 0.60);
  769. -ms-transform: scale(0.60, 0.60);
  770. transform: scale(0.60, 0.60);
  771. -moz-transform-origin: top left;
  772. -webkit-transform-origin: top left;
  773. -o-transform-origin: top left;
  774. -ms-transform-origin: top left;
  775. transform-origin: top left;
  776. }
  777.  
  778. .audioimgwrapper {
  779. position: absolute;
  780. float:right;
  781. overflow: hidden;
  782. width: 80px;
  783. height: 80px;
  784. margin-left:170px;
  785. }
  786.  
  787. .audioimgwrapper img {
  788. width: 100%;
  789. height: auto;
  790. float:right;
  791. }
  792.  
  793. .posts:hover .audioimgwrapper img{
  794. transform: scale(1);
  795. }
  796.  
  797. .trackdetails {
  798. width:150px;
  799. height:60px;
  800. margin-left:0px;
  801. display:inline-block;
  802. font-family:arial;
  803. font-size:9px;
  804. background:{color:ask};
  805. text-align:center;
  806. color:white;
  807. padding:10px;
  808. }
  809.  
  810. .audiowrapper {
  811. position: relative;
  812. display:inline-block;
  813. }
  814.  
  815. .q{
  816. min-height:21px;
  817. margin-bottom:10px;
  818. background:{color:ask};
  819. padding:10px;
  820. width:166px;
  821. color:white;
  822. margin-top:5px;
  823. line-height:15px;
  824. {block:permalinkpage}
  825. width:316px;
  826. {/block:permalinkpage}
  827. }
  828.  
  829. .as{
  830. color:{color:ask};
  831. font-family: 'Lato', sans-serif;
  832. font-size:15px;
  833. line-height:18px;
  834. text-transform:uppercase;
  835. letter-spacing:5px;
  836. }
  837.  
  838. .as a{
  839. color:{color:ask};
  840. font-weight:normal;
  841. }
  842.  
  843. .a{
  844. line-height:15px;
  845. }
  846.  
  847. .chat ol{
  848. padding:0;
  849. list-style:none;
  850. }
  851. .line{
  852. padding:10px;
  853. color:{color:text};
  854. text-align:left;
  855. border-top:1px solid #ebebeb;
  856. }
  857.  
  858. .label{
  859. font-weight:bold;
  860. }
  861.  
  862. .pagenotes {
  863. {block:IndexPage}
  864. display: none!important;
  865. {/block:IndexPage}
  866. width:378px;
  867. height:378px;
  868. overflow:auto;
  869. padding:10px;
  870. margin-bottom:60px;
  871. text-align:left;
  872. }
  873. .pagenotes img{
  874. padding:5px;
  875. }
  876. .pagenotes li {
  877. list-style-type:none;
  878. padding:5px 0px;
  879. text-align:left;
  880. margin:0 0 0 -40px;
  881. }
  882.  
  883. #top{
  884. position:fixed;
  885. width:100%;
  886. height:40px;
  887. top:0;
  888. left:0;
  889. background:{color:top bar};
  890. z-index:9999;
  891. }
  892.  
  893. .vignette, #vignette {
  894. opacity:0;
  895. }
  896.  
  897. .lightbox-image, #tumblr_lightbox img {
  898. box-shadow:none !important;
  899. border-radius:0 !important;
  900. max-width:none;
  901. border:5px solid #fff !important;
  902. -moz-box-sizing:border-box;
  903. box-sizing:border-box;
  904. }
  905.  
  906. .tmblr-lightbox, #tumblr_lightbox {
  907. background-color:rgba({RGBcolor:permalink},.5) !important;
  908. }
  909.  
  910. .lightbox-caption, #tumblr_lightbox_caption {
  911. visibility:hidden;
  912. }
  913.  
  914. {CustomCSS}
  915.  
  916. </style>
  917.  
  918. </head>
  919.  
  920. <body>
  921.  
  922. <div id="top"></div>
  923.  
  924. <div id="sidebar">
  925.  
  926. <div class="l"></div>
  927. <div class="ll"></div>
  928.  
  929. <div id="sidebarim"><img src="{image:Sidebar}">
  930.  
  931. <div id="sidebarbg"></div>
  932.  
  933. <div id="desc">{Description}</div>
  934.  
  935. </div>
  936.  
  937. <div id="blogtitle">{text:blogtitle}</div>
  938.  
  939. <div id="links">
  940. <a href="{text:Link One URL}" title="{text:Link One Title}"><i class="fa fa-refresh"></i></a>
  941. <a href="{text:Link Two URL}" title="{text:Link Two Title}"><i class="fa fa-pencil"></i></a>
  942. <a href="{text:Link Three URL}" title="{text:Link Three Title}"><i class="fa fa-list"></i></a>
  943. <a href="{text:Link Four URL}" title="{text:Link Four Title}" style="margin-left:7px;"><i class="fa fa-code"></i></a>
  944. </div>
  945.  
  946. </div>
  947.  
  948. {block:indexpage}
  949. <div id="tif">
  950. <a href="http://tumblr.com/follow/{Name}" title="follow"><i class="fa fa-plus"></i></a>
  951. <a href="https://www.tumblr.com/dashboard?conversation={Name}" title="message"><i class="fa fa-comment"></i></a>
  952. <a href="https://tumblr.com" title="dashboard"><i class="fa fa-tumblr"></i></a>
  953. <a href="https://www.tumblr.com/customize/{name}?redirect_to=http%3A%2F%2F{name}.tumblr.com" style="color:{color:top bar}; top:0px; left:0px; position:fixed; z-index:1;"><i class="fa fa-circle" style="color:{color:top bar};"></i></a>
  954. </div>
  955. {/block:indexpage}
  956.  
  957. <div id="entry">
  958.  
  959. {block:Posts}
  960. <div class="posts">
  961.  
  962. {block:Quote}
  963. <div id="title" style="border-bottom:0px solid transparent;">“{Quote}”</div>
  964. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  965. {block:IndexPage}<br>
  966. <div class="permalinktext">
  967. <a href="{ReblogURL}">reblog</a> &mdash;
  968. <a href="{Permalink}">more info</a> &mdash;
  969. {notecountwithlabel}
  970. </div>
  971. {/block:IndexPage}
  972. {/block:Quote}
  973.  
  974. {block:Text}
  975. {block:Title}
  976. <div id="title">{Title}</div>{/block:Title}
  977. {Body}
  978. {block:IndexPage}
  979. <div class="permalinktext">
  980. <a href="{ReblogURL}">reblog</a> &mdash;
  981. <a href="{Permalink}">more info</a> &mdash;
  982. {notecountwithlabel}
  983. </div>
  984. {/block:IndexPage}
  985. {/block:Text}
  986.  
  987. {block:Link}
  988. <div id="title" style="text-align:center; border-bottom:0px solid transparent; padding:5px; background:{color:title};"><a href="{URL}"><i class="fa fa-external-link-square" style="color:white"></i> <font color="white">{Name}</font></a></div>{block:Description}{Description}{/block:Description}
  989. {block:IndexPage}
  990. <div class="permalinktext">
  991. <a href="{ReblogURL}">reblog</a> &mdash;
  992. <a href="{Permalink}">more info</a> &mdash;
  993. {notecountwithlabel}
  994. </div>
  995. {/block:IndexPage}
  996. {/block:Link}
  997.  
  998. {block:Chat}
  999. {block:Title}
  1000. <div id="title" style="border-bottom:0px solid transparent; padding-bottom:0px;">{Title}</div>
  1001. {/block:Title}
  1002. <div class="chat">
  1003. <ol>{block:Lines}
  1004. <li class="line {Alt}">
  1005. {block:Label}
  1006. <span class="label">
  1007. {Label}</span>
  1008. {/block:Label}{Line}</li>
  1009. {/block:Lines}
  1010. </ol></div>
  1011. {block:IndexPage}
  1012. <div class="permalinktext">
  1013. <a href="{ReblogURL}">reblog</a> &mdash;
  1014. <a href="{Permalink}">more info</a> &mdash;
  1015. {notecountwithlabel}
  1016. </div>
  1017. {/block:IndexPage}
  1018. {/block:Chat}
  1019.  
  1020. {block:Photo}
  1021. {block:IndexPage}
  1022. <div class="fade"></div>
  1023. <div class="permabg"></div>
  1024. <div class="perma">
  1025. <a href="{Like}" target="_blank">{LikeButton color=white size=15}</a></div>
  1026. <div class="perma2">
  1027. <a href="{ReblogURL}" target="_blank"><i class="fa fa-retweet"></i></a></div>
  1028. <div class="perma3">
  1029. <a href="{Permalink}" target="_blank" title="permalink page">{notecount} N</a></div>
  1030. <div class="perma4">information &mdash;</div>
  1031. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=700px;>
  1032. {/block:IndexPage}
  1033. {block:permalinkpage}{LinkOpenTag}<center>
  1034. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=700px;>
  1035. {LinkCloseTag}</center>{/block:permalinkpage}
  1036. {/block:Photo}
  1037.  
  1038. {block:Photoset}
  1039. {Photoset-250}
  1040. {block:IndexPage}
  1041. <div class="permalinktext">
  1042. <a href="{ReblogURL}">reblog</a> &mdash;
  1043. <a href="{Permalink}">more info</a> &mdash;
  1044. {notecountwithlabel}
  1045. </div>
  1046. {/block:IndexPage}
  1047. {/block:Photoset}
  1048.  
  1049. {block:Video}
  1050. {Video-250}
  1051. {block:IndexPage}<br>
  1052. <div class="permalinktext">
  1053. <a href="{ReblogURL}">reblog</a> &mdash;
  1054. <a href="{Permalink}">more info</a> &mdash;
  1055. {notecountwithlabel}
  1056. </div>
  1057. {/block:IndexPage}
  1058. {block:PermalinkPage}<div style="width: 250px; overflow-x:hidden; overflow-y:hidden">{Video-250}{/block:PermalinkPage}
  1059. {/block:Video}
  1060.  
  1061. {block:Audio}
  1062. {block:AudioPlayer}
  1063. <div class="audiowrapper">
  1064. {block:AlbumArt}
  1065. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1066. {/block:AlbumArt}
  1067. <div class="playerbuttonbg">
  1068. <div class="player"><div style="margin-top:-17.5px; margin-left:-5px;">{AudioPlayerWhite}</div></div>
  1069. </div>
  1070. <div class="trackdetails">
  1071. {block:TrackName}<div style="margin-top:20px;"><font style="font-size:15px; font-family: 'Lato', sans-serif; letter-spacing:3px;">{TrackName}</font>{/block:TrackName}<br/>
  1072. {block:Artist}{Artist}{/block:Artist}</div>
  1073. </div>
  1074. </div>
  1075. {/block:AudioPlayer}
  1076. {block:Caption}{Caption}{/block:Caption}
  1077. {block:IndexPage}<br>
  1078. <div class="permalinktext">
  1079. <a href="{ReblogURL}">reblog</a> &mdash;
  1080. <a href="{Permalink}">more info</a> &mdash;
  1081. {notecountwithlabel}
  1082. </div>
  1083. {/block:IndexPage}
  1084. {/block:Audio}
  1085.  
  1086. {block:Answer}
  1087. <img src="{AskerPortraitURL-64}" width="64" align="right" style="margin-right:0px; background:#f7f7f7; -webkit-transform: scale(1);">
  1088. <div class="as">{Asker}</div>
  1089. <div class="q">
  1090. {Question}</div>
  1091. <div class="a">{Answer}</div>
  1092. {block:IndexPage}
  1093. <div class="permalinktext">
  1094. <a href="{ReblogURL}">reblog</a> &mdash;
  1095. <a href="{Permalink}">more info</a> &mdash;
  1096. {notecountwithlabel}
  1097. </div>
  1098. {/block:IndexPage}
  1099. {/block:Answer}
  1100.  
  1101. </div>
  1102.  
  1103. {block:PostNotes}
  1104. <div id="permapage">
  1105. {block:caption}<div style="letter-spacing:2px;">{caption}</div>{/block:caption}
  1106. {block:Date}<div style="letter-spacing:2px;"><b><i class="fa fa-clock-o"></i> posted:</b> {DayOfWeek} {Month} {DayOfMonth}{DayOfMonthSuffix} {Year} at {12Hour}:{Minutes} {AmPm} {/block:Date}<br>
  1107. {block:NoteCount}<b><i class="fa fa-share-alt"></i> notes:</b> {NoteCount}<br></div>{/block:NoteCount}
  1108. {block:RebloggedFrom}<b><i class="fa fa-retweet"></i> reblogged from:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br><div style="letter-spacing:2px;"><b><i class="fa fa-location-arrow"></i> source:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a></div>{/block:RebloggedFrom}
  1109. {block:HasTags}<div id="tags"><b><i class="fa fa-tags"></i> tags:</b>
  1110. {block:Tags}
  1111. <a href="{TagURL}">#{Tag} </a>
  1112. {/block:Tags}
  1113. </div>
  1114. {/block:HasTags}
  1115. {block:NoteCount} <div style="text-align:center; margin:5px"></div>{/block:NoteCount}</justify>
  1116. </div>
  1117. <div class="pagenotes">
  1118. {PostNotes}
  1119. </div>
  1120. {/block:PostNotes}
  1121.  
  1122. {/block:Posts}
  1123.  
  1124. {block:IndexPage}
  1125. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  1126. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  1127.  
  1128. <script type="text/javascript">
  1129. $(window).load(function(){
  1130. var $wall = $('#entry');
  1131. $wall.imagesLoaded(function(){
  1132. $wall.masonry({
  1133. itemSelector: '.posts, .posts_photo',
  1134. isAnimated : false
  1135. });
  1136. });
  1137.  
  1138. $wall.infinitescroll({
  1139. navSelector : '#pagination',
  1140. nextSelector : '#pagination a',
  1141. itemSelector : '.posts, .posts_photo',
  1142. bufferPx : 2000,
  1143. debug : false,
  1144. errorCallback: function() {
  1145. $('#infscr-loading').fadeOut('normal');
  1146. }},
  1147. function( newElements ) {
  1148. var $newElems = $( newElements );
  1149. $newElems.hide();
  1150. $newElems.imagesLoaded(function(){
  1151. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1152. });
  1153. }); $('#entry').show(500);
  1154. });
  1155. </script>
  1156. {/block:IndexPage}
  1157.  
  1158. <div id="pagination">
  1159. {block:Pagination}
  1160. {block:PreviousPage}
  1161. <a href="{PreviousPage}"></a>
  1162. {/block:PreviousPage}
  1163.  
  1164. {block:NextPage}
  1165. <a href="{NextPage}"></a>
  1166. {/block:NextPage}
  1167. {/block:Pagination}
  1168. </div>
  1169.  
  1170. </div>
  1171.  
  1172. </div>
  1173.  
  1174. {block:ContentSource}
  1175. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1176. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1177. {/block:SourceLogo}
  1178. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1179. {/block:ContentSource}
  1180.  
  1181. <div style="z-index:999; position:fixed; top:0px; left:0px; opacity:1; font-size:20px; color:#fff;"><a href="https://www.tumblr.com/customize/{name}?redirect_to=http%3A%2F%2F{name}.tumblr.com"><font color="{color:top bar}"><i class="fa fa-circle"></i></font></a></div>
  1182.  
  1183. <div style="z-index:9999; position:fixed; bottom:5px; right:5px; opacity:1; font-size:25px; color:#fff;"><a href="http://seedfawn.tumblr.com" title="Theme by seedfawn"><font color="{color:top bar}"><i class="fa fa-code"></i></font></a></div>
  1184.  
  1185. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement