edits to the card class, js function at bottom of explore pages

styles/_content.scss

@@ -122,10 +122,16 @@ td:nth-child(1) {
   padding: 2rem;
   background: rgba(34, 37, 43, 0.5);
   backdrop-filter: blur(3px);
+  border-radius: 8px;
+  opacity: 1;
+  transition: all 0.35s ease-in-out;
   @include media-breakpoint-down(sm) {
     margin-left: 15px;
     margin-right: 15px;
   }
+  &.not-hover {
+    opacity: 0.6;
+  }
 }
 .section-marker {
   position: absolute;

tool/template-explore-businesses.html

@@ -111,6 +111,17 @@
 
 
 {% block endbody %}
+<script type="text/javascript">
+  $( '.card-b' )
+  .mouseover( function(e){
+    $( '.card-b' ).addClass( 'not-hover' );
+    $( this ).removeClass( 'not-hover' );
+  })
+  .mouseout( function(e){
+    $( '.card-b' ).removeClass( 'not-hover' );
+  });
+</script>
+
 <script type="application/javascript">
   gtag('config', 'UA-157720658-3', {'content_group1': 'Hub Pages'});
 </script>

tool/template-explore-exchanges.html

@@ -77,6 +77,16 @@
 
 
 {% block endbody %}
+<script type="text/javascript">
+  $( '.card-b' )
+  .mouseover( function(e){
+    $( '.card-b' ).addClass( 'not-hover' );
+    $( this ).removeClass( 'not-hover' );
+  })
+  .mouseout( function(e){
+    $( '.card-b' ).removeClass( 'not-hover' );
+  });
+</script>
 <script type="application/javascript">
   gtag('config', 'UA-157720658-3', {'content_group1': 'Hub Pages'});
 </script>

tool/template-explore-wallets.html

@@ -69,6 +69,16 @@
 
 
 {% block endbody %}
+<script type="text/javascript">
+  $( '.card-b' )
+  .mouseover( function(e){
+    $( '.card-b' ).addClass( 'not-hover' );
+    $( this ).removeClass( 'not-hover' );
+  })
+  .mouseout( function(e){
+    $( '.card-b' ).removeClass( 'not-hover' );
+  });
+</script>
 <script type="application/javascript">
   gtag('config', 'UA-157720658-3', {'content_group1': 'Hub Pages'});
 </script>