Label theme make video section smaller

Store Design

Topic summary

A user seeks to reduce the height of the video section in Shopify’s Label theme. An initial CSS solution is provided using media queries to adjust the padding-bottom to 32% for screens wider than 767px, making the video section smaller.

The user then requests a follow-up adjustment: keeping the new reduced size but repositioning the video to show more of the top portion (specifically, more of a person’s head) rather than the bottom.

A second CSS snippet is offered to address this:

  • Uses object-position: top!important; on the .object-cover class to shift the video’s focal point upward

Both code snippets are added via the theme’s Custom CSS section in the Shopify admin panel. The discussion appears resolved with these two CSS modifications working together.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

How can I make the video section smaller in label theme?

pic for reference: https://ibb.co/200DWmmf

https://roxysound.com/collections/frontpage

password sahsku

Thank you

2

Hi there! :blush:
Here’s the CSS code to resolve your issue:

@media screen and (min-width: 767px) {
.background-video-wrapper--cinematic {
    padding-bottom: 32%!important;
}}

To add this to your Shopify theme, follow these steps:

  1. Go to Online Store in your admin panel.
  2. Click on Customize next to your active theme.
  3. Scroll down in the side panel until you find Custom CSS.
  4. Paste the code I provided.
  5. Save the changes.
    You should see the updates in real-time. Let me know if you need any more help! :rocket:
3

That’s amazing, thanks, is there a way I can see more of the top instead of so much of the bottom (see more her head) but keeping this new size?

4

Hi @urbantis ,

do you want like the picture I shared.

Screenshot (3).png
Screenshot (3).png1920×938 261 KB

5

Add this one too:

.object-cover {
object-position: top!important;
}