Why is my CSS code not taking effect on my website?

Hey! So I'm working in the contact page of my portfolio project and the html worked fine but now that I'm trying to style it with CSS, the CSS is just having no effect whatsoever on the look of the sit (ex. the bullets are still there, its still justified left)

Here is the link to my workspace https://w.trhou.se/q59v4jgn14

Also here is the code I think is relevent

HTML <section> <h3>Contact Details </h3> <ul class:"contact-info"> <li class:"mail"> <a href="mailto": asymeonidestsatsos@gmail.com> asymeonidestsatsos@gmail.com </a></li> </ul> </section>

CSS

.contact-info { list-style: none; padding: 0; margin: 0; font-size: 0.9em; }

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

}

Thank you so much!! <3