Advertisement
Guest User

Untitled

a guest
Jun 23rd, 2017
70
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.33 KB | None | 0 0
  1. <style>
  2. @import url(https://fonts.googleapis.com/css?family=Montserrat:100,300,400,700,900);
  3. @import url('https://fonts.googleapis.com/css?family=Playfair Display SC');
  4. @import url('https://fonts.googleapis.com/css?family=Graduate');
  5. @import url('https://fonts.googleapis.com/css?family=Questrial');
  6.  
  7. /*coded by [punpun]. do not steal the characters. do not remove this. do not remove the credits.*/
  8.  
  9. body {
  10. background-color: #f3f3f3;
  11. background-position:left;
  12. background-image:url("http://farm9.staticflickr.com/8027/7329307714_09eb5994e3.jpg");background-size:100px;
  13. background-attachment:tile;
  14. overflow: disabled}
  15.  
  16. /*827A99*/
  17.  
  18. ::-webkit-scrollbar-thumb {
  19. width: 0px;
  20. background-color: transparent;}
  21. ::-webkit-scrollbar {
  22. width: 0px;
  23. background-color: transparent;}
  24.  
  25. a {
  26. color: #B33B3B;
  27. text-decoration: none;
  28. transition: all 0.4s ease-in-out;
  29. -webkit-transition: all 0.4s ease-in-out;}
  30. a:hover {
  31. color: #000000;
  32. text-decoration: none;
  33. transition: all 0.4s ease-in-out;
  34. -webkit-transition: all 0.4s ease-in-out;}
  35. a.tabs {
  36. font-size: 14px;
  37. background: #000;
  38. border:1px solid #000;
  39. padding: 2px 18px 2px 18px;
  40. line-height: 30px;
  41. font-family: calibri;
  42. color: #f3f3f3;
  43. -webkit-transition: all 0.4s ease;
  44. transition: all 0.4s ease;}
  45.  
  46. a.tabs:hover {
  47. color: #000;
  48. background-color: transparent;
  49. border:1px solid #000; }
  50.  
  51. a.cons {outline:none; text-decoration: none; cursor: url(), auto;}
  52. a.cons strong {line-height:30px;}
  53. a.cons:hover {text-decoration:none; }
  54. a.cons span {
  55. position: fixed; margin: auto; right: 0px; right:340; bottom: 0; bottom:305;
  56. z-index:200;display:none; padding:10px 5px;
  57. width:160px; line-height:12px;
  58. height: 68px;
  59. }
  60. a.cons:hover span{
  61. display: inline;position:fixed; color:#000;visibility:visible; text-align:justify;font-size:11;
  62. border-left: 1px solid #000;border-top: 1px solid #000; background:#; opacity: 0.99;
  63. font-family: Questrial;
  64. font-style: normal;
  65. font-variant: ;
  66. font-weight: 100;}
  67.  
  68.  
  69. #ufuk {position: fixed;right: 900;bottom: 0px;}
  70. #ufuk img {width: auto;height: 500;}
  71.  
  72. #head {width: 200px;height: auto;
  73. color: #000000;border: px solid #000;
  74. font-family: Arial;
  75. font-size: 30;text-align: right;
  76.  
  77. }
  78.  
  79. #head2 {
  80. color: #000000;width: 200;height: auto;
  81. font-family: Graduate;border: px solid #000;
  82. font-size: 25px; text-align: right;
  83. }
  84.  
  85. #head3 {
  86. color: #000000;width: 200;height: auto;
  87. font-family: Montserrat;
  88. font-size: 16px;
  89. text-align: right;
  90.  
  91. }
  92.  
  93. #main {
  94. position: absolute; margin: auto; right:511.6; bottom: 145.7; width: 138px; height: 138px; background: #7A6F6C; box-shadow: #9E988B 0px 0px 0px 0px; overflow: hidden; text-align: left;z-index:20;
  95. -webkit-transition: all 0.6s ease-out;
  96. transition: all 0.6s ease-out;border: 1px solid #000;-webkit-filter: grayscale(90%);
  97. filter: grayscale(100%);}
  98. #main:hover {-webkit-filter: grayscale(40%);}
  99.  
  100. #fuk {position: absolute;right: -1;bottom: -40px;}
  101. #fuk img {width: auto;height: 180; }
  102.  
  103.  
  104. #blur {position: fixed; right:340; bottom:208; height:10px; width: 161px; background-color: #; overflow: hidden; z-index:20;;opacity:1;background-image:url("http://www.clker.com/cliparts/0/e/2/6/1194989379339979681pattern-pinstripes-diagonal.svg.med.png");background-size:100px;border-top: 1px solid #000;}
  105.  
  106.  
  107. #line1 {position: fixed; right:501; bottom:135; height:160px; width: 160px; background-color: #; overflow: hidden; z-index:20;;opacity:1;background-image:url("http://www.clker.com/cliparts/0/e/2/6/1194989379339979681pattern-pinstripes-diagonal.svg.med.png");background-size:100px; border: 1px solid #000;}
  108.  
  109. #box {
  110. position: absolute;
  111. right: 327;
  112. bottom: 190;
  113. width: 194px;
  114. height: 0px;
  115. background-color: #000;
  116. border-top: 6px solid #000;
  117. border-bottom: 6px solid #000;
  118. z-index: 1;
  119. color: #000000;
  120. padding: 4;
  121. font-family: Montserrat;
  122. font-style: normal;
  123. font-weight: 100;
  124. text-align: justify;
  125. overflow-x: hidden;
  126. overflow-y: auto;
  127. font-size: 11px;
  128. -webkit-transition: all 0.9s ease-out;
  129. transition: all 0.9s ease-out;
  130. }
  131. body:hover #box { height: 300px;
  132. background-color: transparent;
  133. }
  134.  
  135. #intro {
  136. position: absolute;
  137. right:8;
  138. width: 180px;
  139. height: 240px;
  140. background-color: transparent;
  141. border: 0px solid #000;
  142. z-index: 3;
  143. color: #000;
  144. padding: 4;
  145. font-family: Montserrat;
  146. font-style: normal;
  147. font-weight: 100;
  148. text-align: justify;
  149. overflow-x: hidden;
  150. overflow-y: auto;
  151. font-size: 11px;
  152. -webkit-transition: all 0.6s ease-out;
  153. transition: all 0.6s ease-out; }
  154.  
  155.  
  156. .darts {
  157. position: fixed;bottom:35px;right:343;
  158. width: 190px;
  159. height: 95px;
  160. opacity: 0; z-index: 1;
  161. text-align: left;
  162. -webkit-transition: all 0.6s ease-out;
  163. -moz-transition: all 0.6s ease-out;
  164. -ms-transition: all 0.6s ease-out;
  165. -o-transition: all 0.6s ease-out;
  166. transition: all 0.6s ease-out;
  167. }
  168.  
  169. .darts:target {bottom:35px;right:343;
  170. z-index: 5;
  171. -webkit-transition: all 0.6s ease-out;
  172. -moz-transition: all 0.6s ease-out;
  173. -ms-transition: all 0.6s ease-out;
  174. -o-transition: all 0.6s ease-out;
  175. transition: all 0.6s ease-out;
  176. opacity: 1;
  177. }
  178.  
  179. .dicks {
  180. position: absolute;right:-5;
  181. width: 320px;
  182. height: 110px;
  183. background-color: #;
  184. border-left: 1px solid #000;
  185. border-bottom: 1px solid #000;
  186. z-index: 5;
  187. color: #000;
  188. padding: 2;
  189. font-family: Montserrat;
  190. font-style: normal;
  191. font-weight: 500;
  192. text-align: justify;
  193. overflow-x: hidden;
  194. overflow-y: auto;
  195. font-size: 11px;
  196. -webkit-transition: all 0.6s ease-out;
  197. transition: all 0.6s ease-out;
  198.  
  199. }
  200.  
  201.  
  202. #god {
  203. position: absolute; margin: auto; width: 20px; height: 50px;
  204. right: 520px;
  205. bottom: 193;
  206. background-color: transparent;
  207. border: ; opacity:1;line-height:18px;
  208. height: px; z-index:5;
  209. text-align:left; }
  210.  
  211. #pbs {
  212. position: absolute; margin: auto; width: 20px; height: 50px;
  213. right: 520px;
  214. bottom: 293;margin-left:1px;
  215. background-color: transparent;
  216. border: ; opacity:1;line-height:18px;
  217. height: px; z-index:5;
  218. text-align:left; }
  219.  
  220. .sts { position: absolute; margin: auto; right: 415px; bottom: 165;
  221. font-family: Questrial; font-size: 12px;width:65px; height: 13px; text-align: RIGHT; font-weight:100; color: #f3f3f3; background-color: #000; padding: 3px; line-height: 13px;
  222. border-bottom: 1px solid #f3f3f3; border-right: 2px solid #f3f3f3;
  223. -webkit-transition: all 2s ease-out;
  224. transition: all 2s ease-out;
  225. }
  226. .sts:hover{ background-color: #696969;-webkit-transition: all 0.6s ease-out;
  227. transition: all 0.6s ease-out;}
  228.  
  229. .sts2 { position: absolute; margin: auto; right: 339px; bottom: 165;
  230. font-family: Questrial; font-size: 12px;width:65px; height: 13px; text-align: RIGHT; font-weight:100; color: #f3f3f3; background-color: #000; padding: 3px; line-height: 13px;
  231. border-bottom: 1px solid #f3f3f3; border-right: 2px solid #f3f3f3;
  232. -webkit-transition: all 2s ease-out;
  233. transition: all 2s ease-out;
  234. }
  235. .sts2:hover{ background-color: #696969;-webkit-transition: all 0.6s ease-out;
  236. transition: all 0.6s ease-out;}
  237.  
  238. .sts3 { position: absolute; margin: auto; right: 415px; bottom: 143;
  239. font-family: Questrial; font-size: 12px;width:65px; height: 13px; text-align: RIGHT; font-weight:100; color: #f3f3f3; background-color: #000; padding: 3px; line-height: 13px;
  240. border-bottom: 1px solid #f3f3f3; border-right: 2px solid #f3f3f3;
  241. -webkit-transition: all 2s ease-out;
  242. transition: all 2s ease-out;
  243. }
  244. .sts3:hover{ background-color: #696969;-webkit-transition: all 0.6s ease-out;
  245. transition: all 0.6s ease-out;}
  246.  
  247.  
  248. .sts4 { position: absolute; margin: auto; right: 339px; bottom: 143;
  249. font-family: Questrial; font-size: 12px;width:65px; height: 13px; text-align: RIGHT; font-weight:100; color: #f3f3f3; background-color: #000; padding: 3px; line-height: 13px;
  250. border-bottom: 1px solid #f3f3f3; border-right: 2px solid #f3f3f3;
  251. -webkit-transition: all 2s ease-out;
  252. transition: all 2s ease-out;
  253. }
  254. .sts4:hover{ background-color: #696969;-webkit-transition: all 0.6s ease-out;
  255. transition: all 0.6s ease-out;}
  256.  
  257. .pkmn { position: absolute; margin: auto; right: 385px; bottom: 275;
  258. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 13px;
  259. border-bottom: 1px solid #000; border-left: 1px solid #000;
  260. -webkit-transition: all 2s ease-out;
  261. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  262. .pkmn:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  263.  
  264. .pkmn2 { position: absolute; margin: auto; right: 385px; bottom: 255;
  265. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 15px;
  266. border-bottom: 1px solid #000; border-left: 1px solid #000;
  267. -webkit-transition: all 2s ease-out;
  268. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  269. .pkmn2:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  270.  
  271. .pkmn3 { position: absolute; margin: auto; right: 421px; bottom: 275;
  272. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 13px;
  273. border-bottom: 1px solid #000; border-left: 1px solid #000;
  274. -webkit-transition: all 2s ease-out;
  275. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  276. .pkmn3:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  277.  
  278. .pkmn4 { position: absolute; margin: auto; right: 421px; bottom: 255;
  279. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 15px;
  280. border-bottom: 1px solid #000; border-left: 1px solid #000;
  281. -webkit-transition: all 2s ease-out;
  282. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  283. .pkmn4:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  284.  
  285. .pkmn5 { position: absolute; margin: auto; right: 456px; bottom: 275;
  286. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 13px;
  287. border-bottom: 1px solid #000; border-left: 1px solid #000;
  288. -webkit-transition: all 2s ease-out;
  289. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  290. .pkmn5:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  291.  
  292. .pkmn6 { position: absolute; margin: auto; right: 456px; bottom: 255;
  293. font-family: Questrial; font-size: 8px;width:25px; height: 13px; text-align: RIGHT; font-weight:100; color: #000; background-color: #; padding: 3px; line-height: 15px;
  294. border-bottom: 1px solid #000; border-left: 1px solid #000;
  295. -webkit-transition: all 2s ease-out;
  296. transition: all 2s ease-out;-webkit-filter: grayscale(90%); }
  297. .pkmn6:hover{ border-bottom: 1px solid #696969; border-left: 1px solid #696969;-webkit-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  298.  
  299. #msc {
  300. position: absolute; margin: auto; right:340; bottom: 254; width: 40px; height: 41px; background: #000; border: px solid #B8AEA7; box-shadow: #9E988B 0px 0px 0px 0px; overflow: hidden; text-align: left;z-index:20;
  301. -webkit-transition: all 0.6s ease-out;
  302. transition: all 0.6s ease-out;border: 1px solid #000;}
  303.  
  304. /*thanks juice*/
  305. .musicplayer{
  306. position: absolute; /* YOU CAN CHANGE THE POSITION */
  307. bottom: 5px;
  308. left: 5px;
  309. height: 30px;
  310. width: 30px;
  311. line-height: 30px;
  312. font-size: 20px;
  313. color: #fff; /* COLOUR OF ARROW */
  314. text-align: center;
  315. padding-left: 5px;
  316. margin-left: -5px;
  317. border-radius: 360px;
  318. overflow: hidden;
  319. }
  320.  
  321. .musicplayer:active {
  322. color: #000; /* COLOUR OF ARROW WHEN YOU CLICK IT */
  323. }
  324. .moosic{
  325. float: left;
  326. margin-top: -30px;
  327. margin-left: -2px;
  328. height: 30px;
  329. width: 30px;
  330. overflow: hidden;
  331. opacity: 0;
  332. }
  333.  
  334.  
  335. #pb img {width: auto;height: 7px;}
  336. </style>
  337. <div id="blur"></div><div id="line1"></div><a href="#"><div id="main"><div id="fuk"><img src="http://i.picpar.com/ISxc.png"></div></div></a>
  338. <div id="ufuk"><img src="http://i.picpar.com/JSxc.png"></div>
  339.  
  340.  
  341.  
  342. <div id="god">
  343. <div id="head">ふざけるな</div><br><div id="head3">AMELIA; 18; TRAINER</div></div>
  344.  
  345. <a href="#2"><div class="sts">intro</div></a><a href="#3"><div class="sts2">persona</div></a><a href="#1"><div class="sts3">dossier</div></a><a href="#4"><div class="sts4">typist</div></a>
  346.  
  347. <div id="msc">
  348. <div class="musicplayer" title="click once.">
  349. <div class="moosic">
  350. <audio controls>
  351. <source src="https://my.mixtape.moe/luvpri.mp3">
  352. </audio>
  353. </div>
  354. </div>
  355. </div>
  356.  
  357. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Arbok_(Pok%C3%A9mon)" target="_blank"class="cons"><div class="pkmn">ARBOK
  358. <span><img src="http://i.picpar.com/DSxc.png" align="left" height="75px">ARBOK <br>
  359. -info later-
  360. </span></div></a>
  361.  
  362.  
  363. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Grimer_(Pok%C3%A9mon)" target="_blank"class="cons"><div class="pkmn2">GRIMER
  364. <span><img src="http://i.picpar.com/ASxc.png" align="left" height="75px">GRIMER<br> -info later-
  365. </span></div></a>
  366.  
  367. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Mismagius_(Pok%C3%A9mon)" target="_blank"class="cons"><div class="pkmn3">MISMAG
  368. <span><img src="http://i.picpar.com/9Sxc.png" align="left" height="55px">MISMAGIUS<br> -info later </span></div></a>
  369.  
  370. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Frillish_(Pok%C3%A9mon)" target="_blank"class="cons"><div class="pkmn4">FRILLI
  371. <span><img src="http://i.picpar.com/6Sxc.png" align="left" height="75px">FRILLISH<br> -info later-
  372.  
  373. </span></div></a>
  374.  
  375. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Haunter_(Pok%C3%A9mon)" target="_blank"class="cons"><div class="pkmn5">HAUNT
  376. <span><img src="http://i.picpar.com/7Sxc.png" align="left" width="95px">HAUNTER<br> -info later-</span></div></a>
  377.  
  378. <a target="_blank" href="https://bulbapedia.bulbagarden.net/wiki/Croagunk_(Pok%C3%A9mon))" target="_blank"class="cons"><div class="pkmn6">CROGU
  379. <span><img src="http://i.picpar.com/5Sxc.png" align="left" width="80px">CROGUNK <br> -info later-</span></div></a>
  380.  
  381.  
  382.  
  383.  
  384.  
  385. <div id="1" class="darts">
  386. <div class="dicks">
  387. NAME <font style="float:right;color:#696969;"><b>AMELIA DAEVA</b></font><br>
  388. AGE <font style="float:right;color:#696969;"><b>EIGHTEEN</b></font><br>
  389. GENDER <font style="float:right;color:#696969;"><b>FEMALE</b></font><br>
  390. MARITAL <font style="float:right;color:#696969;"><b>NON-COMMITED</b></font><br>
  391. ORIENTATION <font style="float:right;color:#696969;"><b>BISEXUAL</b></font><br>
  392. OCCUPATION <font style="float:right;color:#696969;"><b> TRAINER</b></font><br>
  393. TYPE PERF. <font style="float:right;color:#696969;"><b>GHOST/POISON</b></font><br>
  394. </div>
  395. </div>
  396.  
  397.  
  398. <div id="2" class="darts">
  399. <div class="dicks">
  400. <font style="float:right;color:#696969;"><b><i>FIAT JUSTITIA RUAT CAELUM //</b></font><br></i>
  401.  
  402.  
  403.  
  404. ((im lazy, come back later))
  405.  
  406.  
  407.  
  408.  
  409.  
  410. </div>
  411. </div>
  412.  
  413.  
  414. <div id="3" class="darts">
  415. <div class="dicks">
  416. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  417. </div>
  418. </div>
  419.  
  420.  
  421. <div id="4" class="darts">
  422. <div class="dicks">
  423. [00] <b>THESE</b>; are OOC rules, dumdum.<br>
  424. [01] <b>THESE</b>; are OOC rules, dumdum.<br>
  425. [02] <b>THESE</b>; are OOC rules, dumdum.<br>
  426. [03] <b>THESE</b>; are OOC rules, dumdum.<br>
  427. [04] <b>THESE</b>; are OOC rules, dumdum.<br>
  428. [05] <b>THESE</b>; are OOC rules, dumdum.<br>
  429. [06] <b>THESE</b>; are OOC rules, dumdum.<br>
  430. [07] <b>THESE</b>; are OOC rules, dumdum.<br>
  431. </div>
  432. </div>
  433.  
  434.  
  435.  
  436. <a href="profile.php?user=Punpun" title="Coded by Punpun." target="_blank"><img src="http://i.imgur.com/acD32sR.png" style="position:fixed; left:10; bottom:0;width:25;-webkit-transform: scaleX(-1); filter: FlipH;"></a></body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement