Blogger like search box

I copied the Blogger search box and added the following features:

• It shows the current search keywords after you invoked the search (by parsing the URL)
• It has a border that becomes gray when mouse is on the box
• It has a faded string when not in focus, and it disappears when in focus

Take a look:
http://ycouriel-archive.blogspot.com/
(It's on the sidebar)

This is actually the first time I'm using HTML, JavaScript and CSS.
So I hope the code won't be that embarrassing:

<div id="b-navbar2">

<form style="display: inline;" method="get" action="http://ycouriel-archive.blogspot.com/search" id="searchthis">

<div id="b-query-box" style="width: 193.7px;" >

<table cellspacing="0" cellpadding="0">

<tbody>

<tr>

<style type="text/css">

#b-navbar2{

white-space:nowrap;color:#fff;height:29px;border-bottom:1px solid #024;background:transparent;font-size:13px;font-family:Arial,Sans-serif

}

#b-navbar2 #b-query-box{

background-color:#fff;margin:0 .5em 0 0;border:1px solid transparent;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;padding:0 .3em

}

#b-navbar2 #b-query-box:hover{

border:1px solid #999999;

}

#b-navbar2 #b-query-icon{

display:block;width:13px;height:13px;cursor:pointer;cursor:hand;background:url(http://img1.blogblog.com/img/navbar/icons_orange.png) no-repeat 0 0

}

#b-navbar2 #b-query-icon:hover{

background:url(http://img1.blogblog.com/img/navbar/icons_orange.png) no-repeat -13px 0

}

#b-navbar2 #b-query{

font-size:13px;color:#000;background-color:transparent;border:none;margin:0

}

</style>

<td valign="middle">

<input type="text" title="Search" style="width: 180px; color: #999999;" tabindex="3" name="q" id="b-query" onblur="if (this.value == '') {this.value = 'Search...'; this.style.color='#999999';}" onfocus="if(this.value == 'Search...') {this.style.color='#000000';this.value = '';}" value="Search...">

</td>

<td valign="right" style="width: 15px;">

<a title="Search this blog" onclick="document.getElementById(&quot;searchthis&quot;).submit();" id="b-query-icon"></a></td></tr></tbody></table></div></form>

<script language="JavaScript">

function gup( name )

{

  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");

  var regexS = "[\\?&]"+name+"=([^&#]*)";

  var regex = new RegExp( regexS );

  var results = regex.exec( window.location.href );

  if( results == null )

    return "";

  else

    return results[1];

}

function decode(encoded) {

    return decodeURIComponent(encoded.replace(/\+/g, " "));

}

var q = gup("q");

if (q != "") {

    var lmnt = document.getElementById("b-query");

    lmnt.value = decode(q);

    lmnt.style.color = "#000000";

}

</script>