.container:after,
.container:before,
.row:after,
.row:before {
  content: ' ';
  display: table;
}

.container:after,
.row:after {
  clear: both;
}

.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: $margin-normal;
  padding-right: $margin-normal;
}

@media (min-width: 768px) {
  .container {
    width: 740px;
  }
}

@media (min-width: 992px) {
  .container {
    width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    width: 1160px;
  }
}

.row {
  margin-left: -$margin-normal;
  margin-right: -$margin-normal;
}

[class^='col-md-'],
[class^='col-sm-'],
[class^='col-xs-'] {
  position: relative;
  min-height: 1px;
  padding-left: $margin-normal;
  padding-right: $margin-normal;
}

[class^='col-xs-'] {
  float: left;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-12 {
  width: 100%;
}

@media (min-width: 768px) {
  [class^='col-sm-'] {
    float: left;
  }

  .col-sm-3 {
    width: 25%;
  }
}

@media (min-width: 992px) {
  [class^='col-md-'] {
    float: left;
  }

  .col-md-2 {
    width: 16.66667%;
  }
}