body {
  margin: 0;
  padding: 0;
  font-size: 10pt;
  font-family: "Trebuchet MS", sans-serif;
}

/*********************
 * Entête principale *
 ********************/

#topPage {
  border-style: none;
  margin: 0;
  padding: 0 3px 0 10px;
  border-spacing: 0;
  background-color: #336699;
  color: #FFFFFF;
  font-size: 32pt;
  font-weight: bold;
  height: 60px;
}

#topPageRight {
  font-size: 10pt;
  float: right;
  text-align: right;
  vertical-align: top;
  margin: 0;
  padding: 0;
  border-style: none;
  border-width: 0;
  z-index: 99;
}

#topPageRight a {
  color: #FFFFFF;
  font-weight: bold;
  text-decoration: none;
}

#topPageRight a:hover {
  color: #FFFFFF;
  font-weight: bold;
  text-decoration: underline;
}

#topPageRight img {
  border-style: none;
  margin: 0;
  padding: 0;
  margin-right: 2pt;
  vertical-align: middle;
}

#systemName {
  float: left;
  padding-top: 5px;
}

#pageName {
  padding-left: 10pt;
  font-size: 14pt;
  display: inline;
}

.topClientName {
  font-size: 28px;
}

.topProfileBig {
  font-size: 22px;
}

#ajaxLoading {
  position: absolute;
  text-align: center;
  width: 100%;
  padding-top: 10px;
  top: 10px;
  left: 0;
  z-index: 1;
}

.imgCalendrier {
  cursor: pointer;
  border-style: none;
  border-width: 0;
  border-color: #000000;
  border-spacing: 0;
  border-width: 0;
  padding: 0 3pt 0 0;
  vertical-align: bottom;
}

.tableInvisible {
  padding: 0;
  margin: 0;
  border-width: 0;
  border-style: none;
  border-spacing: 0;
  background: none;
}

.tableInvisible td {
  vertical-align: top;
}

.imgLink {
  cursor: pointer;
  border-style: none;
}

/******************
 * MENU PRINCIPAL *
 *****************/

.menuBar {
  background-color: #003366;
  color: #FFFFFF;
  vertical-align: middle;
  text-align: center;
  padding: 3px 0 0;
  font-family: Lucida Sans Unicode,Bitstream Vera Sans,Helvetica,Luxi Sans,Arial,Courier;
  font-size: 11pt;
  font-weight: bold;
  height: 28px;
}

.menuBar img {
  padding-right: 5px;
  vertical-align: middle;
}

.menuBar ul {
  background-color: #003366;
  list-style: none;
  padding: 0;
  margin: 0;
  float: left;
  width: 100%;
  text-align: left;
  border-bottom: 1px solid #003366;
}

.menuBar li {
  cursor: pointer;
  float: left;
  margin: 0 5px 0 0;
  text-decoration: none;
  display: block;
  min-width: 80pt;
  padding: 0 30pt 0 10pt;
  font-weight: bold;
  border: none;
  color: #FFFFFF;
}

.menuBar li:hover {
  color: #FFFFFF;
  background-color: #CC9966;
}

.menuBar .selected li {
  color: #FFFFFF;
  background-color: #336699;
  border-color: #336699;
  border-bottom: 5px solid #003366;
}

.mainMenuContainer {
  background-color: #336699;
}

.mainMenuContainer .line {
  background-color: #336699;
  font-weight: bold;
  color: #FFFFFF;
  width: 100%;
  padding-left: -5pt;
}

.mainMenuContainer td.voice {
  border-top: 1px solid #000033;
  font-family: Lucida Sans Unicode,Bitstream Vera Sans,Helvetica,Luxi Sans,Arial,Courier;
  font-size: 9pt;
  padding: 2pt;
}

.mainMenuContainer a {
  text-decoration: none;
  color: #FFFFFF;
}

.mainMenuContainer td.img {
  border-top: 1pt solid #000033;
  font-family: Lucida Sans Unicode,Bitstream Vera Sans,Helvetica,Luxi Sans,Arial,Courier;
  text-align: center;
  font-size: 9pt;
  color: #C3C3C3;
  background-color: #003366;
  width: 24pt;
  height: 30px;
  padding: 2px;
}

.mainMenuContainer td.img img {
  width: 18px;
}

.mainMenuContainer .separator {
  background-color: #000033;
  height: 1px;
}

.mainMenuContainer .selected td {
  color: #FFFFFF;
  background-color: #CC9966;
}

.mainMenuContainer .selected td a {
  color: #FFFFFF;
}

.mainMenuContainer .disabled td,
.mainMenuContainer .disabled td a {
  color: #CCCCCC;
}

.menuShadow {
  padding: 2px 2px 0;
  left: -2px;
  top: 1px;
}

/***************************
 * Table d'enregistrements *
 **************************/

.recordsTable {}

.recordsTable table {
  padding: 0;
  margin: 0;
  border-style: none;
  border-width: 0;
  border-spacing: 0;
}

.recordsTable th {
  border-style: none;
  background-color: #2779aa;
  color: #F2F5F7;
  font-weight: bold;
  font-size: 12pt;
}

.recordsTable tr.searchBox {
  background: none;
  text-align: right;
}

.recordsTable tr.searchBox:hover {
  background: none;
  text-align: right;
}

.recordsTable tr.footer {
  border-style: none;
  background-color: #2779aa;
  color: #F2F5F7;
  text-align: left;
  font-weight: bold;
  font-size: 8pt;
}

.recordsTable tr.footer:hover {
  background-color: #2779aa;
}

.recordsTable tr {
  padding: 0;
  margin: 0;
  border-style: none;
  background-color: #F2F5F7;
  color: #362b36;
  font-size: 10pt;
}

.recordsTable tr.alt {
  border-style: none;
  background-color: #FFFFFF;
  color: #362b36;
  font-size: 10pt;
}

.recordsTable tr:hover {
  background-color: #DEEDF7;
}

.recordsTable select {
  border-style: solid;
  border-color: #000000;
  border-width: 1px;
  background-color: #FFFFFF;
  font-size: 8pt;
}

.recordsTable img {
  cursor: pointer;
  vertical-align: middle;
  border-style: none;
  padding: 0 2pt;
}

.recordsTable td.noResult {
  font-style: italic;
  text-align: center;
}

.recordsTable tr.selected {
  background-color: #A8BECC;
}

/*******************
*** SEARCH FIELD ***
*******************/

#quickSearchContainer {
  position: relative;
  width: 300px;
  text-align: left;
  background: none;
  vertical-align: middle;
}

.quickSearchBar {
  width: 300px;
  height: 24px;
  text-align: left;
  padding: 0;
  margin: 0;
  padding-top: 1px;
  padding-left: 8px;
  vertical-align: middle;
}

.quickSearchBar input {
  font-size: 12px;
  font-style: normal;
  font-family: "Trebuchet MS", sans-serif;
  color: #000000;
  border-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  background-color: #F2F5F7;
  width: 250px;
  height: 20px;
  margin: 0 2px;
}

.quickSearchBar img {
  cursor: pointer;
  padding: 0;
  margin: 0;
  vertical-align: middle;
  border-style: none;
  border-width: 0;
  vertical-align: middle;
}

.quickSearchDropDown {
  position: absolute;
  border-style: solid;
  border-width: 1pt;
  border-color: #C0D8E8;
  background-color: #F2F5F7;
  width: 250px;
  margin: 0;
  padding: 0;
  margin-top: 2px;
  margin-left: 30px;
  display: none;
}

.quickSearchDropDownOptions {
  font-size: 12px;
  color: #000000;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 2px 0;
  border-style: none;
  border-width: 0;
  text-align: left;
}

.quickSearchDropDownOptions:hover,
.quickSearchDropDownOptionsCurrent {
  font-size: 12px;
  color: #000000;
  position: relative;
  background-color: #DEEDF7;
  width: 100%;
  margin: 0;
  padding: 2px 0;
  border-style: none;
  border-width: 0;
  text-align: left;
  cursor: pointer;
}

/**************
 * Formulaire *
 *************/

.formFieldset {
  margin-top: 10pt;
  border-style: dashed;
  border-width: 1px;
  border-color: #AED0EA;
  background-color: #EAEEF2;
}

.formFieldset a {
  color: #000000;
  font-weight: bold;
  text-decoration: none;
}

.formFieldset img {
  border-style: none;
  margin-right: 2pt;
  vertical-align: top;
}

.formFieldset legend {
  font-size: 95%;
}

.formFieldset input {
  font-size: 11pt;
  font-style: normal;
  font-family: "Trebuchet MS", sans-serif;
  color: #362b36;
  border-style: solid;
  border-width: 1pt;
}

.formFieldset textarea {
  font-size: 11pt;
  font-style: normal;
  font-family: "Trebuchet MS", sans-serif;
  color: #362b36;
  border-style: solid;
  border-width: 1pt;
}

.formFieldset select {
  font-size: 11pt;
  font-style: normal;
  font-family: "Trebuchet MS", sans-serif;
  color: #362b36;
  border-style: solid;
  border-width: 1px;
}

.formButton {
  background-color: #CBE0FF;
  border-color: #89A1C6;
  border-style: dashed;
  border-width: 1px;
  color: #000000;
  font-weight: bold;
  padding: 4pt 8pt;
}

.formButtonPane input {
  cursor: pointer;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-style: italic;
  font-weight: bold;
  font-size: 1em;
  margin: .5em .2em .4em;
  padding: .2em .6em .3em;
  line-height: 1.4em;
  width: auto;
  border: 1px solid #aed0ea;
  background: #deedf7 url("cupertino/images/ui-bg_highlight-soft_100_deedf7_1x100.png") 50% 50% repeat-x;
  color: #2779aa;
}

.formButtonPane input:hover {
  cursor: pointer;
  border: 1px solid #74b2e2;
  background: #e4f1fb url("cupertino/images/ui-bg_glass_100_e4f1fb_1x400.png") 50% 50% repeat-x;
}

.formButtonSpecial input {
  cursor: pointer;
  font-size: 9pt;
  border: 1px solid #aed0ea;
  background: #deedf7 url("cupertino/images/ui-bg_highlight-soft_100_deedf7_1x100.png") 50% 50% repeat-x;
  color: #2779aa;
  padding: 4pt 8pt;
}

.formButtonSpecial input:hover {
  cursor: pointer;
  border: 1px solid #74b2e2;
  background: #e4f1fb url("cupertino/images/ui-bg_glass_100_e4f1fb_1x400.png") 50% 50% repeat-x;
}

.formCheckLabel,
.formRadioLabel {
  font-size: 11pt;
  font-family: "Trebuchet MS", sans-serif;
  padding-right: 11pt;
}

.formRadioLabel input {
  font-style: normal;
  border-style: solid;
  border-width: 0;
}

.inputDefault {
  border-color: #C0D8E8;
  background-color: #F2F5F7;
}

.inputError {
  background-color: #CC6666;
  border-color: #AF6161;
}

.inputHelpIcon {
  cursor: pointer;
  border: none;
  margin-left: 5pt;
  vertical-align: top;
}

.inputHelpDialog {
  position: absolute;
  top: 0;
  left: 0;
  border-style: dashed;
  border-width: 1px;
  border-color: #F9DD34;
  margin-left: 5pt;
  background: #FFEF8F url('img/dialog_question.gif') 10pt 10pt no-repeat;
  padding: 4pt 4pt 4pt 75px;
  min-height: 50px;
  width: 300pt;
  display: none;
}

.inputHelpDialog a {
  text-decoration: none;
  font-weight: bold;
  color: #2779AA;
}

.inputHelpDialog a:hover {
  text-decoration: underline;
  color: #B3C7DB;
}

.formTitle {
  font-size: 20pt;
  font-weight: bold;
  text-align: right;
}

/*****************
 * LISTE TRIABLE *
 ****************/

.sortable {
  list-style-type: none;
  margin: 0;
  padding: 0;
  float: left;
  margin-right: 10px;
}

.sortable li {
  margin: 3pt 3pt 3pt 0;
  padding: 1pt;
  width: 200pt;
  height: 30pt;
  font-size: 10pt;
  font-weight: normal;
  text-align: left;
}

.emptyPlaceHolder {
  border-style: dashed;
  border-color: #AED0EA;
  border-width: 1px;
  background-color: #F2F5F7;
}

.sortablePosition {
  list-style-type: none;
  margin: 0;
  padding: 0;
  float: left;
  margin-right: 10px;
}

.sortablePosition li {
  margin: 3pt 3pt 3pt 0;
  padding: 1pt;
  height: 30pt;
  font-size: 20pt;
  font-weight: bold;
  text-align: center;
}

/*****************
 * INFO BOX *
 ****************/

.boxInfo {
  border-style: solid;
  border-width: 1px;
  border-color: #AED0EA;
  background-color: #F2F5F7;
  color: #3c9ce6;
  padding: 1rem;
  margin: auto;
  width: 80%;

  text-align: center;
}

.boxWarning {
  border-style: solid;
  border-width: 1px;
  border-color: #FFCC00;
  background-color: #FFFFCC;
  color: #FF6600;
  padding: 1rem;
  margin: auto;
  width: 80%;

  text-align: center;
}