/*!
 * Start Bootstrap - Half Slider HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

html,
body {
    height: 100%;
}

/* You can change the height of the carousel by changing the height in the class below. It is set to 50% by default, but can be any height! */

.carousel {
    height: 97%;
    margin-bottom: 0%;
    position: relative;
    top: 0px;
}

.carousel-indicators .active {
    margin: 0;
    width: 12px;
    height: 12px;
    background-color: #d0112b !important;
	margin-top: 1px; 
}


.carousel-caption {
	text-align: center !important;
    color: #fff;
    position: absolute;
    bottom: 35%;
    font-size: 1em;
/*
    left: 28%;
    right: 20%;
    padding-bottom: 30px;
    bottom: 40%;
    color: #000;
    text-shadow: 0 0px 0px rgba(0,0,0,.6);
    width: 37%;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 15px;
*/
}


.carousel-caption-static-banner{
    left: 4% ;
    right: 20%;
    padding-bottom: 30px;
    bottom:6%;
    color:#fff !important;
    text-shadow: 0 0px 0px rgba(0,0,0,.6);
    background-color: transparent !important;
    padding: 15px;
    width: 100%;    
}

.static-banner {
    height: 32%;
    margin-bottom: -18%;
    position: relative;
    top: -231px;
}



.item,
.active,
.carousel-inner {
    height: 100%;
      margin-left: 0% !important;

}


.carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    border: 2px solid #fff;
    border-radius: 0px;
    cursor: pointer;
    background-color: #000 \9;
    background-color: rgba(0,0,0,0);
    position: relative;
    float: right;
    top: -18px;    
    right: 23%; 
	padding: 7px;    
    /* visibility: hidden; */
}

/* Background images are set within the HTML using inline CSS, not here */

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

footer {
    margin: 0px 0;
}


/*
 @media (max-width: 2500px){
.carousel {
    height: 70%;
    margin-bottom: -12%;
    position: relative;
    top: -23%;
}
 
 }
*/
 
 
  @media (max-width: 1199px){
 .captions-on-images {
    position: relative;
    top: 319px;
    z-index: 1;
    margin-top: -65px;
    margin-left: 20px;
    margin-bottom: 30px;
    color: #fff;
    width: 305px;
}
}


  @media (max-width: 991px){
.captions-on-images {
    position: relative;
    top: 253px;
    z-index: 1;
    margin-top: -59px;
    margin-left: -2px;
    margin-bottom: 30px;
    color: #fff;
    width: 305px;
   font-size: 18px; 
}

.captions-on-images-top {
    position: relative;
    top: 101px;
    z-index: 1;
    margin-top: -65px;
    margin-left: 9px;
    margin-bottom: 30px;
    color: #fff;
    width: 305px;
}
}


 @media (max-width: 768px){
.carousel-caption {
	background: none;
    position: absolute;
    top: 55%;
    font-size: 6px;
    margin: 0 auto;
    width: 100%;
    margin-left: -60px;
/*
    left: 11% ;
    right: 20%;
    padding-bottom: 30px;
    bottom:24% !important;
    color:#000;
    text-shadow: 0 0px 0px rgba(0,0,0,.6);
    width: 76%;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 15px;
*/
}
.carousel {
    height: 70%;
    margin-bottom: -45px;
    position: relative;
    top: -22% !important;
}
}


 @media (max-width: 480px){
.carousel {
    height: 70%;
    margin-bottom: 15px;
    position: relative;
    top: -4% !important;
        width: 107%;
}

.captions-on-images-top {
    position: relative;
    top: 101px;
    z-index: 1;
    margin-top: -102px;
    margin-left: 21px;
    margin-bottom: 32px;
    color: #fff;
    width: 305px;
}

.captions-on-images {visibility: hidden;}

 }