.titre1 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 20px;
  text-shadow: 0px 0px 12px #ccc; /* cre ombre sur titre*/
}
.div_content {
  background-color: blue;
}

.main-footer {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  background-color: #34475e;
  color: white;
  /* font-size:10px;	*/
  width: 100%;
  height: auto;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.main-heard {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  background-color: #34475e;
  color: white;
  width: 100%;
  height: 45px;
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  /* z-index = 1;*/
}

.main-heard1 {
  text-align: center;
  font-family: 'century gothic', 'helvetica neue';
  background-color: #34475e;
  color: white;
  width: 100%;
  height: 55px;
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  /*z-index  =  1;*/
}

.body {
  background-color: blue; /* couleur fond de page */
  /*margin:0px;
	padding:0px;-*/
}

.paragraphe1 {
  position: absolute;
  top: 40%;
  left: 30%;
}

.paragraphe2 {
  position: absolute;
  /*top: 40%;*/
  left: 30%;
  bottom: 5%;
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 25px;
}

/*  css  COL_1 . HTML*/

#casier {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 25px;
}
.boutton1 {
  text-align: center;
  font-family: 'century gothic', 'helvetica neue';
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: 20%;
}

/* .................................CSS COL_1_1  php.................................*/
.label1 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 20px;
  position: absolute;
  left: 10%;
  right: 10%;

  margin: -3px; /* Espasement haut bas  entre 2 objet label et input ou autre */
}
.label2 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 20px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 10%;
  right: 10%;
  /*padding: 15%;  /* Espasement bas entre 2 div */
  margin: -20px; /* Espasement haut bas  entre 2 objet label et input ou autre */
}
#basic {
  text-align: center; /* texte  */
  display: block;
  margin: auto; /* pour centre horizontal sur une page*/
}
.ponte {
  padding-top: 50px; /* Espasement haut entre 2 div */
}
.submit1 {
  display: block;
  margin: auto; /* pour centre horizontal sur une page*/
  padding-top: 50px; /* Espasement haut entre 2 div */
}
.submit2 {
  display: block;
  margin: auto; /* pour centre horizontal sur une page*/
}

#div_cadre {
  /* border: thick black solid; 
 /* height: 10px; */
  /* overflow: auto; 
  border: 2px solid red; */

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  /* 	position: relative; /* pour centre horizontal sur une page*/
  left: 8%;
  width: 70%;
}

/*........................ CSS COL_1_2  php   ................................  */

#div_cadre1 {
  background-color: black;
  color: white;
  height: 60px;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  top: 45%;
}
#div_cadre2 {
  background-color: black;
  color: white;
  height: 60px;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  top: 75%;
}
.paragraphe {
  text-align: center;
  background-color: white;
  color: blue;
  height: 60px;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 10px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  top: 30%;
}

/*........................ CSS ACC-1  et  ACC_1_1 ................................  */
#div_cadre3 {
  background-color: black;
  color: white;

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  top: 65%;
}
#div_cadre4 {
  background-color: black;
  color: white;

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  bottom: 15%;
}
#div_cadre5 {
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  margin-top: 5px;
  margin-left: 5px;
}

.label3 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  font-size: 20px;
}
.label4 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  font-size: 20px;
  margin-left: auto;
  margin-right: auto;
  width: auto; /* largeur obligatoire pour �tre centr� */
}
.label5 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  font-size: 10px;
}

#number-2 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: red;
  font-size: 20px;
}
#div_cadre6 {
  background-color: red;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  /* 	position: relative; /* pour centre horizontal sur une page*/
  left: 8%;
  width: 70%;
}
/*     +++++++++++++++++++++++++++++++++++++++++++++++++++  GESTION    ++++++++++++++++++++++++++++++++++++++++++++++++++++++  */
.th {
  border-bottom: 2px solid #d6d6d6;
}

.tr:nth-child(even) {
  background: #e9e9e9;
}
.td {
  border-bottom: 1px solid #d6d6d6;
}
.affi_jour {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: black;
  font-size: 20px;
  margin-left: auto;
  margin-right: auto;
  width: auto; /* largeur obligatoire pour �tre centr� */
}

.menu {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  font-size: 20px;
  background-color: #2f4f4f;
  border-width: 3px;
  border-style: groove;
  border-color: black;
  border-radius: 15px;
  margin-top: 10px;
  margin-bottom: 10px;
  width: 250px;
  line-height: 40px;
}
.texte {
  color: #ffffff;
  text-decoration: none;
}
#div {
  background-color: #a9a9a9;
}

/* ******************************************************  	gestion accouplement acc3  ************************************/
#div_cadre7 {
  background-color: #ffff00;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  margin-top: 5px;
  margin-left: 5px;
}
.label6 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #0000ff;
  font-size: 25px;
}
.label7 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #0000ff;
  font-size: 15px;
  margin-left: 15px;
}
.div_content1 {
  background-color: #00ffff;
}

/*........................ CSS COURSE   ................................  */

.casier1 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 15px;
}

#div_cadre8 {
  /* border: thick black solid; 
		/* height: 10px; */
  /* overflow: auto;
  /* border: 2px solid red; */

  background-color: blueviolet;
  border-width: 4px;
  border-style: groove;
  border-color: rgb(205, 240, 6);
  border-radius: 15px;
  /* position: relative; /* pour centre horizontal sur une page*/
  /* position avze element parent exe form avec div generale page*/
  margin-top: 15%;
  margin-left: 5%;
  margin-right: 5%;
  min-width: 79%;
  min-height: auto;
}

#div_cadre9 {
  font-size: 10px;
  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  margin-top: 5px;
  margin-left: 5px;
  font-family: 'century gothic', 'helvetica neue';
  color: #050000fd;
}
#div_cadre10 {
  background-color: black;
  color: white;

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: absolute; /* pour centre horizontal sur une page*/
  left: 5px;
  right: 5px;
  /* top: 100%; */
}
#div_cadre11 {
  /* border: thick black solid; 
		/* height: 10px; */
  /* overflow: auto; 
	/* border: 2px solid red; */
  margin-top: 1%;
  background-color: rgb(19, 230, 47);
  border-width: 4px;
  border-style: groove;
  border-color: rgb(240, 6, 209);
  border-radius: 15px;
  /* 	position: relative; /* pour centre horizontal sur une page*/
  left: 8%;
  width: 70%;
  /* min-width: 70%;*/
}

#div_cadre12 {
  /* border: thick black solid; 
		/* height: 10px; */
  /* overflow: auto; 
	/* border: 2px solid red; */
  margin-top: 10%; /* espace avec element bas*/
  background-color: rgb(19, 230, 47);
  border-width: 4px;
  border-style: groove;
  border-color: rgb(240, 6, 209);
  border-radius: 15px;
  /* 	position: relative; /* pour centre horizontal sur une page*/
  left: 9%;
  min-height: 50%;
}

.casier2 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  position: absolute; /* pour centre horizontal sur une page*/

  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 15px;
  top: 80%;
}
.casier3 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #f60f0f;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 20px;
}
.ecriture_1 {
  text-align: center;
  /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #0a0000;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 18px;
  background-color: rgba(202, 96, 185, 0.993);
}
.ecriture_2 {
  text-align: center; /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 17px;
}
.input_1 {
  font-family: 'century gothic', 'helvetica neue';
  font-size: 20px;
  font-weight: bold;

  /* position: relative; /* pour centre horizontal sur une page*/
  left: 50px;
  width: 100px;
}

#div_1,
#div_2 {
  /* border: thick black solid; 
 /* height: 10px; */
  /* overflow: auto; 
  border: 2px solid red; */

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: relative; /* pour centre horizontal sur une page*/
  left: 20%;
  width: 60%;
}
#div_3,
#div_4,
#div_5,
#div_6 {
  /* border: thick black solid; 
 /* height: 10px; */
  /* overflow: auto; 
  border: 2px solid red; */

  border-width: 3px;
  border-style: groove;
  border-color: red;
  border-radius: 15px;
  position: relative; /* pour centre horizontal sur une page*/
  left: 5%;
  width: 90%;
}

#scrolle {
  min-height: 100%;
  min-width: 100%;
}
#button_2 {
  background-color: rgb(10, 10, 243);
  border-width: 4px;
  border-style: groove;
  border-color: rgb(248, 248, 244);
  border-radius: 15px;
  /* position: relative; /* pour centre horizontal sur une page*/
  /* position avze element parent exe form avec div generale page*/
  /* margin-top: 5%;*/
  margin-left: 5%;
  margin-right: 5%;
  /* min-width: 79%;
  min-height: auto;*/
}
.message_1 {
  text-align: center;
  /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #ffffff;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 16px;
}
#filterBasic-input {
  text-align: center;
  /* titre de page */
  font-family: 'century gothic', 'helvetica neue';
  color: #0a0000;
  /*font-size: 4.0em;  /*hauteur du titre*/
  font-size: 20px;
  font-weight: bold;
}