/* Common tableless box styles */
/* 17May2010 removed position: relative; from .boxLeft and .boxRight to fix an IE6 problem with form field focus. V.Gungor */
.boxTopLeft
{
	background-repeat: no-repeat !important;
	background-position: left top;
}

.boxTopRight
{  
/* .mcboxTopRight will span the FULL WIDTH of the container div, so "right top"
is necessary to place the background image on the right end of the box. */
	background-color: transparent !important;
	background-repeat: no-repeat !important;
	background-position: right top;
	text-align: center;
}

.boxLeft
{
	clear: both;
	background-repeat: repeat-y !important;
	background-position: left top;
}


.boxRight
{
	background-repeat: repeat-y !important;
	background-position: right top;
}

.boxCenter
{
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
	/* overflow: auto; */ /* causes problems in IE7 */
}

.boxContent
{
	margin: 0;
}

.boxBottomLeft
{
	background-repeat: no-repeat;
	background-position: left bottom;
}

.boxBottomRight
{
	background-repeat: no-repeat;
	background-position: right bottom;
}

.boxClear
{
	clear: both;
	line-height: 0;
}


/* Rad5 Style (Radius 5px Design) - Geometry Styles */

.boxRad5 .boxTopLeft,
.boxRad5 .boxTopRight
{
	height: 20px !important;
}

.boxRad5 .boxBottomLeft,
.boxRad5 .boxBottomRight
{
	height: 20px !important;
}

.boxRad5 .boxCenter
{
	margin-top: -20px !important; /* = height of boxTopLeft and boxTopRight */
	margin-bottom: -20px !important; /* = height of boxBottomLeft and boxBottomRight */
}

/* Style Specific */ 
.boxRad5 .boxCenter
{
	padding: 6px 8px 7px 4px !important; /* padding accomodates the drop shadow */
}

/* Customizable - override as necessary */ 
.boxRad5 .boxContent
{
	padding: 10px 10px 0px 10px; /* padding-bottom: 0; required to keep lower edges of the boxes aligned */
}

/* Gradient Option - Geometry Styles */
.boxRad5.gradient .boxBottomLeft,
.boxRad5.gradient .boxBottomRight
{
	height: 60px !important;
}

.boxRad5.gradient .boxCenter
{
	margin-bottom: -60px !important; /* = height of boxBottomLeft and boxBottomRight */
	padding: 6px 8px 7px 4px !important;  /* padding accomodates the drop shadow */
}

/* Header Option - Geometry Styles */
.boxRad5.header .boxTopLeft,
.boxRad5.header .boxTopRight
{
	height: 2.5em !important;
	overflow: hidden !important;
}

.boxRad5.header .boxTopRight
{
	color: #fff;
	padding: .8em 1.2em;
	font-weight: bold;
	font-size: 1em;
}

.boxRad5.header .boxCenter
{
	margin-top: 0 !important; 
	margin-bottom: -20px !important;
	padding: 0 8px 7px 4px !important;
}

.boxRad5.header .boxContent
{
}

/* Transparent Frame Option */
.transparent .boxTopLeft { position: relative; z-index: 2; }
.transparent .boxBottomLeft { position: relative; z-index: 2; }
.transparent .boxContent
{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

/* Color Styles */
.boxRad5 .boxTopLeft { background-image: url(Cattails-box-rad5-EFF2F3-topleft.1.gif); }
.boxRad5 .boxTopRight { background-image: url(Cattails-box-rad5-EFF2F3-topright.1.gif); }
.boxRad5 .boxLeft { background-image: url(Cattails-box-rad5-EFF2F3-left.1.gif); }
.boxRad5 .boxRight { background-image: url(Cattails-box-rad5-EFF2F3-right.1.gif); }
.boxRad5 .boxBottomLeft { background-image: url(Cattails-box-rad5-EFF2F3-bottomleft.1.gif); }
.boxRad5 .boxBottomRight { background-image: url(Cattails-box-rad5-EFF2F3-bottomright.1.gif); }

.boxRad5.transparent .boxTopLeft { background-image: url(Cattails-box-rad5-EFF2F3-topleft-trans.1.png); }
.boxRad5.transparent .boxTopRight { background-image: url(Cattails-box-rad5-EFF2F3-topright-trans.1.png); }
.boxRad5.transparent .boxLeft { background-image: url(Cattails-box-rad5-EFF2F3-left-trans.1.png); }
.boxRad5.transparent .boxRight { background-image: url(Cattails-box-rad5-EFF2F3-right-trans.1.png); }
.boxRad5.transparent .boxBottomLeft { background-image: url(Cattails-box-rad5-EFF2F3-bottomleft-trans.1.png); }
.boxRad5.transparent .boxBottomRight { background-image: url(Cattails-box-rad5-EFF2F3-bottomright-trans.1.png); }

.boxRad5.gradient .boxBottomLeft { background-image: url(Cattails-box-rad5-EFF2F3-bottomleft-grad.1.gif); }
.boxRad5.gradient .boxBottomRight { background-image: url(Cattails-box-rad5-EFF2F3-bottomright-grad.1.gif); }

.boxRad5.header .boxTopLeft { background-image: url(Cattails-box-rad5-EFF2F3-topleft-head.1.gif); }
.boxRad5.header .boxTopRight { background-image: url(Cattails-box-rad5-EFF2F3-topright-head.1.gif); }