/*
Skin Name: Composite Bootstrap Bar Theme
Description: A bar skin for the Bootstrap Slider.
Version: 2.1
Author: Composite
Author URI: http://composite.net/
*/

.theme-bar.slider-wrapper {
    position: relative;
    border: 1px solid #333;
    overflow: hidden;
}

.theme-bar .carousel {
    position: relative;
    background: #fff url(loading.gif) no-repeat 50% 50%;
    margin-bottom: 0;
}

    .theme-bar .carousel img {
        position: absolute;
        top: 0px;
        left: 0px;
        display: none;
    }

    .theme-bar .carousel a {
        border: 0;
        display: block;
    }

.theme-bar .carousel-indicators {
    position: absolute;
    bottom: -12px;
    top: auto;
    z-index: 20;
    left: 50%;
    width: 60%;
    text-align: center;
    opacity: 0;
    margin: 0 0 0 -30%;
}

.theme-bar:hover .carousel-indicators {
    opacity: 1;
    bottom: 5px;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}

.theme-bar .carousel-controlNav {
    position: absolute;
    left: 0;
    bottom: -41px;
    z-index: 10;
    width: 100%;
    height: 30px;
    text-align: center;
    padding: 5px 0;
    border-top: 1px solid #333;
    background: #333;
    background: -moz-linear-gradient(top, #565656 0%, #333333 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#565656), color-stop(100%,#333333));
    background: -webkit-linear-gradient(top, #565656 0%,#333333 100%);
    background: -o-linear-gradient(top, #565656 0%,#333333 100%);
    background: -ms-linear-gradient(top, #565656 0%,#333333 100%);
    background: linear-gradient(to bottom, #565656 0%,#333333 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#565656', endColorstr='#333333',GradientType=0 );
    opacity: 0.8;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}

.theme-bar:hover .carousel-controlNav {
    bottom: 0;
    opacity: 1;
}

.theme-bar .carousel-controlNav a {
    display: block;
    width: 15px;
    border: 0;
    color: #fff;
    text-transform: uppercase;
    bottom: 0;
    z-index: 11;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 20px;
    font-size: 40px;
    opacity: 0.5;
    -webkit-transition: all 100ms ease-in-out;
    -moz-transition: all 100ms ease-in-out;
    -o-transition: all 100ms ease-in-out;
    transition: all 100ms ease-in-out;
    background: none;
}

.theme-bar a.carousel-control.right {
    right: -50px;
}

.theme-bar a.carousel-control.left {
    left: -50px;
}

.theme-bar:hover a.carousel-control.right {
    right: 30px;
    opacity: 1;
}

.theme-bar:hover a.carousel-control.left {
    left: 30px;
    opacity: 1;
}

.theme-bar .carousel-controlNav a:hover {
    color: #ddd;
}

.theme-bar .carousel-caption {
    font-family: Helvetica, Arial, sans-serif;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
    background: rgba(0, 0, 0, 0.4);
    padding: 5px 0;
    margin: 0;
    bottom: 0;
    left: 0;
    right: 0;
   
}

.theme-bar:hover .carousel-caption {
    padding-bottom: 35px;
}

.theme-bar:hover .without-indicators .carousel-caption {
    bottom: 0;
}

.theme-bar .carousel-caption a {
    color: #fff;
    border-bottom: 1px dotted #fff;
}

    .theme-bar .carousel-caption a:hover {
        color: #fff;
    }