
$carousel-caption-background: rgba(0,0,0,0.6) !default;
$carousel-caption-font-color:#fff !default;

/*****************
CAROUSEL BOOTSTRAP
*******************/

.carousel {
    height: 400px;
    margin-bottom: $base-margin-bottom;


.item,
.active,
.carousel-inner {
    height: 100%;
}

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    color: #fff;
    text-align: center;
    -webkit-text-shadow: none;
    -moz-text-shadow: none;
    -o-text-shadow: none;
    text-shadow: none;
    filter: alpha(opacity=100);
    opacity: 1;
    width: 5%;

            &.right {
            right: 0;
            left: auto;
            background-image: none;
            }

            &.left {
            left: 0;
            right: auto;
            background-image: none;
            }
}



.carousel-caption {
    position: absolute;
    right: 10%;
    bottom: 25%;
    left: 10%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #333;
    text-align: left;
    -webkit-text-shadow: none;
    -moz-text-shadow: none;
    -o-text-shadow: none;
    text-shadow: none;
    background: none;

    a {
    display: inline-block;
    cursor: pointer;
    z-index: 10;




    h2 span,  p,  p {
    background: $carousel-caption-background;
    color: $carousel-caption-font-color;
    padding: 20px;
    margin: 0 0 10px;
    display: inline-block;
}

    &:hover h2 span,
    &:focus h2 span,
    &:hover p,
    &:focus p {
    background: #000;
}

 h2 {
    margin: 0;
    }


 p {
    font-size: 1.500rem;
}

.external p:after {
    content: '\f08e';
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    margin: 0px 0px 0px 10px;
}


}
}




.carousel-caption span.carouselLink {
    display: block;
}


.carousel-indicators {
    top: 5%;
    bottom: auto;


li {
    border: 3px solid #ffffff;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    margin: 0;
}

.active {
    background: #fff;
}

}

#carouselButtons {
    position: absolute;
    bottom: 10%;
    left: 0;
    z-index: 16;
    margin:0 auto;
    width:100%;
    text-align:center;
}

#carouselButtons button {
    border: none;
    color: #006DA5;
    padding: 10px 20px;
    margin:0 1px;
    &:after{
        content:"";
        background:transparent;
    }
}

#carouselButtons button:hover,
#carouselButtons button:focus {
    background: #000;
    color: #fff;
}
}

@media (max-width: 767px) {
    .carousel {
        display: none;
    }
}

@media screen and (min-width: 767px) {
    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-next,
    .carousel-control .icon-prev {
        width: 55px;
        height: 55px;
        margin-top: -30px;
        font-size: 2.575rem;
        color: #006DA5;
        border-radius: 50%;
        padding: 12px;
        background: rgba(255, 255, 255, 0.9);
    }
    .carousel-control:hover .icon-next,
    .carousel-control:focus .icon-next,
    .carousel-control:hover .icon-prev,
    .carousel-control:focus .icon-prev {
        background: #000;
        color: #fff;
    }
}


.carousel #carouselButtons button {

    background: #fff;
}


.carousel-inner .item {
   padding:0px;
}



/*END CAROUSEL BOOTSTRAP*/