.padding-bt-10 {
  padding-bottom: 10px;
}

.cursor-pointer {
  cursor: pointer;
}

.m-bg-info-important {
  background-color: #d9edf7 !important;
}

.m-bg-warning-important {
  background-color: #fcf8e3 !important;
}

.m-bg-danger-important {
  background-color: #f2dede !important;
}

.m-bg-success-important {
  background-color: #dff0d8 !important;
}

/* cryspy-form and imputmoney fields */

form.form-horizontal .inputmoneywidget {
  width: 50%;
  display: inline-block;
}

form.form-horizontal .inputmoneywidget + div {
  width: 15%;
  float: right;
}

form.form-horizontal .inputmoneywidget + div a,
form.form-horizontal .inputmoneywidget + div a {
  height: 28px;
}

/* crispy-form and datetimepicker fields */

div.form-group div.datetimepicker {
  padding-left: 15px;
  padding-right: 15px;
}

.spinner {
  display: inline-block;
  opacity: 0;
  width: 0;
  -webkit-transition: opacity 0.25s, width 0.25s;
  -moz-transition: opacity 0.25s, width 0.25s;
  -o-transition: opacity 0.25s, width 0.25s;
  transition: opacity 0.25s, width 0.25s;
}

.has-spinner.active {
  cursor: progress;
}

.has-spinner.active .spinner {
  opacity: 1;
  width: auto;
  /* This doesn't work, just fix for unkown width elements */
}

.glyphicon-refresh-animate {
  -animation: spin 0.2s infinite linear;
  -webkit-animation: spin2 2s infinite linear;
}

.tr-icon-with-size {
  width: 37px;
}

.margin-bottom-15 {
  margin-bottom: 15px !important;
}

.padding-top-0 {
  padding-top: 0 !important;
}

.padding-0 {
  padding: 0 !important;
}

.boxing-image {
  display: block;
  float: none;
  margin-top: 2px !important;
}

.listing-detail-products-table {
  width: 100% !important;
}

.no-wrap {
  white-space: nowrap;
}

.min-width-60 {
  min-width: 60px;
}

/* Define the hover highlight color for the table row */

table.hoverTable > tbody > tr:hover > td,
table.hoverTable > tbody > tr:hover > td > table {
  background-color: #eee;
}

.ellipsify-content {
  width: 20em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
}

.ellipsify-content-15 {
  width: 15em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
}

.ellipsify-content-5 {
  width: 5em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
}

.diplay-inline-block {
  display: inline-block;
  float: none;
}

.font-size-x-small {
  font-size: x-small;
}

.font-size-14 {
  font-size: 14px !important;
}

div.input-group .checkboxinput {
  margin-top: 12px;
}

div.multiField div.controls.col-md-8 div.select2-container {
  width: 100%;
}

span.select2-container {
  width: 100% !important;
}

img.navbar-logo {
  height: 25px;
}

@-webkit-keyframes spin2 {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  from {
    transform: scale(1) rotate(0deg);
  }
  to {
    transform: scale(1) rotate(360deg);
  }
}

.row {
  padding-top: 5px;
}

.listing-detail {
  padding-bottom: 5px;
}

.select2-choice {
  height: 28px !important;
}

.bazaar-sidebar .btn,
.margin-bottom-15 .btn {
  margin-bottom: 5px;
}

.dropdown-menu > li > a:hover {
  background-color: #ebebeb;
}

.width100 {
  width: 100% !important;
}

.width20 {
  width: 20%;
}

.width40 {
  width: 40%;
}

.alert-small {
  padding: 5px 10px;
  margin-bottom: 2px;
  margin-right: 2px;
}

.force-absolute {
  position: absolute;
}

.foil.foil-list {
  height: 100%;
  width: 50px;
  animation-duration: 300s;
  -webkit-animation-duration: 300s;
}

.foil.foil-detail {
  height: 100%;
  width: 90%;
  animation-duration: 120s;
  -webkit-animation-duration: 120s;
}

.foil.foil-popup {
  animation-duration: 120s;
  -webkit-animation-duration: 120s;
}

.foil {
  width: 89%;
  height: 95%;
  max-width: 322px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: rgba(94, 255, 183, 0.3);
  background: -moz-linear-gradient(
    left,
    rgba(94, 255, 183, 0.3) 0%,
    rgba(239, 1, 124, 0.23) 27%,
    rgba(238, 118, 55, 0.17) 47%,
    rgba(237, 206, 3, 0.21) 62%,
    rgba(94, 255, 183, 0.3) 100%
  );
  background: -webkit-gradient(
    left top,
    right top,
    color-stop(0%, rgba(94, 255, 183, 0.3)),
    color-stop(27%, rgba(239, 1, 124, 0.23)),
    color-stop(47%, rgba(238, 118, 55, 0.17)),
    color-stop(62%, rgba(237, 206, 3, 0.21)),
    color-stop(100%, rgba(94, 255, 183, 0.3))
  );
  background: -webkit-linear-gradient(
    left,
    rgba(94, 255, 183, 0.3) 0%,
    rgba(239, 1, 124, 0.23) 27%,
    rgba(238, 118, 55, 0.17) 47%,
    rgba(237, 206, 3, 0.21) 62%,
    rgba(94, 255, 183, 0.3) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(94, 255, 183, 0.3) 0%,
    rgba(239, 1, 124, 0.23) 27%,
    rgba(238, 118, 55, 0.17) 47%,
    rgba(237, 206, 3, 0.21) 62%,
    rgba(94, 255, 183, 0.3) 100%
  );
  background: -ms-linear-gradient(
    left,
    rgba(94, 255, 183, 0.3) 0%,
    rgba(239, 1, 124, 0.23) 27%,
    rgba(238, 118, 55, 0.17) 47%,
    rgba(237, 206, 3, 0.21) 62%,
    rgba(94, 255, 183, 0.3) 100%
  );
  background: linear-gradient(
    to right,
    rgba(94, 255, 183, 0.3) 0%,
    rgba(239, 1, 124, 0.23) 27%,
    rgba(238, 118, 55, 0.17) 47%,
    rgba(237, 206, 3, 0.21) 62%,
    rgba(94, 255, 183, 0.3) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5effb7', endColorstr='#5effb7', GradientType=1);
  /*animation: rotate 60s linear;*/
  /*-webkit-animation: rotate 60s linear;*/
  animation-name: rotate;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  -webkit-animation-name: rotate;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
}

.foil:hover {
}

@-webkit-keyframes rotate {
  from {
    background-position: -3000px;
  }
  to {
    background-position: 0px;
  }
}

@keyframes rotate {
  from {
    background-position: -3000px;
  }
  to {
    background-position: 0px;
  }
}

.delete-row {
  padding-left: 8px;
  margin-left: 25%;
}

.add-row {
  position: relative;
  top: -40px;
  float: right;
  margin-right: 116px;
}

.formset {
  padding: 15px;
}

.linea {
  border-top: dashed lightgray 3px;
  padding-bottom: 10px;
}

.vertical-align-top {
  vertical-align: top;
}

.hedear-selection {
  height: 40px;
  background-color: #eee;
  padding: 2px;
  border-bottom: 1px solid lightgrey;
  border-top: 1px solid lightgrey;
}

.publishing-header-selection {
  height: 30px;
  background-color: #eee;
  margin-left: 0;
  padding-left: 10px !important;
}

.publishing-header-selection > span {
  font-weight: bold;
  text-align: left;
  margin-left: 0;
}

.all,
.question,
#tip-text {
  padding-left: 18px;
}

#action-toggle {
  margin: 0;
  padding: 0;
}

.padding-left-2 {
  padding-left: 2px;
}

.padding-bottom-15 {
  padding-bottom: 15px;
}

.form-horizontal ul {
  -webkit-padding-start: 0px;
}

.form-group .controls li {
  list-style-type: none;
}

/*
CSS hack to set a select2 readonly not editable
without have to set the disabled attribute that
prevent values to be sent on form submission
See https://github.com/select2/select2/issues/3387
*/

select[readonly].select2-hidden-accessible + .select2-container > span {
  cursor: not-allowed;
}

select[readonly].select2-hidden-accessible + .select2-container > span > span {
  pointer-events: none;
  touch-action: none;
  background-color: #eeeeee;
}

td.no-wrap.price.editable > span {
  cursor: pointer;
  font-weight: bold;
}

td.no-wrap.price.editable > div {
  width: 180px;
}