*{
    box-sizing: border-box; /*inclue les marges internes et bordures dans son calcul et afin que notre paragraphe ne dépasse pas de son élément parent.*/
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
/*//////////////////////////////////////////
////////////INPUT texte, date etc////////////////*/
input[type=submit] {
  cursor: pointer;
}
input
{
    &:focus {
		border: 3px solid #6300a0;
    }
	&:hover {
		cursor: pointer;
	}
	&:not(:focus):invalid {
                background-color: #b20a37 ;
                border: 2px solid #b20a37 ;
                color: #fff;
				cursor: wait;
            }
	&:active {
		cursor: wait;
	}
}
/*///////////////////////////////
//////////Texte défilant/////////////////////*/

.defil{
	width:2000px;
	height: 20px;
	background: #F8F8F8;
	position: relative;
	animation: mymove 8s infinite;
	animation-timing-function: linear;
}
@keyframes mymove {
  from {right:-60px;}
  to {right: 0px;}
}
/*///////////////////////////////
/* Tableau des actions*/

.table-wrapper{
    margin: 10px 70px 70px;
    box-shadow: 0px 35px 50px rgba( 0, 0, 0, 0.2 );
	
}

.fl-table {
    border-radius: 5px;
    font-size: 12px;
    font-weight: normal;
    border: none;
    border-collapse: collapse;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    background-color: white;
	resize: both;
	overflow: auto;	
}

.fl-table td, .fl-table th {
    text-align: center;
    padding: 8px;
	resize: both;
	overflow: auto;	
}

.fl-table td {
    border-right: 1px solid #f8f8f8;
    font-size: 12px;
	&:hover{
        transform: scale(1.2,1.2); /* HORIZONTAL ET VERTICAL*/
		font-size: 16px;
		resize: both;
		text-align: CENTER;
		background-color: #87E990;
    }
}

.fl-table thead th {
    color: #ffffff;
    background: #4FC3A1;
	resize: both;
	overflow: auto;
}


.fl-table thead th:nth-child(odd) {
    color: #ffffff;
    background: #324960;
}

.fl-table tr:nth-child(even) {
    background: #F8F8F8;
	
}

/* Responsive */

@media (max-width: 767px) {
    .fl-table {
        display: block;
        width: 100%;
    }
    .table-wrapper:before{
        content: "Scroll horizontally >";
        display: block;
        text-align: right;
        font-size: 11px;
        color: white;
        padding: 0 0 10px;
		
    }
    .fl-table thead, .fl-table tbody, .fl-table thead th {
        display: block;
    }
    .fl-table thead th:last-child{
        border-bottom: none;
		
    }
    .fl-table thead {
        float: left;
    }
    .fl-table tbody {
        width: auto;
        position: relative;
        overflow-x: auto;
    }
    .fl-table td, .fl-table th {
        padding: 20px .625em .625em .625em;
        height: 60px;
        vertical-align: middle;
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: auto;
        width: 120px;
        font-size: 13px;
        text-overflow: ellipsis;
    }
    .fl-table thead th {
        text-align: left;
        border-bottom: 1px solid #f7f7f9;
    }
    .fl-table tbody tr {
        display: table-cell;
    }
    .fl-table tbody tr:nth-child(odd) {
        background: none;
    }
	/* Propriétés CSS assignées aux enfants ayant une position paire dans les balises HTML ayant comme parent direct ou indirect "identifiant " et si ces derniers sont de type balise TR */
    .fl-table tr:nth-child(even) {
        background: transparent;
	/* Propriétés CSS assignées aux enfants ayant une position impaire dans les balises HTML ayant comme parent direct ou indirect "identifiant " et si ces derniers sont de type balise TR */	
    }
    .fl-table tr td:nth-child(odd) {
        background: #F8F8F8;
        border-right: 1px solid #E6E4E4;
    }
    .fl-table tr td:nth-child(even) {
        border-right: 1px solid #E6E4E4;
    }
    .fl-table tbody td {
        display: block;
        text-align: center;
    }
}

/************************
Header
**********************/
.header2
{
   
	background-color: #DEDEDE;
	/*display: table;
	display: flex;*/
	margin: auto; 

}
header
{
    background-color: #DEDEDE;
}
/*******************************************
********************************************/

/************************
Tableau
**********************/

.NEWtd, .NEWth{
    border: 1px solid black; /* auront une bordure de 1px */
	/*background-color: green;
	padding: 5px 7px;*/
	margin: auto; /*pour centrer*/
	 padding: 5px 5px 5px 5px;
	
}

.NEWtable {
    border-collapse: collapse;/* en faisant ce la on supprime l'espace entre chaque cellule*/
	margin: auto; /*pour centrer le tableau*/
	border: 1px solid black; /* auront une bordure de 1px */
}

/*******************************************
********************************************/

/************************
Barre à entête
**********************/
.barreEntete {
	height:60px;
	padding-top: 1px;
	text-align:left;
	border-top:2px solid #AAA;
	
}
#boutonDeconnexion {
    color: white;
    background-color: grey;
    border-radius: 5px;
    border: solid #ffffff 1px;
    width: 4%;
    font-size:1.8em;
    text-align:center;
    padding: 5px 5px 5px 5px;
    text-transform: uppercase;
	cursor: pointer;
}

#boutonDeconnexion:hover {
    background-color: #ffffff !important;
    color:#c85208 !important;
    border: solid #c85208 1px !important;
	
}
#boutonDeconnexion:active {
    background-color: #FFCC66;
	cursor: wait;
}

/*******************************************
********************************************/


/************************
Bouton menu
**********************/
#boutonMenu {
    color: white;
    background-color: grey;
    border-radius: 5px;
    border: solid #ffffff 1px;
    font-size:1em;
    text-align:center;
    padding: 5px 5px 5px 5px;
	margin:5px 5px 5px 5px;
	text-transform: uppercase;
	cursor: pointer;
    
}

#boutonMenu:hover {
    background-color: #ffffff !important;
    color:#c85208 !important;
    border: solid #c85208 1px !important;
	//padding-right: 25px;
	cursor: pointer;
}
#boutonMenu:active {
    background-color: #FFCC66;
	transform: translateY(4px);
	cursor: wait;
}

#boutonMenu:visited{
		cursor: wait;
}
/*******************************************
********************************************/

/*****************************************
Bandeau bleu par page pour action sur la page
provient de l'ancien site
*******************************************/
 .tablebandaubleu{
	display: table;
	margin: 0 auto;
}
.menu-news:hover{
	border-top: 5px solid #4c8;
	background-color: RGBa(000,112,000,0.90);
}
.menu-ind:hover{
	border-top: 5px solid #4c8;
	background-color: RGBa(64,200,130,0.15);
}
.menu-plan:hover{
	border-top: 5px solid #f1dc4f;
	background-color: RGBa(241,211,79,0.15);
}
.menu-even:hover{
	border-top: 5px solid #0070bb;
	background-color: RGBa(000,112,192,0.15);
}
.menu-con:hover{
	border-top: 5px solid #e44d26;
	background-color: RGBa(228,77,38,0.15);
}
/********************************************
********************************************/


/*******************ACIEN SITE*****************/

P{
		font-weight:normal;
		color:blue;
		font-size: 17px;
		text-align:left;
}
/******************************************
tableau vert de l'ancien site
*****************************************/
.tabVert{
	background-color: RGB(168,197,36);
	color:#FFF;
	text-transform:eppercase;
	border : 1px solid black;
	padding: 10px 15px;
}
.ligne-impaire{
	background-color: #EEE;
}
.ligne-paire{
	background-color: #EEE;
}
.en-tete{
	background-color: RGB(168,197,36);
}

/********************************************
*********************************************/
@font-face { /* définit une nouvelle police */
    font-family: 'MaSuperPolice';
    src: url('Polices/AlexBrush-Regular.ttf'),
		url('Polices/Allura-Regular.otf');
}
@font-face { /* définit une nouvelle police */
    font-family: 'DancingScript';
    src: url('Polices/DancingScript-Regular.otf');
}
Italique {/* Utilisation de la police qu'on vient de définir sur les titres */
    font-family: 'MaSuperPolice', Arial, serif;
}
Dancing{
	font-family: 'DancingScript', Arial, serif;
}