@media(max-width: 574px) {

    body,
    main {
        overflow-x: hidden;
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO HEADER ***********************************/
    header {
        background-image: url('../image/headerPhone.webp');
        height: 1200px;
    }

    header,
    .container-apresentacao,
    .box-txtprincipal,
    .text-header,
    .text-header div,
    .container-header,
    .paragrafo-header,
    .box-txtprincipal,
    .btn-cotacao {
        width: 100% !important;
    }

    .container-header {
        margin: 0;
    }

    .container-apresentacao {
        flex-direction: column-reverse;
        height: 80%;
    }

    .titulo {
        font-size: 3rem;
        margin-top: 0px;

    }

    .text-header div p {
        letter-spacing: 0px;
        width: 100%;
    }

    .box-txtprincipal,
    .box-img-header {
        height: 50%;
        width: 100%;
        padding: 0 20px;
    }


    .box-img-header img {
        margin: 0;
        object-fit: cover;
        width: 600px;
        height: 600px;
        margin-left: -100px;
    }


    .menu-toggle {
        display: block;
        color: #01131E;

    }

    /*********************************** CONFIGURAÇÃO lista de produto ***********************************/
  
    .container-prudutos {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 10px !important;
        margin: 0;
        padding: 100px 0;
    }

    .container-alguns-produtos {
        margin: 10px 0;
        width: 100%;
    }

    .card-list {
        
        display: flex !important;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        padding: 0;
        margin: 0;

        width: 100%;
    }

    .card-list li {
        margin: 0;
        width:350px !important;
        height: 450px;
    }


    .box-titulo-produto {
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO CARROSEL ***********************************/

    .carousel-item,
    .bg-primero,
    .bg-segundo,
    .bg-terceiro {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;

        display: flex;
        flex-direction: column;
        width: 100%;
        height: 600px;
    }

    .box-titulo-carrosel {
        padding: 50px 0;

    }

    .carousel-item .bg-primero {
        background-image: url('../image/carrosel.webp');

    }

    .carousel-item .bg-segundo {
        background-image: url('../image/carrosel1.webp');

    }

    .carousel-item .bg-terceiro {
        background-image: url('../image/carrosel2.webp');

    }

    .box-img-text-carrosel {
        flex-direction: column-reverse;
    }

    .box-img-text-carrosel .descricao-carrosel {
        padding: 0 20px;
        width: 100%;
    }

    .descricao-carrosel h4,
    .paragrafo-carrosel {
        width: 100%;
    }

    .box-img-text-carrosel .chicara-carrosel {
        width: 70%;
        height: 80%;
        object-fit: contain;
    }

    .box-img-text-carrosel .img-cartao-carrosel {
        width: 60%;
        height: 70%;
        object-fit: contain;
    }

    .box-img-text-carrosel .img-pilha-carrosel {
        width: 45%;
        height: 50%;
        object-fit: contain;
        margin-bottom: 0px;
    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO PRODUTOS MAIS VENDIDOS ***********************************/

    .prod-titulo {
        flex-direction: column;

        justify-content: center;
    }


    .produtos-mais-vendidos .box-titulo-vendidos {
        padding: 0;
        margin-bottom: 20px;
    }

    .list-produtos {
        flex-wrap: wrap;
    }

    .produtos-mais-vendidos .box-titulo-vendidos {
        border-right: none;
    }

    .produtos-mais-vendidos ul li {
        width: 40%;
        height: 100%;

    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO PRODUTOS **********************************
    .catalogoProdutos {
        background-image: url('../image/bgprodutosphone.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        width: 100%;
        height: 5110px;
    }

    .container-Produtos {
        width: 80%;
        margin: auto;
        display: flex;
        align-items: start;
        justify-content: start;
    }

    .titulo-Produtos {
        display: flex;
        align-items: center;
        justify-content: start;
        width: 100%;
        margin: 25px 0 0 0;
        font-size: 4rem;
        background: linear-gradient(94deg, #032030 -6.9%, #00A6CA 44.73%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .subtitulo-Produtos {
        font-size: 2rem;
        color: var(--background-two) !important;
        font-weight: 500;

    }
*/
    /*********************************** CONFIGURAÇÃO CABEÇALHO SOBRE ***********************************/
    .sobrempresa {
        background-image: url("../image/sobreempresaphone.webp");
        display: flex;
        justify-content: end;
        width: 100%;
        height: 1065px !important;
    }

    .container-sobre {
        flex-direction: column;
        height: 100%;
    }

    .text-btn {
        justify-content: end;
        align-items: center;
        width: 100%;
        height: 50%;
        margin-top: 70px;
    }

    .text-btn div p {
        padding: 15px 0;
    }

    .text-btn .btn-cotacao {
        display: none;
    }

    .text-btn .text-left,
    .text-rigth {
        width: 100%;
        text-align: justify;
    }

    .box-rigth {
        flex-direction: column;
        justify-content: start;
        width: 100%;
        height: 40%;
        margin-top: -50px;
    }

    .box-rigth .btn-cotacao {
        display: flex;
        margin-top: 40px;
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO FORMULARIO ***********************************/

    .formulario {
        display: flex;
        justify-content: center;
        align-items: end;
        width: 100%;
    }

    .container-formulario {
        flex-direction: column-reverse;
    }

    .box-img-form {
        width: 100%;
    }

    .box-img-form img {
        width: 100%;
    }

    .box-form {
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO DEPOIMENTOS ***********************************/
    .depoimentos {
        width: 100%;
        height: 1300px;

    }

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

    .box-comentarios {
        
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        height: 80%;
    }

    .box-titulo-depo {
        
        text-align: center;
        width: 100%;
        margin-bottom: 30px;
    }

    .card-depo {
        width:100%;
        height: 300px;
    }

    .card-depo .text-depo {padding: 0 10px;
        width: 100%;
    }

    .card-depo div {

        align-items: center;

    }

    /*********************************** CONFIGURAÇÃO RODAPE ***********************************/
    footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 1900px;
        padding: 15px;

    }

    .contatos {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .container-rodape {
        width: 100%;

    }

    .redes-sociais {
        height: 50%;
        width: 100%;
        justify-content: space-around;
        align-items: start;
    }

    .redes-sociais .figure-endereco {
        width: 300px;
    }

    .mapa-endereco {
        width: 100%;
        margin: 20px 0;
    }

    iframe {
        width: 350px !important;
        height: 400px !important;
    }

    .agredecimento {
        margin: 20px 0 0 0;
        width: 100%;
        gap: 8px;
        font-size: 10px;
    }
}

@media (min-width: 575px) and (max-width: 991.98px) {

    /*********************************** CONFIGURAÇÃO HEADER ***********************************/
    header {
        height: 1400px;
    }

    header .container-apresentacao,
    .box-txtprincipal,
    .text-header,
    .text-header div,
    .paragrafo-header,
    .btn-cotacao {
        width: 100% !important;
    }

    .container-apresentacao {
        flex-direction: column-reverse;
        height: 80%;
    }

    .box-txtprincipal,
    .box-img-header {
        height: 60%;
        width: 100%;
        padding: 0 20px;
    }

    .titulo {
        font-size: 4rem;
        margin-top: 0px;

    }

    .box-img-header img {

        margin: 0 auto;
        object-fit: contain;
        width: 800px;
        height: 800px;
        margin-left: -100px;

    }
    /*********************************** CONFIGURAÇÃO lista de produto ***********************************/
    .container-prudutos {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 0;
        margin: 0;
        padding: 100px 10px;
    }

    .container-alguns-produtos {

        margin: 10px 0;
        width: 100%;
    }

    .card-list {
        display: flex !important;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        padding: 0;
        margin: 0;

        width: 100%;
    }

    .card-list li {

        margin: 0;
        width: 300px;
        height: 400px;
    }


    .box-titulo-produto {
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO CARROSEL ***********************************/
    .carousel-item,
    .bg-primero,
    .bg-segundo,
    .bg-terceiro {
        display: flex;
        flex-direction: column;

    }

    .box-titulo-carrosel {
        padding: 0px 0;

    }


    .box-img-text-carrosel {
        flex-direction: column;
        justify-content: center;
    }

    .box-img-text-carrosel .descricao-carrosel {
        display: flex;
        justify-content: start;
        align-items: center;
        line-height: 20px;
        text-align: center;
        width: 95%;
        height: 100%;
    }

    .descricao-carrosel h4,
    .paragrafo-carrosel {
        width: 95%;
    }

    .box-img-text-carrosel .chicara-carrosel {
        width: 50%;
        height: 50%;
        object-fit: cover;
    }

    .box-img-text-carrosel .img-cartao-carrosel {
        width: 40%;
        height: 40%;

        object-fit: fill;

        margin-bottom: 200px;
    }

    .box-img-text-carrosel .img-pilha-carrosel {
        width: 30%;
        height: 30%;
        object-fit: fill;
        margin-bottom: 200px;
    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO PRODUTOS MAIS VENDIDOS  ***********************************/

    .prod-titulo {
        flex-direction: column;

        justify-content: center;
    }


    .produtos-mais-vendidos .box-titulo-vendidos {
        padding: 0;
        margin-bottom: 20px;
    }

    .list-produtos {
        flex-wrap: wrap;
    }

    .produtos-mais-vendidos ul li {
        width: 40%;
        height: 100%;

    }

    .produtos-mais-vendidos .box-titulo-vendidos {
        border-right: none;
    }

    /*********************************** CONFIGURAÇÃO PRODUTOS **********************************
    .catalogoProdutos {
        background-image: url('../image/bgprodutosphone.png');
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        width: 100%;
        height: 6100px;

    }

    .container-Produtos {
        width: 80%;
        margin: auto;
        display: flex;
        align-items: start;
        justify-content: start;
    }

    .titulo-Produtos {
        display: flex;
        align-items: center;
        justify-content: start;
        width: 100%;
        margin: 25px 0 0 0;
        font-size: 4rem;
        background: linear-gradient(94deg, #032030 -6.9%, #00A6CA 44.73%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .subtitulo-Produtos {
        font-size: 2rem;
        color: var(--background-two) !important;
        font-weight: 500;

    }*/

    /*********************************** CONFIGURAÇÃO CABEÇALHO SOBRE ***********************************/
    .sobrempresa {
        background-image: url("../image/sobreTablet.webp");
        background-size: cover;
        display: flex;
        justify-content: start !important;
        width: 100%;

        height: 1190px !important;
    }

    .container-sobre {
        flex-direction: column;
        padding: 0 20px;
        width: 60%;
        height: 100%;
        margin: 0;
    }

    .text-btn {
        justify-content: end;
        align-items: center;
        width: 100%;
        height: 50%;
        margin-top: 70px;
    }

    .text-btn .btn-cotacao {

        display: none;
    }

    .text-btn .text-left,
    .text-rigth {
        width: 100%;
        text-align: justify;
    }

    .box-rigth {
        flex-direction: column;
        justify-content: start;
        width: 100%;
        height: 40%;
        margin-top: -50px;
    }

    .box-rigth .btn-cotacao {
        display: flex;
        margin-top: 40px;
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO FORMULARIO ***********************************/

    .formulario {
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 1300px;
    }


    .container-formulario {
        flex-direction: column-reverse;
        margin: 0 auto;

    }

    .box-form {
        width: 100%;
        height: 70%;
    }

    /*********************************** CONFIGURAÇÃO DEPOIMENTOS ***********************************/
    .depoimentos {

        background-image: none !important;

    }
.box-comentarios{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 80%;
}
    .box-titulo-depo {
        
        text-align: center;
        width: 100%;
        margin-bottom: 30px;
    }

    .card-depo {     
            width:100%;
            height: 250px;
 
    }

    .card-depo .text-depo {
        width: 550px !important;
    }

    .card-depo div {

        align-items: center;

    }

    /*********************************** CONFIGURAÇÃO RODAPE ***********************************/
    footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 2000px !important;
        padding: 15px;
    }

    .contatos {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .redes-sociais {
        height: 50%;
        width: 100%;
        gap: 30px;
        justify-content: space-around;
        align-items: start;
    }

    .redes-sociais .figure-endereco {

        width: 100%;
        height: 100%;
    }

    .mapa-endereco {
        margin: 0px 0;
    }

    .mapa-endereco iframe {
        width: 650px !important;
        height: 500px !important;
    }

    .agredecimento {
        margin: 20px 0 0 0;
        width: 100%;
        gap: 8px;
        font-size: 13px !important;
    }
}


/*X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {



    header {

        background-image: url("../image/headerTablet.png");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        height: 1360px;

    }

    .container-header {
        justify-content: end;
        align-items: center;
        width: 100%;
        margin: auto;
    }

    .container-apresentacao {
        align-items: end;
        width: 100%;
        height: 80%;
    }

    .box-txtprincipal {
        width: 100%;
        height: 400px;

    }

    .text-header {
        align-items: center !important;
        gap: 30px;
        height: 80%;
    }

    .text-header p {
        text-align: justify;
    }

    .titulo {
        letter-spacing: 7px;
        margin: auto;
        width: 100%;
        font-size: 2.5rem;
    }

    .subtitulo {
        width: 100% !important;
    }

    .btn-cotacao {
        font-size: 1.5rem;
        padding: 10px 20px;


    }

    /*********************************** CONFIGURAÇÃO lista de produto ***********************************/
    .container-prudutos {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 0;
        margin: 0;

        padding: 100px 0;
    }

    .container-alguns-produtos {

        margin: 10px 0;
        width: 100%;
    }

    .card-list {
        display: flex !important;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        padding: 0;
        margin: 0;

        width: 100%;
    }

    .card-list li {

        margin: 0;
        width: 300px;
        height: 400px;
    }


    .box-titulo-produto {
        width: 100%;
    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO carrosel ***********************************/

    .carousel-item,
    .bg-primero,
    .bg-segundo,
    .bg-terceiro {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        height: 600px;
    }

    .box-titulo-carrosel {
        padding: 50px 0;

    }

    .carousel-item .bg-primero {
        background-image: url('../image/carrosel.webp');

    }

    .carousel-item .bg-segundo {
        background-image: url('../image/carrosel1.webp');

    }

    .carousel-item .bg-terceiro {
        background-image: url('../image/carrosel2.webp');

    }

    .box-img-text-carrosel {
        flex-direction: column-reverse;
    }

    .box-img-text-carrosel .descricao-carrosel {
        display: flex;
        justify-content: start;
        align-items: center;
        line-height: 20px;
        text-align: center;
        width: 95%;
        height: 100%;
    }


    .descricao-carrosel h4,
    .paragrafo-carrosel {
        width: 100%;
    }

    .box-img-text-carrosel .chicara-carrosel {
        width: 70%;
        height: 80%;
        object-fit: contain;
    }

    .box-img-text-carrosel .img-cartao-carrosel {
        width: 60%;
        height: 70%;
        object-fit: contain;
    }

    .box-img-text-carrosel .img-pilha-carrosel {
        width: 45%;
        height: 50%;
        object-fit: contain;
        margin-bottom: 0px;
    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO PRODUTOS ***********************************/
    .catalogoProdutos {
        background-image: url('../image/bgprodutosTablet.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        width: 100%;
        height: 7250px !important;
    }

    .container-Produtos {
        width: 80%;
        margin: auto;
        display: flex;
        align-items: start;
        justify-content: start;
    }

    .titulo-Produtos {
        display: flex;
        align-items: center;
        justify-content: start;
        width: 100%;
        margin: 25px 0 0 0;
        font-size: 4rem;
        background: linear-gradient(94deg, #032030 -6.9%, #00A6CA 44.73%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .subtitulo-Produtos {
        font-size: 2rem;
        color: var(--background-two) !important;
        font-weight: 500;

    }

    /*********************************** CONFIGURAÇÃO CABEÇALHO SOBRE ***********************************/
    .sobrempresa {
        background-image: url("../image/sobreTablet.webp");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        width: 100%;
        height: 2620px;
        display: flex;
        justify-content: end;
    }

    .container-sobre {
        flex-direction: column;
        height: 100%;
    }

    .text-btn {
        justify-content: end;
        align-items: center;
        width: 100%;
        height: 50%;
        margin-top: 70px;
    }

    .text-btn .btn-cotacao {

        display: none;
    }

    .text-btn .text-left,
    .text-rigth {
        width: 100%;
        text-align: justify;
    }

    .box-rigth {
        flex-direction: column;
        justify-content: start;
        width: 100%;
        height: 40%;
        margin-top: -50px;
    }

    .box-rigth .btn-cotacao {
        display: flex;
        margin-top: 40px;
        width: 100%;
    }


    /*********************************** CONFIGURAÇÃO FORMULARIO ***********************************/

    .formulario {
        background-image: url("../image/tabletFormulario.png");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        display: flex;
        justify-content: center;
        align-items: end;
        width: 100%;
        height: 1400px;
    }

    .box-form {
        width: 100%;
        height: 70%;
    }

    /*********************************** CONFIGURAÇÃO DEPOIMENTOS ***********************************/
    .depoimentos {

        background-image: url("../image/backgrounddepophone.png");
        background-size: cover;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 2200px;

    }

    .container-depoimentos {
        flex-direction: column;
        justify-content: end;
    }

    .box-comentarios {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        height: 80%;
    }

    .box-titulo-depo {
        text-align: center;
        width: 100%;
        margin-bottom: 30px;
    }

    .card-depo {
        width: 100%;
    }

    .card-depo .text-depo {
        width: 500px;
    }

    .card-depo div {

        align-items: center;

    }

    /*********************************** CONFIGURAÇÃO RODAPE ***********************************/
    footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 1500px;
        padding: 15px;
    }

    .contatos {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .redes-sociais {
        height: 50%;
        width: 100%;
        gap: 30px;
        justify-content: space-around;
        align-items: center;
    }

    .redes-sociais .figure-endereco {
        width: 500px;
    }

    .mapa-endereco {
        width: 100%;
        margin: 20px 0;
    }

    iframe {
        width: 100% !important;
        height: 500px !important;
    }

    .agredecimento {
        margin: 20px 0 0 0;
        width: 100%;
        gap: 8px;
        font-size: 7px;
    }
}


@media (min-width: 1281px) {
    header {}

    .container-alguns-produtos {
        border: .5px solid #161616;
        border-radius: 20px;
        box-shadow: 1px 5px 5px .15px black;
        padding: 1rem;
    }

    .box-titulo-produto {
        color: var(--background-two) !important;
        width: 80%;
        text-align: center;
        margin: 0 auto;

    }

    .container-prudutos li {
       
        width: 300px;
        height: 450px;

    }

    .card-depo {
        width: 350px;
        height: 320px;
    }

    .card-depo .text-depo {
        padding: 0 15px;
        width: 350px;
    }

    .sobrempresa {
        height: 1000px;
    }

    .box-rigth {
        display: flex;
        flex-direction: column;
        align-items: end;
        margin: 0;
        width: 40%;
        height: 80%;
    }

    .box-rigth .btn-cotacao {
        margin: 0;
    }

    .text-btn .btn-cotacao {
        display: none !important;
    }

    .text-rigth {
        margin-top: 500px;
        width: 90%;
        line-height: 20px;
        text-align: right;
    }

    /*
    .catalogoProdutos {
        background-image: url('../image/backgroundProdutos.png');
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        width: 100%;
        height: 3250px !important;

    }

    .container-Produtos {
        width: 54%;
    }





    .card-depo {
        width: 100%;
        height: 300px;
    }

    .card-depo .text-depo {
        width: 500px;

    }

    .card-depo .header-box-depo,
    .descricao-header-depo,
    span {
        width: 100% !important;
    }

    .contatos {
        width: 100%;
        justify-content: space-between;
    }

    .figure-endereco {
        width: 100%;
    }
}*/
    iframe {
        width: 100% !important;
        height: 100% !important;

    }
}

@media (min-width: 2560px) {
    header {
        background-image: url("../image/HeaderPerfect.webp");
        width: 100%;
        height: 800px;
        display: flex;
        justify-content: center;
    }

    .container-header {
        width: 80%;
        margin: 0 auto;
    }

    
.container-prudutos li {
    width: 550px !important;
    height: 500px;
}

.container-prudutos img {
    object-fit: contain;
}


.cont
    .container-apresentacao {
        height: 800px;

    }

    .sobrempresa {
        width: 100%;
        height: 2200px !important;
    }
    .redes-sociais{
        width: 30%;
    }

    .img-rodape-p10 {
        margin: 0 auto;
        display: block;
        width: 25%;
    }
    .img-rodape-p10 img {
        width: 100%;
        height:100%;} 
}