Advertisement
letsrp

Obsessions - About Me

Apr 3rd, 2013
623
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.49 KB | None | 0 0
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2.  
  3. <!--
  4. Code by letsrp @ tumblr
  5. obsessions - about me page
  6. -->
  7.  
  8. <html>
  9. <head>
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{Favicon}" />
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  13.  
  14. <style type="text/css">
  15.  
  16. body{
  17. color:#000;
  18. background-attachment:fixed;
  19. background-color:#eee;
  20. background-image: url('http://static.tumblr.com/92f5df83ead7e8753b3aa67f933f4bab/evfqys7/xbWmjmfsh/tumblr_static_tumblr_static_bg4.png');
  21. text-align:justify;
  22. }
  23.  
  24. a{color:#AAAAAA;
  25. text-decoration: none;}
  26. a:hover{color:#000;}
  27.  
  28. .ob{
  29. width: 190px;
  30. height: 315px;
  31. color: transparent;
  32. background-color: transparent;
  33. overflow: auto;
  34. font-family: times;
  35. font-size: 9px;
  36. transition-duration: 0.5s;
  37. -moz-transition-duration: 0.5s;
  38. -webkit-transition-duration: 0.5s;
  39. -o-transition-duration: 0.5s;
  40. padding: 5px;
  41. text-align:justify;
  42. line-height: 10px;
  43. }
  44.  
  45. .ob:hover {
  46. width: 190px;
  47. height: 315px;
  48. background-color: #fff; /*about bg color*/
  49. color: #000;
  50. font-family: times;
  51. font-size: 10px;
  52. padding: 5px;
  53. overflow: auto;
  54. text-align: justify;
  55. line-height: 10px;
  56. }
  57.  
  58.  
  59. ::-webkit-scrollbar-thumb { background-color: #c43a4f;} /*scrollbar color*/
  60. ::-webkit-scrollbar {width: 8px; height: 4px; background: #fff; }
  61.  
  62. #side { /*move circle links around*/
  63. margin-left:-170px;
  64. margin-top:-250px;
  65. }
  66.  
  67. #link1 {
  68. margin-left:20px;
  69. margin-top:25px;
  70. position:absolute
  71. }
  72.  
  73. #link1 a{
  74. line-height:50px;
  75. text-transform:uppercase;
  76. background-color:#c43a4f;/*change bg color of link1*/
  77. font-size:8px;
  78. font-weight:bold;
  79. color:white;
  80. width:50px;
  81. height:50px;
  82. display:inline-block;
  83. -moz-border-radius: 75px;
  84. border-radius: 75px;
  85. text-align:center;
  86. transition: all 0.5s ease-in-out;
  87. -webkit-transition: all 0.5s ease-in-out;
  88. }
  89.  
  90.  
  91. #link2 {
  92. margin-left:80px;
  93. margin-top:40px;
  94. position:absolute
  95. }
  96.  
  97. #link2 a{
  98. line-height:45px;
  99. text-transform:uppercase;
  100. background-color:#c43a4f;/*change bg color of link2*/
  101. font-size:8px;
  102. font-weight:bold;
  103. color:white;
  104. width:45px;
  105. height:45px;
  106. display:inline-block;
  107. -moz-border-radius: 70px;
  108. border-radius: 70px;
  109. text-align:center;
  110. transition: all 0.7s ease-in-out;
  111. -webkit-transition: all 0.7s ease-in-out;
  112. }
  113.  
  114.  
  115. #link3 {
  116. margin-left:40px;
  117. margin-top:80px;
  118. position:absolute
  119. }
  120.  
  121. #link3 a{
  122. line-height:40px;
  123. text-transform:uppercase;
  124. background-color:#c43a4f;/*change bg color of link3*/
  125. font-size:8px;
  126. font-weight:bold;
  127. color:white;
  128. width:40px;
  129. height:40px;
  130. display:inline-block;
  131. -moz-border-radius: 65px;
  132. border-radius: 65px;
  133. text-align:center;
  134. transition: all 0.7s ease-in-out;
  135. -webkit-transition: all 0.7s ease-in-out;
  136. }
  137.  
  138.  
  139. #link4 {
  140. margin-left:85px;
  141. margin-top:95px;
  142. position:absolute
  143. }
  144.  
  145. #link4 a{
  146. line-height:35px;
  147. text-transform:uppercase;
  148. background-color:#c43a4f;/*change bg color of link4*/
  149. font-size:8px;
  150. font-weight:bold;
  151. color:white;
  152. width:35px;
  153. height:35px;
  154. display:inline-block;
  155. -moz-border-radius: 65px;
  156. border-radius: 65px;
  157. text-align:center;
  158. transition: all 0.7s ease-in-out;
  159. -webkit-transition: all 0.7s ease-in-out;
  160. }
  161.  
  162.  
  163. #link5 {
  164. margin-left:55px;
  165. margin-top:125px;
  166. position:absolute
  167. }
  168.  
  169. #link5 a{
  170. line-height:30px;
  171. text-transform:uppercase;
  172. background-color:#c43a4f;/*change bg color of link5*/
  173. font-size:10px;
  174. font-weight:bold;
  175. color:white;
  176. width:30px;
  177. height:30px;
  178. display:inline-block;
  179. -moz-border-radius: 60px;
  180. border-radius: 60px;
  181. text-align:center;
  182. transition: all 0.7s ease-in-out;
  183. -webkit-transition: all 0.7s ease-in-out;
  184. }
  185.  
  186.  
  187. </style>
  188. {CustomCSS}
  189. </style>
  190. </head>
  191. <body>
  192. <center>
  193.  
  194. <div style="width: 500px; height: 325px; margin-top:150px;background-image: url(PICTURE URL);box-shadow:0px 0px 6px #ccc;">
  195.  
  196. <div style="width: 500px; height: 325px; padding: 0px 0px 0px 150px;">
  197. <div class="ob"><center>
  198. <div style="font-family: arial; font-size: 9px; line-height:29px;text-transform: uppercase; letter-spacing: 2px;">
  199.  
  200. Character Name
  201. </div></center>
  202.  
  203. Bio & stuff here.
  204.  
  205.  
  206. </div></div>
  207.  
  208. <div id="side">
  209. <div id="link1"><a href="/">home</a></div>
  210. <div id="link2"><a href="/#">other</a></div>
  211. <div id="link3"><a href="/ask">ask</a></div>
  212. <div id="link4"><a href="/#">rpg</a></div>
  213. <div id="link5"><a href="/#">+</a></div>
  214.  
  215.  
  216. </div>
  217. </div>
  218. </div>
  219. </div>
  220. </body>
  221. <div style="position:fixed; bottom:6px; right:10px;font-family:arial; font-size:12px;"><a href="http://letsrp.tumblr.com">©</a>
  222. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement