/********** designed by innovisual.net **********/

@charset "UTF-8";

/***** grid *****/

.grid {
    display: grid;
    position: relative;
    grid-auto-columns: auto;
    grid-auto-rows: auto;
    gap: 0;
}

.grid-gap-0 {
    gap: 0 !important;
}

.grid-gap-1x {
    gap: 1rem;
}

.grid-gap-2x {
    gap: 2rem;
}

.grid-gap-3x {
    gap: 3rem;
}

.grid-gap-4x {
    gap: 4rem;
}

.grid-gap-5x {
    gap: 5rem;
}

.cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

.cols-5 {
    grid-template-columns: repeat(5, 1fr);
}

.cols-6 {
    grid-template-columns: repeat(6, 1fr);
}

.cols-7 {
    grid-template-columns: repeat(7, 1fr);
}

.cols-8 {
    grid-template-columns: repeat(8, 1fr);
}

.cols-9 {
    grid-template-columns: repeat(9, 1fr);
}

.cols-10 {
    grid-template-columns: repeat(10, 1fr);
}

.rows-2 {
    grid-template-rows: repeat(2, 1fr);
}

.rows-3 {
    grid-template-rows: repeat(3, 1fr);
}

.rows-4 {
    grid-template-rows: repeat(4, 1fr);
}

.rows-5 {
    grid-template-rows: repeat(5, 1fr);
}

.rows-6 {
    grid-template-rows: repeat(6, 1fr);
}

.rows-7 {
    grid-template-rows: repeat(7, 1fr);
}

.rows-8 {
    grid-template-rows: repeat(8, 1fr);
}

.rows-9 {
    grid-template-rows: repeat(9, 1fr);
}

.rows-10 {
    grid-template-rows: repeat(10, 1fr);
}

.col-gap-0 {
    column-gap: 0 !important;
}

.col-gap-1x {
    column-gap: 1rem;
}

.col-gap-2x {
    column-gap: 2rem;
}

.col-gap-3x {
    column-gap: 3rem;
}

.col-gap-4x {
    column-gap: 4rem;
}

.col-gap-5x {
    column-gap: 5rem;
}

.row-gap-0 {
    row-gap: 0 !important;
}

.row-gap-1x {
    row-gap: 1rem;
}

.row-gap-2x {
    row-gap: 2rem;
}

.row-gap-3x {
    row-gap: 3rem;
}

.row-gap-4x {
    row-gap: 4rem;
}

.row-gap-5x {
    row-gap: 5rem;
}

.col-start-auto {
    grid-column-start: auto !important;
}

.col-start-0 {
    grid-column-start: 1;
}

.col-start-1 {
    grid-column-start: 2;
}

.col-start-2 {
    grid-column-start: 3;
}

.col-start-3 {
    grid-column-start: 4;
}

.col-start-4 {
    grid-column-start: 5;
}

.col-start-5 {
    grid-column-start: 6;
}

.col-start-6 {
    grid-column-start: 7;
}

.col-start-7 {
    grid-column-start: 8;
}

.col-start-8 {
    grid-column-start: 9;
}

.col-start-9 {
    grid-column-start: 10;
}

.col-end-auto {
    grid-column-end: auto !important;
}

.col-end-1 {
    grid-column-end: 2;
}

.col-end-2 {
    grid-column-end: 3;
}

.col-end-3 {
    grid-column-end: 4;
}

.col-end-4 {
    grid-column-end: 5;
}

.col-end-5 {
    grid-column-end: 6;
}

.col-end-6 {
    grid-column-end: 7;
}

.col-end-7 {
    grid-column-end: 8;
}

.col-end-8 {
    grid-column-end: 9;
}

.col-end-9 {
    grid-column-end: 10;
}

.col-end-10 {
    grid-column-end: 11;
}

.row-start-auto {
    grid-row-start: auto !important;
}

.row-start-0 {
    grid-row-start: 1;
}

.row-start-1 {
    grid-row-start: 2;
}

.row-start-2 {
    grid-row-start: 3;
}

.row-start-3 {
    grid-row-start: 4;
}

.row-start-4 {
    grid-row-start: 5;
}

.row-start-5 {
    grid-row-start: 6;
}

.row-start-6 {
    grid-row-start: 7;
}

.row-start-7 {
    grid-row-start: 8;
}

.row-start-8 {
    grid-row-start: 9;
}

.row-start-9 {
    grid-row-start: 10;
}

.row-end-auto {
    grid-row-end: auto !important;
}

.row-end-1 {
    grid-row-end: 2;
}

.row-end-2 {
    grid-row-end: 3;
}

.row-end-3 {
    grid-row-end: 4;
}

.row-end-4 {
    grid-row-end: 5;
}

.row-end-5 {
    grid-row-end: 6;
}

.row-end-6 {
    grid-row-end: 7;
}

.row-end-7 {
    grid-row-end: 8;
}

.row-end-8 {
    grid-row-end: 9;
}

.row-end-9 {
    grid-row-end: 10;
}

.row-end-10 {
    grid-row-end: 11;
}

/********** display **********/

.collapse {
    display: none;
}

.block {
    display: block;
}

.flex {
    display: flex;
}

.flex-start {
    display: flex;
    justify-content: flex-start;
}

.flex-end {
    display: flex;
    justify-content: flex-end;
}

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

.flex-space-between {
    display: flex;
    justify-content: space-between;
}

.flex-space-around {
    display: flex;
    justify-content: space-around;
}

.flex-space-evenly {
    display: flex;
    justify-content: space-evenly;
}

.flex-fill {
    flex: 1 1 auto;
}

.flex-row {
    flex-direction: row;
}

.flex-col {
    flex-direction: column;
}

.flex-row-reverse {
    flex-direction: row-reverse;
}

.flex-col-reverse {
    flex-direction: column-reverse;
}

.flex-grow-0 {
    flex-grow: 0;
}

.flex-grow-1 {
    flex-grow: 1;
}

.flex-shrink-0 {
    flex-shrink: 0;
}

.flex-shrink-1 {
    flex-shrink: 1;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-nowrap {
    flex-wrap: nowrap;
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}

.inline {
    display: inline;
}

.inline-block {
    display: inline-block;
}

.inline-flex {
    display: inline-flex;
    overflow: hidden;
}

.inline-grid {
    display: inline-grid;
}

.inline-table {
    display: inline-table;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.float-inline-start {
    float: inline-start;
}

.float-inline-end {
    float: inline-end;
}

/********** position **********/

.top-0 {
    top: 0 !important;
}

.top-1x {
    top: 1rem;
}

.top-2x {
    top: 2rem;
}

.top-3x {
    top: 3rem;
}

.top-4x {
    top: 4rem;
}

.top-5x {
    top: 5rem;
}

.bottom-0 {
    bottom: 0 !important;
}

.bottom-1x {
    bottom: 1rem;
}

.bottom-2x {
    bottom: 2rem;
}

.bottom-3x {
    bottom: 3rem;
}

.bottom-4x {
    bottom: 4rem;
}

.bottom-5x {
    bottom: 5rem;
}

.left-0 {
    left: 0 !important;
}

.left-1x {
    left: 1rem;
}

.left-2x {
    left: 2rem;
}

.left-3x {
    left: 3rem;
}

.left-4x {
    left: 4rem;
}

.left-5x {
    left: 5rem;
}

.right-0 {
    right: 0 !important;
}

.right-1x {
    right: 1rem;
}

.right-2x {
    right: 2rem;
}

.right-3x {
    right: 3rem;
}

.right-4x {
    right: 4rem;
}

.right-5x {
    right: 5rem;
}

.relative {
    position: relative;
}

.static {
    position: static;
}

.fixed-top {
    position: fixed;
    top: 0;
    z-index: 999;
}

.fixed-middle {
    position: fixed;
    top: 50%;
    z-index: 999;
}

.fixed-bottom {
    position: fixed;
    bottom: 0;
    z-index: 999;
}

.fixed-left {
    position: fixed;
    left: 0;
    z-index: 999;
}

.fixed-center {
    position: fixed;
    left: 50%;
    z-index: 999;
}

.fixed-right {
    position: fixed;
    right: 0;
    z-index: 999;
}

.sticky-top {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 888;
}

.sticky-middle {
    position: -webkit-sticky;
    position: sticky;
    top: 50%;
    z-index: 888;
}

.sticky-bottom {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    z-index: 888;
}

.sticky-left {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    z-index: 888;
}

.sticky-center {
    position: -webkit-sticky;
    position: sticky;
    left: 50%;
    z-index: 888;
}

.sticky-right {
    position: -webkit-sticky;
    position: sticky;
    right: 0;
    z-index: 888;
}

.absolute-top {
    position: absolute;
    top: 0;
}

.absolute-middle {
    position: absolute;
    top: 50%;
}

.absolute-bottom {
    position: absolute;
    bottom: 0;
}

.absolute-left {
    position: absolute;
    left: 0;
}

.absolute-center {
    position: absolute;
    left: 50%;
}

.absolute-right {
    position: absolute;
    right: 0;
}


.resize-none {
    resize: none !important;
}


@media (min-width: 512px) {
    .content {
        max-width: 512px;
    }

    .sm-relative {
        position: relative;
    }

    .sm-static {
        position: static;
    }

    .sm-fixed-top {
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .sm-fixed-middle {
        position: fixed;
        top: 50%;
        z-index: 999;
    }

    .sm-fixed-bottom {
        position: fixed;
        bottom: 0;
        z-index: 999;
    }

    .sm-fixed-left {
        position: fixed;
        left: 0;
        z-index: 999;
    }

    .sm-fixed-center {
        position: fixed;
        left: 50%;
        z-index: 999;
    }

    .sm-fixed-right {
        position: fixed;
        right: 0;
        z-index: 999;
    }

    .sm-sticky-top {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 888;
    }

    .sm-sticky-middle {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        z-index: 888;
    }

    .sm-sticky-bottom {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 888;
    }

    .sm-sticky-left {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 888;
    }

    .sm-sticky-center {
        position: -webkit-sticky;
        position: sticky;
        left: 50%;
        z-index: 888;
    }

    .sm-sticky-right {
        position: -webkit-sticky;
        position: sticky;
        right: 0;
        z-index: 888;
    }

    .sm-absolute-top {
        position: absolute;
        top: 0;
    }

    .sm-absolute-middle {
        position: absolute;
        top: 50%;
    }

    .sm-absolute-bottom {
        position: absolute;
        bottom: 0;
    }

    .sm-absolute-left {
        position: absolute;
        left: 0;
    }

    .sm-absolute-center {
        position: absolute;
        left: 50%;
    }

    .sm-absolute-right {
        position: absolute;
        right: 0;
    }

    .sm-cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sm-cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sm-cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sm-cols-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sm-cols-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sm-cols-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sm-cols-8 {
        grid-template-columns: repeat(8, 1fr);
    }

    .sm-cols-9 {
        grid-template-columns: repeat(9, 1fr);
    }

    .sm-cols-10 {
        grid-template-columns: repeat(10, 1fr);
    }

    .sm-col-start-auto {
        grid-column-start: auto !important;
    }

    .sm-col-start-0 {
        grid-column-start: 1;
    }

    .sm-col-start-1 {
        grid-column-start: 2;
    }

    .sm-col-start-2 {
        grid-column-start: 3;
    }

    .sm-col-start-3 {
        grid-column-start: 4;
    }

    .sm-col-start-4 {
        grid-column-start: 5;
    }

    .sm-col-start-5 {
        grid-column-start: 6;
    }

    .sm-col-start-6 {
        grid-column-start: 7;
    }

    .sm-col-start-7 {
        grid-column-start: 8;
    }

    .sm-col-start-8 {
        grid-column-start: 9;
    }

    .sm-col-start-9 {
        grid-column-start: 10;
    }

    .sm-col-end-auto {
        grid-column-end: auto !important;
    }

    .sm-col-end-1 {
        grid-column-end: 2;
    }

    .sm-col-end-2 {
        grid-column-end: 3;
    }

    .sm-col-end-3 {
        grid-column-end: 4;
    }

    .sm-col-end-4 {
        grid-column-end: 5;
    }

    .sm-col-end-5 {
        grid-column-end: 6;
    }

    .sm-col-end-6 {
        grid-column-end: 7;
    }

    .sm-col-end-7 {
        grid-column-end: 8;
    }

    .sm-col-end-8 {
        grid-column-end: 9;
    }

    .sm-col-end-9 {
        grid-column-end: 10;
    }

    .sm-col-end-10 {
        grid-column-end: 11;
    }

    .sm-rows-2 {
        grid-template-rows: repeat(2, 1fr);
    }

    .sm-rows-3 {
        grid-template-rows: repeat(3, 1fr);
    }

    .sm-rows-4 {
        grid-template-rows: repeat(4, 1fr);
    }

    .sm-rows-5 {
        grid-template-rows: repeat(5, 1fr);
    }

    .sm-rows-6 {
        grid-template-rows: repeat(6, 1fr);
    }

    .sm-rows-7 {
        grid-template-rows: repeat(7, 1fr);
    }

    .sm-rows-8 {
        grid-template-rows: repeat(8, 1fr);
    }

    .sm-rows-9 {
        grid-template-rows: repeat(9, 1fr);
    }

    .sm-rows-10 {
        grid-template-rows: repeat(10, 1fr);
    }

    .sm-row-start-auto {
        grid-row-start: auto !important;
    }

    .sm-row-start-0 {
        grid-row-start: 1;
    }

    .sm-row-start-1 {
        grid-row-start: 2;
    }

    .sm-row-start-2 {
        grid-row-start: 3;
    }

    .sm-row-start-3 {
        grid-row-start: 4;
    }

    .sm-row-start-4 {
        grid-row-start: 5;
    }

    .sm-row-start-5 {
        grid-row-start: 6;
    }

    .sm-row-start-6 {
        grid-row-start: 7;
    }

    .sm-row-start-7 {
        grid-row-start: 8;
    }

    .sm-row-start-8 {
        grid-row-start: 9;
    }

    .sm-row-start-9 {
        grid-row-start: 10;
    }

    .sm-row-end-auto {
        grid-row-end: auto !important;
    }

    .sm-row-end-1 {
        grid-row-end: 2;
    }

    .sm-row-end-2 {
        grid-row-end: 3;
    }

    .sm-row-end-3 {
        grid-row-end: 4;
    }

    .sm-row-end-4 {
        grid-row-end: 5;
    }

    .sm-row-end-5 {
        grid-row-end: 6;
    }

    .sm-row-end-6 {
        grid-row-end: 7;
    }

    .sm-row-end-7 {
        grid-row-end: 8;
    }

    .sm-row-end-8 {
        grid-row-end: 9;
    }

    .sm-row-end-9 {
        grid-row-end: 10;
    }

    .sm-row-end-10 {
        grid-row-end: 11;
    }

}

@media (min-width: 768px) {
    .content {
        max-width: 720px;
    }

    .md-relative {
        position: relative;
    }

    .md-static {
        position: static;
    }

    .md-fixed-top {
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .md-fixed-middle {
        position: fixed;
        top: 50%;
        z-index: 999;
    }

    .md-fixed-bottom {
        position: fixed;
        bottom: 0;
        z-index: 999;
    }

    .md-fixed-left {
        position: fixed;
        left: 0;
        z-index: 999;
    }

    .md-fixed-center {
        position: fixed;
        left: 50%;
        z-index: 999;
    }

    .md-fixed-right {
        position: fixed;
        right: 0;
        z-index: 999;
    }

    .md-sticky-top {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 888;
    }

    .md-sticky-middle {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        z-index: 888;
    }

    .md-sticky-bottom {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 888;
    }

    .md-sticky-left {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 888;
    }

    .md-sticky-center {
        position: -webkit-sticky;
        position: sticky;
        left: 50%;
        z-index: 888;
    }

    .md-sticky-right {
        position: -webkit-sticky;
        position: sticky;
        right: 0;
        z-index: 888;
    }

    .md-absolute-top {
        position: absolute;
        top: 0;
    }

    .md-absolute-middle {
        position: absolute;
        top: 50%;
    }

    .md-absolute-bottom {
        position: absolute;
        bottom: 0;
    }

    .md-absolute-left {
        position: absolute;
        left: 0;
    }

    .md-absolute-center {
        position: absolute;
        left: 50%;
    }

    .md-absolute-right {
        position: absolute;
        right: 0;
    }

    .md-cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .md-cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .md-cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .md-cols-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .md-cols-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .md-cols-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .md-cols-8 {
        grid-template-columns: repeat(8, 1fr);
    }

    .md-cols-9 {
        grid-template-columns: repeat(9, 1fr);
    }

    .md-cols-10 {
        grid-template-columns: repeat(10, 1fr);
    }

    .md-col-start-auto {
        grid-column-start: auto !important;
    }

    .md-col-start-0 {
        grid-column-start: 1;
    }

    .md-col-start-1 {
        grid-column-start: 2;
    }

    .md-col-start-2 {
        grid-column-start: 3;
    }

    .md-col-start-3 {
        grid-column-start: 4;
    }

    .md-col-start-4 {
        grid-column-start: 5;
    }

    .md-col-start-5 {
        grid-column-start: 6;
    }

    .md-col-start-6 {
        grid-column-start: 7;
    }

    .md-col-start-7 {
        grid-column-start: 8;
    }

    .md-col-start-8 {
        grid-column-start: 9;
    }

    .md-col-start-9 {
        grid-column-start: 10;
    }

    .md-col-end-auto {
        grid-column-end: auto !important;
    }

    .md-col-end-1 {
        grid-column-end: 2;
    }

    .md-col-end-2 {
        grid-column-end: 3;
    }

    .md-col-end-3 {
        grid-column-end: 4;
    }

    .md-col-end-4 {
        grid-column-end: 5;
    }

    .md-col-end-5 {
        grid-column-end: 6;
    }

    .md-col-end-6 {
        grid-column-end: 7;
    }

    .md-col-end-7 {
        grid-column-end: 8;
    }

    .md-col-end-8 {
        grid-column-end: 9;
    }

    .md-col-end-9 {
        grid-column-end: 10;
    }

    .md-col-end-10 {
        grid-column-end: 11;
    }

    .md-rows-2 {
        grid-template-rows: repeat(2, 1fr);
    }

    .md-rows-3 {
        grid-template-rows: repeat(3, 1fr);
    }

    .md-rows-4 {
        grid-template-rows: repeat(4, 1fr);
    }

    .md-rows-5 {
        grid-template-rows: repeat(5, 1fr);
    }

    .md-rows-6 {
        grid-template-rows: repeat(6, 1fr);
    }

    .md-rows-7 {
        grid-template-rows: repeat(7, 1fr);
    }

    .md-rows-8 {
        grid-template-rows: repeat(8, 1fr);
    }

    .md-rows-9 {
        grid-template-rows: repeat(9, 1fr);
    }

    .md-rows-10 {
        grid-template-rows: repeat(10, 1fr);
    }

    .md-row-start-auto {
        grid-row-start: auto !important;
    }

    .md-row-start-0 {
        grid-row-start: 1;
    }

    .md-row-start-1 {
        grid-row-start: 2;
    }

    .md-row-start-2 {
        grid-row-start: 3;
    }

    .md-row-start-3 {
        grid-row-start: 4;
    }

    .md-row-start-4 {
        grid-row-start: 5;
    }

    .md-row-start-5 {
        grid-row-start: 6;
    }

    .md-row-start-6 {
        grid-row-start: 7;
    }

    .md-row-start-7 {
        grid-row-start: 8;
    }

    .md-row-start-8 {
        grid-row-start: 9;
    }

    .md-row-start-9 {
        grid-row-start: 10;
    }

    .md-row-end-auto {
        grid-row-end: auto !important;
    }

    .md-row-end-1 {
        grid-row-end: 2;
    }

    .md-row-end-2 {
        grid-row-end: 3;
    }

    .md-row-end-3 {
        grid-row-end: 4;
    }

    .md-row-end-4 {
        grid-row-end: 5;
    }

    .md-row-end-5 {
        grid-row-end: 6;
    }

    .md-row-end-6 {
        grid-row-end: 7;
    }

    .md-row-end-7 {
        grid-row-end: 8;
    }

    .md-row-end-8 {
        grid-row-end: 9;
    }

    .md-row-end-9 {
        grid-row-end: 10;
    }

    .md-row-end-10 {
        grid-row-end: 11;
    }

}

@media (min-width: 1024px) {
    .content {
        max-width: 960px;
    }

    .lg-relative {
        position: relative;
    }

    .lg-static {
        position: static;
    }

    .lg-fixed-top {
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .lg-fixed-middle {
        position: fixed;
        top: 50%;
        z-index: 999;
    }

    .lg-fixed-bottom {
        position: fixed;
        bottom: 0;
        z-index: 999;
    }

    .lg-fixed-left {
        position: fixed;
        left: 0;
        z-index: 999;
    }

    .lg-fixed-center {
        position: fixed;
        left: 50%;
        z-index: 999;
    }

    .lg-fixed-right {
        position: fixed;
        right: 0;
        z-index: 999;
    }

    .lg-sticky-top {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 888;
    }

    .lg-sticky-middle {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        z-index: 888;
    }

    .lg-sticky-bottom {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 888;
    }

    .lg-sticky-left {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 888;
    }

    .lg-sticky-center {
        position: -webkit-sticky;
        position: sticky;
        left: 50%;
        z-index: 888;
    }

    .lg-sticky-right {
        position: -webkit-sticky;
        position: sticky;
        right: 0;
        z-index: 888;
    }

    .lg-absolute-top {
        position: absolute;
        top: 0;
    }

    .lg-absolute-middle {
        position: absolute;
        top: 50%;
    }

    .lg-absolute-bottom {
        position: absolute;
        bottom: 0;
    }

    .lg-absolute-left {
        position: absolute;
        left: 0;
    }

    .lg-absolute-center {
        position: absolute;
        left: 50%;
    }

    .lg-absolute-right {
        position: absolute;
        right: 0;
    }

    .lg-cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .lg-cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .lg-cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .lg-cols-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .lg-cols-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .lg-cols-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .lg-cols-8 {
        grid-template-columns: repeat(8, 1fr);
    }

    .lg-cols-9 {
        grid-template-columns: repeat(9, 1fr);
    }

    .lg-cols-10 {
        grid-template-columns: repeat(10, 1fr);
    }

    .lg-col-start-auto {
        grid-column-start: auto !important;
    }

    .lg-col-start-0 {
        grid-column-start: 1;
    }

    .lg-col-start-1 {
        grid-column-start: 2;
    }

    .lg-col-start-2 {
        grid-column-start: 3;
    }

    .lg-col-start-3 {
        grid-column-start: 4;
    }

    .lg-col-start-4 {
        grid-column-start: 5;
    }

    .lg-col-start-5 {
        grid-column-start: 6;
    }

    .lg-col-start-6 {
        grid-column-start: 7;
    }

    .lg-col-start-7 {
        grid-column-start: 8;
    }

    .lg-col-start-8 {
        grid-column-start: 9;
    }

    .lg-col-start-9 {
        grid-column-start: 10;
    }

    .lg-col-end-auto {
        grid-column-end: auto !important;
    }

    .lg-col-end-1 {
        grid-column-end: 2;
    }

    .lg-col-end-2 {
        grid-column-end: 3;
    }

    .lg-col-end-3 {
        grid-column-end: 4;
    }

    .lg-col-end-4 {
        grid-column-end: 5;
    }

    .lg-col-end-5 {
        grid-column-end: 6;
    }

    .lg-col-end-6 {
        grid-column-end: 7;
    }

    .lg-col-end-7 {
        grid-column-end: 8;
    }

    .lg-col-end-8 {
        grid-column-end: 9;
    }

    .lg-col-end-9 {
        grid-column-end: 10;
    }

    .lg-col-end-10 {
        grid-column-end: 11;
    }

    .lg-rows-2 {
        grid-template-rows: repeat(2, 1fr);
    }

    .lg-rows-3 {
        grid-template-rows: repeat(3, 1fr);
    }

    .lg-rows-4 {
        grid-template-rows: repeat(4, 1fr);
    }

    .lg-rows-5 {
        grid-template-rows: repeat(5, 1fr);
    }

    .lg-rows-6 {
        grid-template-rows: repeat(6, 1fr);
    }

    .lg-rows-7 {
        grid-template-rows: repeat(7, 1fr);
    }

    .lg-rows-8 {
        grid-template-rows: repeat(8, 1fr);
    }

    .lg-rows-9 {
        grid-template-rows: repeat(9, 1fr);
    }

    .lg-rows-10 {
        grid-template-rows: repeat(10, 1fr);
    }

    .lg-row-start-auto {
        grid-row-start: auto !important;
    }

    .lg-row-start-0 {
        grid-row-start: 1;
    }

    .lg-row-start-1 {
        grid-row-start: 2;
    }

    .lg-row-start-2 {
        grid-row-start: 3;
    }

    .lg-row-start-3 {
        grid-row-start: 4;
    }

    .lg-row-start-4 {
        grid-row-start: 5;
    }

    .lg-row-start-5 {
        grid-row-start: 6;
    }

    .lg-row-start-6 {
        grid-row-start: 7;
    }

    .lg-row-start-7 {
        grid-row-start: 8;
    }

    .lg-row-start-8 {
        grid-row-start: 9;
    }

    .lg-row-start-9 {
        grid-row-start: 10;
    }

    .lg-row-end-auto {
        grid-row-end: auto !important;
    }

    .lg-row-end-1 {
        grid-row-end: 2;
    }

    .lg-row-end-2 {
        grid-row-end: 3;
    }

    .lg-row-end-3 {
        grid-row-end: 4;
    }

    .lg-row-end-4 {
        grid-row-end: 5;
    }

    .lg-row-end-5 {
        grid-row-end: 6;
    }

    .lg-row-end-6 {
        grid-row-end: 7;
    }

    .lg-row-end-7 {
        grid-row-end: 8;
    }

    .lg-row-end-8 {
        grid-row-end: 9;
    }

    .lg-row-end-9 {
        grid-row-end: 10;
    }

    .lg-row-end-10 {
        grid-row-end: 11;
    }

}

@media (min-width: 1280px) {
    html {
        font-size: medium;
    }

    .sidebar {
        width: 15rem;
    }

    .collapse {
        display: initial;
    }

    .content {
        max-width: 1200px;
    }

    .xl-relative {
        position: relative;
    }

    .xl-static {
        position: static;
    }

    .xl-fixed-top {
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .xl-fixed-middle {
        position: fixed;
        top: 50%;
        z-index: 999;
    }

    .xl-fixed-bottom {
        position: fixed;
        bottom: 0;
        z-index: 999;
    }

    .xl-fixed-left {
        position: fixed;
        left: 0;
        z-index: 999;
    }

    .xl-fixed-center {
        position: fixed;
        left: 50%;
        z-index: 999;
    }

    .xl-fixed-right {
        position: fixed;
        right: 0;
        z-index: 999;
    }

    .xl-sticky-top {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 888;
    }

    .xl-sticky-middle {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        z-index: 888;
    }

    .xl-sticky-bottom {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 888;
    }

    .xl-sticky-left {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 888;
    }

    .xl-sticky-center {
        position: -webkit-sticky;
        position: sticky;
        left: 50%;
        z-index: 888;
    }

    .xl-sticky-right {
        position: -webkit-sticky;
        position: sticky;
        right: 0;
        z-index: 888;
    }

    .xl-absolute-top {
        position: absolute;
        top: 0;
    }

    .xl-absolute-middle {
        position: absolute;
        top: 50%;
    }

    .xl-absolute-bottom {
        position: absolute;
        bottom: 0;
    }

    .xl-absolute-left {
        position: absolute;
        left: 0;
    }

    .xl-absolute-center {
        position: absolute;
        left: 50%;
    }

    .xl-absolute-right {
        position: absolute;
        right: 0;
    }

    .xl-cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .xl-cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .xl-cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .xl-cols-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .xl-cols-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .xl-cols-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .xl-cols-8 {
        grid-template-columns: repeat(8, 1fr);
    }

    .xl-cols-9 {
        grid-template-columns: repeat(9, 1fr);
    }

    .xl-cols-10 {
        grid-template-columns: repeat(10, 1fr);
    }

    .xl-col-start-auto {
        grid-column-start: auto !important;
    }

    .xl-col-start-0 {
        grid-column-start: 1;
    }

    .xl-col-start-1 {
        grid-column-start: 2;
    }

    .xl-col-start-2 {
        grid-column-start: 3;
    }

    .xl-col-start-3 {
        grid-column-start: 4;
    }

    .xl-col-start-4 {
        grid-column-start: 5;
    }

    .xl-col-start-5 {
        grid-column-start: 6;
    }

    .xl-col-start-6 {
        grid-column-start: 7;
    }

    .xl-col-start-7 {
        grid-column-start: 8;
    }

    .xl-col-start-8 {
        grid-column-start: 9;
    }

    .xl-col-start-9 {
        grid-column-start: 10;
    }

    .xl-col-end-auto {
        grid-column-end: auto !important;
    }

    .xl-col-end-1 {
        grid-column-end: 2;
    }

    .xl-col-end-2 {
        grid-column-end: 3;
    }

    .xl-col-end-3 {
        grid-column-end: 4;
    }

    .xl-col-end-4 {
        grid-column-end: 5;
    }

    .xl-col-end-5 {
        grid-column-end: 6;
    }

    .xl-col-end-6 {
        grid-column-end: 7;
    }

    .xl-col-end-7 {
        grid-column-end: 8;
    }

    .xl-col-end-8 {
        grid-column-end: 9;
    }

    .xl-col-end-9 {
        grid-column-end: 10;
    }

    .xl-col-end-10 {
        grid-column-end: 11;
    }

    .xl-rows-2 {
        grid-template-rows: repeat(2, 1fr);
    }

    .xl-rows-3 {
        grid-template-rows: repeat(3, 1fr);
    }

    .xl-rows-4 {
        grid-template-rows: repeat(4, 1fr);
    }

    .xl-rows-5 {
        grid-template-rows: repeat(5, 1fr);
    }

    .xl-rows-6 {
        grid-template-rows: repeat(6, 1fr);
    }

    .xl-rows-7 {
        grid-template-rows: repeat(7, 1fr);
    }

    .xl-rows-8 {
        grid-template-rows: repeat(8, 1fr);
    }

    .xl-rows-9 {
        grid-template-rows: repeat(9, 1fr);
    }

    .xl-rows-10 {
        grid-template-rows: repeat(10, 1fr);
    }

    .xl-row-start-auto {
        grid-row-start: auto !important;
    }

    .xl-row-start-0 {
        grid-row-start: 1;
    }

    .xl-row-start-1 {
        grid-row-start: 2;
    }

    .xl-row-start-2 {
        grid-row-start: 3;
    }

    .xl-row-start-3 {
        grid-row-start: 4;
    }

    .xl-row-start-4 {
        grid-row-start: 5;
    }

    .xl-row-start-5 {
        grid-row-start: 6;
    }

    .xl-row-start-6 {
        grid-row-start: 7;
    }

    .xl-row-start-7 {
        grid-row-start: 8;
    }

    .xl-row-start-8 {
        grid-row-start: 9;
    }

    .xl-row-start-9 {
        grid-row-start: 10;
    }

    .xl-row-end-auto {
        grid-row-end: auto !important;
    }

    .xl-row-end-1 {
        grid-row-end: 2;
    }

    .xl-row-end-2 {
        grid-row-end: 3;
    }

    .xl-row-end-3 {
        grid-row-end: 4;
    }

    .xl-row-end-4 {
        grid-row-end: 5;
    }

    .xl-row-end-5 {
        grid-row-end: 6;
    }

    .xl-row-end-6 {
        grid-row-end: 7;
    }

    .xl-row-end-7 {
        grid-row-end: 8;
    }

    .xl-row-end-8 {
        grid-row-end: 9;
    }

    .xl-row-end-9 {
        grid-row-end: 10;
    }

    .xl-row-end-10 {
        grid-row-end: 11;
    }

}

@media (min-width: 1792px) {
    .xxl-relative {
        position: relative;
    }

    .xxl-static {
        position: static;
    }

    .xxl-fixed-top {
        position: fixed;
        top: 0;
        z-index: 999;
    }

    .xxl-fixed-middle {
        position: fixed;
        top: 50%;
        z-index: 999;
    }

    .xxl-fixed-bottom {
        position: fixed;
        bottom: 0;
        z-index: 999;
    }

    .xxl-fixed-left {
        position: fixed;
        left: 0;
        z-index: 999;
    }

    .xxl-fixed-center {
        position: fixed;
        left: 50%;
        z-index: 999;
    }

    .xxl-fixed-right {
        position: fixed;
        right: 0;
        z-index: 999;
    }

    .xxl-sticky-top {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 888;
    }

    .xxl-sticky-middle {
        position: -webkit-sticky;
        position: sticky;
        top: 50%;
        z-index: 888;
    }

    .xxl-sticky-bottom {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 888;
    }

    .xxl-sticky-left {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 888;
    }

    .xxl-sticky-center {
        position: -webkit-sticky;
        position: sticky;
        left: 50%;
        z-index: 888;
    }

    .xxl-sticky-right {
        position: -webkit-sticky;
        position: sticky;
        right: 0;
        z-index: 888;
    }

    .xxl-absolute-top {
        position: absolute;
        top: 0;
    }

    .xxl-absolute-middle {
        position: absolute;
        top: 50%;
    }

    .xxl-absolute-bottom {
        position: absolute;
        bottom: 0;
    }

    .xxl-absolute-left {
        position: absolute;
        left: 0;
    }

    .xxl-absolute-center {
        position: absolute;
        left: 50%;
    }

    .xxl-absolute-right {
        position: absolute;
        right: 0;
    }

    .xxl-cols-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .xxl-cols-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .xxl-cols-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .xxl-cols-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .xxl-cols-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .xxl-cols-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .xxl-cols-8 {
        grid-template-columns: repeat(8, 1fr);
    }

    .xxl-cols-9 {
        grid-template-columns: repeat(9, 1fr);
    }

    .xxl-cols-10 {
        grid-template-columns: repeat(10, 1fr);
    }

    .xxl-col-start-auto {
        grid-column-start: auto !important;
    }

    .xxl-col-start-0 {
        grid-column-start: 1;
    }

    .xxl-col-start-1 {
        grid-column-start: 2;
    }

    .xxl-col-start-2 {
        grid-column-start: 3;
    }

    .xxl-col-start-3 {
        grid-column-start: 4;
    }

    .xxl-col-start-4 {
        grid-column-start: 5;
    }

    .xxl-col-start-5 {
        grid-column-start: 6;
    }

    .xxl-col-start-6 {
        grid-column-start: 7;
    }

    .xxl-col-start-7 {
        grid-column-start: 8;
    }

    .xxl-col-start-8 {
        grid-column-start: 9;
    }

    .xxl-col-start-9 {
        grid-column-start: 10;
    }

    .xxl-col-end-auto {
        grid-column-end: auto !important;
    }

    .xxl-col-end-1 {
        grid-column-end: 2;
    }

    .xxl-col-end-2 {
        grid-column-end: 3;
    }

    .xxl-col-end-3 {
        grid-column-end: 4;
    }

    .xxl-col-end-4 {
        grid-column-end: 5;
    }

    .xxl-col-end-5 {
        grid-column-end: 6;
    }

    .xxl-col-end-6 {
        grid-column-end: 7;
    }

    .xxl-col-end-7 {
        grid-column-end: 8;
    }

    .xxl-col-end-8 {
        grid-column-end: 9;
    }

    .xxl-col-end-9 {
        grid-column-end: 10;
    }

    .xxl-col-end-10 {
        grid-column-end: 11;
    }

    .xxl-rows-2 {
        grid-template-rows: repeat(2, 1fr);
    }

    .xxl-rows-3 {
        grid-template-rows: repeat(3, 1fr);
    }

    .xxl-rows-4 {
        grid-template-rows: repeat(4, 1fr);
    }

    .xxl-rows-5 {
        grid-template-rows: repeat(5, 1fr);
    }

    .xxl-rows-6 {
        grid-template-rows: repeat(6, 1fr);
    }

    .xxl-rows-7 {
        grid-template-rows: repeat(7, 1fr);
    }

    .xxl-rows-8 {
        grid-template-rows: repeat(8, 1fr);
    }

    .xxl-rows-9 {
        grid-template-rows: repeat(9, 1fr);
    }

    .xxl-rows-10 {
        grid-template-rows: repeat(10, 1fr);
    }

    .xxl-row-start-auto {
        grid-row-start: auto !important;
    }

    .xxl-row-start-0 {
        grid-row-start: 1;
    }

    .xxl-row-start-1 {
        grid-row-start: 2;
    }

    .xxl-row-start-2 {
        grid-row-start: 3;
    }

    .xxl-row-start-3 {
        grid-row-start: 4;
    }

    .xxl-row-start-4 {
        grid-row-start: 5;
    }

    .xxl-row-start-5 {
        grid-row-start: 6;
    }

    .xxl-row-start-6 {
        grid-row-start: 7;
    }

    .xxl-row-start-7 {
        grid-row-start: 8;
    }

    .xxl-row-start-8 {
        grid-row-start: 9;
    }

    .xxl-row-start-9 {
        grid-row-start: 10;
    }

    .xxl-row-end-auto {
        grid-row-end: auto !important;
    }

    .xxl-row-end-1 {
        grid-row-end: 2;
    }

    .xxl-row-end-2 {
        grid-row-end: 3;
    }

    .xxl-row-end-3 {
        grid-row-end: 4;
    }

    .xxl-row-end-4 {
        grid-row-end: 5;
    }

    .xxl-row-end-5 {
        grid-row-end: 6;
    }

    .xxl-row-end-6 {
        grid-row-end: 7;
    }

    .xxl-row-end-7 {
        grid-row-end: 8;
    }

    .xxl-row-end-8 {
        grid-row-end: 9;
    }

    .xxl-row-end-9 {
        grid-row-end: 10;
    }

    .xxl-row-end-10 {
        grid-row-end: 11;
    }

}