div.site{overflow:hidden}
div.wrapper{position:relative;}
div.wrapper.demo1{margin:10px auto 0;}
div.wrapper:not(.demo1){margin:0 auto 0}


div.wrapper>ul.container{position:relative;height:140px;margin:0 auto;}
div.wrapper ul.container>li.cards_list{background-color:#fff;overflow:hidden;border:1px solid #ccc;border-radius:6px;}

div.wrapper.horizontal>ul.container{width:140px;}
div.wrapper.vertical>ul.container{width:140px;}

div.wrapper.vertical ul.container>li.cards_list{display:flex}
i.btn-direct{position:absolute;top:40%;width:32px;height:32px;opacity:.9;cursor:pointer;z-index:100;}
div.wrapper:hover i.btn-direct{opacity:.9}
i.btn-direct:hover{opacity:.9!important}
i.btn-direct.btn-left{left:0px;}
i.btn-direct.btn-right{right:0px}
i.btn-direct>span{position:absolute;top:50%;left:50%;width:19px;height:19px;;border-top:6px solid #aaa;border-left:6px solid #aaa}
div.wrapper.horizontal i.btn-direct>span.shift-left{transform:translate(-30%,-50%) rotate(-45deg)}
div.wrapper.horizontal i.btn-direct>span.shift-right{transform:translate(-70%,-50%) rotate(135deg)}
div.wrapper.vertical i.btn-direct>span.shift-left{transform:translate(-50%,-30%) rotate(45deg)}
div.wrapper.vertical i.btn-direct>span.shift-right{transform:translate(-50%,-70%) rotate(-135deg)}