.div_wrap,
		.div_wrap * {
			font-size: 0;
		}
		
		
		
		.div_selArea {
			position: absolute;
			cursor: move;
			display:inline;
			/* @TODO: rest to be done via JS when selecting areas */
			top: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
			z-index: 2;
			background: transparent ;
		}
		
		/* div_clickArea is all a fix for IE 5.5 & 6 to allow the user to click on the given area */
		.div_clickArea {
			width: 100%;
			height: 100%;
			background-color: #FFF;
			opacity: 0.01;
			filter:alpha(opacity=01);
		}
				
		.div_marqueeHoriz {
			position: absolute;
			width: 100%;
			height: 1px;
			background: transparent url(../images/marqueeHoriz.gif) repeat-x 0 0;
		}
		
		.div_marqueeVert {
			position: absolute;
			height: 100%;
			width: 1px;
			background: transparent url(../images/marqueeVert.gif) repeat-y 0 0;
		}
				
		.div_marqueeNorth { top: 0; left: 0; }
		.div_marqueeEast  { top: 0; right: 0; }
		.div_marqueeSouth { bottom: 0px; left: 0; }
		.div_marqueeWest  { top: 0; left: 0; }
		
		
		.div_handle {
			position: absolute;
			border: 1px solid #333;
			width: 6px;
			height: 6px;
			background: #FFF;
			opacity: 0.5;
			filter:alpha(opacity=50);
			z-index: 3;
		}
		
		.div_handleN {
			top: -1px;
			left: 0;
			margin-left: 45%;    
			cursor: n-resize;
		}
		
		.div_handleNE { 
			top: -1px;
			right: -1px;
			cursor: ne-resize;
		}
		
		.div_handleE {
			top: 42%;
			right: -1px;
			
			cursor: e-resize;
		}
		
		.div_handleSE {
			right: -1px;
			bottom: -1px;
			cursor: se-resize;
		}
		
		.div_handleS {
			right: 0;
			bottom: -1px;
			margin-right: 49%; 
			cursor: s-resize;
		}
		
		.div_handleSW {
			left: -1px;
			bottom: -1px;
			cursor: sw-resize;
		}
		
		.div_handleW {
			top: 42%;
			left: -1px;
			
			cursor: e-resize;
		}
		
		.div_handleNW {
			top: -1px;
			left: -1px;
			cursor: nw-resize;
		}