.banner {}
  .banner .banner-inner {overflow: hidden}
    .banner ul {height: 100%; position: relative; margin: 0; padding: 0}
      .banner ul li {margin: 0; padding: 0; list-style: none; background: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; z-index: 900; transition: opacity 2s}
        .banner ul li a {display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0}
          .banner ul li img {visibility: hidden}
          .banner ul li .banner-caption {display: block; position: absolute; bottom: 20px; right: 20px; padding: 15px; background-color: rgba(255, 255, 255, 0.8); text-transform: uppercase; font-size: 20px}
        
      .banner ul li.prev-active {opacity: 0; z-index: 998}
      .banner ul li.active {opacity: 1; z-index: 1000}
      .banner ul li:nth-child(2n).active {}
      .banner ul li.next-active {opacity: 0; z-index: 999}