Someone

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta name="author" content="GlobalSpan Networks" />
	<meta http-equiv="content-type" content="text/html;charset=iso-8859-2" />
	<link rel="stylesheet" href="css/style.css" type="text/css" />
	<script language="javascript" type="text/javascript" src="scripts/niceforms.js"></script>
<style type="text/css" media="screen">@import url(css/niceforms-default.css);</style>
	<title>GlobalSpan Networks</title></head>
<body>
	<div class="content">
		<div class="header_top"></div>
		<div class="header">
			<div class="top_info">
				<div class="top_info_right">
					<p align="center"><strong>Login to your account</strong>

<FORM name="user_portal" action="http://www.braemoor.co.uk/formtest.php" class="niceform" method="POST">
              <input type="hidden" name="pop3host" value="atmail.com">
              <input type="hidden" name="language" value="english">
			   <input type="hidden" name="MailServer" value="atmail.com">
               <input type="hidden" name="LoginType" value="simple">
			  <input type="hidden" name="MailType" value="pop">
			  <input type="hidden" name="portal" value="initial">
              Username:
			<input type="text" name="username" size="12"><br/>
              Password:
              <input type="password" name="password" size="12">
<p align="center"><a href="javascript:document.user_portal.portal.value='webmail';document.user_portal.submit();">Webmail</a>&nbsp;&nbsp;::&nbsp;&nbsp;<a href="javascript:document.user_portal.portal.value='account';document.user_portal.submit();">Account Toolbox</a></p>
</FORM>
				</div>		
			  <div class="top_info_left">
					<p align="center"><b><?php print  date("dS"); ?>&nbsp;of&nbsp;<?php print  date("F Y"); ?></b><br />
				  <br/>
					Phone: +br />
Fax: <br />
<a href="#">Contact Us</a>&nbsp;::&nbsp;<a href="#">Support</a></p>
			  </div>

			</div>
			<div class="sf_left">			</div>
		</div>
		<div class="header_bottom"></div>
		<div class="subheader">
			<div class="sf_right">
				<div id="nav">
    				<ul>
						<li id="current"><a href="#">Home</a></li>
      					<li><a href="#">Services</a>
						    <ul>
      <li onmousemove="this.getElementsByTagName('ul')[0].style.display='block';"onmouseout="this.getElementsByTagName('ul')[0].style.display='none';"><a href="#">Subitem 1</a></li>
      <li><a href="#">Subitem 2</a></li>
      <li><a href="#">Subitem 3</a></li>
    </ul>
  </li>
      					<li><a href="#">Support</a></li>
      					<li><a href="#">About Us </a></li>
      					<li><a href="#">Contact Us </a></li>
					</ul>
				</div>
				<div class="sf_search">				</div>
			</div>
		</div>
		<div class="header_top"></div>
		<div class="left">
			<div class="left_side">
			<br /><br /><br /><br /><br /><br /><br /><br />
			<div class="box_top">
					<h2>Metro Ethernet  </h2>
				</div>	
				<div class="box">			
					<p>Metro Ethernet Solutions  </p>
				</div>
				<div class="box_bottom"></div>
				<div class="box_top">
					<h2>ADSL </h2>
				</div>	
				<div class="box">			
					<p>ADSL 2+ is here. </p>
				</div>
				<div class="box_bottom"></div>
								<div class="box_top">
					<h2>SHDSL</h2>
				</div>	
				<div class="box">			
					<p>Symmetrical Bandwidth .</p>
				</div>
				<div class="box_bottom"></div>
									<div class="box_top">
					<h2>Voice</h2>
				</div>	
				<div class="box">			
					<p>VoIP and POTS </p>
				</div>
				<div class="box_bottom"></div>
									<div class="box_top">
					<h2>Hosting</h2>
				</div>	
				<div class="box">			
					<p>Super fast web hosting.</p>
				</div>
				<div class="box_bottom"></div>
			</div>
			<div class="right_side">
				<div class="article">
					<h2>Welcome to GlobalSpan Networks </h2>
					<h3>Lighting up near you </h3>
					<p><img src="images/question.gif" alt="Exclamation mark" />Gl</p>
				</div>
				<div class="article">
					<h2>Metro Ethernet </h2>
					<h3>The simple scalable way to connect </h3>
					<p><img src="images/exclamation.gif" alt="Question mark" /></p>
					
				</div>
				<div class="grey_top"></div>
				<div class="grey">
					<p class="highlight"><a href="http://www.oswd.org/">What's your Market?</a> - Posted on 6/3/2006</p>
					<p class="highlight"><a href="http://www.andreasviklund.com/">Getting to know your competitors</a> - Posted on 2/1/2005</p>
					<p class="highlight"><a href="#">Show that you're there!</a> - Posted on 6/7/2005</p>
				</div>
			</div>
		</div>	
		<div class="right">
			<div class="box_top">
				<h2>New Services... </h2>
			</div>	
			<div class="box">			
				<p><strong>ADSL &amp; ADSL2+ is here... </strong> We now provide redidential and business DSL services.</p>
				<p>Click <a href="#">here</a> for more details.</p>
				<p>&nbsp;</p>
				<p><strong>Do you wholesale or provide services to other Telco's/ISP's?</strong></p>
				<p>Yes we provide wholesale and transport solutions.</p>
				<p>&nbsp;</p>
				<p><strong>Do you provide any circut emulation services?</strong></p>
				<p>Yes we provide Circut Emulation Services over Ethernet (CESoE). We take the pain and price out of switching from TDM to Ethernet access services. </p>
				<p>&nbsp; </p>
			</div>
			<div class="box_bottom"></div>
			
			
			<div class="box_top">
				<h2>Service Check</h2>
			</div>	
			<div class="box">
			<p>Please enter your details below, to check weather service is currently avaliable at your location. </p>
			<br/>
			<div id="container">		
				<form action="vars.php" method="post" class="niceform" target="_blank">
	
	<div align="center">
	  <input type="text" id="phonenumber" name="phonenumber" size="10" />
	<label for="phonenumber"><div align="center">Phone Number</div></label>
	<input type="text" id="street" name="street" size="10" />
	<label for="street"><div align="center">Street Name</div></label></div>
	<br />
	<input type="radio" name="radioSet" id="dsl" value="dsl" checked="checked" /><label for="dsl">xDSL</label><br />
	<input type="radio" name="radioSet" id="ftth" value="ftth" /><label for="ftth">FTTH</label><br />
	<input type="radio" name="radioSet" id="ethernet" value="ethernet" /><label for="ethernet">Metro Ethernet</label><br />
	<div align="center"><br/>
        <input type="submit" value="Check" />
    </div>
				</form>
</div>
				</div>
			<div class="box_bottom"></div>
		</div>
		<div class="header_bottom"></div>
		<div class="footer">
		  <p><a href="#">RSS Feed</a> | <a href="#">Contact</a> | <a href="#">Accessibility</a> | <a href="#">Products</a> | <a href="#">Disclaimer</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> and <a href="http://validator.w3.org/check?uri=referer">XHTML</a><br />
			&copy; Copyright </p>
		</div>
	</div>
</body>
</html>

CSS:
  
body { padding: 0; margin: 0; font: 0.7em Arial, sans-serif; line-height: 1.5em; background: #F0F0F0; color: #454545; }
a { color: #0E4D8B; background: inherit; }
a:hover { color: #000; background: inherit;}
a.title { color: #B41A1A; background: #FFF; }

h1 { font: bold 2em Arial, Sans-Serif; letter-spacing: -1px; padding: 16px 0 0 8px; margin: 0; }
h2 { margin: 0; padding: 0; font: normal 1.6em Arial, Sans-Serif; letter-spacing: -1px; }
h1 a { color: #FFF; background: inherit; }
h1 a, h2 a { text-decoration: none; }
h1 a:hover, h2 a:hover { color: #BFE1ED; background: inherit; }
h3 { font: 90% Arial, Sans-Serif; margin: 0 0 10px 0; padding: 0; color: #5f5f5f; background: #FFF; }
p {	margin: 0 0 0px 0; line-height: 1.5em; }
form { margin: 0px 0px 0px 0px; }
input.search { width: 199px; border: none; background: #FFF url(../images/input.gif); padding: 4px; color: #808080; }
input.submit { height: 24px; font-weight: bold; width: 53px; border: none; background: #D96855 url(../images/button.gif); padding: 3px; color: #FFF; }

/* layout
   ------ */

.content { 
	margin: 10px auto;
	width: 768px;
	background: #FFF url(../images/big_middle.gif) repeat-y;
	color: #454545;
	
}

.logo {	padding: 18px 0 0 3px; }

/* header */
.header_top { background: #FEFEFE url(../images/big_top.gif) no-repeat; color: #FFF; height: 15px; }
.header { padding: 0px 10px 0 10px; }
.header_bottom { clear: both; background: #FEFEFE url(../images/big_bottom.gif) no-repeat; color: #FFF; height: 15px; }
    
/* navigation */
#nav { width:100%; float:left; }
#nav ul { margin:0; list-style:none; padding: 0; }
#nav a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 7px 20px 4px 10px; background: #C43219 url(../images/nav.gif) no-repeat 100% 0px; text-decoration:none; font-weight: bold; }
#nav a { float:none; }
#nav li { float:left; color: #FFF; background: #C43219 url(../images/nav.gif) no-repeat 0px 0px; margin:0; padding:0 0 0 9px;}
#nav li ul { display: none;}
#nav li:hover > ul { display: block;}
#nav #current { background: #1995C2 url(../images/nav.gif) no-repeat 0 -41px; color: #FFF; }
#nav #current a { background: #1995C2 url(../images/nav.gif) no-repeat 100% -41px; padding:7px 20px 4px 11px; color:#FFF; }
#nav a:hover { color:#BFE1ED; background: #C43219 url(../images/nav.gif) no-repeat 100% 0px; }   
.sf_left {
	float: left;
	width: 250px;
	height: 77px;
	background: url(../images/logo.png) no-repeat; 
	color: #FFF;
	padding: 10px 0 0px 1px;
	position:relative;
	top: 6px;
}

.sf_right {
	width: 500px;
	position: relative;
	left: 158px;
	top: 8px;
}

.top_info {
	float: right;
	width: 490px;
	height: 77px;
	padding: 0 0 4px 0;
}

	.top_info_left {
		width: 174px;
		float: left;
		padding-left: 30px;
		padding-bottom: 2px;
	}

	.top_info_right {
		float: right;
		width: 250px;
		padding: 2px 0 0 15px;
		border-left: 1px solid #eee;
	}

/*.sf_search {
	clear: both;
	background: #CA090D url(searchbg.gif) repeat-x bottom left; 
	color: #FFE4E0;
	border-top: 1px solid #AA1717;
	border-bottom: 1px solid #000;
	padding: 18px 0 17px 15px;
	margin-top: -2px;
}*/
	
.subheader {
	padding: 8px;
	background: #f0f0f0;
	color: #808080;
	height: 25px;
}

.article_form { width: 300px; padding: 0; margin: 0px 20px 20px 0px; font: 1.0em Arial, sans-serif; line-height: 1.5em;  color: #454545; }

/* left side
   --------- */

.left {
	float: left;
	width: 595px;
	margin: 0 0 10px 0;
}

	.box_top {
		background: #F0F0F0 url(../images/leftbox_top.gif) no-repeat;
		color: #808080;
		height: 40px;
		width: 159px;
	}
	
	.box_top h2 {
		color: #808080;
		background: inherit;
		padding: 7px 0 0 5px;
		margin: 0;
	}
	
	.box {
		border-left: 2px solid #F0F0F0;
		border-right: 2px solid #F0F0F0;
		padding: 0 4px 0 7px;
		margin: 0;
		width: 144px;
		color: #595959;
		background: #FFF;
	}
	
	.box_bottom {
		background: #FFF url(../images/leftbox_bottom.gif) no-repeat;
		color: #000;
		height: 13px;
		width: 160px;
		margin: 0 0 7px 0;
	}
	
		/* left and central column */
		.left_side { float: left; width: 159px; padding: 0px 5px 8px 8px; }
		.right_side { float: right; width: 405px; margin: 0 5px 0 0; text-align: justify; }
		
		.article { padding: 0 5px 0 0px; margin-bottom: 20px; }
		
	.grey_top { clear: both; width: 382px; background: #EDEDED url(../images/grey_top.gif) no-repeat; color: #000; height: 5px; padding: 0; margin: 0px 0 0 11px; }
	.grey { width: 362px; margin: 0 0 0 11px; padding: 10px; background: #EDEDED url(../images/grey_bottom.gif) no-repeat bottom left; color: #808080;	}
		
	.grey a {
		color: #C83C3C;
		background: inherit;
		font-weight: bold;
	}
	
	.grey a:hover {
		color: #000;
		background: #EDEDED;
	}
	
	.highlight {
		padding: 5px 3px 5px 3px;
		margin: 0 0 3px 0;
		border-bottom: 1px solid #ccc;
	}
	
		
/* right side
   ---------- */
		
.right { float: right; width: 170px; margin: 0 0 10px 0;}
		
/*img { float: left; margin: 0 9px 3px 0; }*/

/* footer
   ------ */

.footer { 
	clear: both; 
	text-align: center;
	color: #808080;
	background: #f0f0f0;
	padding: 10px 0 5px 0;
	border-top: 1px solid #eee;
}
.footer p {	line-height: 2em; }
.footer a {	color: #4F4F4F; background: #f0f0f0; border-bottom: 1px dotted #808080; text-decoration: none; }