Allow demo of complex sine phase shift to be narrower on narrow screens

_posts/2024-07-04-complex-sin-and-cos.html

@@ -1104,7 +1104,7 @@ <h2>5. Are they identical after a π/2 phase shift?</h2>
 <p>Here is an overlay of the magnitudes of the complex sine and cosine; move the slider to shift the cosine along the real axis, and try to see at what shift (if any) the graphs coincide exactly. To make things easier to see, I'll only graph on one side of the real axis. Since the magnitudes of the two functions are symmetrical across the real axis, nothing is lost by only showing one side.</p>
 
 <div style='margin-block-start: 1em; margin-block-end: 1em'>
-  <div id='sine_cos_magnitude_overlay' style='width: 38em; height: 35em; display: inline-block; cursor: move'></div>
+  <div id='sine_cos_magnitude_overlay' style='width: 100%; max-width: 38em; height: 35em; display: inline-block; cursor: move'></div>
   <input type='range' id='shiftpos' min='0' max='1.57' value='0' step='0.314' list='shiftticks' style='width: 100%' />
   <datalist id='shiftticks' style='display: flex; justify-content: space-between; width: 100%'>
     <option value='0' label='0'></option>
@@ -1208,7 +1208,7 @@ <h2>5. Are they identical after a π/2 phase shift?</h2>
 <p>And the same for the angles of the complex sine and cosine:</p>
 
 <div style='margin-block-start: 1em; margin-block-end: 1em'>
-  <div id='sine_cos_angle_overlay' style='width: 38em; height: 35em; display: inline-block; cursor: move'></div>
+  <div id='sine_cos_angle_overlay' style='width: 100%; max-width: 38em; height: 35em; display: inline-block; cursor: move'></div>
   <input type='range' id='shiftpos2' min='0' max='1.57' value='0' step='0.314' list='shiftticks2' style='width: 100%' />
   <datalist id='shiftticks2' style='display: flex; justify-content: space-between; width: 100%'>
     <option value='0' label='0'></option>