/*
FOX CSS 3.0.0
by Ronan Levesque - CC BY 3.0 license

Includes Normalize by Nicolas Gallagher
More info => http://necolas.github.io/normalize.css/
*/

/*-------------------------*/
/* +GRID                   */
/*-------------------------*/
.fx-row {
  margin-top: -20px;
  margin-left: -10px;
  margin-right: -10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.fx-row + .fx-row {
  margin-top: 0;
}

@media screen and (min-width: 1024px) {
  .fx-row {
    margin-top: -30px;
    margin-left: -15px;
    margin-right: -15px;
  }
} /* ----- media END ----- */

.fx-row-start-xs {
  justify-content: flex-start;
}
.fx-row-center-xs {
  justify-content: center;
}
.fx-row-end-xs {
  justify-content: flex-end;
}
.fx-row-between-xs {
  justify-content: space-between;
}
.fx-row-around-xs {
  justify-content: space-around;
}

@media screen and (min-width: 768px) {
  .fx-row-start-s {
    justify-content: flex-start;
  }
  .fx-row-center-s {
    justify-content: center;
  }
  .fx-row-end-s {
    justify-content: flex-end;
  }
  .fx-row-between-s {
    justify-content: space-between;
  }
  .fx-row-around-s {
    justify-content: space-around;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1024px) {
  .fx-row-start-m {
    justify-content: flex-start;
  }
  .fx-row-center-m {
    justify-content: center;
  }
  .fx-row-end-m {
    justify-content: flex-end;
  }
  .fx-row-between-m {
    justify-content: space-between;
  }
  .fx-row-around-m {
    justify-content: space-around;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1280px) {
  .fx-row-start-l {
    justify-content: flex-start;
  }
  .fx-row-center-l {
    justify-content: center;
  }
  .fx-row-end-l {
    justify-content: flex-end;
  }
  .fx-row-between-l {
    justify-content: space-between;
  }
  .fx-row-around-l {
    justify-content: space-around;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1500px) {
  .fx-row-start-ll {
    justify-content: flex-start;
  }
  .fx-row-center-ll {
    justify-content: center;
  }
  .fx-row-end-ll {
    justify-content: flex-end;
  }

  .fx-row-between-ll {
    justify-content: space-between;
  }

  .fx-row-around-ll {
    justify-content: space-around;
  }
} /* ----- media END ----- */

.fx-row-reverse-xs {
  flex-direction: row-reverse;
}

@media screen and (min-width: 768px) {
  .fx-row-reverse-s {
    flex-direction: row-reverse;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1024px) {
  .fx-row-reverse-m {
    flex-direction: row-reverse;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1280px) {
  .fx-row-reverse-l {
    flex-direction: row-reverse;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1500px) {
  .fx-row-reverse-ll {
    flex-direction: row-reverse;
  }
} /* ----- media END ----- */

[class*="fx-col"] {
  margin-top: 20px;
  padding-left: 10px;
  padding-right: 10px;
  flex-grow: 1;
}

@media screen and (min-width: 1024px) {
  [class*="fx-col"] {
    margin-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
  }
} /* ----- media END ----- */

.fx-col-10-xs {
  flex-basis: 10%;
  max-width: 10%;
}
.fx-col-20-xs {
  flex-basis: 20%;
  max-width: 20%;
}
.fx-col-23-xs {
  flex-basis: 23%;
  max-width: 23%;
}
.fx-col-25-xs {
  flex-basis: 25%;
  max-width: 25%;
}
.fx-col-30-xs {
  flex-basis: 30%;
  max-width: 30%;
}
.fx-col-33-xs {
  flex-basis: 33.3333%;
  max-width: 33.3333%;
}
.fx-col-40-xs {
  flex-basis: 40%;
  max-width: 40%;
}
.fx-col-48-xs {
  flex-basis: 48%;
  max-width: 48%;
}
.fx-col-50-xs {
  flex-basis: 50%;
  max-width: 50%;
}
.fx-col-60-xs {
  flex-basis: 60%;
  max-width: 60%;
}
.fx-col-66-xs {
  flex-basis: 66.6666%;
  max-width: 66.6666%;
}
.fx-col-70-xs {
  flex-basis: 70%;
  max-width: 70%;
}
.fx-col-75-xs {
  flex-basis: 75%;
  max-width: 75%;
}
.fx-col-80-xs {
  flex-basis: 80%;
  max-width: 80%;
}
.fx-col-90-xs {
  flex-basis: 90%;
  max-width: 90%;
}
.fx-col-100-xs {
  flex-basis: 100%;
  max-width: 100%;
}

@media screen and (min-width: 768px) {
  .fx-col-10-s {
    flex-basis: 10%;
    max-width: 10%;
  }
  .fx-col-20-s {
    flex-basis: 20%;
    max-width: 20%;
  }
  .fx-col-23-s {
    flex-basis: 23%;
    max-width: 23%;
  }
  .fx-col-25-s {
    flex-basis: 25%;
    max-width: 25%;
  }
  .fx-col-30-s {
    flex-basis: 30%;
    max-width: 30%;
  }
  .fx-col-33-s {
    flex-basis: 33.3333%;
    max-width: 33.3333%;
  }
  .fx-col-40-s {
    flex-basis: 40%;
    max-width: 40%;
  }
  .fx-col-48-s {
    flex-basis: 48%;
    max-width: 48%;
  }

  .fx-col-50-s {
    flex-basis: 50%;
    max-width: 50%;
  }
  .fx-col-60-s {
    flex-basis: 60%;
    max-width: 60%;
  }
  .fx-col-66-s {
    flex-basis: 66.6666%;
    max-width: 66.6666%;
  }
  .fx-col-70-s {
    flex-basis: 70%;
    max-width: 70%;
  }
  .fx-col-75-s {
    flex-basis: 75%;
    max-width: 75%;
  }
  .fx-col-80-s {
    flex-basis: 80%;
    max-width: 80%;
  }
  .fx-col-90-s {
    flex-basis: 90%;
    max-width: 90%;
  }
  .fx-col-100-s {
    flex-basis: 100%;
    max-width: 100%;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1024px) {
  .fx-col-10-m {
    flex-basis: 10%;
    max-width: 10%;
  }
  .fx-col-20-m {
    flex-basis: 20%;
    max-width: 20%;
  }
  .fx-col-23-m {
    flex-basis: 23%;
    max-width: 23%;
  }
  .fx-col-25-m {
    flex-basis: 25%;
    max-width: 25%;
  }
  .fx-col-30-m {
    flex-basis: 30%;
    max-width: 30%;
  }
  .fx-col-33-m {
    flex-basis: 33.3333%;
    max-width: 33.3333%;
  }
  .fx-col-40-m {
    flex-basis: 40%;
    max-width: 40%;
  }
  .fx-col-48-m {
    flex-basis: 48%;
    max-width: 48%;
  }
  .fx-col-50-m {
    flex-basis: 50%;
    max-width: 50%;
  }
  .fx-col-60-m {
    flex-basis: 60%;
    max-width: 60%;
  }
  .fx-col-66-m {
    flex-basis: 66.6666%;
    max-width: 66.6666%;
  }
  .fx-col-70-m {
    flex-basis: 70%;
    max-width: 70%;
  }
  .fx-col-75-m {
    flex-basis: 75%;
    max-width: 75%;
  }
  .fx-col-80-m {
    flex-basis: 80%;
    max-width: 80%;
  }
  .fx-col-90-m {
    flex-basis: 90%;
    max-width: 90%;
  }
  .fx-col-100-m {
    flex-basis: 100%;
    max-width: 100%;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1280px) {
  .fx-col-10-l {
    flex-basis: 10%;
    max-width: 10%;
  }
  .fx-col-20-l {
    flex-basis: 20%;
    max-width: 20%;
  }
  .fx-col-23-l {
    flex-basis: 23%;
    max-width: 23%;
  }
  .fx-col-25-l {
    flex-basis: 25%;
    max-width: 25%;
  }
  .fx-col-30-l {
    flex-basis: 30%;
    max-width: 30%;
  }
  .fx-col-33-l {
    flex-basis: 33.3333%;
    max-width: 33.3333%;
  }
  .fx-col-40-l {
    flex-basis: 40%;
    max-width: 40%;
  }
  .fx-col-48-l {
    flex-basis: 48%;
    max-width: 48%;
  }
  .fx-col-50-l {
    flex-basis: 50%;
    max-width: 50%;
  }
  .fx-col-60-l {
    flex-basis: 60%;
    max-width: 60%;
  }
  .fx-col-66-l {
    flex-basis: 66.6666%;
    max-width: 66.6666%;
  }
  .fx-col-70-l {
    flex-basis: 70%;
    max-width: 70%;
  }
  .fx-col-75-l {
    flex-basis: 75%;
    max-width: 75%;
  }
  .fx-col-80-l {
    flex-basis: 80%;
    max-width: 80%;
  }
  .fx-col-90-l {
    flex-basis: 90%;
    max-width: 90%;
  }
  .fx-col-100-l {
    flex-basis: 100%;
    max-width: 100%;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1500px) {
  .fx-col-10-ll {
    flex-basis: 10%;
    max-width: 10%;
  }
  .fx-col-20-ll {
    flex-basis: 20%;
    max-width: 20%;
  }
  .fx-col-23-ll {
    flex-basis: 23%;
    max-width: 23%;
  }
  .fx-col-25-ll {
    flex-basis: 25%;
    max-width: 25%;
  }
  .fx-col-30-ll {
    flex-basis: 30%;
    max-width: 30%;
  }
  .fx-col-33-ll {
    flex-basis: 33.3333%;
    max-width: 33.3333%;
  }
  .fx-col-40-ll {
    flex-basis: 40%;
    max-width: 40%;
  }
  .fx-col-48-ll {
    flex-basis: 48%;
    max-width: 48%;
  }
  .fx-col-50-ll {
    flex-basis: 50%;
    max-width: 50%;
  }
  .fx-col-60-ll {
    flex-basis: 60%;
    max-width: 60%;
  }
  .fx-col-66-ll {
    flex-basis: 66.6666%;
    max-width: 66.6666%;
  }
  .fx-col-70-ll {
    flex-basis: 70%;
    max-width: 70%;
  }
  .fx-col-75-ll {
    flex-basis: 75%;
    max-width: 75%;
  }
  .fx-col-80-ll {
    flex-basis: 80%;
    max-width: 80%;
  }
  .fx-col-90-ll {
    flex-basis: 90%;
    max-width: 90%;
  }
  .fx-col-100-ll {
    flex-basis: 100%;
    max-width: 100%;
  }
} /* ----- media END ----- */

.fx-col-top-xs {
  align-self: flex-start;
}
.fx-col-center-xs {
  align-self: center;
}
.fx-col-bottom-xs {
  align-self: flex-end;
}

@media screen and (min-width: 768px) {
  .fx-col-top-s {
    align-self: flex-start;
  }
  .fx-col-center-s {
    align-self: center;
  }
  .fx-col-bottom-s {
    align-self: flex-end;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1024px) {
  .fx-col-top-m {
    align-self: flex-start;
  }
  .fx-col-center-m {
    align-self: center;
  }
  .fx-col-bottom-m {
    align-self: flex-end;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1280px) {
  .fx-col-top-l {
    align-self: flex-start;
  }
  .fx-col-center-l {
    align-self: center;
  }
  .fx-col-bottom-l {
    align-self: flex-end;
  }
} /* ----- media END ----- */

@media screen and (min-width: 1500px) {
  .fx-col-top-ll {
    align-self: flex-start;
  }
  .fx-col-center-ll {
    align-self: center;
  }
  .fx-col-bottom-ll {
    align-self: flex-end;
  }
} /* ----- media END ----- */