
.mob {
    display: none;
}

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

    #itemPrinc {
        padding-right: var(--espaco-3);
        padding-left: var(--espaco-3);
    }

}

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

    .menor-mob {
        width: 90vw;
    }


    nav {
        padding-top: var(--espaco-1);
        padding-bottom: var(--espaco-1); 
    }

    nav #logo {
        max-width: 120px;    
        height: auto;
        padding-left: 0;
        margin-right: var(--espaco-2);
    }

    #itemPrinc p {
        font-size: var(--fonte-2);
    }

}

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

    .mob {
        display: block;
    }
  
    .desk {
        display: none;
    }

    #msg {
        min-width: 150px;
    }

    #formLogin, #formUser {
        margin-top: 0;
    }

    #navPrinc {
        padding-right: var(--espaco-2);
    }

    .cards {        
        grid-template-columns: repeat(3, 30%); 
        gap: 3%;      
     
        i{
           font-size: var(--fonte-3);
        }   
        .cardInt{
            margin-left: var(--espaco-1);
        } 
    }

    #barraSub div:not(#logo){
        padding-left: var(--espaco-3);
    }
}

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

    :root {
   
    --fonte-0: 0.5em;
    --fonte-1: 0.75em;
    --fonte-2: 1em;
    --fonte-3: 1.2em;
    --fonte-4: 1.4em;
    --fonte-5: 2em;
}
    
    .cards {        
        grid-template-columns: repeat(2, 45%); 
        gap: 5%;  
                           
        > div:nth-child(3) {
            display:none;
        }
    }

    .cardInt {
        font-size: var(--fonte-1);
    }

    .cards .sombra {
        padding: var(--espaco-2);
    }

    .menor-mob {
        width: 90vw;
    }

    #barraSub {
        align-content: start;
    }

    nav #logo {
        max-width: 120px;    
        height: auto;
        padding-left: 0;
        margin-right: var(--espaco-2);
    }


    #formImg {
        max-width: 150px;
    }

    #ajusteNav {
        width:10px;
        height: 10px;
    }    

}
