API tools faq
paste
Advertisement
tsiappoworks

baz u a baz

tsiappoworks
Aug 31st, 2017
129
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.47 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
  4.  
  5.  
  6. <!----------------------POPUP_BLOCK SCRIPT BELOW-------------------------->
  7. <script type="text/javascript"
  8. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  9. <script>
  10. $(document).ready(function() {
  11. //
  12. $('a.poplight[href^=#]').click(function() {
  13. var popID = $(this).attr('rel'); //Get Popup Name
  14. var popURL = $(this).attr('href'); //Get Popup href to define size
  15. var query= popURL.split('?');
  16. var dim= query[1].split('&');
  17. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  18. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  19. var popMargTop = ($('#' + popID).height() + 80) / 2;
  20. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  21. //Apply Margin to Popup
  22. $('#' + popID).css({
  23. 'margin-top' : -popMargTop,
  24. 'margin-left' : -popMargLeft
  25. });
  26. $('body').append('<div id="fade"></div>');
  27. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  28. return false;
  29. });
  30. $('a.close, #fade').live('click', function() {
  31. $('#fade , .popup_block, .popup_block2').fadeOut(function() {
  32. $('#fade, a.close').remove(); //fade them both out
  33. });
  34. return false;
  35. });
  36. });
  37. </script>
  38.  
  39. <script type="text/javascript" src="https://pastebin.com/raw/0QibYDaZ"></script>
  40.  
  41. <script>
  42. $(document).ready(function(){
  43. $(".faq-answer").hide();
  44. $(".faq-question").click(function(){
  45. $(this).next(".faq-answer").slideToggle('fast');
  46. });
  47. });
  48. </script>
  49. <!-------------------- VERSES SCRIPT BELOW -------------------->
  50. <script src="http://static.tumblr.com/dxh5xq2/v6Gn8ju1e/tabs.js"></script>
  51.  
  52. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  53. <link rel="shortcut icon" href="" />
  54. <link rel="shortcut icon" href="{Favicon}" />
  55.  
  56. <meta name="color:background" content="#f7eee5">
  57. <meta name="color:Accent" content="#b2946d" />
  58. <meta name="color:Accent2" content="#947c60" />
  59. <meta name="color:Accent3" content="#c8c997" />
  60. <meta name="color:body font" content="#858970" />
  61.  
  62. <script type="text/javascript" src="http://static.tumblr.com/86jccts/wpsmuemne/hoverqtip.js"></script>
  63.  
  64. <style type="text/css">
  65. /*---------------------BODY--------------------*/
  66. ::-webkit-scrollbar-thumb{
  67. background-color:#afd5d5;
  68. height:auto;
  69. }
  70.  
  71. ::-webkit-scrollbar {
  72. background-color:transparent;
  73. height:auto;
  74. width:4px;
  75. }
  76.  
  77. ::-webkit-scrollbar:horizontal {
  78. background-color:transparent;
  79. height:4px;
  80. width:auto;}
  81.  
  82.  
  83. hr {
  84. border: 0;
  85. height: 1px;
  86. background-image: linear-gradient(to right, rgba(185, 210, 220, 0), rgba(48, 101, 120, 0.75), rgba(185, 210, 220, 0));
  87. }
  88.  
  89. h1 {
  90. font-weight:normal;
  91. font-size:22px;
  92. text-align:center;
  93. font-style:normal;
  94. line-height:100%;
  95. letter-spacing:1px;
  96. text-transform:normal;
  97. color:{color:accent2};
  98. font-family: 'Oswald', sans-serif;
  99. }
  100.  
  101. h2 {
  102. font-size:26px;
  103. text-align:center;
  104. line-height:100%;
  105. letter-spacing:-0.5px;
  106. color:{color:accent2};
  107. font-weight:bold;
  108. padding:5px;
  109. font-family: 'Oswald', sans-serif;
  110. }
  111.  
  112. body {
  113. margin: 0;
  114. color:{font:body font};
  115. background: url('http://static.tumblr.com/6vqnbue/vU6ova9rr/wavegrid.png');
  116. font-size:11px;
  117. word-wrap: break-word;
  118. font-family:Calibri, helvetica, arial, sans-serif;
  119. }
  120.  
  121. pre {
  122. white-space: pre-wrap;
  123. white-space: -moz-pre-wrap;
  124. white-space: -pre-wrap;
  125. white-space: -o-pre-wrap;
  126. word-wrap: break-word;
  127. }
  128.  
  129. small {
  130. font-size:11px;
  131. font-family: calibri,helvetica,arial,sans-serif;
  132. }
  133.  
  134. sub,sup {
  135. font-size:10px;
  136. font-family: calibri,helvetica,arial,sans-serif;
  137. }
  138.  
  139. b,strong {
  140. color:#7FB0B0;
  141. font-size:13px;
  142. font-family: 'Oswald', sans-serif;
  143. }
  144.  
  145. em,i {
  146. color:#7FB0B0;
  147. font-family: 'Oswald', sans-serif;
  148. }
  149.  
  150. s,strike {
  151. color:#e7bf2c;
  152. }
  153.  
  154. u,underline {
  155. color:#e7bf2c;
  156. }
  157.  
  158. a {
  159. text-decoration:none;
  160. outline:none;
  161. -moz-outline-style:none;
  162. }
  163.  
  164. img{border:0; max-width:100%;max-height:auto;}
  165.  
  166. /* SELECTION */
  167.  
  168. ::-moz-selection { /* Code for Firefox */
  169. color:white;
  170. background-color:#999;
  171. }
  172.  
  173. ::selection {
  174. color:white;
  175. background-color:#999;
  176. }
  177.  
  178. /*------------------- MAIN CONTENT STUFF ------------------*/
  179.  
  180. #title{font-size:20px;line-height:25px;}
  181.  
  182. #content {
  183. position:fixed;
  184. z-index:990;
  185. width:700px;
  186. height: 500px;
  187. top: 50%;
  188. left: 50%;
  189. margin: -250px 0 0 -350px;
  190. }
  191.  
  192. blockquote {
  193. padding:2px 5px 2px 10px;
  194. margin:5px;
  195. border-left:1px solid #e7bf2c;
  196. }
  197.  
  198. blockquote img {
  199. max-width:100%;}
  200.  
  201. img{
  202. border:0px;
  203. max-width:100%;
  204. }
  205.  
  206. /*------------------------CUSTOM TOOLTIP--------------------------*/
  207. div#qTip {
  208. background:#999;
  209. border:1px solid white;
  210. padding: 5px;
  211. display: none;
  212. text-align: center;
  213. position: absolute;
  214. font-size:13px;
  215. line-height:10px;
  216. z-index: 9999999;
  217. color:#fff;
  218. letter-spacing: 1px;
  219. font-family: 'Oswald', sans-serif;
  220. }
  221.  
  222.  
  223. /*---------------WHOA, NELLY IT'S THE POP-UP MENU!---------------*/
  224. #box1{
  225. text-align:center;
  226. color:{color:body font};
  227. font-family: Calibri, helvetica, arial, sans-serif;
  228. font-size:12px;
  229. }
  230.  
  231. .popup_block{
  232. display:none;
  233. background:#fff;
  234. padding:20px;
  235. float:left;
  236. max-height:400px;
  237. position:fixed;
  238. top:50%;left:50%;
  239. z-index: 99999;
  240. }
  241.  
  242. *html #fade {position: absolute;}
  243. *html .popup_block {position: absolute;}
  244. #fade {
  245. display:none;
  246. position:fixed;
  247. left:0px;
  248. top:0px;
  249. width:100%;
  250. height:100%;
  251. z-index:
  252. 9999;
  253. background-image:url('http://static.tumblr.com/mwciju1/ZZVommkq2/asanoha-400px.png');
  254. }
  255.  
  256. /*-----------------NAVIGATION---------------*/
  257. #nav {
  258. text-align:center;
  259. position:fixed;
  260. float:left;
  261. width:610px;
  262. margin-top:-20px;
  263. left:50%;
  264. margin-left:-305px;
  265. letter-spacing:0.27px;
  266. }
  267.  
  268. #nav a{
  269. color: #999;
  270. letter-spacing: 2px;
  271. font-size: 8px;
  272. line-height: 14px;
  273. font-weight: bold;
  274. background-color: #fff;
  275. width:100px;
  276. padding:5px 5px;
  277. text-transform: uppercase;
  278. height: 15px;
  279. text-align: center;
  280. cursor: pointer;
  281. display: inline-block;
  282. margin-bottom: 5px;
  283. border:1px solid #e2e2e2;
  284. }
  285. #nav a:hover{background:#e7bf2c;color:white;}
  286.  
  287. /*-------------POPUP NAVI---------------*/
  288. .popupnavlinks {
  289. padding-top:5px;
  290. text-align:center; }
  291.  
  292.  
  293. .popupnavlinks a {
  294. display:inline-block;
  295. width:100px; height:8px;
  296. margin:2px; padding:6px 6px 14px;
  297. text-align:center;
  298. font-family:Calibri, helvetica, arial, sans-serif;
  299. font-size:9px;
  300. text-transform:uppercase;
  301. letter-spacing:1px;
  302. color:white;
  303. background:transparent;
  304. background-image:url(http://static.tumblr.com/dl4aazm/usfoulf5a/selectionena.png);
  305. border:1px solid {color:background};
  306. }
  307.  
  308.  
  309. .popupnavlinks a:hover {
  310. display:inline-block;
  311. width:100px; margin:2px;
  312. padding:6px 6px 14px;
  313. text-align:center;
  314. font-family:Calibri, helvetica, arial, sans-serif;
  315. font-size:9px;
  316. text-transform:uppercase;
  317. letter-spacing:1px;
  318. color:{color:accent};
  319. background:transparent }
  320.  
  321. /*--------- THIS IS WHERE ALL THE TAB STUFF IS -----------*/
  322. .main {
  323. padding:10px;
  324. width: 590px;
  325. height:500px;
  326. margin: 10px auto;
  327. background: #eee;
  328. border:1px solid #e2e2e2;
  329. }
  330.  
  331. .tab {
  332. width:590px;
  333. margin: 0 auto;
  334. }
  335.  
  336. .tab label {
  337. color: #999;
  338. letter-spacing: 2px;
  339. font-size: 8px;
  340. line-height: 14px;
  341. font-weight: bold;
  342. background-color: #ffffff;
  343. width:100px;
  344. padding: 5px;
  345. text-transform: uppercase;
  346. height: 15px;
  347. text-align: center;
  348. cursor: pointer;
  349. display: block;
  350. margin-bottom: 5px;
  351. }
  352.  
  353. .tab label:hover {
  354. background: #333;
  355. color:#fff;
  356. }
  357.  
  358. [type=radio]:checked ~ label {
  359. z-index: 2;
  360. color: #fff;
  361. background: #e7bf2c;
  362. }
  363.  
  364. .tab [type=radio] {
  365. display: none;
  366. }
  367.  
  368. .content {
  369. color: #999;
  370. background-color: #ffffff;
  371. width: 450px;
  372. height: 480px;
  373. margin-top: -9px;
  374. margin-left: 120px;
  375. padding: 10px;
  376. overflow: auto;
  377. text-align: left;
  378. position: absolute;
  379. line-height:190%;
  380. top:30px;
  381. font-size:9px;
  382. }
  383.  
  384. .content a {
  385. color: #999;
  386. margin-bottom: 2px;
  387. text-decoration: none;
  388. }
  389.  
  390. .content a:hover {
  391. border-bottom: solid 1px #666;
  392. text-align:center;
  393. color: #666;
  394. }
  395.  
  396. [type=radio]:checked ~ label ~ .content {
  397. z-index: 1;
  398. }
  399.  
  400. /*-----------------SLIDER THINGIES-----------------*/
  401.  
  402. .faq-holder {
  403. margin-bottom:5px;
  404. }
  405.  
  406. .faq-question {
  407. background:#afd5d5;
  408. color:#fff;
  409. font-family:Calibri, helvetica, arial, sans-serif;
  410. font-size:11px;
  411. font-style:normal;
  412. font-weight:normal;
  413. letter-spacing:0px;
  414. padding:10px;
  415. text-align:left;
  416. text-decoration:none;
  417. text-transform:uppercase;
  418. }
  419.  
  420. .faq-question:hover {
  421. cursor:help;
  422. }
  423.  
  424. .faq-answer {
  425. color:#999;
  426. font-family:'Karla', sans-serif;
  427. font-size:10px;
  428. font-style:normal;
  429. font-weight:normal;
  430. letter-spacing:0px;
  431. margin-top:5px;
  432. text-align:left;
  433. text-decoration:none;
  434. }
  435.  
  436. /*-------------------- NAVIGATION SLASH TAGS ---------------------*/
  437. #navigation {
  438. width:425px;
  439. }
  440.  
  441. .navigation-title {
  442. color:#fff;
  443. background-color:#afd5d5;
  444. font-family:Calibri, helvetica, arial, sans-serif;
  445. font-size:12px;
  446. letter-spacing:2px;
  447. margin-bottom:2px;
  448. padding:10px;
  449. margin-top:-10px;
  450. text-decoration:none;
  451. text-align:left;
  452. text-transform:uppercase;
  453. width:425px;
  454. }
  455.  
  456. .navigation-links {
  457. font-family:Calibri, helvetica, arial, sans-serif;
  458. font-size:10px;
  459. font-style:normal;
  460. font-weight:normal;
  461. letter-spacing:0em;
  462. text-align:center;
  463. text-transform:uppercase;
  464. width:445px;
  465. }
  466.  
  467. .navigation-links a {
  468. border-bottom:none;
  469. color:#999;
  470. background-color:#eaeaea;
  471. display:inline-block;
  472. padding:10px 0px;
  473. margin-bottom:2px;
  474. width:109px;
  475. }
  476.  
  477. .navigation-links a:hover {
  478. background-color:#e7bf2c;
  479. color:#fff;
  480. border-bottom:0px;
  481. }
  482. {CustomCSS}</style>
  483. </head>
  484. <body>
  485.  
  486.  
  487. <!-- end updates tab -->
  488. <!---------------------- MAIN CONTENT ----------------------->
  489.  
  490. <div id="content">
  491.  
  492. <!------------------------- NAVIGATION -------------------------->
  493. <div id="nav">
  494. <a href="/">BACK</a>&nbsp;&nbsp;
  495. <a href="/ask">MESSAGE</a>&nbsp;&nbsp;
  496. <a href="/submit">SUBMIT</a>&nbsp;&nbsp;
  497. <a href="/guide">GUIDE</a>&nbsp;&nbsp;
  498. <a href="/sel">MUSES</a>
  499. </div>
  500.  
  501. <div id="posts">
  502. <!----------------------- THE TABS 1---------------------------->
  503. <div class="main">
  504.  
  505. <div class="tab">
  506. <input type="radio" id="tab-1" name="tab-group-1" checked>
  507. <label for="tab-1">DETAILS</label>
  508. <div class="content">
  509. <b><center style="font-size:25px;">BASIL GREGORY FITZGERALD</center></b><br>
  510. <small>
  511. <b>called:</b> Baz, Fitz.<br>
  512. <b>birthday:</b> 25 June (24 years old).<br>
  513. <b>education:</b> Folklore & Mythology degree, Harvard.<br>
  514. <b>blood:</b> English, Afrikaner.<br>
  515. <b>orientation:</b> He'll take what he can get (female preference).<br>
  516. <b>place of birth:</b> Alberton, Gauteng, South Africa.<br>
  517. <b>living conditions:</b> Knightsbridge, London flat with <a href="/tibe">Tiberius</a>.<br>
  518. <b>occupation:</b> Commercial Mage&mdash;sells potions, charms, hexes, and other magical paraphernalia, never created <i>en masse</i>, but tailored to each client's particular needs.<br>
  519. <br>
  520. <center>relationships</center><br>
  521.  
  522. <b>parents:</b> Edmund Arthur Fitzgerald, father. Betje Englebrecht, mother.<br>
  523. <b>family:</b> Nicola Miriam Fitzgerald, sister (20). Pieter Arlo Fitzgerald, brother (16).<br>
  524. <b>pets:</b> <a href="/tibe">Tiberius</a>, his demonic familiar.<br>
  525. <br>
  526. <center>physical</center><br>
  527.  
  528. <b>eyes:</b> The pale grey-blue of cataracts. Piercing stare. Very long lashes. Styled often with electric blue eyeliner.<br>
  529. <b>hair:</b> Naturally dark brown; currently dyed lighter. Wavy. Worn mostly in fluffy twintails.<br>
  530. <b>height:</b> 160 cm (5'3")<br>
  531. <b>weight:</b> 47 kg, give or take.<br>
  532. <b>build:</b> &ldquo;Dainty.&rdquo; A premature baby who <em>just</em> managed to catch up with her peers. Slim. Modest bust. Wide hips and perky, almost disproportionately large rear. Most of weight is carried there and thighs. Waist is tiny in comparison, with a soft belly. Small, round face. freckled nose. Large forehead hidden by fringe.<br>
  533. <b>notable physical traits:</b> Gapped buck teeth. Three freckles below corner of mouth.<br>
  534. <b>clothing:</b> Prefers pale colours. Loose, comfortable outfits (i.e. roomy blouses, tunics) to de-emphasize bust. Often wears minidresses and skirts to draw attention to legs. Zettai ryouiki game is on point. A menace on skates.<br>
  535. <br>
  536. <center>core</center><br>
  537.  
  538. <b>intelligence:</b> business, books.<br>
  539. <b>likes:</b> sweaters, cheap perfume, books, horror films, surfing, dolls.<br>
  540. <b>dislikes:</b> pants, console games, gardening, overly sweet foods, beetles.<br>
  541. <b>disposition:</b> headstrong, self-sufficient, amicable, curious, helpful, mistrustful, selfish, arrogant, reliable.<br>
  542. <b>mbti:</b> ENFJ<br>
  543. <b>moral alignment:</b> lawful neutral<br>
  544. <b>medical conditions:</b> undiagnosed histrionic personality disorder.<br>
  545. <br>
  546. <center>other</center><br>
  547.  
  548. <b>phobias:</b> Heights, drowning, being completely alone.<br>
  549. <b>allergies:</b> Mushrooms.<br>
  550. <b>strengths:</b> Running, small spaces, holding breath, origami, resourcefulness, rapping.<br>
  551. <b>weaknesses:</b> Cooking, throwing, empathizing, children. Tends to be too mouthy for her own good. Terrible at archery or any other long-distance weapon/sport.<br>
  552. <b>extras:</b> Most valuable item is her mobile phone. Favourite food is steak. Uses reading glasses frequently. Was briefly on school swim team.<br>
  553. <b>current concern:</b> All the food she eats is catching up with her.</small>
  554. </div>
  555. </div>
  556.  
  557. <div class="tab">
  558. <input type="radio" id="tab-2" name="tab-group-1">
  559. <label for="tab-2">STORY</label>
  560. <div class="content">
  561. Tab 2 content
  562. </div>
  563. </div>
  564.  
  565. <div class="tab">
  566. <input type="radio" id="tab-3" name="tab-group-1">
  567. <label for="tab-3">FACTS</label>
  568. <div class="content">
  569. Tab 3 content
  570. </div>
  571. </div>
  572.  
  573. <div class="tab">
  574. <input type="radio" id="tab-4" name="tab-group-1">
  575. <label for="tab-4">MAIN TIMELINES</label>
  576. <div class="content">
  577. <div class="faq-holder">
  578. <p class="faq-question" style="margin-bottom:0px;margin-top:0px;">top of the world!</p>
  579. <div class="faq-answer">
  580. <p>Her passion always having been dramatic arts, Nobori Una became an idol in her first year of high school. Sort of. She served as the rapper for the Japanese music group HONEY-HOT, but the group never made it to debut. As a solo artist, however, she released her first song on April 10, 2017.
  581.  
  582. <p>Her time outside school is split between practicing her craft, updating her social media, and working at a maid cafe called Dolce★Dreaming. She plans on using her earnings to help out her family, which is typically on the brink of financial ruin due to her father's gambling addiction.
  583. </div>
  584. </div>
  585. </div>
  586. </div>
  587.  
  588. <div class="tab">
  589. <input type="radio" id="tab-5" name="tab-group-1">
  590. <label for="tab-5">fandom au I</label>
  591. <div class="content">
  592. <p style="text-align:center;"><b>To come as necessary!</b></p>
  593. </div>
  594. </div>
  595.  
  596. <div class="tab">
  597. <input type="radio" id="tab-6" name="tab-group-1">
  598. <label for="tab-6">fandom au II</label>
  599. <div class="content">
  600. <p style="text-align:center;"><b>To come as necessary!</b></p>
  601. </div>
  602. </div>
  603.  
  604. <div class="tab">
  605. <input type="radio" id="tab-7" name="tab-group-1">
  606. <label for="tab-7">RELATIONSHIPS</label>
  607. <div class="content">
  608.  
  609. <img src="https://68.media.tumblr.com/df48639b8f0b7b1228cb2abf18c5f0e4/tumblr_inline_ov9gu3iXNw1rb4fzw_540.png" style="width:80px;height:auto;border:9px solid white;outline:1px solid #ebebeb;margin:0px 8px;float:left;">
  610. <p><small>
  611. <a href="/tibe"><b>TIBERIUS</b></a><br>
  612. Basil's familiar. As the oldest child of his family, he inherited the demon from his mother's side. Tiberius, or &ldquo;Tibe,&rdquo; as he is sometimes affectionately called, has been passed down from one generation to the next for centuries. He and Basil don't get along well.
  613.  
  614. </small></p>
  615. </div>
  616. </div>
  617.  
  618. <div class="tab">
  619. <input type="radio" id="tab-8" name="tab-group-1">
  620. <label for="tab-8">TAGS</label>
  621. <div class="content">
  622. <div id="navigation">
  623.  
  624. <div class="navigation-title" style="margin-top:30px;">knowing you</div>
  625.  
  626. <div class="navigation-links">
  627. <a href="/">trivia</a>
  628. <a href="/">character meme</a>
  629. <a href="/">musings</a>
  630. <a href="/">status updates</a>
  631. </div>
  632.  
  633. <div class="navigation-title" style="margin-top:30px;">with feeling</div>
  634.  
  635. <div class="navigation-links">
  636. <a href="/">visage</a>
  637. <a href="/">wardrobe</a>
  638. <a href="/">music</a>
  639. <a href="/">aesthetic</a>
  640. </div>
  641.  
  642. <div class="navigation-title" style="margin-top:30px;">getting personal</div>
  643.  
  644. <div class="navigation-links">
  645. <a href="/tagged/;;UPON A STAR (wishlist.)">wishlist</a>
  646. <a href="/tagged/;;NATIONAL TREASURE (memes.)">ask memes</a>
  647. <a href="/tagged/;chedit.">my work</a>
  648. <a href="/tagged/;giftart.">gifts</a>
  649. </div>
  650.  
  651.  
  652. </div>
  653.  
  654. </div>
  655.  
  656. </div>
  657. </div>
  658. </div>
  659.  
  660. </div>
  661. </div>
  662.  
  663.  
  664.  
  665. </div></div>
  666.  
  667. </body>
  668. </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!