@import url('https://fonts.googleapis.com/css2?family=Protest+Guerrilla&display=swap');
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    /* font-family: ; */
  
}
body{
    width:100%;
    height:100%;
    background-color:#121a20;
    display:flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex-direction:column;
    /* color: aliceblue; */
}
#logo{
    width: 30vw;
    height: 30vw;
}
h3{
    color:#ebf7fa;
    font-size: 2em;
    font-family: "Protest Guerrilla", sans-serif;
  /* font-weight: 400;
  font-style: normal; */

}
#va{
    color :#eda302;
}
#name{
    color: #52abcf;
    font-size: 1.5em;
}
#listening{
height: 150px;
width:150px;
display:none;
border-radius: 60%;
}
#mic{
height: 2em;
width: 2em;
}
#btn{
    width:30%;
    background-color:#23484f ;
    padding:5px;
    /* background: linear-gradient(to right,#c6e6e9,#304648); */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    font-size: 20px;
    border-radius:20px;
    box-shadow:2px 2px 10px #c6e6e9,2px 2px 10px #304648 ;
    color: #61b6d7;
    transition:all 0.5s;
    cursor: pointer;
}
#btn:hover{
    /* background-color:#52abcf;
    color: white; */
    box-shadow:5px 2px 20px #c6e6e9,5px 2px 20px #304648 ;
    letter-spacing:1px;
}