sellesley vid mobile

sellesley.html

@@ -138,8 +138,10 @@ <h4>PART 3: WIREFRAME PROTOTYPE USER TESTING</h4>
 
                         <p>Of the 2 designs, we ultimately chose the first one as students expressed they were less interested in the social media-feel. The low-fidelity wireframe prototype for the first design was then created using Balsamiq. More information on the Balsamiq prototype below.</p>
 
-                        <iframe width="560" height="315" src="https://www.youtube.com/embed/_Lmfk7gWU9A" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-
+                        <div id="video" style="text-align: center">
+                            <iframe width="560" height="315" src="https://www.youtube.com/embed/_Lmfk7gWU9A" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        </div>
+
                         <p>While Design 1 was the basis for the low-fidelity wireframe prototype because of feedback I received, some additional elements were added to this design for the wireframe prototype.</p>
 
                         <p>The first feature I added was a sort-by dropdown menu that users can use to sort their listing view based on categories such as price and popularity. I also added an option for sellers to add product tags that users could use to search for or block specific features of items (ex. specific shoe size or item color). The final feature I added was inspired by Design 2. The option of switching between a grid view and a list view when sorting through the listings was included to accommodate different user preferences.</p>
@@ -151,7 +153,9 @@ <h4>PART 3: WIREFRAME PROTOTYPE USER TESTING</h4>
                         <h4>PART 4: DESIGN RATIONALE &amp; FINAL PROTOTYPE (FIGMA)</h4> 
                         <p>The final interactive prototype was developed using Figma. Watch a walkthrough of the app below or use the interactive prototype at the top of the page.</p>
 
-                        <iframe width="560" height="315" src="https://www.youtube.com/embed/bhVXBoqKq3Q" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        <div id="video" style="text-align: center">
+                            <iframe width="560" height="315" src="https://www.youtube.com/embed/bhVXBoqKq3Q" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                        </div>
 
                         <p><b>Typography:</b> The font used throughout the Sellesley app is Inter, a clean, simple, and easily readable sans-serif font that works with a variety of styles (bolded, semi-bolded, italicized, etc).</p>