/* ---------- jjBox ---------- 

<div class="jjBox">
<div class="jjT"><span></span><div></div></div>
<div class="jjM">

	== content here ==

</div>
<div class="jjB"><span></span><div></div></div>
</div>

The default above will produce a box with all four corners.
If there is a corner you DON'T want then just adiv the class for it: jjTL jjTR jjBL jjBR
The following would produce a box with only a top left corner and a bottom right corner:
	<div class="jjBox jjTR jjBL"> ...
*/

div.jjBox div.jjT,
div.jjBox div.jjT span,
div.jjBox div.jjT div,
div.jjBox div.jjM,
div.jjBox div.jjB,
div.jjBox div.jjB span,
div.jjBox div.jjB div {display:block;position:relative;background-image:url("images/jjBox.png");background-repeat:repeat-y;background-position:center top;margin:0;padding:0;}
div.jjBox div.jjT span,
div.jjBox div.jjT div,
div.jjBox div.jjB span,
div.jjBox div.jjB div {position:absolute;top:0;background-repeat:no-repeat;width:10px;}
div.jjBox div.jjT,
div.jjBox div.jjT span,
div.jjBox div.jjT div,
div.jjBox div.jjB,
div.jjBox div.jjB span,
div.jjBox div.jjB div {font-size:0;line-height:0;height:10px;}
div.jjBox div.jjT,
div.jjBox div.jjB {margin:0 10px;}
div.jjBox div.jjT span,
div.jjBox div.jjB span{left:-10px;}
div.jjBox div.jjT div,
div.jjBox div.jjB div {right:-10px;}
div.jjBox div.jjT span{background-position:top left;}
div.jjBox div.jjT div {background-position:top right;}
div.jjBox div.jjB span{background-position:bottom left;}
div.jjBox div.jjB div {background-position:bottom right;}
div.jjBox.jjTL div.jjT,
div.jjBox.jjBL div.jjB {margin-left:0;}
div.jjBox.jjTR div.jjT,
div.jjBox.jjBR div.jjB {margin-right:0;}
div.jjBox.jjTL div.jjT span,
div.jjBox.jjTR div.jjT div,
div.jjBox.jjBL div.jjB span,
div.jjBox.jjBR div.jjB div {display:none;}
div.jjBox div.jjM {padding:1px 10px;overflow:hidden;height:1%;}


/* ---------- jjBBox ---------- 
An add-on to jjBox if you need a border:
	<div class="jjBox jjBBox"> ...
*/

div.jjBBox div.jjT,
div.jjBBox div.jjT span,
div.jjBBox div.jjT div,
div.jjBBox div.jjM,
div.jjBBox div.jjB,
div.jjBBox div.jjB span,
div.jjBBox div.jjB div {background-image:url("images/jjBBox.png");}
div.jjBBox div.jjT,
div.jjBBox div.jjM,
div.jjBBox div.jjB {border:0px solid #f60;}
div.jjBBox div.jjT,
div.jjBBox div.jjB {height:9px;}
div.jjBBox div.jjT {border-top-width:1px;}
div.jjBBox div.jjB {border-bottom-width:1px;}
div.jjBBox div.jjT span,
div.jjBBox div.jjT div {top:-1px;}
div.jjBBox.jjTL div.jjT,
div.jjBBox.jjBL div.jjB,
div.jjBBox div.jjM {border-left-width:1px;}
div.jjBBox.jjTR div.jjT,
div.jjBBox.jjBR div.jjB,
div.jjBBox div.jjM {border-right-width:1px;}




/* testing 
div.jjBox div.jjT span,
div.jjBox div.jjB span {background-color:#f00 ! important;}
div.jjBox div.jjT div,
div.jjBox div.jjB div {background-color:#0f0 ! important;}
div.jjBox div.jjT,
div.jjBox div.jjB {background-color:#00f ! important;}
div.jjBox div.jjM {background-color:#0cc ! important;}
div.jjBox.jjBBox {}
*/

