Advertisement
bythestars

Juro

Jun 14th, 2019
154
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.00 KB | None | 0 0
  1. <style type="text/css">
  2. @import url('https://fonts.googleapis.com/css?family=Oswald|Staatliches');
  3.  
  4. #no {
  5. position: absolute;
  6. left: 0px;
  7. top: 0px;
  8. right: 0px;
  9. bottom: 0px;}
  10.  
  11. ::-webkit-scrollbar {
  12. width: 1px;}
  13.  
  14. ::-webkit-scrollbar-thumb {
  15. background: transparent;}
  16.  
  17. ::selection {
  18. color: #000;
  19. background: #fff;}
  20.  
  21. body {
  22. background-color: #660049;
  23. background-image: url(https://www.transparenttextures.com/patterns/checkered-pattern.png);
  24. cursor: url('https://78.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_540.png'), default;}
  25.  
  26. h2 {
  27. height: 24px;
  28. background-color: #B92669;
  29. text-align: center;
  30. font-family: 'Staatliches', cursive;
  31. color: #D04C5E;
  32. font-size: 23px;
  33. line-height: 24px;
  34. letter-spacing: 4px;
  35. text-transform: lowercase;
  36. font-weight: bold;
  37. margin-top: 5px;
  38. margin-bottom: 12px;}
  39.  
  40. a {
  41. color: #B92669;
  42. text-decoration: none;}
  43.  
  44. b {
  45. color:#660049;
  46. font-family: Oswald, sans-serif;
  47. text-transform: uppercase;
  48. font-size: 12px;
  49. letter-spacing: 1;
  50. }
  51.  
  52. i {
  53. color:#B92669;
  54. font-family: Oswald, sans-serif;
  55. text-transform: lowercase;
  56. font-size: 12px;
  57. letter-spacing: 1;}
  58.  
  59. u {
  60. color:#E77152;
  61. font-family: Oswald, sans-serif;
  62. text-transform: lowercase;
  63. font-size: 12px;
  64. letter-spacing: 1;}
  65.  
  66. s {
  67. color:#FFE5F9;
  68. font-family: Oswald, sans-serif;
  69. text-transform: lowercase;
  70. font-size: 12px;
  71. letter-spacing: 1;}
  72.  
  73. .pic {
  74. position: absolute;
  75. height: 200px;
  76. width: 327px;
  77. background-image: url('https://i.imgur.com/38RLUw2.gif');
  78. background-attachment: absolute;
  79. background-size: 100% 100%;
  80. bottom: 425px;
  81. right: 10px;
  82. border: 2px solid #80005b;}
  83.  
  84. .pic1 {
  85. position: absolute;
  86. height: 290px;
  87. width: 230px;
  88. background-image: url('https://i.imgur.com/aGbdAYx.gif');
  89. background-attachment: absolute;
  90. background-size: 100% 100%;
  91. bottom: 10px;
  92. right: 355px;
  93. border: 2px solid #80005b;}
  94.  
  95. .alpha {
  96. position: fixed;
  97. height: 680px;
  98. width: 640px;
  99. background-image: url();
  100. background-color: #80005b;
  101. padding: 10px;
  102. overflow: auto;
  103. bottom: 50%;
  104. left: 50%;
  105. margin-left: -270px;
  106. margin-bottom: -300px;}
  107.  
  108. .con {
  109. position: fixed;
  110. height: 620px;
  111. width: 580px;
  112. background-image: url();
  113. background-color: #B92669;
  114. Border: 10px solid;
  115. Border-color: #E77152;
  116. padding: 10px;
  117. overflow: auto;
  118. bottom: 50%;
  119. left: 50%;
  120. margin-left: -250px;
  121. margin-bottom: -280px;}
  122.  
  123. .contacts {
  124. position: absolute;
  125. height: 270px;
  126. width: 220px;
  127. font-family: Oswald;
  128. color: #000;
  129. font-size: 13px;
  130. letter-spacing: 0px;
  131. text-transform: none;
  132. background-color: #D04C5E;
  133. padding: 10px;
  134. line-height: 22px;
  135. text-align: center;
  136. overflow: auto;
  137. top: 40px;
  138. left: 40px;}
  139.  
  140. .stats {
  141. position: absolute;
  142. height: 389px;
  143. width: 310px;
  144. font-family: Oswald;
  145. color: #000;
  146. font-size: 13px;
  147. letter-spacing: 0px;
  148. text-transform: none;
  149. background-color: #D04C5E;
  150. padding: 10px;
  151. line-height: 22px;
  152. text-align: justify;
  153. overflow: auto;
  154. top: 250px;
  155. left: 290px;}
  156.  
  157. .stats span {
  158. font-family: 'Oswald';
  159. color: #483861;
  160. font-size: 13px;
  161. letter-spacing: 2px;
  162. text-transform: Uppercase;
  163. font-weight: bold;
  164. margin-right: 3px;}
  165.  
  166. .box {
  167. position: absolute;
  168. height: 389px;
  169. width: 310px;
  170. font-family: Oswald;
  171. color: #000;
  172. font-size: 13px;
  173. letter-spacing: 0px;
  174. text-transform: none;
  175. background-color: #D04C5E;
  176. padding: 10px;
  177. line-height: 22px;
  178. text-align: justify;
  179. overflow: auto;
  180. opacity: 0;
  181. bottom: 50%;
  182. left: 50%;
  183. margin-left: -230px;
  184. margin-bottom: -10000000px;}
  185.  
  186. .box:target {
  187. opacity: 1;
  188. bottom: 50%;
  189. left: 50%;
  190. margin-left: 20px;
  191. margin-bottom: -260px;}
  192.  
  193. .navi {
  194. position: absolute;
  195. top: 330px;
  196. left: 40px;}
  197.  
  198. a.nav:link, a.nav:active, a.nav:visited{
  199. display: inline-block;
  200. font-family: 'Staatliches', cursive;
  201. color: #B92669;
  202. background-color: #D04C5E;
  203. width: 44px;
  204. font-size: 15px;
  205. letter-spacing: 3px;
  206. text-transform: uppercase;
  207. text-decoration: none;
  208. font-weight: bold;
  209. text-align: center;
  210. margin-top: 10px;
  211. cursor: url('https://78.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_540.png'), default;}
  212.  
  213. .title {
  214. position: absolute;
  215. font-family: 'Staatliches', cursive;
  216. color: #B92669;
  217. font-size: 55px;
  218. letter-spacing: 2px;
  219. text-transform: uppercase;
  220. font-weight: bold;
  221. bottom: 50%;
  222. left: 50%;
  223. margin-left: 120px;
  224. margin-bottom: 140px;
  225. text-shadow: 3px 2px 0px #80005b;}
  226.  
  227. </style>
  228.  
  229. <div id="no" oncontextmenu="return false;">
  230.  
  231. <div class="alpha">
  232. <div class="con">
  233. <div class="pic"></div>
  234. <div class="pic1"></div>
  235. </div>
  236.  
  237. <div class="contacts">
  238. <h2>Connections</h2>
  239. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  240. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  241.  
  242. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  243. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  244.  
  245. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  246. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  247.  
  248. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  249. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  250.  
  251. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  252. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  253.  
  254. <a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
  255. <img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 75px; border: 1px solid #601286; height:75px; width:75px;"></a>
  256. </div>
  257.  
  258. <div class="stats">
  259. <h2>Statistics</h2>
  260. <font style=float:left><b>name</b> </font> <font style=float:right>---</font><br>
  261. <font style=float:left><b>alias</b> </font> <font style=float:right>---</font><br>
  262. <font style=float:left><b>gender</b> </font> <font style=float:right>---</font><br>
  263. <font style=float:left><b>birth date</b> </font> <font style=float:right>---</font><br>
  264. <font style=float:left><b>birthplace</b> </font> <font style=float:right>---</font><br>
  265. <font style=float:left><b>location</b> </font> <font style=float:right>---</font><br><br>
  266.  
  267. <font style=float:left><b>occupation</b> </font> <font style=float:right>---</font><br>
  268. <font style=float:left><b>major</b> </font> <font style=float:right>---</font><br>
  269. <font style=float:left><b>minor</b> </font> <font style=float:right>---</font><br>
  270. <font style=float:left><b>clubs</b> </font> <font style=float:right>---</font><br><br>
  271.  
  272. <font style=float:left><b>marital status</b> </font> <font style=float:right> ---</font><br>
  273. <font style=float:left><b>orientation</b> </font> <font style=float:right>---</font><br>
  274. <font style=float:left><b>current mood</b> </font> <font style=float:right>---</font><br><br>
  275.  
  276. <font style=float:left><b>height</b> </font> <font style=float:right>---</font><br>
  277. <font style=float:left><b>weight</b> </font> <font style=float:right>---</font><br>
  278. <font style=float:left><b>hair color</b> </font> <font style=float:right>---</font><br>
  279. <font style=float:left><b>eye color</b> </font> <font style=float:right>---</font><br>
  280. <font style=float:left><b>scent</b> </font> <font style=float:right>---</font><br>
  281. <font style=float:left><b>allergies</b> </font> <font style=float:right>---</font><br>
  282. </div>
  283.  
  284. <div class="navi">
  285. <a class="nav" href="#one">I.</a>
  286. <a class="nav" href="#two">II.</a>
  287. <a class="nav" href="#three">III.</a>
  288. <a class="nav" href="#four">VI.</a>
  289. <a class="nav" href="#five">V.</a>
  290. </div>
  291. </div>
  292.  
  293. <div id="one" class="box">
  294. <h2>title</h2>
  295. this is just an example.<br>
  296. <b>this is just an example.</b><br>
  297. <i>this is just an example.</i><br>
  298. <u>this is just an example.</u><br>
  299. <s>this is just an example.</s><br>
  300. </div>
  301.  
  302. <div id="two" class="box">
  303. <h2>title</h2>
  304. this is just an example.<br>
  305. <b>this is just an example.</b><br>
  306. <i>this is just an example.</i><br>
  307. <u>this is just an example.</u><br>
  308. <s>this is just an example.</s><br>
  309. </div>
  310.  
  311. <div id="three" class="box">
  312. <h2>title</h2>
  313. this is just an example.<br>
  314. <b>this is just an example.</b><br>
  315. <i>this is just an example.</i><br>
  316. <u>this is just an example.</u><br>
  317. <s>this is just an example.</s><br>
  318. </div>
  319.  
  320. <div id="four" class="box">
  321. <h2>Out of Character</h2>
  322. <b>001.</b> This code was made by <a target="_blank" href="https://roleplay.chat/profile.php?user=Gemma">Star</a> as a gift for <b>Juro</b>, under the multiple sources of tutelage by far more experienced coders. Please don't bother stealing, I can point you in the direction of those that would be happy to do commissions.<br><br>
  323. </div>
  324.  
  325. <div class="title">Juro</div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement