Signup Footer Form

Signup Footer Form

by Solodev CMS

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<section class="form-section">
   <div class="container">
      <div class="row">
         <div class="col-md-10 col-md-offset-1">
            <h3>
               Sign up for WebCorpCo Today!
            </h3>
            <form action="" method="post" id="footer-form">
               <div class="col-md-3 video-form-fields">
                  <div class="form-group has-error has-danger">
                     <label for="your_email" class="sr-only">What is your email?</label> <input type="email" name="member_email" class="form-control" id="member_email2" placeholder="Work Email" required>
                  </div>
               </div>
               <div class="col-md-3 video-form-fields">
                  <div class="form-group has-error has-danger">
                     <label for="visitor_company" class="sr-only">What company do you work for?</label> <input type="text" class="form-control" name="member_company" id="visitor_company" placeholder="Company" required>
                  </div>
               </div>
               <div class="col-md-3 video-form-fields">
                  <div class="form-group has-error has-danger">
                     <label for="visitor_company" class="sr-only">What is your job title?</label> <input type="text" class="form-control" name="member_company" id="visitor_company" placeholder="Job Title" required>
                  </div>
               </div>
               <div class="col-md-3 video-form-fields">
                  <input type="hidden" name="mode" value="saveVisitor" id="mode"> <button type="submit" id="Submit2" class="btn btn-primary btn-solodev">Get Started</button>
               </div>
            </form>
         </div>
         <div...

CSS

section.form-section {
    /* background-color: #1b4858; */
    background-color: #0489b7;
    padding: 40px 15px;
}
section.form-section h3 {
    color: #fff;
    font-size: 40px;
    text-align: center;
    font-weight: 400;
    margin: 20px 0 35px;
    text-transform: capitalize;
}
section.form-section input {
    height: 55px;
    width: 100%;
    color: #a1a1a1;
    margin-bottom: 20px;
    padding-left: 20px;
    font-size: 16px;
    background-color: rgb(18, 89, 113);
    border-color: rgb(0, 189, 255);
}
section.form-section a {
  color: #fff;
  text-decoration: underline;
}
.form-section .selectResponse {
    display: inline-block;
    width: 100%;
    min-width: 100%;
    vertical-align: middle;
    margin: 0;
}
.selectResponse {
    margin-top: 4px;
    display: inline-block;
    min-width: 350px;
    vertical-align: middle;
    font-family: "proxima-nova", sans-serif;
    font-weight: 600;
}
.selectize-control.single .selectize-input, .selectize-control.single .selectize-input input {
    cursor: pointer;
}
section.form-section .selectize-input {
    color: #fff;
    margin-bottom: 20px;
}
section.form-section .selectize-input {
    padding-left: 20px;
}
section.video-section .video-form input, section.video-section .video-form .selectize-input, section.form-section .selectize-input {
    width: 100% !important;
    height: 55px !important;
    padding: 0 0 0 20px;
    border-radius: 0;
    font-size: 15px;
    line-height: 54px;
    text-align: left;
    color: #a1a1a1;
    background-color: #125971;
    border-color: #00bdff;
}
.form-section .selectize-input, .form-section .selectize-control.single .selectize-input.input-active {
    background: #073444;
    border-color: rgb(0, 189, 255);
}

section.form-section #Submit2 {
    font-size: 20px;
    text-transform: none;
    background-color: #ef9919;
    color: #fff;
    border: none;
    width: 100%;
    height: 55px;
    margin-right: 20px;
}
ol, ul {
    margin-top: 0px;
    margin-bottom: 10px;
...