<H4>Erreur requête / base de données...</H4>
@font-face {
	font-family: "PWSf";
	src: url('../include/PWScratchedfont.ttf');
}

body {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 16px;
}
/* textarea{
	 line-height: 2;
} */
#companyLogoHeader{
	/*background : url(../images/companyLogo.png) no-repeat top left;*/
	width: 185px;
	height: 104px;
	margin-left: 10px;
	border-width: 0px;
	float:left;
	display:block;
	overflow:visible;
	position:relative;
	z-index:4;
}

#setupLogoHeader{
	background : url(../images/setupCalendar.png) no-repeat top left;
	width: 190px;
	height: 75px;
	margin-left: 10px;
	border-width: 0px;
	float:left;
	display:block;
}

#photo_connecte {
	/*background : url(../images/top_right.jpg) no-repeat top right;*/
	/* width: 240px; */
	/*height: 62px;*/
	float:right;
	display:inline-block;
	text-align: center;
	margin-right:10px;
	margin-top:0px;
}

#rightHeaderImage {
	/*background : url(../images/top_right.jpg) no-repeat top right;*/
	width: 320px;
	/*height: 62px;*/
	float:right;
	display:block;
	text-align: right;
	margin-right:20px;
	margin-top:-18px;
}

#version{
	position:relative;
	z-index:4;
	left:-4px;
	top:54px;
	font-weight:200;
	font-size:10pt;
	font-family:PWSf;
}

#loginTitle {
	font-size: 20px;
	font-weight: bold;
	/*float:center;*/
	display:block;
}

/*
.sousMenu {
    position:relative;
    z-index:8;
}
*/

#top-menu-login{
  clear: both;
	height: 26px;
	min-width: 75em;
	position: relative;
  top:0px;
	background: #41444a;
	padding-left: 2px;
	border: 0px;
  z-index:2;
}

#contenu-page{
  position:relative;
  top:-20px;
}

/*
#contenu-accueil{
  position:fixed;
  top:180px;
	left: 0px;
	width:100%;
	z-index:1;
} */

sup {
	font-size: 11px;
}

.backlogo {
	background : url(../images/geoa-logo.png) no-repeat top left;
	background-size: cover;
	width:520px;
	height:520px;
	vertical-align: top; 
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	width: 99%;
}

.formLogin{
	margin-top:10px;
	margin-right:-42px;
	/* float:right; */
}
.formLogin th {
	color:#eee;
}

div.formButtonsLogin {
	text-align: center;
	width:auto;
	height:auto;
	margin-left:10px;
	margin-right:10px;
	margin-top:5px;
	display:block;
	padding-top: 4px;
	padding-bottom: 4px;
	float:none;
	/* border-top: 1px solid #bcb6b8; */
}

input.formButtonLogin {
	background:#C2F2C2 none repeat scroll 0 0;
	border-color:#AFFFAF #88DD88 #88DD88 #CFFFCF !important;
	border-radius: 4px;
	border-style:solid !important;
	border-width:1px !important;
	color:#444 !important;
	font-size: 12px;
	font-weight:bold !important;
	margin:0px 0px 0px 28px;
	min-width:100px;
	min-height:40px;
	width: auto;
	cursor: default;
}
input.formButtonLogin:hover{
	border-color:#CFFFCF #88DD88 #88DD88 #CFFFCF !important;
	background:#CCFFCC none repeat scroll 0 0;
}
input.formButtonLogin:active{
	border-color: #88DD88 #CFFFCF #CFFFCF #88DD88 !important;
	background:#DDFFDD none repeat scroll 0 0;
}


/* Start round border styles */
/* .outerbox .top .left{
	float:left;
	width:8px;
	height:2px;
	background:  url(../images/topleft.gif) no-repeat top left;
}

.outerbox .top .right{
	float:right;
	width:8px;
	height:2px;
	background:  url(../images/topright.gif) no-repeat top right;
}

.outerbox .top .middle{
	margin:0px 8px;
	background:;
	height:2px;
}
.outerbox .bottom .left{
	float:left;
	width:8px;
	height:2px;
    /*position:relative;
    top:-18px;*/
	/* background:  url(../images/bottomleft.gif) no-repeat bottom left; */
/* } */

/* .outerbox .bottom .right{ */
	/* float:right; */
	/* width:8px; */
	/* height:2px; */
	/* background:  url(../images/bottomright.gif) no-repeat bottom right; */
    /* /*position:relative; */
    /* top:-18px;*/ 
/* } */

/* .outerbox .bottom .middle{ */
	/* margin:0px 8px; */
	/* background:; */
	/* height:2px; */
    /* /*position:relative; */
    /* top:-18px;*/ 
/* } */ 

.outerbox .maincontent {
	/* background-color: white; */
	/* border:1px solid ; */
	/* border-width:1px 1px; */
	/* border-radius:2px; */
	/* Height given to give hasLayout to avoid peekaboo bug in IE */
	height: auto;
	/* height: 100%; */
}

.outerbox .top div, .outerbox .bottom div{
	font-size:0;
}
.outerbox {
	vertical-align: top; 
	margin-top: 10px;
	margin-left: 8px;
	margin-right: 8px;
	width: 99%;
	border:1pt dotted ;
	/* border-width:1px 1px; */
	border-radius:2px;
}

.maincontentLogin {
	/* background-color: white; */
	/* border:0px solid #bcb6b8; */
	/* border-width:0px 2px; */
}
.maincontentAccueil {
	/* background-color: white; */
	/* border:0px solid #bcb6b8; */
	/* border-width:0px 2px; */
	padding-left:4px;
}

/***********************
* voletN1 gauche escamotable
***********************/
#voletN1 {
	width: 614px;
	padding: 1px;
	background: rgba(255,255,255,0.2); color: #444;	
	position: absolute;
	left: -620px; top: 40px;
	-webkit-transition: all .4s ease-in;
	transition: all .4s ease-in;
}
#voletN1 a.fermer {
	display: none;
}
#voletN1 a.ouvrir,
#voletN1 a.fermer {
	padding: 8px 20px;
	background: #555;
	color: #fff;
	text-decoration: none;
	position: absolute;
	right: -90px;
	top: 100px;

	/* quelques styles CSS3 */
	-ms-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	transform: rotate(270deg);
	border-radius: 0 0 8px 8px;
}
#voletN1_clos:target #voletN1 {
	left: -620px;
}
#voletN1:target {
	left: -0px;
}
#voletN1:target a.ouvrir {
	display: none;
}
#voletN1:target a.fermer {
	display: block;
}
/***********************
* fin voletN1 gauche escamotable
***********************/
/***********************
* voletN1 n°2 gauche bas escamotable
***********************/
#voletN2 {
	width: 610px;height:240px;
	padding: 1px;
	background: rgba(255,255,255,0.2); color: #444;	
	position: absolute;
	left: -618px; top: 240px;
	-webkit-transition: all .4s ease-in;
	transition: all .4s ease-in;
}
#voletN2 a.fermer {
	display: none;
}
#voletN2 a.ouvrir,
#voletN2 a.fermer {
	padding: 8px 20px;
	background: #555;
	color: #fff;
	text-decoration: none;
	position: absolute;
	right: -64px;
	top: 100px;

	/* quelques styles CSS3 */
	-ms-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	transform: rotate(270deg);
	border-radius: 0px 0px 8px 8px;
}
#voletN2_clos:target #voletN2 {
	left: -618px;
}
#voletN2:target {
	left: -0px;
}
#voletN2:target a.ouvrir {
	display: none;
}
#voletN2:target a.fermer {
	display: block;
}
/***********************
* fin volet n°2 escamotable
***********************/

#aideCRresultat{
	margin-left: 5px;
}
/* .accueil .maincontent #text{ */
	/* margin-left: 4px; */
/* } */

.maincontent{
	margin-left: 4px;
}

.accueil{
	margin-right: 15px;
	display: inline-block;
}

form {
    margin:0px;
    padding:0px;
}

h1 {
	margin:auto;
	color:;
}

h2 {
	margin:auto;
	color:;
	font-size:20px;
	font-weight:600;
}
h2.login {
	margin:auto;
	color:#a86;
}
#lequipe h2, #consignes h2{
	/* margin:auto; */
	/* margin-top:-10px; */
	background: url('../images/icones/fleche-bas.png') 50% 25% no-repeat;
	/* background: linear-gradient(to bottom, #642, transparent 80%, transparent), url('../images/icones/fleche-bas.png') 50% 20% no-repeat; */
	/* -webkit-background-clip: text; */
	/* -webkit-text-fill-color: transparent; */
	/* background:linear-gradient(tobottom,#642,transparent); */
	
	cursor: pointer;
}

th {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	/** normal 	Defines normal characters. This is default 	
		bold 	Defines thick characters 	
		bolder 	Defines thicker characters 	
		lighter 	Defines lighter characters
		100
		200
		300
		400
		500
		600
		700
		800
		900 	Defines from thin to thick characters. 400 is the same as normal, and 700 is the same as bold
		**/
}


.bordFin {
	border: 1px solid black;
}

a.lienTableau {
    text-decoration:none;
    color:#77C;
}

a.lienTableau:hover{
    text-decoration:underline;
    color:#228;
}

div.pageTitle {
	padding: 2px 2px 4px 8px;
  margin:-1px -1px -1px -5px;
	width:auto;
  line-height: 32px;
	height: 32px;
	border:4px;
	background-color: ;
	color: ;
	text-align:left;
	/* display:block; */
	border-radius:2px 2px 0px 0px;
}
div.pageTitleAccueil {
	padding: 2px 2px 4px 8px;
	left:-8px;
	margin:-1px -1px -1px -5px;
	width:auto;
	line-height: 42px;
	height: 42px;
	border:0px;
	background-color: ;
	color: ;
	text-align:center;
	border-radius:2px 2px 0px 0px;
	/* display:block; */
}

div.pageTitleLogin {
	padding: 1px 1px 4px 8px;
	width:auto;
  line-height: 50px;
	height: 50px;
	border:0px;
	/* background-color: #bcb6b8; */
	color: black;
	text-align:center;
	display:block;
}
#lequipe div.pageTitleAccueil, #consignes div.pageTitleAccueil{
	margin:auto auto auto -4px;
	background: linear-gradient(to bottom, , transparent 60%, transparent);
	cursor: pointer;
}

div.separeCR, div.separeNdF {
	display: inline-block;
	margin: 2px 4px;
	width: 98%;
	border-top: 1px solid #bcb6b8;
}
.boutonplus {
	background-color:#49bd7a;
	/* -moz-border-radius:28px; */
	-webkit-border-radius:28px;
	border-radius:50%;
	border:1px solid #9dbfae;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	width:30px;
	height:30px;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:4px 8px;
	margin:0px 2px;
	text-decoration:none;
}
.boutonpluspetit {
	background-color:#49bd7a;
	/* -moz-border-radius:8px; */
	-webkit-border-radius:8px;
	border-radius:28%;
	border:1px solid #9dbfae;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	width:22px;
	height:22px;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:0px 1px 0px 0px;
	margin:0px 0px;
	text-decoration:none;
}
.boutonplus:hover, .boutonpluspetit:hover {
	background-color:#8bc7af;
}
.boutonplus:active, .boutonpluspetit:active {
	position:relative;
	top:1px;
}

.boutonmoins {
	background-color:#d16058;
	/* -moz-border-radius:28px; */
	-webkit-border-radius:28px;
	border-radius:50%;
	border:1px solid #f59696;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	width:30px;
	height:30px;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	padding:4px 8px;
	margin:0px 2px;
	text-decoration:none;
}
.boutonmoinspetit {
	background-color:#d16058;
	/* -moz-border-radius:8px; */
	-webkit-border-radius:8px;
	border-radius:28%;
	border:1px solid #f59696;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	width:22px;
	height:22px;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:0px 1px 10px 0px;
	margin:0px 0px;
	text-decoration:none;
}
.boutonmoins:hover, .boutonmoinspetit:hover {
	background-color:#f08888;
}
.boutonmoins:active, .boutonmoinspetit:active {
	position:relative;
	top:1px;
}

.boutondeclaratif{
	cursor:pointer;
	border-radius:2px 2px 2px 2px;
	background: #fffcfc;
	border:none;
	color:#555;
	font:bold 14px Verdana;
	padding:4px 4px 4px 4px;
	box-shadow:2px 2px 6px #999;
}
.boutondeclaratif:hover {
	background: #f4f2f2;
	box-shadow:inset 2px 2px 2px #999, inset -0.5px -0.5px 2px #999;
}
.boutondeclaratif:active {
	position:relative;
	top:1px;
	box-shadow:1px 1px 2px #999;
}

.boutonCal {
	color:#668;
	padding:8px 4px 8px 4px;
}


div.formbuttons {
	text-align: center;
	width:auto;
	height:auto;
	margin-left:5px;
	margin-right:5px;
	margin-top:15px;
	display:block;
	padding-top: 10px;
	padding-bottom: 10px;
	float:none;
}

.trait_haut {
	border-top: 1px solid #bcb6b8;
}


input.formButton {
	background:#E4E8E8 none repeat scroll 0 0;
	border-color:#CCCCAA #787674 #787674 #CCCCAA !important;
	border-style:solid !important;
	border-width:1px !important;
	border-radius: 4px;
	color:#222222 !important;
	font-size: 12px;
	font-weight:600 !important;
	min-width:75px;
	width: auto;
	cursor: default;
	padding: 2px 4px 2px;
}

.buttonFondClair{
	background:#F4E8E4 none repeat scroll 0 0 !important;
}
.buttonFondMoyen{
	background:#D4C8C4 none repeat scroll 0 0 !important;
}
.buttonFondFonce{
	background:#C8B4B4 none repeat scroll 0 0 !important;
}

.orange{
	background:#B48888 none repeat scroll 0 0 !important;
}
input.formButton:hover {
	background:#AAAEAE none repeat scroll 0 0;
	color:#EEEEEE !important;
	border-color: #7C7A78 #CCCCAA #CCCCAA #7C7A78 !important;
}

input.oui{
    background:#44AA66 none repeat scroll 0 0 !important;
}

input.non{
    background:#FE6262 none repeat scroll 0 0 !important;
}

input.valider{
	background:#00AA00 none repeat scroll 0 0 !important;
	color:#FFFFFF !important;
}

input.refuser{
	background:#BB0000 none repeat scroll 0 0 !important;
	color:#FFFFFF !important;
}

input.formInputRecherche{
	border-top: 0.5px solid #AAA;
	border-left: 0.5px solid #AAA;
	border-right: 0.5px solid #AAA;
	border-bottom: 1px solid #888;
}

input.formInputText{
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 1px solid #888888;
}

input.formInputText[readonly]{
	border-top-width: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #777;
	color : #777;
    background-color: #F2F2F2;
}

input.formInputDate{
	border-top-width: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #888888;
    color : #000;
    background-color: #FFF;
    /*
    position:relative;
    z-index:6;
    */
}

input.formInputDate:disabled{
	border-top-width: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px dotted #BBBBBB;
    color : #888;
    background-color: #FFF;
    /*
    position:relative;
    z-index:6;
    */
}

input.formInputDate[readonly] {
	border-top-width: 0px;
    border-left: 0px;
    border-right: 0px;
    border-bottom: 1px solid #777;
    color : #777;
    background-color: #F2F2F2;
    /*
    position:relative;
    z-index:6;
    */
}


input[read-only] {
    color : #777;
    background-color: #EEE;
}


form input[type="file"]:disabled{
    color : #BBB;
    background-color: #FAFAFA;
    /*
    position:relative;
    z-index:6;
    */
}

/*
form input[type="time"] {
  padding: 0px;
  margin: 0px;
  width: 94px;
}
*/

/* rajout pour faire passer devant le menu le datepicker (si pas inclus dans jquery-ui.css)
.ui-datepicker{ z-index: 2 !important;}*/

label {
	cursor: pointer;
}
input.dossiers[type=checkbox] {
	display: none;
}
input.dossiers[type=checkbox] + label:before {
	content: "";
	padding: 2px;
	display: block;
	border: 1px dotted #888888;
	width: 18px;
	height: 18px;
	background-color: #EEEEEE;
	border-radius: 4px;
}
input.dossiers[type=checkbox]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #44EE44;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}
input.categorie[type=checkbox] {
    display: none;
}
input.categorie[type=checkbox] + label:before {
	content: "";
	margin:2px 4px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 16px;
	height: 16px;
	vertical-align:bottom;
	background-color: #EEEEEE;
	border-radius: 4px;
}
input.categorie[type=checkbox]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #a8eaab;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}
input.petitecase[type=checkbox],input.petitecase[type=radio] {
	display: none;
}
input.petitecase[type=checkbox]+ label:before,input.petitecase[type=radio] + label:before {
	content: "";
	margin:2px 2px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 8px;
	height: 8px;
	vertical-align:middle;
	background-color: #F8F8F8;
	border-radius: 4px;
}
input.petitecase[type=checkbox]:checked + label:before,input.petitecase[type=radio]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #A8e2Ab;
	text-align: center;
	font-size: 8px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}

/*
* legende : style pour case à cocher qui sert de legende au tableau
*/
input.legende[type=checkbox] {
	display: none;
}
input.legendeverte[type=checkbox]+ label:before {
	content: "";
	margin:2px 4px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 20px;
	height: 12px;
	vertical-align:bottom;
	background-color: #88ea8b;
	border-radius: 4px;
	cursor:help;
}
input.legende[type=checkbox]+ label {
	cursor:help;
}
/*
* choixmultiplesV : style pour case à cocher verte
*/
input.choixmultiplesV[type=checkbox],input.choixmultiplesV[type=radio] {
	display: none;
}
input.choixmultiplesV[type=checkbox]+ label:before,input.choixmultiplesV[type=radio] + label:before {
	content: "";
	margin:2px 4px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 12px;
	height: 12px;
	vertical-align:bottom;
	background-color: #F8F8F8;
	border-radius: 4px;
}
input.choixmultiplesV[type=checkbox]:checked + label:before,input.choixmultiplesV[type=radio]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #88ea8b;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}
/*
* choixmultiplesO : style pour case à cocher orange
*/
input.choixmultiplesO[type=checkbox],input.choixmultiplesO[type=radio] {
	display: none;
}
input.choixmultiplesO[type=checkbox]+ label:before,input.choixmultiplesO[type=radio] + label:before {
	content: "";
	margin:2px 4px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 12px;
	height: 12px;
	vertical-align:bottom;
	background-color: #F8F8F8;
	border-radius: 4px;
}
input.choixmultiplesO[type=checkbox]:checked + label:before,input.choixmultiplesO[type=radio]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #F4E264;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}
/*
* choixmultiplesR : style pour case à cocher rouge
*/
input.choixmultiplesR[type=checkbox],input.choixmultiplesR[type=radio] {
	display: none;
}
input.choixmultiplesR[type=checkbox]+ label:before,input.choixmultiplesR[type=radio] + label:before {
	content: "";
	margin:2px 4px;
	padding: 2px;
	display: inline-block;
	border: 1px dotted #888888;
	width: 12px;
	height: 12px;
	vertical-align:bottom;
	background-color: #F8F8F8;
	border-radius: 4px;
}
input.choixmultiplesR[type=checkbox]:checked + label:before,input.choixmultiplesR[type=radio]:checked + label:before {
	content: "\2713";
	color: #ffffff;
	background-color: #ea888b;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	height: 1em;
	line-height: 1em;
}

div.requirednotice  {
	margin-left:12px;
	font-size: 13px;
}

span.required {
	color: red;
	font-size: 14px;
}

.tab {
	margin-left : 8em;
}

table.data-table {
	width: 98%;
	margin-left: auto;
	margin-right: auto;
	border: none;
	background-color:;
	border-collapse:separate;
	border-spacing:1px 1px;
	
}
table.data-table th{
	/* vertical | horizontal */
	/* haut | horizontal | bas */
	/* haut droite bas gauche */
	font-weight:normal;
	text-align: left;
	color :;
	padding:4px 4px 1px 4px;	
}

table.data-table td{
	/* vertical | horizontal */
	/* haut | horizontal | bas */
	/* haut droite bas gauche */
	padding:4px 4px 1px 4px;
	
}

table.visuCR {
	font-size:5px;
	/*pour centrer*/
	
	margin-left: auto;
	margin-right: auto;
	/*
	width: 1000px;
	*/
}

td.bordhaut{
	border-top:1px;
	border-top-color:#222222;
	border-top-style: dashed;
}
td.borddroit{
	border-right:1px;
	border-right-color:#222222;
	border-right-style: solid;
}
td.bordbas{
	border-bottom:1px;
	border-bottom-color:#222222;
	border-bottom-style: dashed;
}

.td0pad{
	padding:0px;
}
.td0space{
	border-spacing :0;
	border-collapse : collapse;
}


#titreTabListe
{
	font-family : Arial;
	font-size : 13px;
}

select.liste {
	/*resize:both;*/
	width: 164px;
	height: 64px;
}
.multipleSelect {
	width: 300px;
	height: 100px;
}


.joursCal { 
	font-size: 12px;
	color: #777;
}
.joursCalToday { 
	font-size: 15px;
	font-weight: bold;
}

.inline-block {
	display:inline-block;
}

.left { float: left; }
.right { float: right; }
.centre {
	float : left;
	margin-left:48%;
}
.txtLeft { text-align: left; }
.txtRight { text-align: right; }
.txtCenter { text-align: center; }

.trespetit { font-size: 10px; }
.petit { font-size: 11px; }
.petitplus { font-size: 12px; }
.moyen { font-size: 14px; }
.grand { font-size: 18px; }
.tresgrand { font-size: 24px; }
.txt50 { font-size: 50px; }

.horizCentrer { vertical-align: middle; }


.gras {	font-weight: bold; }
.italique { font-style: italic; }

.noDeco { text-decoration: none; }

.marge4 {margin:4px; }
.margetop4 {margin-top:4px; }
.margebot4 {margin-bottom:4px; }

.height0 { height: 0px;}/* pour rendre un ligne invisible */
.height2 { height: 2px;}
.height10 { height: 10px;}
.height20 { height: 20px;}
.height24 { height: 24px;}
.height40 { height: 40px;}
.height520 { height: 520px;}
.width10 { width: 10px; }
.width12 { width: 12px; }
.width15 { width: 15px; }
.width20 { width: 20px; }
.width22 { width: 22px; }
.width24 { width: 24px; }
.width28 { width: 28px; }
.width40 { width: 40px; }
.width42 { width: 42px; }
.width50 { width: 50px; }
.width60 { width: 60px; }
.width70 { width: 70px; }
.width100 { width: 100px; }
.width120 { width: 120px; }
.width150 { width: 150px; }
.width176 { width: 176px; }
.width200 { width: 200px; }
.width220 { width: 220px; }
.width240 { width: 240px; }
.width250 { width: 250px; }
.width260 { width: 260px; }
.width280 { width: 280px; }
.width300 { width: 300px; }
.width350 { width: 350px; }
.width400 { width: 400px; }
.width440 { width: 440px; }
.width500 { width: 500px; }
.width520 { width: 520px; }
.width600 { width: 600px; }
.width620 { width: 620px; }
.width700 { width: 700px; }
.width800 { width: 800px; }
.width840 { width: 840px; }
.width880 { width: 880px; }
.width900 { width: 900px; }
.width920 { width: 920px; }
.width1000 { width: 1000px; }
.width1200 { width: 1200px; }
.width15p { width: 15%; }
.width50p { width: 50%; }
.width70p { width: 70%; }
.width80p { width: 80%; }
.width90p { width: 90%; }
.width95p { width: 95%; }
.width98p { width: 98%; }
.width100p { width: 100%; }
.minwidth250 { min-width: 250px; }
.auto400-600 { 
	width: auto; 
	min-width:400px;
	max-width:600px;
}
.auto500-800 { 
	width: auto; 
	min-width:500px;
	max-width:800px;
}
.auto600-1000 { 
	width: auto; 
	min-width:600px;
	max-width:1000px;
}
.auto1000-1280 { 
	width: auto; 
	min-width:1000px;
	max-width:1280px;
}
.auto1000-1420 { 
	width: auto; 
	min-width:1000px;
	max-width:1420px;
}

.vert { color: green; }
.vertclair { color: lightgreen; }
.rouge { color: red; }
.rougeclair { color: #FF8888; }
.grisclair { color: lightgrey; }
.gris { color: grey; }

.noir { color: black; }
.backvert { background-color: lightgreen; }
.backrouge { background-color: #FF6868; }
.backrougeclair { background-color: #FFA0A0; }
.backorange { background-color: #E2BC74; }
.ligneclaire { background-color: #ffffff; }
.lignefoncee { background-color: #f2f0f0; }
.beige { background-color: #fBEFEA; }
.orangeClair { background-color: #ffDFD1; }
.backvertclair { background-color: #C4FDD1 !important; }
.jauneClair { background-color: #f2f5cf; }
.fondGrisClair { background-color: #EEE; }
.fondGris { background-color: #DDD; }

input.disabled, input.disabled+label, select.disabled, textarea.disabled{
	pointer-events: none;
	/* cursor: not-allowed; */ /* Ne fonctionne pas avec pointer-events: none; qui désactive tout clic de souris donc il faut le mettre sur un parent avec un span*/
	/*-moz-appearance: treeview;
	-webkit-appearance: none;
	appearance: none;
	border: 1px solid;*/
	color: #444; 
	opacity: 0.6;
}
span.disabled {
	cursor: not-allowed;
	display: inline-block; /* permet d'être taillé */
	width:20px; /* permet d'être au maximum à la taille de l'élément qu'il contient */
}
span.disabled input, span.disabled input+label,span.disabled select {
	pointer-events: none;
	color: #444; 
	background:#FFFFFF !important;
	opacity: 0.2;
}


/* Display Leave Calendar */
.style2 {font-size: 12px; }
.lienNoDeco {
	text-decoration: none;
	/*color: blue;*/
}
/* a {
	cursor: pointer;
} */
a, a img {
	text-decoration: none;
	border: none;
}
a svg {
	color:#888;
}
.present { background-color: #228822; }
.absent { background-color: #CC0033; }
.absent_demi { background-color: #FFCC33; }
.weekend { background-color: #CECECE; }
.ferie { background-color: #DCE8EB; }
.infobulle{
	position: absolute;	
	visibility : hidden;
	border: 1px solid Black;
	padding: 4px;
	font-family: Verdana, Arial;
	font-size: 11px;
	font-weight: bold;
	background-color: #FFFFCC;
	z-index:999;
}
/* end calendar */

/* Autocompletion */
.update{
	position:absolute;
	width:150px;
	background-color:white;
	border:1px solid #888;
	margin:0px;
	padding:0px;
	text-align: left;
}

.imageUtil {
	width: 32px;
	border: none;
}
.util {
	font-weight:bold;
	font-size:12px;
	margin:0px;
	padding:0px;
	text-align: left;
}


#miniFicheUtil {
	margin:0px;
	padding:0px;
	width: 100%;
	text-align: left;
	border-bottom: 1px solid black;
	font-size:13px;
}

#miniFicheUtil:hover {
	background-color: #ffb;
	cursor: pointer;	
}

.autocompleteInput {
	width: 150px;
}

/** fin autocompletion **/

/* pour coloriser les datepickers */
.Highlighted a{
   background-color : Green !important;
   background-image :none !important;
   color: White !important;
   font-weight:bold !important;
   font-size: 12pt;
}

#espaceImpress, .impress{
	display: none;
}

#chargement {
	position : fixed;
	z-index: 9999;
	background : url('../images/charge.png') 50% 48% no-repeat;
	top : 0px;
	left : 0px;
	height : 100%;
	width : 100%;
	cursor : wait;
}
#chargement::after {
	position : fixed;
	content:'Chargement...';
	font-weight:500;
	color:#FF2020;
	top : 42%;
	left : 42%;
	height : 100px;
	width : 240px;
	background-color:rgba(200,200,200,0.64);
} 

.au-dessus {
	display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Header */
.au-dessus-header {
    padding: 2px 16px;
    background-color: #5cb85c;
    color: white;
}

/* Modal Body */
.au-dessus-body {padding: 2px 16px;}

/* Modal Footer */
.au-dessus-footer {
    padding: 2px 16px;
    background-color: #5cb85c;
    color: white;
}
/* Modal Content */
.au-dessus-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    animation-name: animatetop;
    animation-duration: 0.4s
}

/* Add Animation */
@keyframes animatetop {
    from {top: -300px; opacity: 0}
    to {top: 0; opacity: 1}
}

.show {
	display: inline-block;
}
.hide {
	display: none;
}
.collapse{
	visibility:collapse;
}

.black_overlay {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.64;
  opacity: .64;
  filter: alpha(opacity=64);
	cursor: disabled;
}
.white_content {
  display: none;
  position: absolute;
  top: 20%;
  left: 25%;
  width: 50%;
  height: auto;
  padding:0px;
  /* border: 1px solid rgb(180,180,180); */
	/* border-radius: 4px; */
  background-color: white;
  z-index: 1002;
}

mark {
  background-color: #20B7D4;
  color: black;
}

.pie {
  width: 100px; height: 100px;
  border-radius: 50%;
  background: conic-gradient(#655 40%, yellowgreen 0);
}

 .autocomplete-wrapper {
  position: relative;
  display: inline-block;
  width: 200px;
}
.autocomplete-list {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: white;
  border: 1px solid #ccc;
  max-height: 150px;
  overflow-y: auto;
  z-index: 1000;
}
.autocomplete-item {
  padding: 8px 10px;
  cursor: pointer;
}
.autocomplete-item:hover {
  background-color: #f0f0f0;
}

/*
.tuiles-accueil {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  margin-bottom: 32px;
}
*/
.tuile-fonction {
  background: ;
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08), 0 1.5px 4px rgba(0,0,0,0.06);
  padding: 32px 24px 20px 24px;
  min-width: 180px;
  max-width: 220px;
  text-align: center;
  transition: transform 0.15s, box-shadow 0.15s;
  cursor: pointer;
  position: relative;
  color: ;
}
.tuile-fonction:hover {
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 8px 24px rgba(0,0,0,0.13), 0 2px 8px rgba(0,0,0,0.09);
}
.tuile-fonction .icone-tuile {
  font-size: 2.5em;
  margin-bottom: 12px;
  color: ;
}
.tuile-fonction .titre-tuile {
  font-size: 1.2em;
  font-weight: bold;
  color: ;
  margin-bottom: 6px;
}
/*
@media (max-width: 700px) {
  .tuiles-accueil {
    flex-direction: column;
    align-items: center;
  }
  .tuile-fonction {
    width: 90%;
    min-width: unset;
    max-width: unset;
  }
}
*/

.accueil-container {
    display: flex;
    gap: 0.5rem;
    max-width: 1400px;
    margin: 1rem auto;
    padding: 0 2rem;
    justify-content: center;
    flex-wrap: nowrap;
}

.accueil-tuiles {
    flex: 0 0 55%;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.accueil-tuiles > a:first-child {
    width: 50%;
    max-width: 300px;
    margin: 0.8rem auto 0.8rem auto;
}

.tuiles-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.48rem;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}

.accueil-info {
    flex: 0 0 45%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.accueil-section {
    background: var(--couleurBackDiv);
    border-radius: 8px;
    padding: 1rem;
}

.accueil-section h2 {
    color: var(--couleurTexteDiv);
    margin: 0 0 1rem 0;
    font-size: 1.2rem;
}

.accueil-section-content {
    background: white;
    border-radius: 4px;
    padding: 1rem;
}

.accueil-bienvenue {
    text-align: center;
    margin-bottom: 2rem;
}

.accueil-bienvenue h1 {
    color: var(--couleurTexteDiv);
    margin: 1rem;
    font-size: 2rem;
}

.accueil-date {
    color: var(--couleurTexteDiv);
    font-size: 1.1rem;
    margin-top: 1.2rem;
}

/* Responsive */
@media screen and (max-width: 992px) {
    .accueil-container {
        flex-wrap: wrap;
        margin: 0.5rem auto;
        padding: 0 1rem;
    }
    
    .accueil-tuiles,
    .accueil-info {
        flex: 0 0 100%;
    }
    
    .accueil-tuiles {
        margin-bottom: 0.25rem;
    }
    
    .accueil-tuiles > a:first-child {
        max-width: 250px;
    }
    
    .tuiles-grid {
        max-width: 500px;
    }
}