API tools faq
paste
bsethemes

votre esprit est comme la galaxie (annotated ver.)

bsethemes
Jun 24th, 2015
1,388
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.76 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!--HERE IS YOUR TITLE!!!!!!!!!!!!!!-->
  5. <title>YOUR TITLE
  6. </title>
  7. <!--TITLE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!-->
  8.  
  9. <link rel="shortcut icon" href="http://38.media.tumblr.com/tumblr_m230z8YSMN1qfamg6.gif">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11.  
  12. <script type="text/javascript">
  13. WebFontConfig = {
  14. google: { families: [ 'Abel::latin' ] }
  15. };
  16. (function() {
  17. var wf = document.createElement('script');
  18. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  19. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  20. wf.type = 'text/javascript';
  21. wf.async = 'true';
  22. var s = document.getElementsByTagName('script')[0];
  23. s.parentNode.insertBefore(wf, s);
  24. })(); </script>
  25.  
  26. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  27. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  28. <script>
  29. (function($){
  30. $(document).ready(function(){
  31. $("a[title]").style_my_tooltips({
  32. tip_follows_cursor:true,
  33. tip_delay_time:90,
  34. tip_fade_speed:100,
  35. attribute:"title"
  36. });
  37. });
  38. })(jQuery);
  39. </script>
  40.  
  41.  
  42. <style type="text/css">
  43.  
  44.  
  45.  
  46. body {
  47. font-family: 'Abel', sans-serif;
  48. font-size:14px;
  49. background-color: #000;/* BACKGROUND COLOR */
  50. background-image:url('');/*BACKGROUND IMAGE URL BETWEEN THE ''*/
  51. background-attachment:fixed;
  52. background-size:cover;
  53. background-position:center;
  54. }
  55.  
  56. a {
  57. text-decoration:none;
  58. color:#fff;/* LINK COLOR */
  59. }
  60.  
  61. /* LINK HOVER i advice to leave it alone */
  62. a:hover {
  63. text-decoration:underline;
  64. }
  65.  
  66. #s-m-t-tooltip {
  67. max-width:200px;
  68. margin:25px 20px 25px 20px;
  69. background-color:#fff;/* tooltip background color */
  70. color:#000;/* tooltip text color */
  71. border:1px solid black;
  72. font-size:10px;
  73. line-height:13px;
  74. padding:3px 5px 4px 5px;
  75. box-shadow:rgba(0,0,0,0.07) 4px 4px;
  76. -webkit-transition: all 0.2s ease-out;
  77. -moz-transition: all 0.2s ease-out;
  78. transition: all 0.2s ease-out;
  79. z-index:999999999999999999999999999999999999;
  80. }
  81.  
  82. ::-webkit-scrollbar-thumb {
  83. height:auto;
  84. background-color:#fff;/* scroll bar */
  85. }
  86.  
  87. ::-webkit-scrollbar {
  88. height:9px;
  89. width:3px;
  90. background-color:transparent;
  91. }
  92.  
  93. ::-moz-selection {
  94. background: transparent;
  95. text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
  96. font-weight:bold;
  97. color:#e2e2e2;/* selection text color, for mozrella browser */
  98. }
  99.  
  100. ::selection {
  101. background: transparent;
  102. text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
  103. font-weight:bold;
  104. color:#e2e2e2;/* selection text color */
  105. }
  106.  
  107. h3 {
  108. letter-spacing:3px;
  109. text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
  110. text-transform:uppercase;
  111. margin-top:55px;
  112. }
  113.  
  114. #thesun {
  115. width:142px;
  116. height:142px;
  117. border-radius:100%;
  118. top: 38%;
  119. left: 46%;
  120. position:absolute;
  121. background:#FEB700;
  122. z-index:1;
  123. }
  124.  
  125. #info1 {
  126. opacity:0;
  127. width:60px;
  128. height:60px;
  129. background:#fff;
  130. text-align:center;
  131. margin-top:5px;
  132. margin-left:5px;
  133. position:absolute;
  134. border:3px solid #ffe5a5;
  135. border-top-left-radius:100%;
  136. border-top-right-radius:5%;
  137. border-bottom-left-radius:5%;
  138. border-bottom-right-radius:5%;
  139. -webkit-transition-duration: 1s;
  140. -moz-transition-duration: 1s;
  141. -o-transition-duration: 1s;
  142. transition-duration: 1s;
  143. }
  144.  
  145. #info1 p {
  146. color:#ffe5a5;
  147. font-weight:bold;
  148. font-size:12px;
  149. padding-bottom:0px;
  150. padding-right:0px;
  151. padding-top:15px;
  152. padding-left:5px;
  153. }
  154.  
  155. #info2 {
  156. opacity:0;
  157. width:60px;
  158. height:60px;
  159. background:#fff;
  160. text-align:center;
  161. margin-top:5px;
  162. margin-left:73px;
  163. position:absolute;
  164. border:3px solid #ffd06b;
  165. border-top-right-radius:100%;
  166. border-top-left-radius:5%;
  167. border-bottom-left-radius:5%;
  168. border-bottom-right-radius:5%;
  169. -webkit-transition-duration: 1s;
  170. -moz-transition-duration: 1s;
  171. -o-transition-duration: 1s;
  172. transition-duration: 1s;
  173. }
  174.  
  175. #info2 p {
  176. color:#ffd06b;
  177. font-weight:bold;
  178. font-size:15px;
  179. padding-bottom:0px;
  180. padding-right:20px;
  181. padding-top:10px;
  182. padding-left:0px;
  183. }
  184.  
  185. #info3 {
  186. opacity:0;
  187. width:60px;
  188. height:60px;
  189. background:#fff;
  190. text-align:center;
  191. margin-top:73px;
  192. margin-left:5px;
  193. position:absolute;
  194. border:3px solid #e89e00;
  195. border-bottom-left-radius:100%;
  196. border-top-right-radius:5%;
  197. border-top-left-radius:5%;
  198. border-bottom-right-radius:5%;
  199. -webkit-transition-duration: 1s;
  200. -moz-transition-duration: 1s;
  201. -o-transition-duration: 1s;
  202. transition-duration: 1s;
  203. }
  204.  
  205. #info3 p {
  206. color:#ba7f00;
  207. font-weight:bold;
  208. font-size:12px;
  209. padding-bottom:00px;
  210. padding-right:0px;
  211. padding-top:5px;
  212. padding-left:5px;
  213. }
  214.  
  215. #info4 {
  216. opacity:0;
  217. width:60px;
  218. height:60px;
  219. background:#fff;
  220. text-align:center;
  221. margin-top:73px;
  222. margin-left:73px;
  223. position:absolute;
  224. border:3px solid #ba7f00;
  225. border-bottom-right-radius:100%;
  226. border-top-right-radius:5%;
  227. border-bottom-left-radius:5%;
  228. border-top-left-radius:5%;
  229. -webkit-transition-duration: 1s;
  230. -moz-transition-duration: 1s;
  231. -o-transition-duration: 1s;
  232. transition-duration: 1s;
  233. }
  234.  
  235. #info4 p {
  236. color:#ba7f00;
  237. font-weight:bold;
  238. font-size:12px;
  239. padding-bottom:40px;
  240. padding-right:13px;
  241. padding-top:0px;
  242. padding-left:0px;
  243. }
  244.  
  245. #thesun:hover #info1 {
  246. opacity:1;
  247. -webkit-transition-duration: 1s;
  248. -moz-transition-duration: 1s;
  249. -o-transition-duration: 1s;
  250. transition-duration: 1s;
  251. }
  252.  
  253. #thesun:hover #info2 {
  254. opacity:1;
  255. -webkit-transition-duration: 2s;
  256. -moz-transition-duration: 2s;
  257. -o-transition-duration: 2s;
  258. transition-duration: 2s;
  259. }
  260.  
  261. #thesun:hover #info3 {
  262. opacity:1;
  263. -webkit-transition-duration: 3s;
  264. -moz-transition-duration: 3s;
  265. -o-transition-duration: 3s;
  266. transition-duration: 3s;
  267. }
  268.  
  269. #thesun:hover #info4 {
  270. opacity:1;
  271. -webkit-transition-duration: 4s;
  272. -moz-transition-duration: 4s;
  273. -o-transition-duration: 4s;
  274. transition-duration: 4s;
  275. }
  276.  
  277. #mercurystrack {
  278. width:182px;
  279. height:182px;
  280. border-radius:50%;
  281. top: 225px;
  282. left: 605px;
  283. position:absolute;
  284. z-index:-1;
  285. border:1px solid #fff;
  286. }
  287.  
  288. #mercury {
  289. width:15px;
  290. height:15px;
  291. border-radius:50%;
  292. top:310px;
  293. left:781px;
  294. position:absolute;
  295. background:#821903;
  296. color:#821903;
  297. overflow:hidden;
  298. -webkit-transition-duration: 1s;
  299. -moz-transition-duration: 1s;
  300. -o-transition-duration: 1s;
  301. transition-duration: 1s;
  302. }
  303.  
  304. #mercury:hover {
  305. padding:10px;
  306. text-align:justify;
  307. overflow:auto;
  308. color:#fff;
  309. width:200px;
  310. height:205px;
  311. border-radius:0%;
  312. z-index:1;
  313. -webkit-transition-duration: 1s;
  314. -moz-transition-duration: 1s;
  315. -o-transition-duration: 1s;
  316. transition-duration: 1s;
  317. }
  318.  
  319. #mercury:first-letter {
  320. font-weight:bold;
  321. letter-spacing:2px;
  322. font-size:18px;
  323. }
  324.  
  325. #venustrack {
  326. width:220px;
  327. height:220px;
  328. border-radius:50%;
  329. top: 205px;
  330. left: 585px;
  331. position:absolute;
  332. z-index:-1;
  333. border:1px solid #fff;
  334. }
  335.  
  336. #venus {
  337. width:20px;
  338. height:20px;
  339. border-radius:50%;
  340. top:240px;
  341. left:775px;
  342. position:absolute;
  343. background:#C57C02;
  344. color:#fd3b00;
  345. overflow:hidden;
  346. -webkit-transition-duration: 1s;
  347. -moz-transition-duration: 1s;
  348. -o-transition-duration: 1s;
  349. transition-duration: 1s;
  350. }
  351.  
  352. #venus:hover {
  353. width:100px;
  354. height:100px;
  355. top:200px;
  356. left:745px;
  357. content:url('https://41.media.tumblr.com/bf827d3829df0157cfb3b22f97bf9079/tumblr_mz79rpLJLK1svwlszo1_500.png');
  358. -webkit-transition-duration: 0.5s;
  359. -moz-transition-duration: 0.5s;
  360. -o-transition-duration: 0.5s;
  361. transition-duration: 0.5s;
  362. }
  363.  
  364.  
  365. #tag {
  366. border-bottom:1px solid #fff;
  367. border-right:1px solid #fff;
  368. margin-bottom:10px;
  369. text-align:center;
  370. -webkit-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  371. -moz-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  372. box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  373. -webkit-transition-duration: 2s;
  374. -moz-transition-duration: 2s;
  375. -o-transition-duration: 2s;
  376. transition-duration: 2s;
  377. }
  378.  
  379. #tag a {
  380. letter-spacing:2px;
  381. text-decoration:none;
  382. color:#fff;
  383. -webkit-transition-duration: 0.5s;
  384. -moz-transition-duration: 0.5s;
  385. -o-transition-duration: 0.5s;
  386. transition-duration: 0.5s;
  387. }
  388.  
  389. #tag a:hover {
  390. color:#000;
  391. text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
  392. background:#fff;
  393. padding-right:62px;
  394. padding-left:62px;
  395. -webkit-transition-duration: 0.5s;
  396. -moz-transition-duration: 0.5s;
  397. -o-transition-duration: 0.5s;
  398. transition-duration: 0.5s;
  399. }
  400.  
  401. #tag:hover {
  402. -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  403. -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  404. box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  405. -webkit-transition-duration: 2s;
  406. -moz-transition-duration: 2s;
  407. -o-transition-duration: 2s;
  408. transition-duration: 2s;
  409. }
  410. #earthstrack {
  411. width:260px;
  412. height:260px;
  413. border-radius:50%;
  414. top: 185px;
  415. left: 565px;
  416. position:absolute;
  417. z-index:-1;
  418. border:1px solid #fff;
  419. }
  420.  
  421. #themoon {
  422. width:10px;
  423. height:10px;
  424. top:240px;
  425. left:562px;
  426. position:absolute;
  427. background
  428. }
  429.  
  430. #earth {
  431. width:30px;
  432. height:30px;
  433. border-radius:50%;
  434. top:230px;
  435. left:572px;
  436. position:absolute;
  437. background:#034883;
  438. color:#034883;
  439. overflow:hidden;
  440. -webkit-transition-duration: 1s;
  441. -moz-transition-duration: 1s;
  442. -o-transition-duration: 1s;
  443. transition-duration: 1s;
  444. }
  445.  
  446. #earth:hover {
  447. width:150px;
  448. height:210px;
  449. top:210px;
  450. left:500px;
  451. color:#fff;
  452. z-index:1;
  453. padding:10px;
  454. overflow:auto;
  455. border-radius:0%
  456. }
  457.  
  458. #earth:hover h3 {
  459. margin-top:-5px;
  460. }
  461.  
  462. #marstrack {
  463. width:300px;
  464. height:300px;
  465. border-radius:50%;
  466. top: 165px;
  467. left: 545px;
  468. position:absolute;
  469. z-index:-1;
  470. border:1px solid #fff;
  471. }
  472.  
  473. #mars {
  474. width:25px;
  475. height:25px;
  476. border-radius:50%;
  477. top:400px;
  478. left:800px;
  479. position:absolute;
  480. background:#CB320F;
  481. color:#CB320F;
  482. overflow:hidden;
  483. -webkit-transition-duration: 1s;
  484. -moz-transition-duration: 1s;
  485. -o-transition-duration: 1s;
  486. transition-duration: 1s;
  487. }
  488.  
  489. #mars:hover {
  490. width:150px;
  491. height:210px;
  492. top:360px;
  493. left:750px;
  494. color:#fff;
  495. padding:10px;
  496. overflow:auto;
  497. z-index:1;
  498. border-radius:0%
  499. }
  500.  
  501. #mars:hover h3 {
  502. margin-top:-5px;
  503. }
  504.  
  505. #jupiterstrack {
  506. width:380px;
  507. height:380px;
  508. border-radius:50%;
  509. top: 130px;
  510. left: 510px;
  511. position:absolute;
  512. z-index:-1;
  513. border:1px solid #fff;
  514. }
  515.  
  516. #jupiter {
  517. width:60px;
  518. height:60px;
  519. border-radius:50%;
  520. top:415px;
  521. left:530px;
  522. position:absolute;
  523. background:#523A1C;
  524. color:#523A1C;
  525. overflow:hidden;
  526. -webkit-transition-duration: 1s;
  527. -moz-transition-duration: 1s;
  528. -o-transition-duration: 1s;
  529. transition-duration: 1s;
  530. }
  531.  
  532. #jupiter:hover {
  533. width:150px;
  534. height:210px;
  535. top:400px;
  536. left:500px;
  537. color:#fff;
  538. padding:10px;
  539. overflow:auto;
  540. z-index:1;
  541. border-radius:0%
  542. }
  543.  
  544. #jupiter:hover h3 {
  545. margin-top:20px;
  546. }
  547.  
  548. #jupiter:hover h3 {
  549. margin-top:-5px;
  550. }
  551.  
  552. #saturnstrack {
  553. width:470px;
  554. height:470px;
  555. border-radius:50%;
  556. top: 85px;
  557. left: 465px;
  558. position:absolute;
  559. z-index:-1;
  560. border:1px solid #fff;
  561. }
  562.  
  563. #saturnsring {
  564. width:65px;
  565. height:20px;
  566. top:115px;
  567. left:793px;
  568. position:absolute;
  569. border-radius:100%;
  570. border-top:1px solid #8E5715;
  571. border-bottom:2px solid #C9B89C;
  572. border-right:2px solid #C9B89C;
  573. border-left:2px solid #C9B89C;
  574. }
  575.  
  576. #saturn {
  577. width:55px;
  578. height:50px;
  579. border-radius:50%;
  580. top:100px;
  581. left:800px;
  582. position:absolute;
  583. background:#8E5715;
  584. color:#8E5715;
  585. overflow:hidden;
  586. -webkit-transition-duration: 1s;
  587. -moz-transition-duration: 1s;
  588. -o-transition-duration: 1s;
  589. transition-duration: 1s;
  590. }
  591.  
  592. #saturn:hover {
  593. width:150px;
  594. height:210px;
  595. top:60px;
  596. left:750px;
  597. color:#fff;
  598. padding:10px;
  599. overflow:auto;
  600. z-index:1;
  601. border-radius:0%
  602. }
  603.  
  604. #saturn:hover #saturnsring {
  605. width:0px;
  606. height:0px;
  607. top:0px;
  608. left:0px;
  609. }
  610.  
  611. #saturn:hover h3 {
  612. margin-top:-2px;
  613. }
  614.  
  615. #link {
  616. background:#fff;
  617. padding:5px;
  618. text-align:center;
  619. margin-bottom:10px;
  620. border:1px solid #c0c0c0;
  621. -webkit-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  622. -moz-box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  623. box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.45);
  624. -webkit-transition-duration: 1.5s;
  625. -moz-transition-duration: 1.5s;
  626. -o-transition-duration: 1.5s;
  627. transition-duration: 1.5s;
  628. }
  629.  
  630. #link a {
  631. font-weight:bold;
  632. color:#c0c0c0;
  633. letter-spacing:5px;
  634. text-transform:uppercase;
  635. -webkit-transition-duration: 0.5s;
  636. -moz-transition-duration: 0.5s;
  637. -o-transition-duration: 0.5s;
  638. transition-duration: 0.5px;
  639. }
  640.  
  641. #link a:hover {
  642. text-decoration:none;
  643. letter-spacing:10px;
  644. -webkit-transition-duration: 0.5s;
  645. -moz-transition-duration: 0.5s;
  646. -o-transition-duration: 0.5s;
  647. transition-duration: 0.5s;
  648. }
  649.  
  650. #link:hover {
  651. -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  652. -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  653. box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.45);
  654. -webkit-transition-duration: 1.5s;
  655. -moz-transition-duration: 1.5s;
  656. -o-transition-duration: 1.5s;
  657. transition-duration: 1.5s;
  658. }
  659.  
  660. #uranustrack {
  661. width:540px;
  662. height:540px;
  663. border-radius:50%;
  664. top: 50px;
  665. left: 430px;
  666. position:absolute;
  667. z-index:-1;
  668. border:1px solid #fff;
  669. }
  670.  
  671. #uranusring {
  672. width:54px;
  673. height:20px;
  674. top:53px;
  675. left:594px;
  676. position:absolute;
  677. border-radius:100%;
  678. border-top:1px solid #384B59;
  679. border-bottom:2px solid #596A75;
  680. border-right:2px solid #596A75;
  681. border-left:2px solid #596A75;
  682. }
  683.  
  684. #uranus {
  685. width:45px;
  686. height:45px;
  687. border-radius:50%;
  688. top:40px;
  689. left:600px;
  690. position:absolute;
  691. background:#384B59;
  692. color:#384B59;
  693. overflow:hidden;
  694. -webkit-transition-duration: 1s;
  695. -moz-transition-duration: 1s;
  696. -o-transition-duration: 1s;
  697. transition-duration: 1s;
  698. }
  699.  
  700. #uranus:hover {
  701. width:200px;
  702. height:220px;
  703. top:20px;
  704. left:550px;
  705. color:#fff;
  706. padding:10px;
  707. overflow:auto;
  708. z-index:1;
  709. border-radius:0%
  710. }
  711.  
  712. #uranus:hover h3 {
  713. margin-top:-3px;
  714. }
  715.  
  716. #uranus:hover #uranusring {
  717. width:0px;
  718. height:0px;
  719. top:0px;
  720. left:0px;
  721. }
  722.  
  723. #uranus img {
  724. border-radius:50%;
  725. border:1px solid #c0c0c0;
  726. padding:5px;
  727. margin-right:5px;
  728. }
  729.  
  730. #neptunestrack {
  731. width:600px;
  732. height:600px;
  733. border-radius:50%;
  734. top: 20px;
  735. left: 400px;
  736. position:absolute;
  737. z-index:-1;
  738. border:1px solid #fff;
  739. }
  740.  
  741. #neptune {
  742. width:45px;
  743. height:40px;
  744. border-radius:50%;
  745. top:260px;
  746. left:380px;
  747. position:absolute;
  748. background:#274AB6;
  749. color:#274AB6;
  750. overflow:hidden;
  751. -webkit-transition-duration: 1s;
  752. -moz-transition-duration: 1s;
  753. -o-transition-duration: 1s;
  754. transition-duration: 1s;
  755. }
  756.  
  757. #neptune:hover {
  758. width:200px;
  759. height:210px;
  760. top:240px;
  761. left:330px;
  762. color:#fff;
  763. padding:10px;
  764. overflow:auto;
  765. z-index:1;
  766. border-radius:0%
  767. }
  768.  
  769. #neptune:hover h3 {
  770. margin-top:-3px;
  771. }
  772.  
  773. #q {
  774. padding:5px;
  775. background-color:rgba(255,255,255,0.5);
  776. color:#fff;
  777. text-transform:capitalize;
  778. border:1px solid #fff;
  779. letter-spacing:2px;
  780. margin-bottom:5px;
  781. }
  782.  
  783. #a {
  784. text-align:justify;
  785. text-transform:capitalize;
  786. margin-bottom:5px;
  787. letter-spacing:1px;
  788. }
  789.  
  790. #plutostrack {
  791. width:720px;
  792. height:620px;
  793. border-radius:50%;
  794. top: 10px;
  795. left: 340px;
  796. position:absolute;
  797. z-index:-1;
  798. border:1px solid #fff;
  799. }
  800.  
  801. #pluto {
  802. width:10px;
  803. height:10px;
  804. border-radius:50%;
  805. top:500px;
  806. left:987px;
  807. position:absolute;
  808. background:#A79AA2;
  809. color:#A79AA2;
  810. overflow:hidden;
  811. -webkit-transition-duration: 1s;
  812. -moz-transition-duration: 1s;
  813. -o-transition-duration: 1s;
  814. transition-duration: 1s;
  815. }
  816.  
  817. #pluto:hover {
  818. width:305px;
  819. height:255px;
  820. top:350px;
  821. left:820px;
  822. color:#fff;
  823. padding:10px;
  824. overflow:auto;
  825. z-index:1;
  826. border-radius:0%
  827. }
  828.  
  829. #credit {
  830. position:fixed;
  831. right:10px;
  832. bottom:10px;
  833. background-color:rgba(255, 255, 255, 0.5);
  834. padding:5px;
  835. letter-spacing:5px;
  836. border:1px solid #fff;
  837. -webkit-box-shadow: 4px 4px 0px 0px rgba(255, 255, 255, 0.2);
  838. -moz-box-shadow: 4px 4px 0px 0px rgba(255, 255, 255, 0.2);
  839. box-shadow: 4px 4px 0px 0px rgba(255, 255, 255, 0.2);
  840. -webkit-transition-duration: 1s;
  841. -moz-transition-duration: 1s;
  842. -o-transition-duration: 1s;
  843. transition-duration: 1s;
  844. }
  845.  
  846. #credit a {
  847. font-weight:bold;
  848. font-size:15px;
  849. text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
  850. }
  851.  
  852. #credit:hover {
  853. -webkit-box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.2);
  854. -moz-box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.2);
  855. box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.2);
  856. -webkit-transition-duration: 1s;
  857. -moz-transition-duration: 1s;
  858. -o-transition-duration: 1s;
  859. transition-duration: 1s;
  860. }
  861.  
  862. </style>
  863. </head>
  864. <body>
  865. <div id="thesun">
  866. <div id="info1"><p><!-- add your name here -->Dana</p></div>
  867. <div id="info2"><p><!-- add your age here -->17</p></div>
  868. <div id="info3"><p><!-- add extra info here -->ENFP</p></div>
  869. <div id="info4"><p><!-- add extra info here -->Theme Maker</p></div>
  870. </div>
  871.  
  872. <div id="mercury">
  873. <!-- write about yourself here -->
  874. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac dui felis. Sed malesuada varius faucibus. Aenean euismod id mauris vel finibus. Nullam efficitur ultrices orci. Donec mattis lectus non urna efficitur, non molestie tellus elementum. Fusce ornare tellus nec lectus bibendum, vel lobortis ex auctor.<br><q>quote</q> <b>bold</b> <em>italic</em>
  875.  
  876. </div>
  877.  
  878. <div id="venus"></div>
  879. <div id="earth">
  880. <h3>Tags</h3>
  881. <!-- don't forget to add <div id="tag"></div> around your links -->
  882.  
  883. <div id="tag"><a href="/">Tag</a></div>
  884. <div id="tag"><a href="/">Tag</a></div>
  885. <div id="tag"><a href="/">Tag</a></div>
  886. <div id="tag"><a href="/">Tag</a></div>
  887. <div id="tag"><a href="/">Tag</a></div>
  888. <div id="tag"><a href="/">Tag</a></div>
  889. </div>
  890. <div id="mars">
  891. <h3>Tags</h3>
  892. <!-- don't forget to add <div id="tag"></div> around your links -->
  893.  
  894. <div id="tag"><a href="/">Tag</a></div>
  895. <div id="tag"><a href="/">Tag</a></div>
  896. <div id="tag"><a href="/">Tag</a></div>
  897. <div id="tag"><a href="/">Tag</a></div>
  898. <div id="tag"><a href="/">Tag</a></div>
  899. <div id="tag"><a href="/">Tag</a></div>
  900. </div>
  901. <div id="jupiter">
  902. <h3>Tags</h3>
  903. <!-- don't forget to add <div id="tag"></div> around your links -->
  904.  
  905. <div id="tag"><a href="/">Tag</a></div>
  906. <div id="tag"><a href="/">Tag</a></div>
  907. <div id="tag"><a href="/">Tag</a></div>
  908. <div id="tag"><a href="/">Tag</a></div>
  909. <div id="tag"><a href="/">Tag</a></div>
  910. <div id="tag"><a href="/">Tag</a></div>
  911. </div>
  912. <div id="saturn">
  913. <h3>Links</h3>
  914. <!-- don't forget to add <div id="link"></div> around your links -->
  915.  
  916. <div id="link"><a href="http://">Link</a></div>
  917. <div id="link"><a href="http://">Link</a></div>
  918. <div id="link"><a href="http://">Link</a></div>
  919. <div id="link"><a href="http://">Link</a></div>
  920. </div>
  921. <div id="uranus">
  922. <h3>Blogroll</h3>
  923.  
  924. <center>
  925. {block:Following}{block:Followed}<a target="_blank" href="{FollowedURL}" title="{FollowedTitle}"><img src="{FollowedPortraitURL-24}" /></a>{/block:Followed}{/block:Following}
  926. </center>
  927. </div>
  928. <div id="neptune">
  929. <h3>FAQ</h3>
  930. <!-- don't forget to add <div id="q"></div> around questions and <div id="a"></div> around answers -->
  931.  
  932. <div id="q">Question?</div>
  933. <div id="a">Answer.</div>
  934.  
  935. <div id="q">Question?</div>
  936. <div id="a">Answer.</div>
  937.  
  938.  
  939. <div id="q">Question?</div>
  940. <div id="a">Answer.</div>
  941. </div>
  942. <div id="pluto">
  943. <center>
  944. <iframe frameborder="0" border="0" scrolling="no" width="300" height="250" allowtransparency="true" src="http://www.tumblr.com/ask_form/kittycatlou.tumblr.com" style="background-color:transparent; overflow:hidden;"></iframe>
  945. </center>
  946. </div>
  947.  
  948. <div id="saturnsring"></div>
  949. <div id="uranusring"></div>
  950.  
  951. <div id="mercurystrack"></div>
  952. <div id="venustrack"></div>
  953. <div id="earthstrack"></div>
  954. <div id="marstrack"></div>
  955. <div id="jupiterstrack"></div>
  956. <div id="saturnstrack"></div>
  957. <div id="uranustrack"></div>
  958. <div id="neptunestrack"></div>
  959. <div id="plutostrack"></div>
  960.  
  961. <div id="credit"><a href="http://bsethemes.tumblr.com/">Theme</a></div>
  962.  
  963. </body>
  964. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!