Advertisement
tsiappoworks

shouhei for mapo

Jan 13th, 2018
163
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.49 KB | None | 0 0
  1. <!-------Background pattern from Subtle Patterns------->
  2.  
  3. <!DOCTYPE html>
  4.  
  5. <link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700,700i|Questrial|Permanent+Marker" rel="stylesheet">
  6.  
  7.  
  8. <!----------------------POPUP_BLOCK SCRIPT BELOW-------------------------->
  9. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  10.  
  11. <script type="text/javascript" src="http://static.tumblr.com/8pnyeus/10hors8sn/themekid-popup.min.js"></script>
  12. <script type="text/javascript">
  13. $(document).ready(function(){
  14. popUp(true);
  15. });
  16. </script>
  17. <!-------------------- VERSES SCRIPT BELOW -------------------->
  18. <script>
  19.  
  20. $(document).ready(function(){
  21. $(“ul#tabs li”).click(function(e){
  22. if (!$(this).hasClass(“active”)) {
  23. var tabNum = $(this).index();
  24. var nthChild = tabNum+1;
  25. $(“ul#tabs li.active”).removeClass(“active”);
  26. $(this).addClass(“active”);
  27. $(“ul#tab li.active”).removeClass(“active”);
  28. $(“ul#tab li:nth-child(”+nthChild+“)”).addClass(“active”);
  29. }
  30. });
  31. });
  32.  
  33. </script>
  34.  
  35. <script src="http://static.tumblr.com/dxh5xq2/v6Gn8ju1e/tabs.js"></script>
  36.  
  37. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  38. <link rel="shortcut icon" href="" />
  39. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  40.  
  41. <meta name="color:Accent" content="#637468" />
  42. <meta name="color:Accent2" content="#b58c0c" />
  43. <meta name="color:Accent3" content="#cd6d54" />
  44. <meta name="color:Body Font" content="#5a524a" />
  45. <meta name="color:Borders" content="#738574" />
  46. <meta name="color:Box Borders" content="#827d62" />
  47.  
  48. <script type="text/javascript" src="http://static.tumblr.com/86jccts/wpsmuemne/hoverqtip.js"></script>
  49.  
  50. <style type="text/css">
  51.  
  52. ::-webkit-scrollbar-thumb{
  53. background-color: transparent;
  54. height:auto;
  55. }
  56.  
  57. ::-webkit-scrollbar {
  58. background-color:transparent;
  59. height:auto;
  60. width:4px;
  61. }
  62.  
  63. html {
  64. background-color:#fafafa;
  65. background:url('https://static.tumblr.com/7ephyrd/DlQp21yl2/seigaiha_colored_tan.png') repeat;
  66. }
  67.  
  68. hr {
  69. border: 0;
  70. height: 1px;
  71. background-image: linear-gradient(to right, rgba(55, 62, 33, 0), rgba(55, 62, 33, 0.75), rgba(55, 62, 33, 0));
  72. }
  73.  
  74. h1 {
  75. font-weight:normal;
  76. font-size:22px;
  77. text-align:center;
  78. font-style:normal;
  79. line-height:100%;
  80. letter-spacing:1px;
  81. text-transform:normal;
  82. color:{color:accent2};
  83. font-family: 'Oswald', sans-serif;
  84. }
  85.  
  86. h2 {
  87. font-size:26px;
  88. text-align:center;
  89. line-height:100%;
  90. letter-spacing:-0.5px;
  91. color:{color:accent2};
  92. font-weight:bold;
  93. padding:5px;
  94. font-family: 'Oswald', sans-serif;
  95. }
  96.  
  97. blockquote {
  98. padding:5px 5px 5px 10px;
  99. margin:5px;
  100. border-left:2px solid {color:accent3};
  101. }
  102.  
  103. blockquote img {
  104. max-width:100%;}
  105.  
  106. body {
  107. color:{color:body font};
  108. font-size:10px;
  109. line-height:120%;
  110. word-wrap: break-word;
  111. font-family: 'Montserrat', helvetica, arial, sans-serif;
  112. }
  113.  
  114. pre {
  115. white-space: pre-wrap;
  116. white-space: -moz-pre-wrap;
  117. white-space: -pre-wrap;
  118. white-space: -o-pre-wrap;
  119. word-wrap: break-word;
  120. }
  121.  
  122. small {
  123. font-size:11px;
  124. font-family: 'Montserrat',helvetica,arial,sans-serif;
  125. }
  126.  
  127. sub,sup {
  128. font-size:10px;
  129. font-family: 'Montserrat',helvetica,arial,sans-serif;
  130. }
  131.  
  132. b,strong {
  133. color:{color:accent2};
  134. font-size:15px;
  135. font-family: 'Questrial',helvetica,arial,sans-serif;
  136. }
  137.  
  138. em,i {
  139. color:{color:accent2};
  140. font-family: 'Questrial',helvetica,arial,sans-serif;
  141. }
  142.  
  143. s,strike {
  144. color:{color:accent2};
  145. }
  146.  
  147. u,underline {
  148. color:{color:accent2};
  149. }
  150.  
  151. a {
  152. text-decoration:none;
  153. outline:none;
  154. -moz-outline-style:none;
  155. color:{color:accent2};
  156. -moz-transition-duration:0.5s;
  157. -webkit-transition-duration:0.5s;
  158. -o-transition-duration:0.5s;
  159. }
  160.  
  161. a:hover {
  162. outline:none;
  163. -moz-outline-style:none;
  164. color:{color:accent};
  165. }
  166.  
  167. img{border:0; max-width:100%;max-height:auto;}
  168.  
  169. .fancytitle {
  170. font-size:10px;
  171. font-family: 'Questrial', sans-serif;
  172. padding:2px 4px;
  173. letter-spacing:1.7px;
  174. text-align:center;
  175. margin-bottom:5px;
  176. color:#f9fcfc;
  177. background: #9ac4eb; /* Old browsers */
  178. background: -moz-linear-gradient(left, {color:accent} 0%, {color:accent2} 100%); /* FF3.6-15 */
  179. background: -webkit-linear-gradient(left, {color:accent} 0%,{color:accent2} 100%); /* Chrome10-25,Safari5.1-6 */
  180. background: linear-gradient(to right, {color:accent} 0%,{color:accent2} 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  181. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7cb2d4', endColorstr='#84d7a0',GradientType=1 ); /* IE6-9 */
  182. border-radius:5px;
  183. }
  184.  
  185. #fancylink a{
  186. display:inline-block;
  187. width:100%;
  188. font-size:12px;
  189. font-family: 'Questrial',helvetica,arial,sans-serif;
  190. margin-top:2px;
  191. padding:2px 0px;
  192. border-left:4px double {color:borders};
  193. text-align:center;
  194. margin-bottom:5px;
  195. color:#D7C9B1;
  196. background:{color:accent};
  197. border-radius:0px 10px 10px 0px;
  198. }
  199.  
  200. #fancylink a:hover {
  201. border-left:4px double {color:accent2};
  202. color:{color:accent};
  203. background:#D7C9B1;
  204. }
  205.  
  206. #container {
  207. position: absolute;
  208. margin: auto;
  209. top: 0;
  210. right: 0;
  211. bottom: 0;
  212. left: 0;
  213. width:750px;
  214. height:100%;
  215. }
  216.  
  217. .corners {
  218. position: absolute;
  219. width: 160px;
  220. margin-top:25%;
  221. margin-bottom:25%;
  222. height:50%;
  223. padding: 1px;
  224. }
  225.  
  226. .top, .bottom {
  227. position: absolute;
  228. width: 160px;
  229. height: 50px;
  230. }
  231.  
  232. .top {
  233. top: 0;
  234. border-top: 1px solid {color:box borders};
  235. }
  236.  
  237. .bottom {
  238. bottom: 0;
  239. border-bottom: 1px solid {color:box borders};
  240. }
  241.  
  242. .left {
  243. left: 0;
  244. border-left: 1px solid {color:box borders};
  245. }
  246.  
  247. .right {
  248. right: 0;
  249. border-right: 1px solid {color:box borders};
  250. }
  251.  
  252. #left{
  253. display:block;
  254. float:left;
  255. height:100%;
  256. width:140px;
  257. padding:0px 10px;
  258. z-index:99999;
  259. position: relative;
  260. background-color:rgba(212,202,184,1);
  261. }
  262.  
  263. .corners2 {
  264. position: absolute;
  265. width: 526px;
  266. height:90%;
  267. margin-top:5%;
  268. margin-bottom:5%;
  269. padding: 1px;
  270. right:0;
  271. }
  272.  
  273. .top2, .bottom2 {
  274. position: absolute;
  275. width: 160px;
  276. height: 50px;
  277. }
  278.  
  279. .top2 {
  280. top: 0;
  281. border-top: 1px solid {color:box borders};
  282. }
  283.  
  284. .bottom2 {
  285. bottom: 0;
  286. border-bottom: 1px solid {color:box borders};
  287. }
  288.  
  289. .left2 {
  290. left: 0;
  291. border-left: 1px solid {color:box borders};
  292. }
  293.  
  294. .right2 {
  295. right: 0;
  296. border-right: 1px solid {color:box borders};
  297. }
  298.  
  299.  
  300. #right{
  301. display:block;
  302. float:right;
  303. background-color:rgba(212,202,184,1);
  304. height:100%;
  305. width:526px;
  306. overflow-y:auto;
  307. overflow-x:hidden;
  308. position: relative;
  309. }
  310.  
  311.  
  312. #post {
  313. margin:0px 0px 0px 3px;
  314. width:500px;
  315. padding:10px 10px;
  316. background-color:transparent;
  317. font-family: 'Montserrat',helvetica,arial,sans-serif;
  318. color:{color:body font};
  319. }
  320.  
  321. #post .text{font-size:10.5px; line-height:150%;}
  322. #post .title{font-size:20px;;line-height:22px;}
  323. #post .text ul li{list-style-type:circle;}
  324.  
  325.  
  326. div#qTip {
  327. font-size:10px;
  328. font-family: 'Questrial', sans-serif;
  329. padding:2px 4px;
  330. letter-spacing:1.7px;
  331. text-align:center;
  332. margin-bottom:5px;
  333. color:#f9fcfc;
  334. background: {color:accent}; /* Old browsers */
  335. background: -moz-linear-gradient(left, {color:accent} 0%, {color:accent2} 100%); /* FF3.6-15 */
  336. background: -webkit-linear-gradient(left, {color:accent} 0%, {color:accent2} 100%); /* Chrome10-25,Safari5.1-6 */
  337. background: linear-gradient(to right, {color:accent} 0%, {color:accent2} 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  338. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7cb2d4', endColorstr='#84d7a0',GradientType=1 ); /* IE6-9 */
  339. border-radius:5px;
  340. border:1px solid white;
  341. display: none;
  342. text-align: center;
  343. position: absolute;
  344. line-height:10px;
  345. z-index: 9999999;
  346. margin-left:11px;
  347. margin-top:7px;
  348. }
  349.  
  350. #permalink{
  351. z-index:9;
  352. padding:3px;
  353. font-size:10px;
  354. text-align:center;
  355. text-transform:uppercase;
  356. font-family: 'Montserrat',helvetica,arial,sans-serif;
  357. color:{color:accent};
  358. width:400px;
  359. border-top:1px solid {color:borders};
  360. border-bottom:1px solid {color:borders};
  361. margin:0 auto 10px;
  362. }
  363.  
  364. #permalink a{color:{color:accent};vertical-align:middle;}
  365. #permalink a:hover{color:{color:accent2};}
  366.  
  367. #tags{
  368. font-size:10px;
  369. font-family:calibri,helvetica,arial,sans-serif;
  370. width:400px;
  371. text-align:center;
  372. margin:0 auto 40px;
  373. }
  374.  
  375. /*------------------------EXTRA BITS AND BOBBLES----------------------*/
  376. .chat ul {list-style:none; margin:0; padding:0;}
  377. .chat li {font-size:11px;list-style-type: none;margin-left: 0px;padding: 3px;}
  378.  
  379. #notesbox{width:500px;margin:20px auto;font-size:11px;font-family:calibri,helvetica,arial,sans-serif;}
  380. #notesbox ol.notes{list-style-type:none;margin:7px 0px;padding:0px 0px;}
  381. #notesbox img.avatar{display:none;}
  382.  
  383. /*------------------- "SIDEBAR" ------------------*/
  384. #linkback a{
  385. color:{color:body font};
  386. }
  387.  
  388. #navigation a{color:{color:accent2}; font-size:15px;}
  389.  
  390. #navigation a:hover{
  391. color:{color:accent}; text-decoration:bold;
  392. }
  393.  
  394. #pagination{
  395. font-family:Calibri, Helvetica, Arial, sans-serif;
  396. font-size:10px;
  397. text-align:center;
  398. color:{color:accent2};
  399. text-transform:uppercase;
  400. letter-spacing:3px;
  401. }
  402.  
  403. #pagination a{color:{color:accent2}; padding:0px 2px;}
  404.  
  405. /*--------------BITS AND BOBBLES-------------------*/
  406. .question {
  407. padding:9px;
  408. text-align:left;
  409. color:#bb6e8a;
  410. line-height:100%;
  411. -moz-border-radius: 6px;
  412. -webkit-border-radius: 6px;
  413. }
  414.  
  415. .answer {
  416. text-align:left;
  417. padding:7px;
  418. color:#bb6e8a;
  419. }
  420.  
  421. #ask a{color:white;
  422. }
  423.  
  424. .title {
  425. font-family: 'Oswald', sans-serif;/*title font*/
  426. font-size:70px;
  427. padding-top:100px;
  428. text-transform:bold;
  429. }
  430.  
  431. .content {
  432. position:relative;
  433. overflow:hidden;
  434. width:447px;
  435. min-height:75px;
  436. }
  437.  
  438. /* -----------------------TEXT SELECTION CUSTOMIZATION----------------------- */
  439. ::selection {
  440. color:#fff;
  441. background:#0a0a0a;
  442. }
  443.  
  444. ::-moz-selection {
  445. color:#fff;
  446. background:#0a0a0a;
  447. }
  448.  
  449. ::-webkit-selection {
  450. color:#fff;
  451. background:#0a0a0a;
  452. }
  453.  
  454. /* ---------------------------- UPDATES ------------------------------*/
  455.  
  456. #updates {
  457. font-size:10px;
  458. font-family: 'Questrial',helvetica,arial,sans-serif;
  459. color:{color:body font};
  460. text-align:center;
  461. z-index:10;
  462. }
  463.  
  464. #headerbar{
  465. width:100px; /*– sets width of your text –*/
  466. height:525px;
  467. overflow:hidden;
  468. text-align:justify;
  469. position:fixed;
  470. z-index:99999;
  471. color:#fff;
  472. font-family:calibri;
  473. font-size:12px;
  474. margin-left:-150px;
  475. margin-top:210px;
  476. }
  477.  
  478. #tabbar{
  479. left: 50%;
  480. top: 50%;
  481. height: 525px; /*– sets height of your text –*/
  482. overflow-y: scroll;
  483. overflow-x: hidden;
  484. text-align: justify;
  485. color: #222;
  486. font-family: calibri;
  487. font-size: 11.4px;
  488. }
  489.  
  490. ul#tabs {text-align: center;}
  491. ul#tabs li { /*– your inactive / not viewed tabs –*/
  492. display:inline-block;
  493. padding:2px 3px;
  494. width:80px;
  495. cursor:pointer;
  496. text-decoration:none;
  497. margin:0px 2px 4px;
  498. opacity:1;
  499. color:#fff;
  500. background-color:#aca4cd;
  501. border-radius:10px;
  502. border:1px solid #796a81;
  503. }
  504.  
  505. ul#tabs li.active { /*– your active tab –*/
  506. background-color:#fff;
  507. color:{color:accent2};
  508. border:1px solid {color:accent2};
  509. padding:1px 3px;
  510. border-radius:10px;
  511. }
  512.  
  513. ul#tab, ul#tabs{list-style-type:none;margin:0px;padding:0px;}
  514. ul#tab li.active {display: block;}
  515. ul#tab li {display: none;}
  516.  
  517.  
  518. /*--------------------CREDITS-----------------------*/
  519. #cred
  520. {
  521. width: 50px;
  522. height: 18px;
  523. font-family: Arial;
  524. font-size: 8px;
  525. text-transform: uppercase;
  526. text-align: center;
  527. bottom: 10px;
  528. right: 10px;
  529. letter-spacing: 1.2px;
  530. line-height: 4px;
  531. padding: 10px 3px;
  532. display: block;
  533. color:#9E8357;
  534. position: fixed;
  535. }
  536.  
  537. #cred a
  538. {
  539. font-weight: bold;
  540. line-height: 19px;
  541. font-size: 14px;
  542. font-family: 'Oswald', sans-serif;
  543. text-transform: uppercase;
  544. color:#9E8357;
  545. letter-spacing: 6px;
  546. margin-left:2px;
  547. }
  548.  
  549. /*-----------------------------POPUP BOXES---------------------------*/
  550. .popup_block {
  551. padding: 10px;
  552. font-size: 11px;
  553. background-color:rgba(212,202,184,1);
  554. border: 1px solid {color:box borders};
  555. /*don’t change anything below here*/
  556. display: none;
  557. position: fixed;
  558. top: 50%; left: 50%;
  559. margin: auto;
  560. z-index: 99999999;
  561. height:525px;
  562. width:450px;
  563. max-height:70vh;
  564. overflow-y:auto;
  565. overflow-x:hidden;
  566. border-radius:10px;
  567. -webkit-animation: zoom 0.5s;
  568. -moz-animation: zoom 0.5s;
  569. -ms-animation: zoom 0.5s;
  570. -o-animation: zoom 0.5s;
  571. animation: zoom 0.5s;
  572. }
  573. *html .popup_block {
  574. position: absolute;
  575. }
  576.  
  577. @-webkit-keyframes zoom {0% {transform: scale(0);-webkit-transform: scale(0);}100% {transform: scale(1.0);-webkit-transform: scale(1.0);}}@-moz-keyframes zoom {0% {transform: scale(0);-moz-transform: scale(0);}100% {transform: scale(1.0);-moz-transform: scale(1.0);}}@keyframes zoom {0% {transform: scale(0);}100% {transform: scale(1.0);}}
  578.  
  579. *html #fade {position: absolute;}
  580.  
  581. #fade {
  582. display:none;
  583. position:fixed;
  584. left:0px;
  585. top:0px;
  586. width:100%;
  587. height:100%;
  588. z-index:999999;
  589. background: url('https://static.tumblr.com/7ephyrd/DlQp21yl2/seigaiha_colored_tan.png') repeat;
  590. background-color:{color:accent};
  591. opacity:1; /* change to opacity:1; */
  592. }
  593.  
  594. iframe#tumblr_controls {
  595. white-space:nowrap;
  596. -webkit-filter: invert(100%);
  597. -moz-filter: invert(100%);
  598. -o-filter: invert(100%);
  599. -ms-filter: invert(100%);
  600. filter: invert(100%);
  601. opacity:.2;transition: .8s ease-in-out;
  602. -webkit-transition: .8s ease-in-out;
  603. -moz-transition: .8s ease-in-out;
  604. -o-transition: .8s ease-in-out;
  605. }
  606.  
  607. /*-------------------- NAVIGATION SLASH TAGS ---------------------*/
  608. #navigation {
  609. width:425px;
  610. }
  611.  
  612. #navigation-title {
  613. color:#fff;
  614. background-color:{color:accent2};
  615. font-family:Calibri, helvetica, arial, sans-serif;
  616. font-size:12px;
  617. letter-spacing:2px;
  618. margin-bottom:2px;
  619. padding:10px;
  620. margin-top:-10px;
  621. text-decoration:none;
  622. text-align:left;
  623. text-transform:uppercase;
  624. width:425px;
  625. }
  626.  
  627. #navigation-links {
  628. font-family:Calibri, helvetica, arial, sans-serif;
  629. font-size:9px;
  630. text-align:center;
  631. text-transform:uppercase;
  632. width:445px;
  633. }
  634.  
  635. #navigation-links a {
  636. border-bottom:none;
  637. color:#fff;
  638. background-color:{color:accent};
  639. display:inline-block;
  640. padding:10px 0px;
  641. margin-bottom:2px;
  642. width:109.5px;
  643. }
  644.  
  645. #navigation-links a:hover {
  646. background-color:{color:body font};
  647. color:#fff;
  648. border-bottom:0px;
  649. }
  650.  
  651. </style>
  652.  
  653. </head>
  654.  
  655.  
  656. <body style="overflow:hidden;">
  657.  
  658.  
  659. <div id="container">
  660.  
  661. <div class="corners">
  662. <div class="top right"></div>
  663. <div class="bottom left"></div>
  664.  
  665. <div id="left">
  666. <!-- begin updates tab -->
  667. <div id="updates">
  668. <p><b style="font-size:19px;font-family:'Permanent Marker', cursive; color:{color:box borders};">quill and ink</b>
  669. <br><b style="font-size:10px;">ORIGINAL CHARACTER</b><br>
  670. est. dec 2017 by <a href="/mun" title="mundane">MAPO</a>
  671. </p>
  672.  
  673. <!------------------------- NAVIGATION -------------------------->
  674. <img src="http://78.media.tumblr.com/1abb764c5a9c66897cc9c32e200c5952/tumblr_inline_p1t3r720dz1vt7gqn_250.png"><p></p>
  675. <div id="fancylink">
  676. <a href="/">refresh</a>
  677. <a href="/ask">message</a>
  678. <a href="#?w=450" rel="about" class="poplight">about</a>
  679. <a href="#?w=450" rel="navigation" class="poplight">navigation</a>
  680. <a href="#?w=450" rel="verses" class="poplight">verses</a>
  681. <a href="#?w=450" rel="rules" class="poplight">rules</a>
  682. </div>
  683. <!------------------------ NAV END ------------------------------>
  684. {block:Pagination}<div class="fancytitle">pagination</div><p>
  685. {block:NextPage}<a href="{NextPage}" style="color:{color:accent2};font-size:12px;">fall</a>{/block:NextPage}
  686. {block:PreviousPage}&nbsp;&nbsp;&nbsp;<a href="{PreviousPage}" style="color:{color:accent2};font-size:12px;">float</a>{/block:PreviousPage}
  687. </p>{/block:Pagination}
  688.  
  689. </div>
  690.  
  691. <!-- end updates tab -->
  692. </div> </div>
  693.  
  694.  
  695. <div class="corners2">
  696. <div class="top left2"></div>
  697. <div class="bottom right2"></div>
  698. <div id="right">
  699. {block:Posts}
  700.  
  701. <!--------------------------TYPES OF POSTS----------------------------->
  702. <div id="post">
  703.  
  704. {block:Photo}
  705. <img src="{PhotoURL-500}" />
  706. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  707. {/block:Photo}
  708.  
  709. {block:Photoset}
  710. {Photoset-500}
  711. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  712. {/block:Photoset}
  713.  
  714. {block:Video}
  715. {Video-500}
  716. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  717. {/block:Video}
  718.  
  719. {block:Audio}
  720. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  721. {block:TrackName}<strong>{TrackName}</strong>{/block:TrackName}<br/>
  722. {block:Artist}<strong>Artist:&nbsp;</strong>{Artist}{/block:Artist}<br/>
  723. {block:Album}<strong>Album:&nbsp;</strong>{Album}{/block:Album}<br/>
  724. <div class="text">{PlayCountWithLabel}</div>
  725. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  726. {/block:Audio}
  727.  
  728. {block:Quote}
  729. <div style="width:480px;text-align:center;padding-top:10px;font-family:'Permanent Marker', cursive;color:{color:box borders};font-size:25px;line-height:25px;">{Quote}</div>
  730. {block:Source}<div class="text" style="text-align:right;padding-right:50px;"><br/>&mdash;{Source}</div>{/block:Source}
  731. {/block:Quote}
  732.  
  733. {block:Text}
  734. {block:Title}<div style="padding-top:10px;font-family:'Permanent Marker', cursive;font-size:25px;line-height:25px;">{Title}<br/></div>{/block:Title}
  735. <div class="text">{Body}</div>
  736. {/block:Text}
  737.  
  738. {block:Answer}<div id="ask">
  739. <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>
  740. <div class="text" style="text-align:right;color:white;text-decoration:underline:">&mdash;<span style="color:white">{Asker}</span><br/></div></div></div>
  741. <div class="text" style="width:400px;">{Answer}</div>
  742. {/block:Answer}
  743.  
  744. {block:Chat}
  745. {block:Title}<div class="title" style="padding-top:10px;">{Title}<br/></div>{/block:Title}
  746. {block:Lines}<div class="chat"><li class="line_{Alt}">
  747. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}</li></div>
  748. {/block:Lines}
  749. {/block:Chat}
  750.  
  751. {block:Link}
  752. <div style="padding-top:10px;font-family:'Permanent Marker', cursive;font-size:25px;line-height:25px;"><a href="{URL}">{Name}</a></div>
  753. {block:Description}<div class="text">{Description}</div>{/block:Description}
  754. {/block:Link}
  755.  
  756. </div>
  757.  
  758.  
  759. <!---------------------PERMALINK + REBLOG STUFF---------------------->
  760. <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>
  761. </div>
  762.  
  763. {block:HasTags}<div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  764. <!----------------------------TAG STUFF----------------------------->
  765.  
  766.  
  767. {block:PostNotes}
  768. <div id="notesbox">{PostNotes}</div>
  769. {/block:PostNotes}
  770. {/block:Posts}
  771. </div></div></div>
  772.  
  773. </div>
  774.  
  775. <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>
  776.  
  777. </body>
  778.  
  779. <!-------HERE BEGIN THE POPUP BOXES------->
  780. <div id="about" class="popup_block" style="font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font};">
  781.  
  782. <div class="fancytitle" style="font-size:15px;">ABOUT</div>
  783.  
  784. <h1>FACTS.</h1>
  785. <b>First Name :</b> Shouhei<br>
  786. <b>Surname :</b> Kuroki (current), Sasaki (former) <br>
  787. <b>Age :</b> 27 <br>
  788. <b>Birthday :</b> June 1 <br>
  789. <b>Education :</b> Art History, Master's <br>
  790. <b>Occupation :</b> Painter, calligrapher <br>
  791. <b>Housing :</b> Japanese-style house
  792.  
  793. <h1>APPEARANCE.</h1>
  794. <b>Eyes :</b> Raw umber <br>
  795. <b>Hair :</b> Black <br>
  796. <b>Body :</b> Ecto-mesomorph; skinny/lean <br>
  797. <b>Height :</b> 5'11" <br>
  798. <b>Clothes :</b> Business casual (primary), traditional Japanese (secondary)<br>
  799. <b>Faceclaims :</b><br>
  800. - Nifuji Hirotaka<br>
  801. <center><img src="https://78.media.tumblr.com/0c9e29507cac5dc7a7ccaef6dd02c314/tumblr_inline_p0juj0c9el1vt7gqn_540.png"></center>
  802.  
  803. <h1>PERSONALITY.</h1>
  804. <b>Alignment :</b> Lawful neutral (leaning evil) <br>
  805. <b>Myers-Briggs Type :</b> ISTJ-A (The Logistician)<br>
  806. <b>Traits :</b> Calm, well-mannered, detached, passive, disdainful, honest, sharp, well-read, cunning, decisive, self-indulgent, materialistic, persistent, organized, scholarly, artistic, lethargic, reasonable, dutiful <br>
  807. <b>Flaws :</b> Smokes cigarettes, has little regard for the emotions of others, twists situations in his own interest<br><br>
  808.  
  809. <b>Tropes:</b> <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/BrilliantButLazy">Brilliant, but Lazy</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/CulturedBadass">Cultured Badass</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/HonestAdvisor">Honest Advisor</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/TheSpock">The Spock</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/TheAce">The Ace</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/NobleDemon">Noble Demon</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/BadassBookworm">Badass Bookworm</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/GentlemanAndAScholar">Gentleman and a Scholar</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/SophisticatedAsHell">Sophisticated as Hell</a>; <a href="http://tvtropes.org/pmwiki/pmwiki.php/Main/ConsummateProfessional">Consummate Professional</a><br><br>
  810.  
  811. <b>Likes :</b> Hand lettering/calligraphy, history, old book smell, bookbinding, analog media, Edo-Japan aesthetic, hot drinks, traditional clothing <br>
  812. <b>Dislikes :</b> the Sasaki family, his fans/patrons, western food<br><br>
  813.  
  814. <b>Romantic Orientation :</b> Gray/demiromantic <br>
  815. <b>Sexual Orientation :</b> to be discovered
  816.  
  817. <h1>AFFLICTIONS.</h1>
  818. - Depression (undiagnosed)
  819.  
  820. <h1>ORIGIN.</h1>
  821. <b>Ethnicity :</b> Asian<br>
  822. <b>Nationality :</b> Japanese<br>
  823. <b>Hometown :</b> Gion, Kyoto, Japan<br>
  824. <b>Family :</b><br>
  825. - Father: Sasaki Saburo (65)<br>
  826. - Mother: Sasaki Mirai (64)<br>
  827. - Sister: Sasaki Minami (31)<br>
  828.  
  829. <b>Languages:</b>
  830. - Japanese (Native)<br>
  831. - English (Superior)
  832.  
  833. <h1>TRIVIAL.</h1>
  834. -
  835.  
  836. <hr>
  837.  
  838. <p><b>TW: drugs, kidnapping</b>
  839.  
  840. <p>Fame is found in all fields, be it for a distinguishment in acting, inventing, or medicine. For the Sasaki family, based in the Gion district of Kyoto, their prestige is for art--namely, the creation, curation, and archival of art and art historical documentation. The house itself is a studio, each and every occupant skilled as necessary assets to the trade. The family also owns a local museum, where they exhibit ancient art and the family's own art, which reflects and preserves the style produced in past dynasties. The household itself is very traditional; they live in a Japanese-style mansion, their values placed in old-timey, analog features of living yet appreciative of modern-day conveniences such as television, cars, cell phones, and others. They have a long-standing reputation, dating back even centuries ago, for their dedication to the arts and have a worldwide acknowledgement to their skill.
  841.  
  842. <p>Shouhei was born four years after his sister, Minami. Although he is younger, the fact that he was a male made the priority of his education and training much steeper than his sister's, as he would be made the heir of the house. That being said, he grew up under strict discipline, and did not get to have the fun and whimsical childhood that modern-day children would enjoy. Instead, he was raised to enjoy his studies and obsess over his skill in calligraphy and painting, treating his trades in a competitive manner in hopes of out-pacing his sister, whose skill was already comparable to that of their forefathers. However, despite Shouhei's priority in the arts, Minami would never fall behind him--he would never even come close to her level of skill until a tragic day befell the family: she would be kidnapped, not to be seen for two decades. Shouhei, who was only seven at the time, was traumized, but because he mourned the loss of his only sibling. His single source of inspiration and motivation had vanished, and he no longer had a standard to compare his skill to.
  843.  
  844. <p>After the kidnapping incident, Shouhei's development in skill slowed dramatically. His art would not make it into the family's museums until his late teens, when his heart still cling to the last threads of hope that Minami was still out there, alive and well enough to still be in practice. He would travel all over Japan as he produced his works, hoping that he would one day encounter his sister again, up until a few months before present-day, when he would receive a call that Minami was recovered from a human trafficking cartel. In a rush of excitement, he was quick to return back to Gion, only for the last of his sanguine dream and the body of his personality to meet their demise. She was alive, but she was not well. Any bit of who she was as a person had vanished, replaced by a hollow vessel of flesh that would not speak a single coherent word, nor brush a stroke of paint ever again.
  845.  
  846. <p>Devoid of the first and last true motivation in his life, the kind of art that Shouhei produced would take a new style to reflect the death of a once-hopeful man: his works became sharper, angrier, yet forlorn and flat to the touch, as though done through violent yet careful strokes. His audience would eat them right up as the news hit the media, and a profound relationship between Shouhei and his patrons would be born. He hated his sister, and he hated his audience for loving the tragedies of his life, for praising narratives that no man should ever suffer.
  847.  
  848. <p>The next few months would be the ultimate low in his life, up until his patience and his temper were finally lost, and he would leave the household that had cultured him into this forsaken life. Picking up his art and possessions, Shouhei moved to Tokyo, where he bought himself a new house and is now trying to rediscover himself, away from his hardships and in a world where no one besides himself would dictate who he is and how he should proceed. He has gone as far as to cease contact with his family and even have his surname legally changed to Kuroki, but still receives attention from the media because of his pre-established reputation. He continues his work as a renowned artist, his works now kept in a studio that he bought and publicized, where his audience can bid on any of his works.
  849.  
  850. </div></div></div></div></div></div></div></div>
  851.  
  852. <div id="navigation" class="popup_block" style="font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font};">
  853.  
  854. <div class="fancytitle" style="font-size:15px;">NAVIGATION</div>
  855.  
  856. <div id="navigation">
  857.  
  858. <div id="navigation-title" style="margin-top:30px;">general</div>
  859.  
  860. <div id="navigation-links">
  861. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-in-character.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">in character</a>
  862. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-out-of-character.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">out of character</a>
  863. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-crack.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">crack</a>
  864. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-headcanon.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">headcanons</a>
  865.  
  866. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-open.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">open starters</a>
  867. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-starter-call.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">starter call</a>
  868. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-plotting-call.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">plotting call</a>
  869. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-inbox-call.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">inbox call</a>
  870.  
  871. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-promotion.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">promotions</a>
  872. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-psa.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">psa</a>
  873. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-meme.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">memes</a>
  874. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-wishlist.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">wishlist</a>
  875.  
  876. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-thread.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">threads</a>
  877. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-mun.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">mun tag</a>
  878. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-about.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">fillout memes</a>
  879. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-visage.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">visage</a>
  880.  
  881. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-musings.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">musings</a>
  882. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-desires.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">desires</a>
  883. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-wardrobe.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">wardrobe</a>
  884. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-aesthetic.-%29-%C2%A0%E2%9D%9E" style="font-size:11px;">aesthetic</a>
  885.  
  886. <a href="/tagged/%E2%96%B8%E2%80%94%E2%80%94-%28-audio.-%29-%C2%A0%E2%9D%9E%E3%83%BB" style="font-size:11px;">audio</a>
  887. </div>
  888.  
  889. <div id="navigation-title" style="margin-top:30px;">verses</div>
  890.  
  891. <div id="navigation-links">
  892. <a href="#" style="font-size:11px;">tba</a>
  893. </div>
  894.  
  895. <div id="navigation-title" style="margin-top:30px;">ship tags</div>
  896.  
  897. <div id="navigation-links">
  898. <a href="#" style="font-size:11px;">tba</a>
  899. </div>
  900.  
  901. </div></div></div></div></div></div></div></div>
  902.  
  903.  
  904. <div id="verses" class="popup_block" style="font-family:calibri, helvetica, arial, sans-serif;font-size: 11.5px;line-height:15px;overflow:auto;color:{color:body font};">
  905.  
  906. <div class="fancytitle" style="font-size:15px;">UNIVERSES</div>
  907.  
  908. <h1>TIMELINE.</h1>
  909. <b>MAINVERSE</b><br>
  910. > untagged<br>
  911. Living in metropolitan Tokyo, blah blah blah
  912.  
  913. </div></div></div></div></div></div></div></div>
  914.  
  915. <div id="rules" class="popup_block" style="font-family:calibri, helvetica, arial, sans-serif;font-size: 12px;line-height:15px;overflow:auto;color:{color:body font};padding-left:10px;">
  916.  
  917. <div class="fancytitle" style="font-size:15px;">RULES</div>
  918. <p><b>PREFACE.</b> Sasaki Shouhei is, in writing, my own character; created as of December 6, 2017 and subject to only my jurisdiction. Icons were cropped and formatted by me and unavailable for public use. The faceclaim was not created by me and is only a representation of the muse's appearance.
  919.  
  920. <hr>
  921.  
  922. <p><b>ONE.</b> No godmodding. I don't like it when people make implications about how my muse would act. My muse does not flirt or lash out with unprecedented violence, and therefore it should not be implied during interaction.
  923.  
  924. <p><b>TWO.</b> This blog is private & selective; IC asks are also reserved for mutuals only.
  925.  
  926. <p><b>THREE.</b> Shouhei is multiship/multiverse, and that is highly unlikely to change.
  927.  
  928. <p><b>FOUR.</b> The inbox is treated separately from canon; here, almost anything is open game. Shippy asks will be responded to in a shippy manner, but you shouldn't expect me to respond to any continuations unless we have actually plotted a relationship between our muses.
  929.  
  930. <p><b>FIVE.</b> The mun is 21 years old and open to nsfw content including but not limited to sex, violence, drugs, body horror, and other content. All will be tagged accordingly and I will expect you to do the same.
  931.  
  932. <p><b>SIX.</b> I will only write smut with people that I am close to, out of personal preference. Otherwise, most sexual encounters will be implied through a fade-to-black.
  933.  
  934. <p><b>SEVEN.</b> Pre-established platonic relationships are fine with me. However, things like romantic and familial relationships require plotting out of character.
  935.  
  936. <p><b>EIGHT.</b> I'm extremely adverse to prose. My comprehension skills aren't the best and I prefer clarity over clutter; this means that I'm less inclined to follow back anyone that writes in prose but am happy to interact with people that are willing to adjust accordingly
  937.  
  938. <p><b>NINE.</b> Cut your threads down to two replies per post, and don't reply to asks by reblogging them.
  939.  
  940. <hr>
  941.  
  942. <p><b>BUT ALSO,</b><br>
  943. <em>(Shit I Complain About):</em> lack of the word "the" in prose, prose in general tbh, icons smaller than 70x70 because my eyes suffer, untagged drama because it endangers my mental health, antis and callouts that are blown out of proportion.
  944.  
  945. <hr>
  946.  
  947. <p><b>I do not condone</b> and therefore will not roleplay the following:<br>
  948. > pedophilia, incest, noncon, dubcon, or omegaverse (a/b/o verse).<br><br>
  949. <b>PLEASE TAG:</b> nsfw, waterworks, foodplay, abo/omegaverse, drama.
  950.  
  951. <hr>
  952.  
  953. Thanks for reading this far! You can call me <b>Mapo</b>. I'm a 21 year old college student, majoring in art and aiming to become a professor. I've been roleplaying for about 10 years now--eight years on GaiaOnline, and two years here on tumblr. If you'd like to know more about me or if you'd like to plot with me, my <b>discord</b> is available via pm.
  954.  
  955. </div>
  956. </div></div></div></div></div></div>
  957.  
  958. <div id="cred">code by<br><a href="http://waveworn.tumblr.com/">CHE</a></div>
  959.  
  960. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement