.ky-keyboard {
  .input-fields-wrap {

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    .input-field {
      &:nth-child(2){
        margin-right:24rpx;
      }
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 56rpx;
      height: 70rpx;
      margin-right: 8rpx;
      background: #ffffff;
      border: 2rpx solid #e0e0e0;
      border-radius: 8rpx;
      font-family: PingFangSC-Regular;
      font-size: 32rpx;
      color: #333333;
      &.new-power{
        position: relative;
        >view {
          position: absolute;
          width:100%;
          height:100%;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          > text {
            font-family: PingFangSC-Regular;
            font-size: 32rpx;
            line-height: 1;
            color: #cccccc;
            &:last-child {
              font-family: PingFangSC-Regular;
              font-size: 17rpx;
              color: #cccccc;
            }
          }
          // line-height: 30px;
        }
      }
      &:last-child {
        margin-right: 0;
        background: #ffffff;
        border: 2rpx dashed #e0e0e0;
        border-radius: 8rpx;
      }
      &.active,
      &:focus {
        border: 2rpx solid #dc1e32;
        border-radius: 8rpx;
        &::after{
          // position: absolute;
          // left:50%;
          // top:50%;
          // transform: translate3d(-50%,-50%,0);
          position: relative;
          z-index: 999;
          content:'';
          display: block;
          width:1rpx;
          height:34rpx;
          border-right:3px solid #dc1e32;
          animation:
          		 cursor 1s infinite;
        }
        // animation:
        // 		 cursor 1s infinite;
      }
    }
  }
}

/* Animation */
// @-webkit-keyframes typing{
// 	from { width: 100%;}
// 	to { width: 0;}
// }
// @-webkit-keyframes cursor{
// 	50% { border-color: white;}
// }
// @keyframes typing{
// 	from{ width: 100%;}
// 	to{ width: 0;}
// }
@keyframes cursor {
  50% {
    border-color: white;
  }
}