#slider
{
    margin: 0 auto;
    width: 820px;
    position: relative;
}

    #slider .slide-button
    {
        display: inline-block;
        background: #0074C6;
        color: #ffffff;
        text-align: center;
        line-height: 50px;
        height: 50px;
        text-decoration: none;
        outline: 0;
        border-radius: 8px;
        font-size: 1.25em;
        border-bottom: solid 2px #0054A6;
        text-shadow: 0 1px 1px #003A6C;
    }

    #slider .slide-button:hover
    {
        background: #2094E6;
    }

    #slider .viewer
    {
        width: 500px;
        height: 375px;
        margin: 0 auto;
        overflow: hidden;
        border: solid 20px #f4f4f4;
        border-radius: 8px;
    }

        #slider .viewer .reel
        {
            display: none;
            height: 375px;
        }

        #slider .viewer .reel .slide
        {
            position: relative;
            width: 500px;
            height: 375px;
        }

            #slider .viewer .reel h2
            {
                position: absolute;
                top: 130px;
                left: 0;
                width: 500px;
                height: 80px;
                line-height: 80px;
                background: #111111;
                text-align: center;
                opacity: 0.85;
                font-weight: normal;
                color: #ffffff;
                font-size: 2.25em;
            }

            #slider .viewer .reel p
            {
                position: absolute;
                top: 210px;
                left: 0;
                width: 500px;
                height: 40px;
                line-height: 40px;
                background: #0074C6;
                text-align: center;
                opacity: 0.85;
                font-weight: normal;
                color: #ffffff;
                font-size: 1.1em;
            }

    #slider .previous-button
    {
        position: absolute;
        top: 180px;
        left: 65px;
        width: 50px;
    }

    #slider .next-button
    {
        position: absolute;
        top: 180px;
        right: 65px;
        width: 50px;
    }

    #slider .indicator
    {
        margin: 30px auto 0 auto;
    }

        #slider .indicator ul
        {
            list-style: none;
            padding: 0;
            margin: 0;
            text-align: center;
        }

            #slider .indicator ul li
            {
                display: inline-block;
                width: 12px;
                height: 12px;
                text-indent: -9999em;
                background: #c8c8c8;
                margin: 0 2px 0 2px;
                border-radius: 8px;
                border-bottom: solid 1px #ffffff;
                border-top: solid 1px #909090;
            }

            #slider .indicator ul li.active
            {
                background: #505050;
                border-top: solid 1px #505050;
            }