<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="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <footer class="footer bg-style" style="background-image:url(images/background/3.jpg);"> <div class="container"> <div class="footer-pad"> <div class="row"> <div class="col-md-3 col-sm-6"> <div class="footer-widget about-box"> <figure class="image-box"> <img src="images/logo/logo2.png" alt=""> </figure> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elitsed do eiusmod tempor incididunt ut labore et dolore magna.</p> <div class="social-links"> <a href="#"><span class="fa fa-facebook-f"></span></a> <a href="#"><span class="fa fa-twitter"></span></a> <a href="#"><span class="fa fa-linkedin"></span></a> <a href="#"><span class="fa fa-instagram"></span></a> <a href="#"><span class="fa fa-pinterest-p"></span></a> </div> </div> </div> <div class="col-md-3 col-sm-6"> <div class="footer-widget footer-links"> <h3 class="title">Our Services</h3> <ul> <li><a href="#">Car Wash</a></li> <li><a href="#"> Engine Replace</a></li> <li><a href="#">Tire Repair</a></li> <li><a href="#">Car Paint</a></li> <li><a href="#">Car Observation</a></li> <li><a href="#">Home Service</a></li> </ul> </div> </div> <div class="col-md-3 col-sm-6"> <div class="footer-widget opening-hour"> <h3 class="title">Working Hours</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing.</p> <ul class="day-time"> <li><span>Mon-Set    :</span>    <span>9 AM - 5 PM</span></li> <li><span>Friday        :</span>    <span>8 AM - 4 PM</span></li> <li><span>Sunday      :</span>    <span>Closed</span></li> </ul> </div> </div> <div class="col-md-3 col-sm-6"> <div class="footer-widget footer-links"> <h3 class="title">Our Services</h3> <ul> <li><a href="#">Car Wash</a></li> <li><a href="#"> Engine Replace</a></li> <li><a href="#">Tire Repair</a></li> <li><a href="#">Car Paint</a></li> <li><a href="#">Car Observation</a></li> <li><a href="#">Home Service</a></li> </ul> </div> </div> </div> </div> </div> </div> </footer>

.footer { position: relative; border-top: 5px solid #980606; background-size: cover; background-repeat: repeat; background-attachment: fixed; background-position: center center; color:white; } .footer-pad { padding: 75px 0 65px; } .footer::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(71, 32, 29); } .footer.bg-style .footer-upper { padding: 75px 0 65px; } .about-box .social-links a { display: inline-block; font-size: 16px; font-weight: normal; color: #fff; line-height: 38px; margin-right: 1px; border: 1px solid #fff; width: 38px; height: 38px; } h3.title { margin-bottom: 30px; position: relative; font-weight: 500; color: #fff; } .footer-widget.footer-links ul li a:hover { color: #fff; } .footer.bg-style .footer-widget.footer-links ul li a { display: block; font-size: 14px; color: #fff; line-height: 24px; padding-left: 26px; position: relative; font-weight: 400; } .footer p { font-weight: 400; font-size: 14px; color: #fff; line-height: 27px; }