#bathrooms-wetrooms-banner,
#mobility-adapted-bathrooms-banner,
#contactus-banner{ padding:0; position:relative; height:350px;}

#bathrooms-wetrooms-banner { 
background:
url('../images/banner-radius.png'),
url('../images/bathrooms-wetrooms-banner.jpg'); 
background-repeat:no-repeat, no-repeat;
background-position: left 30% bottom 0%, left 0% bottom 18%;
background-size: auto 45%, 100% auto;
}

#mobility-adapted-bathrooms-banner { /*height:975px;*/
background:
url('../images/banner-radius.png'),
url('../images/mobility-adapted-bathrooms-banner.jpg'),
linear-gradient(to right, #d3d4cf, #f6efe9); 
background-repeat:no-repeat, no-repeat, no-repeat;
background-position: left 30% bottom 0%, left 50% top 0%, left 50% top 0%;
background-size: auto 45%, auto 100%, 105% auto;
}

#contactus-banner { 
background:
url('../images/banner-radius.png'),
url('../images/contactus-banner.jpg'); 
background-repeat:no-repeat, no-repeat;
background-position: left 30% bottom 0%, left 90% top 82%;
background-size: auto 45%, 100% auto;
}

.slide-in {width:275px; display:block; position:absolute;}
.slide-in h1{text-align:center; font-size:30px; line-height:35px; color:#00aeef; font-family:'Montserrat Bold';}

#bathrooms-wetrooms-banner .slide-in {bottom:5%; left:26%;}
#mobility-adapted-bathrooms-banner .slide-in {bottom:0%; left:26%;}
#contactus-banner  .slide-in {bottom:3%; left:26%;}


@media only screen and ( max-width:1780px) {
#bathrooms-wetrooms-banner,
#mobility-adapted-bathrooms-banner,
#contactus-banner{height:350px;}
	
#bathrooms-wetrooms-banner { 
background-position: left 25% bottom 0%, left 0% bottom 18%;
background-size: auto 50%, 100% auto;
}

#mobility-adapted-bathrooms-banner {
background-position: left 25% bottom 0%, left 45% top 0%;
background-size: auto 50%, auto 100%, 100% auto;
}

#contactus-banner { 
background-position: left 25% bottom 0%, left 90% top 82%;
background-size: auto 50%, 100% auto;
}

.slide-in {width:27%;}
.slide-in h1{font-size:30px; line-height:35px;}

#bathrooms-wetrooms-banner .slide-in {bottom:0%; left:24%; transform:translate(-25%,-10%);}
#mobility-adapted-bathrooms-banner .slide-in {bottom:0%; left:24%; transform:translate(-25%,-0%);}
#contactus-banner  .slide-in {bottom:0%; left:24%; transform:translate(-25%,-10%);}
}

@media only screen and ( max-width:1320px) {	

#bathrooms-wetrooms-banner { 
background-position: left 15% bottom 0%, left 0% bottom 18%;
background-size: auto 50%, 100% auto;
}

#mobility-adapted-bathrooms-banner {
background-position: left 15% bottom 0%, left 45% top 0%;
background-size: auto 50%, auto 100%, 100% auto;
}

#contactus-banner { 
background-position: left 15% bottom 0%, left 90% top 82%;
background-size: auto 50%, 100% auto;
}

.slide-in {width:27%;}
.slide-in h1{font-size:25px; line-height:30px;}

#bathrooms-wetrooms-banner .slide-in {bottom:5%; left:18%; transform:translate(-25%,-10%);}
#mobility-adapted-bathrooms-banner .slide-in {bottom:5%; left:18%; transform:translate(-25%,-0%);}
#contactus-banner  .slide-in {bottom:5%; left:18%; transform:translate(-25%,-10%);}
}

@media only screen and ( max-width:980px) {
#bathrooms-wetrooms-banner,
#mobility-adapted-bathrooms-banner,
#contactus-banner{height:250px;}	
.menu { width:100% !important;}

#bathrooms-wetrooms-banner { 
background-position: left 50% bottom 0%, left 0% bottom 18%;
background-size: auto 60%, 100% auto;
}

#mobility-adapted-bathrooms-banner {
background-position: left 50% bottom 0%, left 45% top 0%;
background-size: auto 65%, auto 100%, 100% auto;
}

#contactus-banner { 
background-position: left 50% bottom 0%, left 90% top 82%;
background-size: auto 60%, 100% auto;
}

.slide-in {width:100%;}
.slide-in h1{font-size:25px; line-height:30px;}

#bathrooms-wetrooms-banner .slide-in {bottom:5%; left:25%; transform:translate(-25%,-10%);}
#mobility-adapted-bathrooms-banner .slide-in {bottom:5%; left:25%; transform:translate(-25%,-0%);}
#contactus-banner  .slide-in {bottom:5%; left:25%; transform:translate(-25%,-10%);}
}

@media only screen and ( max-width:767px) {
.slide-in h1{font-size:20px; line-height:24px;}

#bathrooms-wetrooms-banner .slide-in {bottom:8%; left:50%; transform:translate(-50%,-10%);}
#mobility-adapted-bathrooms-banner .slide-in {bottom:8%; left:50%; transform:translate(-50%,-10%);}
#contactus-banner  .slide-in {bottom:8%; left:50%; transform:translate(-50%,-10%);}
}

@media only screen and ( max-width:620px) {
#bathrooms-wetrooms-banner,
#mobility-adapted-bathrooms-banner,
#contactus-banner{height:200px;}
}