.swiper-pagination {
    color: var(--dotcolor);
}


@media (max-width: 1024px) {
    body {
        width: 100vw;

    }

    .swiper-pagination {
        /* position: fixed;
        top: 1em;
        left: 0;
        width: 100%;
        text-align: center; */
        color: var(--randomcolor);

    }

    div.images {
        display: grid;
        grid-template-columns: repeat(1, 1fr);

        gap: .5em;
        grid-template-rows: auto;
        width: 100vw;
    }

    .informations {

        grid-row: 3;
        grid-column: 1/-1;

    }

    .project-title {

        grid-row: 1;
        grid-column: 1/-1;
    }

    .swiper {
        grid-row: 2;
        height: 100%;
        grid-column: 1/-1;
        width: 100vw;
        margin-top: 0;
    }

    .swiper picture img,
    .swiper picture {
        width: 100vw;
        height: 100%;
    }

    .swiper-wrapper {
        height: 100%
    }
}