
<HTML>
<HEAD>
	<TITLE></TITLE>
	<SCRIPT LANGUAGE=javascript SRC="indexB.js"></SCRIPT>
</HEAD>
<body style="margin:0;overflow:hidden" onload="OnLoadIndex()" onresize="OnResizeIndex()" onmouseup="OnMouseUpBar()" onmousemove="return OnMouseMoveBar(event);">

<!-- Header -->
<div id="divHeader" style="width:100%;height:60px">
	<table cellpadding=0 cellspacing=0 width="100%">
		<tr>
			<td style="width:100%"><img width=100% height=24 src="image003.gif"></td>
		</tr>
		<tr>
			<td style="width:100%"><img width=100% height=34 src="image002.gif"></td>
		</tr>
	</table>
</div>

<!-- Vertical Bar -->
<div id="divVertBar" onmousedown="return OnMouseDownBar(true, event);" style="cursor:col-resize;font-size:3pt;position:absolute;width:5px;background-color:blue"></div>

<!-- Horizontal Bar -->
<div id="divHorzBar" onmousedown="return OnMouseDownBar(false, event);" style="cursor:row-resize;font-size:3pt;position:absolute;width:100%;height:4px;background-color:blue"></div>

<!-- divPhantomBar -->
<div id="divPhantomBar" style="display:none;font-size:3pt;position:absolute;background-color:#369"></div>

<table cellpadding=0 cellspacing=0 style="border:3px solid blue">
	<tr>
		<td rowspan=2 style="border:2px solid white"><div id="divLeft" style="overflow:auto">This is the Left DIV</div></td>
		<td style="border:2px solid white"><div id="divMain" style="overflow:auto">This is the Main DIV<br><br><br>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		Practice resizing the panels using the vertical and horizonal bars.
		</div></td>
	</tr>
	<tr>
		<td style="border:2px solid white"><div id="divBottom">This is the Bottom DIV</div></td>
	</tr>
</table>
</BODY>
</HTML>