Bootstrap - дополнительная маржа

Question

Я использую бутстрап. У меня есть два деления. Это мой код HTML:

<div class="container">
  <div class="col-12 circle lg-circle">
    <div class="col-12 circle sm-circle">
    </div>
  </div>
</div>

И КСС

.circle {
  border: solid 0.9px $athens-gray;
  border-radius: 50%;
}

.lg-circle {
  max-height: 69.375rem;
  max-width: 69.375rem;
  padding: 7.125rem;
}

.sm-circle {
  border-color: $athens-dark;
  max-height: 69.375rem;
  max-width: 55.0625rem;
}

и это вид из браузера.

Вопрос: Почему есть правое поле, как его убрать?

Answer 1

Добавьте это в ваш

.container{
    margin:auto;
}
.col-12{
    margin:auto;
}

Answer 2

добавить этот код в файл css:

.container{
    margin:unset;
}