Contact form -7 custom design in wordpress

code for contact form that are automatically generated
<p>
    [text* your-name placeholder "your name"] </p>
<p>[text* text-phone id:phone placeholder "phone number"]</p>
<p>
    [email* your-email placeholder "Email Address"] </p>


[datetime datetime-appointment date-format:mm/dd/yy time-format:HH:mm ]</p>
<p>
    [textarea your-message placeholder="Your Message"] </p>

<p>[submit "Send"]</p>

//css style for contact form 7 desgin
/* Contact form -7*/

.wpcf7 {
 background-color: #21ADFA;
 border: 0px solid #666666;
   height: 500px;
   width: 348px;
 }
 .wpcf7-form {
 margin-left: 25px;
 margin-right: 25px;
 margin-top: 0px;
 padding-top:110px;
 }
 .wpcf7-textarea {
  height: 94px;
  width: 300px;
  font-size:16px;
 }
.wpcf7 input {
  height: 40px;
  width: 300px !important;
  font-size:16px;
 }
.wpcf7-text {
  height: 40px;
  width: 300px !important;
  font-size:16px;
}

.wpcf7-form-control.wpcf7-submit {
    background: #ffb049 none repeat scroll 0 0;
    height: 55px;
    width: 280px;
}