﻿

ul.cardList {
    margin: 0;
    padding: 0;
    list-style: none;
}

    ul.cardList li {
        cursor: pointer;
        float: left;
        margin: 13px !important;
        padding: 0;
        text-align: center;
        width: 115px;
        border: 1px solid #0597c5 !important;
    }

        ul.cardList li label {
            padding: 1px !important;
            margin: 0 !important;
            background: #0597c5 !important;
            position: relative !important;
            padding-left: 32px !important;
        }

        ul.cardList li input {
            opacity: 1 !important;
            margin: 0 !important;
            display: block !important;
            position: absolute;
            left: 4px;
            bottom: 4px;
            z-index: 0;
        }

            ul.cardList li input + span {
                position: absolute;
                z-index: 1;
                left: 4px;
                bottom: 4px;
                width: 24px;
                height: 24px;
                text-align: center;
                line-height: 24px;
                font-weight: normal;
                font-size: 17pt;
                background: #0597c5 !important;
            }

                ul.cardList li input + span:after {
                    font-family: 'Glyphicons Halflings';
                    content: "\e157";
                }

            ul.cardList li input:checked + span:after {
                color: #4cff05;
                content: "\e067";
            }



i.VISA, i.MASTE, i.AMREX, i.JCB, i.VCB, i.TCB, i.MB, i.VIB, i.ICB, i.EXB, i.ACB, i.HDB, i.MSB, i.NVB, i.DAB, i.SHB, i.OJB, i.SEA, i.TPB, i.PGB, i.BIDV, i.AGB, i.SCB, i.VPB, i.VAB, i.GPB, i.SGB, i.NAB, i.BAB {
    width: 80px;
    height: 30px;
    display: block;
    background: url(../img/bank_logo.png) no-repeat;
}

i.MASTE {
    background-position: 0px -31px;
}

i.AMREX {
    background-position: 0px -62px;
}

i.JCB {
    background-position: 0px -93px;
}

i.VCB {
    background-position: 0px -124px;
}

i.TCB {
    background-position: 0px -155px;
}

i.MB {
    background-position: 0px -186px;
}

i.VIB {
    background-position: 0px -217px;
}

i.ICB {
    background-position: 0px -248px;
}

i.EXB {
    background-position: 0px -279px;
}

i.ACB {
    background-position: 0px -310px;
}

i.HDB {
    background-position: 0px -341px;
}

i.MSB {
    background-position: 0px -372px;
}

i.NVB {
    background-position: 0px -403px;
}

i.DAB {
    background-position: 0px -434px;
}

i.SHB {
    background-position: 0px -465px;
}

i.OJB {
    background-position: 0px -496px;
}

i.SEA {
    background-position: 0px -527px;
}

i.TPB {
    background-position: 0px -558px;
}

i.PGB {
    background-position: 0px -589px;
}

i.BIDV {
    background-position: 0px -620px;
}

i.AGB {
    background-position: 0px -651px;
}

i.SCB {
    background-position: 0px -682px;
}

i.VPB {
    background-position: 0px -713px;
}

i.VAB {
    background-position: 0px -744px;
}

i.GPB {
    background-position: 0px -775px;
}

i.SGB {
    background-position: 0px -806px;
}

i.NAB {
    background-position: 0px -837px;
}

i.BAB {
    background-position: 0px -868px;
}


@media(max-width:800px) {

    ul.cardList li {
        margin: 10px !important;
    }
}

@media(max-width:450px) {

    .page-checkout .boxPayment ul li .entry {
        padding: 15px 5px;
    }

    ul.cardList li {
        margin: 2px !important;
    }

    .page-checkout .boxPayment ul li label {
        font-size: 8pt;
    }
}
