/*
---

name: Payment Details

description: files: PurchasingPaymentNew.aspx

requires: [CSS.Main, CSS.Layout, CSS.Buttons, CSS.Inform]

provides: [CSS.PaymentDetailsNew]

...
*/
.newProduct #wrapper .offerVariantSelectionForm .informInline.left {
  background-color: #f3f3f3;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left label {
  text-align: left;
  line-height: 2;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left > .field label[for="DeliveryCountry"] {
  width: 192px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left input {
  margin-bottom: 0;
  max-width: 360px;
  font-size: 14px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left input#PromotionCode {
  width: 190px;
  font-size: 14px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion {
  position: relative;
  padding-top: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion label {
  padding-bottom: 0;
  display: inline-block;
  float: none;
  color: #178ab9;
  width: 200px;
  text-transform: uppercase;
  font-size: 12px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion label:hover {
  cursor: pointer;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion div {
  display: none;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion .updateOffers {
  margin-right: 0;
  width: 130px;
  text-transform: uppercase;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion.show div {
  display: block;
  background: white;
  margin: 0 -8px -8px;
  text-align: right;
  padding-top: 16px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion.show label {
  padding-bottom: 8px;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-top: 0 none;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] label {
  padding-top: 0;
  margin-right: 8px;
  width: auto;
  display: none;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] input {
  margin: -3px 6px 0;
  padding: 0;
  text-align: center;
  background-color: #fff;
  border: 1px solid #e7e7e7;
  color: #000;
  height: 30px;
  font-size: 16px;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] div[class*="qty-"] {
  cursor: pointer;
  padding-top: 5px;
  border: 0;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] div[class*="qty-"].disabled {
  opacity: 0.5;
  cursor: default;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] div[class*="qty-"] circle {
  fill: #95aa19;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] button {
  margin-left: 12px;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor]:hover {
  background: none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable {
  font-size: 1em;
  /* FOOT */
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tr {
  border-right: 1px solid #e7e7e7;
  border-left: 1px solid #e7e7e7;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable td:before {
  position: absolute;
  top: 12px;
  left: 8px;
  right: 150px;
  padding-right: 10px;
  white-space: nowrap;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr {
  border: 0 none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr th {
  background-color: #fff;
  font-weight: 700;
  font-size: 1.4em;
  border: 0 none;
  border-bottom: 1px solid #e7e7e7;
  padding: 16px 6px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr th.item {
  width: 60%;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr th.qty {
  text-align: center;
  padding-left: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr th.itemPrice {
  width: 23%;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody tr {
  border-bottom: 1px solid #e7e7e7;
  border-right: 0 none;
  border-left: 0 none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody tr td {
  border: none;
  border-bottom: 1px solid #e7e7e7;
  position: relative;
  padding-left: 50%;
  padding: 22px 0 0;
  overflow: hidden;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody tr td article {
  margin-bottom: 20px;
  overflow: hidden;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody tr td:last-child {
  border-bottom: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .spacer {
  display: none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .spacer td {
  padding: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody span {
  display: block;
  color: #2c2c2c;
  font-size: 1.4em;
  margin-bottom: 3px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody span.description p {
  font-weight: normal;
  text-decoration: none;
  font-style: normal;
  font-size: 1em;
  line-height: 1.56;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody span + span {
  font-size: 1.2em;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .picture {
  float: left;
  margin: 0 20px 0 0;
  padding: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody div {
  overflow: hidden;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody div h4 {
  color: #178aba;
  font-size: 1.8em;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price {
  font-weight: 700;
  font-size: 1.8em;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price div {
  margin-bottom: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span {
  font-size: 0.8em;
  font-weight: 400;

}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.taxStatus {
    display:inline;
    }
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.frequencyText,
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.frequency,
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.continuesPayment,
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.offerStatus,
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.tax {
        font-size: .595em;
        line-height: 1.455;
        font-weight: normal;
    }
    .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.saving {
        font-size: .89em;
        font-weight: normal;
        line-height: 1.455;
        margin-top:13px;
    }
        .newProduct #wrapper .offerVariantSelectionForm .productTable tbody .price span.saving span {
            color: #FF9121;
            display: inline;
            font-size: 1em;
            font-weight: normal;
            line-height: 1.455;
            padding-top:10px;
        }

.newProduct #wrapper .offerVariantSelectionForm .productTable .qty fieldset {
  padding: 0;
  background-color: transparent;
  box-shadow: 0 0 0 transparent;
  border-bottom: 0;
  border-top: 0 none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable .qty fieldset button {
  float: right;
  margin: 0;
  border: 0;
  height: auto;
  letter-spacing: 0;
  line-height: 1;
  background-color: transparent;
  margin-top: 4px;
  padding-top: 5px;
  text-transform: none;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable .qty[data-quantity-adjustor] {
  justify-content: flex-start;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable .price,
.newProduct #wrapper .offerVariantSelectionForm .productTable .itemPrice {
  text-align: right;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable .vat,
.newProduct #wrapper .offerVariantSelectionForm .productTable .total {
  background: #f3f3f5;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable .vat td,
.newProduct #wrapper .offerVariantSelectionForm .productTable .vat th,
.newProduct #wrapper .offerVariantSelectionForm .productTable .total td,
.newProduct #wrapper .offerVariantSelectionForm .productTable .total th {
  padding: 8px 8px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot fieldset {
  padding: 0;
  background-color: transparent;
  box-shadow: 0 0 0 transparent;
  border-bottom: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot tr {
  text-align: right;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot tr td {
  display: inline-block;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot th {
  text-align: right;
  font-weight: bold;
  display: inline-block;
  text-align: right;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .total {
  border-bottom: 1px solid #e7e7e7;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .total th {
  line-height: 0.8;
  padding-right: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .total td {
  display: inline-block;
  text-align: right;
  padding-top: 6px;
  padding-bottom: 12px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .vat {
  line-height: 1.143;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .vat th {
  padding-right: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .vat th,
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .vat td {
  padding-top: 16px;
  font-weight: normal;
  display: inline-block;
  text-align: right;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot .vat td .cost {
  font-weight: normal;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tfoot tr td {
  text-align: right;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  box-shadow: 0px -2px 13px 0px #c7c7c7;
  padding: 14px 0;
  z-index: 1;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed {
  max-width: 1220px;
  margin: 0 auto;
  text-align: right;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0 88px 0 20px;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed .grandTotal {
  display: inline-block;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed .grandTotal > span {
  font-size: 1.8em;
  margin-right: 130px;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed .grandTotal > span + span {
  font-size: 2.6em;
  line-height: 1.5;
  margin-right: 27px;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed .grandTotal .cur {
  margin-right: 0;
}
.newProduct #wrapper .offerVariantSelectionForm .totalPrice div.proceed button {
  margin-right: 0;
}

.addedMessage {
  background-color: #000;
}
.addedMessage p {
  color: #fff;
  padding: 12px;
  margin-bottom: 0;
}

.shoppingBasket .formbox {
  padding-bottom: 51px;
  border-bottom: 1px solid #e7e7e7;
  margin-bottom: 20px;
}

@media only screen and (min-width: 670px) {
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  input#PromotionCode {
    width: 240px;
  }

  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion
  .updateOffers {
    width: 150px;
  }
}
@media only screen and (min-width: 855px) {
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion {
    padding: 0;
  }
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion label {
    position: absolute;
    top: -36px;
    right: 0;
    margin-right: 10px;
  }
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion.show div {
    margin-right: auto;
  }
}
@media only screen and (min-width: 996px) {
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion {
    padding: 0 8px;
  }
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion label {
    position: static;
    padding-bottom: 8px;
  }
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion.show div {
    margin-right: -8px;
  }
}
@media only screen and (min-width: 1220px) {
  .newProduct
  #wrapper
  .offerVariantSelectionForm
  .informInline.left
  .promotion
  label {
    position: absolute;
  }
}
