.card-wrapper {
    margin-bottom: 25px !important;
}

.jp-card.jp-card-safari.jp-card-identified .jp-card-front:before,
.jp-card.jp-card-safari.jp-card-identified .jp-card-back:before {
    background-image: repeating-linear-gradient( 45deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), repeating-linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 1px, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.03) 4px ), repeating-linear-gradient( 90deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), repeating-linear-gradient( 210deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), -webkit-linear-gradient(-245deg, rgba(255, 255, 255, 0) 50%, rgba( 255, 255, 255, 0.2 ) 70%, rgba(255, 255, 255, 0) 90%);
    background-image: repeating-linear-gradient( 45deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), repeating-linear-gradient( 135deg, rgba(255, 255, 255, 0.05) 1px, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.03) 4px ), repeating-linear-gradient( 90deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), repeating-linear-gradient( 210deg, rgba(255, 255, 255, 0) 1px, rgba(255, 255, 255, 0.03) 2px, rgba(255, 255, 255, 0.04) 3px, rgba(255, 255, 255, 0.05) 4px ), linear-gradient( -25deg, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.2) 70%, rgba(255, 255, 255, 0) 90% );
}

.jp-card.jp-card-ie-10.jp-card-flipped,
.jp-card.jp-card-ie-11.jp-card-flipped {
    -webkit-transform: 0deg;
    -moz-transform: 0deg;
    -ms-transform: 0deg;
    -o-transform: 0deg;
    transform: 0deg;
}

    .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-front,
    .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-front {
        -webkit-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }

    .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-back,
    .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-back {
        -webkit-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }

        .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-back:after,
        .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-back:after {
            left: 18%;
        }

        .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-back .jp-card-cvc,
        .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-back .jp-card-cvc {
            -webkit-transform: rotateY(180deg);
            -moz-transform: rotateY(180deg);
            -ms-transform: rotateY(180deg);
            -o-transform: rotateY(180deg);
            transform: rotateY(180deg);
            left: 5%;
        }

        .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-back .jp-card-shiny,
        .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-back .jp-card-shiny {
            left: 84%;
        }

            .jp-card.jp-card-ie-10.jp-card-flipped .jp-card-back .jp-card-shiny:after,
            .jp-card.jp-card-ie-11.jp-card-flipped .jp-card-back .jp-card-shiny:after {
                left: -480%;
                -webkit-transform: rotateY(180deg);
                -moz-transform: rotateY(180deg);
                -ms-transform: rotateY(180deg);
                -o-transform: rotateY(180deg);
                transform: rotateY(180deg);
            }

.jp-card.jp-card-ie-10.jp-card-amex .jp-card-back,
.jp-card.jp-card-ie-11.jp-card-amex .jp-card-back {
    display: none;
}

.jp-card-logo,
.jp-card-logo:before,
.jp-card-logo:after {
    box-sizing: border-box;
}

.jp-card-container {
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
    width: 350px;
    max-width: 100%;
    height: 200px;
    margin: auto;
    z-index: 1;
    position: relative;
}

.jp-card {
    font-family: "Helvetica Neue";
    line-height: 1;
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 315px;
    border-radius: 10px;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    transition: all 400ms linear;
}

    .jp-card > *,
    .jp-card > *:before,
    .jp-card > *:after {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        font-family: inherit;
    }

    .jp-card.jp-card-flipped {
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        -ms-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }

    .jp-card .jp-card-front,
    .jp-card .jp-card-back {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        transform-style: preserve-3d;
        -webkit-transition: all 400ms linear;
        -moz-transition: all 400ms linear;
        transition: all 400ms linear;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden;
        border-radius: 10px;
        background: #482124;
    }

        .jp-card .jp-card-front:before,
        .jp-card .jp-card-back:before {
            content: " ";
            display: block;
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            opacity: 0;
            border-radius: 10px;
            -webkit-transition: all 400ms ease;
            -moz-transition: all 400ms ease;
            transition: all 400ms ease;
        }

        .jp-card .jp-card-front:after,
        .jp-card .jp-card-back:after {
            content: " ";
            display: block;
        }

        .jp-card .jp-card-front .jp-card-display,
        .jp-card .jp-card-back .jp-card-display {
            color: white;
            font-weight: normal;
            opacity: 0.5;
            -webkit-transition: opacity 400ms linear;
            -moz-transition: opacity 400ms linear;
            transition: opacity 400ms linear;
        }

            .jp-card .jp-card-front .jp-card-display.jp-card-focused,
            .jp-card .jp-card-back .jp-card-display.jp-card-focused {
                opacity: 1;
                font-weight: 700;
            }

        .jp-card .jp-card-front .jp-card-cvc,
        .jp-card .jp-card-back .jp-card-cvc {
            font-family: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
            font-size: 14px;
        }

        .jp-card .jp-card-front .jp-card-shiny,
        .jp-card .jp-card-back .jp-card-shiny {
            width: 50px;
            height: 35px;
            border-radius: 5px;
            background: #ccc;
            position: relative;
        }

            .jp-card .jp-card-front .jp-card-shiny:before,
            .jp-card .jp-card-back .jp-card-shiny:before {
                content: " ";
                display: block;
                width: 70%;
                height: 60%;
                border-top-right-radius: 5px;
                border-bottom-right-radius: 5px;
                background: #d9d9d9;
                position: absolute;
                top: 20%;
            }

        .jp-card .jp-card-front .jp-card-logo {
            position: absolute;
            opacity: 0;
            bottom: 10px;
            right: 10px;
            -webkit-transition: 400ms;
            -moz-transition: 400ms;
            transition: 400ms;
            /*height: 36px;*/
            width: 60px;
            object-fit: contain;
            font-style: normal;
            z-index: 2;
        }

        .jp-card .jp-card-front .jp-card-lower {
            width: 80%;
            position: absolute;
            left: 10%;
            bottom: 20px;
        }

@media only screen and (max-width: 480px) {
    .jp-card .jp-card-front .jp-card-lower {
        width: 90%;
        left: 5%;
    }
}

.jp-card .jp-card-front .jp-card-lower .jp-card-cvc {
    visibility: hidden;
    float: right;
    position: relative;
    bottom: 5px;
}

.jp-card .jp-card-front .jp-card-lower .jp-card-number {
    font-family: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
    font-size: 24px;
    clear: both;
    margin-bottom: 50px;
}

.jp-card .jp-card-front .jp-card-lower .jp-card-expiry {
    font-family: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
    letter-spacing: 0em;
    position: absolute;
    right: 75px;
    bottom: 26px;
    width: auto;
    text-align: right;
}

    .jp-card .jp-card-front .jp-card-lower .jp-card-expiry:before,
    .jp-card .jp-card-front .jp-card-lower .jp-card-expiry:after {
        font-family: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
        font-weight: bold;
        font-size: 10px;
        white-space: pre;
        display: block;
        opacity: 0.5;
    }

    .jp-card .jp-card-front .jp-card-lower .jp-card-expiry:before {
        content: attr(data-before);
        display: block;
        margin-bottom: 2px;
        font-size: 7px;
        text-transform: uppercase;
    }

    .jp-card .jp-card-front .jp-card-lower .jp-card-expiry:after {
        position: absolute;
        content: attr(data-after);
        text-align: right;
        right: 100%;
        margin-right: 5px;
        /* margin-top: 0px; */
        bottom: 0;
        margin-bottom: 2px;
    }

.jp-card .jp-card-front .jp-card-lower .jp-card-name {
    text-transform: uppercase;
    font-family: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
    font-size: 20px;
    max-height: 45px;
    position: absolute;
    bottom: 0;
    width: 250px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: horizontal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jp-card .jp-card-back {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

    .jp-card .jp-card-back .jp-card-bar {
        background-color: #444;
        background-image: -webkit-linear-gradient(#444, #333);
        background-image: linear-gradient(#444, #333,,,,, );
        width: 100%;
        height: 20%;
        position: absolute;
        top: 10%;
    }

    .jp-card .jp-card-back:after {
        content: " ";
        display: block;
        background-color: #fff;
        background-image: -webkit-linear-gradient(#fff, #fff);
        background-image: linear-gradient(#fff, #fff,,,,, );
        width: 80%;
        height: 16%;
        position: absolute;
        top: 40%;
        left: 2%;
    }

    .jp-card .jp-card-back .jp-card-cvc {
        position: absolute;
        top: 40%;
        left: 85%;
        -webkit-transition-delay: 600ms;
        -moz-transition-delay: 600ms;
        transition-delay: 600ms;
    }

    .jp-card .jp-card-back .jp-card-shiny {
        position: absolute;
        top: 66%;
        left: 2%;
    }

        .jp-card .jp-card-back .jp-card-shiny:after {
            content: "";
            position: absolute;
            left: 120%;
            top: 5%;
            color: white;
            font-size: 7px;
            width: 230px;
            opacity: 0.5;
        }

.jp-card.jp-card-identified {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

    .jp-card.jp-card-identified .jp-card-front:before,
    .jp-card.jp-card-identified .jp-card-back:before {
        -webkit-transition: all 400ms ease;
        -moz-transition: all 400ms ease;
        transition: all 400ms ease;
        opacity: 1;
    }

.jp-card.jp-card-visa.jp-card-identified .jp-card-logo.jp-card-visa,
.jp-card.jp-card-mastercard.jp-card-identified .jp-card-logo.jp-card-mastercard,
.jp-card.jp-card-maestro.jp-card-identified .jp-card-logo.jp-card-maestro,
.jp-card.jp-card-amex.jp-card-identified .jp-card-logo.jp-card-amex,
.jp-card.jp-card-discover.jp-card-identified .jp-card-logo.jp-card-discover,
.jp-card.jp-card-dankort.jp-card-identified .jp-card-logo.jp-card-dankort,
.jp-card.jp-card-troy.jp-card-identified .jp-card-logo.jp-card-troy,
.jp-card.jp-card-dinersclub.jp-card-identified .jp-card-logo.jp-card-dinersclub, /* Diğer kart tipleri için de ekleyebilirsiniz */
.jp-card.jp-card-jcb.jp-card-identified .jp-card-logo.jp-card-jcb,
.jp-card.jp-card-laser.jp-card-identified .jp-card-logo.jp-card-laser,
.jp-card.jp-card-unionpay.jp-card-identified .jp-card-logo.jp-card-unionpay,
.jp-card.jp-card-visaelectron.jp-card-identified .jp-card-logo.jp-card-visaelectron {
    opacity: 1;
}

.jp-card .jp-card-front .jp-card-fixed-logo {
    position: absolute;
    top: 15px; 
    right: 15px; 
    /*width: 50px;*/ 
    height: auto; 
    max-height: 45px;
    z-index: 2;
    opacity: 1; 
}