Advertisement
tiffxny21

new starstrucx

Sep 18th, 2019
201
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 60.31 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head><title>{Title}</title>
  3.  
  4. <link rel="shortcut icon" href="{Favicon}"><link rel="alternate" type="application/rss+xml" href="{RSS}">{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  5.  
  6. <link href="https://fonts.googleapis.com/css?family=Dancing+Script|Kaushan+Script|Montserrat|Open+Sans|Raleway|Satisfy" rel="stylesheet">
  7.  
  8. <meta name="image:Background" content="">
  9. <meta name="image:Sidebar" content="">
  10. <meta name="image:minipic1" content="">
  11. <meta name="image:minipic2" content="">
  12.  
  13. <meta name="if:muse tab" content="0"/>
  14. <meta name="if:nav tab" content="0"/>
  15. <meta name="if:bg cover" content="0"/>
  16.  
  17. <meta name="select:accent font" content="kaushan script" title="Kaushan"/>
  18. <meta name="select:accent font" content="dancing script" title="Dancing"/>
  19. <meta name="select:accent font" content="satisfy" title="Satisfy"/>
  20.  
  21. <meta name="select:accent2 font" content="montserrat" title="Montserrat"/>
  22. <meta name="select:accent2 font" content="open sans" title="Open Sans"/>
  23. <meta name="select:accent2 font" content="raleway" title="Raleway"/>
  24.  
  25. <meta name="select:body font" content="times new roman" title="Times"/>
  26. <meta name="select:body font" content="helvetica" title="Helvetica"/>
  27. <meta name="select:body font" content="calibri" title="Calibri"/>
  28. <meta name="select:body font" content="raleway" title="Raleway"/>
  29. <meta name="select:body font" content="open sans" title="Open Sans"/>
  30. <meta name="select:body font" content="montserrat" title="Montserrat"/>
  31.  
  32. <meta name="select:post size" content="fiddy" title="350px"/>
  33. <meta name="select:post size" content="fours" title="400px"/>
  34. <meta name="select:post size" content="fiver" title="540px"/>
  35.  
  36. <meta name="select:container height" content="short" title="Shorter"/>
  37. <meta name="select:container height" content="long" title="Longer"/>
  38.  
  39. <meta name="color:text" content="#000000"/>
  40. <meta name="color:containers" content="#161616"/>
  41. <meta name="color:highlight" content="#dcdcdc"/>
  42. <meta name="color:accent" content="#797979"/>
  43. <meta name="color:accent gradient 1" content="#929292"/>
  44. <meta name="color:accent gradient 2" content="#828282"/>
  45. <meta name="color:main" content="#807c78"/>
  46. <meta name="color:main gradient" content="#9f9b96"/>
  47. <meta name="color:background" content="#c6c5c0"/>
  48. <meta name="color:shadows" content="#836b66"/>
  49.  
  50. <meta name="text:Header" content="header">
  51. <meta name="text:Symbol" content="♛">
  52. <meta name="text:Title" content="title one">
  53. <meta name="text:Title2" content="subtitle one">
  54. <meta name="text:Home URL" content="/">
  55. <meta name="text:Home" content="Home">
  56. <meta name="text:Ask URL" content="/">
  57. <meta name="text:Ask" content="Ask">
  58. <meta name="text:Link 1 URL" content="/">
  59. <meta name="text:Link 1" content="Link 1">
  60. <meta name="text:Link 2 URL" content="/">
  61. <meta name="text:Link 2" content="Link 2">
  62. <meta name="text:Link 3 URL" content="/">
  63. <meta name="text:Link 3" content="Link 3">
  64.  
  65.  
  66. <style type="text/css">
  67.  
  68.  
  69.  
  70. /* GENERAL */
  71.  
  72.  
  73.  
  74. ::-webkit-scrollbar {height:7px;width:5px;background-color:{color:accent};}
  75. ::-webkit-scrollbar-thumb {height:auto;background-color:{color:background};}
  76.  
  77. ::selection {background:{color:accent};color:{color:text};}
  78. ::-moz-selection {background:{color:accent};color:{color:text};}
  79.  
  80. #s-m-t-tooltip { max-width:100px; font:10px arial; margin:15px; padding:5px; border:1px solid {color:accent}; background:{color:highlight}; color:{color:text}; z-index:9; font-weight:600; text-transform:lowercase; box-shadow:2px 2px {color:background}; }
  81.  
  82. {block:IfBGCover} body { font-family: {select:body font}; font-size:12px; color:{color:text}; background:{color:background} url('{image:background}') no-repeat fixed center bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } {/block:IfBGCover}
  83.  
  84. {block:IfNotBGCover}
  85. body {
  86. font-family: {select:body font};
  87. font-size:12px;
  88. color:{color:text};
  89. background:{color:background}
  90. url('{image:background}') no-repeat fixed left top; }
  91. {/block:IfNotBGCover}
  92.  
  93.  
  94.  
  95. /* POST STUFF */
  96.  
  97.  
  98.  
  99. img, iframe { max-width:100%; }
  100.  
  101. blockquote > blockquote { display:inline-block; font-size:10px; background:transparent; border-left:2px solid {color:containers}; margin:10px 20px; }
  102.  
  103. blockquote { border-left:2px solid {color:background}; color:{color:text}; background: {color:main};background: -webkit-linear-gradient(90deg, {color:main gradient}, {color:main}); background: -o-linear-gradient(90deg, {color:main gradient}, {color:main}); background: -moz-linear-gradient(90deg, {color:main gradient}, {color:main}); background: linear-gradient(90deg, {color:main gradient}, {color:main}); margin:10px 20px; padding:5px 15px; overflow:hidden; text-align:justify; }
  104.  
  105. blockquote p, blockquote small, blockquote sub, blockquote span { font-size:12px; }
  106. blockquote img { max-width:70%; height:auto; text-align:center; }
  107.  
  108. code { font-family:{select:accent2 font}; color:{color:text}; text-transform:uppercase; }
  109.  
  110. pre { font-family:arial; text-align:center; margin-top:0px; font-size:10px; max-width:500px; padding:10px; color:{color:background}; font-style:oblique; text-shadow:1px 1px {color:accent}; text-transform:uppercase; overflow:hidden; background: {color:accent}; background: -webkit-linear-gradient(-90deg, {color:accent}, {color:accent gradient 2}); background: -o-linear-gradient(-90deg, {color:accent}, {color:accent gradient 2}); background: -moz-linear-gradient(-90deg, {color:accent}, {color:accent gradient 2}); background: linear-gradient(-90deg, {color:accent}, {color:accent gradient 2}); }
  111.  
  112. h1 { font-family:{select:accent2 font}; text-align:center; margin-top:0px; font-size:10px; max-width:500px; padding:10px; color:{color:highlight}; font-style:oblique; text-shadow:1px 1px {color:accent}; background: {color:main}; background: -webkit-linear-gradient(-90deg, {color:main}, {color:main gradient}); background: -o-linear-gradient(-90deg, {color:main}, {color:main gradient}); background: -moz-linear-gradient(-90deg, {color:main}, {color:main gradient}); background: linear-gradient(-90deg, {color:main}, {color:main gradient}); border-radius:2px; }
  113.  
  114. h2{ font:14px {select:accent2 font} 600; text-align:left; margin-top:0px; max-width:500px; padding:8px 10px 11px 10px; color:{color:text}; text-shadow:1px 1px {color:accent}; background: {color:background}; border-radius:2px; }
  115.  
  116. h3 { font:25px {select:accent font}; padding:0px 10px 0px 10px; border-bottom:1px solid {color:text}; text-shadow:1px 1px {color:text}; margin:0px; height:28px; }
  117.  
  118. a { color:{color:text};text-decoration:none;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; text-transform:lowercase; }
  119.  
  120. a:hover { text-shadow:1px 1px 0px {color:shadows};text-decoration:underline;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; }
  121.  
  122. em, i { text-shadow:1px 1px 1px {color:accent}; }
  123. b, strong { text-shadow:1px 1px 0px {color:shadows}; }
  124.  
  125. small, sup, sub { font-size:12px; vertical-align: baseline; }
  126.  
  127.  
  128.  
  129. /* CONTAINER */
  130.  
  131.  
  132.  
  133. #lorn { position:fixed; margin:0 auto; width:840px; left:60%; margin-top: 70px; z-index:0;}.fiver#lorn { width:835px; margin-left: -415px; }.fours#lorn { width:693px; margin-left: -347px; }.fiddy#lorn { width:644px; margin-left: -322px; }.long#lorn { height:485px; }.short#lorn { height:396px; }
  134.  
  135.  
  136.  
  137. /* SIDEBAR */
  138.  
  139.  
  140.  
  141. #dan { width:145px; background-color:{color:containers}; margin-top:34px; margin-left:15px; padding:20px; position:absolute; }.long#dan { height:395px; }.short#dan { height:307px; }
  142.  
  143. .symbol { position:absolute;color:{color:highlight};font-size:30px;margin-left:52px;margin-top:-40px;-ms-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); transform: rotate(-20deg);z-index:8; }
  144.  
  145. .pap { position:absolute;width:145px;height:55px;margin-left:0px;margin-top:0px;z-index:5;opacity:1; }
  146.  
  147. .pap1 img { position:absolute; width:70px; height:70px; margin-left:37.5px;left: 0;top: 0;z-index:6;}
  148.  
  149. .mini1 img { position:absolute; margin-top:20px; margin-left:10px; width:50px; height:50px;-ms-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); transform: rotate(-10deg); box-shadow:-3px -3px 0px {color:accent}; }
  150.  
  151. .mini2 img { position:absolute; margin-top:20px; margin-left:85px; width:50px; height:50px;-ms-transform: rotate(10deg); -webkit-transform: rotate(10deg); transform: rotate(10deg); box-shadow:3px -3px 0px {color:accent}; }
  152.  
  153. .tit { position:absolute; z-index:7; width:185px; text-align:center; margin-top:50px; font: 25px {select:accent font}; margin-left:-20px;text-shadow:1px 1px {color:main};height:37px;overflow:hidden; word-wrap:nowrap;} .tit::before { content: "≽ "; color:{color:highlight}; text-shadow:1px 1px {color:containers}; } .tit::after { content: " ≼"; color:{color:highlight}; text-shadow:1px 1px {color:containers}; }
  154.  
  155. .undertit { position:absolute; z-index:6; width:145px; text-align:center; margin-top:74px; font: 15px {select:accent2 font}; margin-left:0px; color:{color:text}; }
  156.  
  157. #keew_box { position:fixed;overflow:hidden;width:145px;margin-left:0px;margin-top:55px;opacity:1;text-align:justify;font-family:{select:body font};font-size:9px;color:{color:text};background: {color:main gradient};background: -webkit-radial-gradient({color:main gradient}, {color:main gradient}, {color:main});background: -o-radial-gradient({color:main gradient}, {color:main gradient}, {color:main});background: -moz-radial-gradient({color:main gradient}, {color:main gradient}, {color:main});background: radial-gradient({color:main gradient}, {color:main gradient}, {color:main}); z-index:2; }.long#keew_box { height:280px; }.short#keew_box { height:192px; }
  158.  
  159. #keew2 { overflow-y:scroll;overflow-x:hidden;width:130px;margin-left:0px;margin-top:40px;padding:10px;opacity:1;text-align:justify;font-family:{select:body font};font-size:9px;color:{color:text};line-height:180%; } .long#keew2 { height:211px; }.short#keew2 { height:123px; }
  160.  
  161. #links { position:absolute;width:145px;height:20px;margin-left:0px;text-align:center;z-index:3;margin-bottom:0px;padding:0px; }.long#links {margin-top:346px;}.short#links {margin-top:258px;}
  162.  
  163. #links a { display: inline-block; width:20px; height:20px; -webkit-perspective: 1000px;-moz-perspective: 1000px;perspective: 1000px; -webkit-transition: -webkit-transform .8s ease-in-out;transition: transform .8s ease-in-out;background: {color:accent gradient 2}; background: -webkit-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1});background: -o-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); background: -moz-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); background: linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); }
  164.  
  165. #links a:hover { -webkit-transform:rotate(360deg);transform:rotate(360deg); }
  166.  
  167. #links table { width:157px;padding:0px;text-align:left;border-spacing: 0px;border-collapse: collapse; }
  168.  
  169. #links tr, th { padding:0px;text-align:left; }
  170.  
  171. #na { position:absolute; width:145px; height:20px; padding-top:1px; padding-bottom:1px; z-index:3; text-align:center; background: {color:background}; border-radius:2px; line-height:20px; }
  172.  
  173. .long#na {margin-top:377px;}.short#na {margin-top:289px;}
  174.  
  175. #na a { display:inline-block;font-family:{select:body font};font-weight:normal;text-decoration:none;text-transform:lowercase;line-height:140%;color:{color:text};text-shadow:1px 1px {color:accent};letter-spacing:2px;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;z-index:4; }
  176.  
  177. #na a:hover{ text-decoration:none;text-shadow:1px 1px 3px {color:background};-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; }
  178.  
  179.  
  180.  
  181. /* TABS & NAV */
  182.  
  183.  
  184.  
  185. #tabs { position:absolute; margin-left:180px;margin-top:-20px;background-color:{color:containers};overflow:hidden;padding:20px; }
  186.  
  187. .fiver#tabs { width:565px; }.fours#tabs { width:425px; }.fiddy#tabs { width:375px; }.long#tabs { height:395px; }.short#tabs { height:307px; }
  188.  
  189. #kemthit { position:absolute; margin-left:217px;margin-top:41px;background-color:{color:containers};overflow:hidden;padding:15px;color:{color:highlight}; }
  190.  
  191. .fiver#kemthit { width:573px; margin-left:215px; }.fours#kemthit { width:420px; }.fiddy#kemthit { width:370px; }.long#kemthit { height:395px; }.short#kemthit { height:305px; }
  192.  
  193. .th { width:175px;text-align:center;margin-top:0px;height:60px;overflow:hidden; }
  194.  
  195. .fiver#link_boxes {margin-top:0px;margin-left:25px;}.fours#link_boxes {margin-top:0px;margin-left:15px;}.fiddy#link_boxes {margin-top:0px;margin-left:5px;}
  196.  
  197. .fiver#box1 { width:166px;position:absolute; }.fours#box1 { width:190px;position:absolute; }.fiddy#box1 { width:175px;position:absolute; }.fiver#box2 { width:167px;margin-left:181px;position:absolute; }.fours#box2 { width:190px;margin-left:210px;position:absolute; }.fiddy#box2 { width:175px;margin-left:193px;position:absolute; }.fiver#box3 { width:167px;margin-left:363px;position:absolute; }.fours#box3 { display:none;}.fiddy#box3 { display:none;}
  198.  
  199. .fiver#textbox1 {position:absolute; margin-top: 115px;width:270px;margin-left:-17px;}.fours#textbox1 {position:absolute; margin-top: 115px;width:197px;margin-left:-7px;}.fiddy#textbox1 {position:absolute; margin-top: 115px;width:372px;margin-left:-2px;}.fiver#textbox2 {position:absolute; margin-top: 115px; width:270px;margin-left:273px;}.fours#textbox2 {position:absolute; margin-top: 115px; width:197px;margin-left:210px;}.fiddy#textbox2 {display:none;}
  200.  
  201. #navlinks a { padding:2px;margin-top:5px; font:9px {select:accent2 font}; font-style:oblique; text-decoration:none; text-transform:uppercase; display: inline-block; margin-right:5px; width:20px; height:16px;padding-top:4px; color:{color:accent gradient 2};overflow:hidden; -webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out; border-radius:100%;background: {color:accent gradient 2}; background: -webkit-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1});background: -o-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); background: -moz-linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); background: linear-gradient(20deg, {color:accent gradient 2}, {color:accent gradient 1}); }
  202.  
  203. #navlinks a:hover { background: {color:accent gradient 2}; background: -webkit-linear-gradient(20deg, {color:accent gradient 2}, {color:main});background: -o-linear-gradient(20deg, {color:accent gradient 2}, {color:main}); background: -moz-linear-gradient(20deg, {color:accent gradient 2}, {color:main}); background: linear-gradient(20deg, {color:accent gradient 2}, {color:main}); }
  204.  
  205. #navlinks th, tr { padding-left:5px; }
  206.  
  207. .fiver#navlinks table { width:90px;border-collapse: collapse;margin-left:15px; }.fours#navlinks table { width:90px;border-collapse: collapse;margin-left:28px; }.fiddy#navlinks table { width:90px;border-collapse: collapse;margin-left:20px; }
  208.  
  209. #inspo { padding:15px; overflow-y:auto; overflow-x:hidden; background: {color:accent gradient 2}; background: -webkit-linear-gradient(20deg, {color:accent gradient 2}, {color:main});background: -o-linear-gradient(20deg, {color:accent gradient 2}, {color:main}); background: -moz-linear-gradient(20deg, {color:accent gradient 2}, {color:main}); background: linear-gradient(20deg, {color:accent gradient 2}, {color:main}); margin-top:-10px; text-align:justify; }
  210.  
  211. .fiver#inspo { width:240px; }.fours#inspo { width:167px; }.fiddy#inspo { width:342px; }.long#inspo { height:217px; }.short#inspo { height:130px; }
  212.  
  213.  
  214.  
  215. /* MUSES PAGE */
  216.  
  217.  
  218.  
  219. #tua { position:absolute; overflow-y:auto; overflow-x:hidden; margin-left:215px;margin-top:34px; background-color:{color:container}; padding:15px;color:{color:highlight}; } #tua h1 { text-transform:lowercase; font:15px {select:accent font}; }
  220.  
  221. .fiver#tua { width:575px; }.fours#tua { width:435px; }.fiddy#tua { width:385px; }.long#tua { height:405px; }.short#tua { height:317px; }
  222.  
  223. #sort a {-webkit-transition: all .6s ease-out; -moz-transition: all .6s ease-out; transition: all .6s ease-out;display:inline-block; padding:5px 10px;margin:0 5px;font:11px Montserrat;text-transform:uppercase;} #sort a:hover {-webkit-transition: all .6s ease-out;-moz-transition: all .6s ease-out;transition: all .6s ease-out;}#sort li {display:inline;list-style: none;} #sort ul {list-style: none;}
  224.  
  225. #muses { width:100%; text-align: center; margin-top:20px; }
  226.  
  227. #noi { display:inline-block; padding:10px;] }
  228.  
  229. .musname { display:block; width:76px; background-color:{color:text}; color:{color:background}; text-align:center; font-size:9px; font-family:{select:accent2 font}; font-weight:600; text-transform:uppercase; padding:2px; font-style:italic; }
  230. .musimg img { width:80px; height:80px; }
  231.  
  232. .muslinks { margin:-10px 0px 0px 32px; text-align:right; position:absolute; }
  233.  
  234. .muslinks a.button { width:10px; height:10px; border-radius:100%; display: inline-block; background-color:{color:highlight}; border:3px double {color:accent};transition: transform 0.25s; } .muslinks a.button:hover { background-color:{color:accent}; border:3px double {color:text}; } .muslinks a.button.active { transform: rotate(135deg); transition: transform 0.5s; }
  235.  
  236. .muslinks a.nobutton { width:10px; height:10px; border-radius:100%; display: inline-block; background-color:{color:highlight}; border:3px double {color:accent};transition: transform 0.25s; } .muslinks a.nobutton:hover { background-color:{color:accent}; border:3px double {color:text}; }
  237.  
  238. .popper { position: fixed; visibility: hidden; overflow: hidden; opacity:0; width:320px; height:150px; left:50%; margin-left:-80px; margin-top: 200px; padding: 20px 15px; transform: translateY(50px); transition: all 0.5s; background-color:{color:main}; z-index: 99999; }
  239.  
  240. .popper.active { opacity:1; visibility: visible; transform: translateY(0px); -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
  241.  
  242. .img-replace { display: inline-block; overflow: hidden; text-indent: 100%; color: transparent; white-space: nopopper; }
  243.  
  244. .close { position: absolute; top:-3px; right:3px; width: 20px; height: 20px; } .close::before, .close::after { content: ''; position: absolute; top: 12px; width: 10px; height: 2px; background-color: {color:highlight}; } .close::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: 8px; } .close::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); right: 2px; }
  245.  
  246. .content table { width:100%; border-collapse: collapse; }
  247. .infotit { width:130px; height:100px; } .infotit h2 { padding:0px 5px; border-radius:0px; font-size:15px; font-family:{select:accent font}; height:14px; line-height:80%; background:transparent;margin-top:-5px; text-align:right;border-bottom:1px solid {color:text}; }
  248.  
  249. .infolinks { margin-top:-5px; height:30px; overflow:hidden; width:130px; text-align:center; } .infolinks a { display:inline-block; width:20px; height:20px; background:{color:accent}; } .infolinks a:hover { background-color:{color:text}; -ms-transform: scale(0.8); -webkit-transform: scale(0.8); transform: scale(0.8); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
  250.  
  251. .infotit ul { list-style:none; padding:0px 3px 0px 0px; font-size:10px; margin-top:-12px; height:103px; overflow:auto; line-height:100%; } .infotit b { font-family:{select:accent2 font}; line-height:170%; text-transform:uppercase; text-shadow:none; font-weight:600; background:{color:text}; color:{color:highlight}; padding:1px; margin-right:3px; }
  252.  
  253. .infoimg { width:175px; margin-top:-100px; margin-left:142px; text-align:justify; } .infoimg td { text-align:center; } .infoimg img { width:50px; height:50px;box-shadow:0px 0px 5px {color:accent}; }
  254.  
  255. .about { width:180px; margin-left:136px; height:90px; overflow-y:auto; overflow-x:hidden; text-align:justify; padding:5px; pointer-events:all; }
  256.  
  257. .yu { width: 100%;display: inline-block;font-size: 0;line-height: 0; }
  258.  
  259.  
  260.  
  261. /* POSTS GENERAL */
  262.  
  263.  
  264.  
  265. #chob { position:absolute; overflow:auto; margin-left:-20px;margin-top:-20px;background-color:{color:containers}; overflow-x:hidden; padding:20px; }.long#chob { height:395px; } .short#chob { height:307px; }
  266.  
  267. #pid { width:540px;padding:10px;padding-bottom:10px;color:{color:text};z-index:3;background: {color:accent};background: -webkit-radial-gradient({color:accent}, {color:accent}, {color:accent gradient 2});background: -o-radial-gradient({color:accent}, {color:accent}, {color:accent gradient 2});background: -moz-radial-gradient({color:accent}, {color:accent}, {color:accent gradient 2});background: radial-gradient({color:accent}, {color:accent}, {color:accent gradient 2}); }.fiver#pid { width:540px; }.fours#pid { width:400px; }.fiddy#pid { width:350px; }
  268.  
  269. #pid a { font:13px {select:accent font}; color:{color:text}; line-height:100%; }
  270.  
  271. #pid img { max-width: 100%; }
  272.  
  273. #foot { display:block;padding:6px 10px 7px 10px;font: 11px {select:body font};font-style:italic;text-align:right;color:{color:text};background-color:{color:background};margin-top:0px;margin-bottom:30px;margin-left:0px;width:540px;max-height:12px;transition: max-height 0.8s ease-out; border-radius:0px 0px 2px 2px; }.fiver#foot { width:540px; }.fours#foot { width:400px; }.fiddy#foot { width:350px; }
  274.  
  275. #foot a { color:{color:text};-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; }
  276.  
  277. #foot a:hover { color:{color:accent};text-shadow:none;text-decoration:none;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; }
  278.  
  279. .tags { text-align:center; opacity:0;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;-o-transition:all 0.5s ease-out;transition:all 0.5s ease-out; }
  280.  
  281. .tags b { color:{color:text}; }
  282. .tags a { display:inline-block; margin-right:5px; color:{color:accent}; }
  283. .tags a:hover { display:inline-block; margin-right:5px; color:{color:text}; }
  284.  
  285. #foot:hover { max-height:100px; transition: max-height 0.8s ease-in; }
  286. #foot:hover .tags { opacity:1;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;transition:all 1s ease-in-out; }
  287.  
  288.  
  289.  
  290. /* POSTS TYPES */
  291.  
  292.  
  293.  
  294. .pid_pap { display:block;padding:5px;text-align:center;font-family:{select:body font};text-transform:uppercase;font-style:italic; }
  295.  
  296. .krathu { display:block;padding:5px;text-align:justify;color:{color:text}; }
  297.  
  298. .ing { display:block;padding:10px;text-align:center;font-size:20px;font-family:'cambria';font-style:italic;border-top:5px solid {color:background};color:{color:text};background-color:{color:main}; }
  299.  
  300. .ang { padding:5px; text-align:right;line-height:100%; } .ang p { margin:0; }
  301.  
  302. .chat { overflow: hidden;list-style-type: none;padding: 0;margin: 0;}.chat li{margin:0 0 5px;border-radius:5px;padding:5px 10px;max-width:75%;clear:both;position:relative;}.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:{color:main};color:{color:background};left:3px}.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-5px;bottom:0;width:5px;height:10px;border-right:5px solid {color:main};border-bottom-right-radius:10px 5px}.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:{color:containers};color:{color:background}}.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-5px;bottom:0;width:5px;height:10px;border-left:5px solid {color:containers};border-bottom-left-radius:10px 5px}
  303.  
  304. .label b,strong,i,em { text-shadow:none; text-transform:uppercase; font:10px {select:accent2 font}; font-weight:800; color:{color:text}; }
  305.  
  306. .aud {height:50px;padding:0 0 0 40px;}
  307.  
  308. .audioimg {margin:-23px 0px 0px -40px;} .audioimg img { width:40px; height:40px; box-shadow:3px 3px {color:text}; -ms-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); transform: rotate(-10deg); position:absolute; }
  309.  
  310. .audiotitles { color:{color:text};margin-top:-10px; margin-left:15px; } .audioname { font:20px {select:accent font}; color:{color:main};text-shadow:1px 1px {color:text};text-transform:lowercase;overflow:visible;text-indent:3px;z-index:999; } .audioartist { text-align:left;font-family:{select:accent2 font};text-transform:uppercase; border-top:1px solid {color:text};padding-top:5px;margin-top:-7px; }
  311.  
  312. .audioplayer { position:absolute; width:27px; overflow:hidden; margin-left:-33px;margin-top:5px; }
  313.  
  314. .question { display:block;text-align:justify;margin-top:-12px;font-size:12px;font-family:{select:body font};font-style:normal;width:100%;padding:0px;color:{color:text};background-color:{color:background};} .question p { padding:20px; }
  315.  
  316. .asker { text-transform:lowercase;font-style:oblique;display:block;text-align:right;padding-right:10px;padding-top:5px;padding-bottom:12px;height:20px;background-color:{color:main};overflow:hidden;z-index:4; }
  317.  
  318. .askertext { font-size: 12px; line-height:180%; text-align: right; font-family:{select:accent2 font}; font-style: oblique;color:{color:highlight};text-shadow:2px 2px {color:accent}; }
  319.  
  320. .askertext a { font-size: 12px; line-height:100%; text-align: right; font-family:{select:accent2 font}; font-style: oblique;color:{color:highlight};text-shadow:2px 2px {color:accent}; } .askertext a:hover { text-decoration:none; }
  321.  
  322. .notes { font-family:{select:body font};text-align:center;text-transform:uppercase;font-size:10px;width:520px;margin-left:-30px;margin-top:20px;color:{color:highlight};background-color:transparent; }
  323.  
  324. .notes a { color:{color:main} }
  325.  
  326. .notes li { list-style-type:none;background-color:transparent;padding:5px; }
  327.  
  328. .notes img { opacity:0;display:none; }
  329.  
  330. .yingkun { text-align:center; font:15px {select:accent font}; }
  331. .yingkun span { display:inline-block;position: relative; }
  332. .yingkun span:before, .yingkun span:after { content: ""; border-bottom: 1px solid {color:highlight}; height:3px; position:absolute; top:10px; width:200px; }
  333. .yingkun span:before { right: 100%; margin-right:15px; }
  334. .yingkun span:after { left: 100%; margin-left:15px; }
  335.  
  336. #keew2 em, i { text-shadow:1px 1px 1px {color:accent}; font-family:{select:body font}; font-style:oblique; text-transform:none; font-weight:600; } #keew2 h3 { text-shadow:1px 1px 1px {color:accent}; font-style:italic; font-weight:600; padding-top:5px; }
  337.  
  338. #inspo em, i { text-shadow:1px 1px 1px {color:accent}; font-family:{select:body font}; font-style:oblique; text-transform:none; font-weight:400; }
  339.  
  340.  
  341.  
  342. /* CREDIT */
  343.  
  344.  
  345.  
  346. #credit { position:fixed;font-family:{select:body font};color:{color:accent};background-color:{color:text};right:10px;bottom:10px;padding:5px;opacity:1;border:2px solid {color:background}; }
  347.  
  348. #credit a { color:{color:background};text-transform:uppercase; }
  349.  
  350.  
  351. </style>
  352.  
  353. </head>
  354. <body>
  355.  
  356.  
  357. <div id="lorn" class="{select:post size} {select:container height}">
  358.  
  359.  
  360.  
  361. <!-- SIDEBAR -->
  362.  
  363.  
  364.  
  365. <div id="dan" class="{select:container height}">
  366.  
  367. <div class="pap">
  368. <div class="pap1"><img src="{image:sidebar}"></div>
  369. <div class="mini1"><img src="{image:minipic1}"></div>
  370. <div class="mini2"><img src="{image:minipic2}"></div>
  371. </div>
  372. <div class="symbol">{text:symbol}</div>
  373. <div class="tit">{text:Title}</div>
  374. <div class="undertit">{text:Title2}</div>
  375. <div id="keew_box" class="{select:container height}">
  376. <pre style="margin-top:-2px;position:fixed;width:102px;
  377. margin:10px 0px 0px 11px;"> </pre>
  378. <div id="keew2" class="{select:container height}">
  379. {Description}
  380. </div>
  381. </div>
  382.  
  383. <div id="links" class="{select:container height}"><table><tr>
  384. <th><a href="{text:Home URL}" title="{text:Home}"></a></th>
  385. <th><a href="{text:Ask URL}" title="{text:Ask}"></a></th>
  386. <th><a href="{text:Link 1 URL}" title="{text:Link 1}"></a></th>
  387. {block:IfMuseTab}
  388. <th><a href="javascript:void(0)" onclick="openTab('tua')"
  389. title="muses"></a></th>
  390. {/block:IfMuseTab}
  391. {block:IfNotMuseTab}
  392. <th><a href="{text:Link 2 URL}" title="{text:Link 2}"></a></th>
  393. {/block:IfNotMuseTab}
  394. {block:IfNavTab}
  395. <th><a href="javascript:void(0)" onclick="openTab('kemthit')"
  396. title="navigate"></a></th>
  397. {/block:IfNavTab}
  398. {block:IfNotNavTab}
  399. <th><a href="{text:Link 3 URL}" title="{text:Link 3}"></a></th>
  400. {/block:IfNotNavTab}
  401. </tr></table></div>
  402.  
  403. <div id="na" class="{select:container height}">{block:Pagination}
  404. {block:PreviousPage}<a href="{PreviousPage}">back</a>
  405. {/block:PreviousPage} //
  406. {block:NextPage} <a href="{NextPage}">next</a>
  407. {/block:NextPage}
  408. {/block:Pagination}</div>
  409.  
  410.  
  411.  
  412. <!-- POSTS -->
  413.  
  414.  
  415.  
  416. <div id="tabs" class="{select:post size} {select:container height}">
  417. <div id="chob" class="tab {select:container height}">{block:Posts}
  418. <div id="pid" class="{select:post size}">
  419.  
  420. {block:Text} {block:Title} <div class="pid_pap"> {Title}
  421. </div> {/block:Title} <div class="krathu"> {Body} </div>
  422. {/block:Text}
  423.  
  424. {block:Photo} <div class="photo"><img src="{PhotoURL-HighRes}"
  425. alt="{PhotoAlt}" style="width:540px;"></div> {block:Caption}
  426. <div class="krathu">{Caption}</div>{/block:Caption}
  427. {/block:Photo}
  428.  
  429. {block:Photoset} <div class="photo">{Photoset}</div> {block:Caption}
  430. <div class="krathu">{Caption}</div>{/block:Caption}
  431. {/block:Photoset}
  432.  
  433. {block:Quote} <div class="ing">"{Quote}"</div> {block:Source}
  434. <div class="ang">{Source}</div>{/block:Source}
  435. {/block:Quote}
  436.  
  437. {block:Link} <div class="pid_pap"> <a href="{URL}">{Name} &rarr;</a>
  438. </div> {block:Description} <div class="krathu"> {Description} </div>
  439. {/block:Description}
  440. {/block:Link}
  441.  
  442. {block:Chat} {block:Title}<div class="pid_pap">{Title}</div>
  443. {/block:Title} <ul class="chat">{block:Lines}
  444. <li class="line_{Alt} user_{UserNumber}"> {block:Label}
  445. <span class="label"><strong>{Label}</strong></span> {/block:Label}
  446. {Line}</li>{/block:Lines} </ul>
  447. {/block:Chat}
  448.  
  449. {block:Audio} <table style="margin:5px;" class="aud"><tr><td>
  450. <div class="audioimg"> {block:AlbumArt} <img src="{AlbumArtURL}"/>
  451. {/block:AlbumArt} </div> <div class="audioplayer"> {AudioPlayerBlack}
  452. </div></td><td> <div class="audiotitles"> {block:TrackName}
  453. <div class="audioname">{TrackName}</div> {/block:TrackName}
  454. {block:Artist} <div class="audioartist">by {Artist}</div>
  455. {/block:Artist} </div> </td></tr></table> {block:Caption}
  456. <div class="krathu"> {Caption} </div> {/block:Caption}
  457. {/block:Audio}
  458.  
  459. {block:Video} <div class="pid_pap">{block:ContentSource}
  460. <a href="{SourceURL}">watch video &rarr;</a>{/block:ContentSource}
  461. </div><div class="photo" align="center"> {VideoEmbed-500} </div>
  462. {block:Caption} <div class="krathu"> {Caption} </div> {block:Caption}
  463. {/block:Video}
  464.  
  465. {block:Answer} <div id="answer"> <div class="asker">
  466. <div class="askertext"> {Asker} </div> </div> <div class="question">
  467. <p>{Question}</p> </div></div> {Answer}
  468. {/block:Answer}
  469.  
  470. {block:More} <p class="yingkun"> <a href="{Permalink}#more"><span>
  471. delve deeper</span></a></p> <a name="more"></a>
  472. {/block:More}
  473.  
  474. </div>
  475.  
  476. <div id="foot" class="{select:post size}">
  477.  
  478. {block:Date}
  479. <a href="{Permalink}" style="text-transform:capitalize">
  480. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} </a> |
  481. <a href="{Permalink}" style="text-transform:capitalize">
  482. {12Hour}:{Minutes}{CapitalAmPm} </a>
  483. {/block:Date}
  484. {block:PostNotes} | <a href="{Permalink}"> {NoteCountWithLabel}
  485. </a> {/block:PostNotes}
  486. {block:ContentSource} | <a href="{SourceURL}">source.</a>
  487. {/block:ContentSource} {block:RebloggedFrom} &
  488. <a href="{ReblogParentURL}"> via.</a>
  489. {/block:RebloggedFrom}
  490.  
  491. <br> {block:HasTags} <div class="tags"> {block:Tags}
  492. <a href="{TagURL}"> <b>#</b> {Tag}</a> {/block:Tags} </div>
  493. {/block:HasTags}
  494.  
  495. </div>
  496.  
  497. {block:PostNotes} <div id="notes"> {PostNotes} </div>
  498. {/block:PostNotes}
  499.  
  500. {/block:Posts}
  501. </div>
  502. </div>
  503. </div>
  504.  
  505.  
  506.  
  507. <!-- NAVIGATION -->
  508.  
  509.  
  510. {block:IfNavTab}
  511. <div id="kemthit"
  512. class="tab {select:post size} {select:container height}"
  513. style="display:none;">
  514. <div id="link_boxes" class="{select:post size}">
  515.  
  516. <div id="box1" class="{select:post size}">
  517. <h1> LINK BOX 1 TITLE </h1>
  518. <div id="navlinks" class="{select:post size}"><table><tr>
  519. <th><a href="/" title="TEXT"></a></th>
  520. <th><a href="/" title="TEXT"></a></th>
  521. <th><a href="/" title="TEXT"></a></th>
  522. <th><a href="/" title="TEXT"></a></th></tr>
  523. <tr><th><a href="/" title="TEXT"></a></th>
  524. <th><a href="/" title="TEXT"></a></th>
  525. <th><a href="/" title="TEXT"></a></th>
  526. <th><a href="/" title="TEXT"></a></th></tr></table>
  527. </div>
  528. </div>
  529.  
  530. <div id="box2" class="{select:post size}">
  531. <h1> LINK BOX 2 TITLE </h1>
  532. <div id="navlinks" class="{select:post size}"><table><tr>
  533. <th><a href="/" title="TEXT"></a></th>
  534. <th><a href="/" title="TEXT"></a></th>
  535. <th><a href="/" title="TEXT"></a></th>
  536. <th><a href="/" title="TEXT"></a></th></tr>
  537. <tr><th><a href="/" title="TEXT"></a></th>
  538. <th><a href="/" title="TEXT"></a></th>
  539. <th><a href="/" title="TEXT"></a></th>
  540. <th><a href="/" title="TEXT"></a></th></tr></table>
  541. </div>
  542. </div>
  543.  
  544. <div id="box3" class="{select:post size}">
  545. <h1> LINK BOX 3 TITLE </h1>
  546. <div id="navlinks" class="{select:post size}"><table><tr>
  547. <th><a href="/" title="TEXT"></a></th>
  548. <th><a href="/" title="TEXT"></a></th>
  549. <th><a href="/" title="TEXT"></a></th>
  550. <th><a href="/" title="TEXT"></a></th></tr>
  551. <tr><th><a href="/" title="TEXT"></a></th>
  552. <th><a href="/" title="TEXT"></a></th>
  553. <th><a href="/" title="TEXT"></a></th>
  554. <th><a href="/" title="TEXT"></a></th></tr></table>
  555. </div>
  556. </div>
  557.  
  558. <div id="textbox1" class="{select:post size}">
  559. <h1> BOX 1 TITLE </h1>
  560. <div id="inspo" class="{select:post size} {select:container height}">
  561. BOX 1 CONTENT, Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  562. </div>
  563. </div>
  564.  
  565. <div id="textbox2" class="{select:post size}">
  566. <h1> BOX 2 TITLE </h1>
  567. <div id="inspo" class="{select:post size} {select:container height}">
  568. BOX 2 CONTENT, Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor. EXCEPTEUR sint occaecat CUPIDATAT non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  569. </div>
  570. </div>
  571.  
  572.  
  573. </div>
  574. </div>
  575. {/block:IfNavTab}
  576.  
  577.  
  578. <!-- MUSES -->
  579.  
  580.  
  581. {block:IfMuseTab}
  582. <div id="tua" class="tab {select:post size} {select:container height}"
  583. style="display:none;">
  584. <h3>my muses</h3>
  585.  
  586. <div id="muses">
  587.  
  588. <!-- START CHAR
  589. if you want to add more, copy & paste
  590. the blocks and change to next "char#"
  591. -->
  592.  
  593. <div id="noi">
  594. <div class="musname">NAME HERE</div>
  595. <div class="musimg">
  596. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  597. <div class="muslinks">
  598. <a class="button" rel="char1" href="#"></a>
  599. <a class="nobutton" href="/" title="text"></a>
  600. <a class="nobutton" href="/" title="text"></a>
  601. </div>
  602. </div>
  603.  
  604. <!-- END CHAR
  605. -->
  606.  
  607. <div id="noi">
  608. <div class="musname">NAME HERE</div>
  609. <div class="musimg">
  610. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  611. <div class="muslinks">
  612. <a class="button" rel="char2" href="#"></a>
  613. <a class="nobutton" href="/" title="text"></a>
  614. <a class="nobutton" href="/" title="text"></a>
  615. </div>
  616. </div>
  617.  
  618. <div id="noi">
  619. <div class="musname">NAME HERE</div>
  620. <div class="musimg">
  621. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  622. <div class="muslinks">
  623. <a class="button" rel="char3" href="#"></a>
  624. <a class="nobutton" href="/" title="text"></a>
  625. <a class="nobutton" href="/" title="text"></a>
  626. </div>
  627. </div>
  628.  
  629. <div id="noi">
  630. <div class="musname">NAME HERE</div>
  631. <div class="musimg">
  632. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  633. <div class="muslinks">
  634. <a class="button" rel="char4" href="#"></a>
  635. <a class="nobutton" href="/" title="text"></a>
  636. <a class="nobutton" href="/" title="text"></a>
  637. </div>
  638. </div>
  639.  
  640. <div id="noi">
  641. <div class="musname">NAME HERE</div>
  642. <div class="musimg">
  643. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  644. <div class="muslinks">
  645. <a class="button" rel="char5" href="#"></a>
  646. <a class="nobutton" href="/" title="text"></a>
  647. <a class="nobutton" href="/" title="text"></a>
  648. </div>
  649. </div>
  650.  
  651. <div id="noi">
  652. <div class="musname">NAME HERE</div>
  653. <div class="musimg">
  654. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  655. <div class="muslinks">
  656. <a class="button" rel="char6" href="#"></a>
  657. <a class="nobutton" href="/" title="text"></a>
  658. <a class="nobutton" href="/" title="text"></a>
  659. </div>
  660. </div>
  661.  
  662. <div id="noi">
  663. <div class="musname">NAME HERE</div>
  664. <div class="musimg">
  665. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  666. <div class="muslinks">
  667. <a class="button" rel="char7" href="#"></a>
  668. <a class="nobutton" href="/" title="text"></a>
  669. <a class="nobutton" href="/" title="text"></a>
  670. </div>
  671. </div>
  672.  
  673. <div id="noi">
  674. <div class="musname">NAME HERE</div>
  675. <div class="musimg">
  676. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  677. <div class="muslinks">
  678. <a class="button" rel="char8" href="#"></a>
  679. <a class="nobutton" href="/" title="text"></a>
  680. <a class="nobutton" href="/" title="text"></a>
  681. </div>
  682. </div>
  683.  
  684. <div id="noi">
  685. <div class="musname">NAME HERE</div>
  686. <div class="musimg">
  687. <img src="https://static.tumblr.com/izggomb/7Keomd913/2.png"></div>
  688. <div class="muslinks">
  689. <a class="button" rel="char9" href="#"></a>
  690. <a class="nobutton" href="/" title="text"></a>
  691. <a class="nobutton" href="/" title="text"></a>
  692. </div>
  693. </div>
  694.  
  695. <span class="yu"></span>
  696. </div>
  697.  
  698.  
  699. </div>
  700. </div>
  701. </div>
  702.  
  703.  
  704. <!-- START CHAR POPUP
  705. if you want to add more, copy & paste
  706. the blocks and change to next "char#"
  707. -->
  708.  
  709.  
  710. <div id="char1" class="popper">
  711. <div class="content">
  712. <div class="infotit"><h2>character one</h2>
  713. <div class="infolinks"><table><tr>
  714. <td><a href="/" title="text"></a></td>
  715. <td><a href="/" title="text"></a></td>
  716. <td><a href="/" title="text"></a></td>
  717. <td><a href="/" title="text"></a></td>
  718. <td><a href="/" title="text"></a></td>
  719. </tr></table></div>
  720. <p><ul>
  721. <li><b>nickname</b> char wan</li>
  722. <li><b>zodiac</b> gemini, double capricorn moon</li>
  723. <li><b>height</b> five nine</li>
  724. <li><b>weight</b> one twenty</li>
  725. <li><b>sexuality</b> demisexual</li>
  726. <li><b>morality</b> neutral good</li>
  727. <li><b>label</b> the icarus</li>
  728. <li><b>myers-briggs</b> istp</li>
  729. </ul></p>
  730. </div>
  731. <div class="infoimg"><table><tr><td>
  732. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  733. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  734. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  735. </tr></table></div>
  736. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  737. </div>
  738. <a href="#0" class="close img-replace">Close</a>
  739. </div>
  740.  
  741. <!-- END CHAR POPUP
  742. -->
  743.  
  744. <div id="char2" class="popper">
  745. <div class="content">
  746. <div class="infotit"><h2>character two</h2>
  747. <div class="infolinks"><table><tr>
  748. <td><a href="/" title="text"></a></td>
  749. <td><a href="/" title="text"></a></td>
  750. <td><a href="/" title="text"></a></td>
  751. <td><a href="/" title="text"></a></td>
  752. <td><a href="/" title="text"></a></td>
  753. </tr></table></div>
  754. <p><ul>
  755. <li><b>nickname</b> char wan</li>
  756. <li><b>zodiac</b> gemini, double capricorn moon</li>
  757. <li><b>height</b> five nine</li>
  758. <li><b>weight</b> one twenty</li>
  759. <li><b>sexuality</b> demisexual</li>
  760. <li><b>morality</b> neutral good</li>
  761. <li><b>label</b> the icarus</li>
  762. <li><b>myers-briggs</b> istp</li>
  763. </ul></p>
  764. </div>
  765. <div class="infoimg"><table><tr><td>
  766. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  767. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  768. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  769. </tr></table></div>
  770. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  771. </div>
  772. <a href="#0" class="close img-replace">Close</a>
  773. </div>
  774.  
  775.  
  776. <div id="char3" class="popper">
  777. <div class="content">
  778. <div class="infotit"><h2>character three</h2>
  779. <div class="infolinks"><table><tr>
  780. <td><a href="/" title="text"></a></td>
  781. <td><a href="/" title="text"></a></td>
  782. <td><a href="/" title="text"></a></td>
  783. <td><a href="/" title="text"></a></td>
  784. <td><a href="/" title="text"></a></td>
  785. </tr></table></div>
  786. <p><ul>
  787. <li><b>nickname</b> char wan</li>
  788. <li><b>zodiac</b> gemini, double capricorn moon</li>
  789. <li><b>height</b> five nine</li>
  790. <li><b>weight</b> one twenty</li>
  791. <li><b>sexuality</b> demisexual</li>
  792. <li><b>morality</b> neutral good</li>
  793. <li><b>label</b> the icarus</li>
  794. <li><b>myers-briggs</b> istp</li>
  795. </ul></p>
  796. </div>
  797. <div class="infoimg"><table><tr><td>
  798. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  799. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  800. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  801. </tr></table></div>
  802. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  803. </div>
  804. <a href="#0" class="close img-replace">Close</a>
  805. </div>
  806.  
  807.  
  808. <div id="char4" class="popper">
  809. <div class="content">
  810. <div class="infotit"><h2>character four</h2>
  811. <div class="infolinks"><table><tr>
  812. <td><a href="/" title="text"></a></td>
  813. <td><a href="/" title="text"></a></td>
  814. <td><a href="/" title="text"></a></td>
  815. <td><a href="/" title="text"></a></td>
  816. <td><a href="/" title="text"></a></td>
  817. </tr></table></div>
  818. <p><ul>
  819. <li><b>nickname</b> char wan</li>
  820. <li><b>zodiac</b> gemini, double capricorn moon</li>
  821. <li><b>height</b> five nine</li>
  822. <li><b>weight</b> one twenty</li>
  823. <li><b>sexuality</b> demisexual</li>
  824. <li><b>morality</b> neutral good</li>
  825. <li><b>label</b> the icarus</li>
  826. <li><b>myers-briggs</b> istp</li>
  827. </ul></p>
  828. </div>
  829. <div class="infoimg"><table><tr><td>
  830. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  831. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  832. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  833. </tr></table></div>
  834. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  835. </div>
  836. <a href="#0" class="close img-replace">Close</a>
  837. </div>
  838.  
  839.  
  840. <div id="char5" class="popper">
  841. <div class="content">
  842. <div class="infotit"><h2>character five</h2>
  843. <div class="infolinks"><table><tr>
  844. <td><a href="/" title="text"></a></td>
  845. <td><a href="/" title="text"></a></td>
  846. <td><a href="/" title="text"></a></td>
  847. <td><a href="/" title="text"></a></td>
  848. <td><a href="/" title="text"></a></td>
  849. </tr></table></div>
  850. <p><ul>
  851. <li><b>nickname</b> char wan</li>
  852. <li><b>zodiac</b> gemini, double capricorn moon</li>
  853. <li><b>height</b> five nine</li>
  854. <li><b>weight</b> one twenty</li>
  855. <li><b>sexuality</b> demisexual</li>
  856. <li><b>morality</b> neutral good</li>
  857. <li><b>label</b> the icarus</li>
  858. <li><b>myers-briggs</b> istp</li>
  859. </ul></p>
  860. </div>
  861. <div class="infoimg"><table><tr><td>
  862. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  863. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  864. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  865. </tr></table></div>
  866. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  867. </div>
  868. <a href="#0" class="close img-replace">Close</a>
  869. </div>
  870.  
  871.  
  872. <div id="char6" class="popper">
  873. <div class="content">
  874. <div class="infotit"><h2>character six</h2>
  875. <div class="infolinks"><table><tr>
  876. <td><a href="/" title="text"></a></td>
  877. <td><a href="/" title="text"></a></td>
  878. <td><a href="/" title="text"></a></td>
  879. <td><a href="/" title="text"></a></td>
  880. <td><a href="/" title="text"></a></td>
  881. </tr></table></div>
  882. <p><ul>
  883. <li><b>nickname</b> char wan</li>
  884. <li><b>zodiac</b> gemini, double capricorn moon</li>
  885. <li><b>height</b> five nine</li>
  886. <li><b>weight</b> one twenty</li>
  887. <li><b>sexuality</b> demisexual</li>
  888. <li><b>morality</b> neutral good</li>
  889. <li><b>label</b> the icarus</li>
  890. <li><b>myers-briggs</b> istp</li>
  891. </ul></p>
  892. </div>
  893. <div class="infoimg"><table><tr><td>
  894. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  895. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  896. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  897. </tr></table></div>
  898. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  899. </div>
  900. <a href="#0" class="close img-replace">Close</a>
  901. </div>
  902.  
  903.  
  904. <div id="char7" class="popper">
  905. <div class="content">
  906. <div class="infotit"><h2>character seven</h2>
  907. <div class="infolinks"><table><tr>
  908. <td><a href="/" title="text"></a></td>
  909. <td><a href="/" title="text"></a></td>
  910. <td><a href="/" title="text"></a></td>
  911. <td><a href="/" title="text"></a></td>
  912. <td><a href="/" title="text"></a></td>
  913. </tr></table></div>
  914. <p><ul>
  915. <li><b>nickname</b> char wan</li>
  916. <li><b>zodiac</b> gemini, double capricorn moon</li>
  917. <li><b>height</b> five nine</li>
  918. <li><b>weight</b> one twenty</li>
  919. <li><b>sexuality</b> demisexual</li>
  920. <li><b>morality</b> neutral good</li>
  921. <li><b>label</b> the icarus</li>
  922. <li><b>myers-briggs</b> istp</li>
  923. </ul></p>
  924. </div>
  925. <div class="infoimg"><table><tr><td>
  926. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  927. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  928. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  929. </tr></table></div>
  930. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  931. </div>
  932. <a href="#0" class="close img-replace">Close</a>
  933. </div>
  934.  
  935.  
  936. <div id="char8" class="popper">
  937. <div class="content">
  938. <div class="infotit"><h2>character eight</h2>
  939. <div class="infolinks"><table><tr>
  940. <td><a href="/" title="text"></a></td>
  941. <td><a href="/" title="text"></a></td>
  942. <td><a href="/" title="text"></a></td>
  943. <td><a href="/" title="text"></a></td>
  944. <td><a href="/" title="text"></a></td>
  945. </tr></table></div>
  946. <p><ul>
  947. <li><b>nickname</b> char wan</li>
  948. <li><b>zodiac</b> gemini, double capricorn moon</li>
  949. <li><b>height</b> five nine</li>
  950. <li><b>weight</b> one twenty</li>
  951. <li><b>sexuality</b> demisexual</li>
  952. <li><b>morality</b> neutral good</li>
  953. <li><b>label</b> the icarus</li>
  954. <li><b>myers-briggs</b> istp</li>
  955. </ul></p>
  956. </div>
  957. <div class="infoimg"><table><tr><td>
  958. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  959. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  960. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  961. </tr></table></div>
  962. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  963. </div>
  964. <a href="#0" class="close img-replace">Close</a>
  965. </div>
  966.  
  967.  
  968. <div id="char9" class="popper">
  969. <div class="content">
  970. <div class="infotit"><h2>character nine</h2>
  971. <div class="infolinks"><table><tr>
  972. <td><a href="/" title="text"></a></td>
  973. <td><a href="/" title="text"></a></td>
  974. <td><a href="/" title="text"></a></td>
  975. <td><a href="/" title="text"></a></td>
  976. <td><a href="/" title="text"></a></td>
  977. </tr></table></div>
  978. <p><ul>
  979. <li><b>nickname</b> char wan</li>
  980. <li><b>zodiac</b> gemini, double capricorn moon</li>
  981. <li><b>height</b> five nine</li>
  982. <li><b>weight</b> one twenty</li>
  983. <li><b>sexuality</b> demisexual</li>
  984. <li><b>morality</b> neutral good</li>
  985. <li><b>label</b> the icarus</li>
  986. <li><b>myers-briggs</b> istp</li>
  987. </ul></p>
  988. </div>
  989. <div class="infoimg"><table><tr><td>
  990. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  991. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td><td>
  992. <img src="https://static.tumblr.com/izggomb/YdOomd92a/1.png"></td>
  993. </tr></table></div>
  994. <div style="width:319px;overflow-x:hidden;pointer-events:none;"><div class="about">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div>
  995. </div>
  996. <a href="#0" class="close img-replace">Close</a>
  997. </div>
  998. {block:IfMuseTab}
  999.  
  1000.  
  1001. <!-- CREDIT -->
  1002.  
  1003.  
  1004.  
  1005. <div id="credit">
  1006. ≽<a href="https://simplyrps.tumblr.com">
  1007. SIMPLYRPS
  1008. </a>≼
  1009. </div>
  1010.  
  1011.  
  1012.  
  1013. <!-- SCRIPTS -->
  1014.  
  1015.  
  1016.  
  1017. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script> <link href='https://fonts.googleapis.com/css?family=Cambay:400,400italic' rel='stylesheet' type='text/css'> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script><script>function openTab(tabName) { var i; var x = document.getElementsByClassName("tab"); for (i = 0; i < x.length; i++) { x[i].style.display = "none"; } document.getElementById(tabName).style.display = "block"; }</script> <script> $(function(){ $(".muslinks a.button").click(function () { $("#" + this.rel).toggleClass('active'); }); $('.close').click(function (){ $(this).parent().removeClass('active'); }); }); </script> <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title],a[title],img[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:90, tip_fade_speed:600, attribute:"title" }); }); })(jQuery); </script>
  1018.  
  1019.  
  1020. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement