Advertisement
builderman_build

Untitled

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