Hey guys, I hope you’re keeping safe.
Can anyone please enlighten me about what I’m doing wrong in the following CSS & HTML files to not make the animation works? (I’m going through the 300 hours course so I’m at very basic level 
)
CSS file:
.airplane {
position: absolute;
background: rgba(0, 0, 247, 0.938);
margin-top: 100px;
margin-left: 100px;
width: 160px;
height: 60px;
border-radius: 35%;
}
}
#anim {
animation-name: anim;
animation-duration: 5s;
}
@keyframes anim {
0% {
background-color: red, white, green;
left: 100px;
top: 100px;
}
50% {
background-color : red,white,green, blue;
left: 200px;
top: 100px;
}
100% {
background-color : white,blue,red;
left: 300px;
top: 100px;
}
}
HTML file:
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="C:\Users\Daniele\Desktop\NEW ME\CODING\FIRST PROJECT\BLOG PERSONALE\airplane.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="wing3"></div>
<div class="wing4"></div>
<div class="wing2"></div>
<div class="wing1"></div>
<div id="anim" class="airplane"></div>
</body>
</html>
P.S. Ignore the other classes in the HTML file as they are just other part or the image I would like to create.
Thanks.
