Adding Iconography

Hi, I've reviewed other people's questions and problems with this exercise but mine seems to not be the same. When I add the image for the iconography into main.css, there are no icons appearing on my webpage. The mail, twitter, and phone images are all in the image folder.

My CSS looks like this: .contact-info { list-style:none; padding: 0; margin: 0; font-size: 0.9em; }

.contact-info a { display: block; min-height: 20px; background-repeat: no-repeat; background-size; 20px 20px; padding: 0 0 0 30px; }

.contact-info li.phone a { background-image: url('/..img/phone.png'); }

.contact-info li.mail a { background-image: url('/..img/mail.png'); }

.contact-info li.twitter a { background-image: url('/..img/twitter.png'); }

And my HTML for my contact page looks like this:

<section> <h3>Contact details</h3> <ul class="contact-info"> <li class="phone"><a href="tel:555-6425">555-6425</a></li> <li class="mail"><a href="mailto:nick@example.com">nick@example.com</a></li> <li class="twitter"><a href="http://twitter.com/intent/tweet?screen_name=nickrp">@nickrp</a></li>
</ul> </section>