Responsive Header

Hello.
I have a problem on the homepage that is not responsive. Indeed I can not give a correct image size to get good results on a mobile consulation.
Thank you for your help.

Site web : http://www.lesmaisonsdelabbaye.eu

Code CSS Designed & Layout
#masthead.site-header {
background-image: none;
min-height: 0;
}
#masthead .layer {
background: #39312d;
min-height: 0;
}

#masthead h1.site-title a {
color: white;
text-shadow : 2px 0 0 black;
}
#masthead h2.site-description {
font-weight: 100;
font-size: 20px;
margin-top: 10px;
color: white;
text-shadow: 2px 0px 0px black;
}

.home #masthead {
background-image: url(http://lesmaisonsdelabbaye.eu/wp-content/uploads/2017/05/Entete_pano_1000_255.jpg);
}

.home #masthead .layer {
background: transparent;
}
.home .site-branding {
padding: 160px 0 ;
}
.page #masthead .container {
border-bottom: none;
}

.site-branding {
padding: 20px 0;
}