Add Iconography: I can't get the telephone, e-mail, or Twitter images to appear on my Contact page at all.

Here's my contact.html code:

<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>

Here's my main.css code:

/******************************* PAGE: CONTACT *******************************/

.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; margin: 0 0 0 10px; }

.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'); }

I can't locate the problem.