*{
  box-sizing: border-box;
}
.flex-container{
  display: flex;
  width: 100%;
  box-sizing: border-box;
}
li{
  display: inline-block;
}
.heading{
  width: 33%;
  background-color: aqua;
  border: 1px solid black;
}
.textarea {
  width: 33%;
}
textarea {
  width: 100%;
  border: 1px solid rgb(147, 250, 182); 
  resize: none;
  height: 50vh;
}
.btn {
  padding: 10px;
}

iframe{
  width: 100%;
  height: 70vh;
}

textarea.input {
  resize: vertical;
}
.input:focus {
  border-color: hsl(var(--input-focus-h), var(--input-focus-s), var(--input-focus-l));
}
.input:focus {
  /* ...existing styles */
  box-shadow: 0 0 0 3px hsla(var(--input-focus-h), var(--input-focus-s), calc(var(--input-focus-l) +
          40%), 0.8);
}
.input {
  /* ...existing styles */
  transition: 180ms box-shadow ease-in-out;
}
.input:focus {
  outline: 3px solid transparent;
}