<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-dark 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"> <a class="nav-link" href="#">Sell</a> </li> <li class="nav-item"> <a class="nav-link" href="#">About Us</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Services</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Features</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Contact Us</a> </li> </ul> </div> </div> </nav> <div class="banner slider"> <div id="demo" class="carousel slide" data-ride="carousel" data-interval="false"> <!-- Indicators --> <ul class="carousel-indicators"> <li data-target="#demo" data-slide-to="0" class="active"></li> <li data-target="#demo" data-slide-to="1"></li> <li data-target="#demo" data-slide-to="2"></li> </ul> <!-- The slideshow --> <div class="carousel-inner"> <div class="carousel-item active"> <img src="http://wpregular.support/wp/insurers/wp-content/uploads/2017/03/Funeral-Plan-Beach-Umbrella.jpeg" alt="Los Angeles"> <div class="carousel-caption"> <div class="col-md-7"> <h1 class="pb-2"><strong>The WordPress Theme for Growth Hackers </strong> </h1> <h4>The right look and feel to promote any product, service or online course.</h4> <button type="button" class="btn btn-success mt-4">Buy Growthpress</button> <button type="button" class="btn btn-dark mt-4">Get More Details</button> </div> </div> </div> <div class="carousel-item"> <img src="http://wpregular.support/wp/insurers/wp-content/uploads/2017/03/s3.jpg" alt="Chicago"> <div class="carousel-caption"> <div class="col-md-7"> <h1 class="pb-2"><strong>The WordPress Theme for Growth Hackers </strong> </h1> <h4>The right look and feel to promote any product, service or online course.</h4> <button type="button" class="btn btn-success mt-4">Buy Growthpress</button> <button type="button" class="btn btn-dark mt-4">Get More Details</button> </div> </div> </div> <div class="carousel-item"> <img src="https://images.cardekho.com/images/featuredcarimages/Honda-WR-V-19/wrv-0.jpg" alt="New York"> <div class="carousel-caption"> <div class="col-md-7"> <h1 class="pb-2"><strong>The WordPress Theme for Growth Hackers </strong> </h1> <h4>The right look and feel to promote any product, service or online course.</h4> <button type="button" class="btn btn-success mt-4">Buy Growthpress</button> <button type="button" class="btn btn-dark mt-4">Get More Details</button> </div> </div> </div> </div> <!-- Left and right controls --> <a class="carousel-control-prev" href="#demo" data-slide="prev"> <span class="carousel-control-prev-icon"></span> </a> <a class="carousel-control-next" href="#demo" data-slide="next"> <span class="carousel-control-next-icon"></span> </a> </div> </div> <section class="Services py-5" id="Services"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <h1> Our Services </h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod. </p> </div> </div> <div class="row mt-4"> <div class="col-md-4"> <div class="card"> <img class="card-img-top" src="http://wpregular.support/wp/insurers/wp-content/uploads/2017/04/blog-1.jpg" alt="Card image"> <div class="card-body"> <h3>Home Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <button type="button" class="btn btn-primary">Read More..</button> </div> </div> </div> <div class="col-md-4"> <div class="card"> <img class="card-img-top" src="http://wpregular.support/wp/insurers/wp-content/uploads/2017/04/blog-7.jpg" alt="Card image"> <div class="card-body"> <h3>Auto Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <button type="button" class="btn btn-primary">Read More..</button> </div> </div> </div> <div class="col-md-4"> <div class="card"> <img class="card-img-top" src="http://wpregular.support/wp/insurers/wp-content/uploads/2017/04/blog-3.jpg" alt="Card image"> <div class="card-body"> <h3>Business Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <button type="button" class="btn btn-primary">Read More..</button> </div> </div> </div> </div> </div> </section> <section class="aboutus py-5 bg-primary text-white" id="aboutus"> <div class="container "> <div class="row text-center"> <div class="col-md-12"> <h1>Why Choose Us</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna u Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis ae irure dolor in reprehenderit in voluptate velit esse cillum</p> <br> <p> dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis</p> <button type="button" class="btn btn-light">Read More</button> </div> </div> </div> </section> <section class="benefits py-5" id="benefits"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <h1> Our Benefits </h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod. </p> </div> </div> <div class="row mt-4"> <div class="col-md-4"> <div class="card"> <div class="card-body"> <i class="fa fa-car fa-3x"></i> <h3>Home Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> </div> </div> <div class="col-md-4"> <div class="card"> <div class="card-body"> <i class="fa fa-car fa-3x"></i> <h3>Auto Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> </div> </div> <div class="col-md-4"> <div class="card"> <div class="card-body"> <i class="fa fa-car fa-3x"></i> <h3>Business Insurance </h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> </div> </div> </div> </div> </section> <section class="cta py-2 bg-primary text-white" id="cta"> <div class="container"> <div class="row text-center "> <div class="col-md-12"> <h4>SUBSCRIBE OUR NEWSLETTER</h4> <button type="button" class="btn btn-primary">Contact us today</button> </div> </div> </div> </section> <div class="footer mt-5"> <div class="container"> <div class="row"> <div class="col-md-3 footer-one"> <h4><span class="span-1">10.000 </span>Client Already Connected </h4> <p>A talented in-house teams of experts outreach & social media complement the analyticals technical SEO professionals ensuring your business grows organically with hard working & get you better result.</p> <ul class="list-inline"> <a href="#"><li class="list-inline-item"><i class="fa fa-facebook"></i> </li></a> <a href="#"><li class="list-inline-item"><i class="fa fa-facebook"></i> </li></a> <a href="#"><li class="list-inline-item"><i class="fa fa-facebook"></i> </li></a> <a href="#"><li class="list-inline-item"><i class="fa fa-facebook"></i> </li></a> </ul> </div> <div class="col-md-3 footer-two"> <h4>Quick Links</h4> <ul class="list-unstyled"> <li><a href="#">Privacy Policy</a></li> <li><a href="#">Terms & Condition </a></li> <li><a href="#">Support </a></li> <li><a href="#">Refund Policy </a></li> <li><a href="#">Contact Us </a></li> </ul> </div> <div class="col-md-3 footer-three"> <h4>Quick Links</h4> <ul class="list-unstyled"> <li><a href="#">Privacy Policy</a></li> <li><a href="#">Terms & Condition </a></li> <li><a href="#">Support </a></li> <li><a href="#">Refund Policy </a></li> <li><a href="#">Contact Us </a></li> </ul> </div> <div class="col-md-3 footer-four"> <h4>Quick Links</h4> <ul class="list-unstyled"> <li><a href="#">Privacy Policy</a></li> <li><a href="#">Terms & Condition </a></li> <li><a href="#">Support </a></li> <li><a href="#">Refund Policy </a></li> <li><a href="#">Contact Us </a></li> </ul> </div> </div> </div> </div> <section class="copyright bg-dark text-white py-2" id="copyright"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <p>Copyright © insurers 2018. All rights reserved. </p> </div> </div> </div> </section>

/**************** Banner Slider Carousel **************/ .carousel-inner img {width: 100%; max-height:400px;} .carousel-caption {color:#000;top:110px; bottom: auto; text-align:left;} .carousel-caption h1 { color:#fff; background-color:#;} /************ Services **************/ img {width:100%;}