I have a carousel with cards that will hold content, viewed like you would view a book, I would like them to flip through the full array of cards, with the choice of going forwards and backwards.

The set up I have works if you continuously click on either the next or previous sections, if you click going the opposite way the cards will end up in the correct position, however the transitions are messed up.

Are you able to help me solve the transition issue?

I have attached a link to a CodePen

https://codepen.io/NPGB88/pen/GRxjJbq

enter code here