Advertisement
Demi-monde

Konnor

Jul 28th, 2019
158
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.12 KB | None | 0 0
  1. <!--INSERT INTO HEADER-->
  2.  
  3. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  4.  
  5. <script>
  6. function openAlytut(evt, alytutName) {
  7. var i, x, tablinks;
  8. x = document.getElementsByClassName("alytut");
  9. for (i = 0; i < x.length; i++) {
  10. x[i].style.display = "none";
  11. }
  12. tablinks = document.getElementsByClassName("tablink");
  13. for (i = 0; i < x.length; i++) {
  14. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  15. }
  16. document.getElementById(alytutName).style.display = "block";
  17. evt.currentTarget.className += " tabzact";
  18. }
  19. </script>
  20.  
  21. <script type="text/javascript" src="https://static.tumblr.com/8pnyeus/10hors8sn/themekid-popup.min.js"></script>
  22. <script type="text/javascript">
  23. $(document).ready(function(){
  24. popUp(true);
  25. });
  26. </script>
  27.  
  28. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css">
  29.  
  30.  
  31.  
  32. <!--INSERT INTO STYLE BOX-- -- DO NOT BUT THE STYLE TYPE IN -->
  33.  
  34. <style type="text/css">
  35.  
  36. /* FROM HERE INTO STYLE
  37.  
  38. */
  39.  
  40. @import url(https://fonts.googleapis.com/css?family=ABeeZee:700);
  41. @import url(https://fonts.googleapis.com/css?family=Lato:400,400i,700,700i);
  42. @import url('https://fonts.googleapis.com/css?family=Abril+Fatface|Open+Sans|Kristi|ABeeZee');
  43.  
  44.  
  45.  
  46.  
  47.  
  48. /* TABS STYLING--
  49. BASE CODE BY ALYOFRP. DO NOT REMOVE THIS CREDIT!
  50. */
  51. .tabz {
  52. margin-top:-57px;
  53. margin-left:0px;
  54. padding:0px;
  55. padding-right:0px;
  56. padding-bottom:0px;
  57. right:-10px;
  58. z-index:9999999999999999;
  59. z-index:99999999999999999999999;
  60. z-index:1000;
  61. width:300px;
  62. position:absolute;
  63. line-height:200%;
  64. text-align:left;
  65. font-family: 'Abril Fatface', cursive;
  66. z-index:1000000000000000000000;
  67. }
  68.  
  69. .tabz a {
  70. padding:0px;
  71. text-align:center;
  72. font-family:arial black;
  73. color:#C39B00;
  74. font-size:12px;
  75. display:inline-block;
  76. margin-left:0px;
  77. margin-top:0px;
  78. transition:.2s;
  79. margin-right:5px;
  80. margin-bottom:16px;
  81. border-radius:4px;
  82. padding:3px;
  83. display:inline-block;
  84. width:20px;
  85. padding-top:4px;
  86. padding-bottom:5px;
  87. border-bottom:2px solid transparent;
  88. -webkit-transition:.2s;
  89. -moz-transition:.2s;
  90. font-family: 'Abril Fatface', cursive;
  91. border:0px solid #0f0f0f;
  92. }
  93.  
  94. .tabz svg {
  95. padding:2px;
  96. margin-right:2px;
  97. width:12px;
  98. text-align:center;
  99. font-family:arial black;
  100. color:#C39B00;
  101. font-size:14px;
  102. display:inline-block;
  103. margin-top:0px;
  104. transition:.2s;
  105. border-radius:5px;
  106. border-bottom:2px solid transparent;
  107. -webkit-transition:.2s;
  108. -moz-transition:.2s;
  109. }
  110.  
  111. .tabz a:hover {/* tablinks hover color */
  112. transition:.2s;
  113. -webkit-transition:.2s;
  114. -moz-transition:.2s;
  115. color:#444;
  116. }
  117.  
  118. .tabzcon { /* tablinks content aka the box under the tablinks */
  119. margin-top:0px;
  120. height:40px;
  121. margin-left:15px;
  122. padding:10px;
  123. padding-top:5px;
  124. position:absolute;
  125. z-index:9999999999999999999999999999999999;
  126. width:300px;
  127. padding-left:10px;
  128. border-radius:0px;
  129. position:fixed;
  130. overflow:auto;
  131. overflow-x:hidden;
  132. padding-top:10px;
  133. padding-right:20px;
  134. margin-top:185px;
  135. margin-left:302px;
  136. }
  137.  
  138.  
  139.  
  140.  
  141. ::-webkit-scrollbar-thumb {
  142. height:auto;
  143. background-color:;
  144. margin-left:1px;
  145. display:none;
  146. }
  147.  
  148. ::-webkit-scrollbar {
  149. height:9px;
  150. width:1px;
  151. background-color:transparent;
  152. }
  153.  
  154. ::-webkit-scrollbar-thumb {
  155. background:transparent;
  156. }
  157.  
  158. ::-webkit-scrollbar-corner {
  159. background:transparent;
  160. }
  161.  
  162. body {
  163. background:#070707;
  164. margin-top:-40px;
  165. margin-left:-50px;
  166. color:#9f9f9f;
  167. font-family: 'ABeeZee', sans-serif;
  168. line-height:15px;
  169. font-size:12px;
  170. letter-spacing:0px;
  171. text-align:justify;
  172. width:701px;
  173. height:385px;
  174. margin:auto;
  175. margin-top:20px;
  176. background-image:url('https://static.tumblr.com/c020e603c6974a3c3ef81e80ad76763b/1sj7tra/Z9Wpkkkvr/tumblr_static_culjervjdeoko4ogk8k8s4kos.png');
  177. }
  178.  
  179. sup, sub, small {
  180. font-size:9px;
  181. }
  182.  
  183. a {
  184. text-decoration:none;
  185. outline:none;
  186. -moz-outline-style:none;
  187. color:#C39B00;
  188. }
  189.  
  190. big {
  191. text-decoration:none;
  192. outline:none;
  193. -moz-outline-style:none;
  194. color:#C39B00;
  195. }
  196.  
  197.  
  198.  
  199. /*CONTAINER*/
  200. #container {
  201. margin-top:4px;
  202. margin-left:312px;
  203. margin-right:auto;
  204. width:350px;
  205. max-height:346px;
  206. text-align:left;
  207. position:fixed;
  208. padding-left:0px;
  209. padding-top:0px;
  210. }
  211.  
  212.  
  213. /*ENTRIES*/
  214. #entries {
  215. position:fixed;
  216. height:385px;
  217. width:546px;
  218. margin-left:100px;
  219. margin-top:115px;
  220. border:1px solid #0f0f0f;
  221. background:#121212;
  222. box-shadow:0px 0px 0px #222;
  223. padding-top:0px;
  224. border-radius:0px;
  225. padding-top:75px;
  226. background-image:url('');
  227. z-index:0;}
  228.  
  229.  
  230. #entries2 {
  231. position:fixed;
  232. height:440px;
  233. width:120px;
  234. margin-left:-20px;
  235. margin-top:115px;
  236. border:1px solid #0f0f0f;
  237. background:#000000;
  238. box-shadow:0px 0px 0px #222;
  239. padding-top:20px;
  240. background-image: url('https://media.giphy.com/media/MHGpNXUrj9jry/giphy.gif');
  241. background-size:cover;
  242. background-repeat:no-repeat;
  243. background-position:center center;
  244. background-attachment:absolute;
  245. -webkit-filter: grayscale(100%);
  246. }
  247.  
  248. #entries3 {
  249. position:fixed;
  250. height:440px;
  251. width:120px;
  252. margin-left:640px;
  253. margin-top:115px;
  254. border:1px solid #0f0f0f;
  255. background:#000000;
  256. box-shadow:0px 0px 0px #222;
  257. padding-top:20px;
  258. background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTQGQ5Zf2SOIWxIdrx5GdTQ6nutoFOrK9f1PJp0YtEX2RL1cFW0');
  259. background-size:cover;
  260. background-repeat:no-repeat;
  261. background-position:center center;
  262. background-attachment:absolute;
  263. -webkit-filter: grayscale(100%);
  264. }
  265.  
  266.  
  267. .quote {
  268. position: fixed;
  269. width:195px;
  270. Height: 50px;
  271. letter-spacing:2px;
  272. padding:10px;
  273. font-size:9px;
  274. border:0px solid #222;
  275. line-height:15px;
  276. text-align:center;
  277. color:#aaa;
  278. border-radius:0px;
  279. font-size:25px;
  280. font-family:'Kristi', cursive;
  281. text-decoration: lowercase;
  282. margin-top: 320px;
  283. margin-left: -20px;}
  284.  
  285.  
  286.  
  287. /*SIDEBAR*/
  288.  
  289. #description {
  290. border-left:0px solid #0f0f0f;
  291. padding:15px;
  292. font-family:;
  293. position:fixed;
  294. width:195px;
  295. height:355px;
  296. padding-left:9px;
  297. overflow-y:scroll;
  298. font-size:10px;
  299. margin-top:30px;
  300. line-height:21px;
  301. padding-top:0px;
  302. color:#9f9f9f;
  303. opacity:1;
  304. border-radius:10px;
  305. margin-left:-25px;
  306. text-align:justify;
  307. text-transform:uppercase;
  308. background:transparent;
  309. font-family: 'ABeeZee', sans-serif;
  310. letter-spacing:1px;
  311. background:rgba(0,0,0, 0);
  312. float:right;
  313. word-break:break-all;}
  314.  
  315.  
  316.  
  317. #jun {
  318. width:305px;
  319. height:140px;
  320. margin-top:-5px;
  321. margin-left:0px;
  322. background:#;
  323. border-top-left-radius:0px;
  324. border-top-right-radius:0px;
  325. }
  326.  
  327. #jun img {
  328. width:305px;
  329. height:140px;
  330. border-top-left-radius:0px;
  331. border-top-right-radius:0px;
  332. margin-left:15px;
  333. -webkit-filter: grayscale(100%);
  334.  
  335. }
  336.  
  337. #hosh {
  338. text-transform:lowercase;
  339. padding:15px;
  340. width:275px;
  341. height:220px;
  342. padding-top:10px;
  343. padding-bottom:25px;
  344. overflow:scroll;
  345. line-height:18px;
  346. font-size:12px;
  347. letter-spacing:1px;
  348. font-style:lowercase;
  349. border:1px solid #222;
  350. border-bottom-right-radius:0px;
  351. border-top:0px;
  352. border-bottom-left-radius:0px;
  353. margin-left:15px;}
  354.  
  355.  
  356. #gyu {
  357. letter-spacing:5px;
  358. margin-top:10px;
  359. font-style:italic;
  360. text-align:center;
  361. width:280px;
  362. margin-left:20px;
  363. font-weight:400;
  364. font-family:mint;
  365. font-size:60px;}
  366.  
  367.  
  368.  
  369. b, strong {
  370. color:#FFD700;
  371. }
  372.  
  373. #description b, strong {
  374. text-transform:uppercase;
  375. letter-spacing:2px;
  376. font-size:8px;
  377. line-height:50%;
  378. font-family:georgia;
  379. }
  380.  
  381. #description u {
  382. text-decoration:none;
  383. border-bottom:1px solid #0f0f0f;
  384. padding-bottom:1px;
  385. }
  386.  
  387.  
  388.  
  389. @font-face{ font-family:mint; src:url('https://static.tumblr.com/y3tw76x/82Joyt2hm/taken_by_vultures_alternates_demo.ttf');}
  390. @font-face{ font-family:jitzu; src:url('https://dl.dropboxusercontent.com/s/xevtke3dlevbvi0/JITZU-SWASH-MEDIUM.OTF');}
  391.  
  392.  
  393.  
  394. #tt {
  395. position:absolute;
  396. font-size:100px;
  397. text-align:center;
  398. word-spacing:-0px;
  399. margin-top:-50px;
  400. letter-spacing:1px;
  401. text-transform:lowercase;
  402. font-family: 'Kristi', cursive;
  403. left:-11px;
  404. width:200px;
  405. word-spacing:0px;
  406. padding-left:0px;
  407. line-height:20%;
  408. z-index:999999999999999999999999999999999999999999999999999999;
  409. color:#FFD700;
  410. transform:rotate(0deg);
  411. text-shadow:2px 2px 0px rgba(0,0,0,0);
  412. }
  413.  
  414. #tt a {
  415. color:#FFD700;
  416. }
  417.  
  418.  
  419. #tt2 {
  420. font-family:'ABeeZee', sans-serif;
  421. font-size:10px;
  422. text-transform:uppercase;
  423. letter-spacing:3px;
  424. word-spacing:0px;
  425. text-align:center;
  426. width:150px;
  427. margin-left:5px;
  428. margin-top:17px;
  429. padding:0px;
  430. background:#070707;
  431. position:relative;
  432. padding-left:15px;
  433. padding-right:15px;
  434. z-index:-10000;
  435. transform:rotate(1deg);
  436. color: #aaaa;}
  437.  
  438. #box{
  439. padding:10px;
  440. padding-right:150px;
  441. z-index:-9999;
  442. position:fixed;
  443. margin-top:175px;
  444. background:transparent;
  445. font-size:10px;
  446. margin-left:120px;
  447. width:520px;
  448. height:2px;
  449. width:500px;
  450. border:0px solid #0f0f0f;
  451. color:#FFD700;
  452. border-radius:10px;
  453. font-family:'arial';
  454. opacity:1;
  455. z-index:10000;
  456. }
  457.  
  458.  
  459.  
  460. .friendpic {
  461. border: 1px solid #FFD700;
  462. width: 100px;
  463. height: 100px;
  464. margin: 7px;
  465. border-radius: 50%;
  466. padding: 0;
  467. -webkit-transition: 0.5s linear;
  468. -moz-transition: 0.5s linear;
  469. -o-transition: 0.5s linear;
  470. transition: 0.5s linear;
  471. }
  472.  
  473. .friendpic:hover {
  474. border: 1px solid #FFD700;
  475. border-radius: 50%;
  476. }
  477.  
  478. /* FROM HERE aABOVE INTO STYLE
  479. DO NOT PUT <./style>
  480. */
  481.  
  482. </style>
  483.  
  484. <!--INSERT INTO BODY EVERYTHING BELOW-->
  485.  
  486.  
  487. <div id="TabzOne" class="tabzcon alytut" style="display:block; background:transparent; overflow:visible;margin-top:150px;">
  488.  
  489.  
  490. <div id="jun">
  491. <img src="http://img4.bdbphotos.com/images/700x350/5/d/5djx2svfd6v36x2.jpg?skj2io4l">
  492. </div>
  493.  
  494. <div id="hosh">
  495. <strong> &nbsp;&ndash; &#9825;&nbsp;</strong>
  496. Konnor can be quite an idiot at times. He's forever cracking a joke or his comments are sarcastic. Full of energy, far more than the average person and always, always grinning.
  497.  
  498. </div>
  499.  
  500. <div id="gyu">
  501. Personality
  502. </div>
  503. </div>
  504.  
  505.  
  506. <div id="TabzTwo" class="tabzcon alytut" style="display:none; background:transparent; overflow:visible;margin-top:150px;">
  507. <div id="jun">
  508. <img src="http://www.wallpapermania.eu/images/lthumbs/2015-09/8335_Cool-actor-Matt-Lanter-in-white-shirt.jpg">
  509. </div>
  510.  
  511.  
  512. <div id="hosh">
  513. <strong> &nbsp;&ndash; &#9825;&nbsp;</strong>
  514. Konnor was not born in the conventional sense. In fact, he was made, summoned, created for the sole purpose of shielding those The Order deemed necessary to protect. Given the task of watching over 'specials', be it human, Fae, lycans, witches or mages. Entrusted with a set of skills, and marked by a symbol, a chosen few are sent out on the mission to protect. And it is to the death.
  515. </p>
  516. <p>
  517. A grueling and intense training regime that lasts a period of four years, in which time Konnor is assigned his first witch. It wasn't without trial and error however, and the young familiar grew a strong attachment to the witchling. It wasn't to be however, and Konnor risked his life only for the witch to perish at the hands of those that sought to eradicate any form of unnatural beings.
  518. He returned to Nibiru, a place where the Elders reside and teach the young ones the ways in which they abide. There, the Order is etablished, governed by twelve individuals whose souls are as ancient as the Gods themselves.
  519. </p>
  520. <p>
  521. Over the decades, Konnor is assigned to others, though some are fleeting. Until he is sanctioned to protect one of the 'Few'. Not much is known about this grouping, though their power is immense. One can go through an entire existance without knowing they are of those Few. Konnor was entrusted to one, keeping his presence near untraceable until those abilities begane to take form.A tradegy took the sanity of the mage and it was that Konnor lay down his life, sacrificing his existence in order to save the one he was chosen to protect. It was the only way he knew how. He gifted the mage with his own shifting abilities, giving up everything to see his promise held true.Death does not stop a familiar's reign. The body is recovered, consecrated and reborn. From the very ashes in which scorching fire burns the flesh to cinders. A blank slate, save for the one burning purpose branded into each familiar's soul. Protect.
  522.  
  523. </div>
  524.  
  525. <div id="gyu">
  526. History
  527. </div>
  528.  
  529. </div>
  530.  
  531.  
  532. <div id="TabzThree" class="tabzcon alytut" style="display:none; background:transparent; overflow:visible;margin-top:150px;">
  533.  
  534.  
  535.  
  536. <div id="jun">
  537. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTCvSTNCedZkbMTYtsNJEgi1Cj3nJao_u7e7rYsuG9oqiAkYgiz">
  538. </div>
  539.  
  540. <div id="hosh">
  541.  
  542.  
  543. <b>Ability name:</b> Ability description.<br>
  544. <b>Ability name:</b> Ability description.<br>
  545. <b>Ability name:</b> Ability description.<br>
  546. <b>Ability name:</b> Ability description.<br>
  547. <b>Ability name:</b> Ability description.<br>
  548. <b>Ability name:</b> Ability description.<br>
  549. <b>Ability name:</b> Ability description.<br>
  550.  
  551. </div>
  552.  
  553. <div id="gyu">
  554. Abilities
  555. </div>
  556.  
  557. </div>
  558.  
  559. <div id="TabzFour" class="tabzcon alytut" style="display:none; background:transparent; overflow:visible;margin-top:150px;">
  560.  
  561. <div id="jun">
  562. <img src="http://www.wallpapermania.eu/images/lthumbs/2015-09/8335_Cool-actor-Matt-Lanter-in-white-shirt.jpg">
  563. </div>
  564.  
  565. <div id="hosh">
  566.  
  567.  
  568. <b>01.</b> DM Friendly.<br>
  569. <b>02.</b> IC is not OOC. Know the difference.<br>
  570. <b>03.</b> Room RP Preferred.<br>
  571. <b>04.</b> Snowball writer. Shit post to multi para.<br>
  572. <b>05.</b> Story/Smut. Story is adored.<br>
  573. <b>06.</b> Don't be a cunt, I won't be a dick.<br>
  574. <b>07.</b> FC - Matt Lanter<p>
  575.  
  576. <center>
  577. <a target="_blank" href="https://roleplay.chat/profile.php?user=Miette."><img src="https://data.whicdn.com/images/35580939/original.gif" class="friendpic" title="Charge. Friend. Lover. He would lay down his life for her. Also bestest as she made the profile!"></a>
  578. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  579. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  580. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  581. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  582. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  583. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  584. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  585. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  586. </center>
  587.  
  588. </div>
  589.  
  590.  
  591. <div id="gyu">
  592. Out of Character
  593. </div>
  594.  
  595. </div>
  596.  
  597.  
  598. <div id="box">
  599.  
  600. <div id="tt">Konnor.<br>
  601. <div id="tt2">The Koolest Kat</div>
  602. </div>
  603.  
  604. <div class="tabz">
  605. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzOne');" title="reset.">
  606. <i class="icon-reload"></i>
  607. </a>
  608. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzTwo');" title="history.">
  609. <i class="icon-grid"></i>
  610. </a>
  611. <a href="javascript:void(0)" class="tablink" onclick="openAlytut(event, 'TabzThree');" title="abilities.">
  612. <i class="icon-grid"></i>
  613. </span></a>
  614. <a href="javascript:void(0)" class="tablink" onclick="openAlytut(event, 'TabzFour');" title="ooc.">
  615. <i class="icon-grid"></i>
  616. </span></a>
  617. </div>
  618.  
  619.  
  620. <div id="description">
  621. <big>Name:</big><font style=float:right>Konnor</font><br>
  622. <big>Age:</big><font style=float:right>Appears 24</font><br>
  623. <big>Gender:</big><font style=float:right>Male</font><br>
  624. <big>Species:</big><font style=float:right>Familiar</font><br>
  625. <big>Rank:</big><font style=float:right>Rhaeli</font><br>
  626. <big>Hair:</big><font style=float:right>Dark Brown</font><br>
  627. <big>Eyes:</big><font style=float:right>Ice Blue</font><br>
  628. <big>Height:</big><font style=float:right>6'0</font><br>
  629. <big>Weight:</big><font style=float:right>185 pounds</font><br>
  630. <big>Orientation:</big><font style=float:right>Heterosexual</font><br>
  631. <big>Status:</big><font style=float:right>Undisclosed</font><br>
  632. <big>Residence:</big><font style=float:right>Nibiru</font><br>
  633. </div>
  634.  
  635. <div class="quote">"It's a kinda Magic"</div>
  636.  
  637.  
  638. </div>
  639. </div>
  640. <div id="entries2"></div><div id="entries3"></div>
  641. <div id="entries">
  642. <div id="container">
  643.  
  644. </div>
  645.  
  646.  
  647. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement