/** 
 * Tab top links (==> top-row > tab|tab_selected)
 * <div class='tab-pane'>
 *   <div class='tab-page'>
 *     <h2  class='tab'></h2>
 *     ...
 *   </div>
 * </div>
 */

.tab-row {
  zoom: 1; /* force hasLayout in IE */
}

.tab-row .tab ,
.tab-row .tab_selected {
  font-family: Arial, Helvetica, sans-serif;
  font-size: small;
  font-weight: normal;
  
  display: inline;
  position:  relative;
  float: left;
  top: 1px;
  z-index: 1;
  
  margin:  4px 4px 1px 0px;
  padding: 2px 6px 3px 6px;

  background:  #FFFFFF;

  border: 1px solid;
  border-color:  #EDEDED #DDDDDD #EDEDED #EDEDED;
  border-bottom: none;
  cursor: default;
  
  -moz-border-radius-topright:     5px;
  -moz-border-radius-topleft:      5px;
  -webkit-border-top-right-radius: 5px;
  -webkit-border-top-left-radius:  5px;
  border-top-right-radius:         5px;
  border-top-left-radius:          5px;
}


.tab-row .tab A,
.tab-row .tab_selected A {
  cursor: pointer;
  color: #888888;
  font-family: Arial, Helvetica, sans-serif;
  text-decoration: none;
}

.tab-row .tab:hover   {  border-color: #999999; }
.tab-row .tab:hover A {  color:        #333333; }


.tab-row .tab A:focus,
.tab-row .tab_selected A:focus { outline: none; }

.tab-row .tab A IMG,
.tab-row .tab_selected A IMG {
  vertical-align: top;
}


/* IE 6 and below */
* html .tab-row .tab ,
* html .tab-row .tab_selected {
  top: auto; /* IE 6 & 7 */
}
/* IE 7 only */
*:first-child+html .tab-row .tab ,
*:first-child+html .tab-row .tab_selected {
  top: auto; /* IE 6 & 7 */
}

/* Custom style for the selected tab */

.tab-row .tab_selected {
  font-weight: bold;
  
  margin:  0px 4px 0px 0px;/*4px 0.3em 1px 0px;*/
  padding: 4px 6px 3px 6px;

  top:     4px;
  
  border-width: 1px; 
  border-color: #BBBBBB #999999 #999999 #BBBBBB;
  border-bottom: none;
  z-index: 1;
  
  background:  #E4ECEE;
  background-image: url("../../images/jalios/layout/bg/tabBg.gif");
  background-repeat: repeat-x;
  
  /*
  box-shadow:         2px 0px 3px #D0D0D0;
  -moz-box-shadow:    2px 0px 3px #D0D0D0;
  -webkit-box-shadow: 2px 0px 3px #D0D0D0;
  */
}
.tab-row .tab_selected A { color: #333333; }
 


/* IE 6 and below */
* html .tab-row .tab_selected {
  top: 3px; /* IE 6 & 7 */
}
/* IE 7 only */
*:first-child+html .tab-row .tab_selected {
  top: 3px; /* IE 6 & 7 */
}

/**
 * Tab Content (==> tab-page)
 */

.tab-single-pane ,
.tab-page {
  width: auto; display: table; min-width: 600px; /* cf tabpane.js l284 */
  clear: both;
  
  border: 1px solid ;
  border-color: #BBBBBB #999999 #999999 #BBBBBB;
  color: WindowText;
  font: Message-Box;
  padding: 10px;
  background: #FAFAFA;
  background-image: url("../../images/jalios/layout/bg/formBg.gif");
  background-repeat: repeat-x;
  
  position: relative;
  zoom: 1; /* ShakeIE */
  
  -moz-border-radius-topright:     10px;
  -webkit-border-top-right-radius: 10px;
  border-top-right-radius:         10px;
  
  box-shadow:         2px 2px 5px #D0D0D0;
  -moz-box-shadow:    2px 2px 5px #D0D0D0;
  -webkit-box-shadow: 2px 2px 5px #D0D0D0;
}

/*
.tab-single-pane TABLE,
.tab-page        TABLE{
  margin: 10px;
}
*/
/*
.tab-page textarea {
  position: relative;
}
*/

.tab-page PRE {
  font-size: smaller;
}
.tab-page HR {
  color: #E4E4E4;
  background-color: #E4E4E4;
  height: 1px;
  border: 0;
}

/**
 * Tab inside another tab
 */

.formArea .tab-row .tab ,
.tab-page .tab-row .tab { background: #E5E5E5; }

.formArea .tab-row .tab ,
.tab-page .tab-row .tab ,
.tab-page .tab-row .tab_selected {
  border-color: #BBBBBB #999999 #999999 #BBBBBB;
  /*margin-right: 0;*/
}

.formArea .tab-row .tab IMG,
.tab-page .tab-row .tab IMG,
.tab-page .tab-row .tab_selected IMG {
  width:  16x;
  height: 16x;
}
/*
.tab-page .tab-row .tab_selected {  
  box-shadow:         2px 0px 3px #E0E0E0;
  -moz-box-shadow:    2px 0px 3px #E0E0E0;
  -webkit-box-shadow: 2px 0px 3px #E0E0E0;
}
*/
.formArea .tab-page,
.tab-page .tab-page {
  width: auto; display: table;
  background: #E4E5E7;
  background-image: url("../../images/jalios/layout/bg/subFormBg.gif");
  background-repeat: repeat-x;
  background-position: top;
  border-color: #CCCCCC #AAAAAA #AAAAAA #CCCCCC;
  
  box-shadow:         2px 1px 3px #E0E0E0;
  -moz-box-shadow:    2px 1px 3px #E0E0E0;
  -webkit-box-shadow: 2px 1px 3px #E0E0E0;
}

/**
 * Following styles provided to prevent huge difference between
 * styles used before tabpane setup and styles used after.
 */

H2.tab { 
  font-family: Arial, Helvetica, sans-serif;
  font-size: small;
  font-weight: bold;
}

/* -- JCMS Colors ---------------------------------------------- */


.content .tab_selected,
.content .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBg-blue.gif");
  background-color: #F5F5FA;
}
.content .tab_selected{
  background-image: url("../../images/jalios/layout/bg/tabBg-blue.gif");
}

.content .tab-page .tab_selected,
.content .tab-page .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBgSub-blue.gif");
  background-color: #E4EBFF;
}
.content .tab-page .tab_selected{
  background-image: url("../../images/jalios/layout/bg/tabSubBg-blue.gif");
}

.ugc .tab_selected,
.ugc .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBg-orange.gif");
  background-color: #F9F7F2;
}

.ugc .tab-page .tab_selected,
.ugc .tab-page .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBgSub-orange.gif");
  background-color: #FDF0E5;
}

.portlet .tab_selected,
.portlet .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBg-yellow.gif");
  background-color: #FAFFF4;
}

.portlet .tab-page .tab_selected,
.portlet .tab-page .tab-page {
  background-image: url("../../images/jalios/layout/bg/formBgSub-yellow.gif");
  background-color: #FFFFDD;
}