#slider { float:left; width:100%;position:relative; }

.slide1,.slide2 {float:left; width:100%; height:470px;}

.slide1 { 
background-image:
url('../images/slide/home-slide1-worcester-logo.png'),
url('../images/slide/home-slide1-img.png'),
url('../images/slide/home-image1-bg.png'),
url('../images/slide/home-slide1.png');
background-repeat:no-repeat,no-repeat,repeat-x,no-repeat; 
background-position:left 5% bottom 0%,left 23% bottom 11%,left 0px bottom 0%,left 0 bottom 80%;
background-size:auto auto,auto auto,auto auto, cover;}
.slide1 .wrapper { display:table;}

.slide2 { 
background-image:
url('../images/slide/home_banner-graphic2.png'),
url('../images/slide/home-banner-boiler-image.png'),
url('../images/slide/home-slide2.png');
background-repeat: no-repeat, no-repeat, no-repeat; 
background-position: left 38% top 50%, right 20% top 50%, right 0px bottom 50%;
background-size: 47% auto, 13% auto,100% auto;}

.slide-text { display:table-cell; height:470px; vertical-align: middle; padding:0 0 0 20%; text-align: center;}
.slide-text h2 { font-size:55px; line-height:60px; color:#fff; margin:0px; padding:0px;}
.slide-text p { margin:40px 0 0; padding:0px; font-size:26px; line-height:30px; color:#fff;}

@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, /* put webkit CSS here*/
.slide2 { 
background-image:
url('../images/slide/home_banner-graphic2.png'),
url('../images/slide/home-banner-boiler-image.png'),
url('../images/slide/home-slide2.png');
background-repeat: no-repeat, no-repeat, no-repeat; 
background-position: left 40% top 50%, right 25% top 50%, right 0px bottom 50%;
background-size: 60% auto, 30% auto,cover;}
}



@media only screen and ( max-width:1800px) {
.slide2 {background-position: left 25% top 40%, right 8% top 40%, left 0% bottom 0%;background-size: 65% auto, 18% auto, 100% auto;}	
}


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

}

@media only screen and ( max-width:1600px) {
.slide2   {height:400px;}	
.slide2 { background-position:left 34% top 50%, right 14% top 50%, right 0% top 0%;background-size: 55% auto, 15% auto, 100% 100%;}
}

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

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

@media only screen and ( max-width:1200px) {
.slide-text { text-align: right;vertical-align:middle; padding:0px;}
.slide-text h2 { color:#fff; font-size:40px; line-height:45px;}
.slide-text h2 b { color:#fff;}
.slide-text p { color:#fff;font-size:19px; line-height:30px;}
.slide-text p br,.slide-text h2 br { display:none;}



.slide2 {background-position:left 25% top 50%, right 6% top 50%, left 0% bottom 0%;background-size: 65% auto, 18% auto, 100% 100%;}	
}

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

}

@media only screen and ( max-width:768px) {
.slide-text { text-align: center;}
.slide-text h2 {font-size:30px; line-height:40px;}
.slide2 { 
background-image:
url('../images/slide/home_banner-graphic2.png'),
url('../images/slide/home-banner-boiler-image.png'),
url('../images/slide/home-slide2.png');
background-repeat: no-repeat, no-repeat, no-repeat; 
background-position: left 38% top 50%, right 0% top 50%, right 0px bottom 50%;
background-size: 95% auto, 0% auto,cover;}
}

@media only screen and ( max-width:640px) {
.slide1,.slide2,.slide-text  {height:350px;}
.slide-text p { color:#fff;font-size:17px; line-height:25px; margin:20px 0 0;}

.slide1 { background-position:left 5% bottom 0%,left 23% bottom 11%,left 0px bottom 0%,left 0 bottom 80%;background-size:auto 30%,auto 60%,auto auto, cover;}

}

@media only screen and ( max-width:560px) {	
.slide1,.slide2,.slide-text {height:300px;}
.slide-text h2 { color:#fff; font-size:30px; line-height:40px;}
.slide-text p { color:#fff;font-size:15px; line-height:22px;}

}

@media only screen and ( max-width:460px) {	
.slide-text h2 { color:#fff; font-size:20px; line-height:30px;}
}


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

}