Advertisement
lonodon

NAVIGATION THEME 01; 3D; DARK VERSION

Aug 28th, 2013
282
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.78 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. <!--
  4. ╱╭╮╭╮╱╱╱╱╱╱╱╱╱╱╱╭╮╱╱╱╱╱╱╭╮╱╱╱╱╱╱╱╱╱╱╱╭╮
  5. ╭╯╰┫┃╱╱╱╱╱╱╱╱╱╱╱┃┃╱╱╱╱╱╱┃┃╱╱╱╱╱╱╱╱╱╱╱┃┃
  6. ╰╮╭┫╰━┳━━┳╮╭┳━━╮┃╰━┳╮╱╭╮┃┃╭━━┳━╮╭━━┳━╯┣━━┳━╮
  7. ╱┃┃┃╭╮┃┃━┫╰╯┃┃━┫┃╭╮┃┃╱┃┃┃┃┃╭╮┃╭╮┫╭╮┃╭╮┃╭╮┃╭╮╮
  8. ╱┃╰┫┃┃┃┃━┫┃┃┃┃━┫┃╰╯┃╰━╯┃┃╰┫╰╯┃┃┃┃╰╯┃╰╯┃╰╯┃┃┃┃
  9. ╱╰━┻╯╰┻━━┻┻┻┻━━╯╰━━┻━╮╭╯╰━┻━━┻╯╰┻━━┻━━┻━━┻╯╰╯
  10. ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╭━╯┃
  11. ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╰━━╯
  12. -->
  13. <!-- NAVIGATION THEME 01; 3D; DARK BY LONODON, DO NOT STEAL OR REMOVE CREDIT. I SWEAR I WILL HUNT YOU DOWN. BASE CODE BY DYLAENOBRIENS -->
  14.  
  15. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  16.  
  17.  
  18. <head>
  19.  
  20. <title>{Title}</title>
  21.  
  22. {block:Description}<meta name="description" content="{MetaDescription}"/>
  23. {/block:Description}
  24. <link rel="shortcut icon" href="{Favicon}" />
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  26.  
  27. <style type="text/css">
  28.  
  29.  
  30. /*--scrollbar--*/
  31.  
  32. ::-webkit-scrollbar-thumb:vertical {border:3px solid #fff;height:12px; background-color:{color:scrollbar};}
  33. ::-webkit-scrollbar-thumb:horizontal {background-color:#fff;}
  34. ::-webkit-scrollbar {background-color:{color:scrollbar};height:7px;width:12px;border:5px solid #fff;}
  35. ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment{background-color:{color:scrollbar};display:block;height:8px;border-right:2px solid #fff;border-left:2px solid #fff;
  36. }
  37. /*--body--*/
  38.  
  39.  
  40. body {
  41. font-style:none;
  42. background-color:{color:bg};
  43. font-family:calibri;
  44. color:{color:text};
  45. font-size:9px;
  46. background-color: #000
  47. }
  48.  
  49.  
  50. a {
  51. color:{color:link};
  52. text-decoration:none;
  53. -webkit-transition: all 0.5s ease-out;
  54. -moz-transition: all 0.5s ease-out;
  55. transition: all 0.5s ease-out;
  56. }
  57.  
  58. a:hover {
  59. color:{color:hover};
  60. text-decoration:none;
  61. -webkit-transition: all 0.8s ease-out;
  62. -moz-transition: all 0.8s ease-out;
  63. transition: all 0.8s ease-out;
  64. }
  65.  
  66. img {
  67. border:none;
  68. }
  69.  
  70. blockquote {
  71. padding-left:5px;
  72. border-left:2px solid {color:border};
  73. }
  74.  
  75. h1 {
  76. font-size:10px;
  77. }
  78.  
  79. /*--Cursor code--*/
  80.  
  81.  
  82. *, body, a, a:hover {cursor: url("http://www.totallylayouts.com/cursors/random/tiny_cursor.png"), auto }
  83.  
  84. /*everything*/
  85.  
  86. #everything {
  87. margin-left:250px;
  88. margin-top:100px;
  89.  
  90. }
  91.  
  92. /*--title--*/
  93.  
  94. #title {
  95. font-family:'absender';
  96. font-size:80px;
  97. margin-top:-67px;
  98. margin-left:130px;
  99. color:#fff
  100. -size:8px;
  101. color:{color:links};
  102.  
  103.  
  104.  
  105. }
  106. /*--links--*/
  107.  
  108. #links {
  109. width:150px;
  110. font-family:'absender';
  111. text-transform:uppercase;
  112. text-align:center;
  113. margin-top:-50px;
  114. margin-left:334px;
  115. }
  116.  
  117. #links a {
  118. padding:3px;
  119. font-size:15px;
  120. color:#fff;
  121. letter-spacing:1px
  122. -webkit-transition: all 0.4s ease-in-out;
  123. -moz-transition: all 0.4s ease-in-out;
  124. -o-transition: all 0.4s ease-in-out;
  125. -ms-transition: all 0.4s ease-in-out;
  126. transition: all 0.4s ease-in-out;
  127. }
  128.  
  129. #links a:hover {
  130. color:#000;
  131. background-color:#fff;
  132. letter-spacing:4px
  133. }
  134.  
  135.  
  136.  
  137. #grouptitle {
  138. padding:5px;
  139. text-align:center;
  140. font-style:italic;
  141. font-family:'times new roman';
  142. color:#fff;
  143. font-size:17px;
  144. width:150px;
  145. margin-left:75px;
  146. margin-top:40px;
  147. border-left:4px solid #fff;
  148. border-right:4px solid #fff;
  149. border-top:4px solid #fff;
  150. }
  151.  
  152.  
  153. #grouplinks {
  154. width:120px;
  155. margin-top:-25px;
  156. padding:20px;
  157. padding-bottom:0px;
  158. margin-left:75px;
  159. border:4px solid #fff;
  160. }
  161.  
  162.  
  163. #grouplinks a {
  164. font-family:'absender';
  165. display:block;
  166. color:#fff;
  167. font-size:10px;
  168. padding:2px;
  169. text-align:center;
  170. letter-spacing:4px;
  171. text-transform:uppercase;
  172. margin-bottom:5px;
  173. -webkit-transition: all 0.4s ease-in-out;
  174. -moz-transition: all 0.4s ease-in-out;
  175. -o-transition: all 0.4s ease-in-out;
  176. -ms-transition: all 0.4s ease-in-out;
  177. transition: all 0.4s ease-in-out;
  178. }
  179.  
  180. #grouplinks a:hover {
  181. background:#fff;
  182. letter-spacing:8px;
  183. color:#000;
  184. }
  185.  
  186. h1 {
  187. text-shadow: 3px 0 .2px #FF0000;
  188. color:#fff;
  189. font:85px absneder;
  190. }
  191. h1 {
  192. text-shadow: -3px 0 .2px #00F1F5;
  193. color:#fff;
  194. font:85px absender;
  195. }
  196. h1 {
  197. text-shadow: 3px 0 .2px #FF0000, -3px 0 .2px #00F1F5;
  198. color:#fff;
  199. font:85px absender;
  200. }
  201.  
  202. h2 {
  203. text-shadow: 2px 0 .2px #FF0000;
  204. color:#fff;
  205. font:30px absender;
  206. }h2 {
  207. text-shadow: -2px 0 .2px #00F1F5;
  208. color:#fff;
  209. font:30px absender;
  210. }h2 {
  211. text-shadow: 2px 0 .2px #FF0000, -2px 0 .2px #00F1F5;
  212. color:#fff;
  213. font:30px absender;
  214. }
  215.  
  216.  
  217. {CustomCSS}
  218.  
  219. </style></head>
  220.  
  221.  
  222. <body>
  223.  
  224. <div id="everything">
  225.  
  226. <div id="title"><h1>★Navigation★</h1></div>
  227.  
  228. <div id="links">
  229. <a href="/">HOME</a>
  230. <a href="/ask">ASK</a>
  231. <a href="http://lonodon.tumblr.com/">theme</a>
  232. </div>
  233.  
  234. <table id="all" border="0" cellpadding="0" cellspacing="0">
  235.  
  236.  
  237. <td><div id="grouptitle"><big><h2>Group #1</h2></div>
  238. <div id="grouplinks">
  239. <a href="/tagged/">link 1</a>
  240.  
  241. <a href="/tagged/">link 2</a>
  242.  
  243. <a href="/tagged/">link 3</a>
  244.  
  245. <a href="/tagged/">link 4</a>
  246.  
  247. </div></td>
  248.  
  249.  
  250. <td><div id="grouptitle"><big><h2>Group #2</h2></div>
  251. <div id="grouplinks">
  252. <a href="/tagged/">link 1</a>
  253.  
  254. <a href="/tagged/">link 2</a>
  255.  
  256. <a href="/tagged/">link 3</a>
  257.  
  258. <a href="/tagged/">link 4</a>
  259.  
  260. </div></td>
  261.  
  262. <td><div id="grouptitle"><big><h2>Group #3</h2></div>
  263. <div id="grouplinks">
  264. <a href="/tagged/">link 1</a>
  265.  
  266. <a href="/tagged/">link 2</a>
  267.  
  268. <a href="/tagged/">link 3</a>
  269.  
  270. <a href="/tagged/">link 4</a>
  271.  
  272. </div></td>
  273.  
  274. <tr>
  275.  
  276. <td><div id="grouptitle"><big><h2>Group #4</h2></div>
  277. <div id="grouplinks">
  278. <a href="/tagged/">link 1</a>
  279.  
  280. <a href="/tagged/">link 2</a>
  281.  
  282. <a href="/tagged/">link 3</a>
  283.  
  284. <a href="/tagged/">link 4</a>
  285. </div></td>
  286.  
  287. <td><div id="grouptitle"><big><h2>Group #5<h2></div>
  288. <div id="grouplinks">
  289. <a href="/tagged/">link 1</a>
  290.  
  291. <a href="/tagged/">link 2</a>
  292.  
  293. <a href="/tagged/">link 3</a>
  294.  
  295. <a href="/tagged/">link 4</a>
  296.  
  297. </div></td>
  298.  
  299. <td><div id="grouptitle"><big><h2>Group #6</h2></div>
  300. <div id="grouplinks">
  301. <a href="/tagged/">link 1</a>
  302.  
  303. <a href="/tagged/">link 2</a>
  304.  
  305. <a href="/tagged/">link 3</a>
  306.  
  307. <a href="/tagged/">link 4</a>
  308.  
  309. </div></td>
  310.  
  311. <tr>
  312.  
  313. <td><div id="grouptitle"><big><h2>Group #7</h2></div>
  314. <div id="grouplinks">
  315. <a href="/tagged/">link 1</a>
  316.  
  317. <a href="/tagged/">link 2</a>
  318.  
  319. <a href="/tagged/">link 3</a>
  320.  
  321. <a href="/tagged/">link 4</a>
  322. </div></td>
  323.  
  324. <td><div id="grouptitle"><big><h2>Group #8<h2></div>
  325. <div id="grouplinks">
  326. <a href="/tagged/">link 1</a>
  327.  
  328. <a href="/tagged/">link 2</a>
  329.  
  330. <a href="/tagged/">link 3</a>
  331.  
  332. <a href="/tagged/">link 4</a>
  333.  
  334. </div></td>
  335.  
  336. <td><div id="grouptitle"><big><h2>Group #9</h2></div>
  337. <div id="grouplinks">
  338. <a href="/tagged/">link 1</a>
  339.  
  340. <a href="/tagged/">link 2</a>
  341.  
  342. <a href="/tagged/">link 3</a>
  343.  
  344. <a href="/tagged/">link 4</a>
  345.  
  346. </div></td>
  347.  
  348. </table>
  349.  
  350. </div>
  351. </body>
  352. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement