/*flex布局*/

.flex-vertical {
    /* 09版 */
    -webkit-box-orient: vertical;
    /* 12版 */
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
}

.flex-horizontal {
    -webkit-box-orient: horizontal;
    /* 12版 */
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
}

.flex-vertical-center {
    /* 09版 */
    -webkit-box-align: center;
    /* 12版 */
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.flex-vertical-baseline {
    /* 09版 */
    -webkit-box-align: baseline;
    /* 12版 */
    -moz-align-items: baseline;
    -ms-align-items: baseline;
    -o-align-items: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
}

.flex-vertical-start {
    /* 09版 */
    -webkit-box-align: flex-start;
    /* 12版 */
    -moz-align-items: flex-start;
    -ms-align-items: flex-start;
    -o-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.flex-vertical-end {
    /* 09版 */
    -webkit-box-align: flex-end;
    /* 12版 */
    -moz-align-items: flex-end;
    -ms-align-items: flex-end;
    -o-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.flex-horizontal-around {
    /* 09版 */
    -webkit-box-pack: space-around;
    /* 12版 */
    -moz-justify-content: space-around;
    -ms-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.flex-horizontal-between {
    /* 09版 */
    -webkit-box-pack: space-between;
    /* 12版 */
    -moz-justify-content: space-between;
    -ms-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.flex-inline-wrap {
    display: -webkit-inline-box;
    /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
    /* 老版本语法: Firefox (buggy) */
    display: -ms-inline-flexbox;
    /* 混合版本语法: IE 10 */
    /* 新版本语法: Chrome 21+ */
    display: inline-flex;
    /* 新版本语法: Opera 12.1, Firefox 22+ */
}

.flex-wrap {
    display: -webkit-box;
    /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
    /* 老版本语法: Firefox (buggy) */
    display: -ms-flexbox;
    /* 混合版本语法: IE 10 */
    /* 新版本语法: Chrome 21+ */
    display: flex;
    /* 新版本语法: Opera 12.1, Firefox 22+ */
}

.flex-weight-1 {
    -webkit-box-flex: 1;
    /* OLD - iOS 6-, Safari 3.1-6 */
    /* OLD - Firefox 19- */
    /* Chrome */
    -ms-flex: 1;
    /* IE 10 */
    flex: 1;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-weight-2 {
    -webkit-box-flex: 2;
    /* OLD - iOS 6-, Safari 3.1-6 */
    /* OLD - Firefox 19- */
    /* Chrome */
    -ms-flex: 2;
    /* IE 10 */
    flex: 2;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-weight-3 {
    -webkit-box-flex: 3;
    /* OLD - iOS 6-, Safari 3.1-6 */
    /* OLD - Firefox 19- */
    /* Chrome */
    -ms-flex: 3;
    /* IE 10 */
    flex: 3;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-weight-4 {
    -webkit-box-flex: 4;
    /* OLD - iOS 6-, Safari 3.1-6 */
    /* OLD - Firefox 19- */
    /* Chrome */
    -ms-flex: 4;
    /* IE 10 */
    flex: 4;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-weight-5 {
    -webkit-box-flex: 5;
    /* OLD - iOS 6-, Safari 3.1-6 */
    /* OLD - Firefox 19- */
    /* Chrome */
    -ms-flex: 5;
    /* IE 10 */
    flex: 5;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.flex-vertical>.flex-weight-1,
.flex-vertical>.flex-weight-2,
.flex-vertical>.flex-weight-3,
.flex-vertical>.flex-weight-4,
.flex-vertical>.flex-weight-5 {
    height: 100%;
    min-height: 0;
}

.flex-horizontal>.flex-weight-1,
.flex-horizontal>.flex-weight-2,
.flex-horizontal>.flex-weight-3,
.flex-horizontal>.flex-weight-4,
.flex-horizontal>.flex-weight-5 {
    width: 100%;
    min-width: 0;
}