API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Feb 24th, 2018
129
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 103.88 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!---------------- HEY! LISTEN --------------*/
  4.  
  5.  
  6. ╰ ° JJONG THEME BY JCNNIE *°
  7.  
  8. - you can edit it to your heart's content but
  9. keep the credit please! plagiarism ain't cool.
  10. - do not take any part of this theme
  11. and claim it as your own.
  12. - do not lift any section of coding and use it
  13. elsewhere.
  14.  
  15.  
  16. base code: neonbike themes
  17. chat post code: animalites
  18.  
  19.  
  20. /*--------------------------------------------->
  21.  
  22. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  23. <head><title>{Title}</title>
  24. <link rel="shortcut icon" href="{Favicon}">
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  26. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  27.  
  28. <meta name="color:background" content="#d6d6d6"/>
  29. <meta name="color:body color" content="#d6d6d6"/>
  30. <meta name="color:accent" content="#bbb" />
  31. <meta name="color:entries bg" content="#ececec" />
  32. <meta name="color:sidebar bg" content="#f8f8f8" />
  33. <meta name="color:posts bg" content="#fff" />
  34. <meta name="color:text" content="#000"/>
  35. <meta name="color:navi" content="#fff"/>
  36. <meta name="color:title" content="#000" />
  37. <meta name="color:link" content="#000"/>
  38. <meta name="color:linkhover" content="#777"/>
  39. <meta name="color:bold" content="#777" />
  40. <meta name="color:italic" content="#777" />
  41. <meta name="color:underline" content="#777" />
  42. <meta name="color:icon border" content="#fff" />
  43.  
  44. <meta name="text:title" content="sidebar title"/>
  45. <meta name="text:desc title" content="sidebar hover title"/>
  46. <meta name="text:title font size" content="75px"/>
  47. <meta name="text:hover title font size" content="24px"/>
  48. <meta name="text:title bottom padding" content="30px"/>
  49.  
  50. <meta name="text:username" content="put your username/url here so the askbox can work (ex. jcnnie)"/>
  51. <meta name="text:askbox title" content="ask me anything."/>
  52. <meta name="text:tab quote" content="put your tab quote here!"/>
  53. <meta name="text:counter" content="statistics here"/>
  54. <meta name="text:tab 1 title" content="home"/>
  55. <meta name="text:tab 2 title" content="message"/>
  56. <meta name="text:tab 3 title" content="navigate"/>
  57. <meta name="text:tab 4 title" content="network"/>
  58. <meta name="text:link 1 title" content="link one"/>
  59. <meta name="text:link 1 url" content="/"/>
  60. <meta name="text:link 2 title" content="link two"/>
  61. <meta name="text:link 2 url" content="/"/>
  62. <meta name="text:link 3 title" content="link three"/>
  63. <meta name="text:link 3 url" content="/"/>
  64. <meta name="text:link 4 title" content="link four"/>
  65. <meta name="text:link 4 url" content="/"/>
  66. <meta name="text:link 5 title" content="link five"/>
  67. <meta name="text:link 5 url" content="/"/>
  68. <meta name="text:link 6 title" content="link six"/>
  69. <meta name="text:link 6 url" content="/"/>
  70. <meta name="text:link 7 title" content="link seven"/>
  71. <meta name="text:link 7 url" content="/"/>
  72. <meta name="text:link 8 title" content="link eight"/>
  73. <meta name="text:link 8 url" content="/"/>
  74. <meta name="text:link 9 title" content="link nine"/>
  75. <meta name="text:link 9 url" content="/"/>
  76.  
  77.  
  78. <meta name="select:title font" content="glowies" title="red velvet"/>
  79. <meta name="select:title font" content="glowies2" title="master works"/>
  80. <meta name="select:title font" content="glowies4" title="magnite"/>
  81. <meta name="select:title font" content="glowies5" title="black diamond"/>
  82. <meta name="select:title font" content="glowies6" title="golden plains"/>
  83. <meta name="select:title font" content="glowies7" title="asphalts display"/>
  84. <meta name="select:title font" content="glowies8" title="aveline script"/>
  85.  
  86.  
  87. <meta name="select:sidebar title lineheight" content="100%" title="100%"/>
  88. <meta name="select:sidebar title lineheight" content="90%" title="90%"/>
  89. <meta name="select:sidebar title lineheight" content="75%" title="75%"/>
  90. <meta name="select:sidebar title lineheight" content="50%" title="50%"/>
  91. <meta name="select:sidebar title lineheight" content="35%" title="35%"/>
  92.  
  93. <meta name="image:background" content=""/>
  94. <meta name="image:sidebar bg" content=""/>
  95. <meta name="image:tiny icon" content=""/>
  96. <meta name="image:tab icon" content=""/>
  97. <meta name="image:tab icon2" content=""/>
  98. <meta name="image:tab icon3" content=""/>
  99. <meta name="image:tab icon4" content=""/>
  100.  
  101. <meta name="if:greyscale" content="1"/>
  102. <meta name="if:400px" content="1"/>
  103. <meta name="if:FullBG" content="1"/>
  104. <meta name="if:DarkTumblrCtrls" content="0"/>
  105. <meta name="text:text size" content="9px" />
  106.  
  107.  
  108.  
  109. <!--- SCRIPTS AND STUFF --->
  110.  
  111.  
  112. <script type="text/javascript" src="http://static.tumblr.com/86jccts/wpsmuemne/hoverqtip.js"></script><link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  113. <link href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
  114. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  115. <link rel="stylesheet" href="http://static.tumblr.com/i5s2zks/6kOohwlux/pe-icon-7-stroke.css">
  116. <link href="https://github.com/IanLunn/Hover.git" rel="stylesheet" media="all">
  117. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  118. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  119.  
  120. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  121.  
  122. <script>
  123. $(document).ready(function() {
  124. $('.tabs .tab-links a').on('click', function(e) {
  125. var currentAttrValue = $(this).attr('href');
  126.  
  127. // Show/Hide Tabs
  128. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  129.  
  130. // Change/remove current tab to active
  131. $(this).parent('li').addClass('active').siblings().removeClass('active');
  132.  
  133. e.preventDefault();
  134. });
  135. });
  136. </script>
  137.  
  138.  
  139. <script>
  140. $(document).ready(function() {
  141. $('#filterOptions li a').click(function() {
  142. // fetch the class of the clicked item
  143. var ourClass = $(this).attr('class');
  144.  
  145. // reset the active class on all the buttons
  146. $('#filterOptions li').removeClass('active');
  147. // update the active state on our clicked button
  148. $(this).parent().addClass('active');
  149.  
  150. if(ourClass == 'all') {
  151. // show all our items
  152. $('#ourHolder').children('div.item').show();
  153. }
  154. else {
  155. // hide all elements that don't share ourClass
  156. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  157. // show all elements that do share ourClass
  158. $('#ourHolder').children('div.' + ourClass).show();
  159. }
  160. return false;
  161. });
  162. });
  163. </script>
  164.  
  165. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  166.  
  167. <script>
  168. $(document).ready(function() {
  169. $('.tabs .tab-links a').on('click', function(e) {
  170. var currentAttrValue = $(this).attr('href');
  171.  
  172. // Show/Hide Tabs
  173. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  174.  
  175. // Change/remove current tab to active
  176. $(this).parent('li').addClass('active').siblings().removeClass('active');
  177.  
  178. e.preventDefault();
  179. });
  180. });
  181. </script>
  182.  
  183. <script>
  184. $(document).ready(function() {
  185. $('#filterOptions li a').click(function() {
  186. // fetch the class of the clicked item
  187. var ourClass = $(this).attr('class');
  188.  
  189. // reset the active class on all the buttons
  190. $('#filterOptions li').removeClass('active');
  191. // update the active state on our clicked button
  192. $(this).parent().addClass('active');
  193.  
  194. if(ourClass == 'all') {
  195. // show all our items
  196. $('#ourHolder').children('div.item').show();
  197. }
  198. else {
  199. // hide all elements that don't share ourClass
  200. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  201. // show all elements that do share ourClass
  202. $('#ourHolder').children('div.' + ourClass).show();
  203. }
  204. return false;
  205. });
  206. });
  207. </script>
  208.  
  209.  
  210. <script type="text/javascript">
  211. jQuery(document).ready(function() {
  212. jQuery(".sub").hide();
  213. //toggle the component with class msg_body
  214. jQuery(".cthrough").click(function()
  215. {
  216. jQuery(this).next(".sub").slideToggle(500);
  217. });});
  218. </script>
  219.  
  220. <script>
  221. var element_to_scroll_to = document.getElementById('bodystuf');
  222. // Or:
  223. var element_to_scroll_to = document.querySelectorAll('.cont')[0];
  224. // Or:
  225. var element_to_scroll_to = $('.cont')[0];
  226. // Basically `element_to_scroll_to` just have to be a reference
  227. // to any DOM element present on the page
  228. // Then:
  229. element_to_scroll_to.scrollIntoView();
  230. </script>
  231.  
  232.  
  233.  
  234.  
  235.  
  236.  
  237. <!--- END OF SCRIPTS AND STUFF --->
  238.  
  239.  
  240.  
  241.  
  242.  
  243.  
  244.  
  245. <style type="text/css">
  246. *, body, a, a:hover {cursor: url(http://virtualcustoms.net/images/styles/Twisted_Underground_Blue/site_icons/xhomepage.png.pagespeed.ic.clZcN2PtQs.png), auto;}
  247.  
  248.  
  249. /* ╰ ° EXTRAS N STUFF *° */
  250.  
  251. ::-webkit-scrollbar-thumb:vertical {
  252. height:10px;
  253. border:0px solid {color:icon border};
  254. background-color:{color:icon border};
  255. -webkit-border-fill-color: transparent;
  256. }
  257.  
  258. ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar:horizontal {
  259. display:none;
  260. }
  261.  
  262. ::-webkit-scrollbar {
  263. width:1px;
  264. height:5px;
  265. border:2px solid transparent;
  266. background:transparent;
  267. display:none;
  268. -webkit-border-fill-color: transparent;
  269. }
  270.  
  271. ::-moz-selection {
  272. color:{color:posts bg};
  273. background-color:{color:accent};
  274. }
  275.  
  276. ::selection {
  277. color:{color:posts bg};
  278. background-color:{color:accent};
  279. }
  280.  
  281. @font-face{
  282. font-family:"glowies";
  283. src: url('https://dl.dropboxusercontent.com/s/6tx09u1t0mlusc9/rv.ttf');
  284. }
  285.  
  286. @font-face{
  287. font-family:"glowies2";
  288. src: url('https://dl.dropboxusercontent.com/s/u83k0f7prbvdo5t/mw.ttf');
  289. }
  290.  
  291. @font-face{
  292. font-family:"glowies3";
  293. src: url('https://dl.dropboxusercontent.com/s/108jph3jeqb1zlb/ax.otf');
  294. }
  295. @font-face{
  296. font-family:"glowies4";
  297. src: url('https://dl.dropboxusercontent.com/s/6h4ii5o3k4eta9o/mag.otf');
  298. }
  299.  
  300. @font-face{
  301. font-family:"glowies5";
  302. src: url('https://dl.dropboxusercontent.com/s/lb15atxhf83o0cv/bd.ttf');
  303. }
  304.  
  305. @font-face{
  306. font-family:"glowies6";
  307. src: url('https://dl.dropboxusercontent.com/s/nyyhlsleu0e3o50/gp.ttf');
  308. }
  309.  
  310. @font-face{
  311. font-family:"glowies7";
  312. src: url('https://dl.dropboxusercontent.com/s/tdygxsq1vvrb7ay/ad.otf');
  313. }
  314. @font-face{
  315. font-family:"glowies8";
  316. src: url('https://dl.dropboxusercontent.com/s/bk5emg0gbfsiexh/aveline.ttf');
  317. }
  318.  
  319. @font-face{
  320. font-family:"icony";
  321. src: url('https://dl.dropboxusercontent.com/s/a7bri7ihdzf1r5h/icony.ttf');
  322. }
  323.  
  324.  
  325.  
  326.  
  327. #tumblr_controls, .tmblr-iframe{ z-index:99999999999999999999999!important;
  328. {block:IfDarkTumblrCtrls}-webkit-filter:invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%);{/block:IfDarkTumblrCtrls} position:fixed!important; top:0px!important; right:0px!important; -webkit-transform: scale(0.8);transform: scale(0.8); opacity:.5; -webkit-transition:all 0.6s ease-out;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out}
  329.  
  330. #tumblr_controls, .tmblr-iframe:hover { -webkit-transform: scale(0.8);transform: scale(0.8); opacity:.8;webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out; -webkit-transition:all 0.6s ease-out;{block:IfDarkTumblrCtrls}-webkit-filter:invert(80%); -moz-filter:invert(80%); -o-filter:invert(80%); -ms-filter:invert(80%); filter:invert(80%);{/block:IfDarkTumblrCtrls} }
  331.  
  332. div#qTip {
  333. padding: 2px 5px 2px 5px;
  334. display: none;
  335. margin-left:10px;
  336. margin-top:-37px;
  337. background:{color:posts bg};
  338. opacity:0.8;
  339. font-weight:700;
  340. position: absolute;
  341. border-radius:10px;
  342. text-transform:uppercase;
  343. font-size:7px;
  344. z-index:99999999999999;
  345. color: {color:text};
  346. letter-spacing: 1px;
  347. }
  348.  
  349.  
  350. /* ╰ ° HOVER EFFECTS AND FONT ICONS *° */
  351.  
  352. /* Grow Rotate */
  353. .hvr-grow-rotate {display: inline-block;vertical-align: middle;-webkit-transform: translateZ(0);transform: translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility: hidden;backface-visibility: hidden;-moz-osx-font-smoothing: grayscale;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-property: transform;transition-property: transform;}
  354. .hvr-grow-rotate:hover, .hvr-grow-rotate:focus, .hvr-grow-rotate:active {
  355. -webkit-transform: scale(1.1) rotate(4deg);transform: scale(1.1) rotate(4deg);}
  356.  
  357.  
  358. /* Push */
  359. @-webkit-keyframes hvr-push {
  360. 50% {-webkit-transform: scale(0.8);transform: scale(0.8);}100% {-webkit-transform: scale(1);transform: scale(1);}}
  361. @keyframes hvr-push {50% {-webkit-transform: scale(0.8);transform: scale(0.8);}100% {-webkit-transform: scale(1);transform: scale(1);}}
  362. .hvr-push {display: inline-block;vertical-align: middle;-webkit-transform: translateZ(0);transform: translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility: hidden;backface-visibility: hidden;-moz-osx-font-smoothing: grayscale;}
  363. .hvr-push:hover, .hvr-push:focus, .hvr-push:active {-webkit-animation-name: hvr-push;animation-name: hvr-push;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-timing-function: linear;animation-timing-function: linear;-webkit-animation-iteration-count: 1;animation-iteration-count: 1;
  364. }
  365.  
  366.  
  367. /* Effect 13: three circles */
  368. .cl-effect-13 a {
  369. -webkit-transition: color 0.3s;
  370. -moz-transition: color 0.3s;
  371. transition: color 0.3s;
  372. }
  373.  
  374. .cl-effect-13 a::before {
  375. position: absolute;
  376. top: 90%;
  377. left: 80%;
  378. color: transparent;
  379. content: '•';
  380. text-shadow: 0 0 transparent;
  381. font-size: 1.2em;
  382. -webkit-transition: text-shadow 0.3s, color 0.3s;
  383. -moz-transition: text-shadow 0.3s, color 0.3s;
  384. transition: text-shadow 0.3s, color 0.3s;
  385. -webkit-transform: translateX(-50%);
  386. -moz-transform: translateX(-50%);
  387. transform: translateX(-50%);
  388. pointer-events: none;
  389. }
  390.  
  391. .cl-effect-13 a:hover::before,
  392. .cl-effect-13 a:focus::before {
  393. color: {color:accent};
  394. text-shadow: 7.5px 0 {color:navi}, -7.5px 0 {color:navi};
  395. }
  396.  
  397. .cl-effect-13 a:hover,
  398. .cl-effect-13 a:focus {
  399. color: {color:accent};
  400. }
  401.  
  402.  
  403. .lnr-tag {
  404. color: {color:text};
  405. font-size: 8px;
  406. }
  407. .lnr-leaf {
  408. color: {color:accent};
  409. font-size: 12px;
  410. text-align:center;
  411. display:block;
  412. margin-top:5px;
  413. margin-bottom:15px;
  414. }
  415. .lnr-arrow-right, .lnr-arrow-left {
  416. color: {color:text};
  417. font-size: 10px;
  418. }
  419. .sprout {
  420. color: {color:accent};
  421. font-size: 14px;
  422. font-family:'icony';
  423. text-align:center;
  424. display:block;
  425. text-shadow:none;
  426. font-weight:400;
  427. margin-top:-2px;
  428. margin-bottom:5px;
  429. }
  430.  
  431.  
  432. /* ╰ ° THE ESSENTIALS *° */
  433.  
  434. body {
  435. background-color:{color:background};
  436. background: url('{image:background}') no-repeat center center fixed;
  437. -webkit-background-size: cover;
  438. -moz-background-size: cover;
  439. -o-background-size: cover;
  440. background-size: cover;
  441. line-height:150%;
  442. color:{color:text};
  443. font-family: 'inconsolata', monospace;
  444. font-size: {text:text size};
  445. letter-spacing:0.5px;-webkit-font-smoothing: antialiased;
  446. -moz-osx-font-smoothing: grayscale;
  447. }
  448.  
  449.  
  450.  
  451.  
  452.  
  453. a {
  454. text-decoration:none;
  455. color:{color:link};
  456. -webkit-transition: all 0.5s ease;
  457. -moz-transition: all 0.5s ease;
  458. -o-transition: all 0.5s ease;
  459. }
  460.  
  461. .posts a {
  462. font-family:'glowies3';
  463. text-transform:uppercase;
  464. letter-spacing:1px;
  465. }
  466.  
  467. a:hover {
  468. color:{color:linkhover};
  469. text-shadow:0px 0px 0px rgba(0,0,0,0.5);
  470. -webkit-transition: all 0.5s ease;
  471. -moz-transition: all 0.5s ease;
  472. -o-transition: all 0.5s ease;
  473. }
  474.  
  475. hr {
  476. width: 40%;
  477. margin-left: auto;
  478. margin-right: auto;
  479. margin-top: 20px;
  480. margin-bottom: 20px;
  481. opacity:0.5;
  482. color:{color:text};
  483. }
  484.  
  485. blockquote {
  486. background-color:rgba(255,255,255,0);
  487. padding:0px 6px 0px 12px;
  488. margin:4px 2px 2px 2px;
  489. border-left:1px solid {color:icon border};
  490. }
  491.  
  492. blockquote img {
  493. max-width:100%;
  494. height:auto;
  495. }
  496.  
  497. b, strong {
  498. color:{color:bold};
  499. font-weight:bold;
  500. }
  501.  
  502. i, em {
  503. color:{color:italic};
  504. }
  505.  
  506. i b, em strong, em b, strong i {
  507. color:{color:accent};
  508. }
  509. u, s, strike {
  510. color:{color:underline};
  511. }
  512.  
  513. small,sup,sub {
  514. font-size:{text:Text Size}}
  515.  
  516. big {
  517. font-size:11px;}
  518.  
  519. pre {
  520. border:1px solid {color:sidebar bg};
  521. opacity:0.65;
  522. border-radius:5px;
  523. padding:20px;
  524. white-space: pre-wrap; /* css-3 */
  525. white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
  526. white-space: -pre-wrap; /* Opera 4-6 */
  527. white-space: -o-pre-wrap; /* Opera 7 */
  528. word-wrap: break-word; /* Internet Explorer 5.5+ */}
  529.  
  530. pre b, pre strong{
  531. color:{color:text};
  532. }
  533.  
  534. .entries ul {
  535. padding-left:6px;
  536. margin-left:20px;
  537. margin-right:20px;
  538. }
  539.  
  540. .entries ol {
  541. padding-left:3px;
  542. margin-left:20px;
  543. margin-right:20px;
  544. text-align:justify;
  545. }
  546. .entries li {
  547. padding-left:3px;
  548. margin-left:6px;
  549. text-align:justify;
  550. margin-bottom:10px;
  551. }
  552.  
  553.  
  554.  
  555. /* ╰ ° HEADER STUFF *° */
  556.  
  557.  
  558.  
  559. .headerbar {
  560. background-color:{color:body color};
  561. height:50px;
  562. width:100%;
  563. position:fixed;
  564. top:0px;
  565. left:0px;
  566. z-index:999999;
  567. }
  568.  
  569.  
  570. .headerbar2 {
  571. background-color:{color:body color};
  572. height:50px;
  573. width:100%;
  574. position:fixed;
  575. bottom:0px;
  576. left:0px;
  577. z-index:999999;
  578. }
  579.  
  580. .headerbar3 {
  581. background-color:{color:body color};
  582. height:100%;
  583. width:50px;
  584. position:fixed;
  585. bottom:0px;
  586. left:0px;
  587. z-index:999999;
  588. }
  589.  
  590. .headerbar4 {
  591. background-color:{color:body color};
  592. height:100%;
  593. width:50px;
  594. position:fixed;
  595. bottom:0px;
  596. right:0px;
  597. z-index:999999;
  598. }
  599.  
  600.  
  601.  
  602.  
  603.  
  604.  
  605.  
  606. /* ╰ ° NAVTAB STUFF *° */
  607.  
  608.  
  609.  
  610. .nav {
  611. position:fixed;
  612. position:absolute;
  613. top: 155px;
  614. right: 40px;
  615. height:125px;
  616. width:85px;
  617. {block:If400px}
  618. top: 160px;
  619. right: 35px;
  620. height:170px;
  621. width:185px;
  622. {/block:If400px}
  623. background: none;
  624. text-align:center;
  625. margin:0px;
  626. padding:4px;
  627. border-radius:10px;
  628. background:{color:posts bg};
  629. z-index:999999999;
  630. }
  631.  
  632. .nav a {
  633. width:20px;
  634. height:20px;
  635. font-size:18px;
  636. padding:5px 4px 3px 4px;
  637. margin:7px 3px;
  638. {block:If400px}
  639. width:30px;
  640. height:30px;
  641. font-size:24px;
  642. padding:6px 4px 2px 4px;
  643. margin:9px 7px;
  644. {/block:If400px}
  645. line-height:100%;
  646. vertical-align:middle;
  647. text-align:center;
  648. background:{color:link};
  649. opacity:1.0;
  650. font-weight:800;
  651. border-radius:50%;
  652. text-shadow:none;
  653. display: inline-block;
  654. /* Hack to improve aliasing on mobile/tablet devices */
  655. -webkit-transition: all 0.3s ease;
  656. -moz-transition: all 0.3s ease;
  657. -o-transition: all 0.3s ease;
  658. }
  659.  
  660. .nav i {
  661. color:{color:posts bg};
  662. -webkit-transition: all 0.3s ease;
  663. -moz-transition: all 0.3s ease;
  664. -o-transition: all 0.3s ease;
  665. }
  666.  
  667. .nav a:hover{
  668. background: {color:accent};
  669. }
  670. .nav a:hover i {
  671. color:{color:underline};
  672. }
  673.  
  674. .tabq {
  675. position:absolute;
  676. top:30px;
  677. right:35px;
  678. width:120px;
  679. height:120px;
  680. {block:If400px}
  681. top:20px;
  682. right:35px;
  683. width:190px;
  684. height:125px;
  685. {/block:If400px}
  686. text-align:center;
  687. line-height:65%;
  688. color:{color:italic};
  689. font-size:{text:hover title font size};
  690. font-family:{select:title font};
  691. text-transform:lowercase;
  692. vertical-align: bottom;
  693. z-index:999999999;
  694. }
  695.  
  696. .tabsi {
  697. position:absolute;
  698. top:15px;
  699. left:190px;
  700. width:100px;
  701. height:280px;
  702. text-align:left;
  703. z-index:99999999;
  704. }
  705.  
  706. .tabi {
  707. width:40px;
  708. height:auto;
  709. padding:5px;
  710. margin:8px;
  711. border-radius: 50%;
  712. border:1px solid {color:posts bg};
  713. background-color: {color:entries bg};
  714. }
  715.  
  716. .tabi img {
  717.  
  718. width:auto;
  719. height:auto;
  720. overflow:hidden;
  721. }
  722.  
  723.  
  724. .f {
  725. overflow:auto;
  726. width:140px;
  727. height:260px;
  728. {block:If400px}
  729. height:260px;
  730. {/block:If400px}
  731. }
  732.  
  733. .z {
  734. position:absolute;
  735. top: 10px;
  736. left:30px;
  737. width:150px;
  738. height:245px;
  739. {block:If400px}
  740. width:205px;
  741. height:295px;
  742. {/block:If400px}
  743. overflow:auto;
  744. z-index:9;
  745. letter-spacing:0.5px;
  746. text-align:justify;
  747. text-transform:lowercase;
  748. padding:20px 20px 10px 20px;
  749. border-radius:5px;
  750. border:1px solid {color:posts bg};
  751. }
  752.  
  753. .z p {
  754. margin-bottom:10px;
  755. }
  756. .z xo, .z xx {
  757. font-weight:600;
  758. font-family:'glowies3';
  759. font-size:18px;
  760. padding:6px 4px 2px 4px;
  761. text-transform:uppercase;
  762. }
  763.  
  764. .z xo {
  765. float:right;
  766. text-align:right;
  767. margin-left:3px;
  768. color:{color:italic};
  769. }
  770. .z xx {
  771. float:left;
  772. text-align:left;
  773. margin-right:3px;
  774. padding-left:0px;
  775. color:{color:link};
  776. }
  777.  
  778.  
  779.  
  780. /* MUSES */
  781.  
  782. @font-face{
  783. font-family:"chaennie9";
  784. src: url('https://dl.dropboxusercontent.com/s/kz3iqc070yg0sxs/bj.otf');
  785. }
  786.  
  787.  
  788. /* Bounce In */
  789. .hvr-bounce-in {display: inline-block;vertical-align: middle;-webkit-transform: translateZ(0);transform: translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility: hidden;backface-visibility: hidden;-moz-osx-font-smoothing: grayscale;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;
  790. }
  791. .hvr-bounce-in:hover, .hvr-bounce-in:focus, .hvr-bounce-in:active {-webkit-transform: scale(1.2);transform: scale(1.2);-webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  792. }
  793.  
  794. /* Pop */
  795. @-webkit-keyframes hvr-pop {
  796. 50% {-webkit-transform: scale(1.2);transform: scale(1.2);}}
  797.  
  798. @keyframes hvr-pop {
  799. 50% {-webkit-transform: scale(1.2);transform: scale(1.2);}}
  800.  
  801. .hvr-pop {display: inline-block;vertical-align: middle;-webkit-transform: translateZ(0);transform: translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility: hidden;backface-visibility: hidden;-moz-osx-font-smoothing: grayscale;
  802. }
  803. .hvr-pop:hover, .hvr-pop:focus, .hvr-pop:active {-webkit-animation-name: hvr-pop;animation-name: hvr-pop;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-timing-function: linear;animation-timing-function: linear;-webkit-animation-iteration-count: 1;animation-iteration-count: 1;
  804. }
  805.  
  806. /* ------- tabs base code by alyofrp ------ */
  807.  
  808. .tabz {
  809. margin-top:10px;
  810. margin-left:20px;
  811. padding:3px;
  812. position:fixed;
  813. width:300px;
  814. height:180px;
  815. overflow:auto;
  816.  
  817. }
  818.  
  819. .tabz a {
  820. padding:7px 5px 3px 5px;
  821. width:70px;
  822. height:70px;
  823. margin-bottom:20px;
  824. border-radius:50%;
  825. text-align:center;
  826. background-color:{color:accent}; /* tablinks bg color */
  827. color:white; /* tablinks color */
  828. font-size:16px;
  829. text-decoration:none;
  830. display:inline-block;
  831. margin-left:13px;
  832. box-shadow:inset 0px 0px {color:linkhover}; /* tablinks bg color */
  833. -webkit-transition: all .6s;
  834. -moz-transition: all .6s;
  835. -o-transition: all .6s;
  836. -ms-transition: all .6s;
  837. transition: all .6s;
  838. }
  839.  
  840. .tabz a:hover {
  841. box-shadow:inset 0px -120px {color:navi}; /* tablinks hover bg color */
  842. color:{color:entries bg}; /* tablinks hover color */
  843. -webkit-transition: all .6s;
  844. -moz-transition: all .6s;
  845. -o-transition: all .6s;
  846. -ms-transition: all .6s;
  847. transition: all .6s;
  848. }
  849.  
  850.  
  851.  
  852. .tabz h1 {
  853. width:75%;
  854. margin-left:auto;
  855. margin-right:auto;
  856. padding:1px 4px 0px 4px;
  857. background-color:{color:accent}; /* MUSE NAME BACKGROUND COLOR */
  858. color:white;
  859. -webkit-transform: rotate(-3deg);
  860. transform: rotate(-3deg);
  861. margin-top:-14px;
  862. text-align:center;
  863. z-index:-9999;
  864. font-family:'chaennie9';
  865. text-transform:uppercase;
  866. letter-spacing:1.5px;
  867. font-size:9px;
  868. z-index:9999999;
  869. opacity:0;
  870. -webkit-transition: all .6s;
  871. -moz-transition: all .6s;
  872. -o-transition: all .6s;
  873. -ms-transition: all .6s;
  874. transition: all .6s;
  875. }
  876.  
  877.  
  878. .tabz a:hover h1 {
  879. opacity:1;
  880. }
  881.  
  882. .tabz a:focus h1 {
  883. opacity:1;
  884. background-color:{color:posts bg}; /* MUSE NAME ACTIVE BACKGROUND COLOR */
  885. }
  886.  
  887.  
  888. .tabz a:focus, .tabz a.active {
  889. background-color: {color:accent}; /* tablinks clicked bg color */
  890. color:white; /* tablinks clicked color */
  891. }
  892.  
  893. .tabz img {
  894. border-radius:100%;
  895. margin-top:-2px;
  896. width:70px;
  897. height:70px;
  898. }
  899.  
  900. .tabzcon { /* tablinks content aka the box under the tablinks */
  901. margin-top:200px;
  902. margin-left:935px;
  903. padding:10px;
  904. position:absolute;
  905. width:240px;
  906. height:200px;
  907. background-color:{color:entries bg};
  908. border-radius:5px;
  909. overflow:auto;
  910. border:20px solid {color:body color};
  911. z-index:99999999999999999999999!important;
  912. }
  913.  
  914. #base { /* the box when no tabs are selected */
  915. margin-top:45px;
  916. margin-left:0px;
  917. position:fixed;
  918. padding:10px;
  919. width:205px;
  920. height:250px;
  921. background-color:{color:posts bg};
  922. }
  923.  
  924. .tabzclose { /* the close button, u prob dont need to touch this */
  925. text-transform:uppercase;
  926. font-weight:bold;
  927. font-size:8px;
  928. padding:3px;
  929. color:{color:underline}; /* x button color */
  930. margin-top:-8px;
  931. margin-right:-5px;
  932. float:right;
  933. }
  934.  
  935. .tabzclose:hover {
  936. cursor:pointer;
  937. }
  938.  
  939. /* ------- profile ------ */
  940.  
  941. #profile {
  942. width:300px;
  943. height:190px;
  944. overflow-x:hidden;
  945. }
  946.  
  947. /* ------- images ------ */
  948.  
  949. #lilicons {
  950. width:100px;
  951. height:100px;
  952. display:block;
  953. border-radius:5px;
  954. margin-right:10px;
  955. margin-left:-10px;
  956. margin-top:0px;
  957. position:relative;
  958. }
  959.  
  960. #lilicons img {
  961. border:2px solid {color:accent};
  962. border-radius:5px;
  963. width:80px;
  964. height:80px;
  965. border-radius:5px;
  966. margin-left:15px;
  967. margin-top:10px;
  968. margin-bottom:10px;
  969. }
  970.  
  971. /* ------- desc ------ */
  972.  
  973. #minicon {
  974. width:240px;
  975. height:190px;
  976. margin-top:-90px;
  977. margin-left:5px;
  978. overflow-y:auto;
  979. overflow-x:hidden;
  980. }
  981.  
  982. .ic {
  983. color:white;
  984. margin-right:5px;
  985. font-size:10px;
  986. }
  987.  
  988. /* ------- stats ------ */
  989.  
  990. #statstitle {
  991. background-color:{color:navi}; /* STATS LABEL BACKGROUND COLOR */
  992. padding:5px;
  993. width:120px;
  994. height:10px;
  995. padding:5px;
  996. margin-top:0px;
  997. margin-left:100px;
  998. border-radius:5px 5px 0px 0px;
  999. color:white;
  1000. font-family:'chaennie9';
  1001. text-transform:uppercase;
  1002. letter-spacing:2px;
  1003. }
  1004.  
  1005.  
  1006. #stats {
  1007. width:118px;
  1008. height:90px;
  1009. margin-left:100px;
  1010. padding:5px;
  1011. margin-top:0px;
  1012. background:{color:posts bg}; /* STATS BACKGROUND COLOR */
  1013. font-family:'inconsolata', monospace;
  1014. border-radius:5px;
  1015. border-radius:0px 0px 5px 5px;
  1016. overflow:auto;
  1017. letter-spacing:1px;
  1018. text-transform:uppercase;
  1019. font-size:7.5px;
  1020. text-align:justify;
  1021. }
  1022.  
  1023.  
  1024. /* ------- connections ------ */
  1025.  
  1026. #connectionstitle {
  1027. background-color:{color:accent}; /* CONNECTIONS LABEL BACKGROUND COLOR */
  1028. padding:5px;
  1029. width:120px;
  1030. margin-left:100px;
  1031. height:10px;
  1032. padding:5px;
  1033. margin-top:10px;
  1034. border-radius:5px 5px 0px 0px;
  1035. color:white;
  1036. font-family:'chaennie9';
  1037. text-transform:uppercase;
  1038. letter-spacing:2px;
  1039. }
  1040.  
  1041. #connections {
  1042. width:118px;
  1043. height:100px;
  1044. background:{color:posts bg}; /* STATS BACKGROUND COLOR */
  1045. padding:2px 5px 2px 5px;
  1046. margin-top:0px;
  1047. margin-left:100px;
  1048. border-radius:0px 0px 5px 5px;
  1049. font-family:'inconsolata', monospace;
  1050. overflow:auto;
  1051. letter-spacing:1px;
  1052. text-transform:uppercase;
  1053. font-size:7.5px;
  1054. }
  1055.  
  1056. #connections img {
  1057. border-radius:5px;
  1058. width:50px;
  1059. height:50px;
  1060. }
  1061.  
  1062. #connections b {
  1063. color:white;
  1064. padding:2px;
  1065. margin-right:2px;
  1066. box-shadow: inset 0px -20px {color:navi};
  1067. }
  1068.  
  1069. #connections p {
  1070. border-bottom:1px dashed white;
  1071. padding-bottom:5px;
  1072. }
  1073.  
  1074. z {
  1075. font-size:24px;
  1076. padding:8px 5px 2px 5px;
  1077. float:right;
  1078. }
  1079. y {
  1080. font-size:24px;
  1081. padding:8px 5px 2px 5px;
  1082. float:left;
  1083. }
  1084.  
  1085. /* ------- spotify ------ */
  1086.  
  1087. #spotifytitle {
  1088. background-color:{color:navi}; /* SPOTIFY LABEL BACKGROUND COLOR */
  1089. padding:5px;
  1090. width:120px;
  1091. margin-top:10px;
  1092. height:10px;
  1093. padding:5px;
  1094. border-radius:5px 5px 0px 0px;
  1095. color:white;
  1096. font-family:'chaennie9';
  1097. text-transform:uppercase;
  1098. letter-spacing:2px;
  1099. margin-left:100px;
  1100.  
  1101. }
  1102.  
  1103.  
  1104. #spotify {
  1105. width:118px;
  1106. height:100px;
  1107. background:{color:posts bg}; /* STATS BACKGROUND COLOR */
  1108. margin-left:100px;
  1109. padding:5px;
  1110. margin-top:0px;
  1111. border-radius:0px 0px 5px 5px;
  1112. overflow:auto;
  1113. }
  1114.  
  1115. #song {
  1116. padding:5px;
  1117. font-size:10px;
  1118. font-weight:bold;
  1119. }
  1120.  
  1121. #artist {
  1122. color:white;
  1123. font-size:8px;
  1124. padding:5px;
  1125. margin-top:-8px;
  1126. font-style:italic;
  1127. border-bottom:1px dashed {color:accent};
  1128.  
  1129. }
  1130.  
  1131.  
  1132.  
  1133.  
  1134. /* ╰ ° TITLES N HEADINGS *° */
  1135.  
  1136.  
  1137. .title {
  1138. width:265px;
  1139. text-align:center;
  1140. position:absolute;
  1141. bottom:{text:title bottom padding};
  1142. font-family:{select:title font};
  1143. font-size:{text:title font size};
  1144. text-transform:lowercase;
  1145. display:block;
  1146. line-height:30%;
  1147. vertical-align:middle;
  1148. opacity:1;
  1149. word-spacing:0px;
  1150. z-index:-999;
  1151. font-weight:400;
  1152. color:{color:title};
  1153. transform:rotate(-6deg);
  1154. -webkit-transform:rotate(-6deg);
  1155. -webkit-font-smoothing: antialiased;
  1156. -webkit-filter: blur(0.0000000001px);
  1157. -webkit-transition: all 0.4s ease-out;
  1158. -webkit-transition: all 0.4s ease-out;
  1159. -moz-transition: all 0.4s ease-out;
  1160. -o-transition: all 0.4s ease-out;
  1161. }
  1162.  
  1163.  
  1164.  
  1165. .dtitle {
  1166. position:absolute;
  1167. top:50px;
  1168. left:-10px;
  1169. width:230px;
  1170. font-size:{text:hover title font size};
  1171. text-transform:lowercase;
  1172. line-height:{select:sidebar title lineheight};
  1173. vertical-align:middle;
  1174. opacity:1;
  1175. text-align:center;
  1176. word-spacing:0px;
  1177. z-index:999999;
  1178. font-weight:500;
  1179. color:{color:title};
  1180. text-shadow: 0px 0px 0.5px rgba(0,0,0,.2);
  1181. text-align:center;
  1182. font-family: {select:Title Font};
  1183. -webkit-font-smoothing: antialiased;
  1184. -webkit-filter: blur(0.0000000001px);
  1185. -webkit-transform:translate(0px,0%) rotate(-3deg) scale(1);
  1186. transform:translate(0px,0%) rotate(-3deg) scale(1);
  1187. -webkit-transition: all 0.4s ease-out;
  1188. -webkit-transition: all 0.4s ease-out;
  1189. -moz-transition: all 0.4s ease-out;
  1190. -o-transition: all 0.4s ease-out;
  1191. }
  1192.  
  1193. .cont:hover .dtitle {
  1194. -webkit-font-smoothing: antialiased;
  1195. -webkit-filter: blur(0.0000000001px);
  1196. -webkit-transform:translate(0px,0%) rotate(-3deg) scale(1);
  1197. transform:translate(0px,0%) rotate(-3deg) scale(1);
  1198. -webkit-transition: all 0.4s ease-out;
  1199. -webkit-transition: all 0.4s ease-out;
  1200. -moz-transition: all 0.4s ease-out;
  1201. -o-transition: all 0.4s ease-out;
  1202. }
  1203.  
  1204.  
  1205.  
  1206.  
  1207. .posts h1 {
  1208. font-size:32px;
  1209. padding:5px;
  1210. margin:5px;
  1211. font-weight:800;
  1212. line-height:100%;
  1213. letter-spacing:0.5x;
  1214. text-transform:uppercase;
  1215. -webkit-text-stroke: 1px {color:accent};
  1216. font-family:'glowies3';
  1217. text-align:center;
  1218. color:transparent;
  1219. }
  1220.  
  1221. h2, h3 {
  1222. line-height:120%;
  1223. font-family:'glowies3';
  1224. text-shadow: 0px 0.5px 0px rgba(0,0,0,.1);
  1225. text-transform:uppercase;
  1226. margin-bottom:5px;
  1227. margin-top:5px;
  1228. }
  1229.  
  1230. h2 {
  1231. font-size:14px;
  1232. font-weight:800;
  1233. letter-spacing:1.5px;
  1234. background:none;
  1235. text-align:right;
  1236. width:auto;
  1237. padding:4px;
  1238. color:{color:link};
  1239. }
  1240.  
  1241. .posts h3 {
  1242. background:{color:entries bg};
  1243. }
  1244.  
  1245.  
  1246. h3 {
  1247. font-weight:700;
  1248. color:{color:text};
  1249. font-size:8px;
  1250. padding:8px;
  1251. border-radius:5px;
  1252. text-align:center;
  1253. background:{color:posts bg};
  1254. }
  1255.  
  1256. h4 {
  1257. font-weight:700;
  1258. color:{color:accent};
  1259. font-size:18px;
  1260. padding:3px 3px 6px 3px;
  1261. border-bottom:1px solid {color:underline};
  1262. text-align:left;
  1263. text-transform:uppercase;
  1264. background:transparent;
  1265. margin-bottom:10px;
  1266. margin-top:0px;
  1267. font-family:'glowies3';
  1268. }
  1269.  
  1270. h4::before{
  1271. content:'●● ';
  1272. font-family:'raleway';
  1273. color:{color:underline};
  1274. }
  1275.  
  1276. h6 {
  1277. width:85%;
  1278. margin-bottom:20px;
  1279. margin-top:-10px;
  1280. margin-left:auto;
  1281. margin-right:auto;
  1282. text-align:center;
  1283. font-family:'glowies3';
  1284. font-size:9px;
  1285. padding:2px;
  1286. letter-spacing:0.5px;
  1287. text-transform:uppercase;
  1288. font-weight:500;
  1289. background:{color:bold};
  1290. color:{color:entries bg};
  1291. border-radius:10px;
  1292. }
  1293.  
  1294. /* ╰ ° IMAGE FILTERS *° */
  1295.  
  1296. {block:IfGreyscale}
  1297.  
  1298. .posts img {
  1299. -webkit-filter:grayscale(100%);
  1300. opacity:1;
  1301.  
  1302. }
  1303.  
  1304. .html_photoset {
  1305. -webkit-filter: grayscale(100%);
  1306. }
  1307.  
  1308. {/block:IfGreyscale}
  1309.  
  1310. img {
  1311. max-width:100%;
  1312. height:auto;}
  1313.  
  1314.  
  1315. /* ╰ ° NAVIGATION *° */
  1316.  
  1317.  
  1318. /*----- Tab Links -----*/
  1319.  
  1320. /* Clearfix */
  1321. .tab-links:after {
  1322. display:inline-block;
  1323. clear:both;
  1324. content:'';
  1325.  
  1326. }
  1327.  
  1328. .tab-links li {
  1329. margin:0px;
  1330. display:inline-block;
  1331. list-style:none;
  1332. z-index:-999;
  1333. padding:0px;
  1334. }
  1335.  
  1336. .tab-links {
  1337. position:absolute;
  1338. top: 3px;
  1339. right: 360px;
  1340. height:50px;
  1341. width:260px;
  1342. background:none;
  1343. text-align:center;
  1344. margin-top:-27px;
  1345. opacity:1;
  1346. border:0px solid {color:icon border};
  1347. z-index:999999999999999999999;
  1348. -webkit-transition: all 0.5s ease;
  1349. -moz-transition: all 0.5s ease;
  1350. -o-transition: all 0.5s ease;
  1351. }
  1352.  
  1353. .tab-links a {
  1354. width:16px;
  1355. height:16px;
  1356. display:block;
  1357. font-size:20px;
  1358. line-height:100%;
  1359. letter-spacing:0px;
  1360. text-align:right;
  1361. font-family: 'glowies3';
  1362. margin:5px 8px;
  1363. padding:8px 11px 10px 7px;
  1364. opacity:1.0;
  1365. text-align:center;
  1366. background:{color:navi};
  1367. color:transparent;
  1368. -webkit-text-stroke: 1px {color:posts bg};
  1369. border-radius:50%;
  1370. border:1px solid {color:underline};
  1371. text-shadow:none;
  1372. text-transform:uppercase;
  1373. transform:rotate(0deg) scale(1);
  1374. -webkit-transform:rotate(0deg) scale(1);
  1375. -webkit-transition: all 0.6s ease;
  1376. -moz-transition: all 0.6s ease;
  1377. -o-transition: all 0.6s ease;
  1378. }
  1379.  
  1380. .tab-links a:hover {
  1381. background:{color:accent};
  1382. color:{color:posts bg};
  1383. -webkit-text-stroke: 0px {color:entries bg};
  1384. border:1px solid {color:posts bg};
  1385. transform:rotate(8deg) scale(1.3);
  1386. -webkit-transform:rotate(8deg) scale(1.3);
  1387. }
  1388.  
  1389.  
  1390. .tinyicon {
  1391. position:absolute;
  1392. top:-20px;
  1393. right:-20px;
  1394. z-index:99999999;
  1395. width:40px;
  1396. height:auto;
  1397. padding:4px;
  1398. border-radius: 50%;
  1399. border:1px solid {color:entries bg};
  1400. background-color: {color:accent};
  1401. }
  1402.  
  1403. .tinyicon img {
  1404. width:auto;
  1405. height:auto;
  1406. overflow:hidden;
  1407. }
  1408.  
  1409.  
  1410.  
  1411. /* ╰ ° ICONS N STUFF *° */
  1412.  
  1413. #icon, #icon2 {
  1414. display:static;
  1415. position:absolute;
  1416. z-index:-999;
  1417. padding:0px;
  1418. top: 15px;
  1419. left:45px;
  1420. width:65px;
  1421. height:65px;
  1422. -webkit-transition: all .4s ease-out;
  1423. -moz-transition: all .4s ease-out;
  1424. -o-transition: all .4s ease-out;
  1425. -ms-transition: all .4s ease-out;
  1426. transition: all .4s ease-out;
  1427. }
  1428.  
  1429. #icon img, #icon2 img {
  1430. width:auto;
  1431. height:auto;
  1432. background-color: none;
  1433. overflow:hidden;
  1434. padding:4px;
  1435. border-radius: 50%;
  1436. border:1px solid {color:icon border};
  1437. }
  1438.  
  1439.  
  1440. #icon2 {
  1441. top: 32px;
  1442. left:100px;
  1443. width:42px;
  1444. height:42px;
  1445. }
  1446.  
  1447.  
  1448.  
  1449. /* ╰ ° ENTRIES *° */
  1450.  
  1451. .tabs {
  1452. width:100%;
  1453. margin-left:0px;
  1454. display:inline-block;
  1455. }
  1456.  
  1457. .bigcon {
  1458. width:605px;
  1459. {block:If400px}
  1460. width:805px;
  1461. {/block:If400px}
  1462. position:fixed;
  1463. margin: auto;
  1464. left:0px;
  1465. top:0px;
  1466. bottom:0px;
  1467. right:130px;
  1468. overflow-y:none;
  1469. overflow-x:none;
  1470. background:{color:entries bg};
  1471. border-radius:10px;
  1472. height:318.5px;
  1473. padding:0px;
  1474. opacity:0.95;
  1475. }
  1476.  
  1477. /*----- TAB CONTENT -----*/
  1478.  
  1479. .tab {
  1480. display:none;
  1481. }
  1482.  
  1483. .tab.active {
  1484. display:block;
  1485. }
  1486.  
  1487. .entries, .entries2 {
  1488. display:block;
  1489. width:400px;
  1490. {block:If400px}
  1491. width:535px;
  1492. {/block:If400px}
  1493. background:none;
  1494. margin-left:120px;
  1495. margin-top:0px;
  1496. position:absolute;
  1497. top: 10px;
  1498. right:5px;
  1499. background:{color:entries bg};
  1500. height:280px;
  1501. z-index:9;
  1502. text-align:justify;
  1503. overflow-y:auto;
  1504. overflow-x:hidden;
  1505. padding: 0px 10px 0px 0px;
  1506. -webkit-transition: all 0.5s ease;
  1507. -moz-transition: all 0.5s ease;
  1508. -o-transition: all 0.5s ease;
  1509. }
  1510. .entries2 {
  1511. background:transparent;
  1512. right:-20px;
  1513. overflow:auto;
  1514. z-index:9999;
  1515. height:290px;
  1516. }
  1517.  
  1518.  
  1519. .posts:hover, .entries:hover {
  1520. opacity:1;
  1521. }
  1522.  
  1523. .posts {
  1524. width: 300px;
  1525. {block:If400px}
  1526. width:400px;
  1527. {/block:If400px}
  1528. padding: 20px;
  1529. background: {color:posts bg};
  1530. margin-bottom:0px;
  1531. margin-left:55px;
  1532. margin-top:20px;
  1533. text-align:justify;
  1534. border-radius:5px;
  1535. opacity:0.85;
  1536. -webkit-transition: all 0.5s ease;
  1537. -moz-transition: all 0.5s ease;
  1538. -o-transition: all 0.5s ease;
  1539. }
  1540.  
  1541. #message {
  1542. padding:30px;
  1543. }
  1544.  
  1545.  
  1546. #tab {
  1547. padding:20px;
  1548. overflow:auto;
  1549. }
  1550.  
  1551.  
  1552. /* ╰ ° TABLE STUFF *° */
  1553.  
  1554.  
  1555. table, th, td {
  1556. border: 1px solid {color:entries bg};
  1557. }
  1558. th, td {
  1559. border-bottom: 1px solid {color:entries bg};
  1560. }
  1561.  
  1562. table {
  1563. width: 100%;
  1564. text-align: center;
  1565. table-layout: fixed;
  1566. }
  1567.  
  1568. th {
  1569. height: 12px;
  1570. text-align: center;
  1571. }
  1572.  
  1573. th, td {
  1574. padding:5px;
  1575. background-color:{color:posts bg};
  1576. }
  1577.  
  1578. .tablenav {
  1579. border-collapse: collapse;
  1580. width:200px;
  1581. margin-left:auto;
  1582. margin-right:auto;
  1583. }
  1584.  
  1585. .tablenav a {
  1586. display:block;
  1587. font-size:7px;
  1588. text-transform:uppercase;
  1589. font-weight:700;
  1590. text-align: center;
  1591. letter-spacing:1.5px;
  1592. }
  1593.  
  1594.  
  1595. /* ╰ ° DESCRIPTION *° */
  1596.  
  1597. .cont {
  1598. display: block;
  1599. position: absolute;
  1600. top: -25px;
  1601. left:-25px;
  1602. overflow:hidden;
  1603. width:265px;
  1604. height:371px;
  1605. background: url('{image:sidebar bg}') repeat center center;
  1606. opacity:1;
  1607. z-index:9999999;
  1608. -webkit-clip-path: inset(7% 0 7% 10%);
  1609. clip-path: inset(7% 0 7% 10%);
  1610. -webkit-transition: all .4s ease-out;
  1611. -moz-transition: all .4s ease-out;
  1612. -o-transition: all .4s ease-out;
  1613. -ms-transition: all .4s ease-out;
  1614. transition: all .4s ease-out;
  1615. -webkit-font-smoothing: antialiased;
  1616. -webkit-filter: blur(0.0000000001px);
  1617. -moz-osx-font-smoothing: grayscale;
  1618. }
  1619.  
  1620.  
  1621. .description{
  1622. display:static;
  1623. position:relative;
  1624. top:35px;
  1625. left:32.5px;
  1626. width:200px;
  1627. height:300px;
  1628. padding:0px;
  1629. margin-top:120px;
  1630. margin-bottom:-5px;
  1631. border: 0px solid {color:accent};
  1632. background:transparent;
  1633. opacity:0;
  1634. -webkit-font-smoothing: antialiased;
  1635. -webkit-filter: blur(0.0000000001px);
  1636. -webkit-transition: all 0.5s ease;
  1637. -moz-transition: all 0.5s ease;
  1638. -o-transition: all 0.5s ease;
  1639. box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  1640. -webkit-backface-visibility: hidden;
  1641. backface-visibility: hidden;
  1642. -webkit-transform: scale(1.4) rotate(6deg);
  1643. transform: scale(1.4) rotate(6deg);
  1644. }
  1645.  
  1646.  
  1647. .cont:hover .description {
  1648. margin-top:0px;
  1649. -webkit-transform: scale(1) rotate(0deg);
  1650. transform: scale(1) rotate(0deg);
  1651. opacity:0.95;
  1652. -webkit-transition: all 0.5s ease;
  1653. -moz-transition: all 0.5s ease;
  1654. -o-transition: all 0.5s ease;
  1655. }
  1656.  
  1657.  
  1658.  
  1659. #desc {
  1660. position:absolute;
  1661. top: 80px;
  1662. left:15px;
  1663. width:160px;
  1664. height:125px;
  1665. text-transform:uppercase;
  1666. font-size:7px;
  1667. font-weight:600;
  1668. letter-spacing:0.5px;
  1669. line-height:200%;
  1670. text-align:justify;
  1671. padding:5px;
  1672. color: {color:title};
  1673. border:5px solid rgba(255,255,255,0);
  1674. overflow-y:auto;
  1675. overflow-x:none;
  1676. border-radius:5px;
  1677. background:none;
  1678. text-shadow: 0px 0px 1px rgba(255,255,255,.4);
  1679. -webkit-font-smoothing: antialiased;
  1680. -webkit-filter: blur(0.0000000001px);
  1681. }
  1682.  
  1683. #desc h3 {
  1684. background:{color:entries bg};
  1685. }
  1686. #desc * {
  1687. color: {color:title};
  1688. }
  1689.  
  1690.  
  1691. /* ╰ ° KEEP READING *° */
  1692.  
  1693. .readsummore{
  1694. position: relative;
  1695. padding: 20px 0;
  1696. width: 100%;
  1697. }
  1698.  
  1699. .readsummore a:link{
  1700. -webkit-transition: all 0.2s ease;
  1701. -moz-transition: all 0.2s ease;
  1702. -o-transition: all 0.2s ease;
  1703. transition: all 0.2s ease;
  1704. position: relative;
  1705. left: calc(50% - 47px);
  1706. padding: 4px 8px;
  1707. border: 1px solid {color:entries bg};
  1708. background: transparent;
  1709. border-radius:20px;
  1710. height:10px;
  1711. font-size:7px;
  1712. line-height:130%;
  1713. vertical-align:middle;
  1714. letter-spacing:1.5px;
  1715. text-transform:uppercase;
  1716. font-family: 'Raleway';
  1717. text-align:center;
  1718. font-weight:600;
  1719. text-shadow:none;
  1720. }
  1721. .readsummore a:hover{
  1722. background: {color:accent};
  1723. color: {color:posts bg};
  1724. }
  1725.  
  1726. /* ╰ ° PAGINATION *° */
  1727.  
  1728. #pagination {
  1729. width:395px;
  1730. height:1px;
  1731. position:absolute;
  1732. right:20px;
  1733. bottom:20px;
  1734. background:{color:icon border};
  1735. z-index:-9;
  1736. -webkit-transition: all 0.3s ease;
  1737. -moz-transition: all 0.3s ease;
  1738. -o-transition: all 0.3s ease;
  1739. }
  1740.  
  1741.  
  1742. .pag a{
  1743. font-weight:400;
  1744. letter-spacing:1.5px;
  1745. padding:2px 4px;
  1746. display:inline-block;
  1747. margin:0px 5px;
  1748. text-shadow:none;
  1749. line-height:100%;
  1750. border-radius:3px;
  1751. background:{color:entries bg};
  1752. color:{color:text};
  1753. -webkit-transition: all 0.3s ease;
  1754. -moz-transition: all 0.3s ease;
  1755. -o-transition: all 0.3s ease;
  1756. }
  1757. .pag a:hover{
  1758. color:{color:linkhover};
  1759. }
  1760.  
  1761. .pag {
  1762. letter-spacing:1px;
  1763. text-transform:uppercase;
  1764. font-size:14px;
  1765. font-family:'glowies3';
  1766. word-spacing:6px;
  1767. margin-top:0px;
  1768. width:415px;
  1769. position:absolute;
  1770. right:10px;
  1771. bottom:10px;
  1772. z-index:0;
  1773. -webkit-transition: all 0.3s ease;
  1774. -moz-transition: all 0.3s ease;
  1775. -o-transition: all 0.3s ease;
  1776. }
  1777.  
  1778. .pright {
  1779. float:right;
  1780. }
  1781.  
  1782. /* ╰ ° CHAT CODE *° */
  1783.  
  1784. .convo li{
  1785. margin:0 0 5px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative;
  1786.  
  1787. }
  1788.  
  1789. .user_1 b,.user_3 b,.user_5 b,.user_7 b,.user_9 b,.user_11 b,.user_13 b,.user_15 b,.user_17 b,.user_19 b,.user_21 b, .user_23 b,.user_25 b,.user_27 b,.user_29 b,.user_31 b, .user_33 b,.user_35 b,.user_37 b,.user_39 b, .user_41 b,.user_43 b,.user_45 b,.user_47 b,.user_49 b,.user_51 b,.user_53 b,.user_55 b,.user_57 b,.user_59 b{color:{color:posts bg};}
  1790.  
  1791. .user_2 b,.user_4 b,.user_6 b,.user_8 b,.user_10 b,.user_12 b, .user_14 b,.user_16 b,.user_18 b,.user_20 b,.user_22 b, .user_24 b,.user_26 b,.user_28 b,.user_30 b,.user_32 b, .user_34 b,.user_36 b,.user_38 b,.user_40 b, .user_42 b,.user_44 b,.user_46 b,.user_48 b,.user_50 b,.user_52 b, .user_54 b,.user_56 b,.user_58 b,.user_60 b{color:{color:text};}
  1792.  
  1793. .user_1,.user_3,.user_5,.user_7,.user_9,.user_11, .user_13,.user_15,.user_17,.user_19, .user_21,.user_23,.user_25,.user_27,.user_29, .user_31,.user_33,.user_35,.user_37,.user_39, .user_41,.user_43,.user_45,.user_47,.user_49,.user_51, .user_53,.user_55,.user_57,.user_59{
  1794. float:left;background:{color:accent};color:{color:posts bg};left:3px
  1795. }
  1796. .user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after, .user_13::after,.user_15::after,.user_17::after,.user_19::after, .user_21::after,.user_23::after,.user_25::after,.user_27::after,.user_29::after, .user_31::after,.user_33::after,.user_35::after,.user_37::after,.user_39::after, .user_41::after,.user_43::after,.user_45::after,.user_47::after,.user_49::after,.user_51::after, .user_53::after,.user_55::after,.user_57::after,.user_59::after{
  1797. content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:accent};border-bottom-right-radius:1em .5em
  1798.  
  1799. }
  1800. .user_2,.user_4,.user_6,.user_8,.user_10,.user_12, .user_14,.user_16,.user_18,.user_20,.user_22, .user_24,.user_26,.user_28,.user_30,.user_32, .user_34,.user_36,.user_38,.user_40, .user_42,.user_44,.user_46,.user_48,.user_50,.user_52, .user_54,.user_56,.user_58,.user_60{
  1801. right:3px;float:right;background-color:{color:entries bg};color:{color:text};
  1802.  
  1803. }
  1804. .user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after, .user_14::after,.user_16::after,.user_18::after,.user_20::after, .user_22::after,.user_24::after,.user_26::after,.user_28::after,.user_30::after, .user_32::after,.user_34::after,.user_36::after,.user_38::after,.user_40::after, .user_42::after,.user_44::after,.user_46::after,.user_48::after,.user_50::after,.user_52::after, .user_54::after,.user_56::after,.user_58::after,.user_60::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid {color:entries bg};border-bottom-left-radius:1em .5em;
  1805.  
  1806. }
  1807.  
  1808. .convo {
  1809. overflow: hidden;
  1810. list-style-type: none;
  1811. padding: 0;
  1812. margin: 0;
  1813. }
  1814.  
  1815.  
  1816. /* ╰ ° ASKS N ANSWERS *° */
  1817.  
  1818. #asker {
  1819. position:absolute;
  1820. right:85px;
  1821. width:auto;
  1822. display:inline;
  1823. padding:4px 8px 4px 8px;
  1824. margin-top:-30px;
  1825. margin-bottom:30px;
  1826. font-size:15px;
  1827. letter-spacing:0px;
  1828. text-transform:uppercase;
  1829. font-family: 'glowies3';
  1830. color: {color:background};
  1831. background:{color:posts bg};
  1832. border:0px solid black;
  1833. }
  1834.  
  1835. #asker a {
  1836. color: {color:linkhover};
  1837. text-shadow:none;
  1838. }
  1839.  
  1840. #asker a:hover {
  1841. color: {color:entries bg};
  1842. }
  1843.  
  1844. #question {
  1845. width:272px;
  1846. {block:If400px}
  1847. width:372px;
  1848. {/block:If400px}
  1849. margin-left:-5px;
  1850. margin-top:0px;
  1851. margin-bottom:20px;
  1852. border:1px solid {color:entries bg};
  1853. padding:15px;
  1854. font-size:8px;
  1855. font-weight: 600;
  1856. text-align:center;
  1857. color: {color:text};
  1858. letter-spacing:1px;
  1859. text-transform:uppercase;
  1860. border-radius:5px;
  1861.  
  1862. }
  1863.  
  1864.  
  1865.  
  1866. /* ╰ ° QUOTES *° */
  1867.  
  1868. #quote {
  1869. text-align: center;
  1870. font-weight: 600;
  1871. line-height:180%;
  1872. opacity:0.6;
  1873. padding:15px;
  1874. z-index:0;
  1875. text-transform:uppercase;
  1876. letter-spacing: 2px;
  1877. padding-bottom: 10px;
  1878. background:{color:entries bg};
  1879. }
  1880.  
  1881. #quotesrc {
  1882. font-size:10px;
  1883. font-family: 'glowies3';
  1884. letter-spacing:1.5px;
  1885. margin-right:10px;
  1886. margin-top:5px;
  1887. text-align:right;
  1888. display:block;
  1889. font-style:none;
  1890. z-index:999;
  1891. text-transform:uppercase;
  1892. color:{color:text};}
  1893. #quote:before {
  1894. content: "❝ ";
  1895. font-size:16px;
  1896. font-family: 'roboto', sans-serif ;
  1897. color:{color:underline};}
  1898. #quote:after {
  1899. content: " ❞";
  1900. font-size:16px;
  1901. font-family: 'roboto', sans-serif ;
  1902. color:{color:underline};}
  1903.  
  1904.  
  1905. /* ╰ ° TUNES *° */
  1906.  
  1907. .playerbuttonbg {
  1908. position: absolute;
  1909. left: 20px;
  1910. top: 20px;
  1911. width: 19px;
  1912. height: 19px;
  1913. background-color: #ffffff;
  1914. padding: 10px;
  1915. -webkit-border-radius: 40px;
  1916. -moz-border-radius: 40px;
  1917. border-radius: 40px;
  1918. opacity: .4;
  1919. filter: alpha(opacity=40);
  1920. -moz-opacity: 0.4;
  1921. -khtml-opacity: 0.4;
  1922. transition: opacity .7s ease-in-out;
  1923. -moz-transition: opacity .7s ease-in-out;
  1924. -webkit-transition: opacity .7s ease-in-out;
  1925. }
  1926.  
  1927. .playerbuttonbg:hover {
  1928. opacity: 1;
  1929. filter: alpha(opacity=100);
  1930. -moz-opacity: 1;
  1931. -khtml-opacity: 1;
  1932. }
  1933.  
  1934. .newplayerbutton {
  1935. position: relative;
  1936. width: 19px;
  1937. height: 19px;
  1938. overflow: hidden;
  1939. }
  1940.  
  1941. .playerbuttonhug {
  1942. position: absolute;
  1943. top: -18px;
  1944. left: -7px;
  1945. }
  1946.  
  1947. .tumblr_audio_player {
  1948. height: 90px;
  1949. width: 270px;
  1950. -moz-transform: scale(0.60, 0.60);
  1951. -webkit-transform: scale(0.60, 0.60);
  1952. -o-transform: scale(0.60, 0.60);
  1953. -ms-transform: scale(0.60, 0.60);
  1954. transform: scale(0.60, 0.60);
  1955. -moz-transform-origin: top left;
  1956. -webkit-transform-origin: top left;
  1957. -o-transform-origin: top left;
  1958. -ms-transform-origin: top left;
  1959. transform-origin: top left;
  1960. }
  1961.  
  1962. .audioimgwrapper {
  1963. position: absolute;
  1964. left: 0px;
  1965. top: 0px;
  1966. -webkit-border-radius: 40px;
  1967. -moz-border-radius: 40px;
  1968. border-radius: 40px;
  1969. overflow: hidden;
  1970. width: 79px;
  1971. height: 79px;
  1972. }
  1973.  
  1974. .audioimgwrapper img {
  1975. width: 100%;
  1976. height: auto;
  1977. -webkit-border-radius: 40px;
  1978. -moz-border-radius: 40px;
  1979. border-radius: 40px;
  1980. }
  1981.  
  1982. .trackdetails {
  1983. width: auto;
  1984. font-family:'raleway';
  1985. text-transform:uppercase;
  1986. font-weight:600;
  1987. display:inline-block;
  1988. margin-left: 90px;
  1989. padding:10px;
  1990. letter-spacing:1px;
  1991. min-height: 55px;
  1992. }
  1993. .trackdetails b{
  1994. font-weight:800;
  1995. }
  1996. .trackdetails i{
  1997. font-weight:800;
  1998. font-style:italic;
  1999. font-size:14px;
  2000. color:{color:posts bg};
  2001. padding:2px 5px 2px 5px;
  2002. margin-left:-5px;
  2003. margin-bottom:10px;
  2004. line-height:180%;
  2005. background:{color:accent};
  2006. letter-spacing:0px;
  2007. }
  2008.  
  2009. .audiowrapper {
  2010. position: relative;
  2011. display:inline-block;
  2012. margin-bottom:10px;
  2013. margin-left:45px;
  2014. {block:If400px}
  2015. margin-left:80px;
  2016. {/block:If400px}
  2017. }
  2018.  
  2019.  
  2020. /* ╰ ° NOTES *° */
  2021.  
  2022. .note {
  2023. color:{color:text};
  2024. text-transform:uppercase;
  2025. width:290px;
  2026. {block:If400px}
  2027. width:390px;
  2028. {/block:If400px}
  2029. font-style:normal;
  2030. letter-spacing:1px;
  2031. font-size: 7px;
  2032. text-align:left;
  2033. line-height:130%;
  2034. margin-left:-5px;}
  2035.  
  2036.  
  2037. .note a {
  2038. color:{color:link};
  2039. }
  2040.  
  2041. .note a:hover{
  2042. color:{color:linkhover};
  2043. }
  2044.  
  2045. .note li {
  2046. list-style-type:none;
  2047. padding:4px 15px 4px 15px;
  2048. text-align:left;
  2049. -moz-transition-duration:0.5s;
  2050. -webkit-transition-duration:0.5s;
  2051. -o-transition-duration:0.5s;}
  2052.  
  2053. .note img.avatar {
  2054. margin-right: 10px;
  2055. display:none;
  2056. width: 16px;
  2057. height: 16px;
  2058.  
  2059. }
  2060.  
  2061.  
  2062. /* ╰ ° TAGS N PERMALINKS *° */
  2063.  
  2064. .tags {
  2065. font-size:7px;
  2066. letter-spacing:1px;
  2067. font-weight:bold;
  2068. margin-top:5px;
  2069. margin-bottom:0px;
  2070. margin-left:55px;
  2071. opacity:0.6;
  2072. width:300px;
  2073. text-transform:uppercase;
  2074. {block:If400px}
  2075. width:400px;
  2076. {/block:If400px}
  2077. padding:15px;
  2078. padding-top:10px;
  2079. line-height:150%;
  2080. z-index:999;
  2081. text-align:center;
  2082. -webkit-transition: all 0.8s ease;
  2083. -moz-transition: all 0.8s ease;
  2084. transition: all 0.8s ease;
  2085.  
  2086. }
  2087. .tags:hover {
  2088. opacity:1;
  2089. }
  2090.  
  2091. .tags a, .permalink a {
  2092. color:{color:link};
  2093. border:0px solid {color:posts bg};
  2094. padding:3px 5px;
  2095. margin:3px 1px;
  2096. border-radius:7px;
  2097. line-height:270%;
  2098. text-shadow:none;
  2099. }
  2100.  
  2101. .tags a:hover{
  2102. color:{color:linkhover};
  2103. border:0px solid {color:entries bg};
  2104. }
  2105.  
  2106. .permalink a{
  2107. color:{color:link};
  2108. background:{color:entries bg};
  2109. font-size:7px;
  2110. text-align:center;
  2111. line-height:100%;
  2112. padding:5px;
  2113. border:1px solid {color:posts bg};
  2114. text-shadow:none;
  2115. -webkit-transition: all 0.4s ease;
  2116. -moz-transition: all 0.4s ease;
  2117. transition: all 0.4s ease;
  2118. }
  2119.  
  2120.  
  2121. .permalink a:hover{
  2122. color: {color:posts bg};
  2123. background:{color:link};
  2124. border:1px solid {color:link};
  2125. }
  2126.  
  2127. .permalink {
  2128. width:300px;
  2129. {block:If400px}
  2130. width:400px;
  2131. {/block:If400px}
  2132. word-spacing:0px;
  2133. text-align:center;
  2134. margin-top:10px;
  2135. margin-left:auto;
  2136. margin-right:auto;
  2137. margin-bottom:-35px;
  2138. text-transform:none;
  2139. font-family:'icony';
  2140. color:{color:text};
  2141. padding:3px;
  2142. opacity:1;
  2143. z-index:9999999999;
  2144. }
  2145.  
  2146.  
  2147. /* ╰ ° COPYRIGHT - DON'T_TOUCH_THIS.MP3 *° */
  2148.  
  2149. .credit, .credit a {
  2150. position:fixed;
  2151. left:10px;
  2152. bottom:10px;
  2153. width:11px;
  2154. height:11px;
  2155. border-radius:50%;
  2156. background-color:{color:posts bg};
  2157. border:1px solid {color:posts bg};
  2158. font-size:11px;
  2159. color:{color:text};
  2160. letter-spacing:1px;
  2161. padding:5px;
  2162. line-height:100%;
  2163. opacity:0.75;
  2164. -webkit-transition: all 0.5s ease;
  2165. -moz-transition: all 0.5s ease;
  2166. transition: all 0.5s ease;
  2167. }
  2168. .credit i{
  2169. font-family:'icony';
  2170. font-style:normal;
  2171. color:{color:text};
  2172. -webkit-transition: all 0.5s ease;
  2173. -moz-transition: all 0.5s ease;
  2174. transition: all 0.5s ease;
  2175. }
  2176.  
  2177. .credit a:hover {
  2178. opacity:1;
  2179. background:none;
  2180. color:{color:posts bg};
  2181. }
  2182.  
  2183. .credit a:hover i{
  2184. color:{color:posts bg};
  2185. text-shadow:none;
  2186. -webkit-transition: all 0.5s ease;
  2187. -moz-transition: all 0.5s ease;
  2188. transition: all 0.5s ease;
  2189. }
  2190.  
  2191. .credit:hover {
  2192. opacity:1;
  2193. background:none;
  2194. color:{color:posts bg};
  2195. }
  2196. .credit a span{
  2197. width: 45px;
  2198. height: auto;
  2199. padding: 3px;
  2200. left: 0%;
  2201. margin-left: 15px;
  2202. font-weight: 400;
  2203. font-size:6.5px;
  2204. text-align: center;
  2205. border: 4px solid {color:posts bg};
  2206. background-color:{color:posts bg};
  2207. text-indent: 0px;
  2208. text-transform:uppercase;
  2209. border-radius: 5px;
  2210. position: absolute;
  2211. color:{color:text};
  2212. pointer-events: none;
  2213. opacity: 0;
  2214. text-shadow:none;
  2215. transition: all 0.3s ease-in-out;
  2216. -webkit-transform: translate3d(20px,20px,0px) rotate(45deg);
  2217. transform: translate3d(20px,20px,0px) rotate(45deg);
  2218. }
  2219. .credit a span:before,
  2220. .credit a span:after{
  2221. content: '';
  2222. position: absolute;
  2223. bottom: -10px;
  2224. left: 50%;
  2225. margin-left: -21px;
  2226. width: 0;
  2227. height: 0;
  2228. border-left: 6px solid transparent;
  2229. border-right: 6px solid transparent;
  2230. border-top: 6px solid {color:posts bg};
  2231. }
  2232.  
  2233. .credit a:hover span{
  2234. opacity: 0.9;
  2235. -webkit-transform: translate3d(-20px,-55px,0px) rotate(0deg);
  2236. transform: translate3d(-20px,-55px,0px) rotate(0deg);
  2237. }
  2238.  
  2239. .credit span b{
  2240. font-style:none;
  2241. font-family:'glowies5';
  2242. font-weight:800;
  2243. text-transform:lowercase;
  2244. letter-spacing:0.5px;
  2245. font-size:19px;
  2246. }
  2247.  
  2248.  
  2249. {CustomCSS}</style>
  2250.  
  2251.  
  2252. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  2253. <script src="http://static.tumblr.com/2b2izpj/cB7ogqs8l/jquery.initialize.js"></script>
  2254.  
  2255. <script>
  2256. $(document).ready(function(){
  2257. // un-uglify new tumblr controls by magnusthemes@tumblr
  2258. $(".tmblr-iframe--unified-controls").initialize(function(){
  2259. var originalURL = $(this).attr("src").split("useThemeColors");
  2260. var srcpart = originalURL[1].split("scrollHeader")[1];
  2261. var newURL = originalURL[0] + 'useThemeColors":false, "scrollHeader' + srcpart;
  2262. $(this).attr("src", newURL);
  2263. });
  2264. $(".tmblr-iframe--loaded").initialize(function(){
  2265. $(this).appendTo("div#tumblr-controls");
  2266. });
  2267. });
  2268. </script>
  2269.  
  2270.  
  2271. </head><body>
  2272.  
  2273.  
  2274.  
  2275. <div id="tumblr-controls"></div>
  2276.  
  2277.  
  2278.  
  2279. <div class="headerbar"></div>
  2280. <div class="headerbar2"></div>
  2281. <div class="headerbar3"></div>
  2282. <div class="headerbar4"></div>
  2283.  
  2284.  
  2285.  
  2286.  
  2287.  
  2288. <div class="bigcon">
  2289.  
  2290. <div class="tabs">
  2291. <ul class="tab-links">
  2292. <li class="active"><a href="/" title="{text:tab 1 title}">a.</a></li>
  2293. <li><a href="#tab2" title="{text:tab 2 title}">b.</a></li>
  2294. <li><a href="#tab3" title="{text:tab 3 title}">c.</a></li>
  2295. <li><a href="#tab4" title="{text:tab 4 title}">d.</a></li>
  2296. </ul>
  2297. </div>
  2298.  
  2299. <div class="cont">
  2300.  
  2301. <div class="title">{text:title}</div>
  2302.  
  2303. <div class="description">
  2304. <div id="desc">i <em>exchanged</em> my youth with the <s>MONSTER</s> called <strong>success</strong> and he wants more <strong>WEALTH</strong> my <u>greed</u> which was my <s>w e a p o n</s> turned into something that would <sub>swallow</sub> me <sup>up,</sup> <big><s>ruin</s></big> me, and <em>sometimes</em> put a <strong>chain</strong> on me some p e o p l e try to block my <strong>MOUTH</strong> and tell me to <sub><em>swallow</em></sub> the <s>FORBIDDEN</s> fruit i don’t <strong>want</strong> it they want me to <em>l e a v e</em> the <big><u>garden.</u></big> </div>
  2305.  
  2306. <div class="dtitle">{text:desc title}</div>
  2307.  
  2308.  
  2309.  
  2310. </div>
  2311.  
  2312. </div>
  2313.  
  2314.  
  2315. <!-- --------------------------- TABS -------------------------- -->
  2316.  
  2317. <div class="tabs">
  2318.  
  2319. <!-- --------------------------- TAB 1 -------------------------- -->
  2320.  
  2321. <div id="tab1" class="tab active">
  2322.  
  2323. <div class="pag">{block:Pagination} {block:PreviousPage}<a href="{PreviousPage}">sink</a>{/block:PreviousPage} {block:NextPage}<a class="pright" href="{NextPage}">swim</a>{/block:NextPage}{/block:Pagination}</div>
  2324. <div id="pagination"></div>
  2325.  
  2326. <div class="entries">
  2327.  
  2328. {block:Posts}
  2329. <div class="posts">
  2330.  
  2331.  
  2332.  
  2333. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  2334.  
  2335. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}
  2336. {/block:Photo}
  2337.  
  2338. {block:Photoset}{Photoset}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  2339.  
  2340. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  2341.  
  2342. {block:Quote}<div id="quote">{Quote}</div><br>{block:Source}<div id="quotesrc">{Source}</div>{/block:Source}{/block:Quote}
  2343.  
  2344.  
  2345. {block:AudioPlayer}
  2346. <div class="audiowrapper">
  2347. {block:AlbumArt}
  2348. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  2349. {/block:AlbumArt}
  2350.  
  2351. <div class="playerbuttonbg">
  2352. <div class="newplayerbutton">
  2353. <div class="playerbuttonhug">
  2354.  
  2355. {AudioPlayerWhite}
  2356.  
  2357. </div>
  2358. </div>
  2359. </div>
  2360.  
  2361. <div class="trackdetails">
  2362.  
  2363. {block:TrackName}<i>{TrackName}</i>{/block:TrackName}<br/>
  2364. {block:Artist}<b>Artist:</b> {Artist}{/block:Artist}<br/>
  2365. {block:Album}<b>Album:</b> {Album}{/block:Album}
  2366.  
  2367. </div>
  2368. </div>
  2369. {block:Caption}{Caption}{/block:Caption}
  2370. {/block:AudioPlayer}
  2371.  
  2372.  
  2373.  
  2374. {block:Video}{Video-250}
  2375. {block:Caption}{Caption}{/block:Caption}
  2376. {/block:Video}
  2377.  
  2378. {block:Chat}
  2379. {block:Title}
  2380. <h2>{Title}</h2>{/block:Title}<br>
  2381. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b>{/block:Label}
  2382. {Line}</li>{/block:Lines}</ul>
  2383. {/block:Chat}
  2384.  
  2385. {block:Answer}<div id="question">{Question}</div><div id="asker">{Asker}</div>{Answer}{/block:Answer}
  2386.  
  2387. {block:More}<div class="readsummore"><a href="{Permalink}" class="more-btn">Read More</a></div>{/block:More}
  2388.  
  2389. {block:Date}
  2390. <div class="permalink">
  2391. <a class="hvr-push" href="{Permalink}" title="{NoteCount} notes">{TimeAgo}</a>{block:RebloggedFrom} <a class="hvr-push" href="{ReblogParentURL}">via</a>{/block:RebloggedFrom} {block:ContentSource} <a class="hvr-push" href="{SourceURL}">source</a>{/block:ContentSource} <a class="hvr-push" href="{ReblogURL}">reblog</a>{/block:permalinkpage}
  2392. </div>
  2393. {/block:Date}
  2394.  
  2395. </div>
  2396.  
  2397.  
  2398.  
  2399.  
  2400.  
  2401.  
  2402.  
  2403. {block:HasTags}<div class="tags"> {block:Tags} <a href="{TagUrl}"><span class="lnr lnr-tag"></span> {Tag}</a>{/block:Tags}</div>{/block:HasTags}
  2404.  
  2405. {block:PostNotes}
  2406. <div class="note">
  2407. {PostNotes}
  2408. </div>
  2409. {/block:PostNotes}
  2410.  
  2411. <!-- {block:NoRebloggedFrom}
  2412. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  2413. {/block:NoRebloggedFrom} -->
  2414.  
  2415. {block:ContentSource}<!-- {SourceURL}
  2416. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  2417. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  2418. {/block:ContentSource}
  2419.  
  2420.  
  2421. {/block:Posts}
  2422.  
  2423. </div><!---end of tab1--->
  2424. </div><!---end of tab--->
  2425.  
  2426.  
  2427. <!-- -------------------------- TAB 2 -------------------------- -->
  2428.  
  2429.  
  2430. <div id="tab2" class="tab">
  2431. <div class="entries2">
  2432. <div id="message">
  2433. <h1 style="font-size:32px; padding:5px;margin:5px;font-weight:800;line-height:100%;letter-spacing:0.5x;text-transform:uppercase;-webkit-text-stroke: 1px {color:accent};font-family:'glowies3';text-align:center;color:transparent;">{text:askbox title}</h1>
  2434. <iframe frameborder="0" scrolling="no" width="100%" height="210" src="http://www.tumblr.com/ask_form/{text:username}.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]-->
  2435. </div>
  2436. </div>
  2437. </div>
  2438.  
  2439.  
  2440. <!-- -------------------------- TAB 3 -------------------------- -->
  2441.  
  2442. <div id="tab3" class="tab">
  2443. <div class="entries2">
  2444. <div id="tab">
  2445.  
  2446. <div class="nav">
  2447. <a href="{text:link 1 url}" class="hvr-push" title="{text:link 1 title}"><i class="pe-7s-user"></i></a>
  2448. <a href="{text:link 2 url}" class="hvr-push" title="{text:link 2 title}"><i class="pe-7s-ticket"></i></a>
  2449. <a href="{text:link 3 url}" class="hvr-push" title="{text:link 3 title}"><i class="pe-7s-star"></i></a>
  2450. <a href="{text:link 5 url}" class="hvr-push" title="{text:link 5 title}"><i class="pe-7s-music"></i></a>
  2451. <a href="{text:link 6 url}" class="hvr-push" title="{text:link 6 title}"><i class="pe-7s-moon"></i></a>
  2452. <a href="{text:link 7 url}" class="hvr-push" title="{text:link 7 title}"><i class="pe-7s-chat"></i></a>
  2453. </div>
  2454.  
  2455. <div class="tabsi">
  2456. <img class="hvr-grow-rotate tabi" src="{image:tab icon}">
  2457. <img class="hvr-grow-rotate tabi" src="{image:tab icon2}">
  2458. <img class="hvr-grow-rotate tabi" src="{image:tab icon3}">
  2459. <img class="hvr-grow-rotate tabi" src="{image:tab icon4}">
  2460. </div>
  2461.  
  2462. <div class="z">
  2463. <h4>more stuff</h4>
  2464. <div class="f">
  2465. <p><xo>a.</xo> The key is to drink coconut, fresh coconut, trust me. The weather is amazing, walk with me through the pathway of more success. Take this journey with me, Lion! Major key, don’t fall for the trap, stay focused. </p>
  2466. <p><xx>b.</xx>It’s the ones closest to you that want to see you fail. Let me be clear, you have to make it through the jungle to make it to paradise, that’s the key, Lion! Bless up. Eliptical talk. Don’t ever play yourself. Fan luv. </p>
  2467. <p><xo>c.</xo>The weather is amazing, walk with me through the pathway of more success. Take this journey with me, Lion! How’s business? Boomin.</p>
  2468. </div>
  2469. </div>
  2470. <div class="tabq">
  2471. {text:tab quote}
  2472. </div>
  2473.  
  2474.  
  2475. </div>
  2476. </div>
  2477. </div>
  2478.  
  2479.  
  2480. <!-- -------------------------- TAB 4 -------------------------- -->
  2481.  
  2482. <div id="tab4" class="tab">
  2483. <div class="entries2">
  2484. <div id="tab">
  2485.  
  2486.  
  2487. <div style="transform:rotate(-2deg);">
  2488. <h1 style="margin-top:10px;font-size:32px; padding:5px;margin:5px;font-weight:800;line-height:100%;letter-spacing:0.5x;text-transform:uppercase;-webkit-text-stroke: 1px {color:accent};font-family:'glowies3';text-align:center;color:transparent;">meet the crew</h1>
  2489. <h6 style="margin-bottom:10px">character selection</h6>
  2490. </div>
  2491.  
  2492.  
  2493.  
  2494. <!---------------------- START OF NEW MUSE SECTION ------------------>
  2495.  
  2496. <!-- TAB LINKS -->
  2497. <div class="tabz">
  2498. <a href="javascript:void(0)" class="tablink tabzact hvr-pop" onclick="openAlytut(event, 'tabz01');"><img src="https://static.tumblr.com/xfpywyf/ocDp483bu/micah.png"><h1>micah</h1></a>
  2499.  
  2500. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz02');"><img src="https://static.tumblr.com/xfpywyf/bPzp483cf/aries.png"><h1>aries</h1></a>
  2501.  
  2502. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz03');"><img src="https://static.tumblr.com/xfpywyf/LYOp483cx/astryd.png"><h1>astryd</h1></a>
  2503.  
  2504. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz04');"><img src="https://static.tumblr.com/xfpywyf/k7sp483dw/drake.png"><h1>drake</h1></a>
  2505.  
  2506. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz05');"><img src="https://static.tumblr.com/xfpywyf/aPHp483f3/jun.png "><h1>jun</h1></a>
  2507.  
  2508. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz06');"><img src="https://static.tumblr.com/xfpywyf/RhEp483fh/caia.png"><h1>caia</h1></a>
  2509.  
  2510. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz07');"><img src="https://static.tumblr.com/xfpywyf/Rplp483fy/hyesuk.png"><h1>hyesuk</h1></a>
  2511.  
  2512. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz08');"><img src="https://static.tumblr.com/xfpywyf/21Lp483gs/daeil.png"><h1>daeil</h1></a>
  2513.  
  2514. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz09');"><img src="https://static.tumblr.com/xfpywyf/R54p483h5/dhalya.png"><h1>dhalya</h1></a>
  2515.  
  2516. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz10');"><img src="https://static.tumblr.com/xfpywyf/SNgp483hu/eujin.png"><h1>eujin</h1></a>
  2517.  
  2518. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz11');"><img src="https://static.tumblr.com/xfpywyf/RUnp483id/euni.png"><h1>euni</h1></a>
  2519.  
  2520. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz12');"><img src="https://static.tumblr.com/xfpywyf/vtNp483iu/hahn.png"><h1>hahn</h1></a>
  2521.  
  2522. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz13');"><img src="https://static.tumblr.com/xfpywyf/Oxyp483l4/hyori.png"><h1>hyori</h1></a>
  2523.  
  2524. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz14');"><img src="https://static.tumblr.com/xfpywyf/COMp483ln/hyunsoo.png"><h1>hyunsoo</h1></a>
  2525.  
  2526. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz15');"><img src="https://static.tumblr.com/xfpywyf/3dep483m3/ikhaya.png"><h1>ikhaya</h1></a>
  2527.  
  2528. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz16');"><img src="https://static.tumblr.com/xfpywyf/PSfp483mw/inha.png"><h1>inha</h1></a>
  2529.  
  2530. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz17');"><img src="https://static.tumblr.com/xfpywyf/zaDp483nb/jinsoo.png"><h1>jinsoo</h1></a>
  2531.  
  2532. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz18');"><img src="https://static.tumblr.com/xfpywyf/bODp483nq/joy.png"><h1>joy</h1></a>
  2533.  
  2534. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz19');"><img src="https://static.tumblr.com/xfpywyf/nzEp483og/junho.png"><h1>junho</h1></a>
  2535.  
  2536. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz20');"><img src="https://static.tumblr.com/xfpywyf/J2mp483ov/junoh.png"><h1>junoh</h1></a>
  2537.  
  2538. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz21');"><img src="https://static.tumblr.com/xfpywyf/axMp483pe/kheylan.png"><h1>kheylan</h1></a>
  2539.  
  2540. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz22');"><img src="https://static.tumblr.com/xfpywyf/43Wp483py/lola.png"><h1>lola</h1></a>
  2541.  
  2542. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz23');"><img src="https://static.tumblr.com/xfpywyf/4IJp483qk/lukhas.png"><h1>lukhas</h1></a>
  2543.  
  2544. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz24');"><img src="https://static.tumblr.com/xfpywyf/YXvp483r3/luna.png"><h1>luna</h1></a>
  2545.  
  2546. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz25');"><img src="https://static.tumblr.com/xfpywyf/4Gwp483rl/matteo.png"><h1>matteo</h1></a>
  2547.  
  2548. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz26');"><img src="https://static.tumblr.com/xfpywyf/RuJp483s8/noah.png"><h1>noah</h1></a>
  2549.  
  2550. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz27');"><img src="https://static.tumblr.com/xfpywyf/xtbp483ss/olliber.png"><h1>olliber</h1></a>
  2551.  
  2552. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz28');"><img src="https://static.tumblr.com/xfpywyf/73Vp483t9/raejoon.png"><h1>raejoon</h1></a>
  2553.  
  2554. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz29');"><img src="https://static.tumblr.com/xfpywyf/Jiip483tq/ray.png"><h1>ray</h1></a>
  2555.  
  2556. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz30');"><img src="https://static.tumblr.com/xfpywyf/zIjp483u8/rey.png"><h1>rey</h1></a>
  2557.  
  2558. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz31');"><img src="https://static.tumblr.com/xfpywyf/Blsp483uq/sunmi.png"><h1>sunmi</h1></a>
  2559.  
  2560. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz32');"><img src="https://static.tumblr.com/xfpywyf/6aRp483ve/rhyon.png"><h1>rhyon</h1></a>
  2561.  
  2562. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz33');"><img src="https://static.tumblr.com/xfpywyf/sbxp483w0/sooha.png"><h1>sooha</h1></a>
  2563.  
  2564. <a href="javascript:void(0)" class="tablink hvr-pop" onclick="openAlytut(event, 'tabz34');"><img src="https://static.tumblr.com/xfpywyf/1Bsp483wo/xonya.png"><h1>xonya</h1></a>
  2565.  
  2566. </div>
  2567.  
  2568.  
  2569.  
  2570.  
  2571. <!------------------------- END OF MUSE SECTION ------------------------>
  2572.  
  2573.  
  2574.  
  2575.  
  2576.  
  2577.  
  2578.  
  2579.  
  2580.  
  2581. </div><!--- end of tab --->
  2582. </div><!--- end of entries --->
  2583. </div><!--- end of tab4 --->
  2584. </div><!--- end of tabs --->
  2585. </div><!--- end of bigcon --->
  2586.  
  2587.  
  2588. <!-- TABS START -->
  2589.  
  2590. <!--------------------- TAB1 -------------------->
  2591.  
  2592.  
  2593. <div id="tabz01" class="tabzcon alytut" style="display:none">
  2594. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2595.  
  2596. <div class="profile">
  2597.  
  2598. <div id="lilicons">
  2599. <img src="https://static.tumblr.com/xfpywyf/35Dp48487/m.png">
  2600. <img src="https://static.tumblr.com/xfpywyf/TXip4848h/m2.png" class="hvr-bounce-in">
  2601. </div>
  2602.  
  2603. <div id="minicon">
  2604.  
  2605. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2606.  
  2607. <div id="stats">
  2608.  
  2609. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2610.  
  2611. </div>
  2612.  
  2613. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2614.  
  2615. <div id="connections">
  2616.  
  2617. <!-- COPY + PASTE THIS TO ADD MORE -->
  2618. <!-- START -->
  2619. <p><y><img src="http://78.media.tumblr.com/0c732eee85bab5c382ab5292fdd035d2/tumblr_inline_p3il5eJMAr1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2620.  
  2621. <p><z><img src="http://78.media.tumblr.com/2e6d4a37760ae4328ae52f5e9a970e17/tumblr_inline_p3il5hAyft1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2622. <!-- END -->
  2623.  
  2624. </div>
  2625.  
  2626.  
  2627.  
  2628. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2629.  
  2630. <div id="spotify">
  2631.  
  2632. <!-- COPY + PASTE THIS TO ADD MORE -->
  2633. <!-- START -->
  2634. <div id="song"><b>01.</b> song</div>
  2635. <div id="artist">artist</div>
  2636. <!-- END -->
  2637.  
  2638. </div>
  2639.  
  2640. </div><!-- END OF SPOTIFY -->
  2641.  
  2642. </div><!-- END OF MINICON -->
  2643.  
  2644. </div><!-- END OF TAB-->
  2645.  
  2646.  
  2647.  
  2648. <!------------------ TAB1 END ------------------->
  2649.  
  2650.  
  2651. <!--------------------- TAB2 -------------------->
  2652.  
  2653.  
  2654.  
  2655. <div id="tabz02" class="tabzcon alytut" style="display:none">
  2656. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2657.  
  2658.  
  2659. <div class="profile">
  2660.  
  2661. <div id="lilicons">
  2662. <img src="https://static.tumblr.com/xfpywyf/YEAp4849e/a7.png" class="hvr-bounce-in">
  2663. <img src="https://static.tumblr.com/xfpywyf/fwbp4849q/a8.png" class="hvr-bounce-in">
  2664. </div>
  2665.  
  2666. <div id="minicon">
  2667.  
  2668. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2669.  
  2670. <div id="stats">
  2671.  
  2672. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2673.  
  2674. </div>
  2675.  
  2676. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2677.  
  2678. <div id="connections">
  2679.  
  2680. <!-- COPY + PASTE THIS TO ADD MORE -->
  2681. <!-- START -->
  2682. <p><y><img src="http://78.media.tumblr.com/c431b111379f38d1d3ebc25922d774b6/tumblr_inline_p3il46GvAV1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2683.  
  2684. <p><z><img src="http://78.media.tumblr.com/cd39cbe1408a694a21cc4bb855625067/tumblr_inline_p3il46OsCL1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2685. <!-- END -->
  2686.  
  2687. </div>
  2688.  
  2689.  
  2690.  
  2691. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2692.  
  2693. <div id="spotify">
  2694.  
  2695. <!-- COPY + PASTE THIS TO ADD MORE -->
  2696. <!-- START -->
  2697. <div id="song"><b>01.</b> song</div>
  2698. <div id="artist">artist</div>
  2699. <!-- END -->
  2700.  
  2701. </div>
  2702.  
  2703. </div><!-- END OF SPOTIFY -->
  2704.  
  2705. </div><!-- END OF MINICON -->
  2706.  
  2707. </div><!-- END OF TAB-->
  2708.  
  2709. <!------------------ TAB2 END ------------------->
  2710.  
  2711.  
  2712. <!--------------------- TAB3 -------------------->
  2713.  
  2714.  
  2715. <div id="tabz03" class="tabzcon alytut" style="display:none">
  2716. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2717.  
  2718.  
  2719. <div class="profile">
  2720.  
  2721. <div id="lilicons">
  2722. <img src="https://static.tumblr.com/xfpywyf/5MMp484ae/a.png" class="hvr-bounce-in">
  2723. <img src="https://static.tumblr.com/xfpywyf/wU7p484am/a2.png" class="hvr-bounce-in">
  2724. </div>
  2725.  
  2726. <div id="minicon">
  2727.  
  2728. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2729.  
  2730. <div id="stats">
  2731.  
  2732. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2733.  
  2734. </div>
  2735.  
  2736. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2737.  
  2738. <div id="connections">
  2739.  
  2740. <!-- COPY + PASTE THIS TO ADD MORE -->
  2741. <!-- START -->
  2742. <p><y><img src="http://78.media.tumblr.com/421f4e021717359aa3dc9962c6f61116/tumblr_inline_p3il5tYydM1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2743.  
  2744. <p><z><img src="http://78.media.tumblr.com/96eeea0093ab98d771ab6b87156df939/tumblr_inline_p3il5o3F371ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2745. <!-- END -->
  2746.  
  2747. </div>
  2748.  
  2749.  
  2750.  
  2751. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2752.  
  2753. <div id="spotify">
  2754.  
  2755. <!-- COPY + PASTE THIS TO ADD MORE -->
  2756. <!-- START -->
  2757. <div id="song"><b>01.</b> song</div>
  2758. <div id="artist">artist</div>
  2759. <!-- END -->
  2760.  
  2761. </div>
  2762.  
  2763. </div><!-- END OF SPOTIFY -->
  2764.  
  2765. </div><!-- END OF MINICON -->
  2766.  
  2767. </div><!-- END OF TAB-->
  2768.  
  2769. <!------------------ TAB3 END ------------------->
  2770.  
  2771.  
  2772. <!--------------------- TAB4 -------------------->
  2773.  
  2774.  
  2775. <div id="tabz04" class="tabzcon alytut" style="display:none">
  2776. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2777.  
  2778.  
  2779. <div class="profile">
  2780.  
  2781. <div id="lilicons">
  2782. <img src="https://static.tumblr.com/xfpywyf/UCZp484bd/d3.png" class="hvr-bounce-in">
  2783. <img src="https://static.tumblr.com/xfpywyf/zMRp484bm/d4.png" class="hvr-bounce-in">
  2784. </div>
  2785.  
  2786. <div id="minicon">
  2787.  
  2788. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2789.  
  2790. <div id="stats">
  2791.  
  2792. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2793.  
  2794. </div>
  2795.  
  2796. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2797.  
  2798. <div id="connections">
  2799.  
  2800. <!-- COPY + PASTE THIS TO ADD MORE -->
  2801. <!-- START -->
  2802. <p><y><img src="http://78.media.tumblr.com/fd2f091963950d550f8a6adbe7e88c83/tumblr_inline_p3kdizMDyY1up84fh_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2803.  
  2804. <p><z><img src="http://78.media.tumblr.com/87d2aa217cbf00a2e564b538b3014cda/tumblr_inline_p3kdiz63Su1up84fh_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2805. <!-- END -->
  2806.  
  2807. </div>
  2808.  
  2809.  
  2810.  
  2811. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2812.  
  2813. <div id="spotify">
  2814.  
  2815. <!-- COPY + PASTE THIS TO ADD MORE -->
  2816. <!-- START -->
  2817. <div id="song"><b>01.</b> song</div>
  2818. <div id="artist">artist</div>
  2819. <!-- END -->
  2820.  
  2821. </div>
  2822.  
  2823. </div><!-- END OF SPOTIFY -->
  2824.  
  2825. </div><!-- END OF MINICON -->
  2826.  
  2827. </div><!-- END OF TAB-->
  2828.  
  2829. <!------------------ TAB4 END ------------------->
  2830.  
  2831.  
  2832. <!--------------------- TAB5 -------------------->
  2833.  
  2834.  
  2835. <div id="tabz05" class="tabzcon alytut" style="display:none">
  2836. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2837.  
  2838.  
  2839. <div class="profile">
  2840.  
  2841. <div id="lilicons">
  2842. <img src="https://static.tumblr.com/xfpywyf/kjop484c5/j3.png" class="hvr-bounce-in">
  2843. <img src="https://static.tumblr.com/xfpywyf/yK5p484cf/j4.png" class="hvr-bounce-in">
  2844. </div>
  2845.  
  2846. <div id="minicon">
  2847.  
  2848. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2849.  
  2850. <div id="stats">
  2851.  
  2852. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2853.  
  2854. </div>
  2855.  
  2856. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2857.  
  2858. <div id="connections">
  2859.  
  2860. <!-- COPY + PASTE THIS TO ADD MORE -->
  2861. <!-- START -->
  2862. <p><y><img src="http://78.media.tumblr.com/98acb02f61f2ee376aabdee21546e716/tumblr_inline_p3il5mlRmK1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2863.  
  2864. <p><z><img src="https://78.media.tumblr.com/3346e03ac79468da81d41156b9724d50/tumblr_inline_p3kion0X6a1up84fh_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2865. <!-- END -->
  2866.  
  2867. </div>
  2868.  
  2869.  
  2870.  
  2871. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2872.  
  2873. <div id="spotify">
  2874.  
  2875. <!-- COPY + PASTE THIS TO ADD MORE -->
  2876. <!-- START -->
  2877. <div id="song"><b>01.</b> song</div>
  2878. <div id="artist">artist</div>
  2879. <!-- END -->
  2880.  
  2881. </div>
  2882.  
  2883. </div><!-- END OF SPOTIFY -->
  2884.  
  2885. </div><!-- END OF MINICON -->
  2886.  
  2887. </div><!-- END OF TAB-->
  2888.  
  2889. <!------------------ TAB5 END ------------------->
  2890.  
  2891.  
  2892. <!--------------------- TAB6 -------------------->
  2893.  
  2894.  
  2895. <div id="tabz06" class="tabzcon alytut" style="display:none">
  2896. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2897.  
  2898.  
  2899. <div class="profile">
  2900.  
  2901. <div id="lilicons">
  2902. <img src="https://static.tumblr.com/xfpywyf/tqsp484d1/c.png" class="hvr-bounce-in">
  2903. <img src="https://static.tumblr.com/xfpywyf/0Hep484da/c2.png" class="hvr-bounce-in">
  2904. </div>
  2905.  
  2906. <div id="minicon">
  2907.  
  2908. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2909.  
  2910. <div id="stats">
  2911.  
  2912. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2913.  
  2914. </div>
  2915.  
  2916. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2917.  
  2918. <div id="connections">
  2919.  
  2920. <!-- COPY + PASTE THIS TO ADD MORE -->
  2921. <!-- START -->
  2922. <p><y><img src="http://78.media.tumblr.com/8b2c3f01a6253dd202af4382d29abc1b/tumblr_inline_p3kdjaooRt1up84fh_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2923.  
  2924. <p><z><img src="http://78.media.tumblr.com/eed35f92bfbeecbf2cdc69e2fe055239/tumblr_inline_p3keiaaXmS1up84fh_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2925. <!-- END -->
  2926.  
  2927. </div>
  2928.  
  2929.  
  2930.  
  2931. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2932.  
  2933. <div id="spotify">
  2934.  
  2935. <!-- COPY + PASTE THIS TO ADD MORE -->
  2936. <!-- START -->
  2937. <div id="song"><b>01.</b> song</div>
  2938. <div id="artist">artist</div>
  2939. <!-- END -->
  2940.  
  2941. </div>
  2942.  
  2943. </div><!-- END OF SPOTIFY -->
  2944.  
  2945. </div><!-- END OF MINICON -->
  2946.  
  2947. </div><!-- END OF TAB-->
  2948.  
  2949. <!------------------ TAB6 END ------------------->
  2950.  
  2951.  
  2952. <!--------------------- TAB7 -------------------->
  2953.  
  2954.  
  2955. <div id="tabz07" class="tabzcon alytut" style="display:none">
  2956. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  2957.  
  2958.  
  2959. <div class="profile">
  2960.  
  2961. <div id="lilicons">
  2962. <img src="https://static.tumblr.com/xfpywyf/qamp484dx/h.png" class="hvr-bounce-in">
  2963. <img src="https://static.tumblr.com/xfpywyf/f8qp484e5/h2.png" class="hvr-bounce-in">
  2964. </div>
  2965.  
  2966. <div id="minicon">
  2967.  
  2968. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  2969.  
  2970. <div id="stats">
  2971.  
  2972. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  2973.  
  2974. </div>
  2975.  
  2976. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  2977.  
  2978. <div id="connections">
  2979.  
  2980. <!-- COPY + PASTE THIS TO ADD MORE -->
  2981. <!-- START -->
  2982. <p><y><img src="http://78.media.tumblr.com/f28e8ca8a648c0d54e4a348de9650d7c/tumblr_inline_p3il4pCJ9q1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2983.  
  2984. <p><z><img src="http://78.media.tumblr.com/b9631b0e0055053df295e3b0a06e2ceb/tumblr_inline_p3il57mdye1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  2985. <!-- END -->
  2986.  
  2987. </div>
  2988.  
  2989.  
  2990.  
  2991. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  2992.  
  2993. <div id="spotify">
  2994.  
  2995. <!-- COPY + PASTE THIS TO ADD MORE -->
  2996. <!-- START -->
  2997. <div id="song"><b>01.</b> song</div>
  2998. <div id="artist">artist</div>
  2999. <!-- END -->
  3000.  
  3001. </div>
  3002.  
  3003. </div><!-- END OF SPOTIFY -->
  3004.  
  3005. </div><!-- END OF MINICON -->
  3006.  
  3007. </div><!-- END OF TAB-->
  3008.  
  3009. <!------------------ TAB7 END ------------------->
  3010.  
  3011. <!--------------------- TAB8 -------------------->
  3012.  
  3013.  
  3014. <div id="tabz08" class="tabzcon alytut" style="display:none">
  3015. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  3016.  
  3017.  
  3018. <div class="profile">
  3019.  
  3020. <div id="lilicons">
  3021. <img src="https://static.tumblr.com/xfpywyf/ULlp484eq/d5.png" class="hvr-bounce-in">
  3022. <img src="https://static.tumblr.com/xfpywyf/9Qhp484f0/d6.png" class="hvr-bounce-in">
  3023. </div>
  3024.  
  3025. <div id="minicon">
  3026.  
  3027. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  3028.  
  3029. <div id="stats">
  3030.  
  3031. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  3032.  
  3033. </div>
  3034.  
  3035. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  3036.  
  3037. <div id="connections">
  3038.  
  3039. <!-- COPY + PASTE THIS TO ADD MORE -->
  3040. <!-- START -->
  3041. <p><y><img src="http://78.media.tumblr.com/0c659ec5b884003f5c5e8c1bc7cb2df1/tumblr_inline_p3il55S4CB1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3042.  
  3043. <p><z><img src="http://78.media.tumblr.com/3222996e6d6f0e191bfed335fcd0bfc3/tumblr_inline_p3il4jFbEb1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3044. <!-- END -->
  3045.  
  3046. </div>
  3047.  
  3048.  
  3049.  
  3050. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  3051.  
  3052. <div id="spotify">
  3053.  
  3054. <!-- COPY + PASTE THIS TO ADD MORE -->
  3055. <!-- START -->
  3056. <div id="song"><b>01.</b> song</div>
  3057. <div id="artist">artist</div>
  3058. <!-- END -->
  3059.  
  3060. </div>
  3061.  
  3062. </div><!-- END OF SPOTIFY -->
  3063.  
  3064. </div><!-- END OF MINICON -->
  3065.  
  3066. </div><!-- END OF TAB-->
  3067.  
  3068. <!------------------ TAB8 END ------------------->
  3069.  
  3070. <!--------------------- TAB9 -------------------->
  3071.  
  3072.  
  3073. <div id="tabz09" class="tabzcon alytut" style="display:none">
  3074. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  3075.  
  3076.  
  3077. <div class="profile">
  3078.  
  3079. <div id="lilicons">
  3080. <img src="https://static.tumblr.com/xfpywyf/G6mp484fk/d.png" class="hvr-bounce-in">
  3081. <img src="https://static.tumblr.com/xfpywyf/zhYp484fv/d2.png" class="hvr-bounce-in">
  3082. </div>
  3083.  
  3084. <div id="minicon">
  3085.  
  3086. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  3087.  
  3088. <div id="stats">
  3089.  
  3090. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  3091.  
  3092. </div>
  3093.  
  3094. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  3095.  
  3096. <div id="connections">
  3097.  
  3098. <!-- COPY + PASTE THIS TO ADD MORE -->
  3099. <!-- START -->
  3100. <p><y><img src="http://78.media.tumblr.com/aa1bcb73229eebe22ee4375ad0f5a4af/tumblr_inline_p3kdj4Be071up84fh_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3101.  
  3102. <p><z><img src="http://78.media.tumblr.com/d62911fcc770857b16167b59980c1569/tumblr_inline_p3kdj17JeP1up84fh_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3103. <!-- END -->
  3104.  
  3105. </div>
  3106.  
  3107.  
  3108.  
  3109. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  3110.  
  3111. <div id="spotify">
  3112.  
  3113. <!-- COPY + PASTE THIS TO ADD MORE -->
  3114. <!-- START -->
  3115. <div id="song"><b>01.</b> song</div>
  3116. <div id="artist">artist</div>
  3117. <!-- END -->
  3118.  
  3119. </div>
  3120.  
  3121. </div><!-- END OF SPOTIFY -->
  3122.  
  3123. </div><!-- END OF MINICON -->
  3124.  
  3125. </div><!-- END OF TAB-->
  3126.  
  3127.  
  3128. <!------------------ TAB9 END ------------------->
  3129.  
  3130. <!--------------------- TAB10 -------------------->
  3131.  
  3132.  
  3133. <div id="tabz10" class="tabzcon alytut" style="display:none">
  3134. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  3135.  
  3136.  
  3137. <div class="profile">
  3138.  
  3139. <div id="lilicons">
  3140. <img src="https://static.tumblr.com/xfpywyf/h3ep484s1/e3.png" class="hvr-bounce-in">
  3141. <img src="https://static.tumblr.com/xfpywyf/A2Sp484ia/e4.png" class="hvr-bounce-in">
  3142. </div>
  3143.  
  3144. <div id="minicon">
  3145.  
  3146. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  3147.  
  3148. <div id="stats">
  3149.  
  3150. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  3151.  
  3152. </div>
  3153.  
  3154. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  3155.  
  3156. <div id="connections">
  3157.  
  3158. <!-- COPY + PASTE THIS TO ADD MORE -->
  3159. <!-- START -->
  3160. <p><y><img src="http://78.media.tumblr.com/032ed2f75367f7bf52a87e5478e98a33/tumblr_inline_p3il4wURuT1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3161.  
  3162. <p><z><img src="http://78.media.tumblr.com/7d9971881b7f61116ce694e73bda10f9/tumblr_inline_p3il4uvkmn1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3163. <!-- END -->
  3164.  
  3165. </div>
  3166.  
  3167.  
  3168.  
  3169. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  3170.  
  3171. <div id="spotify">
  3172.  
  3173. <!-- COPY + PASTE THIS TO ADD MORE -->
  3174. <!-- START -->
  3175. <div id="song"><b>01.</b> song</div>
  3176. <div id="artist">artist</div>
  3177. <!-- END -->
  3178.  
  3179. </div>
  3180.  
  3181. </div><!-- END OF SPOTIFY -->
  3182.  
  3183. </div><!-- END OF MINICON -->
  3184.  
  3185. </div><!-- END OF TAB-->
  3186.  
  3187. <!------------------ TAB10 END ------------------->
  3188.  
  3189. <!--------------------- TAB11 -------------------->
  3190.  
  3191.  
  3192. <div id="tabz11" class="tabzcon alytut" style="display:none">
  3193. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  3194.  
  3195.  
  3196. <div class="profile">
  3197.  
  3198. <div id="lilicons">
  3199. <img src="https://static.tumblr.com/xfpywyf/Prtp484nn/e.png" class="hvr-bounce-in">
  3200. <img src="https://static.tumblr.com/xfpywyf/OL9p484j1/e2.png" class="hvr-bounce-in">
  3201.  
  3202. </div>
  3203.  
  3204. <div id="minicon">
  3205.  
  3206. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  3207.  
  3208. <div id="stats">
  3209.  
  3210. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  3211.  
  3212. </div>
  3213.  
  3214. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  3215.  
  3216. <div id="connections">
  3217.  
  3218. <!-- COPY + PASTE THIS TO ADD MORE -->
  3219. <!-- START -->
  3220. <p><y><img src="http://78.media.tumblr.com/52c2be7fd1747cc56bc5133ae6d60407/tumblr_inline_p3il51aW0u1ucngpl_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3221.  
  3222. <p><z><img src="http://78.media.tumblr.com/c1797039712542f4d73eccdf0777ffb0/tumblr_inline_p3il5aIhze1ucngpl_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3223. <!-- END -->
  3224.  
  3225. </div>
  3226.  
  3227.  
  3228.  
  3229. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  3230.  
  3231. <div id="spotify">
  3232.  
  3233. <!-- COPY + PASTE THIS TO ADD MORE -->
  3234. <!-- START -->
  3235. <div id="song"><b>01.</b> song</div>
  3236. <div id="artist">artist</div>
  3237. <!-- END -->
  3238.  
  3239. </div>
  3240.  
  3241. </div><!-- END OF SPOTIFY -->
  3242.  
  3243. </div><!-- END OF MINICON -->
  3244.  
  3245. </div><!-- END OF TAB-->
  3246.  
  3247. <!------------------ TAB11 END ------------------->
  3248.  
  3249. <!--------------------- TAB12 -------------------->
  3250.  
  3251.  
  3252. <div id="tabz12" class="tabzcon alytut" style="display:none">
  3253. <span onclick="this.parentElement.style.display='none'" class="tabzclose">x</span>
  3254.  
  3255.  
  3256. <div class="profile">
  3257.  
  3258. <div id="lilicons">
  3259. <img src="https://static.tumblr.com/xfpywyf/27Xp484wo/h3.png" class="hvr-bounce-in">
  3260. <img src="https://static.tumblr.com/xfpywyf/Qffp484x5/h8.png" class="hvr-bounce-in">
  3261. </div>
  3262.  
  3263. <div id="minicon">
  3264.  
  3265. <div id="statstitle"><i class="ion-android-options ic"></i> statistics</div>
  3266.  
  3267. <div id="stats">
  3268.  
  3269. lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum
  3270.  
  3271. </div>
  3272.  
  3273. <div id="connectionstitle"><i class="ion-android-contacts ic"></i> connections</div>
  3274.  
  3275. <div id="connections">
  3276.  
  3277. <!-- COPY + PASTE THIS TO ADD MORE -->
  3278. <!-- START -->
  3279. <p><y><img src="http://78.media.tumblr.com/4481fd5a9cfa952e5ceef44b5cc54671/tumblr_inline_p3keibpJmr1up84fh_540.png"></y> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3280.  
  3281. <p><z><img src="http://78.media.tumblr.com/c066481eb7f794de46f3d7bec4b13d8f/tumblr_inline_p3kdj6PH6B1up84fh_540.png"></z> <b>name:</b> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum </p>
  3282. <!-- END -->
  3283.  
  3284. </div>
  3285.  
  3286.  
  3287.  
  3288. <div id="spotifytitle"><i class="ion-ios-musical-notes ic"></i> spotify</div>
  3289.  
  3290. <div id="spotify">
  3291.  
  3292. <!-- COPY + PASTE THIS TO ADD MORE -->
  3293. <!-- START -->
  3294. <div id="song"><b>01.</b> song</div>
  3295. <div id="artist">artist</div>
  3296. <!-- END -->
  3297.  
  3298. </div>
  3299.  
  3300. </div><!-- END OF SPOTIFY -->
  3301.  
  3302. </div><!-- END OF MINICON -->
  3303.  
  3304. </div><!-- END OF TAB-->
  3305.  
  3306.  
  3307. <!------------------ TAB4 12 ------------------->
  3308.  
  3309. <!-- TABS END -->
  3310.  
  3311.  
  3312. <!-- TABS SCRIPT -->
  3313.  
  3314. <script>
  3315. function openAlytut(evt, alytutName) {
  3316. var i, x, tablinks;
  3317. x = document.getElementsByClassName("alytut");
  3318. for (i = 0; i < x.length; i++) {
  3319. x[i].style.display = "none";
  3320. }
  3321. tablinks = document.getElementsByClassName("tablink");
  3322. for (i = 0; i < x.length; i++) {
  3323. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  3324. }
  3325. document.getElementById(alytutName).style.display = "block";
  3326. evt.currentTarget.className += " tabzact";
  3327. }
  3328. </script>
  3329.  
  3330.  
  3331.  
  3332. <!------- PLEASE DON'T REMOVE THE CREDIT! --------->
  3333.  
  3334. <div class="credit"><a href="http://jcnnie.tumblr.com"><span>theme by <b>jcnnie</b></span><i>=</i></a></div>
  3335.  
  3336.  
  3337.  
  3338.  
  3339. </body>
  3340. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!