<footer id="footer"> <style> #toast { visibility: hidden; max-width: 50px; height: 50px; /*margin-left: -125px;*/ margin: auto; background-color: #333; color: #fff; text-align: center; border-radius: 2px; position: fixed; z-index: 10; left: 0;right:0; bottom:30px; font-size: 17px; white-space: nowrap; } #toast #img{ width: 50px; height: 50px; float: left; padding-top: 16px; padding-bottom: 16px; box-sizing: border-box; background-color: #111; color: #fff; } #toast #desc{ color: #fff; padding: 16px; overflow: hidden; white-space: nowrap; } #toast.show { visibility: visible; -webkit-animation: fadein 0.5s, expand 0.5s 0.5s,stay 3s 1s, shrink 0.5s 2s, fadeout 0.5s 2.5s; animation: fadein 0.5s, expand 0.5s 0.5s,stay 3s 1s, shrink 0.5s 4s, fadeout 0.5s 4.5s; } @-webkit-keyframes fadein { from {bottom: 0; opacity: 0;} to {bottom: 30px; opacity: 1;} } @keyframes fadein { from {bottom: 0; opacity: 0;} to {bottom: 30px; opacity: 1;} } @-webkit-keyframes expand { from {min-width: 50px} to {min-width: 350px} } @keyframes expand { from {min-width: 50px} to {min-width: 350px} } @-webkit-keyframes stay { from {min-width: 350px} to {min-width: 350px} } @keyframes stay { from {min-width: 350px} to {min-width: 350px} } @-webkit-keyframes shrink { from {min-width: 350px;} to {min-width: 50px;} } @keyframes shrink { from {min-width: 350px;} to {min-width: 50px;} } @-webkit-keyframes fadeout { from {bottom: 30px; opacity: 1;} to {bottom: 60px; opacity: 0;} } @keyframes fadeout { from {bottom: 30px; opacity: 1;} to {bottom: 60px; opacity: 0;} } </style> <div id="toast"><div id="desc"> login desc</div></div> <!-- top footer --> <div class="section"> <!-- container --> <div class="container"> <!-- row --> <div class="row"> <div class="col-md-3 col-xs-6"> <div class="footer"> <h3 class="footer-title">About Us</h3> <p>This is a cool shopping site for those who are interested.</p> <ul class="footer-links"> <li><a href="https://www.google.com/maps/place/Montreal,+QC/"><i class="fa fa-map-marker"></i>Montreal, Canada</a></li> <li><a href="tel:+14385963135"><i class="fa fa-phone"></i>438-596-3135</a></li> <li><a href="mailto:batuhanbasoglu@mailbox.org"><i class="fa fa-envelope-o"></i>batuhanbasoglu@mailbox.org</a></li> </ul> </div> </div> <div class="col-md-6 text-center" style="margin-top:80px;"> <ul class="footer-payments"> <li><a href="#"><i class="fa fa-cc-visa"></i></a></li> <li><a href="#"><i class="fa fa-credit-card"></i></a></li> <li><a href="#"><i class="fa fa-cc-paypal"></i></a></li> <li><a href="#"><i class="fa fa-cc-mastercard"></i></a></li> <li><a href="#"><i class="fa fa-cc-discover"></i></a></li> <li><a href="#"><i class="fa fa-cc-amex"></i></a></li> </ul> <span class="copyright"> Copyright ©<script>document.write(new Date().getFullYear());</script> All rights reserved </span> </div> <div class="col-md-3 col-xs-6"> <div class="footer"> <h3 class="footer-title">Categories</h3> <ul class="footer-links"> <li><a href="products.php?cat_id=1">Electronics</a></li> <li><a href="products.php?cat_id=2">Women</a></li> <li><a href="products.php?cat_id=3">Men</a></li> <li><a href="products.php?cat_id=4">Kids</a></li> <li><a href="products.php?cat_id=5">Furnitures</a></li> <li><a href="products.php?cat_id=6">Home Appliances</a></li> </ul> </div> </div> <div class="clearfix visible-xs"></div> </div> <!-- /row --> </div> <!-- /container --> </div> <!-- /top footer --> <!-- bottom footer --> <!-- /bottom footer --> </footer> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/slick.min.js"></script> <script src="js/nouislider.min.js"></script> <script src="js/jquery.zoom.min.js"></script> <script src="js/main.js"></script> <script src="js/actions.js"></script> <script src="js/sweetalert.min"></script> <script src="js/jquery.payform.min.js" charset="utf-8"></script> <script src="js/script.js"></script> <script>var c = 0; function menu(){ if(c % 2 == 0) { document.querySelector('.cont_drobpdown_menu').className = "cont_drobpdown_menu active"; document.querySelector('.cont_icon_trg').className = "cont_icon_trg active"; c++; }else{ document.querySelector('.cont_drobpdown_menu').className = "cont_drobpdown_menu disable"; document.querySelector('.cont_icon_trg').className = "cont_icon_trg disable"; c++; } } </script> <script type="text/javascript"> $('.block2-btn-addcart').each(function(){ var nameProduct = $(this).parent().parent().parent().find('.block2-name').html(); $(this).on('click', function(){ swal(nameProduct, "is added to cart !", "success"); }); }); $('.block2-btn-addwishlist').each(function(){ var nameProduct = $(this).parent().parent().parent().find('.block2-name').html(); $(this).on('click', function(){ swal(nameProduct, "is added to wishlist !", "success"); }); }); </script>