JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<footer id="footer" class="midnight-blue">
        <div class="container">
            <div class="row">
                <div class="col-sm-6">
                    © 2013 <a target="_blank" href="" title="Free Twitter Bootstrap WordPress Themes and HTML templates">Layout</a>. All Rights Reserved.
                </div>
                <div class="col-sm-6">
                    <ul class="pull-right">
                        <li><a style="color:#FFF" href="#">Home</a></li>
                        <li><a style="color:#FFF" href="#">About Us</a></li>
                        <li><a style="color:#FFF" href="#">Faq</a></li>
                        <li><a style="color:#FFF" href="#">Contact Us</a></li>
                    </ul>
                </div>
            </div>
        </div>
</footer>

CSS

/*Footer*/
#footer {
  background: #fff;
  padding: 30px 0;
}

/*Footer*/
#footer {
  padding-top: 30px;
  padding-bottom: 30px;
  color: #fff;
  background: #000270;
}
@media (min-width: 768px) {
#footer ul {
    float: right;
  }

#footer a {
  color: #fff;
}

#footer ul {
  list-style: none;
  padding: 0;
  margin: 0 -7px;
}
#footer ul > li {
  float: left;
  margin: 0 7px;
}
#footer ul > li > a {
  text-transform: none;
  color: #1a1a1a;
}
#footer ul > li > a:hover {
  color: #00936b;
}

}
	  </style>