/*
Thanks to these fine individuals from Unsplash:
https://unsplash.com/photos/AmzKuEnr1VY
https://unsplash.com/photos/eDnJQL21amc
https://unsplash.com/photos/LXy2DOOxESQ
https://unsplash.com/photos/KBKHXjhVQVM
https://unsplash.com/photos/PxM8aeJbzvk
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600&display=swap');

html, body {
    margin: 0;
    padding: 0;
    height: 100vh;
    font-family: 'Playfair Display';
    display: grid;
    justify-content: center;
}

img {
    width: 200px;
}

.previous, .next {
    width: 35px;
}

.previous.disabled, .next.disabled {
    cursor: default;
}


.disabled {
    opacity: .3;
}

.transition-slide {
    transition: transform linear .8s ease-in-out;
}

.container {
    display: grid;
    grid-template-columns: 20% 200px 20%;
    place-content: center;
}

.gallery-wrapper {
    overflow: hidden;
    width: 100%;
}

.previous, .next {
    justify-self: center;
    align-self: center;
    cursor: pointer;
}

.gallery {
    transform-style: preserve-3d;
    display: grid;
    grid-template-columns: repeat(5, auto);
    transform: translateX(0);
}


.card {
    margin-right: 20px;
    align-self: center;
}