Toolbar in designer

Hello. I know I ask some weird questions and this is no different.
online in the iframe designer on our website marionsigns.com the toolbar is behind, and partly being hidden by the design area.
see image attached
I know where the choose the buttons in the Styles, this one is Style 4
however, I have no idea how to change the width of that area so that it does not look jumbled up and haphazard
can you tell me what the name of that area is and where I might find the width to change it? I do not know why the iframe is so narrow.
below is the code I have for that page, it's set to 100% width.

<div style="text-align: center; margin-left: auto; margin-right: auto;"><iframe src="http://designer.realtimedesigner.com/customsigncenter-1/MarionSignsYardSigns/index.php&tng=Y3BpPTcxMzEyJmN0aT0yMzgxNA=="; id="rtd_iframe" class="frame_rtd" style="width: 100%; vertical-align: center; min-height: 900px;" ></iframe></div>

can you help me with this?

thanks!

So your problem is the frame being too narrow?
If that's the case, setting it to 100% doe NOT mean 100% of the page, but 100 of the parent block element.

In your case there are several elements forcing the max width to be 940px. I found mostly 2 in your page:
<div class="container"> has a max-width of 940px
<div class="span12" id="jcompon"> has a width of 940px