<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 ----------> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> <nav class="navbar navbar-expand-sm bg-light fixed-top navbar-light border"> <div class="container"> <!-- Brand --> <a class="navbar-brand" href="#"> <img src="http://velikorodnov.com/html/autotrader/images/logo.png" alt="Logo" style="width:120px;"> </a> <!-- Toggler/collapsibe Button --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"> <span class="navbar-toggler-icon"></span> </button> <!-- Navbar links --> <div class="collapse navbar-collapse" id="collapsibleNavbar"> <ul class="navbar-nav ml-auto"> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown"> New </a> <div class="dropdown-menu"> <a class="dropdown-item" href="#">Find New Cars</a> <a class="dropdown-item" href="#">Latest Cars</a> <a class="dropdown-item" href="#">Popular Cars</a> <a class="dropdown-item" href="#">Upcoming Cars</a> <a class="dropdown-item" href="#">Offers & Discounts</a> </div> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown"> Used </a> <div class="dropdown-menu"> <a class="dropdown-item" href="#">Find Used Cars</a> <a class="dropdown-item" href="#">Find by Brand</a> <a class="dropdown-item" href="#">Find by Location</a> <a class="dropdown-item" href="#">Upcoming Cars</a> <a class="dropdown-item" href="#">Offers & Discounts</a> </div> </li> <li class="nav-item"> <a class="nav-link" href="#">Sell</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Compare</a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown"> News & Reviews </a> <div class="dropdown-menu"> <a class="dropdown-item" href="#">Car News</a> <a class="dropdown-item" href="#">Car Reviews</a> <a class="dropdown-item" href="#">Car Videos</a> <a class="dropdown-item" href="#">Write Review</a> </div> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown"> More </a> <div class="dropdown-menu"> <a class="dropdown-item" href="#">Car Loan</a> <a class="dropdown-item" href="#">EMI Calculator</a> <a class="dropdown-item" href="#">Car Insurance</a> <a class="dropdown-item" href="#">Ask Question</a> </div> </li> <form class="form-inline" action="#"> <input class="form-control mr-sm-2" type="text" placeholder="Search Cars"> <button class="btn btn-success" type="submit"><i class="fa fa-search"></i> Search</button> </form> </ul> </div> </div> </nav> <div class="mt-5"></div> <section class="main-content py-5 mb-5" id="main-content"> <div class="container"> <div class="row"> <div class="col-md-8 "> <div class="card-body bg-light border"> <div class="row site-title "> <div class="col-md-12"> <h2>Latest Properties</h2> <p class="title_line">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p> </div> </div> </div> </div> <div class="col-md-4 "> <div class="card bg-light"> <div class="card-body"> <div class="row site-title "> <div class="col-md-12"> <h4>Latest Properties</h4> <p class="title_line">Loret amet, consectetur adipisicing elit.</p> </div> </div> </div> </div> </div> </div> </div> </section> <section class="cta border py-5" id="cta"> <div class="container"> <div class="row text-center"> <div class="col-md-6 offset-md-3"> <h2>Join our professional team & agents to start selling your house</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p> <button type="button" class="btn btn-primary">Contact Us</button> <button type="button" class="btn btn-outline-secondary">Secondary</button> </div> </div> </div> </section> <section class="footer py-5 border" id="footer"> <div class="container py-3"> <div class="row"> <div class="col-md-3 col-sm-6 col-xs-12 "> <img class="pb-4"src="https://askbootstrap.com/preview/osahan-property/img/logo.png"> <p class="">86 Petersham town, New South wales Waedll Steet, Australia PA 6550</p> <ul class="list-unstyled"> <li>+61 525 240 310</li> <li>iamosahan@gmail.com</li> <li>www.askbootstrap.com</li> </ul> </div> <div class="col-md-9 col-sm-6 col-xs-12 "> <div class="row"> <div class="col-md-3"> <h6 class="pb-2">OUR PROPERTIES </h6> <ul class="list-unstyled"> <a href="#"><li> Single Story</li></a> <a href="#"><li> Double Story</li></a> <a href="#"><li> Triple Story</li></a> <a href="#"><li> Resort </li></a> <a href="#"><li> Homes in Hawai</li></a> <a href="#"><li> Palace</li></a> </ul> </div> <div class="col-md-3"> <h6 class="pb-2">QUICK LINKS </h6> <ul class="list-unstyled"> <a href="#"><li> Single Story</li></a> <a href="#"><li> Double Story</li></a> <a href="#"><li> Triple Story</li></a> <a href="#"><li> Resort </li></a> <a href="#"><li> Homes in Hawai</li></a> <a href="#"><li> Palace</li></a> </ul> </div> <div class="col-md-3"> <h6 class="pb-2">ABOUT OP </h6> <ul class="list-unstyled"> <a href="#"><li> Single Story</li></a> <a href="#"><li> Double Story</li></a> <a href="#"><li> Triple Story</li></a> <a href="#"><li> Resort </li></a> <a href="#"><li> Homes in Hawai</li></a> <a href="#"><li> Palace</li></a> </ul> </div> <div class="col-md-3"> <h6 class="pb-2">NEWSLETTER </h6> <small> Get the most recent updates from our site and be updated your self...GET IN TOUCH</small> <div class="social-icons pt-3"> <ul class="list-inline list-unstyled"> <a href="#"><li class="list-inline-item"><i class="fa fa-facebook-square fa-2x text-primary"></i></li> </a> <a href="#"><li class="list-inline-item"><i class="fa fa-twitter-square fa-2x text-info"></i></li> </a> <a href="#"><li class="list-inline-item"><i class="fa fa-youtube-play fa-2x text-danger"></i></i></li> </a> <a href="#"><li class="list-inline-item"><i class="fa fa-google-plus-square fa-2x text-danger"></i></li> </a> </ul> </div> </div> </div> </div> </div> </div> </section> <section class="copyright bg-light py-2" id="copyright"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <small>© Copyright 2018 Osahan Property. All Rights Reserved</small></br> <small> Made with by Ask Bootstrap </small> </div> </div> </div> </section>

p.title_line:after {content: " "; background: #dd0000; position: absolute;width: 25%;height: 2px;} p.title_line:after {left: 2.5%;top: 90%;}