$modal-overlay-color: rgba($secondary, 0.9) !default;
$modal-horizontal-padding: 30px !default;
$modal-vertical-padding: 25px !default;
$modal-border-radius: 10px !default;
$modal-gray-background: #f6f7f9 !default;

.modal-backdrop {
  background-color: $modal-overlay-color;

  &.show {
    opacity: 1;
  }
}

.modal-header {
  border-bottom: none;
  padding: #{$modal-vertical-padding} #{$modal-horizontal-padding};
}

.close.close-modal {
  left: auto;
  opacity: 1;
  position: absolute;
  right: -35px;
  top: -35px;
}

.modal-body {
  padding: 0 #{$modal-horizontal-padding} #{$modal-vertical-padding};
}

.modal-title {
  color: #333;
  font-size: 18px;
  font-weight: normal;
  text-align: left;
  white-space: normal;
  word-break: break-word;
}

.modal-content {
  border-radius: $modal-border-radius;
  position: relative;
}