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

/* Carousel base class */
.carousel {
	font-family: 'PT Sans', sans-serif;
	font-size: 1.0em;
	height: auto;
	margin-bottom: 0px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
	top: 10%;
	left: 18%;
}


.carousel-caption > h1 {
	font-size: 2.4em;
	text-transform: none;
	position: absolute;
	font-weight: bold;
	padding: 3px 5px 3px 5px; 
	text-align: left; 
	letter-spacing: 0.03em; 
	background: #FFF; 
	color: #000; 
	opacity: 0.7;
	text-shadow:none;
	
}

.carousel-caption > p {
	font-size: 1.2em;
	width: 70%;
	height: auto; 
	padding: 5px; 
	text-align: left; 
	letter-spacing: 0.02em; 
	background: #FFF; 
	color: #000; 
	opacity: 0.7;
	text-shadow:none;
	margin-top: 90px;
}

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

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

@media (max-width: 576px) { 
  .container .carousel-caption > h1 {font-size: 1.3em; opacity: 0.8;}
  .container .carousel-caption > p {display:none;}  
}