CSS Not working

I have got some custom CSS for my checkout page for paid membership pro and it is not working. Please check this out for me.

@media only screen and (min-width: 1200px) {
#pmpro_form h3 {
display: grid;
grid-template-columns: 1fr 2fr;
}
.pmpro_checkout .pmpro_checkout-fields .pmpro_checkout-field {
clear: left;
}
.pmpro_checkout .pmpro_checkout-fields .pmpro_checkout-field label {
float: left;
margin: 0 1em 0 0;
text-align: right;
width: 200px;
}
.pmpro_checkout .pmpro_checkout-field.pmpro_captcha, .pmpro_checkout .pmpro_checkout-field-text p {
margin-left: 200px;
padding-left: 1em;
}
.pmpro_checkout .pmpro_checkout-field-text p {
margin-top: 0;
}
form.pmpro_form .pmpro_submit {
text-align: right;
}
.pmpro_btn.pmpro_btn-submit-checkout {
width: auto;
}
}