


* {
    box-sizing: border-box;
}

.grid-25 {
    grid-template-columns: repeat(25, 1fr);
}

.grid-24 {
    grid-template-columns: repeat(24, 1fr);
}

.grid-23 {
    grid-template-columns: repeat(23, 1fr);
}

.grid-22 {
    grid-template-columns: repeat(22, 1fr);
}

.grid-21 {
    grid-template-columns: repeat(21, 1fr);
}

.grid-20 {
    grid-template-columns: repeat(20, 1fr);
}

.grid-19 {
    grid-template-columns: repeat(19, 1fr);
}

.grid-18 {
    grid-template-columns: repeat(18, 1fr);
}

.grid-17 {
    grid-template-columns: repeat(17, 1fr);
}

.grid-16 {
    grid-template-columns: repeat(16, 1fr);
}

.grid-15 {
    grid-template-columns: repeat(15, 1fr);
}

.grid-14 {
    grid-template-columns: repeat(14, 1fr);
}

.grid-13 {
    grid-template-columns: repeat(13, 1fr);
}

.grid-12 {
    grid-template-columns: repeat(12, 1fr);
}

.grid-11 {
    grid-template-columns: repeat(11, 1fr);
}

.grid-10 {
    grid-template-columns: repeat(10, 1fr);
}

.grid-9 {
    grid-template-columns: repeat(9, 1fr);
}

.grid-8 {
    grid-template-columns: repeat(8, 1fr);
}

.grid-7 {
    grid-template-columns: repeat(7, 1fr);
}

.grid-6 {
    grid-template-columns: repeat(6, 1fr);
}

.grid-5 {
    grid-template-columns: repeat(5, 1fr);
}

.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid-1 {
    grid-template-columns: repeat(1, 1fr);
}

.grid-25, .grid-24, .grid-23, .grid-22, .grid-21, .grid-20, .grid-19, .grid-18, .grid-17, .grid-16, .grid-15, .grid-14, .grid-13, .grid-12, .grid-11, .grid-10, .grid-9, .grid-8, .grid-7, .grid-6, .grid-5, .grid-4, .grid-3, .grid-2, .grid-1 {
    width: 100%;
    display: grid;
    grid-column-gap: 0rem;
    grid-row-gap: 0rem;
}

.gridStart {
    align-content: start;
}

.gap {
    grid-column-gap: var(--m);
    grid-row-gap: var(--m);
}
.lrMargin {
    padding-left: calc(var(--m) * 2);
    padding-right: calc(var(--m) * 2);
}
.tbMargin {
    padding-top: calc(var(--m) * 1);
    padding-bottom: calc(var(--m) * 1);
}

.it-1 {
    grid-column: span 1;
}

.it-2 {
    grid-column: span 2;
}

.it-3 {
    grid-column: span 3;
}

.it-4 {
    grid-column: span 4;
}

.it-5 {
    grid-column: span 5;
}

.it-6 {
    grid-column: span 6;
}

.it-7 {
    grid-column: span 7;
}

.it-8 {
    grid-column: span 8;
}

.it-9 {
    grid-column: span 9;
}

.it-10 {
    grid-column: span 10;
}

.it-11 {
    grid-column: span 11;
}

.it-12 {
    grid-column: span 12;
}

.it-13 {
    grid-column: span 13;
}

.it-14 {
    grid-column: span 14;
}

.it-15 {
    grid-column: span 15;
}

.it-16 {
    grid-column: span 16;
}

.it-17 {
    grid-column: span 17;
}

.it-18 {
    grid-column: span 18;
}

.it-19 {
    grid-column: span 19;
}

.it-20 {
    grid-column: span 20;
}

.it-21 {
    grid-column: span 21;
}

.it-22 {
    grid-column: span 22;
}

.it-23 {
    grid-column: span 23;
}

.it-24 {
    grid-column: span 24;
}

.it-0 {
    display: none;
}

.it-1, .it-2, .it-3, .it-4, .it-5, .it-6, .it-7, .it-8, .it-9, .it-10, .it-11, .it-12, .it-13, .it-14 {
    /* border: 1px solid red; */
}

@media screen and (orientation: portrait) {
    .rgrid-14 {
        display: grid;
        grid-template-columns: repeat(14, 1fr);
    }

    .rgrid-12 {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
    }

    .rgrid-11 {
        display: grid;
        grid-template-columns: repeat(11, 1fr);
    }

    .rgrid-10 {
        display: grid;
        grid-template-columns: repeat(10, 1fr);
    }

    .rgrid-9 {
        display: grid;
        grid-template-columns: repeat(9, 1fr);
    }

    .rgrid-8 {
        display: grid;
        grid-template-columns: repeat(8, 1fr);
    }

    .rgrid-7 {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
    }

    .rgrid-6 {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
    }

    .rgrid-5 {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
    }

    .rgrid-4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .rgrid-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .rgrid-2 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .rgrid-1 {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }

    .rt-0 {
        display: none;
    }

    .rt-1 {
        grid-column: span 1;
    }

    .rt-2 {
        grid-column: span 2;
    }

    .rt-3 {
        grid-column: span 3;
    }

    .rt-4 {
        grid-column: span 4;
    }

    .rt-5 {
        grid-column: span 5;
    }

    .rt-6 {
        grid-column: span 6;
    }

    .rt-7 {
        grid-column: span 7;
    }

    .rt-8 {
        grid-column: span 8;
    }

    .rt-9 {
        grid-column: span 9;
    }

    .rt-10 {
        grid-column: span 10;
    }

    .rt-11 {
        grid-column: span 11;
    }

    .rt-12 {
        grid-column: span 12;
    }

    .rt-14 {
        grid-column: span 14;
    }

    .it-0 {
        display: inherit;
    }
}
