.card_wrapper .col-md-12 {
    border: 1px solid #e1e1e1;
    padding: 0 30px;
}

.form-group {
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 0;
    padding-bottom: 5px;
    padding-top: 5px;
}

.form-group:hover {
    background-color: #f7f8f8;
}

.header {
    background-color: #def7c1;
    text-align: center;
}

.form-group.header:hover {
    background-color: #def7c1;
}

.col-md-6.logo img {
    width: 100%;
    height: 73px;
    margin: 10px 0;
    background-size: contain;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    background-image: url('https://cdn.villazamani.com.tr/img/logo.svg?');
}


form #card_number {
    background-image: url(/img/images.png), url(/img/images.png);
    background-position: 2px -121px, 340px -61px;
    background-size: 120px 361px, 120px 361px;
    background-repeat: no-repeat;
    padding-left: 54px;
    width: 100%;
    height: 34px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

form #card_number.visa {
    background-position: 2px -163px, 340px -61px;
}

form #card_number.visa_electron {
    background-position: 2px -205px, 340px -61px;
}

form #card_number.mastercard {
    background-position: 2px -247px, 340px -61px;
}

form #card_number.maestro {
    background-position: 2px -289px, 340px -61px;
}

form #card_number.discover {
    background-position: 2px -331px, 340px -61px;
}

form #card_number.valid.visa {
    background-position: 2px -163px, 340px -87px;
}

form #card_number.valid.visa_electron {
    background-position: 2px -205px, 340px -87px;
}

form #card_number.valid.mastercard {
    background-position: 2px -247px, 340px -87px;
}

form #card_number.valid.maestro {
    background-position: 2px -289px, 340px -87px;
}

form #card_number.valid.discover {
    background-position: 2px -331px, 340px -87px;
}

img.kartlogo {
    width: 100%;
    height: 110px;
    background-size: contain;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url('/img/visamaster.jpg');
}

@media screen and (max-width: 768px) {
    .col-md-6.logo img {
        background-position: center center;
    }
}


@media screen and (max-width: 640px) {
    .card_wrapper {
        max-width: 100%;
        position: absolute;
        top: inherit;
        margin-top: 0;
        left: inherit;
        margin-left: 0;
    }

    .hide_640 {
        margin: 0;
        margin-top: 15px;
    }

    .col-md-6 select {
        margin-bottom: 10px;
    }
}


@media (max-width: 768px) {
    .card_wrapper{
        margin-top: unset;
        margin-left: unset;
        top: 0px;
        left: 0px;
    }
}