// 最底下的按钮
.dot-change-bg{
    position: absolute;
    text-align: center;
    z-index: 99;
    li{
        width: 16px;
        height: 16px;
        border-radius: 16px;
        margin: 0 0 0 10px ;
        display: inline-block;
        z-index: 100;
        span{
            cursor: pointer;
            text-indent: -9999px;
            -webkit-border-radius: 20px;
            -moz-border-radius: 20px;
            -o-border-radius: 20px;
            border-radius: 20px; 
            width: 100%;
            height: 100%;
            display: block;
            border: 3px solid rgba(255,255,255,.3);
            transition: border .5s;
            -webkit-transition: border .5s;
            -moz-transition: border .5s;
            -ms-transition: border .5s;
            &:hover{
                border: 3px solid rgba(255,255,255,1);
                transition: border .5s;
                -webkit-transition: border .5s;
                -moz-transition: border .5s;
                -ms-transition: border .5s;
            }
        }
        .active-dot{
            background: #ECECEC;
        }
       
    }
}

@media screen and(min-width:768px){
    .dot-change-bg{
        top: 95%;
        left: 47%;
    }
}

@media screen and(max-width:767px){
    .dot-change-bg{
        top: 86%;
        left: 33%;
    }
}
