Portfolio website review + an issue with animated background

Hello everyone!

I would greatly appreciate your feedback on my website

Also I have some issue with flickering background. Any ideas to fix this?
Here is the snippet of code:

html, body {
    background-color: black;
    background: url(../images/1.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    animation: animatedBackground 40s infinite;
    animation-delay: 0s;
    overflow: hidden;
    backface-visibility: hidden; 
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility:    hidden;
    -ms-backface-visibility:     hidden;
    -webkit-transform: translate3d(0, 0, 0);

@keyframes animatedBackground {
    0% {
        background-image: url('../1.jpg');

    35% {
        background-image: url('../2.jpeg');

    70% {
        background-image: url('../3.jpeg');

    100% {
        background-image: url('../1.jpeg');

Thank you!

Hi @Dmitriifs
I’ve copied your code into a Codepen and can’t see a flickering issue, although it’s hard as I’ve used placeholder images.
What were you trying to achieve with your animation?

Hi @blueoctoltd!
I want to make a background where one image smoothly flows into another one. And I’ve achieved it but with a side effect as background flickering. Take a look at my website where it will be easier to notice it - website .

I’ve just updated my website and look for feedback: https://dmitrii-frolov.com.