How can I get Fontawesome icons to display properly in the footer? Despite having my CSS and HTML files in the same directory, the icons remain invisible. Additionally, the page seems to be loading slower than usual. I have provided all necessary information, but the issue persists. Any suggestions or solutions would be greatly appreciated.
Here's my code:
footer {
background-color: #33383c !important;
padding: 70px 0px;
}
footer ul li {
padding: 5px 0px;
}
.adress span,
.contact span,
.social span {
color: #FFF !important;
font-weight: 800;
padding-bottom: 10px;
margin-bottom: 20px;
display: block;
text-transform: uppercase;
font-size: 20px;
letter-spacing: 3px;
}
.adress li p,
.contact li a,
.social li a {
color: #FFF !important;
letter-spacing: 2px;
text-decoration: none;
font-size: 15px;
}
.social li {
float: left;
}
.adress,
.contact,
.social {
list-style: none;
}
.fa {
color: white !important;
margin-right: 15px;
font-size: 14px;
}
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<footer>
<div class="container">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-4 col-xs-12">
<ul class="adress">
<span>Address</span>
<li>
<p>ENGLAND</p>
</li>
<li>
<p>+12905555555555</p>
</li>
<li>
<p><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="a5c4c7c6e5c2c8c4cc"><em>[email protected]</em></a></p>
</li>
</ul>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
<ul class="contact">
<span>Contact</span>
<li>
<a href="#">Contact Form</a>
</li>
<li>
<a href="#">About</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
<ul class="social">
<span>SOCIAL</span>
<li>
<a href="#"><i class="fa fa-facebook fa-2x" aria-hidden="true"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-github fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-linkedin fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-tumblr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-google-plus fa-2x"></i></a>
</li>
</ul>
</div>
</div>
</div>
</footer>