diff --git a/cara/apps/calculator/static/js/form.js b/cara/apps/calculator/static/js/form.js
index 568f2c45..655ff5ac 100644
--- a/cara/apps/calculator/static/js/form.js
+++ b/cara/apps/calculator/static/js/form.js
@@ -160,8 +160,6 @@ function require_lunch(id, option) {
 
   require_input_field(startID, option);
   require_input_field(finishID, option);
-  set_disabled_status(startID, !option);
-  set_disabled_status(finishID, !option);
 
   if (!option) {
     $(finishID).removeClass("red_border finish_time_error lunch_break_error");
@@ -287,6 +285,17 @@ function on_short_range_option_change() {
   })
 }
 
+function on_lunch_break_option_change() {
+  all_lunch_breaks = [$('input[type=radio][name=exposed_lunch_option]'), $('input[type=radio][name=infected_lunch_option]')];
+  for (lunch_break of all_lunch_breaks) {
+    lunch_break.each(function() {
+      children = getChildElement($(this));
+      this.checked ? children.show() : children.hide();
+      require_fields(this);
+    })
+  }
+}
+
 function on_coffee_break_option_change() {
   all_coffee_breaks = [$('input[type=radio][name=exposed_coffee_break_option]'), $('input[type=radio][name=infected_coffee_break_option]')];
   for (coffee_breaks of all_coffee_breaks) {
@@ -759,6 +768,13 @@ $(document).ready(function () {
   // Call the function now to handle forward/back button presses in the browser.
   on_short_range_option_change();
 
+  // When a lunch_option changes we want to make its respective children
+  // to show/hide
+  $("input[type=radio][name=exposed_lunch_option]").change(on_lunch_break_option_change);
+  $("input[type=radio][name=infected_lunch_option]").change(on_lunch_break_option_change);
+  // Call the function now to handle forward/back button presses in the browser.
+  on_lunch_break_option_change();
+
   // When the coffee_break_option changes we want to make its respective
   // children show/hide
   $("input[type=radio][name=exposed_coffee_break_option]").change(on_coffee_break_option_change);
diff --git a/cara/apps/templates/base/calculator.form.html.j2 b/cara/apps/templates/base/calculator.form.html.j2
index 78d0114f..2c9cb081 100644
--- a/cara/apps/templates/base/calculator.form.html.j2
+++ b/cara/apps/templates/base/calculator.form.html.j2
@@ -452,21 +452,25 @@
       <label for="infected_dont_have_breaks_with_exposed" class="form-check-label col-sm-12">Input separate breaks for infected and exposed person(s)</label>
 
     </div><br>
-    <div class="breakBoxExposed" id="DIVexposed_breaks">
+    <div class="breakBoxExposed" id="DIVexposed_breaks" style="min-width:500px">
       <span id="exposed_break_title" style="display:none;"><b>Exposed person(s) breaks:</b></span>
       <div class="boxMargin">
-        Lunch break:
-        <input class="ml-2" type="radio" id="exposed_lunch_option_no" data-lunch-select="exposed" name="exposed_lunch_option" value=0 onclick="require_fields(this)">
-          <label for="exposed_lunch_option_no">No</label>
-        <input class="ml-2" type="radio" id="exposed_lunch_option_yes" data-lunch-select="exposed" name="exposed_lunch_option" value=1 checked="checked" onclick="require_fields(this)">
-          <label for="exposed_lunch_option_yes">Yes</label><br>
         <div class="split">
+        <div>Lunch break:</div>
         <div>
-        Start: <input type="time" id="exposed_lunch_start" class="start_time" data-time-group="exposed_lunch" data-lunch-for="exposed" data-has-radio="#exposed_lunch_option_yes" name="exposed_lunch_start" value="12:30" required>
+        <input type="radio" id="exposed_lunch_option_no" data-lunch-select="exposed" name="exposed_lunch_option" value=0>
+          <label for="exposed_lunch_option_no">No</label>
+        <input class="ml-2" type="radio" id="exposed_lunch_option_yes" data-lunch-select="exposed" data-enables="#DIVexposed_lunch_time" name="exposed_lunch_option" value=1 checked="checked">
+          <label for="exposed_lunch_option_yes">Yes</label><br>
         </div>
-        <div>
-        Finish: <input type="time" id="exposed_lunch_finish" class="finish_time" data-time-group="exposed_lunch" data-lunch-for="exposed" data-has-radio="#exposed_lunch_option_yes" name="exposed_lunch_finish" value="13:30" required><br>
         </div>
+        <div id="DIVexposed_lunch_time" class="split">
+          <div>
+          Start: <input type="time" id="exposed_lunch_start" class="start_time" data-time-group="exposed_lunch" data-lunch-for="exposed" data-has-radio="#exposed_lunch_option_yes" name="exposed_lunch_start" value="12:30" required onclick="require_fields(this)">
+          </div>
+          <div>
+          Finish: <input type="time" id="exposed_lunch_finish" class="finish_time" data-time-group="exposed_lunch" data-lunch-for="exposed" data-has-radio="#exposed_lunch_option_yes" name="exposed_lunch_finish" value="13:30" required onclick="require_fields(this)"><br>
+          </div>
         </div>
 
         <!-- Coffee Options -->
@@ -501,21 +505,21 @@
       <br>
     </div>
 
-    <div class="breakBoxInfected" id="DIVinfected_breaks">
+    <div class="breakBoxInfected" id="DIVinfected_breaks" style="min-width:500px">
       <b>Infected person(s) breaks:</b>
       <div class="boxMargin">
         Lunch break:
         <input class="ml-2" type="radio" id="infected_lunch_option_no" data-lunch-select="infected" name="infected_lunch_option" value=0 onclick="require_fields(this)">
           <label for="infected_lunch_option_no">No</label>
-        <input class="ml-2" type="radio" id="infected_lunch_option_yes" data-lunch-select="infected" name="infected_lunch_option" value=1 checked="checked" onclick="require_fields(this)">
+        <input class="ml-2" type="radio" id="infected_lunch_option_yes" data-lunch-select="infected" data-enables="#DIVinfected_lunch_time" name="infected_lunch_option" value=1 checked="checked" onclick="require_fields(this)">
           <label for="infected_lunch_option_yes">Yes</label><br>
 
-        <div class="split">
+        <div id="DIVinfected_lunch_time" class="split">
         <div>
-        Start: <input type="time" id="infected_lunch_start" class="start_time" data-time-group="infected_lunch" data-lunch-for="infected" data-has-radio="#infected_lunch_option_yes" name="infected_lunch_start" value="12:30">
+        Start: <input type="time" id="infected_lunch_start" class="start_time" data-time-group="infected_lunch" data-lunch-for="infected" data-has-radio="#infected_lunch_option_yes" name="infected_lunch_start" value="12:30" onclick="require_fields(this)">
         </div>
         <div>
-        Finish: <input type="time" id="infected_lunch_finish" class="finish_time" data-time-group="infected_lunch" data-lunch-for="infected" data-has-radio="#infected_lunch_option_yes" name="infected_lunch_finish" value="13:30"><br>
+        Finish: <input type="time" id="infected_lunch_finish" class="finish_time" data-time-group="infected_lunch" data-lunch-for="infected" data-has-radio="#infected_lunch_option_yes" name="infected_lunch_finish" value="13:30" onclick="require_fields(this)"><br>
         </div>
         </div>