#portfolioModal .modal-dialog {
    max-width: 100%;
    min-height: calc(100% - 60px);
    display: flex;
}

#portfolioModal .modal-dialog {
    max-width: calc(100% - 100px);
    width: 100%;
    border-radius: 20px;
    overflow: hidden;
}


@media (max-width: 899px) {
    #portfolioModal .modal-dialog {
        max-width: 100%;
    }
}

#portfolioModal .modal-content {
    border: none;
    background-color: var(--bg-1);
}

@media (min-width: 576px) {
    .modal-body img {
        max-width: 100%;
    }
}


#portfolioModal .modal-body {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    background-color: #f5f5f5;
    align-items: flex-start;
    overflow-y: scroll;
}


#portfolioModal .modal-body p {
    width: 100%;
}


#portfolioModal .modal-body img {
    max-width: 100%;
    width: 35rem;
    box-shadow: var(--box-shadow-standard);
    border-radius: 5px;
}


.invert .btn-close {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}

.show {
    display: flex;
    justify-content: center;
}