API tools faq
paste
Advertisement
morbidrpa

froot by morbidrpa

morbidrpa
May 26th, 2019
588
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.25 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <head>
  5.  
  6.  
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12.  
  13. <!--
  14.  
  15. theme two: froot
  16.  
  17. please don't: edit & repost / claim as your own
  18. please don't: delete credit
  19. please don't: steal bits of coding
  20.  
  21. feel free to im or inbox me at morbidrpa.tumblr.com
  22. with any questions or concerns
  23.  
  24. ------
  25.  
  26. container base code by musecentral
  27. menu tutorial && code by mistletoe
  28. custom font hosting by morbidrpa
  29. icon font by suiomi.com/font
  30.  
  31. -->
  32.  
  33.  
  34. <!--- COLORS ---->
  35.  
  36. <meta name="color:base" content=""/>
  37. <meta name="color:background" content=""/>
  38. <meta name="color:text" content=""/>
  39. <meta name="color:accent1" content=""/>
  40. <meta name="color:accent2" content=""/>
  41. <meta name="color:accent3" content=""/>
  42. <meta name="color:shadow" content=""/>
  43. <meta name="color:shadow2" content=""/>
  44. <meta name="color:border" content=""/>
  45. <meta name="color:desc text" content=""/>
  46. <meta name="color:links" content=""/>
  47. <meta name="color:container" content=""/>
  48. <meta name="color:post background" content=""/>
  49. <meta name="color:blockquote background" content=""/>
  50. <meta name="color:description background" content=""/>
  51. <meta name="color:info background" content=""/>
  52.  
  53. <!--- IMAGES ---->
  54.  
  55. <meta name="image:background" content=""/>
  56. <meta name="image:header" content=""/>
  57.  
  58. <!--- TEXT ---->
  59.  
  60. <meta name="text:title" content="/">
  61.  
  62. <meta name="text:link1" content="/">
  63. <meta name="text:link1 text" content="/">
  64. <meta name="text:link2" content="/">
  65. <meta name="text:link2 text" content="/">
  66. <meta name="text:tablink1" content="/">
  67. <meta name="text:tablink1 text" content="/">
  68. <meta name="text:tablink2" content="/">
  69. <meta name="text:tablink2 text" content="/">
  70. <meta name="text:tablink3" content="/">
  71. <meta name="text:tablink3 text" content="/">
  72. <meta name="text:tablink4" content="/">
  73. <meta name="text:tablink4 text" content="/">
  74. <meta name="text:tablink5" content="/">
  75. <meta name="text:tablink5 text" content="/">
  76. <meta name="text:tablink6" content="/">
  77. <meta name="text:tablink6 text" content="/">
  78.  
  79.  
  80. <!-- IMPORTED SCRIPTS - DON'T REMOVE -->
  81.  
  82. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  83.  
  84. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  85.  
  86. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  87.  
  88. <script src="https://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  89.  
  90. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  91.  
  92. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  93.  
  94.  
  95. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  96. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  97.  
  98. <script>
  99.  
  100. function openNav() {
  101. document.getElementById("mercMenu").style.height = "410px";
  102. document.getElementById("mercMenu").style.width = "440px";
  103. document.getElementById("mercMenu").style.left = "320px";
  104. document.getElementById("mercMenu").style.top = "179px";
  105. }
  106.  
  107. function closeNav() {
  108. // change "width" to "height" if you want it to be top/bottom
  109. document.getElementById("mercMenu").style.height = "0";
  110. // change "right" to where you want it to come from (i.e. left/top)
  111. document.getElementById("mercMenu").style.top = "-60px";
  112. }
  113. </script>
  114.  
  115.  
  116. <style type="text/css">
  117.  
  118. @font-face { font-family: "slash"; src: url('https://dl.dropboxusercontent.com/s/85uwfgqtwj3t91b/slash%20bold.ttf?dl=1'); format(“truetype”);}
  119.  
  120.  
  121. /*SCROLLBAR*/
  122.  
  123. ::-webkit-scrollbar-thumb {
  124. height:auto;
  125. background-color:{color:accent1};
  126. }
  127.  
  128. ::-webkit-scrollbar {
  129. height:9px;
  130. width:2px;
  131. background-color:{color:accent3};
  132. }
  133.  
  134. /*BULLET POINTS*/
  135.  
  136. ul, li {
  137. line-height:100%;
  138. }
  139.  
  140. ul {
  141. list-style-type: circle;
  142. padding-left:24px;
  143. line-height:150%;
  144. }
  145.  
  146. #post li {
  147. padding-left: 0px;
  148. margin-bottom: 0px;
  149. list-style: none;
  150. }
  151.  
  152. #post li:before {
  153. color: {color:text};
  154. content: "\ea55";
  155. font-family: 'honeybee';
  156. font-size:6px;
  157. font-weight:300;
  158. display: inline-block;
  159. margin-left: -2.2em;
  160. width: 2.2em;
  161. }
  162.  
  163. /*BODY*/
  164.  
  165. body {
  166. background-image:url('{image:background}') ;
  167. background-position: top center;
  168. background-repeat: no repeat;
  169. -webkit-background-size: cover;
  170. -moz-background-size: cover;
  171. -o-background-size: cover;
  172. background-size: cover;
  173. background-attachment: fixed;
  174. background-color:{color:base};
  175. color: {color:text};
  176. font-family: 'Quicksand', sans-serif;
  177. font-size: 11px;
  178. line-height:15px;
  179. margin: 0;
  180. padding: 0;
  181. word-wrap: break-word;
  182. }
  183.  
  184. small, sub, sup {
  185. font-size: 11px;
  186. }
  187.  
  188.  
  189.  
  190. a {
  191. color: {color:links};
  192. text-decoration: none;
  193. -webkit-transition: all .3s;
  194. -moz-transition: all .3s;
  195. -o-transition: all .3s;
  196. -ms-transition: all .3s;
  197. transition: all .3s;
  198. }
  199.  
  200. a:hover{
  201. color:{color:links hover};
  202. -webkit-transition: all .3s;
  203. -moz-transition: all .3s;
  204. -o-transition: all .3s;
  205. -ms-transition: all .3s;
  206. transition: all .3s;
  207. }
  208.  
  209. img {
  210. border:none;
  211. max-width:100%;
  212. }
  213.  
  214. b, strong, bold {
  215. color:{color:accent1};
  216. }
  217.  
  218. i, em, italic {
  219. color:{color:accent2};
  220. }
  221.  
  222. /*TITLE STYLES*/
  223.  
  224. pre {
  225. background:{color:border};
  226. color:{color:text};
  227. padding:5px;
  228. font-family:courier new;
  229. text-align:justify;
  230. text-transform:uppercase;
  231. word-wrap: break-word;
  232. }
  233.  
  234. h1 {
  235. color:{color:accent1};
  236. padding:5px;
  237. text-transform:lowercase;
  238. font-family: "slash";
  239. line-height: 0.7;
  240. text-shadow: 0px 0px 3px {color:shadow2};
  241. font-size:30px;
  242. text-align:right;
  243. padding-top:-20px;
  244. padding-bottom:-20px;
  245. }
  246.  
  247. h2 {
  248. font-size:10px;
  249. color:{color:text};
  250. text-transform:uppercase;
  251. font-family: quicksand;
  252. background-color:{color:background};
  253. padding:7px;
  254. font-style:bold, italic;
  255. text-align:center;
  256. border-bottom:1px solid {color:border};
  257. border-top:1px solid {color:border};
  258. }
  259.  
  260. h3 {
  261. color:{color:accent1};
  262. padding:-22px;
  263. padding-bottom:-32px;
  264. text-transform:lowercase;
  265. font-family: "slash";
  266. text-shadow: 0px 0px 3px {color:shadow2};
  267. font-size:40px;
  268. text-align:right;
  269. }
  270.  
  271. /*BLOCKQUOTES*/
  272.  
  273. blockquote, blockquote blockquote blockquote {
  274. border-left:4px solid {color:text};
  275. margin-left:10px;
  276. text-decoration:none;
  277. padding:10px;
  278. text-align:justify;
  279. background:{color:blockquote background};
  280. border-radius:8px;
  281. word-wrap: break-word;
  282. }
  283.  
  284. blockquote blockquote, blockquote blockquote blockquote blockquote {
  285. border-left:4px solid {color:text};
  286. margin-left:10px;
  287. text-decoration:none;
  288. padding:10px;
  289. text-align:justify;
  290. background:{color:post background};
  291. border-radius:8px;
  292. word-wrap: break-word;
  293. }
  294.  
  295. #s-m-t-tooltip {
  296. min-width:50px;
  297. max-width:200px;
  298. padding:3px;
  299. margin:20px 0px 0px 20px;
  300. background-color:{color:accent1};
  301. font-family:quicksand;
  302. font-size:8px;
  303. text-transform:uppercase;
  304. color:{color:post background};
  305. z-index: 999999999999;
  306. border-radius:8px;
  307. overflow:auto;
  308. font-style:italic;
  309. text-align:center;
  310. }
  311.  
  312. /*IMAGES*/
  313.  
  314. /*this is a class. anything with a period in front of it is a class & is used for general things, like grouping photos together*/
  315. .icons {
  316. position:fixed;
  317. margin-top:0px;
  318. margin-left:-5px;
  319. width:200px;
  320. line-height:90%;
  321. letter-spacing:7px;
  322. opacity:1;
  323. -webkit-transition: all 0.4s ease-in-out;
  324. -moz-transition: all 0.4s ease-in-out;
  325. -o-transition: all 0.4s ease-in-out;
  326. -ms-transition: all 0.4s ease-in-out;
  327. transition: all 0.4s ease-in-out;
  328. }
  329.  
  330. /*having an img class for a photo allows the image to resize to the set height, for example the icons on the page will readjust if you change it to 50x50. give it a try*/
  331. .icons img {
  332. padding:2px;
  333. width:80px;
  334. height:80px;
  335. opacity:1;
  336. border-radius:50px;
  337. -webkit-transition: all 0.4s ease-in-out;
  338. -moz-transition: all 0.4s ease-in-out;
  339. -o-transition: all 0.4s ease-in-out;
  340. -ms-transition: all 0.4s ease-in-out;
  341. transition: all 0.4s ease-in-out;
  342. }
  343.  
  344. /*HEADER*/
  345.  
  346. #topbar{
  347. position:fixed;
  348. margin-top:50px;
  349. margin-bottom:0px;
  350. text-align:center;}
  351.  
  352. #header {
  353. width: 653px;
  354. height:150px;
  355. background-color: {color:accent1};
  356. background-image:url('{image:header}');
  357. margin-bottom: -145px;
  358. margin-top: -75px;
  359. margin-left:300px;
  360. border-top-left-radius:8px;
  361. border-top-right-radius:8px;
  362. }
  363.  
  364. #dropdown {
  365. width: 653px;
  366. height:5px;
  367. background: {color:accent1};
  368. margin-top:145px;
  369. margin-left:300px;
  370. }
  371.  
  372.  
  373. /*TABS*/
  374.  
  375. .tabs {
  376. width:100%;
  377. margin-left:0px;
  378. display:inline-block;
  379. }
  380.  
  381. /*----- Tab Links -----*/
  382.  
  383. .topnav{
  384. margin-top:115px;
  385. margin-left:815px;
  386. z-index:99999;
  387. }
  388.  
  389. .topnav:after {
  390. display:block;
  391. clear:both;
  392. content:'';
  393. }
  394.  
  395. .topnav li {
  396. margin-right:12px;
  397. display:inline-block;
  398. list-style:none;
  399. text-transform:uppercase;
  400. z-index:99999;
  401. }
  402.  
  403. .topnav a {
  404. padding:7px;
  405. display:inline-block;
  406. color:{color:links};
  407. transition:all linear 0.15s;
  408. border-bottom:1px solid transparent;
  409. z-index:99999;
  410. padding-bottom:16px;
  411. border-radius:8px;
  412. }
  413.  
  414. .topnav a:after {
  415. margin-top:-33px;
  416. margin-left:45%;
  417. width:5px;
  418. background:{color:accent1};
  419. content:'';
  420. display:block;
  421. height:7px;
  422. -webkit-transform: rotate(45deg);
  423. -moz-transform: rotate(45deg);
  424. -ms-transform: rotate(45deg)-o-transform: rotate(45deg);
  425. transform: rotate(45deg);
  426. -webkit-transition: all 0.3s ease-in-out;
  427. -moz-transition: all 0.3s ease-in-out;
  428. -o-transition: all 0.3s ease-in-out;
  429. -ms-transition: all 0.3s ease-in-out;
  430. transition: all 0.3s ease-in-out;}
  431.  
  432. .topnav a:hover {
  433. border-bottom:1px solid {color:post background};
  434. text-decoration:none;
  435. }
  436.  
  437. li.active a, li.active a:hover {
  438. color:{color:accent3};
  439. border-bottom:1px solid {color:post background};
  440. background:{color:links};
  441. -webkit-transition: all .3s;
  442. -moz-transition: all .3s;
  443. -o-transition: all .3s;
  444. -ms-transition: all .3s;
  445. transition: all .3s;
  446. z-index:99999;
  447. }
  448.  
  449.  
  450. #menuTrigger li {
  451. margin-right:12px;
  452. display:inline-block;
  453. list-style:none;
  454. text-transform:uppercase;
  455. z-index:99999;
  456. }
  457.  
  458. #menuTrigger {
  459. padding:7px;
  460. display:inline-block;
  461. color:{color:links};
  462. transition:all linear 0.15s;
  463. border-bottom:1px solid transparent;
  464. z-index:99999;
  465. padding-bottom:16px;
  466. border-radius:8px;
  467. }
  468.  
  469. #menuTrigger:after {
  470. margin-top:-33px;
  471. margin-left:45%;
  472. width:5px;
  473. background:{color:accent1};
  474. content:'';
  475. display:block;
  476. height:7px;
  477. -webkit-transform: rotate(45deg);
  478. -moz-transform: rotate(45deg);
  479. -ms-transform: rotate(45deg)-o-transform: rotate(45deg);
  480. transform: rotate(45deg);
  481. -webkit-transition: all 0.3s ease-in-out;
  482. -moz-transition: all 0.3s ease-in-out;
  483. -o-transition: all 0.3s ease-in-out;
  484. -ms-transition: all 0.3s ease-in-out;
  485. transition: all 0.3s ease-in-out;}
  486.  
  487. #menuTrigger:hover {
  488. border-bottom:1px solid {color:post background};
  489. text-decoration:none;
  490. }
  491.  
  492. #mercMenu {
  493. text-align:center;
  494. display: flex;
  495. align-items: stretch;
  496. flex-wrap: wrap;
  497. background: {color:post background};
  498. border-radius: 8px;
  499. color: {color:text};
  500. border: 1px solid {color:border};
  501.  
  502. /*** IMPORTANT ***/
  503.  
  504. width: 0;
  505. height: calc(100vh - 60px);
  506. position: fixed;
  507. top: 0;
  508. right: -60px;
  509. overflow-x: hidden;
  510. z-index: 10000000000000000000001;
  511. }
  512.  
  513. .tabtitle {
  514.  
  515. padding:5px;
  516.  
  517. line-height: 0.7;
  518. text-align:center;
  519. overflow:visible;
  520. width:100%;
  521. }
  522.  
  523. .tabtitle main {
  524. color:{color:accent1};
  525. text-transform:lowercase;
  526. font-family: "slash";
  527. text-shadow: 0px 0px 3px {color:shadow2};
  528. font-size:35px;
  529. }
  530.  
  531. .tabtitle subb {
  532. text-transform:uppercase;
  533. font-family: quicksand;
  534. color:{color:post background};
  535. border-radius:8px;
  536. background:{color:base};
  537. display:inline-block;
  538. padding:5px;
  539. padding-right:10px;
  540. padding-left:10px;
  541. font-size:7px;
  542. letter-spacing:2px;
  543. transform: rotate(-2deg);
  544. border: 1px solid {color:border};
  545. }
  546.  
  547. .tabbox {
  548. padding:10px;
  549. overflow-y:scroll;
  550. overflow-x:hidden;
  551. text-align: justify;
  552. font-size:10.5px;
  553. letter-spacing:1pt;
  554. line-height:135%;
  555. height:100px;
  556. position:fixed;
  557. width:400px;
  558. color:{color:desc text};
  559. margin-left:10px;
  560. margin-top:65px;
  561. padding-bottom:15px;
  562. font-family:quicksand;
  563. text-transform:lowercase;
  564. background-color:{color:description background};
  565. border-radius:8px;
  566. }
  567.  
  568. .tabbox2 {
  569. padding:10px;
  570. overflow:hidden;
  571. text-align: justify;
  572. letter-spacing:1pt;
  573. height:150px;
  574. position:fixed;
  575. width:350px;
  576. color:{color:desc text};
  577. margin-left:68px;
  578. margin-top:220px;
  579. padding-bottom:15px;
  580. font-family:quicksand;
  581. text-transform:lowercase;
  582. background-color:transparent;
  583. border-radius:8px;
  584.  
  585. }
  586.  
  587. .tabbox2 li {
  588. display:inline-block;
  589. padding:10px;
  590. font-size:40px;
  591. color:{color:accent1};
  592. margin:10px;
  593. background-color:{color:post background};
  594. border-radius:8px;
  595. border: 1px solid {color:border};
  596. margin-bottom:5px;
  597. }
  598.  
  599. .tabbox2 a {
  600. color:{color:accent1};
  601. }
  602.  
  603. /*ENTRIES*/
  604.  
  605. article {
  606. float:left;
  607. background:{color:posts};
  608. width: 100%;
  609. }
  610.  
  611.  
  612.  
  613.  
  614. /*this is the background for the whole container, including the sidebar*/
  615. #box{
  616. margin-top:-11px;
  617. margin-left:300px;
  618. width:653px;
  619. height:450px;
  620. background-color:{color:container};
  621. position:fixed;
  622. z-index:-999999;
  623. border-bottom-left-radius:8px;
  624. border-bottom-right-radius:8px;
  625. }
  626.  
  627. #entries {
  628. position:fixed;
  629. padding:10px;
  630. margin-left:10px;
  631. margin-top:10px;
  632. height:400px;
  633. width:443px;
  634. background:{color:background};
  635. overflow:auto;
  636. }
  637.  
  638. #post {
  639. font-size:10.5px;
  640. width:400px;
  641. background-color: {color:post background};
  642. padding:20px;
  643. margin-bottom:30px;
  644. color: {color:text};
  645. text-align:justify;
  646. word-wrap: break-word;
  647. border-radius:8px;
  648. border: 1px solid {color:border};
  649. }
  650.  
  651. #post img {
  652. border-radius:8px;
  653. }
  654.  
  655. #everything{
  656. margin-top:90px;
  657. }
  658.  
  659. .center {
  660. margin: auto;
  661. left:0px;
  662. top:0px;
  663. bottom:0px;
  664. right:0px;
  665. }
  666.  
  667.  
  668.  
  669. /*SIDEBAR*/
  670.  
  671. #sidebar{
  672. padding:10px;
  673. z-index:-9999;
  674. text-align:center;
  675. position:fixed;
  676. margin-top:30px;
  677. font-size:10px;
  678. margin-left:760px;
  679. width:390px;
  680. height:150px;
  681. color:black;
  682. font-family:quicksand;
  683. color:{color:background};
  684. }
  685.  
  686. #title {
  687. color: {color:accent3};
  688. width: 150px;
  689. height:60px;
  690. overflow: visible;
  691. text-align:center;
  692. padding: 5px;
  693. margin-left: 12px;
  694. margin-top: 165px;
  695. text-transform: lowercase;
  696. font-size: 65px;
  697. font-family: "slash";
  698. line-height: 0.7;
  699. text-shadow: 0px 0px 3px {color:shadow};
  700. z-index:50;
  701. position:absolute;
  702. z-index:-999999;
  703. }
  704.  
  705. #description {
  706. padding:10px;
  707. overflow-y:scroll;
  708. overflow-x:hidden;
  709. text-align: justify;
  710. font-size:9px;
  711. letter-spacing:1pt;
  712. line-height:135%;
  713. height:225px;
  714. position:fixed;
  715. width:145px;
  716. color:{color:desc text};
  717. margin-left:10px;
  718. margin-top:240px;
  719. padding-bottom:15px;
  720. font-family:quicksand;
  721. text-transform:lowercase;
  722. background-color:{color:description background};
  723. border-radius:8px;
  724. border: 1px solid {color:border};
  725. }
  726.  
  727. /*POST INFO*/
  728.  
  729. #info {
  730. width:426px;
  731. text-align:left;
  732. font-family:quicksand;
  733. margin-top:7px;
  734. margin-left:-20px;
  735. letter-spacing:1px;
  736. color:{color:text};
  737. background:{color:info background};
  738. font-size:8px;
  739. font-style:none;
  740. padding:7px;
  741. line-height:10px;
  742. text-transform:uppercase;
  743. z-index:99999;
  744. }
  745.  
  746. #info a {
  747. background:{color:info background};
  748. text-align:center;
  749. color:{color:Links};
  750. }
  751.  
  752. #info a:hover {
  753. -moz-transition-duration:0.3s;
  754. -webkit-transition-duration:0.3s;
  755. -o-transition-duration:0.3s;
  756. color:{color:accent1}
  757. }
  758.  
  759.  
  760. ol.notes {
  761. display:block;
  762. text-align:left;
  763. list-style-type:none;
  764. margin-left:15px;
  765. background-color:{color:Info Background};
  766. }
  767.  
  768. ol.notes li.note{
  769. margin-left:15px;
  770. margin-bottom:5px;
  771. background-color:{color:Info Background};
  772. line-height:110%;
  773. }
  774.  
  775. .pagenotes {
  776. text-align:left;
  777. margin-top:15px;
  778. background:none;
  779. margin-left:15px;
  780. background-color:{color:Info Background};
  781. }
  782.  
  783. .pagenotes img{
  784. padding-right:5px;
  785. padding-top:5px;
  786. margin-bottom:-5px;
  787. }
  788.  
  789.  
  790.  
  791. /*CHAT*/
  792.  
  793. ul.chat{
  794. list-style:none;
  795. margin-left:-40px;
  796. }
  797.  
  798. .chat span {
  799. float: left;
  800. }
  801.  
  802. p.chat {
  803. padding-left:3px;
  804. border-radius:3px;
  805. }
  806.  
  807. /*QUOTES*/
  808.  
  809. .quote{
  810. font-size:20px;
  811. font-family:quicksand;
  812. text-align:center;
  813. line-height:100%;
  814. background:transparent;
  815. }
  816.  
  817. .qsource{
  818. text-align:right;
  819. margin-bottom:10px;
  820. color:{color:links};
  821. text-align:center;
  822. font-size:10.5px;
  823. font-family:quicksand;
  824. text-decoration:lowercase;
  825. padding:7px;
  826. }
  827.  
  828. /*AUDIO*/
  829.  
  830. .songart{
  831. float:left;
  832. margin-right:10px;
  833. }
  834.  
  835. .songart img{
  836. width:77px;
  837. height:77px;
  838. }
  839.  
  840. .audio {
  841. margin-top:-10px;
  842. }
  843.  
  844. .songtitle{
  845. margin-bottom:10px;
  846. margin-left:90px;
  847. text-shadow: 1px 1px 0px {color:shadow};
  848. }
  849.  
  850. .songauthor{
  851. margin-bottom:10px;
  852. font-size:8px;
  853. margin-left:90px;
  854. }
  855.  
  856. .tumblr_audio_player {
  857. height: 50px;
  858. border-radius:3px;
  859. }
  860.  
  861.  
  862. /*QUESTION*/
  863.  
  864. #asker {
  865. color:{color:text};
  866. padding:14px;
  867. font-family: quicksand;
  868. font-size:10.5px;
  869. letter-spacing:0px;
  870. text-align:left;
  871. margin-top:0px;
  872. text-transform:lowercase;
  873. line-height:100%;
  874. }
  875.  
  876.  
  877.  
  878. /*PAGINATION*/
  879. #pagination {
  880. width:165px;
  881. font-size:10px;
  882. z-index:999999999999;
  883. text-align:center;
  884. color:{color:desc text};
  885. position:fixed;
  886. margin-left:780px;
  887. height:23px;
  888. margin-top:544px;
  889. background-color:{color:description background};
  890. font-family:quicksand;
  891. line-height:15px;
  892. padding-top:7px;
  893. border-radius:8px;
  894. border: 1px solid {color:border};
  895. }
  896.  
  897. #pagination a {
  898. color:{color:post Background};
  899. font-size:10px;
  900. font-family:quicksand;
  901. z-index:999999999999;
  902. font-weight:bold;
  903. line-height:15px;
  904. background-color:transparent;
  905. }
  906.  
  907.  
  908. #credit {
  909. font-size:8px;
  910. float:center;
  911. line-height:8px;
  912. position:fixed;
  913. bottom:25px;
  914. letter-spacing:1px;
  915. right:25px;
  916. font-family: 'Quicksand', sans-serif;
  917. text-transform:lowercase;
  918. padding:8px;
  919. color:{color:text};
  920. background-color: {color:container};
  921. border: 1px solid {color:border};
  922. border-radius:8px;
  923. }
  924.  
  925. #credit a {
  926. color:{color:text};
  927. text-decoration:none;
  928. }
  929.  
  930.  
  931.  
  932. {CustomCSS}
  933.  
  934.  
  935. </style></head>
  936.  
  937. <body>
  938.  
  939.  
  940. <!--- this is your tooltip scripts ---->
  941.  
  942. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  943. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  944. <script>
  945.  
  946. (function($){
  947.  
  948. $(document).ready(function(){
  949.  
  950. $("a[title]").style_my_tooltips({
  951.  
  952. tip_follows_cursor:true,
  953.  
  954. tip_delay_time:50,
  955.  
  956. tip_fade_speed:600,
  957.  
  958. attribute:"title"
  959.  
  960. });
  961.  
  962. });
  963.  
  964. })(jQuery);
  965.  
  966. </script>
  967.  
  968. <!---- start of your html ---->
  969.  
  970. <div id="everything" class"center">
  971.  
  972.  
  973.  
  974. <div id="sidebar">
  975. <div id="title">{text:title}</div>
  976.  
  977. <div id="description">{description}</div></div></div>
  978.  
  979.  
  980.  
  981.  
  982. <div id="pagination">{block:Pagination}
  983. {block:PreviousPage}
  984. <a href="{PreviousPage}"><span class="th th-chevron-left"></span></a>
  985. {/block:PreviousPage}
  986.  
  987. {block:NextPage}
  988. <a href="{NextPage}"><span class="th th-chevron-right"></span></a>
  989. {/block:NextPage}
  990. {/block:Pagination}</div>
  991.  
  992. <div id="topbar">
  993. <ul class="topnav">
  994. <li class="active" style="margin-left:-42px">
  995. <a href="/" title="refresh"><span class="th th-broken-heart"></span></a></li>
  996. <li><a href="{text:link1}" title="{text:link1 text}"><span class="th th-cherry"></span></a></li>
  997. <li><a href="{text:link2}" title="{text:link2 text}"><span class="th th-mushroom"></span></a>
  998. <li title="navigate"><div id="menuTrigger" onclick="openNav()" title="navigate"><span class="th th-honey-2" title="navigate"></span></div></ul></div>
  999. <div id="mercMenu">
  1000.  
  1001. <div class="tabtitle" style="margin-top:17px;margin-left:15px;overflow:visible;"><main>read our plot</main><subb>subtitle goes here</subb></div>
  1002. <div class="tabbox">
  1003.  
  1004. gravida cum sociis natoque penatibus et magnis dis parturient montes nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc vel risus commodo viverra maecenas accumsan lacus vel facilisis volutpat est velit egestas dui id ornare arcu odio ut sem nulla pharetra diam sit amet nisl suscipit adipiscing bibendum est ultricies integer quis auctor elit sed vulputate mi sit amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada proin libero nunc consequat interdum varius sit amet mattis vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor posuere ac ut consequat semper viverra nam libero justo laoreet sit amet cursus sit amet dictum sit amet justo donec enim diam vulputate ut pharetra sit amet aliquam id diam maecenas ultricies mi eget mauris pharetra et ultrices neque ornare aenean euismod elementum nisi quis eleifend quam adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui sapien eget mi proin sed libero enim sed faucibus turpis in eu mi bibendum neque egestas congue quisque egestas diam in arcu cursus euismod quis viverra nibh cras pulvinar mattis nunc sed blandit libero volutpat sed cras ornare arcu dui vivamus arcu felis bibendum ut tristique et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut placerat orci nulla pellentesque dignissim enim sit amet venenatis urna cursus eget nunc scelerisque viverra mauris in aliquam sem fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque massa placerat duis ultricies lacus sed turpis tincidunt id aliquet risus feugiat in ante metus dictum at tempor commodo ullamcorper a lacus vestibulum sed arcu non odio euismod lacinia at quis risus sed vulputate odio ut enim blandit volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in dictum non consectetur a erat nam at lectus urna duis convallis convallis tellus id
  1005.  
  1006. </div>
  1007. <div class="tabtitle" style="margin-top:-20px;margin-left:15px;overflow:visible;"><main>navigate the page</main><subb>subtitle goes here</subb></div>
  1008. <div class="tabbox2">
  1009.  
  1010. <ul>
  1011. <li><a href="{text:tablink1}" title="{text:tablink1 text}"><span class="th th-avocado"></span></a></li><li><a href="{text:tablink2}" title="{text:tablink2 text}"><span class="th th-bagel"></span></a></li><li><a href="{text:tablink3}" title="{text:tablink3 text}"><span class="th th-bee"></span></a></li><li><a href="{text:tablink4}" title="{text:tablink4 text}"><span class="th th-blossom"></span></a></li><li><a href="{text:tablink5}" title="{text:tablink5 text}"><span class="th th-butterfly"></span></a></li><li><a href="{text:tablink6}" title="{text:tablink6 text}"><span class="th th-cactus"></span></a></li>
  1012. </ul>
  1013.  
  1014. </div>
  1015.  
  1016.  
  1017.  
  1018. </a>
  1019.  
  1020.  
  1021. </div>
  1022. <div id="header"></div>
  1023. <div id="dropdown">
  1024. </div>
  1025.  
  1026.  
  1027. <div id="box">
  1028. <div id="entries">
  1029.  
  1030. <div id="postcontainer">
  1031.  
  1032. {block:Posts}
  1033. <article>
  1034.  
  1035. <div id="post">
  1036.  
  1037. <!--- TEXT POSTS ---->
  1038.  
  1039. {block:Text}
  1040. {block:Title}<h3>{Title}</h3>{/block:Title}
  1041. {Body}{/block:Text}
  1042.  
  1043. <!--- PHOTO POSTS ---->
  1044.  
  1045. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  1046. {block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1047.  
  1048. <!--- PHOTOSET POSTS ---->
  1049.  
  1050. {block:Photoset}{Photoset-400}{block:Caption}{Caption}
  1051. {/block:Caption}{/block:Photoset}
  1052.  
  1053. <!--- QUOTE POSTS ---->
  1054.  
  1055. {block:Quote}<div class="quote">❝ {Quote} ❞</div>
  1056. {block:Source}<div class="qsource"> —{Source}</div>
  1057. {/block:Source}{/block:Quote}
  1058.  
  1059. <!--- LINK POSTS ---->
  1060.  
  1061. {block:Link}<h1><a href="{URL}" {Target}><b>{Name}</b></a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  1062.  
  1063. <!--- CHAT POSTS ---->
  1064.  
  1065. {block:Chat}{block:Title}{Title}{/block:Title}{block:Lines}{block:Label}<b><u>{Label}</u></b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  1066.  
  1067. <!--- AUDIO POSTS ---->
  1068.  
  1069. {block:Audio}{block:AlbumArt}<div class="songart"><img src="{AlbumArtURL}" align="left" style="margin-right:10px" /></div>{/block:AlbumArt}<span class="audio">{AudioPlayerBlack}</span>
  1070. {block:TrackName}
  1071. <b style="font-size:10.5px;"><u>Title:</u></b> <span style="color:{color:accent2};">{TrackName}</span><br>{/block:TrackName}
  1072. {block:Artist}<b style="font-size:10.5px;"><u>Artist:</u></b> <span style="color:{color:accent2};">{Artist}</span>{/block:Artist}
  1073. {/block:ExternalAudio}
  1074. {block:Caption}{Caption}{/block:Caption}
  1075. {/block:Audio}
  1076.  
  1077. <!--- VIDEO POSTS ---->
  1078.  
  1079. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1080.  
  1081. <!--- ASK POSTS ---->
  1082. <!--- this is inline styling & is very easy to use. it's like css coding but in the actual html. ---->
  1083.  
  1084. {block:Answer}<span style ="font-family:quicksand;font-size:13px;background:{color:background};color:white;padding:2px;text-transform:lowercase;color:{color:text};border-top-right-radius:8px;border-top-left-radius:8px;">{Asker} inquired,</span></b> <div id="ask" style="text-align:left;margin-left:0px;margin-top:0px;font-style:italic;padding:15px;font-size:10.5px;font-color:{color:text};font-family:quicksand;text-transform:lowercase;letter-spacing:0px;border:1px solid {color:border};margin-top:2px;border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-top-right-radius:8px;">{Question}</span></div>{Answer}{/block:Answer}
  1085.  
  1086. <!--- INFO & TAGS ---->
  1087.  
  1088. <div id="info">
  1089. <a href="{Permalink}">{TimeAgo}</a> WITH <a href="{Permalink}">{NoteCount} NOTES</a>
  1090.  
  1091.  
  1092.  
  1093. </div>
  1094. </div>
  1095.  
  1096. <!--- POSTNOTES ---->
  1097.  
  1098. {block:Posts}
  1099. <br><br>{block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}</article>
  1100. {/block:Posts}</div>
  1101.  
  1102.  
  1103. <!--- CREDIT ---->
  1104.  
  1105. {block:ContentSource}
  1106. <!– {SourceURL}{block:SourceLogo}<img src=“{BlackLogoURL}”
  1107. width=“{LogoWidth}” height=“{LogoHeight}” alt=“{SourceTitle}” />
  1108. {/block:SourceLogo}
  1109. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} –>
  1110. {/block:ContentSource}
  1111.  
  1112. <div id="credit"><span class="th th-moon"></span> &nbsp;<a href="https://morbidrpa.tumblr.com/">credit</a></div>
  1113. </body>
  1114.  
  1115.  
  1116.  
  1117.  
  1118.  
  1119.  
  1120.  
  1121.  
  1122. </body>
  1123. </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!