.container {
  padding: 0 1.5rem; /* alterar consoante o tamanho da margem no mobile */
}

.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -0.75rem; /* alterar consoante o tamanho da gutter no mobile */
  margin-right: -0.75rem; /* alterar consoante o tamanho da gutter no mobile */
}

.row > * {
  width: 100%;
  padding-left: 0.75rem; /* alterar consoante o tamanho da gutter no mobile */
  padding-right: 0.75rem; /* alterar consoante o tamanho da gutter no mobile */
}

.justify-content-start {
  justify-content: flex-start;
}
.justify-content-end {
  justify-content: flex-end;
}
.justify-content-center {
  justify-content: center;
}
.justify-content-between {
  justify-content: space-between;
}
.justify-content-around {
  justify-content: space-around;
}
.justify-content-evenly {
  justify-content: space-evenly;
}

/* Larguras baseadas em 12 colunas */
.col-1 {
  width: 8.33%;
}
.col-2 {
  width: 16.66%;
}
.col-3 {
  width: 25%;
}
.col-4 {
  width: 33.33%;
}
.col-5 {
  width: 41.66%;
}
.col-6 {
  width: 50%;
}
.col-7 {
  width: 58.33%;
}
.col-8 {
  width: 66.66%;
}
.col-9 {
  width: 75%;
}
.col-10 {
  width: 83.33%;
}
.col-11 {
  width: 91.66%;
}
.col-12 {
  width: 100%;
}

/* Offsets */
.offset-1 {
  margin-left: 8.33%;
}
.offset-2 {
  margin-left: 16.66%;
}
.offset-3 {
  margin-left: 25%;
}
.offset-4 {
  margin-left: 33.33%;
}
.offset-5 {
  margin-left: 41.66%;
}
.offset-6 {
  margin-left: 50%;
}
.offset-7 {
  margin-left: 58.33%;
}
.offset-8 {
  margin-left: 66.66%;
}
.offset-9 {
  margin-left: 75%;
}
.offset-10 {
  margin-left: 83.33%;
}
.offset-11 {
  margin-left: 91.66%;
}

/* Exemplo de breakpoint responsivo (md >= 768px) */
@media (min-width: 768px) {
  .container {
    padding: 0 1.5rem; /* alterar consoante o tamanho da margem no desktop */
  }

  .justify-content-md-start {
    justify-content: flex-start;
  }
  .justify-content-md-end {
    justify-content: flex-end;
  }
  .justify-content-md-center {
    justify-content: center;
  }
  .justify-content-md-between {
    justify-content: space-between;
  }
  .justify-content-md-around {
    justify-content: space-around;
  }
  .justify-content-md-evenly {
    justify-content: space-evenly;
  }

  /* Larguras baseadas em 12 colunas */
  .col-md-1 {
    width: 8.33%;
  }
  .col-md-2 {
    width: 16.66%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-4 {
    width: 33.33%;
  }
  .col-md-5 {
    width: 41.66%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-7 {
    width: 58.33%;
  }
  .col-md-8 {
    width: 66.66%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-10 {
    width: 83.33%;
  }
  .col-md-11 {
    width: 91.66%;
  }
  .col-md-12 {
    width: 100%;
  }

  /* Offsets */
  .offset-md-1 {
    margin-left: 8.33%;
  }
  .offset-md-2 {
    margin-left: 16.66%;
  }
  .offset-md-3 {
    margin-left: 25%;
  }
  .offset-md-4 {
    margin-left: 33.33%;
  }
  .offset-md-5 {
    margin-left: 41.66%;
  }
  .offset-md-6 {
    margin-left: 50%;
  }
  .offset-md-7 {
    margin-left: 58.33%;
  }
  .offset-md-8 {
    margin-left: 66.66%;
  }
  .offset-md-9 {
    margin-left: 75%;
  }
  .offset-md-10 {
    margin-left: 83.33%;
  }
  .offset-md-11 {
    margin-left: 91.66%;
  }

  /* Ordens */
  .order-md-1 {
    order: 1;
  }
  .order-md-2 {
    order: 2;
  }
  .order-md-3 {
    order: 3;
  }
  .order-md-4 {
    order: 4;
  }
  .order-md-5 {
    order: 5;
  }
  .order-md-6 {
    order: 6;
  }
  .order-md-7 {
    order: 7;
  }
  .order-md-8 {
    order: 8;
  }
  .order-md-9 {
    order: 9;
  }
  .order-md-10 {
    order: 10;
  }
  .order-md-11 {
    order: 11;
  }
  .order-md-12 {
    order: 12;
  }
}