<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-area" id="iletisim"> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="p-header"> <h2>iletisim</h2> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="footer-left"> <h2><i class="fa fa-user" aria-hidden="true"></i> Ali Bulut</h2> <h5><i class="fa fa-phone" aria-hidden="true"></i> 0555 55 55 55 </h5> <adress> <p><i class="fa fa-map-marker" aria-hidden="true"></i> Eşrefzade mahallesi, topkapı dışı kuzgun sokak, Bulut inşaat, Mermer, Merdiven.</p> </adress> <ul> <li> <a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li> <li> <a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li> <li> <a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li> </ul> </div> </div> <div class="col-md-6"> <div class="footer-right"> <div class="row"> <div class="harita"> <iframe src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d1105.0995008195569!2d29.727107722754656!3d40.43739642642853!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sbulut+in%C5%9Faat+iznik!5e0!3m2!1str!2str!4v1513941507106" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe> </div> </div> </div> </div> </div> <section class="alt-kisim"> <div class="row"> <div class="copy"> <a title="Bulut inşaat,Bulut Holding, İznik İnşaat" href="www.bulutholding.com"> © 2018 Bulutholding.com tüm hakkı saklıdır.</a> </div> </div> </section> </div> </footer>

.footer-area{ background-image: url('https://macinteract.com/wp-content/uploads/2016/02/footer-background.jpg') ; overflow: hidden; padding-top: 55px; padding-bottom: 105px; } .footer-area .p-header h2{ color:#fff; padding-bottom: 30px; } .footer-left h2{ color: #fff; font-size: 25px; font-weight: 400; padding-bottom: 10px; margin-top: 15px; font-family: 'Roboto', sans-serif; } .footer-left h5{ color:#fff2f2; font-size: 20px; font-weight: 400; padding-bottom:10px; } .footer-left adress p{ color:#fff2f2; font-size: 15px; font-weight: 300; padding-bottom:10px; font-style: italic; } .footer-left ul{ overflow: hidden; padding-top: 20px; } .footer-left ul li{ float: left; } .footer-left ul li a{ width: 37px; height: 37px; border-radius: 50%; text-align: center; display: block; margin-right: 10px; color: #fff; line-height: 35px; font-size: 20px; } .footer-left ul li:first-child a{ background: #3b5997; } .footer-left ul li:nth-child(2) a{ background: #40c2f4; } .footer-left ul li:last-child a{ background: #e44c41; } .fa-phone:before { font-size: 20px; color: #75c100; } .fa-map-marker:before { font-size: 20px; color: #ea4e4e; } .fa-user:before { font-size: 20px; color: #dfdfdf; } /************************************************************/ /******************* en alt kısım secion tüm hakkkı saklıdır vs ***********************/ /************************************************************/ .copy a{ color: #e9eacf; } .p-header h2{ color:#4e525d; font-size: 42px; text-align: center; padding-bottom: 62px; font-weight: 400; } /*****************UYARI İCONLARI FONT AWESONDAN ALDIM AMA BURADA CIKMADI NEDENSE EKLEYIN SİZDE PROJEYE**************************/