.progress,
.progress:before,
.progress:after {
  box-sizing: inherit;
}

.progress {
  -moz-appearance: none;
  -webkit-appearance: none;
  border: none;
  border-radius: 290486px;
  display: block;
  height: 12px;
  overflow: hidden;
  padding: 0;
  width: 100%;
}

.progress::-webkit-progress-bar {
  background-color: #d3d6db;
}

.progress::-webkit-progress-value {
  background-color: ${base_color};
}

.progress::-moz-progress-bar {
  background-color: ${base_color};
}

.progress.is-white::-webkit-progress-value {
  background-color: #fff;
}

.progress.is-white::-moz-progress-bar {
  background-color: #fff;
}

.progress.is-black::-webkit-progress-value {
  background-color: #111;
}

.progress.is-black::-moz-progress-bar {
  background-color: #111;
}

.progress.is-light::-webkit-progress-value {
  background-color: #f5f7fa;
}

.progress.is-light::-moz-progress-bar {
  background-color: #f5f7fa;
}

.progress.is-dark::-webkit-progress-value {
  background-color: ${base_color};
}

.progress.is-dark::-moz-progress-bar {
  background-color: ${base_color};
}

.progress.is-primary::-webkit-progress-value {
  background-color: #1fc8db;
}

.progress.is-primary::-moz-progress-bar {
  background-color: #1fc8db;
}

.progress.is-info::-webkit-progress-value {
  background-color: #42afe3;
}

.progress.is-info::-moz-progress-bar {
  background-color: #42afe3;
}

.progress.is-success::-webkit-progress-value {
  background-color: #97cd76;
}

.progress.is-success::-moz-progress-bar {
  background-color: #97cd76;
}

.progress.is-warning::-webkit-progress-value {
  background-color: #fce473;
}

.progress.is-warning::-moz-progress-bar {
  background-color: #fce473;
}

.progress.is-danger::-webkit-progress-value {
  background-color: #ed6c63;
}

.progress.is-danger::-moz-progress-bar {
  background-color: #ed6c63;
}

.progress.is-small {
  height: 8px;
}

.progress.is-medium {
  height: 16px;
}

.progress.is-large {
  height: 20px;
}

.progress:not(:last-child) {
  margin-bottom: 20px;
}
