
html{
    overflow-x: hidden;
}
header{
    background-color: #F4B328;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 60vh;
    position: relative;
}
.logo-artcom > img{
    position: fixed;
    top: 0;
    width: 150px;
    left: 100px;
    z-index: 9;
}

.header-text{
    /* margin: 100px 0 0 0; */
}
.header-text > h1{
    color: #EDE9E6;
    font-size: 2rem;
    font-weight: 400;
}
.header-text > p{
    font-size: 1.3rem;
}
.header-icons{
    width: 100vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.logo-25{
    width: 120px;
    position: relative;
    right: 18vw;
    bottom: 30px;
}
.header-icon{
    width: 100px;
    position: relative;
    bottom: 20px;
    left: 18vw;
}

/* MAIN */
main{
    overflow-x: hidden;
    position: relative;
    background-color: #EDE9E6;
    max-height: calc(fit-content - 600px);
}
.main-img{
    width: 100vw;
    z-index: 2;
}
.main-about{
    position: relative;
}
.linhas1{
    position: absolute;
    top: 0;
    /* idth: 54vw; */
    left: -400px;
    z-index: -0;
}
.linhas4{
    position: absolute;
    bottom: 0px;
    right: -500px;
}
.main-img1{
    margin: 420px 0 0 10vw;
    width: 100vw;
}
.main-img2{
    width: 120vw;
    position: relative;
    left: -39vw;
    top: -200px;
}
/* .main-img2{
    width: 95vw;
    z-index: 2;
    //margin: 200px 0 0 0;
} */
.main-img3{
    width: 100vw;
    margin: 0 0 -400px 0;
    position: relative;
    top: -500px;
}
/* .pessoal{
    position: relative;
}
.linhas2{
    position: absolute;
    top: -200px;
    //width: 54vw;
    left: -200px;
    z-index: -0;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
} */
/* .linhas3{
    position: absolute;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
} */


@media screen and (max-width: 800px){
    .main-img3 {
        width: 100vw;
        margin: 0 0 -350px 0;
        position: relative;
        top: -400px;
    }
    .header-text > p {
        font-size: 1rem;
    }
    .logo-25 {
        width: 100px;
    }
    .header-icon {
        width: 80px;
    }
    .linhas4 {
        width: 650px;
    }
}