body{
 background: linear-gradient(74deg,  #f0eeee, #030303, #221818 );
  background-size: 150% 300%;
  animation: colors 20s ease infinite;

}

@keyframes colors {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@media screen and (max-width: 1000px) {
  #nav{
  border:groove;
  background-color: #81787b85;
}

#som {
  width: 140px;
}
}
#conta{
  margin: 10px 10px 0 auto;

}

#itens *{
   background-color: rgba(0, 0, 0, 0.479);
   text-decoration: none;
   color: rgb(245, 237, 237);
   text-align: center;
   box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);
   border-radius: 25px ;
   text-shadow:20px 10px 10px rgba(226, 221, 219, 0.808) ;
  }

#nav {
    position:fixed;

} 

#perfil{
    border-radius: 110px;
    width: 220px;
    margin-top:70px;
    border: groove black;
}

#perfil-title{
  
  color: rgb(251, 254, 255);
}

#sobre{
    background : rgba(14, 13, 13, 0.486);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    padding-top: 20px;
    padding-bottom: 10px;
    color: rgb(245, 237, 237);
    text-align:center;
    border: groove;
    padding: auto;
    box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);

}

#cursos {
   font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
   color: rgb(245, 237, 237);
   border: groove;
   font-size: 20px;
   padding-top: 80px; 
   padding-bottom: 40px;
   box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);
   text-shadow:20px 10px 10px rgba(226, 221, 219, 0.363) ;

  }

.link {
   text-decoration: none;
   color: white;
}

#experiencia{
   font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
   border: groove;
   color: rgb(245, 237, 237);
   box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);
   text-shadow:20px 10px 10px rgba(226, 221, 219, 0.363) ;
   font-size: 20px;
   text-align: center;
   padding-bottom: 80px;
   padding-top: 90px;

}
#projeto {
  
  overflow-y: scroll;
   height: 750px;
   padding-top: 50px;
   text-align: center;
   border: groove;
   color: rgb(240, 243, 243);
   box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);
} 

.card{
  padding-left: 25px;
}

#social{   
  
    font-size: 60px;
    cursor: pointer;
    text-align: center; 
    background : rgba(22, 19, 19, 0.486);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

 }
  
  #text-contact{
    border: groove;
    color: rgb(251, 254, 255);
    box-shadow: 2px 2px 9px 7px rgba(245, 244, 244, 0.171);
    text-shadow:20px 10px 10px rgba(226, 221, 219, 0.363) ;
    background : rgba(22, 19, 19, 0.486);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    font-size: 30px;
    text-align:center;
    padding: 10px 0 10px 10px;
    margin-bottom: 300px;
}
  
   #blank{
height: 40vh;    
}