Full height landing page on mobile devices

Dear all,

I am building my website with the Twenty seventeen theme. On PC screens I am content with how you land on the website: Full-screen image, the title and slogan.
However, when I open the website on mobile devices the landing page is no longer full screen and I can see half of the ‘about’ page already. How can I get the mobile version also to be full screen when you land on the website? I want you to scroll down to read the rest. I have done a lot of searching and adding custom CSS but so far nothing has worked for the mobile version. I have tried things like:

/* Mobile screen*/
@media screen and (max-width: 1000px){
.has-header-image.twentyseventeen-front-page .custom-header {
/*display: table;*/
/*height: 300px;*/
/*height: 75vh;*/
min-height: 100%;
/*width: 100%;*/
}
}

Thanks, much appreciated!

The page I need help with: [log in to see the link]