/* CSS Document */

#carousel-latest .carousel-caption {
    background:rgba(0,0,0,0.40);  
    right: 0%;
    text-align: left;
    width: 270px;
    height: 100%;
    left: auto;
    top: auto;
    bottom: 0px;
    padding: 20px;
    color: #fff;
}

.carousel-caption h3 {
  color: #fff;
  font-weight:bold;
  font-size: 14px;
}

.carousel-caption-header {
    position: absolute;
    z-index:11;
    left: 35px;
    text-align: left;
    width: auto;
    height: auto;
    right: auto;
    top: auto;
    bottom: 40px;
}

.carousel-caption-header h1 {
  color: #fff;
  text-shadow: 0 0 10px black;
  font-weight:bold;
  font-size: 36px;
}

.carousel-caption-header h2 {
  color: #fff;
  text-shadow: 0 0 5px black;
  font-weight:bold;
  font-size: 20px;
}

#carousel-latest .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
    margin-left: -150px;
}

#carousel-latest .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
    margin-right: -150px;
}

.carousel-control {
    color: #666;
    text-shadow: none;
}

#visual .carousel-control a {
    color: #666;
}

.glyphicon {
    font-family: "Glyphicons Halflings";
} 

.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev {
    font-size: 40px;
}


.carousel-indicators {
    bottom: 0px;
}

/* Start Position Pfeile innerhalb */

 #carousel-latest .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
      margin-left: -40px;
     
  }                 
  #carousel-latest .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
      margin-right: 250px;
    
  }  
    
  .carousel-control {
      color: #fff;
      text-shadow: none;
  }
  
  #visual .carousel-control a {
      color: #fff;
  }      
/* Ende Position Pfeile innerhalb */

@media(max-width:1160px) {       
          
}

@media only screen and (min-width: 961px) and (max-width:990px) {
  #carousel-latest .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
      margin-left: -25px;
  }
  
  .carousel-caption-header h1 {     
    font-size: 24px;
  }     
}


/* z.B. iPhone 6 Plus */ 
@media only screen and (min-width: 668px) and (max-width: 960px) { 
     #carousel-latest .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {
      margin-left: -40px;
      margin-top: -80px;
  }                 
  #carousel-latest .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
      margin-right: 250px;
      margin-top: -80px;
  }  
  
  .carousel-caption-header h1 {     
    font-size: 22px;    
  }
  
  #carousel-latest .carousel-caption {
    width: 240px;  
    padding: 15px;
  }
  
  #carousel-latest .carousel-caption p {
    margin: 0 0 10px;
    font-size: 12px;
  } 
}

/* z.B. iPhone 6 */ 
@media only screen and (max-width: 667px) { 

.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev {
    position: absolute;
    top: 0px;
    z-index: 5;
    display: inline-block;
    margin-top: 100px;     
}

#carousel-latest .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
      margin-right: -40px;    
  }  

#carousel-latest .carousel-caption h3 {
  display:none;
}

.carousel-caption-header {
  position: relative;
  bottom: 0px;
  left: 0px;
  top:0px;
  background:#666;
  padding: 15px;  
  border-top: 1px solid #ccc;   
}

  #carousel-latest .carousel-caption {
    position: relative;
    width:100%;
    padding: 0px 15px 15px 15px;
    color: #fff;
    text-align: left;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
    background:#666;
  }      
  .carousel-caption-header h1 {
    color: #fff;
    text-shadow: 0 0 0px black;
    font-weight:bold;
    font-size: 18px;
    margin:0px;
    width:100%;
  }
  
  .carousel-caption-header h2 {
    color: #fff;
    text-shadow: 0 0 0px black;
    font-weight:bold;
    font-size: 14px;
  }     

  
}