## Footer

- Home
- Shortcodes
- Footer

## Footer style 1

        <!-- FOOTER START -->
        <footer>
        <!-- Footer-area start -->
        <div class="footer-area elements-footer">
        <div class="container">
        <div class="row">
        <div class="col-lg-4 col-md-6">
        <div class="single-footer">
        <h3 class="footer-title  title-border">Contact Us</h3>
        <ul class="footer-contact">
        <li><span>Address :</span>28 Green Tower, Street Name,<br>New York City, USA</li>
        <li><span>Cell-Phone :</span>012345 - 123456789</li>
        <li><span>Email :</span>your-email@gmail.com</li>
        </ul>
        </div>
        </div>
        <div class="col-lg-2 col-md-3">
        <div class="single-footer">
        <h3 class="footer-title  title-border">accounts</h3>
        <ul class="footer-menu">
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>My Account</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>My Wishlist</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>My Cart</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Sign In</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Check out</a></li>
        </ul>
        </div>
        </div>
        <div class="col-lg-2 col-md-3">
        <div class="single-footer">
        <h3 class="footer-title  title-border">shipping</h3>
        <ul class="footer-menu">
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>New Products</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Top Sellers</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Manufactirers</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Suppliers</a></li>
        <li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Specials</a></li>
        </ul>
        </div>
        </div>
        <div class="col-lg-4 col-md-6">
        <div class="single-footer">
        <h3 class="footer-title  title-border">your choice Products</h3>
        <div class="footer-product">
        <div class="row">
        <div class="col-md-6">
        <div class="footer-thumb">
        <a href="#"><img src="img/footer/1.jpg" alt="" /></a>
        <div class="footer-thumb-info">
        <p><a href="#">Furniture Product<br>Name</a></p>
        <h4 class="price-3">$ 60.00</h4>
        </div>
        </div>
        </div>
        <div class="col-md-6">
        <div class="footer-thumb">
        <a href="#"><img src="img/footer/1.jpg" alt="" /></a>
        <div class="footer-thumb-info">
        <p><a href="#">Furniture Product<br>Name</a></p>
        <h4 class="price-3">$ 60.00</h4>
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        <!-- Footer-area end -->
        <!-- Copyright-area start -->
        <div class="copyright-area">
        <div class="container">
        <div class="row">
        <div class="col-md-6">
        <div class="copyright">
        <p class="mb-0">&copy; <a href=" https://themeforest.net/user/codecarnival/portfolio " target="_blank"> CodeCarnival  </a> 2021. All Rights Reserved.</p>
        </div>
        </div>
        <div class="col-md-6">
        <div class="payment  text-md-end">
        <a href="#"><img src="img/payment/1.png" alt="" /></a>
        <a href="#"><img src="img/payment/2.png" alt="" /></a>
        <a href="#"><img src="img/payment/3.png" alt="" /></a>
        <a href="#"><img src="img/payment/4.png" alt="" /></a>
        </div>
        </div>
        </div>
        </div>
        </div>
        <!-- Copyright-area start -->
        </footer>
        <!-- FOOTER END -->

        .footer-area {
          background: #f6f6f6 none repeat scroll 0 0;
          padding: 120px 0 75px;
        }
        .footer-title {
          font-size: 20px;
          font-weight: 900;
          line-height: 15px;
          margin-bottom: 25px;
          padding-bottom: 10px;
          text-transform: uppercase;
        }
        .footer-title.title-border::before {
          background: #c87065 none repeat scroll 0 0;
        }
        .footer-contact li {
          display: block;
          overflow: hidden;
          padding-bottom: 15px;
        }
        .footer-contact li:last-child { padding-bottom: 0;}
        .footer-contact li span {
          float: left;
          font-size: 14px;
          font-weight: 700;
          line-height: 24px;
          width: 95px;
        }
        .footer-menu li a {
          color: #666666;
          line-height: 27px;
        }
        .footer-menu li a i { margin-right: 10px;}
        .footer-menu li a:hover { color: #C8A165;}
        .footer-thumb {
          overflow: hidden;
          position: relative;
        }
        .footer-thumb > a {
          display: block;
          position: relative;
        }
        .footer-thumb > a::before {
          background: #c8a165 none repeat scroll 0 0;
          content: "";
          height: 100%;
          opacity: 0.5;
          position: absolute;
          top: 100%;
          width: 100%;
        }
        .footer-thumb:hover a::before { top: 0;  }
        .footer-thumb-info {
          height: 100%;
          left: 0;
          padding: 10px 15px;
          position: absolute;
          top: 100%;
          transition: all 0.5s ease 0s;
          visibility: hidden;
          width: 100%;
          z-index: 2;
        }
        .footer-thumb-info p {
          line-height: 15px;
          text-transform: capitalize;
        }
        .price-3 {
          font-size: 16px;
          line-height: 15px;
        }
        .footer-thumb-info p a, .price-3 { color: #fff;}
        .footer-thumb:hover .footer-thumb-info {
          top: 0;
          visibility: visible;
        }
        .copyright, .payment { line-height: 60px;}
        .payment a {
          display: inline-block;
          margin-left: 10px;
        }
        .payment a:first-child { margin-left: 0;}
        .copyright-area { background: #eeeeee none repeat scroll 0 0;}