﻿#wallet-page .design-box {
    height: 155px;
    width : 100%;
}

#pills-wallet-page-tab {
    position: relative;
    background-color: #0f263a;

    padding: 10px;
    border-radius: 10px;
}
#pills-wallet-page-tab li{
    padding : 0px 5px;
}
    #pills-wallet-page-tab li .nav-link {
        font-size: 16px;
        background-color: whitesmoke;
        color: #0f263a;
        border: 1px solid #000;
        border-radius: 10px;
        border-radius: 8px;
        /* width: fit-content; */
        font-weight: 500;
        padding: 6px 25px;
        font-family: 'Poppins';
        text-transform : capitalize;
    }
        #pills-wallet-page-tab li .nav-link.active {
            background-color: #FF850B;
            color : #fff;

        }

#pills-wallet-tabContent .wallet-table-body {
    /*border: 1px solid #0f263a;*/
    border-radius: 8px;
    overflow: hidden;
}

    #pills-wallet-tabContent .wallet-table-body table {
        margin-bottom: 0px;
    }
#wallet-page .title{
    margin-bottom : 5px;
}
#wallet-page .title h2 {
    font-family: 'Poppins';
    position: relative;
    width: fit-content;
    color: #3c3939;
    font-size: 23px;
    font-weight: 600;
    line-height: 35px;
    text-align: center;
    margin: auto;
}
    #wallet-page .title h2::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 10%;
        width: 80%;
        height: 2px;
        background-color: #FF850B;
    }
.header-wallet-box{
    margin-bottom : 10px;
}
.btn-recharge {
    font-size: 16px;
    font-weight: 500;
    border-radius: 7px;
    padding: 6px 18px;
    letter-spacing: .2px;
}
    .btn-recharge.blue {
        background: #edf7ff;
        color: #000;
        border: 1px solid #092e67;
    }
    .btn-recharge.red {
        border: 1px solid red;
        color: red;
        background-color: #fff3f3;
    }
.recharge-box.balance h4{
    font-size: 20px;
    color: green;
    font-family: 'Poppins';
}
@media(max-width : 768px){
    .wallet-table-body{
        border : 1px solid #0f263a;
    }
    .recharge-box.balance {
        width: 100%;
        display: block;
        order: -1;
        text-align: center;
        margin-bottom: 12px;
    }
    .header-wallet-box .d-flex{
        flex-wrap : wrap;
    }
}
/*recharge page*/
#recharge-cards .card {
    border: 1px solid #FF850B;

}
#recharge-cards .card .card-body{
    padding : 10px;
}
    #recharge-cards .card .card-body .add, #recharge-cards .card .card-body .get {
        padding: 8px 5px;
        width: 50%;
        text-align: center;
    }
        #recharge-cards .card .card-body .add p, #recharge-cards .card .card-body .get p {
        margin-bottom : 0px !important;
        font-size : 17px;
        color : #0f263a;
        }
    #recharge-cards .card .card-body .add h6, #recharge-cards .card .card-body .get h6{
        color: #0f263a;
        font-size: 16px;
        font-weight: 500;
        font-family: "poppins";
        }
        #recharge-cards .card .card-body .get {
        border-radius: 7px;
        background-color: #FF850B3d;
    }


#wallet-page .ribbon {
    position: absolute;
    display: block;
    top: -4px;
    left: -4px;
    width: 80px;
    height: 80px;
    overflow: hidden;
}

    #wallet-page .ribbon .label {
        position: relative;
        display: block;
        left: -29px;
        top: 9px;
        width: 100px;
        padding: 0px 0;
        font-size: 10px;
        text-align: center;
        color: #fff;
        background-color: #092e67;
        -ms-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
        transform: rotate(-45deg);
        letter-spacing: 0.5px;
    }

#wallet-page .label:before,
#wallet-page .label:after {
    content: "";
    position: absolute;
    bottom: -4px;
    border-top: 4px solid rgba(0, 51, 129, 0.7411764706);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

#wallet-page .label:before {
    left: 6px;
}

#wallet-page .label:after {
    right: 7px;
}

@media(max-width : 1191px){
    #wallet-page .design-box {
        height: 1px;
        width: 100%;
    }
}