Advertisement
Guest User

Bubblin'

a guest
Mar 21st, 2018
152
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.33 KB | None | 0 0
  1. <style type="text/css">
  2.  
  3. @import url('https://fonts.googleapis.com/css?family=Karla');
  4. @import url(https://fonts.googleapis.com/css?family=Squada+One);
  5. @import url('https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz');
  6.  
  7. body { background-color: #; background-image: url(https://i.imgur.com/nX3ce5f.png); background-attachment: fixed; background-position: center center; background-repeat: repeat; background-size: auto;}
  8.  
  9. ::-webkit-scrollbar-track {background-color:;}
  10. ::-webkit-scrollbar-thumb {background-color:;}
  11. ::-webkit-scrollbar {width:2px;height:5px;}
  12.  
  13. a { background: #9C6B6E; padding: 2px 5px 2px 5px; font-size: 10px; border-radius: 5px; font-family: karla; color: #fff; text-decoration: none;}
  14. a:hover {color: #fff; text-decoration: line-through; cursor: url('http://media.tumblr.com/e7f72e808c4dbe5006b9c3a30dbc9b79/tumblr_inline_mh67vhwGnR1rdqsqf.png');}
  15. *{cursor: url('http://media.tumblr.com/7c3edb626c8cf9435c5c0b2d6acceffd/tumblr_inline_mh67v6xNXM1rdqsqf.png'), default;}
  16.  
  17. b, strong { background: #DF9CFF; padding: 2px 5px 2px 5px; font-size: 10px; border-radius: 5px; font-family: karla; color: #fff; }
  18.  
  19. .bar1 { background-color: #; position: absolute; top: 170px; left: 320px; height: 420px; width: 120px; border: 0px solid #BDBDBD; overflow: hidden; z-index: 1000; z-index: 1;}
  20.  
  21. .bar2 { background-color: #9C6B6E; position: absolute; top: 170px; left: 460px; height: 420px; width: 10px; border: 5px solid #736C64; overflow: hidden; z-index: 1000; z-index: 1;}
  22.  
  23. .box {background-color: #9C6B6E; position: absolute; top: 150; left: 10; height: 460; width: 300; overflow: hidden; }
  24.  
  25. .Box4 {position:absolute; top: 160px; left: 20px; height:420px; width: 260px; background:url('https://i.imgur.com/FK9uinU.jpg'); background-size: 100% 100%; overflow:hidden; border: 5px solid white; padding: 5px;}
  26.  
  27. .poke {color:#8a8790; font-size:12px; text-align: none; font-family: karla; line-height: 16px; padding: 3px; text-align: justify; }
  28.  
  29. .effect {height: 420px; width: 260px; background-color:#F2F2F2; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out;}
  30.  
  31. .effect:hover {filter: alpha(opacity=100); opacity: 1; overflow:auto;}
  32.  
  33. .img1 { position: absolute; top: 157px; left: 335px; height: 100px; width: 100px; background-image: url("https://78.media.tumblr.com/747a5ad26b1d4b7bf7834cf980b217c3/tumblr_p0m19iQECg1tendr1o1_1280.gif"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #; z-index: 2;}
  34.  
  35. .img2 { position: absolute; top: 305.5px; left: 335px; height: 100px; width: 100px; background-image: url("https://78.media.tumblr.com/1adba5e4c08b88942d10260f024f417e/tumblr_p0m19iQECg1tendr1o2_1280.gif"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #; z-index: 2;}
  36.  
  37. .img3 { position: absolute; top: 454px; left: 335px; height: 100px; width: 100px; background-image: url("https://78.media.tumblr.com/5beac5f13fe99bf622f4e520c5330228/tumblr_p0m19iQECg1tendr1o5_1280.gif"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #; z-index: 2;}
  38.  
  39. .abox { background-color: #; color: #9C6B6E; font-size: 12px; font-family: 'karla', sans-serif; text-align: justify; position: absolute; width: 234; height: 393; left: 490; top: 170; line-height: 16px; padding: 3px; overflow:auto; border: 1px solid #transparent; }
  40.  
  41. .bbox { background-color: #F2F2F2; color: #9C6B6E; font-size: 12px; font-family: 'karla', sans-serif; text-align: justify; position: absolute; width: 234; height: 393; left: 790; top: 170; line-height: 16px; padding: 3px; overflow:auto; border: 1px solid #transparent; }
  42.  
  43. .navbar {Background-color: transparent; Position: absolute; Left: 330px; top: 153px; padding: 4px; z-index: 7000; }
  44.  
  45. .link1 {Position: absolute; Border: solid 2px #fff; Height: 90px; Width: 90px; background-color: #F0EDE8; opacity: 0;}
  46.  
  47. .link2 {Position: absolute; Top: 152px; Border: solid 2px #fff; Height: 90px; Width: 90px; background-color: #F0EDE8; opacity: 0;}
  48.  
  49. .link3 {Position: absolute; Top: 301px; Border: solid 2px #fff; Height: 90px; Width: 90px; background-color: #F0EDE8; opacity: 0;}
  50.  
  51. .link1:hover {Border: solid 2px #F0EDE8; opacity: 0;}
  52. .link2:hover {Border: solid 2px #F0EDE8; opacity: 0;}
  53. .link3:hover {Border: solid 2px #F0EDE8; opacity: 0;}
  54.  
  55. .slide {Position: fixed; Height: 555555; Width: 555555; Top: 0px; Left: 0; Z-index: -1; Opacity: 0; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
  56.  
  57. .slide:target {Top: 0; Opacity: 1; Z-index: 3000; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
  58.  
  59. h1 { Color: #fff; font-family: 'Baumans'; text-shadow: -1px 0px 0px #fff, 0px 1px 0px #fff, 1px 0px 0px #fff, 0px -1px 0px #fff; font-size: 13px; text-align: center; font-family: 'Squada One'; color: #9C6B6E; text-align: center; line-height: 3px; font-size: 30px;}
  60.  
  61. credit { position: fixed; Bottom: 10px; Right: 10px; font-size: 15px; font-family: Yanone Kaffeesatz; text-align: justify; color: #000; z-index: 7000; text-align: center; line-height: 25px;}
  62.  
  63. .aimg {background-color: #fff; position: absolute; width: 225; height: 130; left: 740; top:320; overflow:auto; border:4px #736C64;}
  64. .bimg {background-color: #fff; position: absolute; width: 225; height: 130; left: 740; top:470; overflow:auto; border:4px #736C64;}
  65. .cimg {background-color: #fff; position: absolute; width: 225; height: 130; left: 740; top:170; overflow:auto; border:4px #736C64;}
  66.  
  67. #ufuk {position: fixed;right: 0;bottom: -50px;}
  68. #ufuk img {width: auto;height: 600;}
  69.  
  70. #ufuk2 {position: fixed;right: 53%;bottom: 0px;}
  71. #ufuk2 img {width: auto;height: 250;}
  72. </style>
  73.  
  74.  
  75. <div id="ufuk"><img src="http://i.picpar.com/vN9c.png"></div>
  76. <div id="ufuk2"><img src="https://78.media.tumblr.com/e53ca1da8e41be705019daef612b6655/tumblr_nvtbo2aTWz1s4xw3po1_500.gif"></div>
  77. <div class="bar1"></div>
  78. <div class="bar2"></div>
  79. <div class="box"></div>
  80. <div class="img1"></div>
  81. <div class="img2"></div>
  82. <div class="img3"></div>
  83.  
  84.  
  85. <div class="navbar">
  86. <a class="link1" href="#1"></a>
  87. <a class="link2" href="#2"></a>
  88. <a class="link3" href="#3"></a>
  89. </div></div>
  90.  
  91. <div id="1" class="slide">
  92. <div class="abox">
  93.  
  94. <h1>History & Personality</h1>
  95.  
  96.  
  97.  
  98.  
  99.  
  100. </div>
  101. <div class="aimg">
  102. <img src="https://78.media.tumblr.com/9921812ec2af18dd4a41d1c953c76256/tumblr_oxlor2MgZv1wwul2oo1_500.gif" Height="100%" Width="100%">
  103. </div>
  104.  
  105. <div class="bimg">
  106. <img src="https://78.media.tumblr.com/78fbf07faa49319d30fbeac31fc15a2d/tumblr_ozvwwtypvq1vm3yplo1_500.gif" Height="100%" Width="100%">
  107. </div>
  108.  
  109. <div class="cimg">
  110. <img src="https://78.media.tumblr.com/57dd9cf5d89d72cda59a7b7f369b1667/tumblr_p16opqdW7W1wn8ljoo1_1280.gif" Height="100%" Width="100%">
  111. </div>
  112.  
  113. </div>
  114.  
  115.  
  116.  
  117. <div id="2" class="slide">
  118. <div class="abox">
  119. <h1>Friends</h1><br>
  120. <center>
  121. <a href="" target="_blank"><img src="" class="circle" height="65" width="65" border="1"></a><br>
  122.  
  123. <br>
  124. <a href="" target="_blank"><img src="" class="circle" height="65" width="65" border="1"></a><br>
  125.  
  126.  
  127. </div>
  128. <div class="aimg">
  129. <img src="https://i.imgur.com/TKIsui3.gif" Height="100%" Width="100%">
  130. </div>
  131.  
  132. <div class="bimg">
  133. <img src="https://78.media.tumblr.com/9b3f3837e57544902a1823dd9ce98fe1/tumblr_oajaenazj71ryj37no1_500.gif" Height="100%" Width="100%">
  134. </div>
  135.  
  136. <div class="cimg">
  137. <img src="https://78.media.tumblr.com/efe703a7dfa09fca26d148a1f4e97f83/tumblr_p08y7bbXvU1uxra4ao1_1280.gif" Height="100%" Width="100%">
  138. </div>
  139. </div>
  140.  
  141.  
  142. <div class="box4"><div class="effect"><div class="poke">
  143.  
  144. <h1>Stats</h1>
  145.  
  146. <font style=float:left>Name:</font> <font style=float:right></font><br>
  147. <br><font style=float:left>Age: </font><font style=float:right></font>
  148. <br>
  149. <br><font style=float:left>Race: </font><font style=float:right></font>
  150. <br><br><font style=float:left>Height:</font> <font style=float:right></font>
  151. <br><br><font style=float:left>Build:</font> <font style=float:right></font>
  152. <br><br><font style=float:left>Marital:</font> <font style=float:right></font>
  153. <br><br><font style=float:left>Lineage:</font> <font style=float:right></font>
  154. <br><br><font style=float:left>Orientation:</font> <font style=float:right></font>
  155. <br><br><font style=float:left>Gallery:</font> <font style=float:right><a href="" class="navi">Here </a>
  156.  
  157. </font>
  158.  
  159.  
  160. <br><br>
  161.  
  162. </div>
  163. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement