I've designed a template for my online portfolio and now I'm attempting to code it using HTML and CSS. I'm a bit stuck now and I wondered if anyone could help me please.
I have a few hyperlinks in my navigator bar, but underneath "PORTFOLIO" I want several more hyperlinks but I need these new links to be a different size font, and I need to move the hyperlinks several spaces to the left without moving the "box" that they are in. I hope that makes sense.
This is my navigator bar so far, and the HTML and CSS code.

CODE
<ul>
<li><a href="index.htm">Home</a></li>
<li><a href="portfolio.htm">Portfolio</a></li>
<li><a href="about.htm">About</a></li>
<li><a href="contact.htm">Contact</a></li>
</ul>
<li><a href="index.htm">Home</a></li>
<li><a href="portfolio.htm">Portfolio</a></li>
<li><a href="about.htm">About</a></li>
<li><a href="contact.htm">Contact</a></li>
</ul>
CODE
ul
{
list-style-type:none;
margin-top:338px;
margin-bottom:0px;
margin-right:0px;
margin-left:651px;
padding:0;
}
a:link,a:visited
{
display:block;
font-family: “Trebuchet MS”, sans-serif;
font-size: 14px;
font-weight:bold;
color:#08355c;
line-height: 2.2em;
background-color:#ffffff;
width:130px;
text-align:left;
padding:0px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#ffffff;
}
{
list-style-type:none;
margin-top:338px;
margin-bottom:0px;
margin-right:0px;
margin-left:651px;
padding:0;
}
a:link,a:visited
{
display:block;
font-family: “Trebuchet MS”, sans-serif;
font-size: 14px;
font-weight:bold;
color:#08355c;
line-height: 2.2em;
background-color:#ffffff;
width:130px;
text-align:left;
padding:0px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color:#ffffff;
}


Answers