Advertisement
destinatia

THEME 004: ✧ * º • ☾ ALEXIA ❜ — destinatiia

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