html,
body {
  min-height: 100%;
  width: 100%;
}

.debug {
  outline: 1px dashed gray;
}

.container {
  background-color: lightgreen;
}

.element-container {
  background-color: white;
  padding: 24px;
  margin: 10px;
}

.md-num-picker{
  width:auto;
}

.md-num-picker__content {
  padding: 0;
  height: 40px;
  overflow: hidden;
  position:relative;
}

.md-num-picker__content-view {
  text-align: center;
  position: absolute;
  width: 100%;
}

.md-num-picker__content-view.ng-enter, 
.md-num-picker__content-view.ng-leave {
  transition: .5s linear all;
}
.md-num-picker__content-view.ng-enter {
  top:-100%;
}
.md-num-picker__content-view.ng-enter-active {
  top:0px;
}
.md-num-picker__content-view.ng-leave {
  top:0px;
}
.md-num-picker__content-view.ng-leave-active {
  top:100%;
}

.animate-up .md-num-picker__content-view.ng-enter {
  top:100%;
}
.animate-up .md-num-picker__content-view.ng-enter-active {
  top:0px;
}
.animate-up .md-num-picker__content-view.ng-leave {
  top:0px;
}
.animate-up .md-num-picker__content-view.ng-leave-active {
  top:-100%;
}