/*
Extra small  <576px
Small -s ≥576px
Medium-Small -sm ≥684px
Medium -m ≥768px
Large -l ≥992px
Extra large -xl ≥1200px
*/
/*Extra small <576px, Small -s ≥576px, Medium-Small -sm ≥684px, Medium -m ≥768px ,Large -l ≥992px ,Extra large -xl ≥1200px*/

*,
::after,
::before {
  box-sizing: border-box;
}

#app .flex-row {
  display: flex;
  flex: 100%;
  flex-direction: row;
  position: relative;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
#app .flex-row.fit {
  display: inline-flex;
}

#app .flex-row.left,
div[class^="column"].left {
  text-align: left;
  justify-content: flex-start;
}
#app .flex-row.right,
div[class^="column"].right {
  text-align: right;
  justify-content: flex-end;
}

#app .flex-row.flex-row--column {
  flex-direction: column !important;
}

#app .flex-row.center-horizontal,
.flex-row.center,
#app div[class^="column"].center-horizontal,
#app div[class^="column"].center {
  justify-content: center;
}

#app .flex-row.center-vertical,
#app .flex-row.center,
#app div[class^="column"].center-vertical,
#app div[class^="column"].center {
  align-items: center;
}
#app .flex-row.baseline,
#app div[class^="column"].baseline {
  align-items: baseline;
}
#app .flex-row.center-full,
#app div[class^="column"].center-full {
  justify-content: center;
  align-items: center;
}
#app .flex-row.flex-row-no-margin {
  margin-right: 0px;
  margin-left: 0px;
}

#app .flex-row.row-reverse {
  flex-direction: row-reverse !important;
}
#app .flex-row.end-vertical {
  align-items: flex-end;
}
#app .flex-row.end-horizontal {
  justify-content: flex-end;
}

#app .flex-row.start-horizontal {
  justify-content: flex-start;
}
#app .flex-row.around,
#app div[class^="column"].around {
  justify-content: space-around;
}

#app .flex-row.between,
#app div[class^="column"].between {
  justify-content: space-between;
}

#app .flex-row.evenly,
#app div[class^="column"].evenly {
  justify-content: space-evenly;
}

#app div[class^="column"] {
  box-sizing: border-box;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  width: 100%;
}

#app div[class^="column"].column-no-padding {
  padding-right: 0px;
  padding-left: 0px;
}
.column-1 {
  max-width: 8.333333%;
  flex: 0 0 8.333333%;
}

.column-2 {
  max-width: 16.666667%;
  flex: 0 0 16.666667%;
}

.column-3 {
  max-width: 25%;
  flex: 0 0 25%;
}

.column-4 {
  max-width: 33.333333%;
  flex: 0 0 33.333333%;
}

.column-5 {
  max-width: 41.666667%;
  flex: 0 0 41.666667%;
}

.column-6 {
  max-width: 50%;
  flex: 0 0 50%;
}

.column-7 {
  max-width: 58.333333%;
  flex: 0 0 58.333333%;
}

.column-8 {
  max-width: 66.666667%;
  flex: 0 0 66.666667%;
}

.column-9 {
  max-width: 75%;
  flex: 0 0 75%;
}

.column-10 {
  max-width: 83.333333%;
  flex: 0 0 83.333333%;
}

.column-11 {
  max-width: 91.666667%;
  flex: 0 0 91.666667%;
}

.column-12 {
  max-width: 100%;
  flex: 0 0 100%;
}

@media (max-width: 576px) {
  #app .flex-row.no-margin-12 {
    margin: 0 !important;
  }
  .column-12.no-padding-12 {
    padding: 0 !important;
  }
}
/* Small */
@media (min-width: 576px) {
  .column-1-s {
    max-width: 8.333333%;
    flex: 0 0 8.333333%;
  }

  .column-2-s {
    max-width: 16.666667%;
    flex: 0 0 16.666667%;
  }

  .column-3-s {
    max-width: 25%;
    flex: 0 0 25%;
  }

  .column-4-s {
    max-width: 33.333333%;
    flex: 0 0 33.333333%;
  }

  .column-5-s {
    max-width: 41.666667%;
    flex: 0 0 41.666667%;
  }

  .column-6-s {
    max-width: 50%;
    flex: 0 0 50%;
  }

  .column-7-s {
    max-width: 58.333333%;
    flex: 0 0 58.333333%;
  }

  .column-8-s {
    max-width: 66.666667%;
    flex: 0 0 66.666667%;
  }

  .column-9-s {
    max-width: 75%;
    flex: 0 0 75%;
  }

  .column-10-s {
    max-width: 83.333333%;
    flex: 0 0 83.333333%;
  }

  .column-11-s {
    max-width: 91.666667%;
    flex: 0 0 91.666667%;
  }

  .column-12-s {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* Medium-Small */
@media (min-width: 684px) {
  .column-1-sm {
    max-width: 8.333333%;
    flex: 0 0 8.333333%;
  }

  .column-2-sm {
    max-width: 16.666667%;
    flex: 0 0 16.666667%;
  }

  .column-3-sm {
    max-width: 25%;
    flex: 0 0 25%;
  }

  .column-4-sm {
    max-width: 33.333333%;
    flex: 0 0 33.333333%;
  }

  .column-5-sm {
    max-width: 41.666667%;
    flex: 0 0 41.666667%;
  }

  .column-6-sm {
    max-width: 50%;
    flex: 0 0 50%;
  }

  .column-7-sm {
    max-width: 58.333333%;
    flex: 0 0 58.333333%;
  }

  .column-8-sm {
    max-width: 66.666667%;
    flex: 0 0 66.666667%;
  }

  .column-9-sm {
    max-width: 75%;
    flex: 0 0 75%;
  }

  .column-10-sm {
    max-width: 83.333333%;
    flex: 0 0 83.333333%;
  }

  .column-11-sm {
    max-width: 91.666667%;
    flex: 0 0 91.666667%;
  }

  .column-12-sm {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* Medium */
@media (min-width: 768px) {
  .column-1-m {
    max-width: 8.333333%;
    flex: 0 0 8.333333%;
  }

  .column-2-m {
    max-width: 16.666667%;
    flex: 0 0 16.666667%;
  }

  .column-3-m {
    max-width: 25%;
    flex: 0 0 25%;
  }

  .column-4-m {
    max-width: 33.333333%;
    flex: 0 0 33.333333%;
  }

  .column-5-m {
    max-width: 41.666667%;
    flex: 0 0 41.666667%;
  }

  .column-6-m {
    max-width: 50%;
    flex: 0 0 50%;
  }

  .column-7-m {
    max-width: 58.333333%;
    flex: 0 0 58.333333%;
  }

  .column-8-m {
    max-width: 66.666667%;
    flex: 0 0 66.666667%;
  }

  .column-9-m {
    max-width: 75%;
    flex: 0 0 75%;
  }

  .column-10-m {
    max-width: 83.333333%;
    flex: 0 0 83.333333%;
  }

  .column-11-m {
    max-width: 91.666667%;
    flex: 0 0 91.666667%;
  }

  .column-12-m {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* Large */
@media (min-width: 992px) {
  .column-1-l {
    max-width: 8.333333%;
    flex: 0 0 8.333333%;
  }

  .column-2-l {
    max-width: 16.666667%;
    flex: 0 0 16.666667%;
  }

  .column-3-l {
    max-width: 25%;
    flex: 0 0 25%;
  }

  .column-4-l {
    max-width: 33.333333%;
    flex: 0 0 33.333333%;
  }

  .column-5-l {
    max-width: 41.666667%;
    flex: 0 0 41.666667%;
  }

  .column-6-l {
    max-width: 50%;
    flex: 0 0 50%;
  }

  .column-7-l {
    max-width: 58.333333%;
    flex: 0 0 58.333333%;
  }

  .column-8-l {
    max-width: 66.666667%;
    flex: 0 0 66.666667%;
  }

  .column-9-l {
    max-width: 75%;
    flex: 0 0 75%;
  }

  .column-10-l {
    max-width: 83.333333%;
    flex: 0 0 83.333333%;
  }

  .column-11-l {
    max-width: 91.666667%;
    flex: 0 0 91.666667%;
  }

  .column-12-l {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* Extra large */
@media (min-width: 1140px) {
  .column-1-xl {
    max-width: 8.333333%;
    flex: 0 0 8.333333%;
  }

  .column-2-xl {
    max-width: 16.666667%;
    flex: 0 0 16.666667%;
  }

  .column-3-xl {
    max-width: 25%;
    flex: 0 0 25%;
  }

  .column-4-xl {
    max-width: 33.333333%;
    flex: 0 0 33.333333%;
  }

  .column-5-xl {
    max-width: 41.666667%;
    flex: 0 0 41.666667%;
  }

  .column-6-xl {
    max-width: 50%;
    flex: 0 0 50%;
  }

  .column-7-xl {
    max-width: 58.333333%;
    flex: 0 0 58.333333%;
  }

  .column-8-xl {
    max-width: 66.666667%;
    flex: 0 0 66.666667%;
  }

  .column-9-xl {
    max-width: 75%;
    flex: 0 0 75%;
  }

  .column-10-xl {
    max-width: 83.333333%;
    flex: 0 0 83.333333%;
  }

  .column-11-xl {
    max-width: 91.666667%;
    flex: 0 0 91.666667%;
  }

  .column-12-xl {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
background: black !important;
background-color: black !important;
border:solid 16px solid !important;
} */