// Flexbox grid media queries
// Breakpoint helpers


@media #{$tablet} {
  .flex.collapse-t {
    display: block;                // parent container
    &.gap-no {
    .input { width: 100%; }
    > * { margin-left: 0; }
    }
  }
  .flex .collapse-t {
    flex-basis: 100% !important
  }
  .flex > .span-half-t  { 
    flex-basis: 50% !important
  }
  .flex > .span-full-t  { 
    flex-basis: 100% !important
  }
}

@media #{$phone} {
  .flex.collapse-p {
    display: block;                // parent container
  }
  .flex .collapse-p {
    flex-basis: 100% !important
  }
  .flex > .span-half-p  { 
    flex-basis: 50% !important
  }
  .flex > .span-full-p  { 
    flex-basis: 100% !important
  }
}