/*
* STYLES FOR: jquery.layout.js
*/
/*
* LAYOUT PANE FORMATTING
*/
.pane ,
.ui-layout-pane {
  background-color: #FFF;
  border: 1px solid #777;
  padding: 0;/* alignment & padding is on the inner-divs */
  overflow: auto; /* will be auto-set to 'hidden' for any pane with a 'scrolling content div' */
}
.pane-north .content ,
.pane-south .content {
  text-align: center;
}
.pane-north {
  border-bottom: none;
}
.pane-center {
  /* show off the inner-layout inside the outer-center-pane*/
  background-color: #F6F6F6;
  padding: 15px; /* for outer layout */
}

/*
* LAYOUT RESIZERS & TOGGLERS
*/
.ui-layout-resizer-north-dragging ,
.ui-layout-resizer-north:hover ,
.resizer-north-dragging ,
.resizer-north:hover    { height: 6px; background: url(resizable-n-s.gif) repeat-x center; background-position: 0 0 !important; }

.ui-layout-resizer-south-dragging ,
.ui-layout-resizer-south:hover ,
.resizer-south-dragging ,
.resizer-south:hover    { height: 6px; background: url(resizable-n-s.gif) repeat-x center; background-position: 0 -7px !important; }

.ui-layout-resizer-west-dragging ,
.ui-layout-resizer-west:hover ,
.resizer-west-dragging ,
.resizer-west:hover  { width: 6px; background: url(resizable-e-w.gif) repeat-y center; background-position: 0 0 !important; }

.ui-layout-resizer-east-dragging ,
.ui-layout-resizer-east-open:hover ,
.resizer-east-dragging ,
.resizer-east-open:hover  { width: 6px; background: url(resizable-e-w.gif) repeat-y center; background-position: -7px 0 !important; }

.ui-layout-resizer-east-open ,
.resizer-east-open {
  background-color: #999;
  opacity: 0.1;
  filter: alpha(opacity=10);
}
.ui-layout-resizer-east-open:hover ,
.resizer-east-open:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.ui-layout-resizer-dragging ,
.resizer-dragging {
  /* see draggable.opacity option
  opacity: 0.5;
  filter: alpha(opacity=50);
  */
}

/* IE6 * HACK - always show resizer graphics because IE6 cannot understand elem:hover */
* html .resizer-north   { height: 6px; background: url(resizable-n-s.gif) repeat-x center !important; background-position: 0 0 !important; }
* html .resizer-south   { height: 6px; background: url(resizable-n-s.gif) repeat-x center !important; background-position: -7px 0 !important; }
* html .resizer-west { width: 6px; background: url(resizable-e-w.gif) repeat-y center !important; background-position: -7px 0 !important; }
* html .resizer-east-open { width: 6px; background: url(resizable-e-w.gif) repeat-y center !important; background-position: 0 0 !important; }
* html .resizer-north ,
* html .resizer-south ,
* html .resizer-west ,
* html .resizer-east-open {
  opacity: 0.1 !important;
  filter: alpha(opacity=10) !important;
}

/*
* SIMPLE TOGGLER BUTTONS (used on Outer Layout North/South only)
*/

.ui-layout-toggler-north-open ,
.ui-layout-toggler-south-closed ,
.toggler-north-open ,
.toggler-south-closed     { width: 35px; height: 5px; background: url(toggle-dn-up.gif) no-repeat center bottom; background-position: 0 -6px !important; }

.ui-layout-toggler-north-closed ,
.ui-layout-toggler-south-open ,
.toggler-north-closed ,
.toggler-south-open       { width: 35px; height: 5px; background: url(toggle-dn-up.gif) no-repeat center top; background-position: 0 0 !important; }

.ui-layout-toggler-east-closed ,
.ui-layout-toggler-west-open ,
.toggler-east-closed ,
.toggler-west-open    { width: 5px; height: 35px; background: url(toggle-lt-rt.gif) no-repeat center right; background-position: 0 0 !important; }

.ui-layout-toggler-west-closed ,
.ui-layout-toggler-east-open ,
.toggler-west-closed ,
.toggler-east-open    { width: 5px; height: 35px; background: url(toggle-lt-rt.gif) no-repeat center left; background-position: -6px 0 !important; }

/*
* extJS-STYLE RESIZER/SLIDER-BAR (CLOSED)
*/
.ui-layout-resizer-east-closed ,
.resizer-east-closed {
  background: #D1E6FC url(blue-dots.png) 0 0 repeat;
  border-top: 1px solid #777;
  border-bottom: 1px solid #777;
}
.ui-layout-resizer-east-closed:hover ,
.resizer-east-closed:hover {
  background: #D1E6FC;
}

/*
* NORTH PANE TOOLBAR & BUTTONS
*/

ul.toolbar {
  position: relative;
  overflow: hidden; /* required to CONTAINER 'floating li' in FF */
  height:   auto;
  margin:   0;
  padding:  2px;
  width:    100%;
  list-style: none;
  text-align: left;
  background: #D6D6D6 url(glass.png) 0 50% repeat-x;
  border-top: 1px solid #BBB;
  }
  ul.toolbar li {
    font-size: 0.9em;
    margin: 0;
    padding: 2px 7px;
    float: left;
    color: #000;
    border: 1px solid transparent;
    border-right-color: #BBB;
    cursor: pointer;
  }
  ul.toolbar li:hover {
    color: #005;
    background: #EEE url(glass-light.png) 0 50% repeat-x;
    border-top-color: #BBB;
    border-bottom-color: #BBB;
  }
  ul.toolbar li.first:hover {
    border-left-color: #BBB;
    }
    ul.toolbar li span {
      /* icons in toolbar */
      width:      15px;
      height:     15px;
      margin-left:  -3px;
      margin-right: 0.75ex;
      vertical-align: middle;
      opacity:    0.6;
      filter:     alpha(opacity=60);
      display:    block;
      display:    inline-block;
    }
    ul.toolbar li:hover span {
      opacity: 1;
      filter: alpha(opacity=100);
    }
    li.button-toggle-north span ,
    li.button-open-south span { width: 15px; height: 15px; background: url(go.gif) no-repeat center; background-position: 0 -112px !important; }
    li.button-close-south span  { width: 15px; height: 15px; background: url(go.gif) no-repeat center; background-position: 0 -16px !important; }
    li.button-pin-up span   { width: 15px; height: 15px; background: url(pin.gif) no-repeat center; background-position: 0 -48px !important; }
    li.button-pin-down span   { width: 15px; height: 15px; background: url(pin.gif) no-repeat center; background-position: 0 -16px !important; }

/*
 *  extJS-STYLE TOGGLE & PIN BUTTONS
 *
 *  these 'extra buttons' are INSIDE the east/west panes
 */
/* CUSTOM pin/close buttons */
span.button-pin ,
span.button-close {
  position: absolute;
  top:    0;
  width:    20px;
  height:   20px;
  z-index:  2;
  display:  block;
  cursor:   pointer;
}
span.button-close-east  { right: 0; }
span.button-pin-east  { left:  1px; }

/* CUSTOM pin-buttons */
span.button-pin-up          { width: 15px; height: 15px; background: url(pin.gif) no-repeat center; background-position: 0 -32px !important; }
span.button-pin-up:hover      { width: 15px; height: 15px; background: url(pin.gif)  no-repeat center; background-position: 0 -48px !important; }
span.button-pin-down        { width: 15px; height: 15px; background: url(pin.gif) no-repeat center; background-position: 0 0 !important; }
span.button-pin-down:hover    { width: 15px; height: 15px; background: url(pin.gif)  no-repeat center; background-position: 0 -16px !important; }

/* CUSTOM close-buttons */
span.button-close-east      { width: 15px; height: 15px; background: url(go.gif) no-repeat center; background-position: 0 -64px !important; }
span.button-close-east:hover  { width: 15px; height: 15px; background: url(go.gif)  no-repeat center; background-position: 0 -80px !important; }

/* STANDARD toggler-buttons - when the east/west panes are 'closed' */
.ui-layout-toggler-east-closed ,
.toggler-east-closed    { width: 15px; height: 15px; background: url(go.gif) no-repeat center; background-position: 0 -32px !important; }

.ui-layout-toggler-east-closed ,
.toggler-east-closed:hover  { width: 15px; height: 15px; background: url(go.gif)  no-repeat center; background-position: 0 -48px !important; }


/*  *************************** Styles to override theme - KDC 8/17/2009 ********************************* */



.ui-widget-content { background: #fff; background-image:none; }
.ui-widget-header { background: #a1b9df url(blue-highlight.png) 50% 50% repeat-x; color: #222; height:15px; border-color:#d8d8d8; }
.ui-dialog .ui-dialog-title { margin:0px; }
.ui-dialog .ui-dialog-titlebar { padding: 1px .3em 2px 1em }

.ui-widget-header .ui-icon { background-color:#9fb8d5; }

.ui-state-hover .ui-icon { background-color:#ddecf7; }