API tools faq
paste
Advertisement
tsiappoworks

Chrononautica Masked

tsiappoworks
Sep 2nd, 2016
328
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 52.97 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!DOCTYPE html>
  3.  
  4. <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
  5.  
  6.  
  7. <!----------------------POPUP_BLOCK SCRIPT BELOW-------------------------->
  8. <script type="text/javascript"
  9. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  10. <script>
  11. $(document).ready(function() {
  12. //
  13. $('a.poplight[href^=#]').click(function() {
  14. var popID = $(this).attr('rel'); //Get Popup Name
  15. var popURL = $(this).attr('href'); //Get Popup href to define size
  16. var query= popURL.split('?');
  17. var dim= query[1].split('&');
  18. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  19. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  20. var popMargTop = ($('#' + popID).height() + 80) / 2;
  21. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  22. //Apply Margin to Popup
  23. $('#' + popID).css({
  24. 'margin-top' : -popMargTop,
  25. 'margin-left' : -popMargLeft
  26. });
  27. $('body').append('<div id="fade"></div>');
  28. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  29. return false;
  30. });
  31. $('a.close, #fade').live('click', function() {
  32. $('#fade , .popup_block, .popup_block2').fadeOut(function() {
  33. $('#fade, a.close').remove(); //fade them both out
  34. });
  35. return false;
  36. });
  37. });
  38. </script>
  39. <!-------------------- VERSES SCRIPT BELOW -------------------->
  40. <script src="http://static.tumblr.com/dxh5xq2/v6Gn8ju1e/tabs.js"></script>
  41.  
  42. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  43. <link rel="shortcut icon" href="" />
  44. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  45.  
  46. <meta name="color:Page BG" content="#a5b79d"/>
  47. <meta name="color:Accent" content="#d1d1d1" />
  48. <meta name="color:Accent2" content="#2d5e73" />
  49. <meta name="color:Accent3" content="#FAFAFA" />
  50. <meta name="color:body font" content="#447373" />
  51. <meta name="color:Page BG" content="#d8e2e7" />
  52. <meta name="color:ask bg" content="#FAFAFA" />
  53.  
  54. <meta name="text:LinkSymbol" content="✕" />
  55.  
  56. <script type="text/javascript" src="http://static.tumblr.com/86jccts/wpsmuemne/hoverqtip.js"></script>
  57.  
  58. <style type="text/css">
  59.  
  60. ::-webkit-scrollbar-thumb{
  61. background-color: transparent;
  62. height:auto;
  63. }
  64.  
  65. ::-webkit-scrollbar {
  66. height:auto;
  67. width:4px;
  68. }
  69.  
  70. hr {
  71. border: 0;
  72. height: 1px;
  73. background-image: linear-gradient(to right, rgba(55, 62, 33, 0), rgba(55, 62, 33, 0.75), rgba(55, 62, 33, 0));
  74. }
  75.  
  76. h1 {
  77. font-weight:normal;
  78. font-size:22px;
  79. text-align:center;
  80. font-style:normal;
  81. line-height:100%;
  82. letter-spacing:1px;
  83. text-transform:normal;
  84. color:{color:accent3};
  85. font-family: 'Oswald', sans-serif;
  86. }
  87.  
  88. h2 {
  89. font-size:26px;
  90. text-align:center;
  91. line-height:100%;
  92. letter-spacing:-0.5px;
  93. color:{color:accent3};
  94. font-weight:bold;
  95. padding:5px;
  96. font-family: 'Oswald', sans-serif;
  97. }
  98.  
  99. blockquote {
  100. padding:2px 5px 2px 10px;
  101. margin:5px;
  102. border-left:2px solid {color:body font};
  103. -moz-border-radius: 15px;
  104. -webkit-border-radius: 15px;
  105. }
  106.  
  107. blockquote img {
  108. max-width:100%;}
  109.  
  110. body {
  111. background:{color:Page BG};
  112. background-image:url('http://static.tumblr.com/k6zk3b1/81xoccqil/nauxiansmall.png');
  113. background-position:left top fixed;
  114. background-repeat:no-repeat;
  115. color:{color:body font};
  116. font-size:11px;
  117. line-height:120%;
  118. word-wrap: break-word;
  119. font-family:Calibri, helvetica, arial, sans-serif;
  120. }
  121.  
  122. pre {
  123. white-space: pre-wrap;
  124. white-space: -moz-pre-wrap;
  125. white-space: -pre-wrap;
  126. white-space: -o-pre-wrap;
  127. word-wrap: break-word;
  128. }
  129.  
  130. small,sub,sup {
  131. font-size:12px;
  132. font-family: calibri,helvetica,arial,sans-serif;
  133. }
  134.  
  135. b,strong {
  136. color:{color:accent2};
  137. font-size:15px;
  138. font-family: 'Oswald', sans-serif;
  139. }
  140.  
  141. em,i {
  142. color:{color:accent3};
  143. text-shadow:0px 0px 8px #000;
  144. font-family: 'Oswald', sans-serif;
  145. }
  146.  
  147. s,strike {
  148. color:{color:accent2};
  149. }
  150.  
  151. u,underline {
  152. color:{color:accent2};
  153. }
  154.  
  155. a {
  156. text-decoration:none;
  157. outline:none;
  158. -moz-outline-style:none;
  159. color:{color:accent2};
  160. -moz-transition-duration:0.5s;
  161. -webkit-transition-duration:0.5s;
  162. -o-transition-duration:0.5s;
  163. }
  164.  
  165. a:hover {
  166. outline:none;
  167. -moz-outline-style:none;
  168. color:#FFFFFF;
  169. }
  170.  
  171. img{border:0; max-width:100%;max-height:auto;}
  172.  
  173. .fancytitle {
  174. font-size:11px;
  175. font-family: 'Oswald', sans-serif;
  176. padding:2px 4px;
  177. border:2px solid #fff;
  178. text-align:right;
  179. margin-bottom:5px;
  180. background-image:url('http://static.tumblr.com/k6zk3b1/66uocasri/selection.png');
  181. background-repeat:no-repeat;
  182. background-position: top center;
  183. }
  184.  
  185.  
  186. /*-----------------------------POPUP BOXES---------------------------*/
  187. .popup_block{
  188. display:none;
  189. height:450px;
  190. overflow-y:scroll transparent;
  191. overflow-x:hidden;
  192. background:#fff;
  193. background-image:url();
  194. padding:0px;
  195. float:none;
  196. position:fixed;
  197. font-size:12px;
  198. top:50%;left:50%;
  199. z-index: 99999;
  200. -webkit-box-shadow: 0px 0px 20px #000;
  201. -moz-box-shadow: 0px 0px 20px #000;
  202. box-shadow: 0px 0px 20px #000;
  203. }
  204.  
  205. .popup_block2{
  206. display:none;
  207. height:430px;
  208. overflow-y:scroll transparent;
  209. overflow-x:hidden;
  210. background:#fff;
  211. background-image:url('');
  212. padding:0px;
  213. float:none;
  214. position:fixed;
  215. font-size:12px;
  216. top:50%;left:50%;
  217. z-index: 99999;
  218. -webkit-box-shadow: 0px 0px 20px #000;
  219. -moz-box-shadow: 0px 0px 20px #000;
  220. box-shadow: 0px 0px 20px #000;
  221. }
  222.  
  223. *html #fade {position: absolute;}
  224. *html .popup_block, .popup_block2 {position: absolute;}
  225. #fade {
  226. display:none;
  227. position:fixed;
  228. left:0px;
  229. top:0px;
  230. width:100%;
  231. height:100%;
  232. z-index:9999;
  233. background:#000; /* change to #fff for solid white */
  234. opacity:0.5; /* change to opacity:1; */
  235. }
  236.  
  237. #boxy {
  238. margin-right:10px;
  239. padding-right:5px;
  240. padding-left:5px;
  241. margin-left:5px;
  242. padding-top:10px;
  243. margin-top:10px;
  244. height: 305px;
  245. width: 290px;
  246. overflow:auto;
  247. }
  248.  
  249. #boxydos {
  250. margin-right:150px;
  251. padding-right:10px;
  252. padding-left:5px;
  253. margin-left:0px;
  254. padding-top:0px;
  255. margin-top:10px;
  256. height: 385px;
  257. width: 520px;
  258. overflow:auto;
  259. }
  260.  
  261.  
  262. iframe#tumblr_controls {
  263. white-space:nowrap;
  264. -webkit-filter: invert(100%);
  265. -moz-filter: invert(100%);
  266. -o-filter: invert(100%);
  267. -ms-filter: invert(100%);
  268. filter: invert(100%);
  269. opacity:.2;transition: .8s ease-in-out;
  270. -webkit-transition: .8s ease-in-out;
  271. -moz-transition: .8s ease-in-out;
  272. -o-transition: .8s ease-in-out;
  273. }
  274.  
  275. #post {
  276. width:400px;
  277. margin:0px 0px 0px 3px;
  278. padding:10px 10px;
  279. background-color:transparent;
  280. font-family:calibri,helvetica,arial,sans-serif;
  281. color:{color:body font};
  282. }
  283.  
  284. #post .text{font-size:11px; line-height:16px;}
  285. #post .title{font-size:20px;}
  286. #post .text ul li{list-style-type:circle;}
  287.  
  288. #container {
  289. position:fixed;
  290. overflow-y:scroll;
  291. overflow-x:hidden;
  292. padding:1px;
  293. width:420px;
  294. height:450px;
  295. left:227px;
  296. top:83px;
  297. }
  298.  
  299.  
  300. div#qTip {
  301. background-color:#3988b1;
  302. box-shadow:2px 2px 8px #000;
  303. padding: 5px;
  304. display: none;
  305. text-align: center;
  306. position: absolute;
  307. font-size:15px;
  308. line-height:10px;
  309. z-index: 9999999;
  310. color:{color:accent3};
  311. letter-spacing: 1px;
  312. font-family: 'Oswald', sans-serif;
  313. }
  314.  
  315. /*-------------------------PERMALINKS AND TAGS------------------------*/
  316. #permalink{
  317. position:absolute;
  318. z-index:9;
  319. margin-top:-5px;
  320. padding:3px;
  321. font-size:10px;
  322. text-align:center;
  323. text-transform:uppercase;
  324. font-family:calibri,helvetica,arial,sans-serif;
  325. color:{color:accent};
  326. background:url('http://static.tumblr.com/k6zk3b1/66uocasri/selection.png');
  327. width:300px;
  328. margin-left:60px;
  329. }
  330.  
  331. #permalink a{color:{color:accent};vertical-align:middle;}
  332. #permalink a:hover{color:{color:accent2};}
  333.  
  334. #tags{
  335. margin-top:15px;
  336. font-size:10px;
  337. font-family:calibri,helvetica,arial,sans-serif;
  338. width:300px;
  339. text-align:center;
  340. margin-bottom:40px;
  341. margin-left:60px;
  342. }
  343.  
  344. /*------------------------EXTRA BITS AND BOBBLES----------------------*/
  345. .chat ul {list-style:none; margin:0; padding:0;}
  346. .chat li {font-size:11px;list-style-type: none;margin-left: 0px;padding: 3px;}
  347.  
  348. #notesbox{width:500px;margin:20px auto;font-size:11px;font-family:calibri,helvetica,arial,sans-serif;}
  349. #notesbox ol.notes{list-style-type:none;margin:7px 0px;padding:0px 0px;}
  350. #notesbox img.avatar{display:none;}
  351.  
  352. /*------------------- "SIDEBAR" ------------------*/
  353. #nav{
  354. position:fixed;
  355. z-index:75;
  356. margin-left:10px;
  357. margin-top:150px;
  358. width:400px;
  359. text-align:center;
  360. -ms-transform: rotate(90deg); /* IE 9 */
  361. -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
  362. transform: rotate(90deg);
  363. }
  364.  
  365. #navigation a{color:{color:accent2}; font-size:15px; text-decoration:bold;text-shadow: black 0 0 2px;}
  366.  
  367. #navigation a:hover{
  368. color:{color:accent}; text-decoration:bold;
  369. }
  370.  
  371. #pagination{
  372. font-family:Calibri, Helvetica, Arial, sans-serif;
  373. font-size:10px;
  374. text-align:center;
  375. color:{color:accent2};
  376. text-transform:uppercase;
  377. letter-spacing:3px;
  378. }
  379.  
  380. #pagination a{color:{color:accent2}; padding:0px 2px;}
  381.  
  382. /*--------------BITS AND BOBBLES-------------------*/
  383.  
  384. #audioplayer {
  385. width:30px;
  386. height:30px;
  387. overflow:hidden;
  388. position:absolute;
  389. margin-top:93px;
  390. margin-bottom:93px;
  391. margin-left:93px;
  392. }
  393.  
  394. #albumart { margin:0px 4px;}
  395.  
  396. .question {
  397. padding:9px;
  398. text-align:left;
  399. color:#bb6e8a;
  400. line-height:100%;
  401. -moz-border-radius: 6px;
  402. -webkit-border-radius: 6px;
  403. }
  404.  
  405. .answer {
  406. text-align:left;
  407. padding:7px;
  408. color:#bb6e8a;
  409. }
  410.  
  411.  
  412. /*-----------------------BIG BIO AHEAD------------------------*/
  413. .title {
  414. font-family: 'Oswald', sans-serif;/*title font*/
  415. font-size:70px;
  416. padding-top:100px;
  417. text-shadow:0 0 10px rgba(0,0,0,0.3);
  418. text-transform:bold;
  419. }
  420.  
  421. .subheader {
  422. margin-top:50px;
  423. }
  424.  
  425. .header {
  426. width:510px;
  427. height:200px;
  428. -webkit-transition:ease-in-out .3s;
  429. -moz-transition:ease-in-out .3s;
  430. -o-transition:ease-in-out .3s;
  431. transition:ease-in-out .3s;
  432. text-align:center;
  433. letter-spacing:1px;
  434. color:#fff;
  435. text-shadow:0 0 10px rgba(255,255,255);
  436. border-bottom:solid #fff 10px;
  437. background-color:#acacac;
  438. background-image:url(http://i.imgur.com/f64F0BG.png);
  439. background-position:center;
  440. background-size:100% auto;
  441. }
  442.  
  443. .header:hover {
  444. letter-spacing:3px;
  445. text-shadow:0 0 30px rgba(255,255,255);
  446. }
  447.  
  448. /* ---------------------SECTION TITLE CUSTOMIZATION--------------------- */
  449. .header2 {
  450. font-family: 'Oswald', sans-serif;
  451. font-size:14px;
  452. position:relative;
  453. z-index:1;
  454. width:500px;
  455. padding:5px 5px;
  456. padding-top:20px;
  457. text-align:center;
  458. letter-spacing:1px;
  459. background:#fff;
  460. }
  461.  
  462. .header2:before {
  463. position:absolute;
  464. z-index:-1;
  465. top:25px;
  466. right:0;
  467. bottom:0;
  468. left:0;
  469. width:95%;
  470. margin:0 auto;
  471. content:'';
  472. border-top:1px solid #dfdfdf;
  473. }
  474.  
  475. .header2 span {
  476. padding:0 5px;
  477. background:#fff;
  478. }
  479.  
  480. .content {
  481. position:relative;
  482. overflow:hidden;
  483. width:500px;
  484. min-height:75px;
  485. padding:5px 10px;
  486. background:#fff;
  487. }
  488.  
  489. /* -----------------------TEXT SELECTION CUSTOMIZATION----------------------- */
  490. ::selection {
  491. color:#fff;
  492. background:#379eca;
  493. }
  494.  
  495. ::-moz-selection {
  496. color:#fff;
  497. background:#379eca;
  498. }
  499.  
  500. ::-webkit-selection {
  501. color:#fff;
  502. background:#379eca;
  503. }
  504.  
  505. /*---------------------------DROP CAP CUSTOMIZATION---------------------------*/
  506. #dropcap {
  507. font-family: 'Oswald', sans-serif;
  508. font-size:230%;
  509. float:left;
  510. margin-right:5px;
  511. padding:10px 3px;
  512. color:#fff;
  513. background-color:#000;
  514. }
  515.  
  516. /* ----------------------- COLOR PALETTE CSS ------------------------*/
  517. .swatch {
  518. line-height:180px;
  519. position:relative;
  520. float:left;
  521. width:80px;
  522. height:80px;
  523. margin:10px;
  524. margin-top:-5px;
  525. text-align:center;
  526. background-position:center;
  527. background-size:auto 100%;
  528. }
  529.  
  530. /* ----------------------------QUOTE/LYRICS BOX ----------------------*/
  531. .quotebox {
  532. position:relative;
  533. display:inline-block;
  534. overflow:hidden;
  535. width:175px;
  536. height:175px;
  537. margin-left:20px;
  538. padding:20px;
  539. background-color:#acacac;
  540. background-image:url(http://static.tumblr.com/k6zk3b1/gywocdwj6/unaquotebox.png);
  541. background-position:center;
  542. background-size:auto 100%;
  543. }
  544.  
  545. .quote {
  546. font-family: 'Oswald', sans-serif;
  547. /* QUOTE FONT */
  548. text-shadow: 1px 1px 0px #5d5d5d, 1px -1px 0px #5d5d5d, -1px 1px 0px #5d5d5d, -1px -1px 0px #5d5d5d;
  549. font-size:13px;
  550. line-height:130%;
  551. position:absolute;
  552. display:inline-block;
  553. width:175px;
  554. height:175px;
  555. margin-top:5px;
  556. margin-left:-20px;
  557. padding:20px;
  558. text-align:center;
  559. letter-spacing:.5px;
  560. color:#fff;
  561. }
  562.  
  563. .musicbox {
  564. position:relative;
  565. display:inline-block;
  566. width:175px;
  567. height:175px;
  568. margin-left:20px;
  569. padding:20px;
  570. -webkit-transition:ease-in-out 1s;
  571. -moz-transition:ease-in-out 1s;
  572. -o-transition:ease-in-out 1s;
  573. transition:ease-in-out 1s;
  574. background-color:#acacac;
  575. background-image:url(http://static.tumblr.com/k6zk3b1/fs0ocdwj0/unamusicbox.png);
  576. background-position:center;
  577. background-size:auto 100%;
  578. }
  579.  
  580. .players {
  581. position:absolute;
  582. overflow:scroll;
  583. width:175px;
  584. height:175px;
  585. text-align:left;
  586. vertical-align:middle;
  587. background-color:transparent;
  588. color:#fff;/*billy player color*/
  589. }
  590.  
  591. /* ------------------------------ MBTI CSS --------------------------- */
  592. .mbtipic1 {
  593. z-index:1;
  594. display:inline-block;
  595. overflow:hidden;
  596. width:200px;
  597. height:200px;
  598. text-align:center;
  599. background-color:#acacac;
  600. background-image:url(http://static.tumblr.com/k6zk3b1/YW4ocdx5m/nauxnose.png); /* replace image url with your own */
  601. background-position:center;
  602. background-size:auto 100%;
  603. }
  604.  
  605. .mbtitext {
  606. font-family: 'Oswald', sans-serif;
  607. /*mbti title font*/
  608. font-size:40px;
  609. margin-top:90px;
  610. margin-bottom:25px;
  611. -webkit-transition:ease-in-out .5s;
  612. -moz-transition:ease-in-out .5s;
  613. -o-transition:ease-in-out .5s;
  614. transition:ease-in-out .5s;
  615. text-align:center;
  616. letter-spacing:5px;
  617. color:#fff;
  618. -webkit-filter:blur(2px);
  619. }
  620.  
  621. .mbtihover {
  622. /*css literally for the word "hover" just so people know to hover*/
  623. font-size:8px;
  624. margin-top:-10px;
  625. -webkit-transition:ease-in-out .5s;
  626. -moz-transition:ease-in-out .5s;
  627. -o-transition:ease-in-out .5s;
  628. transition:ease-in-out .5s;
  629. letter-spacing:.5px;
  630. opacity:.5;
  631. color:#fff;
  632. }
  633.  
  634. .mbtipic1:hover .mbtitext {
  635. font-size:13px;
  636. margin-top:40px;
  637. margin-left:20px;
  638. letter-spacing:25px;
  639. -webkit-filter:blur(0px);
  640. }
  641.  
  642. .mbtipic1:hover .mbtihover {
  643. opacity:0;
  644. }
  645.  
  646. /*-----------bar graph. theres no reason to really mess with this-----------*/
  647. .mbtitraits {
  648. font-size:6px;
  649. font-family:calibri,helvetica,arial,sans-serif;
  650. line-height:13px;
  651. top:-30px;
  652. height:100px;
  653. margin-top:-11px;
  654. -webkit-transition:ease-in-out .5s;
  655. -moz-transition:ease-in-out .5s;
  656. -o-transition:ease-in-out .5s;
  657. transition:ease-in-out .5s;
  658. text-align:right;
  659. letter-spacing:1px;
  660. text-transform:uppercase;
  661. opacity:0;
  662. color:#fff;
  663. }
  664.  
  665. .mbtitraits b {
  666. padding-left:3px;
  667. text-decoration:none;
  668. color:#fff;
  669. }
  670.  
  671. .mbtipic1:hover .mbtitraits {
  672. opacity:1;
  673. }
  674.  
  675. .bar {
  676. height:12px;
  677. padding-left:2px;
  678. text-align:left;
  679. }
  680.  
  681. .barsblock {
  682. display:inline-block;
  683. float:right;
  684. width:100px;
  685. margin-right:15px;
  686. }
  687.  
  688. .bars {
  689. font-size:8px;
  690. width:90px;
  691. height:12px;
  692. margin:3px;
  693. -webkit-transition:ease-in-out .5s;
  694. -moz-transition:ease-in-out .5s;
  695. transition:ease-in-out .5s;
  696. letter-spacing:1px;
  697. text-transform:uppercase;
  698. opacity:0;
  699. color:#f5f5f5;
  700. background-color:rgba(255,255,255,.3);
  701. }
  702.  
  703. .mbtipic1:hover .bars {
  704. z-index:99999;
  705. opacity:1;
  706. }
  707.  
  708. /*----------------------strengths and weaknesses----------------------*/
  709. .strengthsweaknesses {
  710. float:right;
  711. width:270px;
  712. margin-top:10px;
  713. padding-left:25px;
  714. }
  715.  
  716. .swlist {
  717. font-size:10px;
  718. line-height:10px;
  719. display:inline-block;
  720. overflow:auto;
  721. overflow-x:hidden;
  722. width:120px;
  723. height:100px;
  724. padding-top:10px;
  725. text-align:center;
  726. text-transform:uppercase;
  727. background-color:transparent;
  728. }
  729.  
  730. .swlist b,bold,strong {
  731. font-family: 'Oswald', sans-serif;/*header font*/
  732. text-decoration:underline;
  733. letter-spacing:0px;
  734. }
  735.  
  736. .swhorizontalbar { /*white strip behind strengths and weaknesses*/
  737. float:right;
  738. width:300px;
  739. height:100px;
  740. margin-bottom:-110px;
  741. background-color:#fff; /*strip color*/
  742. }
  743.  
  744. .mbtipic2 {
  745. z-index:-999;
  746. float:right;
  747. overflow:hidden;
  748. width:280px;
  749. height:200px;
  750. margin-top:-10px;
  751. margin-bottom:-150px;
  752. background-color:#acacac;
  753. background-image:url(http://static.tumblr.com/k6zk3b1/6PNocdxcd/olddress.png); /*picture behind strengths and weakness*/
  754. background-position:center;
  755. background-size:100% auto;
  756. -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  757. -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  758. box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  759. }
  760.  
  761. /*--------------------- MORAL ALIGNMENT CSS ---------------------*/
  762. .alignmentdesc {
  763. line-height:9px;
  764. float:left;
  765. width:180px;
  766. height:264px;
  767. margin-top:3px;
  768. font-size:10.5px;
  769. padding:10px 10px 0;
  770. text-align:right;
  771. color:#f5f5f5;
  772. background-color:#acacac;
  773. background-image:url(http://static.tumblr.com/k6zk3b1/Lrqocdwxo/minipug.png); /*image behind list of alignment descriptions*/
  774. background-position:center;
  775. background-size:auto 100%;
  776. }
  777.  
  778. #selected {
  779. background-color:#40acd3; /*color of the selected alignment*/
  780. }
  781.  
  782. .alignment {
  783. display:inline-block;
  784. width:279px;
  785. margin-left:17px;
  786. background-color:#acacac;
  787. background-image:url(http://static.tumblr.com/k6zk3b1/jImocdwxr/bigpug.png); /*image behind alignment squares*/
  788. background-position:center;
  789. background-size:100% auto;
  790. }
  791.  
  792. .alignmentblock {
  793. font-size:10px;
  794. line-height:100%;
  795. position:relative;
  796. display:block;
  797. float:left;
  798. width:67px;
  799. height:47px;
  800. padding:10px;
  801. padding-top: 30px;
  802. text-align:center;
  803. text-transform:uppercase;
  804. color:#fff;
  805. border:3px solid #fff;
  806. }
  807.  
  808. .alignmentblock p {
  809. padding:0;
  810. }
  811.  
  812. /* ---------------------------- UPDATES ------------------------------*/
  813.  
  814. #updates {
  815. font-size:10px;
  816. font-family:century gothic, arial;
  817. color:{color:body font};
  818. text-align:center;
  819. height:450px;
  820. width:120px;
  821. padding:0px;
  822. top:100px;
  823. left:45px;
  824. z-index:10;
  825. position:fixed;
  826. overflow-x:hidden;
  827. overflow-y:auto;
  828. }
  829.  
  830. #headerbar{
  831. left:50%;
  832. top:50%;
  833. width:530px; /*– sets width of your text –*/
  834. overflow:scroll;
  835. text-align:justify;
  836. color:#fff;
  837. font-family:calibri;
  838. font-size:12px;
  839. }
  840.  
  841. #tabbar{
  842. left:50%;
  843. top:50%;
  844. width:530px; /*– sets width of your text –*/
  845. height:400px; /*– sets height of your text –*/
  846. overflow: scroll;
  847. text-align:justify;
  848. color:#222;
  849. font-family:calibri;
  850. font-size:12px;
  851. }
  852.  
  853. ul#tabs {text-align: center;}
  854. ul#tabs li { /*– your inactive / not viewed tabs –*/
  855. display:inline-block;
  856. padding:2px;
  857. cursor:pointer;
  858. text-decoration:none;
  859. opacity:1;
  860. color:#3b6e82;
  861. }
  862.  
  863. ul#tabs li.active { /*– your active tab –*/
  864. background-color:#78909d;
  865. color:#fff;
  866. -webkit-transition:
  867. all 0.5s ease-out;
  868. -moz-transition: all 0.5s ease-out;
  869. transition: all 0.5s ease-out;
  870. }
  871.  
  872. ul#tab, ul#tabs{list-style-type:none;margin:0px;padding:0px;}
  873. ul#tab li.active {display: block;}
  874. ul#tab li {display: none;}
  875.  
  876. #rel img {
  877. float:left;
  878. margin:8px 8px 8px 0px;
  879. border:5px solid {color:body font}; /* icon border color */
  880. width:90px;
  881. height:200px;
  882. padding:5px;
  883. -webkit-transition:all 0.3s ease-out;
  884. -moz-transition:all 0.3s ease-out;
  885. transition:all 0.3s ease-out;}
  886.  
  887.  
  888. #rel:hover img {
  889. border:5px solid #fff; /* icon border hover color */
  890. -webkit-transition:all 0.3s ease-out;
  891. -moz-transition:all 0.3s ease-out;
  892. transition:all 0.3s ease-out;}
  893.  
  894. /*--------------------CREDITS-----------------------*/
  895. #cred
  896. {
  897. width: 45px;
  898. height: 18px;
  899. font-family: Arial;
  900. font-size: 7px;
  901. text-transform: uppercase;
  902. text-align: center;
  903. bottom: 10px;
  904. right: 10px;
  905. letter-spacing: 1px;
  906. line-height: 4px;
  907. padding: 10px;
  908. display: block;
  909. color: {color:body font};
  910. position: fixed;
  911. }
  912.  
  913. #cred a
  914. {
  915. font-weight: bold;
  916. padding-left:4px;
  917. line-height: 20px;
  918. font-size: 15px;
  919. font-family: 'Oswald', sans-serif;
  920. color: #000;
  921. letter-spacing: 7px;
  922. }
  923.  
  924. </style>
  925.  
  926. </head>
  927.  
  928.  
  929. <body style="overflow:hidden;">
  930.  
  931. <!-- begin updates tab -->
  932.  
  933. <div id="updates">
  934.  
  935. <div style="padding-top:10px;">
  936.  
  937. <b><p><span style="font-size:16px"><b>❛</b> <a href="/" style="color:white;text-shadow: black 0 0 2px;">SEASIDE SIREN</a> <b>❜</b></span></b><br>
  938. <div class="fancytitle">about</div>
  939. <p><b>mcu/616-based<br> original character</b><br>
  940. pan-fandom<br>
  941. SELECTIVE & PRIVATE</p>
  942.  
  943. <!------------------------- NAVIGATION -------------------------->
  944. <div class="fancytitle">navigation</div><p>
  945. <div id="navigation" style="font-size:11px;">
  946. <a href="/ask" title="ask">✕</a>
  947. <a href="#?w=530" rel="story" class="poplight" title="story">✕</a>
  948. <a href="#?w=400" rel="guide" class="poplight" title="guide">✕</a>
  949. <a href="/verselanding" title="verses">✕</a>
  950. <a href="/tagged/trivia" title="trivia">✕</a>
  951. <a href="/commish" title="commissions">✕</a>
  952. </div></p>
  953. <!------------------------ NAV END ------------------------------>
  954. <div class="fancytitle">further info</div>
  955. <p>est. 20 may 2012<br>
  956. rbt. 11 march 2016<br>
  957. written by <a href="/mun" style="color:white;text-shadow: black 0 0 2px;">CHE</a></span> (21+)<br>
  958. do not steal content
  959. </p>
  960. {block:Pagination}<div class="fancytitle">pagination</div><p>
  961. {block:NextPage}<a href="{NextPage}" style="color:white;text-shadow: black 0 0 2px;">old</a>{/block:NextPage}
  962. {block:PreviousPage}&nbsp;/&nbsp;<a href="{PreviousPage}" style="color:white;text-shadow: black 0 0 2px;">new</a>{/block:PreviousPage}
  963. </p>{/block:Pagination}
  964. <!-------------------------CLOCK--------------------------------->
  965. <div class="fancytitle">stats</div>
  966. <a href="http://time.is/Covina" id="time_is_link" rel="nofollow" style="font-size:10px">Local Time:</a>
  967. <span id="Covina_z14e" style="font-size:10px"></span>
  968. <script src="http://widget.time.is/t.js"></script>
  969. <script>
  970. time_is_widget.init({Covina_z14e:{}});
  971. </script><br>
  972. <!---------------------STATS COUNTER--------------------------->
  973. <script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5361668";
  974. var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;
  975. fhs.src = "//s1.freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=mate&e2=mates&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";
  976. document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"'></span>");
  977. </script> | <script language="JavaScript">var fhsh = document.createElement('script');var fhs_id_h = "3175815";
  978. fhsh.src = "//s1.freehostedscripts.net/ocount.php?site="+fhs_id_h+"&name=swabbed&a=1";
  979. document.head.appendChild(fhsh);document.write("<span id='h_"+fhs_id_h+"'></span>");
  980. </script><br>
  981. <form action="/search" method="get" class="sfm" name="theform">
  982. <input type="text" name="q" value="SEARCH" style="height:12px;font-size:10px;text-transform:uppercase;border:1px solid white;"/>
  983. </form>
  984.  
  985.  
  986.  
  987.  
  988. </div></div>
  989.  
  990. <!-- end updates tab -->
  991.  
  992. </div>
  993.  
  994. <div id="container">
  995. {block:Posts}
  996.  
  997. <!--------------------------TYPES OF POSTS----------------------------->
  998. <div id="post">
  999.  
  1000. {block:Photo}
  1001. <img src="{PhotoURL-400}" />
  1002. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1003. {/block:Photo}
  1004.  
  1005. {block:Photoset}
  1006. {Photoset-400}
  1007. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1008. {/block:Photoset}
  1009.  
  1010. {block:Video}
  1011. {Video-400}
  1012. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1013. {/block:Video}
  1014.  
  1015. {block:Audio}
  1016. <div class="musicbox">
  1017. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  1018. <div style="background-color:rgba(255,255,255,0.5);height:100px;padding:5px;">{block:TrackName}<div class="text" style="color:{color:Accent};"><strong>{TrackName}</strong></div>{/block:TrackName}<br/>
  1019. {block:Artist}<div class="text" style="margin-top:-17px;"><strong>Artist:&nbsp;</strong>{Artist}</div>{/block:Artist}<br/>
  1020. {block:Album}<div class="text" style="margin-top:-17px;"><strong>Album:&nbsp;</strong>{Album}</div>{/block:Album}<br/>
  1021. <div class="text" style="margin-top:-17px;">{PlayCountWithLabel}</div></div></div>
  1022. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1023. {/block:Audio}
  1024.  
  1025. {block:Quote}
  1026. <div class="title" style="width:380px;text-align:justify;padding-top:10px;">{Quote}</div>
  1027. {block:Source}<div class="text" style="text-align:right;padding-right:50px;"><br/>&mdash;{Source}</div>{/block:Source}
  1028. {/block:Quote}
  1029.  
  1030. {block:Text}
  1031. {block:Title}<div class="title" style="padding-top:10px;">{Title}<br/></div>{/block:Title}
  1032. <div class="text">{Body}</div>
  1033. {/block:Text}
  1034.  
  1035. {block:Answer}<div id="ask">
  1036. <div style="background-color:{color:accent2};color:white; padding:10px 10px 10px 10px;"><div class="title" style="font-size:12px;padding-top:10px;">{Question}<br/></div>
  1037. <div class="text" style="text-align:right;color:white;text-decoration:underline:">&mdash;<span style="color:white">{Asker}</span><br/></div></div></div>
  1038. <div class="text" style="width:500px;">{Answer}</div>
  1039. {/block:Answer}
  1040.  
  1041. {block:Chat}
  1042. {block:Title}<div class="title" style="padding-top:10px;">{Title}<br/></div>{/block:Title}
  1043. {block:Lines}<div class="chat"><li class="line_{Alt}">
  1044. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}</li></div>
  1045. {/block:Lines}
  1046. {/block:Chat}
  1047.  
  1048. {block:Link}
  1049. <div class="title" style="padding-top:10px;"><a href="{URL}">{Name}</a></div>
  1050. {block:Description}<div class="text">{Description}</div>{/block:Description}
  1051. {/block:Link}
  1052.  
  1053. </div>
  1054. <!---------------------PERMALINK + REBLOG STUFF---------------------->
  1055. <div id="permalink">{block:Date}<a href="{Permalink}">{DayOFMonthWithZero} {ShortMonth}</a>&nbsp;&nbsp;{/block:Date}{block:NoteCount}<a href="{Permalink}">{NoteCount}♥</a>&nbsp;&nbsp;{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}{block:ContentSource}&nbsp;&nbsp;<a href="{SourceURL}" title="{SourceName}">©</a>{/block:ContentSource}<a href="{ReblogURL}" target="_blank" class="details">&nbsp;&nbsp;reblog</a></div>
  1056.  
  1057. <!----------------------------TAG STUFF----------------------------->
  1058. <div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  1059.  
  1060. {block:PostNotes}
  1061. <div id="notesbox">{PostNotes}</div>
  1062. {/block:PostNotes}
  1063. {/block:Posts}
  1064. </div></div>
  1065.  
  1066. <iframe scrolling="no" width="1" height="1" frameborder="0" style="background-color:transparent; overflow:hidden; position:absolute; top:0; left:0; z-index:9999;" id="ga_target"></iframe>
  1067.  
  1068. </body>
  1069.  
  1070. <!-------HERE BEGIN THE POPUP BOXES------->
  1071.  
  1072. <div id="ask" class="popup_block2" style="overflow:auto;background:white;height:260px;">
  1073.  
  1074. <table>
  1075. <tr><td>
  1076. <iframe frameborder="0" scrolling="yes" width="340" height="150" src="https://www.tumblr.com/ask_form/chrononautica.tumblr.com" style="background-color:transparent; overflow:auto; display:block; float:left;" id="ask_form"></iframe>
  1077. </td></tr>
  1078. </table>
  1079. </div>
  1080.  
  1081. <div id="submit" class="popup_block" style="overflow:auto;">
  1082.  
  1083. <table>
  1084. <tr><td>
  1085. <iframe frameborder="0" scrolling="yes" width="340" height="250" src="https://www.tumblr.com/submit_form/chrononautica.tumblr.com" style="background-color:transparent; overflow:auto; display: block; float:right; margin-left:20px;" id="submit_form"></iframe>
  1086. </td></tr>
  1087. </table>
  1088. </div>
  1089.  
  1090. <div id="story" class="popup_block2" style="margin:0px auto; padding:10px 30px;font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font}">
  1091.  
  1092. <div id="headerbar">
  1093. <ul id="tabs">
  1094. <li class="active">stats</li>
  1095. <li>story</li>
  1096. <li>power</li>
  1097. </ul></div>
  1098. <div id="tabbar">
  1099. <div id="boxydos">
  1100. <div class="container" style="color:#000;">
  1101. <ul id="tab">
  1102.  
  1103. <li class="active" style="color:{color:body font};">
  1104. <div class="header2"><span>OVERVIEW</span></div>
  1105. <div class="content">
  1106. <div align="center"><div style="width:400px; text-align: justify;font-size:11.5px;">
  1107. <b>name:</b> Una Victoria Genevieve Naux<br>
  1108. <b>nickname:</b> Tuna, Captain<br>
  1109. <b>super identity:</b> Chrononautica (formerly Leap Year)<br>
  1110. <b>birthday:</b> 19 Feb (22 years old)<br>
  1111. <b>ethnicity:</b> Caucasian (English+Irish blood)<br>
  1112. <b>orientation:</b> Heteroflexible.<br>
  1113. <b>languages:</b> English, French, Latin. Minor German.<br>
  1114. <b>place of birth:</b> Hartlepool, North East England.<br>
  1115. <b>living conditions:</b> Brooklyn apartment. <br>
  1116. <b>occupation:</b> Bookseller, occasional dominatrix.<br><br>
  1117. <center><b>relationships</b></center>
  1118. <b>parents:</b> Barnaby Reginald Naux, father. Adelaide Stark, mother.<br>
  1119. <b>descendants:</b> Henry Hollick, from an illegitimate child of Barnaby.<br>
  1120. <b>children:</b> Onion, a pug.<br><br>
  1121. <center><b>physical</b></center>
  1122. <b>eyes:</b> Pale grey-blue; colour of cataracts. Piercing stare.<br>
  1123. <b>hair:</b> Dark brown. Wavy. Exceptionally full. Top half tied back.<br>
  1124. <b>height:</b> Around 5'5" in heels, or 5'2" barefoot.<br>
  1125. <b>weight:</b> 100 pounds, give or take<br>
  1126. <b>build:</b> Scrawny, leggy, flat-chested. Not very imposing. Moderate muscle tone. High cheekbones, jutting chin. Weight carried mainly in thighs and rear—possibly her best asset. Callused hands. Freckled nose.<br>
  1127. <b>notable physical traits:</b> Gapped buck teeth.<br><br>
  1128. <center><b>core</b></center>
  1129. <b>intelligence:</b> Book-smart. Sharp mind for business/negotiation.<br>
  1130. <b>likes:</b> Sweaters, cheap perfume, books, horror films, skating, dolls.<br>
  1131. <b>dislikes:</b> Pants, ants, divination, overly sweet foods, conspiracy theories.<br>
  1132. <b>disposition:</b> Headstrong, self-sufficient, amicable, curious, helpful, mistrustful, selfish, arrogant, reliable.<br><br>
  1133. <center><b>other</b></center>
  1134. <b>phobias:</b> Heights, drowning, being completely alone.<br>
  1135. <b>allergies:</b> Mushrooms.<br>
  1136. <b>abilities:</b> Time travel (including "teleportation").<br>
  1137. <b>strengths:</b> Running, fitting in small spaces, holding breath, origami, being nosy, resourcefulness.<br>
  1138. <b>weaknesses:</b> Cooking, climbing, empathizing, children. Tends to be too mouthy for her own good. Terrible at archery or any other long-distance weapon/sport.<br>
  1139. <b>extras:</b> Most valuable item is her mobile phone. Favourite food is steak. Uses reading glasses.</div></div></div>
  1140.  
  1141. <!-------------------QUOTE/PLAYLIST SECTION BEGINS HERE------------------->
  1142.  
  1143.  
  1144. <div class="header2"><span>WORDS</span></div>
  1145. <div class="content">
  1146.  
  1147. <div class="quotebox">
  1148. <div class="quote" style="margin-top:-10px;"><br>
  1149. <p>
  1150. ❝ Why do you think the old stories tell of men who set out on great journeys to impress the gods? Because trying to impress people just isn't worth the time and effort. ❞
  1151. </div>
  1152. </div>
  1153.  
  1154. <div class="musicbox">
  1155. <div class="quote">
  1156. <p>
  1157. ❝ If you want to build a ship, don't drum up people to collect wood and don't assign them tasks and work, but rather teach them to long for the endless immensity of the sea. ❞
  1158. </div>
  1159. </div>
  1160.  
  1161. </div>
  1162.  
  1163. <!-------------------QUOTE/PLAYLIST SECTION ENDS HERE------------------->
  1164. <!-----------------------MORAL ALIGNMENT STARTS HERE----------------------->
  1165.  
  1166. <div class="header2"><span>MORAL ALIGNMENT</span></div>
  1167.  
  1168. <div class="content">
  1169.  
  1170. <div class="alignmentdesc">
  1171.  
  1172. <!--lawful good-->combines honor and compassion;<p>
  1173. <!--neutral good-->doing what is good without bias for or against order;<p>
  1174. <!--chotic good-->combines a good heart with a free spirit;<p>
  1175. <!--lawful neutral--><div id="selected">reliable and honorable without being a zealot;<p></div>
  1176. <!--true neutral-->act naturally, without prejudice or compulsion;<p>
  1177. <!--chaotic nautral-->represents true freedom from society’s restricitons and a do-gooders zeal;<p>
  1178. <!--lawful evil-->represents methodical, intentional, and frequently sucessful evil;<p>
  1179. <!--neutral evil-->represents pure evil without honor and without variation;<p>
  1180. <!--chaotic evil-->destruction not only of beauty and life but also of the order on which beauty and life depend.</div> <!--end alignmentdesc--->
  1181.  
  1182. <div class="alignment">
  1183. <div class="alignmentblock">LAWFUL GOOD<p>"the crusader"</div>
  1184. <div class="alignmentblock">NEUTRAL GOOD <p>"the benefactor"</div>
  1185. <div class="alignmentblock">CHAOTIC GOOD <p>"the rebel"</div>
  1186. <div class="alignmentblock" id="selected">LAWFUL NEUTRAL <p>"the judge"</div>
  1187. <div class="alignmentblock">TRUE NEUTRAL <p>"the undecided" </div>
  1188. <div class="alignmentblock">CHAOTIC NEUTRAL <p>"the free spirit"</div>
  1189. <div class="alignmentblock">LAWFUL EVIL <p>"the dominator"</div>
  1190. <div class="alignmentblock">NEUTRAL EVIL <p>"the malefactor</div>
  1191. <div class="alignmentblock">CHAOTIC EVIL <p>"the destroyer"</div>
  1192. </div>
  1193.  
  1194.  
  1195.  
  1196. </div><!---end content--->
  1197.  
  1198.  
  1199. <!--------------------MORAL ALIGNMENT ENDS HERE-------------------->
  1200. <!----------------------------MBTI BEGINS HERE---------------------------->
  1201.  
  1202. <div class="header2"><span>MYERS-BRIGGS TYPE INDICATOR</span></div>
  1203.  
  1204. <div class="content">
  1205.  
  1206. <div class="mbtipic1">
  1207. <div class="mbtitext"> ENTJ </div>
  1208. <div class="mbtihover"> [ HOVER ] </div>
  1209.  
  1210. <!---make sure the percentages on each line match -->
  1211.  
  1212. <div class="barsblock">
  1213. <div class="bars">
  1214. <div class="bar" style="background-color: #359dca; width: 81%;">81%</div></div>
  1215. <div class="bars">
  1216. <div class="bar" style="background-color: #6bd1ec; width: 63%;">63%</div></div>
  1217. <div class="bars">
  1218. <div class="bar" style="background-color: #98f1f7; width:75%;">75%</div></div>
  1219. <div class="bars">
  1220. <div class="bar" style="background-color: #63c4dc; width: 59%;">59%</div></div>
  1221. </div>
  1222. <!---make sure not to remove the <b></b> from around each word when editing-->
  1223.  
  1224. <div class="mbtitraits" style="font-size:4px;">
  1225. <br><b>EXTROVERT</b>
  1226. <br><b>INTUITIVE</b>
  1227. <br><b>THINKING</b>
  1228. <br><b>JUDGING</b>
  1229. </div>
  1230.  
  1231. </div><!--end mbti pic-->
  1232.  
  1233.  
  1234. <div class="strengthsweaknesses">
  1235.  
  1236. <div class="mbtipic2"></div>
  1237. <div class="swhorizontalbar"></div>
  1238.  
  1239. <div class="swlist" style="margin-top:-9px;">
  1240. <br><b>ENTJ STRENGTHS</b> <br><br>
  1241. EFFICIENT<br>
  1242. ENERGETIC<br>
  1243. SELF-CONFIDENT<br>
  1244. STRONG-WILLED<br>
  1245. STRATEGIC THINKER<br>
  1246. CHARISMATIC & INSPIRING<br>
  1247. </div>
  1248.  
  1249. <div class="swlist" style="margin-top:-9px;">
  1250. <br><b>ENTJ WEAKNESSES</b> <br><br>
  1251. STUBBORN & DOMINANT<br>
  1252. INTOLERANT<br>
  1253. IMPATIENT<br>
  1254. ARROGANT<br>
  1255. CANNOT HANDLE EMOTIONS<br>
  1256. COLD & RUTHLESS
  1257.  
  1258. </div><!---endswlist--->
  1259. </div><!---end strengthsweaknesses-->
  1260. </div><!---end content--->
  1261.  
  1262. <!------------------------------MBTI ENDS HERE------------------------------>
  1263. </li>
  1264.  
  1265. <li style="color:{color:body font};">
  1266. <div id="about" class="header2"><span>BRIEF HISTORY</span></div>
  1267. <div class="content">
  1268.  
  1269. <div align="center"><div style="width:450px; text-align: justify">
  1270. <p>&nbsp; &nbsp; &nbsp; &nbsp;In 1734, Una was born to the most estimable Captain Barnaby Reginald Naux, and his lovely wife, Adelaide. However, Una never knew her mother, as she died in childbirth. As a result, Una was happily raised on her father's ship by him and his crew. She gained the mannerisms of older men and would have been quite the tomboy if only society didn't require her to be an upstanding young lady. In any case, she lived the relatively normal life of a merchant at sea, traveling around the world while shipping items from point A to point B.</p>
  1271.  
  1272. <p>&nbsp; &nbsp; &nbsp; &nbsp;In 1752, there was a terrible storm that rocked their ship, the Amaranthe. There may have been a sea monster involved as well—she can't remember the details of the event too well. Either way, she and a few other men were thrown overboard by the boat's precarious motions. As far as the rest of the ship is aware, they all drowned. As far as she's aware, she time traveled to the year 2012.</p>
  1273.  
  1274. <p>&nbsp; &nbsp; &nbsp; &nbsp;Now, a few years after the terrible occurrence, Una has carved a modest life for herself. With a steady income and good friends, she's adapting quickly to the modern world, though much of it still remains a mystery to her. As far as her abilities go, she's gotten more of a handle on them, and uses them every now and then to assist others&mdash;for profit.
  1275.  
  1276. <p>&nbsp; &nbsp; &nbsp; &nbsp;Due to a run-in with a certain <a href="http://duckpi.tumblr.com/" style="color:{color:body font};text-decoration:underline;">cigar-chomping duck</a>, Una has been made aware of the Nexus of All Realities, and is under the impression that it could take her back to ther own time. After hearing rumors and stories regarding the other fallen shipmates, her current goal is to find them and remake her makeshift family...and possibly send all of them back home to the past.</p>
  1277.  
  1278. <p>&nbsp; &nbsp; &nbsp; &nbsp;In the meantime, she runs a small bookstore called <b>Books & Baubles</b>. Although the literature is the main attraction, the &ldquo;baubles&rdquo; in question are a variety of other services on the sly, including acts of heroism as well as occasional dominatrixing. Sometimes she sells antiques and magical paraphernalia. Whatever is on this &ldquo;secret menu&rdquo; is constantly changing depending on whims and availability. To the average person who doesn't bother to inquire about it, Books & Baubles is just another independent bookstore. She lives in a small apartment just above her business.</div></div></div>
  1279.  
  1280. </li>
  1281.  
  1282. <li style="color:{color:body font};">
  1283. <div id="about" class="header2"><span>TIME HOPPING</span></div>
  1284. <div align="center"><div style="width:450px; text-align: justify">
  1285. <center>Time can be seen as a circuit, but it’s actually far more linear.</center>
  1286.  
  1287. <p>&nbsp; &nbsp; &nbsp; &nbsp;Everything that has happened, is happening, and will ever happen…has already happened. What you yourself are able to perceive depends on when you were born.
  1288.  
  1289. <p>&nbsp; &nbsp; &nbsp; &nbsp;Each person exists as a point on this timeline. When they die or are otherwise removed from their point in history, they come back as a different point on the timeline. It might be as an astrophysicist in the future, but there is just as equal a chance someone could come back as a flower in ancient Greece. Time doesn’t play favourites; it isn’t bound to a single species or era.
  1290.  
  1291. <p>&nbsp; &nbsp; &nbsp; &nbsp;Effectively, everyone is running a very long race. At some point, each runner is going to be picked up and given a boost toward the finish line or made to begin again closer to the starting point. People who have traveled through time have just gotten tangled up in the strings of the universe before they were supposed to.
  1292.  
  1293. <p>&nbsp; &nbsp; &nbsp; &nbsp;Though time travel is rare, it happens most often when someone is on the brink of death. Because it is [nearly] time for them to move on to another point on the timeline, they fall into a wrinkle in time and are taken to a new area. Because they have not actually died, however, they do not get to reincarnate. Instead, they are stranded wherever the universe has seen fit to place them, their body and the majority of their memories still intact. No new life for them, but an enormous amount of confusion.
  1294.  
  1295. <p>&nbsp; &nbsp; &nbsp; &nbsp;Una is able to travel through time and space by jumping: whenever she is in midair, she leaves this plane. Because she still hasn't mastered her powers, the length of her leap is directly proportional to the amount of time traveled—a tiny hop might be a few minutes, while falling from the top of a skyscraper might be a few decades. In this way, she is able to achieve a crude form of teleportation by transporting herself (and anyone she's holding) milliseconds into the past or future. </div>
  1296.  
  1297. </li>
  1298.  
  1299. </ul> <!--- important. don’t delete --->
  1300. </div></div></div></div></div></div></div></div>
  1301.  
  1302. <div id="guide" class="popup_block" style="margin:0px auto; padding:10px 30px; background:#FCFBF8;font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font}">
  1303.  
  1304. <h1 style="text-align:center; background:{color:body font};color:white;letter-spacing:2px;padding-top:5px;height:20px;font-size:20px;">GUIDELINES</h1>
  1305.  
  1306. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>I’m going to keep this simple and assume you know how these things work. No godmodding, try your best to use proper grammar, etc. I’m not a stickler for length, but at least give me enough to work with. If I give you a few paragraphs, don’t leave me with two sentences. That’s not cool.
  1307.  
  1308. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>As a heads up, I’m just going to put it out there that I’m less inclined to roleplay with people who write in purple prose. Nothing personal, but I don’t care for diction/syntax muddling clarity.
  1309. Una is currently single in all verses. She is allowed to take one lover per verse. However, shipping is not my main focus…but I’m still more than willing to give a ship a try. It just needs buildup and it needs to make sense. Nothing instant over here.
  1310.  
  1311. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>Obligatory warning: Mun and muse are of age. Anything NSFW of a sexual nature is probably going to be uncommon, though violence, alcohol, drugs, etc. may appear (depending on who I'm writing with). Don’t worry, I’ll make sure things are tagged.
  1312.  
  1313. <p style="letter-spacing:2px;text-align:center;"><b><u>LAST NOTES</u></b></p>
  1314.  
  1315. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>Given the nature of Una's history, she may make comments that are not considered politically correct in this modern era. Please be aware that these are not the beliefs of me, but of my character.
  1316. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>I don’t always follow back–I like a clean dash, so if you post a lot of images/OOC in a short time, I probably won’t follow unless I really like you. If we’re mutuals, you can tag me in a post at any time. If we aren’t, you can still try tagging me in something, but I might not stick with it for very long.
  1317.  
  1318. </div>
  1319. </div></div></div></div></div></div></div></div></div>
  1320.  
  1321. <div id="verses" class="popup_block2" style="margin:0px auto; padding:10px 30px;font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font};">
  1322. <div id="headerbar">
  1323. <ul id="tabs">
  1324. <li class="active">main</li>
  1325. <li>normal</li>
  1326. <li>mad max</li>
  1327. <li>mortal instruments</li>
  1328. <li>fantasy</li>
  1329. <li>star wars</li>
  1330. </ul></div>
  1331. <div id="tabbar">
  1332. <div id="boxydos">
  1333. <div class="container" style="color:#000;">
  1334. <ul id="tab">
  1335.  
  1336. <li class="active" style="color:{color:body font};">
  1337. <div class="header2"><span>CHRONONAUTICA</span></div>
  1338. <div class="content">
  1339. <div id="rel"><a href="/tagged/||chrononautica"><img src="http://static.tumblr.com/k6zk3b1/xq5oce1j6/versemain.png" /></a></div>
  1340. &nbsp; &nbsp; &nbsp; &nbsp;Una Naux is a time traveler from the 18th century trying to make her way in the modern era. She doesn't know where she's headed or what the world has in store for her, but if there's one thing she knows, it's how to survive. She mainly bets on horses and performs occasional time travel favors for extra money, but has alternative forms of income in the wares and services available at her shop, <b>Books & Baubles</b>.
  1341. <p>&nbsp; &nbsp; &nbsp; &nbsp;During the last few years spent in the 21st century, she has run into a young man, Henry Hollick, who is descended from an illegitimate child of her father, Barnaby. They've grown rather close, or as close as time-displaced relatives can be, but he's not enough for Una to consider a &ldquo;family.&rdquo; She still plans on locating the other crew members that fell through time&mdash;if they really are stranded&mdash;and taking them with her through the Nexus of All Realities.
  1342. <p>The thing she likes best about the 21st century is the fact that she's able to command so much more respect than she did in her home time. Of course, part of that may be due to the fact that she does a shoddy job of separating her life as <b>Chrononautica</b> from her life as Una Naux. Her civilian identity really isn't too big a secret if you know who to ask, which is why she makes daring acts of good (or evil, depending on how well it pays) a premium service available at her shop. She doesn't do much patrolling; she waits for people to come to her. They always do, in the end.
  1343. </div>
  1344.  
  1345.  
  1346. </li>
  1347.  
  1348. <li style="color:{color:body font};">
  1349. <div id="about" class="header2"><span>NEXT TO NORMAL</span></div>
  1350. <div class="content">
  1351. <div id="rel"><a href="/tagged/||next to normal"><img src="http://static.tumblr.com/k6zk3b1/9Bkoce207/versenormal.png" /></a></div>
  1352. <p>&nbsp; &nbsp; &nbsp; &nbsp;Time travel is the stuff of fantasy. Una would know: she's writing a novel about it. This Englishwoman is prone to flights of fancy and tends to have her head in the clouds when it's not trapped in a book. The same goes for her half-brother, Henry Hollick, five years younger. After the passing of Adelaide, Barnaby was known to fraternize with various women. It's possible that Una has other siblings, but none that she knows about.</p>
  1353.  
  1354. <p>&nbsp; &nbsp; &nbsp; &nbsp;Strange as it may be, Una has a bit of an obsession with completing her family tree. Part of the reason for this may be because her father is the only full-blooded kin she's ever known. The two of them get along wonderfully, but Una can't help wondering what it would be like to have a larger family.</p>
  1355.  
  1356. <p>&nbsp; &nbsp; &nbsp; &nbsp;Once she completed her university education, Una moved from England to the United States, following in the footsteps of Henry, who moved with his family when he was fourteen. Currently, she lives in Brooklyn and works multiple odd jobs to pay the rent as she writes her novel. Barnaby is proud of his daughter, believing her to be an enterprising young woman, but he wouldn't be too happy if he knew she was moonlighting as a dominatrix.</div>
  1357.  
  1358. </li>
  1359.  
  1360. <li style="color:{color:body font};">
  1361. <div id="about" class="header2"><span>TEENAGE WASTELAND</span></div>
  1362. <div id="rel"><a href="/tagged/||teenage wasteland"><img src="http://static.tumblr.com/k6zk3b1/cYsoce35v/versemmfr.png" /></a></div>
  1363. <p>&nbsp; &nbsp; &nbsp; &nbsp;In a sandstorm, seventeen year old Una was separated from her father and his band of merchants. Headstrong and resilient, she is determined to find them again. If they live, they'll live together happily. If they're gone, she'll give them a proper burial.</p>
  1364.  
  1365. <p>&nbsp; &nbsp; &nbsp; &nbsp;While not outright &ldquo;mad,&rdquo; Una has her own neurotic tendencies. Ridiculously attached to a dagger from her father, she'll bite the hand of anyone who dares touch it. That, and she has a proclivity toward poetic speech&mdash;when she bothers to talk at all. Most people, it would seem, are a waste of time. They don't factor into her journey or goal and so she pays them as little mind as she can. Things are easier that way.</p>
  1366.  
  1367. <p>&nbsp; &nbsp; &nbsp; &nbsp;Una knows she can't last long on her own, however, and so she tends to band together with anyone she comes across as long as they seem halfway trustworthy. Knowing it's only temporary and that they can't replace her <em>real</em> family helps make the shame of relying on others less severe. After all, as her father taught her, to succumb to the will of others is weakness. So, she does what is necessary to reach him again. Nothing more, nothing less.</div>
  1368.  
  1369. </li>
  1370.  
  1371. <li style="color:{color:body font};">
  1372. <div id="about" class="header2"><span>BETTER IN BLACK</span></div>
  1373. <div id="rel"><a href="/tagged/||better in black"><img src="http://static.tumblr.com/k6zk3b1/cYsoce35v/versemmfr.png" /></a></div>
  1374. <p>&nbsp; &nbsp; &nbsp; &nbsp;England-born Una Fairwater is a shadowhunter educated by the London Institute. Her parabatai is family friend and long time companion, Jack Roseway. As they recently came of age, the two of them are currently undergoing the customary travel to various Institutes, studying Nephilim culture in other parts of the globe.</p>
  1375.  
  1376. <p>&nbsp; &nbsp; &nbsp; &nbsp;Una's weapon of choice is a whip, passed on to her from her father, Barnaby. She has a younger half-brother, Henry, who is also studying at the London Institute. She has half a mind to give him her whip when it's time for her to evolve to a new weapon. After all, he may not be <em>completely</em> blood-related, but he's family all the same, and for the Fairwaters, family is paramount.</p>
  1377.  
  1378. <p>&nbsp; &nbsp; &nbsp; &nbsp;The life of a shadowhunter is a difficult one when one has a certain interest in modern pop culture. It's one thing to study novels from all sorts of time periods; it's another when one wants to keep up with the Kardashians. </div>
  1379. </li>
  1380.  
  1381. </ul> <!--- important. don’t delete --->
  1382. </div></div></div></div></div></div></div></div>
  1383.  
  1384. <div id="guide" class="popup_block" style="margin:0px auto; padding:10px 30px; background:#FCFBF8;font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font}">
  1385.  
  1386. <h1 style="text-align:center; background:{color:body font};color:white;letter-spacing:2px;padding-top:5px;height:20px;font-size:20px;">GUIDELINES</h1>
  1387.  
  1388. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>I’m going to keep this simple and assume you know how these things work. No godmodding, try your best to use proper grammar, etc. I’m not a stickler for length, but at least give me enough to work with. If I give you a few paragraphs, don’t leave me with two sentences. That’s not cool.
  1389.  
  1390. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>As a heads up, I’m just going to put it out there that I’m less inclined to roleplay with people who write in purple prose. Nothing personal, but I don’t care for diction/syntax muddling clarity.
  1391. Una is currently single in all verses. She is allowed to take one lover per verse. However, shipping is not my main focus…but I’m still more than willing to give a ship a try. It just needs buildup and it needs to make sense. Nothing instant over here.
  1392.  
  1393. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>Obligatory warning: Mun and muse are of age. Anything NSFW of a sexual nature is probably going to be uncommon, though violence, alcohol, drugs, etc. may appear (depending on who I'm writing with). Don’t worry, I’ll make sure things are tagged.
  1394.  
  1395. <p style="letter-spacing:2px;text-align:center;"><b><u>LAST NOTES</u></b></p>
  1396.  
  1397. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>Given the nature of Una's history, she may make comments that are not considered politically correct in this modern era. Please be aware that these are not the beliefs of me, but of my character.
  1398. <p style="font-family:calibri,helvetica,arial,sans-serif;"><small>I don’t always follow back–I like a clean dash, so if you post a lot of images/OOC in a short time, I probably won’t follow unless I really like you. If we’re mutuals, you can tag me in a post at any time. If we aren’t, you can still try tagging me in something, but I might not stick with it for very long.
  1399.  
  1400. </div>
  1401. </div></div></div></div></div></div>
  1402. <div id="cred">theme by<br><a href="#?w=300" rel="credit" class="poplight" title="credit">CHE</a></div>
  1403.  
  1404. <div id="credit" class="popup_block" style="margin:0px auto; padding:10px 30px; background:#FCFBF8;font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font}; width:300px;height:120px;">
  1405.  
  1406. <div class="fancytitle">credit</div>
  1407.  
  1408. <p style="font-family:calibri,helvetica,arial,sans-serif;text-align:center;"><small>theme coded by <b>me</b><br>
  1409. with the assistance of <a href="http://octomoosey.tumblr.com/"><b>octomoosey</b></a><br>
  1410. pop-ups by <a href="http://str-wrs.tumblr.com/"><b>str-wrs</b></a><br>
  1411. and bio page by <a href="http://hailthehelpful.tumblr.com/"><b>hailthehelpful</b></a>
  1412.  
  1413. </div>
  1414. </div></div></div></div></div></div>
  1415. </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!