/*
---

name: Purchasing Product

description: files: PurchasingProduct.aspx

requires: [CSS.Main, CSS.Layout, CSS.Buttons, CSS.Inform]

provides: [CSS.PurchasingProduct]

...
*/
#wrapper .products div.field {
  border-top: 1px solid #E7E7E7;
  padding: 0;
}
#wrapper .products div.field:after {
  clear: both;
  content: "";
  display: table;
}
#wrapper .products div.field div {
  border: solid #FFF;
  border-width: 2px 0;
  padding: 19px 12px 4px 8px;
}
#wrapper .products .field:hover {
  background-color: #E6F6FC;
  cursor: pointer;
}
#wrapper .products .field:hover label {
  cursor: pointer;
}
#wrapper .products div label {
  float: none;
  margin: -28px 0 0 20px;
  padding: 8px 0 0;
  width: auto;
}
#wrapper .products div label span * {
  font-size: 1em;
  padding-bottom: 0;
  margin-bottom: 0;
}
#wrapper .products div label span.description p {
  font-weight: normal;
  text-decoration: none;
  font-style: normal;
}
#wrapper .products label:after {
  clear: both;
  content: "";
  display: table;
}
#wrapper .products .labelInner1 {
  float: left;
  width: 70%;
  text-align: left;
}
#wrapper .products span span {
  display: block;
}
#wrapper .products .labelInner1 .title {
  color: #178ABB;
  font-size: 1.286em;
  line-height: 1.333;
  font-weight: bold;
  margin: 0 0 8px;
}
#wrapper .products .labelInner1 .subVariant {
  margin-top: 8px;
}
#wrapper .products .labelInner1 .issues {
  font-style: italic;
  font-weight: normal;
}
#wrapper .products .labelInner1 .payable {
  font-size: .916em;
  font-weight: normal;
  line-height: 1.455;
  padding: 8px 0 0 0;
}
#wrapper .products .labelInner2 {
  float: right;
  text-align: right;
  width: 26.666%;
}
#wrapper .products .labelInner2 > span {
  margin: 0;
  padding-top: 4px;
}
#wrapper .products .labelInner2 > span:first-child {
  margin-top: 0;
  padding-top: 0;
}

#wrapper .products .labelInner2 .cost {
    float: right;
    font-weight: bold;
    font-size: 1.285em;
}
#wrapper .products .labelInner2 .saving {
  clear: both;
  font-size: 1.143em;
  font-weight: normal;
  line-height: 1.455;
  padding-top: 8px;
}
#wrapper .products .labelInner2 .tax {
  float: right;
  clear: both;
  font-size: .916em;
  line-height: 1.455;
  font-weight: normal;

  padding-top: 10px;
}
    #wrapper .products .labelInner2 .frequencyText {
        float: right;
        clear: both;
        font-size: .785em;
        line-height: 1.455;
        font-weight: normal;
        padding-top:2px;
    }
#wrapper .products .labelInner2 .saving span {
    color:#FF9121;
    display:inline;
    }
    #wrapper .products .labelInner2 .taxStatus {
        font-size: .595em;
        line-height: 1.455;
        display: inline-flex;
        font-weight: 400;
    
    }
    #wrapper .products .labelInner2 .tax {
        float: right;
        clear: both;
        font-size: .785em;
        line-height: 1.455;
        font-weight: normal;

    }
    #wrapper .products .labelInner2 .continuesPayment,
    #wrapper .products .labelInner2 .offerStatus {
        float: right;
        clear: both;
        font-size: .785em;
        line-height: 1.455;
        font-weight: normal;
    }

.product #offerVariantSelectionWrapper > h2 {
    background: #DBF2FB;
    padding: 4px 12px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 16px;
}
.product #offerVariantSelectionWrapper div.field div {
  padding-bottom: 16px;
}

fieldset.style2 {
  background-color: #F3F3F3;
  border: 1px solid #FFF;
  margin: 1px;
  outline: 1px solid #E7E7E7;
  padding: 20px;
  position: relative;
}

fieldset.style2:after {
  clear: both;
  content: "";
  display: table;
}
fieldset.style2 .field {
  border: 0;
  padding: 0;
}
fieldset.style2 .promotion {
  position: absolute;
  right: 20px;
  top: 10px;
}
fieldset.style2 .promotion label {
  display: block;
  font-weight: normal;
  padding: 0 0 2px;
  width: 100%;
  float: none;
}
fieldset.style2 .promotion .text {
  float: none;
  margin: 0;
  width: 100px;
  vertical-align: top;
}
fieldset.style2 .promotion button {
  float: none;
  margin: 0 0 0 10px;
}

fieldset.style3 {
    background-color: #F2F2F2;
    padding: 10px;
    position: relative;
    top:18px;
}
    fieldset.style3:before {
        content: '';
        width: 100%;
        height: 1px;
        background-color: #DCDCDC;
        margin-top: 0;
        display: block;
        position: absolute;
        left: 0;
        top: -18px;
    }
    fieldset.style3 .field div {
        font-size: 1.6em;
        position: relative;
        width: fit-content;
        margin: auto;
        padding-left: 26px;
    }
    fieldset.style3 .field div:before{
        content:'';
        width:16px;
        height:16px;
        display:block;
        background-image:url(../../graphics/src/tag.svg);
        background-repeat:no-repeat;
        position: absolute;
        left:0;
    }
.product #offerVariantSelectionWrapper div.field div.groupDiscount{
    padding-bottom:0;
}
fieldset.style3 .field div span {
    font-weight: 700;
    color: #178ABB;
}