Reactive cloud

layouts/custom/sc.data.html

@@ -22,6 +22,15 @@
         text-align: center;
         width: 50%;
     }
+    img {
+        max-width: 75%;
+        height: auto;
+    }
+    @media (max-width: 1000px) {
+        .column  {
+            width: 100%;
+        }
+    }
 </style>
 
 
@@ -30,11 +39,11 @@
 <div class="cloud">
     <div class="select">
         <div class="column">
-            <img src="/gene.cloud/Genes.hu.202003.png" alt="March 2020 Human Genes" class="img" width="750px"/>
+            <img src="/gene.cloud/Genes.hu.202003.png" alt="March 2020 Human Genes" class="img"/>
             <H5>Human Genes Searched (March 2020)</H5>
         </div>
         <div class="column">
-            <img src="/gene.cloud/Genes.mu.202003.png" alt="March 2020 Mouse Genes" class="img" width="750px"/>
+            <img src="/gene.cloud/Genes.mu.202003.png" alt="March 2020 Mouse Genes" class="img"/>
             <H5>Mouse Genes Searched (March 2020)</H5>
         </div>
     </div>