/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 360px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 360px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: auto;
}

.carousel-caption{
  width: 100%;
  background-color: rgba(255,255,255, .8);
  right:0;
  left: 0;
  bottom: 0;
  text-align: left;
  padding: 10.5px 18px;
}

.carousel-caption h6 {
  color: #C51415;
  font-family: 'Adobe Garamond W08', Georgia, "Times New Roman", Times, serif !important;
  font-weight: bold;
  font-size: 26px !important;
  text-shadow: none;
  margin-top: 5px;
  margin-bottom: 3px;
}

.carousel-caption p {
  color: #000;
  font-family: sans-serif !important;
  font-size: 14px !important;
  text-shadow: none;
}

.carousel-indicators li{
  background-color: #869791;
  border-color: #869791;
  opacity: 0.5;
}

.carousel-indicators .active{
  background-color: #869791;
  border-color: #869791;
  opacity: 1;
}
.indicators-mobile{
  visibility: hidden;
}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 300px) and (max-width: 399px) {
  .carousel{
    margin-top: 150px;
  }
  .carousel-indicators{
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .carousel .item {
  height: 260px;
}

  .carousel-indicators.indicators-mobile{
  visibility: visible;
  }

  .carousel-indicators li{
    width: 15px;
    height: 15px;
  }

  .carousel-indicators .active{
    width: 17px;
    height: 17px;
  }

  .carousel .item{
    background-color: #eaeaea;
  }

  .carousel-caption{
    position: relative;
    margin-top: 116px;
    width: 110%;
  }
  
  .carousel-caption h6{
  font-size: 16px !important;
  }

  .carousel-caption p{
  font-size: 12px !important;
  }

  .container .carousel-caption{
    margin-left: -15px !important;
    margin-right: -15px !important;
  }

  #tuevHeaderImageMarginBottom{
    margin-top: 0px !important;
  }

}

@media (min-width: 400px) and (max-width: 590px) {
  .carousel-indicators{
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .carousel-indicators.indicators-mobile{
  visibility: visible;
  }

  .carousel-indicators li{
    width: 15px;
    height: 15px;
  }

  .carousel-indicators .active{
    width: 17px;
    height: 17px;
  }

  .carousel .item{
    background-color: #eaeaea;
  }

  .carousel-caption{
    position: relative;
    margin-top: 177px;
    width: 108%;
  }
  
  .carousel-caption h6{
  font-size: 16px !important;
  }

  .carousel-caption p{
  font-size: 12px !important;
  }

  .container .carousel-caption{
    margin-left: -15px !important;
    margin-right: -15px !important;
  }

  #tuevHeaderImageMarginBottom{
    margin-top: 45px !important;
  }

}

@media (min-width: 591px) and (max-width: 766px) {
  .carousel-indicators{
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .carousel-indicators.indicators-mobile{
  visibility: visible;
  }

  .carousel-indicators li{
    width: 15px;
    height: 15px;
  }

  .carousel-indicators .active{
    width: 17px;
    height: 17px;
  }

  .carousel .item{
    background-color: #eaeaea;
  }

  .carousel-caption{
    position: relative;
    margin-top: 234px;
    width: 108%;
  }
  
  .carousel-caption h6{
  font-size: 16px !important;
  }

  .carousel-caption p{
  font-size: 12px !important;
  }

  .container .carousel-caption{
    margin-left: -15px !important;
    margin-right: -15px !important;
  }

  #tuevHeaderImageMarginBottom{
    margin-top: 45px !important;
  }

}

@media (min-width: 767px) and (max-width: 982px) {

  /* size of carousel and content */
  .carousel {
    height: 233px;
  }

  .carousel .item {
    height: 233px;
  }

  .carousel-caption h6 {
    font-size: 16px !important;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    height: 35px;
    margin-bottom: 20px;
    font-size: 13px !important;
    line-height: 1.4;
  }
  .carousel-indicators{
    bottom: 0px;
  }

}

@media (min-width: 920px) {

  /* size of carousel and content */
  .carousel {
    height: 277px;
  }

  .carousel .item {
    height: 277px;
  }

}

@media (min-width: 983px) and (max-width: 1181px) {

  /* size of carousel and content */
  .carousel {
    height: 300px;
  }

  .carousel .item {
    height: 300px;
  }

  .carousel-caption p {
    height: 37.45px;
  }

  .carousel-caption h6 {
    font-size: 18px !important;
  }

  .carousel-indicators{
    bottom: -9px;
  }

}

@media (min-width: 1182px) {

  /* size of carousel and content */
  .carousel {
    height: 360px;
  }

  .carousel .item {
    height: 360px;
  }

  .carousel-caption p {
    height: 48px;
  }

  .carousel-indicators{
    bottom: -2px;
  }

}