#offer_builder_form label {
  display: block;
  width: 100%;
}

#offer_builder_form input, 
#offer_builder_form select {
  width: 100%;
  padding: 4px !important;
  background-color: #FFF !important;
  display: block !important;
  clear: both !important;
  border: 1px solid #CCC !important;
  margin-bottom: 10px !important;
}

#offer_builder_form label {
  padding: .2rem 0 .4rem;
}
#offer_builder_form .required {
  color: #333;
}

#offer_builder_form .required label:after {
  color: #F00;
  content: ' *';
}

#offer_builder_form em {
  font-size: 90%;
}

.bb_alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
  text-align: center;
}

.bb_alert-success {
  /*color: #3c763d;*/
  /*background-color: #dff0d8;*/
  /*border-color: #d6e9c6;*/
}
.cell-form.hidden {
  display: none;
}
.cell-head:hover {
  background: #4d0116;
  color: #fff;
}
.cell-head{
  box-sizing: border-box;
  margin: 3rem auto 0;
  color: #4d0116;
  border: 1px solid #4d0116;
  cursor: pointer;
  text-align: center;
  padding: .8rem 1.4rem;
  transition: 450ms;
}
.mobile #offerBlock {
  text-align: center;
}
.mobile .cell-head {
  margin: 2rem auto;
}
#myModal .product.product-type-simple {
  width: 100%;
}
#bg_white{
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
  width: 100%;
  height: 100%;
  transition: 0.1s;
  z-index: 9;
}

#myModal img {
  /*display: none;*/
}
#myModal #offer_builder_form{
  padding: 1.66rem;
}
#myModal {
  display: none;
  position: fixed;
  /*left: 50%;*/
  /*transform: translateX(-50%);*/
  width: 400px;
  height: 350px;
  z-index: 300;
}
.mobile #myModal {
  width: 370px;
  height: 350px;
  z-index: 300;
}
#bg_white.active,
#myModal.fade.in{
  display: block;
}
.modal-close:hover {
  border: 1px solid #777777;
  border-radius: 50%;
}
.modal-close{
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAAaklEQVR42qSTQQoAIQwDk/z/z9nDIrhu1YgeCzOxLSUA2yYOH0nLNkn6FLRN4Y2OBQ0EALViIujBD7wTjOAPngkqsIRHwQwEANqOe4ySe3A1RO0SVwIlX50JlPZYCZQOpxIoBcs13lzVMwBcf24Z+cGbowAAAABJRU5ErkJggg==) center no-repeat;
  width: 19px;
  height: 19px;
  text-indent: -9999px;
  border: none;
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 10px;
  padding: 3px;
  z-index: 100;
  transition: 350ms;
}
#offer_builder_form .spinner{
  visibility: hidden;
  display: inline-block;
  background-color: #23282d; /* Dark Gray 800 */
  opacity: 0.75;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 100%;
  padding: 0;
  margin: 0 24px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#offer_builder_form .spinner.is-active {
  visibility: visible;
}
.single_add_to_cart_button.h-opacity {
  opacity: .3;
}
#offer_builder_form .spinner::before {
  content: '';
  position: absolute;
  background-color: #fbfbfc; /* Light Gray 100 */
  top: 4px;
  left: 4px;
  width: 6px;
  height: 6px;
  border: none;
  border-radius: 100%;
  transform-origin: 8px 8px;
  animation-name: spin;
  animation-duration: 1000ms;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@media (prefers-reduced-motion: reduce) {
  #offer_builder_form .spinner::before {
    animation-name: blink;
    animation-duration: 2000ms;
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes blink {
  from {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}