body {
  margin: 0px;
  font-family: system-ui;
  padding-bottom: 50px;
}

.inline-block {
  display: inline-block;
}

.container {

  .btn-start {
    color: var(--white);
    font-size: 1.2em;
    font-weight: 700;
    background: var(--magenta);
  }

  .btn-start:hover {
    border: 1px solid var(--magenta);
    color: var(--magenta);
  }

  .btn-stop {
    color: var(--white);
    font-size: 1.2em;
    font-weight: 700;
    background: var(--red);
  }

  .btn-stop:hover {
    border: 1px solid var(--magenta);
    color: var(--red);
  }

  .answer-btn {
    margin: 20px 0;
    text-decoration: none;
    font-size: 1.1em;
    padding: 30px;
    border: 1px solid var(--light-gray);
    border-radius: 4px;
    display: block;
    color: var(--dark-gray);
    font-weight: 700;
    text-wrap: auto;
  }

  .answer-btn:hover {
    background: var(--magenta);
    color: var(--white);
  }

  .expand {
    width: 100%;
  }

  label {
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 10px;
  }

  .alerts {
    display: flex;
    justify-content: center;
  }

  .notice, .warning {
    display: flex;
    justify-content: center;
    color: white;
    padding: 20px 0;
    width: 100%;
    font-size: 1.2em;
    font-weight: 700;
  }

  .notice {
    background: green;
  }

  .warning {
    background: red;
  }

}