header{
    margin-bottom: 20px;
}

.slider{
    /* min-width: 100vh; */
    margin: 0 5%; /* Define a margem esquerda e direita como 5% */
    width: calc(90vw - 1%); /* Calcula o width da imagem para ocupar 90% da largura da viewport (tela), descontando as margens */
    max-width: 100%; /* Limita o width da imagem a 100% para que não exceda a largura máxima do container */
    height: 250px;
    /* margin: auto; */
    position: relative;
    /* width: 90%; */ 
    display: grid;
    place-items: center;
    overflow: hidden;
}

.slide-track{
    display: flex;
    /* width: calc(250px * 26); */
    animation: scroll 40s linear infinite;
    overflow: hidden;
}

/* Ao passar com o rato por cima a imagem pára */
.slide-track:hover{
    animation-play-state: paused;
}

/* Slide automático */
@keyframes scroll{
    0%{
        transform: translateX(0);
    }
    100%{
        transform: translateX(calc(-250px * 13));
    }
}

.slide{
    height: 550px;
    width: 650px;
    display: flex;
    align-items:unsafe;
    padding: 15px; /* distancia entre imagens */
    perspective: 100px;
    overflow: hidden;
}

img{
    height: 100%;
    transition: transform 1s;
}

img:hover{
    transform: translateZ(20px);
}

/* Para telemóveis - tamanho do slider */
@media (max-width: 698px) {
    .slider{
        /* min-width: 40vh; */ 
        height: 450px;
    }
  }