@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Roboto+Mono:wght@100&display=swap');
body{
    font-family: poppins;
    width: 100%;
    height: 100%;
}
.top{
    
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: 0;
    display: inline;
    /* flex-direction: column; */

}

.top h2{

    top: 1%;

}

.message-class{
    position: absolute;
    bottom: 2%;
    width: 25%;
    left: 50%;
    transform: translate(-50%,0);
}
.text-input{
    height: 50px;
    width: 280px;
   border-radius: 15px;  
   
}

.btn-class button{
    height: 50px;
    width: 280px;   
   border-radius: 15px;
}

.msg-icon{
    width: 15px;
    height: 15px;

}

#message_area{
 width: 50%;
    height: auto;
  display: none;
  flex-direction: column;
  
  margin-top: 5px;

/* background: #000; */
  /* text-align: left; */

  /* position: relative ; */
 left: 50%;
    transform: translate(50%,0);
  line-height: 6px;
}

@media screen and (max-width:768px) {
 *{
    font-size: 16px;
 }
 .message-class{
    position: absolute;
    bottom: 2%;
    width: 100%;
    
}
}