RageQxeen

Koro

Jan 22nd, 2020
131
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.80 KB | None | 0 0
  1. <html>
  2. <body>
  3. <script defer>
  4. window.onload = function() {
  5. var isCtrl = false;
  6. document.onkeyup=function(e)
  7. {
  8. if(e.which == 17)
  9. isCtrl=false;
  10. }
  11. document.onkeydown=function(e)
  12. {
  13. if(e.which == 17)
  14. isCtrl=true;
  15. if((e.which == 85) || (e.which == 67) && (isCtrl == true))
  16. {
  17. return false;
  18. }
  19. }
  20. var isNS = (navigator.appName == "Netscape") ? 1 : 0;
  21. if(navigator.appName == "Netscape") document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);
  22. function mischandler(){
  23. return false;
  24. }
  25. function mousehandler(e){
  26. var myevent = (isNS) ? e : event;
  27. var eventbutton = (isNS) ? myevent.which : myevent.button;
  28. if((eventbutton==2)||(eventbutton==3)) return false;
  29. }
  30. document.oncontextmenu = mischandler;
  31. document.onmousedown = mousehandler;
  32. document.onmouseup = mousehandler;
  33.  
  34. if (document.addEventListener) { // IE >= 9; other browsers
  35. document.addEventListener('contextmenu', function(e) {
  36. alert(" Try asking RageQxeen for her codes instead."); //here you draw your own menu
  37. e.preventDefault();
  38. }, false);
  39. } else { // IE < 9
  40. document.attachEvent('oncontextmenu', function() {
  41. alert("O sun, abide to death.");
  42. window.event.returnValue = false;
  43. });
  44. }
  45. };
  46. </script>
  47. <style type="text/css">
  48.  
  49. @import url('https://fonts.googleapis.com/css?family=Bangers|Gelasio|Lora');
  50.  
  51. html, body {
  52. background: rgb(178,138,189);
  53. background: -moz-linear-gradient(180deg, rgba(178,138,189,1) 0%, rgba(131,119,169,1) 25%, rgba(112,110,144,1) 50%, rgba(90,98,126,1) 75%, rgba(69,83,103,1) 100%);
  54. background: -webkit-linear-gradient(180deg, rgba(178,138,189,1) 0%, rgba(131,119,169,1) 25%, rgba(112,110,144,1) 50%, rgba(90,98,126,1) 75%, rgba(69,83,103,1) 100%);
  55. background: linear-gradient(180deg, rgba(178,138,189,1) 0%, rgba(131,119,169,1) 25%, rgba(112,110,144,1) 50%, rgba(90,98,126,1) 75%, rgba(69,83,103,1) 100%);
  56. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b28abd",endColorstr="#455367",GradientType=1);
  57. }
  58.  
  59. ::-webkit-scrollbar-button:vertical:{
  60. background-color: #transparent;}
  61.  
  62. ::-webkit-scrollbar-thumb:vertical {
  63. background-color:#transparent;
  64. height:150px;}
  65.  
  66. ::-webkit-scrollbar-thumb:horizontal {
  67. background-color:#transparent;
  68. height:60px;}
  69.  
  70.  
  71. ::-webkit-scrollbar {
  72. height:60px;
  73. width:5px;
  74. background-color:#transparent;}
  75.  
  76. #image {
  77. width: 35vw;
  78. margin: 0px;
  79. border: none;
  80. height: 40vw;
  81. background-color:transparent;
  82. position: absolute;
  83. right: 1vw;
  84. bottom: 10vw;
  85. background-image:url("http://i.picpar.com/byYd.png");
  86. background-repeat:no-repeat;
  87. background-position: bottom;
  88. background-size: 100%;
  89. -webkit-animation: fade-in-fwd 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
  90. animation: fade-in-fwd 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
  91. }
  92.  
  93. #container {
  94. background-color:#999;
  95. width: 59.5vw;
  96. height: 32vw;
  97. margin:auto;
  98. position: absolute;
  99. padding: 5px;
  100. left: 5vw;
  101. top: 10vw;
  102. z-index:1;
  103. box-shadow: 0px 5px 10px #000;
  104. -webkit-animation: slit-in-horizontal 0.6s ease-out both;
  105. animation: slit-in-horizontal 0.6s ease-out both;
  106. }
  107.  
  108. #content {
  109. background-color:#c0c0c0;
  110. width: 40vw;
  111. height: 27vw;
  112. margin:auto;
  113. position: absolute;
  114. padding: 5px;
  115. font-family: 'Gelasio', cursive;
  116. font-size: 18px;
  117. color: #000;
  118. left: 2vw;
  119. bottom: 1vw;
  120. z-index:1;
  121. border: #000000 solid 2px;
  122. }
  123.  
  124. #friendlist {
  125. background-color:#c0c0c0;
  126. width: 12vw;
  127. height: 27vw;
  128. margin:auto;
  129. position: absolute;
  130. padding: 5px;
  131. font-family: 'Gelasio', cursive;
  132. font-size: 18px;
  133. color: #000;
  134. right: 3.5vw;
  135. bottom: 1vw;
  136. z-index:1;
  137. border: #000000 solid 2px;
  138. }
  139.  
  140. #nav {
  141. background-color: transparent;
  142. width: 2vw;
  143. height: 1.7vw;
  144. margin:auto;
  145. position: absolute;
  146. right: 4vw;
  147. bottom: 8vw;
  148. text-align:right;
  149. z-index:0;
  150. }
  151.  
  152. #nav a, #nav a:link, #nav a:visited {
  153. display:inline-block;
  154. height: 1vw;
  155. width: 5vw;
  156. text-decoration:none;
  157. background: #222;
  158. margin: 5px;
  159. border: double #000 5px;
  160. -webkit-transition: 0.5s linear;
  161. -moz-transition: 0.5s linear;
  162. -o-transition: 0.5s linear;
  163. transition: 0.5s linear;
  164. }
  165.  
  166. #nav a:active, #nav a:hover {
  167. display:inline-block;
  168. height: 1vw;
  169. width: 5vw;
  170. text-decoration:none;
  171. background: #777;
  172. margin: 5px;
  173. border: double #000 5px;
  174. -webkit-transition: 0.5s linear;
  175. -moz-transition: 0.5s linear;
  176. -o-transition: 0.5s linear;
  177. transition: 0.5s linear;
  178. }
  179.  
  180. .name {position: absolute;
  181. font-family: 'Bangers';
  182. color: #fff;
  183. font-size: 6vw;
  184. top: -6.2vw;
  185. left: -1vw;
  186. width: 55vw;
  187. height: 9vw;
  188. border: 0px solid #000;
  189. text-align: justify;
  190. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  191. overflow: auto;
  192. padding:5px 5px 5px 5px;
  193. z-index: 2;
  194. -webkit-animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.8s both;
  195. animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.8s both;
  196. }
  197.  
  198. .title { background: transparent;
  199. background:url('https://media.giphy.com/media/ApkjjvkvqY7za/giphy.gif') repeat;
  200. background-position: center;
  201. position: absolute;
  202. font-family: 'Bangers';
  203. font-size: 6vw;
  204. top: -6.2vw;
  205. left: -1vw;
  206. width: 55vw;
  207. height: 9vw;
  208. text-align: justify;
  209. padding:5px 5px 5px 5px;
  210. -webkit-text-fill-color: transparent;
  211. -webkit-background-clip: text;
  212. z-index: 3;
  213. -webkit-animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.8s both;
  214. animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.8s both;
  215. }
  216.  
  217. .quote {position: absolute;
  218. font-family: 'Lora';
  219. color: #000;
  220. font-size: 1.3vw;
  221. top: 0vw;
  222. left: 4vw;
  223. width: 50vw;
  224. height: 3vw;
  225. border: 0px solid #000;
  226. text-align: center;
  227. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  228. overflow: auto;
  229. padding:5px 5px 5px 5px;
  230. z-index: 2;}
  231.  
  232. @-webkit-keyframes slit-in-horizontal {
  233. 0% {
  234. -webkit-transform: translateZ(-800px) rotateX(90deg);
  235. transform: translateZ(-800px) rotateX(90deg);
  236. opacity: 0;
  237. }
  238. 54% {
  239. -webkit-transform: translateZ(-160px) rotateX(87deg);
  240. transform: translateZ(-160px) rotateX(87deg);
  241. opacity: 1;
  242. }
  243. 100% {
  244. -webkit-transform: translateZ(0) rotateX(0);
  245. transform: translateZ(0) rotateX(0);
  246. }
  247. }
  248. @keyframes slit-in-horizontal {
  249. 0% {
  250. -webkit-transform: translateZ(-800px) rotateX(90deg);
  251. transform: translateZ(-800px) rotateX(90deg);
  252. opacity: 0;
  253. }
  254. 54% {
  255. -webkit-transform: translateZ(-160px) rotateX(87deg);
  256. transform: translateZ(-160px) rotateX(87deg);
  257. opacity: 1;
  258. }
  259. 100% {
  260. -webkit-transform: translateZ(0) rotateX(0);
  261. transform: translateZ(0) rotateX(0);
  262. }
  263. }
  264.  
  265. @-webkit-keyframes slide-in-left {
  266. 0% {
  267. -webkit-transform: translateX(-1000px);
  268. transform: translateX(-1000px);
  269. opacity: 0;
  270. }
  271. 100% {
  272. -webkit-transform: translateX(0);
  273. transform: translateX(0);
  274. opacity: 1;
  275. }
  276. }
  277. @keyframes slide-in-left {
  278. 0% {
  279. -webkit-transform: translateX(-1000px);
  280. transform: translateX(-1000px);
  281. opacity: 0;
  282. }
  283. 100% {
  284. -webkit-transform: translateX(0);
  285. transform: translateX(0);
  286. opacity: 1;
  287. }
  288. }
  289.  
  290. @-webkit-keyframes fade-in-fwd {
  291. 0% {
  292. -webkit-transform: translateZ(-80px);
  293. transform: translateZ(-80px);
  294. opacity: 0;
  295. }
  296. 100% {
  297. -webkit-transform: translateZ(0);
  298. transform: translateZ(0);
  299. opacity: 1;
  300. }
  301. }
  302. @keyframes fade-in-fwd {
  303. 0% {
  304. -webkit-transform: translateZ(-80px);
  305. transform: translateZ(-80px);
  306. opacity: 0;
  307. }
  308. 100% {
  309. -webkit-transform: translateZ(0);
  310. transform: translateZ(0);
  311. opacity: 1;
  312. }
  313. }
  314.  
  315.  
  316. i{color: #555;}
  317. b{color: #000;}
  318. a{color: #222; text-decoration: none;}
  319. h1{border-bottom: 1px solid #000; text-align: center; font-size: 30px; font-family: 'Bangers', cursive; color: #000;}
  320. h2{border-bottom: 1px solid #000; text-align: left; font-size: 30px; font-family: 'Bangers', cursive; color: #000;}
  321. h3{border-bottom: 1px solid #000; text-align: right; font-size: 30px; font-family: 'Bangers', cursive; color: #000;}
  322. </style>
  323.  
  324. <div id="image"></div>
  325.  
  326. <div id="container">
  327. <div class="name">Shadow Hero: Outcast</div>
  328. <div class="title">Shadow Hero: Outcast</div>
  329. <div class="quote">"Nobody deserves to be alone. Fear and sadness all go away once you find a friend. I will become that friend someday... for anyone that needs it."</div>
  330.  
  331. <div id="nav">
  332. <a href="#one"></a>
  333. <a href="#two"></a>
  334. <a href="#three"></a>
  335. <a href="#four"></a>
  336. </div>
  337.  
  338. <div id="content">
  339. <div style="width: 40vw; height: 27vw; overflow-y: hidden;">
  340.  
  341. <a name="one"></a>
  342. <div style="width: 40vw; height: 27vw; overflow: auto;" align="center">
  343. <span style="float:left;"><b>Name</b></span><span style="float:right;">Fushimi Koro/Kage Kurasu</span><br>
  344. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"><a title="Best boi, Lil' Bro, Baby Shadow">hover</a></span><br>
  345. <span style="float:left;"><b>Hero Name</b></span><span style="float:right;">Shadow Hero: Outkast</span><br>
  346. <span style="float:left;"><b>Gender</b></span><span style="float:right;">Male</span><br>
  347. <span style="float:left;"><b>Age</b></span><span style="float:right;">16</span><br>
  348. <span style="float:left;"><b>Race</b></span><span style="float:right;">Human</span><br>
  349. <span style="float:left;"><b>Voice</b></span><span style="float:right;"><a href="https://www.youtube.com/watch?v=XIMLoLxmTDw" target="_blank">Click~</a></span><br>
  350. <span style="float:left;"><b>Class</b></span><span style="float:right;">2-B</span><br><br>
  351. <span style="float:left;"><b>Height</b></span><span style="float:right;">6'</span><br>
  352. <span style="float:left;"><b>Weight</b></span><span style="float:right;">207 lbs</span><br>
  353. <span style="float:left;"><b>Eyes</b></span><span style="float:right;">White</span><br>
  354. <span style="float:left;"><b>Hair</b></span><span style="float:right;">Black</span><br>
  355. <span style="float:left;"><b>Build</b></span><span style="float:right;">Lean</span><br><br>
  356. <span style="float:left;"><b>Orientation</b></span><span style="float:right;">Straight</span><br>
  357. <span style="float:left;"><b>Relationship</b></span><span style="float:right;">Unattached</span><br>
  358. <span style="float:left;"><b>Affiliation</b></span><span style="float:right;">Yuuei</span><br><br><br>
  359.  
  360.  
  361. <h2>headcanons</h2>
  362. <ul>
  363. <li>Koro CANNOT SPEAK. He was born mute, so you will not hear him say anything. Ever.
  364. <li>Koro was bullied as a kid, due to the fact that he couldn't run and play during the day with the rest of the kids. This causes him to be extremely grateful for what he has, along with having some self-esteem issues.
  365. <li>Koro is an excellent cook. His signature dish is Chocolate crepes with a strawberry garnish. He is also a MASTER at making soups.
  366. <li>Koro has a secret obsession with musicals. Broadway is his life, even though he can't sing the songs himself.
  367. <li>Koro can't watch horror movies. He just… can't. So don't ask him to.
  368. </ul>
  369. </div>
  370.  
  371. <a name="two"></a>
  372. <div style="width: 40vw; height: 27vw; overflow: auto;" align="left">
  373. <h1>Combat</h1>
  374. <span style="float:left;"><b>Cooperation</b></span><span style="float:right;">●●○○○</span><br><br>
  375. <span style="float:left;"><b>Power</b></span><span style="float:right;">●●○○○</span><br><br>
  376. <span style="float:left;"><b>Speed</b></span><span style="float:right;">●●●○○</span><br><br>
  377. <span style="float:left;"><b>Intelligence</b></span><span style="float:right;">●●●○○</span><br><br>
  378. <span style="float:left;"><b>Technique</b></span><span style="float:right;">●●●●○</span><br><br>
  379.  
  380. <h2>Quirk</h2>
  381. <b>Quirk Name:</b> Shadewalker<br><br>
  382. <b>Quirk Type:</b> Emitter<br><br>
  383. <b>Quirk Description:</b>
  384. <br> The user of this quirk can teleport to any shadow within sight. This is done by instantly vanishing then reappearing into the shadow seen beforehand. The user does not need to be a shadow in order for this quirk to work, they just have to be able to see a shadow. This quirk's power is also amplified at night, as they can teleport anywhere there ISN'T light.
  385. <br><br>
  386. <b>Weaknesses/Drawbacks:</b>
  387. Any sort of light from anywhere is highly painful for the user of this quirk. The pain is the equivalent of fire in direct contact with the skin.<br>
  388.  
  389. <h3>Equipment</h3>
  390. TBA
  391. </div>
  392.  
  393.  
  394. <a name="three"></a>
  395. <div style="width: 40vw; height: 27vw; overflow: auto;" align="center">
  396. <h1>History</h1>
  397. From birth, Koro was a disgrace to the Fushimi clan. He had a fantastic quirk that could be used in many different ways... but when his grandparents found out the drawback of his abilities, they turned their backs on him as a grandson AND as a successor. If he were to follow a different path than his great-aunt, then he should have been born different. Not only that, but he wasn't born with the same quirk. A variation of it, sure... But not the same one.<br><br>
  398. Regardless, Koro had been looked down upon since birth and it's something that haunts him to this day. Unable to keep up with other kids, due to the nature of his quirk, Koro also didn't have a whole lot of friends growing up. This meant that he grew up appreciating all of the things he WAS able to get in his life, which mostly consisted of his baby sister that was born a year before he was. Elementary and Middle school were pretty difficult to Koro, not ONLY having to dodge bullies, but any sort of light that he may come across. However, during the eighth grade was when Koro really began to understand what he wanted to be. He wanted to become a pro-hero. Use his quirk to help those that are unfortunate enough to be rejected by the rest of the world. He made a vow that day that he would make sure nobody EVER felt the way he did when he was a kid.<br><br>
  399. Now, he attends school at U.A, trying to hone his abilities and rise above his drawback and stand up for the outcasts of the world. Because nobody deserves to be thrown out, rejected or ignored. And as long as he is a hero out in the world, then there will never be another soul that feels alone.
  400. </div>
  401.  
  402. <a name="four"></a>
  403. <div style="width: 40vw; height: 27vw; overflow: auto;" align="left">
  404. <h1>Out of Character</h1>
  405. <center><b>00</b>. Code made by <a href="/profile.php?user=RageQxeen" target="_blank">RageQxeen</a>, do not steal.</center><br><br>
  406. <b>01</b>. <br><br>
  407. <b>02</b>. <br><br>
  408. <b>03</b>. <br><br>
  409. <b>04</b>. <br><br>
  410. <b>05</b>. <br><br>
  411. <b>06</b>. <br><br>
  412. <b>07</b>. <br><br>
  413. <b>08</b>. <br><br>
  414. <b>09</b>. <br><br>
  415. <b>10</b>. <br><br>
  416. </div>
  417. </div>
  418. </div>
  419.  
  420. <div id="friendlist">
  421. <div style="width: 12vw; height: 27vw; overflow: auto;" align="center">
  422. <marquee behavior="scroll" direction="up" onmouseover="this.stop();" onmouseout="this.start();">
  423. <a target="_blank" href="/profile.php?user=Fushimi"><img src="http://i.picpar.com/4kXd.png" height="75" width="75" align="left" border="3"></a>
  424. <center><b>- Kageka -</b><br> <i>older sister</i><br> PUT A SHIRT ON.</center><br><br><br><br>
  425. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  426. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  427. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  428. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  429. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  430. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  431. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  432. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  433. </marquee>
  434. </div>
  435. </div>
  436. </div>
  437. </body>
  438. </html>
Advertisement
Add Comment
Please, Sign In to add comment