Remove unnecessary column around totals box and fix styling

styles/sections/_task_order.scss

@@ -114,23 +114,23 @@
     margin-top: $gap * 2;
   }
 
-  &.task-order__form {
-    .totals-box {
-      margin-top: 0;
-    }
-  }
-
   .totals-box {
     padding: $gap * 4;
     padding-top: $gap * 2;
     flex-grow: unset;
     margin-left: $gap * 6;
     margin-top: $gap * 3;
-    max-width: 336px;
+    width: 33.77%;
     height: fit-content;
     background-color: $color-gray-lightest;
   }
 
+  .task-order__form {
+    .totals-box {
+      margin-top: 0;
+    }
+  }
+
   .panel {
     @include shadow-panel;
   }

templates/portfolios/task_orders/review.html

@@ -101,9 +101,7 @@
         </a>
       </div>
     </div>
-    <div class="col totals">
     {{ TotalsBox(task_order=task_order) }}
-    </div>
 
   </div>
 

templates/task_orders/edit.html

@@ -91,14 +91,14 @@
   {% endcall %}
 
   <to-form inline-template v-bind:initial-clin-count="{{ form.clins.data | length }}">
-    <div>
+    <div class="task-order">
       {% include "fragments/flash.html" %}
         {% if task_order_id %}
           {% set action = url_for("task_orders.update", portfolio_id=portfolio.id, task_order_id=task_order_id) %}
         {% else %}
           {% set action = url_for("task_orders.update", portfolio_id=portfolio.id) %}
         {% endif %}
-        <form id="new-task-order" class="task-order task_order__form" action='{{ action }}' method="POST" autocomplete="off" enctype="multipart/form-data">
+        <form id="new-task-order" class="task_order__form" action='{{ action }}' method="POST" autocomplete="off" enctype="multipart/form-data">
           {{ form.csrf_token }}
 
           {{ SemiCollapsibleText(paragraph="task_orders.new.form_help_text" | translate) }}
@@ -339,10 +339,8 @@
               </div>
             {{ UploadInput(form.pdf) }}
           </div>
-          <div class="col totals">
           {{ TotalsBox(task_order=task_order) }}
         </div>
-        </div>
       </form>
     </div>
   </to-form>