Fixed layout of Feature Comparison table on mobile devices.

Site/_data/features.yml

@@ -0,0 +1,86 @@
+- name: .Net Code
+  ilgpu: "yes"
+  cppamp: "no"
+  cuda: "no"
+
+- name: C++ Code
+  ilgpu: "no"
+  cppamp: "yes"
+  cuda: "yes"
+
+- name: Function Annotations Required
+  ilgpu: "no"
+  cppamp: "yes"
+  cuda: "yes"
+
+- name: NVIDIA GPUs
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "yes"
+
+- name: AMD GPUs
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "no"
+
+- name: Intel GPUs
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "no"
+
+- name: High-Level Abstractions (Implicitly Grouped Kernels, ...)
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "no"
+
+- name: Low-Level Intrinsics
+  ilgpu: "yes"
+  cppamp: "no"
+  cuda: "yes"
+
+- name: High-Performance Math Functions
+  ilgpu: "yes"
+  cppamp: "no"
+  cuda: "yes"
+
+- name: Cross-Platform Support
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "yes"
+
+- name: Single-Compilation Cross-Platform Support
+  ilgpu: "yes"
+  cppamp: "no"
+  cuda: "no"
+
+- name: Direct Multi-GPU Support
+  ilgpu: "yes"
+  cppamp: "partial"
+  cuda: "yes"
+
+- name: Convenient Algorithm Debugging
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "no"
+
+- name: Debugging on GPU Hardware
+  ilgpu: "partial"
+  cuda: "yes"
+
+- name: Kernel Profiling
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "yes"
+
+- name: CPU Runtime
+  ilgpu: "yes"
+  cppamp: "yes"
+  cuda: "no"
+- name: CPU Runtime with Shared Memory and Low-Level Intrinsics
+  ilgpu: "yes"
+  cuda: "no"
+
+- name: SIMD CPU Runtime
+  ilgpu: "scheduled"
+  cppamp: "yes"
+  cuda: "no"

Site/_sass/extras-styles.scss

@@ -103,48 +103,44 @@
   padding: 50px 30px;
 }
 
-
-.features-col {
-  float: left !important;
-  width: 50% !important;
+.features-header {
+  background-color: #F3F5FA;
 }
 
-.features-col .header {
-  font-size: 28px !important;
-  margin-bottom: 12px !important;
-  background-color: #F3F5FA;
-  min-height: 60px !important;
-  padding-top: 6px !important;
-  text-align: center !important;
+.features-header-col {
+  text-align: center;
+  vertical-align: middle;
+  height: 4rem;
+  font-weight: normal;
+
+  @media (min-width: 576px) {
+    font-size: 1.5rem;
+  }
 }
 
-.features-col .spec {
-  border-right: 1px solid #37517e !important;
-  min-height: 48px !important;
+.features-header-name {
+  @extend .features-header-col;
 }
 
-.plan-col {
-  float: left !important;
-  text-align: center !important;
+.features-body > tr:nth-child(even) {
+   background-color: #00000004;
 }
 
-.plan-col .header {
-  font-size: 28px !important;
-  margin-bottom: 12px !important;
-  background-color: #F3F5FA;
-  min-height: 60px !important;
-  padding-top: 6px !important;
+.features-body-col {
+  border-left: 1px solid #37517e40;
 }
 
-.plan-col .spec {
-  min-height: 48px !important;
-  border-right: 1px solid #37517e;
+.features-body-name {
+  color: #37517e;
+  height: 3rem;
+
+  @media (min-width: 576px) {
+    font-size: 1.25rem;
+  }
 }
 
-.spec h4 {
-  color: #37517e !important;
-  margin-bottom: 0 !important;
-  font-size: 22px;
+.spec {
+  text-align: center;
 }
 
 .spec .bx-check {