.banner { position: relative; overflow: hidden; }
    .banner li { list-style: none; }
        .banner ul li { float: left; }

  .banner {

        width: 100%;
        height: auto;
        padding: 0px;
        margin: 0px;
    }
    .banner ul {
        padding: 0px;
        margin: 0px;
        overflow: hidden;
    }
    .banner li{
    padding: 0px;
    margin: 0px;
    }
    .banner ul li {
        float:left;
        padding: 0px;
        margin: 0px;
        height: auto;
        -webkit-background-size: 100% auto;
        -moz-background-size: 100% auto;
        -o-background-size: 100% auto;
        -ms-background-size: 100% auto;
        background-size: 100% auto;
        background-position-y: -75px;
        //box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);


.dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -20px;
  text-align: center;
}

.dots li {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 4px;
  text-indent: -999em;
  border: 2px solid #fff;
  border-radius: 6px;
  cursor: pointer;
  opacity: .4;
  -webkit-transition: background .5s, opacity .5s;
  -moz-transition: background .5s, opacity .5s;
  transition: background .5s, opacity .5s;
}

.dots li.active {
  background: #fff;
  opacity: 1;
}

.unslider {
        position: relative;
        overflow: auto; /* This will get overriddden by the jQuery plugin. */
}
        .unslider ul {
                position: relative;
        }
        .unslider li {
                list-style: none;

                /* Reset any weird spacing */
                margin: 0;
                padding: 0;

                border: none;
        }
                .unslider ul li { /* Use the extra <ul> because <ol> gets used for the dot-nav. */
                        float: left;
                }