.ons-container {
    box-sizing: border-box;
    margin: 0 auto;
    max-width: $grid-max-width;
    padding: 0 $grid-gutters;
    position: relative;
    width: 100%;

    @include mq(s) {
        padding: 0 $grid-gutters;
    }

    &--wide {
        max-width: $grid-max-1280;
    }

    &--full-width {
        max-width: 100%;
    }
}

.ons-grid--align-bottom {
    .ons-grid__col {
        vertical-align: bottom;
    }
}

.ons-grid__col {
    font-size: 1.125rem;
}

@include bp-suffix('ons-container--gutterless', $create-between-breakpoints: true) {
    padding: 0;
}