Advertisement
deanandhispie

Theme #3 Tags/Navigation

Sep 8th, 2013
1,363
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.54 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. <!-- Theme #3 Tag/Navigation Page by Kaylie (@deanandhispie)
  4.  
  5. PLEASE abide by the following rules if you're going to use this theme:
  6.    
  7.    1. DO NOT STEAL any parts of the theme. I will recognize my own work when I see it. Also, editing and redistributing with my name attached counts as stealing.
  8.    2. KEEP MY CREDITS intact and where they are.
  9.    3. DO NOT USE THIS THEME AS A BASE CODE!
  10.    
  11.    Thanks and enjoy the theme!-->
  12.  
  13. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  14.  
  15.  
  16. <head>
  17.  
  18. <title>{Title}</title>
  19. <link href='http://fonts.googleapis.com/css?family=Rouge+Script' rel='stylesheet' type='text/css'>
  20. {block:Description}<meta name="description" content="{MetaDescription}"/>
  21. {/block:Description}
  22. <link rel="shortcut icon" href="{Favicon}" />
  23. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  24.  
  25.     <style type="text/css">
  26.    
  27.    
  28.    /*--scrollbar--*/
  29.    
  30. ::-webkit-scrollbar {background-color:#ccc; height:8px; width:3px}
  31. ::-webkit-scrollbar-thumb:vertical {border:1px solid #aaa; background-color:#888; height:50px; width:5px;}
  32. ::-webkit-scrollbar-thumb:horizontal {border:1px solid #aaa; background-color:#888; height:8px width:5px;!important}
  33.  
  34. @font-face {
  35. font-family:paintbrush;
  36. src: url('http://static.tumblr.com/ejm8w78/YOjmd9lbv/basicl.ttf');,
  37. }
  38.  
  39.   /*--body--*/
  40.  
  41.    
  42.     body {
  43.     font-style:none;
  44.     background-color:{color:bg};
  45.     font-family:cambria;
  46.     color:{color:text};
  47.     font-size:9px;
  48.     }
  49.    
  50.    
  51.     a {
  52.     color:{color:link};
  53.     text-decoration:none;
  54.     -webkit-transition: all 0.5s ease-out;
  55.     -moz-transition: all 0.5s ease-out;
  56.     transition: all 0.5s ease-out;
  57.     }
  58.    
  59.     a:hover {
  60.     color:{color:hover};
  61.     text-decoration:none;
  62.     -webkit-transition: all 0.8s ease-out;
  63.     -moz-transition: all 0.8s ease-out;
  64.     transition: all 0.8s ease-out;
  65.     }
  66.    
  67.     img {
  68.     border:none;
  69.     }
  70.    
  71.     blockquote {
  72.     padding-left:5px;
  73.     border-left:2px solid {color:border};
  74.     }
  75.    
  76.     h1 {
  77.     font-size:10px;
  78.     }
  79.    
  80.    /*--Cursor code--*/
  81.    
  82.    
  83.    *, body, a, a:hover {cursor: url("http://www.totallylayouts.com/cursors/random/tiny_cursor.png"), auto }
  84.    
  85.     /*everything*/
  86.    
  87.     #everything {
  88.     margin-left:250px;
  89.     margin-top:100px;
  90.     }
  91.    
  92.     /*--title--*/
  93.    
  94.     #title {
  95.     font-family:Rouge Script;
  96.     font-size:80px;
  97.     margin-top:-67px;
  98.     margin-left:290px;
  99.     color:#bbbaba;
  100.     }
  101.    
  102.     /*--links--*/
  103.    
  104.     #links {
  105.     width:150px;
  106.     font-family:'cambria';
  107.     text-transform:uppercase;
  108.     text-align:center;
  109.     margin-top:20px;
  110.     margin-left:334px;
  111.     }
  112.    
  113.     #links a {
  114.     padding:3px;
  115.     font-size:10px;
  116.     color:#bbb8b8;
  117.     -webkit-transition: all 0.4s ease-in-out;
  118.     -moz-transition: all 0.4s ease-in-out;
  119.     -o-transition: all 0.4s ease-in-out;
  120.     -ms-transition: all 0.4s ease-in-out;
  121.     transition: all 0.4s ease-in-out;
  122.     }
  123.    
  124.     #links a:hover {
  125.     color:#fff;
  126.     background-color:#bbb8b8;
  127.     }
  128.  
  129.    
  130.    
  131.     #grouptitle {
  132.     padding:5px;
  133.     text-align:center;
  134.     font-family:'Paintbrush';
  135.     color:#bbbaba;
  136.     font-size:17px;
  137.     width:118px;
  138.     margin-left:105px;
  139.     margin-top:80px;
  140.     border-bottom:2px dashed #eaeaea;
  141.    }
  142.  
  143.    
  144.     #grouplinks {
  145.     width:120px;
  146.     margin-top:0px;
  147.     padding:4px;
  148.     margin-left:105px;
  149.      }
  150.  
  151.  
  152.     #grouplinks a {
  153.     font-family:'Calibri';
  154.     display:block;
  155.     color:#bbb8b8;
  156.     font-size:10px;
  157.     padding:6px;
  158.     text-align:center;
  159.     letter-spacing:1px;
  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.     #grouplinks a:hover {
  169.     background:#bbb8b8;
  170.     color:#fff;
  171.     letter-spacing:3px
  172.     }
  173.        
  174.  
  175.     #credit {
  176.     position:fixed;
  177.     right:10px;
  178.     bottom:-15px;
  179.     text-align:center;
  180. }
  181.  
  182.     #credit a {
  183.     padding:3px;
  184.     color:{color:link};
  185.     background-color:{color:background};
  186.     -moz-transition-duration:0.5s;
  187.     -webkit-transition-duration:0.5s;
  188.     -o-transition-duration:0.5s;
  189.     }
  190.    
  191.     {CustomCSS}
  192.        
  193.     </style></head>
  194.    
  195.    
  196. <body>
  197.  
  198. <div id="everything">
  199.  
  200. <div id="title">Navigation</div>
  201.  
  202. <div id="links">
  203. <a href="/">HOME</a>
  204. <a href="/ask">ASK</a>
  205. <a href="http://lestrade.tk/">CREDIT</a>
  206. </div>
  207.  
  208. <table id="all" border="0" cellpadding="0" cellspacing="0">
  209.  
  210.  
  211. <td><div id="grouptitle"><big>Group One</div>
  212. <div id="grouplinks">
  213. <a href="/tagged/">link 1</a>
  214.  
  215. <a href="/tagged/">link 2</a>
  216.  
  217. <a href="/tagged/">link 3</a>
  218.  
  219. <a href="/tagged/">link 4</a>
  220.  
  221. <a href="/tagged/">link 5</a>
  222.  
  223. <a href="/tagged/">link 6</a>
  224.  
  225. </div></td>
  226.  
  227.  
  228. <td><div id="grouptitle"><big>Group Two</div>
  229. <div id="grouplinks">
  230. <a href="/tagged/">link 1</a>
  231.  
  232. <a href="/tagged/">link 2</a>
  233.  
  234. <a href="/tagged/">link 3</a>
  235.  
  236. <a href="/tagged/">link 4</a>
  237.  
  238. <a href="/tagged/">link 5</a>
  239.  
  240. <a href="/tagged/">link 6</a>
  241.  
  242. </div></td>
  243.  
  244. <td><div id="grouptitle"><big>Group Three</div>
  245. <div id="grouplinks">
  246. <a href="/tagged/">link 1</a>
  247.  
  248. <a href="/tagged/">link 2</a>
  249.  
  250. <a href="/tagged/">link 3</a>
  251.  
  252. <a href="/tagged/">link 4</a>
  253.  
  254. <a href="/tagged/">link 5</a>
  255.  
  256. <a href="/tagged/">link 6</a>
  257.  
  258. </div></td>
  259.  
  260. <tr>
  261.  
  262. <td><div id="grouptitle"><big>Group Four</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. <a href="/tagged/">link 5</a>
  273.  
  274. <a href="/tagged/">link 6</a>
  275.  
  276. </div></td>
  277.  
  278. <td><div id="grouptitle"><big>Group Five</div>
  279. <div id="grouplinks">
  280. <a href="/tagged/">link 1</a>
  281.  
  282. <a href="/tagged/">link 2</a>
  283.  
  284. <a href="/tagged/">link 3</a>
  285.  
  286. <a href="/tagged/">link 4</a>
  287.  
  288. <a href="/tagged/">link 5</a>
  289.  
  290. <a href="/tagged/">link 6</a>
  291.  
  292. </div></td>
  293.  
  294. <td><div id="grouptitle"><big>Group Six</div>
  295. <div id="grouplinks">
  296. <a href="/tagged/">link 1</a>
  297.  
  298. <a href="/tagged/">link 2</a>
  299.  
  300. <a href="/tagged/">link 3</a>
  301.  
  302. <a href="/tagged/">link 4</a>
  303.  
  304. <a href="/tagged/">link 5</a>
  305.  
  306. <a href="/tagged/">link 6</a>
  307.  
  308. </div></td>
  309.  
  310.  
  311. </table>
  312. <p></p>
  313.  <div id="credit"><p title="credit"><a href="http://deanandhispie.tumblr.com"><img src="http://i40.tinypic.com/3028ld2.png"></a></div>
  314. </div>
  315. </body>
  316. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement