/*
# ui-tabs-nav This is the whole menu, an ordered or unordered list. Use this as a base class.
# ui-tabs-selected This is the current tab. It's very important to create a strong visual indication which tab is the current one.
# ui-tabs-deselectable This class is used only in conjunction with ui-tabs-selected for a tab that can become deselected upon click (option deselectable is set to true)
# ui-tabs-disabled For when a tab is disabled. Highly recommended to appear somewhat transparent or disabled. This is often done by graying the color.
# ui-tabs-panel These are the boxes that will have their visibility toggled.
*/

.taby {
  border: 1px #e0e0e0 solid;
  background: #e0e0e0 url(../images/taby.png) repeat-x top;
  margin-bottom: 15px;
}
.taby ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  padding-left: 10px;
  padding-top: 5px;
}
.taby li {
  display: inline;
  margin: 0;
}

.taby li a {
  display: block;
  padding: 7px 15px 0px 15px;
  height: 23px;
  float: left;
  text-decoration: none;
  font-family: Times New Roman;
  font-weight: bold;
  font-size: 12px;
  border-left: 1px #e0e0e0 solid;
  border-top: 1px #e0e0e0 solid;  
}

.taby li.last a {
  border-right: 1px #e0e0e0 solid;
}

.ui-tabs-selected a {
  background-color: #f6f6f6;
}
.ui-tabs-panel {
  clear: both;
  background: #f6f6f6 url(../images/taby-bot.png) repeat-x bottom;
  padding: 10px;
}

.ui-tabs-hide { 
  display: none; 
}