
#MyCarousel {
margin-top: -1px;
}

/* Carousel base class */


.carousel {
height: 320px;
}

/* Since positioning the image, we need to help out the caption */


.carousel-caption {
z-index: 10;
}

.carousel-caption {
position: absolute;
top: 25px;
color: #FFF;
text-align: center;
text-shadow: none;
padding-top: 20px;
z-index: 10;
}

.carousel-caption p {
margin-bottom: 5px;
font-size: 31px;
font-weight: 300;
line-height: 1.4;
}

.carousel-caption p.title {
font-size: 38px;
}

/* Declare heights because of positioning of img element */

.carousel .item {
height: 320px;
background-color: #777;
}

.carousel-inner > .item > img {
min-width: 100%;
height: auto;
}

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

@media (min-width: 768px) {

/* The navbar becomes detached from the top, so we round the corners */


.navbar-wrapper .navbar {
border-radius: 4px;
}

/* Bump up size of carousel content */


.carousel {
height: 390px;
}

.carousel .item {
height: 390px;
}

.carousel-caption {
top: 60px;
}

.carousel-caption p {
margin-bottom: 10px;
font-size: 40px;
line-height: 1.3;
}

.carousel-caption p.title {
font-size: 50px;
}
}
 @media (min-width: 992px) {
.carousel-caption {
top:60px;
}

}
