.container {
    background-color: rgb(240, 240, 240);
    margin: auto;
    /*width: calc(95%);*/

    border: none;
    border-radius: 4px;
}

#checkout-form {
    position: relative;
    /*width: calc(95%);*/
    margin: auto;
    padding: 10px;
}

#checkout-form label {
    display: block;
    min-height: 25px;

    font-size: 15px;
    font-weight: 500;
    margin: 5px 0;
    padding: 0;
    color: red;
}

#card-number, #card-cvv, #card-expiry {
    background-color: #FFF;
    display: block;
    /*width: calc(90%);*/
    border-radius: 2px;
    border: 1px solid rgba(200, 200, 200, 1);
    padding: 14px 60px 13px 20px;
    margin: auto;
    transition: all 100ms ease-out;
}

/* card images are added to card number */
#card-number {
    background-image: none;

    background-origin: content-box;
    background-position: calc(100% + 40px) center;
    background-repeat: no-repeat;
    background-size: contain;
}

/* buttons */
.bambora-btn {
    vertical-align: top;
}

.bambora-btn {
    position: relative;
    border: none;
    border-radius: 4px;
    background-color: rgba(120, 71, 181, 1);
    color: rgba(255, 255, 255, 1);
    display: inline-block;
    transition: all 100ms ease-out;
    padding: 11px 25px;
}

.bambora-btn:hover, .bambora-btn:active {
    background-color: rgba(69, 36, 89, 1);
}

.bambora-btn:active {
    box-shadow: inset 0 0 35px rgba(0, 0, 0, 0.3);
}

.bambora-btn:disabled {
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(120, 71, 181, 1);
    color: rgba(120, 71, 181, 1);
}

/* feedback is displayed after tokenization */
#feedback {
    position: relative;
    left: 15px;
    display: inline-block;
    background-color: transparent;
    border: 0px solid rgba(200, 200, 200, 1);
    border-radius: 4px;
    transition: all 100ms ease-out;
    padding: 11px;
}

#feedback.error {
    color: red;
    border: 1px solid;
}

#feedback.success {
    color: seagreen;
    border: 1px solid;
}