<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<footer class="footer">
<div class="container">
<div class="top-footer">
<div class="col-sm-1">
<img class="hidden-xs" src="https://kiip-staging.meteorapp.com/app/assets/icons/icon-contact.svg">
<img class="hidden-lg hidden-md hidden-sm" src="https://kiip-staging.meteorapp.com/app/assets/icons/star.png">
</div>
<div class="col-sm-10">
<h3>Let's Talk Moments</h3>
<h5>Get in touch to learn how Kiip can help your business.</h5><a href="http://v3.kiip.me/contact/#talk-moments-form" class="btn pull-right">Contact Us</a>
</div>
</div>
<div class="bottom-footer">
<div class="col-md-3 col-sm-4 col-xs-12">
<h6>Kiip</h6><a href="http://www.kiip.me">Homepage</a><a href="http://v3.kiip.me/brands">Brands</a><a href="http://v3.kiip.me/developers">Developers</a><a href="http://v3.kiip.me/selfserve">Performance
Marketers</a><a href="http://v3.kiip.me/rewards">Rewards</a>
</div>
<div class="col-md-3 col-sm-4 col-xs-12">
<h6>About Us</h6><a href="http://v3.kiip.me/about">About Us</a><a href="http://blog.kiip.me">Blog</a><a href="http://v3.kiip.me/careers">Careers</a><a href="http://v3.kiip.me/press">Press</a><a class="hidden" href="http://v3.kiip.me/privacy">Privacy
Policy</a>
</div>
<div class="col-md-3 col-sm-4 col-xs-12">
<h6>Misc</h6>
<a href="http://api.kiip.me/register" id="signup-footer-link">Sign Up</a><a href="http://api.kiip.me/login">Sign In</a><a href="http://v3.kiip.me/contact" id="contact-modal-link">Contact Us</a><a href="http://docs.kiip.me">Developer Docs</a><a href="http://help.kiip.me/">Knowledge Base</a>
</div>
<div class="col-md-3 col-sm-4 col-xs-12">
<h6>Follow Us</h6>
<div class="social-links"><a href="https://www.facebook.com/Kiip"><i class="fa fa-facebook"></i></a><a href="https://twitter.com/kiip"><i class="fa fa-twitter"></i></a><a href="http://blog.kiip.me"><i class="fa fa-book"></i></a>
<a href="https://www.youtube.com/channel/UCaU81nWGT6w5TsbLx41W6kw/"><i
class="fa fa-youtube"></i>
</a>
<a href="http://www.linkedin.com/company/kiip"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="copyright">Kiip, Inc. © 2017</div>
</div>
</div>
</div>
</footer>
.footer {
background: #F6F7F8;
color: #4a4a4a;
}
.footer .top-footer {
border-bottom: solid 1px #dedada;
position: relative;
height: 170px;
}
.footer .top-footer img {
background: linear-gradient(to bottom, #fa0e75, #aa26ad 49%, #583fe6);
border-radius: 50%;
width: 60px;
margin: 60px 20px 34px 20px;
}
.footer .top-footer a {
margin-top: 60px;
}
.footer .bottom-footer a, .footer .bottom-footer a:hover, .footer .bottom-footer a:visited, .footer .bottom-footer a:hover, .footer .bottom-footer a:active {
display: flex;
flex-direction: column;
color: #333333;
text-decoration: none;
}
.footer .bottom-footer .col-md-3 {
margin-bottom: 40px;
margin-top: 60px;
}
.footer .bottom-footer .col-md-3 .h6, .footer .bottom-footer .col-md-3 h6 {
color: #111;
font-size: 14px;
}
.footer .bottom-footer .social-links {
display: flex;
flex-direction: row;
margin-top: 10px;
flex-wrap: wrap;
}
.footer .top-footer a {
margin-top: -58px;
}
.footer .bottom-footer .social-links a, .footer .bottom-footer .social-links a:hover, .footer .bottom-footer .social-links a:visited, .footer .bottom-footer .social-links a:hover, .footer .bottom-footer .social-links a:active {
width: 35px;
height: 35px;
background: #4a4a4a;
border-radius: 50%;
margin: 2px 10px 2px 0;
}
.footer .bottom-footer .copyright {
margin-bottom: 30px;
}
@media (max-width: 1200px) {
.footer .top-footer {
position: initial;
height: auto;
}
.footer .top-footer img {
display: block;
margin: 50px auto 0;
}
.footer .top-footer h3, .footer .top-footer .h3, .footer .top-footer h5, .footer .top-footer .h5 {
display: block;
text-align: center;
}
.footer .top-footer .h5, .footer .top-footer h5 {
position: initial;
top: 0;
left: 0;
}
.footer .top-footer a {
display: block;
margin: 20px auto 40px;
float: none !important;
}
}
footer .btn {
width: 220px;
height: 42px;
border-radius: 2px;
background-color: #03dad7;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
font-size: 20px;
font-weight: 600;
letter-spacing: 0.2px;
text-align: center;
color: #fafafa;
}
footer .btn:hover{
color:white;
opacity:.9;
}
.footer .bottom-footer .social-links a, .footer .bottom-footer .social-links a:hover, .footer .bottom-footer .social-links a:visited, .footer .bottom-footer .social-links a:hover, .footer .bottom-footer .social-links a:active {
width: 35px;
height: 35px;
background: #eaeaea;
border-radius: 50%;
margin: 2px 10px 2px 0;
color: #6d6b6b !important;
padding: 10px;
font-size: 17px;
padding-top: 8px;
text-align: center;
margin: 3px;
}
.footer hr{
color:lightgrey!important;
}.footer .col-sm-10 {
margin-top: 44px;
}
.copyright{
padding-bottom:100px;
padding-left:15px;
}
