budget reports layout adjustments for IE only

styles/sections/_reports.scss

@@ -14,6 +14,10 @@
       flex-direction: row;
       flex-basis: 50%;
 
+      @include ie-only {
+        max-width: 50%;
+      }
+
       &:first-child {
         padding-left: 0;
       }
@@ -26,7 +30,10 @@
 
     .panel {
       padding: $gap * 2;
-      flex-grow: 1;
+
+      @include ie-only {
+        max-width: 100%;
+      }
 
 
       // Spending Summary
@@ -38,20 +45,34 @@
 
         .row {
           justify-content: space-between;
+
+          @include ie-only {
+            max-width: 100%;
+            flex-wrap: wrap;
+          }
         }
 
         .spend-summary__heading {
           @include h3;
           margin: 0 $gap 0 0;
+          -ms-flex-negative: 1;
         }
 
         .spend-summary__budget {
           margin: 0 0 0 $gap;
 
+          @include ie-only {
+            margin: $gap 0 0 0;
+          }
+
           > div {
             text-align: right;
             margin: 0 0 ($gap / 2) 0;
 
+            @include ie-only {
+              text-align: left;
+            }
+
             dd, dt {
               display: inline;
             }