Not able to implement center scrolling in ember-modal-dialog

I have designed a modal dialog in ember app using ember-modal-dialog addon.I want to implement the center scrolling in my dialog.But Not able to do it.

feed.hbs

<p {{action "toggleModal" photo }}>{{photo.0.numFives}}</p>
            {{#if photo.0.dialogShowing}}
              {{#modal-dialog translucentOverlay=true
                  targetAttachment='none'
                  container-class='centered-scrolling-container'
                  overlay-class='centered-scrolling-overlay'
                  wrapper-class='centered-scrolling-wrapper'}}

              <p>People who like this</p>
              <button class="close" {{action 'dialogClose' photo}}>X</button>
              <img src = "images/shape-line-separator.png" style = "width:340px;height:1px">
              {{#each model.feed.fiver as |fiver|}}
                  <div class="col-sm-12">
                    <div class = "col-sm-4">
                      <div class = "pr">
                        <img src = "{{fiver.dp_url}}" onload = "OnImageLoad(event); "/>
                      </div>  
                    </div>
                    <div class = "col-sm-3"> 
                      <p class="username">{{fiver.full_name}}</p>
                      <p class="userkarma">{{fiver.likes}}  like</p>
                    </div>
                    <img src = "images/shape-line-separator.png">
                  </div>
              {{/each}}
              {{/modal-dialog}}
            {{/if}}

css

.centered-scrolling-wrapper {
  position: fixed;
  z-index: 99;
  height: 100vh;
  left: 0;
  right: 0;
  top: 0;
  overflow-y: scroll;
}

.centered-scrolling-overlay {
  display: flex;
  display: -webkit-flex;
  align-items: flex-start;
  -webkit-align-items: flex-start;
  justify-content: center;
  -webkit-justify-content: center;
  min-height: 100vh;
  padding: 10em;
  position: relative;
  height: auto;
}

.centered-scrolling-overlay.translucent {
  background-color: rgba(35, 31, 32, 0.81);; 
}

/* basic modal style (an example, this is not necessary for the centering) */
.centered-scrolling-container {
  position: relative;
  background-color: #343031;;
  border-radius:2px;
  width:360px;
  max-height:250px;
  box-shadow:0 0 0px;
  padding:0px;
  top:25%;
}

In above code the dialog box appear but it accumulates the data outside the max-height and not like center-scrolling.The dialog box is also doesn't fix at one point.I want to fix the dialog box at one point and when I SCROLL