How do I modify properties (container width and column widths) of the New Individual Form/Box
That dialog box has it's dimensions set in a style tag of the html that's generated by javascript (which is why you won't see it in the source of the page or any of the css). There's probably a setting in a config file somewhere that controls it. The class of that div is "ui-dialog ui-widget ui-widget-content ui-corner-all ui-front crm-container ui-draggable ui-resizable ui-dialog-buttons" in case that provides any hints, I'd guess it's from jquery_ui.

On other hand, you probably don't want to mess with it - I suspect it would just be easier adjust your workflow, and create the new contact first before registering him/her.

If you are determined to fix it, I'd recommend instead you look at 
"bootstrap" (as in getbootrap.com), which CiviCRM is adopting in various ways. With a bootstrap style of form, it would have a better layout and put the labels above the fields. You could do that just with a bit of css override, or you could go whole hog and look at civihr and the bootstrap interface component of that.