@media(max-width:425px){
    #infos{
        margin: 0px;
        margin-bottom: 1rem;
    }

    /*======== Descrição =======*/

    #description{
        width: 26rem;
    }
    
    #description p{
        font-size: 1rem;
    }

    #layout{
        margin: 0px;
    }

    #settings, #settings select{
        font-size: 1rem;
    }

    /*====== LAYOUT DO TABULEIRO =========*/  
    #layoutTabuleiro{
        height: fit-content;
        width: fit-content;
    }
    
    #colunas{
        height: 2.5rem;
        font-size: 1rem;
    }
    
    .coluna{
        width: 2.5rem;
    }
    
    #linhas{
        margin-top: 16px;
        width: fit-content;
        height: fit-content;
        font-size: 1rem;
    }

    p.linha{
        height: 2.5rem;
        margin: 0px;
    }
    
    /*=== TABULEIRO ===*/
    .casa{
        height: 2.5rem;
        width: 2.5rem;
        border: 1px solid black;
    }

    /*=== TABELA ALGORITMO ===*/
    #tabela{
        width: fit-content;
        height: fit-content;
    }

    #logo_algoritmo{
        width: 100%;
        height: 100%;
    }
    
    #algoritmo .comando{
        display: flex;
        height: 1.2rem;
        width: 10rem;
        border: 1px solid black;
        align-items: center;
    }
    
    /*====== TABELA DE ALGORITMO COMPILADA ==========*/
    .instrucao{
        font-size: 1rem;
        border-radius: 0px;
    }
    
    .instrucao select{
        border-radius: 0;
    }
    
    /*===== Funções =======*/
    #algoritmo .funcao{
        font-size: 1rem;
    }

    /*=== Comandos ===*/
    #controles{
        grid-area: comandos; 
        display: flex;
        gap: 1rem;
    }
    
    .botao{
        width: 4rem;
        padding: 0.5rem;

        font-weight: bold;
        font-size: 1rem;
    }
    
    #compilar{
        width: fit-content;
    }
    
    .botao:hover{
        background-color: blue;
        cursor: pointer;
    }
    
    /*====== POP UP ======*/
    
    #noClick{
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 199;
    }
    
    
    #escolhas{
        display: grid;
        grid-template-columns: repeat(5,1fr);
        
        margin: 0.5rem;
        gap: 0.5rem;
    }
    
    .opcao{
        width: 3rem;
        height: 3rem;
        border: 2px solid darkblue;
        cursor: pointer;
        font-size: 0.8rem;
    }
        
}