I can see that you have set the height of slide class to 500px and image under slide class to 100% , that's why the ratio is not matching as the image height always remain 500px.

.slides {
  width: 500%;
  /*removed height */
  display: flex;
}

Now it will work