diff --git a/app/code/Magento/Braintree/view/frontend/web/template/payment/cc-form.html b/app/code/Magento/Braintree/view/frontend/web/template/payment/cc-form.html
index f28cb33ceb4b1e1b13c85cd7d537fcf95377a434..a120355d9080ac35b377082eda8f1b4bd1076b16 100644
--- a/app/code/Magento/Braintree/view/frontend/web/template/payment/cc-form.html
+++ b/app/code/Magento/Braintree/view/frontend/web/template/payment/cc-form.html
@@ -80,7 +80,10 @@
                         <!-- ko if: (isCcDetectionEnabled())-->
                         <ul class="credit-card-types">
                             <!-- ko foreach: {data: getCcAvailableTypesValues(), as: 'item'} -->
-                            <li class="item" data-bind="css: {_active: $parent.selectedCardType() == item.value} ">
+                            <li class="item" data-bind="css: {
+                                                            _active: $parent.selectedCardType() == item.value,
+                                                            _inactive: $parent.selectedCardType() != null && $parent.selectedCardType() != item.value
+                                                            } ">
                                 <!--ko if: $parent.getIcons(item.value) -->
                                 <img data-bind="attr: {
                                     'src': $parent.getIcons(item.value).url,