#slider { float:left; width:100%;position:relative;
background-image:
url('../images/slide/slide-bg.png');
background-repeat:no-repeat; 
background-position:left 0 bottom 48%;
background-size:cover; }
#slider .owl-dots { display:none;}

.slide1,.slide2,.slide3,.slide4  {float:left; width:100%; height:680px;}
.slide1 .wrapper,.slide2 .wrapper,.slide3 .wrapper,.slide4 .wrapper { display:table;}

.slide1 { 
background-image:
url('../images/slide/home-banner-1-image1.png'),
url('../images/slide/home-banner-1-image2.png'),
url('../images/slide/home-banner-1-image3.png'),
url('../images/slide/home-banner-1-image4.png');
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 20% left 49%,top 20% right 20%,bottom 16% left 49%,bottom 16% right 20%;
background-size:auto auto,auto auto,auto auto,auto auto;}
.slide1 .slide-text h2 {font-size:40px; line-height:45px; margin:0px; padding:20px 0;}
.slide1 .slide-text h3 { color:#fff; font-size:32px; line-height:40px; margin:0px; padding:0px;}


.slide2 { 
background-image:
url('../images/slide/home-banner2-image.png');
background-repeat:no-repeat; 
background-position:top 50% left 74%;
background-size:auto auto;}

.slide3 { 
background-image:
url('../images/slide/home-banner3-image.png');
background-repeat:no-repeat; 
background-position:top 50% left 74%;
background-size:auto auto;}

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


.slide-text { display:table-cell; height:680px; vertical-align: middle; text-align: left;}
.slide-text h2 {font-size:40px; line-height:45px; margin:0px; padding:20px 0;}
.slide-text h2 span { font-size:60px;}
.slide-text h3 { color:#fff; font-size:32px; line-height:40px; margin:0px; padding:0px;}
.slide-text p { color:#fff; margin:0px; padding:15px 0; font-size:16px; line-height:25px;}
.slide-text .btn { margin:15px 0 0;}
.slide-text .btn a { font-size:25px;}

@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, /* put webkit CSS here*/
}

@media only screen and ( max-width:1700px) {
.slide1 { 
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 20% left 45%,top 20% right 15%,bottom 16% left 45%,bottom 16% right 15%;
background-size:auto auto,auto auto,auto auto,auto auto;}

}

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

@media only screen and ( max-width:1500px) {
.slide1 { 
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 20% left 40%,top 20% right 15%,bottom 16% left 40%,bottom 16% right 15%;
background-size:auto auto,auto auto,auto auto,auto auto;}
}


@media only screen and ( max-width:1400px) {
.slide1 { 
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 20% left 40%,top 20% right 10%,bottom 16% left 40%,bottom 16% right 10%;
background-size:auto auto,auto auto,auto auto,auto auto;}

.slide2 { background-position:top 50% left 90%;background-size:auto auto;}
.slide3 { background-position:top 50% left 90%; background-size:auto auto;}
.slide4 { background-position:top 50% left 90%; background-size:auto auto;}
}

@media only screen and ( max-width:1300px) {
.slide1 { 
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 20% left 40%,top 20% right 3%,bottom 16% left 40%,bottom 16% right 3%;
background-size:auto auto,auto auto,auto auto,auto auto;}
}

@media only screen and ( max-width:1200px) {
.slide-text { vertical-align:top; text-align:center;}
.slide-text p br,.slide1 .slide-text h2 br,.slide-text h3 br,.slide-text h2 br { display: none;}
.slide-text p { margin:0px; padding:0px;}
.slide-text .btn a,.slide-text .btn a:hover { font-size:21px; padding:8px 50px 8px 20px; background-size:8%; background-position:top 10px right 10px;}

.slide1 { 
background-repeat: no-repeat, no-repeat, no-repeat,no-repeat; 
background-position:top 50% left 25%,top 50% right 20%,bottom 5% left 25%,bottom 5% right 20%;
background-size:30% auto,30% auto,30% auto,30% auto;}

.slide2 { 
background-position:left 50% bottom 20%;
background-size:40% auto;}
.slide2 .slide-text ,.slide3 .slide-text ,.slide4 .slide-text { padding:15px 0 0;}

.slide3 { background-position:left 50% bottom 20%; background-size:40% auto;}
.slide4 { background-position:left 50% bottom 20%; background-size:55% auto;}
}

@media only screen and ( max-width:1000px) {
.slide1,.slide2,.slide3,.slide4,.slide-text {height:500px;}

.slide-text h2 { font-size:30px; line-height:40px;}
.slide-text h3 { font-size:26px; line-height:30px;}
.slide-text p { color:#fff;}

.slide-text { padding:30px 0 0;}
.slide1 {
    background-repeat: no-repeat, no-repeat, no-repeat,no-repeat;
    background-position: bottom 20% left 3%, bottom 20% right 32%,bottom 20% left 35%,bottom 20% right 0%;
    background-size: 25% auto,25% auto,25% auto,25% auto;
}


.slide2 { background-position:left 50% bottom 5%;background-size:40% auto;}
.slide3 { background-position:left 50% bottom 5%; background-size:40% auto;}
.slide4 { background-position:left 50% bottom 5%; background-size:50% auto;}
}


@media only screen and ( max-width:767px) {
.slide-text h2 { font-size:22px; line-height:30px;}
.slide-text h3 { font-size:20px; line-height:25px;}
.slide-text h2 span { font-size:30px;}
.slide-text .btn { margin:0 0 10px;}
.slide1 {
    background-repeat: no-repeat, no-repeat, no-repeat,no-repeat;
    background-position: bottom 10% left 3%, bottom 10% right 32%,bottom 10% left 35%,bottom 10% right 0%;
    background-size: 25% auto,25% auto,25% auto,25% auto;
}
.slide2 { background-position:left 50% bottom 5%;background-size:60% auto;}
.slide3 { background-position:left 50% bottom 10%; background-size:56% auto;}
.slide4 { background-position:left 50% bottom 5%; background-size:70% auto;}
.slide4 .slide-text { padding:40px 0 0;}
}


@media only screen and ( max-width:640px) {	
.slide1,.slide2,.slide3,.slide4,.slide-text {height:500px;}

.slide3 { background-position:left 50% bottom 10%; background-size:62% auto;}

.slide4 { background-position:left 50% bottom 5%; background-size:80% auto;}
}


@media only screen and ( max-width:570px) {	
.slide-text h2,.slide1 .slide-text h2 { font-size:25px; line-height:30px;}
.slide-text p { font-size:17px; line-height:24px}
.slide-text .btn { margin:15px 0 0;}

.slide1 {
    background-repeat: no-repeat, no-repeat, no-repeat,no-repeat;
    background-position: bottom 38% left 10%, bottom 38% right 10%,bottom 2% left 10%,bottom 2% right 10%;
    background-size: 40% auto,40% auto,40% auto,40% auto;
}
.slide1 .slide-text { padding:10px 0 0;}
.slide1 .slide-text h2 { margin:0px; padding:0px; font-size:22px; line-height:30px;}
.slide1 .slide-text p {font-size:15px; line-height:24px;}
}

@media only screen and ( max-width:520px) {	
.slide2 { background-position:left 50% bottom 5%;background-size:70% auto;}
.slide3 { background-position:left 50% bottom 15%; background-size:70% auto;}
.slide4 { background-position:left 50% bottom 5%; background-size:90% auto;}
}

@media only screen and ( max-width:480px) {	
.slide-text h2 { font-size:26px; line-height:30px;}
.slide-text p { font-size:15px; line-height:24px}
.slide-text .btn a { font-size:19px;}

.slide1 {
    background-repeat: no-repeat, no-repeat, no-repeat,no-repeat;
    background-position: bottom 38% left 10%, bottom 38% right 10%,bottom 2% left 10%,bottom 2% right 10%;
    background-size: 45% auto,45% auto,45% auto,45% auto;
}
.slide4 { background-position:left 50% bottom 8%; background-size:100% auto;}
}

@media only screen and ( max-width:440px) {	
.slide2 { background-position:left 50% bottom 5%;background-size:80% auto;}
.slide3 { background-position:left 50% bottom 10%; background-size:85% auto;}

.slide4 .slide-text { padding: 70px 0 0;}
.slide4 { background-position:left 50% bottom 15%; background-size:100% auto;}
}

@media only screen and ( max-width:420px) {	
.slide-text h2 { font-size:24px; line-height:30px;}
.slide-text p { font-size:13px; line-height:22px}

.slide-text .btn a { font-size:18px;}

.slide1 {
    background-repeat: no-repeat, no-repeat, no-repeat,no-repeat;
    background-position: bottom 38% left 0%, bottom 38% right 0%,bottom 8% left 0%,bottom 8% right 0%;
    background-size: 53% auto,53% auto,53% auto,53% auto;
}
.slide1 .slide-text p {font-size:13px; line-height:22px;}

.slide2 { background-position:left 50% bottom 5%;background-size:90% auto;}

}

@media only screen and ( max-width:380px) {	
.slide-text p {line-height:20px}
.slide-text h2 { padding-bottom:0px;}

.slide1 .slide-text p {font-size:12px; line-height:20px;}

.slide4 .slide-text { padding: 90px 0 0;}
.slide4 { background-position:left 50% bottom 15%; background-size:100% auto;}

}