#boiler-installations-banner,#service-repairs-banner,#plumbing-banner,#worcester-banner,#contactus-banner { float:left; width:100%; height:320px;}

#boiler-installations-banner .wrapper,#service-repairs-banner .wrapper,#plumbing-banner .wrapper,#worcester-banner .wrapper,#contactus-banner .wrapper { display:table;}

.slide-inn { text-align: right; display:table-cell; vertical-align: bottom;height:320px; padding:0 0 80px;}
.slide-inn h1 { color:#2d2e83; font-size:35px; line-height:40px;font-weight:normal; margin:0px; padding:0;}
.slide-inn h1 span { color:#6d6e71;}
.slide-inn .btn { margin:1% 0 0;}
.slide-inn .btn a { background:#005ba8; color:#fff; padding:6px 12px; border-radius:12px; font-size:17px; font-weight:bold; font-family:'Montserrat Light';}
.slide-inn .btn a:hover { background:#ed1d24;}

#boiler-installations-banner {  
background:
url('../images/jandfwilsonlogo.png'), 
url('../images/boiler-installations-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 20% top 28%,left 0 bottom 60%; 
background-size:auto auto,100% auto;}

#service-repairs-banner { 
background:
url('../images/jandfwilsonlogo.png'), 
url('../images/service-repairs-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 20% top 28%,left 0 bottom 60%; 
background-size:auto auto,100% auto;}


#plumbing-banner { 
background:
url('../images/jandfwilsonlogo.png'), 
url('../images/plumbing-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 20% top 28%,left 0 bottom 60%; 
background-size:auto auto,100% auto;}

#worcester-banner { 
background:
url('../images/jandfwilsonlogo.png'), 
url('../images/worcester-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 20% top 28%,left 0 bottom 60%; 
background-size:auto auto,100% auto;}

#contactus-banner { 
background:
url('../images/jandfwilsonlogo.png'), 
url('../images/contactus-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 20% top 28%,left 0 bottom 60%; 
background-size:auto auto,100% auto;}


@media only screen and ( max-width:1750px) {
#boiler-installations-banner { background-size:auto auto,150% auto;}
#service-repairs-banner { background-position:left 20% top 28%,left 30% bottom 60%; background-size:auto auto,110% auto;}
#plumbing-banner { background-size:auto auto,150% auto;}
#worcester-banner { background-position:left 20% top 28%,left 50% bottom 60%; background-size:auto auto,180% auto;}
#contactus-banner { background-position:left 20% top 28%,left 50% bottom 60%; background-size:auto auto,180% auto;}
}

@media only screen and ( max-width:1520px) {
.top-address { left:0; right:0; text-align:center;}
#service-repairs-banner { background-position:left 20% top 28%,left 50% bottom 60%; background-size:auto auto,115% auto;}
}

@media only screen and ( max-width:1350px) {
#service-repairs-banner { background-position:left 20% top 28%,left 60% bottom 60%; background-size:auto auto,130% auto;}
}


@media only screen and ( max-width:1200px) {
#boiler-installations-banner {background-position:left 20% top 48%,left 30% bottom 60%; background-size:30% auto,180% auto;}
#plumbing-banner { background-position:left 20% top 48%,left 40% bottom 60%;background-size:30% auto,190% auto; }
#service-repairs-banner { background-position:left 20% top 60%,left 70% bottom 60%; background-size:30% auto,200% auto;}
#worcester-banner { background-position:left 20% top 55%,left 50% bottom 60%; background-size:30% auto,220% auto;}
#contactus-banner { background-position:left 15% top 60%,left 50% bottom 60%;background-size:30% auto,240% auto;}

.slide-inn h1 { color:#302c81; font-size:26px;}
}

@media only screen and ( max-width:1000px) {
#boiler-installations-banner,#service-repairs-banner,#plumbing-banner,#worcester-banner,#contactus-banner,.slide-inn  { height:300px;}

.top-address li { margin:1% 1% 0 0; font-size:18px; line-height:20px; display:inline-block;}

#boiler-installations-banner {background-position:left 20% top 48%,left 30% bottom 60%; background-size:20% auto,220% auto;}
#plumbing-banner { background-position:left 20% top 55%,left 50% bottom 60%;background-size:30% auto,230% auto; }
#worcester-banner { background-position:left 15% top 55%,left 45% bottom 60%; background-size:30% auto,230% auto;}
}

@media only screen and ( max-width:767px) {
#boiler-installations-banner,#service-repairs-banner,#plumbing-banner,#worcester-banner,#contactus-banner,.slide-inn  {height:260px;}

.slide-inn { text-align:center; padding:0px; vertical-align:middle;}

#boiler-installations-banner { 
background:
url('../images/jandfwilsonlogowotext.png'), 
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/boiler-installations-banner.png'); 
background-repeat:no-repeat,no-repeat; 
background-position:left 10% top 50%,left 0 bottom 0,left 30% bottom 60%;
background-size:30% auto,100% 100%,220% auto;}

#top-address .wrapper { width:100%; margin:0px;}
.top-address li { margin:0px;/*color:#fff*/; font-size:15px; margin:3px 5px 0;font-family:'Montserrat Light';}
.top-address li a { color:#fff; font-size:15px;font-family:'Montserrat Light';}

.slide-inn { vertical-align: bottom; padding:50px 0; text-align:right;}
.slide-inn h1 { font-size:19px; color:#fff;}

#service-repairs-banner { 
background:
url('../images/jandfwilsonlogowotext.png'), 
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/service-repairs-banner.png'); 
background-repeat:no-repeat,no-repeat,no-repeat; 
background-position:left 10% top 50%,left 0 bottom 0,left 70% bottom 60%;
background-size:30% auto,100% 100%,220% auto;}

#plumbing-banner { 
background:
url('../images/jandfwilsonlogowotext.png'), 
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/plumbing-banner.png'); 
background-repeat:no-repeat,no-repeat,no-repeat; 
background-position:left 10% top 50%,left 0 bottom 0,left 60% bottom 60%;
background-size:30% auto,100% 100%,230% auto;}

#worcester-banner { 
background:
url('../images/jandfwilsonlogowotext.png'), 
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/worcester-banner.png'); 
background-repeat:no-repeat,no-repeat,no-repeat; 
background-position:left 10% top 50%,left 0 bottom 0,left 50% bottom 30%;
background-size:30% auto,100% 100%,240% auto;}

#contactus-banner { 
background:
url('../images/jandfwilsonlogowotext.png'), 
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/contactus-banner.png'); 
background-repeat:no-repeat,no-repeat,no-repeat; 
background-position:left 10% top 50%,left 0 bottom 0,left 70% bottom 60%;
background-size:30% auto,100% 100%,240% auto;}

}

@media only screen and ( max-width:640px) {
.top-address li,.top-address li a { font-size:13px;}

#boiler-installations-banner,#service-repairs-banner,#plumbing-banner,#worcester-banner,#contactus-banner,.slide-inn  { height:200px; }

#boiler-installations-banner {background-position:left 10% top 50%,left 0 bottom 0,left 40% bottom 60%;background-size:30% auto,100% 100%,250% auto;}
#service-repairs-banner {background-position:left 10% top 50%,left 0 bottom 0,left 60% bottom 60%;background-size:30% auto,100% 100%,300% auto;}
#plumbing-banner {background-position:left 10% top 50%,left 0 bottom 0,left 60% bottom 60%;background-size:30% auto,100% 100%,300% auto;}

}

@media only screen and ( max-width:520px) {
.slide-inn .btn a {padding: 9px 15px;font-size: 13px;}
.slide-inn h1 { font-size:15px;}
.top-address li { font-size:13px;}

#boiler-installations-banner {background-position:left 10% top 70%,left 0 bottom 0,left 40% bottom 60%;background-size:30% auto,100% 100%,280% auto;}
#service-repairs-banner {background-size:30% auto,100% 100%,450% auto;}
#worcester-banner { background-position:left 10% top 50%,left 0 bottom 0,left 50% bottom 30%;background-size:30% auto,100% 100%,280% auto;}
#contactus-banner { background-position:left 55% top 70%,left 0 bottom 0,left 50% bottom 30%;background-size:30% auto,100% 100%,280% auto;}

}

@media only screen and ( max-width:420px) {
.top-address li { font-size:12px;}

#boiler-installations-banner {background-position:left 10% top 70%,left 0 bottom 0,left 40% bottom 60%;background-size:30% auto,100% 100%,400% auto;}
#service-repairs-banner {background-position:left 10% top 75%,left 0 bottom 0,left 60% bottom 60%;background-size:30% auto,100% 100%,500% auto;}
#plumbing-banner,#worcester-banner,#contactus-banner {background-size:30% auto,100% 100%,370% auto;}

#plumbing-banner {background-position:left 10% top 70%,left 0 bottom 0,left 60% bottom 60%;}

.slide-inn h1 { font-size:13px; }

.top-address li a { line-height:20px; font-size:13px;}

}

@media only screen and ( max-width:320px) {
.top-address li { font-size:11px;}
}