API tools faq
paste
Advertisement
aellionios

pink theme; anime

aellionios
Jan 28th, 2017
140
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.96 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. THEME: CLIO
  4. a dashboard-inspired theme
  5. by acuite
  6.  
  7. - don't steal this pls
  8. - enjoy, ilu (ﾉ◕ヮ◕)ﾉ*:･ﾟ✧
  9.  
  10. - @acuite for more themes
  11.  
  12. -->
  13.  
  14. <html>
  15. <head>
  16.  
  17. <script type="text/javascript" src="https://secure.static.tumblr.com/3ikgvxs/0TGl4zgpu/jquery.min.js"></script>
  18. <script type="text/javascript">
  19. $(document).ready(function(){
  20. $(".links_body").hide();
  21. $(".links_head").click(function(){
  22. $(this).next(".links_body").slideToggle('slow');
  23. }); }); </script>
  24.  
  25. <script type="text/javascript"
  26. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  27. <script>
  28. $(document).ready(function() {
  29. //
  30. $('a.poplight[href^=#]').click(function() {
  31. var popID = $(this).attr('rel'); //Get Popup Name
  32. var popURL = $(this).attr('href'); //Get Popup href to define size
  33. var query= popURL.split('?');
  34. var dim= query[1].split('&');
  35. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  36. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  37. var popMargTop = ($('#' + popID).height() + 80) / 2;
  38. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  39. //Apply Margin to Popup
  40. $('#' + popID).css({
  41. 'margin-top' : -popMargTop,
  42. 'margin-left' : -popMargLeft
  43. });
  44. $('body').append('<div id="fade"></div>');
  45. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  46. return false;
  47. });
  48. $('a.close, #fade').live('click', function() {
  49. $('#fade , .popup_block').fadeOut(function() {
  50. $('#fade, a.close').remove(); //fade them both out
  51. });
  52. return false;
  53. });
  54. });
  55. </script>
  56.  
  57.  
  58. <script type="text/javascript" src="https://secure.static.tumblr.com/3ikgvxs/0TGl4zgpu/jquery.min.js"></script>
  59. <script type="text/javascript">
  60. $(document).ready(function(){
  61. $(".links_body").hide();
  62. $(".links_head").click(function(){
  63. $(this).next(".links_body").slideToggle('slow');
  64. }); }); </script>
  65.  
  66. <title>{Title}</title>
  67. <link rel="shortcut icon" href="{Favicon}">
  68. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  69. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  70.  
  71. <meta name="image:Sidebar" content=""/>
  72.  
  73. <meta name="color:Background" content="#f8f8f8"/>
  74. <meta name="color:Post" content="#fff"/>
  75. <meta name="color:Border" content="#eee"/>
  76. <meta name="color:Text" content="#555"/>
  77. <meta name="color:Link" content="#999"/>
  78. <meta name="color:Hover" content="#9cdfed"/>
  79.  
  80. <meta name="if:Tags" content=""/>
  81. <meta name="if:Shadow" content=""/>
  82. <meta name="if:Load More" content=""/>
  83. <meta name="if:Paginate" content=""/>
  84. <meta name="if:Round Edges" content=""/>
  85.  
  86. <meta name="select:Sidebar" content="sideleft" title="Left">
  87. <meta name="select:Sidebar" content="sideright" title="Right">
  88.  
  89. <meta name="select:Captions" content="creg" title="Regular">
  90. <meta name="select:Captions" content="cmin" title="Minimal">
  91. <meta name="select:Captions" content="cinl" title="Inline">
  92. <meta name="select:Captions" content="chid" title="Hide">
  93.  
  94. <meta name="text:Post" content="400"/>
  95. <meta name="text:Sidebar" content="150"/>
  96. <meta name="text:Margin" content="50"/>
  97.  
  98. <meta name="color:Bold" content="#697afc" />
  99. <meta name="color:Italic" content="#697afc"/>
  100. <meta name="color:selection" content="#697afc" />
  101.  
  102. <meta name="text:MP3 Link" content=""/>
  103.  
  104. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  105. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  106. <link href='https://fonts.googleapis.com/css?family=Roboto:400,400italic,500,500italic,700,700italic|PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  107. <style type="text/css">
  108.  
  109. /* Scroll */
  110.  
  111. ::-webkit-scrollbar {width:15px;height:15px;background:{color:Border};}
  112. ::-webkit-scrollbar-thumb {background:rgba({RGBcolor:Link},0.5);}
  113. ::-webkit-scrollbar,::-webkit-scrollbar-thumb {
  114. border:7px solid {color:Background};
  115. }
  116.  
  117. ::-moz-selection { /* Code for Firefox */
  118. color: {color:selection};
  119. background: transparent;
  120. }
  121.  
  122. ::selection {
  123. color: {color:selection};
  124. background: transparent;
  125. }
  126.  
  127. b, strong {
  128. color:{color:Bold};
  129. font-weight:bold;
  130. }
  131.  
  132. i, em {
  133. color:{color:Italic};
  134. font-style:italic;
  135. }
  136.  
  137.  
  138. /* Controls */
  139.  
  140. #tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop{-webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);opacity:0.5;}
  141.  
  142. /* General */
  143.  
  144. body {margin:0;color:{color:Text};background:{color:Background};}
  145. a:link, a:active, a:visited {text-decoration:none;}
  146. body,p,pre,blockquote,big,small,sub,sup {font-size:9.5px;}
  147. body,p,pre,em{font-family:'Roboto',Arial,Helvetica,sans-serif;}
  148. a,.tags,.our_button,.like_button,nav li .fa,nav li {
  149. transition:0.5s ease;
  150. -o-transition:0.5s ease;
  151. -moz-transition:0.5s ease;
  152. -webkit-transition:0.5s ease;
  153. }
  154.  
  155. /* Credit & Scroll to Top */
  156.  
  157. .c,.top{position:fixed;right:30px;width:40px;}
  158. .c {bottom:30px;}
  159. .top {bottom:50px;display:none;}
  160.  
  161. /* Pagination */
  162.  
  163. .cp {font-weight:500;}
  164. .cp,.jp,.pag a{display:inline-block;vertical-align:middle;margin:0 10px;}
  165. .pag a i,.top{font-size:20px;}
  166. .pag {position:relative;}
  167. .load {cursor:pointer;display:block;}
  168. .c,.top,.pag,.load {text-align:center;}
  169. .c,.pag,.load {font-size:9px;letter-spacing:1px;text-transform:uppercase;}
  170. {block:ifnotPaginate}
  171. .pag,#infscr-loading {display:none!important;}
  172. {/block:ifnotPaginate}
  173.  
  174. /* Containers */
  175.  
  176. .center {
  177. position:absolute;
  178. margin-top:0px;
  179. margin-left: 800px;
  180. width:calc({text:Post}px + 2px);
  181. }
  182.  
  183. .entry img{max-width:100%;height:auto;}
  184. .entry {margin:{text:Margin}px 0;overflow:hidden;}
  185.  
  186. /* Sidebar */
  187.  
  188. aside {position:fixed;width:{text:Sidebar}px;top:{text:Margin}px;}
  189. .sideleft{margin-left:calc(-{text:Margin}px + -{text:Sidebar}px + -2px);}
  190. .sideright{margin-left:calc({text:Margin}px + {text:Post}px + 2px);}
  191. .lh,.dh {cursor:help;}
  192. .lb,.desc {display:none;}
  193. .desc {font-size:9px;padding:10px 12px;}
  194. .lb a {display:block;padding:7px;}
  195. .lb a:hover {padding:7px 17px;}
  196. .lb a,nav li .fa {font-size:9px;line-height:100%;}
  197. nav {font-size:0;}
  198. nav li .fa{padding:10px 10px 10px 0;width:10px;text-align:right;}
  199. nav li .fa,nav li a {display:inline-block;vertical-align:middle;}
  200. nav li:hover .fa {color:rgba({RGBcolor:Hover},0.75);}
  201. nav li:hover {padding:0 10px;}
  202. nav ul {list-style-type:none;padding:0;margin:;}
  203. nav li {display:block;padding:0;font-size:0;}
  204. nav li a{
  205. width:calc(100% - 30px);
  206. padding:11px 0 10px 10px;
  207. font-size:8px;
  208. line-height:100%;
  209. letter-spacing:1px;
  210. text-transform:uppercase;
  211. }
  212.  
  213. /* Titles */
  214.  
  215. .sidetop {font-size:0;padding:10px;}
  216. .icon,h1 {display:inline-block;vertical-align:middle;}
  217. .icon {width:30px;margin-right:7px;}
  218. h1 b{display:block;font-size:9px;font-weight:700;margin:0 0 3px;}
  219. h1 {
  220. margin:0;
  221. font-size:8px;
  222. text-transform:uppercase;
  223. letter-spacing:0.5px;
  224. line-height:100%;
  225. font-weight:400;
  226. width:calc(100% - 37px);
  227. }
  228.  
  229. h2 a i {margin-left:2px;}
  230. h2 a{border:0!important;}
  231. h2 {margin:10px;font-size:11px;font-weight:500;}
  232. h3,h4,h5 {margin:10px;font-weight:500;font-size:10px;}
  233.  
  234. /* Quotes */
  235.  
  236. .qut_hold {padding:15px 15px 0;}
  237. .src {margin-bottom:5px;}
  238. .qut {font-size:12px;letter-spacing:0.25px;font-style:italic;}
  239.  
  240. /* Permalinks */
  241.  
  242. .p {margin:15px 15px 13px;font-size:0;}
  243. .ple {width:calc(100% - 30px);font-weight:700;}
  244. .ple,.tags a,.from{
  245. font-size:9px;
  246. line-height:100%;
  247. letter-spacing:0.5px;
  248. text-transform:uppercase;
  249. }
  250.  
  251. .ple,.pri {display:inline-block;vertical-align:middle;}
  252. .pri {text-align:right;width:30px;}
  253. .from {padding:12px 14px;font-size:8px;letter-spacing:0.75px;}
  254. .from i {margin:0 2px;font-size:10px;}
  255. .from b a{color:{color:Text};}
  256. .fa-heart {font-size:10px;}
  257. .fa-retweet {margin-left:5px;font-size:11px;}
  258. .tags {margin:15px 0;}
  259. .tags a {margin-right:5px;font-size:8px;}
  260.  
  261. .custom-like-button *{cursor:pointer!important;}
  262. .custom-like-button {
  263. position:relative;
  264. display:inline-block;
  265. vertical-align:top;
  266. width:10px;
  267. height:10px;
  268. cursor:pointer;
  269. }
  270.  
  271. .like_button:hover + .our_button {color:{color:Hover};}
  272. .like_button.liked + .our_button {color:{color:Hover};}
  273. .like_button iframe {width:100%!important;height:100%!important;}
  274. .like_button {z-index:10;opacity:0;}
  275. .our_button {z-index:1;}
  276. .our_button,.like_button {position:absolute;top:0;left:0;width:100%;height:100%;}
  277.  
  278. /* Audio & Chat */
  279.  
  280. .chat {margin:5px;}
  281. .lines,.chat h2 {padding:0;margin:10px;}
  282. .lines b{font-weight:500;}
  283. .play {padding:10px;background:#e4e4e4;height:27px;width:27px;}
  284. .audio {font-size:0;margin:15px;}
  285. .play,.au {display:inline-block;vertical-align:middle;}
  286. .soundcloud_audio_player{padding:15px 0;}
  287. .tn {text-transform:uppercase;letter-spacing:1px;}
  288. .au span {display:block;margin:3px 0;font-size:9px;}
  289. .au {width:calc(100% - 62px);margin-left:15px;}
  290. .tumblr_audio_player {width:27px;height:27px;overflow:hidden;}
  291.  
  292. /* Text */
  293.  
  294. .entry ol,.entry ul {padding:0 0 0 20px;}
  295. .entry li {margin:5px;}
  296. p,blockquote,pre,.entry ul,.entry ol{margin:10px;}
  297. b,strong {font-weight:500;}
  298. blockquote p{margin:10px 0;}
  299. blockquote p:first-child{margin:0 0 10px;}
  300. blockquote p:last-child{margin:10px 0 0;}
  301. blockquote p:only-child{margin:0;}
  302. blockquote blockquote {margin:0;}
  303. blockquote{padding:0 0 0 10px;border-left:1px solid {color:Border};}
  304. pre {
  305. white-space:pre-wrap;
  306. white-space:-moz-pre-wrap;
  307. white-space:-pre-wrap;
  308. white-space:-o-pre-wrap;
  309. word-wrap:break-word;
  310. }
  311.  
  312. /* Captions */
  313.  
  314. .txt iframe,.cap iframe{display:block;max-width:100%;overflow:hidden;}
  315. .txt,.cap{margin:15px 5px;}
  316. .cmin blockquote {border:0;padding:0;}
  317. .chid {display:none;}
  318. .cinl {margin:15px;}
  319. .cinl *:not(a):not(ul):not(ol):not(li){margin:0;padding:0;display:inline;}
  320. .cinl p:first-of-type {display:inline!important;}
  321. .cinl blockquote {border:0;}
  322. .cinl p,.cinl blockquote p {display:block!important;margin:0!important;}
  323. a.tumblr_blog {border:0!important;font-weight:500;}
  324. .cap a:hover,.txt a:hover {border-color:rgba({RGBcolor:Hover},0.5);}
  325. .cap a,.txt a {
  326. color:{color:Text};
  327. border-bottom:1px solid rgba({RGBcolor:Link},0.5);
  328. }
  329.  
  330. /* Video */
  331.  
  332. .video {overflow:hidden;}
  333. .vine-embed,#youtube_iframe {display:block;}
  334. .instagram-media {border-radius:0!important;box-shadow:none!important;}
  335.  
  336. /* Photosets */
  337.  
  338. #tumblr_lightbox,.tmblr-lightbox {background:rgba({RGBcolor:Background},0.99)!important;}
  339. #vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{opacity:0!important;}
  340. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image,
  341. #tumblr_lightbox_right_image, .lightbox-image {
  342. box-shadow:none!important;
  343. border-radius:0px!important;
  344. {block:ifRoundEdges}border-radius:4px!important;{/block:ifRoundEdges}
  345. }
  346.  
  347. /* Ask */
  348.  
  349. .asktext,.askicon {display:inline-block;vertical-align:top;}
  350. .ask {font-size:0;margin:15px;}
  351. .asktext {padding:15px;border-radius:3px;background:{color:post};border:1px solid {color:Border};width:calc(100% - 76px);font-size:9.5px;line-height:150%;}
  352. .aski {margin:0 0 7px;line-height:100%;font-size:8.5px;text-transform:uppercase;letter-spacing:0.75px;}
  353. .aski b {font-weight:700;}
  354. .askicon {width:35px;border:1px solid {color:Border};border-radius:3px;margin-left:7px;}
  355.  
  356. /* Permalink Page + Postnotes */
  357.  
  358. .pph {text-transform:lowercase;margin-top:-1px;}
  359. .perma {padding:15px;line-height:175%;}
  360. .pmt a:after {content:',';}
  361. .pmt a:last-of-type:after {content:'.';}
  362. .pn ol {margin:0;padding:0;list-style-type:none;}
  363. .pn li{margin:10px;font-size:8.5px;line-height:100%;}
  364. .pn,.pn img{display:none;}
  365. .pn {padding:10px;font-size:0;}
  366. .pnh,.more_notes_link,.notes_loading {display:block;font-weight:500;}
  367. .more_notes_link,.notes_loading {text-align:left!important;}
  368.  
  369. /* Tooltips */
  370.  
  371. #s-m-t-tooltip{
  372. max-width:200px;
  373. margin:15px;
  374. z-index:99999999;
  375. padding:6px;
  376. line-height:100%;
  377. text-align:justify;
  378. }
  379.  
  380. /* Common Styles */
  381.  
  382. .ask,p,blockquote,.lines,.pn,.qut,.desc{line-height:150%;}
  383. a:hover,a h2:hover,nav li:hover a{color:{color:Hover};}
  384. a,.perma,.src,.lines b,.tn,h1,h2,h2 a,.ask,.from{color:{color:Link};}
  385. .pri,.pri a,.from i,nav li .fa{color:rgba({RGBcolor:Link},0.5);}
  386.  
  387. {block:ifRoundEdges}
  388. .play,.aski img,.entry,aside,.icon,#s-m-t-tooltip{border-radius:4px;}
  389. {/block:ifRoundEdges}
  390.  
  391. .from,.ple,.tags a,nav li a,h1,.qut,.load,.aski {
  392. font-family:'PT Sans','Trebuchet MS',sans-serif;
  393. }
  394.  
  395. /* Borders */
  396.  
  397. .pn,nav li,.lb a,.desc,.pph{border-top:1px solid {color:Border};}
  398. .from,.bx {border-bottom:1px solid {color:Border};}
  399. .entry,aside,#s-m-t-tooltip{
  400. background:{color:Post};
  401. border:1px solid {color:Border};
  402. {block:ifShadow}
  403. box-shadow:rgba(0,0,0,0.04)0 2px 4px;
  404. {/block:ifShadow}
  405. }
  406.  
  407. /* Etc */
  408.  
  409. img {margin:0;display:block;}
  410.  
  411. #border {
  412. position: fixed;
  413. bottom:0px;
  414. margin-left:0px;
  415. background-color:#e698a5;
  416. width:150px;
  417. height: 100%;
  418. opacity: .7;
  419. z-index:0;
  420. }
  421.  
  422. /* sidebar */
  423.  
  424. #parentdiv {
  425. position:fixed;
  426. bottom: 60px;
  427. margin-left: 100px;
  428. width: 400px;
  429. height: 400px;
  430. }
  431.  
  432. .one {
  433. position: fixed;
  434. margin-left: 0px;
  435. margin-top: -5px;
  436. width: 100px;
  437. height: 100px;
  438. z-index:99;
  439. }
  440.  
  441. .signature {
  442. position: fixed;
  443. margin-left: 230px;
  444. margin-top: 200px;
  445. width: 100px;
  446. height: 100px;
  447. z-index:99;
  448. }
  449.  
  450. .two {
  451. position: fixed;
  452. margin-left: 40px;
  453. margin-top: 230px;
  454. width: 400px;
  455. height: 100px;
  456. z-index:0;
  457. border: 5px solid {color:post};
  458. }
  459.  
  460. .whodoeswhat {
  461. position:fixed;
  462. margin-left:140px;
  463. margin-top:150px;
  464. width:288px;
  465. height:63px;
  466. background-color:{color:post};
  467. text-align: justify;
  468. font-family:arial;
  469. padding: 8px;
  470. padding-left: 14px;
  471. line-height: 11px;
  472. font-size: 9px;
  473. z-index: 9;
  474. }
  475.  
  476. .statcounter {
  477. position:fixed;
  478. margin-left:100px;
  479. margin-top: 341px;
  480. width:180px;
  481. height:14px;
  482. background-color:{color:post};
  483. text-align: center;
  484. line-height: 9px;
  485. padding-top: 5px;
  486. font-size:8px;
  487. text-transform:uppercase;
  488. }
  489.  
  490. .location {
  491. position:fixed;
  492. margin-left:94px;
  493. margin-top: 361px;
  494. width:180px;
  495. height:18px;
  496. background-color:{color:post};
  497. text-align: center;
  498. line-height: 12px;
  499. padding-top: 5px;
  500. font-size:8px;
  501. text-transform:uppercase;
  502. }
  503.  
  504. .directories{
  505. position:fixed;
  506. margin-left:115px;
  507. margin-top: 9px;
  508. width:335px;
  509. height:15px;
  510. background-color:{color:post};
  511. text-align: center;
  512. line-height: 10px;
  513. padding-top: 5px;
  514. font-size:8px;
  515. text-transform:uppercase;
  516. }
  517.  
  518. .hovers {
  519. position: fixed;
  520. margin-left: 132px;
  521. margin-top: 126px;
  522. width:238px;
  523. height:15px;
  524. padding: 4px;
  525. font-family: arial;
  526. background-color:{color:post};
  527. font-size: 9px;
  528. line-height: 15px;
  529. text-align: right;
  530. word-spacing: 3px;
  531. text-transform: lowercase;
  532. }
  533.  
  534. .links {
  535. position: fixed;
  536. margin-left: 379px;
  537. margin-top: 29px;
  538. width:325px;
  539. height:44px;
  540. padding:0px;
  541. padding-right: 15px;
  542. font-family: arial;
  543. background-color:transparent;
  544. text-align: justify;
  545. font-size: 9px;
  546. line-height: 13px;
  547. opacity:1;
  548.  
  549. }
  550.  
  551. .totop {
  552. width:118px;
  553. height: 0px;
  554. position: fixed; }
  555.  
  556. .totop a {
  557. margin-top: 1px;
  558. text-align: center;
  559. text-shadow: 3px 3px 7px #c9c9c9;
  560. display: inline-block;
  561. float: left;
  562. font-family:arial;
  563. font-size:9px;
  564. height: 23px;
  565. width:71px;
  566. line-height:22px;
  567. color:color:#aaa;;
  568. -webkit-transition: all 0.4s ease-out;
  569. -moz-transition: all 0.4s ease-out;
  570. font-style: normal;
  571. overflow: hidden;
  572. background-color:#fff;
  573. border-radius:0px 00px 18px 18px
  574. border-bottom:1px solid #e698a5;}
  575.  
  576. .totop a:hover{
  577. color:#fff;
  578. text-decoration: none;
  579. -webkit-transition: 0.44s linear;
  580. box-shadow: inset 0px -24px 0px 0px #e698a5;
  581. opacity:1;}
  582.  
  583. .akali {
  584. position: fixed;
  585. margin-left: 135px;
  586. margin-top: 30px;
  587. width:227px;
  588. height:88px;
  589. padding:8px;
  590. padding-top: 3px;
  591. padding-bottom: 4px;
  592. font-family: arial;
  593. background-color:{color:post};
  594. text-align: justify;
  595. font-size: 9px;
  596. line-height: 13px;
  597. opacity:1;
  598. z-index: 0;
  599. }
  600.  
  601.  
  602. /* music */
  603.  
  604. .musicplayer{
  605. overflow:hidden;
  606. position:fixed;
  607. width:20px;
  608. height:20px;
  609. padding:5px;
  610. bottom: 5px;
  611. margin-left: 5px;
  612. background:transparent; /* This is the background color */
  613. z-index:9999999999999999;
  614. opacity:1;
  615. -webkit-transition: all 1s ease-in-out;
  616. -moz-transition: all 1s ease-in-out;
  617. transition: all 1s ease-in-out;
  618. }
  619.  
  620. #icon{
  621. /* This is for the positioning of the music gif: */
  622. margin-top:3px;
  623. margin-left:3px;
  624. opacity:0.7;
  625. -webkit-transition: all 0.5s linear;
  626. -moz-transition: all 0.5s linear;
  627. transition: all 0.5s linear;
  628. }
  629.  
  630. .musicplayer:hover #icon{
  631. margin-top:-20px;
  632. -webkit-transition: all 0.5s linear;
  633. -moz-transition: all 0.5s linear;
  634. transition: all 0.5s linear;
  635. }
  636.  
  637. #musicbox{
  638. width:8px;
  639. height:8px;
  640. overflow:hidden;
  641. /* This is for the positioning of the music player: */
  642. margin-top:11px;
  643. margin-left:6px;
  644. }
  645.  
  646. #music2{
  647. margin-top:-6px;
  648. margin-left:-35px;
  649. border-radius:10em;
  650. }
  651.  
  652. #sbbg:hover #musicplayer{
  653. opacity:0.7;
  654. -webkit-transition: all 1s ease-in-out;
  655. -moz-transition: all 1s ease-in-out;
  656. transition: all 1s ease-in-out;
  657. }
  658.  
  659.  
  660. </style>
  661. </head>
  662. <body>
  663.  
  664. <div id="border"></div>
  665.  
  666. <div id="parentdiv">
  667.  
  668. <div class="one"><img src='http://o.aolcdn.com/hss/storage/fss/9bd2fcd16862c79dcf49425660d39d96/test.png'/></div>
  669. <div class="two"><img src='http://o.aolcdn.com/hss/storage/fss/b677388efd3f047445073310fd353951/theme1.png'/></div>
  670. <div class="signature"><img src='http://o.aolcdn.com/hss/storage/fss/3ddc4ee1ac4b7c275c950d59ac04502b/signature.png'/></div>
  671.  
  672. <div class="whodoeswhat">the underground artist, former tq money maker has gone independent of any label choosing what she wants to do. goes mostly under the name of akali, however, turning herself into a brand. upcoming star of <i><a title="where she plays the main character, the girl who falls in love with jiwon and watches him fall victim to the pressures of idol life.">colors (stripped)</a></i>. still in love with her music, still the problematic fave but seems a little more human now, a little more damaged, and a little more flawed.</div>
  673.  
  674. <div class="statcounter">EST. <b>OCT. 2015</b> // <script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5163425";
  675. var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;
  676. fhs.src = "http://freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&m=0&wh="+w_h+"&a=1&pn="+pn+"";
  677. document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"'></span>");
  678. </script> of <script language="JavaScript">var fhsh = document.createElement('script');var fhs_id_h = "3058827";
  679. fhsh.src = "http://freehostedscripts.net/ocount.php?site="+fhs_id_h+"&name=&a=1";
  680. document.head.appendChild(fhsh);document.write("<span id='h_"+fhs_id_h+"'></span>");
  681. </script>
  682. </div>
  683. <div class="location">LOCATION: <b>SEOUL, SOUTH KOREA</b></div>
  684. <div class="directories"><a href="http://tq-entertainment.tumblr.com/">tqent!</a> - tba - tba</div>
  685.  
  686. <div class="hovers">
  687. <a title="Original Character, Sun Aella ( pronounced eye-luh ). Though she is not Kim Hyuna, nor affiliated with CUBE Entertainment, she is an entertainment muse. She's both a well known underground artist, socialite with many connections in the industry, and also an idol. It's very possible to appoach her as you know her. Though positively or negatively is up to you."> VERSE </a>
  688. <a title="Literate, progressive, novella to one liners. 99% literate. Gif/Icons, I adjust to you."> LITERACY </a>
  689. <a title="NSFW. She is a high functioning alcoholic. Booze, and drugs, and other triggering actions associated with this muse and will be written about as flashbacks as she's on her climb at the moment. You've been warned.">NSFW</a>
  690. <a title="Dating her music, and her fans.">RELATIONS</a>
  691. <a title="Please at least read through her profiles, and her about before interacting with her. There's things you don't have to read, but I've put a lot of effort into this muse, and would appreciate it.">MISC</a>
  692. <a title="Theme by ACUITE. heavily tweaked by yours truly, for me and me alone. Graphics are also done by me. Icon PSD provided to me by 90yoda. Coding used from 90408 with permission. Image credited to those who drew it, I found it on google search. do not steal. questions welcomed. Optimized for Google Chrome.">CREDITS</a></div>
  693.  
  694. <div class="links">
  695. <div class="totop">
  696. <a href="/">home</a>
  697. <a href="/ask">ask</a>
  698. <a href="/submit">submit</a>
  699. <a href="/archive">history</a>
  700. <a href="/navigation">navi</a></div>
  701. </div>
  702.  
  703. <div class="akali"><b>akali</b> (n) - 1) narissitic. 2) troublemaking queen of her own mind, and your problematic fave. 3) rapper with the quick tongue, and quicker wit, freestyles with the best of them. 5) former artist under tq, probably fucked your oppa and your boyfriend. 6) triple threat. 7) now also known as actress sun aella, and the defense against all things. ( for more - <b>ask later</b> )
  704. </div>
  705.  
  706. </div>
  707.  
  708. <div class="musicplayer"><div id="icon">
  709. <img src="https://33.media.tumblr.com/tumblr_m7w2o3N94I1r6o8v2.gif"/>
  710. </div>
  711. <div id="musicbox"><div id="music2">
  712. <object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_multi.swf" width="105" height="25">
  713. <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_multi.swf" />
  714. <param name="bgcolor" value="#e698a5" />
  715. <param name="FlashVars" value="mp3={text:MP3 Link}&amp;width=105&amp;height=25&amp;volume=5&amp;autoplay=1&amp;loop=1&amp;shuffle=1&amp;showslider=0&amp;loadingcolor=e698a5&amp;bgcolor=e698a5&amp;bgcolor1=e698a5&amp;bgcolor2=e698a5&amp;buttoncolor=ffffff&amp;buttonovercolor=ffffff&amp;showlist=0" />
  716. </object></div></div></div>
  717.  
  718. <div class="center">
  719.  
  720. <div id="content">
  721. {block:Posts}
  722. <div class="entry" id="{PostID}">
  723.  
  724. {block:Date}
  725. {block:RebloggedFrom}
  726. <div class="from">
  727. <b><a href="{Permalink}">{Name}</a></b>
  728. <i class="fa fa-retweet"></i>
  729. <a href="{ReblogParentURL}">{ReblogParentName}</a>
  730. </div>
  731. {/block:RebloggedFrom}
  732. {block:NotReblog}
  733. <div class="from">
  734. <b><a href="{Permalink}">{Name}</a></b>
  735. </div>
  736. {/block:NotReblog}
  737. {/block:Date}
  738.  
  739. {block:Text}
  740. <div class="txt">
  741. {block:Title}<h2>{Title}</h2>{/block:Title}
  742. {Body}
  743. </div>
  744. {/block:Text}
  745.  
  746. {block:Link}
  747. <div class="txt">
  748. <h2><a title="{URL}" href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></h2>
  749. {block:Description}{Description}{/block:Description}
  750. </div>
  751. {/block:Link}
  752.  
  753. {block:Photo}
  754. <div class="bx"><a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></a></div>
  755. {/block:Photo}
  756.  
  757. {block:Photoset}
  758. <div class="bx"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div>
  759. {/block:Photoset}
  760.  
  761. {block:Quote}
  762. <div class="qut_hold">
  763. {block:Source}<div class="src">{Source}</div>{/block:Source}
  764. <div class="qut">{Quote}</div>
  765. </div>
  766. {/block:Quote}
  767.  
  768. {block:Chat}
  769. <div class="chat">
  770. {block:Title}<h2>{Title}</h2>{/block:Title}
  771. {block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</div></div>{/block:Lines}
  772. </div>
  773. {/block:Chat}
  774.  
  775. {block:Audio}
  776. <div class="audio">
  777. {block:AudioPlayer}<div class="play">{AudioPlayerGrey}</div>{/block:AudioPlayer}
  778. <div class="au">
  779. {block:TrackName}<span class="tn">{TrackName}</span>{/block:TrackName}
  780. {block:Artist}<span>by {Artist}</span>{/block:Artist}
  781. </div>
  782. </div>
  783. {/block:Audio}
  784.  
  785. {block:Video}
  786. <div class="video">{Video-500}</div>
  787. {/block:Video}
  788.  
  789. {block:Answer}
  790. <div class="ask">
  791. <div class="asktext">
  792. <div class="aski"><b>{Asker}</b> asked:</div>{Question}
  793. </div>
  794. <img class="askicon" src="{AskerPortraitURL-48}">
  795. </div>
  796. <div class="txt">{Answer}</div>
  797. {/block:Answer}
  798.  
  799. {block:Caption}<div class="cap {select:Captions}">{Caption}</div>{/block:Caption}
  800.  
  801. {block:IndexPage}
  802. <div class="p">
  803.  
  804. {block:ifTags}{block:HasTags}<div class="tags">
  805. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  806. </div>{/block:HasTags}{/block:ifTags}
  807.  
  808. <a class="ple" href="{Permalink}">{NoteCountWithLabel}</a>
  809.  
  810. <div class="pri">
  811. <div class="custom-like-button">{LikeButton}
  812. <span class="our_button"><i class="fa fa-heart"></i></span>
  813. </div>
  814. <a href="{ReblogURL}"><i class="fa fa-retweet"></i></a>
  815. </div>
  816. </div>
  817. {/block:IndexPage}
  818.  
  819.  
  820.  
  821. {block:PermalinkPage}
  822. {block:Date}
  823. <div class="pph">
  824. <div class="perma">
  825. posted {TimeAgo} on {DayofMonthWithSuffix} {Month}
  826. {block:RebloggedFrom}<br>
  827. via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp;&nbsp;&nbsp;
  828. source <a href="{ReblogRootURL}">{ReblogRootName}</a>
  829. {/block:RebloggedFrom}
  830.  
  831. {block:HasTags}<div class="pmt">tags: &nbsp;
  832. {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}
  833. </div>{/block:HasTags}
  834. <a href="#" class="pnh">{NoteCountWithLabel}</a>
  835. </div>
  836.  
  837. {block:PostNotes}
  838. <div class="pn">{PostNotes}</div>
  839. {/block:PostNotes}
  840.  
  841. </div>
  842. {/block:Date}
  843. {/block:PermalinkPage}
  844.  
  845. {block:ContentSource}
  846. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  847. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  848. {/block:SourceLogo}
  849. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  850. {/block:ContentSource}
  851.  
  852. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  853.  
  854. </div>
  855. {/block:Posts}
  856.  
  857. {block:ifPaginate}
  858. {block:Pagination}
  859. <div class="pag">
  860. {block:PreviousPage}
  861. <a href="{PreviousPage}"><i class="fa fa-angle-left"></i></a>
  862. {/block:PreviousPage}
  863.  
  864. {block:JumpPagination length="3"}
  865. {block:CurrentPage}
  866. <span class="cp">{PageNumber}</span>
  867. {/block:CurrentPage}
  868. {block:JumpPage}
  869. <a class="jp" href="{URL}">{PageNumber}</a>
  870. {/block:JumpPage}
  871. {/block:JumpPagination}
  872.  
  873. {block:NextPage}
  874. <a href="{NextPage}"><i class="fa fa-angle-right"></i></a>
  875. {/block:NextPage}
  876. </div>
  877. {/block:Pagination}
  878. {/block:ifPaginate}
  879.  
  880. </div>
  881.  
  882. {block:ifnotPaginate}
  883. {block:Pagination}
  884. <div class="pag">
  885. {block:PreviousPage}
  886. <a href="{PreviousPage}" class="prev">back</a>
  887. {/block:PreviousPage}
  888. {block:NextPage}
  889. <a href="{NextPage}" class="next">next</a>
  890. {/block:NextPage}
  891. </div>
  892.  
  893. {block:ifLoadMore}
  894. <a class="load">Load More</a>
  895. {/block:ifLoadMore}
  896. {/block:Pagination}
  897. {/block:ifnotPaginate}
  898.  
  899. </div>
  900.  
  901. <a href="#" class="top"><i class="fa fa-angle-up"></i></a>
  902. <div class="c"><a href="http://acuite.tumblr.com">acuite</a></div>
  903.  
  904. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  905. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  906. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  907. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  908. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  909. <script>
  910. $(document).ready(function(){
  911. $('.photo-slideshow').pxuPhotoset({
  912. lightbox: true,
  913. rounded: false,
  914. gutter: '2px',
  915. photoset: '.photo-slideshow',
  916. photoWrap: '.photo-data',
  917. photo: '.pxu-photo'
  918. });
  919. {block:ifnotPaginate}
  920. var $container = $('#content');
  921. $container.infinitescroll({
  922. itemSelector: '.entry',
  923. navSelector: '.pag',
  924. nextSelector: '.next',
  925. loadingImg: ' ',
  926. loadingText: ' ',
  927. donetext: 'No more posts' ,
  928. bufferPx: 2000,
  929. {block:ifLoadMore}
  930. errorCallback: function(){
  931. jQuery('.load').delay(50).fadeOut();
  932. }
  933. {/block:ifLoadMore}
  934. },
  935. function( newElements ) {
  936. var $newElems = $( newElements );
  937. var $newElemsIDs = $newElems.map(function(){
  938. return this.id;
  939. }).get();
  940. $newElems.find('.photo-slideshow').pxuPhotoset({
  941. lightbox: true,
  942. rounded: false,
  943. gutter: '2px',
  944. photoset: '.photo-slideshow',
  945. photoWrap: '.photo-data',
  946. photo: '.pxu-photo'
  947. });
  948. resizeVideos();
  949. console.log($newElems, $newElemsIDs);
  950. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  951. });
  952.  
  953. {block:ifLoadMore}
  954. $(window).unbind(".infscr");
  955. $(".load").click(function(){
  956. $("#content").infinitescroll("retrieve");
  957. });
  958. {/block:ifLoadMore}
  959.  
  960. {/block:ifnotPaginate}
  961. });
  962.  
  963.  
  964.  
  965. // scroll to top © html-tuts.com
  966. var amountScrolled = 500;
  967. $(window).scroll(function() {
  968. if ($(window).scrollTop() > amountScrolled) {
  969. $('a.top').fadeIn('slow');
  970. } else {
  971. $('a.top').fadeOut('slow');
  972. }
  973. });
  974.  
  975. $('a.top').click(function() {
  976. $('body, html').animate({
  977. scrollTop: 0
  978. }, 'slow');
  979. return false;
  980. });
  981.  
  982.  
  983.  
  984. // drop links & post notes
  985. $(document).ready(function(){
  986. $(".pn").hide();
  987. $(".pnh").show();$('.pnh').toggle(function(){
  988. $(".pn").slideDown(function(){});
  989. },function(){
  990. $(".pn").slideUp(function(){});
  991. });
  992. $(".lb").hide();
  993. $(".lh").show();$('.lh').toggle(function(){
  994. $(".lb").slideDown(function(){});
  995. },function(){
  996. $(".lb").slideUp(function(){});
  997. });
  998. $(".desc").hide();
  999. $(".dh").show();$('.dh').toggle(function(){
  1000. $(".desc").slideDown(function(){});
  1001. },function(){
  1002. $(".desc").slideUp(function(){});
  1003. });
  1004. });
  1005.  
  1006.  
  1007.  
  1008. // tooltips
  1009. (function($){
  1010. $(document).ready(function(){
  1011. $("[title]").style_my_tooltips({
  1012. tip_delay_time:200,
  1013. tip_fade_speed:300
  1014. }
  1015. );
  1016. });
  1017. })(jQuery);
  1018.  
  1019. </script>
  1020. </body>
  1021.  
  1022. </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!