html {
    box-sizing: border-box;
    scroll-behavior: smooth;
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

* {
    box-sizing: inherit;
    line-height: 1.5;
    margin: 0;
    padding: 0
}

* ::after,
* ::before {
    box-sizing: inherit;
    line-height: 1.6;
    margin: 0;
    padding: 0
}

.s-top {
    align-self: flex-start;
}

.s-middle {
    align-self: center;
}

.s-bottom {
    align-self: flex-end;
}

.s-left {
    text-align: left;
}

.s-column.s-column-top {
    align-self: flex-start
}

.s-column.s-column-bottom {
    align-self: flex-end
}

.s-column.s-column-center {
    align-self: center
}

.s-column.s-column-stretch {
    align-self: stretch
}

.s-column.s-column-baseline {
    align-self: baseline
}

.s-row.s-row-top {
    align-items: flex-start
}

.s-row.s-row-bottom {
    align-items: flex-end
}

.s-row.s-row-center {
    align-items: center
}

.s-row.s-row-stretch {
    align-items: stretch
}

.s-row.s-row-baseline {
    align-items: baseline
}

.s-container {
    margin: 0 auto;
    position: relative;
    max-width: 1170px;
    width: 100%;
}

.s-column {
    display: block;
    flex: 1;
    margin-left: 0;
    max-width: 100%;
    width: 100%;
    min-width: 10rem;
    padding:1em;
}

@media (max-width: 40rem) {
    .s-column {
        flex-basis: auto !important;
        width:100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 414px) {
    .s-column {
        flex-basis: auto !important;
        width:100% !important;
        max-width: 100% !important;
    }
}

@media (min-width: 40rem) {
    .s-column.s-column-wide-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .s-column.s-column-wide-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .s-column.s-column-wide-3 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .s-column.s-column-wide-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .s-column.s-column-wide-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .s-column.s-column-wide-6 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .s-column.s-column-wide-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .s-column.s-column-wide-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .s-column.s-column-wide-9 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .s-column.s-column-wide-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .s-column.s-column-wide-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .s-column.column-wide-12 {
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media (min-width: 40rem) {
    .s-column.s-column-offset-1 {
        margin-left: 8.3333333333%
    }

    .s-column.s-column-offset-2 {
        margin-left: 16.6666666667%
    }

    .s-column.s-column-offset-3 {
        margin-left: 25%
    }

    .s-column.s-column-offset-4 {
        margin-left: 33.3333333333%
    }

    .s-column.s-column-offset-5 {
        margin-left: 41.6666666667%
    }

    .s-column.s-column-offset-6 {
        margin-left: 50%
    }

    .s-column.s-column-offset-7 {
        margin-left: 58.3333333333%
    }

    .s-column.s-column-offset-8 {
        margin-left: 66.6666666667%
    }

    .s-column.s-column-offset-9 {
        margin-left: 75%
    }

    .s-column.s-column-offset-10 {
        margin-left: 83.3333333333%
    }

    .s-column.s-column-offset-11 {
        margin-left: 91.6666666667%
    }

    .s-column.s-column-offset-12 {
        margin-left: 100%
    }
}

.s-row {
    padding: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

@media (max-width: 40rem) {
    .s-row {
        flex-direction: column  !important;
    }
}

@media (max-width: 414px) {
    .s-row {
        flex-direction: column !important;
    } 
}

.s-row.s-row-top {
    align-items: flex-start
}

.s-row.s-row-bottom {
    align-items: flex-end
}

.s-row.s-row-center {
    align-items: center
}

.s-row.s-row-stretch {
    align-items: stretch
}

.s-row.s-row-baseline {
    align-items: baseline
}

.s-row.s-row-1 .s-column {
    min-width: 100%
}

.s-row.s-row-2 .s-column {
    min-width: 50%
}

.s-row.s-row-3 .s-column {
    min-width: 33.3333333333%
}

.s-row.s-row-4 .s-column {
    min-width: 25%
}

.s-row.s-row-5 .s-column {
    min-width: 20%
}

.s-row.s-row-6 .s-column {
    min-width: 16.6666666667%
}

.s-row.s-row-7 .s-column {
    min-width: 14.2857142857%
}

.row.row-8 .s-column {
    min-width: 12.5%
}

.s-row.s-row-9 .s-column {
    min-width: 11.1111111111%
}

.s-row.s-row-10 .s-column {
    min-width: 10%
}

.s-row.s-row-11 .s-column {
    min-width: 9.0909090909%
}

.s-row.s-row-12 .s-column {
    min-width: 8.3333333333%
}