#subscriptionStatusDIV
{
    margin: 0 0 clamp(0.1em, 1vw, 1.5em);
}

.subscriptionDIV
{
    display: flex;
    justify-content: center;
    margin: 0 0 clamp(0.1em, 0.7vw, 1.2em);
}

#subscriptionStatusLabel
{
    margin-right: clamp(0.1em, 0.7vw, 0.6em);
}

.subscriptionLabel,
.subscriptionField
{
    font-size: clamp(0.1em, 0.9vw, 0.8em);
}

.subscriptionLabel
{
    margin-right: clamp(0.1em, 0.7vw, 0.6em);
    text-align: right;
    color: #555;
}

#subscriptionStatusLabel,
#subscriptionStatusField
{
    font-size: clamp(0.1em, 1.2vw, 1em);
}

#subscriptionStatusField
{
    color: #530064
}

.subscriptionField
{
    text-align: left;
    font-weight: bold;
    text-transform: uppercase;
    color: #9664A0;
}

.changeButton,
#addLicenseButton,
#manageSeatsButton
{
    margin: clamp(0.1em, 4vw, 3.8em) auto;
}

#paymentFormDIV
{
    margin: clamp(0.1em, 2.4vw, 2em);
    align-content: center;
}

#frequencyDIV,
#priceDIV
{
    display: flex;
    justify-content: center;
}

#frequencyDIV
{
    margin:  clamp(0.1em, 2.4vw, 2em) 0 clamp(0.1em, 1.8vw, 1.6em);
}

#frequencyDIV select
{
    font-size: 0.9em;
}

#priceDIV,
#manageSeatsPriceField
{
    margin: clamp(0.1em, 1.3vw, 1em) 0 clamp(0.1em, 2.4vw, 2em);
    font-size: 1.1em;
    font-weight: bold;
}

#paymentInfoTitle
{
    font-size: 0.7em;
    margin-bottom: clamp(0.1em, 0.4vw, 0.5em);
    display: flex;
    justify-content: center;
}

#paymentForm
{
    margin: 0 0 clamp(0.1em, 0.6vw, 0.5em);
    padding: clamp(0.1em, 0.8vw, 0.7em);
    background-color: #f6dcff;
    border: solid thin #530064;
}

.paymentButton
{
    font-size: 0.9em !important;
    width: clamp(0.1em, 12.9vw, 12em) !important;
}

.ccBillingDIV,
#cardElement
{
    padding: 0 clamp(0.1em, 2.4vw, 2em);
    margin-bottom: clamp(0.1em, 1.5vw, 1.3em);
}

.ElementsApp input
{
    font-size: clamp(0.1em, 1vw, 1em);
}

.ccBillingDIV
{
    display: flex;
    margin-top: clamp(0.1em, 0.8vw, 0.8em);
    justify-content: space-between;
    align-items: center;
}

.ccBillingDIV .formErrorDIV,
#cc_err
{
    font-size: clamp(0.1em, 0.7vw, 0.6em);
}

.ccBillingDIV .formErrorDIV
{
    margin-top: clamp(0.1em, 2.1vw, 3em) !important;
}

#cc_err
{
    margin-top: clamp(0.1em, 1.4vw, 2.2em) !important;
    left: clamp(1em, 5.6vw, 8.3em);
}

#ccCity_err
{
    left: clamp(1em, 33.5vw, 47.9em);
}

#ccState_err
{
    left: clamp(1em, 43.5vw, 63em);
}

#ccZipCode_err,
#ccState_err
{
    margin-top: clamp(0.1em, 2.9vw, 4.2em) !important;
}

#ccZipCode_err
{
    left: clamp(1em, 50.3vw, 72.1em);
}

#ccFullName
{
    width: clamp(3em, 20vw, 22em);
}

#ccAddress
{
    width: clamp(3em, 24vw, 25em);
}

#ccCity
{
    width: clamp(1em, 12vw, 13em);
}

#ccState,
#ccState:-webkit-autofill
{
    -webkit-box-shadow: 0 0 0 1000px #9664A0 inset !important;
    -webkit-text-fill-color: #FFF;
    width: clamp(0.2em, 5vw, 6em);
    font-size: clamp(0.1em, 1vw, 1.2em);
    min-width: unset !important;
    height: clamp(0.1em, 2.1vw, 3em);
    background-image: unset !important;
    padding: unset !important;
}

#ccZipCode
{
    width: clamp(0.2em, 5vw, 6em);
}

.stripeField,
.stripeField:-webkit-autofill
{
    -webkit-box-shadow: 0 0 0 1000px #f6dcff inset !important;
    -webkit-text-fill-color: unset !important;
    background-color: transparent !important;
    border: none !important;
    display: block;
    font-family: sans-serif;
    font-size: 0.8em !important;
    height: 1.2em;
    line-height: 1.2em;
    margin: 0;
    padding: 0 !important;
    color: #000 !important;
    cursor:text !important;
}

.stripeField::placeholder
{
    color: #777;
}

#licensingTabDIV,
#subscriptionTabDIV
{
    padding-top: clamp(0.1em, 4vh, 2.1em);
}



/*------------------------------------------------ LICENSE TAB --*/

#licenseKeysLabel,
#invoicesLabel
{
    text-align: center;
    font-weight: bold;
    margin-bottom: clamp(0.1em, 0.8vw, 0.7em);
}

#licenseKeyListDIV
{
    overflow-y: auto;
    border: solid thin #530064;
    max-height: clamp(5em, 22vw, 19em);
    min-height: clamp(1em, 8.4vw, 8em);
}


.licenseKeyItem
{
    display: flex;
    justify-content: center;
    cursor: pointer;
}

.licenseKeyItem div
{
    align-content: center;
}

.lkField
{
    font-size: clamp(0.1em, 1.2vw, 1.1em);
    width: clamp(2em, 33vw, 33em);
    text-align: center;
    padding: clamp(0.1em, 0.8vw, 0.8em) 0;
}

.lkLabel
{
    text-align: right;
    color: #555;
}

.lkLabel,
.lkFreq,
.lkSeats,
.lkActiveSeats
{
    font-size: clamp(0.1em, 0.9vw, 0.8em);
}

.lkFreq,
.lkSeats,
.lkActiveSeats
{
    margin-right: clamp(0.1em, 0.9vw, 0.8em);
}

.lkFreq
{
    width: clamp(1em, 5vw, 4em);
}

.lkSeats,
.lkActiveSeats
{
    width: clamp(1em, 2vw, 1.2em);
}

#licenseEditDIV
{
    text-align: center;
}

#seatCounterDIV,
#manageSeatsCounterDIV,
#manageSeatsPriceDIV
{
    display:flex;
    justify-content: center;
    align-items: baseline;
}

#seatCounterLabel,
#manageSeatsCounterLabel,
#manageSeatsPriceLabel,
#manageSeatsNotesField
{
    color: #555;
}

#seatCounterLabel,
#manageSeatsCounterLabel,
#manageSeatsPriceLabel
{
    text-align: right;
    margin-right: clamp(0.1em, 0.4vw, 0.6em);
    font-size: clamp(0.1em, 1vw, 0.9em);
}

#manageSeatsNotesField
{
    text-align: center;
    margin: clamp(1em, 1.7vw, 2em) clamp(1em, 7vw, 9em);
    font-size: clamp(0.1em, 0.9vw, 0.8em);
    font-style: italic;
}

#seatCounterInput,
#manageSeatsCounterInput
{
    width: clamp(1em, 2.8vw, 2.3em);
    font-weight: bold;
    font-size: 1.1em;
}

#licenseInfoDIV
{
    height: clamp(5em, 6vw, 6em);
    margin-top: clamp(1em, 2vw, 1.9em);
}

#manageSeatsLicenseDIV
{
    margin: clamp(0.1em, 3vw, 3em) 0;
}

#manageSeatsPriceField
{
    text-align: left;
    font-weight: bold;
}

#manageSeatsPriceDIV
{
    margin-top: clamp(0.1em, 0.8vw, 0.7em);
}

.priceLoaderGIF img,
.licenseLoaderGIF img
{
    position: relative;
}

.priceLoaderGIF img
{
    height: clamp(0.1em, 3vw, 2.6em);
    top: clamp(0.1em, 1vw, 0.9em);
    position: relative;
}

.licenseLoaderGIF img
{
    height: clamp(1em, 11vw, 9.2em);
    top: clamp(-1.6em, -1.7vw, 0.1em);
}

#editSubscriptionPP,
#editLicensePP
{
    width: clamp(0.1em, 1.1vw, 1em);
    margin-left: clamp(0.1em, 0.6vw, 0.6em);
}

#setToDefaultDIV
{
    display: flex;
    font-size: 0.7em;
    align-items: center;
}

#setToCustDefault
{
    width: clamp(0.3em, 0.9vw, 1.1em);
    height: clamp(0.3em, 0.9vw, 1.1em);
    padding: unset;
}


/*------------------------------------------------ INVOICES TAB --*/

#invoicesGridDIV
{
    text-align: center;
    width: clamp(10em, 70vw, 70em);
    margin: auto 50%;
    transform: translateX(-50%);
}

#invoicesHeader
{
    background-color: #530064;
    font-weight: bold;
}

.invoiceHeaderRow,
.invoiceRow
{
    height: clamp(0.1em, 2vw, 1.8em);
    display: flex;
    justify-content: center;
    align-items: center;
}

.invoiceHeaderRow
{
    color: #fbf7ff;
}

.invoiceRow
{
    color: #9664A0;
}

.invoiceDate
{
    width: clamp(1em, 6vw, 6em);
}

.invoiceNumber
{
    width: clamp(1em, 10vw, 10em);
}

.invoiceType
{
    width: clamp(1em, 40vw, 40em);
}

.invoiceCost
{
    width: clamp(1em, 7vw, 7em);
}

.invoiceStatus
{
    width: clamp(1em, 4.5vw, 4.5em);
}

.invoiceDL
{
    width: clamp(1em, 2.5vw, 2.5em);
}

.invoiceHeaderCol,
.invoiceCol
{
    font-size: clamp(0.1em, 1vw, 0.9em);
    height: 100%;
    align-content: center;
}

#invoiceHeaderDL
{
    
}

.invoiceHeaderCol
{
    border-left: solid thin #7636a5;
}

.invoiceCol
{
    border-left: solid 0.1em #e7b7f7;
    border-bottom: solid 0.1em #e7b7f7;
}

.invoiceDL img
{
    width: 40%;
    height: 67%;
}