:root{
  --primary:#5B21B6;
  --secondary:#C4B5FD
}

body{
  margin:auto;
  text-align: center;
}

.output{
  border: solid black 2px;
  width: 90%;
  height: 15vh;
  font-size: 2rem;
  text-align: center;
  margin-left: 5rem;
  display: block;
  background-color: var(--secondary)
}
.title{
    width:98% ;
    padding:0.5rem ;
    padding-bottom: 0.5rem;
    height: 100%;
    max-height: 9vh;
    display:block;
    color:white;
    background-color: var(--primary);
    font-size: 2rem;
    font-weight: bolder;
}

#txt-input{
  font-size: 2rem;
  text-align: center;
  width: 90%;
  height: 15vh;
  background-color: var(--secondary);
  margin:1rem;
}

.heading{
  font-size: 2rem;
  font-weight: 700;
  padding: 0.5rem;
  margin: 0.5rem;
}

#btn-translate {
    padding: 1rem;
    margin:1rem;
    margin-top:2rem;
    background-color: var(--primary);
    width: 15%;
    color: white;
    border: white;
    font-size:large;
    font-weight:bold;
    border-radius: 25px;
}

#error{
  display:none;
  font-size: 2rem;
  font-weight: 500;
  color: black;
  text-align: center;

}