إضافة رابط لجزء معين من الصورة

<div id="loginBG">
    <div class="login">
        <div class="vis">
            <form method="post" action="index.php?page=login&login=1">
            <input type="text" id="navbar_username" class="login_input" name="username" value="{$lang['username']}" onfocus="if (this.value == '{$lang['username']}') this.value = '';" size="12"  />
            <input type="password" id="navbar_password" class="login_input" name="password" value="pass" onfocus="if (this.value == 'pass') this.value = '';" size="12"/>
            <input type="submit" class="submit_login" value="{$lang['login']}" />
            <label for="fp1"><input type="checkbox" name="temporary" value="on" id="fp1" />  {$lang['Temp_login']}</label>  
            </form>
            <p class="tasgiil">
            <a href="index.php?page=forget&index=1"> {$lang['Lost_password']}</a> |
            </p>
            <p class="nseet">
            <a href="index.php?page=forget&active_member=1&send_active_code=1">{$lang['send_active_code']} </a>
            </p>
        </div>    
    </div>    
</div>

#loginBG {
    height: 115px;
    position: relative;
}
#loginBG .login {
    height: 70px;
    width: 438px;
    background: url('images/login.png') no-repeat scroll right center transparent;
    top: 15px;
    right: 10px;
    left: auto;
    position: absolute;
}
#loginBG .login .vis {
    position: absolute;
    background: url('images/blue/vis.png') no-repeat scroll 0% 0% transparent;
    width: 352px;
    height: 30px;
    right: 85px;
    left: auto;
    top: 10px;
}
#loginBG .login .vis input[type="text"] {
    border: 0px none;
    position: absolute;
    top: 2px;
    width: 105px;
    height: 25px;
    background: none repeat scroll 0% 0% transparent;
    margin: 0px;
    padding: 0px;
    font-size: 12px;
    font-family: tahoma;
    font-weight: bold;
    direction: rtl;
    color: #A2A2A2;
    border-radius: 2px;
    right: 36px;
}
#loginBG .login .vis input[type="password"] {
    border: 0px none;
    position: absolute;
    top: 2px;
    width: 105px;
    height: 25px;
    background: none repeat scroll 0% 0% transparent;
    margin: 0px;
    padding: 0px;
    font-size: 12px;
    font-family: tahoma;
    font-weight: bold;
    direction: rtl;
    color: #A2A2A2;
    border-radius: 2px;
    right: 185px;
}
#loginBG .login .vis input[type="submit"] {
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    border: 0px none;
    background: none repeat scroll 0% 0% transparent;
    position: absolute;
    top: 1px;
    left: 1px;
    width: 53px;
    height: 29px;
}
#loginBG .login .vis label {
    position: absolute;
    right: -10px;
    top: 53px;
    direction: rtl;
    color: #FFF;
    font-family: GESSTwoMedium-Medium;
    font-size: 10px;
    line-height: 24px;
    width: 130px;
    background: none repeat scroll 0% 0% transparent;
}
#loginBG .login .vis label input[type="checkbox"] {
    float: right;
    margin: 5px;
}
#loginBG .login .vis .tasgiil {
    color: #FFF;
    font-family: GESSTwoMedium-Medium;
    font-size: 12px;
    position: absolute;
    width: 114px;
    height: 12px;
    top: 44px;
    left: 10px;
}
#loginBG .login .vis .nseet {
    color: #FFF;
    font-family: GESSTwoMedium-Medium;
    font-size: 12px;
    position: absolute;
    width: 100px;
    height: 12px;
    top: 44px;
    left: 123px;
}

<div class='search'>
<form name="search" action="index.php?page=search" method="get">
<input type="hidden" name="page" value="search" />
<input type="hidden" name="start" value="1"/>
<input type="hidden" name="search_only" value="1" />
<input type="hidden" name="sort_order" value="DESC" />
<input type="hidden" name="section" value="all" />
<label for='main_search' class='hide'>{$lang['start_search']}</label>
<div>
<input type="text" name="keyword"  value="{$lang['search_keyword']}" onfocus="if (this.value == '{$lang['search_keyword']}') this.value = '';"
dir="{$_CONF['info_row']['content_dir']}" />
<input type="submit"  title="{$lang['start_search']}" tabindex="6" />
</div>
</form>
</div>

.search {
    position: absolute;
    width: 244px;
    height: 34px;
    background: url('images/search.png') no-repeat scroll 0% 0% transparent;
}
.search input[type="text"] {
    border: 0px none;
    position: absolute;
    top: 1px;
    left: 52px;
    width: 154px;
    height: 29px;
    background: none repeat scroll 0% 0% transparent;
    margin: 0px;
    padding: 0px;
    font-size: 12px;
    font-family: tahoma;
    font-weight: bold;
    direction: rtl;
    color: #A2A2A2;
}
.search input[type="submit"] {
    border: 0px none;
    position: absolute;
    top: 4px;
    left: 5px;
    width: 45px;
    background: none repeat scroll 0% 0% transparent;
    margin: 0px;
    padding: 0px;
    height: 25px;
    cursor: pointer;
}