Update responsive styles and class names for consistency

Refactored multiple components to improve responsive design, ensuring better usability on smaller screens. Standardized class names for clarity and consistency, and adjusted layouts and styles to enhance overall alignment and accessibility.

frontend/src/app/pages/reference/lag/lag.component.html

@@ -50,7 +50,7 @@
           <div id="exceptions" [ngClass]="{'hide': !showExceptions}"
                style="display: flex; justify-content: center; padding-bottom: 30px;">
             <img ngSrc="/public/img/random/farm_limiter_darker.png" alt="Visualization of the farm limiter"
-                 style="width: 70%; padding-top: 7px;" height="375" width="715">
+                 class="visLagLimiter" style="width: 70%; padding-top: 7px;" height="375" width="715">
           </div>
           <ul class="full-page-list">
             <li>Turtles only need one breeding pair. The breeding mechanic of turtles allows you to breed one pair over