/**********/
/* HEADER */
/**********/

#header{
    margin-top: 10vh;
    height: 90vh;
    width: 100vw;
    background-color: RGBA(23,45,59,1);
}
.header-img{
    height: 90vh;
    width: 100vw;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.header-descricao{
    position: absolute;
    left: 10%;
    bottom: 15%;
    max-width: 350px;
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, RGBA(0,0,0,1) 0%, RGBA(0,0,0,0.5) 50%);
    text-transform: uppercase;
}
.descricao-vermelho{
    -webkit-text-fill-color: #FFFFFF;
    background-color: RGBA(203,82,82,1);
    padding: 0 5px;
}

/*****************/
/* HEADER MOBILE */
/*****************/

#header-mobile{
    margin-top: 7vh;
    height: 93vh;
    width: 100vw;
}
.header-img-mobile{
    height: 93vh;
    width: 100vw;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.header-mobile-descricao{
    position: absolute;
    left: 10%;
    bottom: 10%;
    max-width: 250px;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(45deg, RGBA(0,0,0,1) 0%, RGBA(0,0,0,0.5) 50%);
    text-transform: uppercase;
}

@media screen and (max-width: 991px){  
    #header{
        margin-top: 7vh;
        height: 93vh;
    }
    .header-img{
        height: 93vh;
    }
}

/* EFEITO FADE NO CAROUSEL BOOTSTRAP */
.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .7s;
 transition-property: opacity;
}
.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}
.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}