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;
}
}