/**
 * Copyright © 2010-2018 Epicor Software Corporation: All Rights Reserved
 */
#subscribe-options{
    padding:15px;
    background-color: #F7F7F7;
}
#subscribe-options #available-plans{
    width: 100%;
}
#subscribe-options #available-plans .plan{
    width: 45%;
    display:inline-block;
    padding:10px 5px 10px 10px;
    border: 1px solid #F7F7F7;
    background-color: white;
    vertical-align: top;
    margin-bottom:5px;
}
.plan .plan-container{
    text-align: left;
}
#subscribe-options .section-title{
    margin-bottom: 15px;
}
#subscribe-options #available-plans .plan.selected, #subscription-end .end-select.selected{
    border: 1px solid rgb(25, 121, 195);
    font-weight: bold;
}
#subscribe-options.hidden{
    display:none;
}
#subscription-product table td{
    width:150px;
}
#subscription-end{
    margin-top: 40px;
}
#subscription-end button.ui-datepicker-trigger{
    position: absolute;
    top: 17px;
    right:10px;
}
input#cycle-times{
    width:40%;
}
#subscription-end .end-select{
    margin-right: 5px;
    border: 1px solid #F7F7F7;
}
.end-container{
    display: block;
    vertical-align: middle;
    text-align: left;
}
#end-by-date div.end-value{
    padding: 10px 0 10px 5px;
}

#subscription-end .end-subscribe-choice .enddate-col{
    display: inline-block;
    width: 100%;
    margin: 5px;
}

#subscription-end .end-subscribe-choice .enddate-col .end-container .end-date{
    width: 47%;
}

#subscription-end .end-date{
    background-color: white;
    width: 47%;
    display: inline-block;
    vertical-align: middle;
    padding: 16px 0 16px 5px;
    position: relative;
}

#subscription-end .end-date#datepicker{
    float: right;
    margin-right: 5px;
}
#subscription-end td{
    padding: 5px 0;
}
#end-by-date  .end-value input{
    width:97%;
}
#end-cycle  .end-value{
    padding: 9px 0 9px 5px;
}
#end-cycle .end-value label{
    margin-left: 5px;
}
.custom-error{
    border: 1px solid #ed8380 !important;
}

#available-plans .discount.hidden{
    display: none;
}
.subscription-type{
    margin-bottom: 12px;
}
.subscription-type label.selected{
    font-weight: bold;
}
.discount-text{
    display: inline-block;
}

div#plan-details.hidden {
    display:none;
}
.subscription-info{
    margin: 5px 0;
}
div.subscription-options{
    margin-bottom: 15px;
}
/* Terms message tooltip css */
#subscription-terms-note.tooltip-container:hover{
    cursor: pointer;
}
#subscription-terms-note #tooltip-icon{
    font-size: 20px;
    display:block;
    padding: 0 2px;
}
#subscription-terms-note.tooltip-container{
    display: inline-block;
    position: relative;
}
#subscription-terms-note .tooltip{
    display: none;
    top: -11px;
    box-shadow: 0 2px 8px 0 rgb(0 0 0 / 30%);
    background: #fffbbb;
    border: 1px solid #afadac;
    border-radius: 1px;
    padding: 1.5rem 2.5rem;
    position: absolute;
    z-index: 1;
    float: right;
    left: 48px;
    width: 200px;
}
#subscription-terms-note .tooltip.visible{
    display: block;
    opacity: 0;
}
#subscription-terms-note .tooltip:after{
    width: 0;
    height: 0;
    left: -22px;
    top: 15px;
    position: absolute;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    content: '';
    border-right: 25px solid #fffbbb;
    z-index: -13;
}
#subscription-terms-note .tooltip:before{
    width: 0;
    height: 0;
    left: -25px;
    top: 15px;
    position: absolute;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    content: '';
    border-right: 25px solid #afadac;
    z-index: -13;
}

