.e-grid {
    position: relative;
    width: 100% auto !important;
}

.e-grid.container {
    flex-flow: row;
    min-width: 0px;
    box-sizing: border-box;
    gap: 0px 0px;
    margin: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    height: auto;
}

.e-grid.container.nowrap {
    flex-wrap: unset !important;
}

.e-grid.item {
    position: relative;
}

.e-grid.item {

    flex-shrink: 0;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-basis: auto;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
    width: 100% auto;
    min-width: 0;
    height: auto;
    box-sizing: border-box;
    display: inline-block;
}

.e-grid.item.auto {
    width: auto;
    flex-basis: auto;
}

.e-grid.item.xs {
    width: calc((100% / 12) * 12);
    flex-basis: calc((100% / 12) * 12);
}

.e-grid.item.xs-1 {
    width: calc((100% / 12) * 1);
    flex-basis: calc((100% / 12) * 1);
}

.e-grid.item.xs-2 {
    width: calc((100% / 12) * 2);
    flex-basis: calc((100% / 12) * 2);
}

.e-grid.item.xs-3 {
    width: calc((100% / 12) * 3);
    flex-basis: calc((100% / 12) * 3);
}

.e-grid.item.xs-4 {
    width: calc((100% / 12) * 4);
    flex-basis: calc((100% / 12) * 4);
}

.e-grid.item.xs-5 {
    width: calc((100% / 12) * 5);
    flex-basis: calc((100% / 12) * 5);
}

.e-grid.item.xs-6 {
    width: calc((100% / 12) * 6);
    flex-basis: calc((100% / 12) * 6);
}

.e-grid.item.xs-7 {
    width: calc((100% / 12) * 7);
    flex-basis: calc((100% / 12) * 7);
}

.e-grid.item.xs-8 {
    width: calc((100% / 12) * 8);
    flex-basis: calc((100% / 12) * 8);
}

.e-grid.item.xs-9 {
    width: calc((100% / 12) * 9);
    flex-basis: calc((100% / 12) * 9);
}

.e-grid.item.xs-10 {
    width: calc((100% / 12) * 10);
    flex-basis: calc((100% / 12) * 10);
}

.e-grid.item.xs-11 {
    width: calc((100% / 12) * 11);
    flex-basis: calc((100% / 12) * 11);
}

.e-grid.item.xs-12 {
    width: calc((100% / 12) * 12);
    flex-basis: calc((100% / 12) * 12);
}

@media (min-width:512px) {}

@media (min-width:768px) {
    .e-grid.item.sm-1 {
        width: calc((100% / 12) * 1);
        flex-basis: calc((100% / 12) * 1);
    }

    .e-grid.item.sm-2 {
        width: calc((100% / 12) * 2);
        flex-basis: calc((100% / 12) * 2);
    }

    .e-grid.item.sm-3 {
        width: calc((100% / 12) * 3);
        flex-basis: calc((100% / 12) * 3);
    }

    .e-grid.item.sm-4 {
        width: calc((100% / 12) * 4);
        flex-basis: calc((100% / 12) * 4);
    }

    .e-grid.item.sm-5 {
        width: calc((100% / 12) * 5);
        flex-basis: calc((100% / 12) * 5);
    }

    .e-grid.item.sm-6 {
        width: calc((100% / 12) * 6);
        flex-basis: calc((100% / 12) * 6);
    }

    .e-grid.item.sm-7 {
        width: calc((100% / 12) * 7);
        flex-basis: calc((100% / 12) * 7);
    }

    .e-grid.item.sm-8 {
        width: calc((100% / 12) * 8);
        flex-basis: calc((100% / 12) * 8);
    }

    .e-grid.item.sm-9 {
        width: calc((100% / 12) * 9);
        flex-basis: calc((100% / 12) * 9);
    }

    .e-grid.item.sm-10 {
        width: calc((100% / 12) * 10);
        flex-basis: calc((100% / 12) * 10);
    }

    .e-grid.item.sm-11 {
        width: calc((100% / 12) * 11);
        flex-basis: calc((100% / 12) * 11);
    }

    .e-grid.item.sm-12 {
        width: calc((100% / 12) * 12);
        flex-basis: calc((100% / 12) * 12);
    }
}


@media (min-width:992px) {
    .e-grid.item.md-1 {
        width: calc((100% / 12) * 1);
        flex-basis: calc((100% / 12) * 1);
    }

    .e-grid.item.md-2 {
        width: calc((100% / 12) * 2);
        flex-basis: calc((100% / 12) * 2);
    }

    .e-grid.item.md-3 {
        width: calc((100% / 12) * 3);
        flex-basis: calc((100% / 12) * 3);
    }

    .e-grid.item.md-4 {
        width: calc((100% / 12) * 4);
        flex-basis: calc((100% / 12) * 4);
    }

    .e-grid.item.md-5 {
        width: calc((100% / 12) * 5);
        flex-basis: calc((100% / 12) * 5);
    }

    .e-grid.item.md-6 {
        width: calc((100% / 12) * 6);
        flex-basis: calc((100% / 12) * 6);
    }

    .e-grid.item.md-7 {
        width: calc((100% / 12) * 7);
        flex-basis: calc((100% / 12) * 7);
    }

    .e-grid.item.md-8 {
        width: calc((100% / 12) * 8);
        flex-basis: calc((100% / 12) * 8);
    }

    .e-grid.item.md-9 {
        width: calc((100% / 12) * 9);
        flex-basis: calc((100% / 12) * 9);
    }

    .e-grid.item.md-10 {
        width: calc((100% / 12) * 10);
        flex-basis: calc((100% / 12) * 10);
    }

    .e-grid.item.md-11 {
        width: calc((100% / 12) * 11);
        flex-basis: calc((100% / 12) * 11);
    }

    .e-grid.item.md-12 {
        width: calc((100% / 12) * 12);
        flex-basis: calc((100% / 12) * 12);
    }
}





@media (min-width:1200px) {
    .e-grid.item.lg-1 {
        width: calc((100% / 12) * 1);
        flex-basis: calc((100% / 12) * 1);
    }

    .e-grid.item.lg-2 {
        width: calc((100% / 12) * 2);
        flex-basis: calc((100% / 12) * 2);
    }

    .e-grid.item.lg-3 {
        width: calc((100% / 12) * 3);
        flex-basis: calc((100% / 12) * 3);
    }

    .e-grid.item.lg-4 {
        width: calc((100% / 12) * 4);
        flex-basis: calc((100% / 12) * 4);
    }

    .e-grid.item.lg-5 {
        width: calc((100% / 12) * 5);
        flex-basis: calc((100% / 12) * 5);
    }

    .e-grid.item.lg-6 {
        width: calc((100% / 12) * 6);
        flex-basis: calc((100% / 12) * 6);
    }

    .e-grid.item.lg-7 {
        width: calc((100% / 12) * 7);
        flex-basis: calc((100% / 12) * 7);
    }

    .e-grid.item.lg-8 {
        width: calc((100% / 12) * 8);
        flex-basis: calc((100% / 12) * 8);
    }

    .e-grid.item.lg-9 {
        width: calc((100% / 12) * 9);
        flex-basis: calc((100% / 12) * 9);
    }

    .e-grid.item.lg-10 {
        width: calc((100% / 12) * 10);
        flex-basis: calc((100% / 12) * 10);
    }

    .e-grid.item.lg-11 {
        width: calc((100% / 12) * 11);
        flex-basis: calc((100% / 12) * 11);
    }

    .e-grid.item.lg-12 {
        width: calc((100% / 12) * 12);
        flex-basis: calc((100% / 12) * 12);
    }
}