* {
    font-family: 'Roboto', sans-serif;
}

body {
    background-color: lightgray;
    padding-top: 60px;
}

.tecnologias {
    justify-content: center;  
}

@media (min-width: 576px) {
    /* Aplique a margem apenas em telas maiores que 576 pixels de largura (como tablets e desktops) */
    .tecnologias {
        margin-left: 20%;
    }
}

footer {
    background-color: #cccccc;
    padding: 20px;
    text-align: center;
    position: flex;
    bottom: 0;
    width: 100%;
}

.custom-hr {
    border-top: 2px solid #007bff;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* Adicione esta regra CSS para cada seção que será alvo da navegação */
h2::before {
    content: '';
    display: block;
    height: 55px; /* Altura da sua navbar */
    margin-top: -55px; /* Negativo da altura da sua navbar */
    visibility: hidden;
  }

#home::before {
    content: '';
    display: block;
    height: 80px; /* Altura da sua navbar */
    margin-top: -80px; /* Negativo da altura da sua navbar */
    visibility: hidden;
  }
  
  /* Ajuste o seletor para os IDs das suas seções */
  #home::before,
  #tecnologias::before,
  #projetos::before,
  #contato::before
  #horrorcraft::before,
  #password-generatir::before
  {
    /* As regras acima serão aplicadas aqui */
  }