#row-container,
#infos,
#first-row,
.btns {
    display: flex;
}

#affiche {
    display: flex;
    align-items: center;
    margin: 0 5%;
    img {
        border: 5px solid var(--border);
        border-radius: 0.75%;
        width: 400px;
    }
}

#infos {
    margin-right: 5%;
    flex-direction: column;
    color: white;
    font-size: 2rem;
}

#infos,
#first-row {
    justify-content: space-between;
}

h2 {
    text-decoration: underline;
}

ul {
    list-style: none;
    padding: 0;
}

#synopsis {
    text-align: justify;
}

.btns {
    justify-content: center;
    align-items: center;
}

.btn {
    padding-bottom: 0;

    img {
        max-width: 250px;
    }
}

.btn.soon {
    cursor: default;
    opacity: 0.3;
}

@media (max-width: 1100px) {
    .btn > img {
        max-width: 225px;
    }
}

@media (max-width: 1024px) {

    #infos, h2 {
        font-size: 1.7rem;
    }

    #affiche > img {
        width: 325px;
    }

    .btn > img {
        max-width: 225px;
    }
}

@media (max-width: 930px){
    .btn > img {
        max-width: 200px;
    }

    #affiche > img {
        width: 300px;
    }
}

@media (max-width: 850px){
    #row-container {
        flex-direction: column;
        align-items: center;
    }

    #voir-film {
        text-align: center;
        margin-bottom: 5%;
    }

    #infos {
        margin: 5%;
    }

    #first-row, .btns {
        flex-direction: column;
    }

    #affiche > img {
        width: 200px;
        margin: 0;
    }

    .btn > img {
        max-width: 250px;
    }
}