Форма обратной связи HTML — создание формы обратной связи

<div class="cover">
    <h2 class="contact">Напишите мне</h2>
    <form id="contactform"> 
        <p class="contact"><label for="name">Имя</label></p> 
        <input id="name" name="name" placeholder="Ваше имя" required="" tabindex="1" type="text"> 
 
        <p class="contact"><label for="email">Email</label></p> 
        <input id="email" name="email" placeholder="example@sitehere.ru" required="" tabindex="2" type="text"> 
 
        <p class="contact"><label for="Subject">Тема</label></p> 
        <input id="subject" name="subject" placeholder="Тема сообщения" required="" tabindex="2" type="text"> 
 
        <p class="contact"><label for="comment">Сообщение</label></p> 
        <textarea name="comment" id="comment" tabindex="4"></textarea> <br>
        <input name="submit" id="submit" tabindex="5" value="Отправить" type="submit"> 	 
    </form> 
</div>

.cover {
    background:#CCC; 
    width:700px; 
    margin:auto; 
    padding-left:60px;
}
 
h2.contact { 
    padding-left: 125px; 
    font-size: 66px; 
    color: #ff5400; 
    height: 105px; 
    background: url(images/contact.png) no-repeat -10px -10px;  
    font-family: sans-serif;
}
 
p.contact { 
    font-size: 24px; 
    margin-bottom: 15px; 
    line-height: 36px; 
    font-family: sans-serif, Arial; 
    color: #4b4b4b; 
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); 
}
 
#contact {
    margin-bottom: 0px; 
}
 
input[type="text"] {
    width: 400px; 
}
 
textarea { 
    width: 600px; 
    height: 275px; 
}
 
label { 
    color: #ff5400; 
}
 
input, textarea { 
    background-color: rgba(255, 255, 255, 0.4); 
    border: 5px solid rgba(122, 192, 0, 0.15); 
    padding: 10px; 
    font-family: Keffeesatz, Arial; 
    color: #4b4b4b; 
    font-size: 24px; 
    -webkit-border-radius: 5px;
    margin-bottom: 15px;
    margin-top: -10px;
}
 
input:focus, textarea:focus { 
    border: 5px solid #ff5400; 
    background-color: rgba(255, 255, 255, 1);
}
 
input[type="submit"] {
    border: none;
    cursor: pointer;
    color: #fff;
    font-size: 24px;
    background-color: #7ac000;
    padding: 5px 36px 8px 36px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6);
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    border-top: 1px solid rgba(255, 255, 255, 0.6);
    background: -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0.23, #619702),
        color-stop(0.62, #7ac000)
    );
    background: -moz-linear-gradient(
        center bottom,
        #619702 23%,
        #7ac000 62%
    );
}
 
input[type="submit"]:hover {
    color: #fff; 
    border-bottom: 1px solid rgba(0, 0, 0, 0.4); 
    background-color: #ff5400;
    background: -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0.23, #c34000),
        color-stop(0.62, #ff5400)
    );
    background: -moz-linear-gradient(
        center bottom,
        #c34000 23%,
        #ff5400 62%
    );
}
 
input[type="submit"]:active { 
    top: 1px; 
}