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

.slide1,.slide2,.slide3,.slide4 {float:left; width:100%; height:550px; position:relative;}

.slide1 { 
background-image:
url('../images/slide/slide2-boiler-image.png'),
url('../images/slide/slide2-graphic1.png'),
url('../images/slide/slide1.png');
background-repeat: no-repeat, no-repeat, no-repeat; 
background-position: left 40% top 50%, right 25% top 50%, right 0px bottom -590px;
background-size: 757px 250px, 230px 260px, 1980px 1506px;}

.slide2 {
background-image: 
url('../images/slide/slide2.png');
background-repeat: no-repeat;
background-position:left 0 top 25%; 
background-size:100% auto;}

.slide3 {
background-image: 
url('../images/slide/slide3.png');
background-repeat: no-repeat;
background-position:left 0 top 25%; 
background-size:100% auto;}

.slide4 {
background-image: 
url('../images/slide/slide4.png');
background-repeat: no-repeat;
background-position:left 0% top 0%; 
background-size:110% auto;}

.slidetext { text-align: center; position:absolute; transform:translate(-0%,-50%); left:0%; right:0; top:50%; z-index:9999;}
.slidetext h1 { color:#fff; font-size:50px; line-height:60px; margin-bottom:10px; text-transform:uppercase;font-family:'T Bold';}
.slidetext h2 { color:#fff; font-size:32px; line-height:32px; text-transform:uppercase; font-weight: normal; font-family:'T Book Reg';}
.slidetext h1 span { color:#fff;}

.slidetext .btn { float:left; width:100%; margin-top:2%;}
.slidetext .btn p { color:#fff; border-radius:50px; border:3px solid #fff; padding:15px 25px; font-size:25px; background:#e4842a; display:inline-block;font-family:'Montserrat Regular';}
.slidetext .btn p a { color:#fff;}

.slidetext3 { text-align: center; position:absolute; transform:translate(-8%,-40%);  right:8%; top:40%; z-index:9999;}
.slidetext3 h1 { color:#000000; font-size:50px; line-height:60px; margin-bottom:10px;font-family:'T Bold';}
.slidetext3 p {color:#000000;}
.slidetext3 p a { color:#27937e;}
.slidetext3 h2 { color:#000000; font-size:38px; font-weight:normal; line-height:40px; display:inline-block; width:100%; font-family:'T Book Reg';}
.slidetext3 h1 span { color:#fff;}
.vaillant-logo {  text-align: center; display: inline-block !important; padding:10px 0;}
.vaillant-logo img { width:auto !important;}


.lifestyle {float:left; width:100%; height:550px; position:relative;}
.lifestyle .wrapper{width:1170px; float:none; margin:0 auto; position:relative; display:table;}
.lifestyle {
background-image: 
url('../images/slide/wireless.png'),
url('../images/slide/10year-guarantee.png'),
url('../images/slide/wb-logo-banner.png'),
url('../images/slide/white-strip.png'),
url('../images/slide/lifestyle-boiler-bg.png');
background-repeat: no-repeat, no-repeat, no-repeat, repeat-x, no-repeat;
background-position: left 6% bottom 25%, right 2% top 50%, left 12% bottom 0%, left 0% bottom 0%, left 0% top 0%; 
background-size: auto auto, auto auto, auto auto, auto auto, cover;}

.lifestyle .txtblock{display:table-cell; vertical-align:middle; height:550px; width:30%;}
.lifestyle .txtblock h2{color:#FFF; font-size:35px; line-height:35px; font-family: 'Montserrat Bold'; padding:0px 0; margin:0;}
.lifestyle .txtblock p{color:#FFF; font-size:22px; line-height:30px; font-family: 'Montserrat Regular'; padding:10px 0; margin:0;}
.lifestyle .txtblock p span{font-weight:bold;}
.lifestyle .txtblock a.btn{font-size:18px; display:inline-block; background:#FFF; border-radius:15px; color:#252525; font-family: 'Montserrat Regular'; padding:5px 15px; margin:5px 0; text-decoration:none;}


@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, /* put webkit CSS here*/
.slide1 { float:left;width:100%;
	background-image:
	url('../images/slide/slide2-boiler-image.png'),
	url('../images/slide/slide2-graphic1.png'),
	url('../images/slide/slide2.png');
	background-repeat: no-repeat,no-repeat, no-repeat;
	background-size: 810px 257px, 247px 294px, 100% 1200px;
	background-position: 
	top 20% left 0,
	top 20% right 0,
	top 0 left 0;}	 
}

@media only screen and ( max-width:1800px) {
.slide1 {
background-position: left 5% top 10%, right 5% top 10%, left 0px bottom 0px;
background-size: 65% 60%, 260px 300px, 1980px 1506px;
transform: translate(-50%, 0), transform: translate(-50%, -75%), transform: translate(0, 0);}	

.slide3 {
background-position:left 0 top 25%; 
background-size:auto auto;}
}


@media only screen and ( max-width:1500px) {
.lifestyle .wrapper{width:60%;}	
.lifestyle {
background-position: left 6% bottom 50%, right 2% top 50%, left 5% bottom 0%, left 0% bottom 0%, right 20% top 0%; 
background-size: auto auto, auto auto, auto auto, auto auto, cover;}
}

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

.slide1 { 
background-position: left 5% top 50%, right 5% top 50%, right 0px bottom -590px;
background-size: 70% auto, auto auto, auto auto;}

.slidetext3 { top:40%; right:0;}
.slidetext3 h1 br { display:none;}
.slidetext3 h1 { font-size:35px; line-height:40px; margin:0px;}
.slidetext3 p {}
}

@media only screen and ( max-width:1300px) {
.lifestyle .txtblock h2{font-size:40px; line-height:35px;}
.lifestyle .txtblock p{font-size:20px; line-height:28px;}
.lifestyle .txtblock a.btn{font-size:20px;}
}

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

	
.slidetext3 {  text-align:center; width:90%; left:10%;}
.slidetext3 h1 { color:#fff; font-size:35px; line-height:40px;}
.slidetext3 p { color:#fff; font-size:16px; line-height:22px;}
.slidetext3 p br { display:none;}
.slidetext3 h2 { color:#fff;}
.slide3 {background:linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url('../images/slide/slide3-res.png'); background-position:top 0 center; background-repeat:no-repeat;}


}


@media only screen and ( max-width:1170px) {
.slide1 {background-position: left 5% top 10%, right 5% top 10%, left 0px bottom 0px;background-size: 65% 60%, 210px 235px, 1980px 1506px;transform: translate(-50%, 0),translate(-50%, -75%), translate(0, 0);}	


}

@media only screen and ( max-width:1100px) {
.slide1 {
background-position: left 5% top 40%, right 5% top 40%, left 0px bottom 0px;
background-size: 65% 60%, 210px 235px, 1980px 1506px;
transform: translate(-50%, 0),translate(-50%, -75%), translate(0, 0);}	

.lifestyle .wrapper{width:100%;}	
.lifestyle {min-height:400px;}	
.lifestyle .txtblock{height:400px; text-align:center;}
}

@media only screen and ( max-width:940px) { 
.slidetext3 h1 { color:#fff; font-size:30px; line-height:35px;}
.slidetext3 h2 { font-size:32px; line-height:35px;}
}

@media only screen and ( max-width:767px) {
.slide1, .slide2, .slide3, .slide4,.lifestyle,.lifestyle .txtblock {height:400px;}
.slidetext h1 { font-size:40px; line-height:40px; margin:0px; padding:0px;}
.slidetext h2 { font-size:25px; line-height:30px;}

.slide1 { background-position: left 10% top 50%, right 10% top 50%, right 0% top 0%;background-size: 60% auto, 20% auto, 100% 100%;}	

.slidetext3 h1 { color:#fff; font-size:26px; line-height:30px;}
.slidetext3 h2 { font-size:25px; line-height:30px;}

.lifestyle {
background-image: 
url('../images/slide/wireless.png'),
url('../images/slide/10year-guarantee.png'),
url('../images/slide/wb-logo-banner.png'),
url('../images/slide/white-strip.png'),
linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),
url('../images/slide/lifestyle-boiler-bg.png');
background-repeat: no-repeat, no-repeat, no-repeat, repeat-x, no-repeat, no-repeat;
background-position: left 5% bottom 55%, right 2% bottom 8%, left 5% bottom 3%, left 0% bottom 0%, left 0% top 0%, left 90% top 0%; 
background-size: 10% auto, 10% auto, 15% auto, auto auto, 100% 100%, cover;}
}

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

.slidetext { margin:0 auto; width:90%;}

.slidetext .btn p span {  padding-bottom:5px;}
.slidetext .btn p { padding:15px 10px; border-radius:18px; font-size:18px;}

.slidetext3 { top:42%;}
.vaillant-logo { padding:0px;}
.slidetext3 h1 { padding:0px; font-size:20px; line-height:26px;}
.slidetext3 p { font-size:14px; line-height:20px;}
.slidetext3 h2 { font-size:19px; line-height:22px;}


.lifestyle {
background-position: left 5% bottom 45%, right 2% bottom 8%, left 5% bottom 3%, left 0% bottom 0%, left 0% top 0%, left 90% top 0%; 
background-size: 8% auto, 10% auto, 12% auto, auto auto, 100% 100%, cover;}

.lifestyle .txtblock h2{font-size:30px; line-height:25px;}
.lifestyle .txtblock p{font-size:18px; line-height:26px;}
.lifestyle .txtblock p br{display:none;}
.lifestyle .txtblock a.btn{font-size:18px;}

}


@media only screen and ( max-width:540px) {
/*.slide1, .slide2, .slide3, .slide4,.lifestyle,.lifestyle .txtblock {height:350px;}
*/

.slidetext .btn p a { font-size:18px;}
.slidetext h1 { font-size:25px; line-height:30px; margin:0px; padding:0px;}
.slidetext h2 { font-size:20px; line-height:25px;}

.slide2 {background-position: top 0% left 25%;}


.slide1 {
    background-position: left 20% top 30%, right 50% bottom 15%, right 0% top 0%;
    background-size: 80% auto, 20% auto, 100% 100%;
}
}


@media only screen and ( max-width:480px) {	
.slidetext { top:40%;}
.slidetext .btn p { padding:10px 10px;}
.slidetext .btn p a { font-size:15px;}

.lifestyle {
background-position: left 5% bottom 30%, right 2% bottom 8%, left 5% bottom 3%, left 0% bottom 0%, left 0% top 0%, left 90% top 0%; 
background-size: 12% auto, 12% auto, 15% auto, auto auto, 100% 100%, cover;}
}


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

}