yoonora

013 - TOGETHER

Sep 8th, 2015
1,766
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.89 KB | None | 0 0
  1.  
  2. <!-- #013 - together (updated)
  3. code made by yoonora/exoa
  4. do not steal.
  5. -->
  6.  
  7. <!DOCTYPE HTML><html><head><title>―{title}</title>
  8. <link rel="shortcut icon" href="{favicon}">
  9.  
  10. <meta name="color:main" content="#656565"/>
  11. <meta name="color:links" content="#3e3e3e"/>
  12. <meta name="color:background" content="#fafafa"/>
  13. <meta name="color:1" content="#daeaf3"/>
  14. <meta name="color:2" content="#dfdfdf"/>
  15. <meta name="color:3" content="#fefefe"/>
  16. <meta name="color:4" content="#f3f3f3"/>
  17. <meta name="color:5" content="#e7f0fb"/>
  18. <meta name="color:lines" content="#b6b6b6"/>
  19. <meta name="color:posts" content="#fafafa"/>
  20. <meta name="color:container" content="#fefefe"/>
  21.  
  22. <meta name="image:sidebar" content=""/>
  23. <meta name="image:sidebar icon" content=""/>
  24. <meta name="image:about topbar" content=""/>
  25. <meta name="image:background" content=""/>
  26.  
  27. <meta name="select:container style" content="cs1" title="style #1">
  28. <meta name="select:container style" content="cs2" title="style #2">
  29.  
  30. <meta name="select:post info style" content="type1" title="type #1">
  31. <meta name="select:post info style" content="type2" title="type #2">
  32. <meta name="select:post info style" content="type3" title="type #3">
  33.  
  34. <meta name="select:caption style" content="capt0" title="none">
  35. <meta name="select:caption style" content="capt2" title="type #1">
  36. <meta name="select:caption style" content="capt3" title="type #2">
  37. <meta name="select:caption style" content="capt4" title="type #3">
  38. <meta name="select:caption style" content="capt5" title="type #4">
  39.  
  40.  
  41.  
  42. <meta name="if:border" content="1"/>
  43. <meta name="if:photo filter" content="0"/>
  44. <meta name="if:fade in posts" content="0"/>
  45. <meta name="if:posts one color" content="0"/>
  46. <meta name="if:rounded corners" content="0"/>
  47. <meta name="if:sidebar hover" content="0"/>
  48. <meta name="if:blogroll" content="1"/>
  49. <meta name="if:about" content="1"/>
  50.  
  51. <meta name="text:posts padding" content="20px"/>
  52. <meta name="text:title" content="together"/>
  53. <meta name="text:description title" content=""/>
  54. <meta name="text:description subtitle" content=""/>
  55. <meta name="text:about title" content=""/>
  56. <meta name="text:about subtitle" content=""/>
  57. <meta name="text:about description" content=""/>
  58. <meta name="text:link 1" content=""/>
  59. <meta name="text:link 1 url" content="/"/>
  60. <meta name="text:link 2" content=""/>
  61. <meta name="text:link 2 url" content="/"/>
  62. <meta name="text:link 3" content=""/>
  63. <meta name="text:link 3 url" content="/"/>
  64. <meta name="text:link 4" content=""/>
  65. <meta name="text:link 4 url" content="/"/>
  66. <meta name="text:link 5" content=""/>
  67. <meta name="text:link 5 url" content="/"/>
  68. <meta name="text:link 6" content=""/>
  69. <meta name="text:link 6 url" content="/"/>
  70. <meta name="text:link 7" content=""/>
  71. <meta name="text:link 7 url" content="/"/>
  72.  
  73. <!----------------------------------------STYLESHEETS---->
  74. <link rel="stylesheet"href="http://static.tumblr.com/j2yc61v/mHco164jf/f.css">
  75. <link href="http://static.tumblr.com/j2yc61v/Mvfo1jjw5/u.css"rel="stylesheet">
  76. <!------------------------------------------SCRIPTS---->
  77. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  78. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  79. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  80.  
  81. <link href='https://fonts.googleapis.com/css?family=Chivo:400,400italic,900,900italic' rel='stylesheet' type='text/css'>
  82.  
  83. <!-------------------------------------------->
  84. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  85.  
  86. <script>
  87. (function($){
  88. $(document).ready(function(){
  89. $("[title]").style_my_tooltips({
  90. tip_follows_cursor:true,
  91. tip_delay_time:200,
  92. tip_fade_speed:300
  93. }
  94. );
  95. });
  96. })(jQuery);
  97. </script>
  98.  
  99. <!-------------------------------------------->
  100.  
  101. <script language="javascript">
  102. $(document).ready(function() {
  103. $('a#more').click(function() {
  104. $('.t',this).toggle();
  105. });
  106.  
  107. $("#left").css({"opacity":"1"})
  108. $("#more").toggle(
  109. function () {
  110. $("#left").animate({"width":"200px","margin-left":"-152px"}, "slow");
  111. $("#inside").animate({"margin-left":"0px"},"slow");
  112. },
  113. function () {
  114. $("#left").animate({"width":"48px","margin-left":"0px"}, "slow");
  115. $("#inside").animate({"margin-left": "170px"},"slow");
  116. });
  117. });
  118. </script>
  119. <style type="text/css">
  120.  
  121. /*--------------------------------MAIN--*/
  122.  
  123. ::-webkit-scrollbar-thumb:vertical {background:{color:lines};
  124. border: 5px solid {color:container};}
  125. ::-webkit-scrollbar {background:{color:5};
  126. border: 5.8px solid {color:container};}
  127.  
  128.  
  129. #s-m-t-tooltip{font:9px arial;font-style:italic;font-weight:bold;
  130. color:{color:main};padding:2px 5px;background-color:{color:3};
  131. border:1px solid {color:lines};}
  132.  
  133. body{background:{color:background} url('{image:background}') fixed;
  134. overflow-y:auto;overflow-x:hidden;font:11px arial;color:{color:main};}
  135.  
  136. a{color:{color:links};text-decoration:none;}
  137. b, strong {color:{color:main};background:{color:5};}
  138. i, em {color:{color:main};background:{color:6};}
  139.  
  140. #ttbody ul {padding: 0px;margin:0 25px;}
  141. #ttbody ul li {list-style-type:circle;font:9.5px arial;padding:2px 0;}
  142.  
  143. pre{background:{color:3};}
  144. ::-moz-selection{background-color: {color:5};color:{color:3};}
  145. ::selection{background-color:{color:5};color:{color:3};}
  146.  
  147. #tumblr_lightbox div:nth-child(2) { background:{color:3};}
  148. #tumblr_lightbox a img {border: 5px solid {color:3};}
  149. .sd{background:{color:background};border-color:{color:lines};}
  150.  
  151. .tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop {
  152. right:-35px!important;top:0px!important;z-index: 1000009090000000133300!important;opacity:0.5;-webkit-filter: invert(100%);-moz-filter: invert(100%);
  153. -o-filter: invert(100%);-ms-filter: invert(100%);
  154. -ms-transform: scale(0.8)!important; /* IE 9 */
  155. -webkit-transform: scale(0.8)!important; /* Safari */
  156. transform: scale(0.8)!important; /* Standard syntax */
  157. -webkit-transition: opacity 0.7s linear;
  158. -moz-transition: all 0.4s ease-out;
  159. -webkit-transition: all 0.4s ease-out;
  160. transition: all 0.4s ease-out;}
  161.  
  162. .tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop:hover{
  163. opacity: 1;
  164. -webkit-transition: opacity 0.7s linear;
  165. -moz-transition: all 0.4s ease-out;
  166. -webkit-transition: all 0.4s ease-out;
  167. transition: all 0.4s ease-out;}
  168.  
  169. /*--------------------------------POSTS--*/
  170.  
  171. .epd{padding:{block:IfPostsPadding}{text:posts padding}{/block:IfPostsPadding} {block:IfNotPostsPadding}20px{/block:IfNotPostsPadding};}
  172.  
  173.  
  174. .type3 .epd{border-radius:0px;}
  175. .capt1 .epd{position:relative;}
  176. .capt2 .epd, .capt3 .epd{position:relative; overflow:hidden;}
  177.  
  178.  
  179. {block:IfNotPostsOneColor}
  180. #po1 .epd, #po1 #cap1{background:{color:2};}
  181. #po2 .epd, #po2 #cap1{background:{color:5};}
  182. #po1 .title{background:{color:1};}#po2 .title{background:{color:4};}
  183. #po1 #poi1_wr, #po1 #wr3_tg, #po1 #wr3_tgl{background:{color:4};}
  184. #po2 #poi1_wr, #po2 #wr3_tg, #po2 #wr3_tgl{background:{color:3};}
  185. #po1 #wrb{background:{color:1};}#po2 #wrb{background:{color:2};}
  186. #po1 #wr2{background:{color:3};}#po2 #wr2{background:{color:1};}
  187. #po1 #poi2_wr{background:{color:4};}#po2 #poi2_wr{background:{color:3};}
  188. #po1 #p2w2_nt, #po1 #p2w2_dt{background:{color:1};}
  189. #po2 #p2w2_nt, #po2 #p2w2_dt{background:{color:2};}
  190. #po1 #p2w1_tg{background:{color:5};}#po2 #p2w1_tg{background:{color:4};}
  191. #po1 #p3_uw1{background:{color:1};}#po2 #p3_uw1{background:{color:2};}
  192. #po1 #p3_wr2, #po1 #p3_wr2 #wr3_tgl{background:{color:5};}
  193. #po2 #p3_wr2, #po2 #p3_wr2 #wr3_tgl{background:{color:4};}
  194. #po1 #p3wr1 #p2w2_nt{background:{color:4};}
  195. #po2 #p3wr1 #p2w2_nt{background:{color:1};}
  196. {/block:IfNotPostsOneColor}
  197.  
  198. {block:IfPostsOneColor}#po1 .epd, #po2 .epd, #wrb, #wr2,#wr3_tg, #wr3_tgl, #poi1_wr, #poi2_wr, #p2w1_tg, #p2w2_nt, #p2w2_dt, #p3_uw1, #p3_wr2, #p3_wr2 #wr3_tgl, #cap1, #poi2_rbb{background:{color:posts};}{/block:IfPostsOneColor}
  199.  
  200.  
  201. {block:IfBorder}
  202. #captio4, #captio5, .prma, .aud td:nth-child(1), .chat, #cap1, #p2_rb, #poi1_wr, #poi2_wr, #p3_wr2, #ttbody blockquote, #cavimu, .epd, #p3_uw1{
  203. border:1px solid {color:lines};}
  204.  
  205. #a_sidebar, #aside_up, #aside_d, .epd, #p3_uw1, #l1_li a, #line1, #line2, #line3, #line4, .a, .b, #left, #left a, #a_hed, #poi2_rbb, .current_page, .jump_page{border:1px solid {color:lines};}
  206.  
  207. #wrl, #wrr, #poi2_li{
  208. position:absolute;width:1px;height:100%;background:{color:lines};}
  209. #poi2_li{left:70%;z-index:999999999999999;}
  210. #wrl{left:40%;}#wrr{left:60%;}
  211. #poi3 #wrl{left:65%;z-index:99999999999;}
  212. #poi3 #wrr{left:30%;z-index:99999999999;}
  213. .prma #caption, #captio3, #p2w1_tg{border-top:1px solid {color:lines};}
  214.  
  215. #prma_tg h8, #prma_rf, #prma_tg, #titlechat, #wr3_rf a{
  216. border-bottom:1px solid {color:lines};}
  217.  
  218. #prma_co2{border-top:1px solid {color:lines};
  219. border-bottom:1px solid {color:lines};}
  220.  
  221. {/block:IfBorder}
  222.  
  223. {block:IfRoundedCorners}
  224. .title{border-radius:15px 15px 0 0;}
  225. #poi1_wr, #poi2_wr, #p3_wr2{border-radius:0 0 20px 20px;}
  226. #po1 #cap1{border-radius:15px 0 0 15px;}
  227. #po2 #cap1{border-radius:0 15px 15px 0;}
  228. .epd, #p3_uw1{border-radius:20px 20px 0 0;}
  229.  
  230. .cs1 #line1, .cs1 #line4, .cs1 #line3, .cs1 #left, .a{
  231. border-radius:7px;}
  232.  
  233. .cs2 #line1{border-radius:0 0 7px 7px;}
  234. .cs2 #line3{border-radius:7px 7px 0 0;}
  235. .cs2 #left{border-radius:0 0 7px 7px;}
  236.  
  237. #a_sidebar, #aside_up, #aside_d, #a_hed {border-radius:10px;}
  238.  
  239. #l1_li a, .current_page, .jump_page, #br, #left a{border-radius:5px;}
  240.  
  241. {/block:IfRoundedCorners}
  242.  
  243. .a, .b{position:absolute;top:60px;left:60px;width:780px;height:480px;
  244. overflow-y:auto;overflow-x:hidden;background:{color:container};}
  245.  
  246. .cs2 .a, .cs2 .b{top:7.5%; height:85%;}
  247.  
  248.  
  249.  
  250. #cont{position:relative;margin:50px; width:50%;}
  251.  
  252. .posts {position:relative;margin:50px auto 100px auto;
  253. width:100%;text-align:left;
  254. vertical-align: middle;color:{color:main};
  255. -webkit-animation:fadeIn 0s;
  256. -moz-animation:fadeIn 0s;
  257. -o-animation:fadeIn 0s;}
  258.  
  259.  
  260. /*-----------------------------POSTS EXTRA #2--*/
  261.  
  262.  
  263. #photoset, #photo{
  264. {block:IfFadeInPosts}{block:IfNotPhotoFilter}opacity:.5;
  265. -webkit-transition: all 0.9s ease-out;
  266. -moz-transition: all 0.9s ease-out;
  267. transition: all 0.9s ease-out;
  268. {/block:IfNotPhotoFilter}{/block:IfFadeInPosts}}
  269.  
  270. .posts:hover #photoset, .posts:hover #photo{opacity:1;}
  271. {block:IfPhotoFilter}{block:IndexPage}
  272. #flit{ opacity:.5;
  273. -webkit-filter: grayscale(100%);
  274. -moz-filter: grayscale(100%);
  275. -ms-filter: grayscale(100%);
  276. -o-filter: grayscale(100%);
  277. filter: grayscale(100%);
  278. filter: gray;
  279. -webkit-transition: all 0.9s ease-out;
  280. -moz-transition: all 0.9s ease-out;
  281. transition: all 0.9s ease-out;}
  282. {/block:IndexPage}{/block:IfPhotoFilter}
  283.  
  284.  
  285. /*-----------------------------POSTS SETTINGS--*/
  286. .posts a{color:{color:links};font:10.5px arial;font-style:italic;}
  287.  
  288. .title{margin:0px;padding:25px 0px;}
  289.  
  290. #tt, #tt a{font:20px arial;font-weight:bold;font-style:italic;
  291. margin:0px;padding:10px 20px;line-height:150%;
  292. background:{color:3};color:{color:5};border:1px solid {color:lines};
  293. text-shadow:-1px -1px 0 {color:main}, 1px -1px 0 {color:main},
  294. -1px 1px 0 {color:main}, 1px 1px 0 {color:main};}
  295. #tt a{font:16px arial;font-weight:bold;font-style:italic;padding:0px;
  296. border:0px;}
  297. #ttbody{position:relative;text-align:left;}
  298. #ttbody a{background:{color:3};}
  299. #ttbody blockquote{padding:20px;margin:5px 0;
  300. background:rgba(255, 255, 255, 0.6);
  301. {block:IfNotBorder}border:1px solid {color:3};{/block:IfNotBorder}}
  302.  
  303. /*--------------------------------POST INFO--*/
  304.  
  305. #poi1_wr, #poi2_wr, #p3_wr2{border-top:0px;}
  306.  
  307. #wr3_notr{position:absolute;width:100%;text-align:center;
  308. padding:10px 0;top:50%;transform: translateY(-20%);}
  309. /*--------------*/
  310.  
  311. #p2_rb{background:{color:3};}
  312. #po1 #p2rb{background:{color:1};}
  313. #po2 #p2rb{background:{color:4};}
  314.  
  315. #poi2_rbb{position:absolute;width:50px;border-top:0px;}
  316. #poi2_rbb h8{font:10px arial;text-transform:uppercase;font-weight:bold;
  317. display:block;text-align:center;padding:5px 0;}
  318.  
  319. /*------------------------------CAPTIONS-------*/
  320.  
  321. #po1 #po_cap{background:{color:5};}
  322. #po2 #po_cap{background:{color:4};}
  323.  
  324. #captio3, #captio4, #captio5, #cavimu{background:{color:3};}
  325. #captio5, #cavimu{border-top:0px;}
  326. #cavimu{display:none;}
  327. .capt1 #cavimu, .capt2 #cavimu, .capt3 #cavimu, .capt4 #cavimu, .capt5 #cavimu
  328. {display:block;}
  329. #p3_uw1{border-bottom:0px;}
  330.  
  331. /*--------------------------PERMALINK--------*/
  332. #co2_dt{background:{color:2};}
  333. .prma, #noth8 {background:{color:4};}
  334. .prma #caption{background:{color:1};padding:10px;}
  335. .prma #caption p, .prma #caption blockquote{display:inline-block;}
  336. #prma_tg, #prma_not{background:{color:5};}
  337. #prma_tg h8, #prma_co2, #prma_rf{background:{color:3};}
  338. .prma{border-top:0px;}
  339. #noth8{-webkit-text-stroke-width: 1px;
  340. -webkit-text-stroke-color:{color:4};
  341. text-shadow: -3px 0px 0px {color:2};}
  342. /*--------------------------------QUOTE--*/
  343. #quote{color:{color:main};background:{color:4};
  344. text-shadow:-1.2px -1.2px 0 {color:3}, 1.2px -1.2px 0 {color:3},
  345. -1.2px 1.2px 0 {color:3}, 1.2px 1.2px 0 {color:3};}
  346. #qsource{background:{color:3};padding:10px;font:12px arial;font-style:italic;}
  347. #qsource a{color:{color:links};text-decoration:none;}
  348. /*--------------------------------CHAT--*/
  349.  
  350. #titlechat{margin:0px;font:15px arial;font-style:italic;text-transform:none;
  351. background:{color:3};}
  352.  
  353. .chat{margin:0px;font:8.5px arial;
  354. background:{color:3};border-top:0px;}
  355. .chat b, .chat strong{font:8px arial;font-style:italic;padding:0px 2px;}
  356.  
  357. .chat li:nth-child(odd), .chat li:nth-child(even){
  358. margin:0px;font:9.5px arial;text-transform:none;color:{color:main};}
  359. .chat li:nth-child(odd){background:{color:3};}
  360. .chat li:nth-child(even){background:{color:2};}
  361. .chat li:nth-child(even) b {background:{color:4};}
  362.  
  363. /*--------------------------------ASK--*/
  364. border:1px solid {color:lines};background:{color:3};}
  365. #pask_all h8{background:{color:3};border-bottom:1px solid {color:lines};}
  366. #pask_all h10{border-right:1px solid {color:lines};}
  367.  
  368. /*----------------------------------*/
  369.  
  370. .cs2 #line1, .cs2 #line3{height:6%;}
  371. .cs2 #line1{border-top:0px;}
  372. .cs2 #line3{border-bottom:0px;}
  373. .cs2 #left{border-top:0px;height:92.6%; }
  374. .cs2 #line4{border-top:0px;border-bottom:0px;height:100%;}
  375.  
  376. /*----------------------------------*/
  377.  
  378. .main_con{position:fixed;top:50%;left:50%;margin:-300px -450px;
  379. width:900px;height:600px;}
  380.  
  381. .cs2 .main_con{
  382. top:0px;margin:0px -450px;height:100%;}
  383.  
  384. #line1{background:{color:2};}
  385.  
  386. #line3{background:{color:5};}
  387.  
  388. #line1, #line3{position:absolute;height:48px;
  389. overflow:hidden; }
  390.  
  391. #line1{top:0px;right:58px;width:780px;}
  392. #line3{bottom:0px;width:841px;}
  393. #line2, #line4{position:absolute;width:48px;height:540px;
  394. background:{color:1};}
  395. #line4{height:598px; right:0px;}
  396.  
  397. {block:IfNotBorder}
  398. #line1, #line2, #line3, #line4, .a, #left{border:1px solid {color:background};}
  399. {/block:IfNotBorder}
  400.  
  401. /*----------------------------------*/
  402.  
  403. #a_sidebar{position:fixed;margin:50px 500px;width:230px;max-height:390px;
  404. background:{color:2};overflow:hidden;text-align:right; }
  405.  
  406. #aside_hov{position:absolute;width:100%;height:100%;z-index:9999;
  407. background:{color:2} center url('{image:sidebar}');
  408. background-size:cover;
  409. -webkit-transition: all 0.9s ease-out;
  410. -moz-transition: all 0.9s ease-out;
  411. transition: all 0.9s ease-out;}
  412.  
  413. #a_sidebar:hover #aside_hov{margin:0 -100%;}
  414.  
  415. #aside_up{position:relative;margin:15px;width:200px;height:200px;
  416. background:{color:1} center url('{image:sidebar icon}');
  417. background-size:cover;}
  418.  
  419. #aside_d{width:200px;margin:15px;max-height:144px;
  420. {block:IfNotSidebarIconImage}max-height:360px;{/block:IfNotSidebarIconImage}
  421. overflow-y:auto;overflow-x:hidden;font:10.5px arial;
  422. background:{color:container};}
  423. #aside_d h8, #aside_d h9{display:block;text-align:right;padding:0 5px;}
  424. #aside_d h8{font:12.5px arial;font-style:italic;}
  425. #aside_d h9{font:9.5px arial;font-style:italic;font-weight:bold;
  426. margin:0 0 10px 0;}
  427.  
  428. /*----------------------------------*/
  429.  
  430. #l3_ti{position:relative;display:block;text-align:right;
  431. margin:0 10px;top:50%;transform: translateY(-50%);
  432. letter-spacing:15px;font:40px chivo;text-transform:uppercase;
  433. overflow:hidden;color:{color:3};
  434. text-shadow:-1px -1px 0 {color:main}, 1px -1px 0 {color:main},
  435. -1px 1px 0 {color:main},1px 1px 0 {color:main};}
  436.  
  437. #l3_ti::before {position:absolute;margin-left:-5px;color:{color:2};
  438. {block:Iftitle}content: "{text:title}";{/block:Iftitle}
  439. {block:IfNottitle}content:"{Title}";{/block:IfNottitle}}
  440.  
  441. /*----------------------------------*/
  442.  
  443. #l1_li{position:relative;margin:0 10px;top:50%;transform: translateY(-50%);
  444. overflow:hidden;height:30px;}
  445.  
  446. #l1_li a{display:inline-block;padding:4px 10px;margin:3px 5px;
  447. font:9.5px courier;font-style:italic;text-transform:uppercase;
  448. background:{color:container};}
  449.  
  450. /*--------------------------------SIDE LINK CONT--*/
  451.  
  452. #left{position:absolute;width:48px;height:540px;overflow:hidden;
  453. z-index:99999999999999;background:{color:1};}
  454.  
  455. #left a{position:relative;overflow:hidden;display:block;text-align:right;
  456. text-decoration:none;text-transform:lowercase;font:22px arial;
  457. font-style:italic;margin:20px;padding:10px;color:{color:4};
  458. background:{color:container};
  459. -webkit-text-stroke-width: 0.7px;
  460. -webkit-text-stroke-color:{color:main};}
  461.  
  462. #left a, #br_t{transition: all 0.6s ease-in-out 0s;
  463. -moz-transition: all 0.6s ease-in-out 0s;
  464. -webkit-transition: all 0.6s ease-in-out 0s;
  465. -o-transition: all 0.6s ease-in-out 0s;}
  466.  
  467. #left a:hover{background-color:{color:4};
  468. transition: all 0.6s ease-in-out 0s;
  469. -moz-transition: all 0.6s ease-in-out 0s;
  470. -webkit-transition: all 0.6s ease-in-out 0s;
  471. -o-transition: all 0.6s ease-in-out 0s;}
  472.  
  473. #inside{position:absolute;margin-left:570px;width:200px;}
  474.  
  475. /*----------------------------------*/
  476.  
  477. #a_hed{position:relative;margin:10% auto 0 auto;
  478. height:200px;width:500px;
  479. background:{color:2} center url('{image:about topbar}');
  480. background-size:cover;}
  481. #a_co{width:100%;}
  482. #aco_d{margin:auto;width:500px;text-align:center; font:10.5px arial; }
  483. #aco_t{text-align:center;}
  484.  
  485. #aco_t h8{display:block;font:40px chivo;color:{color:5}; }
  486. #aco_t h9{display:block;font:13.5px chivo;letter-spacing:1px;
  487. font-style:italic; }
  488.  
  489. /*----------------------------------*/
  490.  
  491. #br{position:relative;margin:45px 20px 0 20px;display:inline-block;
  492. width:75px;height:75px;overflow:hidden;
  493. background:{color:1};border:1px solid {color:lines}; }
  494.  
  495. #br:nth-of-type(4n+1){background:{color:1};}
  496. #br:nth-of-type(4n+2){background:{color:2};}
  497. #br:nth-of-type(4n+3){background:{color:4};}
  498. #br:nth-of-type(4n+4){background:{color:5};}
  499.  
  500. #br_t, #br_i{position:absolute;width:100%;height:100%;}
  501.  
  502. #br:hover #br_t{margin:0;}
  503.  
  504. #br_i{margin:0;}
  505. #br_t{margin:0 100%;text-align:center;
  506. background:{color:2};}
  507.  
  508. #br_t h8{position:absolute;display:block;width:100%;top:50%;
  509. transform: translateY(-50%);font:10.5px arial;font-style:italic;
  510. word-wrap: break-word;}
  511.  
  512. #br_i img{margin:10%;width:80%;height:80%;}
  513.  
  514. #a_br{position:relative;max-height:100%;overflow-y:auto;overflow-x:hidden;
  515. top:50%;transform: translateY(-50%);}
  516.  
  517. #abr{position:relative;height:45px;width:10px;}
  518.  
  519. /*--------------------------------PAGINATION--*/
  520.  
  521.  
  522. #pgt{position:absolute;top:50%;transform: translateY(-50%);
  523. right:20px;text-align:right;z-index:99999;}
  524.  
  525. .current_page, .jump_page{position:relative;display:inline-block;
  526. padding:5px 10px;
  527. background:{color:container};
  528. font:11.5px arial;
  529. font-weight:bold;
  530. }
  531.  
  532. /*--------------------------------END OF CSS--*/
  533. </style></head><body><div id="b"></div>
  534. <!-----------------------------------------------------------HTML STARTS-->
  535. <div class="{select:container style}"><div class="main_con">
  536.  
  537. <div id="left"><div id="inside">
  538. {block:IfAbout}{block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>
  539. {/block:ifLink1}{/block:IfAbout}
  540. {block:IfBlogroll}{block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>
  541. {/block:ifLink2}{/block:IfBlogroll}
  542. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>
  543. {/block:ifLink3}
  544. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>
  545. {/block:ifLink4}
  546. {block:ifLink5}<a href="{text:Link 5 URL}">{text:Link 5}</a>
  547. {/block:ifLink5}
  548. {block:ifLink6}<a href="{text:Link 6 URL}">{text:Link 6}</a>
  549. {/block:ifLink6}
  550. {block:ifLink7}<a href="{text:Link 7 URL}">{text:Link 7}</a>
  551. {/block:ifLink7}</div></div>
  552.  
  553. <div id="line1"><div id="l1_li">
  554. <a href="/">index</a><a href="/ask">ask</a>
  555. <a class="one">reset</a>
  556. {block:IfAbout}<a class="two">about</a>{/block:IfAbout}
  557. {block:IfNotAbout}{block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>
  558. {/block:ifLink1}{/block:IfNotAbout}
  559. {block:IfBlogroll}<a class="four">blogroll</a>{/block:IfBlogroll}
  560. {block:IfNotBlogroll}{block:ifLink2}
  561. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  562. {/block:ifLink2}{/block:IfNotBlogroll}
  563.  
  564. <a id="more"><span class="t">links</span>
  565. <span class="t" style="display:none">less</span></a></div>
  566. {block:Pagination}<div id="pgt">
  567. {block:PreviousPage}
  568. <a href="{PreviousPage}" class="jump_page">&laquo;</a>
  569. {/block:PreviousPage}
  570. {block:JumpPagination length="3"}
  571. {block:CurrentPage}
  572. <span class="current_page">{PageNumber}</span>
  573. {/block:CurrentPage}
  574. {block:JumpPage}
  575. <a class="jump_page" href="{URL}">{PageNumber}</a>
  576. {/block:JumpPage}
  577. {/block:JumpPagination}
  578. {block:NextPage}
  579. <a href="{NextPage}" class="jump_page">&raquo;</a>
  580. {/block:NextPage}
  581. </div>{/block:Pagination}</div>
  582.  
  583. <div id="line3"><div id="l3_ti">{block:Iftitle}{text:title}{/block:Iftitle}
  584. {block:IfNottitle}{Title}{/block:IfNottitle}</div></div>
  585. <div id="line4"></div>
  586.  
  587. <!-------------------------------------BLOGROLL-->
  588.  
  589. <div class="4"style="display:none;overflow:hidden;text-align:center; ">
  590. <div class="a" style="overflow:hidden;"><div id="a_br">
  591. {block:Following}{block:Followed}
  592. <div id="br"><a href="{FollowedURL}"target="_blank">
  593. <div id="br_i"><img src="{FollowedPortraitURL-128}"></div>
  594. <div id="br_t"><h8><div id="p">{FollowedName}</div></h8></div>
  595. </a></div>
  596. {/block:Followed}{/block:Following}
  597. <div id="abr"></div>
  598. </div></div></div>
  599.  
  600. <!-------------------------------------ABOUT-->
  601.  
  602. <div class="2"style="display:none;overflow:hidden;"><div class="a">
  603. <div id="a_hed"></div><div id="a_co"><div id="p"><div id="aco_d"><div id="p">
  604. <div id="aco_t">
  605. <h8>{text:about title} </h8><h9>{text:about subtitle}</h9></div>
  606. <div id="aco_a"><div id="p">{text:about description}</div></div>
  607. </div></div></div></div></div></div>
  608.  
  609. <!-------------------------------------POSTS-->
  610. <div class="1"style="display:block;"><div class="a">
  611.  
  612. <div id="a_sidebar">
  613. {block:IfSidebarImage}
  614. {block:IfSidebarHover}<div id="aside_hov"></div>{/block:IfSidebarHover}
  615. {/block:IfSidebarImage}
  616. {block:IfSidebarIconImage}
  617. <div id="aside_up"></div>{/block:IfSidebarIconImage}
  618. <div id="aside_d"><div id="p">
  619. {block:IfDescriptionTitle}
  620. <h8>{text:description title}</h8>
  621. {/block:IfDescriptionTitle}
  622. {block:IfDescriptionSubtitle}
  623. <h9>{text:description subtitle}</h9>
  624. {/block:IfDescriptionSubtitle}
  625. {Description}</div></div>
  626. </div>
  627.  
  628.  
  629. <div id="cont"><div class="autopagerize_page_element">{block:Posts}
  630.  
  631. <div class="{select:caption style}">
  632. <div class="{select:post info style}">
  633.  
  634. <div {block:Odd}id="po1"{/block:Odd}
  635. {block:Even}id="po2"{/block:Even}class="posts">
  636.  
  637.  
  638. <!-------------------------------------INFO #3-->
  639. <div id="poi3"> <div id="p3_uw1"><div id="wrl"></div>
  640. <a href="{Permalink}"target="_blank"><div id="p3u1">
  641. <div id="p3_dtu1">{TimeAgo}
  642. <h8>{MonthNumberWithZero} / {DayOfMonthWithZero} / {Year}</h8></div>
  643. <div id="p3_dtu2">{DayOfWeek}
  644. <h8>{12HourWithZero}.{Minutes}.{Seconds}{CapitalAmPm}</h8>
  645. </div></div></a>
  646. <a href="{ReblogURL}"target="_blank">
  647. <div id="p3u2"><h8>reblog</h8></div></a>
  648. </div></div>
  649.  
  650. <!-------------------------------------PHOTOS-->
  651. {block:Photo}<div class="epd">
  652. {block:IndexPage}{block:Caption}
  653. <div id="captio1"><div id="cap1"><div id="capy">{Caption}</div></div></div>
  654. <div id="captio2"><div id="po_cap"><div id="pcap"><div id="p">
  655. {Caption}</div></div></div></div>
  656. <div id="captio3"><div id="cap3"><div id="capy">{Caption}</div></div></div>
  657. {/block:Caption}
  658. <div id="photo"><div class="filte"><div id="flit">
  659. <img src="{PhotoURL-HighRes}" width="100%"></div></div></div>
  660. {block:Caption}<div id="captio4"><div id="cap4"><div id="capy">
  661. {Caption}</div></div></div>{/block:Caption}
  662. {/block:IndexPage}
  663. {block:PermalinkPage}{LinkOpenTag}<div id="photo">
  664. <img src="{PhotoURL-HighRes}" width="100%"></div>{LinkCloseTag}
  665. {/block:PermalinkPage}</div>
  666. {block:IndexPage}{block:Caption}<div id="captio5"><div id="cap4">
  667. <div id="capy">{Caption}</div></div></div>{/block:Caption}{/block:IndexPage}
  668. {/block:Photo}
  669. <!-------------------------------------PHOTOSET-->
  670. {block:Photoset}<div class="epd">
  671. {block:IndexPage}{block:Caption}
  672. <div id="captio1"><div id="cap1"><div id="capy">{Caption}</div></div></div>
  673. <div id="captio2"><div id="po_cap"><div id="pcap"><div id="p">
  674. {Caption}</div></div></div></div>
  675. <div id="captio3"><div id="cap3"><div id="capy">{Caption}</div></div></div>
  676. {/block:Caption}{/block:IndexPage}
  677. <div id="photoset"><div class="filte"><div id="flit">
  678. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo">
  679. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  680. </div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  681. </div>{/block:Photos}</div></div></div></div>
  682. {block:IndexPage}{block:Caption}<div id="captio4"><div id="cap4">
  683. <div id="capy">{Caption}</div></div></div>
  684. {/block:Caption}{/block:IndexPage}</div>
  685. {block:IndexPage}{block:Caption}<div id="captio5"><div id="cap4">
  686. <div id="capy">{Caption}</div></div></div>{/block:Caption}{/block:IndexPage}
  687. {/block:Photoset}
  688. <!-------------------------------------VIDEO-->
  689. {block:Video}<div class="epd"><center><div id="vidso">
  690. <div class="video">{Video-500}</div>
  691. </div></center></div>
  692. {block:IndexPage}{block:Caption}
  693. <div id="cavimu"><div id="cap4">
  694. <div id="capy">{Caption}</div>
  695. </div></div>
  696. {/block:Caption}{/block:IndexPage}
  697. {/block:Video}
  698. <!-------------------------------------AUDIO-->
  699. {block:Audio}
  700. <div class="epd"><div class="aud"><table><tr>
  701. {block:AlbumArt}<td style="background-image: url('{AlbumArtURL}');">
  702. {block:AudioPlayer}<div id="aud_p">{AudioPlayerWhite}</div>
  703. {/block:AudioPlayer}</td>{/block:AlbumArt}
  704. <td><h1>{block:TrackName}{TrackName}{/block:TrackName}</h1>
  705. <h2>{block:Artist}{Artist}{/block:Artist}</h2></td>
  706. </tr></table></div></div>
  707. {block:IndexPage}{block:Caption}
  708. <div id="cavimu"><div id="cap4">
  709. <div id="capy">{Caption}</div>
  710. </div></div>
  711. {/block:Caption}{/block:IndexPage}
  712. {/block:Audio}
  713.  
  714. <!-------------------------------------TEXT-->
  715. {block:Text}<div class="epd">
  716. {block:Title}<div class="title"><div id="tt">{Title}</div></div>
  717. {/block:Title}<div id="ttbody">{Body}</div>
  718. </div>{/block:Text}
  719.  
  720. <!-------------------------------------ASK-->
  721. {block:Answer}
  722. <div id="p_ask"><div class="epd">
  723. <div id="pask_all"><h8> <h10>? by {Asker}</h10><img src="{AskerPortraitURL-24}"> </h8><h9>{Question}</h9></div>
  724. <div id="pask_aer">{Answer}</div>
  725. </div></div>{/block:Answer}
  726.  
  727. <!-------------------------------------LINK-->
  728. {block:Link}
  729. <div class="epd">
  730. <div class="title"><div id="tt">
  731. <a href="{URL}" {Target}>{Name}</a>
  732. </div></div>
  733. {block:Description}<div id="ttbody">{Description}</div>{/block:Description}
  734. </div>{/block:Link}
  735.  
  736. <!-------------------------------------QUOTE-->
  737. {block:Quote}<div class="epd">
  738. <div id="quote">{Quote}</div>
  739. {block:Source}<div id="qsource"> ―{Source}― </div>{/block:Source}
  740. </div>{/block:Quote}
  741.  
  742. <!-------------------------------------CHAT-->
  743. {block:Chat}<div id="chatpost"><div class="epd">
  744. {block:Title}<div id="titlechat">{Title}</div>{/block:Title}
  745. <ul class="chat">{block:Lines}<li class="{Alt} user_{UserNumber}">
  746. {block:Label}<b>{Label}</b>{/block:Label}
  747. {Line}</li>{/block:Lines}</ul></div></div>{/block:Chat}
  748.  
  749.  
  750.  
  751. <!----------------------------------------------------------INFO #1-->
  752. {block:IndexPage}{block:Date}
  753. <div id="poi1"><div id="poi1_wr"><div id="wrb"></div>
  754. <!--------->
  755. <a href="{Permalink}" target="_blank"><div id="wr1"><div id="p">
  756. <div id="wr1_dt"><div id="p">
  757. <h9>{TimeAgo}</h9><h8>{DayOfWeek}</h8>
  758. </div></div>
  759. {block:NoteCount}
  760. <div id="wr1_nt"><h10>{NoteCountWithLabel}</h10></div>
  761. {/block:NoteCount}
  762. </div></div></a>
  763. <!--------->
  764. <a href="{ReblogURL}"target="_blank">
  765. <div id="wr2"><div id="wr2_rb"><h9>reblog</h9><h8>R</h8></div></div></a>
  766. <!--------->
  767. <div id="wr3">
  768. {block:NotReblog}<div id="wr3_notr">
  769. <a href="{Permalink}" target="_blank">
  770. <h9>{DayOfMonth}{DayOfMonthSuffix} of {Month}</h9></a>
  771. </div>{/block:NotReblog}
  772. <div id="p"><div id="wr3_rf"style="margin:0 10px 0 0;" >
  773. {block:RebloggedFrom}<h11>reblogged from:
  774. <a href="{ReblogParentURL}"target="_blank" >{ReblogParentName}</a></h11>
  775. {/block:RebloggedFrom}
  776. {block:ContentSource}<h12>source:<a href="{SourceURL}">
  777. {block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}"height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></h12>
  778. {/block:ContentSource}</div>
  779. {block:HasTags}<div id="wr3_tg"><h8>filed under:</h8>
  780. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  781. </div><div id="wr3_tgl"></div>
  782. {/block:HasTags}
  783. </div></div>
  784. <div id="wrl"></div><div id="wrr"></div>
  785. </div></div>
  786. <!----------------------------------------------------------INFO #2-->
  787.  
  788. <div id="poi2">
  789. <div id="poi2_wr"><div id="poi2_li"></div>
  790. <!--------->
  791. <div id="p2_w1">
  792. <a href="{Permalink}" target="_blank"><div id="p2w1_dt"><div id="p">
  793. <h10>{TimeAgo} </h10><h8>{DayOfWeek}
  794. <h9>{12HourWithZero}.{Minutes}.{Seconds}{CapitalAmPm}</h9></h8>
  795. </div></div></a>
  796. {block:HasTags}<div id="p2w1_tg"><div id="p">
  797. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  798. </div></div>{/block:HasTags}
  799. </div>
  800. <!--------->
  801. <a href="{Permalink}" target="_blank"><div id="p2w2_dt">
  802. <h8>{MonthNumberWithZero} / {DayOfMonthWithZero} / {Year}</h8>
  803. </div></a>
  804. <!--------->
  805. <div id="p2_w2">{block:NoteCount}<a href="{Permalink}" target="_blank">
  806. <div id="p2w2_nt"><h9>notes</h9><h10>{NoteCount}</h10></div></a>
  807. {/block:NoteCount}</div>
  808. <!--------->
  809. </div>
  810.  
  811. <a href="{ReblogURL}"target="_blank">
  812. <div id="poi2_rbb"><h8>reblog</h8> </div></a>
  813. </div>
  814.  
  815. <!----------------------------------------------------------INFO #3-->
  816.  
  817. <div id="poi3"><div id="p3_wr2"><div id="wrr"></div>
  818. <div id="p3wr1">{block:NoteCount}<a href="{Permalink}" target="_blank">
  819. <div id="p2w2_nt"><h9>notes</h9><h10>{NoteCount}</h10></div></a>
  820. {/block:NoteCount}</div>
  821. <a href="{Permalink}" target="_blank"><div id="p2w2_dt">
  822. <h8>{MonthNumberWithZero} / {DayOfMonthWithZero} / {Year}</h8>
  823. </div></a>
  824. <div id="p3wr2">{block:HasTags}<div id="p">
  825. <div id="p3w2_tg"><h8>filed under:</h8>
  826. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  827. </div><div id="wr3_tgl"></div></div>
  828. {/block:HasTags}
  829. </div>
  830. </div></div>
  831.  
  832. {/block:Date}{/block:IndexPage}
  833. <!--------------------------------------------------------PERMALINK-->
  834. {block:Date} {block:PermalinkPage}
  835. <div class="prma">
  836. {block:NoteCount}
  837. <div id="prma_not"><div id="noth8">{NoteCountWithLabel}</div></div>
  838. {/block:NoteCount}
  839.  
  840. <!---------------------NOTES-->
  841. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  842.  
  843. <div id="prma_co1">
  844. <!---------------------DATE-->
  845. <div id="prma_co2"><div id="co2_dt"><div id="p">
  846. <h8>{DayOfWeek}</h8>
  847. <h9>{12HourWithZero}.{Minutes}.{Seconds}{CapitalAmPm}</h9></div></div>
  848. <div id="co2_ta"><div id="p"><h8>{lang:Posted TimeAgo}</h8></div></div>
  849. </div>
  850. <!---------------------TAGS-->
  851. {block:HasTags}<div id="prma_tg"><div id="p">
  852. <h8>filed under</h8>
  853. {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  854. </div></div>{/block:HasTags}</div>
  855.  
  856. <!---------------------pt 1-->
  857. {block:RebloggedFrom}
  858. <div id="prma_rf"><div id="p">
  859. <h11>reblogged from: <a href="{ReblogParentURL}"target="_blank" >{ReblogParentName}</a></h11>
  860. {/block:RebloggedFrom}
  861. {block:ContentSource}
  862. <h12><a href="{SourceURL}">{lang:Source}:
  863. {block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}"height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></h12>
  864. {/block:ContentSource}
  865. </div></div>
  866.  
  867. <!--------------------NOTES-->
  868. {block:PostNotes}
  869. <div id="prma_pnt"><div id="p">{PostNotes}</div></div>
  870. {/block:PostNotes}
  871. </div>{/block:PermalinkPage}{/block:Date}
  872. <!------------------------------END OF PERMALINK-->
  873.  
  874. </div>{/block:Posts}
  875.  
  876. <!-----------------------------------DO NOT DELETE----------->
  877. <!-- {block:NoRebloggedFrom}
  878. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  879. {/block:NoRebloggedFrom} -->
  880.  
  881. {block:ContentSource}<!-- {SourceURL}
  882. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  883. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  884. {/block:ContentSource}
  885. </div></div></div></div></div></div></div></div></div></div></div></div>
  886. </div></div></div></div></div></div></div></div></div></div></div></div>
  887. <!-------------------------------------------------------------CODE ENDS-->
  888. <!-----------------------------------DO NOT DELETE----------->
  889. <div class="sd">
  890. <a href="http://exoa.tumblr.com/"target="_blank"><code>YA</code></a>
  891. <div id="sb">
  892. <a href="http://exoa.tumblr.com/"target="_blank">MADE BY YOONORA</a>
  893. </div></div>
  894. <!-----------------------------------DO NOT DELETE----------->
  895. </body>
  896. <!----------------------------------------SCRIPT #3---->
  897.  
  898. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  899.  
  900. <script type="text/javascript" src="http://static.tumblr.com/me5sfsd/12Qlmj66n/script.js"></script>
  901.  
  902. <script>
  903. $(document).ready(function(){
  904.  
  905. $('.photo-slideshow').pxuPhotoset({
  906. lightbox: true,
  907. rounded: false,
  908. gutter: '4px',
  909. borderRadius: '0px',
  910. photoset: '.photo-slideshow',
  911. photoWrap: '.photo-data',
  912. photo: '.pxu-photo'
  913. });
  914. var $container = $('');
  915. $container.masonry({
  916. itemSelector: '',
  917. isFitWidth: false,
  918. isAnimated : true
  919. });
  920. $container.imagesLoaded(function(){
  921. $container.masonry();
  922. });
  923. });
  924. </script>
  925.  
  926. <!----------------------------------------SCRIPT #3---->
  927.  
  928.  
  929. <script>
  930. // minimal soundcloud player © eoxk.tumblr
  931. $(document).ready(function(){
  932. var color = '{color:5}'; // color of play button (hex)
  933. $('.soundcloud_audio_player').each(function(){
  934. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  935. });
  936. });
  937. </script>
  938.  
  939. <!----------------------------------------SCRIPT #4---->
  940.  
  941. <script>
  942. $(document).ready(function(){
  943.  
  944. $(".one").click(function(){
  945. $(".1").fadeIn();
  946. $(".2,.4").fadeOut();
  947. });
  948.  
  949. $(".two").click(function(){
  950. $(".2").fadeIn();
  951. $(".1,.4").fadeOut();
  952. });
  953. $(".four").click(function(){
  954. $(".4").fadeIn();
  955. $(".1,.2").fadeOut();
  956. });
  957. });
  958. </script>
  959. </html>
Advertisement
Add Comment
Please, Sign In to add comment