sigil88
9/2/2016 - 10:47 AM

flexbox ordering, 1 item per row, with prefixes

flexbox ordering, 1 item per row, with prefixes

/* skyliner on mobile -- form move to below skyliner logo based on rows in yeeditor */
@media screen and (max-width: 475px) {
	.skyliner .yee-wgt-single-image img {
		max-height: 75px;
	}
	.skyliner .yee-container-fluid {
		width: 100%;
	}
	.skyliner .skyliner-form-container h3,
	.skyliner .skyliner-container-mobile-bottom h4 {
		margin-top: 5px;
	}

 	.skyliner .yeeditor,
 	.skyliner-form-container,
 	.skyliner-container-top,
 	.skyliner-container-mobile-bottom	{
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
 	}

	.skyliner .yeeditor {
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
	}
	/* set up specific row orders for mobile */
	.skyliner-container-top {
		-webkit-box-ordinal-group: 1;   /* OLD - iOS 6-, Safari 3.1-6 */
		-moz-box-ordinal-group: 1;      /* OLD - Firefox 19- */
		-ms-flex-order: 1;              /* TWEENER - IE 10 */
		-webkit-order: 1;               /* NEW - Chrome */
		order: 1;
/*		flex: 1 100%;*/
	}

	.skyliner-form-container {
		-webkit-box-ordinal-group: 2;   /* OLD - iOS 6-, Safari 3.1-6 */
		-moz-box-ordinal-group: 2;      /* OLD - Firefox 19- */
		-ms-flex-order: 2;              /* TWEENER - IE 10 */
		-webkit-order: 2;               /* NEW - Chrome */
		order: 2;
		/*flex: 1 100%;*/
	}

	.skyliner-container-mobile-bottom {
		-webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
		-moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
		-ms-flex-order: 3;              /* TWEENER - IE 10 */
		-webkit-order: 3;               /* NEW - Chrome */
		order: 3;
	}
}