/* common slideshow settings for use with bootstrap carousel */

#slide-caption {
	margin-top: 10px;
	color: #333;
}
/* center carousel images */
div.c-wrapper{
    width: 80%; /* for example */
    margin: auto;
}
.carousel-inner > .item > img, 
.carousel-inner > .item > a > img{
/*width: 100%;  use this, or not */
margin: auto;
}

.carousel.fade {
     opacity: 1;
}
.carousel.fade .item {
    transition: opacity ease-out .7s;
  transition-duration: 4s;
      left: 0;
    opacity: 0; /* hide all slides */
    top: 0;
    position: absolute;
    width: 100%;
    display: block;
}
.carousel.fade .item:first-child {
    top: auto;
    opacity: 1; /* show first slide */
    position: relative;
}
.carousel.fade .item.active {
    opacity: 1;
}
/* Fade transition for carousel items (rather than default sliding) */
/*.carousel .item {
    left: 0 !important;
      -webkit-transition: opacity 3s; 
         -moz-transition: opacity 3s;
           -o-transition: opacity 3s;
              transition: opacity 3s;
}
*/
/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
  transition-duration: 4s;
  transition-timing-function:linear;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}
*/
/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}
.carousel-control {
    background-image: none !important; /* remove background gradients on controls */
}
.glyphicon-chevron-right, .glyphicon-chevron-left {
	font-size: 16px !important;	
}
span.glyphicon-arrow-right, span.glyphicon-arrow-left {
	font-size: 1.6em;
}
.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-arrow-left,
.carousel-control .glyphicon-arrow-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
}
.carousel-control .icon-prev,
.carousel-control .glyphicon-arrow-left {
  left: 50%;
  margin-left: -10px;
}
.carousel-control .icon-next,
.carousel-control .glyphicon-arrow-right {
  right: 50%;
  margin-right: -10px;
}

/* glyphicon size adjustments */
.gi-2x{font-size: 2em;}
.gi-3x{font-size: 3em;}
.gi-4x{font-size: 4em;}
.gi-5x{font-size: 5em;}

/* Fade controls with items */
.next.left,
.prev.right {
    opacity: 1;
    z-index: 1;
}
.active.left,
.active.right {
    opacity: 0;
    z-index: 2;
}

/* for indicators below the slides */
.carousel-indicators {
  bottom:-40px;
  text-align: center;
  /*width: 64%;*/
}

.carousel-indicators li {
  border-color:#999;
  background-color:#fff;
}
.carousel-indicators .active {
  border-color: transparent;
  background-color: #BE202E;
}

.carousel-inner {
   margin-bottom:40px;
}