@media screen and (orientation: portrait) {
  .container {
    width: 90%;
  }
}

@media screen and (orientation: landscape) {
  .container {
    width: auto;
  }
}

.container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 48
}

.half-div {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.full-button {
  width: 100%;
}

md-filled-button,
md-outlined-button {
  width: 50%; 
}

md-filled-button {
  margin-right: 16px; 
}

font {
  font-size: large;
}

.container > div {
  display: flex;
  align-items: center;
  width: 100%;
}

label {
  width: 20%;
}

md-outlined-text-field {
  width: 80%;
}