Advertisement
destinatia

THEME 007: ✧ * º • ☾ NOVEMBER. ❜ — destinatiia

Jun 20th, 2016
2,051
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.60 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. ✧ * ☾ destinatiia.tumblr.com * ✧
  8.  
  9. - you're allowed edit as much as you want, but don't repost and claim as your own afterwards.
  10. - don't move the credit or put it in another page
  11. - don't take fragments from this code and paste it on your own. it's rude as i worked real hard on this one so.
  12. - base code made by neonbikethemes as always,,,, absolutely blessed for their existence thank u
  13. - enjoy !! and if you have any questions and/or problems just hmu
  14.  
  15. -->
  16.  
  17. {block:Description}
  18. <meta name="description" content="{MetaDescription}" />
  19. {/block:Description}
  20. <meta charset="utf-8">
  21. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  22. <title>{Title}{block:TagPage} {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  23. <link rel="shortcut icon" href="{Favicon}">
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25.  
  26. <meta name="color:background" content="#ffffff" />
  27. <meta name="color:links" content="#000000" />
  28. <meta name="color:links hover" content="#a0a0a0" />
  29. <meta name="color:text" content="#000000" />
  30. <meta name="color:posts" content="#ffffff" />
  31. <meta name="color:descbox" content="#eee" />
  32. <meta name="color:headerlinks bg" content="#ddd" />
  33. <meta name="color:text shadows" content="#ffffff" />
  34. <meta name="color:accent" content="#ffffff" />
  35. <meta name="color:sidebar borders" content="#ffffff" />
  36. <meta name="color:container" content="#ffffff" />
  37.  
  38. <meta name="text:draft count" content="000" />
  39. <meta name="text:meme count" content="000" />
  40. <meta name="text:envelope icon link" content="/" />
  41. <meta name="text:ppl icon link" content="/" />
  42.  
  43. <meta name="image:sidebar icon 1" content="" />
  44. <meta name="image:sidebar icon 2" content="" />
  45. <meta name="image:sidebar icon 3" content="" />
  46. <meta name="image:sidebar icon 4" content="" />
  47. <meta name="image:mun pic" content="" />
  48. <meta name="image:mun pic 2" content="" />
  49. <meta name="image:mun pic 3" content="" />
  50. <meta name="image:corner sidebar" content="" />
  51. <meta name="image:background" content="" />
  52.  
  53. <meta name="if:400px posts" content="0"/>
  54. <meta name="if:round borders" content="1"/>
  55. <meta name="if:grayscale" content="0"/>
  56.  
  57.  
  58. <!-- IMPORTED SCRIPTS - DON'T REMOVE -->
  59. <script src="//cdn.jsdelivr.net/emojione/2.0.0/lib/js/emojione.min.js"></script>
  60.  
  61. <link rel="stylesheet" href="//cdn.jsdelivr.net/emojione/2.0.0/assets/css/emojione.min.css"/>
  62. <script>
  63. $(window).load(function(){
  64. function convert() {
  65. var input = document.body.innerHTML;
  66. var output = emojione.unicodeToImage(input);
  67. document.body.innerHTML = output;
  68. }
  69. convert();
  70. });
  71. </script>
  72.  
  73.  
  74.  
  75. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  76.  
  77. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  78.  
  79. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  80.  
  81. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  82.  
  83. <link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
  84.  
  85.  
  86. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  87.  
  88. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  89. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  90. <script>
  91. (function($){
  92. $(document).ready(function(){
  93. $("a[title]").style_my_tooltips({
  94. tip_follows_cursor:true,
  95. tip_delay_time:90,
  96. tip_fade_speed:600,
  97. attribute:"title"
  98. });
  99. });
  100. })(jQuery);
  101. </script>
  102.  
  103.  
  104. {block:IfNot400pxPosts}
  105. <script type="text/javascript">
  106. /* Photoset Resize Code by Kevin - EXCOLO.TUMBLR.COM */
  107. $(document).ready(function() {
  108. function photosetResize() {
  109. $('iframe.photoset').each(function(){
  110. var newSize = 300;
  111. var newSrc = $(this).attr('src').replace('500',newSize);
  112. $(this).attr('src', newSrc).width(newSize);
  113. var high = $(this).css('height');
  114. var calculate = parseInt(high, 10)* newSize/500;
  115. $(this).css('height', calculate);
  116. });
  117. }
  118. photosetResize();
  119. });
  120. </script> {/block:IfNot400pxPosts}
  121.  
  122.  
  123. {block:If400pxPosts}
  124. <script type="text/javascript">
  125. /* Photoset Resize Code by Kevin - EXCOLO.TUMBLR.COM */
  126. $(document).ready(function() {
  127. function photosetResize() {
  128. $('iframe.photoset').each(function(){
  129. var newSize = 400;
  130. var newSrc = $(this).attr('src').replace('500',newSize);
  131. $(this).attr('src', newSrc).width(newSize);
  132. var high = $(this).css('height');
  133. var calculate = parseInt(high, 10)* newSize/500;
  134. $(this).css('height', calculate);
  135. });
  136. }
  137. photosetResize();
  138. });
  139. </script> {/block:If400pxPosts}
  140.  
  141.  
  142.  
  143. <script type="text/javascript"
  144. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  145. <script>
  146. $(document).ready(function() {
  147. //
  148. $('a.poplight[href^=#]').click(function() {
  149. var popID = $(this).attr('rel'); //Get Popup Name
  150. var popURL = $(this).attr('href'); //Get Popup href to define size
  151. var query= popURL.split('?');
  152. var dim= query[1].split('&');
  153. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  154. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  155. var popMargTop = ($('#' + popID).height() + 80) / 2;
  156. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  157. //Apply Margin to Popup
  158. $('#' + popID).css({
  159. 'margin-top' : -popMargTop,
  160. 'margin-left' : -popMargLeft
  161. });
  162. $('body').append('<div id="fade"></div>');
  163. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  164. return false;
  165. });
  166. $('a.close, #fade').live('click', function() {
  167. $('#fade , .popup_block').fadeOut(function() {
  168. $('#fade, a.close').remove(); //fade them both out
  169. });
  170. return false;
  171. });
  172. });
  173. </script>
  174.  
  175.  
  176. <style type="text/css">
  177.  
  178. /* ---------------------------- GENERAL ----------------------------- */
  179.  
  180. /* -------- SELECTION TOOL ------- */
  181.  
  182. ::-moz-selection {
  183. background: {color:text};
  184. color: {color:background};
  185. }
  186.  
  187. ::selection {
  188. background: {color:text};
  189. color: {color:background};
  190. }
  191.  
  192. /* -------- SCROLLBAR ------- */
  193.  
  194. ::-webkit-scrollbar {
  195. width: 0px;
  196. visibility:hidden;
  197. }
  198.  
  199. /* Track */
  200. ::-webkit-scrollbar-track {
  201. background:{color:background};
  202. visibility:hidden;
  203. }
  204.  
  205. /* Handle */
  206. ::-webkit-scrollbar-thumb {
  207. background:{color:text};
  208. visibility:hidden;
  209. }
  210. ::-webkit-scrollbar-thumb:window-inactive {
  211. background: transparent;
  212. visibility:hidden;
  213. }
  214.  
  215.  
  216. /* ------- TOOLTIPS ------ */
  217.  
  218. #s-m-t-tooltip {
  219. max-width:300px;
  220. padding:7px;
  221. color:{color:accent};
  222. margin:15px 0px 0px 10px;
  223. background-color:{color:descbox};
  224. font-family:'montserrat',sans serif;
  225. font-size:10px;
  226. box-shadow: 3px 3px 5px {color:text shadows};
  227. z-index:999999999999999999999999999999999999;
  228. }
  229.  
  230.  
  231. /* -------- BASICS ------- */
  232.  
  233. body {
  234. background-color:{color:background};
  235. background-image:url('{image:background}');
  236. color: {color:text};
  237. overflow-y:hidden;
  238. overflow-x:auto;
  239. font-family: calibri;
  240. font-size: 10px;
  241. margin: 0;
  242. letter-spacing:0.5px;
  243. padding: 0;
  244. word-wrap: break-word;
  245. line-height:160%;
  246. }
  247.  
  248. sup, sub, small {
  249. font-size:9px;
  250. }
  251.  
  252. h1 {
  253. font-family:'montserrat', sans serif;
  254. font-size:24px;
  255. color: {color:accent};
  256. }
  257.  
  258.  
  259. h2 {
  260. font-family:'montserrat', sans serif;
  261. font-size:18px;
  262. font-style:italic;
  263. color: {color:accent};
  264. }
  265.  
  266.  
  267. a {
  268. color: {color:links};
  269. text-decoration: none;
  270. -webkit-transition: all 1s;
  271. -moz-transition: all 1s;
  272. -o-transition: all 1s;
  273. -ms-transition: all 1s;
  274. transition: all 1s;
  275. }
  276.  
  277.  
  278. b, strong {
  279. color: {color:accent};
  280. font-family:'montserrat', sans serif;
  281. text-shadow: 0px 0px 4px {color:text shadows};
  282. }
  283.  
  284. i, em,italic {
  285. color: {color:accent};
  286. font-family:'montserrat', sans serif;
  287. text-shadow: 0px 0px 4px {color:text shadows};
  288. }
  289.  
  290. s, strike {
  291. color: {color:accent};
  292. font-family:'montserrat', sans serif;
  293. text-shadow: 0px 0px 4px {color:text shadows};
  294. }
  295.  
  296. u,underline {
  297. color: {color:accent};
  298. font-family:'montserrat', sans serif;
  299. text-shadow: 0px 0px 4px {color:text shadows};
  300. }
  301.  
  302. a:hover{
  303. color:{color:links hover};
  304. letter-spacing:3px;
  305. text-shadow: 0px 0px 4px {color:accent};
  306. -webkit-transition: all 1s;
  307. -moz-transition: all 1s;
  308. -o-transition: all 1s;
  309. -ms-transition: all 1s;
  310. transition: all 1s;
  311. }
  312.  
  313. blockquote {
  314. background:{color:descbox};
  315. border-left:{color:text} 1px solid;
  316. margin: 10px;
  317. padding-left:20px;
  318. padding-top:10px;
  319. padding-right:20px;
  320. padding-bottom:10px;
  321. }
  322.  
  323. {block:IfGrayscale}
  324.  
  325. img{
  326. -webkit-filter: grayscale(100%);
  327. max-width:100%;
  328. }
  329.  
  330. .html_photoset {
  331. -webkit-filter: grayscale(100%);
  332. -webkit-transition: all .25s;
  333. ...
  334. }
  335.  
  336.  
  337. {/block:IfGrayscale}
  338.  
  339. {block:IfNotGrayscale}
  340.  
  341. img{
  342. max-width:100%;
  343. }
  344.  
  345. {/block:IfNotGrayscale}
  346.  
  347. iframe, img, embed, object, video {
  348. max-width: 100%;
  349. }
  350.  
  351. p{
  352. margin-bottom:10px;
  353. }
  354.  
  355. h1{
  356. text-transform:uppercase;
  357. font-size:13px;
  358. }
  359.  
  360. ul{
  361. list-style-type:circle;
  362. }
  363.  
  364. ol{
  365. list-style-type:;
  366. }
  367.  
  368. .tabcontent {
  369. position:static;
  370. margin-top:200px;
  371. margin-left:50px;
  372. width: 325px;
  373. margin-right:auto;
  374. height:327px;
  375. padding:20px;
  376. overflow:auto;
  377. background-color:{color:container};
  378. text-align:center;
  379. margin-bottom:200px;
  380. }
  381.  
  382.  
  383. {block:If400pxPosts}
  384.  
  385. #postcontainer {
  386. position:static;
  387. margin-top:200px;
  388. margin-left:50px;
  389. z-index:9999999999;
  390. margin-right:auto;
  391. width: 425px;
  392. padding:20px;
  393. overflow-y:auto;
  394. overflow-x:hidden;
  395. background-color:transparent;
  396. height: 327px;
  397. margin-bottom:200px;
  398. }
  399.  
  400. #contbg {
  401. position:fixed;
  402. margin-top:200px;
  403. margin-left:50px;
  404. z-index:-99;
  405. margin-right:auto;
  406. width: 425px;
  407. padding:20px;
  408. overflow:auto;
  409. background-color:{color:container};
  410. height: 327px;
  411. margin-bottom:200px;
  412. }
  413.  
  414. {/block:If400pxPosts}
  415.  
  416.  
  417.  
  418.  
  419.  
  420. {block:IfNot400pxPosts}
  421.  
  422. #postcontainer {
  423. position:static;
  424. margin-top:200px;
  425. margin-left:50px;
  426. z-index:9999999999;
  427. margin-right:auto;
  428. width: 325px;
  429. padding:20px;
  430. overflow-y:auto;
  431. overflow-x:hidden;
  432. background-color:transparent;
  433. height: 327px;
  434. margin-bottom:200px;
  435. }
  436.  
  437. #contbg {
  438. position:fixed;
  439. margin-top:200px;
  440. margin-left:50px;
  441. z-index:-99;
  442. margin-right:auto;
  443. width: 325px;
  444. padding:20px;
  445. overflow:auto;
  446. background-color:{color:container};
  447. height: 327px;
  448. margin-bottom:200px;
  449. }
  450.  
  451. {/block:IfNot400pxPosts}
  452.  
  453.  
  454.  
  455.  
  456. #sidebarr {
  457. width:370px;
  458. margin-top:160px;
  459. height:370px;
  460. background:{color:container};
  461. margin-left:-120px;
  462. opacity:0.6;
  463. position:fixed;
  464. }
  465.  
  466. #descbox {
  467. width:78px;
  468. font-size:9px;
  469. z-index:99;
  470. font-family:calibri;
  471. margin-top:15px;
  472. text-align:justify;
  473. padding:10px;
  474. background:{color:descbox};
  475. overflow:auto;
  476. height:120px;
  477. line-height:190%;
  478. margin-left:0px;
  479. position:relative;
  480. }
  481.  
  482.  
  483.  
  484. /* ----------------------------- HEADER STUFF ---------------------------*/
  485.  
  486. #topbar{
  487. position:static;
  488. margin-top:70px;
  489. margin-bottom:50px;
  490. text-align:center;
  491. }
  492.  
  493.  
  494.  
  495. {block:IfNot400pxPosts}
  496.  
  497. #sideright {
  498. background:{color:headerlinks bg};
  499. font-family: 'montserrat', sans-serif;
  500. position:fixed;
  501. opacity:0.9;
  502. z-index:9;
  503. margin-left:430px;
  504. text-align:center;
  505. margin-top:143px;
  506. width:98px;
  507. height:270px;
  508. padding:10px;
  509. }
  510.  
  511. #headerlinks {
  512. position:fixed;
  513. margin-top:190px;
  514. z-index:999;
  515. background:{color:headerlinks bg};
  516. width:345px;
  517. font-size:17px;
  518. height:20px;
  519. letter-spacing:6px;
  520. padding-top:8px;
  521. padding-right:10px;
  522. padding-left:10px;
  523. padding-bottom:10px;
  524. margin-left:50px;
  525. text-align:center;
  526. }
  527.  
  528. {/block:IfNot400pxPosts}
  529.  
  530.  
  531.  
  532. {block:If400pxPosts}
  533.  
  534. #sideright {
  535. background:{color:headerlinks bg};
  536. font-family: 'montserrat', sans-serif;
  537. position:fixed;
  538. opacity:0.9;
  539. z-index:9;
  540. margin-left:530px;
  541. text-align:center;
  542. margin-top:143px;
  543. width:98px;
  544. height:270px;
  545. padding:10px;
  546. }
  547.  
  548. #headerlinks {
  549. position:fixed;
  550. margin-top:190px;
  551. z-index:999;
  552. background:{color:headerlinks bg};
  553. width:445px;
  554. font-size:17px;
  555. height:20px;
  556. letter-spacing:6px;
  557. padding-top:8px;
  558. padding-right:10px;
  559. padding-left:10px;
  560. padding-bottom:10px;
  561. margin-left:50px;
  562. text-align:center;
  563. }
  564.  
  565. {/block:If400pxPosts}
  566.  
  567. {block:IfRoundBorders}
  568. #cornerpic img{
  569. border-radius:100px;
  570. }
  571. {/block:IfRoundBorders}
  572.  
  573. {block:IfNotRoundBorders}
  574. #cornerpic img{
  575. border-radius:none;
  576. }
  577. {/block:IfNotRoundBorders}
  578.  
  579. #sidebaricons {
  580. z-index:99;
  581. width:100px;
  582. position:fixed;
  583. margin-left:-50px;
  584. margin-top:181px;
  585. }
  586.  
  587. {block:IfRoundBorders}
  588. #sidebaricons img {
  589. border-radius:60px;
  590. border: solid 10px {color:sidebar borders};
  591. width:70px;
  592. text-align:center;
  593. position:fixed;
  594. }
  595.  
  596. {/block:IfRoundBorders}
  597.  
  598. {block:IfNotRoundBorders}
  599. #sidebaricons img {
  600. border: solid 10px {color:sidebar borders};
  601. width:70px;
  602. text-align:center;
  603. position:fixed;
  604. }
  605.  
  606. {/block:IfNotRoundBorders}
  607.  
  608.  
  609. /* ------------------------------ TABS ------------------------------ */
  610.  
  611. .tabs {
  612. width:100%;
  613. margin-left:0px;
  614. display:inline-block;
  615. }
  616.  
  617. /*----- Tab Links -----*/
  618.  
  619. /* Clearfix */
  620. .tab-links:after {
  621. display:block;
  622. clear:both;
  623. content:'';
  624. }
  625.  
  626. .tab-links li {
  627. margin-right:-3px;
  628. display:inline-block;
  629. list-style:none;
  630. text-transform:uppercase;
  631. }
  632.  
  633. .tab-links a {
  634. padding-right:7px;
  635. padding-left:7px;
  636. display:inline-block;
  637. color:{color:links};
  638. transition:all linear 0.15s;
  639. }
  640.  
  641. .tab-links a:hover {
  642. color:{color:link hover};
  643. text-decoration:none;
  644. }
  645.  
  646. li.active a, li.active a:hover {
  647. background:transparent;
  648. color:{color:accent};
  649. -webkit-transition: all 1s;
  650. -moz-transition: all 1s;
  651. -o-transition: all 1s;
  652. -ms-transition: all 1s;
  653. transition: all 1s;
  654. }
  655.  
  656. /*----- Content of Tabs -----*/
  657. .tab-content {
  658. }
  659.  
  660. .tab {
  661. display:none;
  662. }
  663.  
  664. .tab.active {
  665. display:block;
  666. }
  667.  
  668.  
  669. /* -- pop up code !! -- */
  670.  
  671. .popup_block{
  672. display:none;
  673. background:{color:background};
  674. padding:20px;
  675. float:left;
  676. position:fixed;
  677. top:50%;left:55%;
  678. z-index: 99999;
  679. height:280px;
  680. text-align:justify;
  681. overflow:auto;
  682. }
  683.  
  684. #fade {
  685. display:none;
  686. position:fixed;
  687. left:0px;
  688. top:0px;
  689. width:100%;
  690. height:100%;
  691. z-index:9999;
  692. background:#000;
  693. opacity:0.3;
  694.  
  695. }
  696.  
  697.  
  698. /* --------------------------- POSTS (articles) --------------------- */
  699.  
  700. {block:If400pxPosts}
  701. article {
  702. float:left;
  703. background:{color:posts};
  704. padding: 10px;
  705. width: 400px;
  706. text-align:justify;
  707. margin-bottom:20px;
  708. }
  709. {/block:If400pxPosts}
  710.  
  711. {block:IfNot400pxPosts}
  712. article {
  713. float:left;
  714. background:{color:posts};
  715. padding: 10px;
  716. width: 300px;
  717. text-align:justify;
  718. margin-bottom:20px;
  719. }
  720. {/block:IfNot400pxPosts}
  721. /* ---------------------------- POST INFO -----------------------------*/
  722.  
  723. .postinfo{
  724. margin-top:10px;
  725. text-align:center;
  726. font-weight:bold;
  727. font-size:8.5px;
  728. padding-top:10px;
  729. text-transform:uppercase;
  730. letter-spacing:1px;
  731. }
  732.  
  733. .tags {
  734. margin-top:5px;
  735. background:{color:posts};
  736. padding:5px;
  737. border-top: 1px solid {color:accent};
  738. font-weight:normal;
  739. -webkit-transition: all 1s;
  740. -moz-transition: all 1s;
  741. -o-transition: all 1s;
  742. -ms-transition: all 1s;
  743. transition: all 1s;
  744. }
  745.  
  746. .tags:hover{
  747. letter-spacing:1px;
  748. -webkit-transition: all 1s;
  749. -moz-transition: all 1s;
  750. -o-transition: all 1s;
  751. -ms-transition: all 1s;
  752. transition: all 1s;
  753. }
  754.  
  755.  
  756. /* ---------------------------- POST NOTES ------------------------- */
  757.  
  758. ol.notes {
  759. display:block;
  760. text-align:left;
  761. list-style-type:none;
  762. margin-left:-40px;
  763. }
  764.  
  765. ol.notes li.note{
  766. margin-bottom:5px;
  767. }
  768.  
  769. .pagenotes {
  770. text-align:left;
  771. margin-top:15px;
  772. }
  773.  
  774. .pagenotes img{
  775. padding-right:5px;
  776. padding-top:5px;
  777. margin-bottom:-5px;
  778. }
  779.  
  780.  
  781. /* -------------------------- POST TYPES -------------------------- */
  782.  
  783. /* CHAT */
  784.  
  785. .odd, .even {padding:5px;
  786. font-size:8px;
  787. padding:5px;
  788. background-color:{color:container};
  789. }
  790. .odd {background-color:{color:accent};color:{color:container};font-size:8px;
  791. text-shadow: 2px 2px 5px {color:accent};
  792. padding:5px;
  793. }
  794. ul.chat{
  795. list-style:none;
  796. margin-left:-40px;
  797. }
  798.  
  799. .chat span {
  800. float: left;
  801. }
  802. /* QUOTES */
  803.  
  804. .quote{
  805. font-size:15px;
  806. padding:20px;
  807. line-height:150%;
  808. text-transform:uppercase;
  809. text-align:center;
  810. text-shadow: 0px 0px 4px {color:text shadows};
  811. color:{color:accent};
  812. font-family: 'montserrat', sans serif;
  813. }
  814.  
  815. .quotesource{
  816. text-align:center;
  817. font-size:13px;
  818. padding:20px;
  819. opacity:0.7;
  820. border-top: 1px solid {color:accent};
  821. width:200px;
  822. margin:auto;
  823. font-family: 'montserrat', sans serif;
  824. text-transform:lowercase;
  825. }
  826.  
  827.  
  828.  
  829. /* QUESTIONS */
  830.  
  831. .question{
  832. margin-bottom:15px;
  833. padding:10px;
  834. }
  835.  
  836. .answer {
  837. font-size:11px;
  838. }
  839.  
  840. .askerimg{
  841. position:relative;
  842. display:inline-block;
  843.  
  844. margin-right:10px;
  845. }
  846.  
  847. /* AUDIO */
  848.  
  849. .playerbuttonbg {
  850. position: absolute;
  851. left: 20px;
  852. top: 20px;
  853. width: 19px;
  854. height: 19px;
  855. background-color: {color:posts};
  856. padding: 10px;
  857. -webkit-border-radius: 40px;
  858. -moz-border-radius: 40px;
  859. border-radius: 40px;
  860. opacity: .4;
  861. filter: alpha(opacity=40);
  862. -moz-opacity: 0.4;
  863. -khtml-opacity: 0.4;
  864. transition: opacity .7s ease-in-out;
  865. -moz-transition: opacity .7s ease-in-out;
  866. -webkit-transition: opacity .7s ease-in-out;
  867. }
  868.  
  869. .playerbuttonbg:hover {
  870. opacity: 1;
  871. filter: alpha(opacity=100);
  872. -moz-opacity: 1;
  873. -khtml-opacity: 1;
  874. }
  875.  
  876. .newplayerbutton {
  877. position: relative;
  878. width: 19px;
  879. height: 19px;
  880. overflow: hidden;
  881. }
  882.  
  883. .playerbuttonhug {
  884. position: absolute;
  885. top: -18px;
  886. left: -7px;
  887. }
  888.  
  889. .tumblr_audio_player {
  890. height: 90px;
  891. width: 270px;
  892. -moz-transform: scale(0.60, 0.60);
  893. -webkit-transform: scale(0.60, 0.60);
  894. -o-transform: scale(0.60, 0.60);
  895. -ms-transform: scale(0.60, 0.60);
  896. transform: scale(0.60, 0.60);
  897. -moz-transform-origin: top left;
  898. -webkit-transform-origin: top left;
  899. -o-transform-origin: top left;
  900. -ms-transform-origin: top left;
  901. transform-origin: top left;
  902. }
  903.  
  904. .audioimgwrapper {
  905. position: absolute;
  906. left: 0px;
  907. top: 0px;
  908. -webkit-border-radius: 40px;
  909. -moz-border-radius: 40px;
  910. border-radius: 40px;
  911. overflow: hidden;
  912. width: 79px;
  913. height: 79px;
  914. }
  915.  
  916. .audioimgwrapper img {
  917. width: 100%;
  918. height: auto;
  919. -webkit-border-radius: 40px;
  920. -moz-border-radius: 40px;
  921. border-radius: 40px;
  922. }
  923.  
  924. .trackdetails {
  925. width: auto;
  926. height:auto;
  927. margin-top:8px;
  928. background:{color:descbox};
  929. display:inline-block;
  930. margin-left: 90px;
  931. padding:10px;
  932. margin-bottom:17px;
  933. }
  934.  
  935. .audiowrapper {
  936. position: relative;
  937. display:inline-block;
  938. }
  939.  
  940. /* ------------------------- PAGINATION ------------------------- */
  941.  
  942. .pagination{
  943. text-align:center;
  944. }
  945.  
  946. .pagibutton{
  947. position:relative;
  948. text-align:center;
  949. display:inline-block;
  950. color:{color:accent};
  951. padding:10px;
  952. }
  953.  
  954. #activity{
  955. width:50px;
  956. height:20px;
  957. overflow:hidden;
  958. -webkit-transition: all .7s;
  959. -moz-transition: all .7s;
  960. -o-transition: all .7s;
  961. -ms-transition: all .7s;
  962. transition: all .7s;
  963. }
  964.  
  965. #activity:hover{
  966. width:300px;
  967. overflow:hidden;
  968. -webkit-transition: all .7s;
  969. -moz-transition: all .7s;
  970. -o-transition: all .7s;
  971. -ms-transition: all .7s;
  972. transition: all .7s;
  973. }
  974.  
  975. #yo {
  976. color: {color:accent};
  977. font-size:7.5px;
  978. float:right;
  979. right:0;
  980. bottom:0;
  981. margin-right:10px;
  982. margin-bottom:10px;
  983. padding:10px;
  984. position:fixed;
  985. background-color:transparent;
  986. font-weight:bold;
  987. text-align:center;
  988.  
  989. }
  990.  
  991.  
  992. #bigcon{
  993. width:520px;
  994. margin-left:auto;
  995. margin-right:auto;
  996. }
  997.  
  998. /* --------------------------- Custom CSS -------------------------- */
  999. {CustomCSS}
  1000. </style>
  1001. </head>
  1002. <body>
  1003.  
  1004. <div id="bigcon">
  1005.  
  1006.  
  1007.  
  1008. <div style="margin-top:-40px;">
  1009.  
  1010. <div id="sideright">
  1011. <a href="/"style="line-height:30px;padding-bottom:7px;border-bottom:solid 1px {color:accent};">{title}</a>
  1012.  
  1013. <div id="descbox">
  1014. {description}
  1015.  
  1016. </div>
  1017.  
  1018. <div style="margin-top:20px;padding-bottom:7px;border-bottom:solid 1px {color:accent};text-align:justify;margin-left:5px;"><b>drafts:</b><div style="display:inline-block; text-align:right;float:right;">{text:draft count}</div></div>
  1019. <div style="margin-top:10px;padding-bottom:7px;border-bottom:solid 1px {color:accent};text-align:justify;margin-left:5px;"><b>memes:</b><div style="display:inline-block; text-align:right;float:right;">{text:meme count}</div></div>
  1020.  
  1021.  
  1022. </div>
  1023.  
  1024. {block:If400pxPosts}
  1025.  
  1026. <div id="cornerpic"><img style="position:fixed;margin-left:530px;margin-top:450px;"src="{image:corner sidebar}"/></div>
  1027.  
  1028. {/block:If400pxPosts}
  1029.  
  1030. {block:IfNot400pxPosts} <div id="cornerpic"><img style="position:fixed;margin-left:430px;margin-top:450px;"src="{image:corner sidebar}"/></div>{/block:IfNot400pxPosts}
  1031.  
  1032.  
  1033. <div style="margin-top:-47px; position:fixed;z-index:99">
  1034. <div id="sidebaricons" style="line-height:119px;"><img src="{image:sidebar icon 1}"/><br><img src="{image:sidebar icon 2}"/><br><img src="{image:sidebar icon 3}"/><br><img src="{image:sidebar icon 4}"/><br></div>
  1035.  
  1036.  
  1037.  
  1038.  
  1039.  
  1040.  
  1041.  
  1042.  
  1043. <div id="headerlinks">
  1044. <div class="tabs">
  1045. <ul class="tab-links" style="margin-top:2px;">
  1046. <li class="active" style="margin-left:-40px">
  1047. <a href="/"><i style="border-right:1px solid {color:posts}; padding-right:10px;"class="fa fa-home fa-1x" style="color:{color:accent};"></i></a></li>
  1048. <li><a href="{text:envelope icon link}"style="margin-left:-5px;"><i style="border-right:1px solid {color:posts}; padding-right:10px;"class="fa fa-envelope fa-1x" style="color:{color:accent};"></i></a></li>
  1049. <li><a href="#?w=300" rel="box1" class="poplight"><i style="border-right:1px solid {color:posts}; padding-right:10px;"class="fa fa-bolt fa-1x" style="color:{color:accent};"></i></a></li>
  1050. <li><a href="{text:ppl icon link}"><i class="fa fa-group fa-1x" style="color:{color:accent};"></i></a></li>
  1051. </ul>
  1052. </div>
  1053. </div>
  1054.  
  1055.  
  1056.  
  1057. </div>
  1058.  
  1059.  
  1060.  
  1061.  
  1062.  
  1063.  
  1064.  
  1065.  
  1066.  
  1067. <div id="contbg">
  1068. </div>
  1069.  
  1070. <div class="tabs">
  1071.  
  1072.  
  1073. <!-- --------------------------- TAB 1 -------------------------- -->
  1074.  
  1075. <div class="tab-content">
  1076. <div id="tab1" class="tab active">
  1077.  
  1078. <div id="postcontainer">
  1079.  
  1080. {block:Posts}
  1081. <article>
  1082.  
  1083.  
  1084.  
  1085. <!--TEXT POST-->
  1086. {block:Text}
  1087. {block:Title}
  1088. <h1 class="title" style="text-align:center;font-size:24px;line-height:100%;border-bottom:1px solid {color:accent};padding-bottom:15px;width:auto;margin:auto;">
  1089. <a href="{Permalink}">{Title}</a></h1>
  1090. {/block:Title}
  1091. {Body}
  1092. {/block:Text}
  1093.  
  1094.  
  1095. <!--PHOTO POST-->
  1096. {block:Photo}
  1097. {block:IndexPage}
  1098. {LinkOpenTag}
  1099. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1100. {LinkCloseTag}
  1101. {/block:IndexPage}
  1102. {block:PermalinkPage}
  1103. {LinkOpenTag}
  1104. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1105. {LinkCloseTag}{/block:PermalinkPage}
  1106. {/block:Photo}
  1107.  
  1108.  
  1109. <!--PHOTOSET POST-->
  1110. {block:Photoset}
  1111. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  1112. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  1113. {/block:Photoset}
  1114.  
  1115.  
  1116. <!--QUOTE POST-->
  1117. {block:Quote}
  1118. <div class="quote">{Quote}</div>
  1119. {block:Source}
  1120. <div class="quotesource">{Source}</div>
  1121. {/block:Source}
  1122. {/block:Quote}
  1123.  
  1124.  
  1125. <!--LINK POST-->
  1126. {block:Link}
  1127. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  1128. {block:Description}{Description}{/block:Description}
  1129. {/block:Link}
  1130.  
  1131.  
  1132. <!--CHAT POST-->
  1133. {block:Chat}
  1134.  
  1135. {block:Title}
  1136. <h1 class="title" style="text-align:center;font-size:24px;line-height:100%;border-bottom:1px solid {color:accent};padding-bottom:15px;width:330px;margin:auto;">
  1137. <a href="{Permalink}">{Title}</a></h1>
  1138. {/block:Title}
  1139.  
  1140. <ul class="chat">
  1141. {block:Lines}<li class="{Alt}">{block:Label}<span class="label" style="text-transform:uppercase; font-weight:bold; ">{Label}</span>{/block:Label}<div style="text-transform:uppercase;">&nbsp;{Line}</div></li>{/block:Lines}
  1142. </ul>
  1143. {/block:Chat}
  1144.  
  1145.  
  1146. <!--AUDIO POST-->
  1147. {block:AudioPlayer}
  1148. <div class="audiowrapper">
  1149. {block:AlbumArt}
  1150. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1151. {/block:AlbumArt}
  1152.  
  1153. <div class="playerbuttonbg">
  1154. <div class="newplayerbutton">
  1155. <div class="playerbuttonhug">
  1156.  
  1157. {AudioPlayerWhite}
  1158.  
  1159. </div>
  1160. </div>
  1161. </div>
  1162.  
  1163. <div class="trackdetails">
  1164.  
  1165. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  1166. {block:Artist}<b><i>artist:</i></b> {Artist}{/block:Artist}<br/>
  1167. {block:Album}<i><b>album:</i></b {Album}{/block:Album}<br/>
  1168. {PlayCountWithLabel}
  1169.  
  1170. </div>
  1171. </div>
  1172. {/block:AudioPlayer}
  1173.  
  1174. {block:Caption}{/block:Caption}
  1175.  
  1176.  
  1177. <!--VIDEO POST-->
  1178. {block:Video}
  1179. <div class="video">
  1180. <div class="video-player">{Video}</div>
  1181. {/block:Video}
  1182.  
  1183.  
  1184. <!--ANSWER POST-->
  1185. {block:Answer}
  1186. <div class="askerimg"><img src="{AskerPortraitURL-40}" style="border-radius:50px;margin-left:10px;"></div>
  1187. <div style="padding:10px; background:{color:descbox}; width:auto; height:auto;margin-left:60px;margin-top:-43px; margin-bottom:30px;text-transform:uppercase;">
  1188. <div style="padding-bottom:10px;border-bottom:solid 1px {color:accent}; text-align:center; font-size:16px;"><b>{Asker} whispered </b></span></div><br>
  1189. <span class="question"style="text-transform:none">❛ {Question} ❜</span></div>
  1190. <p><div class="answer">{Answer}</div>
  1191. {/block:Answer}
  1192.  
  1193. <!--CAPTIONS-->
  1194. {block:Caption}
  1195. {Caption}
  1196. {/block:Caption}
  1197.  
  1198. <!--POST INFORMATION-->
  1199. <div class="postinfo">
  1200.  
  1201. <!--PERMALINK-->
  1202. <a href="{Permalink}">
  1203. {block:Date}
  1204. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {12Hour}:{Minutes} {AmPm}
  1205. {/block:Date}
  1206. </a>
  1207.  
  1208. <!--NOTES-->
  1209. {block:NoteCount}
  1210. <a href="{Permalink}"> + {NoteCount} </a>
  1211. {/block:NoteCount}
  1212.  
  1213. <!--VIA AND SOURCE-->
  1214. {block:RebloggedFrom}
  1215. ( <a href="{ReblogParentURL}">Via</a>
  1216. {/block:RebloggedFrom}
  1217. {block:ContentSource}
  1218. & <a href="{SourceURL}">Source</a>
  1219. {/block:ContentSource}
  1220. {block:RebloggedFrom} ){/block:RebloggedFrom} & <a href="{ReblogURL}" target="_blank" class="details">Reblog</a>
  1221.  
  1222. <!--TAGS-->
  1223. {block:HasTags}
  1224. <div class="tags">
  1225. <b style="color:{color:accent};font-size:10px;text-transform:uppercase;">tagged as:</b>
  1226. {block:Tags}
  1227. <a href="{TagURL}">#{Tag},</a>
  1228. {/block:Tags}
  1229. </div>
  1230. {/block:HasTags}
  1231.  
  1232. </div>
  1233.  
  1234. <!--POST NOTES-->
  1235. {block:PostNotes}
  1236. <div class="pagenotes">{PostNotes-16}</div>
  1237. {/block:PostNotes}
  1238.  
  1239.  
  1240.  
  1241.  
  1242. </article>
  1243. {/block:Posts}
  1244.  
  1245. <!--PAGINATION-->
  1246. {block:Pagination}
  1247. <div class="pagination" style="width:100%;font-size:24px;">
  1248. {block:PreviousPage}
  1249. <a href="{PreviousPage}">
  1250. <div class="pagibutton"><b style="font-family:'montserrat',sans serif;color:{color:accent}">-</b></div></a> {/block:PreviousPage}{block:NextPage} <a href="{NextPage}"><div class="pagibutton"><b style="font-family:'montserrat',sans serif;color:{color:accent}">+</b></div></a>{/block:NextPage}
  1251. </div>
  1252. {/block:Pagination}
  1253.  
  1254.  
  1255.  
  1256.  
  1257.  
  1258. </div>
  1259.  
  1260. </div>
  1261. </div>
  1262.  
  1263.  
  1264. <div id="yo">
  1265.  
  1266. <a title="by bec" href="http://destinatiia.tumblr.com/"target="_blank"> <i class="fa fa-moon-o fa-4x" style="color:{color:accent}"></i> </a>
  1267. </div>
  1268. </body>
  1269.  
  1270. <!-- this is where the popup starts ! -->
  1271.  
  1272. <div id="box1" class="popup_block">
  1273.  
  1274.  
  1275.  
  1276. <div style="margin-top:10px;">
  1277. <div id="activity" style="font-size: 9px; text-transform: uppercase; text-align: left;margin-left:20px;">
  1278.  
  1279. *title !
  1280.  
  1281. <i class="fa fa-angle-right fa-1x"></i>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  1282.  
  1283. brief *info !
  1284.  
  1285. </div>
  1286.  
  1287. <div id="activity" style="font-size: 9px; text-transform: uppercase; text-align: right;float:right;margin-top:-20px;margin-right:20px">
  1288.  
  1289. <i class="fa fa-angle-left fa-1x"></i>
  1290.  
  1291. *title !
  1292.  
  1293. </div>
  1294. <div style="word-spacing: 10px; margin-top: 10px; text-align: left; margin-left: 20px;">
  1295.  
  1296.  
  1297. {block:IfRoundBorders}<img src="{image:mun pic}" style="border-radius:100px;width: 60px;" />&nbsp;<img src="{image:mun pic 2}" style="border-radius:100px;width: 60px;" />{/block:IfRoundBorders}
  1298.  
  1299. {block:IfNotRoundBorders}<img src="{image:mun pic}" style="width: 60px;" />&nbsp;<img src="{image:mun pic 2}" style="width: 60px;" />{/block:IfNotRoundBorders}
  1300.  
  1301.  
  1302.  
  1303. </div>
  1304. <p>
  1305.  
  1306. <img src="{image:mun pic 3}" style="margin-left: 170px; margin-top: -75px;" /></p>
  1307. <div style="margin-left: 20px; height: 102px; margin-top: -140px; padding: 10px; width: 114px; overflow:auto; background-color: {color:posts};">
  1308.  
  1309. edit this via html <b><i>!</i></b>. <br> the icons are 70px, and the larger pic is 112x197.
  1310.  
  1311.  
  1312. </div>
  1313.  
  1314. <div style="padding:5px; width:auto;margin-top:10px;margin-left:20px;margin-right:20px; text-align:left;font-size:7px; text-transform:uppercase; border-bottom:{color:posts} 1px solid;"><div style="width:200px;">
  1315.  
  1316. some lil text here !
  1317.  
  1318.  
  1319.  
  1320. </div><div style="margin-top:-17px;text-align:right;">
  1321.  
  1322.  
  1323. <!--- here you edit the *links ! -->
  1324.  
  1325.  
  1326. <a href="A LINK HERE !"><i class="fa fa-asterisk" aria-hidden="true"></i></a>&nbsp;
  1327. <a href="A LINK HERE !"><i class="fa fa-refresh" aria-hidden="true"></i></a>&nbsp;
  1328. <a href="A LINK HERE !"><i class="fa fa-heart" aria-hidden="true"></i></a>&nbsp;
  1329. <a href="A LINK HERE !"><i class="fa fa-comment" aria-hidden="true"></i></a>
  1330.  
  1331.  
  1332. </div></div></div>
  1333.  
  1334.  
  1335. </div>
  1336.  
  1337. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement