/* CSS Document */

.picker-container {
  flex-direction: row;
  width: 20rem;
  height: 22rem;
  border-radius: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}
.scrollport::-webkit-scrollbar {
    display: none;
}
.scrollport:before,
.scrollport:after {
  content: '';
}

.scrollport {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 7.4rem;
  height: 22rem;
  overflow: auto;
  scroll-snap-type: y mandatory;
  margin: auto;
  font-family: Montserrat;
}

.scrollport:before,
.scrollport:after,
.cell {
  scroll-snap-align: center;
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 33.3%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: hsla(219,57%,37%,0.68);
  font-size: 2.1rem;
}

.cell.selected,span.selected {
  flex-basis: 33.3%;
  font-weight: bold;
  color: #294E94;
  border-radius: 28px;
  background: white;
  font-size: 3.4rem;
}
.cell.selected{
  border: solid 1px #294E94;
}
span.selected{  
  border: solid 1px #294E94;
  padding: 0px 7px;
}
.cell>span {
    min-width: 90%;
}
.picker-container>p{
  font-size: 1.4rem;
  color: #2a4f92;
  font-weight: 500;
}