API tools faq
paste
feiinho

Theme 12: Infinity

feiinho
Jun 3rd, 2018
393
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 39.09 KB | None | 0 0
raw download clone embed print report diff
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!--theme 12 by arithemes/darthvcder. don't steal or use as base. thanks. credit to neonbikes themes for the tabs base code.-->
  5.  
  6. <head>
  7.  
  8.  
  9.  
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{FavIcon}" />
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  13.  
  14.  
  15.  
  16.  
  17.  
  18. <meta name="image:Background" content=""/>
  19. <meta name="image:Sidebar" content=""/>
  20. <meta name="image:About Image" content=""/>
  21.  
  22. <meta name="color:About Background" content="#fff"/>
  23. <meta name="color:About Border" content="#eee"/>
  24. <meta name="color:About Text" content="#9c9c9c"/>
  25. <meta name="color:About Info Title Bg" content="#fcfcfc"/>
  26. <meta name="color:About Info Border" content="#eee"/>
  27. <meta name="color:About Info Title" content=""/>
  28. <meta name="color:Ask Background" content="#fff" />
  29. <meta name="color:Ask Text" content="#797979"/>
  30. <meta name="color:Background" content="#fcfcfc" />
  31. <meta name="color:Blockquote" content="#fcfcfc"/>
  32. <meta name="color:Blogroll Background" content="#fff"/>
  33. <meta name="color:Blogroll Border" content="#eee"/>
  34. <meta name="color:Bold" content="#797979"/>
  35. <meta name="color:Border" content="#eee"/>
  36. <meta name="color:Chat Even Background" content="#fcfcfc"/>
  37. <meta name="color:Chat Even Text" content="#9c9c9c"/>
  38. <meta name="color:Chat Odd Background" content="#fff"/>
  39. <meta name="color:Chat Odd Text" content="#9c9c9c"/>
  40. <meta name="color:Credit" content="#000"/>
  41. <meta name="color:Custom Links" content="#797979"/>
  42. <meta name="color:Custom Links Background" content="#fff"/>
  43. <meta name="color:Custom Links Border"content="#eee"/>
  44. <meta name="color:Date" content="#d1cccc"/>
  45. <meta name="color:Description Background" content="#fff"/>
  46. <meta name="color:Description Border" content="#eee"/>
  47. <meta name="color:Description Text" content="#9c9c9c"/>
  48. <meta name="color:Following Background" content="#fcfcfc"/>
  49. <meta name="color:Following Blog Title" content=""/>
  50. <meta name="color:Following Border" content="#eee"/>
  51. <meta name="color:Following Url" content="#9c9c9c"/>
  52. <meta name="color:Italics" content="#797979"/>
  53. <meta name="color:Link" content="#797979"/>
  54. <meta name="color:Link Hover" content="#000"/>
  55. <meta name="color:Message Answer" content="#d1cccc"/>
  56. <meta name="color:Message Background" content="#fff"/>
  57. <meta name="color:Message Border" content="#eee"/>
  58. <meta name="color:Message QA Bg" content="#fcfcfc"/>
  59. <meta name="color:Message QA Border" content="#eee"/>
  60. <meta name="color:Message Question" content=""/>
  61. <meta name="color:Navigation Background" content="#fff"/>
  62. <meta name="color:Navigation Border" content="#eee"/>
  63. <meta name="color:Navigation Filter" content="#b5b5b5"/>
  64. <meta name="color:Navigation Filter Selected" content=""/>
  65. <meta name="color:Navigation Tags" content="#9c9c9c"/>
  66. <meta name="color:Navigation Tags Hover" content="#fff"/>
  67. <meta name="color:Navigation Tags Bg" content="#fcfcfc"/>
  68. <meta name="color:Navigation Tags Bg Hover" content=""/>
  69. <meta name="color:Navigation Tags Border" content="#eee"/>
  70. <meta name="color:Permalink" content="#d1cccc"/>
  71. <meta name="color:Post Background" content="#fff"/>
  72. <meta name="color:Scrollbar" content="#797979"/>
  73. <meta name="color:Sidebar Background" content="#fff"/>
  74. <meta name="color:Tab Link" content="#bd5815"/>
  75. <meta name="color:Tab Link Active" content="#eee"/>
  76. <meta name="color:Tab Link Background" content="#fff"/>
  77. <meta name="color:Tab Link Border" content="#eee"/>
  78. <meta name="color:Tags" content="#797979"/>
  79. <meta name="color:Tags Background" content="#fff"/>
  80. <meta name="color:Tags Border" content="#eee"/>
  81. <meta name="color:Text" content="#9c9c9c"/>
  82. <meta name="color:Title" content="#d1cccc"/>
  83. <meta name="color:Title Background" content="#fff"/>
  84. <meta name="color:Title Border" content="#eee"/>
  85.  
  86.  
  87. <meta name="if:250 Posts" content="1"/>
  88.  
  89. <meta name="if:About Tab" content="1"/>
  90. <meta name="if:Navigation Tab" content="1"/>
  91. <meta name="if:Message Tab" content="1"/>
  92. <meta name="if:Blogroll Tab" content="1"/>
  93.  
  94. <meta name="text:Link One Url" content="/"/>
  95. <meta name="text:Link One Title" content="link one"/>
  96. <meta name="text:Link Two Url" content="/"/>
  97. <meta name="text:Link Two Title" content="link two"/>
  98. <meta name="text:Link Three Url" content="/"/>
  99. <meta name="text:Link Three Title" content="link three"/>
  100. <meta name="text:Link Four Url" content="/"/>
  101. <meta name="text:Link Four Title" content="link four"/>
  102. <meta name="text:Link Five Url" content="/"/>
  103. <meta name="text:Link Five Title" content="link five"/>
  104. <meta name="text:Link Six Url" content="/"/>
  105. <meta name="text:Link Six Title" content="link six"/>
  106.  
  107. <meta name="text:About Info Title 1" content="name"/>
  108. <meta name="text:About Info 1" content="name"/>
  109. <meta name="text:About Info Title 2" content="age"/>
  110. <meta name="text:About Info 2" content="age"/>
  111. <meta name="text:About Info Title 3" content="pronouns"/>
  112. <meta name="text:About Info 3" content="pronouns"/>
  113. <meta name="text:About Info Title 4" content="location"/>
  114. <meta name="text:About Info 4" content="location"/>
  115. <meta name="text:About Info Title 5" content="extra"/>
  116. <meta name="text:About Info 5" content="ur info"/>
  117. <meta name="text:About Info Title 6" content="extra"/>
  118. <meta name="text:About Info 6" content="ur info"/>
  119. <meta name="text:About Text" content=""/>
  120.  
  121. <meta name="text:Url" content="your url without the http:// part or the .tumblr.com part. for example i'd put arithemes"/>
  122.  
  123.  
  124.  
  125.  
  126.  
  127.  
  128.  
  129. <link href='https://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>
  130.  
  131.  
  132. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  133.  
  134. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  135.  
  136. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  137.  
  138. <script src="https://use.fontawesome.com/8b31d30a04.js"></script>
  139.  
  140. <script>
  141. $(document).ready(function(){
  142.  
  143. $("#dd").click(function(){
  144.  
  145.  
  146. $("#nav").slideToggle("slow");
  147. $("#dd").slideToggle("slow");
  148. $("#du").slideToggle("slow");
  149. });
  150.  
  151. $("#du").click(function(){
  152.  
  153.  
  154. $("#nav").slideToggle("slow");
  155. $("#dd").slideToggle("slow");
  156. $("#du").slideToggle("slow");
  157. });
  158.  
  159.  
  160.  
  161. });
  162. </script>
  163.  
  164. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  165. <script src="https://static.tumblr.com/xd6ujov/9Rpouml9f/imagesloaded.pkgd.min.js"></script>
  166. <script src="https://static.tumblr.com/f6blkfc/3khouzw5b/masonry.pkgd.min.js"></script>
  167.  
  168.  
  169. <script>
  170.  
  171. $(document).ready(function(){
  172. var $grid = $(".blogroll"); $grid.imagesLoaded(function() {
  173. $grid.masonry({
  174. itemSelector: ".following",
  175. columnWidth: 162
  176. });
  177. });
  178.  
  179. </script>
  180.  
  181. <script>$(document).ready(function(){
  182. var $grid = $(".container"); $grid.imagesLoaded(function() {
  183. $grid.masonry({
  184. itemSelector: ".group",
  185. columnWidth: 100
  186. });
  187. });
  188. $(".button").click(function(){
  189. $(this).addClass("selected");
  190. $(".button").not($(this)).removeClass("selected");
  191. var ssf = $(this).attr("filter");
  192. $(".group." + ssf).show();
  193. $(".group").not("." + ssf).hide();
  194. $grid.masonry();
  195. });
  196. });</script>
  197.  
  198. <script>
  199.  
  200. $(document).ready(function(){
  201.  
  202. $(".question").not(".show").find(".answer").hide();
  203.  
  204. $(".question").click(function(){
  205.  
  206. if ($(this).find(".answer").is(":hidden")) {
  207. $(this).find(".answer").slideDown("slow");
  208. }
  209.  
  210. else {
  211. $(this).find(".answer").slideUp("slow");
  212. }
  213. });
  214.  
  215. });
  216.  
  217. </script>
  218.  
  219.  
  220. <style type="text/css">
  221.  
  222. /*FIX BY CYANTISTS*/
  223. iframe.tmblr-iframe {
  224. z-index:99999999999999!important;
  225. top:0!important;
  226. right:0!important;
  227. opacity:0.4;
  228. /* delete from here */
  229. filter:invert(1);
  230. -webkit-filter:invert(1);
  231. -o-filter:invert(1);
  232. -moz-filter:invert(1);
  233. -ms-filter:invert(1);
  234. /* to here if your blog has a dark background */
  235. transform:scale(0.6);
  236. transform-origin:100% 0;
  237. -webkit-transform:scale(0.6);
  238. -webkit-transform-origin:100% 0;
  239. -o-transform:scale(0.6);
  240. -o-transform-origin:100% 0;
  241. -moz-transform:scale(0.6);
  242. -moz-transform-origin:100% 0;
  243. -ms-transform:scale(0.6);
  244. -ms-transform-origin:100% 0;}
  245.  
  246. iframe.tmblr-iframe:hover {
  247. opacity:0.6!important;}
  248.  
  249. body {
  250. color: {color:Text};
  251. background-color: {color:Background};
  252. font-family: sans-serif;
  253. line-height: 16px;
  254. }
  255.  
  256. body img {
  257. max-width: 100%;
  258. height: auto;
  259. }
  260.  
  261. a {
  262. text-decoration: none;
  263. color: {color:Link};
  264. }
  265. a:hover {
  266. color: {color:Link Hover};
  267. }
  268.  
  269. i, em {
  270. color: {color:Italics};
  271. }
  272.  
  273. b, strong {
  274. color: {color:Bold};
  275. }
  276.  
  277.  
  278. h1 {
  279. text-align: center;
  280. font-size: 11px;
  281. letter-spacing: 3px;
  282. line-height: 120%;
  283. color: {color:Text};
  284. font-family: 'Karla', sans-serif;
  285. }
  286.  
  287. blockquote {
  288. border-left: 1px solid {color:Blockquote};
  289. margin-left: 6px;
  290. padding-left: 10px;
  291. }
  292.  
  293. blockquote img {
  294. max-width: 200px;
  295. height: auto;
  296. }
  297.  
  298. ::-webkit-scrollbar-thumb {
  299. background-color: {color:Scrollbar};
  300. height:auto;
  301. border-bottom:none;
  302. }
  303. ::-webkit-scrollbar {
  304. height:9px;
  305. width:3px;
  306. }
  307.  
  308. #sidebar {
  309. width: 200px;
  310. height: relative;
  311. position: fixed;
  312. margin-left: 50px;
  313. margin-top: 100px;
  314. }
  315.  
  316. .icon {
  317. width: 50px;
  318. height: 50px;
  319. padding: 15px;
  320. border-right: 1px solid {color:Border};
  321. border-bottom: 1px solid {color:Border};
  322. }
  323.  
  324.  
  325. .icon img {
  326. width: 50px;
  327. height: 50px;
  328. border-radius: 5px;
  329. }
  330.  
  331. .tabicon {
  332. width: 50px;
  333. height: 50px;
  334. padding: 15px;
  335. border-bottom: 1px solid {color:Border};
  336. margin-top: -81px;
  337. margin-left: 81px;
  338. }
  339.  
  340. .tab-links:after {
  341. display:block;
  342. clear:both;
  343. content:'';
  344. }
  345.  
  346. .tab-links li {
  347. display: block;
  348. list-style: none;
  349. margin-top: -25px;
  350. font-size: 13px;
  351.  
  352. }
  353.  
  354. .tab-links a {
  355. display: block;
  356. color: {color:Tab Link};
  357. background-color: {color:Tab Link Background};
  358. border: 1px solid {color:Tab Link Border};
  359. width: 13px;
  360. height: 13px;
  361. padding: 3px;
  362. text-align: center;
  363. border-radius: 5px;
  364. }
  365.  
  366. li.active a, li.active a:hover {
  367. color: {color:Tab Link Active};
  368. -webkit-transition: all .3s;
  369. -moz-transition: all .3s;
  370. -o-transition: all .3s;
  371. -ms-transition: all .3s;
  372. transition: all .3s;
  373. }
  374.  
  375. #title {
  376. background-color: {color:Title Background};
  377. border: 1px solid {color:Title Border};
  378. border-radius: 5px;
  379. font-family: 'Karla', sans-serif;
  380. font-size: 12px;
  381. font-weight: bold;
  382. color: {color:Title};
  383. display: inline-block;
  384. padding: 3px;
  385. width: 155px;
  386. text-align: center;
  387. margin-top: 10px;
  388. }
  389.  
  390. #description {
  391. background-color: {color:Description Background};
  392. border: 1px solid {color:Description Border};
  393. border-radius: 5px;
  394. font-size: 10px;
  395. color: {color:Description Text};
  396. display: inline-block;
  397. padding: 5px;
  398. width: 151px;
  399. margin-top: 10px;
  400. text-align: center;
  401. }
  402.  
  403. #dd {
  404. width: 163px;
  405. height: relative;
  406. color: {color:Text};
  407. text-align: center;
  408. margin-top: 10px;
  409. font-size: 18px;
  410. cursor: help;
  411. position: absolute;
  412. }
  413.  
  414. #du {
  415. display: none;
  416. width: 163px;
  417. height: relative;
  418. color: {color:Text};
  419. text-align: center;
  420. margin-top: 10px;
  421. }
  422.  
  423. #nav {
  424. display: none;
  425. font-size: 10px;
  426. font-weight: bold;
  427. letter-spacing: 1px;
  428. }
  429.  
  430. #nav a {
  431. display: block;
  432. background-color: {color:Custom Links Background};
  433. color: {color:Custom Links};
  434. border: 1px solid {color:Custom Links Border};
  435. border-radius: 5px;
  436. padding: 7px;
  437. width: 149px;
  438. margin-top: 5px;
  439.  
  440. }
  441.  
  442. #nav a:hover {
  443. background-color: {color:Custom Links};
  444. color: {color:Custom Links Background};
  445. -webkit-transition: all 0.8s ease;
  446. -moz-transition: all 0.8s ease;
  447. -o-transition: all 0.8s ease;
  448. }
  449.  
  450. #contain {
  451. width: 90%;
  452. height: 60%;
  453. margin-top: 70px;
  454. position: static;
  455. overflow-y: scroll;
  456. overflow-x: hidden;
  457. padding-right: 50px;
  458. opacity: 0;
  459. }
  460.  
  461.  
  462. #date {
  463. font-size: 9px;
  464. text-transform: lowercase;
  465. margin-top: 0px;
  466. color: {color:Date};
  467. border-bottom: .25px solid {color:Border};
  468. letter-spacing: 1px;
  469. position: absolute;
  470. left: 50%;
  471. transform: translate(-50%, -50%);
  472. padding-bottom: 2px;
  473.  
  474. {block:IfNot250Posts}
  475. width: 400px;
  476. {/block:IfNot250Posts}
  477.  
  478. {block:If250Posts}
  479. width: 250px;
  480. {/block:If250Posts}
  481. }
  482.  
  483. #date a {
  484. color: {color:Permalink};
  485. }
  486.  
  487. #date a:hover {
  488. color: {color:Text};
  489. -webkit-transition: all 0.8s ease;
  490. -moz-transition: all 0.8s ease;
  491. -o-transition: all 0.8s ease;
  492. }
  493.  
  494. #rb {
  495. font-size: 15px;
  496. color: {color:Permalink};
  497. position: absolute;
  498. margin-top: -20px;
  499. margin-left: -50px;
  500.  
  501. {block:IfNot250Posts}
  502. width: 440px;
  503. {/block:IfNot250Posts}
  504.  
  505. {block:If250Posts}
  506. width: 290px;
  507. {/block:If250Posts}
  508.  
  509. }
  510.  
  511. #rb a {
  512. color: {color:Permalink};
  513. }
  514.  
  515. #rb a:hover {
  516. -webkit-transition: all 0.8s ease;
  517. -moz-transition: all 0.8s ease;
  518. -o-transition: all 0.8s ease;
  519.  
  520. color: {color:Link};
  521. }
  522.  
  523. #source {
  524. font-size: 9px;
  525. text-transform: lowercase;
  526. letter-spacing: 1px;
  527. color: {color:Permalink};
  528. }
  529.  
  530. #source a {
  531. color: {color:permalink};
  532. }
  533.  
  534.  
  535. #content {
  536. {block:IfNot250Posts}
  537. width: 440px;
  538. {/block:IfNot250Posts}
  539.  
  540. {block:If250Posts}
  541. width: 290px;
  542. {/block:If250Posts}
  543.  
  544. margin-top: 100px;
  545. text-align: left;
  546. font-size: 11px;
  547. height: 400px;
  548. position: static;
  549.  
  550. }
  551.  
  552. .entry {
  553. font-size: 11px;
  554. background-color: {color:Post Background};
  555. padding: 20px;
  556. border: 1px solid {color:Border};
  557. border-radius: 5px;
  558. }
  559.  
  560.  
  561. #tags {
  562. margin-top: 10px;
  563. margin-bottom: 80px;
  564. font-size: 10px;
  565. display: inline-block;
  566.  
  567.  
  568. {block:IfNot250Posts}
  569. width: 440px;
  570. {/block:IfNot250Posts}
  571.  
  572. {block:If250Posts}
  573. width: 290px;
  574.  
  575. {/block:If250Posts}
  576.  
  577. {block:IfLeftSidebar}
  578. text-align: right;
  579. {/block:IfLeftSidebar}
  580.  
  581. {block:IfNotLeftSidebar}
  582. text-align: left;
  583. {/block:IfNotLeftSidebar}
  584.  
  585. }
  586.  
  587. #tags a {
  588. color: {color:Tags};
  589. background-color: {color:Tags Background};
  590. border: 1px solid {color:Tags Border};
  591. border-radius: 5px;
  592. padding: 5px;
  593. display: inline-block;
  594. margin-top: 5px;
  595. }
  596.  
  597. #tags a:hover {
  598. color: {color:Permalink};
  599. -webkit-transition: all 0.8s ease;
  600. -moz-transition: all 0.8s ease;
  601. -o-transition: all 0.8s ease;
  602. }
  603.  
  604. img.avatar {display:none; }
  605. ol.notes {
  606. margin-top: 20px;
  607. }
  608.  
  609. #ask {
  610. {block:IfNot250Posts}
  611. width: 360px;
  612. {/block:IfNot250Posts}
  613.  
  614. {block:If250Posts}
  615. width: 210px;
  616. {/block:If250Posts}
  617.  
  618. background-color: #fcfcfc;
  619. padding: 20px;
  620. border: 1px solid {color:Border};
  621. border-radius: 5px;
  622. }
  623.  
  624. #ask img {
  625. border-radius: 5px;
  626. margin-top: -20px;
  627.  
  628. {block:IfNot250Posts}
  629. margin-left: 340px;
  630. {/block:IfNot250Posts}
  631.  
  632. {block:If250Posts}
  633. margin-left: 190px;
  634. {/block:If250Posts}
  635. }
  636.  
  637.  
  638.  
  639. .asker {
  640. font-size: 10px;
  641. width: 100%;
  642. text-transform: lowercase;
  643. text-align: left;
  644. letter-spacing: 1px;
  645. }
  646.  
  647.  
  648.  
  649. .songart{
  650. float:left;
  651. margin-right:10px;
  652. }
  653.  
  654. .songart img{
  655. width:80px;
  656. height:80px;
  657. }
  658.  
  659. .songtitle{
  660. margin-bottom:10px;
  661. margin-left:90px;
  662. }
  663.  
  664. .songauthor{
  665. margin-bottom:10px;
  666. font-size:8px;
  667. margin-left:90px;
  668. }
  669.  
  670. .tumblr_audio_player {
  671. height: 50px;
  672. }
  673.  
  674. #quote {
  675. font-size: 15px;
  676. font-style: italic;
  677. text-align: center;
  678. background-color: {color:Background};
  679. padding: 20px;
  680. border-radius: 5px;
  681. }
  682.  
  683.  
  684. #pagination {
  685. width: 300px;
  686. height: 100px;
  687. }
  688.  
  689. #pagination a {
  690. opacity: 1;
  691. }
  692.  
  693. .chatline {
  694. color: {color:Chat Even Text};
  695. background-color: {color:Chat Even Background};
  696. padding: 10px;
  697. }
  698.  
  699. .chatline.odd {
  700. color: {color:Chat Odd Text};
  701. background-color: {color:Chat Odd Background};
  702. }
  703.  
  704. {block:IfNot250Posts}
  705. #youtube_iframe {
  706. width: 320px;
  707. }
  708. {/block:IfNot250Posts}
  709.  
  710. {block:If250Posts}
  711. #youtube_iframe {
  712. width: 170px;
  713. }
  714. {/block:If250Posts}
  715.  
  716. /*TABS*/
  717.  
  718. .tabcontent {
  719. position:static;
  720. margin-left:auto;
  721. margin-right:auto;
  722. width: 520px;
  723. text-align:center;
  724. margin-bottom:200px;
  725. }
  726.  
  727. .tabs {
  728. width:100%;
  729. margin-left:0px;
  730. display: inline-block;
  731. }
  732.  
  733.  
  734. .tab-content {
  735. }
  736.  
  737. .tab {
  738. display:none;
  739. }
  740.  
  741. .tab.active {
  742. display:block;
  743. }
  744.  
  745. /*about*/
  746.  
  747. #abticon {
  748. width: 100px;
  749. height: 100px;
  750. margin-top: 100px;
  751. margin-left: -250px;
  752. position: static;
  753. }
  754.  
  755. #abticon img {
  756. border-top-right-radius: 5px;
  757. border-top-left-radius: 5px;
  758. }
  759.  
  760. #info {
  761. width: 80px;
  762. height: relative;
  763. border: 1px solid {color:About Border};
  764. border-top: none;
  765. border-bottom-right-radius: 5px;
  766. border-bottom-left-radius: 5px;
  767. background-color: {color:About Background};
  768. padding: 10px;
  769. color: {color:About Text};
  770. font-size: 9px;
  771. padding-top: 0px;
  772. margin-left: -251px;
  773. text-align: left;
  774. }
  775.  
  776. .info {
  777. display: inline-block;
  778. background-color: {color:About Info Title Bg};
  779. color: {color:About Info Title};
  780. border-radius: 5px;
  781. padding: 3px;
  782. border: 1px solid {color:About Info Border};
  783. margin-top: 10px;
  784. font-size: 10px;
  785. }
  786.  
  787. #abtdesc {
  788. width: 400px;
  789. height: 291px;
  790. background-color: {color:About Background};
  791. border: 1px solid {color:About Border};
  792. color: {color:About Text};
  793. padding: 20px;
  794. font-size: 10px;
  795. text-align: left;
  796. margin-left: 200px;
  797. border-radius: 5px;
  798. margin-top: -332px;
  799. overflow-y: scroll;
  800. overflow-x: hidden;
  801. }
  802.  
  803. /*navigation*/
  804.  
  805. .button{
  806. color: {color:Navigation Filter};
  807. cursor: help;
  808. font-size: 10px;
  809. display: inline-block;
  810. margin-top: 100px;
  811. }
  812.  
  813. .button.selected {
  814. color: {color:Navigation Filter Selected};
  815. text-decoration: underline;
  816. }
  817.  
  818. .container {
  819. width: 900px;
  820. height: auto;
  821. margin-bottom: 20px;
  822. margin-top: 30px;
  823. margin-left: -100px;
  824. }
  825.  
  826. .group {
  827. width: 200px;
  828. height: relative;
  829. background-color: {color:Navigation Background};
  830. padding: 10px;
  831. border: 1px solid {color:Navigation Border};
  832. border-radius: 5px;
  833. margin-top: 20px;
  834. margin-left: 20px;
  835. }
  836.  
  837.  
  838.  
  839. .title {
  840. font-size: 11px;
  841. color: {color:Navigation Title};
  842. display: inline-block;
  843. padding: 6px;
  844. border-bottom: 1px solid {color:Navigation Border};
  845. font-family: 'Karla', sans-serif;
  846. }
  847.  
  848.  
  849.  
  850. .tags a {
  851. color: {color:Navigation Tags};
  852. background-color: {color:Navigation Tags Bg};
  853. padding: 6px;
  854. font-size: 10px;
  855. text-align: left;
  856. margin-top: 5px;
  857. letter-spacing: 1px;
  858. display: block;
  859. border: 1px solid {color:Navigation Tags Border};
  860. border-radius: 5px;
  861. }
  862.  
  863. .tags a:hover {
  864. color: {color:Navigation Tags Hover};
  865. background-color: {color:Navigation Tags Bg Hover};
  866. -webkit-transition: 0.8s;
  867. -moz-transition: 0.8s;
  868. transition: 0.8s;
  869. }
  870.  
  871. /*message*/
  872.  
  873. #mcontain {
  874. width: 450px;
  875. height: 400px;
  876. overflow-y: scroll;
  877. overflow-x: hidden;
  878. background-color: {color:Message Background};
  879. border: 1px solid {color:Message Border};
  880. border-radius: 5px;
  881. margin: auto;
  882. margin-top: 100px;
  883. padding: 20px;
  884. padding-top: 10px;
  885. }
  886.  
  887. .question {
  888. background-color: {color:Message QA Bg};
  889. border: 1px solid {color:Message QA Border};
  890. border-radius: 5px;
  891. padding: 7px;
  892. text-align: right;
  893. font-size: 10px;
  894. cursor: help;
  895. margin-top: 10px;
  896. font-family: 'Karla', sans-serif;
  897. color: {color:Message Question};
  898. }
  899.  
  900. .answer {
  901. display: none;
  902. text-align: left;
  903. color: {color:Message Answer};
  904. padding: 10px;
  905. font-family: sans-serif;
  906. }
  907.  
  908.  
  909. /*blogroll*/
  910.  
  911. .blogroll {
  912. background-color: {color:Blogroll Background};
  913. border: 1px solid {color:Blogroll Border};
  914. border-radius: 5px;
  915. width: 500px;
  916. height: 500px;
  917. overflow-y: scroll;
  918. overflow-x: hidden;
  919. margin-top: 50px;
  920. text-align: justify;
  921. padding: 20px;
  922. }
  923.  
  924. .following {
  925. background-color: {color:Following Background};
  926. border: 1px solid {color:Following Border};
  927. padding: 5px;
  928. border-radius: 5px;
  929. display: inline-block;
  930. font-size: 9px;
  931. text-align: left;
  932. margin-top: 20px;
  933. width: 150px;
  934. }
  935.  
  936. .following img {
  937. border-radius: 5px;
  938. display: inline-block;
  939. }
  940.  
  941. .fname {
  942. border-bottom: 1px solid {color:Following Border};
  943. padding: 3px;
  944. margin-top: -40px;
  945. margin-left: 40px;
  946. }
  947.  
  948. .fname a {
  949. color: {color:Following Url};
  950. }
  951.  
  952. .ftitle {
  953. color: {color:Following Blog Title};
  954. text-align: center;
  955. font-family: 'Karla', sans-serif;
  956. margin-left: 40px;
  957. }
  958.  
  959. </style>
  960.  
  961. </head>
  962.  
  963. <body>
  964.  
  965. <div id="sidebar">
  966.  
  967. <div class="icon">
  968. <img src="{image:Sidebar}">
  969. </div>
  970.  
  971. <div class="tabicon">
  972. <a href="#tab1"></a>
  973.  
  974.  
  975. <div class="tabs">
  976. <ul class="tab-links">
  977.  
  978. <li class="active" style="margin-left: -45px" >
  979. <a href="#tab1" class="fa fa-fw fa-home" title="posts"></a></li>
  980.  
  981.  
  982. {block:IfAboutTab}
  983. <li style="margin-top:-21px; margin-left: -1px"><a href="#tab2" class="fa fa-fw fa-user" title="about"></a></li>
  984.  
  985.  
  986. {block:IfNavigationTab}
  987. <li style="margin-left: -23px; margin-top: 0px"><a href="#tab3" class="fa fa-fw fa-bars" title="navigation"></a></li>
  988. {/block:IfNavigationTab}
  989.  
  990. {block:IfMessageTab}
  991. <li style="margin-left: -45px; margin-top: 0px"><a href="#tab4" class="fa fa-fw fa-envelope" title="message"></a></li>
  992. {/block:IfMessageTab}
  993.  
  994. {/block:IfAboutTab}
  995.  
  996. {block:IfNotAboutTab}
  997.  
  998. {block:IfNavigationTab}
  999. <li style="margin-top: -21px; margin-left: -1px"><a href="#tab3" class="fa fa-fw fa-bars" title="navigation"></a></li>
  1000. {/block:IfNavigationTab}
  1001.  
  1002. {block:IfMessageTab}
  1003. <li style="margin-left: -45px; margin-top: 20px"><a href="#tab4" class="fa fa-fw fa-envelope" title="message"></a></li>
  1004. {/block:IfMessageTab}
  1005.  
  1006. {/block:IfNotAboutTab}
  1007.  
  1008.  
  1009.  
  1010. {block:IfBlogrollTab}
  1011. <li style="margin-top: -21px; margin-left: -1px"><a href="#tab5" class="fa fa-fw fa-heart" title="blogroll"></a></li>
  1012. {/block:IfBlogrollTab}
  1013. </ul>
  1014. </div>
  1015. </div>
  1016.  
  1017. <div id="title">
  1018. {Title}
  1019. </div>
  1020.  
  1021. <div id="description">
  1022. {Description}
  1023. </div>
  1024.  
  1025. <div id="dd">
  1026. <i class="fa fa-fw fa-angle-double-down"></i>
  1027. </div>
  1028.  
  1029. <div id="nav">
  1030. <a href="{text:Link One Url}">{text:Link One Title}</a>
  1031. <a href="{text:Link Two Url}">{text:Link Two Title}</a>
  1032. <a href="{text:Link Three Url}">{text:Link Three Title}</a>
  1033. <a href="{text:Link Four Url}">{text:Link Four Title}</a>
  1034. <a href="{text:Link Five Url}">{text:Link Five Title}</a>
  1035. <a href="{text:Link Six Url}">{text:Link Six Title}</a>
  1036. </div>
  1037.  
  1038. <div id="du">
  1039. <i class="fa fa-fw fa-angle-double-up"></i>
  1040. </div>
  1041.  
  1042. </div>
  1043.  
  1044.  
  1045.  
  1046. <div class="tabs">
  1047.  
  1048.  
  1049.  
  1050. <div class="tab-content">
  1051. <div id="tab1" class="tab active">
  1052. <center>
  1053.  
  1054. <div id="content">
  1055.  
  1056.  
  1057.  
  1058. <!--posts-->
  1059.  
  1060. {block:Posts}
  1061.  
  1062. <div class="entry">
  1063.  
  1064. <!--date/info-->
  1065. {block:Date}
  1066. <center>
  1067. <div id="date">
  1068.  
  1069.  
  1070.  
  1071. <a href="{Permalink}">{TimeAgo}</a> /
  1072.  
  1073. <a href="{Permalink}">{block:NoteCount}{NoteCount} notes</a> /{/block:NoteCount}
  1074.  
  1075. <a href="{Permalink}">{ShortMonth} {DayOfMonthWithZero}, {Year}</a>
  1076.  
  1077.  
  1078. </div>
  1079. </center>
  1080. {/block:Date}
  1081. <!--end of date/info-->
  1082.  
  1083.  
  1084.  
  1085. <div id="rb">
  1086.  
  1087. <a href="{ReblogURL}" title="reblog">↺</a>
  1088.  
  1089.  
  1090. </div>
  1091.  
  1092.  
  1093. <br>
  1094.  
  1095. <!--photo-->
  1096.  
  1097. {block:Photo}
  1098.  
  1099. <a href="{permalink}">
  1100. <img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>
  1101. </a>
  1102.  
  1103. {block:IndexPage}
  1104.  
  1105. {block:Caption}
  1106. {Caption}
  1107. {/block:Caption}
  1108.  
  1109. {/block:IndexPage}
  1110.  
  1111. {block:PermalinkPage}
  1112.  
  1113. {block:Caption}
  1114. {Caption}
  1115. {/block:Caption}
  1116.  
  1117. {/block:PermalinkPage}
  1118.  
  1119. {/block:Photo}
  1120.  
  1121. <!--end photo-->
  1122.  
  1123. <!--photoset-->
  1124.  
  1125. {block:Photoset}
  1126.  
  1127. {block:IfNot250Posts}
  1128. {Photoset-400}
  1129. {/block:IfNot250Posts}
  1130.  
  1131. {block:If250Posts}
  1132. {Photoset-250}
  1133. {/block:If250Posts}
  1134.  
  1135. {block:Caption}
  1136. {Caption}
  1137. {/block:Caption}
  1138.  
  1139. {/block:Photoset}
  1140.  
  1141. <!--end photoset-->
  1142.  
  1143.  
  1144. <!--text-->
  1145.  
  1146. {block:Text}
  1147.  
  1148. {block:Title}
  1149. <h1>{Title}</h1>
  1150. {/block:Title}
  1151.  
  1152. {Body}
  1153.  
  1154. {/block:Text}
  1155.  
  1156. <!--end text-->
  1157.  
  1158. <!--link-->
  1159.  
  1160. {block:Link}
  1161.  
  1162. <h1><a href="{URL}">{Name}</a></h1>
  1163.  
  1164. {block:Description}
  1165. {Description}
  1166. {/block:Description}
  1167.  
  1168. {/block:Link}
  1169.  
  1170. <!--end link-->
  1171.  
  1172.  
  1173. <!--quote-->
  1174.  
  1175. {block:Quote}
  1176.  
  1177. <div id="quote"><i>"{Quote}"</i></div>
  1178.  
  1179. {block:Source}
  1180. <br>- {Source}
  1181. {/block:Source}
  1182.  
  1183. {/block:Quote}
  1184.  
  1185. <!--end quote-->
  1186.  
  1187.  
  1188. <!--chat-->
  1189.  
  1190. {block:Chat}
  1191.  
  1192. {block:Title}
  1193. <h1>{Title}</h1>
  1194. {/block:Title}
  1195.  
  1196.  
  1197. {block:Lines}
  1198.  
  1199. <div class="chatline {Alt}">
  1200.  
  1201. {block:Label}
  1202. <b style="text-transform: uppercase; padding: 5px">{Label} </b>
  1203. {/block:Label}
  1204.  
  1205. <span>{Line}</span>
  1206. </div>
  1207.  
  1208. {/block:Lines}
  1209.  
  1210.  
  1211. {/block:Chat}
  1212.  
  1213. <!--end chat-->
  1214.  
  1215. <!--audio-->
  1216.  
  1217. {block:Audio}
  1218.  
  1219. {block:AlbumArt}
  1220. <div class="songart">
  1221. <img src="{AlbumArtURL}">
  1222. </div>
  1223. {/block:AlbumArt}
  1224.  
  1225. <div class="songtitle">
  1226. {block:TrackName}
  1227. {TrackName}
  1228. {/block:TrackName}
  1229. </div>
  1230.  
  1231. <div class="songauthor">
  1232. By
  1233. {block:Artist}
  1234. {Artist}
  1235. {/block:Artist}
  1236. </div>
  1237.  
  1238. {AudioPlayerWhite}
  1239.  
  1240. {/block:Audio}
  1241.  
  1242. <!--end audio-->
  1243.  
  1244.  
  1245.  
  1246.  
  1247. <!--video-->
  1248.  
  1249. {block:Video}
  1250.  
  1251. {block:IfNot250Posts}
  1252. {Video-400}
  1253. {/block:IfNot250Posts}
  1254.  
  1255. {block:If250Posts}
  1256. {Video-250}
  1257. {/block:If250Posts}
  1258.  
  1259. {block:Caption}
  1260. {Caption}
  1261. {/block:Caption}
  1262.  
  1263.  
  1264.  
  1265. {/block:Video}
  1266.  
  1267. <!--end video-->
  1268.  
  1269. <!--ask-->
  1270.  
  1271. {block:Answer}
  1272.  
  1273.  
  1274. <div id="ask">
  1275.  
  1276. <div class="asker">
  1277. <b>{Asker}</b> <i>asked:</i>
  1278. </div>
  1279.  
  1280. <img src="{AskerPortraitURL-24}">
  1281.  
  1282. <i style="color:{color:Ask Text}">{Question}</i>
  1283. </div>
  1284.  
  1285. <p>{Answer}</p>
  1286.  
  1287.  
  1288.  
  1289. {/block:Answer}
  1290.  
  1291.  
  1292.  
  1293.  
  1294.  
  1295. <!--end ask-->
  1296.  
  1297. <!--source-->
  1298.  
  1299.  
  1300.  
  1301. <div id="source">
  1302.  
  1303. {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a> / {/block:RebloggedFrom}
  1304.  
  1305. {block:ContentSource} <a href="{SourceURL}">source</a>{/block:ContentSource}
  1306. </div>
  1307.  
  1308.  
  1309.  
  1310. <!--end source-->
  1311.  
  1312. </div>
  1313.  
  1314.  
  1315. <!--tags-->
  1316.  
  1317. <div id="tags">
  1318.  
  1319. {block:HasTags}
  1320. {block:Tags}
  1321. <a href="{TagURL}">#{Tag} </a>
  1322. {/block:Tags}
  1323. {/block:HasTags}
  1324.  
  1325. </div>
  1326.  
  1327. <!--end tags-->
  1328.  
  1329. <!--permalink page-->
  1330.  
  1331. {block:PermalinkPage}
  1332.  
  1333. {block:PostNotes}
  1334. {PostNotes}
  1335. {/block:PostNotes}
  1336.  
  1337. {/block:PermalinkPage}
  1338.  
  1339. <!--end permalink page-->
  1340.  
  1341. {/block:Posts}
  1342.  
  1343. <!--end posts-->
  1344.  
  1345. <!--pagination-->
  1346.  
  1347.  
  1348. <div id="pagination">
  1349.  
  1350. {block:Pagination}
  1351.  
  1352. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a >{/block:PreviousPage}
  1353. {block:JumpPagination length="5"}
  1354.  
  1355. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1356.  
  1357. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1358.  
  1359. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  1360.  
  1361. {/block:Pagination}
  1362. </div>
  1363.  
  1364. <!--end pagination-->
  1365.  
  1366.  
  1367. </center>
  1368. </div>
  1369.  
  1370.  
  1371.  
  1372.  
  1373.  
  1374. <!--about tab-->
  1375.  
  1376. <div id="tab2" class="tab">
  1377. <div class="tabcontent">
  1378.  
  1379. <center>
  1380.  
  1381. <div id="abticon">
  1382. <img src="{image:About Image}">
  1383. </div>
  1384.  
  1385. <div id="info">
  1386.  
  1387. <div class="info">{text:About Info Title 1}:</div> {text:About Info 1}<br>
  1388. <div class="info">{text:About Info Title 2}:</div> {text:About Info 2}<br>
  1389. <div class="info">{text:About Info Title 3}:</div> {text:About Info 3}<br>
  1390. <div class="info">{text:About Info Title 4}:</div> {text:About Info 4}<br>
  1391. <div class="info">{text:About Info Title 5}:</div> {text:About Info 5}<br>
  1392. <div class="info">{text:About Info Title 6}:</div> {text:About Info 6}
  1393.  
  1394. </div>
  1395.  
  1396. <div id="abtdesc">
  1397. {text:About Text}
  1398. </div>
  1399. </center>
  1400.  
  1401. </div>
  1402. </div>
  1403.  
  1404. <!--end about tab-->
  1405.  
  1406.  
  1407. <!--navigation tab-->
  1408.  
  1409. <div id="tab3" class="tab">
  1410. <div class="tabcontent">
  1411.  
  1412. <!--only change the "all categories" title if you need. nothing else.-->
  1413. <div class="button selected" filter="group">all categories</div>
  1414.  
  1415. <!--here you can replace filter1/filter2/etc with whatever filter name you want. for example, you could make it filter="fandom" or filter="marvel"-->
  1416.  
  1417. <div class="button" filter="filter1">filter 1</div>
  1418. <div class="button" filter="filter2">filter 2</div>
  1419. <div class="button" filter="filter3">filter 3</div>
  1420. <div class="button" filter="filter4">filter 4</div>
  1421. <div class="button" filter="filter5">filter 5</div>
  1422. <div class="button" filter="filter6">filter 6</div>
  1423.  
  1424. <!--to add more filters just paste the following code below filter 6
  1425.  
  1426. <div class="button" filter="filter">filter name</div>
  1427.  
  1428. -->
  1429.  
  1430.  
  1431. <div class="container">
  1432.  
  1433.  
  1434.  
  1435. <!--tags 1-->
  1436. <div class="group filter1 filter2"> <!--replace "filter1" and "filter2" with whatever filter name you gave your filters. for example it might say "fandom" or "marvel"-->
  1437.  
  1438. <div class="title">
  1439. Category 1 <!--category title-->
  1440. </div>
  1441.  
  1442.  
  1443. <div class="tags">
  1444. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1445. <a href="/tagged/tag">tag</a>
  1446. <a href="/tagged/tag">tag</a>
  1447. <a href="/tagged/tag">tag</a>
  1448. <a href="/tagged/tag">tag</a>
  1449. <a href="/tagged/tag">tag</a>
  1450. <a href="/tagged/tag">tag</a>
  1451. <a href="/tagged/tag">tag</a>
  1452. <a href="/tagged/tag">tag</a>
  1453. </div>
  1454.  
  1455.  
  1456.  
  1457. </div>
  1458. <!--end tags 1-->
  1459.  
  1460.  
  1461. <!--tags 2-->
  1462. <div class="group filter6 filter2"> <!--replace "filter1" and "filter2" with whatever filter name you gave your filters. for example it might say "fandom" or "marvel"-->
  1463.  
  1464. <div class="title">
  1465. Category 2 <!--category title-->
  1466. </div>
  1467.  
  1468.  
  1469. <div class="tags">
  1470. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1471. <a href="/tagged/tag">tag</a>
  1472. <a href="/tagged/tag">tag</a>
  1473. <a href="/tagged/tag">tag</a>
  1474. <a href="/tagged/tag">tag</a>
  1475. <a href="/tagged/tag">tag</a>
  1476. <a href="/tagged/tag">tag</a>
  1477. <a href="/tagged/tag">tag</a>
  1478. <a href="/tagged/tag">tag</a>
  1479. </div>
  1480.  
  1481.  
  1482.  
  1483. </div>
  1484. <!--end tags 2-->
  1485.  
  1486. <!--tags 3-->
  1487. <div class="group filter4 filter1"> <!--replace "filter1" and "filter2" with whatever filter name you gave your filters. for example it might say "fandom" or "marvel"-->
  1488.  
  1489. <div class="title">
  1490. Category 3 <!--category title-->
  1491. </div>
  1492.  
  1493.  
  1494. <div class="tags">
  1495. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1496. <a href="/tagged/tag">tag</a>
  1497. <a href="/tagged/tag">tag</a>
  1498. <a href="/tagged/tag">tag</a>
  1499. <a href="/tagged/tag">tag</a>
  1500. <a href="/tagged/tag">tag</a>
  1501. <a href="/tagged/tag">tag</a>
  1502. </div>
  1503.  
  1504.  
  1505.  
  1506. </div>
  1507. <!--end tags 3-->
  1508.  
  1509. <!--tags 4-->
  1510. <div class="group filter3 filter6"> <!--replace "filter1" and "filter2" with whatever filter name you gave your filters. for example it might say "fandom" or "marvel"-->
  1511.  
  1512. <div class="title">
  1513. Category 4 <!--category title-->
  1514. </div>
  1515.  
  1516.  
  1517. <div class="tags">
  1518. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1519. <a href="/tagged/tag">tag</a>
  1520. <a href="/tagged/tag">tag</a>
  1521. <a href="/tagged/tag">tag</a>
  1522. <a href="/tagged/tag">tag</a>
  1523. <a href="/tagged/tag">tag</a>
  1524. <a href="/tagged/tag">tag</a>
  1525. <a href="/tagged/tag">tag</a>
  1526. <a href="/tagged/tag">tag</a>
  1527. <a href="/tagged/tag">tag</a>
  1528. <a href="/tagged/tag">tag</a>
  1529. </div>
  1530.  
  1531.  
  1532.  
  1533. </div>
  1534. <!--end tags 4-->
  1535.  
  1536. <!--tags 5-->
  1537. <div class="group filter3 filter5"> <!--replace "filter1" and "filter2" with whatever filter name you gave your filters. for example it might say "fandom" or "marvel"-->
  1538.  
  1539. <div class="title">
  1540. Category 5 <!--category title-->
  1541. </div>
  1542.  
  1543.  
  1544. <div class="tags">
  1545. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1546. <a href="/tagged/tag">tag</a>
  1547. <a href="/tagged/tag">tag</a>
  1548. <a href="/tagged/tag">tag</a>
  1549.  
  1550. </div>
  1551.  
  1552.  
  1553.  
  1554. </div>
  1555. <!--end tags 5-->
  1556.  
  1557. <!--to add more categories just paste the following code below the end of category 5:
  1558.  
  1559.  
  1560. <div class="group filter3 filter5">
  1561.  
  1562. <div class="title">
  1563. Category 5
  1564. </div>
  1565.  
  1566.  
  1567. <div class="tags">
  1568. <a href="/tagged/tag" style="margin-top: 10px">tag</a>
  1569. <a href="/tagged/tag">tag</a>
  1570. <a href="/tagged/tag">tag</a>
  1571. <a href="/tagged/tag">tag</a>
  1572.  
  1573. </div>
  1574.  
  1575.  
  1576.  
  1577. </div>
  1578.  
  1579. -->
  1580.  
  1581. </div>
  1582.  
  1583.  
  1584. </div>
  1585. </div>
  1586.  
  1587. <!--end navigation tab-->
  1588.  
  1589.  
  1590. <!--message tab-->
  1591.  
  1592. <div id="tab4" class="tab">
  1593. <div class="tabcontent">
  1594.  
  1595.  
  1596. <div id="mcontain">
  1597.  
  1598. <!--QUESTION 1-->
  1599. <div class="question"><b>write question 1 here</b>
  1600.  
  1601. <div class="answer">
  1602.  
  1603. <b>bold</b> <i>italic</i> <a href="/">link</a><br><br>
  1604.  
  1605. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  1606. </div>
  1607.  
  1608. </div>
  1609. <!--END OF QUESTION 1-->
  1610.  
  1611. <!--QUESTION 2-->
  1612. <div class="question"><b>write question 2 here</b>
  1613.  
  1614. <div class="answer">
  1615. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  1616. </div>
  1617.  
  1618. </div>
  1619. <!--END OF QUESTION 2-->
  1620.  
  1621. <!--QUESTION 3-->
  1622. <div class="question"><b>write question 3 here</b>
  1623.  
  1624. <div class="answer">
  1625. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  1626. </div>
  1627.  
  1628. </div>
  1629. <!--END OF QUESTION 3-->
  1630.  
  1631. <!--QUESTION 4-->
  1632. <div class="question"><b>write question 4 here</b>
  1633.  
  1634. <div class="answer">
  1635. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  1636. </div>
  1637.  
  1638. </div>
  1639. <!--END OF QUESTION 4-->
  1640.  
  1641.  
  1642. <!--IF YOU WANT TO ADD MORE QUESTIONS PASTE THE FOLLOWING CODE UNDER QUESTION 4:
  1643.  
  1644. <div class="question"><b>your question here</b>
  1645.  
  1646. <div class="answer">
  1647. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  1648. </div>
  1649.  
  1650. </div>
  1651.  
  1652. -->
  1653.  
  1654.  
  1655. <p><iframe frameborder="0" height="200px" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/{text:Url}.tumblr.com" width="100%" style="background-color: transparent; overflow: hidden;"></iframe></p>
  1656.  
  1657. </div>
  1658.  
  1659.  
  1660. </div>
  1661. </div>
  1662.  
  1663. <!--end message tab-->
  1664.  
  1665.  
  1666. <!--blogroll tab-->
  1667.  
  1668. <div id="tab5" class="tab">
  1669. <div class="tabcontent">
  1670.  
  1671. <center>
  1672. <div class="blogroll">
  1673. {block:Following}
  1674.  
  1675. {block:Followed}
  1676.  
  1677. <div class="following">
  1678.  
  1679. <img src="{FollowedPortraitURL-30}"/>
  1680.  
  1681. <div class="fname"><a href="{FollowedURL}">{FollowedName}</a></div>
  1682.  
  1683. <div class="ftitle">"{FollowedTitle}"</div>
  1684.  
  1685. </div>
  1686.  
  1687. {/block:Followed}
  1688. {/block:Following}
  1689.  
  1690. </div>
  1691. </center>
  1692.  
  1693. </div>
  1694. </div>
  1695.  
  1696. <!--end blogroll tab-->
  1697.  
  1698.  
  1699.  
  1700.  
  1701.  
  1702. </div>
  1703.  
  1704. <!--DO NOT EDIT THIS-->
  1705.  
  1706. <div style="position:fixed; bottom:8px; right:15px; font-size: 9px;"><a style="color:{color:Credit}; text-decoration:none; font-weight: bold" href="http://arithemes.tumblr.com/">A</a></center></div>
  1707.  
  1708. <script>
  1709. $(document).ready(function() {
  1710. $('.tabs .tab-links a').on('click', function(e) {
  1711. var currentAttrValue = $(this).attr('href');
  1712.  
  1713. // Show/Hide Tabs
  1714. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  1715.  
  1716. // Change/remove current tab to active
  1717. $(this).parent('li').addClass('active').siblings().removeClass('active');
  1718.  
  1719. e.preventDefault();
  1720. });
  1721. });
  1722. </script>
  1723.  
  1724. <script>
  1725. $(document).ready(function() {
  1726. $('#filterOptions li a').click(function() {
  1727. // fetch the class of the clicked item
  1728. var ourClass = $(this).attr('class');
  1729.  
  1730. // reset the active class on all the buttons
  1731. $('#filterOptions li').removeClass('active');
  1732. // update the active state on our clicked button
  1733. $(this).parent().addClass('active');
  1734.  
  1735. if(ourClass == 'all') {
  1736. // show all our items
  1737. $('#ourHolder').children('div.item').show();
  1738. }
  1739. else {
  1740. // hide all elements that don't share ourClass
  1741. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1742. // show all elements that do share ourClass
  1743. $('#ourHolder').children('div.' + ourClass).show();
  1744. }
  1745. return false;
  1746. });
  1747. });
  1748. </script>
  1749.  
  1750.  
  1751. </body>
  1752.  
  1753. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!