1/*  IE mediaQuery hack for 8,9,10 to set the flex-basis properly for 'flex' values  */
  2/*  Details:  */
  3/*  Do not use unitless flex-basis values in the flex shorthand because IE 10-11 will error.  */
  4/*  Also use 0% instead of 0px since minifiers will often convert 0px to 0 (which is unitless and will have the same problem).  */
  5/*  Safari, however, fails with flex-basis : 0% and requires flex-basis : 0px  */
  6
  7@media screen\0 {
  8    .flex {
  9        -webkit-flex: 1 1 0%;
 10        -ms-flex: 1 1 0%;
 11        flex: 1 1 0%;
 12    }
 13}
 14
 15@media screen\0 {
 16    .flex {
 17        -webkit-flex: 1 1 0%;
 18        -ms-flex: 1 1 0%;
 19        flex: 1 1 0%;
 20    }
 21}
 22
 23@media screen\0
 24and (max-width: 599px) {
 25    .flex-xs {
 26        -webkit-flex: 1 1 0%;
 27        -ms-flex: 1 1 0%;
 28        flex: 1 1 0%;
 29    }
 30}
 31
 32@media screen\0
 33and (min-width: 600px) {
 34    .flex-gt-xs {
 35        -webkit-flex: 1 1 0%;
 36        -ms-flex: 1 1 0%;
 37        flex: 1 1 0%;
 38    }
 39}
 40
 41@media screen\0
 42and (min-width: 600px) and (max-width: 959px) {
 43    .flex-sm {
 44        -webkit-flex: 1 1 0%;
 45        -ms-flex: 1 1 0%;
 46        flex: 1 1 0%;
 47    }
 48}
 49
 50@media screen\0
 51and (min-width: 960px) {
 52    .flex-gt-sm {
 53        -webkit-flex: 1 1 0%;
 54        -ms-flex: 1 1 0%;
 55        flex: 1 1 0%;
 56    }
 57}
 58
 59@media screen\0
 60and (min-width: 960px) and (max-width: 1279px) {
 61    .flex-md {
 62        -webkit-flex: 1 1 0%;
 63        -ms-flex: 1 1 0%;
 64        flex: 1 1 0%;
 65    }
 66}
 67
 68@media screen\0
 69and (min-width: 1280px) {
 70    .flex-gt-md {
 71        -webkit-flex: 1 1 0%;
 72        -ms-flex: 1 1 0%;
 73        flex: 1 1 0%;
 74    }
 75}
 76
 77@media screen\0
 78and (min-width: 1280px) and (max-width: 1919px) {
 79    .flex-lg {
 80        -webkit-flex: 1 1 0%;
 81        -ms-flex: 1 1 0%;
 82        flex: 1 1 0%;
 83    }
 84}
 85
 86@media screen\0
 87and (min-width: 1920px) {
 88    .flex-gt-lg {
 89        -webkit-flex: 1 1 0%;
 90        -ms-flex: 1 1 0%;
 91        flex: 1 1 0%;
 92    }
 93}
 94
 95@media screen\0
 96and (min-width: 1920px) {
 97    .flex-xl {
 98        -webkit-flex: 1 1 0%;
 99        -ms-flex: 1 1 0%;
100        flex: 1 1 0%;
101    }
102}
103
104