help me out styling this imageviewer

Help me out styling this html code




Html code..

<div id="rc2">
<img class="line" src="../images/line..gif" alt="line">
<ul id="smallthumbul" >
<li><a href="#"><img src="images/restaurant1.jpg" alt="1"></a></li>
<li><a href="#"><img src="images/restaurant2.jpg" alt="1"></a></li>
<li><a href="#"><img src="images/restaurant3.jpg" alt="1"></a></li>
<li><a href="#"><img src="images/restaurant4.jpg" alt="1"></a></li>
<li><a href="#"><img src="images/restaurant5.jpg" alt="1"></a></li>
</ul><!-- end smallthumbsul -->

<div id="largethumbs"> 
<img src="images/restaurant5.jpg" alt="large">
</div>

Code (markup):

CSS stylesheet which is not correct..

#rc2 {
position:relative;
top:70px;
}
#rc2 .line {
width:100%;
height:3px;

}

#rc2 ul {
list-style-type:none;
margin:0px;
padding:0px;
text-align:center;

}
#rc2 ul li {
width:23px;
height:10px;
float:left;
margin:4px;
}

#largethumbs {

position:relative;
top:200px;
}

Code (markup):