bootstrap modal footer issue - css

Question

I have a minor css issue with my bootstrap footer found in the modal. There is a line that appears going across the top. It appears to be caused by the footer. I had the issue with header as well, but removed it and noticed its in the footer. Can someone take a peak to see what is going on?
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="container">
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Get Started</button>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content modal-lg">
<p>
<h3 style="margin-left:30px;">We've simplified our processes...</h3>
</p>
<div class="modal-body modal-lg">
<div class="container col-md-12">
<div class="row">
<div class="col-md-1">
<button type="button" class="btn btn-info btn-circle btn-lg"><i class="glyphicon glyphicon-cog"></i>
</button>
</div>
<div class="col-md-11">
<ul>
<li>Spent xyz</li>
<li>Spent xyz</li>
<li>Spent xyz</li>
</ul>
</div>
</div>
<button type="button" class="btn btn-primary btn-block">Annual campaign planning</button>
<br>
<div class="row">
<div class="col-md-3">
<button type="" class="btn btn-primary">Plan It</button>
<br>
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
<div class="col-md-3">
<button type="" class="btn btn-primary">Create It</button>
<br>
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
<div class="col-md-3">
<button type="" class="btn btn-primary">Deliver It</button>
<br>
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
<div class="col-md-3">
<button type="" class="btn btn-primary">Measure It</button>
<br>
<ul>
<li>1</li>
<li>2</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-footer modal-lg">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>

Answer 1

overiding .model-footer class will solve the issue.
.model-footer{
border:none;
}
Please let me know if this helped.

Answer 2

The issue is the footer's border-top. You can use this CSS to turn off the border:
.model-footer {
border-top:none;
}
It will work definitely !!