.owl-dots {display:none;}
.slide1, .slide2, .slide3,.aircon-banner {float:left; width:100%; height:660px; position:relative;}


.slide-text { float:left; width:100%; margin:5% 0 0;}
.slide-text h1 { color:#0084cc; font-size:42px;  padding:0; line-height:40px;  font-family: 'dinbold'; font-weight:bold; text-align:right; margin:20px 0 10px 0;}

.slide-text .btn { float:right;  margin:3% 1% 0;}
.slide-text .btn a { background:#0084cc; color:#fff; border-radius:28px; padding:10px 25px; font-size:24px;}
.slide-text .btn a:hover { background:#036da7;}

.slidestart {
    background-color: #009fe3;
    background-image: url(../images/slide/homepage-banner.png),url(../images/slide/worcester-logo-banner.png), url(../images/slide/bottom-banner-pattern.png), url(../images/slide/stay-safe-logo.png);
    background-repeat: no-repeat;
    background-position: left top,bottom right 35px,bottom left 600px,bottom 200px right 2%;
    background-size: 600px 100%,150px auto,65% auto,150px auto;
    background-repeat: no-repeat;padding-left: 630px;padding-right: 220px;}
.slidestart .slide-text h2{color: #ffffff}
.slidestart .wrapper{height: 660px;width: 100%;display: table-cell;vertical-align: middle;max-width: 860px}
.slidestart .slide-text h2 {color: #ffffff;font-size: 30px;line-height: 1.3;
}
.slidestart .wrapper .slide-text{display: table-cell;}

.slide1 { 
background-image:
url('../images/slide/home-banner-van.png'),
url('../images/slide/home-banner-engineer.png'),
url('../images/slide/dog.png'),
url('../images/slide/home-banner-background.png');
background-color:#75ceec;
background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,no-repeat; 
background-position: bottom 5% right 45%, bottom 6% left 50%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;
background-size:auto auto,0% auto,auto auto,100% auto, 100% 100%;
animation: animatevan 4s normal 1;
}
@keyframes animatevan {
    from {background-position: bottom 5% right -50%, bottom 6% left 50%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 5% right 45%, bottom 6% left 50%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
}

.slide2 {
background-image:
url('../images/slide/guarantee.png'),
url('../images/slide/wb-logo.png'),
url('../images/slide/cat-background.png');
background-repeat:no-repeat, no-repeat, no-repeat; 
background-position:right 35% bottom 15%, right 21.4% bottom 0%, left 0% bottom 0%;
background-size:auto auto, auto auto, 100% auto;
}
.slide2 .slide-text {float: right; width:68%; margin:14% 0 0;}
.slide2 h2{width:auto; display:inline-block; background:#006198; padding:40px; font-size:45px; color:#FFF; font-family: 'Montserrat Regular';}
.slide2 h2 span{font-family:'Montserrat Bold';}
.slide2 h3{width:auto; display:inline-block; background:#51247f; padding:30px; margin:-10px 0 0 40px; font-size:35px; color:#FFF; font-family: 'Montserrat Regular';}

.slide3 {
background-image:
url('../images/slide/guarantee.png'),
url('../images/slide/home-banner3_worcester-logo.png'),
url('../images/slide/home-banner3_600px.png');
background-repeat:no-repeat, no-repeat, no-repeat; 
background-position:right 42% top 40%, right 42% bottom 30%, top 50% right 0%;
background-size:auto auto, auto auto, 100% auto;
}
.slide3  .slide-text{position:absolute; top:10%;}
.slide3 h2,.slide3 h2 span{font-size:150px; color:#40aae0; font-family: 'dinbold'; display:inline-block;}

.slide3 h2 span .greater{display: inline-block;float: left;line-height: 0.8;padding: 0px 10px 0px 0;}
.slide3 h2 span:not(.greater){font-size:60px; line-height:60px; color:#0084c9; margin: 0 0 0 0; display:inline-block;}
.slide3 p{font-size:30px; line-height:40px; color:#454545; font-family: 'Montserrat Regular';}

.slide3 .slide-text .btn {float: left;margin: 20px 0 0;}
.slide3 .slide-text .btn a{background: #73c200;padding: 6px 25px;}
.slide3 .slide-text .btn a:hover {background: #00aeef;}


.aircon-banner {
background-image:
url('../images/air-con-homepage-banner1.png');
background-repeat:no-repeat; 
background-position:top 0% right 0%;
background-size:cover;
}
.aircon-banner  .slide-text{position:absolute; top:8%;}
.aircon-banner h2 {font-size:46px; line-height:56px; color:#007cc5; font-family: 'dinbold'; display:inline-block;}
.aircon-banner p {font-size:26px; line-height:36px; color:#009fe3; font-family: 'Montserrat Bold';}

.aircon-banner .slide-text .btn {float: left;margin: 10px 0 0;}
.aircon-banner .slide-text .btn a{background: #009fe3;padding: 6px 25px; border-radius: 12px;}
.aircon-banner .slide-text .btn a:hover {background: #007cc5;}



@media only screen and ( max-width:1800px) {
.slide1 { 
background-position: bottom 5% right 12%, bottom 6% left 50%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;
background-size:auto auto,0% auto, auto auto, 100% auto, 100% 100%;
}	
@keyframes animatevan {
    from {background-position: bottom 5% right -50%, bottom 6% left 50%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 5% right 12%, bottom 6% left 50%, auto auto, left 0% bottom 0%, left 0% bottom 0%;}
}
}


@media only screen and ( max-width:1520px) {
.slide1, .slide2,.slide3,.aircon-banner { height:600px;}
.slide1 { 
background-position: bottom 6% right 12%, bottom 8% right 55%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;
background-size: auto 30%,0% 32%, auto auto, 100% auto,100% 100%;}
@keyframes animatevan {
    from {background-position: bottom 6% right -50%, bottom 8% right 55%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 6% right 12%, bottom 8% right 55%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
}
.slide2 {
background-position:right 30% bottom 15%, right 6% bottom 0%, left 0% bottom 0%;
background-size:15% auto, 15% auto,cover;}
.slide2 .slide-text {width:55%; margin:5% 0 0 0;}
.slide2 h2{padding:30px; font-size:35px;}
.slide2 h3{padding:22px; margin:-10px 0 0 40px; font-size:28px;}


}

@media only screen and ( max-width:1200px) {
.slidestart .wrapper {height: 500px;}
    .slidestart {
    background-color: #009fe3;
    background-image: url(../images/slide/homepage-banner.png),url(../images/slide/worcester-logo-banner.png), url(../images/slide/bottom-banner-pattern.png), url(../images/slide/stay-safe-logo.png);
    background-repeat: no-repeat;
    background-position: left top,bottom right 35px,bottom left 600px,bottom 200px right 2%;
    background-size: 400px 100%,150px auto,65% auto,150px auto;
    background-repeat: no-repeat;
    padding-left: 410px;
    padding-right: 200px;
}
.slide1,.slide2,.slide3,.aircon-banner { height:500px;}
.slide-text h1 { font-size:30px; text-align:center;} 
.slide-text { margin:5% 0 0;}
.slide-text .btn { text-align:center; float:none;}
.slide-text .btn a {  padding: 6px 19px; font-size:18px;}

.slide2 {
background-position:right 30% bottom 15%, right 6% bottom 0%, left 0% bottom 0%;
background-size:15% auto, 15% auto,cover;
}
.slide2 .slide-text {width:55%; margin:5% 0 0 0;}
.slide2 h2{padding:24px; font-size:30px;}
.slide2 h3{padding:18px; margin:-10px 0 0 40px; font-size:22px;}

.slide3 {
background-position: right 42% top 35%, right 42% bottom 30%, top 60% right 0%;
background-size: 12% auto, 12% auto, 100% auto;
}
.slide3  .slide-text{position:absolute; top:10%;}
.slide3 h2,.slide3 h2 span{font-size:100px;}
.slide3 h2 span:not(.greater){font-size:40px; line-height:40px; margin: 0 0 0 0;}
.slide3 p{font-size:20px; line-height:30px;}
}



@media only screen and ( max-width:1150px) { 
.aircon-banner {
    background: linear-gradient(rgba(0,0,0,0.4),rgba(0,0,0,0.4)), url('../images/air-con-homepage-banner1.png');
    background-position-x: 0%, 0%;
    background-position-y: 0%, 0%;
    background-repeat: repeat, repeat;
    background-size: auto, auto;
    background-repeat: no-repeat, no-repeat;
    background-position: left 0% top 0%, top 0% right 0%;
    background-size: 100% 100%,cover;}
	
.aircon-banner .slide-text { position: inherit; vertical-align: middle; text-align: center; margin: 30px 0 0; float: none; display: inline-block;}	
.aircon-banner .slide-text .btn {text-align: center; float: none; display: inline-block;}
.aircon-banner h2 { color: #fff;}	
.aircon-banner p {color: #fff;}

}

@media only screen and ( max-width:960px) { 
.slidestart .wrapper {height: 400px;}
.slidestart {
    background-color: #009fe3;
    background-image: url(../images/slide/homepage-banner.png),url(../images/slide/worcester-logo-banner.png), url(../images/slide/bottom-banner-pattern.png), url(../images/slide/stay-safe-logo.png);
    background-repeat: no-repeat;
    background-position: left top,bottom right 10px,bottom left 60px,bottom 200px right 10px;
    background-size: 320px 100%,100px auto,100% auto,100px auto;
    background-repeat: no-repeat;
    padding-left: 330px;
    padding-right: 140px;
}
.slidestart .slide-text h2 {
    color: #ffffff;
    font-size: 19px;
    line-height: 1.4;
}
.slide3 .slide-text {position: absolute;top: 0%;}
.slide1,.slide2,.slide3 { height:400px;}
.slide-text h1 { font-size:25px; text-align:center;padding-left: 30%} 
.slide-text .btn { margin:2% 0 0;}

.slide1 { 
background-position: bottom 8% right 15%, bottom 6% left 45%, left 38% bottom 8%, left 0% bottom 0%, left 0% bottom 0%;
background-size: auto 26%,0% 30%, auto 12%, 100% auto,100% 100%;}
@keyframes animatevan {
    from {background-position: bottom 8% right -50%, bottom 6% left 45%, left 38% bottom 8%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 8% right 15%, bottom 6% left 45%, left 38% bottom 8%, left 0% bottom 0%, left 0% bottom 0%;}
}
.slide2 {
background-position:right 30% bottom 15%, right 6% bottom 0%, left 0% bottom 0%;
background-size:15% auto, 15% auto,cover;
}
}

@media only screen and ( max-width:767px) {
.slidestart .wrapper {
    height: 300px;
}
.slidestart {
    background-color: #009fe3;
    background-image: url(../images/slide/homepage-banner.png),url(../images/slide/worcester-logo-banner.png), url(../images/slide/bottom-banner-pattern.png), url(../images/slide/stay-safe-logo.png);
    background-repeat: no-repeat;
    background-position: left top,bottom right 10px,bottom left 60px,bottom 140px right 10px;
    background-size: 230px 100%,100px auto,100% auto,100px auto;
    background-repeat: no-repeat;
    padding-left: 240px;
    padding-right: 140px;}
.slidestart .slide-text h2{ font-size: 17px;}
.slide1,.slide2,.slide3,.aircon-banner { height:300px;}
.slide-text h1 { font-size:22px; text-align:center;} 
.slide-text .btn a {  padding: 6px 18px; font-size:16px;}

.slide2 {
background-position:right 30% bottom 15%, right 6% bottom 0%, left 0% bottom 0%;
background-size:15% auto, 15% auto,cover;}
.slide2 .slide-text {margin:5% 0 0 0;}
.slide2 h2{padding:18px; font-size:24px;}
.slide2 h3{padding:12px; margin:-10px 0 0 40px; font-size:20px;}

.slide3 {
background-position: right 42% top 30%, right 42% bottom 30%, top 50% right 0%;
background-size: 12% auto, 15% auto, 100% auto;}
.slide3  .slide-text{position:absolute; top:20%;}
.slide3 h2,.slide3 h2 span{font-size:70px;}
.slide3 h2 span:not(.greater){font-size:30px; line-height:30px; margin: 0 0 0 0;}
.slide3 p{font-size:20px; line-height:30px;}
.slide3 h2 span .greater{font-size: 60px;}
.slide3 .slide-text {position: relative;top: 0%;}
.slide-text .btn {float: left; margin: 2% 0.5% 0;}
.slide-text .btn a {  padding: 4px 12px; font-size:16px;}
	
.aircon-banner h2 { font-size: 30px; line-height:40px;}	
.aircon-banner p {font-size:21px;  line-height: 30px;}
}
@media only screen and ( max-width:660px) {
    .slidestart .wrapper {height: 300px;}
    .slidestart {
    background-color: #009fe3;
    background-image: url(../images/slide/worcester-logo-banner.png), url(../images/slide/bottom-banner-pattern.png), url(../images/slide/stay-safe-logo.png);
    background-repeat: no-repeat;
    background-position: bottom right 10px,bottom left 0,bottom 100px right 10px;
    background-size: 70px auto,100% auto,70px auto;
    background-repeat: no-repeat;
    padding-left: 15px;
    padding-right: 90px;
}
}
@media only screen and ( max-width:640px) {

.slidestart .wrapper {
    height: 250px;
}
.slide1, .slide2,.slide3,.aircon-banner { height:250px;}
.slide-text h1 { font-size:20px; text-align:center; line-height:24px;} 

.slide1 { 
background-position: bottom 8% right 12%, bottom 6% left 45%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;
background-size: auto 35%,0% 40%, auto auto, 100% auto,100% 100%;}
@keyframes animatevan {
    from {background-position: bottom 8% right -50%, bottom 6% left 45%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 8% right 12%, bottom 6% left 45%, left 38% bottom 10%, left 0% bottom 0%, left 0% bottom 0%;}
}
.slide2 {
background-position: right 25% bottom 15%, right 5% bottom 0%, left 0% bottom 0%;
background-size: 15% auto, 15% auto,cover;
}
.slide2 .slide-text {width:60%; margin:8% 0 0 0;}
.slide2 h2{padding:10px; font-size:18px;}
.slide2 h3{padding:6px; margin:-10px 0 0 40px; font-size:12px;}

.slide3 {
background-position: right 42% top 30%, right 42% bottom 20%, top 50% right 0%;
background-size: 12% auto, 18% auto, 100% auto;}
.slide3  .slide-text{position:absolute; top:20%;}
.slide3 h2,.slide3 h2 span{font-size:70px;}
.slide3 h2 span:not(.greater){font-size:25px; line-height:25px; margin: 0 0 0 0;}
.slide3 p{font-size:18px; line-height:26px;}
.slide3 .slide-text { position: relative; top: 0%;}

.aircon-banner h2 br,.aircon-banner p br { display: none;}
.aircon-banner h2 { font-size: 22px; line-height:30px;}	
.aircon-banner p {font-size:17px;  line-height:26px;}	
}

@media only screen and ( max-width:576px) {
    .slidestart .slide-text h2 {
    font-size: 12px;
}
.slidestart .wrapper {
    height: 200px;
}
    .slide3 h2 span .greater {font-size: 45px;}
    .slide3 p {font-size: 12px;line-height: 17px;}
    .slide3 .slide-text .btn{margin-top: 5px;}
    .slide3 .slide-text .btn a{font-size: 13px;padding: 6px 15px;}
}
@media only screen and ( max-width:540px) {
.slide1 { 
background-position: bottom 8% right 10%, bottom 6% left 50%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;
background-size: auto 28%,0% 30%, auto 10%, 100% auto,100% 100%;}
@keyframes animatevan {
    from {background-position: bottom 8% right -50%, bottom 6% left 50%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 8% right 10%, bottom 6% left 50%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;}
}
.slide3 {
background-position: right 42% top 40%, right 42% bottom 20%, top 50% right 0%;
background-size: 12% auto, 18% auto, 100% auto;
}
.slide3  .slide-text{position:absolute; top:10%;}
.slide3 h2,.slide3 h2 span{font-size:50px;}
.slide3 h2 span:not(.greater){font-size:20px; line-height:20px; margin: 0 0 0 0;}

.slide-text .btn {float: left; margin: 2% 0.5% 0;}
.slide-text .btn a {  padding: 4px 10px; font-size:12px;}

.aircon-banner .slide-text {margin: 15px 0 0;}	
.aircon-banner h2 { font-size: 20px; line-height:30px;}	
.aircon-banner p {font-size:15px;  line-height:22px;}	

}


@media only screen and ( max-width:460px) {	
.slide1,.slide2,.slide3,.aircon-banner { height:200px;}

.slide-text h1 { font-size:16px;  line-height:20px;} 

.slide2{
background-position: right 35% bottom 10%, right 5% bottom 0%, left 0% bottom 0%;
background-size: 18% auto, 20% auto,cover;}
.slide2 .slide-text {width:100%; margin:2% 0 0 0;}
.slide2 h2{padding:5px; font-size:16px;}
.slide2 h3{padding:4px; margin:-10px 0 0 40px; font-size:11px;}

.slide3 {
background-position: right 7% top 35%, right 5% bottom 20%, top 78% right 0%;
background-size: 12% auto, 18% auto, 100% auto;}
.slide3  .slide-text{position:absolute; top:0;}

.slide-text .btn a { padding: 3px 12px; font-size: 13px;}
}

@media only screen and ( max-width:360px) {	
.slide1 { 
background-position: bottom 8% right 15%, bottom 6% left 45%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;
background-size: auto 22%,0% 25%, auto 10%, 100% auto,100% 100%;}
@keyframes animatevan {
    from {background-position: bottom 8% right -50%, bottom 6% left 45%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;}
    to {background-position: bottom 8% right 15%, bottom 6% left 45%, left 38% bottom 5%, left 0% bottom 0%, left 0% bottom 0%;}
}
.slide2 {
background-position: right 35% bottom 15%, right 5% bottom 0%, left 0% bottom 0%;
background-size: 18% auto, 22% auto,cover;
}
.slide2 .slide-text {width:100%; margin:2% 0 0 0;}
.slide2 h2{padding:5px; font-size:16px;}
.slide2 h3{padding:4px; margin:-10px 0 0 40px; font-size:11px;}

.slide-text .btn {float: left; margin: 2% 0.5% 0;}
/*.slide-text .btn a {  padding: 4px 10px; font-size:9px;}*/
}