DAWN theme is not resizing for mobile and there is extra space all over (picture attached)

[mleinen]

DAWN theme is not resizing for mobile and there is extra space all over (picture attached)  I have tried EVERY solution on here and none have worked.  My video and format are correct.  in mobile it cuts off the right of the video and it leaves grey space all around what video it does play.  PERFECT on a laptop.  please please please help I am trying to get this delivered to a client asap...

url https://the-trading-card-club.myshopify.com/

password TradingCardClub

[Victoria]

Hi, there.

Thanks for posting to the Shopify Community.

Our Theme Support team may be able to take a look into the issue you mentioned regarding sizing on mobile. I recommend getting in touch with our support via the Shopify Help Center, so we can take a more detailed look and determine what next steps are necessary. 

[mleinen]

support keeps erroring out.  Is this something you can login to my sgtore and look at?  I really need to get this fixed. 

[Victoria]

Thanks for your reply.

Are you able to clarify your first message? 

Unfortunately, through our community forum we do not have access to accounts and therefore will not be able to investigate the issue. However, using the link provided in my previous response, you can chat with a live Support Advisor who will have access. 

[mleinen]

your support form keeps erroring out.  who can i email?  shopify is letting me down!!!

[Victoria]

Are you able to share a screenshot of the error?

When accessing the Help Center, you'll need to type your question to the Help Center Assistant. Once you've typed your question, select 'I still need help.' Following that, you should be presented with additional options to Chat with a Support Advisor.

[JasmeetVT14313]

Hi @mleinen 
Can try adding below code to the place where you have previously added the Css. Make sure that this code is placed after your styling code.

@media screen and (max-width: 767px){
.videoBoxInfo {
    display: none;
}

.videoBackground .fullscreen-video-wrap {
    min-height: 212px;
}

.videoBackground .videoBox {
    min-height: auto;
}
}

If this information was helpful to you, please give it a Like. If it resolved your issue, kindly hit Like and mark it as the Solution! Thank you!

[JasmeetVT14313]

@mleinen 
Is this not working for you?

[GTLOfficial]

Hello @mleinen 
Go to online store ---------> themes --------------> actions ------> edit code------->base.css
add this code at the end of the file.

@media screen and (max-width: 768px) {
.videoBackground .videoBoxInfo {
padding: 0px 20px !important;
background: #000;
width: 100%;
}
}
@media screen and (max-width: 768px) {
.videoBackground .videoBox {
min-height: 300px !important;
height: 100%;
position: relative;
padding: 0;
}
}

and the result will be

If this was helpful, hit the like button and mark the job as completed.
Thanks

[mleinen]

AWESOME THAT FIXED HALF THE PROBLEM!  the only other issue was it cutting off the left side of the video... making the logo and text chopped off... any solution for that?  You can see it in the pic you sent as well...

[mleinen]

GTLOfficial... is there any way you could look for a solution to why the left side is chopped off on the video backgeound?  it like its not resizing right...

[GTLOfficial]

Hi
As i have checked , video is working well.