Bootstrap nav-stacked row padding/height change?

Question

I'm attempting to change the padding or row height for my sidebar nav-stacked object. I'll post a screen shot of the area I want to reduce. Any help would be awesome! Thanks.

<div class="col-md-12" id="leftCol">
    <ul class="nav nav-stacked" id="sidebar">                
        <li class="active"><a href="#"><i class="fa fa-home"></i> - Home</a></li>
        <li><a href="#"><i class="fa fa-info-circle"></i> - About Us</a></li>
        <li><a href="#"><i class="fa fa-bar-chart-o"></i> - Analytics</a></li>
        <li><a href="#"><i class="fa fa-square"></i> - News</a></li>
        <li><a href="#"><i class="fa fa-bullhorn"></i> - Marketing</a></li>
        <li><a href="#"><i class="fa fa-lightbulb-o"></i> - Ideas?</a></li>
        <li><a href="#"><i class="fa fa-shield"></i> - TOS</a></li>
    </ul>
</div>

Here is a link to a picture of the issue:

!https://drive.google.com/file/d/0B1kb6y5-dmmFdXVSa3hyU2NLbmM/edit?usp=sharing

Answer 1

Override the current padding as follows.

.nav>li>a {
    padding: 1px; //whatever values you want...
}

The default padding comes from the rule below...

.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}