Contact Static Small Frame

by NinjaSk8ter

HTML

<div id="Soluciones_derecho2">
    <div id="contactus">
        <label for='contact-fname'>
            Nombre:</label>
        <input type='text' id='contact-fname' class='contact-input' name='fname' tabindex='1001' />
        <label for='contact-lname'>
            Apellido:</label>
        <input type='text' id='contact-lname' class='contact-input' name='lname' tabindex='1002' />
        <label for='contact-empresa'>
            Empresa:</label>
        <input type='text' id='contact-empresa' class='contact-input' name='empresa' tabindex='1003' />
        <label for='contact-email'>
            Email:</label>
        <input type='text' id='contact-email' class='contact-input' name='email' tabindex='1005' />
        <label for='contact-fone'>
            Teléfono:</label>
        <select id='PhoneTypeList' name='phtypelist' tabindex='1006'>
            <option value="main" selected='selected'>Local</option>
            <option value="cell">Movil</option>
            <option value="office">Oficina</option>
            <option value="fax">Fax</option>
        </select>
        <input type='text' id='AreaBox' class='ext-input' name='areacd' tabindex='1007' />
        <input type='text' id='FoneBox' class='fone-input' name='fone' tabindex='1008' />
        <label for='contact-tema'>
            Tema:</label>
        <input type='text' id='contact-tema' class='contact-input' name='tema' tabindex='1009' />
        <label for='contact-mensaje'>
            Mensaje:</label>
        <textarea id='contact-mensaje' class='contact-input' name='mensaje' cols='10'  tabindex='1010'>
        </textarea>
        <br />
        <label>&nbsp;</label>        
        <button type='submit' class='contact-button' tabindex='1011'>Enviar</button>
        <button type='submit' class='contact-button' tabindex='1012'>Cancelar</button>
        <br />
        <label class='lblPhoneError'>duplicate</label>
        <input type="hidden" id="tokenValue" name="tokenValue"> 
    </div>
</div>

CSS

#Soluciones_derecho2 {
    width: 230px;
    height: 219px;
    float: left;
    position: relative;
    background-color: Purple;
}
#contactus {
    width: 220px;
    height: 195px;
    position: relative;
    margin: 7px 0 0 5px;
    background-color: olive;
}
#contactus label {
    width: 60px;
    clear: left;
    float: left; 
    font-family: Arial;
    font-size: 11px;
    font-weight: bold;
    color: #666666;
    line-height: 18px;
    text-align: right;    
    display: block; 
    padding: 0 4px 0 0;                   
    margin: 0 0 2px 0;               
    background-color: Lime;
}
#contactus .contact-input {
    width: 154px;
    background: #eee; 
    border: 1px solid #F7F7F7; 
    font-family: Arial; 
    float: left; 
    padding: 0 0 0 0; 
    margin: 0 0 2px 0; 
}
#contactus select {
    width: 64px;
    height: 18px;
    background: #eee; 
    border: 1px solid #fff; 
    font-family: Arial;
    font-size: 12px;
    float: left; 
    padding: 0 0 0 0; 
    margin: 0 0 2px 0;    
}
#contactus .ext-input {
    width: 24px;
    background: #eee; 
    border: 1px solid #F7F7F7; 
    font-family: Arial; 
    float: left; 
    padding: 0 0 0 0; 
    margin: 0 0 2px 2px; 
}
#contactus .fone-input {
    width: 60px;
    background: #eee; 
    border: 1px solid #F7F7F7; 
    font-family: Arial; 
    float: left; 
    padding: 0 0 0 0; 
    margin: 0 0 2px 2px; 
}
#contactus textarea {
    height:38px;
}
#contactus br {
    clear:both;
}
.contact-button {
    height: 19px;
    width: 74px;
    float: left;
    line-height: 1px;
    font-size: 12px;
    align: left;
    position:relative;
    padding: 0 0 0 0;
    margin: 0 4px 0 0;
    background-color: green;
}
#contactus .lblPhoneError {
    width: 60px;
    height: 12px;
    clear: left;
    float: left; 
    font-family: Arial;
    font-size: 11px;
    font-weight: bold;
    color: #666666;
    line-height: 12px;
    text-align: left;    
    display: block; 
    padding: 0 0 0 5px;              ...