Poor Grouping of Executive Body Boxes - UI Fix Required

[vvs-basanth]

The grouping of the Executive Body boxes does not look visually appealing, which impacts the overall user experience and design aesthetics. The current layout is misaligned, cluttered, or inconsistent with the design standards.

Steps to Reproduce:

1. Go to the section of the site where the Executive Body boxes are displayed.

2. Observe the arrangement and grouping of the boxes.

Expected Behavior: The Executive Body boxes should be well-aligned, evenly spaced, and visually appealing, grouped into 4 - enhancing the overall look and feel of the page.

Actual Behavior: The grouping looks unorganized or visually unappealing, with possible issues such as misalignment, inconsistent spacing, or lack of proper styling.

Possible Causes:

• Incorrect Tailwind CSS styling or layout configurations.
• Misaligned grid or flex properties.
• Inconsistent use of spacing, padding, or margins.
• Overlapping or clashing UI elements.

Suggested Fix:

• Review the CSS layout properties (grid, flex, etc.) for proper alignment and spacing.
• Adjust padding, margins, and box sizes to create a visually appealing arrangement.
• Use consistent styling across all boxes to maintain a uniform look.
• Test the layout responsiveness on different screen sizes to ensure proper grouping.

Environment:

• Browser: FireFox Developer Edition
• Platform: Desktop - Web
• Affected Pages: Landing Page

[IbrahimDev00]

Will look into it.

Additional comments : Proposed changes:

• Remove the hover 3D animation to ensure a smooth feel
• Add a gap between the horizontally coupled boxes.