API tools faq
paste
Advertisement
sunkei

tae jun rp

sunkei
Feb 9th, 2012
4,069
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.54 KB | None | 0 0
raw download clone embed print report
  1. <!-- tae jun relationships page made by gyapo.tumblr.com don't remove this comment -->
  2.  
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5.  
  6. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  7.  
  8.  
  9. <head>
  10. <title>Relationship</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13.  
  14.  
  15. <style type="text/css">
  16.  
  17. ::-webkit-scrollbar-thumb:vertical {background-color:#e5e5e5;height:40px;}
  18. ::-webkit-scrollbar {height:0px;width:7px;background-color:#fff;}
  19.  
  20. body
  21. {font-family:arial;
  22. font-size:10px;
  23. background-image:url('http://30.media.tumblr.com/tumblr_lz2qehhXrT1r9g6hvo2_r1_100.png');
  24. color:#aaa;}
  25.  
  26. a
  27. {text-decoration:none;
  28. color:#ff0063;}
  29.  
  30.  
  31.  
  32. #menu
  33. {position:fixed;
  34. top:0px;
  35. left:0px;
  36. text-align:center;
  37. font-weight:700;}
  38.  
  39. #titre
  40. {font-family:arial;
  41. font-style:italic;
  42. font-size:20px;
  43. float:left;
  44. padding-top:20px;
  45. padding-bottom:20px;
  46. background-color:#222;
  47. letter-spacing:2px;
  48. border-right:5px solid;
  49. text-transform:lowercase;
  50. width:950px;
  51. color:#ffd900;}
  52.  
  53. .button
  54. {float:left;
  55. padding-top:27px;
  56. padding-bottom:26px;
  57. font-size:10px;
  58. text-transform:uppercase;
  59. font-family:consolas;
  60. letter-spacing:2px;
  61. width:120px;
  62. border-right:5px solid;
  63. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;}
  64.  
  65.  
  66. #back
  67. {background-color:#ff0063;
  68. color:#a20133;}
  69.  
  70. #back:hover
  71. {opacity:0.5;
  72. color:#fff;}
  73.  
  74. #ask
  75. {background-color:#00d4ff;
  76. color:#0188a3;}
  77.  
  78. #ask:hover
  79. {opacity:0.5;
  80. color:#fff;}
  81.  
  82. #content
  83. {margin-top:85px;
  84. margin-left:85px;
  85. overflow:auto;}
  86.  
  87. .relationships
  88. {width:1600px;
  89. margin-bottom:50px;}
  90.  
  91. .relation
  92. {margin-right:40px;
  93. width:500px;
  94. float:left;
  95. overflow:hidden;
  96. font-family:consolas;}
  97.  
  98. .relation2
  99. {margin-right:40px;
  100. width:700px;
  101. float:left;
  102. overflow:hidden;
  103. font-family:consolas;}
  104.  
  105. .title
  106. {font-size:20px;
  107. font-weight:700;
  108. font-style:italic;
  109. font-family:arial;
  110. letter-spacing:1px;
  111. margin-left:40px;
  112. margin-bottom:5px;
  113. border-left:5px solid;
  114. padding-left:20px;
  115. padding-right:15px;
  116. color:#ff0063;
  117. background-color:#fff;
  118. width:400px;}
  119.  
  120. .title2
  121. {font-size:20px;
  122. font-weight:700;
  123. font-style:italic;
  124. font-family:arial;
  125. letter-spacing:1px;
  126. margin-left:40px;
  127. margin-bottom:5px;
  128. border-left:5px solid;
  129. padding-left:20px;
  130. padding-right:15px;
  131. color:#00d4ff;
  132. background-color:#fff;
  133. width:400px;}
  134.  
  135.  
  136. .images
  137. {float:left;}
  138.  
  139. #group
  140. {margin-top:20px;}
  141.  
  142. .portrait
  143. {margin:2px;
  144. border:3px solid #fff;}
  145.  
  146. .portrait2
  147. {width:50px;
  148. margin:2px;
  149. border:3px solid #fff;}
  150.  
  151. .texts
  152. {float:left;
  153. margin-top:10px;
  154. margin-left:10px;
  155. margin-right:10px;
  156. width:280px;
  157. height:180px;
  158. background-color:#fff;
  159. font-size:10px;
  160. padding:10px;
  161. overflow:auto;}
  162.  
  163. .infos
  164. {text-transform:uppercase;
  165. letter-spacing:0px;
  166. color:#ffd900;}
  167.  
  168. .plus
  169. {float:left;}
  170.  
  171. .texts2
  172. {float:left;
  173. margin-top:10px;
  174. width:250px;
  175. height:180px;
  176. background-color:#fff;
  177. font-size:10px;
  178. padding:10px;
  179. overflow:auto;}
  180.  
  181. #credits
  182. {position:fixed;
  183. letter-spacing:3px;
  184. color:#000;
  185. opacity:0.2;
  186. right:20px;
  187. bottom:10px;}
  188. </style>
  189. </head>
  190. <body>
  191.  
  192.  
  193.  
  194. <a href="http://gyapo.tumblr.com"><div id="credits">credit</div></a>
  195.  
  196.  
  197. <div id="menu">
  198. <div id="titre">{ YOUR NAME } - Relationships </div>
  199. <a href="/"><div class="button" id="back">back to blog</div></a>
  200. <a href="/ask"><div class="button" id="ask">message</div></a>
  201. </div>
  202.  
  203.  
  204.  
  205.  
  206. <div id="content">
  207.  
  208. <!-- 1 Solo & 1 group -->
  209. <table class="relationships" border="0" cellpadding="0" cellspacing="0">
  210. <tr>
  211. <td class="relation">
  212. <div class="title"># him/her, the xxx</div>
  213. <div><div class="images">
  214. <!-- 2 icons -->
  215. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/><br>
  216. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/06-1.png"/></div>
  217. <div class="texts">
  218. <span class="infos">- Blog :</span> XXX
  219. <br><br>
  220. <span class="infos">- Full Name :</span> AA XXX
  221. <br><br>
  222. <span class="infos">- The story :</span> In construction.
  223. </div>
  224. </td>
  225.  
  226.  
  227. <td class="relation2">
  228. <div class="title2"># drinking buddies, open.</div>
  229. <div><div class="images" id="group">
  230. <!-- 3 icons -->
  231. <a href="URL1"><img class="portrait2" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/></a><br>
  232. <img class="portrait2" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/><br>
  233. <img class="portrait2" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/><br>
  234. </div>
  235. <div class="texts">
  236. <span class="infos">- Blogs :</span> <a href="URL1">XXX</a> | XXX | XXX
  237. <br><br>
  238. <span class="infos">- Full Names :</span> AA XXX | AA XXX | AA XXX
  239. <br><br>
  240. <span class="infos">- The ambience : </span>Integer interdum odio sodales felis dictum posuere. Aliquam rhoncus, mauris eu scelerisque vehicula, mi libero ornare felis, eget facilisis turpis lorem vitae purus. Aenean ac diam ac quam facilisis convallis eget sit amet diam. Morbi eget massa urna, sed facilisis mauris. Quisque venenatis, velit a vestibulum congue, lorem purus ullamcorper massa, a commodo nunc nulla at leo.
  241. </div>
  242. <div class="texts2">
  243. <center><span class="infos">the stories</span></center><br>
  244. &#160 <b>¤ Chara :</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna erat, fringilla at commodo eget, scelerisque viverra justo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce mattis rutrum suscipit. Nunc consectetur dui at elit tristique consequat. Nunc dignissim sollicitudin velit. Ut faucibus fermentum libero in tempor.
  245. <br><br>
  246. &#160 <b>¤ Chara2 :</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna erat, fringilla at commodo eget, scelerisque viverra justo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce mattis rutrum suscipit. Nunc consectetur dui at elit tristique consequat. Nunc dignissim sollicitudin velit. Ut faucibus fermentum libero in tempor.
  247. <br><br>
  248. &#160 <b>¤ Chara3 :</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna erat, fringilla at commodo eget, scelerisque viverra justo.
  249. </div>
  250. </td>
  251. </tr>
  252. </table>
  253.  
  254.  
  255. <!-- 2 Solo -->
  256. <table class="relationships" border="0" cellpadding="0" cellspacing="0">
  257. <tr>
  258. <td class="relation">
  259. <div class="title"># him/her, the xxx</div>
  260. <div><div class="images">
  261. <!-- 2 icons -->
  262. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/><br>
  263. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/06-1.png"/></div>
  264. <div class="texts">
  265. <span class="infos">- Blog :</span>
  266. <br><br>
  267. <span class="infos">- Full Name :</span>
  268. <br><br>
  269. <span class="infos">- The story :</span>
  270. </div>
  271. </td>
  272.  
  273.  
  274. <td class="relation">
  275. <div class="title"># him/her, the xxx</div>
  276. <div><div class="images">
  277. <!-- 2 icons -->
  278. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/09-1.png"/><br>
  279. <img class="portrait" src="http://i914.photobucket.com/albums/ac342/LiLi-Ao/Icons%20by%20LiLi%20Ao/06-1.png"/></div>
  280. <div class="texts">
  281. <span class="infos">- Blog :</span>
  282. <br><br>
  283. <span class="infos">- Full Name :</span>
  284. <br><br>
  285. <span class="infos">- The story :</span>
  286. </div>
  287. </td>
  288. </tr>
  289. </table>
  290.  
  291.  
  292.  
  293. </div>
  294. </body>
  295. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!