API tools faq
paste
Beautifulie

punk. <3

Beautifulie
Apr 22nd, 2014
134
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 10.49 KB | None | 0 0
raw download clone embed print report
  1. <style type="text/css">
  2. @font-face {font-family: 'pixel'; src: local('04b24'), url('http://static.tumblr.com/zm7jcjw/dtClscghb/04b_24__.ttf') format('woff'); }
  3.  
  4.  
  5. #profile { border: hidden; background-color: transparent; }
  6.  
  7. .pfor {display:none;}
  8.  
  9. body{
  10. background:#000000;
  11. background-image:url(https://p.gr-assets.com/540x540/fit/hostedimages/1380435889/880803.jpg);
  12. background-size:25%;
  13. background-position: 100% 100%;
  14. background-repeat:no-repeat;
  15. background-attachment:fixed;
  16. }
  17.  
  18. @import url(http://fonts.googleapis.com/css?family=Grand+Hotel);
  19.  
  20. ::-webkit-scrollbar-button:vertical:{background-color: transparent;
  21. -moz-border-radius: 0px 0px 0px 0px;
  22. border-radius:0px 0px 0px 0px;}
  23. ::-webkit-scrollbar-thumb:vertical {background-color: transparent; height:20px;
  24. -moz-border-radius: 0px 0px 0px 0px;
  25. border-radius:0px 0px 0px 0px;}
  26. ::-webkit-scrollbar-thumb:horizontal {background-color: transparent; height:20px !important;
  27. -moz-border-radius: 0px 0px 0px 0px;
  28. border-radius:0px 0px 0px 0px;}
  29. ::-webkit-scrollbar { height:20px; width: 3px; background-color:transparent;}
  30.  
  31. h1{
  32. font-size: 20px;
  33. font-variant: small-caps;
  34. color: #444444;
  35. text-transform: lowercase;
  36. letter-spacing: -1px;
  37. text-align: right;
  38. background-color: none;
  39. line-height: 2px;
  40. text-align: center;
  41. font-family: century gothic;
  42. text-shadow: #003366 2px 3px 4px;
  43. margin-top: 5px;
  44. margin-bottom: 8px;
  45. display: block;
  46. background-color: #151413;
  47. border-right: 1px solid #4B4330;
  48. padding: 0px;
  49. font-weight: normal;
  50. }
  51.  
  52. h2{
  53. font-size: 20px;
  54. font-variant: small-caps;
  55. color: #444444;
  56. text-transform: lowercase;
  57. letter-spacing: -1px;
  58. text-align: right;
  59. background-color: none;
  60. line-height: 2px;
  61. text-align: center;
  62. font-family: century gothic;
  63. text-shadow: #D89C00 2px 3px 4px;
  64. margin-top: 5px;
  65. margin-bottom: 8px;
  66. display: block;
  67. background-color: #151413;
  68. border-right: 1px solid #4B4330;
  69. padding: 0px;
  70. font-weight: normal;
  71. }
  72.  
  73. h3{
  74. font-size: 20px;
  75. font-variant: small-caps;
  76. color: #444444;
  77. text-transform: lowercase;
  78. letter-spacing: -1px;
  79. text-align: right;
  80. background-color: none;
  81. line-height: 2px;
  82. text-align: center;
  83. font-family: century gothic;
  84. text-shadow: #993366 2px 3px 4px;
  85. margin-top: 5px;
  86. margin-bottom: 8px;
  87. display: block;
  88. background-color: #151413;
  89. border-right: 1px solid #4B4330;
  90. padding: 0px;
  91. font-weight: normal;
  92. }
  93.  
  94. h4{
  95. font-size: 20px;
  96. font-variant: small-caps;
  97. color: #444444;
  98. text-transform: lowercase;
  99. letter-spacing: -1px;
  100. text-align: right;
  101. background-color: none;
  102. line-height: 2px;
  103. text-align: center;
  104. font-family: century gothic;
  105. text-shadow: #CCCCCC 2px 3px 4px;
  106. margin-top: 5px;
  107. margin-bottom: 8px;
  108. display: block;
  109. background-color: #151413;
  110. border-right: 1px solid #4B4330;
  111. padding: 0px;
  112. font-weight: normal;
  113. }
  114.  
  115. #line{
  116. position:absolute;
  117. top: 100px;
  118. right:500px;
  119. width:500px;
  120. padding: 5px;
  121. color: #993333;
  122. text-shadow: 3px 0px 0px #333333;
  123. font-size: 25px;
  124. text-align: left;
  125. font-weight: light;
  126. font-style: italic;
  127. font-family: Georgia;
  128. text-indent: 45px;
  129. background-color:black;
  130. border-radius: 0px 0px 0px 0px;
  131. }
  132.  
  133. .Navi {
  134. position: fixed;
  135. left: 265px;
  136. top: 130px;
  137. width: 600px;
  138. height: 200px;
  139. }
  140.  
  141. a.ine:link, a.ine:active, a.ine:visited {
  142. text-transform: lowercase;
  143. display: inline-block;
  144. width: 100px;
  145. height: 90px;
  146. padding: 5px;
  147. background-color: transparent;
  148. border: 2px solid transparent;
  149. cursor: url(http://cur.cursors-4u.net/others/oth-7/oth666.cur), default;
  150. -webkit-transition: all 0.4s ease-out;
  151. -moz-transition: all 0.4s ease-out;
  152. }
  153.        
  154. a.ine:hover {
  155. background-color: transparent;
  156. border: 2px solid transparent;
  157. cursor: url(http://cur.cursors-4u.net/others/oth-7/oth666.cur), default;
  158. }
  159.  
  160. .weed{
  161. position: absolute;
  162. width: 100px;
  163. height: 90px;
  164. border: 3px Solid #212121;
  165. background-color: transparent;
  166. background-repeat: no-repeat;
  167. background-position: 30px 30px;
  168. background-size: 100px 90px;
  169. }
  170.  
  171. .box {
  172. position: fixed;
  173. left: 383px;
  174. top: 250px;  
  175. width: 454px;
  176. height: 300px;
  177. padding: 5px;
  178. color: #212121;
  179. background-color: transparent;
  180. opacity: 0;
  181. transition: all 0.5s ease-in-out;
  182. -webkit-transition: all 0.5s ease-in-out;
  183. -moz-transition: all 0.5s ease-in-out;
  184. -o-transition: all 0.5s ease-in-out;
  185. -ms-transition: all 0.5s ease-in-out;
  186. }
  187.  
  188. .box:target {
  189. top: 250px;
  190. left: 383px;
  191. opacity: 1;
  192. transition: all 0.5s ease-in-out;
  193. -webkit-transition: all 0.5s ease-in-out;
  194. -moz-transition: all 0.5s ease-in-out;
  195. -o-transition: all 0.5s ease-in-out;
  196. -ms-transition: all 0.5s ease-in-out;
  197. }
  198.  
  199. .info{
  200. position: absolute;
  201. margin-top: 0px;
  202. margin-left: 0px;
  203. width: 454px;
  204. height: 300px;
  205. border: 3px Solid #212121;
  206. background-color: #070707;
  207. color: #212121;
  208. font-family: verdana;
  209. font-variant: small-caps;
  210. text-align: justify;  
  211. font-size: 10px;
  212. line-height: 13px;  
  213. overflow: auto;
  214. opacity: 1;
  215. }
  216.  
  217. .booze{
  218. height: 55px;
  219. width: 55px;
  220. margin: 2.7px;
  221. border: #212121 2px solid;
  222. opacity: 0.7;
  223. }
  224.  
  225. .booze:hover {
  226. height: 55px;
  227. width: 55px;
  228. margin: 2.7px;
  229. border: #444444 2px solid;
  230. opacity: 1;
  231. }
  232.  
  233. #no{
  234. position: fixed;
  235. top: 0px;
  236. left: 0px;
  237. right: 0px;
  238. bottom: 0px;
  239. }
  240.  
  241. </style>
  242.  
  243. <div id="no" oncontextmenu="return false;">
  244.  
  245. <div id="line">Public Enemy? Kid, you're just a punk</div>
  246.  
  247. <div class="navi">
  248. <a class="ine" href="#stats"><img src="http://25.media.tumblr.com/77425eeee703415dbb4b51ce077bd211/tumblr_mv5e1peUje1s9enn8o1_500.gif" class="weed"></img></a>
  249. <a class="ine" href="#lore"><img src="http://blog.mageworx.com/wp-content/uploads/2014/01/drive.gif" class="weed"></img></a>
  250. <a class="ine" href="#roster"><img src="http://31.media.tumblr.com/c17added403b91265d1bef4745d5a63b/tumblr_mxarofhgah1s9ccneo1_250.gif" class="weed"></img></a>
  251. <a class="ine" href="#ooc"><img src="http://31.media.tumblr.com/tumblr_m3pn92YCVb1rtxxano1_500.gif" class="weed"></img></a>
  252. </div>
  253.  
  254. <div id="stats" class="box">
  255. <div class="info">
  256. <font style=float:left><b>Name</b></font> <font style=float:right>Answer</font><br>
  257. <font style=float:left><b>Moniker(s)</b></font> <font style=float:right>Answer</font><br>
  258. <font style=float:left><b>Gender</b></font> <font style=float:right>Answer</font><br>
  259. <font style=float:left><b>Age</b></font> <font style=float:right>Answer</font><br>
  260. <font style=float:left><b>D.O.B</b></font> <font style=float:right>Answer</font><br>
  261. <font style=float:left><b>Zodiac</b></font> <font style=float:right>Answer</font><br>
  262. <font style=float:left><b>Hair Colour</b></font> <font style=float:right>Answer</font><br>
  263. <font style=float:left><b>Eye Hue</b></font> <font style=float:right>Answer</font><br>
  264. <font style=float:left><b>Body Type</b></font> <font style=float:right>Answer</font><br>
  265. <font style=float:left><b>Height</b></font> <font style=float:right>Answer</font><br>
  266. <font style=float:left><b>Weight</b></font> <font style=float:right>Answer</font><br>
  267. <font style=float:left><b>Skin Colour</b></font> <font style=float:right>Answer</font><br>
  268. <font style=float:left><b>Alignment</b></font> <font style=float:right>Answer</font><br>
  269. <font style=float:left><b>Affiliation</b></font> <font style=float:right>Answer</font><br>
  270. <font style=float:left><b>Marital Status</b></font> <font style=float:right>Answer</font><br>
  271. <font style=float:left><b>Sexual Orientation</b></font> <font style=float:right>Answer</font><br>
  272. </div></div>
  273.  
  274. <div id="lore" class="box">
  275. <div class="info">
  276. History here.
  277. </div></div>
  278.  
  279. <div id="ooc" class="box">
  280. <div class="info">
  281. <big>OO1</big>:
  282. <br><big>OO2</big>:
  283. <br><big>OO3</big>:
  284. <br><big>OO4</big>:
  285. <br><big>OO5</big>:
  286. <br><big>OO6</big>:
  287. <br><big>OO7</big>:
  288. <br><big>OO8</big>:
  289. <br><big>OO9</big>:
  290. <br><big>O10</big>:
  291. </div></div>
  292.  
  293. <div id="roster" class="box">
  294. <div class="info">
  295. <h1>The Lost & Dammed </h1>
  296. bla bla bla words go here. <br><br>
  297. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  298. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  299. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  300. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  301. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  302. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  303.  
  304. <h2>Los Salido</h2>
  305. bla bla bla words go here. <br><br>
  306. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  307. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  308. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  309. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  310. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  311. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  312.  
  313. <h3>The Purple Sharks </h3>
  314. bla bla bla words go here. <br><br>
  315. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  316. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  317. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  318. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  319. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  320. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  321.  
  322. <h4>De Luca Family </h4>
  323. bla bla bla words go here. <br><br>
  324. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  325. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  326. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  327. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  328. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  329. <a href="profile.php?user=" target="_blank" title=""><img src="http://placehold.it/55x55" class="booze"></a>
  330. </div></div>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!