Try this.

#q54 label {width: 175px; text-align:right;}
#q54 .cf-field {width: 50px; min-width: 50px;}
#q54 .cf-medium {width: 50px;}
#q56 .cf-field {width: 75px; min-width: 75px;}
#q56 .cf-medium {width: 75px;}
#q57 .cf-field {width: 150px; min-width: 150px;}
#q57 .cf-medium {width: 150px;}
#q56 label{display: none;}
#q57 label{display: none;}

#q54,#q56,#q57 {display:inline-block;}

FYI, if you reduce the px width for the Q54 label, the fields will all move left, but it will retain the space between the label and the field which is why I assign text-align:right for that label

Also, for the field width ( .cf-medium ) I am assuming that your Field Width Setting when you created your fields was set to Medium. If you changed the Field Widths to Small, Large, X-Large, you would need to change the corresponding line in the CSS to match.

ie: Field Width of Small would require the code changed from .cf-medium to .cf-small.

When changing the pixel width of a field, it's not required but easiest to make all values for that fields the same

ie:

#q56 .cf-field {width: 75px; min-width: 75px;}
#q56 .cf-medium {width: 75px;}