#banner {
    width: 100%;
    position: relative;
    overflow: auto;
    text-align: center;
}

    #banner li {
        list-style: none;
    }

    #banner ul li {
        float: left;
    }

    #banner .dots {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 20px;
    }

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

            #banner .dots li.active {
                background: #32AEEB;
                opacity: 1;
            }

    #banner .arrow {
        position: absolute;
        top: 300px;
    }

    #banner #al {
        left: 15px;
    }

    #banner #ar {
        right: 15px;
    }