Advertisement
junkos

about page - black fish

May 15th, 2013
3,369
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.66 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5.  
  6. <!--------------------
  7.  
  8. about page by lavvie@bluenaegi.tumblr.com
  9. please do not steal thanks
  10. message me if you have any problems
  11.  
  12. ------------------->
  13.  
  14.  
  15.  
  16. <head>
  17.  
  18. <link href="http://static.tumblr.com/xkion9m/Ybpmm6rx4/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  19.  
  20. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  21.  
  22. <script src="http://static.tumblr.com/xkion9m/YLomm6s09/jquery.style-my-tooltips.js"></script>
  23.  
  24. <script>
  25. (function($){
  26. $(document).ready(function(){
  27. $("[title]").style_my_tooltips({
  28. tip_follows_cursor:false,
  29. tip_delay_time:300,
  30. tip_fade_speed:800,
  31. attribute:"title"
  32. });
  33. });
  34. })(jQuery);
  35. </script>
  36.  
  37. <title>a b o u t</title>
  38.  
  39. <link rel="shortcut icon" href="http://i387.photobucket.com/albums/oo314/paravidatoda/div40.gif">
  40.  
  41. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  42.  
  43. {block:Description}
  44. <meta name="description" content="{MetaDescription}" />
  45. {/block:Description}
  46.  
  47. <style type="text/css">
  48.  
  49. #s-m-t-tooltip{
  50. max-width:200px;
  51. color:#fff;
  52. margin:7px 0px 0px 10px;
  53. z-index:10;
  54. background-color: #000;
  55. font:9px trebuchet ms;
  56. letter-spacing:1px;
  57. text-transform: uppercase;
  58. padding:5px 10px;
  59. }
  60.  
  61. body {
  62. background-image: url('');
  63. background-attachment:fixed;
  64. background-color:#F3F3F3;
  65. font-family: trebuchet ms, arial;
  66. font-size:10px;
  67. line-height:14px;
  68. text-align:justify;
  69. }
  70.  
  71. #aboutbox {
  72. background-color: #fff;
  73. background-image: url('http://static.tumblr.com/xkion9m/6zRmmqd4i/tumblr_lxwynw0pdg1r9g6hvo6_100.png');
  74. background-attachment:fixed;
  75. z-index: 100px;
  76. font-size: 12px;
  77. color: #666;
  78. height: 401px;
  79. width: 400px;
  80. position: fixed;
  81. top: 175px;
  82. left: 280px;
  83. }
  84.  
  85. #aboutbox a {
  86. color: #000;
  87. text-decoration: underline;
  88. }
  89.  
  90. #aboutbox a:hover {
  91. text-decoration: none;
  92. }
  93.  
  94. #container {
  95. width: 385px;
  96. text-align: left;
  97. z-index: 100px;
  98. font-size: 12px;
  99. color: #666;
  100. height: 330px;
  101. overflow: auto;
  102. position: fixed;
  103. top: 220px;
  104. left: 290px;
  105. }
  106.  
  107. ::-webkit-scrollbar-thumb:vertical {
  108. background-color: #000;
  109. height: 50px;
  110. }
  111.  
  112. ::-webkit-scrollbar {
  113. height: 10px;
  114. width: 5px;
  115. background-color: #fff;
  116. }
  117.  
  118. #sidebg {
  119. position: absolute;
  120. background-color: #000;
  121. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  122. background-attachment:fixed;
  123. height: 423px;
  124. width: 55px;
  125. top: 154px;
  126. left: 225px;
  127. }
  128.  
  129. #sidetitle {
  130. position: relative;
  131. background-color: #000;
  132. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  133. background-attachment:fixed;
  134. padding: 5px 5px;
  135. font-family: Courier New, monospace;
  136. letter-spacing: 1px;
  137. font-size: 16px;
  138. color: #fff;
  139. top: 143px;
  140. z-index: 9999;
  141. width: 99.8%;
  142. left: -590;
  143. }
  144.  
  145. #sideiconone {
  146. position: absolute;
  147. top: 174px;
  148. left: 680px;
  149. -webkit-transition: all 0.7s ease-in-out;
  150. -moz-transition: all 0.7s ease-in-out;
  151. -o-transition: all 0.7s ease-in-out;
  152. -ms-transition: all 0.7s ease-in-out;
  153. transition: all 0.7s ease-in-out;
  154. }
  155.  
  156. #sideicontwo {
  157. position: absolute;
  158. top: 274px;
  159. left: 680px;
  160. -webkit-transition: all 0.7s ease-in-out;
  161. -moz-transition: all 0.7s ease-in-out;
  162. -o-transition: all 0.7s ease-in-out;
  163. -ms-transition: all 0.7s ease-in-out;
  164. transition: all 0.7s ease-in-out;
  165. }
  166.  
  167. #sideiconthree {
  168. position: absolute;
  169. top: 374px;
  170. left: 680px;
  171. -webkit-transition: all 0.7s ease-in-out;
  172. -moz-transition: all 0.7s ease-in-out;
  173. -o-transition: all 0.7s ease-in-out;
  174. -ms-transition: all 0.7s ease-in-out;
  175. transition: all 0.7s ease-in-out;
  176. }
  177.  
  178. #sideiconfour {
  179. position: absolute;
  180. top: 474px;
  181. left: 680px;
  182. -webkit-transition: all 0.7s ease-in-out;
  183. -moz-transition: all 0.7s ease-in-out;
  184. -o-transition: all 0.7s ease-in-out;
  185. -ms-transition: all 0.7s ease-in-out;
  186. transition: all 0.7s ease-in-out;
  187. }
  188.  
  189. #sideiconone:hover {
  190. opacity: 0;
  191. }
  192.  
  193. #sideicontwo:hover {
  194. opacity: 0;
  195. }
  196.  
  197. #sideiconthree:hover {
  198. opacity: 0;
  199. }
  200.  
  201. #sideiconfour:hover {
  202. opacity: 0;
  203. }
  204.  
  205. #sidelinkone {
  206. position: absolute;
  207. top: 200px;
  208. left: 210px;
  209. font-family: monospace;
  210. font-size: 16px;
  211. }
  212.  
  213. #sidelinkone a {
  214. color: #fff;
  215. background-color: #000;
  216. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  217. background-attachment:fixed;
  218. padding: 5px 5px;
  219. text-decoration: none;
  220. text-transform: uppercase;
  221. -webkit-transition: all 0.7s ease-in-out;
  222. -moz-transition: all 0.7s ease-in-out;
  223. -o-transition: all 0.7s ease-in-out;
  224. -ms-transition: all 0.7s ease-in-out;
  225. transition: all 0.7s ease-in-out;
  226. }
  227.  
  228. #sidelinktwo {
  229. position: absolute;
  230. top: 250px;
  231. left: 180px;
  232. font-family: monospace;
  233. font-size: 16px;
  234. }
  235.  
  236. #sidelinktwo a {
  237. color: #fff;
  238. background-color: #000;
  239. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  240. background-attachment:fixed;
  241. padding: 5px 5px;
  242. text-decoration: none;
  243. text-transform: uppercase;
  244. -webkit-transition: all 0.7s ease-in-out;
  245. -moz-transition: all 0.7s ease-in-out;
  246. -o-transition: all 0.7s ease-in-out;
  247. -ms-transition: all 0.7s ease-in-out;
  248. transition: all 0.7s ease-in-out;
  249. }
  250.  
  251. #sidelinkthree {
  252. position: absolute;
  253. top: 300px;
  254. left: 210px;
  255. font-family: monospace;
  256. font-size: 16px;
  257. }
  258.  
  259. #sidelinkthree a {
  260. color: #fff;
  261. background-color: #000;
  262. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  263. background-attachment:fixed;
  264. padding: 5px 5px;
  265. text-decoration: none;
  266. text-transform: uppercase;
  267. -webkit-transition: all 0.7s ease-in-out;
  268. -moz-transition: all 0.7s ease-in-out;
  269. -o-transition: all 0.7s ease-in-out;
  270. -ms-transition: all 0.7s ease-in-out;
  271. transition: all 0.7s ease-in-out;
  272. }
  273.  
  274. #sidelinkfour {
  275. position: absolute;
  276. top: 350px;
  277. left: 160px;
  278. font-family: monospace;
  279. font-size: 16px;
  280. }
  281.  
  282. #sidelinkfour a {
  283. color: #fff;
  284. background-color: #000;
  285. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  286. background-attachment:fixed;
  287. padding: 5px 5px;
  288. text-decoration: none;
  289. text-transform: uppercase;
  290. -webkit-transition: all 0.7s ease-in-out;
  291. -moz-transition: all 0.7s ease-in-out;
  292. -o-transition: all 0.7s ease-in-out;
  293. -ms-transition: all 0.7s ease-in-out;
  294. transition: all 0.7s ease-in-out;
  295. }
  296.  
  297. #sidelinkfive {
  298. position: absolute;
  299. top: 400px;
  300. left: 210px;
  301. font-family: monospace;
  302. font-size: 16px;
  303. }
  304.  
  305. #sidelinkfive a {
  306. color: #fff;
  307. background-color: #000;
  308. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  309. background-attachment:fixed;
  310. padding: 5px 5px;
  311. text-decoration: none;
  312. text-transform: uppercase;
  313. -webkit-transition: all 0.7s ease-in-out;
  314. -moz-transition: all 0.7s ease-in-out;
  315. -o-transition: all 0.7s ease-in-out;
  316. -ms-transition: all 0.7s ease-in-out;
  317. transition: all 0.7s ease-in-out;
  318. }
  319.  
  320. #sidelinksix {
  321. position: absolute;
  322. top: 450px;
  323. left: 190px;
  324. font-family: monospace;
  325. font-size: 16px;
  326. }
  327.  
  328. #sidelinksix a {
  329. color: #fff;
  330. background-color: #000;
  331. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  332. background-attachment:fixed;
  333. padding: 5px 5px;
  334. text-decoration: none;
  335. text-transform: uppercase;
  336. -webkit-transition: all 0.7s ease-in-out;
  337. -moz-transition: all 0.7s ease-in-out;
  338. -o-transition: all 0.7s ease-in-out;
  339. -ms-transition: all 0.7s ease-in-out;
  340. transition: all 0.7s ease-in-out;
  341. }
  342.  
  343. #sidelinkone a:hover {
  344. text-decoration: underline;
  345. }
  346.  
  347. #sidelinktwo a:hover {
  348. text-decoration: underline;
  349. }
  350.  
  351. #sidelinkthree a:hover {
  352. text-decoration: underline;
  353. }
  354.  
  355. #sidelinkfour a:hover {
  356. text-decoration: underline;
  357. }
  358.  
  359. #sidelinkfive a:hover {
  360. text-decoration: underline;
  361. }
  362.  
  363. #sidelinksix a:hover {
  364. text-decoration: underline;
  365. }
  366.  
  367. #iconone {
  368. position: absolute;
  369. top: 174px;
  370. left: 680px;
  371. }
  372.  
  373. #icontwo {
  374. position: absolute;
  375. top: 274px;
  376. left: 680px;
  377. }
  378.  
  379. #iconthree {
  380. position: absolute;
  381. top: 374px;
  382. left: 680px;
  383. }
  384.  
  385. #iconfour {
  386. position: absolute;
  387. top: 474px;
  388. left: 680px;
  389. }
  390.  
  391. h1 {
  392. font-family: Andale Mono, monospace;
  393. color: #fff;
  394. font-size: 19px;
  395. background-color: #000;
  396. background-image: url('http://25.media.tumblr.com/tumblr_lxynxizoeZ1ql5z3qo4_250.jpg');
  397. background-attachment:fixed;
  398. padding: 6px 1px;
  399. }
  400.  
  401. ::selection {
  402. background: #000;
  403. color: #fff;
  404. }
  405.  
  406. ::-moz-selection {
  407. background: #000;
  408. color: #fff;
  409. }
  410.  
  411. b, strong {
  412. font-weight:none;
  413. color: #292929;
  414. }
  415.  
  416. i, em {
  417. font-weight:none;
  418. color: #330000;
  419. }
  420.  
  421. object {
  422. position: fixed;
  423. top: 0px;
  424. }
  425.  
  426.  
  427. </style>
  428. </head>
  429. <body>
  430.  
  431. <!------- THIS IS THE BACKGROUND IMAGE. YOU CAN POSITION IT AS YOU PLEASE.------>
  432.  
  433. <div style="bottom: -100px; right: -85px; position: fixed;"><img src="IMAGE URL HERE" alt=""></div>
  434.  
  435. <div id="sidebg"></div>
  436.  
  437. <!------- THIS IS THE CODE FOR THE FISH. YOU CAN GET RID OF THIS IF YOU DON'T WANT FISH.------>
  438.  
  439. <object type="application/x-shockwave-flash" style="outline:none;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/fish.swf?up_fishColor9=000000&up_backgroundColor=F3F3F3&up_fishColor10=000000&up_fishColor4=000000&up_foodColor=000000&up_fishColor5=000000&up_numFish=7&up_backgroundImage=&up_fishColor2=000000&up_fishColor7=000000&up_fishColor1=000000&up_fishColor6=000000&up_fishColor8=000000&up_fishName=Fish&up_fishColor3=000000&" width="100%" height="153"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/fish.swf?up_fishColor9=000000&up_backgroundColor=F0F0F0&up_fishColor10=000000&up_fishColor4=000000&up_foodColor=000000&up_fishColor5=000000&up_numFish=7&up_backgroundImage=&up_fishColor2=000000&up_fishColor7=000000&up_fishColor1=000000&up_fishColor6=000000&up_fishColor8=000000&up_fishName=Fish&up_fishColor3=000000&"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>
  440.  
  441. <!------- THE CODE FOR ICONS THAT APPEAR ONLY ON HOVER START HERE.------>
  442.  
  443. <div id="iconone">
  444. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  445. </div>
  446.  
  447. <div id="icontwo">
  448. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  449. </div>
  450.  
  451. <div id="iconthree">
  452. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  453. </div>
  454.  
  455. <div id="iconfour">
  456. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  457. </div>
  458.  
  459. <!------- YOU CAN CHANGE THE TITLE AND LINKS HERE.------>
  460.  
  461. <div id="sidetitle">/// TITLE</div>
  462.  
  463. <div id="sidelinkone">
  464. <a href="/">home</a>
  465. </div>
  466.  
  467. <div id="sidelinktwo">
  468. <a href="/ask">message</a>
  469. </div>
  470.  
  471. <div id="sidelinkthree">
  472. <a href="/">LINK</a>
  473. </div>
  474.  
  475. <div id="sidelinkfour">
  476. <a href="/">LINK HERE</a>
  477. </div>
  478.  
  479. <div id="sidelinkfive">
  480. <a href="/">LINK</a>
  481. </div>
  482.  
  483. <!-------PLEASE DON'T REMOVE CREDIT UNLESS YOU PLAN TO PUT IT ON A SEPERATE PAGE--------->
  484.  
  485. <div id="sidelinksix">
  486. <a href="http://bluenaegi.tumblr.com">credit</a>
  487. </div>
  488.  
  489. <!------- THE CODE FOR ICONS THAT SHOW WHEN YOU ARE NOT HOVERING OVER THEM START HERE. ------>
  490.  
  491. <div id="sideiconone">
  492. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  493. </div>
  494.  
  495. <div id="sideicontwo">
  496. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  497. </div>
  498.  
  499. <div id="sideiconthree">
  500. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  501. </div>
  502.  
  503. <div id="sideiconfour">
  504. <img style="width 100px; height: 100px;" src="IMAGE URL HERE">
  505. </div>
  506.  
  507. <div id="aboutbox">
  508.  
  509. <!--------YOU CAN CHANGE THE ABOUT TITLE IF YOU WANT-------->
  510.  
  511. <h1>PUT A TITLE HERE OR DELETE THIS</h1>
  512.  
  513.  
  514.  
  515. <div id="container">
  516.  
  517. <!------------THIS IS WHERE THE ACTUAL ABOUT STARTS. WRITE STUFF HERE--------------->
  518.  
  519. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut enim ad minim veniam</i>, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</b>. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  520.  
  521. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut enim ad minim veniam</i>, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</b>. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  522.  
  523. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut enim ad minim veniam</i>, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</b>. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  524.  
  525. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut enim ad minim veniam</i>, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <b>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</b>. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  526.  
  527. </div>
  528. </div>
  529.  
  530. </body>
  531. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement