API tools faq
paste
Advertisement
lakeffectkdss

wasteland/cameron, theme 002

lakeffectkdss
Apr 17th, 2016
422
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.89 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script src="https://use.fonticons.com/fc066471.js"></script>
  5. <!--
  6.  
  7. WASTELAND; theme 002 by lakeffectkds
  8. this theme was inspired by the original One With The Hair, my one and only parabatai, and the biggest vixx fan ever, aka cam or @attcnton.
  9. base code credit goes to neonbikethemes, and the ask base goes to shayofrp.
  10.  
  11. RULES ; 01- do not steal bits and pieces of this code for your own.
  12. 02- do not edit this theme and claim it as your own or use it as a base code without my permission.
  13. 03- do not redistribute this theme as yours.
  14. 04- feel free to edit it as much as you want for personal use! also feel free to show me any changes to make to it, i'll be more than happy to take a look!
  15. 05- actually, just feel free to hmu if you're using the theme, it's the best thing to see people liking it and using it on their blogs.
  16. if you have any questions, my askbox and im are completely open for you <3
  17. -->
  18.  
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}" />
  21. {/block:Description}
  22. <meta charset="utf-8">
  23. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  24. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27.  
  28. <meta name="image:background" content="" />
  29. <meta name="image:header icon 1" content="" />
  30. <meta name="image:header icon 2" content="" />
  31. <meta name="color:Background" content="#ffffff" />
  32.  
  33. <meta name="color:container" content="#ffffff" />
  34. <meta name="color:link" content="#000000" />
  35. <meta name="color:links hover" content="#a0a0a0" />
  36. <meta name="color:text" content="#000000" />
  37. <meta name="color:posts" content="#ffffff" />
  38.  
  39. <meta name="color:post bg" content="#ffffff">
  40.  
  41. <meta name="color:text shadow" content="">
  42. <meta name="color:bold shadow" content="#ffffff">
  43. <meta name="color:bold" content="#ffffff">
  44. <meta name="color:italics" content="#ffffff">
  45.  
  46. <meta name="text:your url" content="ex. lakeffectkds" />
  47. <meta name="text:nav text" content="maybe ur rules?? an abt??? some lyrics?? stats/bio if u only have one muse??? th worlds urs fren">
  48. <meta name="text:nav text title" content="" />
  49.  
  50. <meta name="if:hide captions" content="0"/>
  51.  
  52.  
  53.  
  54. <!-- IMPORTED SCRIPTS - DON'T REMOVE -->
  55.  
  56. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  57.  
  58. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  59.  
  60. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  61.  
  62. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  63.  
  64. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  65. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  66. <script>
  67. (function($){
  68. $(document).ready(function(){
  69. $("a[title]").style_my_tooltips({
  70. tip_follows_cursor:true,
  71. tip_delay_time:90,
  72. tip_fade_speed:600,
  73. attribute:"title"
  74. });
  75. });
  76. })(jQuery);
  77. </script>
  78.  
  79. <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  80.  
  81. <style type="text/css">
  82.  
  83.  
  84. /* ---------------------------- GENERAL ----------------------------- */
  85.  
  86. /* -------- SELECTION TOOL ------- */
  87.  
  88. ::-moz-selection {
  89. background: {color:text};
  90. color: {color:background};
  91. }
  92.  
  93. ::selection {
  94. background: {color:text};
  95. color: {color:background};
  96. }
  97.  
  98. /* -------- SCROLLBAR ------- */
  99.  
  100. ::-webkit-scrollbar {
  101. width: 9px;
  102. height:9px;
  103. }
  104.  
  105. /* Track */
  106. ::-webkit-scrollbar-track {
  107. background:{color:background};
  108. }
  109.  
  110. /* Handle */
  111. ::-webkit-scrollbar-thumb {
  112. background:{color:text};
  113. }
  114. ::-webkit-scrollbar-thumb:window-inactive {
  115. background: transparent;
  116. }
  117.  
  118. /* ------- TOOLTIPS ------ */
  119.  
  120. #s-m-t-tooltip {
  121. max-width:300px;
  122. margin:10px 0px 0px 10px;
  123. background-color:{color:bakground};
  124. font-family:helvetica;
  125. font-size:12px;
  126. color:{color:text};
  127. z-index:999999999999999999999999999999999999;
  128. }
  129.  
  130. /* -------- BASICS ------- */
  131. body {
  132. color:{color:Text};
  133. text-shadow:0px 0px 1px {color:text shadow};
  134. font-family: arial;
  135. font-size: 11px;
  136. margin: 0;
  137.  
  138. background-image:url('{image:Background}');
  139. padding: 0;
  140. word-wrap: break-word;
  141. line-height:150%;
  142. }
  143.  
  144. a {
  145. color: {color:link};
  146. font-family: 'montserrat', sans-serif;
  147. text-decoration: none;
  148. -webkit-transition: all .3s;
  149. -moz-transition: all .3s;
  150. -o-transition: all .3s;
  151. -ms-transition: all .3s;
  152. transition: all .3s;
  153. }
  154.  
  155. a:hover{
  156. color:{color:posts};
  157. -webkit-transition: all .3s;
  158. -moz-transition: all .3s;
  159. -o-transition: all .3s;
  160. -ms-transition: all .3s;
  161. transition: all .3s;
  162. }
  163.  
  164. blockquote {
  165. border-left: 1px solid {color:text};
  166. margin: 10px;
  167. padding-left:25px;
  168. padding-top:3px;
  169. padding-bottom:3px;
  170. }
  171.  
  172. iframe, img, embed, object, video {
  173. max-width: 100%;
  174. }
  175.  
  176. p{
  177. margin-bottom:10px;
  178. }
  179.  
  180. img {
  181. height: auto;
  182. width:auto;
  183. max-width:100%;
  184. }
  185.  
  186. h1{
  187. text-shadow: 1px 1px 0px {color:text};
  188. text-transform:none;
  189. text-align:justify center;
  190. font-size:20px;
  191. font-weight:bold;
  192. }
  193.  
  194.  
  195. h2 {
  196. font-size:13px;
  197. font-family: 'Montserrat', sans-serif;
  198. COLOR: {color:link} ;
  199. text-shadow: 1px 1px 1px 1px color: ;
  200.  
  201. }
  202. i{
  203. color:{color:italics};
  204. text-shadow:0px 0px 2px{color:italics shadow};;
  205. }
  206.  
  207.  
  208.  
  209. big{
  210. font-size:auto;
  211. font-family: 'Montserrat', sans-serif;
  212.  
  213. }
  214.  
  215. b, strong{
  216. color:color:{color:bold};;
  217. font-family:'montserrat';
  218. text-shadow: 1px 1px 1px{color:bold shadow};;
  219. }
  220.  
  221.  
  222. ul{
  223. list-style-type:square;
  224. }
  225.  
  226. ol{
  227. list-style-type:;
  228. }
  229.  
  230. #bigcon{
  231. width:520px;
  232. margin-left:auto;
  233. margin-right:auto;
  234. }
  235.  
  236.  
  237.  
  238. .tabcontent {
  239. position:absolute;
  240. margin-left:auto;
  241. margin-right:auto;
  242. width: 500px;
  243. text-align:center;
  244. margin-bottom:200px;
  245. }
  246.  
  247. #postcontainer {
  248. background-color:{color:post bg};
  249. position:static;
  250. margin-left:auto;
  251. margin-right:auto;
  252. width: 500px;
  253. height:400px;
  254. text-align:center;
  255. margin-bottom:150px;
  256. overflow: auto;
  257. }
  258.  
  259.  
  260.  
  261.  
  262.  
  263. /* ----------------------------- HEADER STUFF ---------------------------*/
  264.  
  265.  
  266. #topbar{
  267. background-color: {color:container};
  268. z-index:-100000000000000000000000000000000000;
  269. display:inline-block;
  270. margin-top:35px;
  271. height:600px;
  272. width:550px;
  273. margin-left:-40px;
  274. position:absolute;
  275. border:1px solid {color:text};
  276. box-shadow: 10px 10px 0px {color:text};
  277. text-align:center;
  278. }
  279.  
  280. .blogtitle{
  281. margin-top:-18px;
  282. z-index:9999999999999999999999999999.9;
  283. color:{color:text};
  284. float:auto;
  285. text-shadow: 1px 1px 0px {color:text};
  286. text-transform:none;
  287. font-size:24px;
  288. font-weight:bold;
  289. text-align:right;
  290. }
  291.  
  292.  
  293. .description{
  294. position:absolute;
  295.  
  296. text-shadow:0px 0px 1px {color:text shadow};
  297. background:transparent;
  298. color:{color:Text};
  299. margin-left:20px;
  300. margin-top:25px;
  301. font-family:arial;
  302. height:100px;
  303. text-align:justify center;
  304. max-width:350px;
  305. overflow:auto;
  306. }
  307. #navbar{
  308. background-color:{transparent};
  309. z-index:-2222;
  310. display:inline-block;
  311. margin-top:10px;
  312. text-align:center;
  313. }
  314.  
  315.  
  316. #header-icons{
  317. margin-top:10px;
  318. z-index:3;
  319. }
  320.  
  321. #ask {
  322. color:{color:text};
  323. padding:5px;
  324. font-family:'arial';
  325. font-size:10px;
  326. letter-spacing:0px;
  327. text-align:left;
  328. text-transform:lowercase;
  329. line-height:150%;
  330. background-color:{color:sbar border};
  331.  
  332. box-shadow: 0px 3px 0px {color:link};
  333. }
  334.  
  335.  
  336.  
  337. /* ------------------------------ TABS ------------------------------ */
  338.  
  339. .tabs {
  340. width:100%;
  341. margin-left:0px;
  342. display:inline-block;
  343. }
  344.  
  345. /*----- Tab Links -----*/
  346.  
  347. /* Clearfix */
  348. .tab-links:after {
  349. display:block;
  350. clear:both;
  351. content:'';
  352. }
  353.  
  354. .tab-links li {
  355. margin-right:5px;
  356. display:inline-block;
  357. list-style:none;
  358. text-transform:none;
  359. }
  360.  
  361. .tab-links a {
  362. padding:7px;
  363. display:inline-block;
  364. color:{color:text};
  365. transition:all linear 0.15s;
  366. border-bottom:1px solid transparent;
  367. }
  368.  
  369. .tab-links a:hover {
  370. border-bottom:1px solid {color:text};
  371. text-decoration:none;
  372. }
  373.  
  374. li.active a, li.active a:hover {
  375. background:transparent;
  376. color:#ffffff;
  377. border-bottom:1px solid {color:text};
  378. background:{color:container};
  379. -webkit-transition: all .3s;
  380. -moz-transition: all .3s;
  381. -o-transition: all .3s;
  382. -ms-transition: all .3s;
  383. transition: all .3s;
  384. }
  385.  
  386. /*----- Content of Tabs -----*/
  387. .tab-content {
  388. }
  389.  
  390. .tab {
  391. display:none;
  392. }
  393.  
  394. .tab.active {
  395. display:block;
  396. }
  397.  
  398. /* --------------------------- POSTS (articles) --------------------- */
  399.  
  400. article {
  401. float:left;
  402. background:{color:posts};
  403. padding: 20px;
  404. width: 90%;
  405. text-align:left;
  406. margin-bottom:80px;
  407. }
  408.  
  409. /* ---------------------------- POST INFO -----------------------------*/
  410.  
  411. .postinfo{
  412. margin-top:10px;
  413. font-weight:bold;
  414. }
  415.  
  416. .tags {
  417. margin-top:5px;
  418. font-weight:normal;
  419. }
  420.  
  421. /* ---------------------------- POST NOTES ------------------------- */
  422.  
  423. ol.notes {
  424. display:block;
  425. text-align:left;
  426. list-style-type:none;
  427. margin-left:-40px;
  428. }
  429.  
  430. ol.notes li.note{
  431. margin-bottom:5px;
  432. }
  433.  
  434. .pagenotes {
  435. text-align:left;
  436. margin-top:15px;
  437. }
  438.  
  439. .pagenotes img{
  440. padding-right:5px;
  441. padding-top:5px;
  442. margin-bottom:-5px;
  443. }
  444.  
  445.  
  446. /* -------------------------- POST TYPES -------------------------- */
  447.  
  448. /* CHAT */
  449.  
  450. ul.chat{
  451. list-style:none;
  452. margin-left:-40px;
  453. }
  454.  
  455. .chat span {
  456. float: left;
  457. }
  458.  
  459. /* QUOTES */
  460.  
  461. .quote{
  462. font-size:20px;
  463. line-height:150%;
  464. }
  465.  
  466. .quotesource{
  467. text-align:right;
  468. margin-bottom:10px;
  469. }
  470.  
  471. /* QUESTIONS */
  472.  
  473. .question{
  474. margin-bottom:15px;
  475. padding-bottom:10px;
  476. font-family:'montserrat';
  477.  
  478. box-shadow: 0px 3px 0px {color:text};
  479. }
  480.  
  481. .answer {
  482. font-size:11px;
  483.  
  484. }
  485.  
  486. /* AUDIO */
  487.  
  488. .songart{
  489. float:left;
  490. margin-right:10px;
  491. }
  492.  
  493. .songart img{
  494. width:80px;
  495. height:80px;
  496. }
  497.  
  498. .songtitle{
  499. margin-bottom:10px;
  500. margin-left:90px;
  501. }
  502.  
  503. .songauthor{
  504. margin-bottom:10px;
  505. font-size:8px;
  506. margin-left:90px;
  507. }
  508.  
  509. .tumblr_audio_player {
  510. height: 50px;
  511. }
  512.  
  513. /* ------------------------- PAGINATION ------------------------- */
  514.  
  515. #pagination{
  516. position:absolute;
  517. margin-top:30px;
  518. text-align:center;
  519. }
  520.  
  521. .pagibutton{
  522. position:relative;
  523. display:inline-block;
  524. background:#ffffff;
  525. padding:15px;
  526. }
  527.  
  528.  
  529.  
  530. /* --------------------------- Custom CSS -------------------------- */
  531. {CustomCSS}
  532. </style>
  533. </head>
  534. <body>
  535.  
  536. <div id="foo" style="background-color:{color:Container}";></div>
  537. <div id="bigcon">
  538.  
  539.  
  540. <!--TOPBAR-->
  541.  
  542. <div id="topbar">
  543.  
  544. <div class="blogtitle">
  545. <a href="/">{Title}</a>
  546. </div>
  547.  
  548. <div class="description">{description}</div>
  549. <!--ICONS-->
  550. <div id= "header-icons">
  551.  
  552. <img src="{image:header icon 1}" style=" position:absolute;width :60px; height:60px;box-shadow: 2px 2px 0px {color:text}; margin-left: 360px; border: 1px solid {color:text}; margin-top:10px; padding:5px;"> <img src="{image:header icon 2}" style="width :60px; height:60px;box-shadow: 2px 2px 0px {color:text}; margin-left: 440px; border: 1px solid {color:text};;margin-top:10px;padding:5px;">
  553.  
  554.  
  555. <div id="navbar">
  556. <div class="tabs">
  557. <ul class="tab-links">
  558. <li class="active" style="margin-left:-30px">
  559. <a href="#tab1"><i class="fa fa-spinner fa-2x fa-spin"></i></a></li>
  560. <li><a href="#tab2"><i class="fa fa-envelope fa-2x "></i></I></a></li>
  561. <li><a href="#tab3"><i class="fa fa-connectdevelop fa-2x "></i></a></li>
  562. <li><a href="#tab4"><i class="fa fa-camera-retro fa-2x "></i></a></li>
  563. <li><a href="http://lakeffectkds.tumblr.com" title="coded by alex"><i class="fa fa-hand-peace-o fa-2x"></i></a></li>
  564. </ul>
  565. </div>
  566. </div>
  567.  
  568. </div>
  569.  
  570.  
  571. <!-- --------------------------- TABS -------------------------- -->
  572.  
  573.  
  574. <div class="tabs">
  575.  
  576.  
  577. <!-- --------------------------- TAB 1 -------------------------- -->
  578.  
  579. <div class="tab-content">
  580. <div id="tab1" class="tab active">
  581.  
  582. <div id="postcontainer">
  583.  
  584. {block:Posts}
  585. <article>
  586.  
  587. <!--TEXT POST-->
  588. {block:Text}
  589. {block:Title}
  590. <h1 class="title">
  591. <a href="{Permalink}">{Title}</a></h1>
  592. {/block:Title}
  593. {Body}
  594. {/block:Text}
  595.  
  596. <!--PHOTO POST-->
  597. {block:Photo}
  598. {block:IndexPage}
  599. {LinkOpenTag}
  600. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  601. {LinkCloseTag}
  602. {/block:IndexPage}
  603. {block:PermalinkPage}
  604. {LinkOpenTag}
  605. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  606. {LinkCloseTag}{/block:PermalinkPage}
  607. {/block:Photo}
  608.  
  609.  
  610. <!--PHOTOSET POST-->
  611. {block:Photoset}
  612. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  613. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  614. {/block:Photoset}
  615.  
  616.  
  617. <!--QUOTE POST-->
  618. {block:Quote}<h2><span class="fa fa-quote-left fa-3x pull-left"> </span><div style="font-family:'montserrat';"> <big>{Quote}</big> </h2><p> <TEXT-ALIGN:"right";>— {Source}<br>
  619. {/block:Quote}
  620.  
  621.  
  622. <!--LINK POST-->
  623. {block:Link}
  624. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  625. {block:Description}{Description}{/block:Description}
  626. {/block:Link}
  627.  
  628.  
  629. <!--CHAT POST-->
  630. {block:Chat}
  631. <ul class="chat">
  632. {block:Lines}<li class="{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}<p> {Line} </p></li>{/block:Lines}
  633. </ul>
  634. {/block:Chat}
  635.  
  636.  
  637. <!--AUDIO POST-->
  638. {block:Audio}
  639. {block:AlbumArt}
  640. <div class="songart">
  641. <img src="{AlbumArtURL}">
  642. </div>
  643. {/block:AlbumArt}
  644. <div class="songtitle">
  645. {block:TrackName}
  646. {TrackName}
  647. {/block:TrackName}
  648. </div>
  649. <div class="songauthor">
  650. By
  651. {block:Artist}
  652. {Artist}
  653. {/block:Artist}
  654. </div>
  655. {AudioPlayerWhite}
  656. {/block:Audio}
  657.  
  658.  
  659. <!--VIDEO POST-->
  660. {block:Video}
  661. <div class="video">
  662. <div class="video-player">{Video-500}</div>
  663. {/block:Video}
  664.  
  665.  
  666. <!--ANSWER POST-->
  667. {block:Answer} <div class="question"><span class="fa fa-quote-left fa-3x pull-left"> </span><h3><b>{Asker} whispered:</b>
  668. {Question}</h3></div>
  669. <p><div class="answer">{Answer}</div>
  670.  
  671. {/block:Answer}
  672.  
  673. <!--CAPTIONS-->
  674. {block:Ifhidecaptions}
  675. {block:permalink}
  676. {block:Caption}
  677. {Caption}
  678. {/block:Caption}
  679. {/block:permalink}
  680. {/block:Ifhidecaptions}
  681. {block:Ifnothidecaptions}
  682. {block:Caption}
  683. {Caption}
  684. {/block:Caption}
  685. {/block:Ifnothidecaptions}
  686.  
  687. <!--POST INFORMATION-->
  688. <div class="postinfo">
  689.  
  690. <!--PERMALINK-->
  691. <a href="{Permalink}">
  692. {block:Date}
  693. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {12Hour}:{Minutes} {AmPm}
  694. {/block:Date}
  695. </a>
  696.  
  697. <!--NOTES-->
  698. {block:NoteCount}
  699. <a href="{Permalink}"> + {NoteCount} </a>
  700. {/block:NoteCount}
  701.  
  702. <!--VIA AND SOURCE-->
  703. {block:RebloggedFrom}
  704. ( <a href="{ReblogParentURL}">Via</a>
  705. {/block:RebloggedFrom}
  706. {block:ContentSource}
  707. & <a href="{SourceURL}">Source</a>
  708. {/block:ContentSource}
  709. {block:RebloggedFrom} ){/block:RebloggedFrom}
  710.  
  711. <!--TAGS-->
  712. {block:HasTags}
  713. <div class="tags">
  714. {block:Tags}
  715. <a href="{TagURL}">#{Tag},</a>
  716. {/block:Tags}
  717. </div>
  718. {/block:HasTags}
  719.  
  720. </div>
  721.  
  722. <!--POST NOTES-->
  723. {block:PostNotes}
  724. <div class="pagenotes">{PostNotes-16}</div>
  725. {/block:PostNotes}
  726.  
  727.  
  728. </article>
  729. {/block:Posts}
  730. <!--Close of article-->
  731.  
  732.  
  733. <!--PAGINATION-->
  734. {block:Pagination}
  735. <div class="pagination">
  736. {block:PreviousPage}
  737. <a href="{PreviousPage}">
  738. <div class="pagibutton">Previous</div></a>
  739. {/block:PreviousPage}
  740. {block:NextPage}
  741. <a href="{NextPage}">
  742. <div class="pagibutton">Next</div></a>
  743. {/block:NextPage}
  744. </div>
  745. {/block:Pagination}
  746.  
  747. </div>
  748.  
  749. </div>
  750.  
  751. <!-- -------------------------- TAB 2 -------------------------- -->
  752.  
  753. <div id="tab2" class="tab">
  754. <div class="tabcontent">
  755. <p><iframe frameborder="0" scrolling="no" width="75%" height="190" src="http://www.tumblr.com/ask_form/{text:your url}.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]--></p>
  756. </div>
  757. </div>
  758.  
  759.  
  760. <!-- -------------------------- TAB 3 -------------------------- -->
  761.  
  762. <div id="tab3" class="tab">
  763. <div class="tabcontent">
  764. <div id="tab3" class="tab" style="display: block;">
  765. <div class="tabcontent">
  766. <div style="text-align: center;">
  767. <img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 60px; height: 60px; box-shadow: 3px 3px 0px {color:text}; border: 1px solid {color:text}; ; padding:5px;">
  768. <img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 60px; height: 60px; box-shadow: 3px 3px 0px {color:text}; border: 1px solid {color:text}; ; padding:5px;">
  769. <img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 60px; height: 60px; box-shadow: 3px 3px 0px {color:text}; border: 1px solid {color:text}; ; padding:5px;">
  770. <img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 60px; height: 60px; box-shadow: 3px 3px 0px {color:text}; border: 1px solid {color:text}; ; padding:5px;">
  771. <img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 60px; height: 60px; box-shadow: 3px 3px 0px {color:text}; border: 1px solid {color:text}; ; padding:5px;"> </div><p>
  772. </p><div style="max-width: 43%; height: 230px; border: 1px solid {color:text}; padding: 10px; overflow: auto; line-height: 13px; float: right;">{text:nav text}</div><p>
  773. </p><div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  774. <p style="line-height: 10%;"></p>
  775. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  776. <p style="line-height: 8px;"></p>
  777. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  778. <p style="line-height: 8px;"></p>
  779. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  780. <p style="line-height: 8px;"></p>
  781. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  782. <p style="line-height: 8px;"></p>
  783. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  784. <p style="line-height: 8px;"></p>
  785. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  786. <p style="line-height: 8px;"></p>
  787. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  788. <p style="line-height: 8px;"></p>
  789. <div style="text-align: center; background-color: {color:posts}; box-shadow: 0px 3px 0px ; width: 45%; margin-left:30px;border:1px solid {color:text};"><a href="/">link</a></div>
  790. <p style="line-height: 8px;"></p>
  791. <div style="font-size: 23px; float: right; text-align:right; margin-right:195px;margin-top:-15px; font-family:'montserrat';"> {text:nav text title}</div>
  792. <p>.</p>
  793. </div>
  794. </div>
  795. </div>
  796. </div>
  797.  
  798. <!-- -------------------------- TAB 4 -------------------------- -->
  799.  
  800. <!-- -------------------------- TAB 4 -------------------------- -->
  801.  
  802. <div id="tab4" class="tab">
  803. <div class="tabcontent">
  804. <!-- ---------FOR TWO MORE MUSES COPY FROM HERE---------- -->
  805.  
  806. <!--for 1 more muse (left) copy from here-->
  807. <div style="width: 47%; background-color: {color:posts}; height: 91px; box-shadow: 3px 3px {color:text}; margin-left:20px; border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; padding:5px; border: 1px solid {color:text}; margin-top:5px; margin-left:-145px; ; box-shadow:3px 3px {color:text};"/>
  808. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  809. <div style="font-size: 20px; ;"><br /><b>name surname</b></div>
  810. age/fc/pronouns</div>
  811. </div><p></p>
  812. <!--to here-->
  813.  
  814.  
  815. <!--for 1 more muse (right) copy from here-->
  816. <div style="width: 47%; background-color: {color:posts}; height: 91px; box-shadow: 3px 3px {color: text}; float: right; margin-top: -104px;border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; padding:5px; border: 1px solid {color:text}; margin-top:5px; margin-left:15px; margin-left:-145px;;box-shadow:3px 3px {color:text};" />
  817. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  818.  
  819. <div style="font-size: 20px;"><br /><b>name surname</b></div>
  820. age/fc/pronouns</div>
  821. </div><p></p>
  822. <!--to here-->
  823. <!-- ----------------------TO HERE----------------------- -->
  824.  
  825.  
  826. <div style="width: 47%; background-color: {color:posts}; height: 91px; box-shadow: 3px 3px {color:text}; margin-left:20px; border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; padding:5px; border: 1px solid {color:text}; margin-top:5px; margin-left:-145px;;box-shadow:3px 3px {color:text};"/>
  827. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  828. <div style="font-size: 20px; ;"><br /><b>name surname</b></div>
  829. age/fc/pronouns</div>
  830. </div><p></p>
  831.  
  832. <div style="width: 47%; background-color: {color:posts}; height: 91px; box-shadow: 3px 3px {color: text}; float: right; margin-top: -104px;border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; padding:5px; border: 1px solid {color:text}; margin-top:5px; margin-left:15px; margin-left:-145px;;box-shadow:3px 3px {color:text};" />
  833. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  834.  
  835. <div style="font-size: 20px;"><br /><b>name surname</b></div>
  836. age/fc/pronouns</div>
  837. </div><p></p>
  838. <div style="width: 47%; background-color: {color:posts}; height: 91px; box-shadow: 3px 3px {color:text}; margin-left:20px; border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; padding:5px; border: 1px solid {color:text}; margin-top:5px; margin-left:-145px;;box-shadow:3px 3px {color:text};"/>
  839. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  840. <div style="font-size: 20px; ;"><br /><b>name surname</b></div>
  841. age/fc/pronouns</div>
  842. </div><p></p>
  843.  
  844. <div style="width: 47%; background-color: {color:post}; height: 91px; box-shadow: 3px 3px {color: text}; float: right; margin-top: -104px;border:1px solid {color:text};"><img src="https://41.media.tumblr.com/4033bd1da1d65c8558db1c04b3bc702f/tumblr_o17w1uxIg31urkt8fo2_250.png" style="width: 65px; height: 65px; border: 1px solid {color:text}; margin-top:5px; margin-left:-145px;;box-shadow:3px 3px {color:text}; padding:5px;" />
  845. <div style="margin-left: 87px; margin-top: -90px; text-align: center;font-family:'montserrat';">
  846.  
  847. <div style="font-size: 20px;"><br /><b>name surname</b></div>
  848. age/fc/pronouns</div>
  849. </div><p></p>
  850. </div>
  851. </div>
  852.  
  853.  
  854. <!-- END OF TABS -->
  855.  
  856. </div>
  857. </div>
  858. </div>
  859. </div>
  860. </div>
  861.  
  862.  
  863. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  864.  
  865. <script>
  866. $(document).ready(function() {
  867. $('.tabs .tab-links a').on('click', function(e) {
  868. var currentAttrValue = $(this).attr('href');
  869.  
  870. // Show/Hide Tabs
  871. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  872.  
  873. // Change/remove current tab to active
  874. $(this).parent('li').addClass('active').siblings().removeClass('active');
  875.  
  876. e.preventDefault();
  877. });
  878. });
  879. </script>
  880.  
  881. <script>
  882. $(document).ready(function() {
  883. $('#filterOptions li a').click(function() {
  884. // fetch the class of the clicked item
  885. var ourClass = $(this).attr('class');
  886.  
  887. // reset the active class on all the buttons
  888. $('#filterOptions li').removeClass('active');
  889. // update the active state on our clicked button
  890. $(this).parent().addClass('active');
  891.  
  892. if(ourClass == 'all') {
  893. // show all our items
  894. $('#ourHolder').children('div.item').show();
  895. }
  896. else {
  897. // hide all elements that don't share ourClass
  898. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  899. // show all elements that do share ourClass
  900. $('#ourHolder').children('div.' + ourClass).show();
  901. }
  902. return false;
  903. });
  904. });
  905. </script>
  906.  
  907.  
  908.  
  909.  
  910. </body>
  911. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!