#slider { float:left; width:100%; height:700px;
background:url('../images/slide/slider1-bg.png');
background-repeat:repeat-x; 
background-position:left 0 bottom 0;
background-size:auto auto;}

.slider-block{float:left; width:100%; margin-top:250px;}

.slider1 { float:left; width:100%; position:relative;}
.slider1 { 
background-image:
url('../images/slide/slider1-van.png'),
url('../images/slide/tree.png'),
url('../images/slide/slider1-graphic.png');
background-repeat:no-repeat,no-repeat,no-repeat; 
background-position:left 35% bottom 35%,left 0 bottom 50%,right 0 bottom 50%;
background-size:auto auto,auto auto,auto auto;
animation: animatevan 4s normal 1;}


@keyframes animatevan {
from {background-position: left -35% bottom 35%,left 0 bottom 50%,right 0 bottom 50%;}
to {background-position: left 35% bottom 35%,left 0  bottom 50%,right 0 bottom 50%;}
}

.slide-inn { display:table-cell; height:600px; vertical-align:top; padding:9% 0 0; text-align: left;}
.slide-inn ul { margin:0; padding:0px;}
.slide-inn li { list-style:none;background:url('../images/slide/slide-tick.png'); background-repeat:no-repeat; background-position:top 12px left 0; padding:0 50px; color:#000000; font-size:30px; line-height:45px;font-family: 'arial-rounded-mt-bold';}
.slide-inn .btn { float:left; width:100%; margin:5% 0 0 12%;}
.slide-inn .btn a { background:#1babe2; color:#fff; margin:0px; padding:5px 15px; font-size:18px; line-height:28px; border-radius:12px;}
.slide-inn .btn a:hover { background:#ee3128;}

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

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

}

@media only screen and ( max-width:1700px) {
.slider1 {background-position:left 25% bottom 35%,left 0 bottom 49%,right 0 bottom 50%;background-size:auto auto, auto auto,60% auto;}
.slide-inn { padding:2% 0 0;}

@keyframes animatevan {
from {background-position: left -25% bottom 35%,left 0 bottom 49%,right 0 bottom 50%;}
to {background-position: left 25% bottom 35%,left 0  bottom 49%,right 0 bottom 50%;}
}

}


@media only screen and ( max-width:1400px) {
.slider1,.slide-inn {height:600px;}
}

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

.slider1 {background-position:left 25% bottom 35%,left 0 bottom 49%,right 0 bottom 46%;background-size:auto auto, auto auto,60% auto;}
.slide-inn { padding:5% 0 0;}
.slide-inn li { font-size:22px; line-height:30px; background-size:6%; background-position:top 10px left 0; padding:0 30px;}

@keyframes animatevan {
from {background-position: left -25% bottom 35%,left 0 bottom 49%,right 0 bottom 46%;}
to {background-position: left 25% bottom 35%,left 0  bottom 49%,right 0 bottom 46%;}
}


}


@media only screen and ( max-width:1000px) {
.slider-block{float:left; width:100%; margin-top:160px;}
	
.slider1 {background-position:left 20% bottom 44%,left 0 bottom 53%,right 0 bottom 57%;background-size:17% auto, 10% auto,55% auto;}

@keyframes animatevan {
from {background-position: left -20% bottom 44%,left 0 bottom 53%,right 0 bottom 57%;}
to {background-position: left 20% bottom 44%,left 0  bottom 53%,right 0 bottom 57%;}
}

}

@media only screen and ( max-width:1200px) {
.slider1 .wrapper { display:table;}

#slider { height:600px;}
.slider1,.slide-inn {height:360px;}
.slide-inn {  padding:2% 0 0;}
.slide-inn li { font-size:20px; line-height:26px; background-size:2%; background-position:top 10px left 0; padding:0 30px;}
.slide-inn .btn { margin:2% 0 0 3%;}
.slider1 {background-position:left 20% bottom 14%,left 0 bottom 20%,right 0 bottom 21%;background-size:17% auto, 10% auto,55% auto;}


@keyframes animatevan {
from {background-position: left -20% bottom 14%,left 0 bottom 20%,right 0 bottom 21%;}
to {background-position: left 20% bottom 14%,left 0  bottom 20%,right 0 bottom 21%;}
}


}

@media only screen and ( max-width:1000px) {
.header { padding:45px 0 0;}
#slider { height:500px;}
.slider1,.slide-inn {height:310px;}
.slide-inn {  padding:2% 0 0;}

.slider1 {background-position: left 20% bottom 1%,left 0 bottom 7%,right 0 bottom 4%;background-size: 17% auto, 10% auto,50% auto;}

@keyframes animatevan {
from {background-position: left -20% bottom 1%,left 0 bottom 7%,right 0 bottom 4%;}
to {background-position: left 20% bottom 1%,left 0  bottom 7%,right 0 bottom 4%;}
}

}


@media only screen and ( max-width:900px) {
.slider1 {background-position: left 20% bottom 0%,left 0 bottom 4%,right 0 bottom 1%;background-size: 17% auto, 10% auto,50% auto;}

@keyframes animatevan {
from {background-position: left -20% bottom 0%,left 0 bottom 4%,right 0 bottom 1%;}
to {background-position: left 20% bottom 0%,left 0  bottom 4%,right 0 bottom 1%;}
}

}


@media only screen and ( max-width:800px) {
#slider { height: 490px;}
.slider1 {background-position:left 20% bottom 2%,left 0 bottom 7%,right 0 bottom 4%;background-size: 17% auto, 10% auto,50% auto;}

@keyframes animatevan {
from {background-position: left -20% bottom 2%,left 0 bottom 7%,right 0 bottom 4%;}
to {background-position: left 20% bottom 2%,left 0  bottom 7%,right 0 bottom 4%;}
}

}


@media only screen and ( max-width:768px) {
.slider-block{margin-top:140px;}	
#slider {height: 380px;
background:
url('../images/slide/slide-res1.png'),
url('../images/slide/slide-res2.png');
background-repeat:repeat-x,repeat-x; 
background-position:left 0 bottom 0,left 0 bottom 0;
background-size:auto auto,auto 25px;}
.slider1, .slide-inn { height: 250px;}	
.slide-inn { padding:0px;}
.slider1 {background-position:left 20% bottom 10%,left 0 bottom 17%,right 0 bottom 16%;background-size: 17% auto, 10% auto,55% auto;}
.slide-inn .btn a { font-size:14px; padding:4px 12px;}
.slide-inn li { font-size: 16px; line-height: 24px; padding:0 20px;background-position: top 8px left 0;}


@keyframes animatevan {
from {background-position: left -20% bottom 10%,left 0 bottom 17%,right 0 bottom 16%;}
to {background-position: left 20% bottom 10%,left 0 bottom 17%,right 0 bottom 16%;}
}

}


@media only screen and ( max-width:580px) {	
.slider-block{margin-top:125px;}
#slider {height: 365px;}
.slider1, .slide-inn { height: 250px;}
.slider1 {background-position:left 23% bottom 16%,left 0 bottom 20%,right 0 bottom 20%;background-size: 20% auto, 10% auto,55% auto;}
.slide-inn li { background-size:4%; padding:0 25px;}
@keyframes animatevan {
from {background-position:left -23% bottom 16%,left 0 bottom 20%,right 0 bottom 20%;}
to {background-position:left 23% bottom 16%,left 0 bottom 20%,right 0 bottom 20%;}
}
}

@media only screen and ( max-width:540px) {	
#slider {height: 350px;}
.slider1, .slide-inn { height: 255px;}
}


@media only screen and ( max-width:480px) {	
.slider-block{margin-top:90px;}
#slider {height: 340px;}
.slider1, .slide-inn { height: 250px;}	
}

@media only screen and ( max-width:430px) {	
#slider {height: 330px;}
.slider1, .slide-inn { height: 240px;}	

}

@media only screen and ( max-width:390px) {
#slider {height: 310px;background-size: auto auto,auto 19px;}
.slider1, .slide-inn { height: 210px;}		
.slider1, .slide-inn { margin:2% 0 0;}
.slider1 {background-position:left 23% bottom 4%,left 0 bottom 8%,right 0 bottom 7%;background-size:22% auto, 10% auto,51% auto;}
.slide-inn li {font-size:14px; line-height:22px;}
.slide-inn .btn a { font-size: 13px; padding: 3px 10px;}

@keyframes animatevan {
from {background-position:left -23% bottom 4%,left 0 bottom 8%,right 0 bottom 7%;}
to {background-position:left 23% bottom 4%,left 0 bottom 8%,right 0 bottom 7%;}
}

}

@media only screen and ( max-width:330px) {
#slider {height: 280px;}
.slider1, .slide-inn { height:182px;}		
}