<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.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 --> <div class="footer"> <div class="container"> <div class="row"> <div class="col-lg-3 col-md-4 col-sm-4"> <div class="footer_dv"> <h4>About us</h4> <img class="img-responsive" src="http://via.placeholder.com/250x150" alt="about"> <p></p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> </div> </div> <div class="col-lg-3 col-md-4 col-sm-4"> <div class="footer_dv"> <h4>Quick Link</h4> <div class="line-dash"></div> <ul> <li><a class="a-font" href="#">Home</a></li> <li><a class="a-font" href="#">About</a></li> <li><a class="a-font" href="#">Fruits</a></li> <li><a class="a-font" href="#">Sea Food</a></li> <li><a class="a-font" href="#">Vegetables</a></li> <li><a class="a-font" href="#">Blog</a></li> <li><a class="a-font" href="#">Police Privacy</a></li> </ul> </div> </div> <div class="col-lg-3 col-md-4 col-sm-4"> <div class="footer_dv"> <h4>Fruits</h4> <div class="line-dash"></div> <ul> <li><a class="a-font" href="#">Pineapple Steak</a></li> <li><a class="a-font" href="#">Pineapple Steak</a></li> <li><a class="a-font" href="#">Pineapple Steak</a></li> <li><a class="a-font" href="#">Pineapple Steak</a></li> <li><a class="a-font" href="#">Pineapple Steak</a></li> <li><a class="a-font" href="#">Pineapple Steak</a></li> </ul> </div> </div> <div class="col-lg-3 col-md-4 col-sm-4"> <div class="footer_dv"> <h4>Sea food</h4> <div class="line-dash"></div> <ul> <li><a class="a-font" href="#">Pineapple Juice</a></li> <li><a class="a-font" href="#">Pineapple Juice</a></li> <li><a class="a-font" href="#">Pineapple Juice</a></li> <li><a class="a-font" href="#">Pineapple Juice</a></li> <li><a class="a-font" href="#">Pineapple Juice</a></li> <li><a class="a-font" href="#">Pineapple Juice</a></li> </ul> </div> </div> </div> </div> </div> <footer class="py-5 bg-dark"> <div id="copyright"> <div class="container"> <div class="row"> <div class="col-md-4"> <p class="pull-left"><a href="http://lacodeid.com/" style="text-decoration: none;">© 2017 YOUR WEBSITE LACODEID</a></p> </div> <div class="col-md-8"> <ul class="list-inline navbar-right"> <li><a href="#">HOME</a></li> <li><a href="#">MENU ITEM</a></li> <li><a href="#">MENU ITEM</a></li> <li><a href="#">MENU ITEM</a></li> <li><a href="#">MENU ITEM</a></li> <li><a href="#">MENU ITEM</a></li> </ul> </div> </div> </div> </div> </footer>

/*footer*/ .footer { background: #2b2a2a none repeat scroll 0 0; border-top: 3px solid #54d400; margin: 0; padding: 20px 0; } .footer_dv { width: 100%; } .footer_dv h4 { color: #fff; font-weight: bold; margin-bottom: 30px; text-transform: uppercase; } .footer_dv ul { list-style: outside none none; margin: 0; padding: 0; } .footer_dv ul li:first-child { border-top: medium none; box-shadow: none; } .footer_dv ul li { color: #fff; padding: 5px 0; } .footer_dv p { color: #fff; font-size: 14px; line-height: 20px; margin: 0 0 15px; text-align: justify; } .a-font { color: #fff!important; text-decoration: none!important; } .copyright { min-height: 79px; background-color: #343a40; } .copyright p { text-align:left; color:#FFF; padding:10px 0; margin-bottom:0px; } .heading7 { font-size:21px; font-weight:700; color:#d9d6d6; margin-bottom:22px; } .post p { font-size:12px; color:#FFF; line-height:20px; } .post p span { display:block; color:#8f8f8f; } .bottom_ul { list-style-type:none; float: right; margin-bottom: 0px; padding-top: 22px; } .bottom_ul li { float:left; line-height:40px; } .bottom_ul li:after { content:""; color:#FFF; margin-right:8px; margin-left:8px; } .bottom_ul li a { color:#FFF; } #copyright p, #copyright ul { margin: 0; float: left; font-size: 14px; color: #000000; } footer.site-footer ul { padding-left: 0; margin-bottom: 20px; list-style: none; } @media (min-width: 768px){ .navbar-right { float: right!important; margin-right: -15px; } } .list-inline>li { display: inline-block; padding-right: 5px; padding-left: 5px; } .list-inline { padding-left: 0; margin-left: -5px; list-style: none; } .py-5 { padding-top: 3rem!important; padding-bottom: 3rem!important; } .bg-dark { background-color: #222!important; }