I want the menu on the left to grow according to the content in the right, instead of setting the height of all the sections available.

In this case I would want the menu on the left to finish below the Choice 10 of the content in the right and then the menu would have a scroll (which I have already added in CSS).

Thanks in advance ! :)

```css
@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i');
* {
  font-family: Roboto, sans-serif !important;
}

@media screen and (max-width: 1300px) {
  .wrapper,
  .disclaimer {
    width: 90vw !important;
  }
}

ol {
  text-align: left;
}

.answered {
  font-weight: 900;
}

.answered::after {
  content: '•';
  color: black;
  margin-left: 10px;
  font-size: 15px;
}

.sections-choices {
  display: flex;
  align-items: flex-start;
  border: 1px solid #ddeafa;
  margin: 0 25px 15px 25px;
  width: 95%;
  margin-bottom: 15px;
  background-color: white;
  /* height: 300px;
                min-height: 300px;
                max-height: 350px; */
}

.sections {
  color: gainsboro;
  text-align: left;
  font-size: 13px;
  background-color: white;
  text-decoration: none;
  width: 20%;
  height: inherit;
  overflow-y: scroll;
}

.sections .question-select {
  margin-left: 10px;
}

.sections h4 {
  padding: 5px 0 5px 15px;
  background-color: #3a3838;
  color: white;
  margin-top: 0;
}

.sections .intro-text {
  padding-top: 2.5px;
  padding-bottom: 2.5px;
}

.sections a {
  text-decoration: none;
  color: black;
  padding-left: 15px;
}

.choices {
  color: black;
  font-size: 14px;
  text-align: left;
  width: 80%;
  padding-bottom: 15px;
  height: inherit;
}

.choices-section-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: auto;
  background-color: #3a3838;
}

.choices-section-title h4 {
  margin: 0;
  padding: 15px 15px;
  color: white;
}

.choices-title {
  padding: 10px 15px 0 15px;
  line-height: 19px;
}

.help-text {
  padding: 5px 15px 0 15px;
  text-align: right;
  font-size: 11px;
}

.help-text p {
  margin: 0;
}

.choices-radio {
  padding: 15px 15px 0 25px;
}

.choices-radio label {
  /* word-wrap: break-word; */
  white-space: normal;
}

.choices-radio input {
  margin-bottom: 10px;
}

/* TOOLTIP */

.tooltip {
  position: relative;
  font-size: 12px;
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: row;
  color: black;
}

.tooltip img {
  margin-right: 5px;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 300px;
  background-color: #f7f7f7;
  color: black;
  text-align: left;
  border-radius: 6px;
  padding: 10px;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: -5px;
  right: 105%;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

/* CHANGE RADIO BUTTONS ASPECT */

/* The container */

.radio-style {
  display: block;
  position: relative;
  padding-left: 25px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 13px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */

.radio-style input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: gainsboro;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */

.radio-style:hover input~.checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */

.radio-style input:checked~.checkmark {
  background-color: black;
}

/* Create the indicator (the dot/circle - hidden when not checked) */

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */

.radio-style input:checked~.checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */

.radio-style .checkmark:after {
  top: 6px;
  left: 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: white;
}

/* SCROLLBAR */

/* width */

 ::-webkit-scrollbar {
  width: 8px;
}

/* Track */

 ::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */

 ::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */

 ::-webkit-scrollbar-thumb:hover {
  background: #555;
}
```

```html
<!DOCTYPE html>
<html>

<body style="margin: 0 auto; max-height: 70vh; background-color: #DCE3EA; text-align: center; margin-top: 15px; font-family: Roboto Condensed, sans-serif;">
  <div class="wrapper" style="padding: 15px 0; width: 70vw; margin: 0 auto; background-color: #ffffff; border-radius: 3px; border: 1px solid #c8c8c8;
    box-shadow: 2px 2px 8px #a8a8a8;">

    <div class="sections-choices">
      <div class="sections">
        <h4>1. Section 1</h4>
        <p class="question-select"><a href="">Question 1</a></p>
        <p class="question-select"><a href="">Question 2</a></p>
        <p class="question-select"><a href="">Question 3</a></p>
        <p class="question-select"><a href="">Question 4</a></p>

        <h4>2. Section 2</h4>
        <p class="question-select"><a href="">Question 1</a></p>
        <p class="question-select"><a href="">Question 2</a></p>

        <h4>3. Section 3</h4>
        <p class="question-select"><a href="">Question 1</a></p>
        <p class="question-select"><a href="">Question 2</a></p>
        <p class="question-select"><a href="">Question 3</a></p>

        <h4>4. Section 4</h4>
        <p class="question-select"><a href="">Question 1</a></p>

        <h4>5. Section 5</h4>
        <p class="question-select"><a href="">Question 1</a></p>
        <p class="question-select"><a href="">Question 2</a></p>
        <p class="question-select"><a href="">Question 3</a></p>

        <h4>6. Section 6</h4>
        <p class="question-select"><a href="">Question 1</a></p>
        <p class="question-select"><a href="">Question 2</a></p>
        <p class="question-select"><a href="">Question 3</a></p>
        <p class="question-select"><a href="">Question 4</a></p>
        <p class="question-select"><a href="">Question 5</a></p>
      </div>
      <div class="choices">
        <div class="choices-section-title">
          <h4>Section 1 out of 6</h4>
          <h4>Question 1 out of 4</h4>
        </div>
        <div class="choices-title"><b>1. This is Question 1 ?</b></div>
        <div class="help-text">
          <div class="tooltip">
            <img src="" width="18px"> More information
            <span class="tooltiptext"> Tooltip text </span>
          </div>
        </div>
        <div class="choices-radio">
          <label class="radio-style">Choice 1
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 2
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 3
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 4
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 5
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 6
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 7
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 8
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 9
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>

          <label class="radio-style">Choice 10
                                <input type="radio" value="choice1" name="choice1"><br>
                                <span class="checkmark"></span>
                            </label>
        </div>
      </div>
    </div>
  </div>
</body>

</html>
```