Navi Page #2

<!--
Navi Page #2 by kalopsiathemes
Please do not
          -remove the credit
          -steal parts of code
          -use as a base

   Feel free to
         -edit parts of the page
         -ask me any questions
         -->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link href='http://fonts.googleapis.com/css?family=Lato:400' rel='stylesheet' type='text/css'>
    <title>{Title}</title>
 <link rel="shortcut icon" href="{Favicon}">
 <link rel="alternate" type="application/rss+xml" href="{RSS}">
        <style type="text/css">
body {
	margin:0;
	background-image: url("http://static.tumblr.com/wi2dwmg/ZoMnab9tf/tumblr_my6tu1f2ka1sze1ngo1_1280.png");
/*this is where you put the background picture. Here is a place you can upload it and get a url: https://www.tumblr.com/themes/upload_static_file.The dimensions that work for me are width:500 height:280 or 1000x580. Don't worry if it looks like it doesn't cover the whole page it will on your actual blog. */
	background-size:cover;
	  background-repeat: no-repeat;
	  font-family:Helvetica;
}

table {
	margin:auto;
	margin-top:30px;
	border-spacing:10px;
	width:300px;

}

td {
	width:200px
	height:50px;
	border:1px solid #ffffff;;
}


.bx {
text-align:center;
height: 40px;
overflow: hidden;
transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;}

.bx:hover {height: 90px;
transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;}

.bx:hover .title {
    text-decoration:underline;
}


.substuff {
	font-size:10px;
	visibility:hidden;
}

.bx:hover .substuff{
	visibility:visible;
}

.title {
  	color:#ffffff;
	margin-top:10px;
	font-size:15px;
	text-transform:uppercase;
	font-family:'Lato',sans-serif;
}

.substuff {
    	color:#ffffff;
	font-size:11px;
	margin-top:5px;
	padding:5px;
	letter-spacing:.5px;
}

#nav {
    text-transform:lowercase;
    color:#ffffff;
	font-size:12px;
	margin:auto;
	margin-top:55px;
	width:420px;
	letter-spacing:2px;
	text-align:center;
}

a:link, a:visited {
	text-decoration:none;
	color:#ffffff;
}

a:hover {
	text-decoration:underline;
		color:#ffffff;
}

#container {
	width:600px;
	height:500px;
	margin-top:50px;
	margin-left:25%;
	position:absolute;
	color:#ffffff;
}

#conback {
	position:absolute;
	width:600px;
	height:450px;
	margin-top:50px;
	margin-left:25%;
	background-color:#262626;
	opacity:.8;
}
#credit {
position:fixed;
color:{color:text};
bottom:5px;
right:10px;
padding:4px;
font-size:12px;
}

#credit a {
    text-decoration:none;
}


</style>
<body>

<div id="conback"></div>
<div id="container">
<div id="nav">
	<a href="/">Home</a>&nbsp;&#9679;
	<a href="/ask">Ask</a>&nbsp;&#9679;
	<a href="/archive">Archive</a>
</div>


 <table>
	   <tr>
	       	<td>
 	<div class="bx">
 		<div class="title">Title</div>
<div class="substuff">
<a href="Link">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>
</div></div>
	   </td>
	   </tr>
	   <tr>
	       	<td>
 	<div class="bx">
 		<div class="title">Title</div>
<div class="substuff">
<a href="Link">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>
</div></div>
	   </td>
	   </tr>
	   <tr>
	       	<td>
 	<div class="bx">
 		<div class="title">Title</div>
<div class="substuff">
<a href="Link">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>
</div></div>
	   </td>
	   </tr>
	   <tr>
	       	<td>
 	<div class="bx">
 		<div class="title">Title</div>
<div class="substuff">
<a href="Link">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>
</div></div>
	   </td>
	   </tr>
	   <tr>
	       	<td>
 	<div class="bx">
 		<div class="title">Title</div>
<div class="substuff">
<a href="Link">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>,
<a href="">Link</a>
</div></div>
	   </td>
	   </tr>


 </table>
</div>
 <div id="credit">
    <a href="http://kalopsiathemes.tumblr.com" title="kalopsiathemes"</div>&#916;</a></div>
</div>
</body>
</html>