.payment-page .input-container .input-large, .payment-page .input-container input {
    border-radius: 4px;
    border: 1px solid #5E5E5E;
    padding-left: 1rem;
}

.payment-page .input-container .input-large.StripeElement--focus {
    border: 2px solid #5E5E5E;
    outline: none;
    box-shadow: none;
}

.payment-page select {
    border-radius: 4px;
    border: 1px solid #5E5E5E;
    background-color: transparent;
}

.payment-page .input-container input:focus, .payment-page select:focus {
    border: 2px solid #5E5E5E;
    outline: none;
    box-shadow: none;
}

.custom-switch .custom-control-input:checked~.custom-control-label::after {
    transform: translateX(1.75rem);
}

.payment-page .custom-control-input:checked~.custom-control-label::before {
    background-color: #FF4A70;
    border-color: #FF4A70;
}

.custom-switch .custom-control-label::before {
    width: 3rem;
}

@media screen and (max-width: 1023px) {
    .payment-page {
        margin-top: 6rem;
    }
    .payment-page .title-page h1 {
        font-size: 35px;
        line-height: 30px;
        font-weight: 600;
    }
    .payment-page .subscription-name {
        font-size: 20px;
        line-height: 25px;
        text-align: left;
        color: #333333;
    }
    .payment-page .input-subscriptions {
        height: 28px;
        width: 22vw;
        text-align: center;
        color: #333333;
        font-size: 13px;
        border: none;
        border-bottom: 1px solid #333333;
        border-radius: 0;
    }
    .payment-page .input-subscriptions:focus {
        border: none;
        border-bottom: 1px solid #333333;
        border-radius: 0;
        box-shadow: none;
        outline: none;
    }
    .payment-page .subscription-number {
        color: #333333;
        font-size: 14px;
        line-height: 20px;
        text-align: left;
    }
    .payment-page .detail-subscription-container select {
        width: 36vw;
        font-size: 12px;
    }
    .amount-container-step {
        padding-left: 0;
    }
    .payment-page .subscriptions-container .amount-subscription {
        font-size: 20px;
        line-height: 25px;
    }
    .amount-container-step .discount-container {
        font-size: 11px;
        color: #333333;
    }
    .amount-container-step .amount-without-discount {
        text-decoration: line-through;
        color: #FF4A70;
    }
    .amount-container-step .amount-without-discount span {
        color: #333333;
        font-size: 22px;
    }
    .amount-container-step .total-amount {
        color: #333333;
        font-size: 25px;
        line-height: 25px;
    }
    .amount-container-step .amount-with-discount {
        color: #FF4A70;
        font-size: 25px;
        line-height: 25px;
        font-weight: 500;
    }
    .payment-page .form-container .title-section {
        font-size: 18px;
        line-height: 25px;
        font-weight: 600;
    }
    .payment-page .subtitle-section {
        font-weight: 600;
        font-size: 15px;
    }
    .payment-page label {
        color: #1A1919;
        font-weight: 500;
        font-size: 14px;
    }
    .payment-page .input-container .input-large, .payment-page .input-container input, .payment-page .input-container select {
        width: 91vw;
        height: 46px;
    }
    .payment-page .subscriptions-container button {
        font-size: 12px;
    }
    .payment-page .detail-subscription-container .select-container {
        justify-content: center;
        padding-left: 0;
    }
    .payment-page .input-container select {
        padding-left: 0.7rem;
    }
    .payment-page .switch-container label {
        padding-left: 2rem;
    }
    .payment-page .address-form-container .subtitle-form, .payment-page .email-container .subtitle-form {
        font-weight: 600;
        font-size: 14px;
    }
}

@media screen and (min-width: 1024px) {
    .payment-page {
        margin-top: 9rem;
    }
    .payment-page .page-container.container {
        max-width: 600px;
    }
    .payment-page .title-page h1 {
        font-size: 40px;
        line-height: 45px;
        font-weight: 600;
    }
    .payment-page .subscription-name {
        font-size: 22px;
        line-height: 30px;
        color: #333333;
    }
    .payment-page .input-subscriptions {
        height: 28px;
        color: #333333;
        font-size: 14px;
        line-height: 19px;
        width: 68px;
        text-align: center;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid #333333;
    }
    .payment-page .input-subscriptions:focus {
        border: none;
        border-bottom: 1px solid #333333;
        border-radius: 0;
        box-shadow: none;
        outline: none;
    }
    .payment-page .subscription-number {
        color: #333333;
        font-size: 14px;
        line-height: 19px;
    }
    .payment-page .detail-subscription-container select {
        width: 200px;
        font-size: 16px;
        font-weight: 500;
        color: #333333;
    }
    .payment-page .subscriptions-container button {
        font-size: 14px;
    }
    .payment-page .subscriptions-container .amount-subscription {
        font-size: 30px;
        line-height: 40px;
    }
    .amount-container-step .discount-container {
        font-size: 12px;
        line-height: 15px;
        color: #333333;
    }
    .amount-container-step .amount-without-discount {
        text-decoration: line-through;
        color: #FF4A70;
    }
    .amount-container-step .amount-without-discount span {
        color: #333333;
        font-size: 35px;
        line-height: 40px;
        font-weight: normal;
    }
    .amount-container-step .total-amount {
        color: #333333;
        font-size: 40px;
        line-height: 40px;
    }
    .amount-container-step .amount-with-discount {
        color: #FF4A70;
        font-size: 40px;
        line-height: 40px;
        font-weight: 500;
    }
    /* .payment-page .form-container.container {
        max-width: 500px;
    } */
    .payment-page .form-container .title-section {
        font-size: 26px;
        line-height: 36px;
        font-weight: 600;
    }
    .payment-page .subtitle-section {
        font-weight: 600;
        font-size: 18px;
    }
    .payment-page label {
        color: #1A1919;
        font-weight: 500;
        font-size: 14px;
        line-height: 18px;
    }
    .payment-page .input-container input {
        height: 46px;
        width: 164px;
        padding-left: 1rem;
    }
    .payment-page .input-container .input-large, .payment-page .input-container select {
        width: 462px;
        height: 46px;
    }
    .payment-page .input-container select {
        padding-left: 0.5rem;
    }
    .payment-page .switch-container label {
        padding-left: 1.5rem;
    }
    .payment-page .address-form-container .subtitle-form, .payment-page .email-container .subtitle-form {
        font-weight: 600;
        font-size: 14px;
    }
}