How to remove blank white space below footer? - html

Question

I tried to eliminate the white space according to the answered questions that I found. But not of them is working on my side.
I tried to remove the padding in div's footer, but still the white space still there.
How to fix this?
CSS:
footer #bottom-footer{ background: url(/files/bg-testimonials.jpg) no-repeat; background-repeat: no-repeat; background-size: cover; box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.52); color: #000; text-align: left; padding: 50px 0 50px 0; font-size: 0.8125em; font-family: 'Open Sans', sans-serif; font-weight: 600; letter-spacing: normal; position: relative; left: 0; bottom: 0; height: auto; width: 100%; }
.footer-wrap a{ color: #000; }
.footer-wrap a:hover{ color: #d31716; }
.footer-logo a{ margin-bottom: 6px; display: block; }
.footer-socials{ float: none; line-height: 0; text-align: center; padding: 1em 0 2em;}
.footer-socials a{ border-radius: 100%; border: 3px solid #FFF; color: #FFF; display: inline-block; font-size: 1.25em; line-height: 2.50em; margin-left: 0.1em; text-align: center; vertical-align: middle; width: 2.50em; height: 2.50em; }
.footer-socials .social-icons span{ cursor: pointer; display: inline-block; }
.footer-socials .socials i{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; }
.tagcloud a{ font-size: 13px !important; background: rgba(0,0,0,0.4); padding: 8px 10px; margin: 0 2px 4px 0; display: inline-block; line-height: 1; }
.sidebar .tagcloud a{ background: #23A38F; color: #FFF; }
.bottom-menu{ float: right; margin: 1em 4em 0 0; }
.bottom-menu ul{ list-style-type: none; font-size: 1.1125em; }
.bottom-menu ul li{ display: inline-block; font-family: 'Open Sans', sans-serif; font-weight: normal; line-height: 1.8; border-radius: 5px; border: 1px solid #CCC; box-shadow: 0 0 2px rgba(0,0,0,0.3); padding: 1em; margin: 0 0.10em 0 0; background: #FFF; color: #3e3e3e; }
.footerimg{ width:6em; }
.copyright{ margin: 2em 0 0 4em; }
.copyrighttext{ font-size: 1.08em; font-weight: 600; color: #B3B3B3; margin: 0 0 0 0.50em; }
#imgv ul{ list-style-type: none; letter-spacing: 1px; margin-top: -20px; font-size: 0.75em; }
#imgv ul li{ display: inline; }
.social-footer-mobile{ display: none; }
.footer-vertical-line{ border-top: 1px solid #8c8b8b;width: 9em; vertical-align: middle; position: relative; }
.left{ left: 32.50em; top: 1.65em; }
.right{ right: 32.50em; top: -1.45em; float: right; }
HTML:
<div id="bottom-footer" class="footer-menu">
<div class="ak-container">
<div class="footer-wrap clearfix">
<div class="footer-socials clearfix">
<div class="footer-vertical-line left"></div>
<div class="socials">
<span class="font-icon-social-facebook"></span>
<span class="font-icon-social-twitter"></span>
<span class="font-icon-social-youtube"></span>
<span class="font-icon-social-linkedin"></span>
</div>
<div class="footer-vertical-line right"></div>
</div>
<div class="footer-columns-4">
<ul>
<li>Products</li>
<li>All products</li>
<li>Standard loan</li>
<li>Promo loans</li>
<li>Insurance for loans</li>
</ul>
<ul>
<li>About Loans</li>
<li>How to apply</li>
<li>Our partner stores</li>
<li>Terms & Conditions</li>
<li>Safety guarantee</li>
</ul>
<ul>
<li>For Customers</li>
<li>Financial literacy</li>
<li>Payments & Guidelines</li>
<li>Menu</li>
<li>FAQ</li>
</ul>
<ul>
<li>Title</li>
<li>About us</li>
<li>News</li>
<li>Careers</li>
<li>Contacts</li>
</ul>
</div>
<nav role="navigation">
<div class="bottom-menu">
<ul class="footer-desktop-version">
<li><span class="footer-icon-cs icon-icon-support"></span>Customer Service: <strong>11111111</strong></li>
<li><span class="footer-icon-cs icon-icon-collection"></span>Collections <strong>1111111</strong></li>
</ul>
</div>
</nav>
<div class="copyright">
<img src="/files/footer.jpg" class="footerimg"><span class="copyrighttext"> All Rights Reserved ® 2017
Company Name</span>
</div><!-- .copyright -->
</div><!-- .footer-wrap -->
</div>
</div>

Answer 1

Your code shows nothing, perhaps you can't reveal your web address no problem.
You need to check something in your html any div or content area have minus value like top:-100px if you set something like this you need to change like margin-top:-100px

Answer 2

first you have to right click on the footer and click inspect
then you will see all the css applied to that particular element, select the parent element
check if bottom padding is applied to body or footer element
if you dont find bottom padding for footer or body element or other parent class of footer specify bottom padding in negative. (eg -5px)
note: you dont need to modify the css directly for testing purpose you can change and check the effect in debugging tool itself (f12 shortcut for debugging tool)
it should be something like:
(element name) { padding-bottom:-30px); }
also check for bottom margin if padding does not work.