<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/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 navbar-light fixed-top"> <div class="container"> <!-- Brand --> <a class="navbar-brand" href="index.html"> <img src="https://www.duffysrehab.com/wp-content/uploads/sites/55/Duffys-Logo-Desktop.svg" alt="Logo" style="width:370px;"> </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="index.html">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="about-us.html">About Us</a> </li> <li class="nav-item"> <a class="nav-link" href="categories.html">Services</a> </li> <li class="nav-item"> <a class="nav-link" href="license.html">License</a> </li> <li class="nav-item"> <a class="nav-link" href="contact-us.html">Support</a> </li> <a href="submit-site.html"><button type="button" class="btn btn-light"> For a Free Consultation, call: (855) 549-1273</button></a> </ul> </div> </div> </nav> <section class="py-5 banner"> <div class="container my-5 py-5"> <div class="row text-center text-white"> <div class="col-md-12"> <h1>Hope Canyon Recovery</h1> <h2>Bringing Hope to Those in Need</h2> <p>For immediate treatment help, call:(855) 549-1273</p> <a href="submit-site.html"><button type="button" class="btn btn-danger btn-lg"> For a Free Consultation, call: (855) 549-1273</button></a> </div> </div> </div> </section> <div class="section py-5 bg-danger text-white"> <div class="container my-5"> <div class="row"> <h2>Create your snippet's HTML, CSS and Javascript in the editor tabs</h2> </div> </div> </div> <div class="section py-5 bg-light"> <div class="container my-5 text-center"> <div class="row"> <div class="col-md-12"> <h6>SERVE THE HUMANITY</h6> <h3>OUR MISSION</h3> <p>perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto </p> </div> </div> <div class="row"> <div class="col-md-4"> <div class="card py-5 bg-warning"> <div class="card-body"> <i class="fa fa-tachometer fa-4x "></i></br> <h4>REBUILD</h4> <p>Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p> </div> </div> </div> <div class="col-md-4"> <div class="card py-5 bg-danger"> <div class="card-body"> <i class="fa fa-tachometer fa-4x "></i></br> <h4>DONATION</h4> <p>Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p> </div> </div> </div> <div class="col-md-4"> <div class="card py-5 bg-success"> <div class="card-body"> <i class="fa fa-tachometer fa-4x "></i></br> <h4>PEACE</h4> <p>Dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.</p> </div> </div> </div> </div> </div> </div> <div class="section py-5 bg-warning"> <div class="container my-5 text-center"> <div class="row"> <div class="col-md-12"> <h6>SERVE THE HUMANITY</h6> <h3>OUR MISSION</h3> <p>perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto </p> </div> </div> <div class="row"> <div class="col-md-4"> <img src="http://xerotheme.com/dezex/assets/img/item-right-1.png"> <h2 class="pt-3">We Research</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> <div class="col-md-4"> <img src="http://xerotheme.com/dezex/assets/img/item-right-2.png"> <h2 class="pt-3">Our Goals</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> <div class="col-md-3"> <img src="http://xerotheme.com/dezex/assets/img/item-right-1.png"> <h2 class="pt-3">Plan</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> </div> </div> </div> <div class="section py-5 bg-light text-center"> <div class="container my-5 "> <div class="row"> <div class="col-md-4"> <img src="http://xerotheme.com/dezex/assets/img/item-right-1.png"> <h2 class="pt-3">We Research</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> <div class="col-md-4"> <img src="http://xerotheme.com/dezex/assets/img/item-right-2.png"> <h2 class="pt-3">Our Goals</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> <div class="col-md-4"> <img src="http://xerotheme.com/dezex/assets/img/item-right-1.png"> <h2 class="pt-3">Plan</h2> <p>Gold and silver, like other commodities have an intrinsic value, which is not.</p> </div> </div> </div> </div> <div class="section py-5 bg-light"> <div class="container my-5 "> <div class="row"> <div class="col-md-6"> <h6>SERVE THE HUMANITY</h6> <h3>OUR MISSION</h3> <p>perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto </p> <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable if you are going to use a passage. Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.It is a long established fact that a reader will be distracted.</p> </div> <div class="col-md-6"> <img src="http://themexriver.net/wp/infinity/wp-content/themes/infinity/images/charity/about-pic.jpg"> </div> </div> </div> </div>

.banner {background-image:url(https://images.pexels.com/photos/1097456/pexels-photo-1097456.jpeg?auto=compress&cs=tinysrgb&h=650&w=940)}