body {

    background: #0583ca;
    background: -webkit-linear-gradient(145deg, #09a9e9, #0583ca);
    background: linear-gradient(145deg, #09a9e9, #0583ca);
    background-repeat: no-repeat;
    height: 100%;
    min-height: 100dvh;

}

.card {
    display: block !important;
    border-radius: 15px !important;
    background: #ffffff !important;
    padding: 15px 30px;
}

.payment-card {
    padding: 5rem;
}

.form-control:focus {
    border-color: #00503000 !important;
    outline: 0 !important;
    background: #0582ca26;
    box-shadow: none !important;
    transition: 400ms;
}

.form-control:focus::placeholder {
    color: #08a2e3;
}

.card input {
    background: #c5c5c538;
    border-radius: 10px;
    border: none;
    height: 50px;
    color: #3a3939c4;
    transition: 400ms;
}

.card input::placeholder {
    color: #3a3939c4;
    font-weight: 600;
    font-size: 15px;
}

.logo-box {
    z-index: 999;
    display: block;
}

.logo {
    z-index: 999;
}

a.logo img {
    width: 100%;
    height: 100px;
    object-fit: contain;
}

.button-group {
    text-align: right
}


.button-group button {
    width: 100px
}

.payment-page {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 100dvh;
}

.card-title h3 {
    font-size: 22px;
    font-weight: 700;
    color: #3a3a39;
}

.payment-page button {
    height: 45px;
    width: 125px;
    background: #09a5e6 !important;
    color: #fff !important;
    border-radius: 8px;
    border: 2px solid #09a5e6 !important;
    box-shadow: none !important;
    transition: 400ms;
}

.payment-page button:hover {
    background: #09a5e600 !important;
    color: #09a5e6 !important;
    border: 2px solid #09a5e6 !important;
    transition: 400ms;
}