Don't like ads? PRO users don't see any ads ;-)
Public Pastes

[Page] → About Me #02

By: Jyuubi on Apr 27th, 2012  |  syntax: None  |  size: 2.98 KB  |  hits: 4,942  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3.  
  4. <!--
  5. THEME: ABOUT ME PAGE #02
  6. BY: jyuubi.org / manatopia.org
  7.  
  8. Please do not redistribute or use to make your own!
  9. You may edit whatever you please, but leave credit.
  10.  
  11. YOU MAY REMOVE MORTGRAPHICS CREDIT IF YOU DO NOT USE THE IMAGE.
  12. BUT KEEP IF YOU DO!
  13.  
  14. [credit] mortgraphics.livejournal.com
  15. -->
  16.  
  17. <head>
  18. <link href='http://fonts.googleapis.com/css?family=Felipa' rel='stylesheet' type='text/css'>
  19. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  20. <title>{Title}</title>
  21. <link rel="shortcut icon" href="{Favicon}">
  22.  
  23. <style type="text/css">
  24. /* BODY */
  25. body {
  26. background-image: url('http://s5.postimage.org/obbpc9fxz/aboutpage02_bg.png');
  27. background-attachment: fixed;
  28. background-color: #f4f3ef;
  29. }
  30.  
  31. #container {
  32. margin-left: 80px;
  33. margin-top: 50px;
  34. }
  35.  
  36. /* LEFT IMAGES */
  37. #images {
  38. width: 100px;
  39. position: fixed;
  40. z-index: 999;
  41. }
  42.  
  43. #images img {
  44. width: 80px;
  45. height: 80px;
  46. border: 10px solid #d0e0e8;
  47. margin-bottom: 10px;
  48. }
  49.  
  50. /* MAIN HEADER */
  51. #header {
  52. background-color: #eaecef;
  53. position: fixed;
  54. height: 40px;
  55. width: 320px;
  56. padding-right: 10px;
  57. margin-left: 100px;
  58. margin-top: 30px;
  59. font-family: 'Felipa', cursive;
  60. font-size: 16px;
  61. color: #79a58a;
  62. letter-spacing: 2px;
  63. line-height: 40px;
  64. text-align: right;
  65. }
  66.  
  67. /* INFORMATION */
  68. #info {
  69. width: 290px;
  70. position: fixed;
  71. margin-left: 120px;
  72. margin-top: 90px;
  73. font-family: calibri;
  74. font-size: 10px;
  75. color: #82858a;
  76. letter-spacing: 1px;
  77. text-align: justify;
  78. }
  79.  
  80. #info b, strong {
  81. color: #c9a2c5;
  82. }
  83.  
  84. #info i, em {
  85. color: #e2987b;
  86. }
  87.  
  88. #info a {
  89. color: #7eb0c7;
  90. text-decoration: none;
  91. }
  92.  
  93. #info h1 {
  94. font-family: consolas;
  95. font-size: 12px;
  96. color: #79a58a;
  97. text-transform: uppercase;
  98. height: 14px;
  99. display: block;
  100. line-height: 15px;
  101. text-align: left;
  102. letter-spacing: 1px;
  103. font-weight: normal;
  104. margin-bottom: 5px;
  105. margin-top: 20px;
  106. }
  107.  
  108. /* CREDITS */
  109. #credit {
  110. position: fixed;
  111. bottom: 10px;
  112. right: 10px;
  113. font-family: calibri;
  114. font-size: 9px;
  115. text-transform: uppercase;
  116. text-align: right;
  117. letter-spacing: 1px;
  118. }
  119.  
  120. #credit a {
  121. color: #79a58a;
  122. text-decoration: none;
  123. }
  124. </style>
  125. </head>
  126. <body>
  127.  
  128. <div id="container">
  129.  
  130. <!-- THREE IMAGES -->
  131. <div id="images">
  132. <img src="http://s5.postimage.org/r6osj4jxv/aboutpage02_icon1.jpg"><br />
  133. <img src="http://s5.postimage.org/j2goedxir/aboutpage02_icon2.jpg"><br />
  134. <img src="http://s5.postimage.org/5zl1v47ar/aboutpage02_icon3.jpg"><br />
  135. </div>
  136. <!-- THREE IMAGES -->
  137.  
  138. <!-- HEADER -->
  139. <div id="header">about yours truly</div>
  140. <!-- HEADER -->
  141.  
  142. <!-- INFORMATION -->
  143. <div id="info">
  144. INFORMATION GOES HERE!
  145. </div>
  146. <!-- INFORMATION -->
  147.  
  148. </div>
  149.  
  150. <div id="credit">
  151. <a href="/">Go home?</a><br />
  152. <!-- DO NOT REMOVE OR EDIT -->
  153. <a href="http://manatopia.org">&copy; manatopia</a><br />
  154. <!-- MORTGRAPHICS CREDIT -->
  155. <a href="http://mortgraphics.livejournal.com">&copy; mortgraphics</a>
  156. </div>
  157.  
  158. </body>
  159. </html>
create a new version of this paste RAW Paste Data