/*
styling the select payment overlay window
*/
.select-payment{
    color: white !important;
    background: black !important;

    box-sizing: border-box !important;
    display: flex;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-direction: column;
    align-items: center;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    justify-content: center;
}

.select-payment-dark{
    color: white !important;
    background: black !important;

    box-sizing: border-box !important;
    display: flex;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-direction: column;
    align-items: center;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    justify-content: center;
}

.select-payment-light{
    color: black !important;
    background: white !important;

    box-sizing: border-box !important;
    display: flex;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-direction: column;
    align-items: center;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    justify-content: center;
}


/*
window caption
*/
.select-payment-caption{
    color: white !important;
}

.select-payment-caption-dark{
    color: white !important;
}

.select-payment-caption-light{
    color: black !important;
}

/*
panel containing the buttons
*/
.select-payment-panel{
    background:rgba(0, 0, 0, 1);
    /*margin: 10px 20px 10px 20px;*/
    margin: 10px auto;
    /*height: 80%;*/

    border: 0px solid #333;
    border-radius: 7px;
    width:300px !important;
    max-width:500px !important;
    display:block;
}

.select-payment-panel-dark{
    background:rgba(0, 0, 0, 1);
    /*margin: 10px 20px 10px 20px;*/
    margin: 5px auto;
    /*height: 80%;*/
    padding: 10px;
    border: 0px solid #333;
    border-radius: 7px;
    width:300px !important;
    max-width:500px !important;
    display:block;

}

.select-payment-panel-light{
    background:rgba(255, 255, 255, 1);
    /*margin: 10px 20px 10px 20px;*/
    margin: 5px auto;
    /*height: 80%;*/
    padding: 10px;

    border: 0px solid #333 !important;
    border-radius: 7px;
    width:300px !important;
    max-width:500px !important;
    display:block;
}

/*
use together with .select-payment-button-text
*/
.select-payment-button{
    width: 80% !important;
    min-width: 80% !important;
    max-width: 80% !important;
    margin: 20px auto !important;
    display: block !important;
    height:48px !important;
}


.select-payment-button-image{
    /* temp
    margin: 8dp auto !important;
    */
    padding:0px  !important;
}

.select-payment-button-image-swedbankpay{
    /* temp
    margin: 8dp auto !important;
    */
    display:block !important;
    padding:0px  !important;
    height:44px !important;
    max-height:44px !important;
    min-height:44px !important;
    /*
    width:186px !important;
    max-width:186px !important;
    min-width:186px !important;
    */


}

.select-payment-button-image-judopay{
    /* temp
    margin: 8dp auto !important;
    */
    display:block !important;
    padding:0px  !important;
    /*height:44px !important;
    max-height:44px !important;
    min-height:44px !important;*/
    width:100%;
    height:100%;
    border-radius: 7px;
    /*
    width:186px !important;
    max-width:186px !important;
    min-width:186px !important;
    */


}





.select-payment-button-swish{
    background-color: white !important;
    border: 1px solid #eee  !important;
    border-radius: 7px !important;
}

.select-payment-button-swedbankpay{
    background-color: white !important;
    border: 1px solid #eee  !important;
    border-radius: 7px !important;
}

.select-payment-button-judopay{
    /*border: 1px solid #eee  !important;
    background-color:#7656e5 !important;
    */
    /*border:1px solid #7656e5 !important;*/
    border: 1px solid #eee  !important;
    border-radius: 7px !important;
    /*background-color:white !important;
    border-radius: 7px !important;
    padding:4px;*/
}

.select-payment-subtitle-black {
    color:black;
    text-align: center;
    margin-top:-10px !important;
}

.select-payment-subtitle-white {
    color:white;
    text-align: center;
    margin-top:-10px !important;
}

.select-payment-button-google-pay{
    width: 80% !important;
    /* temp
    margin: 5% auto !important;
    */
    display: flex !important;
    flex-direction: column !important;
    text-decoration: none !important;
    /*height: 48px  !important;*/
    text-align: center  !important;
    background-color: white  !important;
    border: 0px solid transparent  !important;
    border-radius: 5px !important;
    padding:10px 0px 0px 0px !important;
}


/*
button with text only
*/
.select-payment-button-text{
    text-decoration: none !important;
    text-align: center  !important;
    background-color: ''  !important;
    color: red  !important;
    font-size: 1.1em !important;
    border: 1px solid #eee  !important;
    border-radius: 7px !important;
    padding:0px  !important;
}

.select-payment-button-cancel{
    /* temp
    margin-bottom: 60px auto !important;
    */
}





.select-payment-google-pay-postfix{

    width: 100% !important;
    /*margin: 2px auto !important;*/
    display: block !important;
}

.pay-mark-container-row {
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    align-items: center;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    justify-content: center;
}

.pay-mark{
    display: block;
    margin: 4px;
    height: 24px;
}

.pay-mark-48px{
    display: block;
    margin: 4px;
    height: 48px;
}

.swish{
    border:1px solid black;
    border-radius: 5px;
}