Advertisement
Guest User

Untitled

a guest
Jun 28th, 2017
62
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.54 KB | None | 0 0
  1. <style type="text/css">
  2. @import url(//fonts.googleapis.com/css?family=Pinyon+Script);
  3. @import url(//fonts.googleapis.com/css?family=Crete+Round);
  4. @import url(//fonts.googleapis.com/css?family=Josefin+Sans);
  5. @import url(//fonts.googleapis.com/css?family=Lobster);
  6.  
  7. .pfor { display: none; }
  8. #profile { background-color: transparent; border: none; overflow: auto;}
  9. /*body*/
  10.  
  11. body {
  12. background-color: #171717;}
  13.  
  14. b, strong { font-family: Lobster; font-size: 13px;line-height: 15px; font-weight: bold;
  15. color: #808080;}
  16.  
  17. i, em {color:#ffffff; font-family: Crete Round; font-size:13px;}
  18.  
  19. /*scroll*/
  20. ::-webkit-scrollbar {
  21. width: 5px;
  22. height: 0px;
  23. background:;
  24. }
  25.  
  26. ::-webkit-scrollbar-thumb {
  27. background-color: #c6c6c6;
  28. -webkit-border-radius: 10px;
  29. border-radius: 10px;
  30. }
  31.  
  32.  
  33.  
  34. /*aesthetics*/
  35. #tag{
  36. position:fixed;
  37. width: 250px;
  38. height:10px;
  39. top: 210px;
  40. left: 442px;
  41. font-family: 'pinyon script', cursive;
  42. font-size: 40px;
  43. color: #000000;
  44. text-shadow: 1px 0px 0px #c6c6c6,
  45. 0px 1px 0px #c6c6c6,
  46. -1px 0px 0px #c6c6c6,
  47. 0px -1px 0px #c6c6c6,
  48. 0px 0px 20px #c6c6c6;
  49. opacity: 1;
  50. z-index: 4;
  51. }
  52.  
  53.  
  54. #ken img{
  55. position: fixed;
  56. max-width: 400px;
  57. border: 1px #c6c6c6 solid;
  58. height:auto;
  59. top:100px;
  60. left: 300px;
  61. z-index: 3;
  62. }
  63.  
  64. /*navigation*/
  65. #nav {
  66. position: fixed;
  67. left:385px;
  68. top:220px;
  69. text-align:center;
  70. color: white;
  71. width: 250px;
  72. height: 8px;
  73. padding:10px;
  74. line-height:7px;
  75. z-index: 7;
  76. float: left;
  77. }
  78.  
  79. #nav a:link, #nav a:visited {
  80. font-size:10px !important;
  81. letter-spacing: 1px;
  82. text-decoration:none;
  83. font-weight:normal !important;
  84. padding:10px;
  85. margin-top: 7px;
  86. margin-left: 7px;
  87. width: 10px;
  88. font-family: Tahoma;
  89. color: #ffffff;
  90. height: 10px;
  91. -webkit-transition: all 0.5s ease;
  92. -moz-transition: all 0.5s ease;
  93. -o-transition: all 0.5s ease;
  94. float: left;
  95.  
  96. }
  97.  
  98. #nav a:hover {
  99. color:#666666;
  100. text-decoration:none;
  101. opacity: 1;
  102. float: left;
  103. }
  104.  
  105. /*content*/
  106. .box {
  107. position: fixed;
  108. top:100px;
  109. left: 300px;
  110. width: 393px;
  111. height: 392px;
  112. padding: 5px;
  113. font-size: 13px;
  114. line-height: 13px;
  115. text-align: center;
  116. font-family: josefin sans;
  117. color: #c6c6c6;
  118. overflow: hidden;
  119. opacity: 0;
  120. background-color: transparent;
  121. transition: all 0.7s ease-in-out;
  122. -webkit-transition: all 0.7s ease-in-out;
  123. -moz-transition: all 0.7s ease-in-out;
  124. -o-transition: all 0.7s ease-in-out;
  125. -ms-transition: all 0.7s ease-in-out;
  126. z-index:2;
  127. }
  128.  
  129. .box:target {
  130. top: 100px;
  131. left: 715px;
  132. overflow: auto;
  133. border: 1px #c6c6c6 solid;
  134. border-top: none;
  135. border-bottom: none;
  136. border-left: none;
  137. background-color: transparent;
  138. opacity: 1;
  139. transition: all 0.7s ease-in-out;
  140. -webkit-transition: all 0.7s ease-in-out;
  141. -moz-transition: all 0.7s ease-in-out;
  142. -o-transition: all 0.7s ease-in-out;
  143. -ms-transition: all 0.7s ease-in-out;
  144. z-index:2;
  145. }
  146.  
  147. /*tables*/
  148. td.one{
  149. width: 261px;
  150. font-family: Lobster;
  151. font-size: 13px;
  152. text-align: left;
  153. word-spacing: 1px;
  154. letter-spacing: 0px;
  155. line-height: 9px;
  156. font-weight: bold;
  157. color: #808080;
  158. }
  159.  
  160. td.two{
  161. width: 261px;
  162. font-family: Josefin Sans;
  163. font-size: 13px;
  164. text-align: right;
  165. word-spacing: 1px;
  166. letter-spacing: 0px;
  167. line-height: 9px;
  168. color: #c6c6c6;
  169. }
  170.  
  171. /*link*/
  172. a:link,a:active,a:visited {
  173. color: #656565;
  174. font-family: Josefin Sans;
  175. font-size: 14px;
  176. line-height: 10px;
  177. letter-spacing: 0px;
  178. display: ;
  179. font-weight: bold;
  180. margin-bottom: px;
  181. word-spacing: 0px;
  182. text-transform: none;
  183. text-align: center;
  184. text-decoration: none;
  185. transition: all .3s ease-in-out;
  186. -webkit-transition: all .3s ease-in-out;
  187. -moz-transition: all .3s ease-in-out;
  188. -o-transition: all .3s ease-in-out;
  189. -ms-transition: all .3s ease-in-out;
  190. z-index: 7;
  191. }
  192.  
  193. a:hover {
  194. color: #656565;
  195. text-shadow: 1px 0px 0px #ffffff,
  196. 0px 1px 0px #ffffff,
  197. -1px 0px 0px #ffffff,
  198. 0px -1px 0px #ffffff,
  199. 0px 0px 20px #ffffff;
  200. font-family: Josefin Sans;
  201. font-size: 14px;
  202. line-height: 10px;
  203. letter-spacing: 0px;
  204. display: ;
  205. font-weight: bold;
  206. margin-bottom: px;
  207. word-spacing: 0px;
  208. text-align: center;
  209. text-decoration: none;
  210. transition: all .3s ease-in-out;
  211. -webkit-transition: all .3s ease-in-out;
  212. -moz-transition: all .3s ease-in-out;
  213. -o-transition: all .3s ease-in-out;
  214. -ms-transition: all .3s ease-in-out;
  215. }
  216.  
  217. /*disable*/
  218. #no{position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px;}
  219.  
  220. </style>
  221. <div id="no" oncontextmenu="return false;">
  222.  
  223. <div id="ken">
  224. <img src="http://68.media.tumblr.com/aef0ed94d7522f0bdf8b8dcb9fb6e069/tumblr_n8z55jwZCn1t2g1fco1_500.gif">
  225. </div>
  226. <div id="tag">
  227. Kenshin
  228. </div>
  229.  
  230. <div id="nav">
  231. <a href="#one">000.</a>
  232. <a href="#two">001.</a>
  233. <a href="#three">002.</a>
  234. <a href="#four">003.</a>
  235. <a href="#five">004.</a>
  236. </div>
  237.  
  238. <div id="one" class="box">
  239. <table>
  240. <tr><td class="one">
  241. Name
  242. </td><td class="two">
  243. ----
  244. </td></tr><tr>
  245.  
  246. <tr><td class="one">
  247. Nickname
  248. </td><td class="two">
  249. ----
  250. </td></tr><tr>
  251.  
  252. <tr><td class="one">
  253. Alias
  254. </td><td class="two">
  255. ----
  256. </td></tr><tr>
  257.  
  258. <tr><td class="one">
  259. Meaning
  260. </td><td class="two">
  261. ----
  262. </td></tr><tr>
  263.  
  264. <tr><td class="one">
  265. Rank
  266. </td><td class="two">
  267. ----
  268. </td></tr><tr>
  269.  
  270. <tr><td class="one">
  271. Age
  272. </td><td class="two">
  273. ----
  274. </td></tr><tr>
  275.  
  276. <tr><td class="one">
  277. Gender
  278. </td><td class="two">
  279. ----
  280. </td></tr><tr>
  281.  
  282. <tr><td class="one">
  283. Height
  284. </td><td class="two">
  285. ----
  286. </td></tr><tr>
  287.  
  288. <tr><td class="one">
  289. Weight
  290. </td><td class="two">
  291. ----
  292. </td></tr><tr>
  293.  
  294. <tr><td class="one">
  295. Hair
  296. </td><td class="two">
  297. ----
  298. </td></tr><tr>
  299.  
  300. <tr><td class="one">
  301. Eyes
  302. </td><td class="two">
  303. ----
  304. </td></tr><tr>
  305.  
  306. <tr><td class="one">
  307. Affiliation
  308. </td><td class="two">
  309. ----
  310. </td></tr><tr>
  311.  
  312. <tr><td class="one">
  313. Elemental Affinity
  314. </td><td class="two">
  315. ----
  316. </td></tr><tr>
  317.  
  318. <tr><td class="one">
  319. God
  320. </td><td class="two">
  321. ----
  322. </td></tr><tr>
  323. </table>
  324.  
  325. </div>
  326.  
  327. <div id="two" class="box">
  328. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sagittis eget quam sagittis tristique. Etiam quis sagittis lectus. Donec efficitur ac nisl at viverra. Nunc ut consequat felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Mauris est diam, imperdiet sit amet posuere at, molestie eget libero. Cras quam lectus, maximus eu eleifend ut, volutpat rutrum purus. Duis a sodales mi, quis lacinia sapien. Phasellus eget suscipit tellus. Donec rutrum vitae eros feugiat ultrices. In sollicitudin pulvinar ultrices. Fusce pharetra ultricies sapien in vehicula. Sed turpis dolor, facilisis quis justo eu, aliquet porttitor metus. Fusce euismod nibh at velit tempus laoreet.
  329. </div>
  330.  
  331. <div id="three" class="box">
  332. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sagittis eget quam sagittis tristique. Etiam quis sagittis lectus. Donec efficitur ac nisl at viverra. Nunc ut consequat felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Mauris est diam, imperdiet sit amet posuere at, molestie eget libero. Cras quam lectus, maximus eu eleifend ut, volutpat rutrum purus. Duis a sodales mi, quis lacinia sapien. Phasellus eget suscipit tellus. Donec rutrum vitae eros feugiat ultrices. In sollicitudin pulvinar ultrices. Fusce pharetra ultricies sapien in vehicula. Sed turpis dolor, facilisis quis justo eu, aliquet porttitor metus. Fusce euismod nibh at velit tempus laoreet.
  333. </div>
  334.  
  335. <div id="four" class="box">
  336. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sagittis eget quam sagittis tristique. Etiam quis sagittis lectus. Donec efficitur ac nisl at viverra. Nunc ut consequat felis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Mauris est diam, imperdiet sit amet posuere at, molestie eget libero. Cras quam lectus, maximus eu eleifend ut, volutpat rutrum purus. Duis a sodales mi, quis lacinia sapien. Phasellus eget suscipit tellus. Donec rutrum vitae eros feugiat ultrices. In sollicitudin pulvinar ultrices. Fusce pharetra ultricies sapien in vehicula. Sed turpis dolor, facilisis quis justo eu, aliquet porttitor metus. Fusce euismod nibh at velit tempus laoreet.
  337. </div>
  338.  
  339. <div id="five" class="box">
  340. reg<b>bold</b><i>italics</i><a href="">link</a><br><br>
  341.  
  342. <b>One.</b> Layout was created by <a href="https://roleplay.chat/profile.php?user=Otohime">Otohime</a> for the use of <i>Kenshin only</i> do not take pieces or modify. If you would like a profile, please send me a private message/RPC mail and we can discuss something.<br>
  343. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement