/******** MENU ************/
#bannerTitle{
    text-decoration: none;
    color: black;
    font-size: 25px;
    font-weight: 200;
    color: #292929;
    text-shadow: 1px 1px 1px #ffffff;
}
#bannerTitle span{
    font-size: 20px;
    text-decoration: underline;
}

#header table{
    width : 90%;
}

header{
    background: #ffffff;
    font-family: "Lucida Sans Unicode";
    font-size: 14px;
    line-height: 160%;
    color: #303030;
    margin-bottom : 20px;
}
.container{
    position: relative;
    width: 1000px;
    margin: 0 auto;
    padding: 0;
}

.container table{
    width : 90%; 
    text-align:center; 
    table-layout:fixed;
}

header #logo{
    border-right: #cdcdcd 1px solid;
    margin: 10px 25px 10px 0;
    padding: 0 25px 0 0;
}

header #headerBox{
    padding-top: 30px;
    text-align: left;
}

#menu{
    background: #ffffff;
    font-family: "Lucida Sans Unicode";
    font-size: 14px;
    line-height: 160%;
    color: #303030;
    margin-bottom : 20px;
}
.clear{
    border: 0;
    clear: both;
    height: 0;
    line-height: 0;
    visibility: hidden;
}

#centeredMenu {
  background-color:#1a1a1a;
  width:100%;
  height : 40px;
  float:left;
  width:100%;
  overflow:hidden;
  position:relative;
}
#centeredMenu ul {
   clear:left;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   left:50%;
   text-align:center;
}
#centeredMenu ul li {
   display:block;
   float:left;
   list-style:none;
   margin:0;
   padding:0;
   position:relative;
   right:50%;
   background: none;
}
#centeredMenu ul li a {
   display:block;
   margin:0 0 0 1px;
   padding:3px 10px;
   color:#000;
   text-decoration:none;
   line-height:1.3em;
   color: #ffffff;
    display: block;
    line-height: 40px;
}
#centeredMenu ul li a:hover {
   background:#b94b7c;
   color:#fff;
}
#centeredMenu ul li a.active,
#centeredMenu ul li a.active:hover {
   color:#fff;
   background:#000;
   font-weight:bold;
}
	
.activeMenu{
	background:#b94b7c;
	color:#fff;
}
/******** BANDEAU MESSAGE ********/
#bandeauMessage{
  text-align:center;
  font-size : 25px;
  width ; 80%;
  margin:auto;
  color:#ee5969;
  text-shadow: 1px 0px #915969;
  margin-bottom:10px;
}

/********* MAIN **********/
#main{
  width : 80%;
  margin:auto;
  margin-top : 20px;
  font-family: "Lucida Sans Unicode";
}

.pointRose{
  color : #b94b7c;
  font-size : 40px;
}

h2{
  border-bottom: 2px solid #88bd37;
}

h4{
  font-size:1.2em;
}


.autoMarge{
  margin:auto;
}

.alignCenter{
  text-align: center;
}

.outer-container {
  height: 200px;
  text-align: center;
  display: flex;
  flex-flow: column wrap;
} 
.outer-container div {
  height: 400px;
  width:350px;
  border : solid black 1px;
  overflow:auto;
  margin:10px;
}


/********* FORMULAIRE CONNEXION **********/
#formConnection{
  border : solid black 1px;
  padding : 15px;
  text-align :center;
}
.formLabel{
  margin-bottom : 15px;
}



/*********** GESTION COMPTE *************/
#fieldSetCompte{
  width:60%;
  margin:auto;
}


/*********** BUTTONS ***********/
.myButton {
  color: #1a1a1a;
  font-size: 16px;
  background: #f5f5f5;
  padding: 10px 20px 10px 20px;
  border: outset #87bd37 3px;
  text-decoration: none;
  cursor:pointer;
  margin:10px;
}

.myButton:hover {
  text-decoration: none;
  border: inset #b94b7c 3px;
}

/************ FLEX ROWS ************/

.flex-container {
  padding: 0;
  margin: 0;
  list-style: none;
  
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
}

.shorthand { 
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-direction: row;
  flex-direction: row;
}

.flex-item {
  width: 350px;
  height: 400px;
  margin: auto;
  text-align: center;
  border: solid black 1px;
  margin-bottom: 25px;
  overflow: auto;
}

.flex-container h3{
  border-bottom: 2px solid #b94b7c;
  width : 60%;
  margin:auto;
  margin-bottom : 5px;
}

/************** GESTION ELECTIONS ************/
.titreH3{
  font-weight: normal;
  text-decoration: underline;
  font-size: 25px;
  font-variant: small-caps;
  letter-spacing: 1px;
  text-align:center;
}

/************ FORMAT TABLE *****************/
.tablePresentationElements{
  width : 100%;
  margin:auto;
  table-layout:fixed;
  text-align:center;
  margin-bottom:40px;
}

.tablePresentationElements tr:nth-child(odd) td{
  
}
.tablePresentationElements tr:nth-child(even) td{
  background-color:#ebebeb;
}

.selectFilter{
  margin-bottom:20px;
  background: transparent;
  border: none;
  font-size: 14px;
  height: 35px;
  padding: 5px;
  width: 220px;
}


progress.jaugeEleve::-webkit-progress-value {
  background: green;
}
progress.jaugeEleve::-moz-progress-bar {
  background: green;
}
progress.jaugeEleve.middle::-webkit-progress-value {
  background: orange;
}
progress.jaugeEleve.middle::-moz-progress-bar {
  background: orange;
}
progress.jaugeEleve.low::-webkit-progress-value {
  background: red;
}
progress.jaugeEleve.low::-moz-progress-bar {
  background: red;
}

.croixRouge{
  color:red;
  cursor: pointer;
}


.descriptionASauver{
  color : red;
}
.descriptionSauvee{
  color:green;
}

.textAreaDescription{
  width : 95%;
  margin:auto;
  height:140px;
}

.regularWord{
  text-transform: capitalize;
}


.obligatoire{
  color : red;
}

.affichageClasse{
  padding: 3px 5px 2px 5px;
  border:solid black 1px; 
  border-radius:15px 5px 15px 5px;
   margin : 5px;
   display:inline-block
}

select{
  width: 180px;
  background-color: #ffffff;
  border: 1px solid #cccccc;

}

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
    display: inline-block;
    padding: 4px 6px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 20px;
    color: #555555;
    vertical-align: middle;
}

.pointerLibelle{
  cursor:pointer;
}

.entourerEleve{
  border:solid black 1px;
  color : black;
  border-radius:30px;
  padding-left:20px;
  padding-right : 20px;
  margin-top:2px;
}

.normalEleve{
  border : none;
  color:grey;
}