Advertisement
tsiappoworks

i borked it ALL

Aug 6th, 2016
138
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 47.92 KB | None | 0 0
  1. <!-----THEME MADE BY uminojo SPECIFICALLY FOR mrlovethief.
  2. DO NOT STEAL OR COPY THIS CODE IN ANY CAPACITY,
  3. except for the parts obvs not my own. THANKS.----->
  4.  
  5. <!DOCTYPE html>
  6. <html>
  7.  
  8. <!-----------------------------TOOLTIPS------------------------------->
  9. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  10. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  11. <script>
  12. (function($){
  13.  
  14. $(document).ready(function(){
  15.  
  16. $("a[title]").style_my_tooltips({
  17.  
  18. tip_follows_cursor:true,
  19.  
  20. tip_delay_time:0,
  21.  
  22. tip_fade_speed:0,
  23.  
  24. attribute:"title"
  25.  
  26. });
  27.  
  28. });
  29.  
  30. })(jQuery);
  31. </script>
  32.  
  33. <!----------------------POPUP_BLOCK SCRIPT BELOW-------------------------->
  34. <script type="text/javascript"
  35. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  36. <script>
  37. $(document).ready(function() {
  38. //
  39. $('a.poplight[href^=#]').click(function() {
  40. var popID = $(this).attr('rel'); //Get Popup Name
  41. var popURL = $(this).attr('href'); //Get Popup href to define size
  42. var query= popURL.split('?');
  43. var dim= query[1].split('&');
  44. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  45. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  46. var popMargTop = ($('#' + popID).height() + 80) / 2;
  47. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  48. //Apply Margin to Popup
  49. $('#' + popID).css({
  50. 'margin-top' : -popMargTop,
  51. 'margin-left' : -popMargLeft
  52. });
  53. $('body').append('<div id="fade"></div>');
  54. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  55. return false;
  56. });
  57. $('a.close, #fade').live('click', function() {
  58. $('#fade , .popup_block').fadeOut(function() {
  59. $('#fade, a.close').remove(); //fade them both out
  60. });
  61. return false;
  62. });
  63. });
  64. </script>
  65. <!-------------------- VERSES SCRIPT BELOW -------------------->
  66. <script src="http://static.tumblr.com/dxh5xq2/v6Gn8ju1e/tabs.js"></script>
  67.  
  68. <head>
  69.  
  70. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  71. <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
  72. <link href='http://fonts.googleapis.com/css?family=Nothing+You+Could+Do' rel='stylesheet' type='text/css'>
  73.  
  74. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  75. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  76. <link rel="shortcut icon" href="" />
  77.  
  78. <meta name="color:Accent" content="#d1d1d1" />
  79. <meta name="color:Accent2" content="#2d5e73" />
  80. <meta name="color:Accent3" content="#FAFAFA" />
  81. <meta name="color:body font" content="#447373" />
  82. <meta name="color:Page BG" content="#a5b79d" />
  83. <meta name="color:ask bg" content="#FAFAFA" />
  84.  
  85. <meta name="text:LinkSymbol" content="✕" />
  86. <link rel="shortcut icon" href="">
  87.  
  88. <style type="text/css">
  89. /*---------------------BODY--------------------*/
  90. ::-webkit-scrollbar-thumb:vertical {
  91. background-color:transparent;
  92. height:7px;}
  93. ::-webkit-scrollbar {
  94. background-color:transparent;
  95. height:7px;
  96. width:5px;}
  97.  
  98. html {
  99. background: url('http://static.tumblr.com/xozato3/CtYobcq4o/sorabeej.png') no-repeat top left fixed;
  100. background-color:{color:Page BG};
  101. }
  102.  
  103. hr {
  104. border: 0;
  105. height: 1px;
  106. background-image: linear-gradient(to right, rgba(55, 62, 33, 0), rgba(55, 62, 33, 0.75), rgba(55, 62, 33, 0));
  107. }
  108.  
  109. body {
  110. margin: 0;
  111. word-wrap: break-word;
  112. color:Calibri, helvetica, arial, sans-serif;
  113. }
  114.  
  115. body a{
  116. text-decoration:none;
  117. font-weight:700;
  118. }
  119.  
  120. small, sub {
  121. font-size:12px;
  122. font-family: calibri,helvetica,arial,sans-serif;
  123. }
  124.  
  125. s,strike {
  126. color:{color:accent2};
  127. }
  128.  
  129. u,underline {
  130. color:{color:accent2};
  131. }
  132.  
  133. /*------------------- "SIDEBAR" ------------------*/
  134. #nav{
  135. position:fixed;
  136. z-index:75;
  137. margin-left:10px;
  138. margin-top:150px;
  139. width:400px;
  140. text-align:center;
  141. -ms-transform: rotate(90deg); /* IE 9 */
  142. -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
  143. transform: rotate(90deg);
  144. }
  145.  
  146. #navigation a{color:{color:accent2}; font-size:15px; text-decoration:bold;text-shadow: black 0 0 2px;}
  147.  
  148. #navigation a:hover{
  149. color:{color:accent}; text-decoration:bold;
  150. }
  151.  
  152. #pagination{
  153. font-family:Calibri, Helvetica, Arial, sans-serif;
  154. font-size:10px;
  155. text-align:center;
  156. color:{color:accent2};
  157. text-transform:uppercase;
  158. letter-spacing:3px;
  159. }
  160.  
  161. #pagination a{color:{color:accent2}; padding:0px 2px;}
  162.  
  163. /*-------------------------MAIN BODY STUFF HERE-----------------------*/
  164. img{border:0; max-width:100%;max-height:auto;}
  165.  
  166. #body{
  167. position:absolute;
  168. z-index:70;
  169. margin-left:50px;
  170. }
  171.  
  172. #body a{text-decoration:none;color:{color:Accent2};}
  173. #body a:hover{color:black;border-bottom:1px solid {color:Accent};}
  174. #body blockquote{
  175. border-left:2px solid {color:body font};
  176. border-right:2px solid {color:body font};
  177. padding:5px;
  178. margin:2px;
  179. background:#ecd9cc;
  180. }
  181. /*--------------------CONTAINER BOX THING---------------------------*/
  182. #container{
  183. position:fixed;
  184. margin-top:50px;
  185. width:520px;
  186. height:580px;
  187. overflow:auto;
  188. margin-left:auto;
  189. margin-right:auto;
  190. background:#97a890;
  191. border:2px solid #ecd9cc;
  192. }
  193.  
  194. /*-------------------------INDIVID POSTS------------------------*/
  195. #post{
  196. width:500px;
  197. margin:0px 0px 0px 3px;
  198. padding:10px 10px;
  199. background-color:transparent;
  200. font-family:calibri,helvetica,arial,sans-serif;
  201. color:{color:body font};
  202. }
  203.  
  204. #post .text{font-size:11px; line-height:16px;}
  205. #post .title{font-size:20px;}
  206. .text ul li{list-style-type:circle;}
  207.  
  208. /*-------------------------PERMALINKS AND TAGS------------------------*/
  209. #permalink{
  210. position:absolute;
  211. z-index:999999;
  212. margin-top:-5px;
  213. padding:3px;
  214. font-size:10px;
  215. text-align:center;
  216. text-transform:uppercase;
  217. font-family:calibri,helvetica,arial,sans-serif;
  218. color:{color:accent};
  219. background:url('http://static.tumblr.com/xozato3/mjgo6oi38/selectionornichpale.png');
  220. width:400px;
  221. margin-left:60px;
  222. }
  223.  
  224. #permalink a{color:{color:accent3};vertical-align:middle;}
  225. #permalink a:hover{color:{color:accent};}
  226.  
  227. #tags{
  228. margin-top:15px;
  229. font-size:10px;
  230. font-family:calibri,helvetica,arial,sans-serif;
  231. width:400px;
  232. text-align:center;
  233. margin-bottom:40px;
  234. margin-left:60px;
  235. }
  236.  
  237. #notesbox{width:500px;margin:20px auto;font-size:11px;font-family:calibri,helvetica,arial,sans-serif;}
  238. #notesbox ol.notes{list-style-type:none;margin:7px 0px;padding:0px 0px;}
  239. #notesbox img.avatar{display:none;}
  240.  
  241. /*------------------------EXTRA BITS AND BOBBLES----------------------*/
  242. .chat ul {list-style:none; margin:0; padding:0;}
  243. .chat li {font-size:11px;list-style-type: none;margin-left: 0px;padding: 3px;}
  244.  
  245. #ask a{color:white;}
  246. /*------------------------CUSTOM TOOLTIP--------------------------*/
  247. #s-m-t-tooltip {
  248. max-width:150px;
  249. padding:5px;
  250. margin:0px 0px 0px 17px;
  251. background-color:{color:accent2};
  252. font-family:calibri,helvetica,arial,sans-serif;
  253. font-size:9px;
  254. letter-spacing:2px;
  255. text-transform:lowercase;
  256. color:{color:accent3};
  257. z-index:9999;
  258. }
  259.  
  260. /*-----------------------------SCROLLBAR-----------------------------*/
  261.  
  262. ::-webkit-scrollbar {
  263. display:none;
  264. }
  265. ::-webkit-scrollbar-thumb:vertical {
  266. background-color:#eb9897;height:auto;
  267. }
  268.  
  269. /* ---------------------------- UPDATES ------------------------------*/
  270.  
  271. #updates {
  272. font-size:11px;
  273. font-family:century gothic, arial;
  274. color:{color:body font};
  275. text-align:center;
  276. height:300px;
  277. width:150px;
  278. padding:0px;
  279. top:50px;
  280. left:690px;
  281. z-index:10;
  282. position:fixed;
  283. overflow-x:hidden;
  284. overflow-y:auto;
  285. border:2px solid #ecd9cc;
  286. background:{color:page bg};
  287. }
  288.  
  289. #headerbar{
  290. left:50%;
  291. top:50%;
  292. width:400px; /*– sets width of your text –*/
  293. overflow:scroll;
  294. text-align:justify;
  295. color:#eee;
  296. font-family:calibri;
  297. font-size:12px;
  298. }
  299.  
  300. #tabbar{
  301. left:50%;
  302. top:50%;
  303. width:400px; /*– sets width of your text –*/
  304. height:400px; /*– sets height of your text –*/
  305. overflow: scroll;
  306. text-align:justify;
  307. color:#222;
  308. font-family:calibri;
  309. font-size:12px;
  310. }
  311.  
  312. ul#tabs {text-align: center;}
  313. ul#tabs li { /*– your inactive / not viewed tabs –*/
  314. display:inline-block;
  315. padding:2px;
  316. cursor:pointer;
  317. text-decoration:none;
  318. opacity:1;
  319. color:#3b6e82;
  320. }
  321.  
  322. ul#tabs li.active { /*– your active tab –*/
  323. background-color:{color:accent};
  324. color:#fff;
  325. -webkit-transition:
  326. all 0.5s ease-out;
  327. -moz-transition: all 0.5s ease-out;
  328. transition: all 0.5s ease-out;
  329. }
  330.  
  331. ul#tab, ul#tabs{list-style-type:none;margin:0px;padding:0px;}
  332. ul#tab li.active {display: block;}
  333. ul#tab li {display: none;}
  334.  
  335. /*-----------------------------POPUP BOXES---------------------------*/
  336. #fade { /*--Transparent background layer--*/
  337. display: none; /*--hidden by default--*/
  338. background: #000;
  339. position: fixed; left: 0; top: 0;
  340. width: 100%; height: 100%;
  341. opacity: .80;
  342. z-index: 9999;
  343. }
  344. .popup_block{
  345. display: none; /*--hidden by default--*/
  346. color:{font:body font};
  347. padding: 10px;
  348. float: left;
  349. font-size: 11.5;
  350. position: fixed;
  351. top: 50%; left: 50%;
  352. z-index: 9999999;
  353.  
  354. img.btn_close {
  355. float: right;
  356. margin: -20 -20px 0 0;
  357. }
  358. /*--Making IE6 Understand Fixed Positioning--*/
  359. *html #fade {
  360. position: absolute;
  361. }
  362. *html .popup_block {
  363. position: absolute;
  364. }
  365.  
  366. #credit {
  367. z-index:8;
  368. bottom:5px;
  369. right:5px;
  370. height:30px;
  371. width:30px;
  372. position:fixed;
  373. padding:5px;}
  374.  
  375. /* ---------------------- GENERAL CUSTOMIZATION ---------------------- */
  376. body {
  377. font-family:Calibri,Candara,Segoe,'Segoe UI',Optima,Arial,sans-serif;
  378. font-size:10px;
  379. line-height:110%;
  380. overflow:hidden;
  381. }
  382.  
  383. pre {
  384. font-family:'Oswald' sans-serif;
  385. text-decoration:underline;
  386. letter-spacing:2px;
  387. }
  388.  
  389. #canti {
  390. overflow:scroll;
  391. overflow-x:hidden;
  392. width:550px;
  393. height:500px;
  394. margin:40px auto;
  395. margin-bottom:0;
  396. border:25px solid rgba(255,255,255,.4); /*border color & opacity*/
  397. -webkit-background-clip:padding-box;
  398. background-clip:padding-box;
  399. }
  400.  
  401. /* ---------------------SECTION TITLE CUSTOMIZATION--------------------- */
  402.  
  403. .header2:before {
  404. position:absolute;
  405. z-index:-1;
  406. top:45px;
  407. right:0;
  408. bottom:0;
  409. left:0;
  410. width:95%;
  411. margin:0 auto;
  412. content:'';
  413. border-top:1px solid #dfdfdf;
  414. }
  415.  
  416. .header2 span {
  417. padding:0 15px;
  418. background:#fff;
  419. }
  420.  
  421. /* -----------------------TEXT SELECTION CUSTOMIZATION----------------------- */
  422. ::selection {
  423. color:#fff;
  424. background:#b2b2b2;
  425. }
  426.  
  427. ::-moz-selection {
  428. color:#fff;
  429. background:#b2b2b2;
  430. }
  431.  
  432. ::-webkit-selection {
  433. color:#fff;
  434. background:#b2b2b2;
  435. }
  436.  
  437. /* ------------------------------ MBTI CSS --------------------------- */
  438. .mbtipic1 {
  439. z-index:1;
  440. display:inline-block;
  441. overflow:hidden;
  442. width:200px;
  443. height:200px;
  444. text-align:center;
  445. background-color:#acacac;
  446. background-image:url(); /* replace image url with your own */
  447. background-position:center;
  448. background-size:auto 100%;
  449. }
  450.  
  451. .mbtitext {
  452. font-family:'Oswald',sans-serif;
  453. /*mbti title font*/
  454. font-size:40px;
  455. margin-top:90px;
  456. margin-bottom:25px;
  457. -webkit-transition:ease-in-out .5s;
  458. -moz-transition:ease-in-out .5s;
  459. -o-transition:ease-in-out .5s;
  460. transition:ease-in-out .5s;
  461. text-align:center;
  462. letter-spacing:5px;
  463. color:#fff;
  464. -webkit-filter:blur(2px);
  465. }
  466.  
  467. .mbtihover {
  468. /*css literally for the word "hover" just so people know to hover*/
  469. font-size:8px;
  470. margin-top:-10px;
  471. -webkit-transition:ease-in-out .5s;
  472. -moz-transition:ease-in-out .5s;
  473. -o-transition:ease-in-out .5s;
  474. transition:ease-in-out .5s;
  475. letter-spacing:.5px;
  476. opacity:.5;
  477. color:#fff;
  478. }
  479.  
  480. .mbtipic1:hover .mbtitext {
  481. font-size:13px;
  482. margin-top:40px;
  483. margin-left:20px;
  484. letter-spacing:25px;
  485. -webkit-filter:blur(0px);
  486. }
  487.  
  488. .mbtipic1:hover .mbtihover {
  489. opacity:0;
  490. }
  491.  
  492. /*-----------bar graph. theres no reason to really mess with this-----------*/
  493. .mbtitraits {
  494. font-size:8px;
  495. line-height:13px;
  496. top:-30px;
  497. height:100px;
  498. margin-top:-11px;
  499. -webkit-transition:ease-in-out .5s;
  500. -moz-transition:ease-in-out .5s;
  501. -o-transition:ease-in-out .5s;
  502. transition:ease-in-out .5s;
  503. text-align:right;
  504. letter-spacing:1px;
  505. text-transform:uppercase;
  506. opacity:0;
  507. color:#f5f5f5;
  508. }
  509.  
  510. .mbtitraits b {
  511. padding-left:3px;
  512. text-decoration:none;
  513. color:#fff;
  514. background-color:rgba(0,0,0,.2);
  515. }
  516.  
  517. .mbtipic1:hover .mbtitraits {
  518. opacity:1;
  519. }
  520.  
  521. .mbtipic1:hover .bars {
  522. z-index:99999;
  523. opacity:1;
  524. }
  525.  
  526. /*----------------------strengths and weaknesses----------------------*/
  527. .strengthsweaknesses {
  528. float:right;
  529. width:270px;
  530. margin-top:10px;
  531. padding-left:25px;
  532. }
  533.  
  534. .swlist {
  535. font-size:8px;
  536. line-height:10px;
  537. display:inline-block;
  538. overflow:auto;
  539. overflow-x:hidden;
  540. width:120px;
  541. height:100px;
  542. padding-top:10px;
  543. text-align:center;
  544. text-transform:uppercase;
  545. background-color:transparent;
  546. }
  547.  
  548. .swlist b,bold,strong {
  549. font-family:'Oswald' sans-serif; /*header font*/
  550. text-decoration:underline;
  551. letter-spacing:2px;
  552. }
  553.  
  554. .swhorizontalbar { /*white strip behind strengths and weaknesses*/
  555. float:right;
  556. width:300px;
  557. height:100px;
  558. margin-bottom:-110px;
  559. background-color:#fff; /*strip color*/
  560. }
  561.  
  562. .mbtipic2 {
  563. z-index:-999;
  564. float:right;
  565. overflow:hidden;
  566. width:280px;
  567. height:200px;
  568. margin-top:-10px;
  569. margin-bottom:-150px;
  570. background-color:#acacac;
  571. background-image:url(); /*picture behind strengths and weakness*/
  572. background-position:center;
  573. background-size:100% auto;
  574. -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  575. -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  576. box-shadow:inset 0 0 6px rgba(0,0,0,.3);
  577. }
  578.  
  579. /*--------------------- MORAL ALIGNMENT CSS ---------------------*/
  580. .alignmentdesc {
  581. line-height:9px;
  582. float:left;
  583. width:180px;
  584. height:264px;
  585. margin-top:3px;
  586. padding:10px 10px 0;
  587. text-align:right;
  588. color:#f5f5f5;
  589. background-color:#acacac;
  590. background-image:url(); /*image behind list of alignment descriptions*/
  591. background-position:center;
  592. background-size:auto 100%;
  593. }
  594.  
  595. #selected {
  596. background-color:#002952; /*color of the selected alignment*/
  597. }
  598.  
  599. .alignment {
  600. display:inline-block;
  601. width:279px;
  602. margin-left:17px;
  603. background-color:#acacac;
  604. background-image:url(); /*image behind alignment squares*/
  605. background-position:center;
  606. background-size:100% auto;
  607. }
  608.  
  609. .alignmentblock {
  610. font-size:8px;
  611. line-height:100%;
  612. position:relative;
  613. display:block;
  614. float:left;
  615. width:67px;
  616. height:47px;
  617. padding:10px;
  618. padding-top: 30px;
  619. text-align:center;
  620. text-transform:uppercase;
  621. color:#acacac;
  622. border:3px solid #fff;
  623. }
  624.  
  625. .alignmentblock p {
  626. padding:0;
  627. }
  628.  
  629. /*---------------------------- NAVIGATION BOX---------------------------------*/
  630. .navscrollbox {
  631. width:521px;
  632. padding:15px;
  633. padding-bottom:5px;
  634. border-top:15px solid #fff;
  635. background-color:#acacac;
  636. background-image:url(); /*image for navigation*/
  637. background-position:center;
  638. background-size:100% auto;
  639. -webkit-column-count:3;
  640. -moz-column-count:3;
  641. -ms-column-count:3;
  642. column-count:3;
  643. -webkit-column-gap:0;
  644. -moz-column-gap:0;
  645. -ms-column-gap:0;
  646. column-gap:0;
  647. }
  648.  
  649. /*----------------------nav sections customization----------------------*/
  650. .navblock {
  651. display:inline-block;
  652. width:150px;
  653. margin:5px;
  654. padding-bottom:5px;
  655. background-color:rgba(0,0,0,.2);
  656. }
  657.  
  658. /*-----------------------nav titles customization-----------------------*/
  659. .navcategory {
  660. font-family:'Oswald' sans-serif;
  661. /*nav titles font*/
  662. font-size:8px;
  663. position:relative;
  664. z-index:1;
  665. overflow:hidden;
  666. width:140px;
  667. padding:6px 5px;
  668. text-align:center;
  669. letter-spacing:2px;
  670. text-transform:uppercase;
  671. color:#fff; /*category text color*/
  672. }
  673.  
  674. .navcategory:before,.navcategory:after {
  675. position:absolute;
  676. top:51%;
  677. overflow:hidden;
  678. width:50%;
  679. height:1px;
  680. content:'\a0';
  681. background-color:rgba(255,255,255,.5);
  682. }
  683.  
  684. .navcategory:before {
  685. margin-left:-50%;
  686. text-align:right;
  687. }
  688.  
  689. /*--------------------------nav link customization--------------------------*/
  690. .navlink {
  691. width:142px;
  692. margin-top:4px;
  693. padding:3px;
  694. padding-left:5px;
  695. -webkit-transition:ease-in-out .5s;
  696. -moz-transition:ease-in-out .5s;
  697. -o-transition:ease-in-out .5s;
  698. transition:ease-in-out .5s;
  699. text-align:center;
  700. color:#fff; /**link text color**/
  701. background-color:transparent; /**link background color**/
  702. }
  703.  
  704. .navlink:hover {
  705. color:#fff; /**link hover text color**/
  706. background-color:rgba(0,0,0,.7); /**link hover background color**/
  707. }
  708.  
  709. /*-----------------------------------CREDIT----------------------------------- LOL don't remove this its just a little x in the corner i think you can deal*/
  710. .credit {
  711. font-family:consolas;
  712. font-size:9px;
  713. line-height:9px;
  714. position:fixed;
  715. right:10px;
  716. bottom:10px;
  717. padding:2px 4px;
  718. -webkit-transition:ease-in-out .5s;
  719. -moz-transition:ease-in-out .5s;
  720. -o-transition:ease-in-out .5s;
  721. transition:ease-in-out .5s;
  722. color:#fff;
  723. border:1px solid #fff;
  724. }
  725.  
  726. .credit:hover {
  727. font-weight:700;
  728. color:#000;
  729. border:1px solid #fff;
  730. background-color:#fff;
  731. }
  732.  
  733. /** remove this if you don't like tiny cursors**/
  734. *,body,a,a:hover {
  735. cursor:url(http://i1124.photobucket.com/albums/l579/fieKrieY/Cursor-1.png),auto
  736. }
  737.  
  738. /*-----------------------BOTTOM NAV CSS-----------------------*/
  739. .return {
  740. font-size:8px;
  741. position:relative;
  742. top:-20px;
  743. width:580px;
  744. height:50px;
  745. margin:0 auto;
  746. -webkit-transition:ease-in-out .3s;
  747. -moz-transition:ease-in-out .3s;
  748. -o-transition:ease-in-out .3s;
  749. transition:ease-in-out .3s;
  750. letter-spacing:1.5px;
  751. color:#fff;
  752. }
  753.  
  754. .return a {
  755. -webkit-transition:ease-in-out .3s;
  756. -moz-transition:ease-in-out .3s;
  757. -o-transition:ease-in-out .3s;
  758. transition:ease-in-out .3s;
  759. color:#fff;
  760. }
  761.  
  762. .return a:hover {
  763. color:#ff8330;
  764. }
  765.  
  766. /*-----------------------BLOGROLL CSS-----------------------*/
  767. .blogrollbox {
  768. overflow:auto;
  769. overflow-x:hidden;
  770. width:430px;
  771. height:340px;
  772. margin:20px;
  773. margin-top:5px;
  774. padding:20px;
  775. text-align:justify;
  776. background-image:url(); /*image for blogroll*/
  777. background-position:center;
  778. background-size:100% auto;
  779. }
  780.  
  781. .blogrollbox:after {
  782. display:inline-block;
  783. width:100%;
  784. content:'';
  785. }
  786.  
  787. .blogrollbox img {
  788. display:inline-block;
  789. margin:5px;
  790. -webkit-transition:ease-in-out .3s;
  791. -moz-transition:ease-in-out .3s;
  792. -o-transition:ease-in-out .3s;
  793. transition:ease-in-out .3s;
  794. -webkit-filter:grayscale(100%);
  795. }
  796.  
  797. .blogrollbox img:hover {
  798. -webkit-filter:grayscale(0%);
  799. }
  800.  
  801.  
  802.  
  803.  
  804.  
  805. {CustomCSS}</style>
  806. </head>
  807. <body>
  808.  
  809. <!-- begin updates tab -->
  810.  
  811. <div id="updates">
  812.  
  813. <div style="padding-top:10px;">
  814.  
  815. <b><p><span style="font-size:12px"><b>❛</b> <a href="/" style="color:white;text-shadow: black 0 0 2px;">OUT OF THIS WORLD</a> <b>❜</b></span></b><br>
  816. <span style="font-size:10px">
  817. an original character</p>
  818. <hr>
  819. <p>pan-fandom</span><br>
  820. SELECTIVE & PRIVATE</p>
  821. <hr>
  822.  
  823. <!------------------------- NAVIGATION -------------------------->
  824. <p>
  825. <div id="navigation" style="font-size:11px;">navigation<br>
  826. <a href="#?w=700" rel="ask" class="poplight" title="ask">✕</a>
  827. <a href="#?w=550" rel="abt" class="poplight" title="story">✕</a>
  828. <a href="#?w=400" rel="guide" class="poplight" title="guide">✕</a>
  829. <a href="/verselanding" title="verses">✕</a>
  830. <a href="/tagged/trivia" title="trivia">✕</a>
  831. <a href="/commish" title="commissions">✕</a>
  832. </div></p>
  833. <!------------------------ NAV END ------------------------------>
  834. <hr>
  835. <p>est. 26 feb 2012<br>
  836. reboot 3 aug 2016<br>
  837. <span style="font-size:11px">written by <a href="/mun" style="color:white;text-shadow: black 0 0 2px;">CHE</a></span> (21+)</p>
  838. <hr>
  839. {block:Pagination}<p>
  840. {block:NextPage}<a href="{NextPage}" style="color:white;text-shadow: black 0 0 2px;">old</a>{/block:NextPage}
  841. {block:PreviousPage}&nbsp;/&nbsp;<a href="{PreviousPage}" style="color:white;text-shadow: black 0 0 2px;">new</a>{/block:PreviousPage}
  842. </p><hr>{/block:Pagination}
  843. </div></div>
  844.  
  845. <!-- end updates tab -->
  846.  
  847. </div>
  848. <!----------------------------MAIN BODY----------------------------->
  849. <div id="body">
  850. <div id="container">
  851. {block:Posts}
  852.  
  853. <!--------------------------TYPES OF POSTS----------------------------->
  854. <div id="post">
  855.  
  856. {block:Photo}
  857. <img src="{PhotoURL-500}" />
  858. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  859. {/block:Photo}
  860.  
  861. {block:Photoset}
  862. {Photoset-500}
  863. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  864. {/block:Photoset}
  865.  
  866. {block:Video}
  867. {Video-500}
  868. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  869. {/block:Video}
  870.  
  871. {block:Audio}
  872. <div class="musicbox">
  873. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  874. {block:TrackName}<div class="text" style="color:{color:Accent};"><strong>{TrackName}</strong></div>{/block:TrackName}<br/>
  875. {block:Artist}<div class="text" style="margin-top:-17px;"><strong>Artist:&nbsp;</strong>{Artist}</div>{/block:Artist}<br/>
  876. {block:Album}<div class="text" style="margin-top:-17px;"><strong>Album:&nbsp;</strong>{Album}</div>{/block:Album}<br/>
  877. <div class="text" style="margin-top:-17px;">{PlayCountWithLabel}</div></div>
  878. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  879. {/block:Audio}
  880.  
  881. {block:Quote}
  882. <div class="title" style="width:480px;text-align:justify;">{Quote}</div>
  883. {block:Source}<div class="text" style="text-align:right;padding-right:50px;"><br/>&mdash;{Source}</div>{/block:Source}
  884. {/block:Quote}
  885.  
  886. {block:Text}
  887. {block:Title}<div class="title">{Title}<br/></div>{/block:Title}
  888. <div class="text">{Body}</div>
  889. {/block:Text}
  890.  
  891. {block:Answer}<div id="ask">
  892. <div style="background-color:{color:accent2};color:white; padding:10px 10px 10px 10px;"><div class="title" style="font-size:12px;">{Question}<br/></div>
  893. <div class="text" style="text-align:right;color:white;text-decoration:underline:">&mdash;<span style="color:white">{Asker}</span><br/></div></div></div>
  894. <div class="text" style="width:500px;">{Answer}</div>
  895. {/block:Answer}
  896.  
  897. {block:Chat}
  898. {block:Title}<div class="title">{Title}<br/></div>{/block:Title}
  899. {block:Lines}<div class="chat"><li class="line_{Alt}">
  900. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}</li></div>
  901. {/block:Lines}
  902. {/block:Chat}
  903.  
  904. {block:Link}
  905. <div class="title"><a href="{URL}">{Name}</a></div>
  906. {block:Description}<div class="text">{Description}</div>{/block:Description}
  907. {/block:Link}
  908.  
  909. </div>
  910. <!---------------------PERMALINK + REBLOG STUFF---------------------->
  911. <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>
  912.  
  913. <!----------------------------TAG STUFF----------------------------->
  914. <div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  915.  
  916. {block:PostNotes}
  917. <div id="notesbox">{PostNotes}</div>
  918. {/block:PostNotes}
  919. {/block:Posts}
  920. </div></div>
  921.  
  922. </body>
  923.  
  924. </div></div></div></div></div></div></div></div></div></div>
  925.  
  926.  
  927. </div>
  928.  
  929. <!-------HERE BEGIN THE POPUP BOXES------->
  930.  
  931. <div id="ask" class="popup_block" style="overflow:auto;">
  932.  
  933. <table>
  934. <tr><td>
  935. <iframe frameborder="0" scrolling="yes" width="340" height="150" src="https://www.tumblr.com/ask_form/noborijo.tumblr.com" style="background-color:transparent; overflow:auto; display:block; float:left;" id="ask_form"></iframe>
  936. </td></tr>
  937. </table>
  938. </div>
  939.  
  940. <div id="submit" class="popup_block" style="overflow:auto;">
  941.  
  942. <table>
  943. <tr><td>
  944. <iframe frameborder="0" scrolling="yes" width="340" height="250" src="https://www.tumblr.com/submit_form/noborijo.tumblr.com" style="background-color:transparent; overflow:auto; display: block; float:right; margin-left:20px;" id="submit_form"></iframe>
  945. </td></tr>
  946. </table>
  947. </div>
  948.  
  949.  
  950. <div id="abt" 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};height:500px;">
  951. <div id="canti">
  952.  
  953.  
  954. <!---------------------- TITLE BEGINS HERE ---------------------->
  955.  
  956.  
  957. <div class="header" style="width:550px;
  958. height:200px;
  959. text-align:center;
  960. letter-spacing:1px;
  961. color:#fff;
  962. border-bottom:solid #fff 20px;
  963. background-color:#acacac;
  964. background-image:url();
  965. background-position:center;
  966. background-size:100% auto;">
  967. <div class="title" style="font-family:'Oswald',sans-serif; /*title font*/
  968. font-size:30px;
  969. padding-top:90px;
  970. text-shadow:0 0 10px rgba(0,0,0,.3);">CHARACTER NAME</div>
  971. <div class="subheader" style="margin-top:10px;">subtitle</div>
  972. </div>
  973.  
  974. <!----------------------- TITLE ENDS HERE ----------------------->
  975.  
  976. <!-------------------COLOR PALETTE BEGINS HERE ------------------->
  977.  
  978.  
  979. <div class="header2" style=" font-family:'Oswald',sans-serif;
  980. font-size:14px;
  981. position:relative;
  982. z-index:1;
  983. width:500px;
  984. padding:20px 25px;
  985. padding-top:40px;
  986. text-align:center;
  987. letter-spacing:1px;
  988. background:#fff;"><span>COLORS</span></div>
  989.  
  990. <div class="content" style=" position:relative;
  991. overflow:hidden;
  992. width:500px;
  993. min-height:75px;
  994. padding:15px 25px;
  995. background:#fff;">
  996. <div class="swatch" style="background-color:#002952;line-height:190px;
  997. position:relative; float:left; width:80px; height:80px; margin:10px; margin-top:-5px; text-align:center; background-position:center; background-size:auto 100%;">#002952</div>
  998. <div class="swatch" style="background-color:#00476B;line-height:190px;
  999. position:relative; float:left; width:80px; height:80px; margin:10px; margin-top:-5px; text-align:center; background-position:center; background-size:auto 100%;">#00476B</div>
  1000. <div class="swatch" style="background-color:#00A37A;line-height:190px;
  1001. position:relative; float:left; width:80px; height:80px; margin:10px; margin-top:-5px; text-align:center; background-position:center; background-size:auto 100%;">#00A37A</div>
  1002. <div class="swatch" style="background-color:#FF8330;line-height:190px;
  1003. position:relative; float:left; width:80px; height:80px; margin:10px; margin-top:-5px; text-align:center; background-position:center; background-size:auto 100%;">#FF8330</div>
  1004. <div class="swatch" style="background-color:#FFD633;line-height:190px;
  1005. position:relative; float:left; width:80px; height:80px; margin:10px; margin-top:-5px; text-align:center; background-position:center; background-size:auto 100%;">#FFD633</div>
  1006. </div>
  1007.  
  1008. <!------------------------COLOR PALETTE ENDS HERE ------------------------>
  1009.  
  1010. <!-------------------QUOTE/PLAYLIST SECTION BEGINS HERE------------------->
  1011.  
  1012.  
  1013. <div class="header2" style=" font-family:'Oswald',sans-serif;
  1014. font-size:14px;
  1015. position:relative;
  1016. z-index:1;
  1017. width:500px;
  1018. padding:20px 25px;
  1019. padding-top:40px;
  1020. text-align:center;
  1021. letter-spacing:1px;
  1022. background:#fff;"><span>WORDS</span></div>
  1023. <div class="content" style=" position:relative;
  1024. overflow:hidden;
  1025. width:500px;
  1026. min-height:75px;
  1027. padding:15px 25px;
  1028. background:#fff;">
  1029.  
  1030. <div class="quotebox" style=" position:relative;
  1031. display:inline-block;
  1032. overflow:hidden;
  1033. width:175px;
  1034. height:175px;
  1035. margin-left:20px;
  1036. padding:20px;
  1037. -webkit-transition:ease-in-out .3s;
  1038. -moz-transition:ease-in-out .3s;
  1039. -o-transition:ease-in-out .3s;
  1040. transition:ease-in-out .3s;
  1041. background-color:#acacac;
  1042. background-image:url();
  1043. background-position:center;
  1044. background-size:auto 100%;">
  1045. <div class="quote" style=" font-size:13px;
  1046. line-height:130%;
  1047. position:absolute;
  1048. display:inline-block;
  1049. width:175px;
  1050. height:175px;
  1051. margin-top:-10px;
  1052. margin-left:-20px;
  1053. padding:20px;
  1054. -webkit-transition:ease-in-out 1s;
  1055. -moz-transition:ease-in-out 1s;
  1056. -o-transition:ease-in-out 1s;
  1057. transition:ease-in-out 1s;
  1058. text-align:center;
  1059. letter-spacing:.5px;
  1060. color:#fff;"><br>
  1061. <p>
  1062. “Quotes are for people who can't think of something intelligent to say on their own”<p> -- Bo Burnham
  1063. </div>
  1064. </div>
  1065.  
  1066. <div class="musicbox" style="
  1067. position:relative;
  1068. display:inline-block;
  1069. width:175px;
  1070. height:175px;
  1071. margin-left:20px;
  1072. padding:20px;
  1073. -webkit-transition:ease-in-out 1s;
  1074. -moz-transition:ease-in-out 1s;
  1075. -o-transition:ease-in-out 1s;
  1076. transition:ease-in-out 1s;
  1077. background-color:#acacac;
  1078. background-image:url();
  1079. background-position:center;
  1080. background-size:auto 100%;">
  1081. <div class="player" style=" position:absolute;
  1082. bottom:20px;
  1083. overflow:hidden;
  1084. width:175px;
  1085. height:20px;
  1086. text-align:center;
  1087. vertical-align:middle;
  1088. background-color:#fff;"> MUSIC PLAYER CODE HERE</div>
  1089. </div>
  1090.  
  1091. </div>
  1092.  
  1093. <!-------------------QUOTE/PLAYLIST SECTION ENDS HERE------------------->
  1094.  
  1095. <!--------------------------- ABOUT BEGINS HERE --------------------------->
  1096.  
  1097.  
  1098. <div id="about" class="header2" style=" font-family:'Oswald',sans-serif;
  1099. font-size:14px;
  1100. position:relative;
  1101. z-index:1;
  1102. width:500px;
  1103. padding:20px 25px;
  1104. padding-top:40px;
  1105. text-align:center;
  1106. letter-spacing:1px;
  1107. background:#fff;"><span>ABOUT</span></div>
  1108. <div class="content" style=" position:relative;
  1109. overflow:hidden;
  1110. width:500px;
  1111. min-height:75px;
  1112. padding:15px 25px;
  1113. background:#fff;">
  1114.  
  1115. <div align="center"><div style="width:450px; text-align: justify">
  1116. <span id="dropcap" style=" font-family:'Oswald' sans-serif;
  1117. font-size:230%;
  1118. float:left;
  1119. margin-right:5px;
  1120. padding:10px 3px;
  1121. color:#fff;
  1122. background-color:#000;">L</span>orem ipsum dolor sit amet, consectetur adipiscing elit. Donec eu blandit ipsum. Nulla non aliquet purus, et imperdiet leo. Cras eu metus vulputate tortor tincidunt sagittis. Praesent pulvinar est elit, non pharetra nisi commodo a. Nullam ante leo, porttitor non dolor ac, dignissim mollis orci. Suspendisse et enim vitae lectus ornare porta. Nam consectetur erat vitae ex eleifend pharetra. Vivamus commodo, urna at auctor gravida, sapien est placerat est, non eleifend nisl tortor eget mi. Duis ut justo faucibus, cursus purus in, auctor augue. Proin tortor ipsum, mollis at semper vitae, tristique quis nulla. Nulla scelerisque, nibh vel pellentesque consectetur, mauris eros aliquam purus, vitae suscipit odio orci ac enim. Donec a tortor justo. Morbi iaculis tincidunt dolor, ut gravida mi ultricies quis. Nunc auctor risus quis elit ullamcorper consectetur.<p>
  1123.  
  1124. Sed venenatis venenatis lectus, ac finibus velit vehicula nec. Praesent malesuada aliquam tellus, fermentum sodales ante. In dignissim sapien quis nulla interdum, sit amet pulvinar magna commodo. Sed vel placerat est, non cursus mauris. Sed sollicitudin sem nulla, vitae pulvinar orci ullamcorper nec. Duis semper volutpat pulvinar. <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">Proin consectetur pellentesque lacus eu varius.</a> Proin nibh odio, porta eu viverra a, consequat at sem. Maecenas vestibulum ipsum ut euismod luctus. Ut ut hendrerit lectus, vel lobortis justo. Phasellus a massa et quam aliquet vulputate eu at mauris. Nullam pharetra purus sed neque imperdiet, sed viverra odio viverra.<p>
  1125.  
  1126. Maecenas in ligula condimentum, eleifend eros non, fringilla nibh. Donec nisl turpis, elementum eu erat et, venenatis fermentum leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam feugiat rhoncus varius. Nulla eu posuere sapien, eget viverra tellus. Cras iaculis dui eleifend pulvinar luctus. In accumsan tincidunt malesuada. <b>Donec venenatis vel nisl at ullamcorper.</b> Vestibulum interdum, neque vitae congue commodo, ex mauris volutpat dui, egestas feugiat elit ex in sem. Nunc a facilisis tellus, at consectetur ex. Ut turpis est, vehicula at urna eget, varius molestie libero.<p>
  1127.  
  1128. Integer et enim molestie, pretium ex ac, blandit sem. Curabitur interdum tristique rutrum. Cras viverra nulla eu orci luctus sagittis. Suspendisse egestas posuere sem, tristique rutrum massa pretium sed. Donec iaculis urna eu dignissim congue. Donec venenatis libero metus. Nullam consectetur elementum orci, quis viverra tellus molestie id. <i>Fusce ultrices neque vitae aliquam facilisis.</i> Quisque tincidunt lacinia lorem, vitae rhoncus justo sollicitudin non. Aenean tellus augue, aliquam ut tincidunt eget, mollis ac eros. Nulla eleifend molestie sem, vitae sagittis nisi rutrum quis. Integer maximus leo quis ante iaculis, eget feugiat elit fringilla.<p>
  1129.  
  1130. Nunc eget ipsum quis arcu dictum convallis. Aliquam libero urna, lacinia faucibus arcu vel, rutrum tempus tellus. Integer a metus sed felis condimentum luctus. Nulla vel turpis eget nunc consectetur placerat eget a tellus. Etiam feugiat enim eget molestie efficitur. Aliquam auctor suscipit arcu a pellentesque. Proin libero turpis, accumsan vel tempus placerat, facilisis vel elit. Nulla facilisi. Sed quis suscipit libero, et placerat risus. Donec placerat pharetra dui, id sodales sapien sagittis at. Proin sollicitudin tincidunt nulla sed bibendum. Sed vel efficitur tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque suscipit bibendum leo, laoreet faucibus lectus feugiat eget.
  1131. </div></div>
  1132.  
  1133. </div>
  1134.  
  1135. <!---------------------------- ABOUT ENDS HERE ---------------------------->
  1136.  
  1137. <!----------------------------MBTI BEGINS HERE---------------------------->
  1138.  
  1139. <div class="header2" style=" font-family:'Oswald',sans-serif;
  1140. font-size:14px;
  1141. position:relative;
  1142. z-index:1;
  1143. width:500px;
  1144. padding:20px 25px;
  1145. padding-top:40px;
  1146. text-align:center;
  1147. letter-spacing:1px;
  1148. background:#fff;"><span>MYERS-BRIGGS TYPE INDICATOR</span></div>
  1149.  
  1150. <div class="content" style=" position:relative;
  1151. overflow:hidden;
  1152. width:500px;
  1153. min-height:75px;
  1154. padding:15px 25px;
  1155. background:#fff;">
  1156.  
  1157. <div class="mbtipic1">
  1158. <div class="mbtitext"> XXXX </div>
  1159. <div class="mbtihover"> [ HOVER ] </div>
  1160.  
  1161. <!---make sure the percentages on each line match -->
  1162.  
  1163. <div class="barsblock" style=" display:inline-block;
  1164. float:right;
  1165. width:100px;
  1166. margin-right:15px;">
  1167. <div class="bars" style="font-size:8px;
  1168. width:90px;
  1169. height:10px;
  1170. margin:3px;
  1171. -webkit-transition:ease-in-out .5s;
  1172. -moz-transition:ease-in-out .5s;
  1173. transition:ease-in-out .5s;
  1174. letter-spacing:1px;
  1175. text-transform:uppercase;
  1176. opacity:0;
  1177. color:#f5f5f5;
  1178. background-color:rgba(255,255,255,.3);">
  1179. <div class="bar" style="background-color: #002952; width: 20%; height:10px;
  1180. padding-left:2px; text-align:left;">20%</div></div>
  1181. <div class="bars" style="font-size:8px;
  1182. width:90px;
  1183. height:10px;
  1184. margin:3px;
  1185. -webkit-transition:ease-in-out .5s;
  1186. -moz-transition:ease-in-out .5s;
  1187. transition:ease-in-out .5s;
  1188. letter-spacing:1px;
  1189. text-transform:uppercase;
  1190. opacity:0;
  1191. color:#f5f5f5;
  1192. background-color:rgba(255,255,255,.3);">
  1193. <div class="bar" style="background-color: #00476B; width: 30%; height:10px;
  1194. padding-left:2px; text-align:left;">30%</div></div>
  1195. <div class="bars" style="font-size:8px;
  1196. width:90px;
  1197. height:10px;
  1198. margin:3px;
  1199. -webkit-transition:ease-in-out .5s;
  1200. -moz-transition:ease-in-out .5s;
  1201. transition:ease-in-out .5s;
  1202. letter-spacing:1px;
  1203. text-transform:uppercase;
  1204. opacity:0;
  1205. color:#f5f5f5;
  1206. background-color:rgba(255,255,255,.3);">
  1207. <div class="bar" style="background-color: #00A37A; width: 40%; height:10px;
  1208. padding-left:2px; text-align:left;">40%</div></div>
  1209. <div class="bars" style="font-size:8px;
  1210. width:90px;
  1211. height:10px;
  1212. margin:3px;
  1213. -webkit-transition:ease-in-out .5s;
  1214. -moz-transition:ease-in-out .5s;
  1215. transition:ease-in-out .5s;
  1216. letter-spacing:1px;
  1217. text-transform:uppercase;
  1218. opacity:0;
  1219. color:#f5f5f5;
  1220. background-color:rgba(255,255,255,.3);">
  1221. <div class="bar" style="background-color: #FF8330; width: 50%; height:10px;
  1222. padding-left:2px; text-align:left;">50%</div></div>
  1223. <div class="bars" style="font-size:8px;
  1224. width:90px;
  1225. height:10px;
  1226. margin:3px;
  1227. -webkit-transition:ease-in-out .5s;
  1228. -moz-transition:ease-in-out .5s;
  1229. transition:ease-in-out .5s;
  1230. letter-spacing:1px;
  1231. text-transform:uppercase;
  1232. opacity:0;
  1233. color:#f5f5f5;
  1234. background-color:rgba(255,255,255,.3);">
  1235. <div class="bar" style="background-color: #FFD633; width: 60%; height:10px;
  1236. padding-left:2px; text-align:left;">60%</div></div>
  1237. </div>
  1238.  
  1239. <!---make sure not to remove the <b></b> from around each word when editing-->
  1240.  
  1241. <div class="mbtitraits">
  1242. <br><b>trait one</b>
  1243. <br><b>trait two</b>
  1244. <br><b>trait three</b>
  1245. <br><b>trait four</b>
  1246. <br><b>trait five</b>
  1247. </div>
  1248.  
  1249. </div><!--end mbti pic-->
  1250.  
  1251.  
  1252. <div class="strengthsweaknesses">
  1253.  
  1254. <div class="mbtipic2"></div>
  1255. <div class="swhorizontalbar"></div>
  1256.  
  1257. <div class="swlist">
  1258. <b> XXXX STRENGTHS</b> <br>
  1259. strength<br>
  1260. strength<br>
  1261. strength<br>
  1262. strength<br>
  1263. strength<br>
  1264. strength
  1265. </div>
  1266.  
  1267. <div class="swlist">
  1268. <b> XXXX WEAKNESSES</b><br>
  1269. weakness<br>
  1270. weakness<br>
  1271. weakness<br>
  1272. weakness<br>
  1273. weakness<br>
  1274. weakness<br>
  1275.  
  1276. </div><!---endswlist--->
  1277. </div><!---end strengthsweaknesses-->
  1278. </div><!---end content--->
  1279.  
  1280. <!------------------------------MBTI ENDS HERE------------------------------>
  1281.  
  1282. <!-----------------------MORAL ALIGNMENT STARTS HERE----------------------->
  1283.  
  1284. <div class="header2" style=" font-family:'Oswald',sans-serif;
  1285. font-size:14px;
  1286. position:relative;
  1287. z-index:1;
  1288. width:500px;
  1289. padding:20px 25px;
  1290. padding-top:40px;
  1291. text-align:center;
  1292. letter-spacing:1px;
  1293. background:#fff;"><span>MORAL ALIGNMENT</span></div>
  1294.  
  1295. <div class="content" style=" position:relative;
  1296. overflow:hidden;
  1297. width:500px;
  1298. min-height:75px;
  1299. padding:15px 25px;
  1300. background:#fff;">
  1301.  
  1302. <div class="alignmentdesc">
  1303.  
  1304. <!---
  1305.  
  1306. to highlight your characters moral alignment, place <div id="selected> and </div> around the correct alignment as shown below.
  1307.  
  1308. EXAMPLE. if your moral alignment was neutral evil, it would look like this:
  1309.  
  1310. <div id="selected">
  1311. represents pure evil without honor and without variation;<p></div>
  1312.  
  1313.  
  1314. <!--lawful good-->combines honor and compassion;<p>
  1315. <!--neutral good-->doing what is good without bias for or against order;<p>
  1316. <!--chotic good--> combines a good heart with a free spirit;<p>
  1317. <!--lawful neutral-->reliable and honorable without being a zealot;<p>
  1318. <!--true neutral--><div id="selected">act naturally, without prejudice or compulsion;<p></div>
  1319. <!--chaotic nautral-->represents true freedom from society’s restricitons and a do-gooders zeal;<p>
  1320. <!--lawful evil-->represents methodical, intentional, and frequently sucessful evil;<p>
  1321. <!--neutral evil-->represents pure evil without honor and without variation;<p>
  1322. <!--chaotic evil-->destruction not only of beauty and life but also of the order on which beauty and life depend.</div> <!--end alignmentdesc--->
  1323.  
  1324.  
  1325.  
  1326.  
  1327. <!---- for this one, you can just place id="selected next to the alignmentblock.
  1328.  
  1329. EXAMPLE. If your alignment is lawful neutral instead of this:
  1330.  
  1331. <div class="alignmentblock">LAWFUL NEUTRAL <p>"the judge"</div>
  1332.  
  1333. it would look like this:
  1334.  
  1335. <div class="alignmentblock" id="selected" >LAWFUL NEUTRAL <p>"the judge"</div>
  1336.  
  1337. --->
  1338.  
  1339. <div class="alignment">
  1340. <div class="alignmentblock">LAWFUL GOOD<p>"the crusader"</div>
  1341. <div class="alignmentblock">NEUTRAL GOOD <p>"the benefactor"</div>
  1342. <div class="alignmentblock">CHAOTIC GOOD <p>"the rebel"</div>
  1343. <div class="alignmentblock">LAWFUL NEUTRAL <p>"the judge"</div>
  1344. <div class="alignmentblock" id="selected">TRUE NEUTRAL <p>"the undecided" </div>
  1345. <div class="alignmentblock" >CHAOTIC NEUTRAL <p>"the free spirit"</div>
  1346. <div class="alignmentblock">LAWFUL EVIL <p>"the dominator"</div>
  1347. <div class="alignmentblock">NEUTRAL EVIL <p>"the malefactor</div>
  1348. <div class="alignmentblock">CHAOTIC EVIL <p>"the destroyer"</div>
  1349. </div>
  1350.  
  1351.  
  1352.  
  1353. </div><!---end content--->
  1354.  
  1355.  
  1356. <!--------------------MORAL ALIGNMENT ENDS HERE-------------------->
  1357.  
  1358.  
  1359. </div><!--end container-->
  1360.  
  1361. </div>
  1362.  
  1363. <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}">
  1364.  
  1365. <h1 style="text-align:center; background:{color:accent};color:white;letter-spacing:2px;padding-top:5px;height:20px;font-size:20px;">GUIDELINES</h1>
  1366.  
  1367. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">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.
  1368.  
  1369. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">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.
  1370.  
  1371. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">This blog is multiship. Sora is currently single in all verses. 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.
  1372.  
  1373. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">Obligatory warning: Mun is of age, muse is not (by American standards). 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.
  1374.  
  1375. <h1 style="letter-spacing:2px;text-align:center;padding:2px 5px;font-size:12px;background-color:{color:accent};"><b><span style="color:white;">LAST NOTES</span></b></h1>
  1376.  
  1377. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">If Sora has so much development with a character that playing with a duplicate could be considered disrespectful, I reserve the right to put priority over the original.
  1378. <p style="font-family:calibri,helvetica,arial,sans-serif;color:{color:body font};">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.
  1379.  
  1380. </div>
  1381.  
  1382. <div id="story" 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}">
  1383.  
  1384. <div id="headerbar">
  1385. <ul id="tabs">
  1386. <li class="active">main</li>
  1387. <li>stats</li>
  1388. <li>history</li>
  1389.  
  1390. </ul></div>
  1391. <div id="tabbar">
  1392. <ul id="tab">
  1393.  
  1394.  
  1395. <li class="active" style="color:{color:body font};">
  1396.  
  1397. <table style="width:400px;color:{color:body font};">
  1398. <tr><h1 style="text-align:center;background-color:{color:accent};color:white;letter-spacing:2px;padding-top:5px;height:20px;font-size:20px;">ROKUTA SORA</h1></tr>
  1399. <tr><td style="width:200px;">
  1400. <b>birth name:</b> elipo piran paz lagojir</span><br>
  1401. <b>birthday:</b> 20 april (21 years) <br>
  1402. <b>orientation:</b> panromantic demisexual<br>
  1403. <b>location:</b> ikebukuro, tokyo<br>
  1404. <b>pets:</b> 2.5 cats<br>
  1405. <b>height:</b> 178 cm (5'10")<br>
  1406. <b>mbti:</b> enfp <br>
  1407. <b>allergies:</b> meat, supposedly
  1408. </td><td style="width:200px;">
  1409. <b>online handle:</b> mikan<br>
  1410. <b>professional alias:</b> ciel lavoie<br>
  1411. <b>job:</b> chef, clothier</a><br>
  1412. <b>p.o.b:</b> lokth, kanwafan, morinaje <br>
  1413. <b>species:</b> kanwafan alien<br>
  1414. <b>weight:</b> 62 kg, give or take<br>
  1415. <b>intelligence:</b> languages <br>
  1416. <b>trivia:</b> pacifist
  1417. </td></tr></table>
  1418. <table style="color:{color:body font};"><tr><td>
  1419. <b>likes:</b> fashion, Sinatra, action films, shoujo manga.<br>
  1420. <b>dislikes:</b> rain, snakes, opera, modern art.<br>
  1421. <b>disposition:</b> amiable, energetic, flaky, gullible.<br>
  1422. <b>phobias:</b> magicians, Cumberbatch, losing loved ones.<br>
  1423. <b>strengths:</b> savate, capoeira, empathy, sewing, cooking, dancing. Good listener.<br>
  1424. <b>weaknesses:</b> loud sounds, planning ahead, singing. Can be clingy. Flippant.<br>
  1425. <b>dream:</b> for his designs to be worn by every human on earth.<br>
  1426. <b>extras:</b> carries a guitar on his back; can't play it well...<br>
  1427. <b>current concern:</b> he smells too girly (like vanilla).
  1428. </td></tr>
  1429.  
  1430. <tr><td><center><b>PHYSICAL</b></center></td></tr>
  1431. <tr><td>With twinkling honey eyes and shaggy brown hair, Sora looks every bit an overgrown energetic puppy. Broad-shouldered and wiry-limbed, he is particularly athletic, as evidenced by the myriad of scars littering his body. His legs are long and powerful, with arms to match. His waist, already particularly narrow, looks all the more slim when contrasted with his shoulders. His face, however, reminds soft and rounded, ever-smiling. <br><br>He keeps his nails long and sometimes painted. His canines are partiularly sharp. He tends to dress for colder weather, including turtlenecks, scarves, or fur-lined jackets. Each of his earlobes is pierced. He prefers to wear small hoops.</td></tr>
  1432. </div></td>
  1433.  
  1434. </table>
  1435.  
  1436. </li>
  1437.  
  1438. <li style="color:{color:body font};"><h1 style="text-align:center;background-color:{color:accent};color:white;letter-spacing:2px;padding-top:5px;height:20px;font-size:20px;">THE BASICS</h1>
  1439.  
  1440. <p>&nbsp; &nbsp; &nbsp; &nbsp; Do not listen to what Sora tells you. He is not an alien, no matter how much he believes he may be one. A space cadet, maybe, but not an alien. However, he did always feel a bit <em>alien</em>ated from his family, as his parents focused the bulk of their attention on his older brother, Kenta, priming him for his future as a politician in their footsteps.
  1441. <p>&nbsp; &nbsp; &nbsp; &nbsp; Sora strongly believes that he was abducted by aliens when he was a child. He thinks that they experimented on him, picking at his brain or else transplanting it into the vessel he is today. Why would they do this? He asserts that they sent him to spread the message of love and peace across the planet, to better prepare it for when the aliens finally make their landing.
  1442. <p>&nbsp; &nbsp; &nbsp; &nbsp; Because of the gap between him and Kenta, Sora moved from Osaka to Tokyo upon entering high school, staying with renowned science fiction author and family friend, Kanzaki Naota. Despite this, he is still on good terms with his little sister, Yua, who got him into makeup and fashion and encouraged him to start an online clothing boutique under the name &ldquo;Ciel Lavoie.&rdquo;
  1443. <p>&nbsp; &nbsp; &nbsp; &nbsp; So far, he's enjoyed his stay in Tokyo. It's not as great as Osaka in his eyes, but it's fun in its own ways. He appreciates the opportunity to make his own way in life, rather than live in the shadow of Kenta.
  1444. </tr></p>
  1445.  
  1446. </li>
  1447. </ul> <!--- important. don’t delete --->
  1448.  
  1449.  
  1450. </div></div></div></div></div></div></div></div></div></div></div></div></div></div>
  1451.  
  1452. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement