Advertisement
SeoulChan

Moonlight : About Page

Jan 27th, 2015
3,371
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Lua 7.47 KB | None | 0 0
  1. <!----
  2.  _         _             _    
  3. | |       (_)           | |  
  4. | | ____ _ _  __ _ _   _| | __
  5. | |/ / _` | |/ _` | | | | |/ /
  6. |   < (_| | | (_| | |_| |   <
  7. |_|\_\__,_|_|\__, |\__,_|_|\_\
  8.               __/ |          
  9.              |___/
  10. Moonlight: About me Page by Kaiguk  (http://kaiguk.tumblr.com/)
  11.  
  12. Please don't claim , use as a base page, or fuck with anything like the credit because if you do..I'll slap the shit and piss out you.
  13.  
  14. Notify me if you have any questions or if something goes wrong. I will do my best to help you.
  15.  
  16. Happy using.
  17.  
  18. --->
  19.  
  20. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  21.  
  22. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  23.  
  24. <title>{Title}</title>
  25.  
  26. <link rel="shortcut icon" href="{Favicon}">
  27.  
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29.  
  30. <meta name="description" content="{MetaDescription}" />
  31.  
  32. <head>
  33.  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  34.  
  35. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  36.  
  37. <script>
  38.  
  39. (function($){
  40.  
  41. $(document).ready(function(){
  42.  
  43. $("a[title]").style_my_tooltips({
  44.  
  45. tip_follows_cursor:true,
  46.  
  47. tip_delay_time:30,
  48.  
  49. tip_fade_speed:300,
  50.  
  51. attribute:"title"
  52.  
  53. });
  54.  
  55. });
  56.  
  57. })(jQuery);
  58.  
  59. </script>
  60. <style type="text/css">
  61.  
  62. /** --------------------------- SCROLLBAR ------------------------------**/
  63.  
  64.  
  65. ::-webkit-scrollbar {
  66. width:7px;
  67. height:auto;
  68. background:#fff;
  69. }
  70.  
  71. ::-webkit-scrollbar-corner {
  72. background:#fff;
  73. }
  74.  
  75. ::-webkit-scrollbar-thumb:vertical {
  76. background:#f3f3f3;
  77. }
  78.  
  79. ::-webkit-scrollbar-thumb:horizontal {
  80. background: #fff;
  81. border: 0px solid #fff;
  82. }
  83.  
  84. /** --------------------------- TOP BORDER ------------------------------**/
  85.  
  86. #top {
  87. position:fixed;
  88. height:100%;
  89. left:0px;
  90. top:0px;
  91. width:100%;
  92. height:60px;
  93. z-index:999;
  94. background-color: #000;
  95. }  
  96.  
  97. /** --------------------------- WHOLE CUSTOMIZATION ------------------------------**/
  98.  
  99. body {
  100. background-image: url(http://41.media.tumblr.com/tumblr_lxwynw0Pdg1r9g6hvo4_250.png);
  101. margin:0px;
  102. color:#aaa;
  103. font-family:courier;
  104. font-size:9.5px;
  105. text-transform:uppercase;
  106. padding:5px;
  107. }
  108.  
  109. /** --------------------------- LINKS ------------------------------**/
  110.  
  111.  
  112. a {
  113. color:#000;
  114. text-decoration:none;
  115. outline:none;
  116. opacity:1 ;
  117. -webkit-transition: all 0.8s;
  118. -moz-transition: all 0.8s;
  119. transition: all 0.8s;
  120. }
  121.  
  122. a:hover {
  123. color:#eee;
  124. -webkit-transition: all 0.8s;
  125. -moz-transition: all 0.8s;
  126. transition: all 0.8s;
  127. }
  128.  
  129. /** --------------------------- BOLD, ITALIC, UNDERLINED ------------------------------**/
  130.  
  131. b, strong {
  132.  color: #888888;
  133.  font-weight: bold;
  134.  }
  135.  
  136. i, em {
  137.  color: #676767;
  138.  font-style: italic;
  139.  }
  140.    
  141. u {
  142.  color: #CECECE;
  143.  }  
  144.  
  145. /** --------------------------- HOVER DESIGN ------------------------------**/
  146.  
  147. #s-m-t-tooltip{
  148. font-size:9.5px;
  149. position:absolute;
  150. margin-top: 15px;
  151. letter-spacing:1px;
  152. z-index:9999;
  153. background:#eee;
  154. color:#aaa;
  155. text-transform:uppercase;
  156. padding:2px 3px 2px 3px;
  157. }
  158.  
  159. /** --------------------------- SIDE IMAGE ------------------------------**/
  160.  
  161. #pic{
  162. padding:3px;
  163. }
  164.  
  165. #pic img{
  166. width:170px;
  167. float:right;
  168. padding:10px;
  169. opacity:0.8;
  170. border:1px solid #fcfcfc;
  171. margin-left:220px;
  172. margin-top:-15px;
  173. position:fixed;
  174. }
  175.  
  176. /** --------------------------- DESCRIPTION ------------------------------**/
  177.  
  178. #words{
  179. width:200px;
  180. height:215px;
  181. word-spacing:2px;
  182. letter-spacing:1px;
  183. float:right;
  184. line-height:190%;
  185. margin-right:12%;
  186. margin-top:-5px;
  187. padding:10px;
  188. overflow:auto;
  189. position:fixed;
  190. }
  191.  
  192. #words:first-letter {
  193. width:22px;
  194. height:22px;  
  195. font-size:20px;
  196. text-transform:uppercase;
  197. padding-right:2px;
  198. color:#000;
  199. font-family:times;
  200. }
  201.  
  202. /** --------------------------- BASIC INFO ------------------------------**/
  203.  
  204. #info{
  205. width:200px;
  206. float:left;
  207. text-align:left;
  208. line-height:120%;
  209. letter-spacing:1px;
  210. word-spacing:1px;
  211. margin-top:-200px;
  212. margin-left:42px;
  213. border-right:1px solid #eee;
  214. }
  215.  
  216. /** --------------------------- QUOTE ------------------------------**/
  217.  
  218. #quote{
  219. width:130px;
  220. font-size:14px;
  221. line-height:120%;
  222. text-align:justify;
  223. letter-spacing:1px;
  224. word-spacing:1px;
  225. margin-top:-200px;
  226. margin-left:280px;
  227. padding:10px;
  228. }
  229.  
  230. /** --------------------------- CONTAINERS ------------------------------**/
  231.    
  232. #boxcon{
  233. width:500px;  
  234. margin-bottom:20px;
  235. margin-top:100px;
  236. margin-left:35%;
  237. }
  238.  
  239. .box{
  240. width:400px;
  241. height:400px;  
  242. border-radius:50px;
  243. border:1px solid #fcfcfc;
  244. letter-spacing: 2px;
  245. text-align:justify;
  246. margin-bottom:25px;
  247. background:#fff;
  248. padding:40px;
  249. }
  250.  
  251. /** --------------------------- TOP LINKS ------------------------------**/
  252.  
  253.  #toplinks{
  254.  margin-left:34.8%;
  255.  margin-top:20px;
  256.  width:500px;
  257.  }
  258.  
  259. #toplinks a{
  260. color:#fff;
  261. background: #000;
  262. margin-left:10px;
  263. letter-spacing: 2px;
  264. text-align:center;
  265. padding:10px;
  266. -webkit-transition: all 0.5s;
  267. -moz-transition: all 0.5s;
  268. transition: all 0.5s;
  269. }
  270.  
  271. #toplinks a:hover{
  272. background:#000;
  273. color:#222;
  274. -webkit-transition: all 0.5s;
  275. -moz-transition: all 0.5s;
  276. transition: all 0.5s;
  277. }
  278.  
  279. /** --------------------------- NO TOUCH ------------------------------**/
  280.  
  281. #ani {
  282. position:fixed;
  283. left:10px;
  284. bottom:10px;
  285. text-transform:uppercase;
  286. font-size:15px;
  287. letter-spacing:1px;
  288. padding:5px;
  289. -webkit-transition: all 0.3s ease;
  290. -moz-transition: all 0.3s ease;
  291. -ms-transition: all 0.3s ease;
  292. -o-transition: all 0.3s ease;
  293. transition: all 0.3s ease;
  294. }
  295.  
  296. {CustomCSS}
  297.    
  298. </style>
  299.  
  300.  
  301. </head>
  302.  
  303. <body>
  304.  
  305. <!----------------------------- TOP BORDER -------------------------------->
  306.  
  307. <div id="top">
  308. <!----------------------------- TOP LINKS -------------------------------->
  309.  
  310.  <div id="toplinks">
  311.  
  312. <a href="/">Home</a>
  313. <a href="/">Mail</a>
  314. <a href="/">Dash</a>  
  315. <a href="/">Link</a>  
  316. <a href="/">Link</a>  
  317. <a href="/">Link</a>  
  318. <a href="/">Link</a>  
  319.  
  320. </div>    
  321.    
  322. </div>
  323.  
  324. <!----------------------------- CONTAINERS -------------------------------->
  325.  
  326. <div id="boxcon">
  327.  
  328. <div class="box">  
  329.  
  330. <!----------------------------- SIDE IMAGE -------------------------------->
  331.  
  332. <div id="pic">
  333.  
  334. <img src="http://i926.photobucket.com/albums/ad102/My_originals_album/icons/image-1.png">
  335.  
  336. </div>
  337. <!----------------------------- DESCRIPTION -------------------------------->
  338.  
  339. <div id="words">  
  340.  
  341. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris.<i> Aliquam mattis</i> porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. <u>Curabitur sit amet quam id libero suscipit venenatis</u>.
  342. </div>
  343.  
  344.    
  345. </div>
  346.  
  347. <!----------------------------- BASIC INFO -------------------------------->
  348.  
  349. <div id="info">
  350.  
  351. <i>Name:</i>  YOUR NAME<p>
  352. <i>Age:</i> YOUR AGE <p>
  353. <i>Place:</i> WHERE YOU LIVE <p>
  354. <i>Hobbies:</i> THINGS YOU ENJOY DOING <p>
  355. <i>Status:</i> HOW YOU'RE FEELING <p>
  356. <i>Music:</i> FAVORITE SONG AT THE MOMENT<p>
  357.  
  358. </div>  
  359.  
  360. <!----------------------------- QUOTE -------------------------------->
  361.  
  362. <div id="quote">
  363.  
  364. <i>❝ </i> PLACE ONE OF YOUR FAVORITE QUOTES HERE OR WHATEVER YOU'D LIKE.<i></i>
  365. </div>
  366.  
  367.  
  368. </div>
  369.    
  370. </div>
  371.  
  372.  
  373. </div>
  374.  
  375. <!----------------------------- NO TOUCHING -------------------------------->
  376.  
  377. <div id="ani">
  378.  
  379. <a href="http://kaiguk.tumblr.com/" title="page by Ani">KG</a>
  380.    
  381. </div>
  382. </div>
  383.  
  384. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement