Custom cursor issue : flickering and disappearing

Site URL: https://juliettebinet.fr/

Hello everyone, I thought I had found the right code to replace the traditional arrow cursor by a custom one and it was working fine for some time but for a reason I can't explain, the custom cursor is now not working properly as you can see in the video. It's flickering and disappearing in a very weird way. Sometimes it's disappearing and coming back to the normal cursor after 2sc when I don't move. Sometimes it goes off after hovering a link. 

I deactivated it because the website is now online and available for everyone but here is the code I used. It was a bit tricky because I had some issues with gallery images. 

Any clue what could be going wrong ? 

/*Custom cursor A - in general*/
html, body {
cursor: url(https://juliettebinet.fr/s/Cursor_A.png),auto !important;
}

/*Custom B - on hover for links*/
p a, h1 a, h2 a, h3 a, h4 a, 
h5 a, h6 a, h7 a, h8 a, h9 a, {
cursor: url(https://juliettebinet.fr/s/Cursor_B.png), auto !important;
}


/*Custom B - cursor on hover for images thats are links*/
.sqs-block-image a img {
cursor: url(https://juliettebinet.fr/s/Cursor_B.png), auto !important;
}

/*Custom cursor B - on hover for images galleries that are clickable to open a lightbox*/
.sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor[href] img{
cursor: url(https://juliettebinet.fr/s/Cursor_B.png), auto !important;
}*/

/*Custom cursor A - fix for images galleries that don't open a lightbox*/
.sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor {
     cursor: url(https://juliettebinet.fr/s/Cursor_A.png), auto !important;
   }