body {
    background-color: #87CEFA;
    overflow: auto;
  background-image: url("ocemanfroid-04.jpg");
  background-repeat: repeat;
}

.grille_ecran {
	display: grid;
   grid: auto auto auto / auto auto auto;
      column-gap: 5px;
  row-gap: 5px;
  }

.grille_titre {
	padding: 5px;
    color: #000000;
    text-align: center;
    background-image: linear-gradient(#4169E1, #87CEFA);
    border-radius: 5px;
  grid-column: 2 / span 1;
  grid-row: 1 / span 1;
}
.grille_menu {
	padding: 5px;
 	text-align: center;
    border-radius: 5px;
  grid-column: 2 / span 1;
  grid-row: 2 / span 1;
  border: 1px solid #87CEFA;
}
.grille_principale {
  grid-column: 2 / span 1;
  grid-row: 3 / span 1;
}
a, button, input[type="submit"], input[type="button"] {
    height: auto;
    margin: 2px;
    text-align: left;
    padding: 2px;
    text-decoration: none;
    background-color: #204a87;
    border: 1px solid #c0c0c0;
    color: #eeeeec;
}

a:hover, button:hover, input[type="submit"]:hover, input[type="button"]:hover {
    color: #DB0073;
    cursor: pointer;
    background-color: #c0ad79;
}

th {
    border-radius: 5px;
    border: 1px solid #C1BFB1;
    color: #000000;
    border: 1px solid #C1BFB1;
    background-color: #b0e0e6;
    color: #000000;
}

input[type="text"] {
    color: #000000;
    padding: 0 1px 0 1px;
    margin: 0 1px 0 1px;
}

input[type="text"]:hover {
    color: #000000;
    cursor: pointer;
    background-color: #FDF1B8;
}

textarea {
    color: #000000;
    padding: 0 1px 0 1px;
    margin: 0 1px 0 1px;
}

textarea:hover {
    color: #000000;
    cursor: pointer;
    background-color: #FDF1B8;
}

.contexte_menu {
    background-color: #dddddd;
    border-radius: 5px;
    margin: 5px;
    padding: 5px;
}

.contexte_menu a {
    padding: 1px;
    margin: 1px;
    text-align: center;
    text-decoration: none;
    border-radius: 5px 0 5px 0;
}

.content_connexion {
    background: #cccccc;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 0 400px 0px;
    bottom: 10px;
    background-repeat: no-repeat;
    background-size: cover;
}

.connexion {
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 50%;
    padding: 10px;
    background-image: linear-gradient(#4169E1, #87CEFA);
    text-align: center;
    z-index: 100;
}

.logo_accueil {
    width: 40%;
    margin: 10px;
}

.logo {
    width: 90%;
    margin: 10px;
}

.image_petite {
	width: 150px;
}
.image_moyenne {
	width: 300px;
}
.image_grande {
	width: 600px;
}
.image_variable {
	max-width: 100%;
}

.transfert {
    margin: 0 auto;
    background-image: linear-gradient(#26C4EC, #54F98D);
    text-align: center;
    padding: 5px;
}

.encours {
    margin: 5px 0 5px 20px;
    width: 90%;
    min-height: 100px;
    padding: 2px;
    background-image: linear-gradient(#FEFEE2, #CECECE);
}

.titre {
	margin: 10px auto 10px auto;
	padding: 10px;
    color: #000000;
    text-align: center;
    width: 40%;
    background-image: linear-gradient(#4169E1, #87CEFA);
    border-radius: 5px;
}
.recherche {
    right: 150px;
    position: fixed;
}
.content_erreur {
    margin: 2px;
    border-radius: 5px;
    padding: 10px;
    background-color: #eeeeee; 
    color: #000000;
    border: 2px solid red;
}

.content_data {
    border-radius: 5px;
    padding: 3px;
    background-color: #dddddd; 
  	border: 1px solid #792424;
    text-align: center;
}
.table_data {
    margin: 2px;
    padding: 2px;
    background: #cccccc;
      margin-left: auto;
  margin-right: auto;
}

.content_data a, .encours a, .table_data a, .table_planning a, .table_planning a {
    display: inline-block;
    min-width: 80px;
    padding: 1px 3px 1px 3px;
    text-align: center;
    text-decoration: none;
}

.piece_jointe a {
    display: inline-block;
    min-width: 80px;
    padding: 1px 3px 1px 3px;
    text-align: center;
    text-decoration: none;
}

.table_planning {
    margin: 2px 0 0 0;
    padding: 3px 0 3px 0;
    background: #C1BFB1;
}

/*------------------------------------------------------------------*/
.table_data th {
    font-style: italic;
    font-weight: normal;
    border-radius: 3px;
}

.table_recherche th {
    font-weight: normal;
    border-radius: 3px;
}

.table_data td {
    background-color: #eeeeee;
}

.table_planning td {
    background-color: #eeeeee;
}

.table_data  .cell_lien, .table_planning  .cell_lien, .table_data .cell_bouton {
    background-color: #eeeeee;
    white-space: nowrap;
}

.table_data  .cell_texte, .table_planning .cell_texte {
    text-align: left;
    height: auto;
}

.table_data  .cell_numeric, .table_planning  .cell_numeric {
    text-align: right;
    padding: 2px;
    min-width: 50px;
}

.table_data  .cell_blanc, .table_planning  .cell_blanc {
    background-color: transparent;
}

.table_data  .cell_center, .table_planning  .cell_center {
    text-align: center;
}

.table_data  .cell_positif {
    text-align: right;
    background-color: #58FA82;
    color: #000000;
    padding: 2px 5px 2px 5px;
    font-weight: normal;
}

.table_data .cell_negatif {
    text-align: right;
    background-color: #FA5882;
    color: #000000;
    padding: 2px 5px 2px 5px;
    font-weight: normal;
}

.table_data .cell_alerte {
    text-align: right;
    background-color: #ED7F10;
    color: #000000;
    padding: 2px 5px 2px 5px;
    font-weight: normal;
}

.table_data  .cell_important {
    text-align: center;
    background-color: #80D0D0;
    padding: 2px 2px 2px 2px;
    font-weight: normal;
}

.table_data  .cell_libre {
    text-align: center;
    background-color: #999999;
    padding: 2px 2px 2px 2px;
}

.table_data  .cell_reserve {
    text-align: center;
    background-color: #ED7F10;
    padding: 2px 2px 2px 2px;
}

/*------------------------------------------------------------------*/
.label_important {
    background-color: #204a87;
    color: #eeeeec;
    margin: 2px;
    padding: 1px;
    display: inline-block;
    width: 150px;
    text-align: center;
}

.label_text {
    background-color: #b0e0e6;
    color: #000000;
    margin: 2px;
    padding: 1px;
    display: inline-block;
    width: 150px;
    text-align: center;
}

.label_textarea {
    vertical-align: top;
    background-color: #b0e0e6;
    color: #000000;
    margin: 2px;
    padding: 1px;
    display: inline-block;
    width: 150px;
    text-align: center;
}

.label_lien {
    background-color: #b0e0e6;
    width: 250px;
}

.field_text {
    padding: 1px;
    background-color: #ffffff;
    margin: 0 10px 0 0;
}

.field_important {
    font-weight: normal;
    background-color: #80D0D0;
    padding: 0 5px 0 5px;
}
.field_center {
    padding: 1px;
    margin: 5px;
    padding: 0 0 0 30px;
    text-align: center;
}