Update page layout

styles/sections/_task_order.scss

@@ -53,19 +53,14 @@
     margin-top: $gap * 2;
   }
 
-  .task-order__details {
-    max-width: 65%;
-  }
-
   .totals-box {
     padding: $gap * 4;
     padding-top: $gap * 2;
     flex-grow: unset;
     margin-left: $gap * 6;
-    margin-top: $gap * 3;
-    width: 35%;
     display: table;
     background-color: $color-gray-lightest;
+    min-width: 350px;
   }
 
   &.task_order__form {

templates/components/totals_box.html

@@ -1,6 +1,6 @@
 {% macro TotalsBox(task_order=None, obligated_funds=0, contract_amount=0) -%}
 
-  <div class="col totals-box">
+  <div class="totals-box">
     {% if task_order %}
       {% set obligated_funds = task_order.total_obligated_funds %}
       {% set contract_amount = task_order.total_contract_amount %}

templates/fragments/task_order_review.html

@@ -4,17 +4,12 @@
 
 
 <div class="task-order">
-  {{ SemiCollapsibleText() }}
-
-  <hr>
-
+  <div class="form-row">
+    <div class="form-col">
       <div class="h1">
         {{ "task_orders.review.review_your_task_order" | translate }}
       </div>
-  <p>
-    {{ "task_orders.review.check_paragraph" | translate }}
-  </p>
-  <div class="row">
+
       <div class="col task-order__details">
         <div class="h4">
           {{ "task_orders.review.task_order_number" | translate }}
@@ -79,7 +74,9 @@
           </a>
         </div>
       </div>
+    </div>
+    <div class="form-col">
       {{ TotalsBox(task_order=task_order) }}
-
+    </div>
   </div>
 </div>