Change icon for mobile hamburger icon and close icon

Site URL: https://redsquirrelcreative.uk/

Hi there,

I am looking for some custom CSS to change the icons for my mobile hamburger icon and the close icon once the menu is open. I am using Squarespace 7.1 with the Utica template if this helps. Any help would be greatly appreciated.

Kind regards,

Chris.

Hi. Use this code

/* Non-active burger */
.burger-inner:after {
    content: "";
    background-image: url(https://static1.squarespace.com/static/605902fc028a4738b5242b8c/t/606a578bc386f915f4ca8ffa/1617581963256/acorn.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    background-color: transparent !important;
    display: block;
    width: 37px;
    height: 37px;
}
.burger-inner>div {
    display: none !important;
}
/* Burger when active */
body.header--menu-open .burger-inner:after {
	background-image: url(https://cdn.pixabay.com/photo/2018/03/11/14/09/eggs-3216877_960_720.jpg) !important;
}