License ​#1430067
Monday - Friday 9:00 am to 7:00 pm

Boxes

Message Boxes

.bg-primary
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-primary-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-primary font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-secondary
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-secondary-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-secondary font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-success
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-success-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-success font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-warning
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-warning-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-warning font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-danger
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-danger-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-danger font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-info
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-info-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-info font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-light
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-light-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-light font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->
.bg-dark
Title

Box Text

 <!-- Box Start -->
 <div class="card bg-dark-light">
     <div class="card-body">
         <div class="card-title"><strong>Title</strong></div>
         <p class="card-text"> Box Text </p>
         <button class="btn btn-dark font-weight-bold"> Button </button>
     </div>
 </div>
 <!-- Box End -->

Alerts

.alert-primary
 <!-- Alert Start -->
 <div class="alert alert-primary" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-secondary
 <!-- Alert Start -->
 <div class="alert alert-secondary" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-success
 <!-- Alert Start -->
 <div class="alert alert-success" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-warning
 <!-- Alert Start -->
 <div class="alert alert-warning" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-danger
 <!-- Alert Start -->
 <div class="alert alert-danger" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-info
 <!-- Alert Start -->
 <div class="alert alert-info" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-light
 <!-- Alert Start -->
 <div class="alert alert-light" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->
.alert-dark
 <!-- Alert Start -->
 <div class="alert alert-dark" role="alert">
     <span>Alert Text</span>
 </div>
 <!-- Alert End -->

Icon Boxes

 <!-- Card Start -->
 <div class="card text-center hvr-float shadow">
     <i class="text-size-5 icofont-license text-primary"> </i>
     <div class="card-body">
         <h5 class="card-title">Licensed &amp; Insured</h5>
         <p class="card-text text-muted">Lorem ipsum dolor sit amet, consectetur adipis cing elit. Nullam id arcu tortor. Sed eget sit ame egestas, cursus felis quis, vestibulum.</p>
     </div>
 </div>
 <!-- Card End -->
Licensed & Insured

Lorem ipsum dolor sit amet, consectetur adipis cing elit. Nullam id arcu tortor. Sed eget sit ame egestas, cursus felis quis, vestibulum.

Licensed & Insured

Lorem ipsum dolor sit amet, consectetur adipis cing elit. Nullam id arcu tortor. Sed eget sit ame egestas, cursus felis quis, vestibulum.

 <!-- Contact Box Start -->
 <div class="row no-gutters pt-3 pb-3">
     <div class="col-2 position-relative text-primary">
         <i class="icofont-license text-size-2 is-centered"></i>
     </div>
     <div class="col-10">
         <a class="d-block">demo@demo.com</a>
     </div>
 </div>
 <!-- Contact Box End -->

Team Members

.image-hover-primary
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-primary shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-secondary
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-secondary shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-success
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-success shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-warning
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-warning shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-danger
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-danger shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-info
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-info shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-light
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-light shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->
.image-hover-dark
Tom Smith Plumber
 <!-- Team Member Start -->
 <figure class="image-hover-dark shadow">
     <img class="img-fluid" src=" assets/img/team/team-1.jpg " />
     <figcaption>
         <a class="font-weight-bolder" href="#"> Tom Smith <i class="icofont-arrow-right"></i> </a>
         <span>Plumber</span>
     </figcaption>
 </figure>
 <!-- Team Member End -->

Author Box

 <!-- Author Box Start -->
 <hr />
 <div class="row no-gutters mt-5 mb-5">
     <div class="col-12 col-lg-3 text-center">
         <img class="img-fluid rounded-circle author-thumbnail shadow" alt="author box" src="assets/img/main/author.png" />
     </div>
     <div class="col-12 col-lg-8">
         <h4 class="text-center text-md-left">
             <small>Author</small> Tom Smith </h4>
         <p class="text-muted"> Nunc ultrices hendrerit libero vel malesuada. Nulla facilisi. Quisque eu placerat augue, sed vestibulum leo. Etiam turpis metus, dignissim tincidunt pharetra ultricies, lobortis at ligula. </p>
         <div class="d-inline">
             <small>Follow Me: </small>
             <ul class="list-unstyled list-inline d-inline p-2">
                 <li class="list-inline-item"><a href="#"><i class="icofont-linkedin"></i></a> </li>
                 <li class="list-inline-item"><a href="#"><i class="icofont-twitter"></i> </a></li>
             </ul>
         </div>
     </div>
     <!-- Author Box Stop -->
 </div>
 <hr />

author box

Author Tom Smith

Nunc ultrices hendrerit libero vel malesuada. Nulla facilisi. Quisque eu placerat augue, sed vestibulum leo. Etiam turpis metus, dignissim tincidunt pharetra ultricies, lobortis at ligula.

Follow Me:

Testimonials

Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-primary text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-primary">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-secondary text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-secondary">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-success text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-success">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-warning text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-warning">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-danger text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-danger">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-info text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-info">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-light text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-light">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->
Testimonial
Testimonial
- Gabby Allen
 <!--  Testimonial Start -->
 <div class="testimonial-dark text-center">
     <div class="row">
         <div class="col-12 text-center">
             <img class="img-fluid rounded-circle" alt="Testimonial" src="assets/img/testimonials/testi-1.png" />
         </div>
         <div class="col-12">
             <blockquote class="mt-3">
                 <q> Testimonial </q>
             </blockquote>
             <b class="d-block"> - Gabby Allen</b>
             <ul class="list-inline list-unstyled text-dark">
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
                 <li class="list-inline-item">
                     <i class="icofont-star"></i>
                 </li>
             </ul>
         </div>
     </div>
 </div>
 <!-- Testimonial End -->

Coupons

 <!-- Coupon Start -->
 <div class="bg-light overflow-hidden p-1 rounded shadow-sm hvr-grow-rotate">
     <div class="p-2 border-dashed-2">
         <h1 class="p-1 text-center"> $15 <small>OFF</small>
         </h1>
         <div class="text-center">
             <p> Water Softener &amp; or Reverse Osmosis Installation </p>
             <button class="btn btn-warning btn-lg font-weight-bold">
                 <i class="icofont-print pr-1"></i> Click to Print </button>
         </div>
         <div class="text-center mt-2">
             <small> *Must be presented at the time of service. Can not be combined with any other offer.* </small>
         </div>
     </div>
 </div>
 <!-- Coupon End -->

$15 OFF

Water Softener & or Reverse Osmosis Installation

*Must be presented at the time of service. Can not be combined with any other offer.*

$50 OFF

Water Softener & or Reverse Osmosis Installation

*Must be presented at the time of service. Can not be combined with any other offer.*

Free Checkup

Water Softener & or Reverse Osmosis Installation

*Must be presented at the time of service. Can not be combined with any other offer.*