Advertisement
builderman_build

Untitled

Oct 15th, 2016
164
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.63 KB | None | 0 0
  1. <head>
  2. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  3.  
  4. <meta name="color:bold" content="#FFFF4C"/>
  5. <meta name="color:italic" content="#99FFFF"/>
  6. <meta name="color:underline" content="#FF7373"/>
  7. <meta name="color:background" content="#000000"/>
  8. <meta name="color:text" content="#ffffff"/>
  9. <meta name="color:posts" content="#0f0f0f"/>
  10. <meta name="color:border" content="#010101"/>
  11. <meta name="color:link" content="#ECECFB"/>
  12. <meta name="color:linkhover" content="#99FFFF"/>
  13. <meta name="color:blockquote text" content="#ffffff"/>
  14. <meta name="color:blockquote BG" content="#000000"/>
  15. <meta name="color:blockquote border" content="#4ee0df"/>
  16. <meta name="color:h1" content="#ffffff"/>
  17. <meta name="color:h2" content="#cccccc"/>
  18.  
  19. <meta name="color:questionbg" content="#161616"/>
  20. <meta name="color:questionborder" content="#000000"/>
  21. <meta name="color:askedbg" content="#faf3cb"/>
  22. <meta name="color:askedtext" content="#6d6536"/>
  23. <meta name="color:chat line 1" content="#000000"/>
  24. <meta name="color:chat line 2" content="#0a0a0a"/>
  25.  
  26. <meta name="color:lightbeam" content="#faf3cb"/>
  27. <meta name="color:accent1" content="#faf3cb"/>
  28. <meta name="color:accent2" content="#FDEA96"/>
  29. <meta name="color:accent3" content="#00ddff"/>
  30. <meta name="color:accent4" content="#3a828c"/>
  31. <meta name="color:accent5" content="#9aedf9"/>
  32. <meta name="color:sclassbg" content="#000000"/>
  33. <meta name="color:sclassh2bg" content="#FDEA96"/>
  34. <meta name="color:sclassh2text" content="#a89755"/>
  35. <meta name="color:maintab" content="#111111"/>
  36. <meta name="color:leftnavibg" content="#000000"/>
  37. <meta name="color:tabsbg" content="#010101"/>
  38.  
  39.  
  40. <meta name="image:background image" content="http://static.tumblr.com/hczaopr/PiMnyn9vf/static-bright.gif"/>
  41. <meta name="image:sidebar" content="http://static.tumblr.com/hczaopr/jO9nynihx/genoshelp.png"/>
  42. <link rel="shortcut icon" href="{Favicon}" />
  43. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  44.  
  45. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800' rel='stylesheet' type='text/css'>
  46.  
  47.  
  48.  
  49. <style type="text/css">
  50. html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, li, fieldset, form, label, legend, tbody, tfoot, thead, tr, th, td, article, canvas, details, embed, figure, figcaption, footer, hgroup, menu, output, ruby, summary,time, mark, audio, video {
  51. margin: 0;
  52. padding: 0;
  53. border: 0;
  54. font-size: 100%;
  55. font: inherit;
  56. vertical-align: baseline;
  57. }
  58.  
  59. article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  60. display: block;
  61. }
  62.  
  63. body {
  64. line-height: 1;
  65. }
  66.  
  67. ol, ul {
  68. list-style: none;
  69. }
  70.  
  71. table {
  72. border-collapse: collapse;
  73. border-spacing: 0;
  74. }
  75.  
  76. body {line-height: 1;}
  77. ol, ul {list-style: none;}
  78. table {border-collapse: collapse;border-spacing: 0;}
  79. a{text-decoration:none;color:{color:link};}
  80. a:hover {color:{color:linkhover};}
  81. b,strong{color:{color:bold};}
  82. i,em{color:{color:italic};}
  83. u{color:{color:underline};}
  84. .cred{font:700 italic 9px/8px 'open sans';letter-spacing:1px;position:Fixed;bottom:2%;right:5%;}
  85. .cred a:hover{color:{color:bold};}
  86.  
  87. .source{
  88. font-size:8px;
  89. font-weight:800;
  90. text-transform:uppercase;
  91. letter-spacing:2px;
  92. margin:5px 0 0 30px;
  93. color:{color:Text};
  94. }
  95.  
  96. img{max-width:100%;}
  97.  
  98. ::-webkit-scrollbar-thumb {
  99. background:{color:bold};
  100. border:1px solid {color:background};
  101. }
  102.  
  103. ::-webkit-scrollbar {
  104. background:{color:background};
  105. width: 3px;
  106. height: 4px;
  107. }
  108.  
  109. html {
  110. margin:0;
  111. padding:0;
  112. width: 100%;
  113. height: 100%;
  114. }
  115.  
  116. body {
  117. width:100%;
  118. height:100%;
  119. background:{color:Background} url('{image:background image}')repeat right top;
  120. color:{color:text};
  121. -webkit-font-smoothing: antialiased;
  122. -moz-osx-font-smoothing: grayscale;
  123. font-family:'Open sans';
  124. word-wrap: break-word;
  125. }
  126.  
  127. #tabbed{
  128. width:1030px;
  129. height:550px;
  130. position:fixed;
  131. background:{color:maintab};
  132. left:50%;
  133. top:50%;
  134. margin:-275px 0 0 -515px;
  135. }
  136.  
  137. .tabs {
  138. z-index: 15px;
  139. position: relative;
  140. background: {color:maintab};
  141. height:550px;
  142. width: 868px;
  143. margin-left:170px;
  144. box-sizing: border-box;
  145. overflow-x:hidden;
  146. }
  147.  
  148. .tabs-header {
  149. position: absolute;
  150. background: {color:leftnavibg};
  151. overflow: hidden;
  152. width:130px;
  153. padding:0 20px;
  154. height:550px;
  155. }
  156.  
  157. .tabs-header .border {
  158. position: absolute;
  159. margin-top:18px;
  160. left: 15px;
  161. background:{color:lightbeam};
  162. width: 3px !important;
  163. height: 3px;
  164. box-shadow:0px 0px 10px 2px {color:lightbeam};
  165. background-repeat: no-repeat;
  166. -webkit-transition: background-position .15s cubic-bezier(.8, 0, 1, 1),
  167. -webkit-transform .25s cubic-bezier(.8, 0, 1, 1);
  168. -webkit-transition: 0.3s ease;
  169. transition: 0.3s ease;
  170. }
  171.  
  172. .tabs-header ul {
  173. font-size:8px;
  174. font-weight:900;
  175. margin:0;
  176. padding:0;
  177. letter-spacing:2px;
  178. -webkit-box-orient: horizontal;
  179. -webkit-box-direction: normal;
  180. -webkit-flex-direction: row;
  181. -ms-flex-direction: row;
  182. flex-direction: row;
  183. -webkit-flex-wrap: wrap;
  184. -ms-flex-wrap: wrap;
  185. flex-wrap: wrap;
  186. }
  187.  
  188. .tabs-header li {
  189. display:block;
  190. padding:15px 0;
  191. -webkit-transition: 0.3s ease;
  192. transition: 0.3s ease;
  193. }
  194.  
  195. .tabs-header a {
  196. z-index: 1;
  197. display: block;
  198. padding: 0px 20px;
  199. text-decoration: none;
  200. text-transform: uppercase;
  201. }
  202.  
  203. .tabs-nav {
  204. position: absolute;
  205. top: -25px;
  206. right: 0;
  207. height:20px;
  208. display: -webkit-box;
  209. display: -webkit-flex;
  210. display: -ms-flexbox;
  211. display: flex;
  212. -webkit-box-align: center;
  213. -webkit-align-items: center;
  214. -ms-flex-align: center;
  215. align-items: center;
  216. padding: 0 10px;
  217. -webkit-user-select: none;
  218. -moz-user-select: none;
  219. -ms-user-select: none;
  220. user-select: none;
  221. }
  222.  
  223. .tabs-nav i {margin-left:5px;cursor: pointer;}
  224.  
  225. #mainav{
  226. position:absolute;
  227. bottom:0;
  228. text-align:center;
  229. width:170px;
  230. left:0;
  231. }
  232.  
  233. #mainav a{margin:0;width:9px;height:9px;padding:15px;}
  234. #mainav li a:hover{opacity:.4}
  235. #mainav li{display:inline-block;padding:0;margin:0;vertical-align:Top}
  236.  
  237. .tabs-content {
  238. position: relative;
  239. height:550px!important;
  240. -webkit-transition: 0.3s ease;
  241. transition: 0.3s ease;
  242. overflow-y:auto;
  243. overflow-x: hidden;
  244. }
  245.  
  246. .tabs-content .tab {display: none;}
  247. .tabs-content .tab.active {display: block;}
  248.  
  249.  
  250.  
  251.  
  252.  
  253. /* HERO TAB STARTS HERE*/
  254. #hero{
  255. background:{color:tabsbg};
  256. padding-bottom:30px;
  257. position:relative;
  258. }
  259.  
  260. /* DIMENSTIONS FOR SIDEBAR IMAGE IS 446 x 550*/
  261. .heroimg{
  262. width: 600px;
  263. height: 550px;
  264. position:fixed;
  265. background:url('{image:sidebar}')no-repeat left bottom;
  266. -webkit-clip-path: polygon(0 0, 70% 0, 55% 100%, 0% 100%);
  267. clip-path: polygon(0 0, 70% 0, 50% 100%, 0% 100%);
  268. }
  269.  
  270. .herodesc{
  271. width:440px;
  272. position:relative;
  273. left:420px;
  274. top:30px;
  275. }
  276.  
  277. .herodesc .title{
  278. text-shadow:0 0 4px {color:accent1};
  279. font-weight:800;
  280. font-size:40px;
  281. margin:0;
  282. padding:10px 0;
  283. text-transform:uppercase;
  284. text-align:center;
  285. }
  286.  
  287. .herodesc .title span{
  288. max-width:360px;
  289. display:inline-block;
  290. margin:0;
  291. padding:0 25px;
  292. position:relative;
  293. text-align:center;
  294. }
  295.  
  296. .herodesc .title span:before{
  297. content:"";
  298. width:12px;
  299. height: 100%;
  300. position: absolute;
  301. top: -7px;
  302. left: 0;
  303. border-top: 7px solid {color:accent2};
  304. border-left: 7px solid {color:accent2};
  305. border-bottom: 7px solid {color:accent2};
  306. }
  307.  
  308. .herodesc .title span:after{
  309. content:"";
  310. width:12px;
  311. height: 100%;
  312. position: absolute;
  313. top: -7px;
  314. right: 0;
  315. border-top: 7px solid {color:accent2};
  316. border-right: 7px solid {color:accent2};
  317. border-bottom: 7px solid {color:accent2};
  318. }
  319.  
  320. .sclass{
  321. position: absolute;
  322. right: 0;
  323. top: 0;
  324. width:100px;
  325. height: 200px;
  326. font-weight: 800;
  327. }
  328.  
  329. .sclass h2{
  330. font-size: 11px;
  331. text-align: center;
  332. padding:5px 0 6px 10px;
  333. letter-spacing: 1px;
  334. text-transform: uppercase;
  335. background:{color:sclassbg};
  336. }
  337.  
  338. .sclass h2 span{
  339. color:{color:sclassh2text};
  340. background:{color:sclassh2bg};
  341. padding:4px 5px;
  342. margin-left: 15px;
  343. }
  344.  
  345. .stats{
  346. margin:20px 0;
  347. padding:10px 0;
  348. position: relative;
  349. }
  350.  
  351. .stats h1{
  352. font-weight: 800;
  353. font-size: 16px;
  354. text-align:center;
  355. text-transform: uppercase;
  356. display: inline-block;
  357. letter-spacing: 10px;
  358. padding:10px 20px;
  359. position: absolute;
  360. right: -46px;
  361. top: 51px;
  362. color:{color:accent2};
  363. -ms-transform: rotate(90deg);
  364. -webkit-transform: rotate(90deg);
  365. transform: rotate(90deg);
  366. }
  367.  
  368. .stats h1:before,.powers h1:before{
  369. content:"";
  370. width:12px;
  371. height:100%;
  372. position: absolute;
  373. top: -4px;
  374. left: 0;
  375. border-top: 4px solid {color:accent3};
  376. border-left: 4px solid {color:accent3};
  377. border-bottom: 4px solid {color:accent3};
  378. }
  379.  
  380. .stats h1:after,.powers h1:after{
  381. content:"";
  382. width:12px;
  383. height: 100%;
  384. position: absolute;
  385. top: -4px;
  386. right: 0;
  387. border-top: 4px solid {color:accent3};
  388. border-right: 4px solid {color:accent3};
  389. border-bottom: 4px solid {color:accent3};
  390. }
  391.  
  392. .stats ul,.stats li,.powers li,.powers ul{margin: 0;padding: 0}
  393.  
  394. .stats ul.left{
  395. width: 183px;
  396. display: inline-block;
  397. border-right: 1px solid {color:text};
  398. }
  399.  
  400. .stats ul.right{
  401. display: inline-block;
  402. width: 190px;
  403. padding-left:15px;
  404. vertical-align: top;
  405. }
  406.  
  407. .stats li b,.powers li b{color:{color:accent3};font-weight: 800;}
  408.  
  409. .stats li,.powers li{
  410. list-style-type: none;
  411. font-size: 9px;
  412. font-weight: 700;
  413. margin-bottom: 5px;
  414. line-height: 15px;
  415. text-transform:uppercase;
  416. letter-spacing:2px;
  417. }
  418.  
  419. .powers{
  420. position: relative;
  421. width:395px;
  422. left:45px;
  423. }
  424.  
  425. .powers h1{
  426. font-weight: 800;
  427. font-size: 16px;
  428. text-transform: uppercase;
  429. display: inline-block;
  430. letter-spacing: 10px;
  431. padding:10px 20px;
  432. position: absolute;
  433. left: -163px;
  434. text-align:center;
  435. top: 113px;
  436. -ms-transform: rotate(-90deg);
  437. -webkit-transform: rotate(-90deg);
  438. transform: rotate(-90deg);
  439. }
  440. /* HERO TAB ENDS HERE*/
  441.  
  442.  
  443.  
  444.  
  445.  
  446. /* POSTS TAB STARTS HERE*/
  447. #center{
  448. height:550px;
  449. {block:IndexPage}margin-left:13px;width:740px;{/block:IndexPage}
  450. {block:PermalinkPage}width:827px;{/block:PermalinkPage}
  451. }
  452.  
  453. #archive iframe{width:870px;height:545px;}
  454.  
  455. .entry {
  456. font-size:11px;
  457. letter-spacing:.02em;
  458. background:{color:posts};
  459. border:1px solid {color:border};
  460. {block:IndexPage}padding:10px;margin:50px 0 50px 98px;width:250px;{/block:IndexPage}
  461. {block:PermalinkPage}padding:20px;width:400px;{/block:PermalinkPage}
  462. }
  463.  
  464. .tumblr_blog{text-transform:uppercase;letter-spacing:1px;padding:0 3px;font-weight:700;font-size:8px;color:{color:accent4};background:{color:accent5};}
  465. .ent{line-height:16px;}
  466.  
  467. .entry h2{color:{color:h2};font-style:italic;font-weight:300;font-size:22px;}
  468.  
  469. .entry h1{
  470. font-weight:800;
  471. line-height:19px;
  472. font-size:14px;
  473. padding:10px;
  474. margin: 0;
  475. text-transform: uppercase;
  476. text-align: center;
  477. }
  478.  
  479. h1 a{color:{color:h1};}
  480.  
  481. .entry span h1{
  482. margin:0;
  483. position:relative;
  484. padding: 10px 25px;
  485. margin-bottom:20px;
  486. display:block;
  487. }
  488.  
  489. .entry span h1:before{
  490. content:"";
  491. width:12px;
  492. height: 100%;
  493. position: absolute;
  494. top: -4px;
  495. left: 0;
  496. border-top: 4px solid {color:accent2};
  497. border-left: 4px solid {color:accent2};
  498. border-bottom: 4px solid {color:accent2};
  499. }
  500.  
  501. .entry span h1:after{
  502. content:"";
  503. width:12px;
  504. height: 100%;
  505. position: absolute;
  506. top: -4px;
  507. right: 0;
  508. border-top: 4px solid {color:accent2};
  509. border-right: 4px solid {color:accent2};
  510. border-bottom: 4px solid {color:accent2};
  511. }
  512.  
  513. #caption{
  514. width:345px;
  515. padding:0 20px;
  516. line-height:16px;
  517. position:fixed;
  518. margin-left:435px;
  519. }
  520.  
  521. .entry:hover #perma{
  522. opacity:1;
  523. -transition: all 0.6s ease-in-out;
  524. -webkit-transition: all 0.6s ease-in-out;
  525. -moz-transition: all 0.6s ease-in-out;
  526. -o-transition: all 0.6s ease-in-out;
  527. }
  528.  
  529. #question{
  530. background:{color:questionbg};
  531. padding:15px;
  532. border:1px solid {color:questionborder};
  533. margin-bottom:10px;
  534. position:relative;
  535. text-transform:uppercase;
  536. letter-spacing:1px;
  537. font-weight:700;
  538. line-height:12px;
  539. font-size:8px;
  540. }
  541.  
  542. #question i{
  543. margin-right:15px;
  544. text-transform:uppercase;
  545. letter-spacing:1px;
  546. padding:0 3px;
  547. font-weight:700;
  548. font-size:8px;
  549. color:{color:askedtext};
  550. background:{color:askedbg};
  551. }
  552.  
  553. #question a{color:{color:accent2}!important;}
  554.  
  555. #question spans{
  556. font-weight:800;
  557. text-align:center;
  558. display:inline-block;
  559. margin-bottom:2px;
  560. position:relative;
  561. padding:0px 5px;
  562. }
  563.  
  564. #question spans:after{
  565. content:"";
  566. width:5px;
  567. height: 100%;
  568. position: absolute;
  569. top: -1px;
  570. right: 0;
  571. border-top: 1px solid {color:accent3};
  572. border-right: 1px solid {color:accent3};
  573. border-bottom: 1px solid {color:accent3};
  574. }
  575.  
  576. #question spans:before{
  577. content:"";
  578. width:5px;
  579. height: 100%;
  580. position: absolute;
  581. top: -1px;
  582. left: 0;
  583. border-top: 1px solid {color:accent3};
  584. border-left: 1px solid {color:accent3};
  585. border-bottom: 1px solid {color:accent3};
  586. }
  587.  
  588. #question:after{
  589. content:"";
  590. width:12px;
  591. height: 100%;
  592. padding:1px 0;
  593. position: absolute;
  594. top: -3px;
  595. right: -3px;
  596. border-top: 2px solid {color:accent2};
  597. border-right: 2px solid {color:accent2};
  598. border-bottom: 2px solid {color:accent2};
  599. }
  600.  
  601. #question:before{
  602. content:"";
  603. width:12px;
  604. height: 100%;
  605. padding:1px 0;
  606. position: absolute;
  607. top: -3px;
  608. left: -3px;
  609. border-top: 2px solid {color:accent2};
  610. border-left: 2px solid {color:accent2};
  611. border-bottom: 2px solid {color:accent2};
  612. }
  613.  
  614. #perma{
  615. font-size:8px;
  616. font-weight:700;
  617. letter-spacing:2px;
  618. text-transform:uppercase;
  619. {block:IndexPage}opacity:0;bottom:-17px;right:0;position:Absolute;{/block:IndexPage}
  620. {block:PermalinkPage}margin-bottom:20px;{/block:PermalinkPage}
  621. -transition: all 0.6s ease-in-out;
  622. -webkit-transition: all 0.6s ease-in-out;
  623. -moz-transition: all 0.6s ease-in-out;
  624. -o-transition: all 0.6s ease-in-out;
  625. }
  626.  
  627. #perma b{font-weight:800;color:{color:bold};}
  628.  
  629. .pma{
  630. display:inline-block;
  631. margin:-3px 10px 0 0;
  632. background:{color:lightbeam};
  633. width: 3px !important;
  634. height: 3px;
  635. border-radius: 30px;
  636. box-shadow:0px 0px 10px 2px {color:lightbeam};
  637. }
  638.  
  639. #tags{
  640. margin-bottom:20px;
  641. padding-bottom:20px;
  642. border-bottom:1px solid {color:accent2};
  643. font-size:8px;
  644. font-weight:700;
  645. letter-spacing:2px;
  646. text-transform:uppercase;
  647. }
  648.  
  649. #tags a{margin-right:10px;}
  650.  
  651. #alart{
  652. display:inline-block;
  653. vertical-align:top;
  654. {block:IndexPage}width:193px;{/block:IndexPage}
  655. {block:PermalinkPage}width:343px;{/block:PermalinkPage}
  656. }
  657.  
  658. #alart h1{
  659. text-align:center;
  660. font-size:9px;
  661. letter-spacing:2px;
  662. text-transform:uppercase;
  663. }
  664.  
  665. .audio{
  666. width:18px;
  667. height:20px;
  668. overflow:hidden;
  669. margin:-2px auto 0 auto;
  670. }
  671.  
  672. #audio{
  673. display:inline-block;
  674. width:20px;
  675. padding:10px 13px 13px 10px;
  676. height:20px;
  677. overflow:hidden;
  678. border-radius:50px;
  679. background:#000;
  680. margin:10px 10px 10px 0;
  681. }
  682.  
  683. ol.notes {
  684. background-color:{color:posts};
  685. width:400px;
  686. height:300px;
  687. overflow:auto;
  688. text-align:left;
  689. padding: 0px;
  690. margin-top:50px;
  691. }
  692.  
  693. blockquote{
  694. text-align:left;
  695. padding:5px;
  696. background:{color:blockquote BG};
  697. font-size:10px;
  698. letter-spacing:1px;
  699. line-height:13px;
  700. color:{color:blockquote text};
  701. }
  702.  
  703. ul{list-style-type:square;}
  704. li{list-style-type:square;}
  705.  
  706. ol.notes li.note {
  707. font-size:8px;
  708. font-weight:700;
  709. letter-spacing:2px;
  710. text-transform:uppercase;
  711. list-style-type:none;
  712. padding: 10px;
  713. border-top: solid 1px {color:border};
  714. }
  715.  
  716. ol.notes li.note img.avatar {
  717. list-style-type:none;
  718. vertical-align: -4px;
  719. margin-right: 10px;
  720. width: 16px;
  721. height: 16px;
  722. border-radius:3px;
  723. }
  724.  
  725. ol.notes li.note span.action {list-style-type:none;font-weight:normal;}
  726. ol.notes li.note .answer_content {list-style-type:none;font-weight: normal;}
  727.  
  728. ol.notes li.note blockquote {
  729. border-color: {color:accent2};
  730. padding: 4px 10px;
  731. margin: 10px 0px 0px 25px;
  732. }
  733.  
  734. ol.notes li.note blockquote a {text-decoration: none;}
  735. ul.chat {margin: 0;padding: 0;}
  736.  
  737. .chat li {
  738. list-style-type: none;
  739. margin-left: 0px;
  740. padding: 15px 10px;
  741. border-radius:17px;
  742. }
  743.  
  744. .chat li.odd {
  745. {block:IndexPage}width:220px;{/block:IndexPage}
  746. {block:PermalinkPage}width:370px;{/block:PermalinkPage}
  747. background-color:{color:chat line 1};
  748. position:relative;
  749. margin:0 0 0 10px;
  750. }
  751.  
  752. .chat li.even {
  753. {block:IndexPage}width:160px;{/block:IndexPage}
  754. {block:PermalinkPage}width:313px;{/block:PermalinkPage}
  755. margin:10px 0 10px 60px;
  756. background-color:{color:chat line 2};
  757. position:relative;
  758. }
  759.  
  760. .chat li.even:after{
  761. content:"";
  762. position:Absolute;
  763. top:50%;
  764. right:-7px;
  765. width: 0;
  766. height: 0;
  767. border-top: 5px solid transparent;
  768. border-left: 10px solid {color:chat line 2};
  769. border-bottom: 5px solid transparent;
  770. }
  771.  
  772. .chat li.odd:after{
  773. content:"";
  774. position:Absolute;
  775. top:50%;
  776. left:-7px;
  777. width: 0;
  778. height: 0;
  779. border-top: 5px solid transparent;
  780. border-right: 10px solid {color:chat line 1};
  781. border-bottom: 5px solid transparent;
  782. }
  783.  
  784. .label {
  785. font-weight:800;
  786. font-size:9px;
  787. text-transform:uppercase;
  788. letter-spacing:2px;
  789. color:{color:bold};
  790. }
  791.  
  792. .pagination {display: none;}
  793. #pagination{border-top:1px solid {color:accent2};font-size:9px;letter-spacing:2px;font-weight:800;padding:20px 0;text-align:center;}
  794. #pagination a{margin:0 10px;}
  795.  
  796. /* POSTS TAB ENDS HERE*/
  797.  
  798.  
  799.  
  800.  
  801.  
  802.  
  803.  
  804.  
  805.  
  806.  
  807.  
  808. /* BLOGROLL TAB STARTS HERE*/
  809.  
  810. #blogroll {
  811. width: 90%;
  812. margin: 0 auto;
  813. }
  814.  
  815. #fol{
  816. margin:0 30px 30px 0;
  817. height:64px;
  818. width:64px;
  819. display:inline-block;
  820. background:{color:background};
  821. position:relative;
  822. }
  823.  
  824. .name{
  825. position:absolute;
  826. top: 50%;
  827. transform: translateY(-50%);
  828. left:-2.5px;
  829. width:59px;
  830. padding:5px 5px;
  831. text-align:center;
  832. font-size:8px;
  833. font-weight:800;
  834. letter-spacing:1px;
  835. opacity:0;
  836. text-transform:uppercase;
  837. -webkit-transition: .2s ease-in-out;
  838. -moz-transition: .2s ease-in-out;
  839. -ms-transition: .2s ease-in-out;
  840. -transition: .2s ease-in-out;
  841. }
  842.  
  843. .name:before{
  844. content:"";
  845. width:12px;
  846. height:100%;
  847. position: absolute;
  848. top: -1px;
  849. left: 0;
  850. border-top: 1px solid {color:accent1};
  851. border-left: 1px solid {color:accent1};
  852. border-bottom: 1px solid {color:accent1};
  853. }
  854.  
  855. .name:after{
  856. content:"";
  857. width:12px;
  858. height: 100%;
  859. position: absolute;
  860. top: -1px;
  861. right: 0;
  862. border-top: 1px solid {color:accent1};
  863. border-right: 1px solid {color:accent1};
  864. border-bottom: 1px solid {color:accent1};
  865. }
  866.  
  867. #fol:hover img{
  868. opacity:0;
  869. -webkit-transition: .3s ease-in-out;
  870. -moz-transition: .3s ease-in-out;
  871. -ms-transition: .3s ease-in-out;
  872. -transition: .3s ease-in-out;
  873. }
  874.  
  875. #fol img{
  876. -webkit-transition: .3s ease-in-out;
  877. -moz-transition: .3s ease-in-out;
  878. -ms-transition: .3s ease-in-out;
  879. -transition: .3s ease-in-out;
  880. }
  881.  
  882. #fol:hover .name {
  883. opacity: 1;
  884. -webkit-transition: .9s ease-in-out;
  885. -moz-transition: .9s ease-in-out;
  886. -ms-transition: .9s ease-in-out;
  887. -transition: .9s ease-in-out;
  888. }
  889. /* BLOGROLL TAB ENDS HERE*/
  890.  
  891.  
  892.  
  893.  
  894.  
  895.  
  896. /* ASKBOX TAB STARTS HERE*/
  897. #askbox{
  898. position:absolute;
  899. top: 50%;
  900. transform: translateY(-50%);
  901. left:50%;
  902. width:500px;
  903. margin-left:-250px;
  904. }
  905. /* ASKBOX ENDS ENDS HERE*/
  906.  
  907.  
  908.  
  909.  
  910.  
  911.  
  912.  
  913. /* TAG LINKS TAB STARTS HERE*/
  914. #tagnav{
  915. width:910px;
  916. height:550px;
  917. }
  918.  
  919. .tnav{
  920. display:inline-block;
  921. vertical-align:middle;
  922. background:{color:posts};
  923. width:200px;
  924. padding:10px;
  925. margin:38px;
  926. }
  927.  
  928. .tnav li{list-style-type:none;border-bottom:1px solid {color:border};padding:10px 0;}
  929.  
  930. .tnav li a{
  931. font-weight:800;
  932. font-size:8px;
  933. margin-left:5px;
  934. display:block;
  935. text-transform:uppercase;
  936. letter-spacing:2px;
  937. position:Relative;
  938. }
  939.  
  940. .tnav li a:hover:before{opacity:1;}
  941.  
  942. .tnav li a:before{
  943. opacity:0;
  944. content:"";
  945. position:absolute;
  946. left:-30px;
  947. top:4px;
  948. background: {color:background};
  949. width: 8px !important;
  950. height: 8px;
  951. border-radius: 30px;
  952. background-image: -webkit-radial-gradient( hsla(56,100%,90%,1) 0%, hsla(56,100%,70%,1) 15%, hsla(56,100%,60%,.3) 28%, hsla(56,100%,30%,0) 70% );
  953. background-repeat: no-repeat;
  954. -webkit-transition: background-position .15s cubic-bezier(.8, 0, 1, 1),
  955. -webkit-transform .25s cubic-bezier(.8, 0, 1, 1);
  956. -webkit-transition: 0.3s ease;
  957. transition: 0.3s ease;
  958. }
  959.  
  960. .tnav h1{
  961. width:200px;
  962. top:-10px;
  963. left:-15px;
  964. font-weight:800;
  965. line-height:19px;
  966. font-size:14px;
  967. text-transform: uppercase;
  968. text-align: center;
  969. position:relative;
  970. padding: 10px 15px;
  971. display:block;
  972. }
  973.  
  974. .tnav h1:before{
  975. content:"";
  976. width:12px;
  977. height: 100%;
  978. position: absolute;
  979. top: -4px;
  980. left: 0;
  981. border-top: 4px solid {color:accent3};
  982. border-left: 4px solid {color:accent3};
  983. border-bottom: 4px solid {color:accent3};
  984. }
  985.  
  986. .tnav h1:after{
  987. content:"";
  988. width:12px;
  989. height: 100%;
  990. position: absolute;
  991. top: -4px;
  992. right: 0;
  993. border-top: 4px solid {color:accent3};
  994. border-right: 4px solid {color:accent3};
  995. border-bottom: 4px solid {color:accent3};
  996. }
  997. /* TAG LINKS TAB ENDS HERE*/
  998. </style>
  999. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1000. <script>
  1001. // minimal soundcloud player © shythemes.tumblr
  1002. $(document).ready(function(){
  1003. var color = '#ffe500'; // color of play button (hex)
  1004. $('.soundcloud_audio_player').each(function(){
  1005. $(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%' });
  1006. });
  1007. });
  1008. </script>
  1009. </head>
  1010. <body>
  1011.  
  1012.  
  1013. <div class="pagination">
  1014. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  1015. </div>
  1016.  
  1017.  
  1018.  
  1019.  
  1020.  
  1021.  
  1022.  
  1023.  
  1024.  
  1025.  
  1026.  
  1027.  
  1028.  
  1029.  
  1030.  
  1031. <!-- TABS START HERE -->
  1032. <div id="tabbed">
  1033.  
  1034.  
  1035. <!-- LEFT NAVIGATION STARTS HERE -->
  1036. <div class="tabs-header">
  1037. <div class="border"></div>
  1038. <ul>
  1039. <li class="active"><a href="#tab-2" tab-id="2">Hero Posts</a></li>
  1040. <li><a href="#tab-1" tab-id="1">Hero</a></li>
  1041. <li><a href="#tab-3" tab-id="3">fanclub</a></li>
  1042. <li><a href="#tab-4" tab-id="4">fanmail</a></li>
  1043. <li><a href="#tab-5" tab-id="5">Linked</a></li>
  1044. </ul>
  1045.  
  1046.  
  1047.  
  1048. <div id="mainav">
  1049. <li><a href="/"><img src="http://static.tumblr.com/hczaopr/MY4nyiep5/home.png"></a></li>
  1050. <li><a href="#tab-4" tab-id="4"><img src="http://static.tumblr.com/hczaopr/3IZnyif2c/msg.png"></a></li>
  1051. <li><a href="/archive"><img src="http://static.tumblr.com/hczaopr/d05nyif2m/calendar.png"></a></li>
  1052. <li><a href="#tab-5" tab-id="5"><img src="http://static.tumblr.com/hczaopr/5JInyif2t/extra.png"></a></li>
  1053. </div>
  1054. </div>
  1055. <!-- LEFT NAVIGATION ENDS HERE -->
  1056.  
  1057.  
  1058.  
  1059. <div class="tabs">
  1060. <div class="tabs-content">
  1061.  
  1062.  
  1063. <!-- ABOUT TAB STARTS HERE -->
  1064. <div tab-id="1" class="tab">
  1065. <div id="hero">
  1066. <div class="sclass"><h2>S-class<span>14</span></h2></div>
  1067.  
  1068. <div class="heroimg"></div>
  1069.  
  1070. <div class="herodesc">
  1071. <div class="title"><Span>Genos</span></div>
  1072.  
  1073. <div class="stats">
  1074. <h1>Stats</h1>
  1075. <ul class="left">
  1076. <li><b>Race</b> Human-based cyborg</li>
  1077. <li><b>Alias</b> Demon Cyborg</li>
  1078. <li><b>Age</b> 19</li>
  1079. <li><b>Sex</b> Male</li>
  1080. <li><b>Height</b> 178cm (5'10")</li>
  1081. <li><b>Location</b> Z-City</li>
  1082. <li></li>
  1083. </ul>
  1084.  
  1085. <ul class="right">
  1086. <li><b>Occupation</b> Hero</li>
  1087. <li><b>Level</b> S-Class</li>
  1088. <li><b>Affiliations</b> Hero Association</li>
  1089. <li><b>Partner(s)</b> Saitama</li>
  1090. <li><b>Weapons</b> Cyborg body</li>
  1091. </ul>
  1092. </div>
  1093.  
  1094.  
  1095. <div class="powers">
  1096. <h1>Cyborg Mods</h1>
  1097. <ul>
  1098. <li><b>Heat Beams</b> Genos's palms contain ports which allow him to fire large and powerful blasts of heat or flame significant distances</li>
  1099. <li><b>Core</b> Genos' cyborg parts are powered by an orb in his chest labeled "core," designed by Dr. Stench. </li>
  1100. <li><b>Armor and Replacement Parts</b> Genos can lose limbs or have his body torn asunder, only to return to perfect 'health' through replacement parts and repairs</li>
  1101. <li><b>Sensors</b> Genos's android body contains a number of passive and active sensors which allow him to scan the environment for enemies, both during active combat and while scouting from a distance.</li>
  1102. <li><b>Anti-Saitama Tactical Arms</b> These arms are differentiated from his normal arms by being black, having much larger shoulders, forearms and fists and generating a glow between the plates of metal and having his eyes go white when active. </li>
  1103. <li><b></b></li>
  1104. </ul>
  1105.  
  1106. </div>
  1107. </div>
  1108. </div>
  1109. </div>
  1110. <!-- ABOUT TAB ENDS HERE -->
  1111.  
  1112.  
  1113.  
  1114.  
  1115.  
  1116.  
  1117. <!-- POSTS TAB STARTS HERE -->
  1118. <div tab-id="2" class="tab active">
  1119.  
  1120. <div id="center">
  1121. {block:Posts}
  1122. <div class="entry">
  1123.  
  1124. {block:PermalinkPage}
  1125. <div id="caption">
  1126. <div id="perma">
  1127. {block:Date}<b>{12HourWithZero}:{Minutes}:{Seconds}</b> — {TimeAgo}{/block:Date} <b>|</b> {NoteCount} <b>|</b> <a href="/random">Random</a>{block:RebloggedFrom} <b>|</b> <a href="{ReblogParentURL}">Via</a> <b>/</b> <a href="{ReblogRootURL}">Source</a>{/block:RebloggedFrom}
  1128. </div>
  1129.  
  1130. {block:HasTags}
  1131. <div id="tags">
  1132. <b>Archived under:</b> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  1133. </div>
  1134. {/block:HasTags}
  1135. {block:Caption}
  1136. {Caption}
  1137. {/block:Caption}
  1138. </div>
  1139. {/block:PermalinkPage}
  1140.  
  1141. {block:IndexPage}
  1142. <div id="perma">
  1143. <a href="{permalink}"><div class="pma"></div> {NoteCount}</a>
  1144. </div>
  1145. {/block:IndexPage}
  1146.  
  1147. {block:Text}
  1148. {block:Title}
  1149. <span><h1><a href="{permalink}">{Title}</a></h1></span>
  1150. {/block:Title}
  1151. <div class="ent">{Body}</div>
  1152. {/block:Text}
  1153.  
  1154.  
  1155.  
  1156. {block:Link}
  1157. <span><h1><a href="{URL}" {Target}>{Name}</a></h1></span>
  1158. {block:Description}<div class="ent">{Description}</div>{/block:Description}
  1159. {/block:Link}
  1160.  
  1161.  
  1162.  
  1163.  
  1164. {block:Photo}
  1165. {block:IndexPage}<a href="{permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"></a>{/block:IndexPage}
  1166.  
  1167. {block:PermalinkPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{/block:PermalinkPage}
  1168. {/block:Photo}
  1169.  
  1170.  
  1171.  
  1172. {block:Photoset}
  1173. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  1174.  
  1175. {block:permalinkpage}{Photoset-400}{/block:permalinkpage}
  1176. {/block:Photoset}
  1177.  
  1178.  
  1179.  
  1180. {block:Quote}
  1181. <h2>{Quote}</h2>
  1182. {block:Source}<div class="source">— {Source}{/block:Source}</div>
  1183. {/block:Quote}
  1184.  
  1185.  
  1186.  
  1187. {block:Chat}
  1188. {block:Title}<span><h1><a href="{Permalink}">{Title}</a></h1></span>{/block:Title}
  1189.  
  1190. <ul class="chat">
  1191. {block:Lines}
  1192. <li class="{Alt} user_{UserNumber}">
  1193. {block:Label}
  1194. <span class="label">{Label}</span>
  1195. {/block:Label}{Line}</li>{/block:Lines}
  1196. </ul>
  1197. {/block:Chat}
  1198.  
  1199.  
  1200.  
  1201. {block:Video}
  1202. {block:IndexPage}{Video-250}{/block:IndexPage}
  1203. {block:permalinkpage}{Video-400}{/block:permalinkpage}
  1204. {/block:Video}
  1205.  
  1206.  
  1207.  
  1208.  
  1209. {block:Audio}
  1210. <div id="audio"><div class="audio">{AudioPlayerBlack}</div></div>
  1211. <div id="alart">
  1212. {block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
  1213. {block:permalinkpage}{block:AlbumArt}<img src="{AlbumArtURL}">
  1214. {/block:AlbumArt}{/block:permalinkpage}
  1215. </div>
  1216. {/block:Audio}
  1217.  
  1218.  
  1219.  
  1220.  
  1221.  
  1222.  
  1223. {block:Answer}
  1224. <div id="question"><spans><a href="{Permalink}">{Asker}</a></spans> <i>asked</i>{Question}</div>
  1225. {Answer}
  1226. {/block:answer}
  1227.  
  1228.  
  1229.  
  1230.  
  1231.  
  1232.  
  1233.  
  1234. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1235.  
  1236.  
  1237. </div>
  1238.  
  1239.  
  1240.  
  1241. {block:ContentSource} <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}--> {/block:ContentSource}
  1242. {/block:Posts}
  1243. </div>
  1244.  
  1245. {block:Pagination}
  1246. <div id="pagination">
  1247. <b>{CurrentPage}</b> OF <b>{TotalPages}</b><br><br>
  1248. {block:PreviousPage}<a href="{PreviousPage}"><img src="http://static.tumblr.com/hczaopr/zRonynll8/before.png"></a>{/block:PreviousPage}
  1249. {block:NextPage}<a href="{NextPage}"><img src="http://static.tumblr.com/hczaopr/ZFvnynll3/next.png"></a>{/block:NextPage}
  1250. </div>
  1251. {/block:Pagination}
  1252. </div>
  1253.  
  1254. <!-- POSTS TAB ENDS HERE -->
  1255.  
  1256.  
  1257.  
  1258.  
  1259.  
  1260.  
  1261.  
  1262.  
  1263.  
  1264.  
  1265.  
  1266.  
  1267.  
  1268.  
  1269. <!-- BLOGROLL TAB STARTS HERE -->
  1270. <div tab-id="3" class="tab">
  1271. <div id="blogroll"><center>
  1272. {block:Following}{block:Followed}
  1273. <a href='{FollowedURL}'><div id="fol"><img src='{FollowedPortraitURL-64}'><span class="name">{FollowedName}</span></div></a>{/block:Followed}{/block:Following}
  1274. </center></div>
  1275. </div>
  1276.  
  1277. <!-- BLOGROLL TAB ENDS HERE -->
  1278.  
  1279.  
  1280.  
  1281.  
  1282.  
  1283. <!-- ASKBOX TAB STARTS HERE. MAKE SURE YOU CHANGE ADDYOURTUMBLRNAMEHERE.tumblr.com TO YOUR TUMBLR URL -->
  1284. <div tab-id="4" class="tab">
  1285. <div id="askbox">
  1286. <iframe frameborder="0" scrolling="no" width="100%" height="190" src="https://www.tumblr.com/ask_form/ADDYOURTUMBLRNAMEHERE.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]-->
  1287. </div>
  1288. </div>
  1289. <!-- ASKSBOX TAB ENDS HERE -->
  1290.  
  1291.  
  1292.  
  1293.  
  1294.  
  1295.  
  1296. <!-- LINKS/TAGS TAB STARTS HERE -->
  1297. <div tab-id="5" class="tab">
  1298.  
  1299. <div id="tagnav">
  1300.  
  1301. <div class="tnav">
  1302. <h1>TITLE OF BOX GOES HERE</h1>
  1303. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1304. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1305. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1306. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1307. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1308. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1309. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1310. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1311. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1312. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1313. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1314. </div>
  1315.  
  1316. <div class="tnav">
  1317. <h1>TITLE OF BOX GOES HERE</h1>
  1318. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1319. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1320. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1321. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1322. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1323. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1324. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1325. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1326. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1327. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1328. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1329. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1330. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1331. </div>
  1332.  
  1333.  
  1334. <div class="tnav">
  1335. <h1>title 3</h1>
  1336. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1337. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1338. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1339. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1340. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1341. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1342. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1343. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1344. </div>
  1345.  
  1346.  
  1347. <div class="tnav">
  1348. <h1>TITLE OF BOX GOES HERE</h1>
  1349. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1350. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1351. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1352. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1353. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1354. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1355. </div>
  1356.  
  1357. <div class="tnav">
  1358. <h1>TITLE OF BOX GOES HERE</h1>
  1359. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1360. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1361. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1362. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1363. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1364. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1365. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1366. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1367. </div>
  1368.  
  1369. <div class="tnav">
  1370. <h1>TITLE OF BOX GOES HERE</h1>
  1371. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1372. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1373. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1374. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1375. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1376. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1377. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1378. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1379. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1380. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1381. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1382. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1383. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1384. <li><a href="LINK URL GOES HERE">NAME OF LINK GOES HERE</a></li>
  1385. </div>
  1386.  
  1387. </div>
  1388. </div>
  1389. <!-- LINKS/TAGS TAB ENDS HERE -->
  1390.  
  1391.  
  1392.  
  1393. <!-- ARCHIVES TAB STARTS HERE. MAKE SURE YOU REPLACE THE "INSERT YOUR URL HERE" WITH YOUR OWN TUMBLR URL. -->
  1394. <div tab-id="6" class="tab">
  1395. <div id="archive">
  1396. <iframe src="http://INSERT YOUR URL HERE.tumblr.com/archive"></iframe>
  1397. </div>
  1398. </div>
  1399. <!-- ARCHIVE TAB ENDS HERE -->
  1400.  
  1401.  
  1402. </div>
  1403. </div>
  1404. </div>
  1405.  
  1406. <!-- TABS END HERE -->
  1407.  
  1408.  
  1409.  
  1410.  
  1411.  
  1412. <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
  1413. <script src="http://static.tumblr.com/hczaopr/3JLny6m46/index.js"></script>
  1414. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1415. <div class="cred"><a href="http://ninpen.tumblr.com/">thm.</a></div>
  1416. <script>
  1417. $(function(){
  1418. var $container = $('#center');
  1419. $container.imagesLoaded(function(){
  1420. $container.masonry({
  1421. itemSelector: '.entry',
  1422. });
  1423. });
  1424. $container.infinitescroll({
  1425. itemSelector : ".entry",
  1426. navSelector : "div.pagination",
  1427. nextSelector : ".pagination a#next",
  1428. loadingImg : "",
  1429. loadingText : "<em></em>",
  1430. bufferPx : 10000,
  1431. extraScrollPx: 12000,
  1432. },
  1433. // trigger Masonry as a callback
  1434. function( newElements ) {
  1435. var $newElems = $( newElements ).css({ opacity: 0 });
  1436. // ensure that images load before adding to masonry layout
  1437. $newElems.imagesLoaded(function(){
  1438. $newElems.animate({ opacity: 1 });
  1439. $container.masonry( 'appended', $newElems, true );
  1440. });
  1441. }
  1442. );
  1443. });
  1444. </script>
  1445.  
  1446.  
  1447. </body>
  1448. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement