Contact form with Social network links Using Bootstrap

Contact form with Social network links Using Bootstrap 

Html code:

<link href="https://fonts.googleapis.com/css?family=Oswald:700|Patua+One|Roboto+Condensed:700" rel="stylesheet">

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<section id="contact" class="content-section text-center">

        <div class="contact-section">

            <div class="container">

              <h2>Contact Us</h2>

              <p>Feel free to shout us by feeling the contact form or visiting our social network sites like Fackebook,Whatsapp,Twitter.</p>

              <div class="row">

                <div class="col-md-8 col-md-offset-2">

                  <form class="form-horizontal">

                    <div class="form-group">

                      <label for="exampleInputName2">Name</label>

                      <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">

                    </div>

                    <div class="form-group">

                      <label for="exampleInputEmail2">Email</label>

                      <input type="email" class="form-control" id="exampleInputEmail2" placeholder="jane.doe@example.com">

                    </div>

                    <div class="form-group ">

                      <label for="exampleInputText">Your Message</label>

                     <textarea  class="form-control" placeholder="Description"></textarea> 

                    </div>

                    <button type="submit" class="btn btn-default">Send Message</button>

                  </form>

                  <hr>

                    <h3>Our Social Sites</h3>

                  <ul class="list-inline banner-social-buttons">

                    <li><a href="#" class="btn btn-default btn-lg"><i class="fa fa-twitter"> <span class="network-name">Twitter</span></i></a></li>

                    <li><a href="#" class="btn btn-default btn-lg"><i class="fa fa-facebook"> <span class="network-name">Facebook</span></i></a></li>

                    <li><a href="#" class="btn btn-default btn-lg"><i class="fa fa-youtube-play"> <span class="network-name">Youtube</span></i></a></li>

                  </ul>

                </div>

              </div>

            </div>

        </div>

      </section>

Css code:

body{
width:100%;
height:100%;
font-family: 'Roboto Condensed', sans-serif;

}


h1,h2,h3 {
margin:0 0 35px 0;
font-family: 'Patua One', cursive;
text-transform: uppercase;
letter-spacing:1px;
}

p{
margin:0 0 25px;
font-size:18px;
line-height:1.6em;
}
a{
color:#26a5d3;
}
a:hover,a:focus{
text-decoration:none;
color:#26a5d3;
}

#contact{
background:#333333;
color:#f4f4f4;
padding-bottom:80px;
}

textarea.form-control{
    height:100px;
}