/*容器的布局方式*/
.all-flex{
	display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
	display: -moz-box; /* 老版本语法: Firefox (buggy) */
	display: -ms-flexbox; /* 混合版本语法: IE 10 */
	display: -webkit-flex; /* 新版本语法: Chrome 21+ */
	display: flex; /* 新版本语法: Opera 12.1, Firefox 22+ */
}
/*主轴为X方向*/
.all-drection-row{
	-webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-flex-direction: row;
    -ms-flex-direction:row;
    -webkit-flex-direction: row;
    flex-direction: row;
}
/*自动换行*/
.all-flex-wrap{
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
/*主轴为Y方向*/
.all-drection-column{
	 -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-flex-direction: column;
    -ms-flex-direction:column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

/*主轴为X方向，子元素从右到左显示*/
/*这里补充说明一点： box 写法的 box-direction 只是改变了子元素的排序，并没有改变对齐方式，需要新增一个 box-pack 来改变对齐方式。*/
.all-drection-right{
	-webkit-box-pack: end;
    -webkit-box-direction: reverse;
    -webkit-box-orient: horizontal;
    -moz-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    -webkit-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

/*主轴为Y方向，子元素从下到上显示*/
.all-drection-bottom{
	 -webkit-box-pack: end;
    -webkit-box-direction: reverse;
    -webkit-box-orient: vertical;
    -moz-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

/*子元素主轴居中对齐*/
.all-justify-center{
	-webkit-box-pack: center;
	-moz-justify-content: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
}
/*子元素主轴左对齐*/
.all-justify-start {
	-webkit-box-pack: start ;
	-moz-justify-content: start ;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}
/*子元素主轴右对齐*/
.all-justify-end  {
	-webkit-box-pack: end  ;
	-moz-justify-content: flex-end  ;
	-ms-flex-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}
/*子元素主轴左右对齐（旧版没有space-around）*/
.all-justify-justify{
	-webkit-box-pack: justify  ;
	-moz-justify-content: justify  ;
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

/*子元素交叉轴居中对齐*/
.all-align-items-center{
	-webkit-box-align: center;
    -moz-align-items: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*子元素交叉轴左对齐*/
.all-align-items-start{
	-webkit-box-align: start ;
    -moz-align-items: start ;
    -ms-flex-align: start;
    -webkit-align-items: flex-start ;
    align-items: flex-start ;
}

/*子元素交叉轴右对齐*/
.all-align-items-end{
	-webkit-box-align: end ;
    -moz-align-items: end ;
    -ms-flex-align: end;
    -webkit-align-items: flex-end ;
    align-items: flex-end ;
}

/*子元素交叉轴文本基线对齐*/
.all-align-items-baseline {
	-webkit-box-align: baseline  ;
    -moz-align-items: baseline  ;
    -ms-flex-align: baseline;
    -webkit-align-items: baseline  ;
    align-items: baseline;
}

/*子元素交叉轴上下对齐并铺满*/
.all-align-items-baseline {
	-webkit-box-align: stretch  ;
    -moz-align-items: stretch  ;
    -ms-flex-align: stretch;
    -webkit-align-items: stretch  ;
    align-items: stretch;
}


/*子元素伸缩比为1*/
.all-items{
	 -webkit-box-flex: 1.0;
	 -moz-flex: auto;
	 -ms-flex: auto;
	 -webkit-flex: auto;
	  flex: auto;
}

/*子元素显示顺序*/
.all-order{
	 -webkit-box-ordinal-group: 1;
	 -moz-order: 1;
	 -ms-flex-order: 1;
	 -webkit-order: 1;
	 order: 1;
}
/*子元素显示顺序*/
.all-order-previous{
	 -webkit-box-ordinal-group: 0;
	 -moz-order: 0;
	 -webkit-order: 0;
	 order: 0;
}
/*子元素显示自己设置的宽度*/
.all-item-flex-shrink{
    -webkit-box-flex: 0;
    -moz-flex-shrink: 0;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
}



/* .all-flex{ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
.all-drection-row{ -webkit-box-direction: normal;-webkit-box-orient: horizontal;-moz-flex-direction: row;-ms-flex-direction:row;-webkit-flex-direction: row;flex-direction: row;}
.all-flex-wrap { -ms-flex-wrap: wrap;-o-flex-wrap: wrap;-moz-flex-wrap: wrap;-webkit-flex-wrap: wrap;flex-wrap: wrap;}
.all-drection-column{ -webkit-box-direction: normal;-webkit-box-orient: vertical;-moz-flex-direction: column;-ms-flex-direction:column;-webkit-flex-direction: column;flex-direction: column;}
.all-drection-right{ -webkit-box-pack: end;-webkit-box-direction: reverse;-webkit-box-orient: horizontal;-moz-flex-direction: row-reverse;-ms-flex-direction: row-reverse;-webkit-flex-direction: row-reverse;flex-direction: row-reverse;}
.all-drection-bottom{ -webkit-box-pack: end;-webkit-box-direction: reverse;-webkit-box-orient: vertical;-moz-flex-direction: column-reverse;-ms-flex-direction: column-reverse;-webkit-flex-direction: column-reverse;flex-direction: column-reverse;}
.all-justify-center{ -webkit-box-pack: center;-moz-justify-content: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;}
.all-justify-start { -webkit-box-pack: start ;-moz-justify-content: start ;-ms-flex-pack: start;-webkit-justify-content: flex-start;justify-content: flex-start;}
.all-justify-end  { -webkit-box-pack: end  ;-moz-justify-content: flex-end  ;-ms-flex-pack: end;-webkit-justify-content: flex-end;justify-content: flex-end;}
.all-justify-justify{ -webkit-box-pack: justify  ;-moz-justify-content: justify  ;-ms-flex-pack: justify;-webkit-justify-content: space-between;justify-content: space-between;}
.all-align-items-center{ -webkit-box-align: center;-moz-align-items: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.all-align-items-start{ -webkit-box-align: start ;-moz-align-items: start ;-ms-flex-align: start;-webkit-align-items: flex-start ;align-items: flex-start ;}
.all-align-items-end{ -webkit-box-align: end ;-moz-align-items: end ;-ms-flex-align: end;-webkit-align-items: flex-end ;align-items: flex-end ;}
.all-align-items-baseline { -webkit-box-align: baseline  ;-moz-align-items: baseline  ;-ms-flex-align: baseline;-webkit-align-items: baseline  ;align-items: baseline;}
.all-align-items-baseline { -webkit-box-align: stretch  ;-moz-align-items: stretch  ;-ms-flex-align: stretch;-webkit-align-items: stretch  ;align-items: stretch;}
.all-items{ -webkit-box-flex: 1.0;-moz-flex: auto;-ms-flex: auto;-webkit-flex: auto;flex: auto;}
.all-order{ -webkit-box-ordinal-group: 1;-moz-order: 1;-ms-flex-order: 1;-webkit-order: 1;order: 1;}
.all-order-previous{ -webkit-box-ordinal-group: 0;-moz-order: 0;-webkit-order: 0;order: 0;}
.all-item-flex-shrink{ -webkit-box-flex: 0;-moz-flex-shrink: 0;-webkit-flex-shrink: 0;flex-shrink: 0;} */