.disable-user-select {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@keyframes shake {
    0%,
    100% {
        margin-left: 0px;
    }
    20%,
    80% {
        margin-left: -12px;
    }
    40%,
    60% {
        margin-left: 12px;
    }
}

@keyframes shake-absolute {
    0%,
    100% {
        right: 6px;
    }
    20%,
    80% {
        right: 12px;
    }
    40%,
    60% {
        right: 0px;
    }
}

/* updated css for upgrade and trial 2021 */
.bootstrap-select.btn-group.bs-container .dropdown-menu {
    z-index: 1070 !important;
}

@media only screen and (min-width: 768px) {
    .upgradenow-popup.modal.fade {
        width: 100%;
        height: 100%;
        bottom: auto;
        left: 50%;
        margin-top: 0;
        padding: 45px 15px 15px 15px !important;
        right: auto;
        top: 0;
        -webkit-transform: translate(-50%, 0);
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        z-index: 1070;
    }
}

.upgradenow-popup.modal.fade .modal-dialog .modal-content {
    border: none !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    outline: 0 !important;
}

.upgradenow-popup .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

@media only screen and (min-width: 768px) {
    .upgradenow-popup .modal-dialog {
        width: 99%;
        height: auto;
    }
}

@media only screen and (min-width: 970px) {
    .upgradenow-popup .modal-dialog {
        width: 900px;
    }
}

@media only screen and (min-width: 1200px) {
    .upgradenow-popup .modal-dialog {
        width: 960px;
    }
}

.upgradenow-popup .modal-content {
    height: 100%;
    background-color: #fff;
}

@media only screen and (min-width: 768px) {
    .upgradenow-popup .modal-content {
        height: auto;
    }
}

.upgradenow-popup .modal-header {
    background-color: #1B3380;
    border: 1px solid #1B3380;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    padding: 8px;
}

.upgradenow-popup .modal-header .close {
    height: 24px;
    color: #fff;
    display: block;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
}

.upgradenow-popup .modal-header.default-header {
    background: #f4f4f4;
    border: none;
}

.upgradenow-popup .modal-header.default-header .modal-title {
    color: #555;
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
}

.upgradenow-popup .modal-header.default-header .close {
    color: #909090;
}

.upgradenow-popup .modal-header.default-header .close:hover {
    color: #555;
}

.upgradenow-popup .modal-header.default-header ~ .modal-header .close {
    display: none;
}

.upgradenow-popup .modal-title {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    text-align: center;
}

@media only screen and (min-width: 768px) {
    .upgradenow-popup .modal-title {
        font-size: 16px;
        line-height: 24px;
    }
}

.upgradenow-popup .modal-title span {
    display: inline-block;
    font-weight: 400;
}

.upgradenow-popup .modal-title .material-icons {
    display: inline-block;
    font-size: 16px;
    padding: 0 4px 4px 4px;
    vertical-align: middle;
}

.cc-page-container {
    font-size: 12px;
    margin: 20px 0;
    display: flex;
    background-color: #fff;
    justify-content: space-between;
    text-align: center;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container {
        margin: 40px 0;
    }
}

.cc-page-container,
.modal-body-inside {
    background-color: #fff;
    display: block;
    text-align: center;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container,
    .modal-body-inside {
        display: flex;
        flex-flow: row;
    }
}

.cc-page-container p,
.modal-body-inside p {
    white-space: normal;
}

.cc-page-container .lock-intro-wrapper,
.modal-body-inside .lock-intro-wrapper {
    min-height: 570px;
    display: flex;
    flex-direction: column;
}

.cc-page-container .lock-intro-wrapper.custom-lock,
.modal-body-inside .lock-intro-wrapper.custom-lock {
    width: 100%;
    display: flex;
    flex-direction: column;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .lock-intro-wrapper.custom-lock,
    .modal-body-inside .lock-intro-wrapper.custom-lock {
        width: calc(100% / 3);
    }
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .lock-intro-wrapper.custom-lock h5,
    .modal-body-inside .lock-intro-wrapper.custom-lock h5,
    .cc-page-container .lock-intro-wrapper.custom-lock .intro-content,
    .modal-body-inside .lock-intro-wrapper.custom-lock .intro-content {
        padding: 0;
    }
}

.cc-page-container .lock-intro-wrapper.custom-lock .intro-image,
.modal-body-inside .lock-intro-wrapper.custom-lock .intro-image {
    margin-top: auto;
}

.cc-page-container .cc-form-wrapper,
.modal-body-inside .cc-form-wrapper {
    margin-bottom: 20px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper,
    .modal-body-inside .cc-form-wrapper {
        margin-bottom: 0;
    }
}

.cc-page-container .cc-form-wrapper,
.modal-body-inside .cc-form-wrapper,
.cc-page-container .lock-intro-wrapper,
.modal-body-inside .lock-intro-wrapper,
.cc-page-container .trial-form-wrapper,
.modal-body-inside .trial-form-wrapper {
    width: 100%;
    padding: 8px;
    text-align: left;
}

.cc-page-container .lock-intro-wrapper,
.modal-body-inside .lock-intro-wrapper,
.cc-page-container .trial-form-wrapper,
.modal-body-inside .trial-form-wrapper {
    position: relative;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper,
    .modal-body-inside .cc-form-wrapper,
    .cc-page-container .lock-intro-wrapper,
    .modal-body-inside .lock-intro-wrapper,
    .cc-page-container .trial-form-wrapper,
    .modal-body-inside .trial-form-wrapper {
        width: calc(100% - 320px);
        padding: 32px;
    }
}

.cc-page-container .cc-form-wrapper.no-padding-top,
.modal-body-inside .cc-form-wrapper.no-padding-top,
.cc-page-container .lock-intro-wrapper.no-padding-top,
.modal-body-inside .lock-intro-wrapper.no-padding-top,
.cc-page-container .trial-form-wrapper.no-padding-top,
.modal-body-inside .trial-form-wrapper.no-padding-top {
    padding-top: 0;
}

.cc-page-container .cc-form-wrapper .error,
.modal-body-inside .cc-form-wrapper .error,
.cc-page-container .lock-intro-wrapper .error,
.modal-body-inside .lock-intro-wrapper .error,
.cc-page-container .trial-form-wrapper .error,
.modal-body-inside .trial-form-wrapper .error,
.cc-page-container .cc-form-wrapper .client-error,
.modal-body-inside .cc-form-wrapper .client-error,
.cc-page-container .lock-intro-wrapper .client-error,
.modal-body-inside .lock-intro-wrapper .client-error,
.cc-page-container .trial-form-wrapper .client-error,
.modal-body-inside .trial-form-wrapper .client-error {
    width: 100%;
    min-height: 32px;
    color: #E91D1A;
    display: inline-block;
    font-size: 12px;
    font-weight: 300;
    padding-top: 5px;
    text-align: left;
}

.cc-page-container .cc-form-wrapper .extra-space,
.modal-body-inside .cc-form-wrapper .extra-space,
.cc-page-container .lock-intro-wrapper .extra-space,
.modal-body-inside .lock-intro-wrapper .extra-space,
.cc-page-container .trial-form-wrapper .extra-space,
.modal-body-inside .trial-form-wrapper .extra-space {
    width: 100%;
    min-height: 32px;
    display: inline-block;
}

.cc-page-container .cc-form-wrapper input:-webkit-autofill,
.modal-body-inside .cc-form-wrapper input:-webkit-autofill,
.cc-page-container .lock-intro-wrapper input:-webkit-autofill,
.modal-body-inside .lock-intro-wrapper input:-webkit-autofill,
.cc-page-container .trial-form-wrapper input:-webkit-autofill,
.modal-body-inside .trial-form-wrapper input:-webkit-autofill,
.cc-page-container .cc-form-wrapper input:-webkit-autofill:hover,
.modal-body-inside .cc-form-wrapper input:-webkit-autofill:hover,
.cc-page-container .lock-intro-wrapper input:-webkit-autofill:hover,
.modal-body-inside .lock-intro-wrapper input:-webkit-autofill:hover,
.cc-page-container .trial-form-wrapper input:-webkit-autofill:hover,
.modal-body-inside .trial-form-wrapper input:-webkit-autofill:hover,
.cc-page-container .cc-form-wrapper input:-webkit-autofill:focus,
.modal-body-inside .cc-form-wrapper input:-webkit-autofill:focus,
.cc-page-container .lock-intro-wrapper input:-webkit-autofill:focus,
.modal-body-inside .lock-intro-wrapper input:-webkit-autofill:focus,
.cc-page-container .trial-form-wrapper input:-webkit-autofill:focus,
.modal-body-inside .trial-form-wrapper input:-webkit-autofill:focus,
.cc-page-container .cc-form-wrapper textarea:-webkit-autofill,
.modal-body-inside .cc-form-wrapper textarea:-webkit-autofill,
.cc-page-container .lock-intro-wrapper textarea:-webkit-autofill,
.modal-body-inside .lock-intro-wrapper textarea:-webkit-autofill,
.cc-page-container .trial-form-wrapper textarea:-webkit-autofill,
.modal-body-inside .trial-form-wrapper textarea:-webkit-autofill,
.cc-page-container .cc-form-wrapper textarea:-webkit-autofill:hover,
.modal-body-inside .cc-form-wrapper textarea:-webkit-autofill:hover,
.cc-page-container .lock-intro-wrapper textarea:-webkit-autofill:hover,
.modal-body-inside .lock-intro-wrapper textarea:-webkit-autofill:hover,
.cc-page-container .trial-form-wrapper textarea:-webkit-autofill:hover,
.modal-body-inside .trial-form-wrapper textarea:-webkit-autofill:hover,
.cc-page-container .cc-form-wrapper textarea:-webkit-autofill:focus,
.modal-body-inside .cc-form-wrapper textarea:-webkit-autofill:focus,
.cc-page-container .lock-intro-wrapper textarea:-webkit-autofill:focus,
.modal-body-inside .lock-intro-wrapper textarea:-webkit-autofill:focus,
.cc-page-container .trial-form-wrapper textarea:-webkit-autofill:focus,
.modal-body-inside .trial-form-wrapper textarea:-webkit-autofill:focus,
.cc-page-container .cc-form-wrapper select:-webkit-autofill,
.modal-body-inside .cc-form-wrapper select:-webkit-autofill,
.cc-page-container .lock-intro-wrapper select:-webkit-autofill,
.modal-body-inside .lock-intro-wrapper select:-webkit-autofill,
.cc-page-container .trial-form-wrapper select:-webkit-autofill,
.modal-body-inside .trial-form-wrapper select:-webkit-autofill,
.cc-page-container .cc-form-wrapper select:-webkit-autofill:hover,
.modal-body-inside .cc-form-wrapper select:-webkit-autofill:hover,
.cc-page-container .lock-intro-wrapper select:-webkit-autofill:hover,
.modal-body-inside .lock-intro-wrapper select:-webkit-autofill:hover,
.cc-page-container .trial-form-wrapper select:-webkit-autofill:hover,
.modal-body-inside .trial-form-wrapper select:-webkit-autofill:hover,
.cc-page-container .cc-form-wrapper select:-webkit-autofill:focus,
.modal-body-inside .cc-form-wrapper select:-webkit-autofill:focus,
.cc-page-container .lock-intro-wrapper select:-webkit-autofill:focus,
.modal-body-inside .lock-intro-wrapper select:-webkit-autofill:focus,
.cc-page-container .trial-form-wrapper select:-webkit-autofill:focus,
.modal-body-inside .trial-form-wrapper select:-webkit-autofill:focus {
    border: none !important;
    color: #545E6B !important;
    -webkit-box-shadow: none !important;
    transition: none !important;
}

.cc-page-container .cc-form-wrapper h5,
.modal-body-inside .cc-form-wrapper h5,
.cc-page-container .lock-intro-wrapper h5,
.modal-body-inside .lock-intro-wrapper h5,
.cc-page-container .trial-form-wrapper h5,
.modal-body-inside .trial-form-wrapper h5 {
    color: #1B3380;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px 0;
    padding: 0;
    text-align: left;
}

@media only screen and (min-width: 768px) {
    .cc-page-container .cc-form-wrapper h5,
    .modal-body-inside .cc-form-wrapper h5,
    .cc-page-container .lock-intro-wrapper h5,
    .modal-body-inside .lock-intro-wrapper h5,
    .cc-page-container .trial-form-wrapper h5,
    .modal-body-inside .trial-form-wrapper h5 {
        padding: 0 24px 0 40px;
    }
}

.cc-page-container .lock-intro-wrapper .intro-content,
.modal-body-inside .lock-intro-wrapper .intro-content {
    min-height: 52px;
    max-height: 235px;
    color: #545E6B;
    font-size: 14px;
    font-weight: 300;
    line-height: 21px;
    margin-bottom: 24px;
    padding: 0;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .lock-intro-wrapper .intro-content,
    .modal-body-inside .lock-intro-wrapper .intro-content {
        padding: 0 24px 0 40px;
    }
}

.cc-page-container .lock-intro-wrapper .intro-image,
.modal-body-inside .lock-intro-wrapper .intro-image {
    padding: 0;
    margin-top: auto;
}

.cc-page-container .lock-intro-wrapper .intro-image img,
.modal-body-inside .lock-intro-wrapper .intro-image img {
    height: auto;
    max-height: 196px;
    max-width: 100%;
    display: block;
    margin: 0 auto;
}

.cc-page-container .lock-intro-wrapper .learn-more-link,
.modal-body-inside .lock-intro-wrapper .learn-more-link {
    bottom: 24px;
    color: #1B87E6;
    display: inline-block;
    left: 24px;
    line-height: 24px;
    position: absolute;
}

.cc-page-container .lock-intro-wrapper .learn-more-link .material-icons,
.modal-body-inside .lock-intro-wrapper .learn-more-link .material-icons {
    font-size: 18px;
    vertical-align: middle;
}

.cc-page-container .lock-intro-wrapper .learn-more-link a,
.modal-body-inside .lock-intro-wrapper .learn-more-link a {
    color: #1B87E6;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    vertical-align: middle;
}

.cc-page-container .lock-intro-wrapper .learn-more-link a:hover,
.modal-body-inside .lock-intro-wrapper .learn-more-link a:hover {
    color: #1B87E6;
    cursor: pointer;
    text-decoration: underline !important;
}

.cc-page-container .cc-form-wrapper.cc-card-exists,
.modal-body-inside .cc-form-wrapper.cc-card-exists {
    min-height: auto;
    padding: 16px 32px 32px 32px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper.cc-card-exists,
    .modal-body-inside .cc-form-wrapper.cc-card-exists {
        min-height: 596px;
    }
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs {
    margin-bottom: 16px;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li {
    line-height: 33px;
    margin-right: 8px;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a {
    border: none;
    border-radius: 0;
    color: #9B9B9B;
    font-size: 14px;
    line-height: 32px;
    padding: 0 8px;
    position: relative;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a:hover,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a:hover {
    background: transparent;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a:after,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li a:after {
    width: 0;
    height: 2px;
    background-color: transparent;
    bottom: 0;
    content: '';
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;
    z-index: 0;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li.active a,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li.active a {
    background: none;
    color: #545E6B;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .nav.nav-tabs li.active a:after,
.modal-body-inside .cc-form-wrapper.cc-card-exists .nav.nav-tabs li.active a:after {
    width: 100%;
    background-color: #1B87E6;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .tab-content .panel .panel__content .braintree-cc-name-wrapper .extra-space,
.modal-body-inside .cc-form-wrapper.cc-card-exists .tab-content .panel .panel__content .braintree-cc-name-wrapper .extra-space {
    min-height: 32px;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .tab-content .panel .qp-fields-wrapper,
.modal-body-inside .cc-form-wrapper.cc-card-exists .tab-content .panel .qp-fields-wrapper {
    margin-bottom: 16px;
}

.cc-page-container .cc-form-wrapper.cc-card-exists .tab-content .existing-cc,
.modal-body-inside .cc-form-wrapper.cc-card-exists .tab-content .existing-cc {
    margin-top: 0;
}

.cc-page-container .cc-form-wrapper .nav.nav-tabs,
.modal-body-inside .cc-form-wrapper .nav.nav-tabs,
.cc-page-container .cc-form-wrapper .tab-content,
.modal-body-inside .cc-form-wrapper .tab-content,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper {
    width: 100%;
    display: block;
    margin: 0 auto;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .nav.nav-tabs,
    .modal-body-inside .cc-form-wrapper .nav.nav-tabs,
    .cc-page-container .cc-form-wrapper .tab-content,
    .modal-body-inside .cc-form-wrapper .tab-content,
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper {
        width: 464px;
    }
}

.cc-page-container .cc-form-wrapper .existing-cc,
.modal-body-inside .cc-form-wrapper .existing-cc {
    height: 80px;
    background: #F5F5F5;
    border-style: solid;
    border-radius: 4px;
    border-width: 1px 1px 1px 4px;
    border-color: #1B87E6;
    display: flex;
    margin-top: 28px;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-type,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-type {
    width: 76px;
    height: 78px;
    align-items: center;
    background: white;
    display: flex;
    justify-content: center;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-type ul li,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-type ul li {
    display: none;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-type ul li img,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-type ul li img {
    width: 100%;
    height: auto;
    max-width: 90%;
    margin-left: 5%;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-type ul li.active,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-type ul li.active {
    display: inline-block;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-name-number-wrapper,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-name-number-wrapper {
    display: flex;
    flex-direction: column;
    padding: 12px 0 12px 32px;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number {
    color: #545E6B;
    font-size: 0;
    line-height: 32px;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number > span,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number > span {
    display: inline-block;
    font-size: 24px;
    line-height: 24px;
    margin-right: 8px;
    vertical-align: middle;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number > span:last-child,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-number > span:last-child {
    line-height: 20px;
    vertical-align: top;
}

.cc-page-container .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-name,
.modal-body-inside .cc-form-wrapper .existing-cc .cc-name-number-wrapper .cc-name {
    color: #545E6B;
    font-size: 14px;
    line-height: 24px;
}

.cc-page-container .cc-form-wrapper .panel-footer-wrapper,
.modal-body-inside .cc-form-wrapper .panel-footer-wrapper {
    margin-top: 20px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .panel-footer-wrapper,
    .modal-body-inside .cc-form-wrapper .panel-footer-wrapper {
        margin-top: 332px;
    }
}

.cc-page-container .cc-form-wrapper .panel-footer-wrapper .tos-pp-note,
.modal-body-inside .cc-form-wrapper .panel-footer-wrapper .tos-pp-note {
    border-bottom: 1px solid #ddd;
    font-weight: 400;
    line-height: 14px;
    padding-bottom: 8px;
    text-align: center;
}

.cc-page-container .cc-form-wrapper .panel-footer-wrapper .tos-pp-note a,
.modal-body-inside .cc-form-wrapper .panel-footer-wrapper .tos-pp-note a {
    color: #1B87E6;
    text-decoration: underline !important;
}

.cc-page-container .cc-form-wrapper .panel-footer-wrapper .tos-pp-note a:hover,
.modal-body-inside .cc-form-wrapper .panel-footer-wrapper .tos-pp-note a:hover {
    cursor: pointer;
    text-decoration: none !important;
}

.cc-page-container .cc-form-wrapper .panel-footer-wrapper .tos-pp-note span,
.modal-body-inside .cc-form-wrapper .panel-footer-wrapper .tos-pp-note span {
    font-weight: 500;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .admin-card.admin-tag ~ .panel-footer-wrapper,
    .modal-body-inside .cc-form-wrapper .admin-card.admin-tag ~ .panel-footer-wrapper {
        margin-top: 283px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper {
    position: relative;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper {
    width: 120px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper .currency-sym,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper .currency-sym {
    width: 32px;
    left: 0;
    line-height: 18px;
    position: absolute;
    text-align: center;
    top: 7px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper .custom-form-input,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .add-credit-wrapper .custom-form-group.has-icon .this-wrapper .custom-form-input {
    padding-left: 32px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input::-webkit-input-placeholder,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input::-webkit-input-placeholder {
    color: #9B9B9B !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input:-moz-placeholder,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input:-moz-placeholder {
    color: #9B9B9B !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input::-moz-placeholder,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input::-moz-placeholder {
    color: #9B9B9B !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input:-ms-input-placeholder,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .custom-form-input:-ms-input-placeholder {
    color: #9B9B9B !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper {
    position: relative;
    z-index: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper:after,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper:after {
    width: 100%;
    height: 1px;
    background-color: #dddddd;
    bottom: 0;
    content: '';
    left: 0;
    position: absolute;
    z-index: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper .line-flow,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .this-wrapper .line-flow {
    z-index: 1;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .custom-form-input,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input .custom-form-input {
    border: none;
    color: #545E6B;
    font-size: 12px;
    font-weight: 400;
    line-height: 24px;
    outline: none;
    padding: 4px 10px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.no-error .custom-form-input,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.no-error .custom-form-input {
    padding: 4px 10px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .this-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .this-wrapper {
    border-bottom: none;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .custom-form-input,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .custom-form-input {
    border-bottom: none;
    color: #E91D1A;
    padding: 4px 10px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .custom-form-input ~ .line-flow,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error .custom-form-input ~ .line-flow {
    width: 100%;
    background: #E91D1A;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error.card-field .custom-form-input,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-input.has-error.card-field .custom-form-input {
    padding: 4px 10px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label {
    font-size: 12px;
    font-weight: 400;
    margin: 3px 0;
    white-space: nowrap;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label span,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label span {
    color: #909090;
    display: inline-block;
    font-size: 12px;
    margin-left: 5px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label .add-info,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label .add-info {
    color: #707070;
    font-size: 14px;
    float: right;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label .add-info .material-icons,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .qp-control-label .add-info .material-icons {
    display: inline-block;
    font-size: 14px;
    margin-right: 2px;
    color: #707070;
    vertical-align: text-top;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage {
    margin: 0 auto;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text {
    padding: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text .error,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text .error {
    min-height: auto;
    padding: 14px 0 14px 10px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text .error a:hover,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group .captcha-error.SAMessage .alert-text .error a:hover {
    cursor: pointer;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-toggle,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-toggle {
    margin-bottom: 20px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-toggle .label-name,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-toggle .label-name {
    color: #545E6B;
    font-size: 14px;
    font-weight: 400;
    margin-left: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .this-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .this-wrapper,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .custom-form-select,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .custom-form-select,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .qp-control-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .qp-control-label,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .error,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .custom-form-group.has-anim .error {
    -webkit-animation: shake 0.3s ease-in-out;
    -moz-animation: shake 0.3s ease-in-out;
    -o-animation: shake 0.3s ease-in-out;
    animation: shake 0.3s ease-in-out;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel {
    width: 100%;
    border: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-bottom: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__header,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__header {
    display: none;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content {
    padding: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper {
    width: 100%;
    display: block;
    font-size: 0;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper,
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper {
        display: flex;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label {
    vertical-align: top;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.card-number,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.card-number {
    width: 100%;
    margin-right: 0;
    position: relative;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.card-number,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.card-number {
        width: 240px;
        margin-right: 16px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.expiry-dt,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.expiry-dt {
    width: 88px;
    margin-right: 16px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.security-code,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label.security-code {
    width: 104px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon {
    display: inline-block;
    position: absolute;
    right: 6px;
    top: 26px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li {
    display: none;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li.active,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li.active {
    display: inline-block;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li img,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-number-wrapper .textfield--float-label .card-icon ul li img {
    width: 100%;
    height: 100%;
    max-width: 42px;
    max-height: 26px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.cardholder-name,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.cardholder-name {
    width: 100%;
    margin-right: 0;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.cardholder-name,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.cardholder-name {
        width: 304px;
        margin-right: 16px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.zip-code,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .textfield--float-label.zip-code {
    width: 144px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .extra-space,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .extra-space {
    min-height: 32px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry {
    width: 100%;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry {
        width: 144px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select {
    background: rgba(0, 0, 0, 0.04);
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select .dropdown-toggle,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select .dropdown-toggle {
    height: 32px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select:after,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .panel__content .braintree-cc-name-wrapper .qp-contry .custom-form-select.single-select:after {
    width: 100%;
    height: 1px;
    background: #dddddd;
    content: '';
    bottom: 0;
    left: 0;
    position: absolute;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper {
    margin-bottom: 22px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field {
    display: block;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields,
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields,
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field {
        display: flex;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group .qp-control-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group .qp-control-label,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .qp-control-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .qp-control-label,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field .custom-form-group .qp-control-label,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field .custom-form-group .qp-control-label {
    font-size: 12px;
    line-height: 16px;
    margin: 0 0 8px 0;
    padding: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group {
    width: 100%;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group:first-child,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group:first-child {
    margin-right: 0;
    margin-bottom: 10px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group {
        width: calc(50% - 8px);
    }

    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group:first-child,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group:first-child {
        margin-right: 16px;
        margin-bottom: 0;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group .qp-control-label .material-icons,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .address-fields .custom-form-group .qp-control-label .material-icons {
    width: 16px;
    height: 16px;
    color: #545e6b;
    display: inline-block;
    font-size: 16px;
    margin-left: 0;
    margin-right: 8px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields {
    align-items: flex-start;
    margin-bottom: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .state-city-fields,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .state-city-fields {
    display: flex;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group {
        width: 172px;
        margin-bottom: 0;
        margin-right: 16px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select {
    background: rgba(0, 0, 0, 0.04);
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select .dropdown-toggle,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select .dropdown-toggle {
    height: 31px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select:after,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .custom-form-group .custom-form-select.single-select:after {
    width: 100%;
    height: 1px;
    background: #dddddd;
    content: '';
    bottom: 0;
    left: 0;
    position: absolute;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .postal-code,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .postal-code,
.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .zip-code,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .zip-code {
    width: 50%;
    margin-right: 0;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .postal-code,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .postal-code,
    .cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .zip-code,
    .modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .locality-fields .zip-code {
        width: 90px;
    }
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .qp-fields-wrapper .company-field {
    flex-direction: column;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .admin-card,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .admin-card {
    margin-bottom: 15px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .admin-card.admin-tag,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .admin-card.admin-tag {
    padding: 5px;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .admin-card.admin-tag .has-toggle,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .admin-card.admin-tag .has-toggle {
    margin-bottom: 0;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note {
    border-bottom: 1px solid #ddd;
    font-weight: 400;
    line-height: 14px;
    padding-bottom: 8px;
    text-align: center;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note a,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note a {
    color: #1B87E6;
    text-decoration: underline !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note a:hover,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note a:hover {
    cursor: pointer;
    text-decoration: none !important;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note span,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper .panel .tos-pp-note span {
    font-weight: 500;
}

.cc-page-container .cc-form-wrapper .cardform-group-wrapper ~ .existing-cc,
.modal-body-inside .cc-form-wrapper .cardform-group-wrapper ~ .existing-cc {
    margin-top: 12px;
}

.cc-page-container .cc-form-wrapper .page-info,
.modal-body-inside .cc-form-wrapper .page-info {
    line-height: 32px;
    margin: 27px 0 8px 0;
}

.cc-page-container .cc-form-wrapper .page-info span,
.modal-body-inside .cc-form-wrapper .page-info span {
    font-weight: 500;
}

.cc-page-container .cc-form-wrapper .page-info a,
.modal-body-inside .cc-form-wrapper .page-info a {
    color: #1B87E6;
    text-decoration: underline !important;
}

.cc-page-container .cc-form-wrapper .page-info a:hover,
.modal-body-inside .cc-form-wrapper .page-info a:hover {
    cursor: pointer;
    text-decoration: none !important;
}

.cc-page-container .cc-form-wrapper .qp-btn-group,
.modal-body-inside .cc-form-wrapper .qp-btn-group {
    width: 100%;
}

.cc-page-container .cc-form-wrapper .qp-btn-group .invoice-download-btn,
.modal-body-inside .cc-form-wrapper .qp-btn-group .invoice-download-btn {
    font-size: 14px;
    font-weight: 300;
    padding-bottom: 10px;
}

.cc-page-container .cc-form-wrapper .qp-btn-group .pay-btn,
.modal-body-inside .cc-form-wrapper .qp-btn-group .pay-btn {
    width: 100%;
    background: #F5A623;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    margin: 0 auto;
    padding: 4px;
    text-transform: none;
    text-align: center;
}

.cc-page-container .cc-form-wrapper .qp-btn-group .pay-btn:hover,
.modal-body-inside .cc-form-wrapper .qp-btn-group .pay-btn:hover {
    background: #FFC057;
    color: #ffffff;
    cursor: pointer;
}

.cc-page-container .cc-form-wrapper .qp-btn-group .pay-btn.inactive-btn,
.modal-body-inside .cc-form-wrapper .qp-btn-group .pay-btn.inactive-btn {
    background: #dddddd;
    color: #ffffff;
    cursor: default;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper {
    width: 100%;
    display: block;
    margin: 0 auto;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .trial-form-wrapper .trial-content-wrapper,
    .modal-body-inside .trial-form-wrapper .trial-content-wrapper {
        width: 400px;
    }
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper h5,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper h5 {
    width: 100%;
    color: #1B3380;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px 0;
    padding: 0;
    position: relative;
    text-align: left;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .trial-form-wrapper .trial-content-wrapper h5,
    .modal-body-inside .trial-form-wrapper .trial-content-wrapper h5 {
        font-size: 24px;
        margin: 0 0 32px 0;
    }
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .trial-ul,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .trial-ul {
    width: 100%;
    margin: 0 0 114px 0;
    padding-left: 12px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .trial-ul li,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .trial-ul li {
    color: #545E6B;
    font-size: 14px;
    font-weight: 300;
    line-height: 24px;
    position: relative;
    text-align: left;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .trial-ul li span,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .trial-ul li span {
    font-weight: 500;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .trial-ul li:before,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .trial-ul li:before {
    content: '\f111';
    color: #545E6B;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 5px;
    left: -12px;
    line-height: 18px;
    position: absolute;
    top: 4px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .error,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .error {
    width: 100%;
    min-height: 40px;
    color: #E91D1A;
    display: none;
    font-size: 12px;
    font-weight: 300;
    text-align: left;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .extra-space,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .extra-space {
    width: 100%;
    min-height: 40px;
    display: inline-block;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .has-error .error,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .has-error .error {
    display: inline-block;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .has-error .extra-space,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .has-error .extra-space {
    display: none;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-control-label,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-control-label {
    font-size: 14px;
    font-weight: 400;
    margin: 3px 0;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-control-label span,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-control-label span {
    color: #909090;
    display: inline-block;
    font-size: 14px;
    margin-left: 5px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-control-label .add-info,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-control-label .add-info {
    color: #707070;
    font-size: 14px;
    float: right;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-control-label .add-info .material-icons,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-control-label .add-info .material-icons {
    display: inline-block;
    font-size: 14px;
    margin-right: 2px;
    color: #707070;
    vertical-align: text-top;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .custom-form-input::-webkit-input-placeholder,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .custom-form-input::-webkit-input-placeholder {
    color: #dddddd !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 28px !important;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .custom-form-input:-moz-placeholder,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .custom-form-input:-moz-placeholder {
    color: #dddddd !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 28px !important;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .custom-form-input::-moz-placeholder,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .custom-form-input::-moz-placeholder {
    color: #dddddd !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 28px !important;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .custom-form-input:-ms-input-placeholder,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .custom-form-input:-ms-input-placeholder {
    color: #dddddd !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 28px !important;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .custom-form-input,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .custom-form-input {
    border: none;
    color: #505F82;
    font-size: 16px;
    font-weight: 300;
    line-height: 28px;
    outline: none;
    padding: 6px 10px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .this-wrapper,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .this-wrapper {
    border-bottom: none;
    position: relative;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .this-wrapper:after,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .this-wrapper:after {
    width: 100%;
    height: 1px;
    background-color: #dddddd;
    bottom: 0;
    content: '';
    left: 0;
    position: absolute;
    z-index: 0;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .this-wrapper .line-flow,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .this-wrapper .line-flow {
    z-index: 1;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper {
    font-size: 0;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group {
    display: inline-block;
    vertical-align: top;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group.label-only,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group.label-only {
    width: 100%;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group [disabled],
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group [disabled] {
    cursor: default !important;
    opacity: 1;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .custom-form-input,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .custom-form-input {
    height: 40px;
    padding-left: 48px;
    padding-right: 6px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .selected-flag,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .selected-flag {
    margin: 0 auto;
    padding: 12px 22px 12px 6px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .selected-flag .down-arrow,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .selected-flag .down-arrow {
    left: 24px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list {
    top: 39px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li {
    color: #505F82;
    font-size: 16px;
    font-weight: 300;
    padding: 12px 10px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li.divider,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li.divider {
    padding: 5px 0 0 0;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li.highlight,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group .this-wrapper .intl-tel-input .flag-dropdown .country-list li.highlight {
    background: #F8F8F8;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group.has-input,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .custom-form-group.has-input {
    width: 94px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper {
    width: calc(100% - 110px);
    display: inline-block;
    font-size: 0;
    margin-left: 16px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .areacode-error-wrapper .error,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .areacode-error-wrapper .error {
    min-height: auto;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .error,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .error {
    padding-top: 5px;
    display: none;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .error,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .error {
    display: inline-block;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .error:empty,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .error:empty {
    display: none;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .extra-space,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.no-space .extra-space {
    display: none;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .ph-number,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .ph-number {
    width: 100%;
    margin-left: 0;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .area-code,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper .area-code {
    width: 65px;
    display: none;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.has-area .ph-number,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.has-area .ph-number {
    width: calc(100% - 81px);
    margin-left: 16px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.has-area .area-code,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .con-code-wrapper .phone-wrapper.has-area .area-code {
    display: inline-block;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group {
    width: 100%;
    display: inline-block;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group,
    .modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group {
        display: flex;
    }
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn,
.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn {
    box-shadow: none !important;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 14px;
    line-height: 24px;
    margin: 0 auto;
    padding: 4px;
    text-transform: none;
    text-align: center;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn {
    width: auto;
    background: #F5A623;
    color: #fff;
    font-weight: 500;
    float: left;
    margin-right: 16px;
    padding: 4px 20px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn:hover,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn:hover {
    background: #FFC057;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn,
    .modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .trial-btn {
        width: 272px;
        float: none;
        padding: 4px;
    }
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn {
    width: auto;
    background: transparent;
    border: 1px solid #979797;
    color: #9b9b9b;
    float: right;
    font-weight: 400;
    padding: 3px 15px;
}

.cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn:hover,
.modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn:hover {
    background: #eee;
    border-color: #eee;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn,
    .modal-body-inside .trial-form-wrapper .trial-content-wrapper .qp-btn-group .thanks-btn {
        width: 110px;
        float: none;
        padding: 3px;
    }
}

.cc-page-container .coloum-wrapper,
.modal-body-inside .coloum-wrapper {
    width: 100%;
    background: none;
    display: flex;
    flex-direction: column;
    padding: 16px 32px 32px 32px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .coloum-wrapper,
    .modal-body-inside .coloum-wrapper {
        width: 320px;
        background: #F8F8F8;
        padding: 32px;
    }
}

.cc-page-container .coloum-wrapper.custom-lock,
.modal-body-inside .coloum-wrapper.custom-lock {
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .coloum-wrapper.custom-lock,
    .modal-body-inside .coloum-wrapper.custom-lock {
        width: calc(100% / 3);
    }
}

.cc-page-container .coloum-wrapper.custom-lock:after,
.modal-body-inside .coloum-wrapper.custom-lock:after {
    width: 1px;
    background: #ddd;
    bottom: 32px;
    content: '';
    position: absolute;
    right: 0;
    top: 32px;
}

.cc-page-container .coloum-wrapper.custom-lock .internal-section,
.modal-body-inside .coloum-wrapper.custom-lock .internal-section {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.cc-page-container .coloum-wrapper.custom-lock .internal-section h6,
.modal-body-inside .coloum-wrapper.custom-lock .internal-section h6 {
    margin-bottom: 17px;
}

.cc-page-container .coloum-wrapper.custom-lock .internal-section .bottom-text,
.modal-body-inside .coloum-wrapper.custom-lock .internal-section .bottom-text,
.cc-page-container .coloum-wrapper.custom-lock .internal-section .help-chat-wrapper,
.modal-body-inside .coloum-wrapper.custom-lock .internal-section .help-chat-wrapper {
    margin-top: auto;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features:after,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features:after {
    content: none;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features .help-chat-wrapper,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features .help-chat-wrapper {
    margin: 16px 0 18px 0;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features h5,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features h5 {
    margin-bottom: 8px;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features .cxbill-note,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features .cxbill-note,
.cc-page-container .coloum-wrapper.custom-lock.custom-features .start-at,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features .start-at {
    color: #505F82;
    font-size: 12px;
    font-weight: 300;
    line-height: 24px;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features .features-block,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features .features-block {
    margin-bottom: 4px;
    margin-top: 4px;
}

.cc-page-container .coloum-wrapper.custom-lock.custom-features .bottom-text,
.modal-body-inside .coloum-wrapper.custom-lock.custom-features .bottom-text {
    margin-top: auto;
}

.cc-page-container .internal-section,
.modal-body-inside .internal-section {
    width: 100%;
    background: #F8F8F8;
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 32px;
    position: relative;
    text-align: left;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .internal-section,
    .modal-body-inside .internal-section {
        background: none;
        padding: 0;
    }
}

.cc-page-container .internal-section h5,
.modal-body-inside .internal-section h5 {
    width: 100%;
    color: #1B3380;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 32px 0;
    padding: 0;
    position: relative;
    text-align: left;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .internal-section h5,
    .modal-body-inside .internal-section h5 {
        font-size: 24px;
        margin: 0 0 24px 0;
    }
}

.cc-page-container .internal-section .order-head,
.modal-body-inside .internal-section .order-head {
    color: #545E6B;
    font-size: 14px;
    line-height: 24px;
}

.cc-page-container .internal-section .details-wrapper,
.modal-body-inside .internal-section .details-wrapper {
    font-size: 14px;
    line-height: 21px;
}

.cc-page-container .internal-section .plan-wrapper,
.modal-body-inside .internal-section .plan-wrapper {
    position: relative;
    text-align: left;
}

.cc-page-container .internal-section .plan-wrapper .plan-head .price,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price {
    height: 40px;
    line-height: 40px;
}

.cc-page-container .internal-section .plan-wrapper .plan-head .price .doller,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price .doller,
.cc-page-container .internal-section .plan-wrapper .plan-head .price .price-amt,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price .price-amt {
    color: #1B3380;
    font-size: 24px;
    font-weight: 500;
    margin-right: 2px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .internal-section .plan-wrapper .plan-head .price .doller,
    .modal-body-inside .internal-section .plan-wrapper .plan-head .price .doller,
    .cc-page-container .internal-section .plan-wrapper .plan-head .price .price-amt,
    .modal-body-inside .internal-section .plan-wrapper .plan-head .price .price-amt {
        font-size: 32px;
        margin-right: 4px;
    }
}

.cc-page-container .internal-section .plan-wrapper .plan-head .price .unit,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price .unit,
.cc-page-container .internal-section .plan-wrapper .plan-head .price .year,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price .year {
    color: #1B3380;
    font-size: 14px;
    font-weight: 300;
    margin-right: 2px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .internal-section .plan-wrapper .plan-head .price .unit,
    .modal-body-inside .internal-section .plan-wrapper .plan-head .price .unit,
    .cc-page-container .internal-section .plan-wrapper .plan-head .price .year,
    .modal-body-inside .internal-section .plan-wrapper .plan-head .price .year {
        font-size: 16px;
        margin-right: 4px;
    }
}

.cc-page-container .internal-section .plan-wrapper .plan-head .price .unit,
.modal-body-inside .internal-section .plan-wrapper .plan-head .price .unit {
    font-weight: 500;
}

.cc-page-container .internal-section .invoice-number,
.modal-body-inside .internal-section .invoice-number {
    line-height: 16px;
}

.cc-page-container .internal-section .invoice-number a,
.modal-body-inside .internal-section .invoice-number a {
    color: #1B3380;
    font-weight: 500;
}

.cc-page-container .internal-section .invoice-number a:hover,
.modal-body-inside .internal-section .invoice-number a:hover {
    text-decoration: underline !important;
}

.cc-page-container .internal-section .fees,
.modal-body-inside .internal-section .fees {
    margin-top: 4px;
}

.cc-page-container .internal-section .fees span,
.modal-body-inside .internal-section .fees span {
    color: #1B3380;
    display: inline-block;
    font-weight: 500;
    margin-right: 3px;
}

.cc-page-container .internal-section .bill-note,
.modal-body-inside .internal-section .bill-note {
    color: #505F82;
    font-size: 12px;
    font-weight: 300;
    line-height: 24px;
    margin-bottom: 134px;
}

.cc-page-container .internal-section .features-block,
.modal-body-inside .internal-section .features-block {
    margin-top: 28px;
}

.cc-page-container .internal-section .features-block .feature-group-title,
.modal-body-inside .internal-section .features-block .feature-group-title {
    color: #505F82;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0 0 8px;
    padding: 0;
    text-align: left;
}

.cc-page-container .internal-section .features-block ul,
.modal-body-inside .internal-section .features-block ul {
    width: 100%;
    margin: 0 auto;
    padding-left: 12px;
}

.cc-page-container .internal-section .features-block ul li,
.modal-body-inside .internal-section .features-block ul li {
    color: #545E6B;
    font-size: 12px;
    font-weight: 300;
    line-height: 18px;
    padding: 0 0 6px 0;
    position: relative;
    text-align: left;
}

.cc-page-container .internal-section .features-block ul li span,
.modal-body-inside .internal-section .features-block ul li span {
    font-style: italic;
    font-weight: 300;
}

.cc-page-container .internal-section .features-block ul li a,
.modal-body-inside .internal-section .features-block ul li a {
    color: #545E6B;
    font-weight: 300;
    text-decoration: underline !important;
}

.cc-page-container .internal-section .features-block ul li a:hover,
.modal-body-inside .internal-section .features-block ul li a:hover {
    color: #1B87E6;
    text-decoration: underline !important;
}

.cc-page-container .internal-section .features-block ul li:before,
.modal-body-inside .internal-section .features-block ul li:before {
    content: '\f111';
    color: #545E6B;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 5px;
    left: -12px;
    line-height: 18px;
    position: absolute;
    top: 1px;
}

.cc-page-container .internal-section .help-chat-wrapper,
.modal-body-inside .internal-section .help-chat-wrapper {
    width: auto;
    display: inline-block;
    margin: 34px 0 18px 0;
    margin-top: auto;
}

.cc-page-container .internal-section .help-chat-wrapper .has-trial,
.modal-body-inside .internal-section .help-chat-wrapper .has-trial {
    margin-bottom: 0;
}

.cc-page-container .internal-section .help-chat-wrapper span,
.modal-body-inside .internal-section .help-chat-wrapper span {
    color: #545E6B;
    display: block;
    font-weight: 400;
    line-height: 24px;
}

.cc-page-container .internal-section .help-chat-wrapper .chat-link,
.modal-body-inside .internal-section .help-chat-wrapper .chat-link {
    display: block;
    line-height: 20px;
}

.cc-page-container .internal-section .help-chat-wrapper .chat-link span,
.modal-body-inside .internal-section .help-chat-wrapper .chat-link span {
    display: inline-block;
    color: #1B87E6;
    font-weight: 500;
    vertical-align: middle;
}

.cc-page-container .internal-section .help-chat-wrapper .chat-link i,
.modal-body-inside .internal-section .help-chat-wrapper .chat-link i {
    color: #545E6B;
    font-size: 20px;
    margin-right: 5px;
    vertical-align: middle;
}

.cc-page-container .internal-section .help-chat-wrapper .chat-link:hover span,
.modal-body-inside .internal-section .help-chat-wrapper .chat-link:hover span {
    text-decoration: underline;
}

.cc-page-container .internal-section .help-chat-wrapper .chat-link:hover i,
.modal-body-inside .internal-section .help-chat-wrapper .chat-link:hover i {
    color: #1B87E6;
    font-size: 20px;
    margin-right: 5px;
}

.cc-page-container .internal-section .address-wrapper,
.modal-body-inside .internal-section .address-wrapper {
    margin-top: 24px;
}

.cc-page-container .internal-section .address-wrapper.has-geo-number,
.modal-body-inside .internal-section .address-wrapper.has-geo-number {
    margin-top: 0;
}

.cc-page-container .internal-section .address-wrapper span,
.modal-body-inside .internal-section .address-wrapper span {
    width: 100%;
    color: #545E6B;
    display: inline-block;
    line-height: 24px;
    font-weight: 300;
}

.cc-page-container .internal-section .address-wrapper span.support,
.modal-body-inside .internal-section .address-wrapper span.support {
    font-weight: 300;
}

.cc-page-container .internal-section .seal-images,
.modal-body-inside .internal-section .seal-images {
    font-size: 0;
    margin-top: 20px;
    text-align: left;
}

@media only screen and (min-width: 768px) {
    .cc-page-container .internal-section .seal-images,
    .modal-body-inside .internal-section .seal-images {
        text-align: center;
    }
}

.cc-page-container .internal-section .seal-images .bbb-seal,
.modal-body-inside .internal-section .seal-images .bbb-seal {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

.cc-page-container .internal-section .seal-images .godaddy-seal,
.modal-body-inside .internal-section .seal-images .godaddy-seal {
    display: inline-block;
    vertical-align: middle;
}

.cc-page-container .internal-section .bottom-text,
.modal-body-inside .internal-section .bottom-text {
    text-align: center;
    line-height: 24px;
}

.cc-page-container .internal-section .bottom-text .try-link,
.modal-body-inside .internal-section .bottom-text .try-link {
    color: #1B87E6;
    font-weight: 500;
}

.cc-page-container .internal-section .bottom-text .try-link:hover,
.modal-body-inside .internal-section .bottom-text .try-link:hover {
    text-decoration: underline !important;
}

.cc-page-container .internal-section .bottom-text span,
.modal-body-inside .internal-section .bottom-text span {
    color: #545E6B;
    font-weight: 300;
}

.cc-page-container .internal-section .upgrade-btn,
.modal-body-inside .internal-section .upgrade-btn,
.cc-page-container .internal-section .contact-btn,
.modal-body-inside .internal-section .contact-btn {
    width: 100%;
    background-color: #F5A623;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    margin: 8px auto 0 auto;
    padding: 4px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
}

.cc-page-container .internal-section .upgrade-btn:focus,
.modal-body-inside .internal-section .upgrade-btn:focus,
.cc-page-container .internal-section .contact-btn:focus,
.modal-body-inside .internal-section .contact-btn:focus {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0;
}

.cc-page-container .internal-section .upgrade-btn:hover,
.modal-body-inside .internal-section .upgrade-btn:hover,
.cc-page-container .internal-section .contact-btn:hover,
.modal-body-inside .internal-section .contact-btn:hover {
    background: #FFC057;
}

.cc-page-container .internal-section .lets-talk-btn,
.modal-body-inside .internal-section .lets-talk-btn {
    width: 100%;
    background-color: #1B87E6;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    margin: 24px auto 0 auto;
    padding: 4px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
}

.cc-page-container .internal-section .lets-talk-btn:focus,
.modal-body-inside .internal-section .lets-talk-btn:focus {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0;
}

.cc-page-container .internal-section .lets-talk-btn:hover,
.modal-body-inside .internal-section .lets-talk-btn:hover {
    background-color: #22b6ff;
    cursor: pointer;
}

.cc-page-container .internal-section h4,
.modal-body-inside .internal-section h4,
.cc-page-container .internal-section .sub-acc-wrapper,
.modal-body-inside .internal-section .sub-acc-wrapper {
    display: none;
}

.cc-page-container .internal-section.has-sub-account h5,
.modal-body-inside .internal-section.has-sub-account h5 {
    display: inline-block;
}

.cc-page-container .internal-section.has-sub-account h5.sub-head,
.modal-body-inside .internal-section.has-sub-account h5.sub-head {
    font-size: 22px;
}

.cc-page-container .internal-section.has-sub-account h4,
.modal-body-inside .internal-section.has-sub-account h4 {
    width: 100%;
    color: #1B3380;
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin: 0 0 16px 0;
    padding: 0;
    position: relative;
    text-align: left;
}

@media only screen and (min-width: 768px) {
    .cc-page-container .internal-section.has-sub-account h4,
    .modal-body-inside .internal-section.has-sub-account h4 {
        font-size: 18px;
        margin: 0 0 32px 0;
    }
}

.cc-page-container .internal-section.has-sub-account .bill-note,
.modal-body-inside .internal-section.has-sub-account .bill-note {
    margin-bottom: 10px;
}

.cc-page-container .internal-section.has-sub-account .sub-acc-wrapper,
.modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper {
    display: block;
    margin-bottom: 20px;
}

@media only screen and (min-width: 1024px) {
    .cc-page-container .internal-section.has-sub-account .sub-acc-wrapper,
    .modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper {
        margin-bottom: 20px;
    }
}

.cc-page-container .internal-section.has-sub-account .sub-acc-wrapper > div,
.modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper > div {
    display: flex;
}

.cc-page-container .internal-section.has-sub-account .sub-acc-wrapper > div:first-child,
.modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper > div:first-child {
    margin-bottom: 5px;
}

.cc-page-container .internal-section.has-sub-account .sub-acc-wrapper > div span,
.modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper > div span {
    color: #1B3380;
    font-weight: 400;
}

.cc-page-container .internal-section.has-sub-account .sub-acc-wrapper > div span:first-child,
.modal-body-inside .internal-section.has-sub-account .sub-acc-wrapper > div span:first-child {
    display: flex;
    flex: 1;
}

.cc-page-container .congrats-screen,
.modal-body-inside .congrats-screen,
.cc-page-container .congrats-screen-trial,
.modal-body-inside .congrats-screen-trial {
    width: 464px;
    margin: 0 auto;
    padding: 32px 0 24px 0;
    text-align: center;
}

.cc-page-container .congrats-screen h5,
.modal-body-inside .congrats-screen h5,
.cc-page-container .congrats-screen-trial h5,
.modal-body-inside .congrats-screen-trial h5 {
    color: #1B3380;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    margin: 0 0 80px 0;
    padding: 0;
    text-align: left;
}

.cc-page-container .congrats-screen img,
.modal-body-inside .congrats-screen img,
.cc-page-container .congrats-screen-trial img,
.modal-body-inside .congrats-screen-trial img {
    width: auto;
    max-width: 100%;
    margin-bottom: 80px;
}

.cc-page-container .congrats-screen .success-msg,
.modal-body-inside .congrats-screen .success-msg,
.cc-page-container .congrats-screen-trial .success-msg,
.modal-body-inside .congrats-screen-trial .success-msg {
    color: #1B3380;
    font-size: 24px;
    font-weight: 300;
    line-height: 32px;
    margin-bottom: 8px;
    text-align: left;
}

.cc-page-container .congrats-screen .success-msg span,
.modal-body-inside .congrats-screen .success-msg span,
.cc-page-container .congrats-screen-trial .success-msg span,
.modal-body-inside .congrats-screen-trial .success-msg span {
    font-weight: 500;
}

.cc-page-container .congrats-screen p,
.modal-body-inside .congrats-screen p,
.cc-page-container .congrats-screen-trial p,
.modal-body-inside .congrats-screen-trial p {
    font-size: 14px;
    font-weight: 300;
    line-height: 21px;
    margin-bottom: 44px;
    text-align: left;
}

.cc-page-container .congrats-screen .continue-btn,
.modal-body-inside .congrats-screen .continue-btn,
.cc-page-container .congrats-screen-trial .continue-btn,
.modal-body-inside .congrats-screen-trial .continue-btn {
    width: 100%;
    background-color: #1B87E6;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 auto;
    padding: 4px;
    text-align: center;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
}

.cc-page-container .congrats-screen .continue-btn:focus,
.modal-body-inside .congrats-screen .continue-btn:focus,
.cc-page-container .congrats-screen-trial .continue-btn:focus,
.modal-body-inside .congrats-screen-trial .continue-btn:focus {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0;
}

.cc-page-container .congrats-screen .continue-btn:hover,
.modal-body-inside .congrats-screen .continue-btn:hover,
.cc-page-container .congrats-screen-trial .continue-btn:hover,
.modal-body-inside .congrats-screen-trial .continue-btn:hover {
    background-color: #22b6ff;
    cursor: pointer;
}

.cc-page-container .congrats-screen-trial p,
.modal-body-inside .congrats-screen-trial p {
    margin-bottom: 57px;
}

.cc-page-container .congrats-screen-trial img,
.modal-body-inside .congrats-screen-trial img {
    margin-bottom: 56px;
}

.bank-error {
    width: 100%;
    display: flex;
    font-size: 12px;
    justify-content: center;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    top: 41px;
    z-index: 1;
}

.bank-error-default-header .bank-error {
    top: 79px;
}

.bank-error .error-message {
    background: #FFBABA;
    -webkit-border-radius: 0px 0px 4px 4px;
    -moz-border-radius: 0px 0px 4px 4px;
    border-radius: 0px 0px 4px 4px;
    display: flex;
    line-height: 16px;
    padding: 12px 16px;
}

.bank-error .error-message span {
    color: #E91D1A;
    display: inline-block;
    vertical-align: middle;
}

.bank-error .error-message span.material-icons {
    width: 16px;
    height: 16px;
    font-size: 16px;
    margin-right: 6px;
}

.bank-error .error-message span.material-icons:hover {
    cursor: pointer;
}

/*--------------------
SHARED VARIABLES
--------------------*/
/*--------------------
GENERAL
--------------------*/
*,
*:before,
*:after {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
    height: 100%;
}

#cardForm {
    height: 100%;
    display: flex;
    flex-flow: column;
    justify-content: center;
    margin: 0;
}

@media only screen and (min-width: 1024px) {
    #cardForm {
        margin: 0 2em;
    }
}

.tab-pane #cardForm {
    margin: 0 auto;
}

/*--------------------
PANEL FORM
--------------------*/
.panel__footer {
    width: 100%;
    display: block;
    margin: 16px auto auto auto;
}

@media only screen and (min-width: 1024px) {
    .panel__footer {
        width: 464px;
    }
}

.panel__footer .pay-button,
.panel__footer .confirm-button {
    width: 100%;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    margin: 0 auto;
    outline: none;
    padding: 4px;
    text-transform: none;
    text-align: center;
}

.panel__footer .pay-button.inactive-btn,
.panel__footer .confirm-button.inactive-btn {
    background: #dddddd;
    color: #ffffff;
    cursor: default;
}

.panel__footer .pay-button {
    background: #F5A623;
}

.panel__footer .pay-button:hover {
    background: #FFC057;
    color: #ffffff;
    cursor: pointer;
}

.panel__footer .confirm-button {
    background: #1b87e6;
}

.panel__footer .confirm-button:hover {
    background: #22b6ff;
    color: #ffffff;
    cursor: pointer;
}

.textfield--float-label {
    display: inline-block;
    font-size: 0;
}

.textfield--float-label .hosted-field--label {
    font-size: 0;
    line-height: 16px;
    margin: 0 0 8px 0;
    white-space: nowrap;
}

.textfield--float-label .hosted-field--label span {
    color: #545E6B;
    font-size: 12px;
    font-weight: 400;
    vertical-align: middle;
}

.textfield--float-label .hosted-field--label span.material-icons {
    font-size: 16px;
    margin-right: 8px;
}

.hosted-field--label.label-float,
.hosted-field--label.filled,
.hosted-field--label.invalid {
    text-overflow: ellipsis;
    color: #2196F3;
    transition: all 0.15s ease-out;
}

.hosted-field--label.filled {
    color: rgba(0, 0, 0, 0.54);
}

.hosted-field--label.invalid {
    color: #F44336;
}

.hosted-field--label a {
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
}

.hosted-field--label a .material-icons {
    font-size: 16px;
}

.hosted-field {
    width: 100%;
    height: 32px;
    background: rgba(0, 0, 0, 0.04);
    border-bottom: 1px solid #dddddd;
    border-radius: 0;
    box-shadow: none;
    color: #545E6B;
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 28px;
    outline: none;
    position: relative;
}

.hosted-field:after {
    width: 0;
    height: 2px;
    background-color: #dddddd;
    bottom: 0;
    content: '';
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;
    z-index: 0;
}

/*--------------------
BT HOSTED FIELDS SPECIFIC
--------------------*/
.braintree-hosted-fields-focused:after {
    width: 100%;
    background-color: #1B87E6;
}

.has-error .braintree-hosted-fields-invalid,
.has-error .this-wrapper,
.has-error .cc-error-wrapper {
    background: #FFDCDC;
    color: #E91D1A;
}

.has-error .braintree-hosted-fields-invalid:after,
.has-error .this-wrapper:after,
.has-error .cc-error-wrapper:after {
    width: 100%;
    background-color: #E91D1A;
}

.has-anim .braintree-hosted-fields-invalid,
.has-anim .this-wrapper,
.has-anim .cc-error-wrapper,
.has-anim .hosted-field--label,
.has-anim .error {
    -webkit-animation: shake 0.3s ease-in-out;
    -moz-animation: shake 0.3s ease-in-out;
    -o-animation: shake 0.3s ease-in-out;
    animation: shake 0.3s ease-in-out;
}

.has-anim .card-icon {
    -webkit-animation: shake-absolute 0.3s ease-in-out;
    -moz-animation: shake-absolute 0.3s ease-in-out;
    -o-animation: shake-absolute 0.3s ease-in-out;
    animation: shake-absolute 0.3s ease-in-out;
}