/**
 * @project         Jx
 * @revision        $Id: ie6.css 243 2008-12-10 15:21:19Z fred.warnock $
 * @author          Fred Warnock (fwarnock@dmsolutions.ca)
 * @copyright       (c) 2006 DM Solutions Group Inc.
 */

/* ============= */
/* IE < 7 STYLES */
/* ============= */

/* 24 bit images do not appear correctly in IE versions below 7. Applying a 
 * filter through the class below will make them appear correctly.
 */
.png24{filter:expression(Jx.applyPNGFilter(this))}

/* Opacity needs to be set in IE6 and below using the following filters.
 * Please note that IE8 changed how filters are written. 
 */
.jxChromeDrag {filter: Alpha(opacity=50);}
.jxDialogModal {filter: Alpha(opacity=20);}
.jxDisabled {filter:Alpha(opacity=40);}
iframe.jxIframeShim {filter:Alpha(opacity:0);}

/* List items do not render properly under several conditions.  
 * Applying a height to the LI forces it to render properly.
 * Content that is taller than the li simply forces the li to be taller 
 */
.jxTree li,
.jxTreeRoot li {
  height: 20px;
}

/* tree item focus style */
.jxTree a:active,
.jxTreeRoot a:active {
  border-left: 1px dotted #75ADFF;
  border-right: 1px dotted #75ADFF;
  margin: 0px 0px 0px 14px;
  background-position: left -72px;
  outline: expression(hideFocus='true');
}

/* IE versions 7 and below do not recognize the focus pseudo-class, but instead
 * use the active pseudo-class.  Other browsers use the active-pseudo-class
 * while something is being pressed so IE specific definitions are needed. */
/* focus button */
ul.jxToolbar a.jxButton:active,
a.jxButton:active {
  background-position: left -96px;
  outline: expression(hideFocus='true');
}

a.jxButton:active span.jxButtonContent {
  background-position: right -96px;
}

/* focus active button */
ul.jxToolbar a.jxButtonActive:active,
a.jxButtonActive:active {
  background-position: left -144px;
}

a.jxButtonActive:active span.jxButtonContent {
  background-position: right -144px;
}

/* clicking normal button */
ul.jxToolbar a.jxButtonPressed:active,
a.jxButtonPressed:active {
  background-position: left -120px;
}

a.jxButtonPressed:active span.jxButtonContent {
  background-position: right -120px;
}

a.jxButtonDisclose:active {
  background-position: right -96px;
}

/* HORIZONTALTAB BAR - TOP and BOTTOM TABS */

/* Focus tab */
.jxBarTop a.jxTab:active,
.jxBarBottom a.jxTab:active {
  background-position: left -96px; 
  outline: expression(hideFocus='true');
}

.jxBarTop a.jxTab:active span.jxTabContent,
.jxBarBottom a.jxTab:active span.jxTabContent {
  background-position: right -96px; 
}

/* Focus Active tab */
.jxBarTop a.jxTabActive:active,
.jxBarBottom a.jxTabActive:active {
  background-position: left -144px; 
}

.jxBarTop a.jxTabActive:active span.jxTabContent,
.jxBarBottom a.jxTabActive:active span.jxTabContent {
  background-position: right -144px; 
}

/* Click Focused Tab */
.jxBarTop a.jxTabPressed:active,
.jxBarBottom a.jxTabPressed:active {
  background-position: left -120px; 
}

.jxBarTop a.jxTabPressed:active span.jxTabContent,
.jxBarBottom a.jxTabPressed:active span.jxTabContent {
  background-position: right -120px; 
}

/* VERTICAL TAB BAR - LEFT and RIGHT */

/* Focus tab */
.jxBarLeft a.jxTab:active,
.jxBarRight a.jxTab:active {
  background-position: -96px top; 
  outline: expression(hideFocus='true');
}

.jxBarLeft a.jxTab:active span.jxTabContent,
.jxBarRight a.jxTab:active span.jxTabContent {
  background-position: -96px bottom; 
}

/* Focus Active tab */
.jxBarLeft a.jxTabActive:active,
.jxBarRight a.jxTabActive:active {
  background-position: -144px top; 
}

.jxBarLeft a.jxTabActive:active span.jxTabContent,
.jxBarRight a.jxTabActive:active span.jxTabContent {
  background-position: -144px bottom; 
}

/* Click Focused Tab */
.jxBarLeft a.jxTabPressed:active,
.jxBarRight a.jxTabPressed:active {
  background-position: -120px top; 
}

.jxBarLeft a.jxTabPressed:active span.jxTabContent,
.jxBarRight a.jxTabPressed:active span.jxTabContent {
  background-position: -120px bottom; 
}


/* Menu Item focus style */
a.jxMenuItem:active {
  border: 1px dotted #75ADFF;
  outline: expression(hideFocus='true');
}

/* Icons line up according to the outermost parent not the immediate parent
 * applying a top overide to accomodate this
 */
img.jxMenuItemIcon {
  top: 2px;
  left: 0px;
}

a.jxMenuItemActive img.jxMenuItemIcon {
  top: 0px;
  left: -2px;
  padding: 1px;
  border: 1px solid #C5E0FF;
}
 
/* chrome in dialogs doesn't resize properly when collapsing a dialog before
 * moving or resizing it in IE 6 only, hiding overflow seems to do the trick
 */
.jxChrome {
  overflow: hidden;
}