.sl-slider-wrapper{width:800px;height:400px;margin:0 auto;position:relative;overflow:hidden;}
.sl-slider{position:absolute;top:0;left:0;}
.sl-slide, .sl-slides-wrapper, .sl-slide-inner{position:absolute;width:100%;height:100%;top:0;left:0;}
.sl-slide{z-index:1;}
.sl-content-slice{overflow:hidden;position:absolute;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;background:#fff;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;opacity:1;}
.sl-slide-horizontal .sl-content-slice{width:100%;height:50%;left:-200px;-webkit-transform:translateY(0%) scale(1);-moz-transform:translateY(0%) scale(1);-o-transform:translateY(0%) scale(1);-ms-transform:translateY(0%) scale(1);transform:translateY(0%) scale(1);}
.sl-slide-horizontal .sl-content-slice:first-child{top:-200px;padding:200px 200px 0px 200px;}
.sl-slide-horizontal .sl-content-slice:nth-child(2){top:50%;padding:0px 200px 200px 200px;}
.sl-slide-vertical .sl-content-slice{width:50%;height:100%;top:-200px;-webkit-transform:translateX(0%) scale(1);-moz-transform:translateX(0%) scale(1);-o-transform:translateX(0%) scale(1);-ms-transform:translateX(0%) scale(1);transform:translateX(0%) scale(1);}
.sl-slide-vertical .sl-content-slice:first-child{left:-200px;padding:200px 0px 200px 200px;}
.sl-slide-vertical .sl-content-slice:nth-child(2){left:50%;padding:200px 200px 200px 0px;}
.sl-content-wrapper{position:absolute;}
.sl-content{width:100%;height:100%;background:#fff;}
.sl-slide-horizontal .sl-slide-inner{background:#fff;}
.sl-slide-vertical .sl-slide-inner{background:#fff;}
.sl-slider-wrapper{width:800px;height:400px;margin:0 auto;position:relative;overflow:hidden;}
.sl-slider{position:absolute;top:0;left:0;}
.sl-slide, .sl-slides-wrapper, .sl-slide-inner{position:absolute;width:100%;height:100%;top:0;left:0;}
.sl-slide{z-index:1;}
.sl-content-slice{overflow:hidden;position:absolute;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;background:#fff;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;opacity:1;}
.sl-slide-horizontal .sl-content-slice{width:100%;height:50%;left:-200px;-webkit-transform:translateY(0%) scale(1);-moz-transform:translateY(0%) scale(1);-o-transform:translateY(0%) scale(1);-ms-transform:translateY(0%) scale(1);transform:translateY(0%) scale(1);}
.sl-slide-horizontal .sl-content-slice:first-child{top:-200px;padding:200px 200px 0px 200px;}
.sl-slide-horizontal .sl-content-slice:nth-child(2){top:50%;padding:0px 200px 200px 200px;}
.sl-slide-vertical .sl-content-slice{width:50%;height:100%;top:-200px;-webkit-transform:translateX(0%) scale(1);-moz-transform:translateX(0%) scale(1);-o-transform:translateX(0%) scale(1);-ms-transform:translateX(0%) scale(1);transform:translateX(0%) scale(1);}
.sl-slide-vertical .sl-content-slice:first-child{left:-200px;padding:200px 0px 200px 200px;}
.sl-slide-vertical .sl-content-slice:nth-child(2){left:50%;padding:200px 200px 200px 0px;}
.sl-content-wrapper{position:absolute;}
.sl-content{width:100%;height:100%;background:#fff;}
.sl-slide-horizontal .sl-slide-inner{background:#fff;}
.sl-slide-vertical .sl-slide-inner{background:#fff;}
.sl-desc{width:100%;position:relative;top:41%;}
.demo-1 .sl-slider-wrapper{position:absolute;width:100%;height:100%;top:0;left:0;}
.home-slider .sl-slider-wrapper{width:100%;height:700px;overflow:hidden;position:relative;}
.home-slider .sl-slider blockquote{color:#ffffff;line-height:1;margin:0 auto;max-width:960px;position:relative;text-align:center;width:80%;z-index:100;}
.home-slider .sl-slider h2{font-size:35px;text-transform:uppercase;text-align:center;padding:0 100px;}
.home-slider .sl-slider blockquote{text-shadow:0 -1px 0 rgba(0, 0, 0, 0.2);}
.home-slider .bg-img{background-position:center center;background-size:cover;box-sizing:content-box;height:100%;left:0;padding:0;position:absolute;top:0;width:100%;}
.sl-desc blockquote p, .home-slider .sl-slider .sl-desc a{color:#ffffff;}
.nav-arrows span{position:absolute;z-index:2000;top:50%;width:40px;height:40px;border:8px solid #ddd;border:8px solid rgba(150,150,150,0.4);text-indent:-90000px;margin-top:-40px;cursor:pointer;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);}
.nav-arrows span:hover{border-color:rgba(150,150,150,0.9);}
.nav-arrows span.nav-arrow-prev{left:5%;border-right:none;border-top:none;}
.nav-arrows span.nav-arrow-next{right:5%;border-left:none;border-bottom:none;}
.nav-dots{text-align:center;position:absolute;bottom:2%;height:30px;width:100%;left:0;z-index:1000;}
.nav-dots span{display:inline-block;position:relative;width:16px;height:16px;border-radius:50%;margin:3px;background:#ddd;background:rgba(150,150,150,0.4);cursor:pointer;box-shadow:0 1px 1px rgba(255,255,255,0.4), inset 0 1px 1px rgba(0,0,0,0.1);}
.home-slider .nav-dots span{background:rgba(150,150,150,0.1);margin:6px;-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-ms-transition:all 0.2s;-o-transition:all 0.2s;transition:all 0.2s;box-shadow:0 1px 1px rgba(255,255,255,0.4), inset 0 1px 1px rgba(0,0,0,0.1), 0 0 0 2px rgba(255,255,255,0.5);}
.home-slider .nav-dots span.nav-dot-current, .home-slider .nav-dots span:hover{box-shadow:0 1px 1px rgba(255,255,255,0.4), inset 0 1px 1px rgba(0,0,0,0.1), 0 0 0 5px rgba(255,255,255,0.5);}
.nav-dots span.nav-dot-current:after{content:"";position:absolute;width:10px;height:10px;top:3px;left:3px;border-radius:50%;background:rgba(255,255,255,0.8);}
.sl-trans-elems .deco{-webkit-animation:roll 1s ease-out both, fadeIn 1s ease-out both;-moz-animation:roll 1s ease-out both, fadeIn 1s ease-out both;-o-animation:roll 1s ease-out both, fadeIn 1s ease-out both;-ms-animation:roll 1s ease-out both, fadeIn 1s ease-out both;animation:roll 1s ease-out both, fadeIn 1s ease-out both;}
.sl-trans-elems h2{-webkit-animation:moveUp 1s ease-in-out both;-moz-animation:moveUp 1s ease-in-out both;-o-animation:moveUp 1s ease-in-out both;-ms-animation:moveUp 1s ease-in-out both;animation:moveUp 1s ease-in-out both;}
.sl-trans-elems blockquote{-webkit-animation:fadeIn 0.5s linear 0.5s both;-moz-animation:fadeIn 0.5s linear 0.5s both;-o-animation:fadeIn 0.5s linear 0.5s both;-ms-animation:fadeIn 0.5s linear 0.5s both;animation:fadeIn 0.5s linear 0.5s both;}
.sl-trans-back-elems .deco{-webkit-animation:scaleDown 1s ease-in-out both;-moz-animation:scaleDown 1s ease-in-out both;-o-animation:scaleDown 1s ease-in-out both;-ms-animation:scaleDown 1s ease-in-out both;animation:scaleDown 1s ease-in-out both;}
.sl-trans-back-elems h2{-webkit-animation:fadeOut 1s ease-in-out both;-moz-animation:fadeOut 1s ease-in-out both;-o-animation:fadeOut 1s ease-in-out both;-ms-animation:fadeOut 1s ease-in-out both;animation:fadeOut 1s ease-in-out both;}
.sl-trans-back-elems blockquote{-webkit-animation:fadeOut 1s linear both;-moz-animation:fadeOut 1s linear both;-o-animation:fadeOut 1s linear both;-ms-animation:fadeOut 1s linear both;animation:fadeOut 1s linear both;}
@-webkit-keyframes roll{
0%{-webkit-transform:translateX(500px) rotate(360deg);}
100%{-webkit-transform:translateX(0px) rotate(0deg);}
}
@-moz-keyframes roll{
0%{-moz-transform:translateX(500px) rotate(360deg);opacity:0;}
100%{-moz-transform:translateX(0px) rotate(0deg);opacity:1;}
}
@-o-keyframes roll{
0%{-o-transform:translateX(500px) rotate(360deg);opacity:0;}
100%{-o-transform:translateX(0px) rotate(0deg);opacity:1;}
}
@-ms-keyframes roll{
0%{-ms-transform:translateX(500px) rotate(360deg);opacity:0;}
100%{-ms-transform:translateX(0px) rotate(0deg);opacity:1;}
}
@keyframes roll{
0%{transform:translateX(500px) rotate(360deg);opacity:0;}
100%{transform:translateX(0px) rotate(0deg);opacity:1;}
}
@-webkit-keyframes moveUp{
0%{-webkit-transform:translateY(40px);}
100%{-webkit-transform:translateY(0px);}
}
@-moz-keyframes moveUp{
0%{-moz-transform:translateY(40px);}
100%{-moz-transform:translateY(0px);}
}
@-o-keyframes moveUp{
0%{-o-transform:translateY(40px);}
100%{-o-transform:translateY(0px);}
}
@-ms-keyframes moveUp{
0%{-ms-transform:translateY(40px);}
100%{-ms-transform:translateY(0px);}
}
@keyframes moveUp{
0%{transform:translateY(40px);}
100%{transform:translateY(0px);}
}
@-webkit-keyframes fadeIn{
0%{opacity:0;}
100%{opacity:1;}
}
@-moz-keyframes fadeIn{
0%{opacity:0;}
100%{opacity:1;}
}
@-o-keyframes fadeIn{
0%{opacity:0;}
100%{opacity:1;}
}
@-ms-keyframes fadeIn{
0%{opacity:0;}
100%{opacity:1;}
}
@keyframes fadeIn{
0%{opacity:0;}
100%{opacity:1;}
}
@-webkit-keyframes scaleDown{
0%{-webkit-transform:scale(1);}
100%{-webkit-transform:scale(0.5);}
}
@-moz-keyframes scaleDown{
0%{-moz-transform:scale(1);}
100%{-moz-transform:scale(0.5);}
}
@-o-keyframes scaleDown{
0%{-o-transform:scale(1);}
100%{-o-transform:scale(0.5);}
}
@-ms-keyframes scaleDown{
0%{-ms-transform:scale(1);}
100%{-ms-transform:scale(0.5);}
}
@keyframes scaleDown{
0%{transform:scale(1);}
100%{transform:scale(0.5);}
}
@-webkit-keyframes fadeOut{
0%{opacity:1;}
100%{opacity:0;}
}
@-moz-keyframes fadeOut{
0%{opacity:1;}
100%{opacity:0;}
}
@-o-keyframes fadeOut{
0%{opacity:1;}
100%{opacity:0;}
}
@-ms-keyframes fadeOut{
0%{opacity:1;}
100%{opacity:0;}
}
@keyframes fadeOut{
0%{opacity:1;}
100%{opacity:0;}
} @media screen and (max-width:660px){
.demo-1 .deco {
width: 130px;
height: 130px;
margin-left: -65px;
margin-bottom: 50px;
}
.demo-1 [data-icon]:after {
width: 110px;
height: 110px;
line-height: 110px;
font-size: 40px;
margin: -55px 0 0 -55px;
}
.demo-1 .sl-slide blockquote {
margin-bottom: -120px;
}
.demo-1 .sl-slide h2 {
line-height: 22px;
font-size: 18px;
margin-bottom: -40px;
letter-spacing: 8px;
}
.demo-1 .sl-slide blockquote p:before {
line-height: 10px;
width: 40px;
height: 40px;
font-size: 120px;
left: -45px;
}
.home-slider .sl-slider-wrapper {
height: 500px;
}
.home-slider .sl-slider h2 {
font-size: 36px;
}
.home-slider .sl-slider blockquote {
font-size: 16px;
}
}