@media (max-width: 1181px){
    .info-mobile button {
        width: 200px;
    }
    .img-mobile{
        width: max-content;
        height: 450px;
        top: 100px;
        left: -90px;
    }
    .info-mobile{
        width: calc(90% - 600px) !important;
    }
    .container-desafio{
        justify-content: center !important;
        gap: 10px;
    }
    .container-desafio .card{
        width: 200px;
    }
    .info-desktop{
        /*background-color: transparent;*/
        max-width: 100% !important;
        margin-bottom: 20px;
    }
    .info-desktop .btn{
        font-size: 12px ;
        padding: 5px 0 5px 10px ;
        width: 180px;
    }
    .info-desktop .btn img{
        rotate: 0deg ;
    }
    .desktop-video{
        width: 100%;
    }
    .container-img-soluction{
        margin-top: 0;
        margin: 0 auto;
    }
    .container-soluction-info{
        padding: 0 !important;
        width: 600px;
        margin: 50px auto 0 auto;
        
    }
    .mt-solucition{
        margin-top: 0 !important;
    }
}
@media (max-width: 1180px){
    .img-mobile{
        width: max-content;
        height: 470px;
        top: 100px;
        left: -70px;
    }
    .info-mobile{
        width: calc(90% - 700px) !important;
    }
    h2{
        font-size: 24px !important;
    }
    .info-mobile h2{
        font-size: 24px !important;
    }
    .info-mobile p{
        font-size: 12px ;
    }
}
@media (max-width: 1000px){
    /*moblie*/
    .bg-rainbow {
        height: 225px ;
        overflow:  visible ;
        width: 100% !important;
        margin: 0 !important;
        margin-top: 30px !important;
    }
    .img-mobile{
        top: 25px;
        left: 0;
        height: 200px;
        width: max-content;
    }
    .info-mobile{
        width: calc(100% - 400px) !important;
        justify-content: start !important;
    }
    .info-mobile h2{
        margin-top: 30px;
        font-size: 14px !important;
    }
    .info-mobile p{
        font-size: 12px ;
    }
    .info-mobile .btn{
        width: 150px;
        font-size: 12px ;
        padding: 5px 0 5px 10px ;
    }
    .info-mobile .btn img{
        width: 12px ;
    }
    .info-mobile-img{
        top: -50px ;
        height: 300px;
        margin-right: 25px;
        width: 120px ;
        position:  relative;
    }
    .info-mobile-img video{
        height: calc(100% - 5px);
        width: 111px;
        left: 5px;
        border-radius: 20px;
    }

}
@media (max-width: 768px) {
    main { max-height: 640px;  }
    h5{
        text-align: center ;
        width: 100% ;
    }
    .border-gradient{
        width: 120px;
        padding: 10px 15px;
    }
    .border-gradient span{
        font-size: 16px !important;
    }
    .swiper-logo{
        margin-top: 30px;
    }
    .mgn-ngt{
        margin-top: 0;
    }
    /*main*/
    .circle-main{
        top: -70%;
        left: -50%;
        width: 200% !important;
    }
    main .main-info h1{
        margin-top: -20px !important;
        font-size: 32px !important;
        padding-right: 50px;
    }
    main{
        width: 100% !important;
        background-size: cover;
        background-position: 28%;
    }
    .main-containter-info{
        padding: 0 !important;
        margin: 0 auto;
        width: 100% !important;
    }
    .main-info{
        width: 70%;
        margin: 0 auto;
        display: block;
    }
    .main-info div{
        margin-top: 5vh;
        justify-content: start;
    }
    .main-info p{
         padding-right: 50px;
    }

    /*ContainerDesafio*/
    .container-desafio{
        justify-content: center !important;
    }

    /*solucion*/
    .container-img-soluction{
        width: 280px;
        height: 280px;
        margin: 20px auto;
    }
    .container-img-soluction .search-bar{
        width: 250px !important;
        height: 30px;
        padding: 20px 5px !important;
        right: -30px !important;
    }
    .container-img-soluction .search-bar h3{
        font-size: 10px !important;
    }
    .container-img-soluction .search-bar .circle{
        width: 30px !important;
        height: 30px !important;
    }
    h2{
        font-size: 24px !important;
    }
    .container-img-soluction .search-bar .circle img{
        width: 15px !important;
        height: 15px !important;
    }
    .glass-container {
        width: 100px !important;
        height: 100px !important;
        right: -40px !important;
        top: 65px !important;
        justify-content: center ;
        gap: 5px !important;
        padding: 10px 20px ;
    }
    .glass-container h3{
        font-size: 10px;
        width: 100%;
        margin: 0 ;
        font-family: 'Gilroy-Light', sans-serif;
    }
    .glass-container img{
        width: 24px !important;
        margin: 0 !important;
    }
    .container-img-soluction .circle{
        width: 50px !important;
        height: 50px;
        top: -20px !important;
    }
    .container-img-soluction .circle img{
        width: 18px !important;
    }
    .container-soluction-info {
        padding: 0 !important;
        margin-top: 0 !important;
    }
    .container-soluction-info.p-5 {
        padding: 0 !important;
        margin: 0 auto !important;
    }
    .mt-solucition{
        margin: 0 auto;
    }
    .container-soluction-info .info-card-img{
        width: 55px !important;
    }
    .container-soluction-info .info-card .info-card-text{
        max-width: 260px;
    }
    .container-soluction-info .info-card h3{
        font-size: 16px !important;
    }
    .container-soluction-info .info-card p{
        font-size: 14px !important;
    }

    /*dispositivos*/
    /*desktop*/

    .info-desktop h2{
        font-size: 20px ;
    }
    .info-desktop p{
        font-size: 14px ;
    }
    .desktop-video{
        height: 250px ;
    }
    /*Avaliation*/
    .card-avaliation{
        width: 350px !important;
        padding: 10px 10px;
        box-sizing: border-box;
        margin: 0 ;
    }
    .p-5{
        padding: 1em !important;
    }
    /*footer*/
    .bg-rainbow-dark {
        padding: 3em 0 ;
        margin: 0 ;
        background-position: 82% ;
    }
    .bg-rainbow-dark h2, .bg-rainbow-dark p{
        max-width: 300px ;
    }
    .footer{
        background-position: 76%;
        margin-top: -10px ;
    }
} 
@media (max-width: 576px) {
        .img-mobile{
            display: none;
        }
        .info-mobile{
            width: calc(100% - 160px) !important;
        }
        .info-mobile-img{
            margin-right: 0 !important;
        } 
        .glass-container {
            right: -25px !important;
        }
        .container-desafio .card{
            min-width: 330px;
        }
}