.flex { margin: 0 auto; width:100%; height:100%;}
.slides{margin:0;padding:0; width:100%; height:100%;}
.slides li{overflow:hidden;position:relative;float:left;}
.slides--titles{margin:0p auto; padding:0; position:absolute; left:19px; bottom:15%; z-index:9999; width:324px;}
.slides--titles li{overflow:hidden;position:relative;float:left;}
.jFlex,.slides,.slides li,.slides--titles li{position:relative;}
.jFlex{overflow:hidden;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.slides{list-style:none}
.slides--anim{-moz-transition:transform ease-out .3s;-ms-transition:transform ease-out .3s;-o-transition:transform ease-out .3s;-webkit-transition:transform ease-out .3s;transition:transform ease-out .3s}
.slides--titles:after,.slides--titles:before,.slides:after,.slides:before{content:' ';display:table}
.slides--titles:after,.slides:after{clear:both}
.slides li{display:block; width:100%; height:100%;}
.slides img{display:block;width:100%;height:100%;}
.slides--titles li{background:#eee;cursor:pointer;text-align:center;-moz-transition:background linear .3s;-ms-transition:background linear .3s;-o-transition:background linear .3s;-webkit-transition:background linear .3s;transition:background linear .3s;width:160px; margin:1px 1px 1px 1px;}
.jflex--2 li{width:50%;}
.jflex--3 li{width:33.3333333%}
.jflex--4 li{width:25%}
.jflex--5 li{width:20%}
.jflex--6 li{width:16.6666667%}
.slides--titles li .title--l{background:#203eae;display:block;height:4px;left:-100%;position:relative; }
.slides--titles li .title--t{font-size:16px;color:#333;font-weight:700;display:block;height:60px;line-height:60px;padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slides--titles li.title--auto .title--l,.slides--titles li.title--manual .title--l{-moz-transition:all linear .3s;-ms-transition:all linear .3s;-o-transition:all linear .3s;-webkit-transition:all linear .3s;transition:all linear .3s}
.slides--titles li.title--auto.title--active .title--l{-moz-transition:all linear 5s;-ms-transition:all linear 5s;-o-transition:all linear 5s;-webkit-transition:all linear 5s;transition:all linear 5s}
.slides--titles li.title--active .title--l{left:0;}
.slides--titles li.title--right .title--l{left:100%}
.slides--titles li.title--active .title--t{font-size:16px;font-weight:700; color:#FFFFFF;}
.slides--titles li.title--active{background:#203eae;}