:root{
    --second-color: #ffe17e;
    --second-color-hover: #c7ab4a;
}
#payment_box, #verify_payment_box {
    background-color: black;
    margin-top: 75px;
    position: relative;
    padding: 70px 0;

    img.wms_bg_image {
        position: absolute;
        top: 0;
        filter: blur(5px);
        height: 100%;
        width: 100%;
    }

    #payment_box_content {
        width: 550px;
        max-width: 90%;
        margin: 0 auto;
        position: relative;
        padding: 40px 15px 75px 30px;
        background: #232323;
        color: white;
        border-radius: 10px;
        line-height: 40px;
        text-align: justify;

        h1 {
            font-size: 22px;
            text-align: center;
        }


        form {
            padding-top: 15px;
            display: flex;
            font-size: 14px;
        }

        img {
            width: 180px;
            margin-left: 15px;
            border-radius: 10px;
            height: 270px;
        }

        .main_price_discounted {
            text-decoration-line: line-through;
            text-decoration-color: red;
            text-decoration-style: wavy;
            padding: 0 5px;
            font-size: 13px;
        }

        .inp-btn-box {
            position: relative;
            height: 45px;

            input {
                line-height: 40px;
                padding-right: 5px;
                width: 100%;
                position: absolute;
            }

            span {
                display: inline-block;
                line-height: 43px;
                padding: 0 5px;
                margin-right: -5px;
                background-color: #eee;
                color: black;
                position: absolute;
                left: 0;
                font-size: 13px;
                cursor: pointer;
            }

        }

        #pay_btn {
            line-height: 35px;
            width: 100%;
            background: var(--second-color);
            border: none;
            border-radius: 5px;
            color: black;
            cursor: pointer;
        }
        #pay_btn:hover{
            background: var(--second-color-hover);
        }
    }

    .error_result {
        color: #b9011c;
        background: #f4d8d8;
    }

    .success_result {
        color: #095e09;
        font-size: 16px;
        background: #d1e6c0;
    }

    #wms-check-response {
        min-height: 30px;
        font-size: 15px;
        line-height: 25px;
        padding: 5px 10px;
        border-radius: 5px;
        margin-top: 5px;
        margin-bottom: 5px;
    }
}

#verify_payment_box {

    #payment_box_content {
        text-align: center;
    }

    a {
        background: #eee;
        padding: 10px;
        border-radius: 5px;
        color: black;
    }
}

@media screen and (max-width: 510px) {
    #payment_box, #verify_payment_box {

        #payment_box_content {

            form {
                display: block;
                padding-right: 15px;
                padding-left: 15px;
            }

            img {
                width: auto;
                margin: 0 auto;
                display: block;
                height: 200px;
            }

            .main_price_discounted {
            }

            .inp-btn-box {
            }

            #pay_btn {
                bottom: -45px;
            }
        }

        #wms-check-response {
        }
    }
}