Adding and resizing a background image in Fulton

I'm trying to add a page specific background image, which should be resized so it fits the screen. Though, either I can't get it to show or resize. Any help is greatly appreciated. 

#collection-ID .collection-54061d89e4b0fd1f5b9456b1 { background-image: url('https://static1.squarespace.com/static/5e8315c121a7960214076bd8/t/5ecf54954e191958620c39ad/1590645913058/Eilersen_factory_Slovakia_1_93L9433-2.jpg') !important;
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
  opacity: 0;
  margin: 0;
  padding: 0;
  display: grid;
  height: 100%;
  max-width: 100%;
  max-height: 100vh;
  margin: auto;
 }

Can you share link to page in your question?

Here it is; https://www.eilersen-helpdesk.eu/menu currently the background image isn't being displayed. Though, when the background image is being displayed all the buttons and text (which are visible now) are hidden behind the background image, plus the image isn't resized so that it fits the screen.

Thanks.

remove your code, use this code

body#collection-5e83215cdad42871a5479eb5 { 
#page {
    background-image: url(https://cdn.pixabay.com/photo/2020/05/26/07/43/skateboard-5221914_960_720.jpg);
    max-width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
	min-height: 100vh;
}
header#header {
    position: absolute !important;
    background: transparent !important;
}
}

Thanks tuanphan, that worked. Much appreciated! Is it also possible to hide the white footer (being displayed when scrolling down) - ex. by restricting the ability to scroll down?

Basically what I'm trying to do, is make this page https://www.eilersen-helpdesk.eu/menu  look like this page https://eilersen.eu/contact/

remove above & use this

body#collection-5e83215cdad42871a5479eb5 { 
#page {
    background-image: url(https://cdn.pixabay.com/photo/2020/05/26/07/43/skateboard-5221914_960_720.jpg);
    max-width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
	min-height: 100vh;
}
header#header {
    position: absolute !important;
    background: transparent !important;
}
footer#footer {
    display: none;
}
}

Thanks 😊 Final question, how do I create the white box, as seen here https://eilersen.eu/contact/.

Thanks

Add to Home > Design > Custom CSS

@media screen and (min-width:641px) {
div#page-5e83215cdad42871a5479eb5 {
    width: 50%;
    margin: 0 auto;
    background: white;
    padding: 2vw;
}
}
@media screen and (max-width:640px) {
div#page-5e83215cdad42871a5479eb5 {
    width: 90%;
    margin: 0 auto;
    background: white;
    padding: 1vw;
}
}

Thanks, much appreciated!