﻿.up-slider-container{
    overflow: hidden;
    position: relative;
    margin: 0;

    -moz-transition: opacity 0.7s;
    -webkit-transition: opacity 0.7s;
    transition: opacity 0.7s;
}

.up-slider-container.invisible{
    opacity: 0;
}

.up-slider-container *{
    margin: 0;
    padding: 0;
}

.up-slider-container .up-slider-left{
    background: url(../img/left.png) center center no-repeat;
    left: 0;
}

.up-slider-container .up-slider-right{
    background: url(../img/right.png) center center no-repeat;
    right: 0;
}

.up-slider-container .up-nav{
    display: block;
    height: 100%;
    width: 31px;
    position: absolute;
    z-index: 10;
    top: 0;
}

.up-slider-container ul.up-slider-index-list{
    position: absolute;
    list-style: none;
    margin: 0;
    padding: 0;
    bottom: 20px;
    right: 20px;
}

.up-slider-container ul.up-slider-index-list li{
    width: 20px;
    height: 20px;
    background-color: white;
    float: left;
    margin: 0 3px;
    text-align: center;
    line-height: 20px;
    border-radius: 10px;
    cursor: pointer;

    -moz-box-shadow:    inset 0 0 5px #000000;
    -webkit-box-shadow: inset 0 0 5px #000000;
    box-shadow:         inset 0 0 5px #000000;
}

.up-slider-container ul.up-slider-index-list li.active::after{
    content: "•";
    font-size: 38px;
    vertical-align: middle;
}

.up-slider-container ul.up-slider-list {
    list-style: none;
    margin: 0;
    padding: 0;

    -moz-transition: margin-left 0.7s ease-in-out;
    -webkit-transition: margin-left 0.7s ease-in-out;
    transition: margin-left 0.7s ease-in-out;
}

.up-slider-container ul.up-slider-list li.up-slider-item{
    float: left;
}
