.da-slider{width:100%;min-width:300px;height:400px;position:relative;margin:0 auto;overflow:hidden;-webkit-transition:background-position 1.4s ease-in-out 0.3s;-moz-transition:background-position 1.4s ease-in-out 0.3s;-o-transition:background-position 1.4s ease-in-out 0.3s;-ms-transition:background-position 1.4s ease-in-out 0.3s;transition:background-position 1.4s ease-in-out 0.3s} .da-slide {position:absolute;width:100%;height:100%;top:0px;left:0px} .da-slide-current {z-index:100} .da-dots {width:100%;position:absolute;text-align:center;left:0px;bottom:0;z-index:150;-moz-user-select:none;-webkit-user-select:none} .da-dots span {display:inline-block;position:relative;width:20px;height:20px;border-radius:50%;background:#ccc;margin:3px;cursor:pointer;box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset, 1px 1px 1px rgba(255,255,255,0.1)} .da-dots span.da-dots-current:after{content:'';width:20px;height:20px;position:absolute;top:0;left:0;border-radius:50%;background:#83D4FE} .da-arrows {-moz-user-select:none;-webkit-user-select:none} .da-arrows span{position:absolute;top:50%;height:30px;width:30px;border-radius:50%;background:#e4b42d;cursor:pointer;z-index:2000;opacity:0;box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset, 1px 1px 1px rgba(255,255,255,0.1); -webkit-transition:opacity 0.4s ease-in-out 0.2s; -moz-transition:opacity 0.4s ease-in-out 0.2s; -o-transition:opacity 0.4s ease-in-out 0.2s; -ms-transition:opacity 0.4s ease-in-out 0.2s; transition:opacity 0.4s ease-in-out 0.2s} .da-slider:hover .da-arrows span{ opacity:1} .da-arrows span:after{content:'';position:absolute;width:20px;height:20px;top:5px;left:5px;background:transparent url(../images/arrows.png) no-repeat top left;border-radius:50%;box-shadow:1px 1px 2px rgba(0,0,0,0.1)} .da-arrows span:hover:after{box-shadow:1px 1px 4px rgba(0,0,0,0.3)} .da-arrows span:active:after{box-shadow:1px 1px 1px rgba(255,255,255,0.1)} .da-arrows span.da-arrows-next:after{background-position:top right} .da-arrows span.da-arrows-prev{left:15px} .da-arrows span.da-arrows-next{right:15px} .da-slide h2, .da-slide p, .da-slide .da-link, .da-slide .da-img {position:relative;opacity:0;left:0px;top:80px;width:50%;color:#fff} .da-slide .da-img {position:absolute;left:50%;top:40px} .da-slide h2 {margin-bottom:15px} .da-slide p {padding:5px 0} .da-slide p.list {background:url(../../img/slide2/checkarrow.png) no-repeat 0 10px;padding-left:20px} .da-slide-current h2, .da-slide-current p, .da-slide-current .da-link {left:0px;opacity:1;width:40%} .da-slide-current h2 {margin-bottom:15px} .da-slide-current p {padding:5px 0} .da-slide-current p.list {background:url(../../img/slide2/checkarrow.png) no-repeat 0 10px;padding-left:20px} .da-slide-current .da-img {left:50%;opacity:1;position:absolute;top:40px;text-align:center} .da-slide .da-link, .da-slide-current .da-link {background:#fff;color:#000;padding:5px 10px;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;top:100px}
.da-slide-fromright h2{-webkit-animation:fromRightAnim1 0.6s ease-in 0.8s both;-moz-animation:fromRightAnim1 0.6s ease-in 0.8s both;-o-animation:fromRightAnim1 0.6s ease-in 0.8s both;-ms-animation:fromRightAnim1 0.6s ease-in 0.8s both;animation:fromRightAnim1 0.6s ease-in 0.8s both} .da-slide-fromright p{-webkit-animation:fromRightAnim2 0.6s ease-in 0.8s both;-moz-animation:fromRightAnim2 0.6s ease-in 0.8s both;-o-animation:fromRightAnim2 0.6s ease-in 0.8s both;-ms-animation:fromRightAnim2 0.6s ease-in 0.8s both; animation:fromRightAnim2 0.6s ease-in 0.8s both} .da-slide-fromright .da-link{-webkit-animation:fromRightAnim3 0.4s ease-in 1.2s both;-moz-animation:fromRightAnim3 0.4s ease-in 1.2s both;-o-animation:fromRightAnim3 0.4s ease-in 1.2s both;-ms-animation:fromRightAnim3 0.4s ease-in 1.2s both;animation:fromRightAnim3 0.4s ease-in 1.2s both}.da-slide-fromright .da-img{-webkit-animation:fromRightAnim4 0.6s ease-in 0.8s both;-moz-animation:fromRightAnim4 0.6s ease-in 0.8s both;-o-animation:fromRightAnim4 0.6s ease-in 0.8s both;-ms-animation:fromRightAnim4 0.6s ease-in 0.8s both;animation:fromRightAnim4 0.6s ease-in 0.8s both} @-webkit-keyframes fromRightAnim1{0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-webkit-keyframes fromRightAnim2{0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-webkit-keyframes fromRightAnim3{ 0%{left:110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @-webkit-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:50%;opacity:1}} @-moz-keyframes fromRightAnim1{ 0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-moz-keyframes fromRightAnim2{0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-moz-keyframes fromRightAnim3{ 0%{left:110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @-moz-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:50%;opacity:1}} @-o-keyframes fromRightAnim1{ 0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-o-keyframes fromRightAnim2{0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-o-keyframes fromRightAnim3{0%{left:110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @-o-keyframes fromRightAnim4{0%{left:110%;opacity:0} 100%{left:50%;opacity:1}} @-ms-keyframes fromRightAnim1{ 0%{left:110%;opacity:0}	100%{left:0;opacity:1}} @-ms-keyframes fromRightAnim2{ 0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @-ms-keyframes fromRightAnim3{ 0%{left:110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @-ms-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:50%;opacity:1}} @keyframes fromRightAnim1{ 0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @keyframes fromRightAnim2{ 0%{left:110%;opacity:0} 100%{left:0;opacity:1}} @keyframes fromRightAnim3{ 0%{left:110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:50%;opacity:1}}
.da-slide-fromleft h2{-webkit-animation:fromLeftAnim1 0.6s ease-in 0.6s both;-moz-animation:fromLeftAnim1 0.6s ease-in 0.6s both;-o-animation:fromLeftAnim1 0.6s ease-in 0.6s both;-ms-animation:fromLeftAnim1 0.6s ease-in 0.6s both;animation:fromLeftAnim1 0.6s ease-in 0.6s both;} .da-slide-fromleft p{-webkit-animation:fromLeftAnim2 0.6s ease-in 0.6s both;-moz-animation:fromLeftAnim2 0.6s ease-in 0.6s both;-o-animation:fromLeftAnim2 0.6s ease-in 0.6s both;-ms-animation:fromLeftAnim2 0.6s ease-in 0.6s both;animation:fromLeftAnim2 0.6s ease-in 0.6s both} .da-slide-fromleft .da-link{-webkit-animation:fromLeftAnim3 0.4s ease-in 1.2s both;-moz-animation:fromLeftAnim3 0.4s ease-in 1.2s both;-o-animation:fromLeftAnim3 0.4s ease-in 1.2s both;-ms-animation:fromLeftAnim3 0.4s ease-in 1.2s both;animation:fromLeftAnim3 0.4s ease-in 1.2s both} .da-slide-fromleft .da-img{-webkit-animation:fromLeftAnim4 0.6s ease-in 0.6s both;-moz-animation:fromLeftAnim4 0.6s ease-in 0.6s both;-o-animation:fromLeftAnim4 0.6s ease-in 0.6s both;-ms-animation:fromLeftAnim4 0.6s ease-in 0.6s both;animation:fromLeftAnim4 0.6s ease-in 0.6s both} @-webkit-keyframes fromLeftAnim1{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1}} @-webkit-keyframes fromLeftAnim2{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @-webkit-keyframes fromLeftAnim3{ 0%{left:-110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0%;opacity:1} } @-webkit-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:50%;opacity:1}} @-moz-keyframes fromLeftAnim1{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1}} @-moz-keyframes fromLeftAnim2{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1}} @-moz-keyframes fromLeftAnim3{ 0%{left:-110%;opacity:0} 1%{left:10%;opacity:0} 100%{left:0;opacity:1} } @-moz-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:50%;opacity:1}} @-o-keyframes fromLeftAnim1{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @-o-keyframes fromLeftAnim2{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @-o-keyframes fromLeftAnim3{ 0%{left:-110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1} } @-o-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:50%;opacity:1}} @-ms-keyframes fromLeftAnim1{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @-ms-keyframes fromLeftAnim2{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1}} @-ms-keyframes fromLeftAnim3{ 0%{left:-110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1} } @-ms-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:50%;opacity:1}} @keyframes fromLeftAnim1{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @keyframes fromLeftAnim2{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:1} } @keyframes fromLeftAnim3{ 0%{left:-110%;opacity:0} 1%{left:0;opacity:0} 100%{left:0;opacity:1}} @keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:50%;opacity:1}}
.da-slide-toright h2{-webkit-animation:toRightAnim1 0.6s ease-in 0.6s both;-moz-animation:toRightAnim1 0.6s ease-in 0.6s both;-o-animation:toRightAnim1 0.6s ease-in 0.6s both;-ms-animation:toRightAnim1 0.6s ease-in 0.6s both;animation:toRightAnim1 0.6s ease-in 0.6s both;} .da-slide-toright p{-webkit-animation:toRightAnim2 0.6s ease-in 0.3s both;-moz-animation:toRightAnim2 0.6s ease-in 0.3s both;-o-animation:toRightAnim2 0.6s ease-in 0.3s both;-ms-animation:toRightAnim2 0.6s ease-in 0.3s both;animation:toRightAnim2 0.6s ease-in 0.3s both} .da-slide-toright .da-link{-webkit-animation:toRightAnim3 0.4s ease-in both;-moz-animation:toRightAnim3 0.4s ease-in both;-o-animation:toRightAnim3 0.4s ease-in both;-ms-animation:toRightAnim3 0.4s ease-in both;animation:toRightAnim3 0.4s ease-in both} .da-slide-toright .da-img{-webkit-animation:toRightAnim4 0.6s ease-in both;-moz-animation:toRightAnim4 0.6s ease-in both;-o-animation:toRightAnim4 0.6s ease-in both;-ms-animation:toRightAnim4 0.6s ease-in both;animation:toRightAnim4 0.6s ease-in both} @-webkit-keyframes toRightAnim1{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0}} @-webkit-keyframes toRightAnim2{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0}} @-webkit-keyframes toRightAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:100%;opacity:0}} @-webkit-keyframes toRightAnim4{ 0%{left:50%; opacity:1} 30%{left:55%;opacity:1} 100%{left:100%;opacity:0} } @-moz-keyframes toRightAnim1{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0}} @-moz-keyframes toRightAnim2{ 0%{left:10%;opacity:1} 100%{left:100%;opacity:0}} @-moz-keyframes toRightAnim3{0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:100%;opacity:0}} @-moz-keyframes toRightAnim4{ 0%{left:50%; opacity:1} 30%{left:55%; opacity:1} 100%{left:100%;opacity:0} } @-o-keyframes toRightAnim1{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0} } @-o-keyframes toRightAnim2{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0} } @-o-keyframes toRightAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:100%;opacity:0} } @-o-keyframes toRightAnim4{ 0%{left:50%; opacity:1} 30%{left:55%; opacity:1} 100%{left:100%;opacity:0} } @-ms-keyframes toRightAnim1{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0} } @-ms-keyframes toRightAnim2{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0} } @-ms-keyframes toRightAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:100%;opacity:0} } @-ms-keyframes toRightAnim4{ 0%{left:50%; opacity:1} 30%{left:55%; opacity:1} 100%{left:100%;opacity:0} } @keyframes toRightAnim1{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0}} @keyframes toRightAnim2{ 0%{left:10%; opacity:1} 100%{left:100%;opacity:0} } @keyframes toRightAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:100%;opacity:0} } @keyframes toRightAnim4{ 0%{left:50%; opacity:1} 30%{left:55%; opacity:1} 100%{left:100%;opacity:0}}
.da-slide-toleft h2{-webkit-animation:toLeftAnim1 0.6s ease-in both;-moz-animation:toLeftAnim1 0.6s ease-in both;-o-animation:toLeftAnim1 0.6s ease-in both;-ms-animation:toLeftAnim1 0.6s ease-in both;animation:toLeftAnim1 0.6s ease-in both} .da-slide-toleft p{-webkit-animation:toLeftAnim2 0.6s ease-in 0.3s both;-moz-animation:toLeftAnim2 0.6s ease-in 0.3s both;-o-animation:toLeftAnim2 0.6s ease-in 0.3s both;-ms-animation:toLeftAnim2 0.6s ease-in 0.3s both;animation:toLeftAnim2 0.6s ease-in 0.3s both} .da-slide-toleft .da-link{ -webkit-animation:toLeftAnim3 0.4s ease-in both;-moz-animation:toLeftAnim3 0.4s ease-in both;-o-animation:toLeftAnim3 0.4s ease-in both; -ms-animation:toLeftAnim3 0.4s ease-in both; animation:toLeftAnim3 0.4s ease-in both } .da-slide-toleft .da-img{ -webkit-animation:toLeftAnim4 0.6s ease-in 0.6s both; -moz-animation:toLeftAnim4 0.6s ease-in 0.6s both; -o-animation:toLeftAnim4 0.6s ease-in 0.6s both; -ms-animation:toLeftAnim4 0.6s ease-in 0.6s both; animation:toLeftAnim4 0.6s ease-in 0.6s both } @-webkit-keyframes toLeftAnim1{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0} } @-webkit-keyframes toLeftAnim2{ 0%{left:10%;opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-webkit-keyframes toLeftAnim3{0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:-50%;opacity:0}} @-webkit-keyframes toLeftAnim4{ 0%{left:50%; opacity:1} 40%{left:70%; opacity:1} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-moz-keyframes toLeftAnim1{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-moz-keyframes toLeftAnim2{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-moz-keyframes toLeftAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:-50%;opacity:0}} @-moz-keyframes toLeftAnim4{ 0%{left:50%; opacity:1} 40%{left:70%; opacity:1} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-o-keyframes toLeftAnim1{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-o-keyframes toLeftAnim2{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-o-keyframes toLeftAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:-50%;opacity:0}} @-o-keyframes toLeftAnim4{ 0%{left:50%; opacity:1} 40%{left:70%; opacity:1} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-ms-keyframes toLeftAnim1{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-ms-keyframes toLeftAnim2{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @-ms-keyframes toLeftAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0} 100%{left:-50%;opacity:0}} @-ms-keyframes toLeftAnim4{ 0%{left:50%; opacity:1} 40%{left:70%; opacity:1} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @keyframes toLeftAnim1{ 0%{left:10%; opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @keyframes toLeftAnim2{ 0%{left:10%;opacity:1} 30%{left:15%; opacity:1} 100%{left:-50%;opacity:0}} @keyframes toLeftAnim3{ 0%{left:10%; opacity:1} 99%{left:10%;opacity:0}	100%{left:-50%;opacity:0}} @keyframes toLeftAnim4{ 0%{left:50%; opacity:1} 40%{left:70%; opacity:1} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0} }
/*=== Small View AS ===*/
@media (max-width:800px) {.da-slide .da-img, .da-slide-current .da-img {width:100%;left:0;z-index:-1} .da-slide-current .da-img {opacity:.25} .da-slide h2, .da-slide p, .da-slide .da-link, .da-slide-current h2, .da-slide-current p, .da-slide-current .da-link {width:90%} @-webkit-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:0;opacity:.25}} @-moz-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:0;opacity:.25}} @-o-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:0;opacity:.25}} @-ms-keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:0;opacity:.25}} @keyframes fromRightAnim4{ 0%{left:110%;opacity:0} 100%{left:0;opacity:.25}} @-webkit-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:.25}} @-moz-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:.25}} @-o-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:.25}} @-ms-keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:.25}} @keyframes fromLeftAnim4{ 0%{left:-110%;opacity:0} 100%{left:0;opacity:.25}} @-webkit-keyframes toRightAnim4{ 0%{left:0; opacity:.25} 30%{left:55%; opacity:.25} 100%{left:100%;opacity:0}} @-moz-keyframes toRightAnim4{ 0%{left:0; opacity:.25} 30%{left:55%; opacity:.25} 100%{left:100%;opacity:0}} @-o-keyframes toRightAnim4{ 0%{left:0; opacity:.25} 30%{left:55%; opacity:.25} 100%{left:100%;opacity:0} } @-ms-keyframes toRightAnim4{ 0%{left:0; opacity:.25} 30%{left:55%; opacity:.25} 100%{left:100%;opacity:0}} @keyframes toRightAnim4{ 0%{left:0;opacity:.25} 30%{left:55%; opacity:.25} 100%{left:100%;opacity:0}} @-webkit-keyframes toLeftAnim4{0%{left:0; opacity:.25} 40%{left:70%; opacity:.25} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-moz-keyframes toLeftAnim4{ 0%{left:0; opacity:.25} 40%{left:70%; opacity:.25} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-o-keyframes toLeftAnim4{ 0%{left:0; opacity:.25} 40%{left:70%; opacity:.25} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} @-ms-keyframes toLeftAnim4{ 0%{left:0; opacity:.25} 40%{left:70%; opacity:.25} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0} } @keyframes toLeftAnim4{ 0%{left:0; opacity:.25} 40%{left:70%; opacity:.25} 90%{left:0%; opacity:0} 100%{left:-50%;opacity:0}} }