@media only screen and (min-width:617px) and (max-width:1170px) {
    .menu {
        display: inline-flex;
        font-size: 20px;
        padding-left: 2rem;
        margin-left: 120px;

    }

    .menu:hover {
        color: #3a33fb;
        display: inline-flex;
        text-decoration: none;
        font-size: 20px;
        padding-left: 2rem;
        margin-left: 120px;
        margin-top: 50px;
        font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
        font-weight: bold;
    }

    .carrosel {
        width: 660px;
        height: 403px;
        margin: 50px 28px;
        box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.2);
        overflow: hidden;
    }

    .carrosel ul {
        display: flex;
        list-style: none;
        width: 1200px;
        height: 250px;

    }

    .carrosel li {
        position: relative;
        animation: slide 30s infinite ease-out;
    }

    img {
        width: 688px;
        height: 423px;
        border-radius: 2px;
    }

    @keyframes slide {
        0% {
            left: 0px;
        }

        20% {
            left: 0px;
        }

        30% {
            left: -688px;
        }

        50% {
            left: -688px;
        }

        100% {
            left: 0px;
        }
    }

    img.icone {
        width: 10rem;
        height: 10rem;
        position: absolute;
        margin: 50px 52.5rem;
        align-items: center;
        margin-top: 2rem;
    }

    #compl-text {
        margin-left: 49rem;
        margin-top: -15rem;
    }

    #div-nav {
        position: absolute;
        width: 15rem;
        margin-left: 49rem;
        margin-top: -2rem;
    }

    .main-white {
        margin-left: 5rem;
    }

    .text-basic1 {
        width: 500px;
        margin-left: 20rem;
    }

    .cards {
        margin-left: 5rem;
        width: 250px;
        height: 300;
    }

    .form-box {
        margin-left: 19rem;
    }

    .bloco {
        margin-left: 37rem;
    }
}

 @media only screen and (max-width:880px) and (min-width:645px) {
    .menu {
        display: inline-flex;
        font-size: 22.9px;
        padding-left: 0rem;
        margin-left: 220px;
        margin-top: 2rem;
        font-weight: 500;
    }

    .menu:hover {
        padding-left: 0rem;
        font-size: 22.9px;
        margin-top: 2rem;
        margin-left: 220px;
        font-weight: 500;
    }

    .carrosel {
        width: 500px;
        height: 403px;
        margin: 50px 28px;
        overflow: hidden;
        box-shadow: 0px 0px 0px;
    }

    #he, ul, li {
        display: none;
        box-shadow: none;
    }

    #ha {
        margin-left: -32rem;
        margin-top: 14rem;
    }

    .main-white {
        margin-left: 4rem;
        width: 45rem;
        margin-top: -4rem;
    }

    .text-basic1 {
        margin-left: 9.9rem;
    }

    .cards {
        margin-left: 2.3rem;
        width: 210px;
        height: 400px;
    }

    .bottom-textcard {
        font-size: 11px;
        font-weight:500;
    }

    .form-box {
        margin-left: 9rem;
    }
    
    .textfooter {  
        font-size: 13px;
        width: 200px;
    }

    .bloco {
        margin-left: 28rem
    }
 }

 @media only screen and (max-width:650px) and (min-width: 130px){
    .menu {
        display: inline-flex;
        font-size: 21px;
        margin-left: 143px;
        margin-top: 2rem;
        font-weight: 500;
        float: left;
    }

    .menu:hover {
        display: inline-flex;
        font-size: 21px;
        margin-left: 143px;
        margin-top: 2rem;
        font-weight: 500;
        float: left;
    }

    #he, ul, li {
        display: none;
        box-shadow: none;
    }

    .carrosel {
        box-shadow: 0px 0px 0px;
        width: 10px;

    }

    #ha {
        margin-left: -62rem;
        margin-top: 14rem;
    }

    img.icone {
        margin-top: 2rem;
        width: 120px;
        height: 120px;
    }

    .main-white {
        margin-left: 4rem;
        width: 25rem;
        margin-top: -10rem;
    }

    #compl-text3 {
        width: 20rem;
    }

    #complementary {
        width: 20rem;
        font-size: 20px;
    }

    .cards {
        margin-left: 1.8rem;
        width: 130px;
        height: 250px;
        margin-top: -15rem;
    }

    #ana {
        width: 130px;
        height: 210px;
        margin-top: -2.5rem;
    }

    #ihorran {
        width: 150px;
        height: 150px;
        margin-top: -0.5rem;
    }
    
    #vini {
        width: 154px;
        height: 156px;
        margin-top: -0.9rem
    }
    
    #section-active{
        margin-top: -15rem;
    }
    
    #Ray {
        width: 180px;
        height: 180px;
        margin-top: -1.2rem
    }
    
    #gabriel{
        width: 140px;
        height: 140px;
        margin-top: -0rem
    }
    
    #matheus {
        width: 145px;
        height: 145px;
        margin-top: -0.5rem
    }
    
    #Anna {
        width: 170px;
        height: 170px;
        margin-top: 0.2rem
    }
    
    #Juan {
        width: 160px;
        height: 160px;
        margin-top: -1.4rem
    }
    
    #raip {
        width: 150px;
        height: 150px;
        margin-top: 0rem
    }
    
    #rob {
        width: 180px;
        height: 180px;
        margin-top: -0.5rem
    }
    
    #cris {
        width: 210px;
        height: 210px;
        margin-top: -1.5rem
    }
    
    #mai {
        width: 150px;
        height: 150px;
        margin-top: 0rem;
        margin-left: -0.5rem;
    }

    .text-basecard {
        width: 10px;
        font-size: 15px;
        position: absolute;
        margin-top: 9rem;
        color: #0c013c;
        margin-left: -5rem;
    }

    .bottom-textcard {
        display: none;
    }

    .socialMidia-equipe {
        position: absolute;
        margin-top: 13rem;
        width:100px;
        background-color: #d8dde0;
        border-radius: 8px;
        font-size: 9px;
        font-weight: bold;
        text-decoration: none;
        color: black;
        padding: 7px;
        text-align: center;
    }
    
    .socialMidia-equipe:hover {
        position: absolute;
        width:100px;
        margin-top: 13rem;
        background: linear-gradient(45deg,#f27d00,#ffc303);
        border-radius: 8px;
        font-size: 9px;
        text-decoration: none;
        color: black;
    }

    .form-box {
        margin-top: -18rem;
        margin-left: 4rem;
        width: 400px;
    }

    #tittle2{
        color: #3a33fb;
        font-size: 30px;
        text-shadow: 1px 1px 1px 1px rgba(0, 0, 0,1);
        margin-top: 2rem;
        margin-left: -1.5rem;
    
    }

    .inputBox{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: -2rem;
    }

    #textarea{
        width: 400px;
        margin-left: -1.5rem;
    }

    .submitbutton {
        margin-left: 1rem;

    }
    
    .submitbutton:hover{
        margin-left: 1rem;
    }

    #bottomsite {
    margin-top: 15rem;
    }

    .img {
        display: none;
    }

    .textfooter{
        text-align: left;
        font-weight:;
        width: 300px;
        margin-left: 1rem;
        letter-spacing: 2px;
    }

    .bloco {
        margin-left: 17.5rem;
        margin-top: 5rem;
        width: 25rem;
    }

    .text-basic1 {
        display: none;
    }
 } 
 @media only screen and (max-width:450px) and (min-width: 130px){

    #img_header {
        width: 110px;
        height: 110px;
        margin-top: 0.5rem;
        margin-left: -0.5rem;
    }

    .menu {
        margin-left: 90px;
        font-size: 19px;
    }

    .menu:hover {
        margin-left: 90px;
        font-size: 19px;
    }

    #ha {
        margin-left: -66rem;
        margin-top: 14rem;
    }

    .main-white {
        margin-left: 1.5rem;
        width: 20rem;
        margin-top: -10rem;
        padding: 15px;
    }

    #complementary {
        width: 20rem;
        font-size: 18px;
        margin-left: 2.5rem;
    }

    #compl-text3 {
        width: 20rem;
        font-size: 14px;
    }

    .cards {
        margin-left: 1rem;
        width: 110px;
        height: 230px;
        margin-top: -20rem;
    }

    #ana {
        width: 100px;
        height: 180px;
        margin-top: -2.5rem;
    }

    #ihorran {
        width: 120px;
        height: 120px;
        margin-top: -0.2rem;
    }
    
    #vini {
        width: 134px;
        height: 136px;
        margin-top: -0.9rem
    }
    
    #section-active{
        margin-top: -15rem;
    }
    
    #Ray {
        width: 140px;
        height: 140px;
        margin-top: -1.2rem
    }
    
    #gabriel{
        width: 110px;
        height: 110px;
        margin-top: -0rem
    }
    
    #matheus {
        width: 110px;
        height: 120px;
        margin-top: -0.5rem
    }
    
    #Anna {
        width: 140px;
        height: 140px;
        margin-top: 0.2rem
    }
    
    #Juan {
        width: 130px;
        height: 130px;
        margin-top: -1.2rem
    }
    
    #raip {
        width: 130px;
        height: 130px;
        margin-top: 0rem
    }
    
    #rob {
        width: 140px;
        height: 140px;
        margin-top: -0.5rem
    }
    
    #cris {
        width: 170px;
        height: 170px;
        margin-top: -1.5rem
    }
    
    #mai {
        width: 120px;
        height: 120px;
        margin-top: 0rem;
        margin-left: -0.5rem;
    }

    .text-basecard {
        width: 10px;
        font-size: 15px;
        position: absolute;
        margin-top: 105px;
        color: #0c013c;
        margin-left: -80.5px;
    }

    .bottom-textcard {
        display: none;
    }

    .socialMidia-equipe {
        position: absolute;
        margin-top: 12rem;
        width:90px;
        background-color: #d8dde0;
        border-radius: 8px;
        font-size: 8px;
        font-weight: bold;
        text-decoration: none;
        color: black;
        padding: 7px;
        text-align: center;
    }
    
    .socialMidia-equipe:hover {
        position: absolute;
        width:90px;
        margin-top: 12rem;
        background: linear-gradient(45deg,#f27d00,#ffc303);
        border-radius: 8px;
        font-size: 8px;
        text-decoration: none;
        color: black;
    }

    .form-box {
        margin-top: -20rem;
        margin-left: 1rem;
        width: 350px;
    }

    #tittle2{
        color: #3a33fb;
        font-size: 30px;
        text-shadow: 1px 1px 1px 1px rgba(0, 0, 0,1);
        margin-top: 2rem;
        margin-left: 1rem;
    
    }

    .inputBox{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-left: 15px;
    }

    #textarea{
        width: 400px;
        margin-left: -1.5rem;
    }

    .submitbutton {
        margin-left: 1rem;
    }

    .submitbutton:hover{
        margin-left: 1rem;

    }

    #email {
        width: 330px;
    }

    #nome {
        width: 330px;
    }

    #textarea {
        width: 330px;
        margin-left: 1rem;
    }

    .submitbutton {
        margin-left: 1.5rem;

    }
    
    .submitbutton:hover{
        margin-left: 1.5rem;
    }

    .bloco {
        margin-left: 13rem;
        margin-top: 5rem;
        width: 15rem;
    }

    .titulo-comite {
        font-size: 30px;
    }

    .texto {
        font-size: 13px;
    }
 }