/***************************CAROUSEL-FADE**************************************/

/*LAS IMAGENES DEBEN TENER 1920px de ANCHO****************************/
.carousel-fade{
    max-width: 1920px;
    min-width: 1024px;
    overflow: hidden;
    margin-top: 10em;
    height: 35em;
}

/*RECORTAR POR LOS LADOS EN PANTALLAS MÁS ESTRECHAS*******************/
.carousel-fade .carousel-inner{ 
    width: 1920px;
    left: 50%;
    margin-left: -960px;
}

/*FLECHAS DE CAROUSEL (CONTROLS)**************************************/
.carousel-fade .carousel-control {
   background-image:none; /*eliminar sombras*/
   filter:none;   
   width: 10%;
   cursor: pointer;
}

.carousel-fade .carousel-control.left {
   text-align: left;
}

.carousel-fade .carousel-control.left img{
    margin: 12em 0 0 1em;
}

.carousel-fade .carousel-control.right {
   text-align: right;
}

.carousel-fade .carousel-control.right img{
    margin: 12em 1em 0 0;
}

/*BOLITAS DE CAROUSEL (INDICATORS)************************************/
.carousel-fade .carousel-indicators{
    bottom: 0.5em;
}
.carousel-fade .carousel-indicators li{
    border: 1px solid #fff;
    width: 1em;
    height: 1em;
}

.carousel-fade .carousel-indicators .active{
    background-color: rgb(222,220,0);
}

/*TEXTOS DE DIAPOSITIVA (CAPTION)**************************************/
.carousel-fade .carousel-caption{
    text-align: left;
    left: 18%;
    text-shadow: none;
    bottom: 25%;
}

.carousel-fade .caption_title{
    font-size: 3em;
    background-color: rgba(222,220,0,0.8);
    padding: 0.17em;/*cambiado, antes era 0.3em*/
    font-weight: 300;
    line-height: 2.5em;
}

.carousel-fade .caption_text{
    font-size: 1.5em;
    background-color: rgba(131,133,34,0.7);
    padding: 0.5em;
    font-weight: 300;
}

/*MEDIA QUERIES PARA PORTÁTILES**************************************/
@media screen and (max-width: 1366px){
    .carousel-fade{
        max-width: 1366px;
        min-width: 768px;
        height: 30em;
        margin-top: 10em;
    }

    .carousel-fade .carousel-inner{
        width: 1366px;
        left: 50%;
        margin-left: -688px;
    }
    
    .carousel-fade .carousel-control.left img,
    .carousel-fade .carousel-control.right img{
        margin-top: 8em;
    }
    
    .carousel-fade .carousel-indicators li{
        width: 1.2em;
        height: 1.2em;
    }
    
    .carousel-fade .carousel-caption{
        left: 18%;
        bottom: 38%;
    }

    .carousel-fade .caption_title{
        font-size: 2.2em;
        line-height: 2.5em;
    }

    .carousel-fade .caption_text{
        font-size: 1.5em;
    }
    
}

/*MEDIA QUERIES PARA TABLET HORIZONTAL**************************************/
@media screen and (max-width: 1024px){
    .carousel-fade{
        max-width: 1024px;
        min-width: 768px;
        height: 25em;
        margin-top: 9em;
    }

    .carousel-fade .carousel-inner{
        width: 1024px;
        left: 50%;
        margin-left: -512px;
    }
    
    .carousel-fade .carousel-control.left img,
    .carousel-fade .carousel-control.right img{
        margin-top: 8em;
    }
    
    .carousel-fade .carousel-indicators{
    bottom: 2em;
}
    
    .carousel-fade .carousel-indicators li{
        width: 1.2em;
        height: 1.2em;
    }
    
    .carousel-fade .carousel-caption{
        left: 10%;
        bottom: 20%;
    }

    .carousel-fade .caption_title{
        font-size: 2.1em;
        line-height: 2.7em;
    }

    .carousel-fade .caption_text{
        font-size: 1.4em;
    }
    /*.carousel-fade .carousel-control.left img,
    .carousel-fade .carousel-control.right img{
        margin-top: 7em;
    }
    
    .carousel-fade .carousel-caption{
        bottom: 37%;
        left: 19%;
    }*/

}

/*MEDIA QUERIES PARA TABLET VERTICAL**************************************/
@media screen and (max-width: 992px){
    .carousel-fade{
        max-width: 992px;
        min-width: 768px;
        height: 25em;
        margin-top: 8em;
    }

    .carousel-fade .carousel-inner{
        width: 992px;
        left: 50%;
        margin-left: -496px;
    }
    
    .carousel-fade .carousel-control.left img,
    .carousel-fade .carousel-control.right img{
        margin-top: 8em;
    }
    
    .carousel-fade .carousel-indicators{
    bottom: 2em;
}
    
    .carousel-fade .carousel-indicators li{
        width: 1.2em;
        height: 1.2em;
    }
    
    .carousel-fade .carousel-caption{
        left: 18%;
        bottom: 20%;
    }

    .carousel-fade .caption_title{
        font-size: 2.1em;
        line-height: 2.7em;
    }

    .carousel-fade .caption_text{
        font-size: 1.2em;
    }
    /*.carousel-fade .carousel-control.left img,
    .carousel-fade .carousel-control.right img{
        margin-top: 7em;
    }
    
    .carousel-fade .carousel-caption{
        bottom: 37%;
        left: 19%;
    }*/

}

@media screen and (max-width: 767px){
    .carousel-fade{
        display: none;
    }
}    

/*TRANSICIÓN FADE DE CAPTIONS*************************************/
.carousel-fade .carousel-caption{
    opacity: 0;
    transition: opacity 2s ease-out;
    transition-delay: 0.5s;
}

.carousel-fade .active .carousel-caption{
    opacity: 1;
}

/*TRANSICIÓN FADE DE DIAPOSITIVAS*************************************/
.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
    opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}

@media all {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}