Changing header link icons to custom ones?

Site URL: http://www.mimiceramics.com

I'm trying to customize my header links with different icons. I was able to change the shopping cart icon to my own, but I can't seem to figure out the customer login icon. This is the default:

 I'd like to change it to the one I've already loaded to the Squarespace site:

uploaded image

Any help would be great, thank you!

Add to Home > Design > Custom CSS

.user-accounts-icon {
    background-image: url(https://cdn.pixabay.com/photo/2020/12/19/03/27/person-5843476__340.jpg);
    background-size: contain;
    background-repeat: no-repeat;
}
.user-accounts-icon * {
    visibility: hidden;
}

wow im so sorry i saw this so late but THANK YOU! it finally worked!!

17 minutes ago, msdema said:

wow im so sorry i saw this so late but THANK YOU! it finally worked!!

Your site has white bar on right of screen. Do you want to fix this?

yes please. i've been struggling with some coding making things looks weird.

i also have one other request. the header every page looks how i want, except on product details pages. how can i make them match?

On 3/9/2021 at 7:17 AM, msdema said:

yes please. i've been struggling with some coding making things looks weird.

 

i also have one other request. the header every page looks how i want, except on product details pages. how can i make them match?

Hi. Sorry for the delay. With white bar, add this to Design > Custom CSS

html, body {
	overflow-x: hidden;
}

With product page, can you explain clearly?

16 hours ago, tuanphan said:

Hi. Sorry for the delay. With white bar, add this to Design > Custom CSS

html, body {
	overflow-x: hidden;
}

With product page, can you explain clearly?

thank you so much! and as for the product page i actually figured it out 🙂 thank you!