.time-container .time-container-content {
  display: inline-flex;
  width: 100%;
}

.time-container .time-container-content .time-value-input-container {
  width: 30%;
  min-width: 180px;
}

.time-container .time-container-content .time-value-input-container .time-input-textfield {
  border:  1px solid;
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  border-width: 1px;
}

.time-container .time-container-content .time-value-input-container .time-input-textfield:hover {
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.time-container .time-container-content .time-value-input-container .time-input-textfield:active {
  border-color: rgba( 43, 136, 216 ,  1 );
  border-color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.time-container .time-container-content .time-value-input-container .time-input-textfield.invalid {
  border-color: rgba( 218, 10, 0 ,  1 );
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.time-container .time-container-content .time-unit-container {
  width: 20%;
  min-width: 115px;
  float: right;
  padding-left: 15px;
}