/* http://www.menucool.com */

#sliderFrame, #sliderFrame div {
    box-sizing: content-box;
}
#sliderFrame 
{
    position:relative;
    width:100%;
    margin:0 auto; /*center-aligned*/
    padding:20px;
    background:#191919;
    border-radius:6px;
} 

#slider, #slider .sliderInner {
    width:100%;
    height:400px;/* Must be the same size as the slider images */
    border-radius:0px;
}

#slider {
    background-color:black;
    position:relative;
    margin:0 auto; /*center-aligned*/
    transform: translate3d(0,0,0);
    margin-top: 10px;
    margin-left: 18px;
    margin-bottom: 10px;
}

#slider img{
    width: 100%;
}

/* the link style (if an image is wrapped by a link) */
#slider a.imgLink, #slider .video {
    z-index:2;
    cursor:pointer;
    position:absolute;
    top:0px;left:0px;border:0;padding:0;margin:0;
    width:100%;height:100%;
}
#slider .video {
    background:transparent url(video.png) no-repeat 50% 50%;
}

/* Caption styles */
#slider .mc-caption {
    position:absolute;
    width:100%;
    height:auto;
    padding:10px 0;
    left: 0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/
    bottom: 0px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/
    overflow:hidden;
    text-align:left;
    padding-left: 10px;
    background:rgba(54, 25, 25, .6);
    color: #FFF;
    font-weight: bold;
    font-size: 16px;
    text-shadow: black 0.1em 0.1em 0.1em;
}
#slider .mc-caption a { 
    color:#34739c;
}


/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/
#slider .navBulletsWrapper  {
    display:none;
}

/* --------- Others ------- */

#slider img, #slider>b, #slider a>b {
    position:absolute; border:none; display:none;
}

#slider .sliderInner {
    overflow:hidden;
    position:absolute; top:0; left:0;
}

#slider>a, #slider video, #slider audio {display:none;}


/* -- thumbnails -- */
#thumbs {
    margin-top:10px;
    text-align:center;
    font-size:0;
}

#thumbs .thumb {
    display:inline-block;
    *display:inline;zoom:1;/*IE6, IE7 hack*/
    margin:0 1px;/*this determins the distance between each thumbnail*/
    border:1px solid #333;
    padding:4px;
    background:black;
}

#thumbs .thumb img{
    border:1px solid #555; 
    cursor:pointer; 
    width:100px; 
    height:50px; 
    opacity:0.5;
    filter:alpha(opacity=50);
}

#thumbs .thumb-on img{
    border:2px solid #FFF; 
    opacity:1;
    filter:alpha(opacity=100);
}

#slider div {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}