Advertisement
sofiiayala

Navi #1 Green

Feb 3rd, 2014
342
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.94 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. <!--- Navi #01 Green by Sofi (doctorwatsn.tumblr.com) - DON'T STEAL IT, REMOVE THE CODE OR CLAIM AS YOUR OWN, IT'S ILEGAL ---->
  6.  
  7. <head>
  8.  
  9. <title>{Title}</title>
  10.  
  11. <link rel="shortcut icon" href="{Favicon}" />
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  13.  
  14. <script type="text/javascript">
  15. WebFontConfig = {
  16. google: { families: [ 'Quicksand:300,400:latin' ] }
  17. };
  18. (function() {
  19. var wf = document.createElement('script');
  20. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  21. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  22. wf.type = 'text/javascript';
  23. wf.async = 'true';
  24. var s = document.getElementsByTagName('script')[0];
  25. s.parentNode.insertBefore(wf, s);
  26. })(); </script>
  27.  
  28. <style type="text/css">
  29.  
  30. ::-webkit-scrollbar {width: 4px; height: 4px; background: #f0f0f0; }
  31. ::-webkit-scrollbar-thumb { background-color: #999999; -webkit-border-radius: 0ex; }
  32.  
  33. body {
  34. font-style:none;
  35. background-color:{color:bg};
  36. font-family:calibri;
  37. color:{color:text};
  38. font-size:9px;
  39. }
  40.  
  41.  
  42. a {
  43. color:{color:link};
  44. text-decoration:none;
  45. -webkit-transition: all 0.5s ease-out;
  46. -moz-transition: all 0.5s ease-out;
  47. transition: all 0.5s ease-out;
  48. }
  49.  
  50. a:hover {
  51. color:{color:hover};
  52. text-decoration:none;
  53. -webkit-transition: all 0.8s ease-out;
  54. -moz-transition: all 0.8s ease-out;
  55. transition: all 0.8s ease-out;
  56. }
  57.  
  58. img {
  59. border:none;
  60. }
  61.  
  62. blockquote {
  63. padding-left:5px;
  64. border-left:2px solid {color:border};
  65. }
  66.  
  67. h1 {
  68. font-size:10px;
  69. }
  70.  
  71.  
  72. *, body {cursor: url("http://www.totallylayouts.com/cursors/random/tiny_cursor.png"), auto }
  73.  
  74. #con {
  75. width:850px;
  76. margin: 0 auto -12px auto;
  77. text-align: center;
  78. margin-top:100px;
  79. }
  80.  
  81. #title {
  82. font-family: "Quicksand", sans-serif;
  83. font-size:70px;
  84. margin-top:-67px;
  85. color:#bbb8b8;
  86. font-weight: 300;
  87. }
  88.  
  89. #links {
  90. font-family:garamond;
  91. text-transform:uppercase;
  92. text-align:center;
  93. margin-top:20px;
  94. word-spacing: 5px;
  95. }
  96.  
  97. #links a {
  98. padding:3px;
  99. font-size:10px;
  100. color:#bbb8b8 ;
  101. letter-spacing: 1.5px;
  102. -webkit-transition: all 0.4s ease-in-out;
  103. -moz-transition: all 0.4s ease-in-out;
  104. -o-transition: all 0.4s ease-in-out;
  105. -ms-transition: all 0.4s ease-in-out;
  106. transition: all 0.4s ease-in-out;
  107. }
  108.  
  109. #links a:hover {
  110. color:#fff;
  111. background-color:#62aa7d;
  112. }
  113.  
  114. #headers {
  115. padding:5px;
  116. text-align:center;
  117. font-weight: 400;
  118. font-family:'quicksand', sans-serif;
  119. color:#62aa7d;
  120. font-size:17px;
  121. width:170px;
  122. margin-left:50px;
  123. margin-right:50px;
  124. margin-top:40px;
  125. background-color:#f4f4f4;
  126. -webkit-transition: all 0.4s ease-in-out;
  127. -moz-transition: all 0.4s ease-in-out;
  128. -o-transition: all 0.4s ease-in-out;
  129. -ms-transition: all 0.4s ease-in-out;
  130. transition: all 0.4s ease-in-out;
  131. }
  132.  
  133. #headers a {
  134. color: #62aa7d;
  135. -webkit-transition: all 0.4s ease-in-out;
  136. -moz-transition: all 0.4s ease-in-out;
  137. -o-transition: all 0.4s ease-in-out;
  138. -ms-transition: all 0.4s ease-in-out;
  139. transition: all 0.4s ease-in-out;
  140. }
  141.  
  142. #tags {
  143. width:170px;
  144. margin-top:0px;
  145. padding:4px;
  146. margin-left:50px;
  147. margin-right:50px;
  148. background-color:#fff;
  149. }
  150.  
  151. #tags a {
  152. font-family:garamond;
  153. display:block;
  154. color:#bbb8b8;
  155. font-size:10px;
  156. padding:6px;
  157. text-align:center;
  158. letter-spacing:1px;
  159. text-transform:uppercase;
  160. margin-bottom:5px;
  161. -webkit-transition: all 0.4s ease-in-out;
  162. -moz-transition: all 0.4s ease-in-out;
  163. -o-transition: all 0.4s ease-in-out;
  164. -ms-transition: all 0.4s ease-in-out;
  165. transition: all 0.4s ease-in-out;
  166. }
  167.  
  168. #tags a:hover {
  169. background:#62aa7d;
  170. color:#fff;
  171. }
  172.  
  173. ::selection {
  174. background: #ffb7b7;
  175. }
  176. ::-moz-selection {
  177. background: #ffb7b7;
  178. }
  179. p.red::selection {
  180. background: #ffb7b7;
  181. }
  182. p.red::-moz-selection {
  183. background: #ffb7b7;
  184. }
  185. p.blue::selection {
  186. background: #a8d1ff;
  187. }
  188. p.blue::-moz-selection {
  189. background: #a8d1ff;
  190. }
  191. p.yellow::selection {
  192. background: #fff2a8;
  193. }
  194. p.yellow::-moz-selection {
  195. background: #fff2a8;
  196. }
  197.  
  198. #credit {
  199. font-size:8px;
  200. font-family:georgia;
  201. letter-spacing:2px;
  202. -moz-transition-duration:0.5s;
  203. -webkit-transition-duration:0.5s;
  204. -o-transition-duration:0.5s;
  205. }
  206.  
  207. #credit a {
  208. background-color:#fff;
  209. padding:5px;
  210. border:1px solid #e9e9e9;
  211. position:fixed;
  212. right:15px;
  213. bottom:10px;
  214. color: #62aa7d;
  215. }
  216.  
  217. {CustomCSS}
  218.  
  219. </style></head><body>
  220.  
  221. <div id="con">
  222.  
  223. <div id="title">Navigation</div>
  224.  
  225. <div id="links">
  226. <a href="/">HOME</a>
  227. <a href="/ask">ASK</a>
  228. <a href="http://tumblr.com">DASH</a>
  229. </div>
  230.  
  231. <table>
  232.  
  233. <td><div id="headers"><big>HERE GOES TITLE</div>
  234. <div id="tags">
  235. <a href="/">Link 1</a>
  236.  
  237. <a href="/">Link 2</a>
  238.  
  239. <a href="/">Link 3</a>
  240.  
  241. <a href="/">Link 4</a>
  242.  
  243. <a href="/">Link 5</a>
  244.  
  245. <a href="/">Link 6</a>
  246.  
  247. <a href="/">Link 7</a>
  248.  
  249. <a href="/">Link 8</a>
  250.  
  251. </div></td>
  252.  
  253.  
  254. <td><div id="headers"><big>HERE GOES TITLE</div>
  255. <div id="tags">
  256. <a href="/">Link 1</a>
  257.  
  258. <a href="/">Link 2</a>
  259.  
  260. <a href="/">Link 3</a>
  261.  
  262. <a href="/">Link 4</a>
  263.  
  264. <a href="/">Link 5</a>
  265.  
  266. <a href="/">Link 6</a>
  267.  
  268. <a href="/">Link 7</a>
  269.  
  270. <a href="/">Link 8</a>
  271.  
  272. </div></td>
  273.  
  274. <td><div id="headers"><big>HERE GOES TITLE</div>
  275. <div id="tags">
  276. <a href="/">Link 1</a>
  277.  
  278. <a href="/">Link 2</a>
  279.  
  280. <a href="/">Link 3</a>
  281.  
  282. <a href="/">Link 4</a>
  283.  
  284. <a href="/">Link 5</a>
  285.  
  286. <a href="/">Link 6</a>
  287.  
  288. <a href="/">Link 7</a>
  289.  
  290. <a href="/">Link 8</a>
  291.  
  292. </div></td>
  293.  
  294. <tr>
  295.  
  296. <td><div id="headers"><big>HERE GOES TITLE</div>
  297. <div id="tags">
  298. <a href="/">Link 1</a>
  299.  
  300. <a href="/">Link 2</a>
  301.  
  302. <a href="/">Link 3</a>
  303.  
  304. <a href="/">Link 4</a>
  305.  
  306. <a href="/">Link 5</a>
  307.  
  308. <a href="/">Link 6</a>
  309.  
  310. <a href="/">Link 7</a>
  311.  
  312. <a href="/">Link 8</a>
  313.  
  314. </div></td>
  315.  
  316. <td><div id="headers"><big>HERE GOES TITLE</div>
  317. <div id="tags">
  318. <a href="/">Link 1</a>
  319.  
  320. <a href="/">Link 2</a>
  321.  
  322. <a href="/">Link 3</a>
  323.  
  324. <a href="/">Link 4</a>
  325.  
  326. <a href="/">Link 5</a>
  327.  
  328. <a href="/">Link 6</a>
  329.  
  330. <a href="/">Link 7</a>
  331.  
  332. <a href="/">Link 8</a>
  333.  
  334. </div></td>
  335.  
  336. <td><div id="headers"><big>HERE GOES TITLE</div>
  337. <div id="tags">
  338. <a href="/">Link 1</a>
  339.  
  340. <a href="/">Link 2</a>
  341.  
  342. <a href="/">Link 3</a>
  343.  
  344. <a href="/">Link 4</a>
  345.  
  346. <a href="/">Link 5</a>
  347.  
  348. <a href="/">Link 6</a>
  349.  
  350. <a href="/">Link 7</a>
  351.  
  352. <a href="/">Link 8</a>
  353.  
  354. </div></td>
  355.  
  356. </table>
  357.  
  358. </div>
  359.  
  360. <div id="credit"><a href="http://www.doctorwatsn.tumblr.com">221b</div>
  361. </body>
  362. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement