﻿.slider-wrap {width:600px;height:400px;position:relative;overflow:hidden;}
.slider-wrap .slider {width:100%;height:100%;position:absolute;top:0;left:0;}
.slider-wrap .slider li {float:left;position:relative;}
.slider-wrap .slider li > div{position:absolute;top:20px;left:35px;}
.slider-wrap .slider li>div h3{font-size:36px;text-transform:uppercase;}
.slider-wrap .slider li>div span{font-family:Neucha,Arial,sans serif;font-size:21px;}
.slider-wrap .slider li i{text-align:center;line-height:400px;display:block;width:100%;font-size:90px;}
.btns{position:absolute;width:50px;height:60px;top:50%;margin-top:-25px;line-height:57px;text-align:center;cursor:pointer;background:rgba(0,0,0,.1);z-index:100;-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none;-webkit-transition:all .1s ease;-moz-transition:all .1s ease;-o-transition:all .1s ease;-ms-transition:all .1s ease;transition:all .1s ease;vertical-align:middle;}
.btns:hover{background:rgba(0,0,0,.3);}
.next{right:-50px;border-radius:7px 0 0 7px;}
.previous{left:-50px;border-radius:0 7px 7px 7px;}
.counter {top:15px;right:15px;width:auto;position:absolute;color:#fff;}
.slider-wrap.active .next {right:0;}
.slider-wrap.active .previous {left:0;}
.pagination-wrap {min-width:20px;margin-top:245px;margin-left:auto;margin-right:auto;height:15px;position:relative;text-align:center;}
.pagination-wrap ul{width:100%;}
.pagination-wrap ul li{margin:0 4px;display:inline-block;width:5px;height:5px;border-radius:50%;background:#fff;opacity:.5;position:relative;top:0;}
.pagination-wrap ul li.active {width:12px;height:12px;top:3px;opacity:1;box-shadow:rgba(0,0,0,.1) 1px 1px 0;}
.pagination-wrap ul li,.slider-wrap ul{-webkit-transition:all .3s cubic-bezier(1,.01,.32,1);-moz-transition:all .3s cubic-bezier(1,.01,.32,1);-o-transition:all .3s cubic-bezier(1,.01,.32,1);-ms-transition:all .3s cubic-bezier(1,.01,.32,1);transition:all .3s cubic-bezier(1,.01,.32,1);}
