Advertisement
NaotoShirgone

Willow

Oct 20th, 2017
551
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.41 KB | None | 0 0
  1. <html>
  2. <head>
  3. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  4. <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
  5. <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js"></script>
  6. <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
  7. <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.11.0/d3.min.js"></script>
  8. <script src="https://roleplay.chat/jquery.tooltipster.js"></script>
  9. <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
  10. <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.js"></script>
  11. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
  12. <link href="https://roleplay.chat/tooltipster.css" rel="stylesheet" type="text/css">
  13. <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
  14. <script defer>
  15. window.onload = function() {
  16.  
  17. };
  18. </script>
  19. <style>
  20. #profile-container {
  21. background: none;
  22. }
  23.  
  24. body {
  25. background: url(https://s-media-cache-ak0.pinimg.com/originals/d5/b3/b8/d5b3b8b05a45c70e0d4574d83b903403.jpg);
  26. background-attachment:fixed;
  27. background-size:100% 100%;
  28. background-repeat:no-repeat:
  29. }
  30.  
  31. body,
  32. a:hover {
  33. cursor: url(http://31.media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), progress !important;
  34. }
  35.  
  36. @font-face {
  37. font-family: text;
  38. src: url(https://dl.dropbox.com/s/jwlxft6wualrnqw/Quicksand-Regular.ttf?dl=0);
  39. }
  40.  
  41. .Pic {
  42. z-index: 10;
  43. position: absolute;
  44. top: 160px;
  45. left: 289px;
  46. border: 3px solid #690000;
  47. background: url(https://vignette.wikia.nocookie.net/swordgirls/images/d/d2/Halloween_Countess.png/revision/latest?cb=20120721233513);
  48. background-size: auto 100%;
  49. width: 190px;
  50. height: 320px;
  51. padding: 5px;
  52. color: #000;
  53. }
  54.  
  55. .Box1 {
  56. z-index: 9;
  57. position: absolute;
  58. top: 150px;
  59. left: 190px;
  60. border: 5px solid #000;
  61. background: #321360;
  62. width: 830px;
  63. height: 335px;
  64. padding: 5px;
  65. opacity: .5;
  66. }
  67.  
  68. .Gal1 {
  69. position: absolute;
  70. left: 935px;
  71. top: 160px;
  72. border: 3px solid #000;
  73. background-image: url(https://s-media-cache-ak0.pinimg.com/originals/78/2b/2a/782b2a724332fa462fa6a06878dcff5b.jpg);
  74. border-radius: 100px;
  75. width: 90px;
  76. height: 90px;
  77. z-index: 10;
  78. background-size: auto 150%;
  79. -webkit-transition: all .5s ease;
  80. }
  81.  
  82. .Gal1:hover {
  83. -webkit-transition: all .5s ease;
  84. height: 100px;
  85. Width: 100px;
  86. left: 930px;
  87. top: 155px;
  88. z-index: 100;
  89. }
  90.  
  91. .Gal2 {
  92. position: absolute;
  93. left: 935px;
  94. top: 280px;
  95. border: 3px solid #000;
  96. background-image: url(https://vignette.wikia.nocookie.net/swordgirls/images/8/8f/Dress_Cinia.jpg/revision/latest?cb=20111016220151);
  97. border-radius: 100px;
  98. width: 90px;
  99. height: 90px;
  100. z-index: 10;
  101. background-size: auto 150%;
  102. -webkit-transition: all .5s ease;
  103. }
  104.  
  105. .Gal2:hover {
  106. -webkit-transition: all .5s ease;
  107. height: 100px;
  108. Width: 100px;
  109. left: 930px;
  110. top: 280px;
  111. z-index: 100;
  112. }
  113.  
  114. .Gal3 {
  115. position: absolute;
  116. left: 935px;
  117. top: 400px;
  118. border: 3px solid #000;
  119. background-image: url(http://data.whicdn.com/images/62678404/large.jpg);
  120. border-radius: 100px;
  121. width: 90px;
  122. height: 90px;
  123. z-index: 10;
  124. background-size: auto 150%;
  125. -webkit-transition: all .5s ease;
  126. }
  127.  
  128. .Gal3:hover {
  129. -webkit-transition: all .5s ease;
  130. height: 100px;
  131. Width: 100px;
  132. left: 930px;
  133. top: 390px;
  134. z-index: 100;
  135. }
  136.  
  137. .tabs {
  138. position: absolute;
  139. margin: 25px 0px;
  140. }
  141.  
  142. .tab label {
  143. top: 160px;
  144. left: 153px;
  145. float: right;
  146. height: 25px;
  147. margin-left: 43px;
  148. border: 3px solid #000;
  149. background: #321360;
  150. width: 75px;
  151. padding: 2px;
  152. position: relative;
  153. color: #fff;
  154. text-align: center;
  155. font-family: text;
  156. font-size: 12px;
  157. z-index: 400;
  158. -webkit-transition: all .5s ease;
  159. }
  160.  
  161. table,
  162. th,
  163. td {
  164. font-family: text;
  165. }
  166.  
  167. .tab label:hover {
  168. color: #000;
  169. border-color: #000;
  170. }
  171.  
  172. .tab [type=radio] {
  173. display: none;
  174. }
  175.  
  176. .content {
  177. position: absolute;
  178. top: 160px;
  179. left: 500px;
  180. width: 400px;
  181. height: 265px;
  182. background: #f1f1f1;
  183. padding: 10px;
  184. border: 3px solid #000;
  185. font-size: 15px;
  186. color: #4f4f4f;
  187. font-family: text;
  188. font-size: 12px;
  189. overflow: auto;
  190. z-index: 20;
  191. }
  192.  
  193. [type=radio]:checked ~ label {
  194. color: #fff;
  195. border-color: #531E9D;
  196. }
  197.  
  198. [type=radio]:checked ~ label ~ .content {
  199. z-index: 30;
  200. }
  201.  
  202. ::-webkit-scrollbar {
  203. width: 5px;
  204. height: 1px;
  205. }
  206.  
  207. ::-webkit-scrollbar-thumb {
  208. -webkit-box-shadow: inset 0 0 6px #000;
  209. }
  210.  
  211. ::-webkit-scrollbar-track {
  212. -webkit-box-shadow: inset 0 0 6px #111;
  213. }
  214.  
  215. a:link,
  216. a:visited,
  217. a:active {
  218. text-decoration: none;
  219. color: #1b1b1b;
  220. -webkit-transition: all .5s ease;
  221. }
  222.  
  223. a:hover {
  224. color: #4f4f4f;
  225. -webkit-transition: all .5s ease;
  226. }
  227.  
  228. .Credit {
  229. position: fixed;
  230. right: 50px;
  231. bottom: 50px;
  232. width: 20px;
  233. height: 20px;
  234. border-radius: 20px;
  235. border-color: #fff;
  236. border-style: dotted;
  237. border-width: 2px;
  238. background: #000;
  239. -webkit-transition: all 1s ease;
  240. .Credit:hover {
  241. background: #fff;
  242. border-color: #000;
  243. }
  244.  
  245. </style>
  246. </head>
  247. <body>
  248. <div class="Pic">
  249. <p> </p>
  250. </div>
  251. <div class="Box1">
  252. <p> </p>
  253. </div>
  254. <div class="Gal1">
  255. <p> </p>
  256. </div>
  257. <div class="Gal2">
  258. <p> </p>
  259. </div>
  260. <div class="Gal3">
  261. <p> </p>
  262. </div>
  263. <div class="tabs">
  264. <div class="tab">
  265. <input id="tab-4" name="tab-group-2" type="radio" />
  266. <label for="tab-4">OOC</label>
  267. <div class="content">
  268. <ul>
  269. <li>No Profile No RP</li>
  270. <li>Do not just approach and be stupid</li>
  271. <li>I have the right to refuse any Rp.</li>
  272. <li>Smut is Fine but clean works to.</li>
  273. <li>Do not tell me how to play my character</li>
  274. <li>You dont like me. Oh well to bad.</li>
  275. <li>No Personal Information</li>
  276. <li>Do not be an asshole.</li>
  277. <li>I will not RP with people who Mix anime and Realistic or those who use straight realistic images. Animated profiles are my preference.
  278. </ul>
  279. </p>
  280. </div>
  281. </div>
  282. <div class="tab">
  283. <input id="tab-3" name="tab-group-2" type="radio" />
  284. <label for="tab-3">Bio</label>
  285. <div class="content">
  286. <p style="text-align: center;">History</p>
  287. <p>Will Write when I have a moment</p>
  288. </div>
  289. </div>
  290. <div class="tab">
  291. <input id="tab-2" name="tab-group-2" type="radio" />
  292. <label for="tab-2">Gallery</label>
  293. <div class="content">
  294. <p style="text-align: center;">Gallery</p>
  295. <center>
  296.  
  297. <a target="_blank" href="https://i.imgur.com/SN4l16X.jpg"><img src="https://i.imgur.com/SN4l16X.jpg" title="source: imgur.com" width="150" Height="200" /></a>
  298.  
  299. <a target="_blank" href="https://i.pinimg.com/736x/91/1e/70/911e7001f4466e0e71713de93ba8e3a0--hot-anime-manga-anime.jpg"><img src="https://i.pinimg.com/736x/91/1e/70/911e7001f4466e0e71713de93ba8e3a0--hot-anime-manga-anime.jpg" width="150" Height="200" /></a>
  300. <br><br>
  301.  
  302.  
  303. <a target="_blank" href="https://s-media-cache-ak0.pinimg.com/736x/5d/a7/55/5da75503c20109dc1acffa6536ad49ab--manga-art-manga-anime.jpg"><img src="https://s-media-cache-ak0.pinimg.com/736x/5d/a7/55/5da75503c20109dc1acffa6536ad49ab--manga-art-manga-anime.jpg" title="source: imgur.com" width="150" Height="200" /></a>
  304.  
  305. <a target="_blank" href="https://imgur.com/NtpvCP5"><img src="https://i.imgur.com/NtpvCP5.jpg" height="200" width="150" title="source: imgur.com" /></a>
  306. <br><br>
  307.  
  308. <a target="_blank" href="https://vignette4.wikia.nocookie.net/swordgirls/images/3/34/100148L.jpg/revision/latest?cb=20120331205013"><img src="https://vignette4.wikia.nocookie.net/swordgirls/images/3/34/100148L.jpg/revision/latest?cb=20120331205013" title="source: imgur.com" width="150" Height="200" /></a>
  309.  
  310. <a target="_blank" href="http://data.whicdn.com/images/107482660/large.jpg"><img src="http://data.whicdn.com/images/107482660/large.jpg" title="source: imgur.com" width="150" Height="200" /></a>
  311. </center>
  312.  
  313. </p>
  314. </div>
  315. </div>
  316. <div class="tab">
  317. <input id="tab-1" checked="checked" name="tab-group-2" type="radio" />
  318. <label for="tab-1">Stats</label>
  319. </div>
  320. <div class="content">
  321. <p style="text-align: center;">Stats</p>
  322. <table border="0" cellspacing="0" width="398" height="96">
  323. <tbody>
  324. <tr>
  325. <td style="text-align: right;">Name<br></td>
  326. <td style="padding-left: 30px;">Willow Ashflesh<br></td>
  327. </tr>
  328. <tr>
  329. <td style="text-align: right;">Age</td>
  330. <td style="padding-left: 30px;">17</td>
  331. </tr>
  332. <tr>
  333. <td style="text-align: right;">Gender</td>
  334. <td style="padding-left: 30px;">Female</td>
  335. </tr>
  336. <tr>
  337. <td style="text-align: right;">Height</td>
  338. <td style="padding-left: 30px;">5'4</td>
  339. </tr>
  340. <tr>
  341. <td style="text-align: right;">Weight</td>
  342. <td style="padding-left: 30px;">128lbs</td>
  343. </tr>
  344. <tr>
  345. <td style="text-align: right;">Sexuality</td>
  346. <td style="padding-left: 30px;">Straight</td>
  347. </tr>
  348. <tr>
  349. <td style="text-align: right;">Status</td>
  350. <td style="padding-left: 30px;">Single</td>
  351. </tr>
  352. <tr>
  353. <td style="text-align: right;">Species</td>
  354. <td style="padding-left: 30px;">Vampire</td>
  355. </tr>
  356. <tr>
  357. <td style="text-align: right;">Occupation</td>
  358. <td style="padding-left: 30px;">Student</td>
  359. </tr>
  360. </tbody>
  361. </table>
  362. </div>
  363. </div>
  364.  
  365.  
  366.  
  367.  
  368. <div class="Credit">
  369. <p style="text-align: center;"><a target="_blank" href="https://rphprofilecodes.tumblr.com/" target="_blank">♠</a></p>
  370. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement