@alicd/crui-form-item
Version:
@alicd/next 中 Form.Item 组件能力的扩展,增加了错误的提示方式 showValidateType ,其他能力和 Form.Item 保持一致,必须放置在 Form 元素中
2,090 lines (1,862 loc) • 128 kB
CSS
@charset "UTF-8";
/**
* 尺寸 基础尺寸
* 命名能在语义的前提下简单就尽量简单, 这里可以是 size-2x, space-2x, size-base ...
* 不过可以在语义的前提下做的更精简一些, 于是用了s2, s1等
* 可用变量: `$s1 - $s8`
* @example scss - 使用
* .element {
* padding: $s1 !default;
* }
*
* @example css - CSS 输出
* .element {
* padding: 4px !default;
* }
*/
/**
* 尺寸 基础尺寸
* 命名能在语义的前提下简单就尽量简单, 这里可以是 size-2x, space-2x, size-base ...
* 不过可以在语义的前提下做的更精简一些, 于是用了s2, s1等
* 可用变量: `$s1 - $s8`
* @example scss - 使用
* .element {
* padding: $s1 !default;
* }
*
* @example css - CSS 输出
* .element {
* padding: 4px !default;
* }
*/
.next-w344 .next-row {
padding: 0 8px; }
.next-w344 .next-row-fixed {
width: 320px; }
.next-w344 .next-row-fluid {
max-width: 320px; }
.next-w344 .next-row .next-col-xxs-hidden {
display: none; }
.next-w344-together .next-row .next-col-xxs-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w344-together .next-row .next-col-xxs-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w344-together .next-row .next-col-xxs-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w344-together .next-row .next-col-xxs-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w344-together .next-row .next-col-xxs-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w344-together .next-row .next-col-xxs-6 {
max-width: 25%;
width: 25%; }
.next-w344-together .next-row .next-col-xxs-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w344-together .next-row .next-col-xxs-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w344-together .next-row .next-col-xxs-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w344-together .next-row .next-col-xxs-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w344-together .next-row .next-col-xxs-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w344-together .next-row .next-col-xxs-12 {
max-width: 50%;
width: 50%; }
.next-w344-together .next-row .next-col-xxs-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w344-together .next-row .next-col-xxs-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w344-together .next-row .next-col-xxs-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w344-together .next-row .next-col-xxs-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w344-together .next-row .next-col-xxs-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w344-together .next-row .next-col-xxs-18 {
max-width: 75%;
width: 75%; }
.next-w344-together .next-row .next-col-xxs-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w344-together .next-row .next-col-xxs-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w344-together .next-row .next-col-xxs-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w344-together .next-row .next-col-xxs-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w344-together .next-row .next-col-xxs-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w344-together .next-row .next-col-xxs-24 {
max-width: 100%;
width: 100%; }
.next-w344-together .next-row .next-col-xxs-1p5 {
max-width: 20%;
width: 20%; }
.next-w344-together .next-row .next-col-xxs-2p5 {
max-width: 40%;
width: 40%; }
.next-w344-together .next-row .next-col-xxs-3p5 {
max-width: 60%;
width: 60%; }
.next-w344-together .next-row .next-col-xxs-4p5 {
max-width: 80%;
width: 80%; }
.next-w344-together .next-row .next-col-xxs-5p5 {
max-width: 100%;
width: 100%; }
.next-w504 .next-row {
padding: 0 8px; }
.next-w504 .next-row-fixed {
width: 480px; }
.next-w504 .next-row-fluid {
max-width: 480px; }
.next-w504 .next-row .next-col-xs-hidden {
display: none; }
.next-w504-together .next-row .next-col-xs-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w504-together .next-row .next-col-xs-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w504-together .next-row .next-col-xs-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w504-together .next-row .next-col-xs-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w504-together .next-row .next-col-xs-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w504-together .next-row .next-col-xs-6 {
max-width: 25%;
width: 25%; }
.next-w504-together .next-row .next-col-xs-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w504-together .next-row .next-col-xs-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w504-together .next-row .next-col-xs-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w504-together .next-row .next-col-xs-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w504-together .next-row .next-col-xs-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w504-together .next-row .next-col-xs-12 {
max-width: 50%;
width: 50%; }
.next-w504-together .next-row .next-col-xs-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w504-together .next-row .next-col-xs-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w504-together .next-row .next-col-xs-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w504-together .next-row .next-col-xs-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w504-together .next-row .next-col-xs-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w504-together .next-row .next-col-xs-18 {
max-width: 75%;
width: 75%; }
.next-w504-together .next-row .next-col-xs-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w504-together .next-row .next-col-xs-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w504-together .next-row .next-col-xs-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w504-together .next-row .next-col-xs-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w504-together .next-row .next-col-xs-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w504-together .next-row .next-col-xs-24 {
max-width: 100%;
width: 100%; }
.next-w504-together .next-row .next-col-xs-1p5 {
max-width: 20%;
width: 20%; }
.next-w504-together .next-row .next-col-xs-2p5 {
max-width: 40%;
width: 40%; }
.next-w504-together .next-row .next-col-xs-3p5 {
max-width: 60%;
width: 60%; }
.next-w504-together .next-row .next-col-xs-4p5 {
max-width: 80%;
width: 80%; }
.next-w504-together .next-row .next-col-xs-5p5 {
max-width: 100%;
width: 100%; }
.next-w752 .next-row {
padding: 0 12px; }
.next-w752 .next-row-fixed {
width: 720px; }
.next-w752 .next-row-fluid {
max-width: 720px; }
.next-w752 .next-row .next-col-s-hidden {
display: none; }
.next-w752-together .next-row .next-col-s-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w752-together .next-row .next-col-s-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w752-together .next-row .next-col-s-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w752-together .next-row .next-col-s-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w752-together .next-row .next-col-s-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w752-together .next-row .next-col-s-6 {
max-width: 25%;
width: 25%; }
.next-w752-together .next-row .next-col-s-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w752-together .next-row .next-col-s-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w752-together .next-row .next-col-s-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w752-together .next-row .next-col-s-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w752-together .next-row .next-col-s-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w752-together .next-row .next-col-s-12 {
max-width: 50%;
width: 50%; }
.next-w752-together .next-row .next-col-s-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w752-together .next-row .next-col-s-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w752-together .next-row .next-col-s-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w752-together .next-row .next-col-s-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w752-together .next-row .next-col-s-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w752-together .next-row .next-col-s-18 {
max-width: 75%;
width: 75%; }
.next-w752-together .next-row .next-col-s-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w752-together .next-row .next-col-s-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w752-together .next-row .next-col-s-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w752-together .next-row .next-col-s-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w752-together .next-row .next-col-s-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w752-together .next-row .next-col-s-24 {
max-width: 100%;
width: 100%; }
.next-w752-together .next-row .next-col-s-1p5 {
max-width: 20%;
width: 20%; }
.next-w752-together .next-row .next-col-s-2p5 {
max-width: 40%;
width: 40%; }
.next-w752-together .next-row .next-col-s-3p5 {
max-width: 60%;
width: 60%; }
.next-w752-together .next-row .next-col-s-4p5 {
max-width: 80%;
width: 80%; }
.next-w752-together .next-row .next-col-s-5p5 {
max-width: 100%;
width: 100%; }
.next-w1022 .next-row {
padding: 0 12px; }
.next-w1022 .next-row-fixed {
width: 990px; }
.next-w1022 .next-row-fluid {
max-width: 990px; }
.next-w1022 .next-row .next-col-m-hidden {
display: none; }
.next-w1022-together .next-row .next-col-m-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w1022-together .next-row .next-col-m-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w1022-together .next-row .next-col-m-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w1022-together .next-row .next-col-m-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w1022-together .next-row .next-col-m-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w1022-together .next-row .next-col-m-6 {
max-width: 25%;
width: 25%; }
.next-w1022-together .next-row .next-col-m-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w1022-together .next-row .next-col-m-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w1022-together .next-row .next-col-m-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w1022-together .next-row .next-col-m-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w1022-together .next-row .next-col-m-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w1022-together .next-row .next-col-m-12 {
max-width: 50%;
width: 50%; }
.next-w1022-together .next-row .next-col-m-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w1022-together .next-row .next-col-m-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w1022-together .next-row .next-col-m-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w1022-together .next-row .next-col-m-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w1022-together .next-row .next-col-m-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w1022-together .next-row .next-col-m-18 {
max-width: 75%;
width: 75%; }
.next-w1022-together .next-row .next-col-m-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w1022-together .next-row .next-col-m-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w1022-together .next-row .next-col-m-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w1022-together .next-row .next-col-m-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w1022-together .next-row .next-col-m-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w1022-together .next-row .next-col-m-24 {
max-width: 100%;
width: 100%; }
.next-w1022-together .next-row .next-col-m-1p5 {
max-width: 20%;
width: 20%; }
.next-w1022-together .next-row .next-col-m-2p5 {
max-width: 40%;
width: 40%; }
.next-w1022-together .next-row .next-col-m-3p5 {
max-width: 60%;
width: 60%; }
.next-w1022-together .next-row .next-col-m-4p5 {
max-width: 80%;
width: 80%; }
.next-w1022-together .next-row .next-col-m-5p5 {
max-width: 100%;
width: 100%; }
.next-w1232 .next-row {
padding: 0 12px; }
.next-w1232 .next-row-fixed {
width: 1200px; }
.next-w1232 .next-row-fluid {
max-width: 1200px; }
.next-w1232 .next-row .next-col-l-hidden {
display: none; }
.next-w1232-together .next-row .next-col-l-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w1232-together .next-row .next-col-l-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w1232-together .next-row .next-col-l-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w1232-together .next-row .next-col-l-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w1232-together .next-row .next-col-l-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w1232-together .next-row .next-col-l-6 {
max-width: 25%;
width: 25%; }
.next-w1232-together .next-row .next-col-l-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w1232-together .next-row .next-col-l-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w1232-together .next-row .next-col-l-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w1232-together .next-row .next-col-l-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w1232-together .next-row .next-col-l-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w1232-together .next-row .next-col-l-12 {
max-width: 50%;
width: 50%; }
.next-w1232-together .next-row .next-col-l-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w1232-together .next-row .next-col-l-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w1232-together .next-row .next-col-l-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w1232-together .next-row .next-col-l-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w1232-together .next-row .next-col-l-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w1232-together .next-row .next-col-l-18 {
max-width: 75%;
width: 75%; }
.next-w1232-together .next-row .next-col-l-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w1232-together .next-row .next-col-l-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w1232-together .next-row .next-col-l-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w1232-together .next-row .next-col-l-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w1232-together .next-row .next-col-l-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w1232-together .next-row .next-col-l-24 {
max-width: 100%;
width: 100%; }
.next-w1232-together .next-row .next-col-l-1p5 {
max-width: 20%;
width: 20%; }
.next-w1232-together .next-row .next-col-l-2p5 {
max-width: 40%;
width: 40%; }
.next-w1232-together .next-row .next-col-l-3p5 {
max-width: 60%;
width: 60%; }
.next-w1232-together .next-row .next-col-l-4p5 {
max-width: 80%;
width: 80%; }
.next-w1232-together .next-row .next-col-l-5p5 {
max-width: 100%;
width: 100%; }
.next-w1532 .next-row {
padding: 0 12px; }
.next-w1532 .next-row-fixed {
width: 1500px; }
.next-w1532 .next-row-fluid {
max-width: 1500px; }
.next-w1532 .next-row .next-col-xl-hidden {
display: none; }
.next-w1532-together .next-row .next-col-xl-1 {
max-width: 4.16667%;
width: 4.16667%; }
.next-w1532-together .next-row .next-col-xl-2 {
max-width: 8.33333%;
width: 8.33333%; }
.next-w1532-together .next-row .next-col-xl-3 {
max-width: 12.5%;
width: 12.5%; }
.next-w1532-together .next-row .next-col-xl-4 {
max-width: 16.66667%;
width: 16.66667%; }
.next-w1532-together .next-row .next-col-xl-5 {
max-width: 20.83333%;
width: 20.83333%; }
.next-w1532-together .next-row .next-col-xl-6 {
max-width: 25%;
width: 25%; }
.next-w1532-together .next-row .next-col-xl-7 {
max-width: 29.16667%;
width: 29.16667%; }
.next-w1532-together .next-row .next-col-xl-8 {
max-width: 33.33333%;
width: 33.33333%; }
.next-w1532-together .next-row .next-col-xl-9 {
max-width: 37.5%;
width: 37.5%; }
.next-w1532-together .next-row .next-col-xl-10 {
max-width: 41.66667%;
width: 41.66667%; }
.next-w1532-together .next-row .next-col-xl-11 {
max-width: 45.83333%;
width: 45.83333%; }
.next-w1532-together .next-row .next-col-xl-12 {
max-width: 50%;
width: 50%; }
.next-w1532-together .next-row .next-col-xl-13 {
max-width: 54.16667%;
width: 54.16667%; }
.next-w1532-together .next-row .next-col-xl-14 {
max-width: 58.33333%;
width: 58.33333%; }
.next-w1532-together .next-row .next-col-xl-15 {
max-width: 62.5%;
width: 62.5%; }
.next-w1532-together .next-row .next-col-xl-16 {
max-width: 66.66667%;
width: 66.66667%; }
.next-w1532-together .next-row .next-col-xl-17 {
max-width: 70.83333%;
width: 70.83333%; }
.next-w1532-together .next-row .next-col-xl-18 {
max-width: 75%;
width: 75%; }
.next-w1532-together .next-row .next-col-xl-19 {
max-width: 79.16667%;
width: 79.16667%; }
.next-w1532-together .next-row .next-col-xl-20 {
max-width: 83.33333%;
width: 83.33333%; }
.next-w1532-together .next-row .next-col-xl-21 {
max-width: 87.5%;
width: 87.5%; }
.next-w1532-together .next-row .next-col-xl-22 {
max-width: 91.66667%;
width: 91.66667%; }
.next-w1532-together .next-row .next-col-xl-23 {
max-width: 95.83333%;
width: 95.83333%; }
.next-w1532-together .next-row .next-col-xl-24 {
max-width: 100%;
width: 100%; }
.next-w1532-together .next-row .next-col-xl-1p5 {
max-width: 20%;
width: 20%; }
.next-w1532-together .next-row .next-col-xl-2p5 {
max-width: 40%;
width: 40%; }
.next-w1532-together .next-row .next-col-xl-3p5 {
max-width: 60%;
width: 60%; }
.next-w1532-together .next-row .next-col-xl-4p5 {
max-width: 80%;
width: 80%; }
.next-w1532-together .next-row .next-col-xl-5p5 {
max-width: 100%;
width: 100%; }
/* Grid System*/
/* 根据 Alibaba Base DPL(BASE DPL)设计规范实现*/
/* 栅格系统, 根据不同的屏幕尺寸情况,调整这些区块的排版,将页面划分为若干等宽的列,然后推荐通过等宽列来创建响应式的页面区块。另外,屏幕宽度较大的时候,区块倾向于水平分布,而屏幕宽度较小的时候,区块倾向于竖直堆叠。*/
/* -------------------------------*/
/* 使用 Flex 实现栅格系统*/
/* .row 为行容器, .col 为列容器, .col 放置在 .row 中,*/
/* 默认 .row 中的 .col 会占满并平分 .row 的宽度*/
/* 行容器*/
.next-row {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
/* 固定宽度布局*/
/* 流式布局*/
/* 单行模式,多列溢出折行*/
/* 单行模式,多列溢出不折行*/
/* 所有列之间均没有留白*/
/* 通栏*/ }
.next-row *,
.next-row *:before,
.next-row *:after {
box-sizing: border-box; }
@media (min-width: 344px) {
.next-row {
padding: 0 8px; } }
@media (min-width: 504px) {
.next-row {
padding: 0 8px; } }
@media (min-width: 752px) {
.next-row {
padding: 0 12px; } }
@media (min-width: 1022px) {
.next-row {
padding: 0 12px; } }
@media (min-width: 1232px) {
.next-row {
padding: 0 12px; } }
@media (min-width: 1532px) {
.next-row {
padding: 0 12px; } }
.next-row.next-row-fixed {
margin-left: auto;
margin-right: auto; }
@media (min-width: 344px) {
.next-row.next-row-fixed {
width: 320px; } }
@media (min-width: 504px) {
.next-row.next-row-fixed {
width: 480px; } }
@media (min-width: 752px) {
.next-row.next-row-fixed {
width: 720px; } }
@media (min-width: 1022px) {
.next-row.next-row-fixed {
width: 990px; } }
@media (min-width: 1232px) {
.next-row.next-row-fixed {
width: 1200px; } }
@media (min-width: 1532px) {
.next-row.next-row-fixed {
width: 1500px; } }
.next-row.next-row-fluid {
margin-left: auto;
margin-right: auto; }
@media (min-width: 344px) {
.next-row.next-row-fluid {
max-width: 320px; } }
@media (min-width: 504px) {
.next-row.next-row-fluid {
max-width: 480px; } }
@media (min-width: 752px) {
.next-row.next-row-fluid {
max-width: 720px; } }
@media (min-width: 1022px) {
.next-row.next-row-fluid {
max-width: 990px; } }
@media (min-width: 1232px) {
.next-row.next-row-fluid {
max-width: 1200px; } }
@media (min-width: 1532px) {
.next-row.next-row-fluid {
max-width: 1500px; } }
.next-row.next-row-wrap {
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
.next-row.next-row-no-wrap {
-webkit-flex-wrap: nowrap;
-moz-flex-wrap: nowrap;
-ms-flex-wrap: none;
flex-wrap: nowrap; }
.next-row.next-row-no-padding {
padding: 0; }
.next-row.next-row-no-padding > .next-col {
padding: 0; }
.next-row.next-row-across {
padding: 0;
margin-left: -4px;
margin-right: -4px; }
.next-row.next-row-fixed-xxs {
width: 320px; }
.next-row.next-row-fixed-xs {
width: 480px; }
.next-row.next-row-fixed-s {
width: 720px; }
.next-row.next-row-fixed-m {
width: 990px; }
.next-row.next-row-fixed-l {
width: 1200px; }
.next-row.next-row-fixed-xl {
width: 1500px; }
.next-row.next-row-justify-start {
justify-content: flex-start; }
.next-row.next-row-justify-end {
justify-content: flex-end; }
.next-row.next-row-justify-center {
justify-content: center; }
.next-row.next-row-justify-space-between {
justify-content: space-between; }
.next-row.next-row-justify-space-around {
justify-content: space-around; }
/* 列容器,列两侧间距为栅格槽的宽度*/
.next-col {
-webkit-box-flex: 1;
-webkit-flex: 1 1 auto;
-moz-box-flex: 1;
-moz-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
display: inline-block;
padding: 0 4px;
width: auto; }
.next-col > .next-row {
padding: 0; }
.next-row .next-col-1 {
width: 4.16667%;
max-width: 4.16667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%; }
.next-row .next-col-2 {
width: 8.33333%;
max-width: 8.33333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%; }
.next-row .next-col-3 {
width: 12.5%;
max-width: 12.5%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%; }
.next-row .next-col-4 {
width: 16.66667%;
max-width: 16.66667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%; }
.next-row .next-col-5 {
width: 20.83333%;
max-width: 20.83333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 20.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 20.83333%;
-ms-flex: 0 0 20.83333%;
flex: 0 0 20.83333%; }
.next-row .next-col-6 {
width: 25%;
max-width: 25%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 25%;
-moz-box-flex: 0;
-moz-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%; }
.next-row .next-col-7 {
width: 29.16667%;
max-width: 29.16667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 29.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 29.16667%;
-ms-flex: 0 0 29.16667%;
flex: 0 0 29.16667%; }
.next-row .next-col-8 {
width: 33.33333%;
max-width: 33.33333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 33.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%; }
.next-row .next-col-9 {
width: 37.5%;
max-width: 37.5%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 37.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 37.5%;
-ms-flex: 0 0 37.5%;
flex: 0 0 37.5%; }
.next-row .next-col-10 {
width: 41.66667%;
max-width: 41.66667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 41.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%; }
.next-row .next-col-11 {
width: 45.83333%;
max-width: 45.83333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 45.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 45.83333%;
-ms-flex: 0 0 45.83333%;
flex: 0 0 45.83333%; }
.next-row .next-col-12 {
width: 50%;
max-width: 50%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 50%;
-moz-box-flex: 0;
-moz-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%; }
.next-row .next-col-13 {
width: 54.16667%;
max-width: 54.16667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 54.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 54.16667%;
-ms-flex: 0 0 54.16667%;
flex: 0 0 54.16667%; }
.next-row .next-col-14 {
width: 58.33333%;
max-width: 58.33333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 58.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%; }
.next-row .next-col-15 {
width: 62.5%;
max-width: 62.5%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 62.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 62.5%;
-ms-flex: 0 0 62.5%;
flex: 0 0 62.5%; }
.next-row .next-col-16 {
width: 66.66667%;
max-width: 66.66667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 66.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%; }
.next-row .next-col-17 {
width: 70.83333%;
max-width: 70.83333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 70.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 70.83333%;
-ms-flex: 0 0 70.83333%;
flex: 0 0 70.83333%; }
.next-row .next-col-18 {
width: 75%;
max-width: 75%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 75%;
-moz-box-flex: 0;
-moz-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%; }
.next-row .next-col-19 {
width: 79.16667%;
max-width: 79.16667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 79.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 79.16667%;
-ms-flex: 0 0 79.16667%;
flex: 0 0 79.16667%; }
.next-row .next-col-20 {
width: 83.33333%;
max-width: 83.33333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 83.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%; }
.next-row .next-col-21 {
width: 87.5%;
max-width: 87.5%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 87.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 87.5%;
-ms-flex: 0 0 87.5%;
flex: 0 0 87.5%; }
.next-row .next-col-22 {
width: 91.66667%;
max-width: 91.66667%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 91.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%; }
.next-row .next-col-23 {
width: 95.83333%;
max-width: 95.83333%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 95.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 95.83333%;
-ms-flex: 0 0 95.83333%;
flex: 0 0 95.83333%; }
.next-row .next-col-24 {
width: 100%;
max-width: 100%;
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-moz-box-flex: 0;
-moz-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%; }
@media (min-width: 344px) {
.next-row .next-col-xxs-1 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%;
max-width: 4.16667%;
width: 4.16667%; }
.next-row .next-col-xxs-2 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
width: 8.33333%; }
.next-row .next-col-xxs-3 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%;
max-width: 12.5%;
width: 12.5%; }
.next-row .next-col-xxs-4 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
width: 16.66667%; }
.next-row .next-col-xxs-5 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 20.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 20.83333%;
-ms-flex: 0 0 20.83333%;
flex: 0 0 20.83333%;
max-width: 20.83333%;
width: 20.83333%; }
.next-row .next-col-xxs-6 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 25%;
-moz-box-flex: 0;
-moz-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
width: 25%; }
.next-row .next-col-xxs-7 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 29.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 29.16667%;
-ms-flex: 0 0 29.16667%;
flex: 0 0 29.16667%;
max-width: 29.16667%;
width: 29.16667%; }
.next-row .next-col-xxs-8 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 33.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
width: 33.33333%; }
.next-row .next-col-xxs-9 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 37.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 37.5%;
-ms-flex: 0 0 37.5%;
flex: 0 0 37.5%;
max-width: 37.5%;
width: 37.5%; }
.next-row .next-col-xxs-10 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 41.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
width: 41.66667%; }
.next-row .next-col-xxs-11 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 45.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 45.83333%;
-ms-flex: 0 0 45.83333%;
flex: 0 0 45.83333%;
max-width: 45.83333%;
width: 45.83333%; }
.next-row .next-col-xxs-12 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 50%;
-moz-box-flex: 0;
-moz-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
width: 50%; }
.next-row .next-col-xxs-13 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 54.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 54.16667%;
-ms-flex: 0 0 54.16667%;
flex: 0 0 54.16667%;
max-width: 54.16667%;
width: 54.16667%; }
.next-row .next-col-xxs-14 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 58.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
width: 58.33333%; }
.next-row .next-col-xxs-15 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 62.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 62.5%;
-ms-flex: 0 0 62.5%;
flex: 0 0 62.5%;
max-width: 62.5%;
width: 62.5%; }
.next-row .next-col-xxs-16 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 66.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
width: 66.66667%; }
.next-row .next-col-xxs-17 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 70.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 70.83333%;
-ms-flex: 0 0 70.83333%;
flex: 0 0 70.83333%;
max-width: 70.83333%;
width: 70.83333%; }
.next-row .next-col-xxs-18 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 75%;
-moz-box-flex: 0;
-moz-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
width: 75%; }
.next-row .next-col-xxs-19 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 79.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 79.16667%;
-ms-flex: 0 0 79.16667%;
flex: 0 0 79.16667%;
max-width: 79.16667%;
width: 79.16667%; }
.next-row .next-col-xxs-20 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 83.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
width: 83.33333%; }
.next-row .next-col-xxs-21 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 87.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 87.5%;
-ms-flex: 0 0 87.5%;
flex: 0 0 87.5%;
max-width: 87.5%;
width: 87.5%; }
.next-row .next-col-xxs-22 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 91.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
width: 91.66667%; }
.next-row .next-col-xxs-23 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 95.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 95.83333%;
-ms-flex: 0 0 95.83333%;
flex: 0 0 95.83333%;
max-width: 95.83333%;
width: 95.83333%; }
.next-row .next-col-xxs-24 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-moz-box-flex: 0;
-moz-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
width: 100%; } }
@media (min-width: 504px) {
.next-row .next-col-xs-1 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%;
max-width: 4.16667%;
width: 4.16667%; }
.next-row .next-col-xs-2 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
width: 8.33333%; }
.next-row .next-col-xs-3 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%;
max-width: 12.5%;
width: 12.5%; }
.next-row .next-col-xs-4 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
width: 16.66667%; }
.next-row .next-col-xs-5 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 20.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 20.83333%;
-ms-flex: 0 0 20.83333%;
flex: 0 0 20.83333%;
max-width: 20.83333%;
width: 20.83333%; }
.next-row .next-col-xs-6 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 25%;
-moz-box-flex: 0;
-moz-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
width: 25%; }
.next-row .next-col-xs-7 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 29.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 29.16667%;
-ms-flex: 0 0 29.16667%;
flex: 0 0 29.16667%;
max-width: 29.16667%;
width: 29.16667%; }
.next-row .next-col-xs-8 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 33.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
width: 33.33333%; }
.next-row .next-col-xs-9 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 37.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 37.5%;
-ms-flex: 0 0 37.5%;
flex: 0 0 37.5%;
max-width: 37.5%;
width: 37.5%; }
.next-row .next-col-xs-10 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 41.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
width: 41.66667%; }
.next-row .next-col-xs-11 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 45.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 45.83333%;
-ms-flex: 0 0 45.83333%;
flex: 0 0 45.83333%;
max-width: 45.83333%;
width: 45.83333%; }
.next-row .next-col-xs-12 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 50%;
-moz-box-flex: 0;
-moz-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
width: 50%; }
.next-row .next-col-xs-13 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 54.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 54.16667%;
-ms-flex: 0 0 54.16667%;
flex: 0 0 54.16667%;
max-width: 54.16667%;
width: 54.16667%; }
.next-row .next-col-xs-14 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 58.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
width: 58.33333%; }
.next-row .next-col-xs-15 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 62.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 62.5%;
-ms-flex: 0 0 62.5%;
flex: 0 0 62.5%;
max-width: 62.5%;
width: 62.5%; }
.next-row .next-col-xs-16 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 66.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
width: 66.66667%; }
.next-row .next-col-xs-17 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 70.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 70.83333%;
-ms-flex: 0 0 70.83333%;
flex: 0 0 70.83333%;
max-width: 70.83333%;
width: 70.83333%; }
.next-row .next-col-xs-18 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 75%;
-moz-box-flex: 0;
-moz-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
width: 75%; }
.next-row .next-col-xs-19 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 79.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 79.16667%;
-ms-flex: 0 0 79.16667%;
flex: 0 0 79.16667%;
max-width: 79.16667%;
width: 79.16667%; }
.next-row .next-col-xs-20 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 83.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
width: 83.33333%; }
.next-row .next-col-xs-21 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 87.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 87.5%;
-ms-flex: 0 0 87.5%;
flex: 0 0 87.5%;
max-width: 87.5%;
width: 87.5%; }
.next-row .next-col-xs-22 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 91.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
width: 91.66667%; }
.next-row .next-col-xs-23 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 95.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 95.83333%;
-ms-flex: 0 0 95.83333%;
flex: 0 0 95.83333%;
max-width: 95.83333%;
width: 95.83333%; }
.next-row .next-col-xs-24 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-moz-box-flex: 0;
-moz-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
width: 100%; } }
@media (min-width: 752px) {
.next-row .next-col-s-1 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%;
max-width: 4.16667%;
width: 4.16667%; }
.next-row .next-col-s-2 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
width: 8.33333%; }
.next-row .next-col-s-3 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%;
max-width: 12.5%;
width: 12.5%; }
.next-row .next-col-s-4 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
width: 16.66667%; }
.next-row .next-col-s-5 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 20.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 20.83333%;
-ms-flex: 0 0 20.83333%;
flex: 0 0 20.83333%;
max-width: 20.83333%;
width: 20.83333%; }
.next-row .next-col-s-6 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 25%;
-moz-box-flex: 0;
-moz-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
width: 25%; }
.next-row .next-col-s-7 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 29.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 29.16667%;
-ms-flex: 0 0 29.16667%;
flex: 0 0 29.16667%;
max-width: 29.16667%;
width: 29.16667%; }
.next-row .next-col-s-8 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 33.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
width: 33.33333%; }
.next-row .next-col-s-9 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 37.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 37.5%;
-ms-flex: 0 0 37.5%;
flex: 0 0 37.5%;
max-width: 37.5%;
width: 37.5%; }
.next-row .next-col-s-10 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 41.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
width: 41.66667%; }
.next-row .next-col-s-11 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 45.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 45.83333%;
-ms-flex: 0 0 45.83333%;
flex: 0 0 45.83333%;
max-width: 45.83333%;
width: 45.83333%; }
.next-row .next-col-s-12 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 50%;
-moz-box-flex: 0;
-moz-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
width: 50%; }
.next-row .next-col-s-13 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 54.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 54.16667%;
-ms-flex: 0 0 54.16667%;
flex: 0 0 54.16667%;
max-width: 54.16667%;
width: 54.16667%; }
.next-row .next-col-s-14 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 58.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
width: 58.33333%; }
.next-row .next-col-s-15 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 62.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 62.5%;
-ms-flex: 0 0 62.5%;
flex: 0 0 62.5%;
max-width: 62.5%;
width: 62.5%; }
.next-row .next-col-s-16 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 66.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
width: 66.66667%; }
.next-row .next-col-s-17 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 70.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 70.83333%;
-ms-flex: 0 0 70.83333%;
flex: 0 0 70.83333%;
max-width: 70.83333%;
width: 70.83333%; }
.next-row .next-col-s-18 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 75%;
-moz-box-flex: 0;
-moz-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
width: 75%; }
.next-row .next-col-s-19 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 79.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 79.16667%;
-ms-flex: 0 0 79.16667%;
flex: 0 0 79.16667%;
max-width: 79.16667%;
width: 79.16667%; }
.next-row .next-col-s-20 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 83.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
width: 83.33333%; }
.next-row .next-col-s-21 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 87.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 87.5%;
-ms-flex: 0 0 87.5%;
flex: 0 0 87.5%;
max-width: 87.5%;
width: 87.5%; }
.next-row .next-col-s-22 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 91.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
width: 91.66667%; }
.next-row .next-col-s-23 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 95.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 95.83333%;
-ms-flex: 0 0 95.83333%;
flex: 0 0 95.83333%;
max-width: 95.83333%;
width: 95.83333%; }
.next-row .next-col-s-24 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-moz-box-flex: 0;
-moz-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
width: 100%; } }
@media (min-width: 1022px) {
.next-row .next-col-m-1 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%;
max-width: 4.16667%;
width: 4.16667%; }
.next-row .next-col-m-2 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
width: 8.33333%; }
.next-row .next-col-m-3 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%;
max-width: 12.5%;
width: 12.5%; }
.next-row .next-col-m-4 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
width: 16.66667%; }
.next-row .next-col-m-5 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 20.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 20.83333%;
-ms-flex: 0 0 20.83333%;
flex: 0 0 20.83333%;
max-width: 20.83333%;
width: 20.83333%; }
.next-row .next-col-m-6 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 25%;
-moz-box-flex: 0;
-moz-flex: 0 0 25%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
width: 25%; }
.next-row .next-col-m-7 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 29.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 29.16667%;
-ms-flex: 0 0 29.16667%;
flex: 0 0 29.16667%;
max-width: 29.16667%;
width: 29.16667%; }
.next-row .next-col-m-8 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 33.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
flex: 0 0 33.33333%;
max-width: 33.33333%;
width: 33.33333%; }
.next-row .next-col-m-9 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 37.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 37.5%;
-ms-flex: 0 0 37.5%;
flex: 0 0 37.5%;
max-width: 37.5%;
width: 37.5%; }
.next-row .next-col-m-10 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 41.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
flex: 0 0 41.66667%;
max-width: 41.66667%;
width: 41.66667%; }
.next-row .next-col-m-11 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 45.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 45.83333%;
-ms-flex: 0 0 45.83333%;
flex: 0 0 45.83333%;
max-width: 45.83333%;
width: 45.83333%; }
.next-row .next-col-m-12 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 50%;
-moz-box-flex: 0;
-moz-flex: 0 0 50%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
width: 50%; }
.next-row .next-col-m-13 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 54.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 54.16667%;
-ms-flex: 0 0 54.16667%;
flex: 0 0 54.16667%;
max-width: 54.16667%;
width: 54.16667%; }
.next-row .next-col-m-14 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 58.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
flex: 0 0 58.33333%;
max-width: 58.33333%;
width: 58.33333%; }
.next-row .next-col-m-15 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 62.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 62.5%;
-ms-flex: 0 0 62.5%;
flex: 0 0 62.5%;
max-width: 62.5%;
width: 62.5%; }
.next-row .next-col-m-16 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 66.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
flex: 0 0 66.66667%;
max-width: 66.66667%;
width: 66.66667%; }
.next-row .next-col-m-17 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 70.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 70.83333%;
-ms-flex: 0 0 70.83333%;
flex: 0 0 70.83333%;
max-width: 70.83333%;
width: 70.83333%; }
.next-row .next-col-m-18 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 75%;
-moz-box-flex: 0;
-moz-flex: 0 0 75%;
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
width: 75%; }
.next-row .next-col-m-19 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 79.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 79.16667%;
-ms-flex: 0 0 79.16667%;
flex: 0 0 79.16667%;
max-width: 79.16667%;
width: 79.16667%; }
.next-row .next-col-m-20 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 83.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
flex: 0 0 83.33333%;
max-width: 83.33333%;
width: 83.33333%; }
.next-row .next-col-m-21 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 87.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 87.5%;
-ms-flex: 0 0 87.5%;
flex: 0 0 87.5%;
max-width: 87.5%;
width: 87.5%; }
.next-row .next-col-m-22 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 91.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
flex: 0 0 91.66667%;
max-width: 91.66667%;
width: 91.66667%; }
.next-row .next-col-m-23 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 95.83333%;
-moz-box-flex: 0;
-moz-flex: 0 0 95.83333%;
-ms-flex: 0 0 95.83333%;
flex: 0 0 95.83333%;
max-width: 95.83333%;
width: 95.83333%; }
.next-row .next-col-m-24 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-moz-box-flex: 0;
-moz-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
width: 100%; } }
@media (min-width: 1232px) {
.next-row .next-col-l-1 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 4.16667%;
-moz-box-flex: 0;
-moz-flex: 0 0 4.16667%;
-ms-flex: 0 0 4.16667%;
flex: 0 0 4.16667%;
max-width: 4.16667%;
width: 4.16667%; }
.next-row .next-col-l-2 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 8.33333%;
-moz-box-flex: 0;
-moz-flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
flex: 0 0 8.33333%;
max-width: 8.33333%;
width: 8.33333%; }
.next-row .next-col-l-3 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 12.5%;
-moz-box-flex: 0;
-moz-flex: 0 0 12.5%;
-ms-flex: 0 0 12.5%;
flex: 0 0 12.5%;
max-width: 12.5%;
width: 12.5%; }
.next-row .next-col-l-4 {
-webkit-box-flex: 0;
-webkit-flex: 0 0 16.66667%;
-moz-box-flex: 0;
-moz-flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
flex: 0 0 16.66667%;
max-width: 16.66667%;
width: 16.66667%; }
.next-row .next-co