// javascript

    const cards = document.getElementsByClassName("card");
    let current = 0;
    let show = 0;
    const length = (cards.length - 1);
    document.querySelector(".next").addEventListener("click",() => {
        cards[current].classList.remove("current");
        if(current == length) {
            show = 0;
            current = 0;
        } else {
            current += 1;
            show -= 220;
        }
        cards[current].classList.add("current");
        document.querySelector(".gallery").style.transform = `translateX(${show}px)`;      
       
    })
        document.querySelector(".previous").addEventListener("click",() => {
        cards[current].classList.remove("current");
        if(current == 0) {
            show = -(220 * length);
            current = length;
        } else {
            current -= 1;
            show += 220;
        }
        cards[current].classList.add("current");
        document.querySelector(".gallery").style.transform = `translateX(${show}px)`;      
       
    })