Advertisement
Guest User

Pretty code

a guest
Jul 26th, 2017
53
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.46 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: #EBEBEB; background-image: url(http://static.tumblr.com/adedf73fd2e7cba52cc893965d1b41ba/5qwc8k3/hlPoryn66/tumblr_static_7e83tl5lxe04wgco80wogk4ow.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: #FFC4C1; 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: #207C91; padding: 2px 5px 2px 5px; font-size: 10px; border-radius: 5px; font-family: karla; color: #fff; }
  18.  
  19. .bar1 { background-color: #FFC4C1; position: absolute; top: 0px; left: 320px; height: 98%; width: 120px; border: 5px solid #FFC4C1; overflow: hidden; z-index: 1000; z-index: 1;}
  20.  
  21. .bar2 { background-color: #FFC4C1; position: absolute; top: 0px; left: 460px; height: 98%; width: 10px; border: 5px solid #FFC4C1; overflow: hidden; z-index: 1000; z-index: 1;}
  22.  
  23. .box {background-color: #FFC4C1; 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('http://i.picpar.com/4z0c.png'); background-size: 100% 100%; overflow:hidden; border: 5px solid white; padding: 5px;}
  26.  
  27. .poke {color:#fff; font-size:12px; text-align: none; font-family: karla; line-height: 16px; padding: 3px; text-align: justify; }
  28.  
  29. .effect {height: 400px; width: 260px; background-color:#FFC4C1; 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: 150px; left: 330px; height: 100px; width: 100px; background-image: url("https://68.media.tumblr.com/4dd876a99275180e55bc0e64cd9d1d24/tumblr_oocz01jwEX1w96bifo1_540.png"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #fff; z-index: 2;}
  34.  
  35. .img2 { position: absolute; top: 298.5px; left: 330px; height: 100px; width: 100px; background-image: url("https://68.media.tumblr.com/b95be413fc21a9dd2e0484b04570cdb6/tumblr_op8bul95IL1w96bifo1_540.png"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #fff; z-index: 2;}
  36.  
  37. .img3 { position: absolute; top: 447px; left: 330px; height: 100px; width: 100px; background-image: url("https://68.media.tumblr.com/29a3dbfcdeebf0f401cfb87ed710c48c/tumblr_o7xedpaoxy1v2ubzdo1_250.png"); background-size: 100% 100%; background-position: center center; overflow: hidden; border: 5px solid #fff; z-index: 2;}
  38.  
  39. .abox { background-color: #F2F2F2; color: #FFC4C1; 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: #FFC4C1; 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: .5;}
  52. .link2:hover {Border: solid 2px #F0EDE8; opacity: .5;}
  53. .link3:hover {Border: solid 2px #F0EDE8; opacity: .5;}
  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: #FFC4C1; font-family: 'Baumans'; text-shadow: -1px 0px 0px #FFC4C1, 0px 1px 0px #FFC4C1, 1px 0px 0px #FFC4C1, 0px -1px 0px #FFC4C1; font-size: 13px; text-align: center; font-family: 'Squada One'; color: #F2F2F2; 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:1px #FFC4C1;}
  64. .bimg {background-color: #fff; position: absolute; width: 225; height: 130; left: 740; top:470; overflow:auto; border:1px #FFC4C1;}
  65. .cimg {background-color: #fff; position: absolute; width: 225; height: 130; left: 740; top:170; overflow:auto; border:1px #FFC4C1;}
  66. .Dimg {background-color: #fff; position: absolute; width: 250; height: 400; Right:260 ; bottom:240; overflow:auto; border:5px #FFC4C1; padding: 5px;}
  67.  
  68.  
  69. </style>
  70.  
  71. <div class="bar1"></div>
  72. <div class="bar2"></div>
  73. <div class="box"></div>
  74. <div class="img1"></div>
  75. <div class="img2"></div>
  76. <div class="img3"></div>
  77.  
  78.  
  79. <div class="navbar">
  80. <a class="link1" href="#1"></a>
  81. <a class="link2" href="#2"></a>
  82. <a class="link3" href="#3"></a>
  83. </div></div>
  84.  
  85. <div class="Dimg">
  86. <img src="http://i.picpar.com/9z0c.png" Height="100%" Width="100%">
  87. </div>
  88. <div id="1" class="slide">
  89. <div class="abox">
  90.  
  91. <h1>History & Personality</h1>
  92.  
  93.  
  94.  
  95.  
  96.  
  97.  
  98. </div>
  99. <div class="aimg">
  100. <img src="https://68.media.tumblr.com/c4a94de1530b4f7c3ec9ccb7bd083cd9/tumblr_oq1ny0YvoL1wp7fl7o9_250.gif" Height="100%" Width="100%">
  101. </div>
  102.  
  103. <div class="bimg">
  104. <img src="https://68.media.tumblr.com/548f46de6668be0c1a80e55156e7217e/tumblr_o4b7esJgZQ1uzdqx3o1_1280.jpg" Height="100%" Width="100%">
  105. </div>
  106.  
  107. <div class="cimg">
  108. <img src="https://68.media.tumblr.com/8e65557c0f387f071d3de489d76db0ba/tumblr_opx347q9yp1wpvgtho1_400.gif" Height="100%" Width="100%">
  109. </div>
  110.  
  111. </div>
  112.  
  113.  
  114.  
  115. <div id="2" class="slide">
  116. <div class="abox">
  117. <h1>Friends</h1><br>
  118. <center>
  119. <a href="" target="_blank"><img src="" class="circle" height="65" width="65" border="1"></a><br>
  120.  
  121. <br>
  122. <a href="" target="_blank"><img src="" class="circle" height="65" width="65" border="1"></a><br>
  123.  
  124.  
  125. </div>
  126. <div class="aimg">
  127. <img src="https://68.media.tumblr.com/1d2c48f2b9e1fa5da1711c6dc30e188e/tumblr_okgoqeFVhK1uxgruxo3_500.gif" Height="100%" Width="100%">
  128. </div>
  129.  
  130. <div class="bimg">
  131. <img src="https://68.media.tumblr.com/78310893faa1dbdbb97caabb1e66d521/tumblr_oq1ny0YvoL1wp7fl7o3_500.gif" Height="100%" Width="100%">
  132. </div>
  133.  
  134. <div class="cimg">
  135. <img src="https://68.media.tumblr.com/c9f8e5c9fd9c169e2497ffadc8795886/tumblr_nzj8e9EEcB1u55px9o1_1280.jpg" Height="100%" Width="100%">
  136. </div>
  137. </div>
  138.  
  139.  
  140. <div class="box4"><div class="effect"><div class="poke">
  141.  
  142. <h1>Stats</h1>
  143.  
  144. </font>
  145.  
  146. <font style=float:left>Name:</font> <font style=float:right>Hiji</font><br>
  147. <br><font style=float:left>Age: </font><font style=float:right>Don't ask</font>
  148. <br>
  149. <br><font style=float:left>Looks</font><font style=float:right>Pretty</font>
  150. <br><br><font style=float:left>Height:</font> <font style=float:right>5,4</font>
  151. <br><br><font style=float:left>Build:</font> <font style=float:right>thin</font>
  152. <br><br><font style=float:left>Marital:</font> <font style=float:right>Single</font>
  153. <br><br><font style=float:left>Face:</font> <font style=float:right><a href="http://i.picpar.com/Bz0c.jpg" target="_blank">Here</a><br></font>
  154. <br><br><font style=float:left>Orientation:</font> <font style=float:right>Bisexual</font>
  155. <br><br>
  156.  
  157. </div>
  158. </div>
  159.  
  160. Layout © <a href="http://pastebin.com/u/A_Bad_Bitch" target="_blank">A Bad Bitch</a>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement