SHARE
TWEET

Kiki Code

Chibi-Elle May 23rd, 2019 77 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <style>
  2. @import url('https://fonts.googleapis.com/css?family=Cute+Font|Special+Elite|Unica+One');
  3.  
  4. body {
  5. background-image: url("https://pngimage.net/wp-content/uploads/2018/06/sis-efekti-png-6.png");  
  6. background-attachment: fixed;
  7. background-position: top;
  8. color: #f6a905;
  9. background-color:#F9E956;
  10. font-family: "Special Elite";
  11. font-size: 12px;
  12. }
  13.  
  14. #credit {
  15. Position: fixed; bottom: 10px; left: 10px;
  16. font-family: "Cute Font";
  17. font-size: 18px;
  18. text-shadow: 2px 0 0 #F6A905, -2px 0 0 #F6A905, 0 2px 0 #F6A905, 0 -2px 0 #F6A905, 1px 1px #F6A905, -1px -1px 0 #F6A905, 1px -1px 0 #F6A905, -1px 1px 0 #F6A905;
  19. z-index: 99;
  20. }
  21.  
  22. #nav1 {
  23. position: fixed; left: -1000px; right: 0px; top: -450px; bottom: 0px; margin: auto;
  24. height: 150px;
  25. width: 150px;
  26. border: 10px solid #F6A905;
  27. border-radius: 50%;
  28. -webkit-border-radius: 50%;
  29. -moz-border-radius: 50%;
  30. z-index: 2;
  31. }
  32.  
  33. #nav2 {
  34. position: fixed; left: -650px; right: 0px; top: -450px; bottom: 0px; margin: auto;
  35. height: 150px;
  36. width: 150px;
  37. border: 10px solid #F6A905;
  38. border-radius: 50%;
  39. -webkit-border-radius: 50%;
  40. -moz-border-radius: 50%;
  41. z-index: 2;
  42. }
  43.  
  44. #nav3 {
  45. position: fixed; left: -300px; right: 0px; top: -450px; bottom: 0px; margin: auto;
  46. height: 150px;
  47. width: 150px;
  48. border: 10px solid #F6A905;
  49. border-radius: 50%;
  50. -webkit-border-radius: 50%;
  51. -moz-border-radius: 50%;
  52. z-index: 2;
  53. }
  54.  
  55. #nav4 {
  56. position: fixed; left: 0px; right: -50px; top: -450px; bottom: 0px; margin: auto;
  57. height: 150px;
  58. width: 150px;
  59. border: 10px solid #F6A905;
  60. border-radius: 50%;
  61. -webkit-border-radius: 50%;
  62. -moz-border-radius: 50%;
  63. z-index: 2;
  64. }
  65.  
  66. #nav5 {
  67. position: fixed; left: 0px; right: -400px; top: -450px; bottom: 0px; margin: auto;
  68. height: 150px;
  69. width: 150px;
  70. border: 10px solid #F6A905;
  71. border-radius: 50%;
  72. -webkit-border-radius: 50%;
  73. -moz-border-radius: 50%;
  74. z-index: 2;
  75. }
  76.  
  77. #nav6 {
  78. position: fixed; left: 0px; right: -750px; top: -450px; bottom: 0px; margin: auto;
  79. height: 150px;
  80. width: 150px;
  81. border: 10px solid #F6A905;
  82. border-radius: 50%;
  83. -webkit-border-radius: 50%;
  84. -moz-border-radius: 50%;
  85. z-index: 2;
  86. }
  87.  
  88. #mainpic {
  89. position: fixed; left: -800px; right: 0px; top: 0px; bottom: -185px; margin: auto;
  90. height: 400px;
  91. border: 8px solid #F6A905;
  92. z-index: 2;
  93. }
  94.  
  95. #mainpic2 {
  96. position: fixed; left: -800px; right: 0px; top: 0px; bottom: -185px; margin: auto;
  97. height: 400px;
  98. border: 8px solid #F6A905;
  99. z-index: 3;
  100. opacity: 0;
  101. }
  102.  
  103. #mainpic2:hover {
  104. opacity: 1;
  105. }
  106.  
  107. #tab { position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto;
  108. height: 360px;
  109. width: 490px;
  110. z-index:2;
  111. visibility: hidden;
  112. }
  113.  
  114. #OOC #tab {
  115. visibility: visible;
  116. }
  117.  
  118. #OOC:target #tab, #Stats:target #tab, #About:target #tab, #Abilities:target #tab, #History:target #tab, #Friends:target #tab {
  119. visibility: visible;
  120. z-index: 99;
  121. }
  122.  
  123. #header {
  124. position: fixed; left: 0px; right: 0px; top: -145px; bottom: 0px; margin: auto;
  125. width: 300px;
  126. height: 25px;
  127. padding: 10px;
  128. border: 8px solid #F6A905;
  129. background-color: #f8ec7e;
  130. background-image: url("https://www.transparenttextures.com/patterns/nice-snow.png");
  131. font-family: 'Unica One';
  132. font-size: 16px;
  133. }
  134.  
  135. #box {
  136. position: fixed; left: 0px; right: 0px; top: 0px; bottom: -240px; margin: auto;
  137. width: 400px;
  138. height: 230px;
  139. padding: 10px;
  140. border: 8px solid #f6a905;
  141. background-color: #F8EC7E;
  142. background-image: url("https://www.transparenttextures.com/patterns/nice-snow.png");
  143. overflow: auto;
  144. }
  145.  
  146. .friendpic {
  147. border: 5px solid #f6a905;
  148. width: 100px;
  149. height: 100px;
  150. margin: 5px;
  151. pointer-events: auto;
  152. }
  153.  
  154. #bordertop {
  155. position: fixed; left: 0px; right: 0px; top: 0px; bottom: -55px; margin: auto;
  156. border-top: 8px solid #f6a905;
  157. border-left: 8px solid #f6a905;
  158. height: 500px;
  159. width: 1200px;
  160. z-index: 1;
  161. }
  162.  
  163. #borderbottom {
  164. position: fixed; left: -200px; right: 0px; top: 0px; bottom: -55px; margin: auto;
  165. border-bottom: 8px solid #f6a905;
  166. height: 500px;
  167. width: 1000px;
  168. z-index: 1;
  169. }
  170.  
  171. #title {
  172. position: fixed; left: 0px; right: -800px; top: 0px; bottom: -100px; margin: auto;
  173. line-height: normal;
  174. font-size: 100px;
  175. height: 300px;
  176. width: 300px;
  177. z-index: 1;
  178. }
  179.  
  180. a.credit:link {color:#f0f0f0;}
  181. a.credit:visited {color:#f0f0f0;}
  182. a.credit:hover {color:#FCD0A8;}
  183. a.credit {text-decoration:none;}
  184.  
  185. a {text-decoration: none; color: white;}
  186. a:visited {color: white;}
  187. a:hover {color: red;}
  188.  
  189. b {color:#E26C00;}
  190.  
  191. h1, h2, h3 {
  192. text-align: center;
  193. margin: 0px;
  194. padding: 0px;
  195. font-family: "Unica One";
  196. }
  197.  
  198.  
  199. ::-webkit-scrollbar {
  200. width: 2px;
  201. height: 1px;
  202. }
  203.    
  204. ::-webkit-scrollbar-track {
  205. border-radius: 4px;
  206. }
  207.    
  208. ::-webkit-scrollbar-thumb {
  209. background: #FF7028;
  210. }
  211. </style>
  212. <body>
  213. <div id="bordertop"></div>
  214. <div id="borderbottom"></div>
  215.  
  216. <a href="#OOC"><img id="nav1" src="https://i.pinimg.com/564x/24/19/d0/2419d047cb4460c05735ab2666b7af52.jpg"></div></a>
  217. <a href="#Stats"><img id="nav2" src="https://i.pinimg.com/564x/d9/63/30/d963309baea5ecff8d9db3d860f4101b.jpg"></div></a>
  218. <a href="#About"><img id="nav3" src="https://media.giphy.com/media/2ekc49Kd3tqow/giphy.gif"></div></a>
  219. <a href="#Abilities"><img id="nav4" src="https://media.giphy.com/media/2nwha0bnvjOJq/giphy.gif"></div></a>
  220. <a href="#History"><img id="nav5" src="https://i.pinimg.com/originals/ef/c1/57/efc157c900cd54004058782608c99b7f.jpg"></div></a>
  221. <a href="#Friends"><img id="nav6" src="https://i.pinimg.com/564x/7b/9b/78/7b9b787b84f62e71eb59fea70e91812b.jpg"></div></a>
  222.  
  223. <img id="mainpic" src="https://i.pinimg.com/564x/d2/cf/68/d2cf68a0a4a3e9382c4187c1c3ef211e.jpg" />
  224. <img id="mainpic2" src="https://i.pinimg.com/564x/8e/69/25/8e69252468716399218c2be0077f5b76.jpg" />
  225.  
  226. <div id="title">'O Ke <br>Keike<br>Ikaika</div>
  227.  
  228.  
  229.  
  230. <div id="OOC">
  231. <div id="tab">
  232. <div id="header">
  233. <h1>Out of Character</h1>
  234. </div>
  235. <div id="box">
  236.  
  237. <b>01.</b> Raaaawr!<br>
  238. <b>02.</b> I'm a scary dragon, hear me roar!<br>
  239. <b>03.</b> Fightfightfightfight.<br>
  240. <b>04.</b> Maika'i is super cool, I wish I was as stronk as her...<br>
  241. <b>05.</b> Ice types rule! Dragons are still pretty cool, though.<br>
  242. <b>06.</b> My eyes are up here, bro.<br>
  243. <b>07.</b> I'm a tall ass lady, do you feel short yet?<br>
  244. <b>08.</b> Battle-ready armor mode activate; you better watch out.<br>
  245. <b>09.</b> Double D threat level.<br>
  246. <b>10.</b> I'll take you out twice as hard.
  247.  
  248. </div>
  249. </div></div>
  250.  
  251. <div id="Stats">
  252. <div id="tab">
  253. <div id="header">
  254. <h1>Stats</h1>
  255. </div>
  256. <div id="box">
  257. <b>Given Name:</b><font style=float:right>Info</font><br><br>
  258. <b>Nickname(s):</b><font style=float:right>Info</font><br><br>
  259. <b>Age:</b><font style=float:right>Info</font><br><br>
  260. <b>D.o.B.:</b><font style=float:right>Info</font><br><br>
  261. <b>P.o.B.:</b><font style=float:right>Info</font><br><br>
  262. <b>Gender:</b><font style=float:right>Info</font><br><br>
  263. <b>Occupation:</b><font style=float:right>Info</font><br><br>
  264. <b>Alignment:</b><font style=float:right>Info</font><br><br>
  265. <b>Orientation:</b><font style=float:right>Info</font><br><br>
  266. <b>Marital:</b><font style=float:right>Info</font><br><br>
  267. <b>Species:</b><font style=float:right>Info</font><br><br>
  268. <b>Race:</b><font style=float:right>Info</font><br><br>
  269. <b>Hair Color:</b><font style=float:right>Info</font><br><br>
  270. <b>Eye Color:</b><font style=float:right>Info</font><br><Br>
  271. <b>Height:</b><font style=float:right>Info</font><br><br>
  272. <b>Weight:</b><font style=float:right>Info</font>
  273. </div>
  274. </div></div>
  275.  
  276. <div id="About">
  277. <div id="tab">
  278. <div id="header">
  279. <h1>Gijinka Stats</h1>
  280. </div>
  281. <div id="box">
  282. You're gonna wanna double-space all of your stats because empty space in boxes looks silly...
  283. </div>
  284. </div></div>
  285.  
  286. <div id="Abilities">
  287. <div id="tab">
  288. <div id="header">
  289. <h1>Skills</h1>
  290. </div>
  291. <div id="box">
  292. Probably these too!<br>
  293. <b>Skill Name:</b> Skill description....<br>
  294. <b>Skill Name:</b> Skill description....<br>
  295. <b>Skill Name:</b> Skill description....<br>
  296. <b>Skill Name:</b> Skill description....<br>
  297. <b>Skill Name:</b> Skill description....<br>
  298. <b>Skill Name:</b> Skill description....<br>
  299. <b>Skill Name:</b> Skill description....<br>
  300. <b>Skill Name:</b> Skill description....<br>
  301. <b>Skill Name:</b> Skill description....<br>
  302. <b>Skill Name:</b> Skill description....<br>
  303. <b>Skill Name:</b> Skill description....<br>
  304. </div>
  305. </div></div>
  306.  
  307. <div id="History">
  308. <div id="tab">
  309. <div id="header">
  310. <h1>History</h1>
  311. </div>
  312. <div id="box">
  313. Lorem ipsum dolor sit amet...
  314. </div>
  315. </div></div>
  316.  
  317. <div id="Friends">
  318. <div id="tab">
  319. <div id="header">
  320. <h1>Friends</h1>
  321. </div>
  322. <div id="box">
  323. <center>
  324. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  325. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  326. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  327. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  328. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  329. <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
  330. </center>
  331. </div>
  332. </div></div>
  333.  
  334. <div id="credit"><a class="credit" href="https://roleplay.chat/profile.php?user=Spaceman+Codes">Spaceman</a></div>
  335. </body>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top