/*--------------------------------------------------------------
# Flexbox
--------------------------------------------------------------*/
.dflex {
  display: -ms-flexbox;
  display: flex; }

.container {
  -ms-flex: 1 1 100%;
      flex: 1 1 100%;
  margin: auto;
  padding: 24px;
  max-width: 100%; }

.container.fluid {
  max-width: 100%; }

@media only screen and (max-width: 959px) {
  .container {
    padding: 16px; } }
.layout {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  min-width: 0; }

.align-center {
  -ms-flex-line-pack: center;
      align-content: center; }

.justify-center {
  -ms-flex-pack: center;
      justify-content: center; }

.layout.column {
  -ms-flex-direction: column;
      flex-direction: column; }

.layout.column > .flex {
  max-width: 100%; }

.layout.row {
  -ms-flex-direction: row;
      flex-direction: row; }

.flex {
  -ms-flex: 1 1 100%;
      flex: 1 1 100%;
  max-width: 100%; }

.layout.wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.fill-height {
  height: 100%; }

@media all and (min-width: 0) {
  .row > .flex.xs-1 {
    -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .row > .flex.xs-2 {
    -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .row > .flex.xs-3 {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    max-width: 25%; }

  .row > .flex.xs-4 {
    -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .row > .flex.xs-5 {
    -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .row > .flex.xs-6 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }

  .row > .flex.xs-7 {
    -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .row > .flex.xs-8 {
    -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .row > .flex.xs-9 {
    -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    max-width: 75%; }

  .row > .flex.xs-10 {
    -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .row > .flex.xs-11 {
    -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .row > .flex.xs-12 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; } }
@media all and (min-width: 600px) {
  .row > .flex.sm-1 {
    -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .row > .flex.sm-2 {
    -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .row > .flex.sm-3 {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    max-width: 25%; }

  .row > .flex.sm-4 {
    -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .row > .flex.sm-5 {
    -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .row > .flex.sm-6 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }

  .row > .flex.sm-7 {
    -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .row > .flex.sm-8 {
    -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .row > .flex.sm-9 {
    -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    max-width: 75%; }

  .row > .flex.sm-10 {
    -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .row > .flex.sm-11 {
    -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .row > .flex.sm-12 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; } }
@media all and (min-width: 960px) {
  .row > .flex.md-1 {
    -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .row > .flex.md-2 {
    -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .row > .flex.md-3 {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    max-width: 25%; }

  .row > .flex.md-4 {
    -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .row > .flex.md-5 {
    -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .row > .flex.md-6 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }

  .row > .flex.md-7 {
    -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .row > .flex.md-8 {
    -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .row > .flex.md-9 {
    -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    max-width: 75%; }

  .row > .flex.md-10 {
    -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .row > .flex.md-11 {
    -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .row > .flex.md-12 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; } }
@media all and (min-width: 1264px) {
  .row > .flex.lg-1 {
    -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .row > .flex.lg-2 {
    -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .row > .flex.lg-3 {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    max-width: 25%; }

  .row > .flex.lg-4 {
    -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .row > .flex.lg-5 {
    -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .row > .flex.lg-6 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }

  .row > .flex.lg-7 {
    -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .row > .flex.lg-8 {
    -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .row > .flex.lg-9 {
    -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    max-width: 75%; }

  .row > .flex.lg-10 {
    -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .row > .flex.lg-11 {
    -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .row > .flex.lg-12 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; } }
@media all and (min-width: 1904px) {
  .row > .flex.xl-1 {
    -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .row > .flex.xl-2 {
    -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .row > .flex.xl-3 {
    -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    max-width: 25%; }

  .row > .flex.xl-4 {
    -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .row > .flex.xl-5 {
    -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .row > .flex.xl-6 {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    max-width: 50%; }

  .row > .flex.xl-7 {
    -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .row > .flex.xl-8 {
    -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .row > .flex.xl-9 {
    -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
    max-width: 75%; }

  .row > .flex.xl-10 {
    -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .row > .flex.xl-11 {
    -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .row > .flex.xl-12 {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; } }
