/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/*-----------------------------------------------------------------------------------------------------
INDEX*/

.nav_white .nav_links h3, .nav_white .nav_links a, .nav_white .nav_links .lang_nav h3{
    color:#fff;
}
.nav_white .lang_dropdown_white select{
    color: #fff;
}

/*landing slider*/
#landing{
    height: 100vh;
}

.controls{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    grid-column: 1/4;
    -ms-grid-row: 5;
    -ms-grid-row-span: 1;
    grid-row: 5/6;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.controls .card{
    color: rgba(255,255,255,.50);
    width: auto;
    padding: 0 2rem;
    -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
            transform: scale(0.9);
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}

.controls .card h3{
    margin: 0;
}

.controls .card button{
    color: white;
    border-color: white;
    background-color: #fff0;
    display: none;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}

.controls .active{
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}

.controls .active button{
    display: inline;
    -webkit-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}

.controls .active h3, .controls .active h2{
    color: white;
}

.slider-item img{
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}


/*empresa e serviços*/

#empresa_img{
    -ms-grid-column: 1;
    -ms-grid-column-span: 6;
    grid-column: 1/7;
    -ms-grid-row: 1;
    -ms-grid-row-span: 5;
    grid-row: 1/6;
    width: 100%;
    overflow: hidden;
    opacity: 0.3;
    z-index: 1;
}

#empresa{
    -ms-grid-column: 4;
    -ms-grid-column-span: 2;
    grid-column: 4/6;
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    grid-row: 2/3;
    margin-bottom: 2rem;
    z-index: 2;
}

#servicos{
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2/4;
    -ms-grid-row: 3;
    -ms-grid-row-span: 2;
    grid-row: 3/5;
    margin-top: 2rem;
    padding-left: 0;
    z-index: 2;
}

.slider_imgs{
    -ms-grid-column: 4;
    -ms-grid-column-span: 3;
    grid-column: 4/7;
    -ms-grid-row: 3;
    -ms-grid-row-span: 2;
    grid-row: 3/5;
    margin-top: 3rem;
    z-index: 3;
}

.slider_imgs img{
    opacity: 0;
    visibility: hidden;
    padding-top: 2rem;
    padding-left: 2rem;
    position: absolute;
    height: 35rem;
    width: 42.5rem;
    z-index: 3;
    overflow: hidden;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.slider_imgs .active_img{
    opacity: 1;
    visibility: visible;
    z-index: 3;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

#servicos_background_img{
    background-color: #62170D;
    -ms-grid-column: 4;
    -ms-grid-column-span: 3;
    grid-column: 4/7;
    -ms-grid-row: 3;
    -ms-grid-row-span: 2;
    grid-row: 3/5;
    overflow: hidden;
    z-index: 2;
    margin-top: 3rem;
    margin-bottom: 5rem;
}

#servicos_h2{
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
    -ms-grid-row: 3;
    -ms-grid-row-span: 1;
    grid-row: 3/4;
    font-family: 'Lato', sans-serif;
    color: #A2A2A2;
    margin-left: 2rem;
    z-index: 2;
}

#servicos_h2 h2{
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    width: fit-content;
}

#servicos_h2 .active_slide_title{
    cursor: pointer;
    padding-left: 2rem;
    color: black;
}

#servicos_background{
    -ms-grid-column: 1;
    -ms-grid-column-span: 4;
    grid-column: 1/5;
    -ms-grid-row: 3;
    -ms-grid-row-span: 4;
    grid-row: 3/7;
    background-color: #F5F5F5;
    z-index: 2;
}

/*obras*/
#obras_description{
    padding-left: 0;
    margin-left: 0;
}

#obras div{
    margin: 0.75rem;
}

#obras div h2{
    color: black;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    margin-bottom: 0;
    margin-top: 0.5rem;
}

#obras div p{
    color: black;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    margin: 0.5rem 0;
}

#obras div:nth-child(1){
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2/4;
    -ms-grid-row: 2;
    -ms-grid-row-span: 2;
    grid-row: 2/4;
}
#obras div:nth-child(2){
    -ms-grid-column: 4;
    -ms-grid-column-span: 1;
    grid-column: 4/5;
    -ms-grid-row: 2;
    -ms-grid-row-span: 2;
    grid-row: 2/4;
}
#obras div:nth-child(3){
    -ms-grid-column: 5;
    -ms-grid-column-span: 1;
    grid-column: 5/6;
    -ms-grid-row: 2;
    -ms-grid-row-span: 2;
    grid-row: 2/4;
}
#obras div:nth-child(4){
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    grid-column: 2/3;
    -ms-grid-row: 4;
    -ms-grid-row-span: 2;
    grid-row: 4/6;
}
#obras div:nth-child(5){
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    grid-column: 3/4;
    -ms-grid-row: 4;
    -ms-grid-row-span: 2;
    grid-row: 4/6;
}
#obras div:nth-child(6){
    -ms-grid-column: 4;
    -ms-grid-column-span: 1;
    grid-column: 4/5;
    -ms-grid-row: 4;
    -ms-grid-row-span: 2;
    grid-row: 4/6;
}
#obras div:nth-child(7){
    -ms-grid-column: 5;
    -ms-grid-column-span: 1;
    grid-column: 5/6;
    -ms-grid-row: 4;
    -ms-grid-row-span: 2;
    grid-row: 4/6;
}

#obras img{
    width: 100%;
    height: 15rem;
    overflow: hidden;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
}

#obras div:hover > a h2, #obras div:hover > a p{
    color: #62170D;
}
#obras div:hover > a img{
    -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
            transform: scale(1.05);
}