/* (C) Copyright 2009, Hewlett Packard. All Rights Reserved. */

/* ========================================================================== */
/* Layout structure */

#pgm-language-div {
  background-color: black;
  color: white;
  height: 1em;
  }

#pgm-banner {
  background-color: black;
  color: white;
  overflow: hidden;
  padding-bottom: 1em;
  }

#pgm-top-pane {
  background-color: black;
  border-bottom: #4faf00 2px solid;
  margin: 0 0 1em 0;
  }

#pgm-left-pane {
  display: inline-block;
  border: #ccc 1px solid;
  margin: 0 0.5em 1em 0.5em;
  vertical-align: top;
  width: 20%;
  min-width: 8em;
  }

#pgm-title-div {
  }

.outerContentPane {
  display: inline-block;
  margin-bottom: 1em;
  vertical-align: top;
  width: 76%;
  }

.contentPane {
  }

#pgm-footer {
  clear: both;
  }

#pgm-page-ts-div {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  color: white;
  }

#pgm-banner h1, #pgm-title-div h1 {
  font-weight: normal;
  }

/* -------------------------------------------------------------------------- */
/* Override for home */

#pgm-top-pane.home {
  margin: 0 0 10px 0;
  }

.outerContentPane.home {
  background-color: white;
  margin: 0 1%;
  width: 97.5%;
  max-width: 100%;
  }

.contentPane.home {
  padding-left: 0;
  padding-right: 0;
  }

/* -------------------------------------------------------------------------- */
/* Banner */

#banner-logo-div {
  float: left;
  padding: 0 25px;
  }

#banner-logo-div img {
  width: 50px;
  height: 50px;
  }

#banner-section-title {
  float: left;
  width: 70%;
  }

/* -------------------------------------------------------------------------- */
/* Top pane */

.theme {
  float: left;
  margin-right: 2px;
  text-align: center;
  width: 11.2em;
  height: 2em;
  }

.themeHeader {
  float: left;
  padding: 0.375em 0;
  width: 10.75em;
  }

.themeHeader h2 {
  font-size: 100%;
  font-weight: bold;
  margin-bottom: 1px;
  margin-top: 1px;
  }

.cornerImg img {
  float: right;
  width: 5px;
  height: 2em;
  }

div.tabOff {
  background-color: #666;
  color: #fff;
  cursor: pointer;
  }

div.tabOff:hover {
  text-decoration: underline;
  }

div.tabOn {
  background-color: #4faf00;
  color: #fff;
  }

div.tabOff a, div.tabOn a {
  color: #fff;
  text-decoration: none;
  }

div.tabOff a:hover, div.tabOn a:hover {
  text-decoration: underline;
  }

/* -------------------------------------------------------------------------- */
/* Title pane */

#app-title-area {
  margin-bottom: 0.3em;
  margin-left: 22%;
  }

/* -------------------------------------------------------------------------- */
/* Nav bar */

.classicHeader {
  /*font-weight: normal;*/
  font-weight: bold;
  margin: 1px 0 1px 10px;
  }

.leftMenuItem {
  list-style-type: none;
  }

.leftMenuItem a {
  color: black;
  margin-left: 3px;
  margin-right: 3px;
  text-decoration: none;
  }

.borderTop {
  border-top: #ccc 1px solid;
  }

.marginTop10 {
  margin: 0 10px 0 20px;
  height: 10px;
  }

.marginBottom20 {
  height: 10px;
  margin: 0 10px 0 20px;
  }

.padLeft10 {
  padding-left: 10px;
  }

.ui-selecting a {
  background: #4faf00;
  color: white;
  cursor: pointer;
  }

.ui-selected a {
  background: #4faf00;
  color: white;
  }

.IdPageCat {
  background-color: #f0f0f0;
  }

/* -------------------------------------------------------------------------- */
/* Footer */

#pgm-footer-links {
  /*height: 2em;*/
  background-color: #666;
  clear: both;
  margin-bottom: 1px;
  text-align: center;
  }

#pgm-footer-links div {
  display: inline-block;
  border-right: #b1b1b1 1px solid;
  color: white;
  cursor: pointer;
  margin: 0;
  padding: 0.35em 2em 0.15em 2em;
  text-align: center;
  vertical-align: middle;
  width: 11.2em;
  /*height: 1.5em;*/
  }

#pgm-footer-links div.first {
  border-left: #b1b1b1 1px solid;
  }

#pgm-footer-links a {
  color: white;
  text-decoration: none;
  }

#pgm-footer-links a:hover {
  text-decoration: underline;
  }

#links li a:hover {
  color: #4faf00;
  }

/* -------------------------------------------------------------------------- */
/* More footers */

#pgm-footer-legal {
  border-top: #666 2px solid;
  padding: 4px 0;
  font-size: 0.9em;
  text-align: center;
  }

#pgm-footer-legal a {
  text-decoration: underline;
  }

/* -------------------------------------------------------------------------- */
/* Misc */

#pgm-no-js-text {
  font-size: 150%;
  margin: 0 auto;
  text-align: center;
  }

/* ========================================================================== */
/* Small media */

body.app-small-media #pgm-left-pane {
  }

body.app-small-media .outerContentPane {
  width: 70%;
  }

body.app-very-small-media #pgm-left-pane {
  width: auto;
  }

body.app-very-small-media .outerContentPane {
  width: 100%;
  }

/* ========================================================================== */
/* IE 6/7 fixes */

#pgm-banner {
  *width: 100%;
  }

#pgm-top-pane {
  *clear: both;
  *width: 100%;
  }

#pgm-left-pane {
  *display: inline;
  }

.outerContentPane {
  *display: inline;
  }

/* IE 7 requires this for body.rtl at least, or the DIV may jump out of place
 (to the left of where it is supposed to be) */
.contentPane {
  *zoom: 1;
  }

/*#!! display: inline cause *banner* not to look right on IE 6! */
.outerContentPane.home {
  }

* html .contentPane {
  display: inline;
  }

* html .outerContentPane.home {
  margin: 0 0 0 1%;
  width: 99%;
  }

* html .contentPane.home {
  }

#pgm-footer-links div {
  *display: inline;
  }

/* ========================================================================== */
/* Right-to-left patchup */

body.rtl #app-title-area {
  margin-left: 0;
  margin-right: 22%;
  }

body.rtl .classicHeader {
  margin-left: 0;
  margin-right: 10px;
  }

body.rtl .padLeft10 {
  padding-left: 0;
  padding-right: 10px;
  }

body.rtl .outerContentPane {
  }

body.rtl .contentPane {
  }

body.rtl .outerContentPane.home {
  }

body.rtl #banner-logo-div {
  float: right;
  }

body.rtl #banner-section-title {
  float: right;
  }

body.rtl .theme {
  float: right;
  }

/* ========================================================================== */