.wcocp-fields{
    overflow: hidden;
}
.wcocp-fields input{
    background-color: #fff;
    border: 1px solid hsla(0,0%,7%,.8) !important;
    border-radius: 4px !important;
    color: #2b2d2f !important;
    margin-top: 16px !important;
    box-shadow: none !important;
}
.wcocp-number{
    background: url(img/unknown.svg) 12px center no-repeat #fff;
    padding-left: 60px !important;
}
.wcocp-expiry,
.wcocp-cvv{
    width: calc(50% - 8px) !important;
    float: left;
}
.wcocp-cvv{
    float: right;
}
.wcocp-number.american-express{
    background-image: url(img/american-express.svg);
}
.wcocp-number.cb-nationale{
    background-image: url(img/cb-nationale.svg);
}
.wcocp-number.diners-club{
    background-image: url(img/diners-club.svg);
}
.wcocp-number.discover{
    background-image: url(img/discover.svg);
}
.wcocp-number.wcocp-error{
    background-image: url(img/error.svg);
}
.wcocp-number.jcb{
    background-image: url(img/jcb.svg);
}
.wcocp-number.maestro{
    background-image: url(img/maestro.svg);
}
.wcocp-number.mastercard{
    background-image: url(img/mastercard.svg);
}
.wcocp-number.mir{
    background-image: url(img/mir.svg);
}
.wcocp-number.unionpay{
    background-image: url(img/unionpay.svg);
}
.wcocp-number.unknown{
    background-image: url(img/unknown.svg);
}
.wcocp-number.visa{
    background-image: url(img/visa.svg);
}
.wcocp-fields input.wcocp-error{
    border-color: #cc1818 !important;
}