Issue Description:
On the landing page of our website, we've observed that there is excess padding present on both sides of the main content specifically when viewed on mobile devices. This additional padding is affecting the user experience by reducing the usable space and causing unnecessary scrolling. To enhance the mobile user experience, we need to address this padding issue.
Expected Behavior:
The main content on the landing page should be properly aligned without any extra padding on both sides, ensuring that users can access the content comfortably on mobile devices without having to scroll excessively.
Steps to Reproduce:
- Open the landing page of our website on a mobile device.
- Observe the amount of padding present on both sides of the main content.
- Note how the excessive padding impacts the usability and requires unnecessary scrolling.
Proposed Solution:
The padding values for the main content should be adjusted specifically for mobile views to ensure optimal use of screen space. This can be achieved through CSS media queries or responsive design techniques.
Screenshots:
![Screenshot_20230824-142645](https://private-user-images.githubusercontent.com/72051159/262988580-b5e20d59-c1bd-4182-bdb8-82d67f86da8d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIwMTc5OTUsIm5iZiI6MTcyMjAxNzY5NSwicGF0aCI6Ii83MjA1MTE1OS8yNjI5ODg1ODAtYjVlMjBkNTktYzFiZC00MTgyLWJkYjgtODJkNjdmODZkYThkLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjYlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzI2VDE4MTQ1NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTU3ODE3Mzk0ZDk2NGI3YTdmOTM1MGZlZmY5MzMxNzI4YzBmNDk1MDU3N2ZmNzVmMTFmY2QwZGI4YThjMDI3ZGMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.cW0rOGKlckbXGSFFbl0zBC-0wGNKAtuwaocMLgh8-20)