@import url(./carrossel.css);
@import url(./style.css);


@media screen and (max-width: 1389px) {
    .img-juntas {
        flex-wrap: wrap;
        padding-top: 20px;
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 30px;
        align-items: center
    }


    .container-section-2 {
        width: 100%;
        padding-top: 50px;
        padding-bottom: 50px;
        height: 100%;
        background-color: yellow;
        flex-wrap: wrap;
    }

}

@media screen and (max-width: 1300px) {
    .container-section-1 {
        display: flex;
        flex-wrap: wrap;
        background-color: #e6e6e6;
        width: 100%;
        align-items: center;
        padding-top: 70px;
        gap: 70px;
        justify-content: center;

    }

    .texto-sobre {
        padding: 10px;
    }
}

@media screen and (max-width: 800px) {
    .container-section-5 {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 50px;
        align-items: center;
        padding-top: 50px;
        background-color: red;
        flex-wrap: wrap;
    }
}


@media screen and (max-width: 1200px) {

    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 30px;
        z-index: 100;
        margin-top: 450px;



    }

}


@media screen and (max-width: 1067px) {
    #butyn {
        font-weight: bold;
        color: rgb(194, 0, 0);
        background-color: yellow;
        border: none;
        border-radius: 50px;
        padding: 5px 5px;
        font-size: 25px;
        cursor: pointer;
        transition: 0.3s;
    }

    .escrita {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }



    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 30px;
        z-index: 100;
        margin-top: 400px;
    }

    .escrita-na-imagem h1 {
        font-size: 30px;
        color: red;
    }

}


@media screen and (max-width: 934px) {
    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 30px;
        z-index: 100;
        margin-top: 350px;
    }

    .escrita-na-imagem h1 {
        font-size: 25px;
        color: red;
    }
}



@media screen and (max-width: 829px) {

    .container-section-5 {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 50px;
        align-items: center;
        padding-top: 50px;
        background-color: red;
    }

}

@media screen and (max-width: 800px) {
    .container-section-3 {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding-top: 50px;
        background-color: #e6e6e6;
        gap: 30px;
        justify-content: center;
        padding-bottom: 30px;
    }
}

@media screen and (max-width: 816px) {
    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 30px;
        z-index: 100;
        margin-top: 300px;
    }

    .escrita-na-imagem h1 {
        font-size: 30px;
        color: red;
    }
}


@media screen and (max-width: 777px) {

    #butyn {
        font-weight: bold;
        color: rgb(194, 0, 0);
        background-color: yellow;
        border: none;
        border-radius: 50px;
        padding: 10px 5px;
        font-size: 15px;
        cursor: pointer;
        transition: 0.3s;
    }

    .escrita {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }



    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 30px;
        z-index: 100;
        margin-top: 300px;
    }

    .escrita-na-imagem h1 {
        font-size: 20px;
        color: red;
    }

}

@media screen and (max-width: 658px) {
    #butyn {
        font-weight: bold;
        color: rgb(194, 0, 0);
        background-color: yellow;
        border: none;
        border-radius: 50px;
        padding: 10px 20px;
        font-size: 10px;
        cursor: pointer;
        transition: 0.3s;
    }

    .escrita {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }



    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 20px;
        z-index: 100;
        margin-top: 200px;
    }

    .escrita-na-imagem h1 {
        font-size: 20px;
        color: red;
    }
}


@media screen and (max-width: 658px) {

    #butyn {
        font-weight: bold;
        color: rgb(194, 0, 0);
        background-color: yellow;
        border: none;
        border-radius: 50px;
        padding: 10px 20px;
        font-size: 8px;
        cursor: pointer;
        transition: 0.3s;
    }

    .escrita {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }



    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 20px;
        z-index: 100;
        margin-top: 180px;
    }

    .escrita-na-imagem h1 {
        font-size: 20px;
        color: red;
    }
}



@media screen and (max-width: 400px) {

    #butyn {
        font-weight: bold;
        color: rgb(194, 0, 0);
        background-color: yellow;
        border: none;
        border-radius: 50px;
        padding: 4px 16px;
        font-size: 8px;
        cursor: pointer;
        transition: 0.3s;
    }

    .escrita {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }



    .escrita-na-imagem {
        position: absolute;
        display: flex;
        justify-content: space-around;
        gap: 1px;
        z-index: 100;
        margin-top: 180px;
    }

    .escrita-na-imagem h1 {
        font-size: 20px;
        color: red;
    }
}



@media screen and (max-width: 1680px) {

    .imagens1 img {
        width: 100%;
        max-width: 200px;
    }
}



@media screen and (max-width: 1428px) {

    .imagens1 img {
        width: 100%;
        max-width: 200px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 60px;

    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 60px;

    }

}

@media screen and (max-width: 1275px) {

    .imagens1 img {
        width: 100%;
        max-width: 180px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 40px;

    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 40px;

    }
}

@media screen and (max-width: 1093px) {

    .imagens1 img {
        width: 100%;
        max-width: 160px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 40px;

    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 40px;

    }
}


@media screen and (max-width: 980px) {

    .imagens1 img {
        width: 100%;
        max-width: 140px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 40px;

    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 40px;

    }
}

@media screen and (max-width: 887px) {

    .imagens1 img {
        width: 100%;
        max-width: 130px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 30px;

    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;

    }
}



@media screen and (max-width: 810px) {

    .imagens1 img {
        width: 100%;
        max-width: 100px;
    }

    .imgs1 {
        display: flex;
        align-items: center;
        gap: 40px;
        width: 322px;
    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;

    }
}



@media screen and (max-width: 810px) {
    #nao {
        display: none;
    }

    

    .imgs12 {
        width: 100%;
        max-width: 160px;
        display: flex;
        align-items: center;
        gap: 44px;
        margin-bottom: 20px;
        display: block;
        justify-content: center;

    }

    .container-section2 {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }


    .imagens12 img {
        width: 100%;
        max-width: 120px;
    }

    .imagens1 img {
        width: 100%;
        max-width: 120px;
    }

    .imagens1 {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;

    }
}



@media screen and (min-width: 1920px) {
    .container-section-amais {
        background-color:#e6e6e6 ;
        display: flex;
    flex-direction: column;
     justify-content: center;
     padding-left: 250px;
     padding-top: 70px;
     padding-bottom: 70px;
    }

    .texto h1 {
        margin-bottom: 20px;
        padding-top: 20px;
        font-size: 35px;
        color: red;
    }.texto p {
        font-size: 25px;
    }

}



@media screen and (max-width: 1400px) {
    .container-section-amais {
        background-color:#e6e6e6 ;
        display: flex;
    flex-direction: column;
     justify-content: center;
     padding-left: 150px;
     padding-top: 70px;
     padding-bottom: 70px;
    }

    .texto h1 {
        margin-bottom: 20px;
        padding-top: 20px;
        font-size: 30px;
        color: red;
    }.texto p {
        font-size: 20px;
    }

}




@media screen and (max-width: 1030px) {
    .container-section-amais {
        background-color:#e6e6e6 ;
        display: flex;
    flex-direction: column;
     justify-content: center;
     padding-left: 80px;
     padding-top: 70px;
     padding-bottom: 70px;
    }

    .texto h1 {
        margin-bottom: 20px;
        padding-top: 20px;
        font-size: 28px;
        color: red;
    }.texto p {
        font-size: 20px;
    }

}



@media screen and (max-width: 920px) {
    .container-section-amais {
        background-color:#e6e6e6 ;
        display: flex;
    flex-direction: column;
     justify-content: center;
     padding-left: 20px;
     padding-top: 70px;
     padding-bottom: 70px;
    }

    .texto h1 {
        margin-bottom: 20px;
        padding-top: 20px;
        font-size: 28px;
        color: red;
    }.texto p {
        font-size: 20px;
    }

}






@media screen and (max-width: 880px) {
    .container-section-amais {
        background-color:#e6e6e6 ;
        display: flex;
    flex-direction: column;
     justify-content: center;
     padding: 10px;
     padding-top: 70px;
     padding-bottom: 70px;

    }

    .texto {
        text-align: center;
    }

    .texto h1 {
        margin-bottom: 20px;
        padding-top: 20px;
        font-size: 28px;
        color: red;
    }.texto p {
        font-size: 18px;
    }

}



@media screen and (max-width: 800px) {

    .servicoos {
        display: flex;
        gap: 20px;
        
    }

    .texto-depois {
        display: flex;

    }

    .texto-depois  h1 {
        font-size: 23px;
    }
}



@media screen and (max-width: 660px) {
    .servicoos {
        display: flex;
        gap: 30px; 
    }

    .texto-depois {
        justify-content: center; 
        display: flex;
    }

    .texto-depois  h1 {
        font-size: 18px;
    }
}



@media screen and (max-width:370px) {
    .container-imgs {
        width: 370px;
    }
}

@media screen and (max-width:557px) {
    .servicoos {
        align-items: center;
        display: flex;
        gap: 30px;
        
    }

    .texto-depois {
     
        display: flex;
        align-items: center;
        padding: 10px;
    }

    .texto-depois  h1 {
        width: 255px;
        font-size: 18px;
    }
}