/*
** 2005-10 by Hubert Hilgers
** separating the general layout form the content
** tested on Safari, Firefox, IE 5.2 Mac

** Changes:
** 2005-10-28 HH: nested Boxes
** 2005-10-28 HH: reviewed
*/

/*--- HHBox ----*/
.HHBox,
.HHTabView {
 	font: 12px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
	color:black;
	border:0px black solid;	/*test*/
}
	.HHBox .tl,
	.HHTabView .tl{
		height:22px; width:22px;
		background:url(../images/widgets/HHBox1.gif) no-repeat bottom right;
	}
	.HHTabView .HHBox .tl {
		background:url(../images/widgets/HHNestedBox1.gif) no-repeat bottom right;
	}
	.HHBox .tc h3   { font: 100 10px "Lucida Grande", Geneva, Verdana, Helvetica, Arial, sans-serif; margin: 0px; padding: 2px; border: solid 0px blue }
	.HHBox .tc{
		padding-bottom:11px;
	}
	.HHBox .tc,
	.HHTabView .tc {
		background:url(../images/widgets/HHBox2.gif) repeat-x bottom;
	}
	.HHTabView .HHBox .tc {
		background:url(../images/widgets/HHNestedBox2.gif) repeat-x bottom;
	}
	.HHBox .tr,
	.HHTabView .tr { background: url(../images/widgets/HHBox3.gif) no-repeat left bottom; width: 24px; height: 24px }
	.HHTabView .HHBox .tr {
		background:url(../images/widgets/HHNestedBox3.gif) no-repeat bottom left;
	}
	.HHBox .ml,
	.HHTabView .ml{
		background:url(../images/widgets/HHBox4.gif) repeat-y right;
	}
	.HHTabView .HHBox .ml{
		background:url(../images/widgets/HHNestedBox4.gif) repeat-y right;
	}
	.HHBox .mc{
		padding:0px 0px 0px 0px;
		background:url(../images/widgets/HHBox5.gif) repeat;
	}
	.HHTabView .mc{
		padding:15px 10px 10px 10px;
		background:url(../images/widgets/HHBox5.gif) repeat;
	}
	.HHTabView .HHBox .mc{
		padding:0px 0px 0px 0px;
		background:url(../images/widgets/HHNestedBox5.gif);
	}
	.HHBox .mr,
	.HHTabView .mr {
		background:url(../images/widgets/HHBox6.gif) repeat-y left;
	}
	.HHTabView .HHBox .mr {
		background:url(../images/widgets/HHNestedBox6.gif) repeat-y left;
	}
	.HHBox .bl,
	.HHTabView .bl {
		height:22px; width:22px;
		background:url(../images/widgets/HHBox7.gif) no-repeat top right;
	}
	.HHTabView .HHBox .bl {
		background:url(../images/widgets/HHNestedBox7.gif) no-repeat top right;
	}
	.HHBox .bc,
	.HHTabView .bc {
		height:22px;
		background:url(../images/widgets/HHBox8.gif) repeat-x top;
	}
	.HHTabView .HHBox .bc {
		background:url(../images/widgets/HHNestedBox8.gif) repeat-x top;
	}
	.HHBox .br,
	.HHTabView .br {
		height:22px; width:22px;
		background:url(../images/widgets/HHBox9.gif) no-repeat top left;
	}
	.HHTabView .HHBox .br {
		background:url(../images/widgets/HHNestedBox9.gif) no-repeat top left;
	}

/* --- TabView widget's Tabs --- */
	.HHSegmentedControlMini {
		padding-bottom:4px;
	}
	.HHTabView .tc a:link,
	.HHTabView .tc a:visited,
	.HHSegmentedControl a:link,
	.HHSegmentedControl a:visited {
		text-decoration:none;
		font: 12px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: black;
	}
	.HHTabView .tc a:hover,
	.HHSegmentedControl a:hover {
		text-decoration:none;
		font: 12px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: #33c;
	}
	
	.HHTabView td.l,
	.HHSegmentedControl td.l {
		height:22px;
		padding:0px 10px 0px 15px;
		background: url(../images/widgets/HHTabLeft.gif) no-repeat left;
	}

	.HHTabView th.l,
	.HHSegmentedControl th.l {
		height:22px;
		padding:0px 10px 0px 15px;
		background: url(../images/widgets/HHTabLeftSelected.gif) no-repeat left;
	}

	.HHTabView td.m,
	.HHSegmentedControl td.m {
		height:22px;
		padding:0px 10px 0px 10px;
		background: url(../images/widgets/HHTabMiddle.gif) repeat-x center;
	}

	.HHTabView th.m,
	.HHSegmentedControl th.m {
		height:22px;
		padding:0px 10px 0px 10px;
		background: url(../images/widgets/HHTabMiddleSelected.gif) repeat-x center;
	}

	.HHTabView td.r,
	.HHSegmentedControl td.r {
		height:22px;
		padding:0px 15px 0px 10px;
		background: url(../images/widgets/HHTabRight.gif) no-repeat right;
	}
	.HHTabView th.r,
	.HHSegmentedControl th.r {
		height:22px;
		padding:0px 15px 0px 10px;
		background: url(../images/widgets/HHTabRightSelected.gif) no-repeat right;
	}

	.HHTabView td.d,
	.HHSegmentedControl td.d {
		height:22px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabDivider.gif) no-repeat center;
	}
	.HHTabView th.d,
	.HHSegmentedControl th.d {
		height:22px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabDividerSelected.gif) no-repeat center;
	}

/* --- small --- */
	.HHTabViewSmall a:link,
	.HHTabViewSmall a:visited,
	.HHSegmentedControlSmall a:link,
	.HHSegmentedControlSmall a:visited {
		text-decoration:none;
		font: 10px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: black;
	}
	.HHTabViewSmall a:hover,
	.HHSegmentedControlSmall a:hover {
		text-decoration:none;
		font: 10px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: #33c;
	}

	.HHTabViewSmall td.l,
	.HHSegmentedControlSmall td.l {
		height:19px;
		padding:0px 8px 0px 12px;
		background: url(../images/widgets/HHTabSmallLeft.gif) no-repeat left;
	}
	.HHTabViewSmall th.l,
	.HHSegmentedControlSmall th.l{
		height:19px;
		padding:0px 8px 0px 12px;
		background: url(../images/widgets/HHTabSmallLeftSelected.gif) no-repeat left;
	}
	.HHTabViewSmall td.m,
	.HHSegmentedControlSmall td.m{
		height:19px;
		padding:0px 8px 0px 8px;
		background: url(../images/widgets/HHTabSmallMiddle.gif) repeat-x center;
	}
	.HHTabViewSmall th.m,
	.HHSegmentedControlSmall th.m{
		height:19px;
		padding:0px 8px 0px 8px;
		background: url(../images/widgets/HHTabSmallMiddleSelected.gif) repeat-x center;
	}
	.HHTabViewSmall td.r,
	.HHSegmentedControlSmall td.r{
		height:19px;
		padding:0px 12px 0px 8px;
		background: url(../images/widgets/HHTabSmallRight.gif) no-repeat right;
	}
	.HHTabViewSmall th.r,
	.HHSegmentedControlSmall th.r{
		height:19px;
		padding:0px 12px 0px 8px;
		background: url(../images/widgets/HHTabSmallRightSelected.gif) no-repeat right;
	}
	.HHTabViewSmall td.d,
	.HHSegmentedControlSmall td.d{
		height:19px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabSmallDivider.gif) no-repeat center;
	}
	.HHTabViewSmall th.d,
	.HHSegmentedControlSmall th.d{
		height:19px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabSmallDividerSelected.gif) no-repeat center;
	}

/* ---- mini --- */
	.HHTabViewMini .tc a:link,
	.HHTabViewMini .tc a:visited,
	.HHSegmentedControlMini a:link,
	.HHSegmentedControlMini a:visited {
		text-decoration:none;
		font: 9px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: black;
	}
	.HHTabViewMini a:hover,
	.HHSegmentedControlMini a:hover {
		text-decoration:none;
		font: 9px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		color: #33c;
	}

	.HHTabViewMini td.l,
	.HHSegmentedControlMini td.l {
		height:15px;
		padding:0px 6px 0px 9px;
		background: url(../images/widgets/HHTabMiniLeft.gif) no-repeat left;
	}
	.HHTabViewMini th.l,
	.HHSegmentedControlMini th.l {
		height:15px;
		padding:0px 6px 0px 9px;
		background: url(../images/widgets/HHTabMiniLeftSelected.gif) no-repeat left;
	}
	.HHTabViewMini td.m,
	.HHSegmentedControlMini td.m {
		height:15px;
		padding:0px 6px 0px 6px;
		background: url(../images/widgets/HHTabMiniMiddle.gif) repeat-x center;
	}
	.HHTabViewMini th.m,
	.HHSegmentedControlMini th.m {
		height:15px;
		padding:0px 6px 0px 6px;
		background: url(../images/widgets/HHTabMiniMiddleSelected.gif) repeat-x center;
	}
	.HHTabViewMini td.r,
	.HHSegmentedControlMini td.r {
		height:15px;
		padding:0px 9px 0px 6px;
		background: url(../images/widgets/HHTabMiniRight.gif) no-repeat right;
	}
	.HHTabViewMini th.r,
	.HHSegmentedControlMini th.r {
		height:15px;
		padding:0px 9px 0px 6px;
		background: url(../images/widgets/HHTabMiniRightSelected.gif) no-repeat right;
	}
	.HHTabViewMini td.d,
	.HHSegmentedControlMini td.d {
		height:15px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabMiniDivider.gif) no-repeat center;
	}
	.HHTabViewMini th.d,
	.HHSegmentedControlMini th.d {
		height:15px;
		padding:0px 1px 0px 0px;
		background: url(../images/widgets/HHTabMiniDividerSelected.gif) no-repeat center;
	}

/* --- ImageView --- */
.HHImageView, .HHImageView a{
 	font: 8px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
	color:black;
}
	.HHImageView .tl { background: url(../images/widgets/HHImageView1.gif) no-repeat right bottom; border: dotted 1px aqua }
	.HHImageView .tc { background: url(../images/widgets/HHImageView2.gif) repeat-x center bottom; border: dotted 1px aqua }
	.HHImageView .tr { background: url(../images/widgets/HHImageView3.gif) no-repeat left bottom; border: dotted 1px aqua }
	.HHImageView .ml { background: url(../images/widgets/HHImageView4.gif) repeat-y right top; border: dotted 1px aqua }
	.HHImageView .mc { background: url(../images/widgets/HHImageView5.gif) repeat center; text-align: center; border: dotted 1px aqua }

	.HHImageView .mr { background: url(../images/widgets/HHImageView6.gif) repeat-y left top; border: dotted 1px aqua }
	.HHImageView .bl { background: url(../images/widgets/HHImageView7.gif) no-repeat right top; border: dotted 1px aqua }
	.HHImageView .bc { color: black; font: 9px "Lucida Grande", Geneva, Verdana, Helvetica, Arial, sans-serif; background: url(../images/widgets/HHImageView8.gif) repeat-x center top; border: dotted 1px aqua }
	.HHImageView .br { background: url(../images/widgets/HHImageView9.gif) no-repeat left top; border: dotted 1px aqua }

	.HHImageView .mc img{
		border:0px solid;
		padding: 0px;
		background:url(../images/widgets/HHImageView5.gif );
	}
	.HHImageView .mc a { color: #33c; font: 9px "Lucida Grande", Geneva, Verdana, Helvetica, Arial, sans-serif; background: url(../images/widgets/HHForwardButton.gif) no-repeat right ; border: dotted 1px aqua }

/* -- Table Views --- */
.HHTableView
{
	font-size: 12px;
	background-color: #ccc;
	border: solid 0px;
	width: 100%;
}
	.HHTableView th
	{
		padding: 2px;
		border:0px solid black;
		background-color:#ccc;
		color:black;
		font: 10px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		background:url(../images/widgets/HHTableHead.gif) repeat-x bottom;	
	}
	.HHTableView td
	{
		font: 12px 'Lucida Grande', Geneva, Verdana, Helvetica, Arial, sans-serif;
		background-color:white;	
		padding:2px;
		background-color:#fff;
		font-style: normal;
		color:black;
	}