@media (min-width: 956px) {
    
    .root-container {
        grid-template-rows: repeat(2, auto);
    }

    .top-container {
        grid-row: 1;
        grid-template: auto / repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .d-sm-none {
        display: none !important;
    }

    .d-sm-block {
        display: block !important;
    }

    .d-sm-flex {
        display: flex !important;
    }

    .d-sm-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 280px) {
    .d-280-none {
        display: none !important;
    }

    .d-280-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 320px) {
    .d-320-none {
        display: none !important;
    }

    .d-320-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 360px) {
    .d-360-none {
        display: none !important;
    }

    .d-360-inline-block {
        display: inline-block !important;
    }
}