Contact person: Business Client

Phone:Show

Email:Show

Location: São Paulo, Brazil

Budget: Recommended by industry experts

Time to start: As soon as possible

Project description:
"Project Overview

I have a website hosted on Wix Studio (URL: [login to view URL]
) where I embed a Power BI interactive dashboard inside one of the pages (“/tampa-bay-dashboard”). The current implementation works visually on my widescreen monitor, but the layout breaks completely on standard laptop resolutions.

I need an experienced Wix Studio designer/developer who understands responsive structure, containers, flex layout, and HTML embeds to fix the responsiveness and improve the visual presentation of the project.

What Already Exists

A full page with MY custom header design (logos + title).

A Power BI dashboard embedded through an HTML component using an <iframe>.

Backgrounds, textures, and branding elements already implemented.

Manual border masks created to hide Power BI white edges.

Everything works fine on my screen, but breaks on normal screens due to improper responsiveness.

Core Problems to Fix

Responsiveness is breaking

The dashboard is aligned on widescreen, but misaligned on laptop viewports.

Extra white/black spaces appear around the iframe.

Containers are not respecting max-width.

Wix Studio max-width conflicts

The page inherits a global 1600px max-width and I cannot override it.

Power BI iframe is not fully responsive

It uses 100vw/100vh, which breaks in Wix Studio.

Needs a proper responsive width (100%) + stable height.

Header and footer sections are not aligned with the main content

Logos and title need to respect the same max-width grid.

The layout is not consistent across desktop resolutions

It must look clean at:

1366px

1440–1600px

1920px

What I Need the Freelancer to Deliver
1. Fix page responsiveness completely

Set up proper max-width (1280px or similar).

Center the entire content structure.

Remove stretching or overflow issues.

2. Fix Power BI iframe embed

Make iframe behave responsively inside the container.

Remove scroll bars and white borders.

Ensure dashboard loads cleanly with a fixed or adaptive height.

3. Rebuild the layout structure if needed

Use correct containers / sections / boxes.

Use flexbox (horizontal alignment) correctly.

Ensure header, body, and footer align perfectly.

4. Improve visual consistency

Maintain my existing branding (logos, black background, diagonal texture).

Improve spacing, alignment, and layout polish.

Optional: slight enhancement to the visual hierarchy.

5. Final delivery must look professional

The final result needs to be a clean, polished, professional scouting platform page, behaving perfectly on all desktop screens." (client-provided description)