@media (orientation: portrait) {

    .group-title,
    .group-description,
    .group-models {
        font-size: 2rem;
    }

    .groups {
        /* When Description will be added this will be changed */
        grid-template-rows: 10% 2% 88%;
        height: 100% !important;
    }

    .group-models {
        flex-direction: column;
        height: 100% !important;
        gap: 5%;
    }

    .model {
        max-width: 80%;
        max-height: 33% !important;
        flex: 1 1 0;
        min-height: 0;
    }

    .fancy-background {
        box-shadow: -15px 35px 30px rgba(0, 0, 0, 0.5);
    }

    #corner-top {
        scale: 0.6;
    }

    #corner-bottom {
        scale: 0.6;
    }

    #scroll-area {
        grid-gap: 5vw !important;
    }
}