/***************************************************
TAB STYLING
***************************************************/
ul.panelTabs {
  background: transparent;
  text-align: left;
  clear: both;
  position: relative;
  height: 23px;
  list-style: none;
  margin-left: 0;
}

ul.panelTabs li {
  background: #6696c3;
  float: left;
  text-align: center;
  text-decoration: none;
  color: #fff;
  border-right: 1px solid #fff;
  padding: 0 10px;
}

ul.panelTabs .current {
  background: #2569ab;
}

ul.panelTabs .tab a {
  display: block;
  text-decoration: none;
  color: #fff;
}

ul.panelTabs li.error a {
  display: block;
  text-decoration: none;
  color: #fff;
}

ul.panelTabs li a:hover {
  background: #9FBDD9;
  margin-left: -10px;
  padding-left: 10px;
  margin-right: -10px;
  padding-right: 10px;
  text-decoration: none;
  color: #fff;
}

ul.panelTabs .currentError {
  background: #a31b31;
}

ul.panelTabs li.error {
  background: #d31b31;
}

ul.panelTabs li a:hover {
  background: #2569ab;
  text-decoration: none;
  color: #fff;
}

ul.panelTabs li.error a:hover {
  background: #a31b31;
}

ul.panelTabs .disabled {
  background: #dbdbdb;
}

#tabBarSubBar {
  background: #2569ab;
  text-align: left;
  color: #fff;
  height: 24px;
}

#tabBarSubBar.error {
  background: #a31b31;
}

.disabledSubPanelSubBar {
  background: #dbdbdb;
}

/***************************************************
Page Submit Loading Message
***************************************************/
#loadingMsgMask {
  position: fixed;
  z-index: 300;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  filter: alpha(opacity=10);
  /* this hack is so it works in IE
     * I find setting the color in the css gives me more flexibility
     * than the PNG solution.
     */
  background: #000;

  display: none;
}

#loadingMsgContainer {
  position: absolute;
  z-index: 301;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  text-align: center;
}

#loadingMessage {
  position: fixed;
  z-index: 302;
  top: 50% !important;
  left: 50% !important;
  display: none;
  padding: 0;
}
#loadingMessageFrame {
  z-index: 303;
}

#loadingBody ul {
  list-style: none;
  margin: 10px;
  padding: 2px;
}
#overlay-middle {
  position: fixed;
  left: 0;
  width: 100%;
  top: 50%;
  margin-top: -60px;
  text-align: center;
  z-index: 1;
}
#overlay-center {
  width: 106px;
  height: 120px;
  margin: 0px auto;
  text-align: center;
  color: #000;
  font-weight: bold;
}
#overlay-image {
  background: url(/images/overlay/loading.gif);
  height: 100px;
  padding: 10px;
  width: 100px;
  background-size: cover;
}
#loadingBody {
  background: #fff;
}

table.helpTable td {
  padding: 0;
}

td.top {
  background: url(../images/top.gif) top left repeat-x;
  height: 10px;
}

td.topLeft {
  background: url(../images/topLeft.gif) top left no-repeat;
  height: 10px;
  width: 10px;
}

td.topRight {
  background: url(../images/topRight.gif) top right no-repeat;
  height: 10px;
  width: 10px;
}

td.left {
  background: url(../images/left.gif) left repeat-y;
  width: 10px;
}

td.middle {
  background: #eef2f6;
}

td.right {
  background: url(../images/right.gif) right repeat-y;
  width: 10px;
}

td.bottom {
  background: url(../images/bottom.gif) top left repeat-x;
  height: 10px;
}

td.bottomLeft {
  background: url(../images/bottomLeft.gif) bottom left no-repeat;
  height: 10px;
  width: 10px;
}

td.bottomRight {
  background: url(../images/bottomRight.gif) bottom right no-repeat;
  height: 10px;
  width: 10px;
}